/* DESVY Services pages — self-hosted, no third-party fonts or CDNs (sovereign stack, strict CSP). */
:root{
  --navy:#050d1a; --navy2:#0a1628; --navy3:#0f2044; --navy4:#162d5a;
  --cyan:#00c8e0; --gold:#f0a500; --green:#22c55e; --red:#ff6b6a;
  --white:#f4f9fb; --gray:#b4cbd6; --gray2:#8fb4c4; --border:#1e3a5a;
  --radius:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--navy);color:var(--white);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--cyan)}
:focus-visible{outline:3px solid var(--cyan);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;background:var(--cyan);color:var(--navy);padding:10px 16px;z-index:100;font-weight:700}
.skip:focus{left:8px;top:8px}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}

/* header */
header.site{position:sticky;top:0;z-index:50;background:rgba(5,13,26,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
header.site .wrap{display:flex;align-items:center;gap:18px;min-height:62px;flex-wrap:wrap}
.brand{font-weight:800;letter-spacing:3px;color:var(--white);text-decoration:none;font-size:20px}
.brand span{color:var(--cyan)}
nav.main{display:flex;gap:16px;flex-wrap:wrap;margin-left:auto;align-items:center}
nav.main a{color:var(--gray);text-decoration:none;font-size:14px;padding:6px 2px}
nav.main a:hover,nav.main a[aria-current="page"]{color:var(--cyan)}
.lang{background:transparent;border:1px solid var(--border);color:var(--gray);border-radius:8px;padding:6px 12px;font-size:13px;cursor:pointer;font-weight:700}
.lang:hover{border-color:var(--cyan);color:var(--cyan)}

/* hero */
.hero{padding:72px 0 56px;background:radial-gradient(1000px 420px at 70% -10%,rgba(0,200,224,.14),transparent),var(--navy)}
.eyebrow{color:var(--cyan);font-size:12px;letter-spacing:3px;text-transform:uppercase;font-weight:700;margin-bottom:14px}
h1{font-size:clamp(30px,5vw,50px);line-height:1.12;font-weight:800;max-width:860px}
h1 em{font-style:normal;color:var(--cyan)}
.lead{color:var(--gray);font-size:clamp(16px,2vw,19px);max-width:760px;margin:18px 0 26px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--cyan);color:var(--navy);font-weight:800;border:0;border-radius:10px;padding:13px 22px;text-decoration:none;cursor:pointer;font-size:15px}
.btn:hover{background:#33d6ea}
.btn.ghost{background:transparent;color:var(--cyan);border:1px solid var(--cyan)}
.btn.ghost:hover{background:rgba(0,200,224,.1)}
.btn[disabled]{opacity:.6;cursor:wait}
.banner{margin-top:26px;padding:12px 16px;border:1px solid rgba(240,165,0,.4);background:rgba(240,165,0,.08);border-radius:10px;color:#ffd27a;max-width:760px;font-size:14px}

/* sections */
section{padding:56px 0;border-top:1px solid rgba(30,58,90,.5)}
h2{font-size:clamp(24px,3.4vw,34px);margin-bottom:8px}
.sub{color:var(--gray);max-width:760px;margin-bottom:28px}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.card{background:linear-gradient(180deg,var(--navy3),var(--navy2));border:1px solid var(--border);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column}
.card.featured{border-color:rgba(0,200,224,.6);box-shadow:0 0 0 1px rgba(0,200,224,.25)}
.card h3{font-size:18px;margin-bottom:4px}
.price{color:var(--gold);font-weight:800;font-size:20px;margin:4px 0 10px}
.card p{color:var(--gray);font-size:14.5px}
.card ul{margin:12px 0 16px 18px;color:var(--gray);font-size:14px}
.card li{margin-bottom:4px}
.card .btn{margin-top:auto;text-align:center}
.chip{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.5px;padding:3px 9px;border-radius:999px;border:1px solid var(--border);color:var(--gray);margin-bottom:10px;align-self:flex-start}
.chip.now{color:var(--green);border-color:rgba(34,197,94,.5)}
.chip.soon{color:var(--gold);border-color:rgba(240,165,0,.5)}
.chip.star{color:var(--cyan);border-color:rgba(0,200,224,.5)}
.note{font-size:13px;color:var(--gray2);margin-top:16px;max-width:820px}
.empty{color:var(--gray);padding:18px;border:1px dashed var(--border);border-radius:10px}
.checks{list-style:none;display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin:0}
.checks li{padding-left:28px;position:relative;color:var(--gray)}
.checks li::before{content:"✓";position:absolute;left:0;color:var(--cyan);font-weight:800}
.steps{counter-reset:s;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));list-style:none}
.steps li{counter-increment:s;background:var(--navy2);border:1px solid var(--border);border-radius:var(--radius);padding:18px 18px 18px 54px;position:relative;color:var(--gray)}
.steps li::before{content:counter(s);position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:50%;background:var(--cyan);color:var(--navy);font-weight:800;display:flex;align-items:center;justify-content:center}
.steps strong{display:block;color:var(--white)}
table.plain{width:100%;border-collapse:collapse;font-size:14px}
table.plain th,table.plain td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:top}
table.plain th{color:var(--gray2);font-size:12px;text-transform:uppercase;letter-spacing:1px}
.scroll-x{overflow-x:auto}

/* form */
form.intake{background:var(--navy2);border:1px solid var(--border);border-radius:var(--radius);padding:24px;max-width:760px}
.row{display:grid;gap:14px;grid-template-columns:1fr 1fr}
@media(max-width:640px){.row{grid-template-columns:1fr}}
.field{margin-bottom:16px}
label,legend{display:block;font-size:13px;font-weight:700;color:var(--gray);margin-bottom:6px}
input[type=text],input[type=email],select,textarea{width:100%;background:var(--navy);color:var(--white);border:1px solid #2b4d73;border-radius:8px;padding:11px 13px;font:inherit}
input::placeholder,textarea::placeholder{color:#6f90a3}
fieldset{border:0;margin-bottom:16px}
.opt{display:flex;gap:10px;align-items:flex-start;font-weight:400;margin-bottom:8px;color:var(--white)}
.opt input{margin-top:5px;accent-color:var(--cyan)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.hint{font-size:12.5px;color:var(--gray2);margin-top:4px}
.status{margin-top:14px;padding:12px 14px;border-radius:8px;font-size:14px;display:none}
.status.ok{display:block;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.4);color:#8be8ac}
.status.err{display:block;background:rgba(255,107,106,.1);border:1px solid rgba(255,107,106,.45);color:#ffb3b2}
footer.site{padding:34px 0 50px;border-top:1px solid var(--border);color:var(--gray2);font-size:13px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

.mb28{margin-bottom:28px}.mt20{margin-top:20px}.mt10{margin-top:10px}.maxw{max-width:820px}.h26{font-size:26px}.m-6-18{margin:6px 0 18px}.self-start{align-self:flex-start}.ok-note{color:var(--green)}

.faq{max-width:820px}.faq details{background:var(--navy2);border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;margin-bottom:10px}
.faq summary{cursor:pointer;font-weight:700}.faq p{color:var(--gray);margin-top:10px}

/* newsletter sign-up (footer) */
form.newsletter{max-width:560px;margin:0 auto 18px;text-align:left}
form.newsletter .nl-row{display:flex;gap:8px;margin:8px 0;flex-wrap:wrap}
form.newsletter input[type=email]{flex:1 1 220px;min-width:0}
form.newsletter .hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* guided tour (captions + optional voice) */
.tour-hl{outline:3px solid var(--cyan);outline-offset:6px;border-radius:var(--radius);transition:outline-color .2s}
.tour-bar{position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(5,13,26,.97);border-top:2px solid var(--cyan);padding:12px 16px calc(12px + env(safe-area-inset-bottom));display:grid;gap:8px;max-width:100%}
.tour-cap{margin:0;font-size:18px;line-height:1.45;color:var(--white);max-width:900px}
.tour-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--gray2)}
.tour-opt{display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.tour-btns{display:flex;gap:8px;flex-wrap:wrap}
.tour-btns .btn{padding:8px 16px}
body:has(.tour-bar){padding-bottom:150px}
@media (prefers-reduced-motion:reduce){.tour-hl{transition:none}}
.mic{margin-top:8px}
.ref-banner{background:linear-gradient(90deg,rgba(240,165,0,.18),rgba(0,200,224,.12));border:1px solid var(--gold);color:var(--white);padding:12px 16px;text-align:center;font-weight:600}
.after{margin-top:18px;padding:16px;border:1px solid var(--green);border-radius:var(--radius);background:rgba(34,197,94,.06)}
.after h3{margin:0 0 10px}
.steps-mini{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px}
.steps-mini li{padding-left:26px;position:relative;color:var(--gray)}
.steps-mini li::before{content:"○";position:absolute;left:0;color:var(--gray2)}
.steps-mini li.done{color:var(--white)}
.steps-mini li.done::before{content:"✓";color:var(--green);font-weight:700}
.share{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.share h4{margin:0 0 4px}

footer.site .disc{font-size:12px;line-height:1.5;color:var(--gray2);max-width:900px;margin:10px 0 12px}

/* ── DESVY look: same type, background, header and card style as desvy.com ───────────────────────────
   Fonts are self-hosted (the CSP only allows 'self'). Everything below overrides the base rules above. */
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(/services/assets/fonts/inter-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:'Orbitron';font-style:normal;font-weight:400 900;font-display:swap;src:url(/services/assets/fonts/orbitron-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{--display:'Orbitron',system-ui,sans-serif;--gap:20px}
body{font-family:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;position:relative;overflow-x:hidden}
.wrap{max-width:1320px;padding:0 16px}

/* background: faint grid + stars, like the homepage */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(0,200,224,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,200,224,.04) 1px,transparent 1px);background-size:60px 60px}
body::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55;background-size:420px 420px;background-image:radial-gradient(1px 1px at 40px 60px,#fff,transparent),radial-gradient(1px 1px at 180px 30px,#fff,transparent),radial-gradient(1.5px 1.5px at 300px 140px,#fff,transparent),radial-gradient(1px 1px at 90px 220px,#fff,transparent),radial-gradient(1px 1px at 250px 300px,#fff,transparent),radial-gradient(1.5px 1.5px at 370px 390px,#fff,transparent),radial-gradient(1px 1px at 20px 360px,#fff,transparent)}
header.site,main,footer.site,.ref-banner{position:relative;z-index:1}
header.site{position:sticky;z-index:50}

/* header: DΣVY logo with tagline, rounded nav links */
header.site{padding:10px 0;background:rgba(5,13,26,.92);backdrop-filter:blur(12px)}
header.site .wrap{min-height:0}
.brand{font-family:var(--display);font-weight:700;letter-spacing:2px;font-size:20px;line-height:1.2;display:inline-block}
.brand span{color:var(--cyan)}
.brand::after{content:"Proof Before Permission™";display:block;font-family:'Inter',sans-serif;font-size:10px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--cyan);margin-top:-1px}
nav.main{gap:4px}
nav.main a{font-size:13px;font-weight:500;padding:6px 14px;border-radius:6px;transition:all .18s}
nav.main a:hover,nav.main a[aria-current="page"]{background:rgba(0,200,224,.08)}
.lang{border-radius:8px;margin-left:8px}

/* hero */
.hero{padding:88px 0 64px}
.eyebrow{display:flex;align-items:center;gap:10px;font-weight:600}
.eyebrow::before{content:"";width:30px;height:1px;background:var(--cyan)}
h1{font-family:var(--display);font-size:clamp(1.7rem,4.2vw,3.1rem);font-weight:800;line-height:1.18;letter-spacing:.5px;max-width:980px}
.lead{max-width:720px}
.btn{font-weight:700;border-radius:8px}

/* sections: centred headings like the homepage */
section{padding:72px 0}
main section h2{font-family:var(--display);font-size:clamp(1.35rem,2.8vw,2rem);font-weight:700;text-align:center;margin-bottom:12px;letter-spacing:.5px}
main section .sub{text-align:center;margin-inline:auto;margin-bottom:34px}
.terms h2,.terms .sub{text-align:left;margin-inline:0}
.checks{max-width:1100px;margin-inline:auto}
.note{text-align:center;margin-inline:auto}

/* card rows: one uniform width per row, last row centred, no stranded card */
.grid,.steps{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap);--cols:4}
.grid>*,.steps>li{flex:0 0 calc((100% - (var(--cols) - 1)*var(--gap))/var(--cols));min-width:0}
.grid:has(>:nth-child(5)),.steps:has(>:nth-child(5)){--cols:5}
.grid:has(>:nth-child(-n+3):last-child),.steps:has(>:nth-child(-n+3):last-child){--cols:3}
@media(max-width:1279px){.grid,.steps{--cols:3}.grid:has(>:nth-child(-n+2):last-child){--cols:2}}
@media(max-width:899px){.grid,.steps{--cols:2}}
@media(max-width:599px){.grid,.steps{--cols:1}}
.empty{flex:1 1 100%;text-align:center}

/* cards: homepage card look, content pinned so buttons line up */
.card{background:rgba(10,22,40,.8);border:1px solid var(--border);padding:24px 22px;transition:border-color .25s,transform .25s,box-shadow .25s}
.card:hover{border-color:rgba(0,200,224,.55);transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,200,224,.08)}
.card.featured{border-color:rgba(0,200,224,.6);box-shadow:0 0 0 1px rgba(0,200,224,.25),0 8px 28px rgba(0,200,224,.08)}
.card h3{font-size:17px;line-height:1.35;min-height:2.7em}
.card h3 a{text-decoration:none}
.card h3 a:hover{color:var(--cyan)}
.price{font-family:var(--display);font-size:18px;letter-spacing:.5px}
.card ul{flex:1}
.card .btn{margin-top:auto}
.card .btn+.btn{margin-top:10px}
.card>ul+.btn,.card>p+.btn{margin-top:16px}
.card.maxw{margin-inline:auto;text-align:center;align-items:center}
.card.maxw .chip,.card.maxw .btn{align-self:center}

/* steps: numbered, Orbitron numerals */
.steps li{background:rgba(10,22,40,.8);padding:20px 18px 20px 58px}
.steps li::before{font-family:var(--display);font-size:13px;width:30px;height:30px;background:rgba(0,200,224,.15);border:2px solid var(--cyan);color:var(--cyan)}

/* form, FAQ, footer centred in the same column */
form.intake{margin-inline:auto;background:rgba(10,22,40,.8)}
input[type=text],input[type=email],select,textarea{background:rgba(5,13,26,.8);font-family:'Inter',sans-serif}
.faq{margin-inline:auto}
.faq details{background:rgba(10,22,40,.8)}
footer.site{text-align:center}
footer.site .disc{margin-inline:auto}