/* Long-form marketing pages (guides, product explainers). Same tokens as
   homepage-coming-soon.html; kept separate so the homepage stays one file. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --pr:#0E7C7B;--prl:#14B8A6;--prxl:#CCFBF1;--ink:#134E4A;
  --bg:#F8FAFC;--bd:#E2E8F0;--tx:#1E293B;--tm:#475569;--tl:#94A3B8;
  --h:"DM Sans",sans-serif;--b:"Source Sans 3",sans-serif;
}
body{font-family:var(--b);color:var(--tx);background:#fff;font-size:17px;line-height:1.7}
h1,h2,h3{font-family:var(--h);letter-spacing:-.02em;line-height:1.2}
a{color:var(--pr)}
.sov{background:var(--ink);color:#A7F3D0;display:flex;align-items:center;justify-content:center;gap:8px;padding:9px 16px;font-size:13px;text-align:center}
.sov .dot{width:8px;height:8px;border-radius:50%;background:#10B981;flex-shrink:0}
.sov strong{font-family:var(--h)}
body>nav{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--bd)}
.nav-in{max-width:1140px;margin:0 auto;padding:0 32px;height:66px;display:flex;align-items:center;gap:12px}
.nav-in .brand{font-family:var(--h);font-weight:800;font-size:20px;color:var(--tx);text-decoration:none;display:flex;align-items:center;gap:12px}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:24px}
.nav-links a{font-family:var(--h);font-weight:600;font-size:14px;color:var(--tm);text-decoration:none}
.nav-links a:hover{color:var(--pr)}
.nav-links .nav-cta{background:var(--pr);color:#fff;padding:10px 20px;border-radius:8px}
.nav-links .nav-cta:hover{background:#0A6564;color:#fff}

.hd{background:linear-gradient(165deg,#F0FDFA 0%,#fff 70%);border-bottom:1px solid var(--bd)}
.hd-in{max-width:780px;margin:0 auto;padding:64px 32px 52px}
.crumbs{font-size:14px;color:var(--tl);margin-bottom:18px}
.crumbs a{color:var(--tm);text-decoration:none}
.crumbs a:hover{color:var(--pr)}
.kick{font-family:var(--h);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--pr);margin-bottom:12px}
.hd h1{font-weight:800;font-size:clamp(32px,5vw,46px);letter-spacing:-.03em;text-wrap:balance}
.hd .lead{font-size:19px;color:var(--tm);margin-top:18px;text-wrap:pretty}
.meta{font-size:14px;color:var(--tl);margin-top:18px}

article{max-width:780px;margin:0 auto;padding:48px 32px 72px}
article h2{font-size:clamp(24px,3.2vw,30px);font-weight:800;margin:52px 0 14px;scroll-margin-top:84px}
article h3{font-size:19px;font-weight:700;margin:30px 0 8px}
article p{margin:0 0 16px;color:#334155}
article ul,article ol{margin:0 0 18px 22px;color:#334155}
article li{margin-bottom:8px}
article strong{color:var(--tx)}
.summary{background:#F0FDFA;border:1px solid #99F6E4;border-radius:14px;padding:22px 26px;margin-bottom:8px}
.summary h2{margin:0 0 10px;font-size:18px}
.summary ul{margin-bottom:0}
.aside{background:var(--bg);border-left:4px solid var(--prl);border-radius:0 10px 10px 0;padding:16px 20px;margin:22px 0;font-size:16px}
.aside p:last-child{margin-bottom:0}
.warn{background:#FFFBEB;border-left-color:#F59E0B}
.toc{border:1px solid var(--bd);border-radius:12px;padding:18px 22px;margin:28px 0 8px;font-size:15.5px}
.toc strong{font-family:var(--h);display:block;margin-bottom:6px}
.toc ol{margin-bottom:0}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}
.sample{background:#fff;border:1px dashed var(--prl);border-radius:12px;padding:18px 22px;margin:16px 0 22px;font-size:16px;color:#334155}
.tbl-wrap{overflow-x:auto;margin:18px 0 24px;border:1px solid var(--bd);border-radius:12px}
table{border-collapse:collapse;width:100%;font-size:15px;min-width:520px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--bd);vertical-align:top}
th{font-family:var(--h);font-size:13.5px;background:var(--bg);color:var(--tm)}
tr:last-child td{border-bottom:none}
.flow{list-style:none;margin:20px 0 26px !important;padding:0;counter-reset:f}
.flow li{counter-increment:f;position:relative;padding:14px 16px 14px 56px;border:1px solid var(--bd);border-radius:12px;margin-bottom:10px;background:#fff}
.flow li::before{content:counter(f);position:absolute;left:16px;top:14px;width:26px;height:26px;border-radius:50%;background:var(--prxl);color:#0F766E;font-family:var(--h);font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.flow .tag{display:inline-block;margin-left:6px;font-family:var(--h);font-weight:700;font-size:11px;padding:2px 8px;border-radius:5px;background:#DCFCE7;color:#15803D;vertical-align:1px}
.flow .tag.out{background:#FEF3C7;color:#92400E}
details{border:1px solid var(--bd);border-radius:12px;padding:14px 18px;margin-bottom:10px}
summary{font-family:var(--h);font-weight:700;cursor:pointer}
details p{margin:10px 0 0}
.sources{font-size:15px}
.sources li{word-break:break-word}

.cta{background:linear-gradient(150deg,var(--pr),#0A5F5E);color:#fff;padding:64px 0;text-align:center}
.cta-in{max-width:700px;margin:0 auto;padding:0 32px}
.cta h2{font-weight:800;font-size:clamp(26px,3.6vw,34px);text-wrap:balance}
.cta p{font-size:17px;color:rgba(255,255,255,.82);margin-top:12px}
.cta a.btn{display:inline-block;margin-top:24px;background:#fff;color:var(--pr);font-family:var(--h);font-weight:700;font-size:15px;padding:14px 26px;border-radius:12px;text-decoration:none}
.cta a.btn:hover{background:#F0FDFA}

footer{background:#fff;border-top:1px solid var(--bd);padding:32px 0}
.foot-in{max-width:1140px;margin:0 auto;padding:0 32px;display:flex;align-items:center;gap:12px;font-size:13.5px;color:var(--tl);flex-wrap:wrap}
.foot-in .brand{font-family:var(--h);font-weight:700;color:var(--tm)}
.foot-links{margin-left:auto;display:flex;gap:20px;flex-wrap:wrap}
.foot-links a{color:var(--tl);text-decoration:none}
.foot-links a:hover{color:var(--pr)}

@media (max-width:760px){
  .nav-in,.hd-in,article,.cta-in,.foot-in{padding-left:16px;padding-right:16px}
  .nav-links a:not(.nav-cta){display:none}
  .hd-in{padding-top:40px;padding-bottom:36px}
  article{padding-top:32px}
  .foot-links{margin-left:0}
}
