/* Duo pages (/duo/**). Self-contained and uses the Duo brand tokens from UI-RULES §2. */
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/plus-jakarta-sans-latin-400.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('/assets/fonts/plus-jakarta-sans-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/plus-jakarta-sans-latin-700.woff2') format('woff2'); }
:root {
  color-scheme: light dark;
  --bg: #F5F3EF; --surface: #FFFFFF; --surface-2: #EFECE6; --ink: #15141A; --muted: #67636E;
  --border: #E6E2DA; --brand: #2550A8; --brand-hover: #1D438F; --brand-tint: #CFE0FF;
  --apricot: #FFDCC7; --btn-bg: #15141A; --btn-fg: #FFFFFF; --shadow: 0 10px 30px rgba(21,20,26,.07);
  --serif: 'Fraunces', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, serif;
  --sans: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --bg:#121116; --surface:#1D1C23; --surface-2:#26252D; --ink:#F3F1EC; --muted:#A8A4B0; --border:#2C2A33; --brand:#C9DAFF; --brand-hover:#DCE7FF; --brand-tint:#24365E; --apricot:#55301E; --btn-bg:#DDF26B; --btn-fg:#15141A; --shadow:0 10px 30px rgba(0,0,0,.35); } }
:root[data-theme="dark"] { color-scheme:dark; --bg:#121116; --surface:#1D1C23; --surface-2:#26252D; --ink:#F3F1EC; --muted:#A8A4B0; --border:#2C2A33; --brand:#C9DAFF; --brand-hover:#DCE7FF; --brand-tint:#24365E; --apricot:#55301E; --btn-bg:#DDF26B; --btn-fg:#15141A; --shadow:0 10px 30px rgba(0,0,0,.35); }
:root[data-theme="light"] { color-scheme:light; }
*,*::before,*::after { box-sizing:border-box; }
body.duo-page { margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; }
.duo-page a { color:inherit; text-underline-offset:4px; }
.duo-page a:focus-visible,.duo-page button:focus-visible,.duo-page summary:focus-visible { outline:3px solid var(--brand); outline-offset:3px; border-radius:8px; }
.duo-page h1,.duo-page h2,.duo-page h3 { font-family:var(--serif); font-weight:600; letter-spacing:-.02em; line-height:1.15; margin:0; color:var(--ink); }
.duo-page .wrap { width:min(1080px,calc(100% - 40px)); margin-inline:auto; }
.duo-page .skip-link { position:absolute; left:16px; top:-100px; z-index:100; padding:10px 16px; background:var(--btn-bg); color:var(--btn-fg); font-weight:700; border-radius:8px; text-decoration:none; }
.duo-page .skip-link:focus { top:12px; }
.duo-page .site-header { max-width:1160px; margin:0 auto; padding:18px 20px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.duo-page .brand { display:inline-flex; align-items:center; gap:10px; text-decoration:none; font-family:var(--serif); font-weight:700; font-size:22px; letter-spacing:-.02em; }
.duo-page .brand img { display:block; border-radius:8px; }
.duo-page .brand small { font:600 11px var(--sans); color:var(--muted); letter-spacing:0; }
.duo-page .site-header nav { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.duo-page .nav-link { text-decoration:none; color:var(--muted); font-size:14px; font-weight:600; padding:6px 8px; }
.duo-page .nav-link:hover { color:var(--ink); }
.duo-page .pill-btn { font:600 13px var(--sans); color:var(--ink); background:transparent; text-decoration:none; cursor:pointer; border:1px solid var(--border); border-radius:99px; padding:6px 14px; line-height:1.4; }
.duo-page .pill-btn:hover { background:var(--surface-2); }
.duo-page .eyebrow { font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--brand); margin:0 0 14px; }
.duo-page .lede { font-size:19px; color:var(--muted); max-width:620px; margin:20px 0 0; }
.duo-page .hero { display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:center; padding:64px 0 76px; }
.duo-page .hero h1 { font-size:clamp(42px,7vw,72px); line-height:1.04; letter-spacing:-.04em; }
.duo-page .hero-cta { display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px; margin-top:28px; }
.duo-page .hero-note { display:inline-flex; padding:10px 16px; border:1px solid var(--border); border-radius:99px; color:var(--muted); font-size:14px; font-weight:700; }
.duo-page .hero-visual { display:flex; justify-content:center; }
.duo-page .conversation-card { width:min(370px,100%); min-height:290px; padding:32px 26px; border-radius:32px; background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow); display:flex; flex-direction:column; justify-content:center; gap:18px; position:relative; overflow:hidden; }
.duo-page .conversation-card::before { content:""; width:180px; height:180px; border-radius:50%; background:var(--brand-tint); opacity:.55; position:absolute; right:-75px; top:-85px; }
.duo-page .bubble { position:relative; display:block; width:fit-content; max-width:90%; padding:14px 18px; border-radius:24px; font-weight:600; }
.duo-page .bubble.me { background:var(--brand-tint); color:var(--ink); border-bottom-left-radius:8px; }
.duo-page .bubble.them { align-self:flex-end; background:var(--apricot); color:var(--ink); border-bottom-right-radius:8px; }
.duo-page .conversation-mark { align-self:center; margin-top:8px; font:700 14px var(--sans); color:var(--muted); }
.duo-page .features-section { padding:20px 0 64px; }
.duo-page .section-head { max-width:640px; margin-bottom:32px; }
.duo-page .section-head h2 { font-size:clamp(30px,4.5vw,44px); }
.duo-page .feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.duo-page .feature { background:var(--surface); border:1px solid var(--border); border-radius:24px; padding:26px 24px 28px; box-shadow:var(--shadow); }
.duo-page .feature .dot { width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:var(--brand-tint); color:var(--brand); font-weight:700; font-size:12px; margin-bottom:18px; }
.duo-page .feature h3 { font-size:22px; margin-bottom:8px; }
.duo-page .feature p { margin:0; color:var(--muted); font-size:15px; }
.duo-page .band { margin:36px 0 72px; background:var(--ink); color:var(--bg); border-radius:28px; padding:40px 36px; display:grid; gap:10px; }
.duo-page .band h2 { color:var(--bg); font-size:clamp(26px,4vw,36px); }
.duo-page .band p:not(.eyebrow) { margin:0; max-width:680px; color:var(--muted); }
.duo-page .band .eyebrow { color:var(--apricot); margin-bottom:4px; }
.duo-page .btn { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; background:var(--btn-bg); color:var(--btn-fg); border-radius:99px; padding:12px 22px; font-weight:700; justify-self:start; margin-top:14px; }
.duo-page .btn:hover { filter:brightness(1.12); }
.duo-page .btn.secondary { background:transparent; color:var(--bg); border:1px solid currentColor; }
.duo-page .legal-main { padding:32px 0 72px; max-width:760px; }
.duo-page .legal-head h1 { font-size:clamp(34px,5vw,52px); }
.duo-page .prose section { margin-top:36px; }
.duo-page .prose h2 { font-size:24px; margin-bottom:10px; }
.duo-page .prose p { margin:0 0 12px; color:var(--ink); }
.duo-page .prose ul,.duo-page .prose ol { margin:0 0 12px; padding-left:22px; }
.duo-page .prose li { margin-bottom:8px; }
.duo-page .prose a,.duo-page .contact-callout a { color:var(--brand); font-weight:600; }
.duo-page .faq-list { margin-top:32px; }
.duo-page .faq-item { border-bottom:1px solid var(--border); }
.duo-page .faq-item summary { cursor:pointer; list-style:none; padding:18px 28px 18px 0; font-weight:600; position:relative; }
.duo-page .faq-item summary::-webkit-details-marker { display:none; }
.duo-page .faq-item summary::after { content:'+'; position:absolute; right:4px; top:16px; font-size:22px; color:var(--brand); }
.duo-page .faq-item[open] summary::after { transform:rotate(45deg); }
.duo-page .faq-item p { margin:0 0 18px; color:var(--muted); }
.duo-page .contact-callout { margin-top:36px; padding:18px 22px; background:var(--brand-tint); border-radius:18px; }
.duo-page .site-footer { max-width:1160px; margin:0 auto; padding:32px 20px 44px; border-top:1px solid var(--border); color:var(--muted); font-size:13px; }
.duo-page .footer-main { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
.duo-page .footer-main .brand { font-size:18px; color:var(--ink); }
.duo-page .footer-main small { font-family:var(--sans); font-size:12px; font-weight:500; opacity:.8; }
.duo-page .footer-links { display:flex; flex-wrap:wrap; gap:12px 22px; margin-top:18px; }
.duo-page .footer-links a { text-decoration:none; color:var(--muted); }
.duo-page .footer-links a:hover { color:var(--ink); }
@media (max-width:860px) { .duo-page .hero { grid-template-columns:1fr; padding-top:28px; }.duo-page .hero-visual { order:-1; justify-content:flex-start; }.duo-page .conversation-card { width:min(420px,100%); }.duo-page .feature-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .duo-page .feature-grid { grid-template-columns:1fr; }.duo-page .band { padding:30px 22px; }.duo-page .site-header { padding:14px 16px; }.duo-page .hero { padding-bottom:52px; } }
@media (prefers-reduced-motion:reduce) { .duo-page * { transition:none !important; scroll-behavior:auto !important; } }
