/* THE RESULT SERVICES PAGES (TASK-090, founder 2026-11-11) : the hub /services and the three service pages
   (templates/service_v5.html, copy and markup modules/landing_v5/services.py). Built on landing-v5.css (sections,
   headings, crumb, FAQ) ; the forms of the site : white cards, thin borders, 12 to 20 px radius, no gradient.
   The menu's own rules (the Services panel) live with the mega menu in partials/header-v3.html. */

/* ---- the sample of the deliverable (the hero's document) */
.sv-doc{background:#fff;border:1px solid #dfe5ee;border-radius:12px;box-shadow:0 30px 60px -34px rgba(11,21,48,.5);color:#0b1530;overflow:hidden;text-align:left}
.sv-doc-bar{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid #e9edf3;background:#f8fafc;font-size:12.5px;color:#5b6370}
.sv-doc-bar i{font-size:15px}
.sv-doc-bar i.x{color:#1d7044}.sv-doc-bar i.p{color:#c0392b}
.sv-doc-bar b{color:#0b1530;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sv-doc-bar span{margin-left:auto;font-size:11.5px;padding:2px 8px;border-radius:6px;background:#eef3fc;color:#2B7AE4;font-weight:600}
.sv-doc-pg{padding:22px 24px 6px}
.sv-doc-h{margin:0;font-size:17px;font-weight:700;letter-spacing:-.01em;color:#0b1530}
.sv-doc-pg .m{margin:4px 0 14px;font-size:12.5px;color:#6b7280}
.sv-doc-more{padding-top:0;padding-bottom:150px}
.sv-t{width:100%;border-collapse:collapse;font-size:12.5px}
.sv-t th{text-align:left;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:#7a818c;padding:8px 10px;border-bottom:1px solid #dfe5ee;background:#f8fafc}
.sv-t td{padding:9px 10px;border-bottom:1px solid #eef1f5;vertical-align:top;line-height:1.4;color:#374151}
.sv-t td b{display:block;color:#0b1530;font-weight:600}
.sv-t td em{display:block;font-style:normal;color:#7a818c;font-size:11.5px;margin-top:1px}
.sv-v{display:inline-block;padding:2px 8px;border-radius:6px;font-size:11.5px;font-weight:600;line-height:1.5}
.sv-v.ok{background:#D1FAE5;color:#065f46}.sv-v.tc{background:#FFF7D8;color:#8a6100}.sv-v.an{background:#EDE9FE;color:#5b21b6}.sv-v.no{background:#EEF0F3;color:#4b5563}.sv-v.of{background:#dbeafe;color:#1e40af}
.sv-gate{position:relative}
.sv-blur{filter:blur(4.5px);opacity:.75;user-select:none;pointer-events:none}
.sv-gate-fade{position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 55%)}
.sv-gate-card{position:absolute;left:50%;bottom:20px;translate:-50% 0;width:min(430px,calc(100% - 32px));background:#fff;border:1px solid #dfe5ee;border-radius:16px;box-shadow:0 24px 60px -22px rgba(11,21,48,.5);padding:20px;text-align:left}
.sv-gate-h{margin:0;font-size:17px;font-weight:700;color:#0b1530;letter-spacing:-.01em}
.sv-gate-card p:not(.sv-gate-h){margin:6px 0 12px;font-size:13.5px;line-height:1.5;color:#4b5563}
.sv-row{display:flex;gap:8px;margin:0}
.sv-in{flex:1;min-width:0;height:44px;border:1px solid #cfd6e2;border-radius:10px;padding:0 13px;font:inherit;font-size:14.5px;color:#0b1530;background:#fff;box-sizing:border-box}
.sv-in::placeholder{color:#9aa3b0}
.sv-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:44px;padding:0 18px;border-radius:10px;background:#2B7AE4;color:#fff;font:inherit;font-weight:600;font-size:14.5px;border:0;text-decoration:none;white-space:nowrap;cursor:pointer}
.sv-btn:hover{background:#1f68cc}
.sv-gate-card .sv-fine,.sv-fine{margin:10px 0 0;font-size:12px;line-height:1.45;color:#7a818c}

/* ---- the hero : one laptop screen at most (founder 2026-11-11 : about 730 px at 1440 x 900) */
.sv-hero.fp-hero{padding-top:142px;padding-bottom:46px}
.sv-hero .fp-crumb{margin-bottom:18px}
.sv-hero .fp-crumb a{color:inherit;text-decoration:none}.sv-hero .fp-crumb a:hover{color:#fff;text-decoration:underline}
.sv-hero .fp-h1{font-size:42px;margin-top:12px}
.sv-hero .lv5-lede{margin-top:16px;font-size:16.5px}
.sv-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:52px;align-items:center}
.sv-dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 16px;margin:18px 0 0;font-size:14.5px;color:#fff}
.sv-dl dt{color:#93a1bd}.sv-dl dd{margin:0;font-weight:600}
.sv-stack{position:relative;padding:0 0 0 18px}
.sv-stack:before{content:"";position:absolute;inset:14px -12px -14px 30px;background:rgba(255,255,255,.14);border-radius:12px;rotate:1.6deg}
.sv-stack .sv-doc{position:relative}
.sv-hero .sv-doc{max-height:462px}
.sv-hero .sv-gate-fade{height:44%}
.sv-hero .sv-doc-pg{padding:16px 20px 4px}
.sv-hero .sv-doc-h{font-size:15.5px}
.sv-hero .sv-doc-pg .m{margin-bottom:10px;font-size:12px}
.sv-hero .sv-t td{padding:7px 9px}
.sv-hero .sv-gate-card{bottom:16px;padding:18px}
.sv-hero .sv-gate-h{font-size:17.5px}

/* ---- the sticky sample bar : after the hero, at the top of the screen, under the header */
.sv-stick{position:fixed;left:0;right:0;top:var(--st,0px);z-index:90;background:#0b1530;color:#fff;border-top:1px solid rgba(255,255,255,.12);box-shadow:0 16px 30px -18px rgba(11,21,48,.7);transform:translateY(-130%);opacity:0;transition:transform .28s ease,opacity .2s ease;pointer-events:none}
.sv-stick.on{transform:none;opacity:1;pointer-events:auto}
.sv-stick .in{max-width:1200px;margin:0 auto;padding:10px 32px;display:flex;align-items:center;gap:14px}
.sv-stick .ic{width:34px;height:34px;border-radius:9px;background:rgba(132,195,255,.16);color:#84c3ff;display:grid;place-items:center;flex:none;font-size:15px}
.sv-stick .t{flex:1;min-width:0;margin:0;font-size:14.5px;line-height:1.35;color:#dbe4f5}
.sv-stick .t b{color:#fff}
.sv-stick .sv-row{flex:none}
.sv-stick .sv-in{flex:none;width:250px;height:40px;font-size:14px}
.sv-stick .sv-btn{height:40px;font-size:14px}
@media (prefers-reduced-motion:reduce){.sv-stick{transition:none}}

/* ---- the dynamic price (the first section under the hero) */
.sv-cfg{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;align-items:start;margin-top:var(--gap-head,32px)}
.sv-sets{border:1px solid #dfe5ee;border-radius:20px;padding:6px 28px;background:#fff}
.sv-set{padding:24px 0 22px;border-bottom:1px solid #e9edf3}
.sv-set:last-child{border-bottom:0}
.sv-set .h{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.sv-set .h b{font-size:16px;color:#0b1530}
.sv-set .h label{cursor:pointer}
.sv-set .h output{font-size:24px;font-weight:700;letter-spacing:-.02em;color:#2B7AE4;font-variant-numeric:tabular-nums;text-align:right}
.sv-set .hint{margin:3px 0 12px;font-size:14px;line-height:1.45;color:#5b6370}
.sv-rgrow{display:grid;grid-template-columns:38px minmax(0,1fr) 38px;gap:12px;align-items:center}
.sv-stp{width:38px;height:38px;border-radius:11px;border:1px solid #d6deea;background:#f8fafc;color:#0b1530;font-size:12px;display:grid;place-items:center;cursor:pointer;padding:0}
.sv-stp[aria-disabled="true"]{opacity:.35;cursor:default}
input.sv-rg{-webkit-appearance:none;appearance:none;display:block;width:100%;height:30px;margin:0;background:transparent;cursor:pointer}
input.sv-rg::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:linear-gradient(to right,#2B7AE4 var(--p,0%),#e3e8f0 var(--p,0%))}
input.sv-rg::-moz-range-track{height:6px;border-radius:3px;background:#e3e8f0}
input.sv-rg::-moz-range-progress{height:6px;border-radius:3px;background:#2B7AE4}
input.sv-rg::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:2px solid #2B7AE4;box-shadow:0 2px 8px rgba(11,21,48,.28);margin-top:-10px}
input.sv-rg::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid #2B7AE4;box-shadow:0 2px 8px rgba(11,21,48,.28)}
.sv-tog{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:12px;background:#f3f5f9;border:1px solid #e3e8f0}
.sv-tog button{font:inherit;font-weight:600;font-size:14.5px;padding:9px 16px;border-radius:9px;border:0;background:transparent;color:#5b6370;cursor:pointer}
.sv-tog button.on{background:#fff;color:#0b1530;box-shadow:0 1px 4px rgba(11,21,48,.16)}
.sv-pc{position:sticky;top:112px;background:#0b1530;color:#fff;border-radius:20px;padding:28px;box-shadow:0 30px 60px -34px rgba(11,21,48,.6)}
.sv-pc .k{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#84c3ff}
.sv-pc .top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.sv-cur{display:inline-flex;gap:2px;padding:3px;border-radius:9px;background:rgba(255,255,255,.08)}
.sv-cur button{font:600 12px ui-monospace,Menlo,monospace;padding:4px 9px;border-radius:6px;border:0;background:transparent;color:#b8c3da;cursor:pointer}
.sv-cur button.on{background:#fff;color:#0b1530}
.sv-pc .bdg{display:inline-block;margin-top:18px;font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px;background:rgba(132,195,255,.16);color:#cfe6ff}
.sv-pc .bdg.fl{background:rgba(255,214,102,.18);color:#ffe29a}
.sv-pc .num{margin:6px 0 0;font-size:54px;font-weight:700;letter-spacing:-.035em;line-height:1.05;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.sv-pc .num small{font-size:16px;font-weight:500;color:#b8c3da;letter-spacing:0}
.sv-pc .scope{margin:8px 0 0;font-size:15px;color:#b8c3da}
.sv-pc dl{margin:18px 0 0;padding:14px 0 0;border-top:1px solid rgba(255,255,255,.16);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;font-size:14.5px}
.sv-pc dt{color:#b8c3da}
.sv-pc dd{margin:0;font-weight:600;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.sv-pc ul{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px solid rgba(255,255,255,.16);display:grid;gap:8px;font-size:14.5px;line-height:1.45;color:#dbe4f5}
.sv-pc ul b{color:#fff}
.sv-pc .cta{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:20px;min-height:50px;padding:0 16px;border-radius:12px;background:#fff;color:#0b1530;font-weight:600;font-size:15.5px;text-decoration:none;text-align:center}
.sv-pc .cta:hover{background:#e8f1fd}
.sv-pc .eng{margin:12px 0 0;font-size:13px;color:#93a1bd}
.sv-guar{display:flex;gap:14px;align-items:flex-start;margin:24px 0 0;padding:18px 22px;border-radius:16px;background:#f3f7fd;border:1px solid #d5e3f8;font-size:15px;line-height:1.55;color:#374151}
.sv-guar i{color:#2B7AE4;font-size:18px;margin-top:3px}
.sv-guar b{color:#0b1530}

/* ---- keyboard : a visible focus on every control */
.sv-stp:focus-visible,.sv-tog button:focus-visible,.sv-btn:focus-visible,.sv-in:focus-visible,.sv-hcard:focus-visible,.sv-hero .fp-crumb a:focus-visible{outline:2px solid #2B7AE4;outline-offset:2px}
.sv-cur button:focus-visible,.sv-pc .cta:focus-visible,.sv-stick .sv-btn:focus-visible,.sv-stick .sv-in:focus-visible{outline:2px solid #84c3ff;outline-offset:2px}
input.sv-rg:focus{outline:none}
input.sv-rg:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px rgba(43,122,228,.35),0 2px 8px rgba(11,21,48,.28)}
input.sv-rg:focus-visible::-moz-range-thumb{box-shadow:0 0 0 5px rgba(43,122,228,.35),0 2px 8px rgba(11,21,48,.28)}

/* ---- the deliverable (table of contents), the calendar, how we produce it */
.sv-toc{list-style:none;margin:0;padding:0;border-top:1px solid #e3e8f0}
.sv-toc li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;padding:17px 0;border-bottom:1px solid #e3e8f0}
.sv-toc li>span{font:600 13px "JetBrains Mono",ui-monospace,monospace;color:#2B7AE4;padding-top:3px}
.sv-toc b{display:block;font-size:17px;color:#0b1530}
.sv-toc em{display:block;font-style:normal;font-size:14.5px;color:#5b6370;margin-top:3px}
.sv-line{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--gap-head,32px);position:relative}
.sv-line:before{content:"";position:absolute;left:8px;right:8px;top:8px;height:2px;background:#cfdcf2}
.sv-pt{position:relative;padding:34px 22px 0 0}
.sv-pt:before{content:"";position:absolute;left:0;top:0;width:18px;height:18px;border-radius:50%;background:#2B7AE4;box-shadow:0 0 0 4px #fff}
.sv-pt .k{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#2B7AE4}
.sv-pt h3{margin:6px 0 0;font-size:18px;color:#0b1530;letter-spacing:-.01em}
.sv-pt p{margin:6px 0 0;font-size:14.5px;line-height:1.5;color:#4b5563}
.sv-proofs{display:grid;gap:14px;margin-top:24px}
.sv-proof{display:flex;gap:12px;align-items:flex-start;margin:0;font-size:15.5px;line-height:1.5;color:#dbe4f5}
.sv-proof i{color:#84c3ff;margin-top:4px}
.sv-proof b{color:#fff}

/* ---- the hub : three cards, one link each */
.sv-hub-hero.fp-hero{padding-top:150px;padding-bottom:72px}
.sv-hub-hero .lv5-lede{max-width:760px;margin-top:20px}
.sv-hcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:var(--gap-head,32px)}
.sv-hcard{display:grid;align-content:start;gap:10px;padding:26px;border:1px solid #dfe5ee;border-radius:20px;background:#fff;color:#0b1530;text-decoration:none;transition:border-color .15s,box-shadow .15s}
.sv-hcard:hover{border-color:#b9cdee;box-shadow:0 24px 50px -34px rgba(11,21,48,.45)}
.sv-hcard .ic{width:46px;height:46px;border-radius:13px;background:#0b1530;color:#fff;display:grid;place-items:center;font-size:18px}
.sv-hcard h3{margin:8px 0 0;font-size:21px;letter-spacing:-.015em}
.sv-hcard p{margin:0;font-size:15px;line-height:1.55;color:#4b5563}
.sv-hcard .meta{font-size:13.5px;font-weight:600;color:#2B7AE4}
.sv-hcard .go{margin-top:6px;display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14.5px;color:#0b1530}

/* ---- phone and tablet (last, so it wins over every block above) */
@media (max-width:960px){.sv-hcards{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){
  .sv-split,.sv-cfg{grid-template-columns:minmax(0,1fr);gap:26px}
  .sv-split>*,.sv-cfg>*{min-width:0}
  .sv-set .h output{font-size:21px}
  .sv-guar{padding:14px 16px}
  .sv-pc{position:static}
  .sv-hero.fp-hero{padding-top:28px;padding-bottom:36px}
  .sv-hero .fp-h1{font-size:31px}
  .sv-stack{padding:0}.sv-stack:before{display:none}
  .sv-hero .fp-crumb,.sv-hero .sv-doc-bar{display:none}
  .sv-hero .lv5-lede{font-size:15.5px}
  .sv-hero .sv-doc{max-height:none}
  .sv-hero .sv-doc-pg,.sv-hero .sv-gate-fade{display:none}
  .sv-hero .sv-gate-card{position:static;translate:none;width:auto;margin:0;border:0;border-radius:0;box-shadow:none;padding:16px}
  .sv-gate-card .sv-row{flex-wrap:wrap}.sv-gate-card .sv-in{flex:1 1 100%}.sv-gate-card .sv-btn{flex:1 1 100%}
  .sv-sets{padding:2px 18px}.sv-pc{padding:22px}.sv-pc .num{font-size:44px}
  .sv-line{grid-template-columns:1fr 1fr;gap:26px 0}.sv-line:before{display:none}
  .sv-stick .in{padding:8px 16px;gap:8px}.sv-stick .ic,.sv-stick .t{display:none}
  .sv-stick .sv-row{flex:1;min-width:0}.sv-stick .sv-in{flex:1;width:auto;min-width:0}
  .sv-hub-hero.fp-hero{padding-top:36px;padding-bottom:48px}
  /* the phone hero stays within one screen too (founder 2026-11-11) : tighter type and spacing, the sample card only */
  .sv-hero.fp-hero{padding-top:24px;padding-bottom:24px}
  .sv-hero .sv-split{gap:18px}
  .sv-hero .fp-h1{font-size:28px;margin-top:10px}
  .sv-hero .lv5-lede{margin-top:12px;font-size:15px;line-height:1.5}
  .sv-hero .sv-dl{margin-top:12px;gap:4px 14px;font-size:14px}
  .sv-hero .sv-gate-card{padding:14px}
  .sv-hero .sv-gate-h{font-size:16.5px}
  .sv-hero .sv-gate-card p:not(.sv-gate-h){margin:4px 0 10px;font-size:13px}
  .sv-hero .sv-gate-card .sv-fine{margin-top:8px;font-size:11.5px}
}
@media (max-width:420px){
  .sv-line{grid-template-columns:minmax(0,1fr)}
  .sv-stick .sv-btn{padding:0 12px}
  .sv-set .h{flex-wrap:wrap}
}
