/* ============================================================
   Vita Med — Main Stylesheet
   tokens.css-dən sonra yüklənir. Mobil-öncəlikli.
   ============================================================ */

/* ── Reset / Base ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
body {
    font-family: var(--font-body);
    font-size: var(--fs-base);
    line-height: var(--lh-base);
    color: var(--color-text);
    background: var(--color-bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
a { color: var(--color-brand); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, select, textarea { font: inherit; color: inherit; }
ul, ol { padding: 0; list-style: none; }

h1, h2, h3, h4 { font-family: var(--font-display); color: var(--color-heading); line-height: var(--lh-tight); font-weight: var(--fw-semi); font-optical-sizing: auto; }
h1 { font-size: var(--fs-4xl); letter-spacing: -.02em; }
h2 { font-size: var(--fs-3xl); letter-spacing: -.015em; }
h3 { font-size: var(--fs-xl); }
h4 { font-size: var(--fs-md); font-weight: var(--fw-bold); }
p { line-height: var(--lh-base); }

/* ── Accessibility ────────────────────────────────────────── */
.skip-link {
    position: absolute; left: var(--sp-4); top: -60px; z-index: var(--z-top);
    background: var(--color-brand); color: #fff; padding: var(--sp-3) var(--sp-5);
    border-radius: var(--r-md); transition: top var(--t-fast); font-weight: var(--fw-semi);
}
.skip-link:focus { top: var(--sp-4); text-decoration: none; }
:focus-visible { outline: 3px solid var(--c-primary-400); outline-offset: 2px; border-radius: 4px; }
.visually-hidden {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ── Layout ───────────────────────────────────────────────── */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--sp-5); }
.container-narrow { max-width: var(--container-narrow); }
.section { padding-block: clamp(3rem, 7vw, var(--sp-24)); }
.section--subtle { background: var(--color-bg-subtle); }
.section--muted { background: var(--color-bg-muted); }
.section--ink { background: var(--c-secondary-900); color: var(--c-secondary-100); }
.section--ink h2, .section--ink h3 { color: #fff; }
.stack > * + * { margin-top: var(--sp-4); }

.section-head { max-width: 680px; margin-bottom: var(--sp-10); }
.section-head.center { margin-inline: auto; text-align: center; }
.eyebrow {
    display: inline-flex; align-items: center; gap: var(--sp-2);
    font-family: var(--font-body); font-size: var(--fs-sm); font-weight: var(--fw-bold);
    letter-spacing: .08em; text-transform: uppercase; color: var(--color-brand);
    margin-bottom: var(--sp-3);
}
.section-head p { color: var(--color-text-soft); font-size: var(--fs-md); margin-top: var(--sp-3); }

/* ── Buttons ──────────────────────────────────────────────── */
.btn {
    --btn-bg: var(--color-brand); --btn-fg: #fff; --btn-bd: transparent;
    display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
    font-family: var(--font-body); font-weight: var(--fw-semi); font-size: var(--fs-base);
    line-height: 1; text-align: center; white-space: nowrap; cursor: pointer;
    padding: 0.85em 1.5em; border-radius: var(--r-full); border: 1.5px solid var(--btn-bd);
    background: var(--btn-bg); color: var(--btn-fg); transition: transform var(--t-fast), box-shadow var(--t-base), background var(--t-base);
    text-decoration: none;
}
.btn:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--sh-brand); }
.btn:active { transform: translateY(0); }
.btn svg { width: 1.15em; height: 1.15em; }
.btn--secondary { --btn-bg: var(--c-accent-500); box-shadow: 0 10px 24px rgba(241,90,57,.22); }
.btn--secondary:hover { box-shadow: 0 14px 30px rgba(241,90,57,.3); }
.btn--outline { --btn-bg: transparent; --btn-fg: var(--color-brand); --btn-bd: var(--c-primary-300); }
.btn--outline:hover { --btn-bg: var(--color-brand); --btn-fg: #fff; }
.btn--ghost { --btn-bg: transparent; --btn-fg: var(--color-heading); --btn-bd: transparent; }
.btn--ghost:hover { --btn-bg: var(--c-neutral-100); box-shadow: none; }
.btn--white { --btn-bg:#fff; --btn-fg: var(--color-brand); }
.btn--danger { --btn-bg: var(--c-error-500); }
.btn--sm { padding: 0.6em 1.1em; font-size: var(--fs-sm); }
.btn--lg { padding: 1em 1.8em; font-size: var(--fs-md); }
.btn--block { display: flex; width: 100%; }
.btn[aria-disabled="true"], .btn:disabled { opacity: .55; pointer-events: none; }
.btn.is-loading { color: transparent; position: relative; pointer-events: none; }
.btn.is-loading::after {
    content: ""; position: absolute; width: 1.1em; height: 1.1em; border-radius: 50%;
    border: 2px solid currentColor; border-top-color: transparent; animation: spin .7s linear infinite;
    color: var(--btn-fg);
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Badges / Tags / Pills ───────────────────────────────── */
.badge { display: inline-flex; align-items: center; gap: var(--sp-2); font-size: var(--fs-xs);
    font-weight: var(--fw-bold); padding: .35em .8em; border-radius: var(--r-full);
    background: var(--c-primary-50); color: var(--c-primary-700); letter-spacing: .02em; }
.badge--accent { background: var(--c-accent-50); color: var(--c-accent-700); }
.badge--neutral { background: var(--c-neutral-100); color: var(--c-neutral-600); }
.tag { display:inline-block; font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--color-text-soft);
    background: var(--c-neutral-100); padding: .3em .7em; border-radius: var(--r-sm); }

/* ── Cards ────────────────────────────────────────────────── */
.card {
    background: var(--color-surface); border: 1px solid var(--color-border);
    border-radius: var(--r-lg); padding: var(--sp-6); transition: transform var(--t-base), box-shadow var(--t-base), border-color var(--t-base);
    height: 100%;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); border-color: var(--c-primary-200); }
.card__icon {
    width: 52px; height: 52px; display: grid; place-items: center; border-radius: var(--r-md);
    background: var(--c-primary-50); color: var(--color-brand); margin-bottom: var(--sp-4);
}
.card__icon svg { width: 26px; height: 26px; }
.card h3 { font-family: var(--font-body); font-size: var(--fs-md); font-weight: var(--fw-bold); color: var(--color-heading); margin-bottom: var(--sp-2); }
.card p { color: var(--color-text-soft); font-size: var(--fs-sm); }
.card__link { display:inline-flex; align-items:center; gap: var(--sp-2); margin-top: var(--sp-4); font-weight: var(--fw-semi); font-size: var(--fs-sm); }
.card__link svg { width: 1em; height: 1em; transition: transform var(--t-fast); }
.card:hover .card__link svg { transform: translateX(3px); }

/* ── Grid helpers ─────────────────────────────────────────── */
.grid { display: grid; gap: var(--sp-6); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1024px) { .grid-4 { grid-template-columns: repeat(2, 1fr); } .grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

/* ── Hero ─────────────────────────────────────────────────── */
.hero { position: relative; padding-block: clamp(2.5rem, 6vw, 5rem) clamp(3rem, 7vw, 6rem); overflow: clip;
    background:
        radial-gradient(70% 90% at 85% 0%, var(--c-primary-50) 0%, transparent 60%),
        radial-gradient(60% 80% at 0% 100%, var(--c-accent-50) 0%, transparent 55%),
        var(--color-bg);
}
.hero__grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: var(--sp-12); align-items: center; }
.hero h1 { margin-bottom: var(--sp-5); }
.hero__lead { font-size: var(--fs-md); color: var(--color-text-soft); max-width: 56ch; margin-bottom: var(--sp-8); }
.hero__cta { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.hero__media { position: relative; border-radius: var(--r-2xl); overflow: hidden; box-shadow: var(--sh-lg); aspect-ratio: 4/5; background: var(--c-primary-100); }
.hero__media img { width:100%; height:100%; object-fit: cover; }
.trust-row { display: flex; flex-wrap: wrap; gap: var(--sp-5); margin-top: var(--sp-10); align-items: center; }
.trust-row__item { display:flex; align-items:center; gap: var(--sp-2); font-size: var(--fs-sm); color: var(--color-text-soft); font-weight: var(--fw-med); }
.trust-row__item svg { width: 1.25rem; height: 1.25rem; color: var(--color-brand); flex: none; }
@media (max-width: 880px) { .hero__grid { grid-template-columns: 1fr; } .hero__media { aspect-ratio: 16/11; order: -1; } }

/* ── Stats ────────────────────────────────────────────────── */
.stat { text-align: center; padding: var(--sp-4); }
.stat__num { font-family: var(--font-display); font-size: var(--fs-4xl); font-weight: var(--fw-bold); color: var(--color-brand); line-height: 1; }
.stat__label { color: var(--color-text-soft); font-size: var(--fs-sm); margin-top: var(--sp-2); font-weight: var(--fw-med); }

/* ── Doctor card ──────────────────────────────────────────── */
.doc-card { position: relative; background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); overflow:hidden; transition: transform var(--t-base), box-shadow var(--t-base); height:100%; display:flex; flex-direction:column; }
.doc-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.doc-card__photo { aspect-ratio: 1/1; background: linear-gradient(135deg, var(--c-primary-100), var(--c-secondary-100)); display:grid; place-items:center; color: var(--c-primary-600); }
.doc-card__photo svg { width: 38%; height: 38%; opacity: .55; }
.doc-card__body { padding: var(--sp-5); display:flex; flex-direction:column; gap: var(--sp-1); flex:1; }
.doc-card__name { font-family: var(--font-body); font-weight: var(--fw-bold); font-size: var(--fs-md); color: var(--color-heading); }
.doc-card__spec { color: var(--color-brand); font-size: var(--fs-sm); font-weight: var(--fw-semi); }
.doc-card__from { color: var(--color-text-faint); font-size: var(--fs-xs); margin-top: auto; padding-top: var(--sp-3); display:flex; align-items:center; gap:6px; }
.doc-card__cta { margin-top: var(--sp-3); }

/* ── Filter tabs ──────────────────────────────────────────── */
.filters { display:flex; flex-wrap:wrap; gap: var(--sp-2); margin-bottom: var(--sp-8); }
.filter-tab { border:1.5px solid var(--color-border); background:#fff; color: var(--color-text-soft);
    padding: .55em 1.1em; border-radius: var(--r-full); font-size: var(--fs-sm); font-weight: var(--fw-semi); cursor:pointer; transition: all var(--t-fast); }
.filter-tab:hover { border-color: var(--c-primary-300); color: var(--color-brand); }
.filter-tab.is-active { background: var(--color-brand); border-color: var(--color-brand); color:#fff; }

/* ── Accordion ────────────────────────────────────────────── */
.accordion__item { border:1px solid var(--color-border); border-radius: var(--r-md); margin-bottom: var(--sp-3); background:#fff; overflow:hidden; }
.accordion__btn { width:100%; text-align:left; background:none; border:0; padding: var(--sp-5); display:flex; justify-content:space-between; align-items:center; gap: var(--sp-4); cursor:pointer; font-weight: var(--fw-bold); color: var(--color-heading); font-size: var(--fs-md); }
.accordion__btn:hover { color: var(--color-brand); }
.accordion__icon { flex:none; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background: var(--c-primary-50); color: var(--color-brand); transition: transform var(--t-base); }
.accordion__btn[aria-expanded="true"] .accordion__icon { transform: rotate(45deg); }
.accordion__panel { max-height:0; overflow:hidden; transition: max-height var(--t-base) ease; }
.accordion__panel-inner { padding: 0 var(--sp-5) var(--sp-5); color: var(--color-text-soft); }

/* ── Breadcrumb ───────────────────────────────────────────── */
.breadcrumb { padding-block: var(--sp-4); font-size: var(--fs-sm); }
.breadcrumb ol { display:flex; flex-wrap:wrap; gap: var(--sp-2); align-items:center; color: var(--color-text-faint); }
.breadcrumb li { display:flex; align-items:center; gap: var(--sp-2); }
.breadcrumb li + li::before { content:"›"; color: var(--c-neutral-300); }
.breadcrumb a { color: var(--color-text-soft); }
.breadcrumb [aria-current="page"] { color: var(--color-heading); font-weight: var(--fw-semi); }

/* ── Page hero (inner) ────────────────────────────────────── */
.page-hero { background: linear-gradient(180deg, var(--c-primary-50), var(--color-bg)); padding-block: var(--sp-10) var(--sp-12); }
.page-hero h1 { margin-bottom: var(--sp-3); }
.page-hero p { color: var(--color-text-soft); font-size: var(--fs-md); max-width: 65ch; }

/* ── Prose (article/legal) ────────────────────────────────── */
.prose { max-width: 72ch; }
.prose > * + * { margin-top: var(--sp-5); }
.prose h2 { font-size: var(--fs-2xl); margin-top: var(--sp-10); }
.prose h3 { font-size: var(--fs-lg); margin-top: var(--sp-8); }
.prose p, .prose li { color: var(--color-text); line-height: var(--lh-base); }
.prose ul { padding-left: 1.2em; list-style: disc; }
.prose ul li { margin-top: var(--sp-2); }
.prose a { text-decoration: underline; }

/* ── Key facts box (LLMO) ─────────────────────────────────── */
.keyfacts { background: var(--c-primary-50); border:1px solid var(--c-primary-100); border-radius: var(--r-lg); padding: var(--sp-6); }
.keyfacts h3 { font-family: var(--font-body); font-size: var(--fs-sm); text-transform: uppercase; letter-spacing:.08em; color: var(--c-primary-700); margin-bottom: var(--sp-4); }
.keyfacts dl { display:grid; grid-template-columns: auto 1fr; gap: var(--sp-2) var(--sp-4); font-size: var(--fs-sm); }
.keyfacts dt { font-weight: var(--fw-bold); color: var(--color-heading); }
.keyfacts dd { color: var(--color-text-soft); }

/* ── Note / Alert ─────────────────────────────────────────── */
.note { display:flex; gap: var(--sp-3); padding: var(--sp-4) var(--sp-5); border-radius: var(--r-md); font-size: var(--fs-sm); border:1px solid; }
.note svg { width:1.25rem; height:1.25rem; flex:none; margin-top:2px; }
.note--info { background: var(--c-secondary-50); border-color: var(--c-secondary-200); color: var(--c-secondary-800); }
.note--warn { background: var(--c-warning-50); border-color: #fde68a; color: var(--c-warning-700); }
.note--med  { background: var(--c-primary-50); border-color: var(--c-primary-200); color: var(--c-primary-800); }

/* ── List with check ──────────────────────────────────────── */
.checklist li { display:flex; gap: var(--sp-3); align-items:flex-start; margin-top: var(--sp-3); }
.checklist svg { width: 1.3rem; height: 1.3rem; color: var(--color-brand); flex:none; margin-top: 2px; }

/* ── Utilities ────────────────────────────────────────────── */
.text-center { text-align:center; } .mx-auto { margin-inline:auto; }
.mt-0{margin-top:0}.mt-4{margin-top:var(--sp-4)}.mt-6{margin-top:var(--sp-6)}.mt-8{margin-top:var(--sp-8)}.mt-10{margin-top:var(--sp-10)}
.cluster { display:flex; flex-wrap:wrap; gap: var(--sp-3); align-items:center; }
.divider { height:1px; background: var(--color-border); border:0; margin-block: var(--sp-8); }

/* ============================================================
   CHROME: header, nav, mega, drawer, footer, floats
   ============================================================ */
.icon { width: 1.25rem; height: 1.25rem; display:inline-block; vertical-align: middle; flex:none; }

/* ── Header ───────────────────────────────────────────────── */
.site-header { position: sticky; top: 0; z-index: var(--z-header); background: transparent; transition: background var(--t-base), box-shadow var(--t-base); }
.site-header.is-stuck { background: rgba(255,255,255,.92); backdrop-filter: blur(10px); box-shadow: var(--sh-sm); }
.topbar { background: var(--c-secondary-900); color: var(--c-secondary-100); font-size: var(--fs-xs); }
.topbar__inner { display:flex; align-items:center; gap: var(--sp-4); height: 38px; }
.topbar__item { display:inline-flex; align-items:center; gap: 6px; color: var(--c-secondary-100); }
.topbar__item .icon { width: 14px; height: 14px; color: var(--c-primary-300); }
a.topbar__item:hover { color:#fff; text-decoration:none; }
.topbar__slogan { margin-left:auto; font-style: italic; color: var(--c-primary-300); }
.topbar__sep { width:1px; height:14px; background: rgba(255,255,255,.2); }
.header__inner { display:flex; align-items:center; gap: var(--sp-6); height: var(--header-h); }

.brand { display:flex; align-items:center; gap: var(--sp-3); text-decoration:none; }
.brand:hover { text-decoration:none; }
.brand__mark { width: 40px; height: 40px; border-radius: 12px; display:grid; place-items:center; background: linear-gradient(135deg, var(--c-primary-500), var(--c-primary-700)); color:#fff; box-shadow: var(--sh-brand); }
.brand__mark .icon { width: 22px; height: 22px; fill: rgba(255,255,255,.25); }
.brand__text { display:flex; flex-direction:column; line-height: 1.05; }
.brand__name { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: 1.28rem; color: var(--color-heading); letter-spacing: -.01em; }
.brand__sub { font-size: .66rem; letter-spacing: .22em; text-transform: uppercase; color: var(--color-text-faint); font-weight: var(--fw-semi); }
.brand--light .brand__name { color:#fff; } .brand--light .brand__sub { color: var(--c-secondary-300); }

.nav { margin-inline: auto; }
.nav__list { display:flex; align-items:center; gap: var(--sp-1); }
.nav__item { position: relative; }
.nav__link { display:inline-flex; align-items:center; gap: 4px; padding: .6em .85em; border-radius: var(--r-md); font-weight: var(--fw-semi); font-size: var(--fs-sm); color: var(--color-text); transition: color var(--t-fast), background var(--t-fast); }
.nav__link:hover { color: var(--color-brand); background: var(--c-primary-50); text-decoration:none; }
.nav__link.is-active { color: var(--color-brand); }
.nav__caret { width: 15px; height: 15px; transition: transform var(--t-fast); }
.nav__item.has-mega:hover .nav__caret { transform: rotate(180deg); }

.mega { position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%) translateY(8px); width: min(760px, 86vw); background:#fff; border:1px solid var(--color-border); border-radius: var(--r-xl); box-shadow: var(--sh-lg); padding: var(--sp-5); opacity:0; visibility:hidden; transition: all var(--t-base); z-index: var(--z-dropdown); }
.nav__item.has-mega:hover .mega, .nav__item.has-mega:focus-within .mega { opacity:1; visibility:visible; transform: translateX(-50%) translateY(0); }
.mega::before { content:""; position:absolute; top:-9px; left:50%; transform: translateX(-50%) rotate(45deg); width:16px; height:16px; background:#fff; border-left:1px solid var(--color-border); border-top:1px solid var(--color-border); }
.mega__grid { display:grid; grid-template-columns: repeat(2,1fr); gap: 4px; }
.mega__item { display:flex; align-items:center; gap: var(--sp-3); padding: var(--sp-3); border-radius: var(--r-md); transition: background var(--t-fast); }
.mega__item:hover { background: var(--c-primary-50); text-decoration:none; }
.mega__icon { width: 38px; height: 38px; border-radius: 10px; display:grid; place-items:center; background: var(--c-primary-50); color: var(--color-brand); flex:none; }
.mega__icon .icon { width: 20px; height: 20px; }
.mega__title { font-weight: var(--fw-semi); font-size: var(--fs-sm); color: var(--color-heading); }
.mega__foot { margin-top: var(--sp-3); padding-top: var(--sp-3); border-top:1px solid var(--color-border); }
.mega__all { display:inline-flex; align-items:center; gap:6px; font-weight: var(--fw-semi); font-size: var(--fs-sm); }
.mega__all .icon { width: 16px; height:16px; }

.header__actions { display:flex; align-items:center; gap: var(--sp-3); margin-left: var(--sp-2); }
.header__cta .icon { width: 16px; height:16px; }
.nav-toggle { display:none; width: 46px; height:46px; border:1px solid var(--color-border); background:#fff; border-radius: var(--r-md); place-items:center; cursor:pointer; color: var(--color-heading); }
.nav-toggle:hover { color: var(--color-brand); border-color: var(--c-primary-300); }

/* ── Drawer (mobil) ───────────────────────────────────────── */
.drawer { position: fixed; inset:0; z-index: var(--z-drawer); }
.drawer__backdrop { position:absolute; inset:0; background: rgba(13,24,38,.5); opacity:0; transition: opacity var(--t-base); }
.drawer__panel { position:absolute; top:0; right:0; height:100%; width: min(380px, 88vw); background:#fff; box-shadow: var(--sh-lg); display:flex; flex-direction:column; transform: translateX(100%); transition: transform var(--t-slow); overflow-y:auto; }
.drawer.is-open .drawer__backdrop { opacity:1; }
.drawer.is-open .drawer__panel { transform: translateX(0); }
.drawer__head { display:flex; align-items:center; justify-content:space-between; padding: var(--sp-4) var(--sp-5); border-bottom:1px solid var(--color-border); }
.drawer__nav { padding: var(--sp-3) var(--sp-4); flex:1; }
.drawer__nav > ul > li > a, .drawer__acc { display:flex; width:100%; justify-content:space-between; align-items:center; padding: var(--sp-4); border-radius: var(--r-md); font-weight: var(--fw-semi); color: var(--color-heading); background:none; border:0; cursor:pointer; font-size: var(--fs-md); }
.drawer__nav a:hover, .drawer__acc:hover { background: var(--c-primary-50); color: var(--color-brand); text-decoration:none; }
.drawer__acc .icon { transition: transform var(--t-base); }
.drawer__acc[aria-expanded="true"] .icon { transform: rotate(180deg); }
.drawer__sub { padding-left: var(--sp-4); }
.drawer__sub a { padding: var(--sp-3) var(--sp-4); font-size: var(--fs-sm); font-weight: var(--fw-med); color: var(--color-text-soft); }
.drawer__foot { padding: var(--sp-5); border-top:1px solid var(--color-border); display:flex; flex-direction:column; gap: var(--sp-3); }
body.no-scroll { overflow:hidden; }

@media (max-width: 1024px) {
    .nav, .header__cta { display:none; }
    .nav-toggle { display:grid; }
    .topbar__slogan { display:none; }
}
@media (max-width: 560px) {
    .topbar__item:first-child { display:none; }
    .topbar__inner { justify-content:center; }
}

/* ── Footer ───────────────────────────────────────────────── */
.site-footer { background: var(--c-secondary-900); color: var(--c-secondary-200); margin-top: var(--sp-16); }
.footer__grid { display:grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: var(--sp-10); padding-block: var(--sp-16) var(--sp-12); }
.footer__brand p { font-size: var(--fs-sm); color: var(--c-secondary-300); margin-top: var(--sp-4); max-width: 42ch; }
.footer__social { display:flex; gap: var(--sp-2); margin-top: var(--sp-5); }
.footer__social a { width: 40px; height:40px; border-radius: 10px; display:grid; place-items:center; background: rgba(255,255,255,.06); color:#fff; transition: all var(--t-fast); }
.footer__social a:hover { background: var(--c-primary-600); transform: translateY(-2px); }
.footer__social .icon { width: 19px; height:19px; }
.footer__title { font-family: var(--font-body); font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: .1em; color:#fff; margin-bottom: var(--sp-4); }
.footer__col ul li { margin-bottom: var(--sp-2); }
.footer__col a { color: var(--c-secondary-300); font-size: var(--fs-sm); }
.footer__col a:hover { color:#fff; }
.footer__contact li { display:flex; gap: var(--sp-3); align-items:flex-start; margin-bottom: var(--sp-3); font-size: var(--fs-sm); color: var(--c-secondary-300); }
.footer__contact .icon { width: 17px; height:17px; color: var(--c-primary-300); margin-top: 2px; flex:none; }
.footer__bar { border-top:1px solid rgba(255,255,255,.08); }
.footer__bar-inner { display:flex; justify-content:space-between; align-items:center; gap: var(--sp-4); padding-block: var(--sp-5); font-size: var(--fs-xs); color: var(--c-secondary-400); flex-wrap:wrap; }
.footer__legal { display:flex; gap: var(--sp-4); flex-wrap:wrap; }
.footer__legal a { color: var(--c-secondary-400); }
.footer__legal a:hover { color:#fff; }
@media (max-width: 900px) { .footer__grid { grid-template-columns: 1fr 1fr; gap: var(--sp-8); } }
@media (max-width: 560px) { .footer__grid { grid-template-columns: 1fr; } }

/* ── WhatsApp float ───────────────────────────────────────── */
.wa-float { position: fixed; right: 20px; bottom: 20px; z-index: var(--z-sticky); width: 58px; height:58px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow: 0 10px 30px rgba(37,211,102,.45); }
.wa-float:hover { transform: scale(1.06); text-decoration:none; }
.wa-float .icon { width: 30px; height:30px; fill: rgba(255,255,255,.18); }
.wa-float__pulse { position:absolute; inset:0; border-radius:50%; background:#25D366; opacity:.5; animation: wa-pulse 2.4s ease-out infinite; z-index:-1; }
@keyframes wa-pulse { 0%{transform:scale(1);opacity:.5} 100%{transform:scale(1.9);opacity:0} }

/* ── Cookie banner ────────────────────────────────────────── */
.cookie { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: var(--z-toast); background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); box-shadow: var(--sh-lg); }
.cookie__inner { display:flex; align-items:center; gap: var(--sp-5); padding: var(--sp-4) var(--sp-5); flex-wrap:wrap; }
.cookie__inner p { font-size: var(--fs-sm); color: var(--color-text-soft); flex:1; min-width: 260px; }
.cookie__note { color: var(--c-warning-700); font-size: var(--fs-xs); }
.cookie__actions { display:flex; gap: var(--sp-2); flex-wrap:wrap; }
@media (min-width: 720px) { .cookie { left:auto; right: 20px; max-width: 540px; } }

/* ============================================================
   PAGE SECTIONS (home + shared)
   ============================================================ */
.badge .icon { width: 14px; height: 14px; }
.hero__content .badge { background:#fff; box-shadow: var(--sh-xs); }
.hero__media--ph { background: linear-gradient(135deg, var(--c-primary-100), var(--c-secondary-200)); }
.hero__media--ph::after { content:"Vita Med"; position:absolute; inset:0; display:grid; place-items:center; font-family: var(--font-display); font-size: var(--fs-2xl); color: var(--c-primary-600); opacity:.5; }

/* Reveal animation */
[data-reveal] { opacity:0; transform: translateY(18px); transition: opacity .6s ease, transform .6s cubic-bezier(.22,1,.36,1); }
[data-reveal].is-visible { opacity:1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-reveal] { opacity:1; transform:none; } }

.benefit .card__icon { background: linear-gradient(135deg, var(--c-primary-50), var(--c-accent-50)); }

/* Stats */
.stats .stat__num { color:#fff; }
.section--ink .stat__label { color: var(--c-secondary-300); }
.stats__note { text-align:center; margin-top: var(--sp-8); color: var(--c-secondary-300); font-size: var(--fs-sm); }
.stats__note em { color: var(--c-accent-300); font-style: normal; }

/* Knowledge panel (LLMO) */
.knowledge-wrap { display:grid; grid-template-columns: 1.2fr .8fr; gap: var(--sp-12); align-items:center; }
.knowledge { background: var(--c-primary-50); border:1px solid var(--c-primary-100); border-radius: var(--r-xl); padding: var(--sp-8); }
.knowledge h3 { font-family: var(--font-body); font-size: var(--fs-sm); text-transform:uppercase; letter-spacing:.1em; color: var(--c-primary-700); margin-bottom: var(--sp-5); }
.knowledge dl { display:grid; grid-template-columns: minmax(90px,auto) 1fr; gap: var(--sp-3) var(--sp-5); font-size: var(--fs-sm); }
.knowledge dt { font-weight: var(--fw-bold); color: var(--color-heading); }
.knowledge dd { color: var(--color-text-soft); }
@media (max-width: 880px) { .knowledge-wrap { grid-template-columns: 1fr; } }

/* Doctor schedule line */
.doc-card__sched { font-size: var(--fs-xs); color: var(--color-text-soft); display:flex; align-items:center; gap:6px; }
.doc-card__sched .icon { width: 13px; height:13px; color: var(--color-brand); }
.doc-card__name a { color: inherit; }
.doc-card__name a:hover { color: var(--color-brand); text-decoration:none; }

/* Trust band */
.trust-band { display:flex; flex-wrap:wrap; justify-content:center; gap: var(--sp-3); }
.trust-band__item { display:inline-flex; align-items:center; gap: var(--sp-2); background:#fff; border:1px solid var(--color-border); border-radius: var(--r-full); padding: .6em 1.2em; font-weight: var(--fw-semi); font-size: var(--fs-sm); color: var(--color-heading); }
.trust-band__item .icon { width: 18px; height:18px; color: var(--color-brand); }

/* CTA banner */
.cta-banner { background: linear-gradient(120deg, var(--c-primary-700), var(--c-primary-900) 70%); border-radius: var(--r-2xl); padding: clamp(2rem,5vw,3.5rem); display:flex; align-items:center; justify-content:space-between; gap: var(--sp-8); flex-wrap:wrap; position:relative; overflow:hidden; }
.cta-banner::after { content:""; position:absolute; right:-60px; top:-60px; width:260px; height:260px; border-radius:50%; background: rgba(255,255,255,.06); }
.cta-banner h2 { color:#fff; } .cta-banner p { color: rgba(255,255,255,.85); margin-top: var(--sp-3); max-width: 52ch; }
.cta-banner__actions { display:flex; gap: var(--sp-3); flex-wrap:wrap; position:relative; }
.cta-banner__call { background: rgba(255,255,255,.12); color:#fff; border:1.5px solid rgba(255,255,255,.3); }
.cta-banner__call:hover { background: rgba(255,255,255,.2); }

/* ── Filters + search ─────────────────────────────────────── */
.filters-bar { margin-bottom: var(--sp-5); }
.search-field { position: relative; display:flex; align-items:center; max-width: 460px; }
.search-field .icon { position:absolute; left: 16px; width: 19px; height:19px; color: var(--color-text-faint); pointer-events:none; }
.search-field input { width:100%; padding: .85em 1em .85em 2.85em; border:1.5px solid var(--color-border); border-radius: var(--r-full); font-size: var(--fs-base); background:#fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.search-field input:focus { outline:none; border-color: var(--c-primary-400); box-shadow: 0 0 0 4px var(--c-primary-50); }
.filter-empty { text-align:center; color: var(--color-text-soft); padding: var(--sp-10); }

/* ── Doctor profile ───────────────────────────────────────── */
.doc-profile { display:grid; grid-template-columns: 1fr 340px; gap: var(--sp-12); align-items:start; }
.doc-profile__head { display:flex; gap: var(--sp-6); align-items:center; }
.doc-profile__photo { width: 140px; height:140px; flex:none; border-radius: var(--r-xl); background: linear-gradient(135deg, var(--c-primary-100), var(--c-secondary-200)); display:grid; place-items:center; color: var(--c-primary-600); }
.doc-profile__photo .icon { width: 56px; height:56px; opacity:.6; }
.doc-profile__spec { color: var(--color-brand); font-weight: var(--fw-semi); font-size: var(--fs-md); margin-top: var(--sp-1); }
.doc-profile__meta { display:flex; flex-wrap:wrap; gap: var(--sp-4); margin-top: var(--sp-4); }
.doc-profile__meta li { display:flex; align-items:center; gap:6px; font-size: var(--fs-sm); color: var(--color-text-soft); }
.doc-profile__meta .icon { width: 16px; height:16px; color: var(--color-brand); }
.appoint-box { background: var(--c-primary-50); border:1px solid var(--c-primary-100); border-radius: var(--r-xl); padding: var(--sp-6); position: sticky; top: calc(var(--header-h) + 16px); }
.appoint-box h2 { font-size: var(--fs-lg); }
.appoint-box p { font-size: var(--fs-sm); color: var(--color-text-soft); margin-top: var(--sp-2); }
.appoint-box .icon { width: 17px; height:17px; }
@media (max-width: 900px) { .doc-profile { grid-template-columns: 1fr; } .appoint-box { position: static; } .doc-profile__head { flex-direction: column; text-align:center; align-items:center; } }

/* ── Error page ───────────────────────────────────────────── */
.error-page { padding-block: var(--sp-24); }
.error-page__code { font-family: var(--font-display); font-size: clamp(5rem, 18vw, 11rem); font-weight: var(--fw-black); line-height:1; background: linear-gradient(135deg, var(--c-primary-400), var(--c-secondary-600)); -webkit-background-clip:text; background-clip:text; color: transparent; }
.error-page__search { margin-inline:auto; }
.error-page__links { display:flex; flex-wrap:wrap; gap: var(--sp-3); justify-content:center; }

/* ── Service detail ───────────────────────────────────────── */
.svc-layout { display:grid; grid-template-columns: 1fr 340px; gap: var(--sp-12); align-items:start; }
.svc-main h2 { font-size: var(--fs-2xl); }
.svc-main h3 { display:flex; align-items:center; gap: var(--sp-2); font-family: var(--font-body); font-size: var(--fs-md); color: var(--color-heading); }
.svc-main h3 .icon { width: 20px; height:20px; color: var(--color-brand); }
.svc-main p { color: var(--color-text); line-height: var(--lh-base); }
.svc-twocol { display:grid; grid-template-columns: 1fr 1fr; gap: var(--sp-8); }
.highlight { display:flex; gap: var(--sp-4); background: linear-gradient(120deg, var(--c-primary-50), var(--c-accent-50)); border:1px solid var(--c-primary-100); border-radius: var(--r-xl); padding: var(--sp-6); }
.highlight__mark { width: 48px; height:48px; flex:none; border-radius: 12px; background:#fff; color: var(--c-accent-500); display:grid; place-items:center; box-shadow: var(--sh-sm); }
.highlight h3 { font-family: var(--font-display); margin-bottom: var(--sp-2); }
.side-docs { background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-5); }
.side-docs h3 { font-size: var(--fs-sm); text-transform:uppercase; letter-spacing:.08em; color: var(--color-text-faint); margin-bottom: var(--sp-3); }
.side-docs li { margin-bottom: var(--sp-2); }
.side-docs a { display:flex; gap: var(--sp-3); align-items:center; padding: var(--sp-2); border-radius: var(--r-md); color: var(--color-text); }
.side-docs a:hover { background: var(--c-primary-50); text-decoration:none; }
.side-docs .icon { width: 30px; height:30px; padding:6px; background: var(--c-primary-50); border-radius:50%; color: var(--color-brand); flex:none; }
.side-docs small { color: var(--color-text-faint); }
.med-disclaimer { display:flex; gap: var(--sp-2); align-items:flex-start; color: var(--color-text-faint); font-size: var(--fs-sm); }
.med-disclaimer .icon { width: 17px; height:17px; flex:none; margin-top:2px; }
@media (max-width: 900px) { .svc-layout { grid-template-columns: 1fr; } .svc-twocol { grid-template-columns: 1fr; } }

/* ── Forms ────────────────────────────────────────────────── */
.form { margin-top: var(--sp-6); }
.form__row { display:grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
.field { margin-bottom: var(--sp-4); display:flex; flex-direction:column; }
.field label { font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--color-heading); margin-bottom: var(--sp-2); }
.field .req { color: var(--c-error-500); }
.field input, .field select, .field textarea {
    padding: .8em 1em; border:1.5px solid var(--color-border); border-radius: var(--r-md); font-size: var(--fs-base);
    background:#fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color: var(--c-primary-400); box-shadow: 0 0 0 4px var(--c-primary-50); }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: var(--c-error-500); box-shadow: 0 0 0 4px var(--c-error-50); }
.field__err { color: var(--c-error-700); font-size: var(--fs-xs); margin-top: var(--sp-1); min-height: 1em; }
.field--check .check { display:flex; gap: var(--sp-3); align-items:flex-start; font-size: var(--fs-sm); color: var(--color-text-soft); font-weight: var(--fw-reg); cursor:pointer; }
.field--check input { width: 20px; height:20px; flex:none; margin-top:2px; accent-color: var(--c-primary-600); }
.form__note { display:flex; gap: var(--sp-2); align-items:center; font-size: var(--fs-sm); color: var(--color-text-faint); margin-top: var(--sp-4); }
.form__note .icon { width: 16px; height:16px; color: var(--color-brand); }
.form__success { background: var(--c-success-50); color: var(--c-success-700); border:1px solid #bbf7d0; border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4); margin-top: var(--sp-4); font-size: var(--fs-sm); font-weight: var(--fw-semi); }
@media (max-width: 620px) { .form__row { grid-template-columns: 1fr; } }

/* ── Contact ──────────────────────────────────────────────── */
.contact-card { text-align:center; }
.contact-card .card__icon { margin-inline:auto; }
.contact-card:hover { text-decoration:none; }
.contact-card small { color: var(--color-text-faint); }
.contact-grid { display:grid; grid-template-columns: 1.3fr .9fr; gap: var(--sp-12); align-items:start; }
.info-box { background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-6); }
.map-embed iframe { display:block; box-shadow: var(--sh-sm); }
@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; } }

/* ── Mission/Vision cards ─────────────────────────────────── */
.mv-card .card__icon { width: 60px; height:60px; }
.mv-card h3 { font-family: var(--font-display); font-size: var(--fs-xl); }

/* ── Appointment (multi-step) ─────────────────────────────── */
.stepper { display:flex; gap: var(--sp-2); margin-bottom: var(--sp-10); counter-reset: step; flex-wrap:wrap; }
.stepper__item { display:flex; align-items:center; gap: var(--sp-2); flex:1; min-width: 90px; opacity:.5; transition: opacity var(--t-base); }
.stepper__item.is-active, .stepper__item.is-done { opacity:1; }
.stepper__num { width: 30px; height:30px; border-radius:50%; background: var(--c-neutral-200); color: var(--color-text-soft); display:grid; place-items:center; font-weight: var(--fw-bold); font-size: var(--fs-sm); flex:none; transition: all var(--t-base); }
.stepper__item.is-active .stepper__num { background: var(--color-brand); color:#fff; }
.stepper__item.is-done .stepper__num { background: var(--c-success-500); color:#fff; }
.stepper__label { font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--color-heading); }
@media (max-width: 640px) { .stepper__label { display:none; } .stepper__item { flex:0; } }

.appt__step { border:0; padding:0; margin:0; display:none; }
.appt__step.is-active { display:block; animation: fadeUp .35s ease; }
@keyframes fadeUp { from { opacity:0; transform: translateY(10px); } to { opacity:1; transform:none; } }
.appt__step legend { font-family: var(--font-display); font-size: var(--fs-xl); color: var(--color-heading); margin-bottom: var(--sp-5); font-weight: var(--fw-semi); }
.appt__step legend small { font-family: var(--font-body); font-size: var(--fs-sm); color: var(--color-text-faint); font-weight: var(--fw-reg); }

.choice-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: var(--sp-3); }
.choice-grid--docs { grid-template-columns: repeat(2,1fr); max-height: 460px; overflow-y:auto; padding: 2px; }
.choice { cursor:pointer; }
.choice input { position:absolute; opacity:0; pointer-events:none; }
.choice__body { display:flex; flex-direction:column; align-items:center; text-align:center; gap: var(--sp-2); padding: var(--sp-4); border:1.5px solid var(--color-border); border-radius: var(--r-lg); background:#fff; transition: all var(--t-fast); height:100%; }
.choice-grid--docs .choice__body { flex-direction:row; text-align:left; align-items:center; }
.choice__ic { width: 42px; height:42px; border-radius: 10px; background: var(--c-primary-50); color: var(--color-brand); display:grid; place-items:center; flex:none; }
.choice__ic .icon { width: 22px; height:22px; }
.choice__t { font-weight: var(--fw-semi); font-size: var(--fs-sm); color: var(--color-heading); }
.choice__t small { font-weight: var(--fw-reg); color: var(--color-text-faint); }
.choice:hover .choice__body { border-color: var(--c-primary-300); }
.choice input:checked + .choice__body { border-color: var(--color-brand); background: var(--c-primary-50); box-shadow: 0 0 0 3px var(--c-primary-100); }
.choice input:focus-visible + .choice__body { outline: 2px solid var(--c-primary-400); outline-offset:2px; }

.slot-group { margin-bottom: var(--sp-5); }
.slot-group h3 { font-family: var(--font-body); font-size: var(--fs-sm); text-transform:uppercase; letter-spacing:.06em; color: var(--color-text-faint); margin-bottom: var(--sp-3); }
.slot-row { display:flex; flex-wrap:wrap; gap: var(--sp-2); }
.slot { cursor:pointer; }
.slot input { position:absolute; opacity:0; }
.slot span { display:block; padding: .6em 1.2em; border:1.5px solid var(--color-border); border-radius: var(--r-full); font-weight: var(--fw-semi); font-size: var(--fs-sm); background:#fff; transition: all var(--t-fast); }
.slot input:checked + span { background: var(--color-brand); border-color: var(--color-brand); color:#fff; }
.slot input:focus-visible + span { outline:2px solid var(--c-primary-400); outline-offset:2px; }

.toggle-row { display:flex; gap: var(--sp-2); }
.toggle { cursor:pointer; flex:1; }
.toggle input { position:absolute; opacity:0; }
.toggle span { display:block; text-align:center; padding: .7em; border:1.5px solid var(--color-border); border-radius: var(--r-md); font-weight: var(--fw-semi); background:#fff; transition: all var(--t-fast); }
.toggle input:checked + span { background: var(--c-primary-50); border-color: var(--color-brand); color: var(--color-brand); }

.review { display:grid; grid-template-columns: minmax(110px,auto) 1fr; gap: var(--sp-3) var(--sp-5); background: var(--c-neutral-50); border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-6); }
.review dt { font-weight: var(--fw-bold); color: var(--color-heading); }
.review dd { color: var(--color-text-soft); }

.appt__nav { display:flex; justify-content:space-between; gap: var(--sp-3); margin-top: var(--sp-8); }
.appt__nav [data-appt-back] { margin-right:auto; }
.appt__success { text-align:center; padding: var(--sp-10) 0; }
.success-icon { width: 84px; height:84px; margin: 0 auto var(--sp-5); border-radius:50%; background: var(--c-success-50); color: var(--c-success-500); display:grid; place-items:center; }
.success-icon .icon { width: 44px; height:44px; }
@media (max-width: 560px) { .choice-grid, .choice-grid--docs { grid-template-columns: 1fr; } }

/* ── FAQ helpful ──────────────────────────────────────────── */
.faq-help { display:flex; align-items:center; gap: var(--sp-3); margin-top: var(--sp-4); padding-top: var(--sp-3); border-top:1px dashed var(--color-border); font-size: var(--fs-sm); color: var(--color-text-faint); }
.faq-help__btn { display:inline-flex; align-items:center; gap:5px; border:1px solid var(--color-border); background:#fff; padding:.3em .8em; border-radius: var(--r-full); font-size: var(--fs-sm); font-weight: var(--fw-semi); cursor:pointer; color: var(--color-text-soft); }
.faq-help__btn:hover { border-color: var(--c-primary-300); color: var(--color-brand); }
.faq-help__btn .icon { width: 14px; height:14px; }

/* ── Legal ────────────────────────────────────────────────── */
.legal-layout { display:grid; grid-template-columns: 260px 1fr; gap: var(--sp-12); align-items:start; }
.legal-toc { position: sticky; top: calc(var(--header-h) + 16px); }
.legal-toc h2 { font-size: var(--fs-sm); text-transform:uppercase; letter-spacing:.08em; color: var(--color-text-faint); margin-bottom: var(--sp-4); }
.legal-toc ol { list-style:none; counter-reset: toc; }
.legal-toc li { counter-increment: toc; margin-bottom: var(--sp-2); }
.legal-toc a { display:flex; gap:8px; font-size: var(--fs-sm); color: var(--color-text-soft); padding: 4px 0; }
.legal-toc a::before { content: counter(toc); color: var(--color-brand); font-weight: var(--fw-bold); }
.legal h2 { scroll-margin-top: calc(var(--header-h) + 20px); font-size: var(--fs-xl); }
.legal-flag { color: var(--c-warning-700); font-style: italic; }
@media (max-width: 900px) { .legal-layout { grid-template-columns: 1fr; } .legal-toc { position:static; } }
@media print { .site-header, .site-footer, .wa-float, .cookie, .breadcrumb, .legal-toc { display:none !important; } }

/* ── Blog ─────────────────────────────────────────────────── */
.blog-card { background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); overflow:hidden; display:flex; flex-direction:column; transition: transform var(--t-base), box-shadow var(--t-base); height:100%; }
.blog-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.blog-card__media { aspect-ratio: 16/9; background: linear-gradient(135deg, var(--c-primary-100), var(--c-secondary-200)); display:block; position:relative; }
.blog-card__cat { position:absolute; left: 12px; top: 12px; background: rgba(255,255,255,.92); color: var(--color-brand); font-size: var(--fs-xs); font-weight: var(--fw-bold); padding: .3em .8em; border-radius: var(--r-full); }
.blog-card__body { padding: var(--sp-5); display:flex; flex-direction:column; gap: var(--sp-2); flex:1; }
.blog-card__body h3 { font-family: var(--font-body); font-size: var(--fs-md); font-weight: var(--fw-bold); line-height: var(--lh-snug); }
.blog-card__body h3 a { color: var(--color-heading); }
.blog-card__body h3 a:hover { color: var(--color-brand); text-decoration:none; }
.blog-card__body p { font-size: var(--fs-sm); color: var(--color-text-soft); }
.blog-card__meta { display:flex; gap: var(--sp-4); margin-top:auto; padding-top: var(--sp-3); font-size: var(--fs-xs); color: var(--color-text-faint); }
.blog-card__meta span { display:flex; align-items:center; gap:5px; }
.blog-card__meta .icon { width: 14px; height:14px; }
.blog-featured { display:grid; grid-template-columns: 1.1fr 1fr; background:#fff; border:1px solid var(--color-border); border-radius: var(--r-xl); overflow:hidden; }
.blog-featured:hover { text-decoration:none; box-shadow: var(--sh-md); }
.blog-featured__media { background: linear-gradient(135deg, var(--c-primary-200), var(--c-secondary-300)); min-height: 280px; position:relative; }
.blog-featured__body { padding: clamp(1.5rem,4vw,2.5rem); display:flex; flex-direction:column; justify-content:center; }
.blog-featured__body h2 { font-size: var(--fs-2xl); margin: var(--sp-3) 0; }
.blog-featured__body p { color: var(--color-text-soft); }
@media (max-width: 800px) { .blog-featured { grid-template-columns: 1fr; } }

/* ── Article ──────────────────────────────────────────────── */
.article-layout { display:grid; grid-template-columns: 1fr 300px; gap: var(--sp-12); align-items:start; }
.article__meta { display:flex; flex-wrap:wrap; gap: var(--sp-4); margin-top: var(--sp-4); font-size: var(--fs-sm); color: var(--color-text-faint); }
.article__meta span { display:flex; align-items:center; gap:6px; }
.article__meta .icon { width: 15px; height:15px; color: var(--color-brand); }
.article__share { display:flex; align-items:center; gap: var(--sp-2); margin: var(--sp-6) 0; font-size: var(--fs-sm); color: var(--color-text-faint); }
.article__share a { width: 36px; height:36px; border-radius:50%; background: var(--c-neutral-100); display:grid; place-items:center; color: var(--color-text-soft); }
.article__share a:hover { background: var(--color-brand); color:#fff; }
.article__share .icon { width: 17px; height:17px; }
.article__body h2 { font-size: var(--fs-xl); margin-top: var(--sp-8); scroll-margin-top: 90px; }
.article-cta { display:flex; align-items:center; justify-content:space-between; gap: var(--sp-6); background: var(--c-primary-50); border:1px solid var(--c-primary-100); border-radius: var(--r-lg); padding: var(--sp-6); margin-top: var(--sp-8); flex-wrap:wrap; }
.article-cta h3 { font-family: var(--font-body); font-size: var(--fs-md); }
.author-card { display:flex; gap: var(--sp-4); background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-5); }
.author-card__photo { width: 56px; height:56px; flex:none; border-radius:50%; background: var(--c-primary-100); color: var(--color-brand); display:grid; place-items:center; }
.author-card__label { font-size: var(--fs-xs); text-transform:uppercase; letter-spacing:.08em; color: var(--color-text-faint); }
.author-card h3 { font-family: var(--font-body); font-size: var(--fs-md); }
.author-card p { font-size: var(--fs-sm); color: var(--color-text-soft); }
.toc { background: var(--c-neutral-50); border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-5); margin-top: var(--sp-6); }
.toc h3 { font-size: var(--fs-sm); text-transform:uppercase; letter-spacing:.08em; color: var(--color-text-faint); margin-bottom: var(--sp-3); }
.toc li { display:flex; gap:8px; align-items:flex-start; font-size: var(--fs-sm); color: var(--color-text-soft); margin-bottom: var(--sp-2); }
.toc .icon { width: 14px; height:14px; color: var(--color-brand); margin-top:4px; flex:none; }
@media (max-width: 900px) { .article-layout { grid-template-columns: 1fr; } }

/* ── News ─────────────────────────────────────────────────── */
.news-card { background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-5); display:flex; flex-direction:column; gap: var(--sp-2); height:100%; transition: transform var(--t-base), box-shadow var(--t-base); }
.news-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.news-card__top { display:flex; justify-content:space-between; align-items:center; gap: var(--sp-2); margin-bottom: var(--sp-2); }
.news-card__date { font-size: var(--fs-xs); color: var(--color-text-faint); display:flex; align-items:center; gap:5px; }
.news-card__date .icon { width: 13px; height:13px; }
.news-card h3 { font-family: var(--font-body); font-size: var(--fs-md); font-weight: var(--fw-bold); line-height: var(--lh-snug); }
.news-card h3 a { color: var(--color-heading); } .news-card h3 a:hover { color: var(--color-brand); text-decoration:none; }
.news-card p { font-size: var(--fs-sm); color: var(--color-text-soft); flex:1; }
.newsletter { display:flex; align-items:center; justify-content:space-between; gap: var(--sp-8); flex-wrap:wrap; }
.newsletter__form { display:flex; gap: var(--sp-3); align-items:flex-start; flex:1; min-width: 300px; }

/* ── Guide tabs ───────────────────────────────────────────── */
.guide__tabs { display:flex; gap: var(--sp-2); flex-wrap:wrap; border-bottom:2px solid var(--color-border); margin-bottom: var(--sp-8); }
.guide__tab { background:none; border:0; border-bottom:3px solid transparent; margin-bottom:-2px; padding: var(--sp-3) var(--sp-4); font-weight: var(--fw-semi); color: var(--color-text-soft); cursor:pointer; font-size: var(--fs-md); }
.guide__tab:hover { color: var(--color-brand); }
.guide__tab.is-active { color: var(--color-brand); border-bottom-color: var(--color-brand); }
.guide__panel { display:none; max-width: 80ch; }
.guide__panel.is-active { display:block; animation: fadeUp .35s ease; }
.steps-list { counter-reset: st; list-style:none; padding:0; }
.steps-list li { counter-increment: st; position:relative; padding-left: 3rem; margin-bottom: var(--sp-4); }
.steps-list li::before { content: counter(st); position:absolute; left:0; top:-2px; width: 32px; height:32px; border-radius:50%; background: var(--c-primary-50); color: var(--color-brand); font-weight: var(--fw-bold); display:grid; place-items:center; }

/* ── Gallery ──────────────────────────────────────────────── */
.gallery-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: var(--sp-4); }
.gallery-tile { border-radius: var(--r-lg); overflow:hidden; border:1px solid var(--color-border); }
.gallery-tile__ph { aspect-ratio: 4/3; background: linear-gradient(135deg, var(--c-primary-100), var(--c-secondary-200)); display:grid; place-items:center; color: var(--c-primary-500); }
.gallery-tile__ph .icon { width: 40px; height:40px; opacity:.5; }
.gallery-tile figcaption { padding: var(--sp-3); font-size: var(--fs-sm); color: var(--color-text-faint); background:#fff; }
@media (max-width: 700px) { .gallery-grid { grid-template-columns: repeat(2,1fr); } }

/* ── Career ───────────────────────────────────────────────── */
.job-list { display:flex; flex-direction:column; gap: var(--sp-4); }
.job-card { background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-6); transition: box-shadow var(--t-base); }
.job-card:hover { box-shadow: var(--sh-sm); }
.job-card__head { display:flex; justify-content:space-between; align-items:flex-start; gap: var(--sp-4); flex-wrap:wrap; margin-bottom: var(--sp-3); }
.job-card__head h3 { font-family: var(--font-body); font-size: var(--fs-lg); display:flex; align-items:center; gap: var(--sp-3); }
.job-card__meta { display:flex; flex-wrap:wrap; gap: var(--sp-4); margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--color-text-faint); }
.job-card__meta span { display:flex; align-items:center; gap:6px; }
.job-card__meta .icon { width: 15px; height:15px; }
.job-card p { color: var(--color-text-soft); }
.step-card { text-align:center; padding: var(--sp-5); }
.step-card__num { width: 48px; height:48px; margin: 0 auto var(--sp-3); border-radius:50%; background: var(--color-brand); color:#fff; display:grid; place-items:center; font-family: var(--font-display); font-size: var(--fs-lg); font-weight: var(--fw-bold); }
.step-card h3 { font-family: var(--font-body); font-size: var(--fs-md); }
.step-card p { font-size: var(--fs-sm); color: var(--color-text-soft); margin-top: var(--sp-2); }

/* ── Insurer ──────────────────────────────────────────────── */
.insurer-grid { display:grid; grid-template-columns: repeat(4,1fr); gap: var(--sp-4); }
.insurer-tile { display:flex; flex-direction:column; align-items:center; gap: var(--sp-2); text-align:center; background:#fff; border:1px solid var(--color-border); border-radius: var(--r-lg); padding: var(--sp-6) var(--sp-4); color: var(--color-text-faint); font-size: var(--fs-sm); }
.insurer-tile .icon { width: 32px; height:32px; color: var(--c-neutral-300); }
.insurer-tile small { color: var(--color-text-faint); }
@media (max-width: 700px) { .insurer-grid { grid-template-columns: repeat(2,1fr); } }

/* ── Emergency ────────────────────────────────────────────── */
.emergency-hero { background: linear-gradient(135deg, #7f1d1d, #b91c1c); color:#fff; padding-block: clamp(2.5rem,6vw,5rem); }
.emergency-hero h1 { color:#fff; margin: var(--sp-4) 0; }
.emergency-hero p { color: rgba(255,255,255,.92); max-width: 60ch; }
.emergency-hero .badge--accent { background: rgba(255,255,255,.18); color:#fff; }
.emergency-actions { display:flex; gap: var(--sp-3); flex-wrap:wrap; margin-top: var(--sp-6); }
.emergency-call { animation: epulse 1.8s ease-in-out infinite; }
@keyframes epulse { 0%,100%{ box-shadow: 0 0 0 0 rgba(255,255,255,.5);} 50%{ box-shadow: 0 0 0 14px rgba(255,255,255,0);} }
.emergency-hero .note--warn { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.3); color:#fff; }
.emergency-hero .note--warn em { color: #fde68a; }

/* ── Sitemap + thanks ─────────────────────────────────────── */
.sitemap-grid { display:grid; grid-template-columns: repeat(2,1fr); gap: var(--sp-10); }
.sitemap-list li { margin-bottom: var(--sp-2); }
.sitemap-list a { display:flex; align-items:center; gap:8px; color: var(--color-text-soft); font-size: var(--fs-sm); }
.sitemap-list a:hover { color: var(--color-brand); text-decoration:none; }
.sitemap-list .icon { width: 14px; height:14px; color: var(--color-brand); }
.sitemap-grid h2 { font-size: var(--fs-lg); margin-bottom: var(--sp-4); }
.thanks { padding-block: var(--sp-24); }
@media (max-width: 700px) { .sitemap-grid { grid-template-columns: 1fr; } }
