/* Services: the Household Money Check-Up and the Money Guides.
   One bold element: the report sheet in the hero. Everything else stays quiet. */
.sv-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;padding-top:28px;padding-bottom:96px}
.sv-hero h1{font-family:var(--display);font-weight:400;font-size:clamp(2.5rem,5.2vw,4.1rem);line-height:1.04;letter-spacing:-.01em;margin:0 0 22px;max-width:15ch}
.sv-hero .lede{margin:0 0 30px}
.sv-price-line{color:var(--mist);font-size:.95rem;margin:20px 0 0}
.sv-price-line b{color:var(--brass-2);font-weight:600}

/* the report sheet */
.sv-report{margin:0;position:relative}
.sheet::before{content:"";position:absolute;inset:14px -12px -14px 12px;background:#DCE2DA;border-radius:6px;opacity:.45;z-index:-1}
.sheet{position:relative;background:var(--card);color:var(--ink);border-radius:6px;padding:30px 32px 28px;box-shadow:0 30px 60px -28px rgba(0,0,0,.6);border-top:5px solid var(--brass)}
.sheet header{display:flex;justify-content:space-between;gap:12px;font-size:.78rem;color:var(--ink-2);padding-bottom:14px;border-bottom:1px solid #D4DBD2}
.sheet header span:first-child{font-family:var(--display);font-size:.95rem;color:var(--ink)}
.sheet h2{font-family:var(--display);font-weight:400;font-size:1.9rem;margin:20px 0 2px;color:var(--ink)}
.sheet .for{margin:0 0 20px;color:var(--ink-2);font-size:.9rem}
.figs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 22px}
.figs div{background:#fff;border:1px solid #DDE3DB;border-radius:4px;padding:12px 12px 10px}
.figs dt{font-size:.74rem;color:var(--ink-2);line-height:1.3}
.figs dd{margin:6px 0 0;font-family:var(--body);font-weight:600;font-size:1.35rem;color:var(--ink);font-variant-numeric:tabular-nums}
.grades{width:100%;border-collapse:collapse;font-size:.92rem;margin-bottom:18px}
.grades th{text-align:left;font-weight:500;padding:9px 0;border-bottom:1px solid #DDE3DB}
.grades td{text-align:right;border-bottom:1px solid #DDE3DB}
.g{display:inline-block;font-size:.78rem;font-weight:600;padding:3px 10px;border-radius:999px}
.g-strong{background:#DCEBE1;color:#1D4A33}.g-steady{background:#F3E7CF;color:#6A4B12}.g-attn{background:#F2DADD;color:#7A1F2B}
.prio{margin:0;background:#fff;border-left:3px solid var(--brass);padding:12px 14px;font-size:.92rem;line-height:1.5}
.prio b{display:block;font-size:.78rem;color:var(--ink-2);font-weight:600;margin-bottom:2px}
.sv-report figcaption{position:relative;margin-top:26px;font-size:.85rem;color:var(--mist);text-align:center}

/* sections */
.sv-sec{padding-block:84px;border-top:1px solid var(--rule)}
.sv-sec>h2,.sv-split h2{font-family:var(--display);font-weight:400;font-size:clamp(1.9rem,3.4vw,2.6rem);line-height:1.1;margin:0 0 14px}
.sv-intro{color:var(--mist);max-width:60ch;margin:0 0 40px}
.sv-split{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
.sv-fit{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.sv-fit li{padding:16px 0;border-bottom:1px solid var(--rule)}
.sv-note{color:var(--mist);margin:26px 0 0;font-size:.95rem}

/* the process: a real sequence, so it is numbered */
.sv-steps{list-style:none;margin:0;padding:0;counter-reset:s}
.sv-steps li{counter-increment:s;display:grid;grid-template-columns:72px 1fr auto;gap:8px 24px;padding:26px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.sv-steps li::before{content:counter(s);font-family:var(--display);font-size:2.2rem;color:var(--brass);line-height:1}
.sv-steps h3{margin:0 0 6px;font-family:var(--body);font-size:1.15rem;font-weight:600}
.sv-steps li:last-child{border-bottom:0}
.sv-steps p{margin:0;color:var(--mist);max-width:62ch}
.sv-steps .t{font-size:.88rem;color:var(--mist);white-space:nowrap}

.sv-parts{margin:0;display:grid;gap:0}
.sv-parts div{display:grid;grid-template-columns:220px 1fr;gap:24px;padding:16px 0;border-bottom:1px solid var(--rule)}
.sv-parts dt{font-weight:600}
.sv-parts dd{margin:0;color:var(--mist)}

/* the offer */
.sv-offer{background:var(--felt-2);border:1px solid var(--rule);border-radius:var(--r-md);padding:44px;display:grid;grid-template-columns:1fr 1fr;gap:48px}
.sv-offer h3{font-family:var(--display);font-weight:400;font-size:1.7rem;margin:0 0 18px}
.sv-amt{font-family:var(--display);font-size:3.6rem;line-height:1;color:var(--chalk);margin:0}
.sv-amt small{font-family:var(--body);font-size:1rem;color:var(--mist);margin-left:10px}
.sv-was{color:var(--mist);margin:12px 0 28px;font-size:.95rem}
.sv-offer .btn{width:100%}
.sv-promise{margin:22px 0 0;padding-top:20px;border-top:1px solid var(--rule);color:var(--chalk);font-size:.97rem}
.sv-offer .assure{margin-top:0;color:var(--chalk);font-size:1rem;gap:12px}
.sv-small{font-size:.88rem;color:var(--mist);margin-top:18px}

.sv-bounds{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.sv-bounds h3{font-family:var(--body);font-weight:600;font-size:1.1rem;margin:0 0 10px}
.sv-bounds ul{margin:0;padding-left:1.1em;color:var(--mist)}
.sv-bounds li{padding:5px 0}

.sv-guides{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.sv-guides a{display:block;text-decoration:none;padding:24px 0 0;border-top:2px solid var(--brass)}
.sv-guides h3{font-family:var(--display);font-weight:400;font-size:1.35rem;margin:0 0 8px;line-height:1.2}
.sv-guides p{margin:0;color:var(--mist);font-size:.95rem}
.sv-guides a:hover h3{color:var(--brass-2)}

.sv-final{text-align:center;padding-block:96px;border-top:1px solid var(--rule)}
.sv-final h2{font-family:var(--display);font-weight:400;font-size:clamp(2rem,4vw,3rem);margin:0 auto 16px;max-width:20ch}
.sv-final p{color:var(--mist);margin:0 auto 30px;max-width:52ch}
.sv-final .cta{justify-content:center}

/* guides (articles) */
.guide{max-width:700px;padding-block:10px 90px}
.guide h1{font-family:var(--display);font-weight:400;font-size:clamp(2.2rem,4.5vw,3.3rem);line-height:1.08;margin:0 0 18px}
.guide h2{font-family:var(--display);font-weight:400;font-size:1.6rem;margin:46px 0 12px}
.guide p,.guide li{color:#D9E0D8;line-height:1.72}
.guide .meta{color:var(--mist);font-size:.9rem;margin:0 0 34px}
.guide .ex{background:var(--felt-2);border:1px solid var(--rule);border-radius:var(--r-md);padding:22px 24px;margin:26px 0}
.guide .ex table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.guide .ex th,.guide .ex td{text-align:left;padding:8px 10px 8px 0;border-bottom:1px solid var(--rule);font-size:.95rem}
.guide .ex th{color:var(--mist);font-weight:500}
.guide .take{border-left:3px solid var(--brass);padding:4px 0 4px 20px;margin:30px 0;font-size:1.1rem;color:var(--chalk)}
.guide .edu{margin-top:48px;padding-top:20px;border-top:1px solid var(--rule);font-size:.88rem;color:var(--mist)}
.guide-next{margin-top:40px;background:var(--felt-2);border:1px solid var(--rule);border-radius:var(--r-md);padding:28px}
.guide-next h2{margin-top:0}

@media (max-width:900px){
 .sv-hero,.sv-split,.sv-offer,.sv-bounds{grid-template-columns:1fr;gap:40px}
 .sv-hero{padding-bottom:64px}
 .sv-guides{grid-template-columns:1fr}
 .sv-offer{padding:28px 22px}
}
@media (max-width:600px){
 .sv-fit{grid-template-columns:1fr}
 .sv-steps li{grid-template-columns:48px 1fr}
 .sv-steps .t{grid-column:2}
 .sv-parts div{grid-template-columns:1fr;gap:4px}
 .sheet{padding:22px 18px}
 .figs{grid-template-columns:1fr 1fr 1fr;gap:6px}
 .figs dd{font-size:1.1rem}
 .sheet::before{display:none}
}