/* Fluid layouts for phones, tablets and compact windows. */
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
.container, .hero-copy, .about-copy, .method-copy, .contact-copy,
.practice-card, .field, .field-row, .contact-form { min-width:0; }
main p, main h1, main h2, main h3, blockquote, .form-note,
#form-status, .principles span { overflow-wrap:break-word; }
.field input, .field textarea { min-width:0; max-width:100%; }
.floating-contact {
  right:max(20px,env(safe-area-inset-right));
  bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));
}

@media (max-width:1199px) {
  :root { --page-gutter:max(clamp(20px,3vw,36px),env(safe-area-inset-left),env(safe-area-inset-right)); }
  .container { width:calc(100% - var(--page-gutter) * 2); }
  .about, .method, .contact { padding-block:clamp(64px,8vw,96px); }
  .practice { padding-top:clamp(64px,8vw,96px); }
  .about-grid, .method-grid {
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:clamp(32px,4vw,56px);
  }
  .about-copy h2, .method-copy h2, .contact-copy h2 { font-size:clamp(36px,4.1vw,48px); }
  .photo-frame img { height:auto; aspect-ratio:4/5; object-position:50% 25%; }
  .method-photo img { height:auto; aspect-ratio:2/3; object-position:50% 30%; }
  .practice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
  .practice-card { padding:30px; }
  .practice-card h3 { font-size:26px; line-height:1.35; }
  .practice-card h3 br { display:none; }
  .practice-card p { font-size:16px; line-height:1.75; }
  .card-top { margin-bottom:26px; }
  .section-heading { gap:36px; }
  .section-heading > div, .section-heading p { flex:1; min-width:0; }
  .section-heading h2 { font-size:clamp(36px,4vw,46px); }
  .contact-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; }
  .contact-form { padding:28px; }
  .field-row { grid-template-columns:minmax(0,1fr); gap:0; }
  .field input, .field textarea { font-size:16px; }
  .field label { font-size:14px; }
  .submit-button { font-size:14px; line-height:1.5; padding:16px 20px; }
  .form-note { font-size:12px; }
  .footer-top { gap:24px; }
}

@media (max-width:1023px) {
  html { scroll-padding-top:24px; }
  .site-header { position:relative; padding-top:max(12px,env(safe-area-inset-top)); }
  .header-inner { min-height:82px; padding:10px 20px; border-radius:22px; }
  .header-inner .brand { width:166px; }
  .menu-toggle {
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:7px; width:46px; height:46px; padding:0; flex-shrink:0;
    color:#fff; background:#ffffff05; border:1px solid #ffffff30; border-radius:14px;
  }
  .menu-toggle span { display:block; width:19px; height:1px; background:currentColor; transition:transform .2s; }
  .menu-toggle[aria-expanded=true] span:first-child { transform:translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded=true] span:last-child { transform:translateY(-4px) rotate(-45deg); }
  .site-header nav {
    display:none; position:absolute; inset:auto 0 auto 0; top:calc(100% + 10px);
    flex-direction:column; align-items:stretch; gap:4px; padding:16px;
    max-height:calc(100vh - 120px); max-height:calc(100svh - 120px);
    overflow-y:auto; overscroll-behavior:contain;
    border:1px solid #ffffff26; border-radius:22px;
    background:linear-gradient(135deg,#0B252Ff5,#0B252Ff9);
    -webkit-backdrop-filter:blur(24px) saturate(145%);
    backdrop-filter:blur(24px) saturate(145%);
    box-shadow:0 18px 40px #0005; font-size:16px;
  }
  .site-header nav.open { display:flex; }
  .site-header nav a { padding:13px 16px; min-height:48px; border-radius:12px; line-height:1.5; }
  .site-header nav .nav-contact { text-align:center; margin-top:6px; border-radius:999px; }
  .hero-inner { min-height:640px; padding-top:52px; padding-bottom:58px; }
  .hero-copy { width:56%; max-width:none; }
  h1 { font-size:clamp(40px,5.2vw,53px); line-height:1.14; letter-spacing:-1.3px; }
  .desktop-break { display:none; }
  .hero-copy > p { max-width:390px; font-size:16px; }
  .hero-portrait { top:0; bottom:76px; width:62%; height:auto; }
  .hero-portrait img { width:100%; height:100%; margin-left:0; object-position:50% 8%; }
  .hero-values { flex-wrap:wrap; flex-direction:row; gap:12px 18px; font-size:13px; }
  .hero .button { min-height:54px; padding:15px 22px; font-size:14px; }
  .eyebrow { font-size:12px; letter-spacing:1.6px; }
  .portrait-signature { display:none; }
  .section-light p, .section-heading p { font-size:16px; }
  .about-copy .intro { font-size:19px; }
  .about-copy blockquote { font-size:22px; padding-left:18px; }
  .about-copy blockquote br { display:none; }
  .principles > div { font-size:15px; padding-block:14px; line-height:1.5; gap:12px; }
  .method-caption { padding:70px 24px 26px; font-size:24px; }
  .contact-grid { grid-template-columns:minmax(0,1fr); gap:36px; max-width:680px; }
  .contact-copy h2 br { display:none; }
  .contact-copy > p { max-width:none; font-size:16px; }
  .contact-details { margin-top:25px; font-size:14px; }
  .field-row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .contact-form { padding:32px; }
  .footer-top p, .back-top { font-size:13px; }
  .back-top { min-height:44px; display:inline-flex; align-items:center; }
  .text-link { min-height:44px; }
}

@media (max-width:767px) {
  .container { max-width:600px; }
  .header-inner { min-height:76px; padding:10px 16px; }
  .header-inner .brand { width:154px; }
  /* The image now occupies its own row instead of a fixed blank spacer. */
  .hero { display:grid; grid-template-columns:minmax(0,1fr); }
  .hero-inner {
    grid-column:1; grid-row:1; position:relative; z-index:1;
    display:block; min-height:0; padding-top:38px; padding-bottom:24px;
  }
  .hero-copy { width:100%; max-width:none; }
  h1 { max-width:580px; font-size:clamp(35px,7.5vw,50px); line-height:1.15; letter-spacing:-1.1px; margin-bottom:22px; }
  .hero-copy > p { max-width:490px; font-size:16px; line-height:1.75; margin-bottom:24px; }
  .hero .eyebrow { margin-bottom:22px; font-size:12px; letter-spacing:1.3px; }
  .hero .button { max-width:100%; padding:15px 23px; font-size:14px; min-height:54px; }
  .hero-values { flex-wrap:wrap; gap:10px 20px; margin-top:24px; font-size:12px; }
  .hero-values svg { width:17px; height:17px; }
  .hero-portrait {
    grid-row:2; grid-column:1; position:relative; inset:auto;
    width:100%; max-width:540px; height:clamp(360px,108vw,560px);
    margin:-10px auto 0; z-index:0; background:#0B252F; overflow:hidden;
  }
  .hero-portrait img {
    width:100%; max-width:none; height:100%; margin:0 auto;
    object-fit:cover; object-position:50% 10%;
    -webkit-mask-image:none; mask-image:none;
  }
  .hero-portrait:after {
    background:linear-gradient(180deg,#0B252F 0%,transparent 15%,transparent 65%,#0B252F 100%),linear-gradient(90deg,#0B252F 0%,transparent 14%,transparent 86%,#0B252F 100%);
  }
  .portrait-signature {
    display:flex; position:relative; inset:auto; grid-row:2; grid-column:1;
    align-self:end; justify-self:end; z-index:1; width:fit-content;
    margin:0 max(var(--page-gutter),calc((100% - 480px)/2)) 38px 0;
    padding-left:15px;
  }
  .portrait-signature span { font-size:23px; }
  .portrait-signature small { font-size:11px; }
  .hero-bottom { grid-row:3; grid-column:1; }
  .hero-bottom > .container { min-height:66px; padding-block:16px; text-align:center; justify-content:center; font-size:12px; line-height:1.6; }
  .hero-bottom > .container > span { max-width:100%; }
  .hero-bottom a { display:none; }
  .about, .method, .contact { padding-block:64px; }
  .about-grid, .method-grid { grid-template-columns:minmax(0,1fr); gap:38px; }
  .about-visual { width:100%; max-width:440px; margin-inline:auto; padding:0 12px 15px 0; }
  .photo-frame:before { inset:15px -12px -15px 12px; }
  .photo-frame img { height:auto; aspect-ratio:4/5; object-position:50% 25%; }
  .photo-caption { right:12px; bottom:15px; padding:55px 24px 24px; }
  .photo-caption span { font-size:25px; }
  .photo-caption small { font-size:11px; }
  .about-copy h2, .method-copy h2, .contact-copy h2, .section-heading h2 {
    max-width:none; font-size:clamp(32px,7vw,42px); line-height:1.2; letter-spacing:-.9px;
  }
  .method-copy h2 br { display:none; }
  .section-light p { font-size:16px; line-height:1.8; }
  .about-copy .intro { font-size:19px; }
  .about-copy blockquote { font-size:22px; }
  .practice { padding-top:64px; }
  .section-heading { display:block; margin-bottom:30px; }
  .section-heading h2 { margin-bottom:21px; }
  .section-heading p { max-width:none; font-size:16px; }
  .practice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .practice-card { padding:25px; border-radius:22px; }
  .practice-card h3 { font-size:24px; }
  .card-top { margin-bottom:23px; }
  .practice-bottom { flex-direction:column; align-items:flex-start; gap:12px; margin-top:26px; padding:24px 0 30px; }
  .practice-bottom > span { font-size:13px; }
  .principles { margin-top:25px; }
  .principles > div { font-size:15px; min-height:62px; }
  .method-photo { width:100%; max-width:440px; margin-inline:auto; border-radius:25px; }
  .method-photo img { height:auto; aspect-ratio:4/5; object-position:50% 32%; }
  .method-caption { font-size:24px; padding:75px 25px 28px; }
  .contact-grid { gap:30px; }
  .contact-copy h2 br { display:none; }
  .contact-form { padding:26px; }
  .field-row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .field label { font-size:14px; }
  .field input, .field textarea { font-size:16px; min-height:52px; padding:13px; }
  .field textarea { min-height:140px; }
  .submit-button { font-size:14px; text-transform:none; line-height:1.5; gap:10px; }
  .form-note { font-size:12px; line-height:1.65; }
  .footer-top { flex-direction:column; align-items:center; text-align:center; gap:20px; padding:38px 0 24px; }
  .footer-top .brand { width:176px; }
  .footer-top p { font-size:13px; }
  .back-top { margin:0; }
  .footer-wordmark { font-size:10vw; padding-bottom:calc(38px + env(safe-area-inset-bottom)); }
  .floating-contact { width:50px; height:50px; padding:12px; right:max(14px,env(safe-area-inset-right)); bottom:max(14px,calc(env(safe-area-inset-bottom) + 10px)); }
  .floating-contact:hover span { display:none; }
  body:has(.contact-form :focus) .floating-contact { visibility:hidden; }
}

@media (max-width:559px) {
  .practice-grid { grid-template-columns:minmax(0,1fr); }
  .practice-card { padding:26px; }
  .field-row { grid-template-columns:minmax(0,1fr); gap:0; }
  .hero .button { width:100%; }
  .contact-form { padding:24px 20px; }
}

@media (max-width:359px) {
  :root { --page-gutter:max(16px,env(safe-area-inset-left),env(safe-area-inset-right)); }
  .header-inner { padding-inline:12px; }
  .header-inner .brand { width:139px; }
  .hero-inner { padding-top:30px; }
  h1 { font-size:34px; }
  .hero .eyebrow { font-size:11px; letter-spacing:1px; gap:8px; }
  .hero-values { flex-direction:column; gap:10px; }
  .hero .button { font-size:13px; padding-inline:14px; }
  .practice-card { padding:23px; }
  .contact-form { padding:22px 16px; }
  .submit-button { font-size:13px; padding-inline:12px; }
}

@media (max-width:1023px) and (orientation:landscape) and (max-height:600px) {
  .hero-inner { padding-top:32px; padding-bottom:32px; }
  .site-header nav { max-height:calc(100svh - 118px); }
  .about, .method, .contact { padding-block:52px; }
}
@media (hover:none) and (pointer:coarse) {
  .button:hover { transform:none; }
}
