/* =====================================================================
   Service detail page (v2). Builds on home-v2.css (.hv2 tokens/components).
   ===================================================================== */

/* ---- Hero ---- */
/* The service banner is a full-width photo (subject on the right, empty light area on the left),
   so it covers the whole hero and only the left side gets a light fade for the text. */
.hv2 .sv-hero{min-height:clamp(560px,44vw,760px);padding:150px 0 70px}
/* start the photo below the absolutely-positioned site header and pin it to the top,
   so the subject's head is never hidden or cropped */
.hv2 .sv-hero .hero-media{width:100%;top:var(--hdr-h,81px);background:var(--bg)}
.hv2 .sv-hero .hero-media img{object-fit:cover;object-position:78% 0%}
.hv2 .sv-hero .hero-fade{background:linear-gradient(90deg,rgba(244,248,252,.96) 0%,rgba(244,248,252,.9) 34%,rgba(244,248,252,.35) 55%,rgba(244,248,252,0) 68%)}
.hv2 .sv-hero .hero-content{max-width:640px}
.hv2 .sv-hero h1{font-size:clamp(34px,4.2vw,56px)}
.hv2 .sv-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--muted);margin-bottom:18px;background:#fff;border:1px solid var(--line);padding:7px 16px;border-radius:50px;width:max-content;max-width:100%;box-shadow:var(--shadow-sm)}
.hv2 .sv-crumbs a{color:var(--brand)}
.hv2 .sv-crumbs a:hover{color:var(--red)}
.hv2 .sv-crumbs .current{color:var(--ink)}
.hv2 .sv-chips{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px}
.hv2 .sv-chips li{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:50px;padding:8px 16px;font-size:14px;font-weight:600;color:var(--ink);box-shadow:var(--shadow-sm)}
.hv2 .sv-chips svg.i{color:#1f9d6b;stroke-width:3}

/* ---- Overview + sticky form ---- */
.hv2 .sv-layout{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:36px;align-items:start}
.hv2 .sv-article{display:grid;gap:26px}
.hv2 .sv-block{background:#fff;border:1px solid var(--line);border-radius:18px;padding:34px}
.hv2 .sv-block h2{font-size:clamp(22px,2.4vw,28px);margin-bottom:16px}
.hv2 .sv-figure{margin:0;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,var(--brand-800),var(--brand));box-shadow:var(--shadow)}
.hv2 .sv-figure img{width:100%;height:100%;object-fit:cover}
.hv2 .sv-aside{position:sticky;top:110px;display:grid;gap:18px}
.hv2 .sv-aside .form-card{background:#fff;box-shadow:var(--shadow)}
.hv2 .sv-aside .form-card .eyebrow{margin-bottom:6px}
.hv2 .sv-help{display:flex;gap:14px;align-items:flex-start;background:linear-gradient(135deg,var(--brand-800),var(--brand));color:#cfe0ef;border-radius:16px;padding:22px}
.hv2 .sv-help .ic{flex:none;width:44px;height:44px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-size:19px}
.hv2 .sv-help strong{display:block;color:#fff;font-family:'Manrope';font-size:16px;margin-bottom:4px}
.hv2 .sv-help a{display:block;font-size:14px;word-break:break-word}
.hv2 .sv-help a:hover{color:#fff}

/* ---- Rich text from the admin editor ---- */
.hv2 .sv-prose{color:var(--text);font-size:15.5px;line-height:1.75}
.hv2 .sv-prose > *:last-child{margin-bottom:0}
.hv2 .sv-prose p{margin:0 0 14px}
.hv2 .sv-prose h2,.hv2 .sv-prose h3,.hv2 .sv-prose h4,.hv2 .sv-prose h5{margin:22px 0 10px;font-size:18px}
.hv2 .sv-prose a{color:var(--brand);text-decoration:underline}
.hv2 .sv-prose strong,.hv2 .sv-prose b{color:var(--ink)}
.hv2 .sv-prose ul,.hv2 .sv-prose ol{margin:0 0 16px;padding-left:22px;display:grid;gap:6px}
.hv2 .sv-prose li{color:var(--text)}
.hv2 .sv-prose.checks ul{list-style:none;padding-left:0;gap:10px}
.hv2 .sv-prose.checks ul li{position:relative;padding-left:32px;color:var(--ink);font-weight:500}
.hv2 .sv-prose.checks ul li::before{
  content:"";position:absolute;left:0;top:2px;width:22px;height:22px;border-radius:50%;
  background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat;
}

/* ---- Software logos marquee ---- */
.hv2 .sv-logos-sec .sec-head{margin-bottom:30px}
.hv2 .sv-logos{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.hv2 .sv-logos-track{display:flex;gap:18px;width:max-content;animation:hv2-marquee 35s linear infinite;padding:6px 0}
.hv2 .sv-logos:hover .sv-logos-track{animation-play-state:paused}
.hv2 .sv-logo{flex:none;width:190px;height:96px;background:#fff;border:1px solid var(--line);border-radius:14px;display:grid;place-items:center;padding:16px 22px;box-shadow:var(--shadow-sm)}
.hv2 .sv-logo img{max-height:56px;max-width:100%;object-fit:contain}

/* ---- Split sections ---- */
.hv2 .sv-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.hv2 .sv-split .sv-figure{aspect-ratio:4/3}
.hv2 .sv-copy h2{font-size:clamp(26px,3vw,36px);margin-bottom:16px}
.hv2 .sv-copy .sv-prose{margin-bottom:16px}
.hv2 .sv-collage{display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:1fr 1fr;gap:16px;aspect-ratio:5/4}
.hv2 .sv-collage img{width:100%;height:100%;object-fit:cover;border-radius:16px;box-shadow:var(--shadow);background:var(--brand-100)}
.hv2 .sv-collage .c1{grid-row:1/3}

/* ---- Numbers band ---- */
.hv2 .num-band .num-item strong{white-space:nowrap}

/* ---- Standards cards ---- */
.hv2 .sv-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.hv2 .sv-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px;transition:.3s;border-top:4px solid var(--brand)}
.hv2 .sv-card:nth-child(even){border-top-color:var(--red)}
.hv2 .sv-card:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.hv2 .sv-card .ic{width:66px;height:66px;border-radius:16px;background:var(--brand-50);display:grid;place-items:center;margin-bottom:18px;color:var(--brand);font-size:28px;padding:12px}
.hv2 .sv-card .ic img{max-height:100%;object-fit:contain}
.hv2 .sv-card h3{font-size:19px;margin-bottom:8px}
.hv2 .sv-card .sv-prose{font-size:14.5px}

/* ---- Help steps ---- */
.hv2 .sv-steps{display:grid;gap:14px;margin-top:8px}
.hv2 .sv-step{display:flex;gap:16px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px}
.hv2 .sv-step .n{flex:none;width:42px;height:42px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-family:'Manrope';font-weight:800}
.hv2 .sv-step h4{font-size:16.5px;margin-bottom:4px}
.hv2 .sv-step .sv-prose{font-size:14.5px}

/* ---- Responsive ---- */
@media (max-width:1150px){
  .hv2 .sv-layout{grid-template-columns:1fr}
  .hv2 .sv-aside{position:static;grid-template-columns:1fr 1fr}
}
@media (max-width:1150px){
  /* text would sit over the doctor: keep the photo visible but softer */
  .hv2 .sv-hero .hero-fade{background:linear-gradient(90deg,rgba(244,248,252,.96) 0%,rgba(244,248,252,.9) 50%,rgba(244,248,252,.55) 75%,rgba(244,248,252,.3) 100%)}
  .hv2 .sv-hero .hero-media{top:var(--hdr-h,76px)}
  .hv2 .sv-hero .hero-media img{object-position:85% 0%}
}
@media (max-width:900px){
  .hv2 .sv-hero{min-height:auto;padding:130px 0 60px}
  .hv2 .sv-hero .hero-fade{background:rgba(244,248,252,.88)}
  .hv2 .sv-split{grid-template-columns:1fr;gap:32px}
  .hv2 .sv-split.reverse .sv-figure{order:-1}
  .hv2 .sv-aside{grid-template-columns:1fr}
}
@media (max-width:600px){
  .hv2 .sv-hero{padding:110px 0 48px}
  .hv2 .sv-block{padding:24px 20px}
  .hv2 .sv-chips li{font-size:13px;padding:7px 12px}
  .hv2 .sv-logo{width:150px;height:80px}
  .hv2 .sv-collage{gap:10px}
  .hv2 .sv-crumbs{width:auto}
  .hv2 .hero-actions .btn{flex:1 1 100%}
}
