:root { color-scheme: light; font-family: Inter, system-ui, "Segoe UI", sans-serif; --navy:#0c2948; --ink:#17324a; --blue:#17699d; --pale:#edf6fb; --pale2:#dceef8; --card:#ffffff; --line:#a8ccdf; --muted:#536f82; --orange:#e85d18; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-height:100vh; color:var(--ink); background:#f7fbfd; line-height:1.55; }
a { color:#0b679d; }
.site-header { position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:12px max(22px,calc((100% - 1120px)/2)); border-bottom:3px solid var(--orange); background:var(--navy); box-shadow:0 2px 10px #17324a26; }
.identity { display:flex; align-items:center; gap:10px; color:white; text-decoration:none; font-weight:700; }
.identity small { margin-left:.25rem; color:#bcdcec; font-size:.78em; font-weight:500; }
.identity img { width:34px; height:34px; }
nav { display:flex; flex-wrap:wrap; gap:18px; font-size:.92rem; }
nav a { color:#d9edf8; text-decoration:none; }
nav a:hover { color:white; text-decoration:underline; }
main { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.hero { margin-top:22px; padding:56px 50px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(125deg,#fff 20%,#e1f1f9 100%); box-shadow:0 12px 35px #17324a12; }
.eyebrow { margin:0 0 8px; color:var(--blue); font-size:.82rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
h1 { max-width:920px; margin:0; color:var(--navy); font-size:clamp(2.25rem,5.6vw,4.35rem); line-height:1.06; letter-spacing:-.035em; }
.lead { max-width:850px; margin:24px 0 0; color:var(--muted); font-size:1.18rem; }
.launchers { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:34px; }
.launchers a,.guide-grid a { padding:18px 20px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--card); text-decoration:none; box-shadow:0 3px 10px #17324a0d; transition:transform .12s,box-shadow .12s,border-color .12s; }
.launchers a.primary { color:white; background:var(--blue); border-color:var(--blue); }
.launchers a.primary span { color:#e6f5fd; }
.launchers a:hover,.launchers a:focus-visible,.guide-grid a:hover,.guide-grid a:focus-visible { border-color:var(--blue); box-shadow:0 7px 18px #17324a1f; transform:translateY(-2px); outline:2px solid var(--orange); outline-offset:2px; }
.launchers strong,.launchers span,.guide-grid strong,.guide-grid span { display:block; }
.launchers strong { font-size:1.08rem; }
.launchers span,.guide-grid span { margin-top:4px; color:var(--muted); font-size:.9rem; }
.section { margin-top:32px; padding:48px 38px; border:1px solid #cadee9; border-radius:14px; background:white; }
.section:nth-of-type(even) { background:var(--pale); }
.section-heading { max-width:800px; margin-bottom:25px; }
h2 { margin:0; color:var(--navy); font-size:clamp(1.7rem,3.5vw,2.55rem); line-height:1.18; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:0; padding:0; list-style:none; }
.steps li { display:flex; gap:12px; padding:18px; border:1px solid var(--line); border-radius:8px; background:white; }
.steps b { display:grid; place-items:center; flex:0 0 30px; height:30px; border-radius:50%; color:white; background:var(--orange); }
.steps strong,.steps span { display:block; }
.steps span { margin-top:5px; color:var(--muted); font-size:.9rem; }
.cases { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.cases article { padding:23px; border:1px solid var(--line); border-radius:9px; background:white; box-shadow:0 3px 12px #17324a0b; }
.cases h3 { margin:0 0 9px; color:var(--navy); font-size:1.2rem; }
.cases p { margin:0 0 12px; color:var(--muted); }
.cases .outcome { margin:0; color:var(--ink); }
.guide-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.guide-grid strong { color:var(--navy); font-size:1.15rem; }
footer { display:flex; justify-content:space-between; gap:20px; width:min(1120px,calc(100% - 40px)); margin:34px auto 0; padding:24px 0 34px; border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; }
.guide-page { background:var(--pale); }
.guide-page main { width:min(900px,calc(100% - 40px)); margin-top:22px; padding:0 40px 42px; border:1px solid #cadee9; border-radius:14px; background:white; box-shadow:0 8px 28px #17324a10; }
.guide-hero { padding:48px 0 32px; }
.guide-hero h1 { font-size:clamp(2.1rem,5vw,3.6rem); }
.guide-hero .lead { font-size:1.08rem; }
.guide-section { padding:30px 0; border-top:1px solid #cadee9; }
.guide-section h2 { margin-bottom:12px; font-size:1.55rem; }
.guide-section h3 { margin:24px 0 8px; color:var(--navy); }
.guide-section p,.guide-section li { color:#425f72; }
.guide-section li { margin:7px 0; }
.callout { padding:16px 18px; border-left:4px solid var(--orange); border-radius:0 7px 7px 0; background:var(--pale2); color:#36576d; }
.guide-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:25px; }
.guide-actions a { padding:10px 15px; border-radius:6px; background:var(--blue); color:white; text-decoration:none; }
@media(max-width:850px){.steps{grid-template-columns:repeat(2,1fr)}.launchers,.guide-grid{grid-template-columns:1fr}.site-header{align-items:flex-start}nav{justify-content:flex-end}.hero{padding:44px 32px}.section{padding:40px 28px}}
@media(max-width:620px){main{width:min(100% - 28px,1120px)}.site-header{position:static;display:block}.site-header nav{margin-top:10px;justify-content:flex-start}.hero{margin-top:14px;padding:36px 22px}.cases,.steps{grid-template-columns:1fr}.section{padding:34px 20px}.guide-page main{width:calc(100% - 28px);padding:0 20px 30px}footer{width:calc(100% - 28px)}}