:root { --navy:#124b75; --blue:#0078ad; --ink:#17252a; --body:#405f6a; --pale:#f3f8fa; color-scheme:light; }
* { box-sizing:border-box; }
html { scroll-padding-top:96px; }
body { margin:0; color:var(--ink); font-family:"Segoe UI",Arial,sans-serif; font-size:1rem; line-height:1.65; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; }
a:focus-visible { outline:3px solid #ffcf57; outline-offset:5px; box-shadow:0 0 0 7px #17252a; }
.skip-link { position:fixed; z-index:10; top:12px; left:16px; padding:12px 20px; background:#fff; color:var(--navy); transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.site-header { position:absolute; inset:0 0 auto; z-index:2; color:#fff; transition:background-color 160ms ease,color 160ms ease,box-shadow 160ms ease; }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; max-width:1200px; min-height:92px; margin:auto; padding:16px 32px; }
.brand { font-size:1.4rem; font-weight:650; line-height:1.3; text-decoration:none; }
.brand span { font-weight:400; }
nav ul { display:flex; gap:28px; margin:0; padding:0; list-style:none; }
nav a { display:flex; align-items:center; min-height:44px; padding:6px 2px; border-bottom:2px solid transparent; font-weight:600; text-decoration:none; }
nav a[aria-current="page"] { border-color:#a6dcf4; color:#cbeeff; }
nav a:hover { border-color:#fff; }
.site-header.is-scrolled { position:fixed; background:#fff; color:var(--ink); box-shadow:0 2px 12px rgb(23 37 42 / 10%); }
.site-header.is-scrolled .header-inner { min-height:64px; padding-block:10px; }
.site-header.is-scrolled .brand { color:#0078ad; }
.site-header.is-scrolled .brand span { color:#405f6a; }
.site-header.is-scrolled nav a[aria-current="page"] { border-color:var(--blue); color:var(--navy); }
.site-header.is-scrolled nav a:hover { border-color:var(--navy); }
.services-hero { position:relative; display:grid; min-height:390px; place-items:center; isolation:isolate; overflow:hidden; padding:150px 24px 64px; color:#fff; text-align:center; background:var(--navy); }
.services-hero > img { position:absolute; z-index:-2; width:100%; height:100%; object-fit:cover; object-position:center 52%; }
.services-hero::before { position:absolute; z-index:-1; inset:0; content:""; background:rgb(5 24 40 / 60%); }
.hero-content { max-width:760px; }
.eyebrow { margin:0 0 12px; color:var(--navy); font-size:.92rem; font-weight:500; letter-spacing:.02em; }
.services-hero .eyebrow { color:#d2efff; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:0; font-size:clamp(2.45rem,5vw,4rem); font-weight:350; letter-spacing:-.03em; line-height:1.1; }
h2 { font-size:clamp(2rem,3.2vw,2.7rem); font-weight:300; letter-spacing:-.025em; line-height:1.2; }
.services-intro { max-width:1160px; margin:auto; padding:84px 32px 72px; }
.section-heading { max-width:690px; margin:0 auto 46px; text-align:center; }
.section-heading h2 { margin-bottom:18px; }
.section-heading > p:last-child { margin:0; color:var(--body); font-size:1.1rem; }
.services-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.service-card { display:grid; grid-template-columns:52px minmax(0,1fr); gap:20px; padding:24px; border:1px solid #dce8ed; border-radius:8px; background:#fff; box-shadow:0 7px 20px rgb(23 37 42 / 7%); }
.service-card--featured { border-color:#c1e0ed; background:#fbfeff; }
.service-icon { display:grid; width:46px; height:46px; place-items:center; border:1.5px solid #4d9bc4; border-radius:50%; color:var(--blue); }
.service-icon svg { width:25px; height:25px; fill:none; stroke:currentcolor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.service-card h3 { margin-bottom:12px; color:var(--navy); font-size:1.06rem; font-weight:650; letter-spacing:.01em; text-transform:uppercase; }
.service-card > div > p { margin-bottom:0; color:var(--body); }
.mocktp-summary { margin-top:20px; padding:18px 18px 16px; border-left:3px solid var(--blue); background:#f0f8fb; }
.mocktp-summary p { margin-bottom:8px; color:var(--ink); }
.mocktp-summary ul { margin:0 0 12px; padding-left:19px; color:var(--body); font-size:.94rem; }
.mocktp-summary li + li { margin-top:5px; }
.text-link { color:var(--navy); font-size:.93rem; font-weight:650; text-underline-offset:3px; }
.text-link:hover { color:var(--blue); }
.mocktp-feature { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:56px; align-items:center; padding:54px max(32px,calc((100% - 1096px) / 2)); background:var(--pale); }
.mocktp-feature h2 { margin-bottom:0; }
.mocktp-copy > p:last-child { max-width:62ch; margin:18px 0 0; color:var(--body); font-size:1.04rem; }
.mocktp-report { width:min(100%,340px); margin:0 auto; overflow:hidden; border-radius:8px; box-shadow:0 10px 24px rgb(23 37 42 / 14%); }
.mocktp-report img { width:100%; }
.services-cta { padding:48px 24px; background:var(--navy); color:#fff; text-align:center; }
.services-cta h2 { margin-bottom:25px; font-size:clamp(1.8rem,3vw,2.35rem); }
.button { display:inline-flex; align-items:center; justify-content:center; min-width:128px; min-height:44px; padding:8px 18px; border:2px solid var(--blue); border-radius:28px; background:var(--blue); color:#fff; font-size:.875rem; font-weight:700; letter-spacing:.07em; text-decoration:none; }
.button:hover { border-color:#005d87; background:#005d87; }
.site-footer { padding:28px 24px; color:var(--body); font-size:.875rem; text-align:center; }
.site-footer p { margin:0; }
@media (max-width:760px) { .header-inner { padding-inline:22px; gap:16px; } .brand { font-size:1.2rem; } nav ul { gap:20px; } .services-hero { min-height:350px; padding-top:146px; } .services-intro { padding:60px 20px 52px; } .services-grid { grid-template-columns:1fr; } .mocktp-feature { grid-template-columns:1fr; gap:20px; padding:48px 20px; } }
@media (max-width:560px) { .header-inner { flex-direction:column; gap:8px; padding:18px 20px 10px; } .brand { text-align:center; } nav ul { gap:28px; } .site-header.is-scrolled .header-inner { min-height:0; gap:0; padding-block:6px; } .services-hero { min-height:365px; padding:162px 20px 54px; } .services-hero > img { object-position:58% center; } .services-grid { gap:16px; } .service-card { grid-template-columns:1fr; gap:16px; padding:21px 22px; } .service-icon { width:44px; height:44px; } .mocktp-summary { padding:16px; } }
@media (prefers-reduced-motion:reduce) { .site-header { transition:none; } }