/* ai.nextis.ge: the public AI Accountant (docs/plans/AI_PUBLIC_PLAN.md, cards
   PUB2 + AI-4), in the nextis.ge "teal splash" language shared with
   companion.nextis.ge. Tokens, type scale, header, buttons, cards, bands and
   footer are copied (not imported) from those two stylesheets, so this site
   stays standalone. Two modes on one page:
     - framed (inside an embed's iframe): the bare chat, from ~320px wide up;
     - direct (body.site, set by app.js): header, teal hero with the chat as a
       card breaking its bottom edge, about, bands, footer.
   No inline styles anywhere: the vhost's CSP is style-src 'self'.

   Self-hosted Noto Sans + Noto Sans Georgian + Noto Sans Armenian (variable,
   400–800), SIL Open Font License (copied from marketing/src/assets/fonts, whose
   OFL.txt covers them). One file per script subset; the browser fetches a file
   only when the page uses a glyph in its unicode-range. The Lari sign ₾ comes
   from Noto Sans Georgian's 14 KB latin-ext file. */
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/noto-sans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/noto-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20BD,U+20BF-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/noto-sans-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Sans Georgian";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/noto-sans-georgian.woff2) format("woff2");unicode-range:U+0589,U+10A0-10FF,U+1C90-1CBA,U+1CBD-1CBF,U+205A,U+2D00-2D2F,U+2E31}
@font-face{font-family:"Noto Sans Georgian";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/noto-sans-georgian-latin-ext.woff2) format("woff2");unicode-range:U+20BE}
@font-face{font-family:"Noto Sans Armenian";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/noto-sans-armenian.woff2) format("woff2");unicode-range:U+0308,U+0530-058F,U+2010,U+2024,U+25CC,U+FB13-FB17}

/* ── tokens (nextis.ge / companion.nextis.ge, Oct 2026) ─────────────────── */
:root{
  --navy:#0B1F3A;            /* headings, primary buttons, question bubbles, navy band */
  --navy-2:#081729;          /* footer ground, primary-button hover */
  --teal:#00C2A8;            /* header + hero ground, » markers, focus glow */
  --teal-ink:#085041;        /* eyebrows, links, citation chips on white/mint */
  --teal-ink-strong:#064537; /* small text ON TEAL (4.85:1; #085041 is only 4.15:1 there) */
  --mint:#E1F5EE;            /* citation chips, selected pills */
  --mint-2:#F2FAF7;          /* answer bubbles, tinted bands */
  --ink-2:#44546A;           /* body text on white */
  --ink-3:#657183;           /* muted labels, footnotes (4.66:1 on mint-2) */
  --line:rgba(11,31,58,.10);
  --line-2:rgba(11,31,58,.16);
  --line-teal:rgba(11,31,58,.14);
  --error:#B42318;
  --error-bg:#FFF6F5;
  --footer-fg:#9FB0C6;
  --on-navy-2:#DCE6F2;
  --shadow-card:0 10px 30px -18px rgba(11,31,58,.25);
  --shadow-lift:0 24px 40px -24px rgba(11,31,58,.35);
  --shadow-chat:0 40px 60px -32px rgba(11,31,58,.5);
  --font:"Noto Sans","Noto Sans Georgian","Noto Sans Armenian",system-ui,sans-serif;
}

/* ── base ───────────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;padding:0;height:100%}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font);font-size:15px;line-height:1.55;color:var(--ink-2);background:#fff;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p{margin:0}
h1,h2,h3,h4{color:var(--navy);overflow-wrap:break-word}
a{color:var(--teal-ink)}
button{font:inherit}
:focus-visible{outline:2px solid var(--teal-ink);outline-offset:2px}
/* rings keep 3:1+ against their ground: teal-ink on light, navy on teal, teal on navy */
.site-header :focus-visible,.hero :focus-visible,.page-head :focus-visible{outline-color:var(--navy)}
.cta-dark :focus-visible,.site-footer :focus-visible{outline-color:var(--teal)}

.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.noscript{padding:24px;color:var(--ink-2)}
.mark{display:block;flex:none;width:28px;height:28px}
.chev{color:var(--teal);font-weight:800;font-size:24px;line-height:1}

/* ── the chat: header / scrolling log / input / footer ─────────────────────
   Framed, .stage and .chat fill the iframe and only the log scrolls. */
.stage{height:100%}
.stage-bg{display:none}
.chat{display:flex;flex-direction:column;height:100%;min-height:360px;max-width:860px;margin:0 auto;background:#fff;color:var(--navy)}

.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
.top .brand{display:flex;gap:10px;align-items:center;min-width:0}
.brandText{min-width:0}
.brandText h1{font-size:16px;font-weight:800;letter-spacing:-.01em;line-height:1.3}
.brandText p{margin-top:1px;font-size:12.5px;line-height:1.4;color:var(--ink-3)}

/* language pills: in the chat header (framed) and the site header / menu */
.langs,.lang-switch{display:flex;flex-wrap:wrap;align-items:center;gap:2px}
.langs{flex:none;flex-wrap:nowrap;justify-content:flex-end}
.langs button,.lang-switch button{padding:4px 8px;border:0;border-radius:999px;background:none;color:var(--ink-3);font-size:12px;font-weight:700;line-height:1.5;cursor:pointer}
.langs button:hover,.lang-switch button:hover{color:var(--navy)}
.langs button[aria-pressed="true"],.lang-switch button[aria-pressed="true"]{background:var(--mint);color:var(--navy)}

.log{flex:1 1 auto;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;background:#fff}

/* ── messages ── question: navy bubble, right; answer: mint bubble, left ──── */
.msg{max-width:92%;padding:12px 15px;border-radius:14px;font-size:15px;line-height:1.55}
.msg.user{align-self:flex-end;max-width:85%;background:var(--navy);color:#fff;border-radius:14px 14px 4px 14px;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.ai,.msg.note{align-self:flex-start;background:var(--mint-2);color:var(--navy);border-radius:4px 14px 14px 14px}
.msg.error{align-self:flex-start;background:var(--error-bg);color:var(--error);border:1px solid rgba(180,35,24,.18)}
.msg.offtopic{align-self:flex-start;background:#fff;color:var(--navy);border:1px solid rgba(0,194,168,.45);border-radius:4px 14px 14px 14px}

.answer{overflow-wrap:break-word}
.answer>:first-child{margin-top:0}
.answer>:last-child{margin-bottom:0}
.answer p{margin:0 0 8px}
.answer h3,.answer h4{margin:14px 0 6px;font-size:15px;font-weight:800;line-height:1.4}
.answer h3{font-size:16px}
.answer strong{font-weight:700}
/* lists as on nextis.ge posts: » bullets, navy number discs */
.answer ul,.answer ol{margin:0 0 8px;padding:0;list-style:none}
.answer li{position:relative;margin:5px 0}
.answer ul>li{padding-left:20px}
.answer ul>li::before{content:"»";position:absolute;left:1px;color:var(--teal);font-weight:800}
.answer ol{counter-reset:step}
.answer ol>li{padding-left:30px;counter-increment:step}
.answer ol>li::before{content:counter(step);position:absolute;left:0;top:2px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--navy);color:#fff;font-size:11.5px;font-weight:700;line-height:1}
/* tables (as on nextis.ge posts; wide ones scroll sideways inside the bubble), quotes,
   rules, inline code */
.answer .table-wrap{margin:6px 0 10px;overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:#fff}
.answer table{width:100%;border-collapse:collapse;font-size:13.5px;line-height:1.45;font-variant-numeric:tabular-nums}
.answer th,.answer td{min-width:4.5em;padding:7px 10px;text-align:left;vertical-align:top}
.answer th{border-bottom:2px solid var(--navy);color:var(--navy);font-weight:700}
.answer td{border-bottom:1px solid var(--line)}
.answer tbody tr:last-child td{border-bottom:0}
.answer tbody tr:nth-child(even){background:var(--mint-2)}
.answer th.al-center,.answer td.al-center{text-align:center}
.answer th.al-right,.answer td.al-right{text-align:right}
.answer blockquote{margin:6px 0 10px;padding:2px 0 2px 12px;border-left:3px solid var(--teal);color:var(--ink-2)}
.answer blockquote>:last-child{margin-bottom:0}
.answer hr{margin:12px 0;border:0;border-top:1px solid var(--line)}
.answer code{padding:1px 5px;border-radius:5px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em}

.mt-note{margin:10px 0 0;padding:8px 11px;font-size:12.5px;line-height:1.45;color:#7A4B00;background:#FFF7E6;border:1px solid #F5DDAA;border-radius:10px}
.unreviewed{margin:8px 0 0;font-size:12px;color:var(--ink-3)}

/* [n] citation chips (in the answer) and the numbered sources list */
.answer a.cite,.sources .num{display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--mint);box-shadow:inset 0 0 0 1px rgba(8,80,65,.16);color:var(--teal-ink);font-size:11px;font-weight:800;line-height:1;text-decoration:none}
.answer a.cite{margin:0 1px;vertical-align:2px;transition:background-color .16s ease,color .16s ease}
.answer a.cite:hover{background:var(--teal);color:var(--navy)}
.sources{margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.sources summary{cursor:pointer;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--teal-ink)}
.sources ul{margin:8px 0 0;padding:0;list-style:none;font-size:13.5px;line-height:1.5}
.sources li{margin:3px 0 3px -6px;padding:3px 6px;border-radius:8px}
.sources li.flash{animation:flash 1.4s ease-out}
@keyframes flash{from{background:var(--mint)}to{background:transparent}}
.sources .num{margin-right:7px;vertical-align:1px}
.sources a{color:var(--teal-ink);font-weight:600;text-decoration:underline;text-decoration-color:rgba(8,80,65,.35);text-underline-offset:2px}
.sources a:hover{color:var(--navy);text-decoration-color:currentColor}
.sources .badge{display:inline-block;margin-right:6px;padding:0 8px;border-radius:999px;background:var(--navy);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.06em;line-height:1.75;text-transform:uppercase;vertical-align:1px}
.sources .badge.tr{background:#fff;color:var(--ink-3);box-shadow:inset 0 0 0 1px var(--line-2);font-weight:700}
.answer-disclaimer{margin:10px 0 0;font-size:12px;line-height:1.5;color:var(--ink-3)}

.rate{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:12.5px;color:var(--ink-3)}
.rate button{padding:2px 10px;border:1px solid var(--line-2);border-radius:999px;background:#fff;font-size:14px;line-height:1.5;cursor:pointer;transition:border-color .16s ease}
.rate button:hover:not(:disabled){border-color:var(--teal)}
.rate button:disabled{cursor:default;opacity:.5}

.thinking{color:var(--ink-3);font-size:14.5px}
.thinking::after{content:"";display:inline-block;width:1.2em;text-align:left;animation:dots 1.2s steps(4,end) infinite}
@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}

.starters{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.starters button{padding:7px 14px;border:1px solid var(--line-2);border-radius:999px;background:#fff;color:var(--navy);font-size:13.5px;font-weight:600;line-height:1.45;text-align:left;cursor:pointer;transition:border-color .16s ease}
.starters button:hover{border-color:var(--teal)}

/* ── input ──────────────────────────────────────────────────────────────── */
.ask{display:flex;gap:8px;align-items:flex-end;padding:12px 16px 4px;border-top:1px solid var(--line);background:#fff}
/* 16px text: iOS zooms the page into anything smaller on focus */
.ask textarea{flex:1 1 auto;min-width:0;resize:none;overflow-y:hidden;min-height:46px;max-height:160px;padding:11px 14px;border:1px solid var(--line-2);border-radius:12px;background:#fff;font:inherit;font-size:16px;line-height:1.4;color:var(--navy)}
.ask textarea::placeholder{color:var(--ink-3)}
.ask textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,194,168,.3)}
.ask textarea:disabled{background:var(--mint-2)}
.send{flex:none;height:46px;padding:0 22px;border:0;border-radius:999px;background:var(--navy);color:#fff;font-size:15px;font-weight:700;cursor:pointer;transition:background-color .16s ease}
.send:hover:not(:disabled){background:var(--navy-2)}
.send:disabled{opacity:.35;cursor:default}
.count{margin:0;padding:0 16px;min-height:16px;font-size:11.5px;color:var(--ink-3);text-align:right}

/* ── chat footer ────────────────────────────────────────────────────────── */
.foot{padding:4px 16px 12px;font-size:12px;line-height:1.5;color:var(--ink-3);background:#fff}
.foot p{margin:2px 0}
.footRow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px!important}
.cta{font-size:13px;font-weight:700;text-decoration:none}
.cta:hover{color:var(--navy)}
.by{margin-left:auto;font-weight:800;letter-spacing:-.01em;color:var(--navy)} /* right-aligned with or without a CTA */

/* Narrow frames (companion.nextis.ge's panel is ~490px on desktop): the subtitle
   would wrap to 3 lines in ka/ru and eat the conversation's room. */
@media (max-width:560px){
  .brandText p{display:none}
}
@media (max-width:480px){
  .top{flex-direction:column;align-items:flex-start;gap:6px;padding:10px 12px}
  .langs{flex-wrap:wrap;justify-content:flex-start;margin-left:-8px}
  .log{padding:12px}
  .msg{max-width:100%}
  .msg.user{max-width:90%}
  .ask{padding:10px 12px 4px}
  .send{padding:0 18px}
  .count{padding:0 12px}
  .foot{padding:4px 12px 10px}
}

/* ══ Site mode: the page visited directly, not framed (TASKMASTER AI-4) ════
   body.site is set by app.js only outside an iframe (and statically on
   /privacy/), so embeds keep the bare chat above. */
body.site{height:auto;font-size:17px;line-height:1.65}
html:has(body.site){scroll-padding-top:74px}
@media (prefers-reduced-motion:no-preference){html:has(body.site){scroll-behavior:smooth}}
.container{width:min(1140px,calc(100% - 48px));margin-inline:auto}
.eyebrow{font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink)}

.button{display:inline-flex;align-items:center;justify-content:center;padding:14px 26px;border:0;border-radius:999px;background:var(--navy);color:#fff;font:inherit;font-size:16px;font-weight:700;line-height:1.5;text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .16s ease,color .16s ease}
.button:hover{background:var(--navy-2);color:#fff}
.button.teal{background:var(--teal);color:var(--navy)}
.button.teal:hover{background:#2BD0BA;color:var(--navy)}
.text-link{font-weight:700;color:var(--teal-ink);text-decoration:none}
.text-link:hover{color:var(--navy)}

/* decorative double chevron; each context sets size, position, colour */
.ornament{position:absolute;pointer-events:none;fill:none;stroke-width:22;stroke-linecap:round;stroke-linejoin:round}
.ornament-hero{right:-120px;top:-134px;width:720px;height:720px;opacity:.16;stroke:#fff}
.ornament-head{right:-140px;top:-160px;width:620px;height:620px;opacity:.16;stroke:#fff}
.ornament-cta{left:-200px;bottom:-200px;width:520px;height:520px;opacity:.1;stroke:var(--teal)}

/* ── header (teal, sticky) ──────────────────────────────────────────────── */
.site-header{position:sticky;top:0;z-index:50;background:rgba(0,194,168,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-teal)}
.header-row{height:74px;display:flex;align-items:center;gap:24px}
.header-row *{white-space:nowrap}
.site-header .brand,.site-footer .brand{display:inline-flex;align-items:center;gap:9px;min-width:0;color:var(--navy);text-decoration:none;flex:none}
.wordmark{font-size:19px;font-weight:800;letter-spacing:-.02em;line-height:1}
.main-nav{display:flex;gap:24px;margin-left:auto;font-size:15px;font-weight:600;line-height:1.5}
.main-nav a{padding-bottom:2px;border-bottom:2px solid transparent;color:var(--navy);text-decoration:none}
.main-nav a:hover{color:var(--teal-ink-strong)}
.main-nav a[aria-current]{border-bottom-color:var(--navy)}
.header-end{display:flex;align-items:center;gap:12px;flex:none}
.site-header .header-lang button{color:var(--teal-ink-strong)}
.site-header .header-lang button:hover{color:var(--navy)}
.site-header .header-lang button[aria-pressed="true"]{background:var(--line-teal);color:var(--navy)}
.button-header{padding:11px 20px;font-size:15px}
.menu-toggle{display:none;width:44px;height:44px;margin-right:-8px;padding:0;border:0;border-radius:999px;background:transparent;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;flex:none}
.menu-toggle span{width:22px;height:2.5px;border-radius:2px;background:var(--navy);transition:transform .16s ease,opacity .16s ease}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.mobile-nav{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-lift)}
.mobile-nav .container{display:grid;gap:4px;padding:8px 0 22px}
.mobile-links{display:grid}
.mobile-links a{padding:12px 0;border-bottom:1px solid var(--line);color:var(--navy);font-size:17px;font-weight:600;text-decoration:none}
.mobile-links a[aria-current]{color:var(--teal-ink)}
.mobile-nav .lang-switch{gap:6px;margin-top:14px}
.mobile-nav .lang-switch button{padding:7px 12px;font-size:13px;color:var(--teal-ink)}
.mobile-nav .lang-switch button[aria-pressed="true"]{background:var(--mint);color:var(--navy)}

/* ── hero: teal ground; the chat card breaks its bottom edge ────────────── */
body.site .stage{position:relative;height:auto;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:start;padding:56px max(24px,calc((100% - 1140px)/2)) 0;background:var(--teal)}
body.site .stage-bg{display:block;position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero{position:relative;align-self:center;padding:8px 0 24px}
/* desktop: the chevrons sit behind the text column and point at the chat */
@media (min-width:901px){.stage .ornament-hero{left:-210px;right:auto;top:-70px;width:760px;height:760px}}
.hero .eyebrow{margin-bottom:18px;color:var(--teal-ink-strong)}
.hero h1{font-size:clamp(34px,4.4vw,48px);line-height:1.08;letter-spacing:-.025em;font-weight:800}
html:lang(ka) .hero h1,html:lang(hy) .hero h1{font-size:clamp(30px,3.6vw,42px);line-height:1.12}
.hero-lead{max-width:520px;margin-top:22px;color:var(--navy);font-size:18px;line-height:1.6}
body.site .chat{position:relative;z-index:2;height:640px;min-height:0;max-width:none;margin:0 0 -180px;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-chat)}
/* the brand and the language pills live in the site header */
body.site .chat .brandText h1,body.site .chat .langs{display:none}
body.site .chat .brandText p{display:block}
body.site .top{padding:14px 18px}
body.site .top .mark{width:24px;height:24px}
body.site .log{padding:18px}
body.site .ask{padding:12px 18px 4px}
body.site .count{padding:0 18px}
body.site .foot{padding:4px 18px 14px}

/* ── about: "what it is" cards, "what it isn't" rows ────────────────────── */
.about{padding:calc(180px + 80px) 0 88px}
.section-h2{max-width:720px;font-size:clamp(28px,3.6vw,36px);line-height:1.12;letter-spacing:-.02em;font-weight:800}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:32px}
.card{padding:28px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow-card)}
.card h3,.row h3{font-size:20px;font-weight:800;letter-spacing:-.01em;line-height:1.3}
.card h3{margin-top:12px}
.card p{margin-top:8px;font-size:15.5px;line-height:1.55}
.isnt{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start;margin-top:88px}
.rows{border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:36px minmax(0,1fr);gap:0 12px;padding:22px 0;border-bottom:1px solid var(--line)}
.row .chev{line-height:1.3}
.row h3{font-size:18px;font-weight:700;line-height:1.4}
.row p{margin-top:4px;font-size:15.5px;line-height:1.55}

/* ── bands: volunteers (mint), Companion (navy) ─────────────────────────── */
.cta-band{position:relative;overflow:hidden;padding:72px 0}
.cta-light{background:var(--mint-2);border-top:1px solid rgba(11,31,58,.08)}
.cta-dark{padding:88px 0;background:var(--navy)}
.cta-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:40px}
.cta-text{min-width:0;max-width:680px}
.cta-text h2{font-size:clamp(24px,3vw,28px);line-height:1.15;letter-spacing:-.02em;font-weight:800}
.cta-text p{margin-top:10px;font-size:16.5px}
.cta-dark h2{color:#fff}
.cta-dark p{color:var(--on-navy-2)}
.cta-actions{display:flex;gap:12px;flex:none}

/* ── footer (navy) ──────────────────────────────────────────────────────── */
.site-footer{padding:48px 0 28px;background:var(--navy-2);color:var(--footer-fg);font-size:15px}
.footer-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.site-footer .brand{color:#fff}
.site-footer .mark{width:30px;height:30px}
.site-footer .wordmark{font-size:20px}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.footer-links a{color:var(--footer-fg);text-decoration:none}
.footer-links a:hover{color:#fff}
.footer-links .footer-email{color:var(--teal)}
.footer-bottom{margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);font-size:13.5px}

/* ── /privacy/: a teal page head, then the notice in a 720px column ────── */
.post-col{width:min(720px,calc(100% - 48px));margin-inline:auto}
.page-head{position:relative;overflow:hidden;padding:40px 0 64px;background:var(--teal)}
.page-head-inner{position:relative;display:flex;flex-direction:column;gap:18px}
.back-link{align-self:flex-start;font-size:15px;font-weight:700;color:var(--navy);text-decoration:none}
.back-link:hover{color:var(--teal-ink-strong)}
.page-head h1{font-size:clamp(30px,4.2vw,42px);line-height:1.1;letter-spacing:-.025em;font-weight:800}
.updated{font-size:14.5px;font-weight:600;color:var(--teal-ink-strong)}
.doc-body{display:flex;flex-direction:column;gap:14px;padding:52px 0 80px;overflow-wrap:break-word}
.doc-body .lead{font-size:19px;line-height:1.6;color:var(--navy)}
.doc-body h2{margin-top:22px;font-size:22px;line-height:1.3;letter-spacing:-.01em;font-weight:800}
.doc-body p{line-height:1.7}
.doc-body p a{text-decoration:underline;text-underline-offset:3px}
.doc-body p a:hover{color:var(--navy)}
.doc-body .more{margin-top:18px;padding-top:22px;border-top:1px solid var(--line)}
.doc-body .more a.text-link{text-decoration:none}

/* ── responsive ─────────────────────────────────────────────────────────── */
/* Collapse the header to ☰ once its row stops fitting. Measured row widths with
   the real labels and the 48px gutters: en 801px, az 850, hy 968, ka 1008,
   ru 1013. Re-measure when a nav label changes. */
@media (max-width:900px){
  .main-nav,.header-lang{display:none}
  .header-end{margin-left:auto}
  .menu-toggle{display:flex}
}
@media (max-width:1060px){
  html:lang(ka) .main-nav,html:lang(ka) .header-lang,
  html:lang(ru) .main-nav,html:lang(ru) .header-lang,
  html:lang(hy) .main-nav,html:lang(hy) .header-lang{display:none}
  html:lang(ka) .header-end,html:lang(ru) .header-end,html:lang(hy) .header-end{margin-left:auto}
  html:lang(ka) .menu-toggle,html:lang(ru) .menu-toggle,html:lang(hy) .menu-toggle{display:flex}
}
@media (max-width:900px){
  html:has(body.site){scroll-padding-top:64px}
  .header-row{height:64px;gap:10px}
  .site-header .brand{gap:7px}
  .site-header .mark{width:26px;height:26px}
  .site-header .wordmark{font-size:17.5px}
  .button-header{padding:10px 16px;font-size:14px}
  body.site .stage{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:40px}
  .hero{padding:0}
  /* about a screenful: the notes under the input run long in ka/ru */
  body.site .chat{height:min(calc(100vh - 88px),720px);height:min(calc(100svh - 88px),720px);min-height:480px;margin-bottom:-120px}
  .about{padding-top:calc(120px + 64px)}
  .card-grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .isnt{grid-template-columns:minmax(0,1fr);gap:20px;margin-top:64px}
  .cta-row{flex-direction:column;align-items:flex-start;gap:22px}
}
@media (max-width:620px){
  body.site{font-size:16px;line-height:1.6}
  .container{width:calc(100% - 32px)}
  .post-col{width:calc(100% - 32px)}
  .eyebrow{font-size:12px}
  .button-header{display:none}          /* it is in the ☰ menu and the navy band */
  body.site .stage{padding:32px 16px 0;gap:24px}
  .ornament-hero{top:-104px;right:-150px;width:420px;height:420px}
  .hero .eyebrow{margin-bottom:14px}
  .hero h1{font-size:34px}
  html:lang(ka) .hero h1,html:lang(hy) .hero h1{font-size:30px;line-height:1.12}
  .hero-lead{margin-top:16px;font-size:16px}
  body.site .top{display:none}         /* the hero above already says it */
  body.site .log{padding:14px}
  body.site .ask{padding:10px 14px 4px}
  body.site .count{padding:0 14px}
  body.site .foot{padding:4px 14px 12px}
  .about{padding-bottom:64px}
  .card{padding:22px}
  .card h3{font-size:19px}
  .row{grid-template-columns:30px minmax(0,1fr);gap:0 10px;padding:18px 0}
  .row .chev{font-size:22px}
  .row h3{font-size:17px}
  .card p,.row p{font-size:15px}
  .cta-band{padding:56px 0}
  .cta-dark{padding:64px 0}
  .cta-actions,.cta-actions .button{width:100%}
  .cta-actions .button{white-space:normal}
  .site-footer{padding:40px 0 24px}
  .footer-row{flex-direction:column;align-items:flex-start}
  .footer-bottom{margin-top:24px;padding-top:18px;font-size:13px}
  .page-head{padding:28px 0 44px}
  .page-head-inner{gap:14px}
  .ornament-head{display:none}
  .doc-body{padding:36px 0 64px}
  .doc-body .lead{font-size:17.5px}
  .doc-body h2{font-size:20px}
}

/* ── reduced motion: no transitions, animations or smooth scroll ─────────── */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  .thinking::after{content:"…"}
}