/* Motion follows the earlier line study. All movement ends; nothing loops. */
.capital-hero{position:relative;min-height:calc(100svh - 76px);display:flex;flex-direction:column;justify-content:center;padding:70px 0 28px;isolation:isolate;overflow:clip}
.capital-scene{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;padding:18px 0 0}
.capital-copy{position:relative;z-index:2;text-align:center;max-width:750px;padding:0 24px}
.capital-copy h1{font-family:var(--serif);font-size:clamp(2.6rem,5.25vw,4.7rem);font-weight:400;letter-spacing:-.041em;line-height:1.1;max-width:670px;margin:0;text-wrap:balance}
.capital-copy h1 span{display:block}
.capital-copy h1{background:var(--bg)}
.capital-copy p{font-family:var(--serif);font-size:clamp(1rem,1.3vw,1.125rem);line-height:1.6;max-width:510px;margin:26px auto 0;color:var(--sec);text-wrap:balance}
.capital-line-field{position:relative;width:100%;height:86px;margin-top:48px;pointer-events:none;color:var(--ink);opacity:.8}
.capital-structure{position:absolute;width:1000px;max-width:none;height:420px;left:50%;bottom:-55px;transform:translateX(-50%);overflow:visible}
.capital-fragment{opacity:1;transform:translate(0,0) rotate(0);transform-origin:center;transform-box:fill-box}
.capital-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;margin-top:30px}
.capital-continue{border:0;font-size:.875rem;gap:24px;padding:14px 0;min-height:44px}
.capital-continue span{color:var(--sec);font-size:1.25rem}
.intro-control{border:0;background:none;color:var(--sec);font:400 .875rem/1.4 var(--sans);padding:14px 0;min-height:44px;text-align:left}
.intro-control:hover{color:var(--ink)}
.intro-ready .capital-fragment{transform:translateY(-190px)}
.intro-ready .capital-copy{opacity:0}
.intro-playing .capital-fragment{animation:capital-line-open 5.5s cubic-bezier(.4,0,.2,1) var(--delay) both}
.intro-playing .capital-copy h1{animation:capital-title-in 1.2s cubic-bezier(.2,.65,.3,1) 3.15s both}
.intro-playing .capital-copy p{animation:capital-copy-in .85s ease 5.5s both}
/* Keep the whole headline present to assistive technology throughout. */
@keyframes capital-line-open{0%,11%{transform:translate(0,-190px) rotate(0);opacity:1}30%,68%{transform:translate(calc(var(--dx) * var(--line-spread,1)),var(--dy)) rotate(var(--dr));opacity:.55}96%,100%{transform:translate(0,0) rotate(0);opacity:1}}
@keyframes capital-title-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes capital-copy-in{from{opacity:0}to{opacity:1}}
@media(max-width:760px){.capital-hero{padding:60px 0 20px;min-height:calc(100svh - 76px)}.capital-copy{padding:0 6px;max-width:100%}.capital-copy h1{font-size:clamp(2.1rem,7.4vw,3.35rem);letter-spacing:-.032em;line-height:1.12}.capital-copy p{font-size:1.0625rem;max-width:33ch;margin-top:24px}.hero-wide-break{display:none}.capital-line-field{margin-top:44px;height:74px}.capital-structure{width:700px;height:294px;bottom:-39px}.capital-footer{margin-top:25px;gap:12px}.intro-control,.capital-continue{font-size:.8125rem}.capital-continue{gap:16px}}
@media(max-width:390px){.capital-copy h1{font-size:clamp(1.9rem,8.1vw,2.1rem)}.capital-copy p{max-width:29ch}.capital-structure{width:640px;height:269px;bottom:-35px}}
@media(prefers-reduced-motion:reduce){
 .capital-hero:not(.intro-explicit) .capital-fragment,.capital-hero:not(.intro-explicit) .capital-copy h1,.capital-hero:not(.intro-explicit) .capital-copy p{animation:none!important;transform:none!important;opacity:1!important}
 .intro-ready .capital-copy{opacity:1}
 .intro-explicit.intro-playing .capital-fragment{animation:capital-line-open 5.5s cubic-bezier(.4,0,.2,1) var(--delay) both!important}
 .intro-explicit.intro-playing .capital-copy h1{animation:capital-title-in 1.2s cubic-bezier(.2,.65,.3,1) 3.15s both!important}
 .intro-explicit.intro-playing .capital-copy p{animation:capital-copy-in .85s ease 5.5s both!important}
}
@media print{.capital-hero{min-height:0;padding:35px 0}.capital-footer,.capital-line-field{display:none}.capital-copy,.capital-copy h1,.capital-copy p{animation:none!important;opacity:1!important;transform:none!important}}
/* Reflow at enlarged text settings; preserve every word and both controls. */
.capital-copy,.capital-copy h1,.capital-copy p{min-width:0;overflow-wrap:anywhere}
.capital-footer{flex-wrap:wrap}
.intro-control,.capital-continue{max-width:100%;overflow-wrap:anywhere}

.intro-paused .capital-fragment,.intro-paused .capital-copy h1,.intro-paused .capital-copy p{animation-play-state:paused!important}


/* Site typography and full viewport stage; all reference styling is home-scoped. */
.home-main .capital-hero{box-sizing:border-box;min-height:calc((100vh - 76px) / .9);min-height:calc((100dvh - 76px) / .9);background:var(--bg);padding:60px max(32px,6vw) 28px;margin:0}
.capital-copy{max-width:100%;width:100%;padding:0}
.capital-copy h1{font-family:var(--serif);font-size:calc(clamp(2.6rem,5.25vw,4.7rem) / .9);font-weight:400;line-height:1.1;letter-spacing:-.041em;color:var(--ink);max-width:none;margin:0 auto}
.capital-copy .capital-caption{font-family:var(--sans);font-size:calc(clamp(1rem,1.3vw,1.125rem) / .9);letter-spacing:normal;max-width:none;color:var(--ink)}
.capital-footer{position:relative;z-index:3}
.capital-continue{display:inline-flex;align-items:center;font-family:var(--sans);color:var(--ink);margin-left:auto}
.capital-hero a:focus-visible,.capital-hero button:focus-visible{outline:1px solid var(--ink);outline-offset:5px}
.capital-brand-flight{position:fixed;z-index:60;pointer-events:none;white-space:nowrap;transform-origin:0 0;background:var(--bg);color:var(--ink)}
.home-brand-hidden{opacity:0}
html.home-intro-pending:not(.home-brand-arrived) header.site .wrap.in{visibility:hidden}
html.home-intro-pending .scroller-mark{visibility:hidden}
#contents{scroll-margin-top:76px}
#contents .eyebrow h2{margin:0}
/* Content-sized cards use the shared editorial layout and a compact section rhythm. */
.home-main > #contents{padding:126px 0 72px}
.home-main > #firm{padding:clamp(28px,3.5vw,48px) 0}
#firm .lay-body > p{max-width:none}
.home-contents li:first-child a{padding-top:0}
.home-contents li:last-child a{padding-bottom:0;border-bottom:0}
.home-contents ol{list-style:none;padding:0;margin:0}
.home-contents li a{display:grid;grid-template-columns:35px 1fr 20px;gap:20px;align-items:center;border-bottom:1px solid var(--rule);padding:20px 0;font-size:24px}
.home-contents li span{font-size:14px;color:var(--sec)}
.home-contents li a > span:first-child{font-size:20px}
.home-contents li span[aria-hidden="true"]{font-size:21px;font-weight:500;color:var(--ink)}
.home-contents li a:hover{color:var(--sec)}
@media(max-width:900px){
.home-main .capital-hero{padding:45px 24px 24px}
.home-contents li a{font-size:21px}
/* The hero is sized to the small viewport, so when the address bar retracts the
   viewport grows past it and the jaali wash shows in the strip underneath. The
   hero keeps its height — dropping the wash to the large viewport's floor means
   the opening screen is cream wherever the browser chrome happens to sit. vh
   first for anything without lvh: on mobile it already measures the tall one. */
main.jaali.home-main::before{top:calc((100vh - 76px) / .9)}
main.jaali.home-main::before{top:calc((100lvh - 76px) / .9)}
/* Centring the hero's stack left ~126px idling under the two controls against
   24px of floor. An auto top margin spends that slack above the footer instead,
   settling it on the hero's floor; the scene keeps a 25px margin of its own so
   the controls cannot ride up into the line field at large text settings. */
.capital-scene{margin-bottom:25px}
.capital-footer{margin-top:auto}
}
/* Compensate for the site's .9 main zoom to match the reference's visible sizes. */
@media(max-width:760px){
.capital-copy h1{font-size:calc(clamp(2.1rem,7.4vw,3.35rem) / .9);letter-spacing:-.032em;line-height:1.12}
.capital-copy .capital-caption{font-size:calc(1.0625rem / .9)}
}
@media(max-width:390px){.capital-copy h1{font-size:calc(clamp(1.9rem,8.1vw,2.1rem) / .9)}}
/* Keep the mobile fragment envelope inside roughly the central 80% of the screen. */
@media(max-width:760px){
  .home-main .capital-hero{min-height:calc((100vh - 76px) / .9);min-height:calc((100dvh - 76px) / .9)}
  .capital-structure{--line-spread:.25;width:calc(92vw / .9);height:auto;aspect-ratio:1000 / 420;bottom:calc(-5vw / .9)}
}
