:root {
    --ucs-navy: #061a3a;
    --ucs-navy-soft: #0f2d5c;
    --ucs-sky: #7fb2ff;
    --ucs-gold: #f4c84b;
    --ucs-white: #f8fbff;
    --ucs-mint: #23c767;
    --ucs-ink: #11213d;
    --ucs-shadow: 0 24px 80px rgba(6, 26, 58, 0.18);
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Outfit", sans-serif;
    background:
        radial-gradient(circle at top left, rgba(127, 178, 255, 0.18), transparent 32%),
        radial-gradient(circle at top right, rgba(244, 200, 75, 0.16), transparent 24%),
        linear-gradient(180deg, #f8fbff 0%, #edf4ff 48%, #ffffff 100%);
    color: #43516c;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Cormorant Garamond", serif;
    color: var(--ucs-ink);
    letter-spacing: -0.02em;
}

::selection {
    background: var(--ucs-gold);
    color: var(--ucs-navy);
}

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #e5edf9;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #254b84, #0c2551);
    border-radius: 999px;
}

.skip-link {
    position: absolute;
    left: 1rem;
    top: -4rem;
    z-index: 1000;
    padding: 0.75rem 1rem;
    border-radius: 999px;
    background: var(--ucs-navy);
    color: white;
    transition: top 0.2s ease;
}

.skip-link:focus {
    top: 1rem;
}

.text-balance {
    text-wrap: balance;
}

.site-noise {
    position: relative;
    isolation: isolate;
}

.site-noise::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../images/ucs-pattern.svg");
    background-size: 260px;
    opacity: 0.22;
    pointer-events: none;
    z-index: -1;
}

.glass-card {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.26);
    box-shadow: 0 18px 60px rgba(10, 34, 76, 0.16);
    backdrop-filter: blur(18px);
}

.surface-card {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(187, 207, 235, 0.65);
    box-shadow: var(--ucs-shadow);
}

.nav-shell {
    background: rgba(248, 251, 255, 0.86);
    border-bottom: 1px solid rgba(16, 45, 92, 0.08);
    backdrop-filter: blur(16px);
}

.nav-link {
    position: relative;
}

.nav-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -0.55rem;
    width: 100%;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--ucs-gold), var(--ucs-mint));
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.25s ease;
}

.nav-link:hover::after,
.nav-link.active-nav::after {
    transform: scaleX(1);
}

.active-nav {
    color: var(--ucs-navy) !important;
}

.hero-shell {
    background:
        linear-gradient(135deg, rgba(6, 26, 58, 0.96), rgba(15, 45, 92, 0.9)),
        radial-gradient(circle at top right, rgba(244, 200, 75, 0.24), transparent 28%);
    color: white;
}

.hero-shell h1,
.hero-shell h2,
.hero-shell h3 {
    color: white;
}

.hero-orb {
    position: absolute;
    border-radius: 999px;
    filter: blur(18px);
    opacity: 0.45;
    animation: float-orb 12s ease-in-out infinite;
}

.hero-orb.orb-a {
    width: 14rem;
    height: 14rem;
    background: rgba(244, 200, 75, 0.32);
    top: 10%;
    left: 6%;
}

.hero-orb.orb-b {
    width: 18rem;
    height: 18rem;
    background: rgba(35, 199, 103, 0.18);
    right: 4%;
    bottom: 8%;
    animation-delay: 2s;
}

.hero-photo {
    position: relative;
    overflow: hidden;
    border-radius: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.28);
}

.hero-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(6, 26, 58, 0.05), rgba(6, 26, 58, 0.24));
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 1rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.eyebrow-light {
    background: rgba(255, 255, 255, 0.14);
    color: #ecf5ff;
}

.eyebrow-dark {
    background: rgba(14, 44, 88, 0.08);
    color: var(--ucs-navy-soft);
}

.lux-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 0.95rem 1.5rem;
    border-radius: 999px;
    font-weight: 700;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.lux-button:hover {
    transform: translateY(-2px);
}

.lux-button-primary {
    background: linear-gradient(135deg, var(--ucs-gold), #ffe28b);
    color: #0a2146;
    box-shadow: 0 16px 40px rgba(244, 200, 75, 0.28);
}

.lux-button-secondary {
    background: rgba(255, 255, 255, 0.12);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.lux-button-dark {
    background: linear-gradient(135deg, #0d2b58, #133871);
    color: white;
    box-shadow: 0 18px 40px rgba(13, 43, 88, 0.22);
}

.section-title {
    font-size: clamp(2rem, 4vw, 3.9rem);
    line-height: 0.95;
}

.notice-strip {
    background: linear-gradient(90deg, #0a2146, #16376b);
    color: white;
}

.section-soft {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(237, 244, 255, 0.94));
}

.section-deep {
    background:
        linear-gradient(135deg, #071a37, #0e2a57 60%, #12376f);
    color: white;
}

.section-deep h2,
.section-deep h3,
.section-deep h4 {
    color: white;
}

.card-lift {
    transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.card-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 24px 55px rgba(13, 43, 88, 0.14);
}

.partner-badge {
    width: 4.25rem;
    height: 4.25rem;
    border-radius: 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    letter-spacing: 0.08em;
    background: linear-gradient(135deg, rgba(244, 200, 75, 0.18), rgba(127, 178, 255, 0.24));
    color: var(--ucs-navy);
}

.partner-card,
.stat-card,
.highlight-card,
.course-card,
.faq-card,
.therapy-card,
.doctor-card {
    height: 100%;
}

.accordion-item {
    border: 1px solid rgba(140, 166, 203, 0.35);
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, 0.94);
    overflow: hidden;
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.35s ease;
}

.accordion-item.is-open .accordion-content {
    max-height: 900px;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.35s ease;
}

.faq-card.is-open .faq-answer {
    max-height: 420px;
}

.faq-card.is-open .faq-chevron,
.accordion-item.is-open .accordion-chevron {
    transform: rotate(180deg);
}

.faq-chevron,
.accordion-chevron {
    transition: transform 0.25s ease;
}

.therapy-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 999px;
    padding: 0.7rem 1rem;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(164, 189, 223, 0.55);
    color: var(--ucs-ink);
    font-size: 0.92rem;
    font-weight: 500;
}

.therapy-tag::before {
    content: "";
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--ucs-gold), var(--ucs-mint));
}

.swiper-pagination-bullet {
    background: rgba(9, 32, 68, 0.26) !important;
}

.swiper-pagination-bullet-active {
    background: var(--ucs-navy) !important;
}

.floating-stack {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 60;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.floating-btn {
    width: 3.35rem;
    height: 3.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: white;
    box-shadow: 0 18px 45px rgba(10, 33, 70, 0.26);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.floating-btn:hover {
    transform: translateY(-3px);
}

.floating-whatsapp {
    background: linear-gradient(135deg, #1db954, #0aa84d);
}

.floating-call {
    background: linear-gradient(135deg, #f4c84b, #ffdf88);
    color: #0a2146;
}

.floating-top {
    background: linear-gradient(135deg, #0d2b58, #16376b);
}

.map-frame {
    width: 100%;
    min-height: 18rem;
    border: 0;
    border-radius: 1.5rem;
    box-shadow: 0 22px 55px rgba(12, 37, 81, 0.14);
}

.shadow-gold {
    box-shadow: 0 18px 50px rgba(244, 200, 75, 0.24);
}

.counter-value {
    font-size: clamp(2.3rem, 4vw, 3.5rem);
    font-weight: 800;
    line-height: 1;
    color: var(--ucs-navy);
}

.footer-link:hover {
    color: white;
}

.mobile-only {
    display: none;
}

@media (max-width: 767px) {
    .mobile-only {
        display: inline-flex;
    }
}

@keyframes float-orb {
    0%,
    100% {
        transform: translate3d(0, 0, 0);
    }

    50% {
        transform: translate3d(10px, -12px, 0);
    }
}