:root { --navy:#071b3d; --blue:#0a4fa7; --bright:#1675d1; --red:#e02b2f; --cream:#f5f8fc; --ink:#15243b; --muted:#56657a; --white:#fff; --line:#dfe7f1; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.6; }
a { color:inherit; }
.site-header { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:12px clamp(20px,5vw,72px); border-bottom:1px solid var(--line); background:rgba(255,255,255,.96); position:sticky; top:0; z-index:10; }
.brand { display:flex; align-items:center; gap:14px; font-weight:800; text-decoration:none; color:var(--navy); }
.brand img { width:64px; height:64px; object-fit:cover; border-radius:12px; }
.brand span { max-width:290px; line-height:1.15; }
nav { display:flex; align-items:center; gap:24px; }
nav a { text-decoration:none; font-weight:700; }
nav button { border:0; border-radius:999px; padding:10px 16px; color:var(--white); background:var(--navy); font:inherit; font-weight:800; cursor:pointer; }
.hero { min-height:620px; padding:72px clamp(20px,7vw,112px); display:grid; grid-template-columns:1.15fr .85fr; align-items:center; gap:70px; background:linear-gradient(135deg,#eef6ff 0%,#fff 55%,#fff3f3 100%); overflow:hidden; }
.eyebrow { margin:0 0 12px; color:var(--red); font-size:.88rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
h1 { max-width:760px; margin:0; color:var(--navy); font-size:clamp(3rem,7vw,6.2rem); line-height:.96; letter-spacing:-.055em; }
.intro { max-width:660px; margin:28px 0 0; color:var(--muted); font-size:clamp(1.1rem,2vw,1.35rem); }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:12px 20px; border-radius:12px; font-weight:850; text-decoration:none; transition:transform .2s, box-shadow .2s; }
.button:hover { transform:translateY(-2px); box-shadow:0 10px 24px rgba(7,27,61,.16); }
.primary { background:var(--red); color:var(--white); }
.whatsapp { background:#15803d; color:var(--white); }
.secondary { background:var(--white); color:var(--navy); border:2px solid var(--navy); }
.hero-logo { position:relative; max-width:520px; margin-inline:auto; border:10px solid var(--white); border-radius:26px; background:var(--white); box-shadow:0 30px 70px rgba(7,27,61,.24); overflow:hidden; }
.hero-logo img { display:block; width:100%; height:auto; }
.services { padding:96px clamp(20px,7vw,112px); }
.section-heading { max-width:680px; margin-bottom:40px; }
h2 { margin:0; color:var(--navy); font-size:clamp(2.25rem,4vw,4rem); line-height:1.05; letter-spacing:-.045em; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.service-grid article { min-height:300px; padding:30px; border:1px solid var(--line); border-radius:22px; background:var(--cream); display:flex; flex-direction:column; }
.service-grid article span { color:var(--red); font-weight:900; }
.service-grid h3 { margin:42px 0 8px; color:var(--navy); font-size:1.35rem; line-height:1.2; }
.service-grid p { margin:0; color:var(--muted); }
.appointment-link { width:max-content; margin-top:auto; padding:11px 16px; border:0; border-radius:10px; color:var(--white); background:var(--blue); font:inherit; font-weight:850; cursor:pointer; transition:transform .2s,box-shadow .2s; }
.appointment-link:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(7,27,61,.18); }
.appointment-link:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #ffd44d; outline-offset:3px; }
.service-grid .accent-card { color:var(--white); background:var(--navy); }
.service-grid .accent-card h3,.service-grid .accent-card p { color:var(--white); }
.medicare-note { margin:28px 0 0; padding:18px 20px; border-left:5px solid var(--blue); border-radius:8px; color:var(--ink); background:#eef6ff; font-size:.95rem; font-weight:650; }
.medicare-note p { margin:0; }
.medicare-note p + p { margin-top:12px; }
.contact { display:grid; grid-template-columns:1fr 1fr; gap:70px; padding:88px clamp(20px,7vw,112px); color:var(--white); background:var(--blue); }
.contact .eyebrow { color:#ffd44d; }
.contact h2 { color:var(--white); }
address { display:flex; flex-direction:column; gap:8px; margin-top:30px; font-style:normal; font-size:1.1rem; }
address a { text-decoration-thickness:1px; text-underline-offset:4px; }
.hours { padding:32px; border:1px solid rgba(255,255,255,.3); border-radius:22px; background:rgba(0,0,0,.12); }
.hours h3 { margin:0 0 16px; font-size:1.5rem; }
.hours dl { margin:0; }
.hours dl div { display:grid; grid-template-columns:1fr 1.3fr; gap:24px; padding:14px 0; border-top:1px solid rgba(255,255,255,.22); }
.hours dt { font-weight:800; }
.hours dd { margin:0; text-align:right; }
footer { display:flex; justify-content:space-between; gap:20px; padding:26px clamp(20px,7vw,112px); color:#ccd8ec; background:var(--navy); }
footer p { margin:0; }
dialog { width:min(620px,calc(100% - 32px)); max-height:calc(100vh - 32px); padding:34px; border:0; border-radius:24px; color:var(--ink); background:var(--white); box-shadow:0 30px 80px rgba(7,27,61,.35); overflow:auto; }
dialog::backdrop { background:rgba(7,27,61,.72); backdrop-filter:blur(3px); }
dialog h2 { font-size:clamp(2rem,5vw,3rem); }
.dialog-close { position:absolute; top:16px; right:18px; width:42px; height:42px; border:0; border-radius:50%; color:var(--navy); background:var(--cream); font-size:1.75rem; line-height:1; cursor:pointer; }
.form-intro { margin:16px 0 24px; color:var(--muted); }
.response-time { margin:-12px 0 24px; padding:10px 14px; border-radius:9px; color:var(--navy); background:#eef6ff; font-weight:800; }
#appointment-form { display:grid; gap:16px; }
#appointment-form label { display:grid; gap:6px; color:var(--navy); font-weight:800; }
#appointment-form input,#appointment-form select,#appointment-form textarea { width:100%; min-height:48px; padding:11px 13px; border:1px solid #b9c7d9; border-radius:10px; color:var(--ink); background:var(--white); font:inherit; font-weight:500; }
#appointment-form textarea { min-height:92px; resize:vertical; }
.security-notice { padding:14px 16px; border-left:4px solid var(--red); border-radius:8px; color:var(--ink); background:#fff3f3; }
.security-notice strong { color:var(--navy); }
.security-notice p { margin:4px 0 0; color:var(--muted); font-size:.93rem; line-height:1.5; }
#appointment-form .consent-row { display:grid; grid-template-columns:22px 1fr; align-items:start; gap:10px; color:var(--ink); font-size:.93rem; font-weight:600; line-height:1.45; }
#appointment-form .consent-row input { width:20px; min-height:20px; height:20px; margin:2px 0 0; accent-color:var(--blue); }
.form-submit { width:100%; border:0; cursor:pointer; font:inherit; }
@media (max-width:900px) { .brand span,nav a { display:none; } .hero { min-height:auto; grid-template-columns:1fr; gap:50px; padding-top:52px; } .hero-logo { max-width:480px; margin:auto; } .service-grid { grid-template-columns:repeat(2,1fr); } .contact { grid-template-columns:1fr; } }
@media (max-width:580px) { .site-header { min-height:74px; } .brand img { width:52px; height:52px; } nav { gap:8px; } h1 { font-size:3.2rem; } .hero { padding-block:44px 56px; } .actions { flex-direction:column; } .button { width:100%; } .service-grid { grid-template-columns:1fr; } .service-grid article { min-height:270px; } .contact { padding-block:64px; } .hours dl div { grid-template-columns:1fr; gap:2px; } .hours dd { text-align:left; } footer { flex-direction:column; } dialog { padding:28px 20px 24px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button { transition:none; } }