/* Shared site header — same compact style on every public page (matches the home page). */
.nav{background:color-mix(in srgb,var(--bg) 94%,transparent);border-color:var(--line)}
.nav-in{height:65px;gap:18px}
.nav .brand-logo{width:125px;height:auto}
.nav .menu{gap:2px;margin-left:4px}
.nav .menu a{padding:7px 10px;border-radius:6px;font-size:13px}
.nav .menu .drop .submenu a{font-size:13px;border-radius:6px}
.nav-cta{gap:7px}
.nav .theme{width:34px;height:34px;border-radius:6px}
.nav .btn{height:36px;padding:0 13px;border-radius:6px;font-size:12px}
.nav .btn-primary{background:#C8283A;border-color:#C8283A;color:#fff}
.nav .btn-primary:hover{background:#AE2030;border-color:#AE2030;box-shadow:0 6px 18px rgba(200,40,58,.18)}
.copy{align-items:center}
/* Footer and call-to-action band: the same compact look on every page, matching the home page. */
footer.site{padding:48px 0 24px}
footer.site .foot{gap:24px}
footer.site .foot h4{font-size:12px}
footer.site .foot a,footer.site .copy{font-size:12px}
footer.site .theme{width:34px;height:34px;border-radius:6px}
.cta{border-radius:8px;padding:42px 22px;background:#C8283A}
.cta:before{display:none}
.cta p{font-size:13px}
.cta .btn:not(.ghost){background:#fff;color:#000;border:0}
.cta .btn.ghost{background:transparent;border-color:rgba(255,255,255,.65)}
@media(max-width:900px){footer.site .foot{gap:18px}}
/* Second menu (section links under the header): black bar. */
.subnav{top:65px;background:#000;border-bottom:1px solid #1f1f1f;backdrop-filter:none}
.subnav a{color:#d4d4d4}
.subnav a:hover,.subnav a:focus-visible{background:#1f1f1f;color:#fff}
.subnav a.on,.subnav a[aria-current]{background:#C8283A;color:#fff}
main section[id]{scroll-margin-top:135px}
.subnav .wrap{padding:5px 0}
.subnav a{padding:5px 14px;font-size:13px}
main section[id]{scroll-margin-top:115px}
.subnav{height:40px;box-sizing:border-box}
.subnav .wrap{height:40px;box-sizing:border-box;padding:0;align-items:center}
.subnav a{height:28px;display:inline-flex;align-items:center;padding:0 14px;box-sizing:border-box}
main section[id]{scroll-margin-top:120px}
.nav.open .menu{top:65px}
.cmp thead th{top:65px}
main section[id]{scroll-margin-top:110px}
/* AI comparison links, in the first footer column. */
.aicmp{display:block;margin:18px 0 0;padding:0;border:0;background:none}
.aicmp-text h4{margin:0 0 4px;font-size:12px}
.aicmp-text p{margin:0;color:var(--muted);font-size:12px}
.aicmp-links{display:flex;gap:8px;margin-top:10px}
.aicmp-btn{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:var(--bg);color:var(--ink);transition:transform .15s,border-color .15s,background .15s,color .15s}
.aicmp-btn svg{width:18px;height:18px}
.aicmp-btn:hover,.aicmp-btn:focus-visible{transform:translateY(-2px);border-color:#C8283A;background:#C8283A;color:#fff}
.aicmp-note{display:block;min-height:0;margin-top:8px;font-size:12px;color:var(--muted)}
.aicmp-note:empty{display:none}
footer.site .foot-about{margin-top:12px;max-width:40ch;line-height:1.65}
footer.site .foot-contact{display:grid;gap:3px;margin-top:14px;font-size:12px;color:var(--muted)}
footer.site .foot-contact a{padding:0;display:block}
footer.site .foot-contact a:hover{color:var(--ink)}
footer.site .copy-legal{flex:1 1 420px;max-width:760px;line-height:1.6}
/* Call-to-action band runs the full width of the page. */
section.cta-band,.site-react-home section.cta-band{padding:0!important}
.cta-band .cta{border-radius:0;width:100%;padding:56px 20px}
/* Footer redesign: dark, roomy, readable. Same on every page and in both themes. */
footer.site{background:#0a0a0a;color:#a3a3a3;border-top:3px solid #C8283A;padding:68px 0 26px}
footer.site .foot{grid-template-columns:1.7fr repeat(4,minmax(0,1fr));gap:44px}
footer.site .foot h4{margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff}
footer.site .foot a{display:block;padding:6px 0;font-size:14px;color:#a3a3a3;transition:color .15s,transform .15s}
footer.site .foot a:hover,footer.site .foot a:focus-visible{color:#fff;transform:translateX(3px)}
footer.site .brand .brand-logo-light{display:none!important}
footer.site .brand .brand-logo-dark{display:block!important}
footer.site .brand .brand-logo{width:150px}
footer.site .foot>div:first-child p{margin:18px 0 0;max-width:42ch;font-size:14px;line-height:1.7;color:#a3a3a3}
footer.site .aicmp{margin-top:26px;padding-top:22px;border-top:1px solid #1f1f1f}
footer.site .aicmp-text h4{margin:0 0 4px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#fff}
footer.site .aicmp-text p{margin:0;font-size:13.5px;color:#a3a3a3}
footer.site .aicmp-links{margin-top:12px;gap:10px}
footer.site .aicmp-btn{width:40px;height:40px;border-color:#2a2a2a;background:#141414;color:#fff}
footer.site .aicmp-btn svg{width:19px;height:19px}
footer.site .aicmp-btn:hover,footer.site .aicmp-btn:focus-visible{background:#C8283A;border-color:#C8283A;color:#fff}
footer.site .aicmp-note{color:#a3a3a3}
footer.site .copy{margin-top:52px;padding-top:24px;border-top:1px solid #1f1f1f;color:#8a8a8a;font-size:12.5px;align-items:center}
footer.site .copy-legal{line-height:1.7}
footer.site .copy .theme{border-color:#2a2a2a;background:#141414;color:#fff}
footer.site .copy .theme:hover{border-color:#C8283A}
@media(max-width:900px){footer.site .foot{grid-template-columns:1fr 1fr;gap:34px 24px}footer.site .foot>:first-child{grid-column:1/-1}}
@media(max-width:480px){footer.site{padding-top:48px}footer.site .copy{margin-top:36px}}

/* Footer: accepted payment methods strip */
footer.site .paywith{margin-top:44px;padding-top:28px;border-top:1px solid #262626;text-align:center}
footer.site .paywith h4{margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff}
footer.site .paywith img{display:block;width:100%;max-width:1024px;height:auto;margin:0 auto;border-radius:10px;background:#000}
footer.site .paywith{margin-top:32px;padding-top:22px}
footer.site .paywith h4{margin-bottom:12px;font-size:11px}
footer.site .paywith img{max-width:560px;border-radius:8px}
@media(max-width:640px){footer.site .paywith img{max-width:100%}}

/* Payment strip: two columns (methods + QR). QR hidden on mobile. */
footer.site .paywith{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;text-align:left}
footer.site .paywith .pw-pay h4{margin:0 0 12px}
footer.site .paywith .pw-pay img{margin:0;max-width:620px}
footer.site .paywith a.pw-qr{display:flex;align-items:center;gap:14px;padding:10px 16px 10px 10px;border:1px solid #262626;border-radius:12px;color:#a3a3a3;font-size:13px;line-height:1.4;transform:none}
footer.site .paywith a.pw-qr:hover{border-color:#C8283A;color:#fff;transform:none}
footer.site .paywith a.pw-qr img{width:96px;height:96px;border-radius:6px;background:#fefefe;margin:0}
footer.site .paywith a.pw-qr b{display:block;color:#fff;font-size:13px;margin-bottom:2px}
@media(max-width:768px){footer.site .paywith{display:block}footer.site .paywith a.pw-qr{display:none}footer.site .paywith .pw-pay{text-align:center}footer.site .paywith .pw-pay img{margin:0 auto;max-width:100%}}
.cta-band .cta,.site-react-home .cta-band .cta{border-radius:0!important}
.cta-band .cta:before{display:none}

/* Country / currency menu in the header */
.cs{position:relative}
.cs-btn{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 10px;border:1px solid var(--line,#e5e5e5);border-radius:9px;background:transparent;color:inherit;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.cs-btn:hover{border-color:#C8283A}
.cs-flag{display:block;border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.12);object-fit:cover}
.cs-globe{display:inline-flex;color:#C8283A}
.cs-cur{font-size:11px;font-weight:700;color:#C8283A;letter-spacing:.04em}
.cs-caret{width:12px;height:12px;opacity:.6}
.cs-list{position:absolute;right:0;top:calc(100% + 8px);z-index:80;width:300px;background:var(--bg,#fff);color:var(--ink,#111);border:1px solid var(--line,#e5e5e5);border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.18);overflow:hidden}
.cs-list[hidden]{display:none}
.cs-head{padding:12px 14px 8px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#888}
.cs-scroll{max-height:320px;overflow-y:auto;padding:0 6px 6px}
.cs-item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;border-radius:8px;background:transparent;color:inherit;font:inherit;font-size:14px;text-align:left;cursor:pointer}
.cs-item:hover,.cs-item:focus-visible{background:rgba(200,40,58,.08);outline:0}
.cs-item.on{background:rgba(200,40,58,.12);font-weight:700}
.cs-n{flex:1}.cs-c{font-size:11px;font-weight:700;color:#888}
.cs-foot{padding:9px 14px;border-top:1px solid var(--line,#e5e5e5);font-size:12px;color:#888}
@media(max-width:900px){.cs-name{display:none}.cs-list{position:fixed;left:12px;right:12px;top:72px;width:auto}}

/* Call-to-action band with the devices picture */
.cta-band .cta{overflow:visible;text-align:left;padding:0!important}
.cta-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:30px}
.cta-text{padding:64px 0}
.cta-text h2{margin:0;font-size:clamp(28px,3.6vw,44px);line-height:1.1;letter-spacing:-.02em}
.cta-text p{margin:14px 0 26px;font-size:17px;max-width:44ch;opacity:.92}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap}.cta-btns .btn{margin:0!important}
.cta-art{align-self:end;margin-top:-56px;position:relative}
.cta-art img{display:block;width:100%;height:auto;filter:drop-shadow(0 24px 36px rgba(0,0,0,.28))}
@media(max-width:860px){.cta-grid{grid-template-columns:1fr;gap:0;text-align:center}.cta-text{padding:44px 0 8px}.cta-text p{margin-inline:auto}.cta-btns{justify-content:center}.cta-art{margin-top:8px;padding:0 6px 0}}
/* Devices picture sits inside the red band and runs over the edge into the black footer */
section.cta-band{position:relative;z-index:2}
.cta-art{margin-top:0;margin-bottom:-64px;padding-top:34px;align-self:end}
.cta-text{padding:64px 0 76px}
@media(max-width:860px){.cta-text{padding:44px 0 6px}.cta-art{margin-top:0;margin-bottom:-44px;padding:24px 6px 0}}
/* More black above the footer content when the devices picture overlaps it */
main:has(.cta-band) + footer.site{padding-top:100px}
@media(max-width:860px){main:has(.cta-band) + footer.site{padding-top:62px}}

/* AI comparison icons in each AI's own brand colour */
.aicmp-openai{--ai:#10A37F}.aicmp-claude{--ai:#D97757}.aicmp-perplexity{--ai:#20B8CD}.aicmp-googlegemini{--ai:#4F8BF9}
.aicmp-btn[class*="aicmp-"]{color:var(--ai)}
footer.site .aicmp-btn[class*="aicmp-"]{color:var(--ai);border-color:color-mix(in srgb,var(--ai) 35%,#2a2a2a);background:color-mix(in srgb,var(--ai) 12%,#141414)}
footer.site .aicmp-btn[class*="aicmp-"]:hover,footer.site .aicmp-btn[class*="aicmp-"]:focus-visible{background:var(--ai);border-color:var(--ai);color:#fff}
/* Footer link rules (block, 6px padding) were pushing the AI icons off centre */
footer.site .foot a.aicmp-btn{display:grid;place-items:center;padding:0;line-height:0;flex:none}
footer.site .foot a.aicmp-btn svg{display:block;margin:0}
footer.site .foot a.aicmp-btn:hover,footer.site .foot a.aicmp-btn:focus-visible{transform:translateY(-2px)}
/* AI buttons: round, filled with the brand colour all the time, white icon */
footer.site .foot a.aicmp-btn,footer.site .foot a.aicmp-btn[class*="aicmp-"]{width:40px;height:40px;border-radius:50%;border:0;background:var(--ai);color:#fff;overflow:hidden}
footer.site .foot a.aicmp-btn[class*="aicmp-"]:hover,footer.site .foot a.aicmp-btn[class*="aicmp-"]:focus-visible{background:var(--ai);color:#fff;filter:brightness(1.12);box-shadow:0 6px 16px color-mix(in srgb,var(--ai) 45%,transparent)}
footer.site .foot a.aicmp-btn,footer.site .foot a.aicmp-btn[class*="aicmp-"]{border-radius:12px}
footer.site .paywith a.pw-qr,footer.site .paywith a.pw-qr:hover,footer.site .paywith a.pw-qr:focus-visible{border-color:#C8283A}
footer.site .paywith a.pw-qr{border-width:2px;border-style:solid;border-color:#C8283A}