/* ==========================================================================
   Adv. Helee K. Thaker — design system
   Midnight navy + ivory surfaces, antique gold used only as accent.
   Restrained skeuomorphism: raised plates, recessed wells, brass hardware.
   ========================================================================== */

@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:Manrope;src:url(../fonts/manrope-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url(../fonts/manrope-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Manrope;src:url(../fonts/manrope-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}

:root{
  /* colour */
  --navy:#101C2C; --navy-2:#16263A; --navy-3:#1E3149; --charcoal:#20252D;
  --gold:#B99A5B; --gold-deep:#8C7238; --champagne:#D7C39A;
  --ivory:#F7F4ED; --ivory-2:#EFEADF; --paper:#FBF9F4; --white:#FFFFFF;
  --ink:#1A2230; --ink-soft:#4A505A; --grey:#777B80; --rule:#DCD3C1;
  /* type */
  --serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:Manrope,"Segoe UI",system-ui,-apple-system,sans-serif;
  --step--1:clamp(.84rem,.82rem + .1vw,.9rem);
  --step-0:clamp(1rem,.97rem + .15vw,1.0625rem);
  --step-1:clamp(1.25rem,1.15rem + .45vw,1.5rem);
  --step-2:clamp(1.6rem,1.4rem + .9vw,2.15rem);
  --step-3:clamp(2.05rem,1.7rem + 1.6vw,3rem);
  --step-4:clamp(2.6rem,1.9rem + 3.2vw,4.75rem);
  /* space (8pt) */
  --s1:.5rem; --s2:1rem; --s3:1.5rem; --s4:2rem; --s5:3rem; --s6:4.5rem; --s7:6.5rem;
  /* radii: tight on hardware, softer on plates */
  --r-hw:3px; --r-plate:10px; --r-frame:6px;
  /* depth */
  --lift-1:0 1px 0 rgba(255,255,255,.9) inset,0 1px 2px rgba(16,28,44,.06),0 8px 20px -12px rgba(16,28,44,.28);
  --lift-2:0 1px 0 rgba(255,255,255,.9) inset,0 2px 4px rgba(16,28,44,.06),0 22px 40px -22px rgba(16,28,44,.45);
  --well:inset 0 2px 5px rgba(16,28,44,.10),inset 0 0 0 1px rgba(16,28,44,.05),0 1px 0 rgba(255,255,255,.8);
  --brass:linear-gradient(180deg,#E7D6AE 0%,#CBB07A 22%,#B99A5B 50%,#A3864A 78%,#C9AE77 100%);
  --ease:cubic-bezier(.2,.7,.2,1);
  --measure:68ch;
  --wrap:1200px;
  --bp-md:820px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{margin:0;font-family:var(--sans);font-size:var(--step-0);line-height:1.65;color:var(--ink);background:var(--ivory);
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
/* faint laid-paper texture on ivory surfaces */
.paper{background-color:var(--ivory);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .3 0 0 0 0 .2 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-decoration-color:rgba(140,114,56,.55);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-color:var(--gold-deep)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:0;z-index:100;background:var(--navy);color:var(--ivory);padding:.75rem 1rem}
.skip:focus{left:1rem;top:1rem}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.12;letter-spacing:-.005em;color:var(--navy);margin:0 0 var(--s2)}
h1{font-size:var(--step-4)}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-2);line-height:1.2}
h4{font-family:var(--sans);font-size:var(--step-0);font-weight:600;margin:0 0 .4rem}
p{margin:0 0 var(--s2);max-width:var(--measure)}
.lede{font-size:var(--step-1);line-height:1.55;color:var(--ink-soft);font-family:var(--serif);font-weight:500}
.small{font-size:var(--step--1);color:var(--ink-soft)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(1.1rem,4vw,2.5rem)}
section{padding:var(--s7) 0}
.on-navy{background:var(--navy);color:#E9E4D8}
.on-navy h1,.on-navy h2,.on-navy h3{color:var(--ivory)}
.on-navy a{color:var(--champagne)}
.on-navy .lede,.on-navy .small{color:#C9C4B8}

/* ---------- hardware: buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.6rem;min-height:48px;padding:.75rem 1.35rem;border-radius:var(--r-hw);
  font:600 var(--step--1)/1 var(--sans);letter-spacing:.02em;text-decoration:none;cursor:pointer;border:0;
  transition:transform .12s var(--ease),box-shadow .12s var(--ease),filter .2s}
.btn svg{width:18px;height:18px;flex:none}
.btn-brass,.on-navy a.btn-brass,a.btn-brass{color:#1b1407;background:var(--brass);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 -1px 0 rgba(0,0,0,.18) inset,0 1px 0 #6f5a2a,0 3px 0 #5b4a22,0 8px 16px -6px rgba(0,0,0,.45);
  text-shadow:0 1px 0 rgba(255,255,255,.35)}
.btn-brass:hover{filter:brightness(1.04)}
.btn-brass:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 -1px 0 rgba(0,0,0,.2) inset,0 1px 0 #5b4a22,0 3px 8px -4px rgba(0,0,0,.5)}
.btn-ghost,.on-navy a.btn-ghost{color:var(--ivory);background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
  box-shadow:0 0 0 1px rgba(215,195,154,.45) inset,0 1px 0 rgba(255,255,255,.08) inset}
.btn-ghost:hover{box-shadow:0 0 0 1px var(--champagne) inset}
.btn-ghost:active{transform:translateY(1px)}
.btn-ink,a.btn-ink{color:var(--ivory);background:linear-gradient(180deg,#22354f,#132134);
  box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 2px 0 #0a121d,0 8px 16px -8px rgba(16,28,44,.6)}
.btn-ink:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(255,255,255,.1) inset,0 2px 6px -3px rgba(0,0,0,.6)}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s2)}

/* ---------- surfaces ---------- */
.plate{background:linear-gradient(180deg,var(--paper),#F3EFE6);border:1px solid #E3DBCB;border-radius:var(--r-plate);box-shadow:var(--lift-1)}
.well{background:var(--ivory-2);border-radius:var(--r-plate);box-shadow:var(--well)}
.frame{position:relative;border-radius:var(--r-frame);padding:8px;background:linear-gradient(145deg,#2a3b52,#0d1724);
  box-shadow:0 0 0 1px rgba(215,195,154,.35) inset,0 30px 50px -28px rgba(0,0,0,.7)}
.frame img{border-radius:3px;width:100%;height:100%;object-fit:cover}
.frame--light{background:linear-gradient(145deg,#fffdf8,#e9e2d3);box-shadow:0 0 0 1px #d9cfbb inset,var(--lift-2)}
.rule-gold{height:1px;border:0;background:linear-gradient(90deg,var(--gold),rgba(185,154,91,0));margin:var(--s3) 0}

/* ---------- brass nameplate (signature element) ---------- */
.nameplate{position:relative;width:min(360px,100%);padding:1.6rem 1.8rem 1.5rem;border-radius:4px;color:#2b210d;text-align:center;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 1px,rgba(0,0,0,.035) 1px 2px,transparent 2px 4px),
    linear-gradient(170deg,#EBDDB8 0%,#D2B983 30%,#BE9F61 55%,#A98B4E 80%,#C7AC76 100%);
  box-shadow:0 0 0 1px #7d6630,0 0 0 4px #1a1408,0 0 0 5px rgba(215,195,154,.35),0 1px 0 6px rgba(0,0,0,.2),0 26px 40px -16px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 3px rgba(80,60,20,.35)}
.nameplate::before,.nameplate::after{content:"";position:absolute;top:10px;width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff6dc,#b99a5b 45%,#6b5626 100%);box-shadow:0 1px 1px rgba(0,0,0,.4)}
.nameplate::before{left:10px}.nameplate::after{right:10px}
.nameplate .screws::before,.nameplate .screws::after{content:"";position:absolute;bottom:10px;width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff6dc,#b99a5b 45%,#6b5626 100%);box-shadow:0 1px 1px rgba(0,0,0,.4)}
.nameplate .screws::before{left:10px}.nameplate .screws::after{right:10px}
.engraved{color:#3a2c10;text-shadow:0 1px 0 rgba(255,244,214,.75),0 -1px 0 rgba(70,52,16,.35)}
.np-role{font:600 .72rem/1 var(--sans);letter-spacing:.32em;text-transform:uppercase;margin:0 0 .55rem}
.np-name{font:600 clamp(1.7rem,1.3rem + 1.4vw,2.2rem)/1.05 var(--serif);margin:0 0 .5rem}
.np-meta{font:500 .82rem/1.45 var(--sans);letter-spacing:.04em;margin:0;max-width:none}
.np-rule{height:1px;margin:.7rem auto;width:60%;background:linear-gradient(90deg,transparent,rgba(58,44,16,.55),transparent);box-shadow:0 1px 0 rgba(255,244,214,.6)}

/* ---------- header ---------- */
.topbar{background:#0B1420;color:#BDB6A6;font-size:.82rem}
.topbar .wrap{display:flex;justify-content:space-between;gap:1rem;min-height:36px;align-items:center}
.topbar a{color:#D9CBA6;text-decoration:none}
.topbar a:hover{text-decoration:underline}
.topbar .tb-right{display:flex;gap:1.4rem}
.site-header{position:sticky;top:0;z-index:50;background:rgba(16,28,44,.97);
  box-shadow:0 1px 0 rgba(215,195,154,.18),0 10px 24px -18px rgba(0,0,0,.8)}
@supports (backdrop-filter:blur(8px)){.site-header{background:rgba(16,28,44,.9);backdrop-filter:blur(8px)}}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:1rem}
.brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;color:var(--ivory)}
.brand picture{flex:none;display:block;line-height:0}
.brand-mark{height:52px;width:auto}
.brand-name{font:600 1.32rem/1 var(--serif);letter-spacing:.14em;text-transform:uppercase;display:block;white-space:nowrap}
.brand-sub{display:block;font:500 .7rem/1 var(--sans);letter-spacing:.06em;color:var(--champagne);margin-top:.4rem}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.2rem}
.nav a{display:block;padding:.65rem .8rem;color:#E4DED0;text-decoration:none;font-size:.92rem;font-weight:500;border-radius:var(--r-hw);position:relative}
.nav a:hover{color:var(--white);background:rgba(255,255,255,.05)}
.nav a[aria-current="page"],.nav a.is-section{color:var(--champagne)}
.nav a[aria-current="page"]::after,.nav a.is-section::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.3rem;height:1px;background:var(--gold)}
.nav-toggle{display:none;background:none;border:0;color:var(--ivory);width:48px;height:48px;border-radius:var(--r-hw);cursor:pointer;box-shadow:0 0 0 1px rgba(215,195,154,.35) inset}
.nav-toggle svg{width:22px;height:22px;margin:auto}
@media (max-width:1040px){
  .nav-toggle{display:grid}
  .nav{position:fixed;inset:76px 0 auto 0;background:var(--navy);max-height:0;overflow:hidden;transition:max-height .35s var(--ease);box-shadow:0 20px 30px -10px rgba(0,0,0,.6)}
  .nav.open{max-height:calc(100vh - 76px);overflow:auto}
  .nav ul{flex-direction:column;padding:.5rem clamp(1.1rem,4vw,2.5rem) 1.5rem}
  .nav a{padding:1rem .2rem;border-bottom:1px solid rgba(215,195,154,.12);font-size:1.05rem;border-radius:0}
  .nav a[aria-current="page"]::after,.nav a.is-section::after{display:none}
  .topbar .tb-left{display:none}
}
@media (max-width:420px){.brand-sub{display:none}.brand-name{font-size:1.12rem;letter-spacing:.1em}}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:clamp(3.5rem,8vw,7rem) 0 clamp(4rem,8vw,7rem);
  background:
    linear-gradient(90deg,rgba(215,195,154,.06) 1px,transparent 1px) 0 0/88px 100%,
    radial-gradient(120% 90% at 85% 10%,#1d3048 0%,var(--navy) 55%,#0b1420 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:linear-gradient(180deg,rgba(185,154,91,.0),rgba(185,154,91,.18));border-top:1px solid rgba(185,154,91,.35)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero-kicker{font:500 1rem/1.4 var(--serif);font-style:italic;color:var(--champagne);margin-bottom:var(--s3)}
.hero h1{max-width:14ch;margin-bottom:var(--s3)}
.hero .lede{max-width:48ch;margin-bottom:var(--s4)}
.hero-visual{position:relative;justify-self:end;width:100%;max-width:470px}
.hero-visual .frame{aspect-ratio:4/4.6}
.hero-visual .nameplate{position:absolute;left:-14%;bottom:-8%}
.hero-facts{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid rgba(215,195,154,.2);font-size:.9rem;color:#C9C4B8}
.hero-facts span{display:flex;align-items:center;gap:.5rem}
.hero-facts svg{width:16px;height:16px;color:var(--gold)}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero-visual{justify-self:start;max-width:520px;margin-top:var(--s3)}
  .hero-visual .frame{aspect-ratio:16/11}
  .hero-visual .nameplate{left:auto;right:-4%;bottom:-12%;width:min(300px,80%)}
}
@media (max-width:560px){.hero-visual .nameplate{position:relative;right:auto;left:auto;bottom:auto;margin:-3rem auto 0;width:88%}}
@media (prefers-reduced-motion:no-preference){
  .hero .nameplate{animation:settle .9s .25s var(--ease) both}
  @keyframes settle{from{opacity:0;transform:translateY(14px) rotate(-.6deg)}to{opacity:1;transform:none}}
}

/* ---------- page header (inner pages) ---------- */
.page-head{padding:clamp(2.75rem,6vw,4.5rem) 0 clamp(2.5rem,5vw,3.75rem);background:
  linear-gradient(90deg,rgba(215,195,154,.05) 1px,transparent 1px) 0 0/88px 100%,linear-gradient(180deg,var(--navy),#0e1928)}
.page-head h1{font-size:var(--step-4);max-width:20ch;margin-bottom:var(--s2)}
.page-head .lede{max-width:56ch;margin:0}
.crumbs{font-size:.85rem;margin-bottom:var(--s3);color:#B9B3A5}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.crumbs li+li::before{content:"/";margin-right:.35rem;color:rgba(215,195,154,.5)}
.crumbs a{color:#D9CBA6;text-decoration:none}
.crumbs a:hover{text-decoration:underline}

/* ---------- layout helpers ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,5rem);align-items:center}
.split--wide{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:start}
@media (max-width:860px){.split,.split--wide{grid-template-columns:1fr}}
.section-head{max-width:60ch;margin-bottom:var(--s5)}
.section-head p{color:var(--ink-soft)}

/* ---------- practice index: three recessed drawers ---------- */
.drawers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
@media (max-width:980px){.drawers{grid-template-columns:1fr}}
.drawer{padding:var(--s4) var(--s3) var(--s3);display:flex;flex-direction:column}
.drawer-head{display:flex;gap:.9rem;align-items:flex-start;margin-bottom:var(--s3)}
.drawer-icon{width:46px;height:46px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,#22344c,#0f1a29);box-shadow:0 0 0 1px rgba(185,154,91,.6) inset,0 4px 8px -4px rgba(0,0,0,.5)}
.drawer-icon svg{width:22px;height:22px;color:var(--champagne)}
.drawer h3{font-size:var(--step-2);margin:0 0 .3rem}
.drawer-head p{font-size:.92rem;color:var(--ink-soft);margin:0}
.drawer ul{list-style:none;margin:0;padding:var(--s1) var(--s2);border-radius:8px;background:var(--ivory-2);box-shadow:var(--well);flex:1}
.drawer li+li{border-top:1px solid #DDD5C4}
.drawer li a{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem .2rem;text-decoration:none;color:var(--ink);font-weight:500;font-size:.96rem}
.drawer li a::after{content:"";width:7px;height:7px;flex:none;border-right:1.5px solid var(--gold-deep);border-top:1.5px solid var(--gold-deep);transform:rotate(45deg);opacity:.6;transition:transform .2s var(--ease),opacity .2s}
.drawer li a:hover{color:var(--navy)}
.drawer li a:hover::after{opacity:1;transform:translateX(3px) rotate(45deg)}

/* practice overview page cards (with description) */
.area-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--s2)}
.area-card{display:block;padding:var(--s3);text-decoration:none;color:inherit;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.area-card h3{font-size:1.45rem;margin:0 0 .4rem}
.area-card p{font-size:.94rem;color:var(--ink-soft);margin:0}
.area-card:hover{transform:translateY(-2px);box-shadow:var(--lift-2)}
.area-card:active{transform:translateY(0);box-shadow:var(--well)}
.group-block+.group-block{margin-top:var(--s6)}
.group-block>header{display:flex;gap:1rem;align-items:center;margin-bottom:var(--s3);padding-bottom:var(--s2);border-bottom:1px solid var(--rule)}

/* ---------- advocate band ---------- */
.medallion{width:min(300px,70vw);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;margin-inline:auto;
  background:radial-gradient(circle at 35% 28%,#24384f,#0d1724 70%);
  box-shadow:0 0 0 2px #0a121d,0 0 0 9px #b99a5b,0 0 0 10px #6f5a2a,0 0 0 18px #13202f,0 0 0 19px rgba(215,195,154,.35),0 40px 60px -30px rgba(0,0,0,.8)}
.medallion picture{width:66%;line-height:0}.medallion img{width:100%;height:auto}
.portrait{max-width:380px;margin-inline:auto}
.portrait .frame{aspect-ratio:4/5}
.creds{display:grid;gap:.1rem;margin:var(--s3) 0;padding:0;list-style:none}
.creds li{display:grid;grid-template-columns:9.5rem 1fr;gap:1rem;padding:.7rem 0;border-bottom:1px solid rgba(215,195,154,.18)}
.creds dt,.creds .k{color:var(--champagne);font-size:.9rem}
.plate .creds li{border-bottom-color:var(--rule)}
.plate .creds .k{color:var(--gold-deep)}
@media (max-width:520px){.creds li{grid-template-columns:1fr;gap:.1rem}}

/* ---------- approach ---------- */
.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5) var(--s4)}
@media (max-width:900px){.principles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.principles{grid-template-columns:1fr}}
.principle{padding-top:var(--s2);border-top:1px solid var(--gold)}
.principle h3{font-size:1.55rem;margin-bottom:.4rem}
.principle p{color:var(--ink-soft);font-size:.97rem;margin:0}

/* ---------- articles ---------- */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
@media (max-width:900px){.posts{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.posts{grid-template-columns:1fr}}
.post{display:flex;flex-direction:column;overflow:hidden;text-decoration:none;color:inherit;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.post:hover{transform:translateY(-2px);box-shadow:var(--lift-2)}
.post-img{aspect-ratio:16/9;overflow:hidden;background:var(--navy)}
.post-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.post-body{padding:var(--s3);display:flex;flex-direction:column;gap:.4rem;flex:1}
.post-cat{font-size:.82rem;color:var(--gold-deep);font-weight:600}
.post h3{font-size:1.5rem;margin:0}
.post p{font-size:.93rem;color:var(--ink-soft);margin:0}
.post time{margin-top:auto;padding-top:.6rem;font-size:.82rem;color:var(--grey)}

/* ---------- FAQ (native details) ---------- */
.faq{max-width:860px}
.faq-wrap h2{max-width:none}
.faq details{border-bottom:1px solid var(--rule)}
.faq details:first-of-type{border-top:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1.5rem;align-items:center;padding:1.25rem 0;
  font:500 1.35rem/1.3 var(--serif);color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;
  background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238C7238' stroke-width='2'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/14px no-repeat;
  box-shadow:var(--lift-1);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .answer{padding:0 0 1.4rem;color:var(--ink-soft)}
.on-navy .faq summary{color:var(--ivory)}

/* ---------- office / contact ---------- */
.office{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:0;overflow:hidden}
@media (max-width:860px){.office{grid-template-columns:1fr}}
.office-info{padding:var(--s5) var(--s4)}
.office-map{position:relative;min-height:340px;background:#1b2a3d}
.contact-lines{list-style:none;padding:0;margin:var(--s3) 0}
.contact-lines li{display:flex;gap:.9rem;align-items:flex-start;padding:.85rem 0;border-bottom:1px solid var(--rule)}
.contact-lines svg{width:20px;height:20px;flex:none;color:var(--gold-deep);margin-top:.2rem}
.contact-lines a{font-weight:600}
.map-facade{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--ivory);padding:2rem;
  background:
    linear-gradient(0deg,rgba(16,28,44,.55),rgba(16,28,44,.55)),
    repeating-linear-gradient(0deg,transparent 0 46px,rgba(215,195,154,.10) 46px 47px),
    repeating-linear-gradient(90deg,transparent 0 46px,rgba(215,195,154,.10) 46px 47px),
    linear-gradient(135deg,#22354d,#14212f)}
.map-facade p{color:#D8D2C4;font-size:.9rem;margin:0 auto var(--s2)}
.map-pin{width:44px;height:44px;margin:0 auto var(--s2);color:var(--gold)}
.office-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- article / practice page body ---------- */
.doc{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(2rem,5vw,4.5rem);align-items:start}
@media (max-width:980px){.doc{grid-template-columns:1fr}}
.prose{max-width:72ch}
.prose h2{font-size:var(--step-2);margin-top:var(--s5)}
.prose h2:first-child{margin-top:0}
.prose ul{padding-left:1.1rem;margin:0 0 var(--s3)}
.prose li{margin:.35rem 0;padding-left:.3rem}
.prose li::marker{color:var(--gold-deep)}
.answer-box{padding:var(--s3) var(--s3) var(--s3) calc(var(--s3) + 4px);position:relative;margin-bottom:var(--s5)}
.answer-box::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:0 2px 2px 0;background:var(--brass)}
.answer-box p{font-family:var(--serif);font-size:1.32rem;line-height:1.5;color:var(--navy);margin:0}
.answer-box .k{display:block;font:600 .82rem/1 var(--sans);color:var(--gold-deep);margin-bottom:.6rem}
.steps{list-style:none;counter-reset:s;padding:0;margin:0 0 var(--s3)}
.steps li{counter-increment:s;position:relative;padding:0 0 var(--s3) 3.4rem;margin:0}
.steps li::before{content:counter(s);position:absolute;left:0;top:-.15rem;width:2.2rem;height:2.2rem;border-radius:50%;display:grid;place-items:center;
  font:600 1.05rem/1 var(--serif);color:var(--navy);background:var(--paper);box-shadow:var(--lift-1),0 0 0 1px var(--champagne) inset}
.steps li:not(:last-child)::after{content:"";position:absolute;left:1.1rem;top:2.3rem;bottom:.4rem;width:1px;background:var(--rule)}
.steps strong{display:block;font-weight:600;margin-bottom:.15rem}
.steps p{margin:0;color:var(--ink-soft)}
.lawbox{padding:var(--s3)}
.lawbox h2{font-size:1.5rem;margin:0 0 var(--s2)!important}
.lawbox ul{margin:0}
.aside{display:grid;gap:var(--s3)}
@media (max-width:980px){.aside{position:static}}
.aside .plate{padding:var(--s3)}
.aside h2{font-size:1.45rem;margin-bottom:.6rem}
.aside ul{list-style:none;margin:0;padding:0}
.aside li a{display:block;padding:.55rem 0;border-bottom:1px solid var(--rule);text-decoration:none;font-weight:500;font-size:.95rem}
.aside .frame{aspect-ratio:4/3}
.meta-line{font-size:.85rem;color:var(--ink-soft);margin-top:var(--s5);padding-top:var(--s2);border-top:1px solid var(--rule)}
.notice{font-size:.88rem;color:var(--ink-soft);padding:var(--s2) var(--s3);margin-top:var(--s3)}

/* ---------- forms ---------- */
.form{display:grid;gap:var(--s3)}
.field{display:grid;gap:.4rem}
.field label{font-weight:600;font-size:.92rem}
.field .hint{font-size:.83rem;color:var(--ink-soft)}
.field input,.field select,.field textarea{font:inherit;color:var(--ink);width:100%;padding:.8rem .9rem;min-height:48px;border-radius:6px;border:1px solid #CFC5B1;background:#FDFBF7;box-shadow:inset 0 2px 3px rgba(16,28,44,.07)}
.field textarea{min-height:140px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold-deep)}
.field [aria-invalid="true"]{border-color:#9b2c2c}
.field .err{color:#9b2c2c;font-size:.85rem;min-height:1em}
.two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
@media (max-width:620px){.two{grid-template-columns:1fr}}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.92rem}
.check input{width:20px;height:20px;margin-top:.15rem;accent-color:var(--navy)}
.hp{position:absolute;left:-5000px}
.form-status{padding:var(--s2) var(--s3);border-radius:6px;font-weight:500}
.form-status[data-state="ok"]{background:#E9F1E6;color:#22461b;box-shadow:inset 0 0 0 1px #b9cfb0}
.form-status[data-state="error"]{background:#F6E7E4;color:#7b221b;box-shadow:inset 0 0 0 1px #e0bdb6}

/* ---------- footer ---------- */
.site-footer{background:#0B1420;color:#B8B2A4;padding:var(--s6) 0 var(--s4);font-size:.93rem}
.site-footer a{color:#DCD3BE;text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1.2fr 1.2fr;gap:var(--s4)}
@media (max-width:980px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}
.site-footer h2{font:600 1rem/1.3 var(--sans);color:var(--ivory);margin:0 0 var(--s2)}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{padding:.25rem 0}
.foot-logo{width:190px;height:auto;margin-bottom:var(--s2)}
.foot-brand .brand-name{color:var(--ivory)}
.foot-legal{margin-top:var(--s5);padding-top:var(--s3);border-top:1px solid rgba(215,195,154,.15);display:grid;gap:var(--s2);font-size:.84rem}
.foot-legal p{max-width:none;margin:0}
.foot-legal nav{display:flex;flex-wrap:wrap;gap:1.2rem}

/* ---------- disclaimer dialog ---------- */
dialog.disclaimer{max-width:620px;width:calc(100% - 2rem);border:0;padding:0;border-radius:var(--r-plate);background:var(--paper);color:var(--ink);box-shadow:0 40px 80px -20px rgba(0,0,0,.6)}
dialog.disclaimer::backdrop{background:rgba(8,14,22,.72)}
.disclaimer-inner{padding:var(--s4)}
.disclaimer-inner h2{font-size:var(--step-2)}
.disclaimer-inner p{font-size:.95rem;color:var(--ink-soft)}
.disclaimer-inner .btn-row{margin-top:var(--s3)}

/* ---------- misc ---------- */
.legal-text{max-width:75ch}
.legal-text h2{font-size:var(--step-2);margin-top:var(--s5)}
.legal-text ul{padding-left:1.2rem}
.center{text-align:center}
.mt-4{margin-top:var(--s4)}
.tag-gold{color:var(--gold-deep)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.site-header,.topbar,.site-footer,.btn,dialog,.office-map{display:none!important}body{background:#fff}.page-head{background:none;color:#000}.page-head h1{color:#000}}
