/* ============================================================
   PASHA LEGAL — FULL SITE PREVIEW  ·  LIGHT EDITION
   "We handle the Law. You handle your life."
   Warm ivory + beige + grey, charcoal Cormorant serif, silver hairlines.
   Its own personality: hairline frames, generous air, asymmetric serif
   display, quiet luxury. Light, editorial, trustworthy. NO gold, NO black.
   ============================================================ */

:root{
  --bg:#f7f4ec;          /* warm ivory ground */
  --bg-2:#efe9dd;        /* beige band */
  --bg-3:#fbf9f3;        /* near-white panel */
  --paper:#fffdf8;       /* card / white */
  --ink:#23252a;         /* charcoal type */
  --ink-soft:rgba(35,37,42,.7);
  --ink-dim:rgba(35,37,42,.56);
  --ink-faint:rgba(35,37,42,.4);
  --silver:#8a8f97;      /* muted silver accent */
  --silver-deep:#6c727b;
  --line:rgba(35,37,42,.14);
  --line-soft:rgba(35,37,42,.08);
  --frame:rgba(108,114,123,.5);  /* hairline frame */
  --glass:rgba(255,253,248,.7);
  --shadow:0 30px 70px -34px rgba(35,30,18,.28);
  --shadow-sm:0 14px 36px -22px rgba(35,30,18,.3);
  --rad:18px;
  --rad-lg:26px;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Nunito Sans',-apple-system,sans-serif;
}

*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans); background:var(--bg); color:var(--ink);
  font-size:16.5px; line-height:1.72; font-weight:400; -webkit-font-smoothing:antialiased; overflow-x:hidden}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
::selection{background:var(--ink); color:var(--bg)}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px}
.wrap-narrow{max-width:820px; margin:0 auto; padding:0 28px}
h1,h2,h3,h4{font-family:var(--serif); font-weight:500; line-height:1.07; letter-spacing:.004em; color:var(--ink)}
h1 em,h2 em,h3 em{font-style:italic; color:var(--silver-deep)}
.kicker{font-family:var(--sans); font-size:.68rem; font-weight:700; letter-spacing:.34em; text-transform:uppercase; color:var(--silver-deep); margin-bottom:18px; display:flex; align-items:center; gap:.8em}
.kicker::before{content:""; width:26px; height:1px; background:var(--silver); display:inline-block}
.sec-center .kicker{justify-content:center}

.js-anim .reveal{opacity:0; transform:translateY(26px); transition:opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1)}
.js-anim .reveal.in{opacity:1; transform:none}
.js-anim .reveal[data-d="1"]{transition-delay:.1s}
.js-anim .reveal[data-d="2"]{transition-delay:.2s}
.js-anim .reveal[data-d="3"]{transition-delay:.3s}

/* ============ NAV ============ */
.nav{position:fixed; inset:16px 16px auto; z-index:60; transition:transform .45s cubic-bezier(.22,1,.36,1)}
.nav.hide{transform:translateY(-170%)}
.nav-inner{max-width:1180px; margin:0 auto; display:flex; align-items:center; gap:22px;
  padding:9px 12px 9px 22px; border-radius:4px;
  background:rgba(251,249,243,.82); backdrop-filter:blur(22px) saturate(1.3); -webkit-backdrop-filter:blur(22px) saturate(1.3);
  border:1px solid var(--line); box-shadow:0 12px 40px -22px rgba(35,30,18,.4)}
.nav .logo img{height:52px; width:auto}
.nav-links{display:flex; gap:4px; margin-left:auto; font-size:.84rem; font-weight:600; align-items:center}
.nav-links > a, .nav-item > a{display:inline-flex; align-items:center; gap:.35em; text-decoration:none; color:var(--ink-soft); transition:color .25s; padding:.5em .7em; border-radius:3px}
.nav-links > a:hover, .nav-item > a:hover{color:var(--ink)}
.nav-links a.active{color:var(--ink); box-shadow:inset 0 -2px 0 var(--silver)}
.nav-item{position:relative}
.nav-item > a .chev{width:12px;height:12px;opacity:.55;transition:transform .25s}
.nav-item:hover > a .chev{transform:rotate(180deg)}
.dropdown{position:absolute; top:calc(100% + 12px); left:50%; transform:translateX(-50%) translateY(8px);
  min-width:258px; background:var(--paper); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
  border:1px solid var(--line); border-radius:6px; padding:10px; opacity:0; visibility:hidden;
  transition:opacity .25s, transform .25s, visibility .25s; box-shadow:var(--shadow-sm)}
.nav-item:hover .dropdown{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0)}
.dropdown a{display:flex; flex-direction:column; gap:2px; padding:10px 14px; border-radius:4px; color:var(--ink-soft); transition:background .2s, color .2s}
.dropdown a:hover{background:var(--bg-2); color:var(--ink)}
.dropdown a strong{font-weight:700; font-size:.86rem; color:var(--ink)}
.dropdown a span{font-size:.72rem; color:var(--ink-faint)}
.nav-cta-group{display:flex; align-items:center; gap:8px}
@media(max-width:1080px){ .nav-links{display:none} .nav-cta-group{margin-left:auto} }
@media(max-width:600px){
  .nav-inner{gap:10px; padding:8px 10px 8px 16px}
  .nav-cta-group .btn{display:none}
  .nav .logo img{height:42px}
}

.btn{display:inline-flex; align-items:center; gap:.55em; padding:.92em 1.8em; border-radius:3px;
  font-family:var(--sans); font-weight:700; font-size:.88rem; letter-spacing:.01em; text-decoration:none; border:1px solid transparent; cursor:pointer;
  transition:transform .3s, background .3s, color .3s, box-shadow .3s, border-color .3s}
.btn-ink{background:var(--ink); color:var(--bg); box-shadow:0 16px 36px -18px rgba(35,37,42,.6)}
.btn-ink:hover{transform:translateY(-2px); background:#34373d}
.btn-ghost{background:transparent; color:var(--ink); border:1px solid var(--frame)}
.btn-ghost:hover{background:var(--paper); border-color:var(--ink)}
.btn-ai{background:var(--paper); color:var(--ink); border:1px solid var(--silver); box-shadow:0 12px 30px -20px rgba(35,30,18,.5)}
.btn-ai:hover{transform:translateY(-2px); border-color:var(--ink); background:#fff}
.btn-ai .spark{width:1.05em;height:1.05em;color:var(--silver-deep)}
.btn svg{width:1.02em; height:1.02em; flex:0 0 auto}

/* mobile drawer */
.burger{display:none; width:42px; height:42px; border-radius:4px; border:1px solid var(--line); background:var(--paper);
  align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto}
.burger svg{width:20px; height:20px; color:var(--ink)}
.drawer{position:fixed; inset:0; z-index:70; background:rgba(247,244,236,.99); backdrop-filter:blur(16px);
  transform:translateX(100%); transition:transform .4s cubic-bezier(.22,1,.36,1); padding:84px 28px 40px; overflow-y:auto}
.drawer.open{transform:none}
.drawer-close{position:absolute; top:24px; right:22px; width:44px; height:44px; border-radius:4px; border:1px solid var(--line);
  background:var(--paper); color:var(--ink); cursor:pointer; display:grid; place-items:center}
.drawer-close svg{width:22px; height:22px}
.drawer a{display:block; padding:14px 6px; font-family:var(--serif); font-size:1.6rem; border-bottom:1px solid var(--line-soft); color:var(--ink)}
.drawer a.sub{font-family:var(--sans); font-size:.95rem; padding:10px 18px; color:var(--ink-soft); border-bottom:none}
.drawer .grp{font-size:.64rem; font-weight:700; letter-spacing:.28em; text-transform:uppercase; color:var(--silver-deep); margin:24px 0 4px; padding:0 6px}
.drawer .btn{width:100%; justify-content:center; margin-top:16px}
@media(max-width:1080px){ .burger{display:flex} }

/* ============ HERO — video background + intake widget ============ */
/* shorter, widescreen hero band — less vertical zoom on the video = crisper, less pixelated */
.hero{position:relative; padding:150px 0 64px; overflow:hidden; background:var(--ink); min-height:0; height:clamp(560px,76vh,760px); display:flex; align-items:center; transition:height .5s ease}
@media(max-width:600px){ .hero{height:auto; min-height:600px; padding:128px 0 56px} }
/* when the search expands into a conversation, let the hero grow to fit (no clipping) */
body.hero-convo-open .hero{height:auto; min-height:clamp(560px,76vh,760px); overflow:visible; padding-bottom:96px}
/* darker, higher-contrast hero video — moody, cinematic backdrop for the glass search */
.hero .hero-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  filter:brightness(.66) contrast(1.12) saturate(1.04)}
/* dark veil — vignette + top/bottom fade so the centered glass + light type pop */
.hero .hero-veil{position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 42%, rgba(20,21,24,0) 0%, rgba(20,21,24,.28) 56%, rgba(18,19,22,.62) 100%),
    linear-gradient(180deg, rgba(18,19,22,.5) 0%, rgba(18,19,22,.16) 26%, rgba(18,19,22,.16) 70%, rgba(18,19,22,.66) 100%)}
.hero .hero-veil::after{content:""; position:absolute; inset:0; background:radial-gradient(70% 50% at 50% 48%, rgba(247,244,236,.06), transparent 70%)}
/* film grain overlay on top of the video — adds texture + hides compression artefacts */
.hero .hero-grain{position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.10; mix-blend-mode:overlay;
  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='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:160px 160px; animation:grainShift 1.6s steps(3) infinite}
@keyframes grainShift{0%{transform:translate(0,0)}33%{transform:translate(-3%,2%)}66%{transform:translate(2%,-2%)}100%{transform:translate(0,0)}}
@media(prefers-reduced-motion:reduce){ .hero .hero-grain{animation:none} }
/* soft scrim directly behind the headline text so it stays crisp even where the veil is thin */
.hero .wrap > div:first-child{position:relative}
@media(min-width:981px){ .hero h1, .hero .lede, .hero .ticks, .hero-rate{text-shadow:0 1px 18px rgba(247,244,236,.55)} }
.hero .wrap{position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; width:min(1180px,92vw)}
@media(max-width:980px){ .hero .wrap{grid-template-columns:1fr; gap:30px} }
.hero h1{font-size:clamp(2.7rem,5.6vw,4.6rem); max-width:15ch; letter-spacing:-.005em}
.hero .lede{margin:22px 0 26px; max-width:44ch; font-size:1.08rem; color:var(--ink-soft)}
.ticks{display:grid; gap:11px; margin-bottom:8px}
.tick{display:flex; gap:.7em; align-items:flex-start; font-size:.94rem; font-weight:600; color:var(--ink)}
.tick svg{width:17px; height:17px; color:var(--silver-deep); flex:0 0 auto; margin-top:.32em}

/* ============ CENTERED, SEARCH-FIRST HERO (DARK GLASS) ============ */
.hero .wrap.hero-center{display:flex; flex-direction:column; align-items:center; text-align:center; gap:0; max-width:900px}
.hero-center .hero-brand{margin-bottom:32px}
.hero-center .hero-tagline{font-family:var(--serif); font-size:clamp(2.3rem,5vw,3.9rem); color:#fdfbf6; margin-bottom:0; font-weight:400; font-style:normal; line-height:1.12; letter-spacing:-.008em; max-width:20ch; text-shadow:0 2px 30px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.3)}
.hero-center .hero-tagline .tl1{display:block}
.hero-center .hero-tagline .tl2{display:block; font-style:italic; color:#fff; opacity:.92}
.hero-center .hero-sub{margin:22px auto 0; max-width:52ch; color:rgba(255,255,255,.88); font-size:1.05rem; line-height:1.6; text-shadow:0 1px 16px rgba(0,0,0,.55)}
@media(max-width:600px){ .hero-center .hero-brand{margin-bottom:24px} .hero-center .hero-tagline{font-size:2rem} .hero-center .hero-sub{font-size:.98rem; margin-top:18px} }

/* ---- glassy premium search bar — ULTRA-THIN, STRONG GLASS EFFECT, GLOWING BORDER ---- */
.hero-search{position:relative; display:flex; align-items:center;
  width:min(680px,100%); margin:32px auto 0; padding:4px; border-radius:999px; cursor:text;
  /* super transparent, clear + sharp, only a whisper of blur */
  background:rgba(255,255,255,.03);
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
  border:1px solid rgba(255,255,255,.32);
  box-shadow:0 18px 50px -32px rgba(0,0,0,.5);
  transition:border-color .35s, background .35s}
.hero-search:hover{background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.42)}
/* no glow — keep it clear */
.hero-search .hs-glow{display:none}
.hero-search:focus-within{border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.05)}
/* centred placeholder/text; symmetric padding reserves room for the right-hand button */
.hero-search .hs-input{flex:1; min-width:0; border:none; background:transparent; font:inherit;
  font-size:1.3rem; font-weight:400; color:#fff; text-align:center; padding:9px 54px;
  letter-spacing:.005em; text-shadow:0 1px 12px rgba(0,0,0,.4);
  text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.hero-search .hs-input::placeholder{color:rgba(255,255,255,.72); font-weight:400}
.hero-search .hs-input:focus{outline:none}
/* transparent glass button, pinned right so it doesn't offset the centred text */
.hero-search .hs-go{position:absolute; right:5px; top:50%; transform:translateY(-50%); z-index:2;
  width:46px; height:46px; border:1px solid rgba(255,255,255,.3); cursor:pointer; border-radius:50%;
  background:rgba(255,255,255,.10); color:#fff; display:grid; place-items:center;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); transition:transform .25s, background .25s, border-color .25s}
.hero-search .hs-go:hover{background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.55); transform:translateY(-50%) scale(1.06)}
.hero-search .hs-go:active{transform:translateY(-50%) scale(.96)}
.hero-search .hs-go svg{width:19px; height:19px; stroke-width:2.2}
@media(max-width:600px){ .hero-search{padding:5px; margin:26px auto 0} .hero-search .hs-input{font-size:1rem; padding:11px 46px} .hero-search .hs-go{width:42px; height:42px} }

/* powered-by Pasha io tag */
.hs-by{display:inline-flex; align-items:center; gap:.55em; margin:16px auto 0;
  font-size:.78rem; letter-spacing:.04em; color:rgba(255,255,255,.72)}
.hs-by b{color:#fff; font-weight:700; letter-spacing:.01em}
.hs-by .hs-dot{width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.85);
  box-shadow:0 0 0 0 rgba(255,255,255,.5); animation:hsPulse 2.4s ease-in-out infinite}
@keyframes hsPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.45)}50%{box-shadow:0 0 0 5px rgba(255,255,255,0)}}
@media(prefers-reduced-motion:reduce){ .hero-search .hs-glow,.hs-by .hs-dot{animation:none} }

/* ---- the search bubble EXPANDS into a real chat window with an attached input ---- */
/* when a conversation starts, the seed bar collapses away */
.js-anim .hero-search.is-collapsed,
.hero-search.is-collapsed{height:0 !important; min-height:0; padding:0; margin:0 auto; opacity:0 !important;
  border-width:0; overflow:hidden; pointer-events:none;
  transition:opacity .3s ease, height .3s ease, margin .3s ease}
body.hero-convo-open .hs-by{opacity:0; height:0; margin:0; overflow:hidden; transition:opacity .3s, height .3s, margin .3s}

.hero-convo{width:min(680px,100%); margin:0 auto; height:0; overflow:hidden; opacity:0;
  transition:height .5s ease, opacity .4s ease, margin .4s ease; text-align:left; scroll-margin:120px 0}
.hero-convo.open{height:auto; opacity:1; margin:8px auto 56px}
/* the chat window — ultra-clear glass, minimal blur */
.hc-panel{display:flex; flex-direction:column; overflow:hidden;
  background:rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(4px) saturate(1.4); backdrop-filter:blur(4px) saturate(1.4);
  border:1px solid rgba(255,255,255,.35); border-radius:22px;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.55), 0 1px 0 rgba(255,255,255,.5) inset;
  animation:hcGrow .45s cubic-bezier(.22,1,.36,1)}
@keyframes hcGrow{from{transform:translateY(-8px) scale(.985); opacity:0}to{transform:none; opacity:1}}
/* header strip */
.hc-head{display:flex; align-items:center; gap:11px; padding:14px 18px; border-bottom:1px solid rgba(255,255,255,.16)}
.hc-head .hc-ava{width:34px; height:34px}
.hc-id strong{display:block; color:#fff; font-family:var(--sans); font-weight:700; font-size:.92rem; letter-spacing:.01em}
.hc-id span{display:block; color:rgba(255,255,255,.65); font-size:.72rem; letter-spacing:.02em}
/* scrolls with wheel / trackpad / touch — no visible scrollbar */
.hc-log{display:flex; flex-direction:column; gap:11px; height:min(56vh,460px); min-height:300px; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:16px 16px 12px; scrollbar-width:none; -ms-overflow-style:none}
.hc-log::-webkit-scrollbar{width:0; height:0; display:none}
.hc-msg{display:flex; gap:9px; align-items:flex-start; max-width:92%}
.hc-msg.me{align-self:flex-end; flex-direction:row-reverse}
.hc-ava{width:30px; height:30px; flex:0 0 auto; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.9); color:var(--ink); font-family:var(--serif); font-style:italic; font-weight:600; font-size:.95rem}
.hc-bub{padding:10px 14px; border-radius:14px; font-size:.95rem; line-height:1.5; color:#fff;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px)}
.hc-msg.me .hc-bub{background:rgba(253,251,246,.96); color:var(--ink); border-color:rgba(255,255,255,.3)}
.hc-bub.typing{display:inline-flex; gap:5px; align-items:center; padding:13px 15px}
.hc-bub.typing i{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.75); animation:hcDot 1.2s infinite ease-in-out}
.hc-bub.typing i:nth-child(2){animation-delay:.18s}.hc-bub.typing i:nth-child(3){animation-delay:.36s}
@keyframes hcDot{0%,80%,100%{opacity:.3; transform:translateY(0)}40%{opacity:1; transform:translateY(-3px)}}
.hc-chips{display:flex; flex-wrap:wrap; gap:8px; padding:2px 16px 6px}
.hc-chip{padding:.5em 1.05em; border-radius:999px; cursor:pointer; font:inherit; font-size:.84rem; color:#fff;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.28); transition:all .2s}
.hc-chip:hover{background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.5)}
.hc-cta{display:inline-block; margin-top:4px; padding:.6em 1.2em; border-radius:999px; font-size:.88rem; font-weight:700;
  background:#fdfbf6; color:var(--ink)}
.hc-cta:hover{background:#fff}
/* "Send an enquiry" button that pops up after a couple of exchanges */
.hc-enquiry{display:flex; justify-content:center; margin:14px 0 4px; animation:hcPop .45s cubic-bezier(.2,.8,.2,1)}
.hc-enquiry-btn{display:inline-flex; align-items:center; gap:.5em; padding:.8em 1.5em; border-radius:999px;
  font-size:.92rem; font-weight:700; text-decoration:none; background:#fdfbf6; color:var(--ink);
  box-shadow:0 14px 34px -12px rgba(0,0,0,.55); transition:transform .2s, background .2s}
.hc-enquiry-btn:hover{background:#fff; transform:translateY(-1px)}
.hc-enquiry-btn svg{width:17px; height:17px}
@keyframes hcPop{from{opacity:0; transform:translateY(8px) scale(.96)} to{opacity:1; transform:none}}
.hc-video{margin:8px 0; border-radius:12px; overflow:hidden; max-width:100%; aspect-ratio:16/9;
  box-shadow:0 8px 20px rgba(0,0,0,.3)}
.hc-video iframe{width:100%; height:100%; border:none}
/* attached input row at the foot of the window */
.hc-input{display:flex; align-items:center; gap:8px; padding:10px 10px 10px 18px; border-top:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.05)}
.hc-field{flex:1; min-width:0; border:none; background:transparent; outline:none; font:inherit; font-size:1rem;
  color:#fff; padding:8px 0}
.hc-field::placeholder{color:rgba(255,255,255,.6)}
.hc-field:disabled{opacity:.5}
.hc-send{flex:0 0 auto; width:42px; height:42px; border:1px solid rgba(255,255,255,.3); border-radius:50%; cursor:pointer;
  background:rgba(255,255,255,.12); color:#fff; display:grid; place-items:center; transition:background .25s, border-color .25s, transform .25s}
.hc-send:hover{background:rgba(255,255,255,.22); border-color:rgba(255,255,255,.55); transform:scale(1.05)}
.hc-send:disabled{opacity:.4; cursor:default}
.hc-send svg{width:18px; height:18px}
@media(prefers-reduced-motion:reduce){ .hc-bub.typing i{animation:none} .hc-panel{animation:none} }
/* prominent hero brand mark — makes the Pasha Legal logo clearly visible */
.hero-brand{margin-bottom:26px}
.hero-brand img{height:132px; width:auto; filter:drop-shadow(0 8px 28px rgba(0,0,0,.45))}
@media(max-width:980px){ .hero-brand img{height:108px} }
@media(max-width:600px){ .hero-brand img{height:92px} }

.hero-rate{display:inline-flex; align-items:center; gap:.7em; margin-bottom:22px; padding:.5em 1.1em .5em .9em;
  border-radius:3px; background:var(--paper); border:1px solid var(--line); font-size:.82rem; box-shadow:var(--shadow-sm)}
.hero-rate .stars{color:var(--silver-deep); letter-spacing:.1em}
.hero-rate b{color:var(--ink); font-weight:800}
.hero-rate span{color:var(--ink-soft)}

/* ============ "IN YOUR OWN WORDS" intake widget ============ */
.words{background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:26px; box-shadow:var(--shadow);
  position:relative}
.words::before{content:""; position:absolute; inset:-14px; border:1px solid var(--frame); border-radius:12px; pointer-events:none; z-index:-1; opacity:.55}
.words .w-head{display:flex; align-items:center; gap:12px; margin-bottom:6px}
.words .w-ava{width:40px; height:40px; border-radius:50%; flex:0 0 auto; background:var(--ink); color:var(--bg);
  display:grid; place-items:center; font-family:var(--serif); font-style:italic; font-weight:600; font-size:1.25rem}
.words .w-head strong{font-family:var(--serif); font-weight:500; font-size:1.35rem; color:var(--ink); line-height:1.1}
.words .w-head span{display:block; font-size:.74rem; color:var(--silver-deep); letter-spacing:.04em; margin-top:1px}
.words .w-sub{font-size:.92rem; color:var(--ink-soft); margin:8px 0 16px}
.words textarea{width:100%; min-height:96px; resize:vertical; padding:14px 16px; border-radius:6px; border:1px solid var(--line);
  background:var(--bg-3); color:var(--ink); font:inherit; font-size:1rem; line-height:1.5; transition:border-color .25s, box-shadow .25s}
.words textarea::placeholder{color:var(--ink-faint)}
.words textarea:focus{outline:none; border-color:var(--silver); box-shadow:0 0 0 4px rgba(138,143,151,.16)}
.words .w-chips{display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 4px}
.words .w-chip{padding:.5em 1em; border-radius:999px; background:var(--bg-2); border:1px solid var(--line); color:var(--ink-soft);
  font:inherit; font-size:.82rem; cursor:pointer; transition:all .22s}
.words .w-chip:hover{border-color:var(--ink); color:var(--ink); background:var(--paper)}
.words .w-row{display:flex; align-items:center; gap:14px; margin-top:16px; flex-wrap:wrap}
.words .w-row .btn{flex:1; justify-content:center; min-width:180px}
.words .w-priv{display:flex; align-items:center; gap:.5em; font-size:.74rem; color:var(--ink-faint)}
.words .w-priv svg{width:14px; height:14px; stroke-width:1.6}
@media(max-width:980px){ .words::before{display:none} }
@media(max-width:480px){ .words{padding:22px} }

/* conversational qualifier inside the .words card */
.words .w-head strong{font-size:1.2rem}
.words .q-log{display:flex; flex-direction:column; gap:11px; margin:16px 0 14px; max-height:300px; min-height:180px;
  overflow-y:auto; padding-right:4px; scrollbar-width:thin}
.words .q-log .cmsg{max-width:90%}
.words .q-log .cbub{font-size:.9rem}
.words .q-input{display:flex; gap:8px; align-items:center}
.words .q-input input{flex:1; padding:.8em 1.1em; border-radius:999px; border:1px solid var(--line);
  background:var(--bg-3); color:var(--ink); font:inherit; font-size:.95rem; transition:border-color .25s, box-shadow .25s}
.words .q-input input:focus{outline:none; border-color:var(--silver); box-shadow:0 0 0 4px rgba(138,143,151,.16)}
.words .q-input button{width:46px; height:46px; flex:0 0 auto; border-radius:50%; border:none; background:var(--ink);
  color:var(--bg); cursor:pointer; display:grid; place-items:center; transition:background .2s, transform .2s}
.words .q-input button:hover{background:#34373d; transform:scale(1.05)}
.words .q-input button svg{width:18px; height:18px}
.words .q-log .cchip{background:var(--bg-2)}

/* ============ FORMS ============ */
.hero-form, .panel-form{background:var(--paper); border:1px solid var(--line); border-radius:8px;
  padding:32px; box-shadow:var(--shadow)}
.hero-form .fhead, .panel-form .fhead{font-family:var(--serif); font-size:1.7rem; margin-bottom:4px}
.hero-form .fsub, .panel-form .fsub{font-size:.86rem; color:var(--ink-soft); margin-bottom:20px}
.hero-form label, .panel-form label{display:block; font-size:.62rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 6px}
.hero-form input,.hero-form textarea,.hero-form select,
.panel-form input,.panel-form textarea,.panel-form select{width:100%; margin-bottom:14px; padding:.8em 1em; border-radius:4px;
  border:1px solid var(--line); background:var(--bg-3); color:var(--ink); font:inherit; font-size:.93rem; transition:border-color .25s, box-shadow .25s}
.hero-form input::placeholder,.hero-form textarea::placeholder,.panel-form input::placeholder,.panel-form textarea::placeholder{color:var(--ink-faint)}
.hero-form input:focus,.hero-form textarea:focus,.hero-form select:focus,
.panel-form input:focus,.panel-form textarea:focus,.panel-form select:focus{outline:none; border-color:var(--silver); box-shadow:0 0 0 4px rgba(138,143,151,.16)}
.seg{display:flex; background:var(--bg-2); border:1px solid var(--line); border-radius:4px; padding:4px; margin-bottom:14px}
.seg button{flex:1; border:none; background:transparent; color:var(--ink-soft); font:inherit; font-weight:700; font-size:.85rem; padding:.6em; border-radius:3px; cursor:pointer; transition:background .25s,color .25s}
.seg button.sel{background:var(--ink); color:var(--bg)}
.hero-form .btn, .panel-form .btn{width:100%; justify-content:center}
.hero-form .micro, .panel-form .micro{font-size:.72rem; color:var(--ink-faint); text-align:center; margin-top:10px}
.thanks{text-align:center; padding:28px 6px}
.thanks .seal{width:54px; height:54px; margin:0 auto 16px; border-radius:50%; background:var(--ink); color:var(--bg); display:grid; place-items:center}
.thanks .seal svg{width:24px; height:24px}
.thanks h3{font-family:var(--serif); font-weight:500; font-size:1.6rem; margin-bottom:10px}
.thanks p{color:var(--ink-soft)}

/* ============ STAT STRIP ============ */
.stats{border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); background:var(--bg-2)}
.stats .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; padding-top:38px; padding-bottom:38px}
@media(max-width:760px){ .stats .wrap{grid-template-columns:repeat(2,1fr); gap:30px 20px} }
.stat{position:relative; padding-left:18px}
.stat::before{content:""; position:absolute; left:0; top:6px; bottom:6px; width:1px; background:var(--silver)}
.stat .n{font-family:var(--serif); font-style:italic; font-size:2rem; color:var(--ink); line-height:1}
.stat .t{font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); margin-top:6px}

/* ============ AREAS MARQUEE ============ */
.council-band{position:relative; overflow:hidden; padding:40px 0 44px; background:var(--bg); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft)}
.cb-label{text-align:center; font-size:.66rem; font-weight:700; letter-spacing:.3em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:24px}
.cb-marquee{overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent)}
.cb-track{display:flex; align-items:center; gap:14px; width:max-content; padding-right:14px; animation:cb-scroll 40s linear infinite}
.cb-badge{height:46px; padding:0 24px; flex:0 0 auto; border-radius:3px; display:grid; place-items:center;
  background:var(--paper); border:1px solid var(--line); color:var(--ink-soft);
  font-family:var(--serif); font-style:italic; font-size:1.15rem; white-space:nowrap}
@keyframes cb-scroll{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){ .cb-track{animation:none; width:auto; flex-wrap:wrap; justify-content:center} }
@media(max-width:640px){ .cb-track{gap:10px; padding-right:10px} .cb-badge{height:40px; font-size:1rem; padding:0 16px} }

/* ============ SECTIONS ============ */
.section{padding:118px 0}
.sec-tight{padding-top:84px}
.pt0{padding-top:0}
.pt90{padding-top:90px}
.pb0{padding-bottom:0}
.beige{background:var(--bg-2); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft)}
.paper{background:var(--bg-3); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft)}
.sec-head{max-width:700px; margin-bottom:54px}
.sec-center{margin-inline:auto; text-align:center}
.sec-head h2{font-size:clamp(2.2rem,4vw,3.2rem); margin-bottom:16px; letter-spacing:-.005em}
.sec-head p{color:var(--ink-soft); font-size:1.04rem}
.m0{margin:0}

/* ============ PAGE HERO (interior) ============ */
.phero{position:relative; padding:170px 0 64px; overflow:hidden; background:var(--bg-2); border-bottom:1px solid var(--line-soft)}
.phero.with-photo{background:var(--ink)}
.phero .bg{position:absolute; inset:0; background-position:center; background-size:cover; opacity:0}
.phero.with-photo .bg{opacity:.5}
.phero.with-photo .veil{position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,18,14,.55), rgba(20,18,14,.82))}
.phero.with-photo h1, .phero.with-photo p{color:var(--bg)}
.phero.with-photo .crumbs{color:rgba(255,253,248,.6)} .phero.with-photo .crumbs a{color:var(--bg)}
.phero.with-photo h1 em{color:#d8d2c5}
.phero .wrap{position:relative; max-width:900px}
.phero h1{font-size:clamp(2.5rem,5vw,3.9rem); margin-bottom:18px; letter-spacing:-.005em}
.phero p{color:var(--ink-soft); font-size:1.08rem; max-width:62ch}
.crumbs{font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:20px}
.crumbs a{color:var(--silver-deep)}
.crumbs span{margin:0 .5em; opacity:.5}

/* prose */
.prose{max-width:760px; margin:0 auto}
.prose p{margin-bottom:18px; color:var(--ink-soft)}
.prose h2{font-size:clamp(1.9rem,3vw,2.4rem); margin:46px 0 16px}
.prose h3{font-size:1.5rem; margin:34px 0 12px}
.prose ul,.prose ol{margin:0 0 18px 1.2em; color:var(--ink-soft)}
.prose li{margin-bottom:8px}
.prose strong{color:var(--ink)}
.prose a{color:var(--silver-deep); text-decoration:underline; text-underline-offset:3px}
.prose blockquote{border-left:2px solid var(--silver); padding:8px 0 8px 24px; margin:26px 0; font-family:var(--serif);
  font-style:italic; font-size:1.5rem; color:var(--ink); line-height:1.4}
.prose figure{margin:30px 0}
.prose figure img{border-radius:6px; border:1px solid var(--line); box-shadow:var(--shadow-sm)}
.prose figcaption{font-size:.78rem; color:var(--ink-faint); margin-top:8px; text-align:center}

/* ============ STEPS / WHY ============ */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:0; counter-reset:s}
@media(max-width:880px){ .steps{grid-template-columns:1fr} }
.step{padding:34px 30px; position:relative; border-left:1px solid var(--line)}
.step:first-child{border-left:none}
@media(max-width:880px){ .step{border-left:none; border-top:1px solid var(--line)} .step:first-child{border-top:none} }
.step .num{font-family:var(--serif); font-style:italic; font-size:2.8rem; color:var(--silver); line-height:1}
.step h3{font-size:1.4rem; margin:14px 0 8px}
.step p{font-size:.93rem; color:var(--ink-soft)}

.why-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:0}
.why{display:flex; gap:16px; align-items:flex-start; padding:28px 30px; border-top:1px solid var(--line); border-left:1px solid var(--line)}
.why:nth-child(-n+2){border-top:none}
.why:nth-child(odd){border-left:none}
@media(max-width:760px){ .why-grid{grid-template-columns:1fr} .why{border-left:none} .why:nth-child(2){border-top:1px solid var(--line)} }
.why .ic{width:42px;height:42px;flex:0 0 auto;color:var(--silver-deep)}
.why .ic svg{width:42px;height:42px;stroke-width:1.4}
.why strong{display:block; font-family:var(--serif); font-weight:500; font-size:1.3rem; margin-bottom:5px; color:var(--ink)}
.why p{font-size:.9rem; color:var(--ink-soft)}

/* values cards */
.mvv{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:40px}
.mvv-card{background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:34px 30px; position:relative}
.mvv-card .ic{width:38px;height:38px;color:var(--silver-deep);margin-bottom:18px}
.mvv-card .ic svg{width:38px;height:38px;stroke-width:1.4}
.mvv-card h3{font-size:1.45rem; color:var(--ink); font-style:italic; margin-bottom:10px}
.mvv-card p{font-size:.93rem; color:var(--ink-soft)}
@media(max-width:880px){ .mvv{grid-template-columns:1fr} }

/* ============ PRACTICE-AREA CARDS (ICONS, not photos) ============ */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--paper)}
@media(max-width:920px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .svc-grid{grid-template-columns:1fr} }
.svc-card{display:flex; flex-direction:column; padding:38px 34px 34px; position:relative;
  border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper);
  transition:background .35s, transform .35s}
.svc-card:hover{background:var(--bg-3)}
.svc-ic{width:46px; height:46px; color:var(--silver-deep); margin-bottom:22px}
.svc-ic svg{width:46px; height:46px; stroke-width:1.4; fill:none; stroke:currentColor; display:block}
.svc-card h3{font-size:1.5rem; margin-bottom:10px; color:var(--ink)}
.svc-card p{font-size:.92rem; color:var(--ink-soft); margin-bottom:18px; flex:1}
.svc-card .more{display:inline-flex; align-items:center; gap:.45em; font-size:.74rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink)}
.svc-card .more svg{width:1.1em; height:1.1em; stroke-width:2; transition:transform .3s}
.svc-card:hover .more svg{transform:translateX(5px)}
.svc-card .idx{position:absolute; top:26px; right:30px; font-family:var(--serif); font-style:italic; font-size:1rem; color:var(--silver)}
/* tidy outer borders */
.svc-grid .svc-card:nth-child(3n){border-right:none}
@media(max-width:920px){ .svc-grid .svc-card:nth-child(3n){border-right:1px solid var(--line)} .svc-grid .svc-card:nth-child(2n){border-right:none} }
@media(max-width:560px){ .svc-grid .svc-card{border-right:none} }

/* per-service top */
.svc-top{display:grid; grid-template-columns:1.2fr .8fr; gap:48px; align-items:center; margin-bottom:48px}
.svc-top .svc-head{margin-bottom:0}
.svc-head{max-width:760px; margin-bottom:44px}
.svc-head h2{font-size:clamp(2rem,3.4vw,2.7rem); margin-bottom:16px}
.svc-head p{color:var(--ink-soft); font-size:.99rem}
.svc-photo{position:relative}
.svc-photo img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:6px; box-shadow:var(--shadow)}
.svc-photo::before{content:""; position:absolute; inset:-14px; border:1px solid var(--frame); border-radius:8px; z-index:-1}
@media(max-width:880px){ .svc-top{grid-template-columns:1fr; gap:30px} .svc-photo img{aspect-ratio:16/10} }
.svc-cta{margin-top:36px; display:flex; align-items:center; gap:22px; flex-wrap:wrap}

/* a checklist of sub-services */
.checks{display:grid; grid-template-columns:repeat(2,1fr); gap:14px 30px; margin:8px 0}
@media(max-width:680px){ .checks{grid-template-columns:1fr} }
.checks .ck{display:flex; gap:.7em; align-items:flex-start; font-size:.96rem; color:var(--ink)}
.checks .ck svg{width:18px; height:18px; color:var(--silver-deep); flex:0 0 auto; margin-top:.3em; stroke-width:2}

/* ============ FAQ ============ */
.faq-list{max-width:800px; margin:0 auto}
.faq{border-bottom:1px solid var(--line)}
.faq:first-child{border-top:1px solid var(--line)}
.faq summary{cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:20px; align-items:center;
  padding:24px 4px; font-family:var(--serif); font-size:1.4rem; font-weight:500; color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .x{flex:0 0 auto; width:26px; height:26px; display:grid; place-items:center; color:var(--silver-deep); transition:transform .3s}
.faq[open] summary .x{transform:rotate(45deg)}
.faq summary .x svg{width:18px;height:18px;stroke-width:1.6}
.faq .a{padding:0 4px 26px; color:var(--ink-soft); max-width:68ch}

/* ============ TEAM ============ */
.team-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px}
.team-card{position:relative}
.team-card .ph{aspect-ratio:3/4; border-radius:6px; background:var(--bg-2) center/cover no-repeat; border:1px solid var(--line); box-shadow:var(--shadow-sm)}
.team-card figcaption{padding:18px 4px 0}
.team-card figcaption strong{display:block; font-family:var(--serif); font-weight:500; font-size:1.35rem; color:var(--ink)}
.team-card figcaption span{font-size:.68rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--silver-deep)}
.team-card figcaption p{font-size:.84rem; color:var(--ink-soft); margin-top:8px; line-height:1.55}
@media(max-width:980px){ .team-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:640px){ .team-grid{grid-template-columns:repeat(2,1fr)} }
.ph-blank{display:grid; place-items:center; background:var(--bg-2); border:1px solid var(--line);
  color:var(--silver-deep); font-family:var(--serif); font-style:italic; font-size:2.6rem}
.ph-card{position:relative}
.ph-card .frame-img{position:relative; border-radius:6px; overflow:hidden; box-shadow:var(--shadow)}
.ph-card .frame-img img{width:100%; aspect-ratio:4/5; object-fit:cover}
.ph-card::before{content:""; position:absolute; inset:-14px; border:1px solid var(--frame); border-radius:8px; z-index:-1; pointer-events:none}
.ph-card figcaption{margin-top:26px; font-size:.72rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-faint)}
/* framed feature video — same hairline treatment as .frame-img */
.ph-card .frame-vid{position:relative; border-radius:6px; overflow:hidden; box-shadow:var(--shadow); background:var(--bg-2)}
.ph-card .frame-vid video{display:block; width:100%; aspect-ratio:4/5; object-fit:cover}
.ph-card .frame-vid .vplay{position:absolute; left:14px; bottom:14px; z-index:2; display:flex; align-items:center; gap:.5em;
  padding:.5em .9em; border-radius:999px; font-size:.66rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:#fff; background:rgba(20,18,14,.4); border:1px solid rgba(255,255,255,.3);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); pointer-events:none}
.ph-card .frame-vid .vplay .dot{width:6px; height:6px; border-radius:50%; background:#9ad1a3}

/* ============ whyrow / standard pills ============ */
.whyrow{display:grid; grid-template-columns:1fr 1fr; gap:68px; align-items:center}
@media(max-width:880px){ .whyrow{grid-template-columns:1fr; gap:40px} }
.whyrow h2{font-size:clamp(2.2rem,4vw,3.1rem); margin-bottom:22px}
.whyrow p{color:var(--ink-soft); margin-bottom:14px}
.standard{margin-top:28px; display:flex; gap:10px; flex-wrap:wrap}
.std{font-family:var(--serif); font-style:italic; font-size:1.2rem; padding:.45em 1.3em; border-radius:3px;
  border:1px solid var(--frame); color:var(--silver-deep); background:var(--paper)}

/* ============ PROOF / GALLERY ============ */
.proof-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:18px}
.proof-grid img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:6px; border:1px solid var(--line); box-shadow:var(--shadow-sm)}
@media(max-width:880px){ .proof-grid{grid-template-columns:repeat(2,1fr); gap:12px} }
.duo{display:grid; grid-template-columns:1.2fr 1fr; gap:18px; margin-top:18px}
@media(max-width:880px){ .duo{grid-template-columns:1fr} }
.duo img{border-radius:6px; box-shadow:var(--shadow-sm); width:100%; height:100%; object-fit:cover; aspect-ratio:16/10; border:1px solid var(--line)}

/* photo band (the ONE place we go dark, for contrast/personality) */
.bark-band{position:relative; overflow:hidden; padding:108px 0; background:var(--ink); color:var(--bg)}
.bark-band .bg{position:absolute; inset:0; background-position:center; background-size:cover; opacity:.3}
.bark-band .bb-veil{position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,18,14,.6), rgba(20,18,14,.78))}
.bb-quote{position:relative; text-align:center; font-family:var(--serif); font-weight:500; color:var(--bg);
  font-size:clamp(2rem,3.8vw,3rem); line-height:1.25; padding:0 28px; max-width:26ch; margin:0 auto}
.bb-quote em{font-style:italic; color:#d8d2c5}
.bb-cite{position:relative; display:block; text-align:center; margin-top:24px; font-family:var(--sans);
  font-size:.72rem; letter-spacing:.3em; text-transform:uppercase; color:rgba(255,253,248,.6)}
@media(max-width:640px){ .bark-band{padding:72px 0} }

/* ============ CONSULT STRIP ============ */
.emr-strip{background:var(--ink); color:var(--bg); padding:56px 0}
.emr-strip .wrap{display:flex; gap:30px; align-items:center; justify-content:space-between; flex-wrap:wrap}
.emr-strip h3{font-size:clamp(1.6rem,2.8vw,2.1rem); color:var(--bg)}
.emr-strip h3 em{color:#d8d2c5; font-style:italic}
.emr-strip p{color:rgba(255,253,248,.66); font-size:.96rem; max-width:54ch}
.emr-strip .btn{background:var(--bg); color:var(--ink); border-color:var(--bg); white-space:nowrap}
.emr-strip .btn:hover{transform:translateY(-2px); background:#fff}

/* ============ LOCATIONS / SUBURB GRID ============ */
.sub-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media(max-width:900px){ .sub-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:600px){ .sub-grid{grid-template-columns:1fr} }
.sub-grid.cols-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){ .sub-grid.cols-4{grid-template-columns:repeat(2,1fr)} }
@media(max-width:520px){ .sub-grid.cols-4{grid-template-columns:1fr} }
.sub-card{display:block; border-radius:6px; padding:30px 28px; background:var(--paper); border:1px solid var(--line);
  transition:transform .4s, border-color .4s, box-shadow .4s; position:relative}
.sub-card:hover{transform:translateY(-4px); border-color:var(--silver); box-shadow:var(--shadow-sm)}
.sub-card .reg{font-size:.64rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--silver-deep); margin-bottom:12px}
.sub-card h3{font-size:1.5rem; margin-bottom:8px; color:var(--ink)}
.sub-card p{font-size:.88rem; color:var(--ink-soft); margin-bottom:14px}
.sub-card .more{display:inline-flex; align-items:center; gap:.4em; font-size:.74rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink)}
.sub-card .more svg{width:1.1em; height:1.1em; stroke-width:2; transition:transform .3s}
.sub-card:hover .more svg{transform:translateX(4px)}

/* ============ RESOURCES / BLOG ============ */
.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
@media(max-width:900px){ .blog-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:600px){ .blog-grid{grid-template-columns:1fr} }
.post-card{display:flex; flex-direction:column; border-radius:6px; overflow:hidden; background:var(--paper);
  border:1px solid var(--line); transition:transform .4s, box-shadow .4s}
.post-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-sm)}
.post-card .pic{aspect-ratio:16/10; overflow:hidden}
.post-card .pic img{width:100%; height:100%; object-fit:cover; transition:transform .6s}
.post-card:hover .pic img{transform:scale(1.05)}
.post-card .body{padding:24px 24px 28px; display:flex; flex-direction:column; flex:1}
.post-card .cat{font-size:.62rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--silver-deep); margin-bottom:12px}
.post-card .body h3{font-size:1.4rem; margin-bottom:8px; line-height:1.22; color:var(--ink)}
.post-card .body p{font-size:.86rem; color:var(--ink-soft); margin-bottom:16px; flex:1}
.post-card .meta{font-size:.72rem; color:var(--ink-faint)}
.feature-post{display:grid; grid-template-columns:1.05fr .95fr; gap:0; border-radius:6px; overflow:hidden;
  background:var(--paper); border:1px solid var(--line); margin-bottom:36px}
.feature-post .pic{min-height:340px; overflow:hidden}
.feature-post .pic img{width:100%; height:100%; object-fit:cover}
.feature-post .body{padding:46px; display:flex; flex-direction:column; justify-content:center}
.feature-post .cat{font-size:.62rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--silver-deep)}
.feature-post .body h2,.feature-post .body h3{font-size:clamp(1.7rem,3vw,2.3rem); margin:12px 0}
.feature-post .body p{color:var(--ink-soft); margin-bottom:18px}
@media(max-width:820px){ .feature-post{grid-template-columns:1fr} .feature-post .pic{min-height:220px} .feature-post .body{padding:30px} }
.post-card .more,.feature-post .more{display:inline-flex;align-items:center;gap:.45em;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.post-card .more svg,.feature-post .more svg{width:1.1em;height:1.1em;stroke-width:2;transition:transform .3s}
.post-card:hover .more svg{transform:translateX(4px)}

/* ============ PRESS / IN THE MEDIA ============ */
.press-list{display:grid; gap:0; border-top:1px solid var(--line)}
.press-item{display:grid; grid-template-columns:auto 1fr auto; gap:24px; align-items:center;
  padding:28px 4px; border-bottom:1px solid var(--line); transition:background .3s}
.press-item:hover{background:var(--bg-3)}
.press-item .outlet{font-family:var(--serif); font-style:italic; font-size:1.2rem; color:var(--silver-deep); min-width:170px}
.press-item .pbody h3{font-size:1.4rem; color:var(--ink); margin-bottom:4px; line-height:1.2}
.press-item .pbody p{font-size:.9rem; color:var(--ink-soft)}
.press-item .pmeta{font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); white-space:nowrap; display:inline-flex; align-items:center; gap:.5em}
.press-item .pmeta svg{width:15px;height:15px;stroke-width:2}
@media(max-width:760px){ .press-item{grid-template-columns:1fr; gap:8px} .press-item .outlet{font-size:1.05rem} .press-item .pmeta{margin-top:6px} }

/* article */
.article-hero{position:relative; padding:170px 0 60px; overflow:hidden; background:var(--bg-2); border-bottom:1px solid var(--line-soft)}
.article-hero .wrap{position:relative; max-width:820px}
.article-hero .cat{font-size:.66rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:var(--silver-deep); margin-bottom:16px}
.article-hero h1{font-size:clamp(2.3rem,4.6vw,3.4rem); margin-bottom:18px; max-width:26ch}
.article-meta{font-size:.8rem; color:var(--ink-faint); display:flex; gap:18px; flex-wrap:wrap}
.article-body{padding:64px 0 90px}
.share-row{display:flex; align-items:center; gap:12px; margin:44px 0 0; padding-top:28px; border-top:1px solid var(--line); flex-wrap:wrap}
.share-row .lbl{font-size:.7rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-faint)}
.tagchips{display:flex; gap:8px; flex-wrap:wrap}
.tagchip{font-size:.74rem; padding:.4em 1em; border-radius:3px; background:var(--paper); border:1px solid var(--line); color:var(--ink-soft)}
.author-box{display:flex; gap:18px; align-items:center; background:var(--paper); border:1px solid var(--line);
  border-radius:6px; padding:24px; margin-top:38px}
.author-box .av{width:56px; height:56px; border-radius:50%; flex:0 0 auto; background:var(--bg-2);
  border:1px solid var(--line); display:grid; place-items:center; color:var(--silver-deep); font-family:var(--serif); font-style:italic; font-size:1.5rem}
.author-box strong{display:block; font-family:var(--serif); font-weight:500; font-size:1.3rem; color:var(--ink)}
.author-box span{font-size:.82rem; color:var(--ink-soft)}

/* ============ REVIEWS ============ */
.rev-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.rev-card{background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:32px 30px; display:flex; flex-direction:column}
.rev-stars{color:var(--silver-deep); letter-spacing:.2em; font-size:.95rem; margin-bottom:16px}
.rev-card blockquote{font-size:.96rem; line-height:1.65; margin-bottom:18px; color:var(--ink); flex:1}
.rev-card.feat blockquote{font-family:var(--serif); font-style:italic; font-size:1.35rem; line-height:1.4}
.rev-card figcaption{font-size:.78rem; color:var(--ink-faint); display:flex; align-items:center; gap:11px; margin-top:auto}
.rev-card .ava{width:36px; height:36px; border-radius:50%; flex:0 0 auto; background:var(--bg-2);
  border:1px solid var(--line); color:var(--silver-deep); display:grid; place-items:center; font-weight:800; font-size:.8rem; font-family:var(--sans)}
.rev-card figcaption b{color:var(--ink); font-weight:700; font-family:var(--sans)}
.rev-card figcaption .gw{margin-left:auto; font-size:.66rem; color:var(--ink-faint)}
@media(max-width:880px){ .rev-grid{grid-template-columns:1fr} }
.rev-note{margin-top:26px; font-size:.74rem; color:var(--ink-faint); text-align:center}

.gscore{display:flex; align-items:center; justify-content:center; gap:30px; flex-wrap:wrap; padding:40px;
  background:var(--paper); border:1px solid var(--line); border-radius:6px; margin-bottom:48px}
.gscore .big{font-family:var(--serif); font-style:italic; font-size:3.6rem; color:var(--ink); line-height:1}
.gscore .gstars{color:var(--silver-deep); font-size:1.4rem; letter-spacing:.15em}
.gscore .glabel{font-size:.84rem; color:var(--ink-soft)}
.gscore .gdiv{width:1px; height:56px; background:var(--line)}
.gscore .gbrand{display:flex; align-items:center; gap:8px; font-size:.9rem; color:var(--ink-soft)}
@media(max-width:560px){ .gscore .gdiv{display:none} }

/* ============ FINAL CTA ============ */
.final{background:var(--bg-2); border-top:1px solid var(--line-soft); text-align:center; padding:112px 0}
.final h2{font-size:clamp(2.3rem,4.4vw,3.4rem); margin-bottom:18px}
.final p{color:var(--ink-soft); max-width:54ch; margin:0 auto 32px}

.dock{position:fixed; left:12px; right:12px; bottom:12px; z-index:55; display:none; gap:10px;
  padding:9px; border-radius:5px; background:rgba(251,249,243,.92);
  backdrop-filter:blur(18px) saturate(1.3); -webkit-backdrop-filter:blur(18px) saturate(1.3);
  border:1px solid var(--line); box-shadow:0 16px 44px -18px rgba(35,30,18,.45);
  transform:translateY(180%); transition:transform .45s cubic-bezier(.22,1,.36,1)}
.dock.show{transform:none}
.dock .btn{flex:1; justify-content:center; padding:.95em}
@media(max-width:680px){ .dock{display:flex} }

/* two-col */
.two-col{display:grid; grid-template-columns:1.1fr .9fr; gap:52px; align-items:start}
.two-col-even{grid-template-columns:1fr 1fr}
.two-col-wide{grid-template-columns:1.3fr .7fr}
@media(max-width:860px){ .two-col, .two-col-even, .two-col-wide{grid-template-columns:1fr; gap:34px} }

/* contact info */
.cinfo{display:grid; gap:0}
.cinfo .row{display:flex; gap:16px; align-items:flex-start; padding:20px 0; border-bottom:1px solid var(--line)}
.cinfo .row > div{display:flex; flex-direction:column}
.cinfo .row:first-child{border-top:1px solid var(--line)}
.cinfo .ic{width:42px; height:42px; flex:0 0 auto; display:grid; place-items:center; color:var(--silver-deep)}
.cinfo .ic svg{width:24px; height:24px; stroke-width:1.5}
.cinfo .lbl{font-size:.64rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:4px}
.cinfo .val{font-size:1.04rem; color:var(--ink)}
.cinfo .val a{color:var(--ink); transition:color .2s}
.cinfo .val a:hover{color:var(--silver-deep)}
.mapwrap{border-radius:6px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-sm)}
.mapwrap iframe{width:100%; height:360px; border:0; filter:grayscale(.5) contrast(1.05)}

/* ============ FOOTER ============ */
footer{background:var(--bg-2); color:var(--ink-soft); padding:72px 0 48px; font-size:.9rem; border-top:1px solid var(--line)}
footer .fcols{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:44px; margin-bottom:48px}
@media(max-width:900px){ footer .fcols{grid-template-columns:1fr 1fr} }
@media(max-width:560px){ footer .fcols{grid-template-columns:1fr} }
footer .flogo{height:48px; width:auto; margin-bottom:18px}
footer .blurb{color:var(--ink-soft); max-width:36ch}
footer h4{font-size:.64rem; font-weight:700; letter-spacing:.3em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:16px}
footer ul{list-style:none}
footer li{margin-bottom:9px; color:var(--ink-soft)}
footer li a{transition:color .2s} footer li a:hover{color:var(--ink)}
.fcontact{display:flex; align-items:flex-start; gap:.6em; margin-bottom:11px; color:var(--ink-soft)}
.fcontact svg{width:16px; height:16px; color:var(--silver-deep); flex:0 0 auto; margin-top:.2em; stroke-width:1.6}
.follow{display:flex; align-items:center; gap:10px; margin-top:16px}
.soc{width:38px; height:38px; border-radius:4px; display:grid; place-items:center; color:var(--ink-soft);
  background:var(--paper); border:1px solid var(--line); transition:color .3s, border-color .3s}
.soc:hover{color:var(--ink); border-color:var(--silver)}
.soc svg{width:16px; height:16px}
.foot-base{border-top:1px solid var(--line); padding-top:28px; display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center; font-size:.78rem; color:var(--ink-faint)}
.disclaimer{font-size:.72rem; color:var(--ink-faint); max-width:80ch; margin-top:22px; line-height:1.6}
.built-by{display:inline-flex; align-items:center; gap:.55em; font-size:.68rem; font-weight:700; line-height:1;
  letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); text-decoration:none; transition:color .3s}
.built-by b{color:var(--ink-soft); font-weight:800; letter-spacing:.22em}
.built-by:hover{color:var(--ink)}

/* ============ PASHA IO — lead magnet tool ============ */
.ai-hero{position:relative; padding:172px 0 70px; background:var(--bg-2); border-bottom:1px solid var(--line-soft); overflow:hidden}
.ai-hero::after{content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(90% 70% at 80% 0%, rgba(138,143,151,.16), transparent 55%)}
.ai-hero .wrap{position:relative; max-width:880px; text-align:center}
.ai-badge{display:inline-flex; align-items:center; gap:.55em; padding:.5em 1.1em; border-radius:3px; margin-bottom:22px;
  background:var(--paper); border:1px solid var(--silver); font-size:.7rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--silver-deep)}
.ai-badge svg{width:15px;height:15px;stroke-width:1.6}
.ai-hero h1{font-size:clamp(2.6rem,5vw,4rem); margin-bottom:18px}
.ai-hero p{color:var(--ink-soft); font-size:1.1rem; max-width:60ch; margin:0 auto}
.ai-stage{max-width:780px; margin:0 auto}
.ai-card{background:var(--paper); border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow); overflow:hidden}
.ai-steps{display:flex; border-bottom:1px solid var(--line); background:var(--bg-3)}
.ai-step{flex:1; padding:16px 18px; text-align:center; font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); position:relative}
.ai-step.on{color:var(--ink)}
.ai-step.done{color:var(--silver-deep)}
.ai-step:not(:last-child)::after{content:""; position:absolute; right:0; top:14px; bottom:14px; width:1px; background:var(--line)}
.ai-step .n{font-family:var(--serif); font-style:italic; font-size:1.1rem; margin-right:.4em; text-transform:none; letter-spacing:0}
.ai-pane{padding:36px}
.ai-pane[hidden]{display:none}
/* dropzone */
.dropzone{border:1.5px dashed var(--frame); border-radius:6px; padding:48px 28px; text-align:center; cursor:pointer; transition:border-color .25s, background .25s; background:var(--bg-3)}
.dropzone:hover, .dropzone.drag{border-color:var(--silver); background:var(--paper)}
.dropzone .dz-ic{width:46px; height:46px; margin:0 auto 16px; color:var(--silver-deep)}
.dropzone .dz-ic svg{width:46px;height:46px;stroke-width:1.4}
.dropzone strong{display:block; font-family:var(--serif); font-size:1.4rem; font-weight:500; margin-bottom:6px; color:var(--ink)}
.dropzone span{font-size:.86rem; color:var(--ink-soft)}
.dropzone .pick{color:var(--ink); text-decoration:underline; text-underline-offset:3px}
.filelist{display:grid; gap:10px; margin-top:20px}
.filerow{display:flex; align-items:center; gap:14px; padding:13px 16px; border:1px solid var(--line); border-radius:5px; background:var(--bg-3)}
.filerow .fic{width:34px;height:34px;flex:0 0 auto;display:grid;place-items:center;color:var(--silver-deep);background:var(--paper);border:1px solid var(--line);border-radius:4px}
.filerow .fic svg{width:18px;height:18px;stroke-width:1.6}
.filerow .fmeta{flex:1; min-width:0}
.filerow .fname{font-size:.9rem; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.filerow .fsize{font-size:.74rem; color:var(--ink-faint)}
.filerow .fx{width:30px;height:30px;flex:0 0 auto;border:none;background:none;color:var(--ink-faint);cursor:pointer;border-radius:4px;display:grid;place-items:center;transition:color .2s,background .2s}
.filerow .fx:hover{color:var(--ink);background:var(--bg-2)}
.filerow .fx svg{width:16px;height:16px;stroke-width:2}
.ai-note{font-size:.74rem; color:var(--ink-faint); margin-top:16px; text-align:center}
/* processing */
.ai-proc{text-align:center; padding:30px 10px}
.ai-spinner{width:54px;height:54px;margin:0 auto 22px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--silver-deep);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.ai-proc h3{font-family:var(--serif);font-weight:500;font-size:1.6rem;margin-bottom:8px}
.ai-proc p{color:var(--ink-soft);font-size:.92rem}
.ai-proclog{margin-top:22px;display:grid;gap:8px;max-width:380px;margin-left:auto;margin-right:auto;text-align:left}
.ai-proclog .pl{display:flex;align-items:center;gap:.7em;font-size:.86rem;color:var(--ink-faint);opacity:.4;transition:opacity .3s,color .3s}
.ai-proclog .pl.on{opacity:1;color:var(--ink)}
.ai-proclog .pl svg{width:16px;height:16px;color:var(--silver-deep);stroke-width:2}
/* gate */
.ai-gate .fhead{font-family:var(--serif);font-size:1.7rem;margin-bottom:4px}
.ai-gate .fsub{font-size:.9rem;color:var(--ink-soft);margin-bottom:22px}
/* result summary */
.ai-result{}
.ai-result .doc{border:1px solid var(--line); border-radius:6px; overflow:hidden; box-shadow:var(--shadow-sm)}
.ai-result .doc-head{display:flex; align-items:center; gap:14px; padding:20px 26px; background:var(--ink); color:var(--bg)}
.ai-result .doc-head img{height:30px;width:auto}
.ai-result .doc-head .dh{flex:1}
.ai-result .doc-head .dh strong{display:block;font-family:var(--serif);font-size:1.15rem;font-weight:500}
.ai-result .doc-head .dh span{font-size:.72rem;color:rgba(255,253,248,.6);letter-spacing:.08em}
.ai-result .doc-body{padding:32px 30px; background:var(--paper)}
.ai-result .doc-body h4{font-family:var(--serif);font-size:1.3rem;font-weight:500;margin:24px 0 10px;color:var(--ink)}
.ai-result .doc-body h4:first-child{margin-top:0}
.ai-result .doc-body p{color:var(--ink-soft);font-size:.94rem;margin-bottom:12px}
.ai-result .doc-body ul{margin:0 0 14px 1.1em;color:var(--ink-soft);font-size:.94rem}
.ai-result .doc-body li{margin-bottom:7px}
.ai-result .doc-body .flag{display:flex;gap:.7em;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:5px;background:var(--bg-3);margin-bottom:10px;font-size:.9rem}
.ai-result .doc-body .flag svg{width:18px;height:18px;color:var(--silver-deep);flex:0 0 auto;margin-top:.2em;stroke-width:1.8}
.ai-emailed{display:flex;gap:.7em;align-items:center;justify-content:center;margin-top:22px;padding:16px;border:1px solid var(--silver);border-radius:5px;background:var(--bg-3);font-size:.92rem;color:var(--ink)}
.ai-emailed svg{width:20px;height:20px;color:var(--silver-deep);stroke-width:2}
.ai-disc{font-size:.74rem;color:var(--ink-faint);text-align:center;margin-top:20px;max-width:60ch;margin-left:auto;margin-right:auto}

/* ============ CHAT WIDGET (light, Pasha-themed — like Eden, ivory/charcoal) ============ */
.chat-fab{position:fixed; right:20px; bottom:20px; z-index:80; display:flex; align-items:center; gap:10px;
  padding:13px 20px 13px 16px; border-radius:999px; border:1px solid var(--ink); cursor:pointer;
  background:var(--ink); color:var(--bg); font:inherit; font-weight:700; font-size:.88rem;
  box-shadow:0 16px 40px -16px rgba(35,30,18,.5); transition:transform .3s, box-shadow .3s}
.chat-fab:hover{transform:translateY(-2px) scale(1.02); box-shadow:0 20px 48px -16px rgba(35,30,18,.6)}
.chat-fab svg{width:21px; height:21px}
.chat-fab .pulse{position:absolute; top:-2px; right:-2px; width:13px; height:13px; border-radius:50%;
  background:var(--silver); border:2px solid var(--bg); animation:chatpulse 2s ease-in-out infinite}
@keyframes chatpulse{0%,100%{box-shadow:0 0 0 0 rgba(138,143,151,.5)} 50%{box-shadow:0 0 0 7px rgba(138,143,151,0)}}
.chat-panel{position:fixed; right:20px; bottom:20px; z-index:81; width:390px; max-width:calc(100vw - 40px);
  height:580px; max-height:calc(100vh - 40px); border-radius:12px; overflow:hidden;
  background:var(--bg); border:1px solid var(--line); box-shadow:0 40px 90px -30px rgba(35,30,18,.45);
  display:flex; flex-direction:column; transform:translateY(20px) scale(.98); opacity:0; visibility:hidden;
  transition:transform .35s cubic-bezier(.22,1,.36,1), opacity .35s, visibility .35s, margin .35s}
.chat-panel.open{transform:none; opacity:1; visibility:visible; margin-bottom:16px}
.chat-head{display:flex; align-items:center; gap:12px; padding:16px 18px; background:var(--ink); color:var(--bg)}
.chat-head .ava{width:40px; height:40px; border-radius:50%; flex:0 0 auto; background:var(--bg); color:var(--ink);
  display:grid; place-items:center; font-family:var(--serif); font-style:italic; font-weight:600; font-size:1.25rem}
.chat-head .who strong{display:block; font-size:1.05rem; color:var(--bg); font-family:var(--serif); font-weight:500}
.chat-head .who span{font-size:.72rem; color:rgba(255,253,248,.7); display:flex; align-items:center; gap:5px}
.chat-head .who span::before{content:""; width:7px; height:7px; border-radius:50%; background:#7fc18a; display:inline-block}
.chat-head .x{margin-left:auto; width:32px; height:32px; border-radius:50%; border:1px solid rgba(255,253,248,.25);
  background:rgba(255,253,248,.08); color:var(--bg); cursor:pointer; display:grid; place-items:center}
.chat-head .x svg{width:18px; height:18px}
.chat-log{flex:1; overflow-y:auto; padding:18px 16px; display:flex; flex-direction:column; gap:12px; background:var(--bg-3); min-height:200px}
.cmsg{display:flex; gap:9px; align-items:flex-end; max-width:88%}
.cmsg.me{align-self:flex-end}
.cmsg.bot{align-self:flex-start}
.cmsg .cava{width:26px; height:26px; border-radius:50%; flex:0 0 auto; background:var(--ink); color:var(--bg);
  display:grid; place-items:center; font-family:var(--serif); font-style:italic; font-weight:600; font-size:.9rem}
.cbub{padding:11px 15px; border-radius:14px; font-size:.92rem; line-height:1.5}
.cmsg.bot .cbub{background:var(--paper); border:1px solid var(--line); color:var(--ink); border-bottom-left-radius:5px}
.cmsg.me .cbub{background:var(--ink); color:var(--bg); border-bottom-right-radius:5px}
.cbub a{color:inherit}
.cbub a.cbtn{display:inline-flex; align-items:center; gap:.5em; margin-top:4px; padding:.6em 1.2em; border-radius:4px;
  background:var(--ink); color:var(--bg); font-weight:700; font-size:.85rem; text-decoration:none}
.cmsg.me .cbub a.cbtn, .cmsg.bot .cbub a.cbtn{border:1px solid var(--ink)}
.cbub.typing{display:flex; gap:4px; padding:14px}
.cbub.typing i{width:6px; height:6px; border-radius:50%; background:var(--silver); animation:ctype 1.2s infinite}
.cbub.typing i:nth-child(2){animation-delay:.2s} .cbub.typing i:nth-child(3){animation-delay:.4s}
@keyframes ctype{0%,60%,100%{opacity:.25; transform:translateY(0)} 30%{opacity:1; transform:translateY(-3px)}}
.cchips{display:flex; flex-wrap:wrap; gap:8px; align-self:flex-start; max-width:90%}
.cchip{padding:.5em 1em; border-radius:999px; background:var(--bg-2); border:1px solid var(--line);
  color:var(--ink-soft); font:inherit; font-size:.82rem; font-weight:600; cursor:pointer; transition:all .2s}
.cchip:hover{background:var(--paper); border-color:var(--ink); color:var(--ink)}
.chat-input{display:flex; gap:8px; padding:12px; background:var(--bg); border-top:1px solid var(--line)}
.chat-input input{flex:1; padding:.7em 1em; border-radius:999px; border:1px solid var(--line);
  background:var(--bg-3); color:var(--ink); font:inherit; font-size:.9rem}
.chat-input input:focus{outline:none; border-color:var(--silver); box-shadow:0 0 0 3px rgba(138,143,151,.16)}
.chat-input button{width:42px; height:42px; flex:0 0 auto; border-radius:50%; border:none; background:var(--ink);
  color:var(--bg); cursor:pointer; display:grid; place-items:center; transition:background .2s, transform .2s}
.chat-input button:hover{background:#34373d; transform:scale(1.05)}
.chat-input button svg{width:18px; height:18px}
@media(max-width:560px){ .chat-fab{right:14px; bottom:14px} .chat-fab .lbl{display:none} .chat-fab{padding:13px}
  .chat-panel{right:8px; left:8px; bottom:8px; width:auto; height:calc(100vh - 16px)} }
body.dock-on .chat-fab{bottom:86px}

@media(prefers-reduced-motion:reduce){ *{animation-duration:.001s !important} }

/* default: print-only logo hidden, light logo shown (on-screen dark header) */
.doc-logo-print{display:none}

/* ============ PRINT — Pasha IO summary as a clean document ============ */
@media print{
  /* hide everything except the summary document */
  body * { visibility:hidden !important; }
  #paneResult, #paneResult * { visibility:visible !important; }
  .no-print, .ai-actions, .ai-disc, .nav, .dock, .drawer, footer, .ai-steps, .ai-hero { display:none !important; }
  /* lift the result to the top of the page */
  #paneResult{ position:absolute !important; left:0; top:0; width:100%; margin:0; padding:0; }
  html, body{ background:#fff !important; color:#000 !important; }
  @page{ margin:18mm 16mm; }
  /* the document card: flat, no shadows, black on white */
  #paneResult .doc{ box-shadow:none !important; border:none !important; border-radius:0 !important; background:#fff !important; max-width:100% !important; }
  #paneResult .doc-head{ background:#fff !important; border-bottom:1.5px solid #111 !important; padding:0 0 14px !important; display:flex; align-items:center; gap:14px; }
  /* swap to black logo for white paper */
  .doc-logo-light{ display:none !important; }
  .doc-logo-print{ display:block !important; height:38px !important; width:auto !important; filter:none !important; }
  #paneResult .doc-head .dh strong{ color:#111 !important; font-size:1.05rem; }
  #paneResult .doc-head .dh span{ color:#444 !important; }
  #paneResult .doc-body{ padding:18px 0 0 !important; color:#111 !important; }
  #paneResult .doc-body h4{ color:#111 !important; margin:16px 0 6px; font-size:1rem; border-bottom:none; }
  #paneResult .doc-body p, #paneResult .doc-body li{ color:#222 !important; font-size:.95rem; line-height:1.5; }
  #paneResult .flag{ background:#f6f6f4 !important; border:1px solid #ddd !important; color:#222 !important; }
  /* footer line on the printed page */
  #paneResult .doc-body::after{
    content:"Prepared by Pasha IO · Pasha Legal · (03) 9848 7275 · pashalegal.com.au — General information only, not legal advice.";
    display:block; margin-top:26px; padding-top:12px; border-top:1px solid #ccc;
    font-size:.72rem; color:#666; }
}