/* NextGen Cloud Solutions — site styles
   One family (Archivo variable, width + weight axes). Wide cuts for headings,
   normal width for reading. Navy ink, cool paper, brand red for actions only. */
@font-face{font-family:"Archivo";src:url("/assets/archivo-latin.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
:root{
  --navy:#0B2239;--navy-2:#143452;--ink:#17232F;--muted:#4A5968;
  --paper:#F2F4F6;--surface:#FFFFFF;--tint:#E4ECF4;--line:#C8D1DA;
  --red:#D22630;--red-dark:#A81C25;--ok:#1A7F4B;--warn:#9A5B00;
  --on-navy:#FFFFFF;--on-navy-muted:#B9C7D6;--navy-line:#2C4A68;
  --r:6px;--wrap:1200px;--gut:clamp(16px,4vw,40px);
  --s1:8px;--s2:16px;--s3:24px;--s4:40px;--s5:64px;--s6:96px;
  --font:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--font);font-stretch:100%}
img,svg{max-width:100%;display:block}
a{color:var(--navy);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--red-dark)}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:2px}
h1,h2,h3{font-stretch:112%;color:var(--navy);margin:0;text-wrap:balance}
h1{font-size:clamp(2.25rem,5.2vw,4rem);line-height:1.04;font-weight:680;letter-spacing:-.02em}
h2{font-size:clamp(1.5rem,2.6vw,2.125rem);line-height:1.15;font-weight:660;letter-spacing:-.012em}
h3{font-size:1.125rem;line-height:1.3;font-weight:640}
p{margin:0 0 var(--s2)}p:last-child{margin-bottom:0}
ul,ol,dl,dd{margin:0;padding:0}ul,ol{list-style:none}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.lead{font-size:clamp(1.125rem,1.5vw,1.3125rem);line-height:1.5;color:var(--ink);max-width:62ch}
.muted{color:var(--muted)}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:12px 16px;border-radius:var(--r);z-index:100}
.skip:focus{left:8px;color:#fff}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:var(--r);border:2px solid transparent;font:620 1rem/1.2 var(--font);font-stretch:104%;text-decoration:none;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.btn-primary{background:var(--red);color:#fff}
.btn-primary:hover{background:var(--red-dark);color:#fff}
.btn-ghost{border-color:var(--navy);color:var(--navy);background:transparent}
.btn-ghost:hover{background:var(--navy);color:#fff}
.on-navy .btn-ghost{border-color:#fff;color:#fff}
.on-navy .btn-ghost:hover{background:#fff;color:var(--navy)}
.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.tel{font-weight:640;font-stretch:104%;white-space:nowrap}

/* Header */
.hdr{position:sticky;top:0;z-index:50;background:var(--surface);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;gap:var(--s3);min-height:72px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy);margin-right:auto}
.brand img{width:148px;height:48px;flex:none}
.brand b{font-weight:760;font-stretch:118%;font-size:1.125rem;line-height:1;letter-spacing:-.01em}
.brand span{display:block;font-size:.75rem;font-weight:500;font-stretch:100%;color:var(--muted);letter-spacing:0;margin-top:3px}
.nav{display:none}
.nav>ul{display:flex;gap:2px}
.nav button,.nav>ul>li>a{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:8px 12px;border:0;background:none;border-radius:var(--r);font:560 .9375rem/1 var(--font);color:var(--ink);text-decoration:none;cursor:pointer}
.nav button:hover,.nav>ul>li>a:hover,.nav button[aria-expanded="true"]{background:var(--tint);color:var(--navy)}
.nav button svg{width:10px;height:10px;transition:transform .15s}
.nav button[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav [aria-current="page"]{box-shadow:inset 0 -3px 0 var(--red);border-radius:0}
.hdr-cta{display:none;white-space:nowrap}
.hdr-tel{display:none}
.menu-btn{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:2px solid var(--navy);border-radius:var(--r);background:none;font:620 .9375rem/1 var(--font);color:var(--navy);cursor:pointer}
.panel{position:absolute;left:0;right:0;top:100%;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:0 18px 30px -18px rgba(11,34,57,.35)}
.panel[hidden]{display:none}
.panel-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:var(--s4);padding-block:var(--s4)}
.panel-intro p{color:var(--muted);font-size:.9375rem;margin-top:var(--s1)}
.panel-intro a{font-weight:620}
.panel-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3) var(--s4)}
.panel-cols h3{font-size:.8125rem;font-stretch:100%;font-weight:600;color:var(--muted);margin-bottom:var(--s1)}
.panel-cols a{display:block;padding:7px 0;font-weight:560;font-size:.9375rem;text-decoration:none}
.panel-cols a:hover{text-decoration:underline}
.mobile{border-top:1px solid var(--line);background:var(--surface);max-height:calc(100dvh - 72px);overflow:auto}
.mobile[hidden]{display:none}
.mobile-in{padding-block:var(--s2) var(--s4)}
.mobile details{border-bottom:1px solid var(--line)}
.mobile summary,.mobile .m-link{display:flex;justify-content:space-between;align-items:center;min-height:52px;font-weight:620;cursor:pointer;list-style:none;text-decoration:none;color:var(--navy)}
.mobile .m-link{border-bottom:1px solid var(--line)}
.mobile summary::-webkit-details-marker{display:none}
.mobile summary::after{content:"+";font-size:1.25rem;font-weight:400}
.mobile details[open] summary::after{content:"–"}
.mobile details a{display:block;padding:10px 0 10px 12px;text-decoration:none}
.mobile details ul{padding-bottom:var(--s2)}
.mobile .actions{margin-top:var(--s3)}
@media (min-width:1120px){.nav{display:block}.hdr-cta{display:inline-flex;min-height:44px;padding:10px 16px}.menu-btn,.mobile{display:none!important}.brand{margin-right:var(--s2)}.nav{margin-right:auto}}
@media (min-width:1360px){.hdr-tel{display:inline}}

/* Hero */
.hero{padding-block:clamp(40px,7vw,88px) clamp(40px,6vw,72px)}
.hero-grid{display:grid;gap:var(--s4);align-items:start}
.hero h1{max-width:17ch}
.hero .lead{margin-top:var(--s3)}
.hero .actions{margin-top:var(--s4)}
.crumbs{font-size:.875rem;color:var(--muted);margin-bottom:var(--s3);display:flex;flex-wrap:wrap;gap:6px}
.crumbs a{color:var(--muted)}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--line)}
.platforms{margin-top:var(--s4);font-size:.9375rem;color:var(--muted);max-width:60ch}
.platforms strong{color:var(--ink);font-weight:600}
@media (min-width:960px){.hero-grid>div:first-child{position:sticky;top:104px}.hero-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s5)}.hero-grid.narrow{grid-template-columns:minmax(0,8fr) minmax(0,4fr)}}

/* Navy panels */
.on-navy{background:var(--navy);color:var(--on-navy);border-radius:var(--r)}
.on-navy h2,.on-navy h3{color:#fff}
.on-navy a{color:#fff}
.box{padding:clamp(20px,3vw,32px)}
.box h2{font-size:1.25rem}
.ticks li{position:relative;padding:10px 0 10px 32px;border-top:1px solid var(--navy-line);font-weight:520}
.ticks li:first-child{border-top:0}
.ticks li::before{content:"";position:absolute;left:2px;top:15px;width:16px;height:9px;border-left:3px solid #6FD3A0;border-bottom:3px solid #6FD3A0;transform:rotate(-45deg)}
.box .ticks{margin-top:var(--s2)}

/* Self-check */
.check{padding:clamp(20px,3vw,32px)}
.check h2{font-size:1.375rem}
.check>p{color:var(--on-navy-muted);font-size:.9375rem;margin-top:var(--s1)}
.check ol{margin-top:var(--s2);counter-reset:q}
.check fieldset{border:0;margin:0;padding:12px 0;border-top:1px solid var(--navy-line);display:grid;gap:8px;min-width:0}
.check legend{float:left;width:100%;padding:0;font-size:.9375rem;font-weight:520;line-height:1.4}
.check legend::before{counter-increment:q;content:counter(q) ". ";color:var(--on-navy-muted)}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;clear:both}
.seg label{position:relative;display:block}
.seg input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.seg span{display:flex;align-items:center;justify-content:center;min-height:44px;padding:4px 6px;border:1px solid var(--navy-line);border-radius:var(--r);font-size:.875rem;font-weight:560;text-align:center;line-height:1.2}
.seg input:hover+span{border-color:#fff}
.seg input:focus-visible+span{outline:3px solid #fff;outline-offset:2px}
.seg input:checked+span{background:#fff;color:var(--navy);border-color:#fff}
.seg input[value="yes"]:checked+span{background:#CDEFDD}
.seg input[value="partly"]:checked+span{background:#FFE3B0}
.result{margin-top:var(--s2);padding:var(--s2);background:var(--navy-2);border-radius:var(--r)}
.result strong{display:block;font-size:1.25rem;font-stretch:110%;line-height:1.25}
.result p{font-size:.9375rem;color:var(--on-navy-muted);margin:6px 0 0}
.result ul{margin-top:8px;font-size:.9375rem}
.result li{padding:3px 0}
.result .btn{margin-top:var(--s2);width:100%}
.meter{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;margin-top:10px}
.meter i{height:8px;border-radius:2px;background:var(--navy-line)}
.meter i.yes{background:#6FD3A0}.meter i.partly{background:#F0B34A}.meter i.no{background:#F28B91}

/* Sections: heading sits in a margin column on wide screens */
.sec{padding-block:clamp(40px,6vw,80px);border-top:1px solid var(--line)}
.sec-grid{display:grid;gap:var(--s3)}
.sec-head p{color:var(--muted);margin-top:var(--s2);max-width:44ch}
.sec-head .btn{margin-top:var(--s3)}
@media (min-width:960px){.sec-grid{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--s5)}.sec-head{position:sticky;top:104px;align-self:start}}
.sec.alt{background:var(--surface)}

/* Register (service index) */
.reg{border-top:2px solid var(--navy)}
.reg-row{display:grid;gap:var(--s1) var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.reg-row h3 a{text-decoration:none;color:var(--navy)}
.reg-row h3 a:hover{text-decoration:underline;color:var(--navy)}
.reg-row>p{color:var(--muted);font-size:.9375rem}
.reg-links{display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:4px}
.reg-links a{display:inline-flex;align-items:center;min-height:36px;padding:4px 12px;background:var(--tint);border-radius:999px;font-size:.875rem;font-weight:540;text-decoration:none}
.reg-links a:hover{background:var(--navy);color:#fff}
@media (min-width:720px){.reg-row{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}}

/* Definition grid (what's included) */
.defs{display:grid;gap:0 var(--s4);border-top:2px solid var(--navy)}
.defs>div{padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.defs dt{font-weight:640;font-stretch:108%;color:var(--navy);font-size:1.0625rem;margin-bottom:6px}
.defs dd{color:var(--muted);font-size:1rem}
@media (min-width:720px){.defs{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Steps (true sequences only) */
.steps{counter-reset:s;display:grid;gap:0;border-top:2px solid var(--navy)}
.steps li{counter-increment:s;display:grid;grid-template-columns:56px minmax(0,1fr);gap:var(--s2);padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.steps li::before{content:counter(s);font-size:2rem;font-weight:700;font-stretch:120%;line-height:1;color:var(--red)}
.steps p{color:var(--muted);margin-top:6px}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3) var(--s4)}
.stats dt{font-size:clamp(2rem,4vw,3rem);font-weight:720;font-stretch:118%;line-height:1;color:var(--navy);letter-spacing:-.02em}
.stats dd{color:var(--muted);font-size:.9375rem;margin-top:8px;max-width:24ch}
.stats div{display:flex;flex-direction:column-reverse;justify-content:flex-end}
@media (min-width:720px){.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.stats.three{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Plans ladder */
.ladder{display:grid;gap:var(--s2)}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s3);display:flex;flex-direction:column}
.plan.pick{border:2px solid var(--navy)}
.plan h3{font-size:1.5rem;font-stretch:116%}
.plan .flag{display:inline-block;margin-left:8px;padding:3px 10px;border-radius:999px;background:var(--navy);color:#fff;font-size:.75rem;font-weight:600;font-stretch:100%;vertical-align:middle;letter-spacing:0}
.plan .for{color:var(--muted);font-size:.9375rem;margin:8px 0 var(--s2)}
.plan .adds{font-weight:620;font-size:.9375rem;margin-bottom:6px}
.plan ul{margin-bottom:var(--s3)}
.plan li{position:relative;padding:7px 0 7px 26px;font-size:.9375rem;border-top:1px solid var(--line)}
.plan li::before{content:"";position:absolute;left:2px;top:13px;width:13px;height:7px;border-left:2.5px solid var(--ok);border-bottom:2.5px solid var(--ok);transform:rotate(-45deg)}
.plan .btn{margin-top:auto}
.note{color:var(--muted);font-size:.9375rem;margin-top:var(--s3)}
@media (min-width:960px){.ladder{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}.plan:nth-child(1){min-height:480px}.plan:nth-child(2){min-height:540px}.plan:nth-child(3){min-height:600px}}

/* Baseline table */
.tbl{width:100%;border-collapse:collapse;border-top:2px solid var(--navy);font-size:1rem}
.tbl th,.tbl td{text-align:left;padding:12px 0;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{font-weight:600;color:var(--muted);font-size:.875rem}
.tbl td:last-child,.tbl th:last-child{text-align:right;color:var(--muted);white-space:nowrap;padding-left:var(--s2)}

/* Chips, FAQ, cards */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips li{padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:.9375rem;font-weight:540}
.faq{border-top:2px solid var(--navy)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;gap:var(--s2);align-items:flex-start;padding:18px 0;font-weight:640;font-stretch:106%;color:var(--navy);cursor:pointer;list-style:none;font-size:1.0625rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-size:1.5rem;line-height:1;font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 20px;max-width:68ch;color:var(--ink)}
.sectors{display:grid;gap:var(--s3) var(--s4)}
.sectors p{color:var(--muted);margin-top:6px}
@media (min-width:720px){.sectors{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* CTA band */
.band{background:var(--navy);color:#fff;padding-block:clamp(48px,7vw,88px)}
.band.urgent{background:var(--red-dark)}
.band h2{color:#fff;font-size:clamp(1.75rem,3.4vw,2.75rem);max-width:20ch}
.band p{color:var(--on-navy-muted);max-width:58ch;margin-top:var(--s2);font-size:1.125rem}
.band.urgent p{color:#FFE1E3}
.band .actions{margin-top:var(--s4)}
.band .tel{color:#fff;font-size:1.25rem}
.band.urgent .btn-primary{background:#fff;color:var(--red-dark)}

/* Forms */
.form{display:grid;gap:var(--s2);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(20px,3vw,32px)}
.form label{display:grid;gap:6px;font-weight:600;font-size:.9375rem}
.form input,.form select,.form textarea{width:100%;min-height:48px;padding:10px 12px;border:1px solid #8795A3;border-radius:var(--r);background:#fff;font:400 1rem/1.4 var(--font);color:var(--ink)}
.form textarea{min-height:140px;resize:vertical}
.form input:focus-visible,.form select:focus-visible,.form textarea:focus-visible{outline:3px solid var(--navy);outline-offset:1px}
.form .two{display:grid;gap:var(--s2)}
.form .hp{position:absolute;left:-9999px}
.form .err{color:var(--red-dark);font-weight:500;font-size:.875rem}
.form [aria-invalid="true"]{border-color:var(--red);border-width:2px}
.form small{color:var(--muted);font-size:.875rem}
@media (min-width:600px){.form .two{grid-template-columns:1fr 1fr}}
.contact-list{display:grid;gap:var(--s3)}
.contact-list dt{font-size:.875rem;color:var(--muted);font-weight:600}
.contact-list dd{font-size:1.125rem;font-weight:600}
.contact-list dd a{text-decoration:none}

/* Footer */
.ftr{background:var(--navy);color:var(--on-navy-muted);padding-block:var(--s5) var(--s4);border-top:1px solid var(--navy-line);font-size:.9375rem}
.ftr a{color:#fff;text-decoration:none}.ftr a:hover{text-decoration:underline;color:#fff}
.ftr-grid{display:grid;gap:var(--s4)}
.ftr h2{font-size:.875rem;font-stretch:100%;font-weight:600;color:var(--on-navy-muted);letter-spacing:0;margin-bottom:var(--s1)}
.ftr li{padding:5px 0}
.ftr .brand{color:#fff}.ftr .brand rect{fill:#1D4368}.ftr .brand span{color:var(--on-navy-muted)}
.ftr-about p{margin-top:var(--s2);max-width:36ch}
.ftr-base{display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:space-between;margin-top:var(--s5);padding-top:var(--s3);border-top:1px solid var(--navy-line);font-size:.875rem}
@media (min-width:720px){.ftr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1040px){.ftr-grid{grid-template-columns:minmax(0,3fr) repeat(4,minmax(0,2fr))}}

.prose p{max-width:68ch}
.empty{padding:var(--s4);border:1px dashed var(--line);border-radius:var(--r);background:var(--surface)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.hdr,.band,.ftr,.check{display:none}}

.sec-top{margin-bottom:var(--s4)}.sec-top p{color:var(--muted);margin-top:var(--s2);max-width:60ch}
.hero h1.h1-long{font-size:clamp(2.125rem,4.3vw,3.375rem);max-width:21ch}

/* Articles and legal pages */
.art-hero h1{max-width:26ch}
.art-meta{font-size:.9375rem;color:var(--muted);font-weight:560;margin-bottom:var(--s2)}
.article{max-width:72ch}
.article h2{font-size:1.5rem;margin:var(--s4) 0 var(--s2)}
.article h2:first-child{margin-top:0}
.article h3{margin:var(--s3) 0 var(--s1)}
.article ul,.article ol{margin:0 0 var(--s2);padding-left:1.4em}
.article ul{list-style:disc}.article ol{list-style:decimal}
.article li{margin-bottom:8px}
.article a{font-weight:560}
.article table{width:100%;border-collapse:collapse;border-top:2px solid var(--navy);margin:0 0 var(--s3);font-size:.9375rem;display:block;overflow-x:auto}
.article th,.article td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top}
.article th{font-weight:640;color:var(--navy)}
.sectors h3 a{text-decoration:none}.sectors h3 a:hover{text-decoration:underline}
.cf-turnstile{min-height:65px}
.form-status{font-weight:600;margin:0}.form-status.bad{color:var(--red-dark)}