/* Seotific marketing site. Same system as the app: white paper, black ink, greys,
   one typeface (Schibsted Grotesk). Pages are generated by _restyle.py / _layout.py and
   share this file; no page carries its own <style>. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --paper:#fff;--ink:#000;--body:#2b2b2b;--mute:#6b6b6b;--faint:#9e9e9e;--rule:#e8e8e8;--rule-2:#cdcdcd;--tint:#f5f5f5;
  --sans:'Schibsted Grotesk',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --w:1120px;--r:6px;
}
html{background:var(--paper);scroll-behavior:smooth}
body{background:var(--paper);color:var(--body);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
::selection{background:var(--ink);color:var(--paper)}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
img{max-width:100%;height:auto}
.wrap,.footer-inner,.nav-inner{max-width:var(--w);margin:0 auto;padding:0 24px}
.center{text-align:left}

/* ── Header ── */
.site-h{border-bottom:1px solid var(--rule);background:var(--paper);position:sticky;top:0;z-index:50}
.site-h .nav-inner{display:flex;align-items:center;gap:28px;height:64px}
.logo{font-size:19px;font-weight:800;letter-spacing:-.02em;color:var(--ink);text-decoration:none;flex-shrink:0}
.logo span{color:inherit}
.site-nav{display:flex;gap:24px;flex:1}
.site-nav a,.nav-sign{font-size:15px;font-weight:500;color:var(--mute);text-decoration:none}
.site-nav a:hover,.site-nav a[aria-current],.nav-sign:hover{color:var(--ink)}
.nav-end{display:flex;gap:18px;align-items:center;margin-left:auto}
.menu{display:none;margin-left:auto}
.menu summary{list-style:none;cursor:pointer;font-weight:600;font-size:15px;color:var(--ink);padding:8px 0}
.menu summary::-webkit-details-marker{display:none}
.menu[open] .menu-p{display:flex}
.menu-p{position:absolute;left:0;right:0;top:64px;background:var(--paper);border-bottom:1px solid var(--rule);padding:12px 24px 20px;flex-direction:column;gap:2px;display:none}
.menu-p a{padding:10px 0;font-size:17px;font-weight:600;text-decoration:none;border-bottom:1px solid var(--rule)}
.menu-p .btn{margin-top:14px;justify-content:center}
@media (max-width:860px){.site-nav,.nav-end{display:none}.menu{display:block}}

/* ── Buttons ── */
.btn,.btn-primary,.btn-dark,.btn-outline,.btn-nav,.nav-cta{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:var(--r);font:600 15px/1.2 var(--sans);text-decoration:none;cursor:pointer;border:1px solid var(--ink);background:var(--paper);color:var(--ink);transition:background .12s,color .12s}
.btn-primary,.btn-dark,.btn-nav,.nav-cta,.btn-solid{background:var(--ink);color:var(--paper)!important}
.btn-primary:hover,.btn-dark:hover,.btn-nav:hover,.nav-cta:hover,.btn-solid:hover{background:#262626}
.btn:hover,.btn-outline:hover{text-decoration:none}
.btn-outline{border-color:var(--rule-2)}
.btn-outline:hover{border-color:var(--ink)}
.btn-sm{padding:8px 13px;font-size:14px}

/* ── Type ── */
h1,h2,h3,h4{color:var(--ink);font-weight:800;letter-spacing:-.025em;line-height:1.12}
h1{font-size:clamp(36px,6vw,64px);letter-spacing:-.035em;line-height:1.02}
h2{font-size:clamp(26px,3.4vw,38px);margin-bottom:12px}
h3{font-size:19px;letter-spacing:-.01em;margin-bottom:6px;line-height:1.3}
h4{font-size:15px;letter-spacing:0}
p{max-width:68ch}
em{font-style:normal}
.sub,.section-sub,.hero-sub,.lead{font-size:18px;color:var(--mute);margin-bottom:28px;max-width:60ch}
.muted{color:var(--mute)}
.badge,.hero-badge,.section-label,.step-tag{display:none}

/* ── Sections ── */
.section{padding:88px 0;border-top:1px solid var(--rule)}
.section:first-of-type{border-top:0}
.section-alt{background:var(--paper)}
.hero{padding:80px 0 64px}
.hero h1{max-width:16ch;margin-bottom:22px}
.hero p{font-size:19px;color:var(--mute);max-width:56ch;margin-bottom:28px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-trust{display:flex;gap:20px;flex-wrap:wrap;margin-top:18px;font-size:14px;color:var(--mute)}
.bc{padding:18px 0 0;font-size:13px;color:var(--mute)}
.bc ol{display:flex;gap:8px;list-style:none;flex-wrap:wrap}
.bc li+li::before{content:'/';margin-right:8px;color:var(--faint)}
.bc a{color:var(--mute);text-decoration:none}.bc a:hover{color:var(--ink)}

/* ── Grids & cards: hairlines, not boxes ── */
.grid-2,.grid-3,.grid,.feat-grid,.audience-grid,.steps-grid,.pricing-grid,.feature-list{display:grid;gap:0 40px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:700px){.grid-2{grid-template-columns:1fr}}
.grid-3,.grid,.feat-grid,.audience-grid,.feature-list{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.steps-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.card,.feat-item,.audience-card,.step-card,.price-card,.cta-box,.highlight-box{background:var(--paper);border:0;border-top:1px solid var(--ink);border-radius:0;padding:20px 0 28px;box-shadow:none}
.card:hover{box-shadow:none}
.card p,.feat-item p,.audience-card p,.step-card p{font-size:15px;color:var(--mute)}
.card-icon,.feat-icon,.audience-icon,.step-num,.icon{display:none}
.tag-row,.feat-tags,.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.tag{font-size:12px;font-weight:500;color:var(--mute);border:1px solid var(--rule-2);border-radius:999px;padding:2px 9px;background:none}
.check-list{list-style:none;margin-top:12px}
.check-list li{padding:5px 0 5px 18px;position:relative;font-size:15px;color:var(--body)}
.check-list li::before{content:'';position:absolute;left:0;top:15px;width:8px;height:1.5px;background:var(--ink)}
.proof-strip{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.proof-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.proof-item{padding:22px 0}
.proof-num,.feat-number{font-size:36px;font-weight:800;color:var(--ink);letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-family:var(--sans)}
.proof-label{font-size:14px;color:var(--mute)}

/* ── Prose (blog, guides, legal) ── */
.prose,.content{max-width:700px;margin:0 auto}
.prose h1,.content h1{font-size:clamp(32px,5vw,48px);margin:24px 0 16px}
.prose h2,.content h2{font-size:26px;margin:48px 0 12px}
.prose h3,.content h3{font-size:20px;margin:32px 0 8px}
.prose p,.content p{font-size:17px;color:var(--body);margin-bottom:18px;line-height:1.72}
.prose ul,.prose ol,.content ul,.content ol{padding-left:22px;margin-bottom:18px;font-size:17px;color:var(--body)}
.prose li,.content li{margin-bottom:8px;line-height:1.65}
.prose code,.content code{font:14px ui-monospace,SFMono-Regular,Menlo,monospace;border:1px solid var(--rule);border-radius:4px;padding:1px 5px}
.prose blockquote{border-left:2px solid var(--ink);padding-left:16px;margin:20px 0;color:var(--mute)}
.prose img{border:1px solid var(--rule);border-radius:var(--r)}

/* ── FAQ ── */
.faq,.faq-list{max-width:760px}
.faq-item{border-top:1px solid var(--rule);padding:20px 0}
.faq-item h3{font-size:17px;margin-bottom:6px}
.faq-item p{font-size:15px;color:var(--mute)}
details{border-top:1px solid var(--rule)}
details:last-child{border-bottom:1px solid var(--rule)}
details summary{cursor:pointer;list-style:none;padding:18px 32px 18px 0;font-weight:700;font-size:17px;color:var(--ink);position:relative}
details summary::-webkit-details-marker{display:none}
details summary::after{content:'+';position:absolute;right:0;top:15px;font-weight:400;font-size:22px}
details[open] summary::after{content:'–'}
details p{padding:0 0 20px;color:var(--mute);font-size:16px}
.menu,.menu details,.menu summary{border:0}
.menu summary::after{content:none}

/* ── Tables ── */
table{width:100%;border-collapse:collapse;font-size:15px}
th{text-align:left;font-size:14px;font-weight:700;color:var(--ink);padding:12px 12px 12px 0;border-bottom:1px solid var(--ink);background:none;text-transform:none;letter-spacing:0}
td{padding:13px 12px 13px 0;border-bottom:1px solid var(--rule);color:var(--body);vertical-align:top}
tr:nth-child(even) td{background:none}
.yes,.compare-yes{color:var(--ink);font-weight:700}.no,.compare-no{color:var(--faint)}.partial,.compare-partial{color:var(--mute)}

/* ── CTA band ── */
.cta-band{background:var(--paper);color:var(--body);padding:96px 0;border-top:1px solid var(--ink)}
.cta-band h2{color:var(--ink);font-size:clamp(30px,4.5vw,48px);max-width:18ch}
.cta-band p{color:var(--mute);font-size:18px;margin:12px 0 28px}

/* ── Footer ── */
.site-f{border-top:1px solid var(--rule);padding:48px 0 36px;font-size:14px;color:var(--mute);margin-top:0}
.site-f .footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:28px;margin-bottom:40px}
.site-f h4{font-size:14px;font-weight:700;margin-bottom:10px;color:var(--ink)}
.site-f a{display:block;color:var(--mute);text-decoration:none;padding:3px 0}
.site-f a:hover{color:var(--ink)}
.site-f .footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:20px;border-top:1px solid var(--rule)}
.site-f .footer-bottom a{display:inline;padding:0}
@media (max-width:700px){.site-f .footer-grid{grid-template-columns:1fr 1fr}.site-f .footer-grid>div:first-child{grid-column:1/-1}}

/* ── Homepage pieces ── */
.home-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:start;padding:72px 0 80px}
.home-hero h1{margin-bottom:22px}
.home-hero .lead{font-size:19px;margin-bottom:28px}
.try{display:flex;gap:8px;max-width:520px}
.try input{flex:1;min-width:0;font:16px var(--sans);padding:13px 14px;border:1px solid var(--rule-2);border-radius:var(--r);color:var(--ink);background:var(--paper)}
.try input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.try-note{font-size:14px;color:var(--mute);margin-top:12px}
.sample{border:1px solid var(--ink);border-radius:var(--r);padding:26px 26px 18px;background:var(--paper)}
.sample-top{display:flex;gap:20px;align-items:flex-end;padding-bottom:18px;border-bottom:1px solid var(--ink)}
.sample-score{font-size:84px;font-weight:800;line-height:.8;letter-spacing:-.05em;color:var(--ink);font-variant-numeric:tabular-nums}
.sample-score small{font-size:16px;font-weight:600;color:var(--faint);letter-spacing:0;margin-left:3px}
.sample-t{font-weight:700;color:var(--ink);font-size:16px;line-height:1.3}
.sample-u{font-size:13px;color:var(--mute)}
.strip{display:flex;flex-wrap:wrap;gap:4px;margin:16px 0 14px}
.mk{display:inline-block;width:11px;height:11px;flex-shrink:0}
.mk-f{background:var(--ink);border-radius:2px}
.mk-w{border:1.5px solid var(--ink);border-radius:2px;background:linear-gradient(90deg,var(--ink) 50%,transparent 50%)}
.mk-p{border:1.5px solid var(--faint);border-radius:50%}
.mk-n{height:1.5px;width:10px;background:var(--faint);align-self:center}
.sample ol{list-style:none;counter-reset:s}
.sample li{counter-increment:s;display:grid;grid-template-columns:22px 1fr;gap:2px 6px;padding:12px 0;border-top:1px solid var(--rule);font-size:14px}
.sample li::before{content:counter(s);font-weight:800;color:var(--ink)}
.sample li b{color:var(--ink)}
.sample li span{grid-column:2;color:var(--mute)}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--mute);margin-top:4px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.points{display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px}
.points>div{border-top:1px solid var(--ink);padding-top:18px}
.points p{font-size:16px;color:var(--mute)}
.plans-row{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ink)}
.plans-row>div{padding:20px 20px 24px 0;border-right:1px solid var(--rule)}
.plans-row>div+div{padding-left:20px}
.plans-row>div:last-child{border-right:0}
.plans-row .p{font-size:36px;font-weight:800;color:var(--ink);letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:4px 0}
.plans-row .p small{font-size:14px;font-weight:500;color:var(--mute);letter-spacing:0}
.plans-row p{font-size:14px;color:var(--mute)}
@media (max-width:900px){
  .home-hero{grid-template-columns:1fr;gap:40px;padding:48px 0 56px}
  .points{grid-template-columns:1fr;gap:28px}
  .plans-row{grid-template-columns:1fr 1fr}
  .plans-row>div{border-right:0;border-bottom:1px solid var(--rule);padding-left:0!important}
}
@media (max-width:520px){
  .try{flex-direction:column}
  .plans-row{grid-template-columns:1fr}
  .section{padding:64px 0}
  .sample{padding:20px 18px 12px}
  .sample-score{font-size:68px}
}

/* Keep page-level inline leftovers inside the system */
main [style*="background:#"],main [style*="background: #"],section [style*="background:#"],section [style*="background:rgba"]{background:var(--paper)!important}
main [style*="color:#"],section [style*="color:#"]{color:inherit!important}
[style*="box-shadow"]{box-shadow:none!important}
[style*="linear-gradient"]{background-image:none!important}
[style*="text-transform:uppercase"]{text-transform:none!important;letter-spacing:0!important}

/* Full pricing table */
.plans-full>div{display:flex;flex-direction:column}
.plans-full .check-list{flex:1;margin:14px 0 22px}
.plans-full .btn{align-self:flex-start}

/* Pages without section wrappers (tools, status, legal) */
main:not(:has(.wrap,.section,section)){display:block;max-width:var(--w);margin:0 auto;padding:56px 24px 88px}
main:not(:has(.wrap,.section,section)) h1{margin-bottom:14px}
main:not(:has(.wrap,.section,section)) .card{margin-top:40px}
main form#f{display:flex;gap:8px;max-width:560px;margin:8px 0 24px}
main form#f input{flex:1;min-width:0;font:16px var(--sans);padding:12px 14px;border:1px solid var(--rule-2);border-radius:var(--r)}
main form#f input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
main form#f button{font:600 15px var(--sans);padding:12px 18px;border-radius:var(--r);border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer}
main .row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule);font-size:15px}
main .ok{font-weight:700;color:var(--ink)}main .bad{font-weight:700;color:var(--ink);text-decoration:underline}
main .err{border-left:2px solid var(--ink);padding-left:12px;color:var(--ink)}
main .tags span{font-size:12px;border:1px solid var(--rule-2);border-radius:999px;padding:2px 9px}
.banner{font-size:22px;font-weight:800;color:var(--ink);padding:20px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);margin:24px 0 4px}
.banner.down,.banner.degraded{text-decoration:underline;text-underline-offset:5px}
.hero h1[style]{font-size:clamp(32px,5vw,52px)!important}
.hero .wrap[style*="max-width:760px"]{max-width:700px!important}
.site-h details.menu,.site-h details.menu:last-child{border:0}
.site-f .logo{color:var(--ink)}