:root { --ink:#12304a; --muted:#60758a; --blue:#0862ae; --teal:#08a991; --orange:#f78a39; --paper:#f7fbfd; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; }
.page-shell { min-height:100svh; position:relative; overflow:hidden; padding:32px clamp(24px,6vw,92px) 24px; display:grid; grid-template-rows:auto 1fr auto; isolation:isolate; background:radial-gradient(circle at 78% 30%,rgba(8,169,145,.11),transparent 28%),linear-gradient(135deg,#fff 0%,#f5fbfd 52%,#eef9f8 100%); }
.page-shell::before { content:""; position:absolute; z-index:-1; inset:0; opacity:.22; background-image:linear-gradient(rgba(8,98,174,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(8,98,174,.08) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(to bottom right,transparent 10%,black 80%); }
.ambient { position:absolute; z-index:-1; border-radius:999px; filter:blur(3px); }
.ambient-one { width:380px; height:380px; right:-190px; top:-180px; border:70px solid rgba(8,169,145,.08); }
.ambient-two { width:240px; height:240px; left:-140px; bottom:-120px; border:48px solid rgba(8,98,174,.06); }
.site-header { width:100%; max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:center; text-align:center; }
.brand { display:inline-flex; justify-content:center; }
.brand img { width:clamp(190px,22vw,290px); height:auto; display:block; }
.hero { width:100%; max-width:1400px; margin:auto; padding:clamp(48px,8vh,110px) 0; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(330px,.65fr); gap:clamp(54px,9vw,140px); align-items:center; }
.hero-copy { max-width:750px; }
h1 { margin:0; max-width:760px; font-size:clamp(52px,6.3vw,98px); line-height:.97; letter-spacing:-.055em; font-weight:700; }
h1 em { font-style:normal; font-weight:700; color:transparent; background:linear-gradient(100deg,var(--blue),var(--teal)); background-clip:text; -webkit-background-clip:text; }
.intro { margin:32px 0 36px; max-width:610px; color:var(--muted); font-size:clamp(18px,1.5vw,22px); line-height:1.65; }
.linkedin-link { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:14px 22px; border:1px solid rgba(8,98,174,.22); border-radius:14px; color:var(--blue); background:rgba(255,255,255,.76); box-shadow:0 12px 32px rgba(28,85,116,.08); font-size:15px; font-weight:700; text-decoration:none; transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease; }
.linkedin-icon { width:20px; height:20px; flex:0 0 20px; fill:currentColor; }
.linkedin-link:hover { transform:translateY(-2px); background:#fff; box-shadow:0 16px 34px rgba(28,85,116,.14); }
.emergency-card { position:relative; overflow:hidden; padding:clamp(30px,4vw,52px); border-radius:36px; color:#fff; background:linear-gradient(145deg,#07589c,#0785a7 62%,#06a58f); box-shadow:0 34px 80px rgba(5,93,142,.22); }
.emergency-card::after { content:""; position:absolute; width:190px; height:190px; border:34px solid rgba(255,255,255,.08); border-radius:50%; right:-72px; bottom:-84px; }
.card-number { position:absolute; right:28px; top:15px; font-size:84px; font-weight:800; letter-spacing:-.08em; color:rgba(255,255,255,.07); }
.card-kicker { position:relative; margin:0 0 18px; color:#b9f0e8; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.emergency-card h2 { position:relative; margin:0 0 18px; max-width:360px; font-size:clamp(30px,3vw,43px); line-height:1.08; letter-spacing:-.035em; }
.emergency-card>p:not(.card-kicker) { position:relative; margin:0 0 28px; color:rgba(255,255,255,.82); line-height:1.65; font-size:16px; }
.call-button { position:relative; z-index:1; display:flex; justify-content:space-between; align-items:center; gap:22px; padding:16px 18px; border-radius:14px; background:white; color:#075a95; text-decoration:none; font-weight:700; transition:.2s ease; }
.call-button:hover { transform:translateY(-2px); box-shadow:0 12px 25px rgba(0,0,0,.16); }
.call-button span { font-size:22px; color:var(--orange); }
.emergency-card small { position:relative; z-index:1; display:block; margin-top:16px; color:rgba(255,255,255,.68); font-size:12px; line-height:1.5; }
footer { width:100%; max-width:1400px; margin:0 auto; padding-top:22px; border-top:1px solid rgba(18,48,74,.1); display:flex; justify-content:space-between; gap:24px; color:#6b8091; font-size:12px; }
footer p { margin:0; }
@media (max-width:860px) { .page-shell{padding:24px 20px 20px}.hero{grid-template-columns:1fr;gap:46px;padding:64px 0 54px}.hero-copy{text-align:center;margin:0 auto}.intro{margin-left:auto;margin-right:auto}.emergency-card{max-width:580px;margin:0 auto} }
@media (max-width:520px) { h1{font-size:clamp(48px,14vw,66px)}.intro{font-size:17px}.hero{padding-top:52px}.emergency-card{border-radius:26px}footer{flex-direction:column;gap:6px;text-align:center} }
:focus-visible { outline:3px solid var(--orange); outline-offset:4px; }
