:root{
    --bg:#fafaf8;
    --ink:#17181d;
    --surface:#f0efeb;
    --surface-2:#e2ded5;
    --hairline:#dedad2;
    --parchment:#17181d;
    --muted:#6b6f73;
    --brass:#25314a;
    --brass-light:#1a2233;
    --dark:#25314a;
    --champagne:#e2d2b0;
  }

  /* Accent (--brass) is the brandbook's dark navy, same value as --dark.
     On dark-background containers, redefine the accent variable itself to
     champagne - navy-on-navy has no contrast at all against dark sections.
     Every existing and future var(--brass)/var(--brass-light) usage inside
     these containers inherits champagne automatically via CSS custom
     property cascade, without needing every individual rule fixed by hand. */
  .hero-dark, .closing, footer, .consult-modal, body.nav-open header{
    --brass:var(--champagne);
    --brass-light:var(--champagne);
  }

  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  button,[role="button"]{cursor:pointer;}
  body{
    position:relative;
    background:var(--bg);
    color:var(--parchment);
    font-family:'Inter',-apple-system,'Segoe UI',sans-serif;
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overscroll-behavior:none;
  }
  header,main,footer{position:relative;z-index:1;}
  @media (prefers-reduced-motion:no-preference){
    .reveal{
      opacity:0;transform:translateY(56px) scale(.92) rotate(-3.5deg);
      transition:opacity .8s cubic-bezier(.16,1,.3,1),transform 1.05s cubic-bezier(.2,1.5,.3,1);
    }
    .reveal:nth-child(even){transform:translateY(56px) scale(.92) rotate(3.5deg);}
    .reveal.in{opacity:1;transform:none;}
  }
  h1,h2{
    font-family:'Spectral',Georgia,serif;
    font-weight:300;
    letter-spacing:-.015em;
    margin:0;
    text-wrap:balance;
  }
  h3{
    font-family:'Montserrat',Arial,sans-serif;
    font-weight:700;
    margin:0;
    text-wrap:balance;
  }
  a{color:var(--brass);text-decoration:none;}
  a:hover{color:var(--ink);}
  .wrap{max-width:1080px;margin:0 auto;padding:0 32px;}
  .label{
    font-family:'Inter',sans-serif;
    font-size:12.5px;
    font-weight:600;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--brass-light);
  }
  .muted{color:var(--muted);}
  .hairline{border:none;border-top:1px solid var(--hairline);margin:0;}

  /* ---- nav ---- */
  /* The header is pinned with position:STICKY, not fixed - deliberately.
     Telegram's in-app browser (and other WebView wrappers) translate the whole
     page while collapsing their own toolbar during scroll, and position:fixed
     elements are re-pinned a frame LATE - the header visibly detached and page
     content rendered above it (confirmed by user screenshot). Forcing a GPU
     layer didn't help because the lag is in the WebView, not the compositing.
     Sticky elements are positioned by the scroll engine itself as part of
     scroll geometry, so they cannot lag behind the scroll - this is the one
     robust cure for that bug class.
     The 0-height sticky wrapper keeps the layout identical to fixed: the header
     overflows the wrapper downward and takes no flow space, so the hero still
     starts at the very top of the page underneath it. */
  .hdr-pin{
    position:-webkit-sticky;position:sticky;top:0;
    height:0;z-index:70;
  }
  header{
    position:relative;
    background:transparent;border-bottom:1px solid transparent;
    transition:background .35s ease,border-color .35s ease,backdrop-filter .35s ease;
  }
  /* secondary safety net: if anything above the header is ever exposed for a
     frame regardless, this shows header's own background there, not something
     unrelated. */
  header::before{
    content:'';position:absolute;left:0;right:0;top:-100vh;height:100vh;
    background:var(--dark);pointer-events:none;
  }
  header.scrolled{
    background:rgba(250,250,248,.92);backdrop-filter:blur(6px);
    border-bottom-color:var(--hairline);
  }
  header.scrolled::before{background:var(--bg);}
  section[id]{scroll-margin-top:88px;}
  nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:26px 40px;gap:24px;flex-wrap:wrap;
    position:relative;transition:padding .35s ease;
  }
  header.scrolled nav{padding-top:15px;padding-bottom:15px;}
  .brand{display:flex;align-items:center;gap:12px;}
  .footer-cols .brand{flex-direction:column;align-items:flex-start;}
  .logo-mark{width:38px;height:38px;flex:none;color:#fff;transition:color .35s ease,width .35s ease,height .35s ease;}
  header.scrolled .logo-mark{color:var(--brass);width:32px;height:32px;}
  .logo-mono{
    font-family:'Spectral',Georgia,serif;font-weight:500;
    font-size:26px;line-height:1;flex:none;color:#fff;
    display:flex;align-items:baseline;
    transition:color .35s ease,font-size .35s ease;
  }
  header.scrolled .logo-mono{color:var(--parchment);font-size:22px;}
  .logo-mono .dot{
    display:inline-block;width:.16em;height:.16em;border-radius:50%;
    background:#a8863f;margin:0 .09em .05em;align-self:flex-end;
  }
  .wordmark{
    font-family:'Montserrat',sans-serif;
    font-size:16px;letter-spacing:.06em;
    text-transform:uppercase;line-height:1.25;color:#fff;
    transition:color .35s ease,font-size .35s ease;
  }
  header.scrolled .wordmark{color:var(--parchment);font-size:13.5px;}
  .wordmark b{display:block;font-weight:600;}
  .wordmark-serif{
    font-family:'Spectral',Georgia,serif;font-weight:400;
    font-size:19px;letter-spacing:.22em;
    text-transform:uppercase;line-height:1;color:#fff;flex:none;
    transition:color .35s ease,font-size .35s ease;
  }
  header.scrolled .wordmark-serif{color:var(--parchment);font-size:16px;}
  .nav-toggle{display:none;}
  .nav-panel{display:flex;align-items:center;justify-content:space-between;gap:24px;flex:1;}
  .nav-panel > div{display:contents;}
  .nav-msg{display:flex;align-items:center;gap:10px;flex:none;}
  .navlinks{display:flex;gap:28px;flex-wrap:wrap;margin-left:64px;}
  .navlinks a{
    font-family:'Spectral',Georgia,serif;font-weight:400;
    font-size:16px;color:rgba(255,255,255,.88);letter-spacing:.055em;
    display:inline-block;transform-origin:center;
    transition:color .35s ease,font-size .35s ease,transform .4s cubic-bezier(.16,1,.3,1);
  }
  header.scrolled .navlinks a{color:var(--muted);font-size:15px;}
  .navlinks a:hover{color:#fff;transform:scale(1.1);}
  header.scrolled .navlinks a:hover{color:var(--parchment);}
  .navphone{font-size:14px;color:var(--brass-light);white-space:nowrap;}
  header .msg-btn{border-color:rgba(255,255,255,.6);color:#fff;transition:border-color .35s ease,color .35s ease,width .35s ease,height .35s ease;}
  header.scrolled .msg-btn{border-color:var(--brass);color:var(--brass);}

  /* ---- article heading pattern ---- */
  /* one spacing scale everywhere: 104 between sections, 44 heading→content, 24 heading→lede */
  .article-head{
    display:flex;align-items:baseline;gap:18px;margin-bottom:44px;
  }
  .article-head + .juris-lede{margin-top:-20px;}
  .article-mark{flex:none;display:flex;align-items:center;color:var(--brass);align-self:center;margin-top:-6px;}
  .article-mark svg{display:block;overflow:visible;transform-origin:50% 50%;animation:markSpin 7s linear infinite;}
  @keyframes markSpin{ to{ transform:rotate(360deg); } }
  @media (prefers-reduced-motion:reduce){
    .article-mark svg{animation:none;}
  }
  .article-num{
    font-family:'Inter',sans-serif;font-weight:600;
    font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
    color:var(--brass);white-space:nowrap;
  }
  .article-head h2{font-size:clamp(28px,3.6vw,40px);line-height:1.1;}
  .article-rule{flex:1;height:1px;background:var(--hairline);align-self:center;}

  html{overflow-x:hidden;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--brass) var(--surface);background:var(--dark);overscroll-behavior:none;}
  /* in-app browsers (Telegram/WKWebView) ignore overscroll-behavior, so the
     rubber-band bounce exposes the html underlay there. Match it to what's on
     screen: dark at the hero and near the dark footer, light in between - JS
     toggles the class in the same handler that drives header.scrolled. */
  html.page-light{background:var(--bg);}
  ::-webkit-scrollbar{width:11px;}
  ::-webkit-scrollbar-track{background:var(--surface);}
  ::-webkit-scrollbar-thumb{
    background:var(--brass);border-radius:99px;
    border:3px solid var(--surface);background-clip:padding-box;
  }
  ::-webkit-scrollbar-thumb:hover{background:var(--brass-light);background-clip:padding-box;}
  section{padding:208px 0;}
  section.band{background:var(--surface);}
  .band .person{background:var(--bg);}
  .band .testi-card .t-avatar{background-color:var(--surface-2);background-image:var(--thumb-src,none),linear-gradient(160deg,var(--bg),var(--surface-2));}

  /* ---- client journey ---- */
  .journey{border-top:1px solid var(--hairline);}
  .journey-step{
    display:grid;grid-template-columns:56px 1fr;gap:28px;
    padding:30px 0;border-bottom:1px solid var(--hairline);
  }
  .journey-step > div{min-width:0;}
  .journey-num{
    width:52px;height:52px;border-radius:50%;border:1px solid var(--brass);
    color:var(--brass);font-family:'Spectral',Georgia,serif;font-size:18px;font-weight:600;letter-spacing:.03em;
    display:flex;align-items:center;justify-content:center;
  }
  .journey-step h3{font-size:20px;color:var(--parchment);margin-bottom:8px;font-weight:600;}
  .journey-step p{color:var(--muted);font-size:15px;max-width:82ch;margin:0;line-height:1.6;}
  .band .avatar{background-color:var(--surface-2);background-image:var(--thumb-src,none),linear-gradient(160deg,var(--surface),var(--surface-2));}
  .band .practice-icon{background:var(--bg);}

  /* ---- hero ---- */
  .hero{padding:88px 0 96px;position:relative;}
  .hero-grid{
    display:grid;grid-template-columns:1.5fr 1fr;gap:64px;align-items:start;
    position:relative;
  }
  .eyebrow{margin-bottom:22px;}
  .hero h1,.hero h2{
    font-size:clamp(34px,4.9vw,60px);
    font-weight:300;
    line-height:1.14;
    letter-spacing:-.015em;
    color:var(--parchment);
    margin-bottom:26px;
  }
  .hero h1 em,.hero h2 em{color:var(--champagne);font-style:italic;}
  .hero p.lede{
    font-family:'Spectral',Georgia,serif;font-weight:400;
    font-size:20px;line-height:1.5;color:var(--muted);max-width:52ch;margin-bottom:34px;
  }
  .cta-row{display:flex;flex-direction:column;align-items:flex-start;gap:26px;flex-wrap:wrap;}

  /* ---- hero-dark (full-bleed photo slider) ---- */
  .hero-dark{background:var(--dark);overflow:hidden;position:relative;padding:0;}
  .hero-slides{position:relative;min-height:100vh;min-height:100dvh;}
  .hero-slide{
    position:absolute;inset:0;overflow:hidden;
    display:flex;align-items:center;
    padding:96px 0;
    opacity:0;visibility:hidden;
    transition:opacity .9s ease,visibility 0s linear .9s;
  }
  .hero-slide.is-active{opacity:1;visibility:visible;transition:opacity .9s ease;}
  /* one continuous video plays behind every slide - only the text content above
     it cross-fades between slides now, the background never cuts or restarts */
  .hero-video-bg{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--dark);}
  .hero-video-bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
  .hero-video-overlay{
    position:absolute;inset:0;
    background:linear-gradient(100deg, rgba(10,14,18,.86) 0%, rgba(10,14,18,.56) 42%, rgba(10,14,18,.24) 78%);
  }
  .hero-inner{position:relative;z-index:1;width:100%;max-width:1320px;}
  .hero-dark .eyebrow{color:var(--champagne);text-shadow:0 1px 8px rgba(0,0,0,.4);}
  .hero-dark h1,.hero-dark h2{color:var(--bg);max-width:1220px;margin-top:18px;text-shadow:0 2px 14px rgba(0,0,0,.35);}
  .hero-dark p.lede{color:rgba(250,250,248,.68);}

  /* ---- hero opening animation ---- */
  .hero-slide .eyebrow,
  .hero-slide p.lede,
  .hero-slide p.description,
  .hero-slide .chevron-link,
  .hero-slide .cta-row,
  .hero-slide .arrow-link{
    opacity:0;transform:translateY(36px);
    transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1);
  }
  .hero-slide h1,.hero-slide h2{
    clip-path:inset(0 0 101% 0);
    transition:clip-path 1.15s cubic-bezier(.16,1,.3,1);
  }
  .hero-slide.is-active .eyebrow{transition-delay:.08s;}
  .hero-slide.is-active h1,.hero-slide.is-active h2{transition-delay:.2s;}
  .hero-slide.is-active p.lede,
  .hero-slide.is-active p.description{transition-delay:.42s;}
  .hero-slide.is-active .chevron-link{transition-delay:.54s;}
  .hero-slide.is-active .cta-row,
  .hero-slide.is-active .arrow-link{transition-delay:.66s;}
  .hero-loaded .hero-slide.is-active .eyebrow,
  .hero-loaded .hero-slide.is-active p.lede,
  .hero-loaded .hero-slide.is-active p.description,
  .hero-loaded .hero-slide.is-active .chevron-link,
  .hero-loaded .hero-slide.is-active .cta-row,
  .hero-loaded .hero-slide.is-active .arrow-link{
    opacity:1;transform:none;
  }
  .hero-loaded .hero-slide.is-active h1,.hero-loaded .hero-slide.is-active h2{
    clip-path:inset(0 0 0% 0);
  }
  @media (prefers-reduced-motion:reduce){
    .hero-slide .eyebrow,.hero-slide p.lede,.hero-slide p.description,.hero-slide .chevron-link,.hero-slide .cta-row,.hero-slide .arrow-link{
      opacity:1;transform:none;transition:none;
    }
    .hero-slide h1,.hero-slide h2{clip-path:none;transition:none;}
  }
  .hero-dark p.description{
    font-family:'Inter',sans-serif;font-weight:400;font-size:16px;line-height:1.6;
    color:rgba(255,255,255,.82);max-width:1000px;margin-bottom:56px;
    text-shadow:0 2px 12px rgba(0,0,0,.55),0 1px 3px rgba(0,0,0,.6);
  }
  .hero-dark .arrow-link{text-shadow:0 1px 8px rgba(0,0,0,.5);}
  .chevron-link{
    display:inline-flex;align-items:center;gap:10px;
    font-family:'Inter',sans-serif;font-weight:600;font-size:12.5px;
    letter-spacing:.08em;text-transform:uppercase;color:#fff;
  }
  .chevron-link svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;transition:transform .2s ease;}
  .chevron-link:hover{color:rgba(255,255,255,.7);}
  .chevron-link:hover svg{transform:translateX(3px);}
  .arrow-link{
    display:inline-flex;align-items:center;gap:10px;
    font-family:'Inter',sans-serif;font-weight:600;font-size:13.5px;
    letter-spacing:.03em;color:var(--brass);
  }
  .arrow-link span{transition:transform .2s ease;}
  .arrow-link:hover span{transform:translateX(4px);}
  .hero-dark .arrow-link{color:var(--bg);}
  .hero-dark .arrow-link:hover{color:rgba(250,250,248,.7);}
  .hero-dots-wrap{position:absolute;left:0;right:0;bottom:36px;z-index:2;pointer-events:none;}
  .hero-dots{display:flex;gap:10px;pointer-events:auto;}
  .hero-dot{width:28px;height:2px;border:none;padding:0;background:rgba(255,255,255,.3);cursor:pointer;transition:background .2s ease;}
  .hero-dot.active{background:var(--champagne);}
  .hero-arrow{
    position:absolute;top:50%;transform:translateY(-50%);z-index:3;
    width:48px;height:48px;border-radius:50%;
    border:1px solid rgba(255,255,255,.3);background:rgba(0,0,0,.2);color:#fff;
    font-size:18px;line-height:1;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:background .2s ease,border-color .2s ease;
  }
  .hero-arrow:hover{background:rgba(0,0,0,.4);border-color:rgba(255,255,255,.6);}
  .hero-arrow-prev{left:20px;}
  .hero-arrow-next{right:20px;}
  @media (max-width:768px){
    .hero-arrow{width:38px;height:38px;font-size:15px;}
    .hero-arrow-prev{left:10px;}
    .hero-arrow-next{right:10px;}
  }

  /* ---- how we work strip ---- */
  .hows{border-bottom:1px solid var(--hairline);}
  .hows-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
  .hows-step{
    position:relative;padding:34px 32px 36px;
    border-top:1px solid var(--hairline);
    transition:background .45s ease;
  }
  .hows-step + .hows-step{border-left:1px solid var(--hairline);}
  /* brass rule grows across the top on hover - quiet, expensive */
  .hows-step::before{
    content:"";position:absolute;top:-1px;left:0;right:0;height:1px;
    background:var(--brass);transform:scaleX(0);transform-origin:left center;
    transition:transform .55s cubic-bezier(.16,1,.3,1);
  }
  .hows-step:hover{background:rgba(143,34,51,.035);}
  .hows-step:hover::before{transform:scaleX(1);}
  .hows-icon{
    display:flex;align-items:center;justify-content:center;
    width:46px;height:46px;margin-bottom:22px;
    border:1px solid var(--hairline);border-radius:50%;
    transition:border-color .4s ease,background .4s ease;
  }
  .hows-icon svg{
    width:21px;height:21px;fill:none;stroke:var(--brass);
    stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;
  }
  .hows-step:hover .hows-icon{border-color:var(--brass);background:var(--bg);}
  /* icon spins in on its own beat, riding the same stagger delay as its card */
  .hows-step.reveal .hows-icon{
    opacity:0;transform:rotate(-190deg) scale(.45);
    transition:opacity .5s ease,transform .8s cubic-bezier(.3,1.5,.4,1),border-color .4s ease,background .4s ease;
    transition-delay:inherit;
  }
  .hows-step.reveal.in .hows-icon{opacity:1;transform:none;}
  @media (prefers-reduced-motion:reduce){
    .hows-step.reveal .hows-icon{opacity:1;transform:none;transition:border-color .4s ease,background .4s ease;}
  }
  .hows-step h4{font-size:16.5px;font-weight:600;color:var(--parchment);margin:0 0 8px;font-family:'Inter',sans-serif;letter-spacing:.01em;}
  .hows-step p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.6;}
  @media (max-width:820px){ .hows-grid{grid-template-columns:1fr 1fr;} }
  .btn{
    display:inline-block;background:transparent;color:var(--brass);
    border:1.5px solid var(--brass);
    font-family:'Inter',sans-serif;font-weight:700;font-size:13.5px;
    letter-spacing:.06em;text-transform:uppercase;
    padding:14px 30px;border-radius:2px;
    transition:background .2s ease,color .2s ease;
  }
  .btn:hover{background:var(--brass);color:#fff;}
  .closing .btn,.hero-dark .btn{color:var(--bg);border-color:var(--bg);}
  .closing .btn:hover,.hero-dark .btn:hover{background:var(--bg);color:var(--dark);}
  .chips{display:flex;flex-wrap:wrap;gap:10px;}
  .chip{
    display:inline-flex;align-items:center;
    padding:9px 18px;border:1px solid var(--hairline);border-radius:20px;
    background:var(--surface);color:var(--muted);
    font-family:'Inter',sans-serif;font-size:13.5px;font-weight:500;
    text-decoration:none;line-height:1.3;
    transition:border-color .2s ease,color .2s ease,background .2s ease;
  }
  a.chip:hover{border-color:var(--brass);color:var(--brass);background:#fff;}
  .chip b{color:var(--parchment);}
  .closing .chip,.hero-dark .chip{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);color:var(--bg);}
  .closing .chip b,.hero-dark .chip b{color:var(--bg);}
  .closing a.chip:hover,.hero-dark a.chip:hover{border-color:var(--bg);background:rgba(255,255,255,.14);}
  .cta-row .phonelink{
    display:inline-flex;align-items:center;gap:10px;
    color:var(--parchment);font-size:15px;font-weight:600;border:none;
  }
  .cta-row .phonelink svg{width:18px;height:18px;stroke:var(--brass);fill:none;stroke-width:1.6;flex:none;}
  .cta-row .phonelink:hover{color:var(--brass-light);}
  .cta-row .phonelink:hover svg{stroke:var(--brass-light);}

  /* ---- messenger row ---- */
  .msg-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
  .msg-btn{
    width:42px;height:42px;border-radius:50%;flex:none;
    border:1px solid var(--brass);color:var(--brass);background:transparent;
    display:flex;align-items:center;justify-content:center;
    transition:background .2s ease,color .2s ease;
  }
  .msg-btn:hover{background:var(--brass);color:var(--bg);}
  .msg-btn svg{width:19px;height:19px;}
  .msg-btn svg *{fill:currentColor;}
  .closing .msg-btn,.hero-dark .msg-btn{border-color:rgba(250,250,248,.4);color:rgba(250,250,248,.9);}
  .closing .msg-btn:hover,.hero-dark .msg-btn:hover{background:var(--champagne);border-color:var(--champagne);color:var(--dark);}
  .footer-cols .msg-btn{border-color:rgba(250,250,248,.3);color:rgba(250,250,248,.8);}
  .footer-cols .msg-btn:hover{background:var(--champagne);color:var(--dark);border-color:var(--champagne);}
  .hero .msg-btn{width:34px;height:34px;}
  .hero .msg-btn svg{width:16px;height:16px;}
  .msg-note{font-size:12px;color:var(--muted);margin-top:10px;}
  .msg-lead{font-size:13.5px;font-weight:600;color:var(--parchment);margin:0;white-space:nowrap;}
  .msg-inline{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
  .closing .msg-note,.hero-dark .msg-note{color:rgba(250,250,248,.5);}
  .closing .msg-lead,.hero-dark .msg-lead{color:rgba(250,250,248,.85);}
  .footer-cols .msg-row{margin-top:14px;}
  .footer-cols .msg-btn{width:34px;height:34px;border-radius:9px;}
  .footer-cols .msg-btn svg{width:17px;height:17px;}
  nav .msg-btn{border-radius:8px;}
  nav .msg-btn svg{width:15px;height:15px;}

  .docket{
    border:1px solid var(--hairline);background:var(--surface);
    padding:30px 28px;
  }
  .docket .label{display:block;margin-bottom:22px;}
  .flow{position:relative;}
  .flow-step{position:relative;padding-left:38px;padding-bottom:26px;}
  .flow-step:last-child{padding-bottom:0;}
  .flow-step::before{
    content:"";position:absolute;left:11px;top:26px;bottom:-4px;width:1px;
    background:var(--hairline);
  }
  .flow-step:last-child::before{display:none;}
  .flow-num{
    position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;
    border:1px solid var(--brass);color:var(--brass);
    font-family:'Montserrat',sans-serif;font-size:12px;font-weight:600;
    display:flex;align-items:center;justify-content:center;background:var(--surface);
  }
  .flow-step h4{margin:0 0 3px;font-size:14.5px;font-weight:600;color:var(--parchment);font-family:'Inter',sans-serif;}
  .flow-step p{margin:0;font-size:13px;color:var(--muted);}
  .docket .row{
    display:flex;justify-content:space-between;gap:16px;
    padding:12px 0;border-top:1px solid var(--hairline);
    font-size:14.5px;
  }
  .docket .row:first-of-type{border-top:none;}
  .docket dt{color:var(--muted);}
  .docket dd{margin:0;color:var(--parchment);text-align:right;font-variant-numeric:tabular-nums;}

  /* ---- practice list ---- */
  .practice-list{border-top:1px solid var(--hairline);}
  .practice-item{
    display:grid;grid-template-columns:64px 1fr 120px;gap:24px;align-items:center;
    padding:26px 16px;border-bottom:1px solid var(--hairline);
    margin:0 -16px;border-radius:2px;
    transition:background .25s ease;
  }
  .practice-item:hover{background:var(--bg);cursor:pointer;}
  .practice-item > div + div{min-width:0;}
  .practice-item .arrow{
    opacity:0;transform:translateX(-6px);transition:opacity .25s ease,transform .25s ease;
    color:var(--brass);font-size:13.5px;font-weight:600;letter-spacing:.02em;
    text-align:right;white-space:nowrap;
  }
  .practice-item:hover .arrow{opacity:1;transform:none;}
  .practice-icon{
    width:46px;height:46px;border-radius:50%;border:1px solid var(--brass);
    display:flex;align-items:center;justify-content:center;margin-bottom:10px;
    background:var(--surface);
  }
  .practice-icon svg{width:22px;height:22px;stroke:var(--brass);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;}
  @media (prefers-reduced-motion:no-preference){
    .practice-item.reveal .practice-icon{
      opacity:0;transform:rotate(-210deg) scale(.4);
      transition:opacity .5s ease,transform .85s cubic-bezier(.3,1.5,.4,1);
      transition-delay:inherit;
    }
    .practice-item.reveal.in .practice-icon{opacity:1;transform:none;}
  }
  .practice-item .idx{
    font-family:'Montserrat',sans-serif;
    color:var(--brass);font-size:14px;
  }
  .practice-item h3{font-size:19px;color:var(--parchment);margin-bottom:6px;font-weight:600;}
  .practice-item p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.6;}

  /* ---- team ---- */
  .team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;}
  .person{border:1px solid var(--hairline);background:var(--surface);padding:22px;}
  .avatar{
    width:100%;aspect-ratio:4/5;border:1px solid var(--hairline);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
    background-color:var(--surface-2);
    background-image:var(--thumb-src,none),linear-gradient(160deg,var(--surface-2),var(--surface));
    background-size:cover;background-position:center top;
    filter:saturate(.92) contrast(1.03);
    margin-bottom:18px;
  }
  .avatar svg{width:34%;stroke:var(--muted);fill:none;stroke-width:1.1;opacity:.6;}
  .avatar .ph-label{
    font-family:'Inter',sans-serif;font-weight:600;
    font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  }
  .person h3{font-size:18px;color:var(--parchment);font-weight:600;margin-bottom:4px;}
  .person .role{font-size:13px;color:var(--brass-light);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;display:block;}
  .person p{margin:0;font-size:14px;color:var(--muted);}

  /* ---- video ---- */
  .video-frame{
    position:relative;aspect-ratio:16/9;background:var(--surface);
    border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;
    overflow:hidden;
  }
  .video-frame{background:var(--dark);}
  .video-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
  .video-frame::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(ellipse at 50% 40%, #1c4048, var(--dark));
  }
  .play-btn{
    position:relative;width:76px;height:76px;border-radius:50%;
    border:1px solid var(--brass);display:flex;align-items:center;justify-content:center;
  }
  .play-btn svg{width:22px;height:22px;fill:var(--brass);margin-left:4px;}

  /* ---- photo reveal (avatars / video frame) ---- */
  .photo-reveal{
    opacity:0;
    transform:perspective(1400px) rotateY(-42deg) rotateX(12deg) rotate(-8deg) scale(.82) translateY(44px);
    transform-origin:50% 50%;
    transition:opacity 1.1s cubic-bezier(.16,1,.3,1),transform 1.4s cubic-bezier(.2,1.35,.3,1);
  }
  .photo-reveal.in{
    opacity:1;
    transform:perspective(1400px) rotateY(0) rotateX(0) rotate(0) scale(1) translateY(0);
  }
  .person:nth-child(even) .photo-reveal{transform:perspective(1400px) rotateY(42deg) rotateX(12deg) rotate(8deg) scale(.82) translateY(44px);}
  .person:nth-child(even) .photo-reveal.in{transform:perspective(1400px) rotateY(0) rotateX(0) rotate(0) scale(1) translateY(0);}
  .person:nth-child(2) .photo-reveal{transition-delay:.14s;}
  .person:nth-child(3) .photo-reveal{transition-delay:.28s;}
  /* spinning ring around the play button */
  .play-btn::before{
    content:"";position:absolute;inset:-14px;border-radius:50%;
    border:1px solid transparent;border-top-color:var(--brass);border-right-color:rgba(143,34,51,.35);
    animation:playRing 3.4s linear infinite;
  }
  .play-btn::after{
    content:"";position:absolute;inset:-26px;border-radius:50%;
    border:1px solid rgba(255,255,255,.08);
    animation:playRing 9s linear infinite reverse;
  }
  @keyframes playRing{ to{ transform:rotate(360deg); } }
  @media (prefers-reduced-motion:reduce){
    .photo-reveal{opacity:1;transform:none;transition:none;}
    .play-btn::before,.play-btn::after{animation:none;}
  }

  /* ---- horizontal pin scroll ---- */
  /* pinned sections move their own padding into the sticky shell so the
     vertical rhythm matches every other section */
  section.hpin{padding-top:0;padding-bottom:0;}
  .hpin-sticky{
    position:sticky;top:0;overflow:hidden;
    padding:208px 0;
  }
  /* on short viewports the pinned block can be taller than the screen, hiding the
     prev/next arrows below the fold - tighten spacing before that happens.
     Applied to EVERY section (not just pinned ones) so the vertical rhythm stays
     identical across the whole page; the lede's -20px pull-up is re-tuned to the
     smaller heading margin so the net heading->lede gap shrinks proportionally
     (44-20=24 full, 24-6=18 compact) instead of collapsing to a negative overlap.
     Full 104px spacing is untouched above this height. */
  @media (max-height:820px){
    section{padding:120px 0;}
    .hpin-sticky{padding:120px 0;}
    .article-head{margin-bottom:30px;}
    .article-head + .juris-lede{margin-top:-6px;}
    .juris-lede{margin-bottom:30px;}
    .slider-controls{margin-top:30px;}
  }
  /* second tier for really short windows (1366x768 laptops leave ~620-700px of
     inner height once browser chrome is counted) - same uniform rhythm, tighter,
     and publication cards narrow slightly so their thumbs give back height.
     Breakpoint sits where tier-1's pinned Публикации block stops fitting (~743px). */
  @media (max-height:745px){
    section{padding:80px 0;}
    .hpin-sticky{padding:80px 0;}
    .article-head{margin-bottom:24px;}
    .juris-lede{margin-bottom:24px;}
    .slider-controls{margin-top:24px;}
    .pub-slider .pub-card{flex:0 0 260px;}
    .pub-card .pub-thumb{aspect-ratio:16/10;}
  }
  /* a hairline marks the seam when two same-toned sections meet,
     so the 104+104 gap never reads as an accidental double gap */
  main > section:not(.band):not(.closing):not(.hero) + section:not(.band):not(.closing){
    border-top:1px solid var(--hairline);
  }
  /* same problem, one specific pair: two .band sections back to back (international -> opyt) -
     just the hairline was missing, exactly like the rule above for plain sections. No padding
     changes here on purpose: owner confirmed the gap itself should match every other section
     break on the page (full double padding, same as e.g. .hows -> #team), not be shrunk - the
     only actual bug was the missing seam marker. */
  main > section.band + section.band{
    border-top:1px solid var(--hairline);
  }
  /* the pinned window itself bleeds past the 1080 container to the right, same as
     the plain-scroll track did - left edge stays flush with the section heading */
  .hpin-viewport{
    position:relative;overflow:hidden;
    width:calc(100vw - max(0px, (100vw - 1080px) / 2) - 32px);
  }
  /* in pinned mode the track is moved by transform, not by native scrolling */
  .hpin-viewport [data-slider]{
    overflow:visible !important;width:auto !important;
    padding-right:0 !important;scroll-snap-type:none !important;
    -webkit-mask-image:none !important;mask-image:none !important;
    will-change:transform;
  }
  /* slim progress rail + counter replaces the dot cluster */
  .slider-controls [data-dots]{display:flex;align-items:center;gap:18px;max-width:none;}
  .hpin-rail{
    display:block;width:clamp(150px,20vw,240px);height:2px;
    background:rgba(36,39,43,.13);position:relative;border-radius:2px;
  }
  .hpin-rail i{
    position:absolute;top:0;left:0;width:100%;height:100%;
    background:var(--brass);border-radius:2px;
    transform:scaleX(.03);transform-origin:left center;
  }
  .hpin-rail::after{
    content:"";position:absolute;top:50%;right:-1px;width:5px;height:5px;
    border-radius:50%;background:var(--hairline);transform:translateY(-50%);
  }
  .hpin-count{
    font-family:'Inter',sans-serif;font-size:11.5px;font-weight:600;
    letter-spacing:.12em;color:var(--muted);font-variant-numeric:tabular-nums;
    white-space:nowrap;min-width:56px;
  }

  /* ---- case slider ---- */
  .slider-wrap{position:relative;}
  .case-slider,.testi-slider{
    display:flex;gap:24px;overflow-x:auto;padding-bottom:4px;
    scroll-snap-type:x proximity;
    width:calc(100vw - max(0px, (100vw - 1080px) / 2) - 32px);
    margin-left:0;margin-right:0;padding-right:8px;
    scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;
  }
  .case-slider::-webkit-scrollbar,.testi-slider::-webkit-scrollbar{display:none;height:0;}
  .case-card{
    flex:0 0 300px;scroll-snap-align:start;border-top:1px solid var(--brass);
    padding:20px 0 0;
    display:block;text-decoration:none;color:inherit;
    transition:border-color .2s ease,transform .2s ease;
  }
  a.case-card:hover{border-top-color:var(--brass-light);transform:translateY(-2px);}
  a.case-card:hover .case-thumb{filter:saturate(1) contrast(1.06);}
  .case-thumb{
    width:100%;aspect-ratio:16/10;margin-bottom:16px;
    background-color:var(--surface-2);
    background-image:var(--thumb-src,none),linear-gradient(160deg,var(--surface-2),var(--surface));
    background-size:cover;background-position:center;
    filter:saturate(.9) contrast(1.03);
  }
  .case-card .tag{font-size:11.5px;letter-spacing:.12em;color:var(--brass-light);text-transform:uppercase;margin-bottom:14px;display:block;}
  .case-card p{font-size:14.5px;color:var(--parchment);margin:0;line-height:1.55;}
  .slider-hint{color:var(--muted);font-size:12.5px;margin-top:18px;text-align:center;}

  .slider-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:44px;}
  .slider-arrow{
    width:38px;height:38px;border-radius:50%;flex:none;
    border:1px solid var(--brass);background:transparent;color:var(--brass);
    display:flex;align-items:center;justify-content:center;cursor:pointer;
    transition:background .2s ease,color .2s ease;
  }
  .slider-arrow svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;}
  .slider-arrow:hover{background:var(--brass);color:var(--bg);}
  .slider-dots{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:280px;}
  .slider-dot{width:7px;height:7px;border-radius:50%;background:var(--hairline);cursor:pointer;flex:none;border:none;padding:0;transition:background .2s ease,transform .2s ease;}
  .slider-dot.active{background:var(--brass);transform:scale(1.5);}

  /* ---- testimonials ---- */
  .testi-card{
    flex:0 0 340px;scroll-snap-align:start;border-top:1px solid var(--brass);
    padding:20px 0 0;display:flex;flex-direction:column;
  }
  .testi-card .who-row{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
  .testi-card .t-avatar{
    width:44px;height:44px;border-radius:50%;flex:none;
    display:flex;align-items:center;justify-content:center;
    background-color:var(--surface-2);
    background-image:var(--thumb-src,none),linear-gradient(160deg,var(--surface-2),var(--surface));
    background-size:cover;background-position:center;
    border:1px solid var(--hairline);
    font-family:'Montserrat',sans-serif;font-weight:700;
    color:var(--brass);font-size:14px;
    text-indent:-999px;overflow:hidden;
  }
  .testi-card .who-name{font-size:14.5px;font-weight:600;color:var(--parchment);}
  .testi-card .who{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
  .testi-card .quote{font-family:'Spectral',Georgia,serif;font-style:italic;font-weight:400;font-size:18.5px;line-height:1.45;color:var(--parchment);margin:0;flex:1;}
  .testi-card .stars{color:var(--brass);letter-spacing:2px;font-size:13px;margin-top:16px;}

  /* ---- publications ---- */
  .pub-slider{
    display:flex;gap:24px;overflow-x:auto;padding-bottom:4px;
    scroll-snap-type:x proximity;
    width:calc(100vw - max(0px, (100vw - 1080px) / 2) - 32px);
    margin-left:0;margin-right:0;padding-right:8px;
    scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;
  }
  .pub-slider::-webkit-scrollbar{display:none;height:0;}
  .pub-card{flex:0 0 300px;scroll-snap-align:start;}
  .pub-thumb{
    width:100%;aspect-ratio:4/3;margin-bottom:16px;filter:saturate(.92) contrast(1.04);
    background-color:var(--surface-2);
    background-image:var(--thumb-src,none),linear-gradient(160deg,var(--surface-2),var(--surface));
    background-size:cover;background-position:center;
  }
  .pub-card .body{border-top:1px solid var(--brass);padding-top:16px;}
  .pub-card .tag{font-size:11px;letter-spacing:.1em;color:var(--brass-light);text-transform:uppercase;margin-bottom:12px;display:block;}
  .pub-card h3{font-size:16.5px;color:var(--parchment);margin-bottom:10px;line-height:1.35;font-weight:600;}
  .pub-card p{font-size:13.5px;color:var(--muted);margin:0 0 14px;line-height:1.5;}
  .pub-card .read{font-size:13px;font-weight:600;color:var(--brass);}

  /* ---- news ---- */
  .news-list{border-top:1px solid var(--hairline);}
  .news-item{padding:26px 0;border-bottom:1px solid var(--hairline);}
  .news-meta{font-size:11.5px;letter-spacing:.1em;color:var(--brass);font-weight:600;display:block;margin-bottom:10px;}
  .news-item h3{font-size:19px;color:var(--parchment);font-weight:700;margin-bottom:8px;max-width:70ch;}
  .news-item p{font-size:14.5px;color:var(--muted);margin:0;max-width:72ch;line-height:1.55;}

  /* ---- stats ---- */
  .stats{
    display:grid;grid-template-columns:repeat(3,1fr);gap:36px 40px;
    border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);
    padding:44px 0;
  }
  .stat{border-left:2px solid var(--brass);padding-left:18px;}
  .stat b{
    display:block;font-family:'Montserrat',sans-serif;font-weight:700;
    font-size:clamp(34px,4vw,46px);color:var(--parchment);
    font-variant-numeric:tabular-nums;line-height:1;
  }
  .stat .stat-label{color:var(--parchment);font-size:14.5px;font-weight:600;margin-top:8px;display:block;}
  .stat span.stat-desc{color:var(--muted);font-size:13.5px;margin-top:4px;display:block;line-height:1.5;}

  /* ---- jurisdictions ---- */
  .juris-lede{font-family:'Spectral',Georgia,serif;color:var(--muted);font-size:19px;line-height:1.5;max-width:none;margin-bottom:44px;}
  .intl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-bottom:16px;}
  .intl-grid-2col{grid-template-columns:repeat(2,1fr);}
  .intl-item{border-top:1px solid var(--brass);padding-top:16px;}
  .intl-item h3{font-size:17px;color:var(--parchment);margin-bottom:10px;font-weight:600;}
  .intl-item p{font-size:14px;color:var(--muted);margin:0;line-height:1.55;}
  @media (max-width:820px){ .intl-grid{grid-template-columns:1fr;} }
  .offices-simple-grid{display:flex;flex-wrap:wrap;gap:16px 32px;margin-bottom:8px;}
  .office-simple{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--muted);text-decoration:none;transition:color .3s ease;flex:0 0 auto;}
  a.office-simple:hover{color:var(--parchment);}
  /* drawn flags - Windows renders regional-indicator emoji as bare letters ("CR", "UY") */
  .offices-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
  .office-item{display:flex;gap:14px;align-items:flex-start;padding:22px 20px;border:1px solid var(--hairline);border-radius:2px;background:var(--surface);}
  .office-item .flag{margin-top:4px;}
  .office-item h3{font-size:16px;font-weight:600;color:var(--parchment);margin:0 0 4px;font-family:'Inter',sans-serif;}
  .office-item p{margin:0 0 2px;font-size:13px;color:var(--muted);}
  .office-addr{margin-bottom:8px !important;}
  .office-phone{display:block;font-size:13.5px;color:var(--brass);text-decoration:none;margin-top:2px;}
  .office-phone:hover{text-decoration:underline;}
  @media (max-width:900px){ .offices-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:520px){ .offices-grid{grid-template-columns:1fr;} }
  .flag{
    display:inline-block;width:19px;height:13px;flex:none;border-radius:1.5px;
    box-shadow:0 0 0 1px rgba(36,39,43,.16) inset;background-size:cover;
  }
  .fl-ru{background:linear-gradient(#fff 33.33%,#0039a6 33.33% 66.66%,#d52b1e 66.66%);}
  .fl-ch{background:linear-gradient(#fff,#fff) center/4px 10px no-repeat,linear-gradient(#fff,#fff) center/10px 4px no-repeat,#d52b1e;}
  .fl-ae{background:linear-gradient(#ce1126,#ce1126) left/5px 100% no-repeat,linear-gradient(#00732f 33.33%,#fff 33.33% 66.66%,#111 66.66%);}
  .fl-gb{background:
    linear-gradient(-33deg,transparent 48%,#c8102e 49.5%,#c8102e 50.5%,transparent 52%),
    linear-gradient(33deg,transparent 48%,#c8102e 49.5%,#c8102e 50.5%,transparent 52%),
    linear-gradient(-33deg,transparent 44%,#fff 46%,#fff 54%,transparent 56%),
    linear-gradient(33deg,transparent 44%,#fff 46%,#fff 54%,transparent 56%),
    linear-gradient(#c8102e,#c8102e) center/100% 16% no-repeat,
    linear-gradient(#c8102e,#c8102e) center/16% 100% no-repeat,
    linear-gradient(#fff,#fff) center/100% 36% no-repeat,
    linear-gradient(#fff,#fff) center/36% 100% no-repeat,
    #012169;
  }
  .fl-tr{background:radial-gradient(circle at 46% 50%,#e30a17 0 2.7px,transparent 2.8px),radial-gradient(circle at 38% 50%,#fff 0 3.6px,transparent 3.7px),#e30a17;}
  .fl-cy{background:radial-gradient(ellipse at 50% 45%,#d57800 0 3.2px,transparent 3.3px),#fff;}
  .fl-hk{background:radial-gradient(circle at 50% 50%,#fff 0 3.2px,transparent 3.3px),#de2910;}
  .fl-cn{background:radial-gradient(circle at 27% 34%,#ffde00 0 2.2px,transparent 2.3px),#de2910;}
  .fl-us{background:linear-gradient(#3c3b6e,#3c3b6e) left top/8px 7px no-repeat,repeating-linear-gradient(#b22234 0 1.8px,#fff 1.8px 3.6px);}
  .fl-rs{background:linear-gradient(#c6363c 33.33%,#0c4076 33.33% 66.66%,#fff 66.66%);}
  .fl-me{background:linear-gradient(#c40308,#c40308) center/calc(100% - 4px) calc(100% - 4px) no-repeat,#d4af37;}
  .fl-pa{background:linear-gradient(#fff,#fff) left top/50% 50% no-repeat,linear-gradient(#d21034,#d21034) right top/50% 50% no-repeat,linear-gradient(#005293,#005293) left bottom/50% 50% no-repeat,linear-gradient(#fff,#fff) right bottom/50% 50% no-repeat;}
  .fl-cr{background:linear-gradient(#002b7f 0 20%,#fff 20% 34%,#ce1126 34% 66%,#fff 66% 80%,#002b7f 80%);}
  .fl-uy{background:linear-gradient(#fff,#fff) left top/9px 6px no-repeat,repeating-linear-gradient(#fff 0 1.5px,#0038a8 1.5px 3px);}
  .fl-ar{background:radial-gradient(circle at 50% 50%,#f6b40e 0 1.7px,transparent 1.8px),linear-gradient(#74acdf 33.33%,#fff 33.33% 66.66%,#74acdf 66.66%);}
  .fl-br{background:radial-gradient(circle at 50% 50%,#002776 0 2.3px,transparent 2.4px),radial-gradient(ellipse at 50% 50%,#ffdf00 0 5px,transparent 5.1px),#009b3a;}
  .fl-mx{background:linear-gradient(90deg,#006847 33.33%,#fff 33.33% 66.66%,#ce1126 66.66%);}
  .fl-sg{background:radial-gradient(circle at 22% 30%,#fff 0 3px,transparent 3.1px),linear-gradient(#ed2939 50%,#fff 50%);}
  .fl-es{background:linear-gradient(#aa151b 25%,#f1bf00 25% 75%,#aa151b 75%);}
  .fl-id{background:linear-gradient(#ce1126 50%,#fff 50%);}

  /* ---- case text ---- */
  .case-text p{font-size:17px;color:var(--parchment);line-height:1.65;margin:0 0 18px;}
  .case-text .fine{font-size:13.5px;color:var(--muted);}

  /* ---- faq ---- */
  details{border-bottom:1px solid var(--hairline);padding:20px 0;}
  details summary{
    cursor:pointer;list-style:none;font-size:17px;color:var(--parchment);
    display:flex;justify-content:space-between;align-items:center;gap:16px;
  }
  details summary::-webkit-details-marker{display:none;}
  details summary .plus{color:var(--brass-light);font-size:20px;font-family:'Montserrat',sans-serif;transition:transform .15s ease;}
  details[open] summary .plus{transform:rotate(45deg);}
  details p{color:var(--muted);margin:14px 0 0;max-width:66ch;font-size:15px;}

  /* ---- closing ---- */
  .closing{background:var(--dark);position:relative;overflow:hidden;padding:56px 0;}
  .closing .article-num{color:var(--champagne);}
  .closing-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
  .closing h2{font-size:clamp(26px,3.2vw,36px);margin-bottom:16px;color:var(--bg);}
  .closing p{color:rgba(250,250,248,.65);max-width:48ch;}
  .closing .big-phone{
    display:block;color:var(--bg);font-family:'Montserrat',sans-serif;font-size:22px;
    border:none;margin-bottom:10px;
  }
  .closing .big-phone:hover{color:var(--champagne);}

  .closing-card-wrap{position:relative;isolation:isolate;overflow:hidden;border-radius:2px;}
  /* watermark clock sits ABOVE the frosted card - behind it the backdrop-blur erases it */
  /* square clock: numerals ride the card's own rectangular perimeter, not a circle */
  .closing-clock{
    position:absolute;inset:26px 30px;z-index:2;
    color:#fff;opacity:0;
    transition:opacity 1.4s ease;pointer-events:none;
  }
  .closing-clock i{
    position:absolute;left:var(--x);top:var(--y);
    transform:translate(-50%,-50%);
    font-family:'Spectral',Georgia,serif;font-style:normal;
    font-size:13px;letter-spacing:.08em;white-space:nowrap;
  }
  .closing-card-wrap.in .closing-clock{opacity:.055;}
  .closing-card-glow{
    position:absolute;inset:-1px;z-index:0;border-radius:2px;
    background:conic-gradient(from 0deg, transparent 0%, var(--brass-light) 4%, transparent 12%, transparent 100%);
    opacity:0;
  }
  .closing-card-wrap.in .closing-card-glow{
    opacity:.65;animation:closingGlowSpin 8s linear infinite;
  }
  @keyframes closingGlowSpin{ to{ transform:rotate(360deg); } }
  @media (prefers-reduced-motion:reduce){
    .closing-card-wrap.in .closing-card-glow{animation:none;opacity:.4;}
  }
  .closing-card{
    position:relative;z-index:1;
    background:rgba(255,255,255,.055);
    backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
    border:1px solid rgba(255,255,255,.1);
    padding:34px 32px;
    opacity:0;transform:scale(.93) translateY(26px);
    transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1);
  }
  .closing-card-wrap.in .closing-card{opacity:1;transform:none;}
  .closing-card .label{color:var(--champagne);}
  .closing-card input{
    background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.22);
    color:var(--bg);font-family:'Inter',sans-serif;font-size:15px;
    padding:12px 2px;outline:none;width:100%;
    transition:border-color .2s ease;
  }
  .closing-card input::placeholder{color:rgba(255,255,255,.4);}
  .closing-card input:focus{border-color:var(--champagne);}
  .closing-card form{display:flex;flex-direction:column;gap:16px;}
  .msg-toggle{
    display:flex;border:1px solid rgba(255,255,255,.22);
    border-radius:2px;overflow:hidden;
  }
  .closing-card .msg-toggle-btn{
    flex:1;background:none;border:none;margin-top:0;cursor:pointer;
    padding:11px 10px;font-family:'Inter',sans-serif;font-size:13px;font-weight:600;
    text-transform:none;letter-spacing:normal;
    color:rgba(255,255,255,.5);transition:background .2s ease,color .2s ease;
    display:flex;align-items:center;justify-content:center;gap:8px;
  }
  .msg-toggle-btn + .msg-toggle-btn{border-left:1px solid rgba(255,255,255,.22);}
  .msg-toggle-btn svg{width:15px;height:15px;flex:none;}
  .closing-card .msg-toggle-btn[aria-pressed="true"]{background:var(--brass);color:var(--dark);}
  .closing-card .msg-toggle-btn[aria-pressed="true"] svg path{fill:var(--dark);}
  .closing-card .msg-toggle-btn[aria-pressed="false"]{background:none;color:rgba(255,255,255,.5);}
  .closing-card .msg-toggle-btn[aria-pressed="false"]:hover{color:rgba(255,255,255,.85);}
  .phone-field{display:flex;gap:10px;align-items:center;}
  .phone-field select{
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.32);border-radius:3px;
    color:#fff;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;
    padding:11px 8px;outline:none;flex:none;cursor:pointer;
    transition:border-color .2s ease,background .2s ease;
  }
  .phone-field select:hover{background:rgba(255,255,255,.14);}
  .phone-field select:focus{border-color:var(--brass);}
  .phone-field select option,.phone-field select optgroup{color:#111;background:#fff;}
  .phone-code-static{
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.32);border-radius:3px;
    color:#fff;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;
    padding:11px 12px;flex:none;line-height:1;display:none;
    align-items:center;justify-content:center;
  }
  .phone-field input{flex:1;min-width:0;border-bottom:1px solid rgba(255,255,255,.22);}
  .form-row{display:flex;gap:16px;}
  .form-field{flex:1;min-width:0;}
  .form-field label{display:block;font-size:11.5px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;}
  .closing-card input[type="date"],.closing-card input[type="time"]{color:var(--bg);color-scheme:dark;text-align:left;}
  .closing-card input[type="date"]::-webkit-date-and-time-value,
  .closing-card input[type="time"]::-webkit-date-and-time-value{text-align:left;}
  .closing-card button{
    position:relative;overflow:hidden;
    margin-top:6px;background:var(--brass);border:none;color:var(--dark);
    font-family:'Inter',sans-serif;font-weight:700;font-size:14.5px;
    text-transform:uppercase;letter-spacing:.06em;
    padding:14px 24px;cursor:pointer;transition:background .2s ease;
  }
  .closing-card button::after{
    content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
    background:linear-gradient(120deg,transparent,rgba(255,255,255,.4),transparent);
    transform:skewX(-20deg);
  }
  .closing-card button:hover{background:var(--brass-light);}
  .closing-card button:hover::after{animation:closingBtnShine 1s ease;}
  @keyframes closingBtnShine{ from{left:-60%;} to{left:130%;} }
  .closing-card .consent-check{color:rgba(255,255,255,.55);}
  .closing-card .consent-check a{color:rgba(255,255,255,.8);}
  .closing-card .consent-check a:hover{color:#fff;}
  @media (prefers-reduced-motion:reduce){
    .closing-card{opacity:1;transform:none;transition:none;}
    .closing-card-wrap.in .closing-card-glow{animation:none;opacity:.6;}
  }
  form{display:flex;flex-direction:column;gap:14px;}
  form input{
    background:transparent;border:none;border-bottom:1px solid var(--hairline);
    color:var(--parchment);font-family:'Inter',sans-serif;font-size:15px;
    padding:12px 2px;outline:none;
  }
  form input::placeholder{color:var(--muted);}
  form input:focus{border-color:var(--brass-light);}
  form button{
    margin-top:8px;background:var(--brass);border:none;color:var(--ink);
    font-weight:700;font-size:14.5px;padding:14px 24px;cursor:pointer;letter-spacing:.02em;
  }
  form button:hover{background:var(--brass-light);}
  .consent-check{
    display:flex;align-items:flex-start;gap:9px;
    font-family:'Inter',sans-serif;font-size:12.5px;line-height:1.5;color:var(--muted);
    cursor:pointer;
  }
  .consent-check input{
    appearance:none;-webkit-appearance:none;flex:none;
    width:16px;height:16px;margin-top:1px;border-radius:3px;
    border:1px solid var(--hairline);background:transparent;cursor:pointer;
    position:relative;transition:border-color .2s ease,background .2s ease;
  }
  .closing-card .consent-check input{border-color:rgba(255,255,255,.35);}
  .consent-check input:checked{background:var(--brass);border-color:var(--brass);}
  .consent-check input:checked::after{
    content:"";position:absolute;left:5px;top:1px;width:4px;height:8px;
    border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);
  }
  .consent-check a{color:var(--brass);text-decoration:underline;text-underline-offset:2px;}
  .consent-check a:hover{color:var(--ink);}

  /* ---- legal policy modal ---- */
  .legal-modal{position:fixed;inset:0;z-index:200;display:none;}
  .legal-modal.open{display:block;}
  .legal-modal-backdrop{position:absolute;inset:0;background:rgba(18,24,31,.72);backdrop-filter:blur(2px);}
  .legal-modal-card{
    position:relative;z-index:1;margin:5vh auto;max-width:640px;max-height:90vh;
    overflow-y:auto;background:var(--bg);padding:44px 40px;border-radius:2px;
    box-shadow:0 30px 80px rgba(0,0,0,.35);
  }
  .legal-modal-close{
    position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:50%;
    border:1px solid var(--hairline);background:transparent;color:var(--muted);
    font-size:20px;line-height:1;cursor:pointer;transition:border-color .2s ease,color .2s ease;
  }
  .legal-modal-close:hover{border-color:var(--brass);color:var(--brass);}
  .legal-modal-card h3{font-family:'Spectral',Georgia,serif;font-size:24px;font-weight:400;margin:0 0 20px;padding-right:30px;}
  .legal-modal-body{font-family:'Inter',sans-serif;font-size:14.5px;line-height:1.7;color:var(--parchment);}
  .legal-modal-body h4{font-family:'Inter',sans-serif;font-size:14px;font-weight:700;margin:20px 0 8px;}
  .legal-modal-body p{margin:0 0 12px;color:var(--muted);}
  @media (max-width:640px){
    .legal-modal-card{margin:0;max-height:100vh;height:100%;padding:32px 22px;border-radius:0;}
  }

  /* ---- consultation booking modal (wraps the existing closing-card-wrap form) ---- */
  .consult-modal{position:fixed;inset:0;z-index:200;display:none;}
  .consult-modal.open{display:block;}
  .consult-modal-backdrop{position:absolute;inset:0;background:rgba(18,24,31,.85);backdrop-filter:blur(3px);}
  .consult-modal-card{
    position:relative;z-index:1;margin:5vh auto;max-width:460px;max-height:90vh;
    overflow-y:auto;border-radius:2px;
  }
  .consult-modal-close{
    position:absolute;top:14px;right:14px;z-index:3;width:34px;height:34px;border-radius:50%;
    border:1px solid rgba(255,255,255,.3);background:rgba(18,24,31,.4);color:#fff;
    font-size:20px;line-height:1;cursor:pointer;transition:border-color .2s ease,color .2s ease;
  }
  .consult-modal-close:hover{border-color:var(--brass);color:var(--brass);}
  body.consult-modal-lock{overflow:hidden;}
  @media (max-width:640px){
    .consult-modal-card{margin:0;max-height:100vh;height:100%;border-radius:0;max-width:100%;
      display:flex;flex-direction:column;justify-content:center;padding:16px;}
  }

  footer{padding:64px 0 0;background:var(--dark);}
  .footer-cols{
    display:grid;grid-template-columns:1.2fr repeat(4,minmax(0,1fr));gap:32px;
    padding-bottom:44px;
  }
  .footer-cols > div{min-width:0;}
  .fc-group-col{display:flex;flex-direction:column;gap:28px;min-width:0;}
  .footer-cols ul{gap:10px;}
  .footer-cols a{font-size:13px;line-height:1.4;word-break:break-word;}
  .footer-cols .wordmark{margin-bottom:14px;color:var(--bg);}
  .footer-cols h4{
    font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--brass);
    margin:0 0 14px;font-weight:600;font-family:'Inter',sans-serif;
    overflow-wrap:break-word;word-break:break-word;
  }
  .footer-cols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
  .footer-cols a{color:rgba(250,250,248,.65);font-size:14px;}
  .footer-cols a:hover{color:var(--brass);}
  .foot-bottom{
    border-top:1px solid rgba(250,250,248,.15);padding-top:20px;padding-bottom:20px;
    display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;
    color:rgba(250,250,248,.5);font-size:13px;
  }
  .foot-bottom a{color:rgba(250,250,248,.5);}
  .foot-bottom a:hover{color:var(--brass);}

  /* ---- mobile/tablet nav menu ----
     Simple, robust pattern by design: no fixed-position drawer, no icon-rotation
     math, no backdrop pseudo-element. The panel is a normal in-flow child of
     <header> that expands/collapses below the nav row; header (already
     position:fixed, z-index:70) just grows taller while open. This avoids the
     whole class of stacking/transform bugs a slide-in drawer is prone to. */
  @media (max-width:900px){
    nav{padding:22px 24px;flex-wrap:wrap;}
    .wordmark-serif{font-size:15px;letter-spacing:.14em;}
    header.scrolled .wordmark-serif{font-size:13px;}
    .nav-toggle{
      position:relative;display:flex;align-items:center;justify-content:center;flex:none;
      width:42px;height:42px;border-radius:50%;
      background:none;border:1px solid rgba(255,255,255,.45);color:#fff;
      cursor:pointer;touch-action:manipulation;transition:border-color .25s ease,background .25s ease;
    }
    .nav-toggle[aria-expanded="true"]{background:rgba(255,255,255,.08);border-color:var(--brass-light);}
    header.scrolled .nav-toggle{border-color:var(--hairline);color:var(--ink);}
    header.scrolled .nav-toggle[aria-expanded="true"]{border-color:var(--brass);}
    .nav-toggle svg{position:absolute;top:50%;left:50%;width:19px;height:19px;transform:translate(-50%,-50%);transition:opacity .2s ease;}
    .nav-toggle .icon-close{opacity:0;}
    .nav-toggle[aria-expanded="true"] .icon-burger{opacity:0;}
    .nav-toggle[aria-expanded="true"] .icon-close{opacity:1;}

    .nav-panel{
      order:10;flex:0 0 100%;display:block;
      max-height:0;overflow:hidden;
      transition:max-height .3s ease;
    }
    /* max-height (not grid-template-rows:0fr->1fr) - the grid trick relies on the
       container's own height coming from the row's fr size, but this panel sits in
       an auto-height flex row with no definite block size to resolve fr against, so
       browsers fell back to the content's natural height instead of collapsing to 0,
       leaving the closed menu's links rendered (and visible) above/through the page. */
    .nav-panel.open{max-height:600px;}
    /* open menu = solid dark surface, ALWAYS light foreground. Without these the
       .scrolled state (light bar, dark text) leaks through: dark links on the dark
       nav-open background read as disabled, and the .92-alpha scrolled bar shows
       the page behind the menu. */
    body.nav-open header,
    body.nav-open header.scrolled{
      background:var(--dark);backdrop-filter:none;
      border-bottom-color:rgba(255,255,255,.08);
    }
    body.nav-open header::before,
    body.nav-open header.scrolled::before{background:var(--dark);}
    body.nav-open header .navlinks a{color:rgba(255,255,255,.92);}
    body.nav-open header .navlinks a:hover{color:#fff;}
    body.nav-open header .wordmark{color:#fff;}
    body.nav-open header .wordmark-serif{color:#fff;}
    body.nav-open header .logo-mark{color:#fff;}
    body.nav-open header .logo-mono{color:#fff;}
    body.nav-open header .nav-toggle{border-color:var(--brass-light);color:#fff;background:rgba(255,255,255,.08);}
    body.nav-open header .msg-btn{border-color:rgba(255,255,255,.6);color:#fff;}
    .navlinks{display:flex;flex-direction:column;gap:4px;margin:16px 0 0;}
    .navlinks a{
      display:block;padding:12px 4px;font-size:17px;color:rgba(255,255,255,.92);
      border-top:1px solid rgba(255,255,255,.1);
    }
    .nav-msg{margin:16px 0 14px;gap:12px;}
  }

  @media (max-width:820px){
    .hero-grid,.closing-grid{grid-template-columns:1fr;}
    .team-grid{grid-template-columns:1fr 1fr;}
    .footer-cols{grid-template-columns:1fr 1fr;}
    .stats{grid-template-columns:1fr;gap:24px;}
    .stats .stat{padding-bottom:18px;border-bottom:1px solid var(--hairline);}
    .stats .stat:last-child{border-bottom:none;padding-bottom:0;}
    section{padding:128px 0;}
    .article-head{margin-bottom:32px;}
    .article-head + .juris-lede{margin-top:-14px;}
    .juris-lede{margin-bottom:32px;}
    .slider-controls{margin-top:32px;}
    .hero-dark p.description{margin-bottom:40px;}
    .cta-row{gap:36px;}
  }

  @media (max-width:640px){
    .wrap{padding:0 20px;}
    nav{padding:16px 20px;gap:14px;}
    .wordmark-serif{font-size:12.5px;letter-spacing:.08em;}
    header.scrolled .wordmark-serif{font-size:11px;}
    .nav-msg{gap:10px;}
    .hero:not(.hero-dark){padding:48px 0 56px;}
    .hero-slides{min-height:100vh;min-height:100dvh;}
    .hero-slide{padding:96px 0 88px;}
    .hero-slide:not(.is-active){display:none;}
    .hero-dots-wrap{bottom:24px;}
    .hero h1,.hero h2{font-size:clamp(28px,8vw,36px);}
    .hero p.lede{font-size:15.5px;}
    .btn{width:100%;text-align:center;padding:15px 20px;}
    .cta-row{width:100%;}
    .team-grid{grid-template-columns:1fr;}
    /* one card per screen on phones instead of the desktop's fixed 300px card
       (which just showed an awkward partial peek of the next card) - matches
       a real swipe-one-at-a-time carousel rather than a half-visible sliver. */
    .case-card{flex-basis:100%;}
    /* form card -> footer logo: base gap is 56 (closing pad) + 64 (footer pad) =
       120px of dark-on-dark emptiness - halve it on phones */
    .closing{padding-bottom:28px;}
    footer{padding-top:32px;padding-bottom:max(28px, env(safe-area-inset-bottom));}
    .footer-cols{display:block;column-count:2;column-gap:24px;padding-bottom:32px;}
    .footer-cols > div:first-child{
      column-span:all;padding-bottom:20px;
      border-bottom:1px solid rgba(250,250,248,.12);margin-bottom:24px;
    }
    .fc-group-col{display:contents;}
    .fc-group{break-inside:avoid;margin-bottom:28px;}
    .fc-group + .fc-group{border-top:none;padding-top:0;}
    .foot-bottom{padding-top:20px;padding-bottom:max(20px, env(safe-area-inset-bottom));flex-direction:column;gap:10px;}
    .practice-item{grid-template-columns:44px 1fr;}
    .practice-item .arrow{display:none;}
    .practice-icon{width:38px;height:38px;}
    .practice-icon svg{width:18px;height:18px;}
    .journey-step{grid-template-columns:40px 1fr;gap:16px;}
    .journey-num{width:36px;height:36px;font-size:15px;}
    .intl-item h3{font-size:16px;}
    .form-row{flex-direction:column;gap:16px;}
    .closing-card{padding:26px 22px;}
    .msg-row{gap:6px;}
    .msg-btn{width:32px;height:32px;}
    .msg-btn svg{width:15px;height:15px;}
    .msg-btn text{font-size:9px;}
    .article-head{flex-wrap:wrap;row-gap:8px;}
    .article-head h2{font-size:clamp(21px,6.5vw,26px);}
    .stat b{font-size:clamp(28px,9vw,38px);}
  }

  /* ---- page loader (scales of justice) ---- */
  #page-loader{
    position:fixed;inset:0;z-index:999;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;
    background:var(--dark);
    transition:opacity .5s ease,visibility 0s linear .5s;
  }
  #page-loader.loader-hidden{opacity:0;visibility:hidden;pointer-events:none;}
  .loader-scale{width:78px;height:78px;color:var(--bg);overflow:visible;}
  .loader-beam{
    transform-origin:50px 18px;
    animation:loaderWeigh 2.4s cubic-bezier(.45,0,.55,1) infinite;
  }
  @keyframes loaderWeigh{
    0%,100%{transform:rotate(-9deg);}
    50%{transform:rotate(9deg);}
  }
  @media (prefers-reduced-motion:reduce){
    .loader-beam{animation:none;}
  }

  /* ---- institutional film section ---- */
  .film-frame{max-width:960px;margin:0 auto;aspect-ratio:16/9;background:#000;overflow:hidden;}
  .film-frame video{width:100%;height:100%;display:block;object-fit:cover;}

  /* ---- floating side rail (WhatsApp/Telegram), replaces hero messenger row ---- */
  .side-rail{
    position:fixed;top:50%;right:0;transform:translate(100%,-50%);
    display:flex;flex-direction:column;gap:10px;
    padding:12px 10px;background:var(--dark);
    border-radius:14px 0 0 14px;
    z-index:60;
    transition:transform .45s cubic-bezier(.22,.9,.3,1);
  }
  .side-rail.is-visible{transform:translate(0,-50%);}
  .side-rail .msg-btn{width:36px;height:36px;border-color:var(--champagne);color:var(--champagne);}
  .side-rail .msg-btn:hover{background:var(--champagne);border-color:var(--champagne);color:var(--dark);}
  @media (max-width:640px){ .side-rail{padding:9px 7px;} .side-rail .msg-btn{width:32px;height:32px;} }

  /* ---- international section city photos ---- */
  .intl-photos{display:flex;flex-wrap:wrap;gap:12px;margin:0;}
  .intl-photo{
    display:block;position:relative;aspect-ratio:4/5;background-size:cover;background-position:center;
    flex:0 1 calc((100% - 6*12px)/7);
  }
  .intl-photo span{
    position:absolute;left:0;right:0;bottom:0;padding:8px 10px 7px;
    font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#fff;
    background:linear-gradient(to top,rgba(0,0,0,.65),transparent);
  }
  @media (max-width:820px){ .intl-photo{flex-basis:calc((100% - 2*12px)/3);} }
  @media (max-width:520px){ .intl-photo{flex-basis:calc((100% - 1*12px)/2);} }
<