/* ═══════════════════════════════════════════════════════════
   NICKEL THEME — Main Stylesheet
   Minimalist white & pink (#FCBCCC) — Outfit + Plus Jakarta Sans
   ═══════════════════════════════════════════════════════════ */

/* ─── CSS Variables ────────────────────────────────────────── */

:root {
    /* Colors — Light minimalist palette */
    --c-bg:           #ffffff;
    --c-bg-alt:       #fafafa;
    --c-bg-card:      #ffffff;
    --c-bg-elevated:  #f5f5f7;
    --c-surface:      #f0f0f2;

    --c-text:         #2d2d2d;
    --c-text-muted:   #6b6b6b;
    --c-text-subtle:  #767676;

    --c-accent:       #FCBCCC;
    --c-accent-dark:  #f5a0b5;
    --c-accent-text:  #b0547a;
    --c-accent-hover: #f9adbf;
    --c-accent-glow:  rgba(252, 188, 204, 0.20);
    --c-accent-soft:  rgba(252, 188, 204, 0.12);
    --c-accent-ultra: rgba(252, 188, 204, 0.06);

    --c-dark:         #1a1a1a;
    --c-white:        #ffffff;
    --c-black:        #000000;
    --c-border:       rgba(0, 0, 0, 0.07);
    --c-border-strong: rgba(0, 0, 0, 0.12);
    --c-border-hover: rgba(0, 0, 0, 0.14);

    --c-success:      #34d399;
    --c-warning:      #fbbf24;
    --c-error:        #f87171;

    /* Typography */
    --f-display: 'Outfit', sans-serif;
    --f-body:    'Plus Jakarta Sans', sans-serif;

    --fs-xs:    0.75rem;
    --fs-sm:    0.875rem;
    --fs-base:  1rem;
    --fs-md:    1.125rem;
    --fs-lg:    1.25rem;
    --fs-xl:    1.5rem;
    --fs-2xl:   2rem;
    --fs-3xl:   2.5rem;
    --fs-4xl:   3.25rem;
    --fs-5xl:   4rem;
    --fs-hero:  clamp(2.5rem, 5.5vw, 4.5rem);

    --fw-light:    300;
    --fw-regular:  400;
    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;
    --fw-extrabold:800;

    --lh-tight:  1.15;
    --lh-snug:   1.3;
    --lh-normal: 1.65;
    --lh-relaxed:1.8;

    --ls-tight:  -0.025em;
    --ls-normal: 0;
    --ls-wide:   0.04em;
    --ls-wider:  0.08em;

    /* Spacing */
    --sp-xs:  0.25rem;
    --sp-sm:  0.5rem;
    --sp-md:  1rem;
    --sp-lg:  1.5rem;
    --sp-xl:  2rem;
    --sp-2xl: 3rem;
    --sp-3xl: 4rem;
    --sp-4xl: 6rem;
    --sp-5xl: 8rem;
    --sp-section: clamp(4rem, 8vw, 7rem);

    /* Layout */
    --container-max: 1200px;
    --container-narrow: 860px;
    --container-wide: 1400px;
    --container-px: clamp(1.25rem, 4vw, 2.5rem);

    /* Radius */
    --r-sm:   6px;
    --r-md:   10px;
    --r-lg:   14px;
    --r-xl:   20px;
    --r-2xl:  28px;
    --r-full: 999px;

    /* Shadows */
    --shadow-xs:  0 1px 2px rgba(0,0,0,0.04);
    --shadow-sm:  0 1px 4px rgba(0,0,0,0.06);
    --shadow-md:  0 4px 16px rgba(0,0,0,0.06);
    --shadow-lg:  0 8px 32px rgba(0,0,0,0.08);
    --shadow-pink: 0 4px 24px rgba(252, 188, 204, 0.30);

    /* Transitions */
    --ease-out:    cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --t-fast:    150ms;
    --t-normal:  300ms;
    --t-slow:    500ms;
    --t-slower:  800ms;

    /* Z-index */
    --z-dropdown: 100;
    --z-sticky:   200;
    --z-header:   300;
    --z-mobile:   400;
    --z-modal:    500;
    --z-toast:    600;
}

/* ─── Reset ────────────────────────────────────────────────── */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: 100px;
}

body {
    font-family: var(--f-body);
    font-size: var(--fs-base);
    font-weight: var(--fw-regular);
    line-height: var(--lh-normal);
    color: var(--c-text);
    background-color: var(--c-bg);
    background-image: radial-gradient(circle, rgba(0,0,0,0.03) 1px, transparent 1px);
    background-size: 24px 24px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Ccircle cx='10' cy='10' r='3' fill='none' stroke='%23FCBCCC' stroke-width='1.5'/%3E%3Ccircle cx='10' cy='10' r='1' fill='%23f5a0b5'/%3E%3C/svg%3E") 10 10, auto;
}

a, button, [role="button"], .btn, .service-card, .zone-link, input[type="submit"] {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Ccircle cx='12' cy='12' r='5' fill='none' stroke='%23f5a0b5' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='1.5' fill='%23f5a0b5'/%3E%3C/svg%3E") 12 12, pointer;
}

body.menu-open { overflow: hidden; }

img, video, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; transition: color var(--t-fast) var(--ease-out); }
ul, ol { list-style: none; }
button { border: none; background: none; cursor: pointer; font: inherit; color: inherit; }
input, textarea, select { font: inherit; color: inherit; }
::selection { background: var(--c-accent); color: var(--c-dark); }

/* ─── Layout ───────────────────────────────────────────────── */

.container { width: 100%; max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-px); }
.container--narrow { max-width: var(--container-narrow); }
.container--wide { max-width: var(--container-wide); }

.section { padding-block: var(--sp-section); }
.section--alt { background-color: rgba(0,0,0,0.018); }
.section--pink { background-color: rgba(252,188,204,0.04); }
.section--bordered { border-top: 1px solid var(--c-border); }

/* ─── Typography ───────────────────────────────────────────── */

h1, h2, h3, h4, h5, h6 {
    font-family: var(--f-display);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
    letter-spacing: var(--ls-tight);
    color: var(--c-dark);
}

h1 { font-size: var(--fs-hero); font-weight: var(--fw-extrabold); }
h2 { font-size: clamp(1.75rem, 3.5vw, var(--fs-4xl)); }
h3 { font-size: clamp(1.25rem, 2vw, var(--fs-2xl)); }
h4 { font-size: var(--fs-xl); }
h5 { font-size: var(--fs-lg); }
h6 { font-size: var(--fs-md); }

p { color: var(--c-text-muted); line-height: var(--lh-normal); }

.label {
    font-family: var(--f-display);
    font-size: var(--fs-xs);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: var(--ls-wider);
    color: var(--c-accent-text);
}

.lead { font-size: var(--fs-lg); line-height: var(--lh-relaxed); color: var(--c-text-muted); }
strong { font-weight: var(--fw-semibold); color: var(--c-dark); }

/* ─── Skip Link ────────────────────────────────────────────── */

.skip-link { position: fixed; top: -100%; left: var(--sp-md); z-index: var(--z-toast); padding: var(--sp-sm) var(--sp-md); background: var(--c-dark); color: var(--c-white); border-radius: var(--r-md); font-size: var(--fs-sm); transition: top var(--t-fast); }
.skip-link:focus { top: var(--sp-md); }

/* ─── Header ───────────────────────────────────────────────── */

.header {
    position: fixed; top: 0; left: 0; right: 0;
    z-index: var(--z-header);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--c-border);
    transition: background var(--t-normal), transform var(--t-normal);
}
.header--scrolled {
    box-shadow: var(--shadow-sm);
}

.header__inner { display: flex; align-items: center; justify-content: space-between; height: 76px; gap: var(--sp-xl); }

.header__logo { flex-shrink: 0; display: flex; align-items: center; }
.header__logo-img { height: 34px; width: auto; }
.header__logo-text { font-family: var(--f-display); font-size: var(--fs-xl); font-weight: var(--fw-extrabold); color: var(--c-dark); letter-spacing: var(--ls-tight); }

.nav { display: none; }
@media (min-width: 1024px) { .nav { display: flex; align-items: center; } }

.nav__list { display: flex; align-items: center; gap: var(--sp-xs); }
.nav__item { position: relative; }

.nav__link {
    display: flex; align-items: center; gap: 4px;
    padding: var(--sp-sm) var(--sp-md);
    font-family: var(--f-body); font-size: var(--fs-sm); font-weight: var(--fw-medium);
    color: var(--c-text-muted); border-radius: var(--r-md);
    transition: color var(--t-fast), background var(--t-fast);
}
.nav__link:hover, .nav__item--active > .nav__link { color: var(--c-dark); background: var(--c-accent-soft); }

.nav__chevron { transition: transform var(--t-fast); }
.nav__item--has-dropdown:hover .nav__chevron { transform: rotate(180deg); }

.nav__dropdown {
    position: absolute; top: 100%; left: 50%;
    transform: translateX(-50%) translateY(8px);
    min-width: 240px; padding: var(--sp-sm);
    padding-top: calc(var(--sp-sm) + 8px);
    background: var(--c-white); border: 1px solid var(--c-border);
    border-radius: var(--r-lg); box-shadow: var(--shadow-lg);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity var(--t-normal), transform var(--t-normal), visibility var(--t-normal);
}
/* Bridge pseudo-element to prevent hover gap */
.nav__dropdown::before {
    content: '';
    position: absolute; top: -12px; left: 0; right: 0; height: 20px;
    background: transparent;
}
.nav__item--has-dropdown:hover .nav__dropdown { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }

.nav__dropdown-link { display: block; padding: 10px var(--sp-md); font-size: var(--fs-sm); color: var(--c-text-muted); border-radius: var(--r-md); transition: color var(--t-fast), background var(--t-fast); }
.nav__dropdown-link:hover { color: var(--c-dark); background: var(--c-accent-soft); }

.header__actions { display: none; }
@media (min-width: 1024px) { .header__actions { display: flex; align-items: center; gap: var(--sp-md); } }

.header__burger { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 44px; height: 44px; padding: 10px; border: none; background: none; cursor: pointer; border-radius: var(--r-md); transition: background var(--t-fast); -webkit-tap-highlight-color: transparent; }
@media (min-width: 1024px) { .header__burger { display: none; } }
.header__burger:hover { background: var(--c-accent-soft); }
.header__burger-line { display: block; width: 22px; height: 2px; background: var(--c-dark); border-radius: 2px; transition: transform var(--t-normal), opacity var(--t-fast); }
.header__burger.is-active .header__burger-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.header__burger.is-active .header__burger-line:nth-child(2) { opacity: 0; }
.header__burger.is-active .header__burger-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ─── Mobile Menu ──────────────────────────────────────────── */

.mobile-overlay { position: fixed; inset: 0; z-index: calc(var(--z-mobile) - 1); background: rgba(0,0,0,0.45); opacity: 0; visibility: hidden; transition: opacity 0.35s, visibility 0.35s; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.mobile-overlay.is-open { opacity: 1; visibility: visible; }
.mobile-menu { position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--z-mobile); width: min(85vw, 380px); background: var(--c-white); transform: translateX(100%); transition: transform 0.4s cubic-bezier(.4,0,.2,1); display: flex; flex-direction: column; overflow-y: auto; box-shadow: -8px 0 30px rgba(0,0,0,0.1); }
.mobile-menu.is-open { transform: translateX(0); }
.mobile-menu__header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--c-border); flex-shrink: 0; }
.mobile-menu__logo img { height: 32px; width: auto; }
.mobile-menu__close { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: none; background: var(--c-bg-elevated); border-radius: var(--r-md); cursor: pointer; color: var(--c-dark); transition: background 0.2s; -webkit-tap-highlight-color: transparent; }
.mobile-menu__close:hover { background: var(--c-border); }
.mobile-menu__nav { flex: 1; padding: 8px 24px; overflow-y: auto; }
.mobile-menu__list { display: flex; flex-direction: column; gap: 0; }
.mobile-menu__list > li > a { display: block; padding: 14px 0; font-family: var(--f-display); font-size: var(--fs-md); font-weight: var(--fw-semibold); color: var(--c-dark); border-bottom: 1px solid var(--c-border); }
.mobile-menu__list > li:last-child > a { border-bottom: none; }
.mobile-menu__list > li.current-menu-item > a,
.mobile-menu__list > li.current-menu-parent > a { color: var(--c-accent-dark); }
.mobile-menu__list .sub-menu { padding-left: 16px; padding-bottom: 8px; }
.mobile-menu__list .sub-menu a { display: block; padding: 10px 0; font-size: var(--fs-sm); color: var(--c-text-muted); border-bottom: 1px solid var(--c-border); }
.mobile-menu__list .sub-menu li:last-child a { border-bottom: none; }
.mobile-menu__footer { padding: 20px 24px; border-top: 1px solid var(--c-border); display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.mobile-menu__phone { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px; font-size: var(--fs-sm); color: var(--c-text-muted); text-align: center; }

/* ─── Buttons ──────────────────────────────────────────────── */

.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-sm); padding: 14px 28px; font-family: var(--f-body); font-size: var(--fs-sm); font-weight: var(--fw-semibold); line-height: 1; border-radius: var(--r-full); white-space: nowrap; cursor: pointer; transition: all var(--t-normal) var(--ease-out); position: relative; overflow: hidden; }

.btn--primary { background: var(--c-dark); color: var(--c-white); border: 1px solid var(--c-dark); }
.btn--primary:hover { background: #333; border-color: #333; transform: translateY(-1px); box-shadow: var(--shadow-md); }

.btn--pink { background: var(--c-accent); color: var(--c-dark); border: 1px solid var(--c-accent); }
.btn--pink:hover { background: var(--c-accent-hover); border-color: var(--c-accent-hover); transform: translateY(-1px); box-shadow: var(--shadow-pink); }

.btn--outline { background: transparent; color: var(--c-dark); border: 1px solid var(--c-border-hover); }
.btn--outline:hover { border-color: var(--c-dark); background: var(--c-bg-alt); }

.btn--ghost { background: transparent; color: var(--c-dark); padding: 10px 0; font-weight: var(--fw-medium); }
.btn--ghost:hover { color: var(--c-accent-dark); }

.btn--sm { padding: 10px 20px; font-size: var(--fs-xs); }
.btn--lg { padding: 18px 36px; font-size: var(--fs-base); }
.btn--full { width: 100%; }
.btn__arrow { transition: transform var(--t-fast) var(--ease-out); }
.btn:hover .btn__arrow { transform: translateX(3px); }

/* ─── Footer ───────────────────────────────────────────────── */

.footer-cta { padding: var(--sp-4xl) 0; }
.footer-cta__inner { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--sp-md); background: linear-gradient(135deg, #FCBCCC 0%, #f8a4b8 40%, #e8779a 100%); border-radius: var(--r-2xl); padding: var(--sp-3xl) var(--sp-2xl); color: var(--c-white); }
.footer-cta__heading { display: flex; align-items: center; gap: var(--sp-md); }
.footer-cta__avatar { width: 72px; height: 72px; border-radius: 50%; overflow: hidden; border: 3px solid rgba(255,255,255,0.5); flex-shrink: 0; }
.footer-cta__avatar img { width: 100%; height: 100%; object-fit: cover; }
.footer-cta__title { font-size: clamp(1.5rem, 3vw, var(--fs-3xl)); color: var(--c-white); margin: 0; text-align: left; }
.footer-cta__text { font-size: var(--fs-md); color: rgba(255,255,255,0.85); max-width: 500px; }
.footer-cta__actions { display: flex; gap: var(--sp-md); flex-wrap: wrap; justify-content: center; margin-top: var(--sp-sm); }
.footer-cta__actions .btn--primary { background: var(--c-white); color: var(--c-dark); border: 2px solid var(--c-white); }
.footer-cta__actions .btn--primary:hover { background: rgba(255,255,255,0.9); }
.footer-cta__actions .btn--outline { border-color: rgba(255,255,255,0.6); color: var(--c-white); background: rgba(255,255,255,0.1); }
.footer-cta__actions .btn--outline:hover { background: rgba(255,255,255,0.25); border-color: var(--c-white); }

.footer__main { padding: var(--sp-4xl) 0 var(--sp-3xl); background: var(--c-bg-alt); border-top: 1px solid var(--c-border); }
.footer__grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-2xl); }
@media (min-width: 640px) { .footer__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr 1.3fr; gap: var(--sp-xl); } }
.footer__col--brand { grid-column: 1 / -1; }
@media (min-width: 1024px) { .footer__col--brand { grid-column: 1; } }
.footer__logo { display: inline-block; margin-bottom: var(--sp-lg); }
.footer__logo img { height: 30px; width: auto; }
.footer__logo-text { font-family: var(--f-display); font-size: var(--fs-lg); font-weight: var(--fw-extrabold); color: var(--c-dark); }
.footer__tagline { font-size: var(--fs-sm); color: var(--c-text-muted); margin-bottom: var(--sp-lg); max-width: 280px; }
.footer__social { display: flex; gap: var(--sp-sm); }
.footer__social-link { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--r-full); background: var(--c-white); border: 1px solid var(--c-border); color: var(--c-text-muted); transition: all var(--t-fast); }
.footer__social-link:hover { color: var(--c-dark); border-color: var(--c-accent); background: var(--c-accent-soft); }
.footer__social-link svg { width: 18px; height: 18px; }
.footer__heading { font-family: var(--f-display); font-size: var(--fs-xs); font-weight: var(--fw-semibold); text-transform: uppercase; letter-spacing: var(--ls-wide); color: var(--c-dark); margin-bottom: var(--sp-lg); }
.footer__links { display: flex; flex-direction: column; gap: var(--sp-sm); }
.footer__links a, .footer__links span { display: flex; align-items: center; gap: var(--sp-sm); font-size: var(--fs-sm); color: var(--c-text-muted); transition: color var(--t-fast); }
.footer__links a:hover { color: var(--c-dark); }
.footer__links svg { flex-shrink: 0; width: 16px; height: 16px; opacity: 0.4; }

/* Footer tools links */
.footer__tools { margin-top: var(--sp-lg); display: flex; flex-direction: column; gap: var(--sp-sm); }
.footer__tool-link { display: flex; align-items: center; gap: var(--sp-sm); font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--c-accent-dark); transition: color var(--t-fast); }
.footer__tool-link:hover { color: var(--c-dark); }

/* Footer hours/status */
.footer__hours { margin-top: var(--sp-lg); padding: var(--sp-md); background: var(--c-bg-alt); border-radius: var(--r-lg); border: 1px solid var(--c-border); min-width: 220px; }
.footer__status { display: flex; align-items: center; gap: var(--sp-sm); font-size: var(--fs-sm); font-weight: var(--fw-semibold); margin-bottom: var(--sp-md); white-space: nowrap; }
.footer__status-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.footer__status--open .footer__status-dot { background: #34d399; }
.footer__status--open { color: #059669; }
.footer__status--closed .footer__status-dot { background: #f87171; }
.footer__status--closed { color: #dc2626; }
.footer__schedule-row { display: flex; justify-content: space-between; gap: var(--sp-lg); font-size: var(--fs-xs); color: var(--c-text-muted); padding: 2px 0; white-space: nowrap; }
.footer__schedule-row strong { color: var(--c-dark); }

.footer__bottom { padding: var(--sp-lg) 0; background: var(--c-bg-alt); border-top: 1px solid var(--c-border); }
.footer__bottom-inner { display: flex; flex-direction: column; gap: var(--sp-md); align-items: center; text-align: center; }
@media (min-width: 768px) { .footer__bottom-inner { flex-direction: row; justify-content: space-between; text-align: left; } }
.footer__copyright { font-size: var(--fs-xs); color: var(--c-text-subtle); }
.footer__legal { display: flex; gap: var(--sp-lg); }
.footer__legal a { font-size: var(--fs-xs); color: var(--c-text-subtle); transition: color var(--t-fast); }
.footer__legal a:hover { color: var(--c-text); }

/* ─── Back to top ──────────────────────────────────────────── */

.back-to-top { position: fixed; bottom: var(--sp-xl); right: var(--sp-xl); z-index: var(--z-sticky); width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: var(--c-white); border: 1px solid var(--c-border); border-radius: var(--r-full); color: var(--c-text-muted); opacity: 0; visibility: hidden; transform: translateY(10px); transition: all var(--t-normal); box-shadow: var(--shadow-sm); }
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top:hover { color: var(--c-dark); border-color: var(--c-accent); background: var(--c-accent-soft); }

/* ─── Utility Classes ──────────────────────────────────────── */

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; }
.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-accent { color: var(--c-accent-dark); }
.text-dark   { color: var(--c-dark); }
.text-white  { color: var(--c-white); }
.text-muted  { color: var(--c-text-muted); }

.mt-sm  { margin-top: var(--sp-sm); }
.mt-md  { margin-top: var(--sp-md); }
.mt-lg  { margin-top: var(--sp-lg); }
.mt-xl  { margin-top: var(--sp-xl); }
.mt-2xl { margin-top: var(--sp-2xl); }
.mt-3xl { margin-top: var(--sp-3xl); }

.mb-sm  { margin-bottom: var(--sp-sm); }
.mb-md  { margin-bottom: var(--sp-md); }
.mb-lg  { margin-bottom: var(--sp-lg); }
.mb-xl  { margin-bottom: var(--sp-xl); }
.mb-2xl { margin-bottom: var(--sp-2xl); }

/* ─── Topbar / Announcement Bar ────────────────────────────── */

.topbar {
    background: var(--c-dark);
    color: var(--c-white);
    padding: 8px 0;
    position: relative;
    z-index: calc(var(--z-header) + 1);
    text-align: center;
    transition: transform var(--t-normal) var(--ease-out);
}

.topbar__link {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-sm);
    font-size: var(--fs-xs);
    font-weight: var(--fw-medium);
    color: rgba(255,255,255,0.85);
    transition: color var(--t-fast);
}
.topbar__link:hover { color: var(--c-white); }

.topbar__badge {
    display: inline-block;
    padding: 2px 8px;
    background: var(--c-accent);
    color: var(--c-dark);
    font-size: 10px;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    border-radius: var(--r-full);
    line-height: 1.4;
}

.topbar__link svg {
    transition: transform var(--t-fast);
}
.topbar__link:hover svg {
    transform: translateX(3px);
}

/* Header with topbar — offset for fixed position */
.header {
    top: 34px;
}

/* ─── Header Phone Link ───────────────────────────────────── */

.header__phone {
    display: none;
    align-items: center;
    gap: var(--sp-sm);
    font-size: var(--fs-sm);
    font-weight: var(--fw-medium);
    color: var(--c-text-muted);
    transition: color var(--t-fast);
}
.header__phone:hover { color: var(--c-dark); }
.header__phone svg { flex-shrink: 0; }

@media (min-width: 1200px) {
    .header__phone { display: flex; }
}

/* ─── Enhanced Footer Link Styles ──────────────────────────── */

.footer__links li { line-height: 1.3; }

.footer__links a {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-sm);
    font-size: var(--fs-sm);
    color: var(--c-text-muted);
    padding: 3px 0;
    position: relative;
    transition: color var(--t-fast), transform var(--t-fast);
}

.footer__links a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--c-accent-dark);
    transition: width var(--t-normal) var(--ease-out);
}

.footer__links a:hover {
    color: var(--c-dark);
    transform: translateX(2px);
}

.footer__links a:hover::after {
    width: 100%;
}

.footer__links--contact a {
    transform: none !important;
}
.footer__links--contact a:hover {
    transform: none !important;
}

.footer__links svg {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    opacity: 0.4;
    transition: opacity var(--t-fast);
}

.footer__links a:hover svg {
    opacity: 0.7;
}

/* ─── Inline CTA Band (between sections, like Publius) ───── */

.inline-cta {
    padding: var(--sp-lg) 0;
    background: linear-gradient(135deg, rgba(252,188,204,0.12) 0%, rgba(252,188,204,0.06) 50%, rgba(232,119,154,0.08) 100%);
    border-top: 1px solid rgba(252,188,204,0.25);
    border-bottom: 1px solid rgba(252,188,204,0.25);
    position: relative;
    overflow: hidden;
}

.inline-cta__inner {
    display: flex;
    flex-direction: column;
    gap: var(--sp-lg);
    align-items: center;
    text-align: center;
}

@media (min-width: 768px) {
    .inline-cta__inner {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
    }
}

.inline-cta__text {
    font-size: var(--fs-md);
    color: var(--c-text-muted);
}

.inline-cta__text strong {
    color: var(--c-dark);
}