/* Shared styles for every page except the homepage (blog, guides, case studies, AI agents, 404).
   Same colours, fonts, nav and footer as the homepage, with articles set on white for long reading. */
@font-face { font-family:'Geist'; font-style:normal; font-weight:300 700; font-display:swap; src:url(/fonts/geist-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Geist'; font-style:normal; font-weight:300 700; font-display:swap; src:url(/fonts/geist-latin.woff2) format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Geist Mono'; font-style:normal; font-weight:400 600; font-display:swap; src:url(/fonts/geist-mono-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Geist Mono'; font-style:normal; font-weight:400 600; font-display:swap; src:url(/fonts/geist-mono-latin.woff2) format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Newsreader'; font-style:normal; font-weight:400; font-display:swap; src:url(/fonts/newsreader-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Newsreader'; font-style:normal; font-weight:400; font-display:swap; src:url(/fonts/newsreader-latin.woff2) format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Newsreader'; font-style:normal; font-weight:400; font-display:swap; src:url(/fonts/newsreader-rupee.woff2) format('woff2'); unicode-range:U+20B9; }
@font-face { font-family:'Newsreader'; font-style:italic; font-weight:400; font-display:swap; src:url(/fonts/newsreader-italic-latin.woff2) format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  --blue:#004AFF; --blue-d:#003BD1; --blue-l:#9DB8FF; --tint:#EEF3FF; --tint-line:#D3E0FF;
  --dark:#111215; --ink:#0E1016; --ink-2:#4A5061; --rule:#E2E5EC;
  --on-blue-2:rgba(255,255,255,.8); --on-blue-3:rgba(255,255,255,.62); --rule-blue:rgba(255,255,255,.24);
  --on-dark:#F2F3F5; --on-dark-2:rgba(242,243,245,.72); --on-dark-3:rgba(242,243,245,.5);
  --serif:'Newsreader',Georgia,serif; --sans:'Geist',-apple-system,'Segoe UI',sans-serif; --mono:'Geist Mono',Consolas,monospace;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; text-size-adjust:100%; background:var(--dark); }
html, body { overflow-x:clip; }
body { font-family:var(--sans); font-size:18px; line-height:1.65; color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; min-height:100vh; display:flex; flex-direction:column; }
body > main { flex:1; }
::selection { background:var(--blue); color:#fff; }
a { color:var(--blue); text-decoration:none; }
a:focus-visible, summary:focus-visible, button:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
h1, h2, h3 { font-family:var(--serif); font-weight:400; color:var(--ink); letter-spacing:-0.015em; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* Nav, identical to the homepage */
nav { position:sticky; top:0; z-index:50; background:var(--blue); color:#fff; border-bottom:1px solid var(--rule-blue); }
.navin { display:flex; align-items:center; justify-content:space-between; gap:24px; max-width:1200px; margin:0 auto; padding:14px 32px; }
.logo img { display:block; height:32px; width:auto; }
.navlinks { display:flex; align-items:center; gap:28px; }
.navlinks a { font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--on-blue-2); }
.navlinks a:hover { color:#fff; }
.btn-line { border:1px solid currentColor; min-height:40px; padding:10px 16px; display:inline-flex; align-items:center; }
.navlinks a.btn-line { color:#fff; }
.navlinks a.btn-line:hover { background:#fff; color:var(--blue); }
.menubtn { display:none; width:44px; height:40px; background:none; border:none; cursor:pointer; position:relative; color:#fff; }
.menubtn span { position:absolute; left:10px; right:10px; height:1.5px; background:currentColor; transition:transform .25s ease-out, top .25s ease-out; }
.menubtn span:first-child { top:15px; } .menubtn span:last-child { top:24px; }
.menubtn[aria-expanded="true"] span:first-child { top:19px; transform:rotate(45deg); }
.menubtn[aria-expanded="true"] span:last-child { top:19px; transform:rotate(-45deg); }
.mnav { border-top:1px solid var(--rule-blue); padding:8px 20px 20px; }
.mnav a { display:block; padding:14px 0; border-bottom:1px solid var(--rule-blue); font-family:var(--mono); font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:#fff; }

/* Buttons */
.btn { display:inline-flex; align-items:center; gap:10px; min-height:52px; padding:15px 26px; border-radius:2px; background:var(--blue); color:#fff; font-family:var(--sans); font-size:16px; font-weight:600; line-height:1.2; transition:background .2s ease-out, transform .2s ease-out; }
.btn:hover { background:var(--blue-d); transform:translateY(-1px); }
.micro { font-size:14px; color:var(--ink-2); margin-top:12px; }

/* Article */
.article { max-width:740px; margin:0 auto; padding:64px 24px 96px; }
.crumbs { font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); margin-bottom:28px; }
.crumbs a { color:var(--ink-2); text-decoration:underline; text-underline-offset:3px; }
.crumbs a:hover { color:var(--blue); }
.article h1 { font-size:60px; line-height:1.04; letter-spacing:-0.025em; }
.byline { font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); margin:20px 0 36px; padding-bottom:28px; border-bottom:1px solid var(--rule); }
.article p { margin:0 0 18px; }
.article .lede { font-size:22px; line-height:1.5; color:var(--ink); }
.article h2 { font-size:38px; line-height:1.12; letter-spacing:-0.015em; margin:56px 0 18px; }
.article h3 { font-size:24px; line-height:1.25; }
.article strong { color:var(--ink); font-weight:600; }
.article ol, .article ul { margin:0 0 18px 24px; }
.article li { margin-bottom:8px; }
.article p a, .article li a, .faq .ans a { text-decoration:underline; text-underline-offset:3px; }

.factcard { background:var(--tint); border:1px solid var(--tint-line); padding:24px 28px; margin:0 0 28px; }
.factcard p { font-size:16px; margin:0 0 8px; }
.factcard p strong { font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); }
.factcard ul { margin:8px 0 0 20px; }
.factcard li { font-size:16px; }
.checklist { background:var(--tint); border:1px solid var(--tint-line); padding:24px 28px 24px 44px; margin:0 0 18px; }
.checklist li { font-weight:500; }
.pricecard { border:1px solid var(--rule); padding:24px; margin:0 0 16px; background:#fff; }
.pricecard.saar { border:1.5px solid var(--blue); background:var(--tint); }
.pricecard h3 { font-size:22px; line-height:1.3; display:flex; justify-content:space-between; align-items:baseline; gap:4px 12px; flex-wrap:wrap; }
.pricecard .band { white-space:nowrap; font-family:var(--mono); font-size:14px; letter-spacing:.06em; color:var(--ink-2); }
.pricecard.saar .band { color:var(--blue); }
.pricecard p { font-size:16px; margin:10px 0 0; color:var(--ink-2); }
.pricecard p b { color:var(--ink); font-weight:600; }
.article .rangenote, .costcard .rangenote, .vcard .lbl { font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-2); margin-bottom:12px; }
.quote, .storycard { border-left:3px solid var(--blue); background:var(--tint); padding:24px 28px; margin:0 0 18px; }
.quote p { font-family:var(--serif); font-size:24px; line-height:1.4; color:var(--ink); margin:0; }
.attrib { font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); margin-top:-6px !important; }
.storycard p { margin-bottom:12px; }
.storycard p:last-child { margin-bottom:0; }
.numcard { border:1.5px solid var(--blue); padding:24px 28px; margin:0 0 18px; }
.numcard .big { font-family:var(--serif); font-size:52px; line-height:1.02; letter-spacing:-0.02em; color:var(--blue); }
.numcard p { font-size:16px; margin:10px 0 0; }
.costcard { background:var(--tint); border:1px solid var(--tint-line); padding:24px 28px 10px; margin:0 0 18px; }
.costcard ul { margin-left:24px; }
.versus { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0 0 18px; }
.vcard { border:1px solid var(--rule); padding:24px; }
.vcard.saar { border:1.5px solid var(--blue); background:var(--tint); }
.vcard .big { font-family:var(--serif); font-size:28px; line-height:1.15; color:var(--ink); }
.vcard p { font-size:15px; margin:8px 0 0; color:var(--ink-2); }
.tablewrap { overflow-x:auto; margin:0 0 18px; border:1px solid var(--rule); }
.cmp { width:100%; border-collapse:collapse; font-size:15px; line-height:1.5; }
.cmp th, .cmp td { text-align:left; vertical-align:top; padding:12px 16px; border-bottom:1px solid var(--rule); }
.cmp tbody tr:last-child th, .cmp tbody tr:last-child td { border-bottom:none; }
.cmp thead th { font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); background:#F6F8FC; }
.cmp tbody th { font-weight:500; color:var(--ink); width:30%; }
.cmp td { color:var(--ink-2); }
.cmp td:last-child { white-space:nowrap; color:var(--ink); }
.cmp.text td:last-child { white-space:normal; }

.faq details { border-bottom:1px solid var(--rule); }
.faq details:first-child { border-top:1px solid var(--rule); }
.faq summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:44px; padding:16px 0; font-family:var(--serif); font-size:21px; line-height:1.3; color:var(--ink); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary .plus { font-family:var(--mono); color:var(--blue); font-size:22px; transition:transform .2s ease-out; flex:none; }
.faq details[open] .plus { transform:rotate(45deg); }
.faq .ans { font-size:16px; color:var(--ink-2); padding:0 0 18px; max-width:64ch; }

/* Call to action blocks: the homepage blue, with grain */
.cta { position:relative; isolation:isolate; background:var(--blue); color:#fff; padding:36px; margin-top:56px; }
.cta::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.08;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.article .cta h2 { color:#fff; margin-top:0; font-size:34px; }
.cta p { color:var(--on-blue-2); }
.cta .btn { background:#fff; color:var(--blue); margin-top:8px; }
.cta .btn:hover { background:#E6EDFF; }
.cta .micro { color:var(--on-blue-3); }

.related { margin-top:56px; padding-top:32px; border-top:1px solid var(--rule); }
.article .related h2 { font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-2); margin:0 0 8px; }
.related ul { list-style:none; margin:0; }
.related li { margin:0; padding:16px 0; border-bottom:1px solid var(--rule); }
.related li:last-child { border-bottom:none; }
.related li a { display:block; font-family:var(--serif); font-size:22px; line-height:1.3; text-decoration:none; color:var(--ink); }
.related li a:hover { color:var(--blue); }
.related li span { display:block; font-size:15px; color:var(--ink-2); margin-top:4px; }

/* Blog index */
.blogmain { max-width:820px; margin:0 auto; padding:80px 24px 104px; }
.blogmain h1 { font-size:72px; line-height:1; letter-spacing:-0.03em; }
.blogmain .intro { color:var(--ink-2); margin:16px 0 48px; font-size:19px; max-width:56ch; }
.postcard { display:block; border-top:1px solid var(--rule); padding:28px 0; color:var(--ink); }
.postcard:last-of-type { border-bottom:1px solid var(--rule); }
.postcard .date { font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-2); }
.postcard h2 { font-size:32px; line-height:1.15; margin:10px 0 8px; transition:color .2s ease-out; }
.postcard:hover h2 { color:var(--blue); }
.postcard p { font-size:16px; color:var(--ink-2); max-width:62ch; }
.postcard .more { display:inline-block; margin-top:12px; font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); }

/* 404 */
.lost { width:100%; max-width:760px; margin:0 auto; padding:104px 24px; }
.lost .label { font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); }
.lost h1 { font-size:64px; line-height:1.02; letter-spacing:-0.025em; margin:14px 0 18px; }
.lost p { color:var(--ink-2); max-width:56ch; }
.lost ul { list-style:none; margin:32px 0; border-top:1px solid var(--rule); }
.lost li { border-bottom:1px solid var(--rule); }
.lost li a { display:block; padding:16px 0; font-family:var(--serif); font-size:21px; color:var(--ink); }
.lost li a:hover { color:var(--blue); }

/* Footer, identical to the homepage */
footer { background:var(--dark); color:var(--on-dark-2); padding:56px 0; font-size:15px; }
.wrap { max-width:1200px; margin:0 auto; padding:0 32px; }
.footin { display:grid; grid-template-columns:1.2fr 1fr; gap:32px 64px; }
.footbrand img { display:block; height:32px; width:auto; margin-bottom:16px; }
.footbrand p { max-width:42ch; color:var(--on-dark-3); }
.footaddr { font-style:normal; line-height:1.9; }
footer a { color:var(--on-dark); text-decoration:underline; text-underline-offset:3px; }

@media (max-width:980px) { .footin { grid-template-columns:1fr; } }
@media (max-width:760px) {
  body { font-size:16px; }
  .wrap, .navin { padding-left:20px; padding-right:20px; }
  .article { padding:40px 20px 64px; }
  .article h1 { font-size:38px; }
  .article .lede { font-size:19px; }
  .article h2 { font-size:28px; margin-top:44px; }
  .quote p { font-size:20px; }
  .numcard .big { font-size:38px; }
  .versus { grid-template-columns:1fr; }
  .cta { padding:28px 22px; }
  .article .cta h2 { font-size:27px; }
  .cta .btn { width:100%; justify-content:center; }
  .faq summary { font-size:19px; }
  .cmp { font-size:14px; } .cmp th, .cmp td { padding:10px 8px; } .cmp tbody th { width:36%; }
  .blogmain { padding:48px 20px 72px; }
  .blogmain h1 { font-size:46px; }
  .postcard h2 { font-size:26px; }
  .lost { padding:64px 20px 72px; }
  .lost h1 { font-size:40px; }
}
@media (max-width:1080px) { .navlinks { gap:8px; } .navlinks a:not(.btn-line) { display:none; } .menubtn { display:block; } }
@media (min-width:1081px) { .mnav { display:none !important; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } .btn { transition:none; } }
