:root { color-scheme: light; --ink:#18201d; --paper:#f7f5ef; --card:#fff; --accent:#5c4bd8; --accent-soft:#ece9ff; --line:#dedbd1; --muted:#56605b; }
* { box-sizing:border-box; }
body { margin:0; font:16px/1.55 system-ui,sans-serif; color:var(--ink); background:var(--paper); }
.site-header { min-height:72px; padding:0 5vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(247,245,239,.95); position:sticky; top:0; z-index:20; backdrop-filter:blur(12px); }
.brand { display:inline-flex; align-items:center; gap:.55rem; font-weight:800; font-size:1.2rem; letter-spacing:-.035em; color:var(--ink); text-decoration:none; }
.brand-mark { display:block; width:1.75rem; height:1.75rem; }
.brand-simple { color:var(--accent); }
nav { display:flex; gap:1rem; } nav a { color:var(--ink); }
.site-header nav { align-items:center; }
.site-header .nav-account-access { color:white; padding:.5rem .85rem; }
.locale-picker { position:relative; }
.locale-picker summary { min-width:2.5rem; padding:.12rem .55rem; border:1px solid #c8c4b9; border-radius:999px; cursor:pointer; list-style:none; text-align:center; font-size:.8rem; font-weight:850; letter-spacing:.06em; }
.locale-picker summary::-webkit-details-marker { display:none; }
.locale-menu { position:absolute; top:calc(100% + .55rem); right:0; z-index:30; min-width:155px; display:grid; gap:.1rem; padding:.45rem; border:1px solid var(--line); border-radius:12px; background:var(--card); box-shadow:0 15px 40px rgba(30,32,28,.14); }
.locale-menu a { padding:.42rem .55rem; border-radius:8px; text-decoration:none; white-space:nowrap; }
.locale-menu a:hover,.locale-menu a[aria-current="page"] { color:var(--accent); background:var(--accent-soft); }
main { width:min(1080px,90vw); margin:0 auto; padding:4rem 0; }
.site-footer { width:min(1080px,90vw); margin:0 auto; padding:2rem 0 3rem; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:1.5rem; color:#4f5954; }
.site-footer p { margin:0; }
.legal { max-width:780px; }
.legal h2 { margin-top:2rem; }
.legal .updated { color:#68716d; }
.hero { margin:2rem 0 4rem; } .hero h1 { font-size:clamp(2.8rem,6.2vw,5.35rem); line-height:.97; letter-spacing:-.055em; margin:.3em 0; }
.hero p:not(.eyebrow) { max-width:650px; font-size:1.18rem; color:#4f5954; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:clamp(2rem,6vw,5rem); align-items:center; }
.hero-eyebrow { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem .75rem; }
.hero-language-count { display:inline-flex; padding:.32rem .62rem; border-radius:999px; color:white; background:var(--accent); font-size:.72rem; letter-spacing:.08em; }
.hero-actions { display:flex; flex-wrap:wrap; gap:1.15rem; align-items:center; margin-top:1.8rem; }
.hero .hero-note { margin-top:1rem; font-size:.88rem; color:#68716d; }
.text-link { color:var(--ink); font-weight:750; text-underline-offset:.2em; }
.hero-proof { padding:1.5rem; border:1px solid #cbc5ee; border-radius:22px; background:linear-gradient(145deg,#fff 15%,var(--accent-soft)); box-shadow:0 18px 55px rgba(55,42,140,.09); }
.check-list { list-style:none; padding:0; margin:0; }
.check-list li { position:relative; display:grid; gap:.15rem; padding:1rem 0 1rem 1.8rem; border-bottom:1px solid rgba(92,75,216,.16); }
.check-list li:last-child { border-bottom:0; padding-bottom:.3rem; }
.check-list li::before { content:'✓'; position:absolute; left:0; color:var(--accent); font-weight:900; }
.check-list span,.feature-strip span { color:var(--muted); font-size:.94rem; }
.feature-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-bottom:6rem; border-block:1px solid var(--line); }
.feature-strip div { display:grid; gap:.2rem; padding:1.3rem 1.5rem; border-right:1px solid var(--line); }
.feature-strip div:first-child { padding-left:0; }
.feature-strip div:last-child { border-right:0; }
.language-showcase { display:grid; grid-template-columns:minmax(0,.85fr) minmax(420px,1.15fr); gap:clamp(2rem,6vw,5rem); align-items:center; margin-bottom:7rem; }
.language-showcase h2 { font-size:clamp(2rem,4vw,3.35rem); letter-spacing:-.035em; margin:.3rem 0; }
.language-showcase > div > p:not(.eyebrow) { color:var(--muted); }
.language-showcase ul { list-style:none; display:flex; flex-wrap:wrap; gap:.6rem; padding:0; margin:0; }
.language-showcase li { padding:.6rem .85rem; border:1px solid #d3cec1; border-radius:999px; background:var(--card); font-size:.9rem; font-weight:750; }
.language-showcase .language-more { color:white; border-color:var(--accent); background:var(--accent); }
.product-preview { display:grid; grid-template-columns:minmax(0,.8fr) minmax(480px,1.2fr); gap:clamp(2rem,6vw,5rem); align-items:center; margin-bottom:7rem; }
.live-demo { position:relative; display:grid; grid-template-columns:minmax(0,.78fr) minmax(460px,1.22fr); gap:clamp(2rem,6vw,5rem); align-items:center; margin:0 0 7rem; padding:clamp(2rem,5vw,4.5rem); overflow:hidden; border:1px solid rgba(40,45,38,.1); border-radius:32px; background:linear-gradient(135deg,#f3f0e8 0%,#fff 55%,#e8efe8 100%); }
.live-demo::before { content:""; position:absolute; width:260px; height:260px; right:-90px; top:-110px; border-radius:50%; background:rgba(236,102,73,.14); }
.live-demo-copy { position:relative; z-index:1; }
.live-demo-copy h2 { margin:.45rem 0 1rem; }
.live-demo-copy .button { display:inline-block; margin-top:.75rem; }
.live-demo-note { max-width:38rem; margin:1rem 0 0; color:var(--muted); font-size:.9rem; }
.demo-browser { position:relative; z-index:1; display:block; overflow:hidden; color:var(--ink); text-decoration:none; border:1px solid rgba(23,31,24,.16); border-radius:18px; background:#fff; box-shadow:0 28px 70px rgba(24,35,25,.18); transform:rotate(1deg); transition:transform .2s ease,box-shadow .2s ease; }
.demo-browser:hover,.demo-browser:focus-visible { transform:translateY(-4px) rotate(0); box-shadow:0 34px 80px rgba(24,35,25,.23); }
.demo-browser-bar { display:flex; align-items:center; gap:7px; min-height:42px; padding:0 14px; border-bottom:1px solid rgba(23,31,24,.1); background:#f5f3ed; }
.demo-browser-bar i { width:9px; height:9px; border-radius:50%; background:#d6d0c4; }
.demo-browser-bar b { margin-left:8px; color:#747970; font-size:.72rem; font-weight:600; }
.demo-browser-body { display:flex; min-height:310px; padding:clamp(1.6rem,5vw,3.8rem); flex-direction:column; justify-content:center; background:linear-gradient(140deg,rgba(236,102,73,.16),transparent 44%),linear-gradient(315deg,rgba(63,112,115,.18),transparent 48%),#fbfaf6; }
.demo-brand { margin-bottom:2.5rem; font-weight:800; letter-spacing:-.03em; }
.demo-browser-body strong { max-width:12ch; font-family:Georgia,serif; font-size:clamp(2rem,4vw,3.45rem); line-height:.98; letter-spacing:-.04em; }
.demo-site-copy { max-width:30rem; margin-top:1.1rem; color:#596158; }
.demo-language-row { display:flex; gap:.45rem; margin-top:2.2rem; flex-wrap:wrap; }
.demo-language-row em { padding:.38rem .58rem; border:1px solid rgba(23,31,24,.15); border-radius:999px; background:rgba(255,255,255,.76); font-size:.68rem; font-style:normal; font-weight:800; }
.preview-copy h2,.compatibility-heading h2,.faq-section h2,.signed-in-cta h2 { font-size:clamp(2rem,4vw,3.35rem); letter-spacing:-.035em; margin:.3rem 0; }
.preview-copy > p:not(.eyebrow),.compatibility-heading > p { color:var(--muted); }
.plain-checks { list-style:none; padding:0; margin:1.5rem 0 0; display:grid; gap:.8rem; }
.plain-checks li { position:relative; padding-left:1.7rem; }
.plain-checks li::before { content:'✓'; position:absolute; left:0; color:var(--accent); font-weight:900; }
.product-window { overflow:hidden; border:1px solid #c9c5bb; border-radius:22px; background:var(--card); box-shadow:0 28px 70px rgba(30,32,28,.12); transform:rotate(.35deg); }
.window-bar { min-height:42px; display:flex; align-items:center; gap:.45rem; padding:0 1rem; border-bottom:1px solid var(--line); background:#f0eee8; }
.window-bar span { width:.65rem; height:.65rem; border-radius:50%; background:#c4c0b6; }
.window-bar span:first-child { background:#dd786c; }
.window-bar span:nth-child(2) { background:#d9ad55; }
.window-bar span:nth-child(3) { background:#70a977; }
.window-bar b { margin-left:.45rem; font-size:.78rem; color:#626b66; }
.window-body { padding:1.5rem; }
.preview-topline,.preview-footer,.language-flow { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.status-pill,.protected-badge { display:inline-flex; align-items:center; width:max-content; border-radius:999px; font-size:.72rem; font-weight:800; }
.status-pill { padding:.35rem .65rem; color:#226739; background:#e6f5eb; }
.language-flow { justify-content:flex-start; margin:1.25rem 0; padding:.75rem; border-radius:12px; background:#f6f4ee; }
.language-flow span { padding:.35rem .65rem; border-radius:999px; font-size:.82rem; font-weight:750; }
.language-flow .language-active { color:white; background:var(--accent); }
.language-flow b { color:#7c827e; }
.scan-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.scan-summary > div { display:grid; gap:.2rem; padding:1rem; border:1px solid var(--line); border-radius:12px; }
.scan-summary small,.preview-segment small { color:#737b77; }
.scan-summary strong { font-size:1.15rem; }
.preview-segment { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; margin:1rem 0; padding:1rem; border:1px solid #c9c2f5; border-radius:14px; background:var(--accent-soft); }
.preview-segment > div { padding:.65rem; border-radius:9px; background:rgba(255,255,255,.72); }
.preview-segment p { margin:.25rem 0 0; font-size:.9rem; }
.protected-badge { grid-column:1 / -1; padding:.25rem .55rem; color:#4637b4; background:white; }
.preview-footer { color:#68716d; font-size:.8rem; }
.preview-action { display:inline-block; padding:.55rem .8rem; border-radius:999px; color:white; background:var(--accent); font-weight:800; }
.section-block { margin:0 0 6rem; }
.section-heading { max-width:720px; margin-bottom:2rem; }
.section-heading h2,.coverage-copy h2,.ownership-card h2,.auth-intro h2 { font-size:clamp(2rem,4vw,3.35rem); letter-spacing:-.035em; margin:.3rem 0; }
.process-grid { list-style:none; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.process-grid li { min-height:210px; display:flex; gap:1rem; align-items:flex-start; padding:1.5rem; border:1px solid var(--line); border-radius:18px; background:var(--card); }
.process-grid li > span { flex:0 0 2.3rem; height:2.3rem; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:white; font-weight:850; }
.process-grid h3 { margin:.35rem 0 .7rem; font-size:1.2rem; }
.process-grid p { margin:0; color:var(--muted); }
.compatibility-block { margin-bottom:6rem; padding:clamp(1.6rem,4vw,2.7rem); border:1px solid var(--line); border-radius:24px; background:var(--card); }
.compatibility-heading { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(260px,.75fr); gap:clamp(1.5rem,5vw,4rem); align-items:end; }
.compatibility-heading > p { max-width:520px; margin-bottom:.5rem; }
.compatibility-list { list-style:none; padding:0; margin:2rem 0 1.25rem; display:flex; flex-wrap:wrap; gap:.65rem; }
.compatibility-list li { padding:.55rem .85rem; border:1px solid #d3cec1; border-radius:999px; background:#f8f6f1; font-size:.9rem; font-weight:750; }
.compatibility-note { margin:0; color:#68716d; font-size:.88rem; }
.coverage-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr); gap:clamp(2rem,6vw,5rem); align-items:start; margin-bottom:6rem; }
.coverage-copy > p:not(.eyebrow) { max-width:760px; color:var(--muted); font-size:1.05rem; }
.coverage-card { padding:1.7rem; border-radius:20px; background:var(--ink); color:white; }
.coverage-card .eyebrow { color:#bdb4ff; }
.coverage-card h3 { margin:.35rem 0; font-size:1.7rem; }
.coverage-card p { color:#dce2df; }
.coverage-card .text-link { color:white; }
.ownership-card { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:3rem; align-items:center; padding:clamp(1.6rem,4vw,3rem); margin-bottom:6rem; border:1px solid #c9c2f5; border-radius:24px; background:var(--accent-soft); }
.ownership-card h2 { margin-bottom:0; }
.ownership-card > p { color:#484f4b; font-size:1.08rem; }
.faq-section { margin-bottom:6rem; }
.faq-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.faq-grid details { padding:1.2rem 1.3rem; border:1px solid var(--line); border-radius:14px; background:var(--card); }
.faq-grid summary { cursor:pointer; font-weight:800; }
.faq-grid summary::marker { color:var(--accent); }
.faq-grid p { margin:.8rem 0 0; color:var(--muted); }
.auth-anchor,#login-title,#create-account { scroll-margin-top:100px; }
.auth-intro { max-width:760px; margin-bottom:2rem; }
.auth-intro > p:not(.eyebrow) { color:var(--muted); }
.eyebrow { text-transform:uppercase; letter-spacing:.15em; font-size:.75rem; font-weight:800; color:var(--accent); }
.card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:1.5rem; margin-bottom:1.5rem; box-shadow:0 12px 35px rgba(30,30,20,.05); }
.narrow { max-width:560px; } .grid,.auth-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5rem; }
.auth-grid { max-width:900px; align-items:start; }
.signed-in-cta { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:clamp(1.6rem,4vw,2.7rem); margin-bottom:2rem; border-radius:24px; color:white; background:var(--ink); }
.signed-in-cta .eyebrow { color:#bdb4ff; }
.signed-in-cta h2 { margin-bottom:.55rem; }
.signed-in-cta p:not(.eyebrow) { max-width:650px; margin:0; color:#dce2df; }
.signed-in-cta .text-link { color:white; }
.cta-actions { flex:0 0 auto; display:flex; flex-wrap:wrap; align-items:center; gap:1rem; }
.page-heading { display:flex; justify-content:space-between; align-items:end; gap:2rem; margin-bottom:2rem; }
h1,h2 { line-height:1.1; } label { display:grid; gap:.4rem; margin:1rem 0; font-weight:650; }
input,select,textarea { width:100%; padding:.8rem; font:inherit; color:var(--ink); background:white; border:1px solid #aaa69b; border-radius:9px; }
textarea { min-height:10rem; resize:vertical; }
button,.button { display:inline-block; border:0; border-radius:999px; background:var(--accent); color:white; padding:.75rem 1.15rem; font:inherit; font-weight:750; text-decoration:none; cursor:pointer; }
button.secondary { background:#e5e1d6; color:var(--ink); } .metric { font-size:2rem; font-weight:800; }
.logout-form { flex:0 0 auto; }
.logout-form button { white-space:nowrap; }
.onboarding { padding:clamp(1.5rem,4vw,2.5rem); border-color:#c9c2f5; }
.onboarding-intro { max-width:720px; font-size:1.1rem; color:#4f5954; }
.setup-steps { list-style:none; padding:0; margin:2rem 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.setup-steps li { display:flex; gap:.85rem; padding:1rem; border:1px solid var(--line); border-radius:14px; }
.setup-steps li > span { flex:0 0 2rem; width:2rem; height:2rem; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:#fff; font-weight:800; }
.setup-steps strong { display:block; margin:.2rem 0; }
.setup-steps p { margin:.35rem 0 0; color:#56605b; }
.connection-code { max-width:520px; padding-top:1rem; border-top:1px solid var(--line); }
.connection-code label { margin-top:0; }
.password-form { max-width:520px; }
.security-card > p { max-width:680px; }
.support-form { position:relative; }
.support-form .optional,.form-guidance { color:#66706b; font-size:.88rem; font-weight:400; }
.support-form .cf-turnstile { margin:1.25rem 0; }
.form-trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.notice { padding:1rem; margin:1.25rem 0; border-radius:12px; }
.notice h2,.notice p { margin:.2rem 0; }
.notice.success { background:#e6f5eb; border:1px solid #9dcbae; }
.notice.error { background:#fff0ed; border:1px solid #e6aaa0; }
.account-options { margin-top:1.5rem; padding-top:1rem; border-top:1px solid var(--line); color:#66706b; }
.account-options summary { width:max-content; cursor:pointer; font-size:.9rem; }
.account-options-content { padding:.75rem 0 0; }
.account-options-content p { max-width:48rem; }
table { width:100%; border-collapse:collapse; } th,td { text-align:left; padding:.7rem; border-bottom:1px solid var(--line); } code { overflow-wrap:anywhere; }
.inline-form { display:inline-flex; gap:.45rem; align-items:center; margin:.2rem; }
.inline-form input[type=number] { max-width:10rem; } .inline-form select { min-width:7rem; }
@media (max-width:900px) { .language-showcase,.product-preview,.live-demo,.compatibility-heading { grid-template-columns:1fr; } .product-window,.demo-browser { transform:none; } }
@media (max-width:800px) { .hero-grid,.coverage-layout,.ownership-card { grid-template-columns:1fr; } .feature-strip,.process-grid,.faq-grid { grid-template-columns:1fr; } .feature-strip div { padding:1.1rem 0; border-right:0; border-bottom:1px solid var(--line); } .feature-strip div:last-child { border-bottom:0; } .signed-in-cta { align-items:flex-start; flex-direction:column; } }
@media (max-width:700px) { main { padding:2rem 0; } .site-header { position:static; align-items:stretch; flex-direction:column; gap:.75rem; padding-block:.85rem; } .site-header nav { width:100%; flex-wrap:nowrap; justify-content:space-between; gap:.65rem; } .site-header nav > a[href$="#how-it-works"],.site-header nav > a[href$="#coverage"] { display:none; } .site-header .nav-account-access { padding:.46rem .7rem; } .site-footer,.page-heading { align-items:start; flex-direction:column; } .setup-steps,.scan-summary,.preview-segment { grid-template-columns:1fr; } .protected-badge { grid-column:auto; } .window-body { padding:1rem; } .preview-footer { align-items:flex-start; flex-direction:column; } table { display:block; overflow:auto; } }

.campaign-offer { display:flex; align-items:center; justify-content:center; gap:1rem; flex-wrap:wrap; margin:0 0 3rem; padding:1rem 1.25rem; border:1px solid #d8d4f5; border-radius:16px; background:#f6f4ff; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; max-width:1180px; margin:0 auto; }
.pricing-card { display:flex; flex-direction:column; gap:1rem; padding:2rem; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 18px 45px rgba(30,32,28,.08); }
.pricing-card--featured { border:2px solid var(--accent); }
.pricing-price { display:flex; flex-wrap:wrap; align-items:baseline; gap:.25rem .55rem; margin:0; font-size:clamp(2.5rem,5vw,3.5rem); font-weight:800; color:var(--ink); }
.pricing-price small { flex-basis:100%; font-size:.95rem; font-weight:600; color:var(--muted); }
.pricing-price del { flex-basis:100%; font-size:.42em; color:var(--muted); font-weight:600; }
.promo-badge { align-self:flex-start; margin:0; padding:.35rem .65rem; border-radius:999px; background:#eeebff; color:#5647d8; font-size:.8rem; font-weight:700; }
.pricing-card .button { margin-top:auto; text-align:center; }
.pricing-note { max-width:760px; margin:1.5rem auto 4rem; color:var(--muted); text-align:center; }
.marketing-heading { max-width:760px; margin-inline:auto; text-align:center; }
.intent-hero { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr); gap:2rem; }
.campaign-gates { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem; }
.campaign-gate { padding:.35rem .65rem; border-radius:999px; font-size:.82rem; font-weight:750; }
.campaign-gate--ready { color:#14532d; background:#dcfce7; }
.campaign-gate--blocked { color:#7f1d1d; background:#fee2e2; }
.campaign-spend-form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; align-items:end; }

@media (max-width:700px) { .pricing-grid,.intent-hero,.campaign-spend-form { grid-template-columns:1fr; } }
