/* ==========================================================================
   Hello DocA — tokens, base, type, actions, header, drawer, ticker, footer.
   Ported from the approved v3 prototype. Component styles live in DocA Core.
   Dark is the default design; light is its own design, not an inversion.
   ========================================================================== */

/* ==========================================================================
   TOKENS — dark is the default design; light is its own design, not an inversion.
   Every text/background pair below was measured (see Impact → accessibility note).
   ========================================================================== */
:root,[data-theme="dark"]{
  --bg:#050505; --bg-2:#0D0D0D; --surface:#141414; --surface-2:#1C1C1C; --line:#262626; --line-2:#3A3A3A;
  --fg:#FFFFFF; --dim:#A9A9A9; --dim-2:#8C8C8C;
  --accent:#9BB436; --accent-fill:#9BB436; --accent-hover:#B7D14C; --on-accent:#0A0E02;
  --wine:#541641; --wine-hover:#6B1D53; --wine-text:#C86BA4; --card:#541641; --card-line:#6B1D53;
  --gap-fg:#E4B33F; --gap-bg:rgba(228,179,63,.12); --gap-line:rgba(228,179,63,.42);
  --focus:#B7D14C; --chrome:rgba(5,5,5,.9); --veil:rgba(255,255,255,.06);
  --acc-eacc:#F08A57; --acc-rri:#F2786C; --acc-acp:#78B2E6; --acc-none:#8C8C8C;
  --strip-off:#6E6E6E; color-scheme:dark;
}
[data-theme="light"]{
  --bg:#FFFFFF; --bg-2:#F4F4F2; --surface:#F7F7F5; --surface-2:#EDEDEA; --line:#E2E2DE; --line-2:#C9C9C3;
  --fg:#0D0D0D; --dim:#4A4A4A; --dim-2:#666666;
  --accent:#4F5E1A; --accent-fill:#9BB436; --accent-hover:#8CA630; --on-accent:#0A0E02;
  --wine:#541641; --wine-hover:#6B1D53; --wine-text:#541641; --card:#541641; --card-line:#541641;
  --gap-fg:#7A5008; --gap-bg:rgba(122,80,8,.08); --gap-line:rgba(122,80,8,.32);
  --focus:#541641; --chrome:rgba(255,255,255,.92); --veil:rgba(0,0,0,.04);
  --acc-eacc:#B5471A; --acc-rri:#B42318; --acc-acp:#1F5A8A; --acc-none:#666666;
  --strip-off:#8A8A85; color-scheme:light;
}
:root{
  --font-display:'Syne','Helvetica Neue',Arial,sans-serif;
  --font-sans:'Instrument Sans','Helvetica Neue',Arial,sans-serif;
  --r-xs:4px; --r-sm:6px; --r-md:8px; --r-lg:12px;
  --max:1320px; --gut:clamp(20px,4vw,40px); --band:clamp(64px,9vw,120px);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background-color .35s ease,color .35s ease}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:600;line-height:1.08;letter-spacing:-.018em}
p{margin:0}a{color:inherit}button,input,select,textarea{font:inherit;color:inherit}
img{max-width:100%;display:block}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;z-index:300;background:var(--accent-fill);color:var(--on-accent);padding:12px 18px;border-radius:var(--r-sm)}
.skip:focus{left:16px;top:16px}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
.narrow{max-width:820px;margin:0 auto;padding-inline:var(--gut)}
.band{padding-block:var(--band)}
.alt{background:var(--bg-2)}
.bt{border-top:1px solid var(--line)}
.dim{color:var(--dim)}.dim2{color:var(--dim-2)}
.photo{filter:grayscale(1) contrast(1.06)}

/* island: surfaces that stay dark in both themes (hero, page headers over photos) */
.island{--fg:#FFFFFF;--dim:#D2D2D2;--dim-2:#B5B5B5;--line:rgba(255,255,255,.2);--accent:#B7D14C;--focus:#B7D14C;color:#FFFFFF}

/* ---------- type ---------- */
.t-hero{font-size:clamp(40px,6.4vw,84px);font-weight:600;line-height:1.02;letter-spacing:-.025em}
.t-page{font-size:clamp(38px,5.4vw,68px);font-weight:600;line-height:1.04;letter-spacing:-.022em}
.t-sec{font-size:clamp(30px,3.8vw,50px);font-weight:600;letter-spacing:-.02em}
.t-acc{font-size:clamp(28px,3.4vw,44px);font-weight:600;color:var(--accent);letter-spacing:-.018em}
.t-card{font-size:22px;font-weight:600;line-height:1.18}
.lede{font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:var(--dim);max-width:62ch}
.flourish{font-style:italic;font-size:17px;color:var(--accent)}
.meta{font-size:14px;color:var(--dim-2)}
.small{font-size:15px}

/* ---------- actions ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:var(--r-sm);
  border:1.5px solid transparent;font-family:var(--font-sans);font-size:16px;font-weight:600;text-decoration:none;cursor:pointer;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s var(--ease);white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn-accent{background:var(--accent-fill);color:var(--on-accent)}
.btn-accent:hover{background:var(--accent-hover)}
.btn-ghost{border-color:var(--fg);color:var(--fg);background:transparent}
.btn-ghost:hover{background:var(--fg);color:var(--bg)}
.btn-wine{background:var(--wine);color:#FFFFFF}.btn-wine:hover{background:var(--wine-hover)}
.btn-sm{min-height:44px;padding:0 18px;font-size:15px}
.lnk{display:inline-flex;align-items:center;gap:8px;font-weight:600;text-decoration:none;color:var(--fg);
  border-bottom:1.5px solid var(--accent-fill);padding-bottom:3px;transition:gap .2s var(--ease),color .2s}
.lnk svg{width:14px;height:14px;transition:transform .25s var(--ease)}
.lnk:hover{color:var(--accent)}.lnk:hover svg{transform:translate(2px,-2px)}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 10px;border-radius:var(--r-xs);font-size:13px;font-weight:600;
  border:1px solid var(--line-2);color:var(--dim)}
.chip-on{background:var(--accent-fill);border-color:var(--accent-fill);color:var(--on-accent)}
.chip-wine{background:var(--wine);border-color:var(--wine);color:#FFFFFF}
.gap{display:inline-flex;align-items:center;min-height:24px;padding:0 8px;border-radius:var(--r-xs);background:var(--gap-bg);
  border:1px solid var(--gap-line);color:var(--gap-fg);font-size:12px;font-weight:600;letter-spacing:.06em}
.gap-note{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border-radius:var(--r-md);background:var(--gap-bg);
  border:1px solid var(--gap-line);color:var(--fg);font-size:15px;line-height:1.55}
.dot{width:9px;height:9px;border-radius:5px;flex:0 0 auto;display:inline-block}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:90;background:var(--chrome);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.nav-in{height:84px;display:flex;align-items:center;gap:32px}
.logo{display:flex;align-items:center;flex:0 0 auto}
.logo img{height:46px;width:auto}
.logo .l-light{display:none}
[data-theme="light"] .logo .l-light{display:block}[data-theme="light"] .logo .l-dark{display:none}
.menu{display:flex;align-items:center;gap:26px;margin-inline:auto}
.menu a{position:relative;display:flex;align-items:center;gap:9px;height:84px;font-size:16px;font-weight:500;text-decoration:none;color:var(--fg)}
.menu a::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--accent-fill);transform:scaleX(0);
  transform-origin:left;transition:transform .3s var(--ease)}
.menu a:hover::after,.menu a[aria-current="page"]::after{transform:scaleX(1)}
.menu a[aria-current="page"]{color:var(--accent)}
.menu .status{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--dim)}
.nav-act{display:flex;gap:8px;flex:0 0 auto}
.ib{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-sm);
  border:1px solid var(--line-2);background:transparent;color:var(--fg);cursor:pointer;text-decoration:none;transition:border-color .2s,background-color .2s}
.ib:hover{border-color:var(--fg);background:var(--veil)}
.ib svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:1140px){.menu{display:none}.nav-act{margin-left:auto}}

.drawer{position:fixed;inset:0;z-index:120;background:var(--bg);padding:calc(20px + env(safe-area-inset-top,0px)) var(--gut) 32px;
  display:flex;flex-direction:column;gap:28px;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s}
body.nav-open .drawer{opacity:1;visibility:visible}
.drawer-top{max-width:var(--max);width:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.drawer-grid{max-width:var(--max);width:100%;margin:0 auto;flex:1;display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:56px;align-content:center;overflow-y:auto}
@media(max-width:900px){.drawer-grid{grid-template-columns:1fr;gap:32px;align-content:start}}
.dr-main a{display:flex;align-items:baseline;gap:18px;padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--font-display);font-size:clamp(28px,3.4vw,44px);
  font-weight:600;line-height:1.1;text-decoration:none;color:var(--fg);transition:color .2s,padding-left .3s var(--ease)}
.dr-main a em{font-style:normal;font-family:var(--font-sans);font-size:13px;font-weight:600;color:var(--accent);min-width:26px}
.dr-main a small{margin-left:auto;font-family:var(--font-sans);font-size:14px;font-weight:500;color:var(--dim)}
.dr-main a:hover{color:var(--accent);padding-left:8px}
.dr-col h3{font-family:var(--font-sans);font-size:14px;font-weight:600;color:var(--accent);margin-bottom:8px}
.dr-col a{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--dim);font-size:16px}
.dr-col a:hover{color:var(--fg)}
.dr-col a span{font-size:13px;color:var(--dim-2)}
.drawer-foot{max-width:var(--max);width:100%;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:18px;border-top:1px solid var(--line);font-size:14px;color:var(--dim-2)}
body.nav-open .dr-main a,body.nav-open .dr-col{animation:drin .5s var(--ease) both}
.dr-main a:nth-child(2){animation-delay:.04s}.dr-main a:nth-child(3){animation-delay:.08s}.dr-main a:nth-child(4){animation-delay:.12s}
.dr-main a:nth-child(5){animation-delay:.16s}.dr-main a:nth-child(6){animation-delay:.2s}.dr-col{animation-delay:.18s}
@keyframes drin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}


/* ---------- ticker, read progress ---------- */
.ticker{background:#000;color:#FFFFFF;border-bottom:1px solid #1F1F1F;font-size:14px;padding-top:env(safe-area-inset-top,0px)}
[data-theme="light"] .ticker{background:#0D0D0D}
.ticker-in{display:flex;align-items:center;gap:14px;min-height:44px}
.ticker p{margin:0;color:#CFCFCF;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ticker p b{color:#FFFFFF;font-weight:600}
.ticker .chip{border-color:#3A3A3A;color:#CFCFCF;flex:0 0 auto}
.ticker .chip-on{background:#9BB436;border-color:#9BB436;color:#0A0E02}
.ticker a{margin-left:auto;flex:0 0 auto;color:#B7D14C;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(183,209,76,.5);padding-bottom:1px}
.ticker a:hover{color:#FFFFFF;border-color:#FFFFFF}
@media(max-width:640px){.ticker a{display:none}}
.readbar{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--accent-fill)}


/* ---------- footer ---------- */
.foot{background:#000;color:#FFFFFF;--fg:#FFFFFF;--dim:#B5B5B5;--dim-2:#9A9A9A;--line:#262626;--line-2:#3A3A3A;--bg:#000;--accent:#B7D14C;--focus:#B7D14C;
  padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}
[data-theme="light"] .foot{background:#0D0D0D}
.foot-cta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:end;padding-block:clamp(56px,7vw,88px);border-bottom:1px solid #262626}
@media(max-width:900px){.foot-cta{grid-template-columns:1fr}}
.foot-cols{display:grid;grid-template-columns:1.5fr repeat(4,minmax(0,1fr));gap:32px;padding-block:48px;border-bottom:1px solid #262626}
@media(max-width:980px){.foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
.foot h4{font-family:var(--font-sans);font-size:15px;font-weight:600;color:#B7D14C;margin-bottom:14px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.foot li a{color:#C9C9C9;text-decoration:none;font-size:15px}.foot li a:hover{color:#FFFFFF}
.foot-bot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;padding-top:26px;font-size:14px;color:#9A9A9A}
.foot-bot .sp{flex:1}
.soc{display:flex;gap:8px}
.foot .ib{border-color:#3A3A3A;color:#FFFFFF}.foot .ib:hover{border-color:#FFFFFF}
.tgl{min-height:44px;padding:0 14px;border-radius:var(--r-sm);border:1px solid #3A3A3A;background:transparent;color:#FFFFFF;cursor:pointer;font-size:14px;font-weight:600}
.tgl:hover{border-color:#FFFFFF}


/* ---------- WordPress and Hello additions ---------- */
[hidden]{display:none!important}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;word-wrap:normal!important}
.site-main{display:block}
.nav .menu .status{white-space:nowrap}
.foot .inline-form input{min-height:52px;padding:0 16px;border-radius:6px;border:1px solid #3A3A3A;background:#0D0D0D;color:#fff;font-size:16px}
.foot .inline-form{flex-wrap:wrap}
.foot .doca-alerts label.sr{position:absolute}
.doca-prose{font-size:18px;line-height:1.7}
.doca-prose>*+*{margin-top:1.1em}
.doca-prose h2{font-size:clamp(26px,3vw,36px);margin-top:1.6em}
.doca-prose h3{font-size:24px;margin-top:1.4em}
.doca-prose a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.doca-prose ul,.doca-prose ol{padding-left:1.2em}
.doca-prose blockquote{margin:1.4em 0;padding-left:20px;border-left:3px solid var(--accent-fill);font-size:20px}
.doca-prose img{border-radius:var(--r-md)}
.drawer .dr-col p{margin:0}
body.nav-open{overflow:hidden}
