/* ==========================================================================
   ROOTOPATHY - Fixed Premium Dark Theme
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Playfair+Display:wght@400;600;700&display=swap');

:root {
    --root-dark: #152721;
    --root-darker: #0d1a15;
    --root-accent: #c2a578;
    --root-light: #f8faf9;
    --text-main: #334155;
    --text-muted: #64748b;
    --font-sans: 'Inter', sans-serif;
    --font-serif: 'Playfair Display', serif;
}

body {
    font-family: var(--font-sans);
    color: var(--text-main);
    background-color: #ffffff;
}

h1, h2, h3, h4, h5, h6, .hero-title, .section-heading {
    font-family: var(--font-serif);
    font-weight: 700;
}

.section {
    padding: 80px 0;
}

/* ---------------- HERO SECTION ---------------- */
.page-hero {
    position: relative;
    padding: 0;
    background:
        radial-gradient(circle at 86% 14%, rgba(151, 255, 220, 0.14), transparent 10%),
        linear-gradient(90deg, #0d4a45 0%, #0d4c46 40%, #0d453f 72%, #0b3c38 100%);
    min-height: 292px;
    display: flex;
    align-items: center;
    overflow: hidden;
    border-bottom: 4px solid rgba(255, 255, 255, 0.98);
}

.page-hero-overlay {
    position: absolute;
    inset: 0;
}

.page-hero-overlay {
    background:
        linear-gradient(90deg, rgba(7, 49, 45, 0.16) 0%, rgba(7, 49, 45, 0.16) 1px, transparent 1px, transparent 100%);
    background-size: 92px 100%;
    z-index: 1;
}

.page-hero::before,
.page-hero::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.page-hero::before {
    right: -120px;
    top: -54px;
    width: 620px;
    height: 390px;
    opacity: 0.34;
    background:
        radial-gradient(circle at 72% 18%, rgba(212, 187, 144, 0.22), transparent 7%),
        radial-gradient(circle at 70% 16%, rgba(151, 255, 220, 0.2), transparent 14%),
        radial-gradient(ellipse at 64% 36%, transparent 51%, rgba(113, 210, 182, 0.18) 52%, transparent 53.5%),
        radial-gradient(ellipse at 62% 44%, transparent 57%, rgba(93, 183, 160, 0.14) 58%, transparent 59.5%),
        radial-gradient(ellipse at 58% 52%, transparent 64%, rgba(87, 172, 151, 0.14) 65%, transparent 66.5%),
        radial-gradient(ellipse at 55% 58%, transparent 70%, rgba(194, 165, 120, 0.12) 71%, transparent 72.5%);
    filter: blur(0.2px);
}

.page-hero::after {
    right: 120px;
    top: 22px;
    width: 420px;
    height: 240px;
    opacity: 0.22;
    background:
        radial-gradient(ellipse at 80% 10%, rgba(255,255,255,0.08), transparent 42%),
        radial-gradient(ellipse at 50% 50%, transparent 62%, rgba(117, 220, 188, 0.16) 63%, transparent 64.4%),
        radial-gradient(ellipse at 42% 58%, transparent 72%, rgba(117, 220, 188, 0.12) 73%, transparent 74.4%);
}

.page-hero .container {
    position: relative;
    z-index: 2;
}

.page-hero-content {
    max-width: 640px;
    padding: 6px 0 0 2px;
}

.hero-badge,
.hero-subtitle {
    display: none !important;
}

.hero-title {
    color: #f3ecdf;
    font-size: clamp(3.05rem, 4.35vw, 4.3rem);
    line-height: 0.9;
    letter-spacing: -0.045em;
    margin: 0;
    max-width: 620px;
    text-shadow: 0 8px 20px rgba(8, 26, 24, 0.1);
}

.hero-title span {
    color: var(--root-accent);
}

@media (max-width: 991px) {
    .page-hero {
        min-height: auto;
        padding: 56px 0 52px;
    }

    .page-hero-content {
        max-width: 100%;
    }

    .hero-title {
        font-size: clamp(2.8rem, 7vw, 4rem);
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .page-hero {
        padding: 40px 0 36px;
        min-height: auto;
    }

    .hero-title {
        font-size: clamp(2.35rem, 11.5vw, 3.4rem);
        line-height: 0.92;
    }

    .page-hero::before {
        right: -180px;
        top: -30px;
        width: 500px;
        height: 300px;
        opacity: 0.28;
    }

    .page-hero::after {
        right: 10px;
        top: 20px;
        width: 240px;
        height: 160px;
        opacity: 0.16;
    }
}

/* ---------------- THE CLINICAL APPROACH ---------------- */
.section-architecture {
    background:
        radial-gradient(circle at 18% 10%, rgba(194, 165, 120, 0.09), transparent 30%),
        radial-gradient(circle at 72% 18%, rgba(194, 165, 120, 0.05), transparent 26%),
        linear-gradient(180deg, #fcfcf8 0%, #ffffff 100%);
    padding-top: 86px;
    padding-bottom: 92px;
}

.architecture-row {
    --bs-gutter-x: 4.9rem;
    align-items: start;
}

.architecture-left {
    padding-top: 6px;
}

.section-architecture .section-label,
.sub-title {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #6d6f73;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 22px;
}

.section-architecture .section-label::before,
.sub-title::before {
    content: "";
    width: 30px;
    height: 1px;
    background: rgba(194, 165, 120, 0.95);
}

.section-architecture .section-heading {
    color: var(--root-dark);
    font-size: clamp(2.8rem, 3.6vw, 4.2rem);
    margin-bottom: 22px;
    line-height: 0.94;
    letter-spacing: -0.055em;
    max-width: 10ch;
    white-space: normal;
    text-wrap: balance;
}

.architecture-copy {
    max-width: 50ch;
    color: #6f7276;
    font-size: 0.97rem;
    line-height: 1.78;
    margin-bottom: 42px;
}

.architecture-pillars {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    max-width: 640px;
}

.pillar-card {
    padding: 8px 26px 0;
    border-left: 1px solid rgba(21, 39, 33, 0.12);
    text-align: center;
}

.pillar-card:first-child {
    border-left: 0;
    padding-left: 0;
}

.pillar-card:last-child {
    padding-right: 0;
}

.pillar-icon {
    width: 88px;
    height: 88px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 3.3rem;
    color: #173831;
    margin-bottom: 18px;
    line-height: 1;
}

.pillar-card h3 {
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.16;
    color: #16352f;
    margin-bottom: 12px;
    letter-spacing: -0.03em;
}

.pillar-card p {
    color: #4f5d69;
    font-size: 0.89rem;
    line-height: 1.46;
    margin: 0;
}

.pillar-icon i {
    display: inline-block;
    color: #16352f;
}

/* Floating Card over Image */
.image-wrapper-premium {
    position: relative;
    border-radius: 28px;
    box-shadow: none;
}

.image-wrapper-premium img {
    border-radius: 22px;
    width: 100%;
}

.architecture-visual {
    padding: 14px;
    border-radius: 30px;
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(251,249,246,0.96));
    border: 2px solid rgba(194, 165, 120, 0.62);
    box-shadow: 0 16px 34px rgba(101, 78, 45, 0.08);
}

.floating-card {
    position: absolute;
    bottom: 18px;
    left: -10px;
    background: rgba(255,255,255,0.98);
    color: #21352f;
    padding: 12px 22px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 0.95rem;
    border: 1px solid rgba(194, 165, 120, 0.32);
    box-shadow: 0 10px 22px rgba(82, 65, 42, 0.12);
}

.floating-card i {
    color: var(--root-accent);
    font-size: 0.95rem;
}

@media (max-width: 991px) {
    .architecture-row {
        --bs-gutter-x: 1.8rem;
    }

    .section-architecture .section-heading {
        max-width: none;
        white-space: normal;
    }

    .architecture-pillars {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .pillar-card,
    .pillar-card:first-child,
    .pillar-card:last-child {
        border-left: 0;
        padding: 0;
        text-align: left;
    }

    .floating-card {
        left: 16px;
    }
}

@media (max-width: 767px) {
    .section-architecture {
        padding-top: 64px;
        padding-bottom: 68px;
    }

    .architecture-copy {
        margin-bottom: 28px;
    }

    .pillar-icon {
        width: 60px;
        height: 60px;
        font-size: 2.4rem;
    }

    .architecture-visual {
        padding: 10px;
        border-radius: 22px;
    }

    .floating-card {
        position: static;
        width: fit-content;
        margin-top: 14px;
    }
}

/* ---------------- CORE PRINCIPLES (Fixed Glassmorphism) ---------------- */
.bg-soft-blue {
    background:
        radial-gradient(circle at 14% 88%, rgba(53, 133, 114, 0.2), transparent 24%),
        radial-gradient(circle at 88% 8%, rgba(194, 165, 120, 0.1), transparent 18%),
        linear-gradient(90deg, #124a45 0%, #114a45 32%, #16504a 65%, #28574f 100%) !important;
    color: #ffffff;
    padding-top: 88px;
    padding-bottom: 86px;
}

.phase-head {
    max-width: 760px;
    margin: 0 auto 46px;
}

.bg-soft-blue .sub-title {
    color: rgba(255,255,255,0.8);
    margin-bottom: 14px;
}

.bg-soft-blue .sub-title::before {
    background: rgba(194, 165, 120, 0.9);
}

.phase-title {
    color: #f4eee5;
    font-size: clamp(2.8rem, 3.8vw, 3.95rem);
    line-height: 0.96;
    letter-spacing: -0.05em;
    margin-bottom: 12px;
}

.phase-subtitle {
    color: rgba(255,255,255,0.8);
    font-size: 0.9rem;
    line-height: 1.5;
    margin: 0 auto;
    max-width: 460px;
}

.phase-grid {
    --bs-gutter-x: 1.2rem;
}

.phase-card {
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 250px;
    border-radius: 22px;
    padding: 22px 18px 18px;
    border: 1px solid rgba(194, 165, 120, 0.14);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 16px 34px rgba(7, 18, 16, 0.16);
    transition: transform 0.24s ease, border-color 0.24s ease, background 0.24s ease;
}

.phase-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 12%, rgba(255,255,255,0.05), transparent 18%),
        linear-gradient(180deg, rgba(8, 17, 15, 0.08) 0%, rgba(8, 17, 15, 0.18) 32%, rgba(8, 17, 15, 0.64) 100%);
    z-index: 0;
}

.phase-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    opacity: 1;
    z-index: 0;
    transform: none;
}

.phase-card-1 {
    background:
        linear-gradient(180deg, #173b35 0%, #102a26 100%);
}

.phase-card-2 {
    background:
        linear-gradient(180deg, #153445 0%, #102532 100%);
}

.phase-card-3 {
    background:
        linear-gradient(180deg, #5f4b39 0%, #473727 100%);
}

.phase-card-4 {
    background:
        linear-gradient(180deg, #315a51 0%, #24463f 100%);
}

.phase-card-1::after {
    background:
        radial-gradient(circle, rgba(223, 190, 145, 0.42) 0 43%, transparent 46%) 53% 38% / 36% 36% no-repeat,
        radial-gradient(circle, transparent 0 61%, rgba(198, 166, 123, 0.45) 63%, rgba(198, 166, 123, 0.45) 67%, transparent 69%) 53% 38% / 46% 46% no-repeat,
        linear-gradient(45deg, transparent 42%, rgba(146, 111, 74, 0.65) 43%, rgba(146, 111, 74, 0.65) 56%, transparent 57%) 83% 78% / 24% 24% no-repeat,
        radial-gradient(circle, rgba(226, 241, 239, 0.22) 0 22%, transparent 25%) 72% 18% / 5px 5px no-repeat,
        radial-gradient(circle, rgba(226, 241, 239, 0.16) 0 22%, transparent 25%) 78% 24% / 4px 4px no-repeat,
        radial-gradient(circle, rgba(226, 241, 239, 0.14) 0 22%, transparent 25%) 66% 30% / 4px 4px no-repeat,
        linear-gradient(rgba(111, 188, 172, 0.18), rgba(111, 188, 172, 0.18)) 72% 20% / 10% 1px no-repeat,
        linear-gradient(rgba(111, 188, 172, 0.14), rgba(111, 188, 172, 0.14)) 68% 28% / 14% 1px no-repeat,
        radial-gradient(circle at 78% 24%, rgba(255,255,255,0.08), transparent 18%),
        radial-gradient(circle at 82% 22%, rgba(255,255,255,0.06) 0 1px, transparent 1.5px),
        radial-gradient(circle at 74% 28%, rgba(255,255,255,0.05) 0 1px, transparent 1.5px);
}

.phase-card-2::after {
    background:
        radial-gradient(ellipse, rgba(103, 175, 197, 0.3) 0 44%, transparent 48%) 62% 38% / 54% 38% no-repeat,
        radial-gradient(ellipse, transparent 0 58%, rgba(121, 194, 214, 0.18) 60%, transparent 63%) 62% 38% / 58% 42% no-repeat,
        radial-gradient(ellipse, transparent 0 68%, rgba(121, 194, 214, 0.14) 70%, transparent 73%) 62% 38% / 62% 46% no-repeat,
        linear-gradient(rgba(129, 184, 208, 0.12), rgba(129, 184, 208, 0.12)) 10% 26% / 78% 1px no-repeat,
        linear-gradient(rgba(129, 184, 208, 0.12), rgba(129, 184, 208, 0.12)) 8% 32% / 86% 1px no-repeat,
        linear-gradient(rgba(129, 184, 208, 0.1), rgba(129, 184, 208, 0.1)) 6% 38% / 88% 1px no-repeat,
        linear-gradient(rgba(129, 184, 208, 0.06), rgba(129, 184, 208, 0.06)) 56% 80% / 26% 1px no-repeat,
        linear-gradient(rgba(129, 184, 208, 0.06), rgba(129, 184, 208, 0.06)) 56% 84% / 26% 1px no-repeat,
        linear-gradient(rgba(129, 184, 208, 0.06), rgba(129, 184, 208, 0.06)) 56% 88% / 26% 1px no-repeat;
}

.phase-card-3::after {
    background:
        radial-gradient(ellipse, rgba(251, 226, 192, 0.28) 0 34%, transparent 38%) 72% 22% / 50% 20% no-repeat,
        radial-gradient(ellipse, rgba(112, 71, 39, 0.44) 0 36%, transparent 40%) 70% 26% / 68% 32% no-repeat,
        linear-gradient(168deg, transparent 38%, rgba(126, 81, 48, 0.48) 39%, rgba(240, 206, 164, 0.18) 58%, transparent 59%) 78% 20% / 84% 42% no-repeat,
        linear-gradient(190deg, transparent 34%, rgba(120, 79, 49, 0.4) 35%, rgba(232, 194, 150, 0.16) 54%, transparent 55%) 76% 32% / 78% 44% no-repeat;
}

.phase-card-4::after {
    background:
        radial-gradient(circle, rgba(40, 56, 51, 0.9) 0 48%, transparent 51%) 60% 24% / 10% 10% no-repeat,
        radial-gradient(circle, rgba(58, 79, 72, 0.78) 0 48%, transparent 51%) 74% 22% / 12% 12% no-repeat,
        radial-gradient(circle, rgba(79, 102, 93, 0.7) 0 48%, transparent 51%) 86% 28% / 9% 9% no-repeat,
        radial-gradient(circle, rgba(44, 63, 57, 0.75) 0 48%, transparent 51%) 49% 29% / 7% 7% no-repeat,
        linear-gradient(rgba(40, 56, 51, 0.82), rgba(40, 56, 51, 0.82)) 57% 42% / 16% 24% no-repeat,
        linear-gradient(rgba(58, 79, 72, 0.72), rgba(58, 79, 72, 0.72)) 70% 42% / 19% 27% no-repeat,
        linear-gradient(rgba(79, 102, 93, 0.64), rgba(79, 102, 93, 0.64)) 83% 48% / 12% 20% no-repeat,
        linear-gradient(rgba(44, 63, 57, 0.68), rgba(44, 63, 57, 0.68)) 46% 48% / 10% 18% no-repeat;
}

.phase-card:hover {
    transform: translateY(-3px);
    border-color: var(--root-accent);
}

.phase-number {
    position: absolute;
    top: 14px;
    right: 16px;
    font-family: var(--font-serif);
    font-size: 4.8rem;
    font-weight: 700;
    color: rgba(228, 194, 151, 0.92);
    line-height: 1;
    z-index: 2;
    text-shadow:
        0 2px 12px rgba(26, 17, 8, 0.12),
        0 0 1px rgba(255, 232, 205, 0.35);
}

.phase-icon {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    font-size: 1.9rem;
    color: #ffffff;
    margin-bottom: 14px;
    line-height: 1;
}

.phase-icon i {
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.16));
}

.phase-card h4 {
    position: relative;
    z-index: 2;
    color: #ffffff;
    font-family: var(--font-sans);
    font-size: 0.96rem;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.02em;
    margin-bottom: 10px;
    max-width: 12ch;
}

.phase-card p {
    position: relative;
    z-index: 2;
    color: rgba(255,255,255,0.88);
    font-size: 0.82rem;
    line-height: 1.5;
    max-width: 21ch;
    margin-bottom: 0;
    text-shadow: 0 1px 8px rgba(8, 15, 14, 0.32);
}

.phase-line {
    position: relative;
    z-index: 2;
    width: 30px;
    height: 2px;
    background: var(--root-accent);
    margin-top: 14px;
    opacity: 0.82;
}

@media (max-width: 991px) {
    .phase-grid {
        --bs-gutter-x: 1rem;
    }

    .phase-card {
        min-height: 280px;
    }
}

@media (max-width: 767px) {
    .bg-soft-blue {
        padding-top: 62px;
        padding-bottom: 62px;
    }

    .phase-head {
        margin-bottom: 28px;
    }

    .phase-card {
        min-height: auto;
        padding: 26px 20px 22px;
        border-radius: 22px;
    }

    .phase-number {
        top: 16px;
        right: 16px;
        font-size: 4rem;
    }

    .phase-title {
        font-size: clamp(2.5rem, 10vw, 3.25rem);
    }

    .phase-subtitle {
        max-width: 100%;
    }
}

/* ---------------- PHILOSOPHY SECTION ---------------- */
.section-philosophy {
    background:
        radial-gradient(circle at 16% 12%, rgba(194, 165, 120, 0.08), transparent 28%),
        radial-gradient(circle at 88% 18%, rgba(194, 165, 120, 0.05), transparent 24%),
        linear-gradient(180deg, #fcfcf8 0%, #ffffff 100%);
}

.philosophy-row {
    --bs-gutter-x: 3.6rem;
}

.signal-visual {
    position: relative;
    border-radius: 28px;
    overflow: hidden;
    background: #102a30;
    box-shadow: 0 18px 42px rgba(19, 42, 44, 0.16);
}

.signal-visual-image {
    display: block;
    width: 100%;
    min-height: 560px;
    object-fit: cover;
}

.signal-tag {
    position: absolute;
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 8px 16px;
    border-radius: 12px;
    background: #e8d3a7;
    color: #2f3b34;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    box-shadow: 0 8px 18px rgba(45, 39, 28, 0.18);
}

.signal-tag::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 40px;
    height: 1px;
    background: rgba(232, 211, 167, 0.95);
}

.signal-tag-left-top {
    top: 28%;
    left: 26px;
}

.signal-tag-left-top::after {
    left: 100%;
    transform: translateY(-50%);
}

.signal-tag-left-bottom {
    top: 58%;
    left: 18px;
}

.signal-tag-left-bottom::after {
    left: 100%;
    transform: translateY(-50%);
    width: 54px;
}

.signal-tag-right-top {
    top: 25%;
    right: 22px;
}

.signal-tag-right-top::after {
    right: 100%;
    transform: translateY(-50%);
}

.signal-tag-right-middle {
    top: 50%;
    right: 26px;
}

.signal-tag-right-middle::after {
    right: 100%;
    transform: translateY(-50%);
    width: 52px;
}

.signal-tag-right-bottom {
    top: 73%;
    right: 20px;
}

.signal-tag-right-bottom::after {
    right: 100%;
    transform: translateY(-50%);
    width: 46px;
}

.section-philosophy .section-label {
    margin-bottom: 18px;
}

.section-philosophy .section-heading {
    color: var(--root-dark);
    font-size: clamp(2.9rem, 4vw, 4.2rem);
    line-height: 0.95;
    letter-spacing: -0.055em;
    margin-bottom: 20px;
}

.philosophy-copy {
    color: #5c6471;
    font-size: 1rem;
    line-height: 1.72;
    margin-bottom: 30px;
}

.medical-list li {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
}

.list-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(194, 165, 120, 0.16);
    color: #8f7a57;
    border: 1px solid rgba(194, 165, 120, 0.3);
    font-size: 1rem;
    margin-top: 2px;
}

.medical-list strong {
    display: block;
    color: #16352f;
    font-size: 1rem;
    font-weight: 800;
    margin-bottom: 6px;
    letter-spacing: -0.02em;
}

.medical-list span {
    display: block;
    color: #6c737d;
    font-size: 0.96rem;
    line-height: 1.7;
}

@media (max-width: 991px) {
    .philosophy-row {
        --bs-gutter-x: 1.8rem;
    }

    .signal-visual-image {
        min-height: 480px;
    }
}

@media (max-width: 767px) {
    .signal-visual {
        border-radius: 22px;
    }

    .signal-visual-image {
        min-height: 420px;
    }

    .signal-tag {
        min-height: 34px;
        padding: 6px 10px;
        font-size: 0.62rem;
        border-radius: 10px;
    }

    .signal-tag::after {
        width: 24px;
    }

    .signal-tag-left-top {
        top: 24%;
        left: 12px;
    }

    .signal-tag-left-bottom {
        top: 56%;
        left: 12px;
    }

    .signal-tag-right-top {
        top: 21%;
        right: 12px;
    }

    .signal-tag-right-middle {
        top: 48%;
        right: 12px;
    }

    .signal-tag-right-bottom {
        top: 71%;
        right: 12px;
    }

    .section-philosophy .section-heading {
        font-size: clamp(2.3rem, 10vw, 3.2rem);
    }
}

/* ---------------- QUOTE SECTION & DOCTOR IMAGE (FIXED) ---------------- */
.quote-section {
    background:
        radial-gradient(circle at 12% 50%, rgba(31, 94, 83, 0.26), transparent 30%),
        radial-gradient(circle at 86% 16%, rgba(194, 165, 120, 0.08), transparent 18%),
        linear-gradient(90deg, #123e39 0%, #11443f 38%, #154744 72%, #1a4942 100%);
    color: #fff;
    padding: 0;
}

.quote-section .container {
    position: relative;
    z-index: 1;
}

.quote-wrapper {
    max-width: 980px;
    margin: 0 auto;
    padding: 78px 24px 74px;
    text-align: center;
}

.quote-text {
    max-width: 18ch;
    margin: 0 auto 20px;
    color: #f4eee4;
    font-family: var(--font-serif);
    font-size: clamp(2.7rem, 4.4vw, 4.8rem);
    line-height: 1.02;
    letter-spacing: -0.05em;
    text-wrap: balance;
}

.quote-footer,
.quote-author span {
    display: block;
    color: rgba(244, 238, 228, 0.76);
    font-size: 1rem;
    line-height: 1.6;
}

.quote-author h5 {
    margin: 0 0 6px;
    color: #f4eee4;
    font-size: 1rem;
    font-weight: 700;
}

@media (max-width: 991px) {
    .quote-wrapper {
        max-width: 860px;
        padding: 64px 22px 60px;
    }

    .quote-text {
        max-width: 20ch;
        font-size: clamp(2.3rem, 6vw, 3.6rem);
    }
}

@media (max-width: 767px) {
    .quote-wrapper {
        padding: 52px 18px 48px;
    }

    .quote-text {
        max-width: none;
        font-size: clamp(2rem, 10vw, 2.85rem);
        line-height: 1.06;
    }

    .quote-footer,
    .quote-author span,
    .quote-author h5 {
        font-size: 0.94rem;
    }
}

/* ---------------- STORIES PAGES ---------------- */
.stories-page .stories-hero {
    min-height: 390px;
    padding: 0;
    background:
        radial-gradient(circle at 91% 36%, rgba(53, 137, 125, 0.46) 0 70px, transparent 72px),
        radial-gradient(circle at 86% 73%, rgba(150, 139, 86, 0.45) 0 66px, transparent 68px),
        linear-gradient(90deg, transparent 0 45.4%, #022f27 45.4%, #011c17 100%);
    border-bottom: 4px solid #ffffff;
}

.stories-page .stories-hero::before,
.stories-page .stories-hero::after {
    display: none;
}

.stories-page .stories-hero .page-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: #d8e7ef;
}

.stories-page .stories-hero .page-hero-bg img {
    position: absolute;
    top: 0;
    left: 0;
    width: 45.4%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    opacity: 0.72;
}

.stories-page .stories-hero .page-hero-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(218, 235, 245, 0.52) 0 45.4%, transparent 45.4%),
        linear-gradient(90deg, transparent 0 45.4%, #022f27 45.4%, #011c17 100%);
    pointer-events: none;
}

.stories-page .stories-hero .page-hero-overlay {
    z-index: 1;
    background:
        radial-gradient(circle at 76% 17%, rgba(58, 204, 128, 0.9) 0 3px, transparent 4px),
        radial-gradient(circle at 79% 20%, rgba(58, 204, 128, 0.86) 0 3px, transparent 4px),
        radial-gradient(circle at 68% 29%, rgba(58, 204, 128, 0.56) 0 2px, transparent 3px),
        radial-gradient(circle at 72% 39%, rgba(58, 204, 128, 0.7) 0 2px, transparent 3px),
        radial-gradient(circle at 67% 64%, rgba(58, 204, 128, 0.8) 0 3px, transparent 4px),
        radial-gradient(circle at 83% 64%, rgba(167, 154, 94, 0.54) 0 2px, transparent 3px),
        radial-gradient(circle at 96% 33%, rgba(68, 150, 138, 0.5) 0 1.5px, transparent 2.5px);
    background-size: auto;
}

.stories-page .stories-hero .container {
    position: relative;
    z-index: 2;
}

.stories-page .stories-hero .page-hero-content {
    max-width: 760px;
    padding: 52px 0 0;
}

.stories-page .stories-hero .hero-badge {
    position: absolute;
    top: -14px;
    left: 12px;
    display: inline-flex !important;
    align-items: center;
    min-height: 36px;
    padding: 0 52px;
    margin-bottom: 0;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.48);
    background: rgba(255, 255, 255, 0.36);
    color: rgba(255, 255, 255, 0.88);
    font-family: var(--font-sans);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    box-shadow: 0 10px 24px rgba(255, 255, 255, 0.18);
}

.stories-page .stories-hero .hero-title {
    color: #d6b879;
    font-size: clamp(4.2rem, 4.9vw, 5.5rem);
    line-height: 0.86;
    letter-spacing: -0.055em;
    margin: 12px 0 22px;
    max-width: 560px;
}

.stories-page .stories-hero .hero-title span {
    color: #cbb37f;
}

.stories-page .stories-hero .hero-subtitle {
    display: block !important;
    max-width: 760px;
    margin: 0 0 18px;
    color: rgba(255, 255, 255, 0.96);
    font-size: clamp(1.15rem, 1.24vw, 1.45rem);
    line-height: 1.42;
    font-weight: 400;
}

.stories-page .story-card {
    min-height: 365px;
    padding: 30px 28px 24px;
    border: 1px solid rgba(210, 188, 128, 0.36);
    border-bottom: 1px solid rgba(210, 188, 128, 0.5);
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background:
        radial-gradient(circle at 88% 14%, rgba(220, 188, 122, 0.18), transparent 20%),
        radial-gradient(circle at 82% 88%, rgba(94, 199, 126, 0.14), transparent 20%),
        linear-gradient(145deg, rgba(28, 68, 58, 0.92), rgba(8, 35, 31, 0.96));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 22px 42px rgba(5, 18, 16, 0.28);
}

.stories-page .story-card::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(6, 20, 18, 0.24)),
        radial-gradient(circle at 94% 16%, rgba(227, 204, 148, 0.72) 0 38px, transparent 40px),
        radial-gradient(circle at 90% 18%, rgba(106, 77, 46, 0.45) 0 20px, transparent 22px);
    opacity: 1;
}

.stories-page .story-card::after {
    background:
        linear-gradient(90deg, rgba(232, 211, 154, 0.32) 0 7px, transparent 7px 14px, rgba(232, 211, 154, 0.22) 14px 22px, transparent 22px 30px) 86% 88% / 96px 46px no-repeat,
        linear-gradient(180deg, transparent 0 34px, rgba(232, 211, 154, 0.2) 35px, transparent 36px) 86% 88% / 96px 46px no-repeat,
        radial-gradient(circle at 83% 15%, rgba(238, 215, 157, 0.62) 0 42px, transparent 44px),
        radial-gradient(ellipse at 82% 15%, rgba(80, 48, 28, 0.45) 0 22%, transparent 24%),
        repeating-radial-gradient(ellipse at 84% 16%, rgba(74, 51, 34, 0.34) 0 2px, transparent 3px 7px);
    opacity: 0.82;
}

.stories-page .story-meta {
    position: relative;
    z-index: 2;
    max-width: 88%;
    font-size: 0.9rem;
    background: rgba(255, 255, 255, 0.05);
    padding: 12px 15px;
    border-radius: 8px;
    margin-bottom: 16px;
    color: rgba(241, 238, 222, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(8px);
}

.stories-page .story-meta strong {
    color: #ffffff;
    font-weight: 800;
}

.stories-page .clinical-insight {
    position: relative;
    z-index: 2;
    border-left: 4px solid #82d989;
    padding: 2px 0 2px 16px;
    margin-top: 18px;
    font-style: normal;
}

.stories-page .clinical-insight small {
    color: #94cf8c !important;
    letter-spacing: 0.05em;
}

.stories-page .clinical-insight p {
    max-width: 36ch;
    color: rgba(241, 238, 222, 0.78) !important;
    font-size: 0.92rem;
    line-height: 1.58;
}

.stories-card-button {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 22px;
    border-radius: 999px;
    border: 1px solid rgba(216, 193, 141, 0.76);
    color: #fffdf4;
    background: linear-gradient(135deg, #06251f 0%, #0a4b43 100%);
    font-size: 0.9rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 10px 22px rgba(5, 18, 16, 0.28);
    transition: transform 0.2s ease, filter 0.2s ease;
}

.stories-card-button:hover {
    color: #fffdf4;
    transform: translateY(-1px);
    border-color: rgba(216, 193, 141, 0.95);
    filter: brightness(1.06);
}

.stories-page .story-card .phase-number {
    display: none;
}

.stories-page .story-card .phase-icon {
    width: 34px;
    height: 34px;
    margin-bottom: 22px;
    color: #d9bd7b;
    font-size: 1.75rem;
}

.stories-page .story-card h4 {
    max-width: 21ch;
    margin-bottom: 14px;
    color: #f4eee5;
    font-family: var(--font-serif);
    font-size: clamp(1.32rem, 1.55vw, 1.72rem);
    line-height: 1.08;
    letter-spacing: -0.035em;
}

.stories-page .story-card .phase-line {
    display: none;
}

.stories-page .story-card .mt-4::before {
    content: "INSIGHT";
    position: relative;
    z-index: 2;
    display: block;
    margin-bottom: 12px;
    color: #d0b475;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.stories-page .image-wrapper-premium {
    box-shadow: 0 18px 36px rgba(16, 33, 29, 0.08);
}

.stories-page .bg-soft-blue .row.g-4 {
    --bs-gutter-x: 1.6rem;
    --bs-gutter-y: 1.8rem;
}

.stories-page .bg-soft-blue {
    background:
        radial-gradient(circle at 10% 18%, rgba(69, 148, 118, 0.22), transparent 26%),
        radial-gradient(circle at 88% 80%, rgba(194, 165, 120, 0.14), transparent 24%),
        linear-gradient(135deg, #09271f 0%, #123b32 44%, #0b2a24 100%) !important;
}

.stories-page .stories-responsible-care {
    position: relative;
    overflow: hidden;
    min-height: 720px;
    padding: 82px 0 76px;
    color: #18312c;
    background:
        linear-gradient(90deg, rgba(253, 249, 237, 0.98) 0%, rgba(253, 249, 237, 0.92) 32%, rgba(253, 249, 237, 0.56) 52%, rgba(253, 249, 237, 0.08) 72%),
        linear-gradient(180deg, rgba(9, 39, 31, 0.22), rgba(9, 39, 31, 0)),
        url("../../img/about/review-report.avif") right center / cover no-repeat !important;
}

.stories-page .stories-responsible-care::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 16% 12%, rgba(194, 165, 120, 0.12), transparent 22%),
        linear-gradient(180deg, rgba(10, 35, 31, 0.2) 0, transparent 72px, transparent calc(100% - 72px), rgba(10, 35, 31, 0.18) 100%);
    pointer-events: none;
}

.stories-page .stories-responsible-care::after {
    content: "";
    position: absolute;
    top: -120px;
    right: -80px;
    width: 440px;
    height: 300px;
    opacity: 0.16;
    background:
        repeating-linear-gradient(12deg, transparent 0 32px, rgba(16, 46, 40, 0.34) 33px 35px, transparent 36px 66px),
        radial-gradient(ellipse at 55% 44%, transparent 0 58%, rgba(16, 46, 40, 0.44) 59%, transparent 61%);
    pointer-events: none;
}

.stories-page .stories-responsible-care .container {
    position: relative;
    z-index: 2;
}

.stories-page .stories-responsible-care .section-label {
    color: #7a9b82;
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.stories-page .stories-responsible-care .section-label::before {
    display: none;
}

.stories-page .stories-responsible-care .section-heading {
    max-width: 12ch;
    margin-bottom: 18px;
    color: #173b31;
    font-size: clamp(2.9rem, 4.2vw, 4.7rem);
    line-height: 0.96;
    letter-spacing: -0.055em;
}

.stories-page .stories-responsible-care .lead-text {
    max-width: 600px;
    color: #44544f;
    font-size: 0.98rem;
    line-height: 1.52;
}

.stories-page .stories-responsible-care .medical-list {
    max-width: 690px;
    margin: 26px 0 0;
    padding: 0;
    list-style: none;
}

.stories-page .stories-responsible-care .medical-list li {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 18px;
    margin-bottom: 22px;
    align-items: start;
}

.stories-page .stories-responsible-care .list-icon {
    position: relative;
    width: 54px;
    height: 54px;
    border-radius: 12px;
    flex: 0 0 54px;
    background:
        radial-gradient(circle at 30% 24%, rgba(255, 255, 255, 0.18), transparent 30%),
        linear-gradient(145deg, #1c4b3f, #102f28);
    border: 1px solid rgba(194, 165, 120, 0.38);
    color: #d1b56f;
    box-shadow:
        0 12px 24px rgba(18, 48, 40, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.stories-page .stories-responsible-care .list-icon i {
    display: none;
}

.stories-page .stories-responsible-care .list-icon::before {
    content: "+";
    color: #d1b56f;
    font-family: var(--font-sans);
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1;
}

.stories-page .stories-responsible-care .medical-list li:nth-child(1) .list-icon::before {
    content: "◎";
}

.stories-page .stories-responsible-care .medical-list li:nth-child(2) .list-icon::before {
    content: "✺";
}

.stories-page .stories-responsible-care .medical-list li:nth-child(3) .list-icon::before {
    content: "▥";
}

.stories-page .stories-responsible-care .medical-list li:nth-child(4) .list-icon::before {
    content: "✓";
}

.stories-page .stories-responsible-care .list-icon i {
    color: #d1b56f;
    font-size: 1.35rem;
}

.stories-page .stories-responsible-care .medical-list strong {
    display: block;
    margin-bottom: 4px;
    color: #233c36;
    font-family: var(--font-sans);
    font-size: 1.08rem;
    font-weight: 850;
}

.stories-page .stories-responsible-care .medical-list span {
    color: #4d5c57;
    font-size: 0.9rem;
    line-height: 1.46;
}

.stories-page .stories-responsible-care .col-lg-6:last-child {
    display: none;
}

.stories-page .quote-section {
    position: relative;
    overflow: hidden;
    padding: 104px 0 104px;
    background:
        radial-gradient(circle at 50% 18%, rgba(84, 159, 130, 0.28), transparent 26%),
        radial-gradient(circle at 50% 50%, rgba(194, 165, 120, 0.08), transparent 22%),
        radial-gradient(circle at 8% 18%, rgba(194, 165, 120, 0.06), transparent 18%),
        radial-gradient(circle at 92% 82%, rgba(84, 159, 130, 0.1), transparent 18%),
        linear-gradient(90deg, #062720 0%, #0b3a31 48%, #06251f 100%);
}

.stories-page .quote-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.026) 0 1px, transparent 1px 100%) 0 0 / 150px 100%,
        linear-gradient(180deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 100%) 0 0 / 100% 96px,
        radial-gradient(circle at 50% 32%, rgba(255, 255, 255, 0.08), transparent 26%);
    opacity: 0.58;
    pointer-events: none;
}

.stories-page .quote-section::after {
    content: "";
    position: absolute;
    inset: 26px 34px;
    border-top: 1px solid rgba(213, 188, 126, 0.16);
    border-bottom: 1px solid rgba(213, 188, 126, 0.12);
    background:
        linear-gradient(90deg, rgba(213, 188, 126, 0.42), transparent 110px) left top / 210px 1px no-repeat,
        linear-gradient(270deg, rgba(213, 188, 126, 0.42), transparent 110px) right bottom / 210px 1px no-repeat;
    pointer-events: none;
}

.stories-page .quote-wrapper {
    position: relative;
    z-index: 2;
    max-width: 820px;
    margin: 0 auto;
    padding: 0;
    background: transparent;
    box-shadow: none;
    border: 0;
}

.stories-page .quote-wrapper::after {
    content: "“";
    position: absolute;
    top: 22px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(213, 188, 126, 0.08);
    font-family: var(--font-serif);
    font-size: 12rem;
    line-height: 1;
    pointer-events: none;
}

.stories-page .quote-wrapper::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    margin: 0 auto 26px;
    border-right: 1px solid rgba(213, 188, 126, 0.86);
    border-bottom: 1px solid rgba(213, 188, 126, 0.86);
    transform: rotate(45deg);
}

.stories-page .quote-text {
    position: relative;
    z-index: 2;
    max-width: 760px;
    margin: 0 auto 34px;
    color: #d8bd7d;
    font-family: var(--font-serif);
    font-size: clamp(1.8rem, 2.42vw, 2.75rem);
    line-height: 1.28;
    letter-spacing: -0.03em;
    text-shadow:
        0 8px 22px rgba(3, 18, 15, 0.24),
        0 0 26px rgba(213, 188, 126, 0.08);
}

.stories-page .quote-footer {
    position: relative;
    z-index: 2;
    display: inline-flex;
    justify-content: center;
    padding-top: 20px;
    color: rgba(213, 202, 168, 0.68);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.stories-page .quote-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 340px;
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, rgba(213, 188, 126, 0.38), transparent);
}

.stories-page .stories-case-journeys {
    position: relative;
    overflow: hidden;
    padding: 96px 0 92px;
    background:
        radial-gradient(circle at 8% 18%, rgba(194, 165, 120, 0.12), transparent 23%),
        radial-gradient(circle at 88% 72%, rgba(194, 165, 120, 0.1), transparent 20%),
        linear-gradient(90deg, #fffaf0 0%, #fcf6e9 48%, #fffaf0 100%);
    border-top: 8px solid #092f27;
}

.stories-page .stories-case-journeys::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -70px;
    width: 430px;
    height: 260px;
    opacity: 0.14;
    background:
        repeating-linear-gradient(18deg, transparent 0 28px, rgba(24, 67, 60, 0.38) 29px 31px, transparent 32px 58px),
        radial-gradient(ellipse at 56% 42%, transparent 0 58%, rgba(24, 67, 60, 0.5) 59%, transparent 61%);
    transform: rotate(-10deg);
    pointer-events: none;
}

.stories-page .stories-case-row {
    --bs-gutter-x: 5.4rem;
    position: relative;
    z-index: 2;
}

@media (min-width: 1200px) {
    .stories-page .stories-case-row > [class*="col-"]:first-child {
        flex: 0 0 51%;
        max-width: 51%;
    }

    .stories-page .stories-case-row > [class*="col-"]:last-child {
        flex: 0 0 49%;
        max-width: 49%;
    }
}

.stories-page .stories-case-journeys .section-label {
    color: #073d36;
    font-family: var(--font-sans);
    font-size: 0.86rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 22px;
}

.stories-page .stories-case-journeys .section-label::before {
    display: none;
}

.stories-page .stories-case-journeys .section-heading {
    max-width: none;
    margin-bottom: 24px;
    color: #102e28;
    font-size: clamp(3.55rem, 4.7vw, 5.45rem);
    line-height: 0.92;
    letter-spacing: -0.06em;
    white-space: nowrap;
}

.stories-page .stories-case-intro,
.stories-page .stories-case-copy {
    max-width: 770px;
    color: #153832;
    font-size: clamp(1.08rem, 1.18vw, 1.28rem);
    line-height: 1.56;
}

.stories-page .stories-case-intro {
    margin-bottom: 24px;
    font-weight: 500;
}

.stories-page .stories-case-copy {
    margin: 26px 0 0;
}

.stories-page .stories-case-journeys .highlight-box {
    position: relative;
    max-width: 760px;
    margin: 28px 0 30px;
    padding: 22px 26px 22px 34px;
    border: 0;
    border-left: 5px solid #c5a162;
    border-radius: 0;
    background: linear-gradient(90deg, rgba(194, 165, 120, 0.17), rgba(255, 255, 255, 0.38) 78%, rgba(255, 255, 255, 0));
    color: #102e28;
    box-shadow: none;
}

.stories-page .stories-case-journeys .highlight-box p {
    color: #102e28;
    font-size: clamp(1.03rem, 1.08vw, 1.16rem);
    font-style: normal;
    line-height: 1.5;
}

.stories-page .stories-case-image {
    position: relative;
    overflow: hidden;
    padding: 10px;
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(184, 152, 94, 0.94), rgba(244, 231, 191, 0.8), rgba(154, 130, 84, 0.94));
    box-shadow:
        0 28px 58px rgba(42, 51, 44, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.34),
        0 0 0 1px rgba(194, 165, 120, 0.34);
}

.stories-page .stories-case-image::before {
    content: "";
    position: absolute;
    inset: 16px;
    z-index: 2;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.32);
    pointer-events: none;
}

.stories-page .stories-case-image img {
    display: block;
    width: 100%;
    aspect-ratio: 1.54 / 1;
    object-fit: cover;
    border-radius: 20px;
    filter: saturate(0.92) contrast(0.98) brightness(1.04);
}

@media (max-width: 991px) {
    .stories-page .stories-responsible-care {
        min-height: auto;
        padding: 68px 0;
        background:
            linear-gradient(90deg, rgba(253, 249, 237, 0.97), rgba(253, 249, 237, 0.88)),
            url("../../img/about/review-report.avif") center / cover no-repeat !important;
    }

    .stories-page .stories-responsible-care .section-heading {
        max-width: none;
    }

    .stories-page .stories-case-journeys {
        padding: 68px 0 72px;
    }

    .stories-page .stories-case-row {
        --bs-gutter-x: 1.5rem;
        row-gap: 34px;
    }

    .stories-page .stories-case-journeys .section-heading {
        max-width: none;
        white-space: normal;
    }
}

@media (max-width: 767px) {
    .stories-page .stories-case-journeys {
        padding: 54px 0 58px;
    }

    .stories-page .stories-case-journeys .section-heading {
        font-size: clamp(2.35rem, 10vw, 3.2rem);
    }

    .stories-page .stories-case-intro,
    .stories-page .stories-case-copy {
        font-size: 0.96rem;
    }

    .stories-page .stories-case-journeys .highlight-box {
        padding: 16px 18px 16px 20px;
    }

    .stories-page .stories-case-image {
        border-radius: 20px;
        padding: 6px;
    }

    .stories-page .stories-case-image img {
        border-radius: 15px;
    }
}

@media (max-width: 991px) {
    .stories-page .stories-hero {
        min-height: auto;
        background:
            radial-gradient(circle at 86% 26%, rgba(53, 137, 125, 0.38) 0 62px, transparent 64px),
            linear-gradient(90deg, rgba(2, 47, 39, 0.35) 0%, #022f27 100%);
    }

    .stories-page .stories-hero .page-hero-bg img {
        width: 100%;
        opacity: 0.38;
    }

    .stories-page .stories-hero .page-hero-bg::after {
        background: linear-gradient(90deg, rgba(10, 43, 38, 0.5), rgba(2, 47, 39, 0.94));
    }

    .stories-page .stories-hero .page-hero-content {
        max-width: 620px;
        padding: 58px 0 44px;
    }
}

@media (max-width: 767px) {
    .stories-page .stories-hero .page-hero-bg img {
        width: 100%;
        opacity: 0.3;
    }

    .stories-page .stories-hero .page-hero-content {
        padding: 52px 0 34px;
    }

    .stories-page .stories-hero .hero-badge {
        top: -10px;
        left: 12px;
        min-height: 30px;
        padding: 0 22px;
        font-size: 0.68rem;
    }

    .stories-page .stories-hero .hero-title {
        max-width: 420px;
        font-size: clamp(3rem, 14vw, 4.25rem);
        line-height: 0.88;
    }

    .stories-page .stories-hero .hero-subtitle {
        max-width: 100%;
        font-size: 1rem;
        line-height: 1.45;
    }
}

/* Final patient stories hero: no photo background, matches requested dark science banner */
.stories-page .stories-hero {
    min-height: 292px;
    padding: 0;
    background:
        radial-gradient(circle at 78% 34%, rgba(39, 255, 127, 0.2) 0 2px, transparent 3px),
        radial-gradient(circle at 74% 15%, rgba(39, 255, 127, 0.82) 0 2px, transparent 3px),
        radial-gradient(circle at 66% 43%, rgba(39, 255, 127, 0.72) 0 2px, transparent 3px),
        radial-gradient(circle at 90% 24%, rgba(92, 220, 206, 0.34) 0 38px, transparent 40px),
        radial-gradient(circle at 96% 78%, rgba(199, 168, 117, 0.32) 0 18px, transparent 20px),
        radial-gradient(circle at 86% 72%, rgba(92, 220, 206, 0.28) 0 26px, transparent 28px),
        radial-gradient(circle at 52% 36%, rgba(60, 207, 124, 0.16), transparent 20%),
        linear-gradient(90deg, #06231d 0%, #083a31 42%, #07352d 68%, #061f1b 100%);
    border-bottom: 4px solid #ffffff;
}

.stories-page .stories-hero::before {
    display: none;
}

.stories-page .stories-hero::after {
    display: none;
}

.stories-page .stories-hero .page-hero-bg,
.stories-page .stories-hero .page-hero-bg img,
.stories-page .stories-hero .page-hero-bg::after {
    display: none;
}

.stories-page .stories-hero .page-hero-overlay {
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(1, 20, 17, 0.08), transparent 48%, rgba(1, 20, 17, 0.18)),
        radial-gradient(circle at 70% 18%, rgba(47, 255, 130, 0.78) 0 2px, transparent 3px),
        radial-gradient(circle at 68% 31%, rgba(47, 255, 130, 0.6) 0 2px, transparent 3px),
        radial-gradient(circle at 76% 27%, rgba(47, 255, 130, 0.46) 0 1.5px, transparent 2.5px),
        radial-gradient(circle at 72% 52%, rgba(47, 255, 130, 0.36) 0 2px, transparent 3px),
        radial-gradient(circle at 84% 18%, rgba(213, 187, 124, 0.34) 0 1px, transparent 2px);
}

.stories-page .stories-hero-graphic {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(42vw, 620px);
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
}

.stories-page .stories-hero-graphic::before,
.stories-page .stories-hero-graphic::after {
    content: "";
    position: absolute;
    left: 12%;
    right: -8%;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(211, 188, 130, 0), rgba(211, 188, 130, 0.64), rgba(211, 188, 130, 0.1));
    box-shadow:
        0 48px 0 rgba(211, 188, 130, 0.58),
        0 96px 0 rgba(211, 188, 130, 0.5),
        0 144px 0 rgba(211, 188, 130, 0.42),
        0 192px 0 rgba(211, 188, 130, 0.34),
        0 240px 0 rgba(211, 188, 130, 0.26);
    transform: rotate(10deg);
}

.stories-page .stories-hero-graphic::before {
    top: 32px;
}

.stories-page .stories-hero-graphic::after {
    top: 78px;
    opacity: 0.52;
    transform: rotate(-8deg);
}

.stories-page .graphic-dna {
    position: absolute;
    top: -54px;
    right: 78px;
    width: 245px;
    height: 405px;
    transform: rotate(20deg);
    filter:
        drop-shadow(0 0 10px rgba(240, 211, 145, 0.72))
        drop-shadow(0 0 26px rgba(51, 219, 127, 0.18));
}

.stories-page .dna-rail {
    position: absolute;
    inset: 0;
    border-radius: 50%;
}

.stories-page .rail-one {
    background:
        radial-gradient(ellipse at 50% 50%, transparent 0 45%, rgba(235, 207, 143, 0.88) 46%, rgba(235, 207, 143, 0.88) 48%, transparent 49%),
        radial-gradient(circle, rgba(255, 238, 181, 0.92) 0 1px, transparent 1.6px) 0 0 / 8px 8px;
    clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
}

.stories-page .rail-two {
    background:
        radial-gradient(ellipse at 50% 50%, transparent 0 45%, rgba(235, 207, 143, 0.88) 46%, rgba(235, 207, 143, 0.88) 48%, transparent 49%),
        radial-gradient(circle, rgba(255, 238, 181, 0.9) 0 1px, transparent 1.6px) 0 0 / 8px 8px;
    clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%);
    transform: scaleX(-1);
}

.stories-page .dna-rungs {
    position: absolute;
    left: 30px;
    right: 30px;
    top: 24px;
    bottom: 24px;
    background:
        linear-gradient(12deg, transparent 0 44%, rgba(235, 207, 143, 0.82) 45%, rgba(235, 207, 143, 0.82) 47%, transparent 48%) 0 0 / 100% 39px,
        linear-gradient(-12deg, transparent 0 44%, rgba(235, 207, 143, 0.54) 45%, rgba(235, 207, 143, 0.54) 47%, transparent 48%) 0 18px / 100% 39px;
    border-radius: 50%;
    opacity: 0.92;
}

.stories-page .graphic-dna::before,
.stories-page .graphic-dna::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 245, 198, 1) 0 5%, rgba(235, 207, 143, 0.9) 6% 16%, transparent 42%);
    filter: blur(0.2px);
}

.stories-page .graphic-dna::before {
    width: 82px;
    height: 82px;
    top: 76px;
    right: -22px;
}

.stories-page .graphic-dna::after {
    width: 68px;
    height: 68px;
    left: -14px;
    bottom: 82px;
}

.stories-page .stories-hero-graphic::before,
.stories-page .stories-hero-graphic::after {
    display: none;
}

.stories-page .graphic-dna-svg {
    position: absolute;
    inset: -26px -12px -18px auto;
    width: min(38vw, 560px);
    height: calc(100% + 44px);
}

.stories-page .dna-strand path {
    fill: none;
    stroke: rgba(224, 199, 132, 0.88);
    stroke-width: 8;
    stroke-linecap: round;
    stroke-dasharray: 2 9;
}

.stories-page .dna-rungs-svg path {
    fill: none;
    stroke: rgba(224, 199, 132, 0.72);
    stroke-width: 4;
    stroke-linecap: round;
}

.stories-page .dna-dots circle {
    fill: #39dd86;
    filter: drop-shadow(0 0 8px rgba(57, 221, 134, 0.85));
}

.stories-page .cell-orbs circle {
    fill: rgba(104, 231, 217, 0.22);
    stroke: rgba(104, 231, 217, 0.18);
    stroke-width: 2;
}

.stories-page .stories-hero-graphic {
    display: none;
}

.stories-page .graphic-ring {
    position: absolute;
    border-radius: 50%;
    border: 8px solid rgba(98, 226, 207, 0.22);
    filter: drop-shadow(0 0 14px rgba(98, 226, 207, 0.16));
}

.stories-page .ring-one {
    top: 64px;
    right: -60px;
    width: 132px;
    height: 132px;
    transform: rotate(-10deg);
}

.stories-page .ring-two {
    top: 220px;
    right: 18px;
    width: 78px;
    height: 78px;
    border-width: 6px;
    opacity: 0.72;
    transform: rotate(-13deg);
}

.stories-page .graphic-orb {
    position: absolute;
    border-radius: 50%;
    background: rgba(69, 174, 159, 0.36);
    box-shadow: inset 0 0 22px rgba(113, 255, 222, 0.12), 0 0 22px rgba(38, 202, 153, 0.08);
}

.stories-page .orb-one {
    top: 46px;
    right: 92px;
    width: 96px;
    height: 96px;
}

.stories-page .orb-two {
    right: 170px;
    bottom: 66px;
    width: 68px;
    height: 68px;
    opacity: 0.82;
}

.stories-page .orb-three {
    right: 46px;
    bottom: 52px;
    width: 50px;
    height: 50px;
    background: rgba(211, 188, 128, 0.24);
}

.stories-page .graphic-node {
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #35d984;
    box-shadow:
        0 0 0 7px rgba(53, 217, 132, 0.08),
        0 0 18px rgba(53, 217, 132, 0.72);
}

.stories-page .graphic-node::before,
.stories-page .graphic-node::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 86px;
    height: 1px;
    background: linear-gradient(90deg, rgba(53, 217, 132, 0.58), rgba(211, 188, 128, 0.18));
    transform-origin: left center;
}

.stories-page .graphic-node::before {
    left: 10px;
    transform: rotate(-22deg);
}

.stories-page .graphic-node::after {
    left: 10px;
    transform: rotate(24deg);
}

.stories-page .node-one {
    top: 82px;
    left: 8%;
}

.stories-page .node-two {
    top: 164px;
    left: 2%;
    width: 9px;
    height: 9px;
    opacity: 0.72;
}

.stories-page .node-three {
    bottom: 80px;
    left: 15%;
    width: 10px;
    height: 10px;
    background: #d5bc7e;
    box-shadow:
        0 0 0 7px rgba(213, 188, 126, 0.08),
        0 0 18px rgba(213, 188, 126, 0.58);
}

.stories-page .graphic-spark {
    position: absolute;
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: rgba(239, 232, 215, 0.88);
    box-shadow:
        22px 18px 0 rgba(53, 217, 132, 0.74),
        -18px 42px 0 rgba(53, 217, 132, 0.52),
        46px 64px 0 rgba(213, 188, 126, 0.58),
        74px 28px 0 rgba(53, 217, 132, 0.38);
}

.stories-page .spark-one {
    top: 68px;
    left: 34%;
}

.stories-page .spark-two {
    top: 168px;
    right: 18%;
    opacity: 0.72;
}

.stories-page .spark-three {
    bottom: 64px;
    left: 44%;
    opacity: 0.58;
}

.stories-page .stories-hero .page-hero-content {
    max-width: 720px;
    padding: 52px 0 42px;
}

.stories-page .stories-hero .hero-badge {
    position: static;
    min-height: 30px;
    padding: 0 18px;
    margin: 0 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.86);
    box-shadow: none;
    font-size: 0.7rem;
}

.stories-page .stories-hero .hero-title {
    max-width: 720px;
    margin: 0 0 16px;
    color: #cbb27c;
    font-size: clamp(2.45rem, 3.35vw, 3.55rem);
    line-height: 1.02;
    letter-spacing: -0.04em;
}

.stories-page .stories-hero .hero-title span {
    color: rgba(244, 250, 242, 0.92);
}

.stories-page .stories-hero .hero-subtitle {
    max-width: 715px;
    margin: 0 0 10px;
    color: rgba(239, 232, 215, 0.84);
    font-size: clamp(0.95rem, 1.05vw, 1.08rem);
    line-height: 1.5;
}

@media (max-width: 991px) {
    .stories-page .stories-hero {
        min-height: auto;
        background:
            radial-gradient(circle at 92% 20%, rgba(92, 220, 206, 0.24) 0 42px, transparent 44px),
            radial-gradient(circle at 82% 62%, rgba(199, 168, 117, 0.2) 0 24px, transparent 26px),
            linear-gradient(90deg, #06231d 0%, #083a31 62%, #061f1b 100%);
    }

    .stories-page .stories-hero::before {
        right: -200px;
        opacity: 0.32;
    }

    .stories-page .stories-hero::after {
        right: 20px;
        opacity: 0.22;
    }

    .stories-page .stories-hero-graphic {
        width: 48vw;
        opacity: 0.42;
    }

    .stories-page .graphic-node::before,
    .stories-page .graphic-node::after {
        width: 54px;
    }

    .stories-page .stories-hero .page-hero-content {
        max-width: 100%;
        padding: 46px 0 42px;
    }
}

@media (max-width: 767px) {
    .stories-page .stories-responsible-care {
        padding: 54px 0 58px;
    }

    .stories-page .stories-responsible-care .section-heading {
        font-size: clamp(2.35rem, 10vw, 3.15rem);
    }

    .stories-page .stories-responsible-care .medical-list li {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 14px;
    }

    .stories-page .stories-responsible-care .list-icon {
        width: 46px;
        height: 46px;
        border-radius: 10px;
    }

    .stories-page .stories-responsible-care .medical-list span {
        font-size: 0.86rem;
    }

    .stories-page .story-card {
        min-height: auto;
        padding: 26px 20px 22px;
    }

    .stories-page .story-meta {
        max-width: 100%;
    }

    .stories-page .story-card::after {
        opacity: 0.42;
    }

    .stories-page .stories-hero .page-hero-content {
        padding: 38px 0 34px;
    }

    .stories-page .stories-hero-graphic {
        right: -120px;
        width: 360px;
        opacity: 0.24;
    }

    .stories-page .graphic-node,
    .stories-page .graphic-spark {
        display: none;
    }

    .stories-page .stories-hero .hero-badge {
        min-height: 28px;
        padding: 0 14px;
        margin-bottom: 14px;
        font-size: 0.66rem;
    }

    .stories-page .stories-hero .hero-title {
        max-width: 100%;
        font-size: clamp(2.2rem, 11vw, 3rem);
        line-height: 1;
    }

    .stories-page .stories-hero .hero-subtitle {
        font-size: 0.9rem;
        line-height: 1.5;
    }
}

/* ---------------- CASE DETAIL ---------------- */
.case-detail-section {
    padding: 84px 0;
    background:
        radial-gradient(circle at 12% 12%, rgba(194, 165, 120, 0.08), transparent 22%),
        linear-gradient(180deg, #fbfcfa 0%, #ffffff 100%);
}

.case-sidebar {
    position: sticky;
    top: 100px;
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(249,250,247,0.98) 100%);
    padding: 28px;
    border-radius: 24px;
    box-shadow: 0 18px 36px rgba(16, 33, 29, 0.08);
    border: 1px solid rgba(194, 165, 120, 0.14);
    border-bottom: 3px solid rgba(194, 165, 120, 0.5);
}

.case-content-wrap h3 {
    color: #16352f;
    margin-top: 40px;
    margin-bottom: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 12px;
}

.case-content-wrap h3::before {
    content: "";
    width: 4px;
    height: 24px;
    background: rgba(194, 165, 120, 0.95);
    display: inline-block;
    border-radius: 10px;
}

.case-intro-quote {
    font-size: 1.22rem !important;
    font-style: italic;
    color: #5a6168 !important;
}

.insight-quote-box {
    background: linear-gradient(180deg, #f7faf8 0%, #ffffff 100%);
    padding: 36px;
    border-radius: 24px;
    margin: 44px 0;
    border: 1px solid rgba(58, 155, 125, 0.14);
    border-left: 5px solid #3a9b7d;
    position: relative;
    box-shadow: 0 16px 32px rgba(16, 33, 29, 0.06);
}

.insight-quote-box i {
    font-size: 2.8rem;
    color: rgba(58, 155, 125, 0.18);
    position: absolute;
    top: 20px;
    right: 28px;
}

.outcome-card {
    background: linear-gradient(135deg, #f8fbf9 0%, #ffffff 100%);
    border: 1px solid rgba(194, 165, 120, 0.14);
    padding: 30px;
    border-radius: 22px;
    box-shadow: 0 16px 30px rgba(16, 33, 29, 0.05);
}

.meta-item {
    margin-bottom: 15px;
}

.meta-item label {
    display: block;
    font-size: 0.78rem;
    text-transform: uppercase;
    color: #7d858d;
    letter-spacing: 0.12em;
}

.meta-item span {
    font-weight: 600;
    color: #16352f;
    font-size: 1.02rem;
}

.case-reflection-box {
    margin-top: 44px;
    padding: 28px !important;
    border-left: 4px solid rgba(194, 165, 120, 0.9) !important;
    background: #f7faf8 !important;
    border-radius: 0 18px 18px 0;
}

.case-closing-quote {
    font-style: italic;
    color: #1f5f56 !important;
}

@media (max-width: 991px) {
    .case-sidebar {
        position: static;
        margin-bottom: 40px;
    }
}

.founder-panel {
    display: flex;
    align-items: flex-end;
    min-height: 436px;
    overflow: hidden;
}

.founder-visual {
    flex: 0 0 48%;
    align-self: stretch;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-top: 24px;
}

.founder-image {
    width: min(100%, 470px);
    height: auto;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(0 18px 34px rgba(7, 18, 16, 0.24));
}

.founder-copy {
    flex: 1;
    max-width: 640px;
    padding: 74px 56px 64px 8px;
}

.founder-kicker {
    display: inline-block;
    color: #e3cfaa;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 10px;
}

.founder-name {
    color: #f4eee4;
    font-size: clamp(3rem, 4.3vw, 4.35rem);
    line-height: 0.95;
    letter-spacing: -0.05em;
    margin-bottom: 10px;
}

.founder-role {
    color: rgba(243, 236, 223, 0.88);
    font-size: 0.98rem;
    line-height: 1.55;
    margin-bottom: 18px;
}

.founder-text {
    color: rgba(255,255,255,0.82);
    font-size: 0.98rem;
    line-height: 1.7;
    max-width: 52ch;
    margin-bottom: 28px;
}

.founder-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 30px;
    border-radius: 999px;
    border: 1px solid rgba(227, 207, 170, 0.56);
    color: #f4eee4;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.founder-button:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(227, 207, 170, 0.8);
    color: #ffffff;
}

@media (max-width: 991px) {
    .founder-panel {
        flex-direction: column;
        align-items: center;
        min-height: auto;
        padding-top: 32px;
    }

    .founder-visual {
        flex: 0 0 auto;
        width: 100%;
    }

    .founder-image {
        width: min(100%, 340px);
    }

    .founder-copy {
        max-width: 100%;
        padding: 22px 18px 44px;
        text-align: center;
    }

    .founder-text {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .founder-name {
        font-size: clamp(2.45rem, 11vw, 3.2rem);
    }

    .founder-role,
    .founder-text {
        font-size: 0.94rem;
    }
}

/* ---------------- HOW DISEASE BEGINS PAGE ---------------- */
.disease-page .page-hero {
    min-height: 314px;
    border-bottom: 0;
    background:
        radial-gradient(circle at 82% 14%, rgba(184, 214, 179, 0.16), transparent 12%),
        linear-gradient(90deg, #214a62 0%, #2f6c7e 28%, #2d7076 58%, #255553 100%);
}

.disease-page .page-hero::before,
.disease-page .page-hero::after {
    display: none;
}

.disease-page .page-hero-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.disease-page .page-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    opacity: 0.82;
    filter: saturate(0.88) brightness(0.78) contrast(1.04);
}

.disease-page .page-hero-overlay {
    background:
        linear-gradient(90deg, rgba(22, 49, 77, 0.8) 0%, rgba(24, 58, 88, 0.66) 24%, rgba(18, 73, 95, 0.34) 56%, rgba(10, 39, 46, 0.18) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0) 100%);
}

.disease-hero-content {
    max-width: 700px;
    padding: 28px 0 24px 8px;
}

.disease-hero-title {
    max-width: 9.8ch;
    color: #f3ece2;
    font-size: clamp(3.45rem, 5vw, 4.85rem);
    line-height: 0.9;
    letter-spacing: -0.055em;
    margin: 0;
    text-shadow:
        0 8px 22px rgba(16, 28, 44, 0.28),
        0 2px 0 rgba(255, 255, 255, 0.06);
}

.disease-hero-line {
    display: block;
    white-space: nowrap;
}

.disease-hero-line-light {
    color: #f3ece2 !important;
}

.disease-hero-title .disease-hero-line-light,
.disease-hero-title .disease-hero-line-light * {
    color: #f3ece2 !important;
}

.disease-hero-line-accent {
    color: #c6a36f !important;
}

.disease-hero-title .disease-hero-line-accent,
.disease-hero-title .disease-hero-line-accent * {
    color: #c6a36f !important;
}

.disease-architecture {
    padding-top: 0;
    padding-bottom: 0;
    background: #f8f5ef;
}

.disease-architecture-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.88fr);
    gap: 26px;
    align-items: center;
    padding: 52px 0 76px;
}

.disease-architecture-copy-panel {
    padding: 54px 28px 40px 8px;
    min-height: 340px;
}

.disease-architecture-title {
    max-width: 7.8ch;
    margin-bottom: 24px;
}

.disease-architecture-title span {
    display: block;
    white-space: nowrap;
}

.disease-architecture-copy {
    max-width: 52ch;
    color: #555b61;
    font-size: 0.98rem;
    line-height: 1.68;
    margin-bottom: 20px;
}

.disease-architecture-copy-last {
    margin-bottom: 0;
}

.disease-highlight-box {
    max-width: 52ch;
    margin: 0 0 24px;
    padding: 12px 16px;
    border-left: 3px solid #cfb083;
    border-radius: 0 14px 14px 0;
    background: linear-gradient(90deg, rgba(207, 176, 131, 0.12) 0%, rgba(207, 176, 131, 0.04) 100%);
}

.disease-highlight-box p {
    margin: 0;
    color: #17242a;
    font-size: 0.98rem;
    line-height: 1.66;
}

.disease-architecture-media {
    position: relative;
    padding: 0;
}

.disease-viewer-card {
    position: relative;
    overflow: hidden;
    max-width: 486px;
    margin: 0;
    padding: 18px 20px 18px;
    border-radius: 20px;
    background:
        radial-gradient(circle at 16% 14%, rgba(255, 255, 255, 0.09), transparent 22%),
        linear-gradient(180deg, #58636a 0%, #4f595f 100%);
    box-shadow: 0 28px 54px rgba(33, 41, 47, 0.22);
}

.disease-viewer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.disease-viewer-title {
    color: #f3f5f7;
    font-size: 1.06rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.disease-viewer-play {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: #46535a;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42);
}

.disease-viewer-play i {
    font-size: 0.9rem;
    margin-left: 1px;
}

.disease-viewer-stage {
    border-radius: 14px;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 40%, rgba(255, 255, 255, 0.06), transparent 46%),
        linear-gradient(180deg, rgba(34, 43, 49, 0.18), rgba(34, 43, 49, 0.02));
    padding: 26px 16px 22px;
}

.disease-viewer-flow {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr) 38px minmax(0, 1fr) 38px minmax(0, 1fr);
    align-items: center;
}

.disease-viewer-step {
    text-align: center;
}

.disease-viewer-node {
    position: relative;
    width: 66px;
    height: 66px;
    margin: 0 auto 12px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.62rem;
    color: #fff9ee;
    border: 2px solid currentColor;
    background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.02));
    box-shadow:
        inset 0 0 18px rgba(255, 255, 255, 0.08),
        0 0 0 6px rgba(255, 255, 255, 0.03),
        0 0 24px currentColor;
}

.disease-viewer-node::after {
    content: "";
    position: absolute;
    inset: 11px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.disease-viewer-node-1 {
    color: #ffb560;
}

.disease-viewer-node-2 {
    color: #76b6ff;
}

.disease-viewer-node-3 {
    color: #7be6ea;
}

.disease-viewer-node-4 {
    color: #ff9566;
}

.disease-viewer-label {
    color: rgba(245, 247, 249, 0.94);
    font-size: 0.72rem;
    line-height: 1.22;
    min-height: 36px;
}

.disease-viewer-link {
    position: relative;
    height: 2px;
    border-radius: 999px;
    opacity: 0.95;
}

.disease-viewer-link::after {
    content: "";
    position: absolute;
    right: -2px;
    top: 50%;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    transform: translateY(-50%);
    background: currentColor;
    box-shadow: 0 0 10px currentColor;
}

.disease-viewer-link-1 {
    color: #ffca7a;
    background: linear-gradient(90deg, rgba(255, 181, 96, 0.35), rgba(255, 202, 122, 1));
}

.disease-viewer-link-2 {
    color: #8ed5ff;
    background: linear-gradient(90deg, rgba(118, 182, 255, 0.35), rgba(142, 213, 255, 1));
}

.disease-viewer-link-3 {
    color: #ffb089;
    background: linear-gradient(90deg, rgba(123, 230, 234, 0.35), rgba(255, 176, 137, 1));
}

.disease-viewer-footer {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 16px;
    color: #f3f5f7;
    font-size: 1rem;
    font-weight: 700;
}

.disease-viewer-footer i {
    font-size: 1.25rem;
    line-height: 1;
    color: #f0cf78;
    margin-left: -4px;
}

.disease-stages {
    background:
        radial-gradient(circle at 15% 16%, rgba(194, 165, 120, 0.12), transparent 24%),
        radial-gradient(circle at 82% 82%, rgba(127, 195, 176, 0.14), transparent 24%),
        linear-gradient(180deg, #0d2522 0%, #143531 100%);
    padding-top: 76px;
    padding-bottom: 80px;
}

.disease-stages-head {
    max-width: 860px;
    margin-bottom: 34px;
}

.disease-stages-title {
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    font-size: clamp(2.45rem, 3.8vw, 3.6rem);
    color: #cdb27a;
    margin-bottom: 10px;
}

.disease-stages-subtitle {
    max-width: 76ch;
    color: rgba(236, 240, 235, 0.84);
    font-size: 0.92rem;
    line-height: 1.58;
}

.disease-stages-shell {
    padding: 38px 34px 34px;
    border-radius: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.disease-stages-shell::before {
    display: none;
}

.disease-stages-grid {
    gap: 16px;
}

.disease-stage-card {
    min-height: 212px;
    padding: 14px 16px 78px;
    border-radius: 16px;
    border: 1px solid rgba(216, 196, 153, 0.56);
    background:
        radial-gradient(circle at 18% 14%, rgba(255, 255, 255, 0.07), transparent 18%),
        radial-gradient(circle at 84% 90%, rgba(103, 224, 214, 0.08), transparent 16%),
        linear-gradient(180deg, rgba(16, 48, 45, 0.98), rgba(12, 33, 31, 0.98));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 14px 28px rgba(6, 18, 16, 0.18);
}

.disease-stage-card::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 74px;
    opacity: 0.28;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 100%),
        linear-gradient(rgba(255, 255, 255, 0.035) 0, rgba(255, 255, 255, 0.035) 1px, transparent 1px, transparent 100%);
    background-size: 54px 100%, 100% 22px;
    pointer-events: none;
}

.disease-stage-card .root360-approach-card-head {
    margin-bottom: 10px;
}

.disease-stage-card .root360-approach-icon {
    width: 26px;
    height: 26px;
    font-size: 0.92rem;
    border-radius: 8px;
    color: rgba(244, 247, 242, 0.92);
    background: transparent;
    border: 0;
}

.disease-stage-card .root360-approach-number {
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: #d8c08d;
    font-size: 3.45rem;
    line-height: 0.92;
}

.disease-stage-card h3,
.disease-stage-card p {
    max-width: none;
}

.disease-stage-card h3 {
    position: relative;
    z-index: 1;
    max-width: 10ch;
    margin-bottom: 10px;
    color: #f5f4ef;
    font-size: 0.98rem;
    line-height: 1.05;
}

.disease-stage-card .root360-approach-line {
    width: 28px;
    margin-bottom: 10px;
}

.disease-stage-card p {
    position: relative;
    z-index: 1;
    max-width: 19ch;
    color: rgba(232, 236, 232, 0.86);
    font-size: 0.82rem;
    line-height: 1.5;
}

.disease-stage-visual {
    position: absolute;
    right: 16px;
    bottom: 12px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 62px;
    min-height: 62px;
    color: rgba(143, 241, 232, 0.9);
    filter:
        drop-shadow(0 0 12px rgba(128, 237, 227, 0.22))
        drop-shadow(0 0 20px rgba(255, 170, 118, 0.14));
}

.disease-stage-visual i {
    font-size: 2.8rem;
    line-height: 1;
}

.disease-stage-card-1 .disease-stage-visual {
    color: rgba(255, 170, 118, 0.9);
}

.disease-stage-card-2 .disease-stage-visual {
    color: rgba(255, 168, 132, 0.9);
}

.disease-stage-card-3 .disease-stage-visual {
    color: rgba(149, 235, 229, 0.92);
}

.disease-stage-card-4 .disease-stage-visual {
    color: rgba(161, 226, 244, 0.9);
}

.disease-insight {
    padding-top: 70px;
    padding-bottom: 76px;
}

.disease-insight-row {
    --bs-gutter-x: 2.8rem;
}

.disease-insight-copy {
    max-width: 600px;
}

.disease-insight-title {
    max-width: none;
    margin-bottom: 12px;
    font-size: clamp(2.3rem, 3.2vw, 3.2rem);
    line-height: 0.98;
}

.disease-insight-intro {
    max-width: 60ch;
    margin-bottom: 22px;
    color: #5f6670;
    font-size: 0.95rem;
    line-height: 1.62;
}

.disease-insight-visual {
    max-width: 520px;
    margin-left: auto;
    border-radius: 18px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: 0 20px 42px rgba(23, 47, 40, 0.12);
}

.disease-insight-image {
    width: 100%;
    min-height: 0;
    aspect-ratio: 1.45 / 1;
    object-fit: cover;
    object-position: center;
    border-radius: 18px;
}

.disease-benefits-list {
    margin-top: 6px;
}

.disease-benefits-list li {
    gap: 12px;
    margin-bottom: 20px;
}

.disease-benefit-icon {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    margin-top: 1px;
    border-radius: 50%;
    background: rgba(194, 165, 120, 0.12);
    border: 1px solid rgba(194, 165, 120, 0.22);
    color: #b79660;
    font-size: 0.84rem;
}

.disease-benefits-list strong {
    color: #1d2d2b;
    font-size: 0.98rem;
    margin-bottom: 5px;
}

.disease-benefits-list span {
    color: #666e77;
    font-size: 0.92rem;
    line-height: 1.58;
}

.disease-benefits-list li:last-child {
    margin-bottom: 0;
}

.disease-cta-section {
    position: relative;
    overflow: hidden;
    padding: 28px 0 24px;
    background:
        radial-gradient(circle at 8% 18%, rgba(194, 165, 120, 0.08), transparent 10%),
        radial-gradient(circle at 88% 16%, rgba(194, 165, 120, 0.06), transparent 10%),
        linear-gradient(180deg, #123e39 0%, #103732 100%);
}

.disease-cta-section::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.16;
    pointer-events: none;
    background:
        radial-gradient(circle at 4% 8%, rgba(255, 255, 255, 0.08) 0 0.5%, transparent 2.2%),
        radial-gradient(circle at 90% 10%, rgba(255, 255, 255, 0.06) 0 0.42%, transparent 1.8%),
        linear-gradient(96deg, transparent 0%, transparent 26%, rgba(194, 165, 120, 0.08) 34%, rgba(194, 165, 120, 0.18) 37%, rgba(194, 165, 120, 0.06) 41%, transparent 49%) 0 56% / 100% 28% no-repeat;
}

.disease-cta-section::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.1;
    pointer-events: none;
    background:
        radial-gradient(circle at 2% 8%, rgba(255,255,255,0.16) 0, rgba(255,255,255,0.04) 2%, transparent 8%) 0 0 / 180px 180px no-repeat,
        radial-gradient(circle at 98% 10%, rgba(255,255,255,0.1) 0, rgba(255,255,255,0.03) 2%, transparent 8%) 100% 0 / 160px 160px no-repeat;
}

.disease-quote-band {
    position: relative;
    z-index: 1;
    max-width: 1580px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 248px;
    gap: 18px;
    align-items: center;
    min-height: 300px;
    padding: 22px 26px 18px;
    border: 1px solid rgba(194, 165, 120, 0.16);
    background:
        linear-gradient(180deg, rgba(255,255,255,0.018), rgba(255,255,255,0.01));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

.disease-quote-main {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 0 12px 0;
}

.disease-quote-main::before {
    display: none;
}

.disease-quote-mark {
    position: absolute;
    color: #d8c395;
    font-family: var(--font-serif);
    font-size: clamp(2.4rem, 2.8vw, 3.4rem);
    line-height: 1;
    opacity: 0.96;
}

.disease-quote-text {
    max-width: 1240px;
    margin: 0 auto 18px;
    color: #f4eee4;
    font-family: var(--font-serif);
    font-size: clamp(1.72rem, 2vw, 2.22rem);
    line-height: 1.12;
    letter-spacing: -0.056em;
    text-align: center;
    text-shadow: 0 6px 18px rgba(4, 14, 13, 0.14);
    text-wrap: balance;
}

.disease-quote-mark-open {
    display: none;
}

.disease-quote-mark-close {
    right: 0;
    bottom: 56px;
}



.disease-quote-principles-heading {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 8px;
    width: 100%;
}

.disease-quote-line {
    flex: 1 1 auto;
    height: 1px;
    background: rgba(206, 177, 126, 0.8);
}

.disease-quote-label {
    flex: 0 0 auto;
    color: #d8c395;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.disease-quote-side {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    max-width: 306px;
    justify-self: end;
    padding-bottom: 0;
}

.disease-quote-emblem {
    position: relative;
    grid-column: 1 / -1;
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 4px;
    overflow: hidden;
    border: 1px solid rgba(194, 165, 120, 0.16);
    border-radius: 999px;
    background:
        radial-gradient(circle at 50% 50%, rgba(194, 165, 120, 0.08), transparent 42%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 20px 34px rgba(2, 18, 18, 0.2);
}

.disease-quote-emblem::before,
.disease-quote-emblem::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    border-radius: 999px;
    transform: translate(-50%, -50%);
}

.disease-quote-emblem::before {
    width: 132px;
    height: 132px;
    border: 1px solid rgba(111, 243, 227, 0.22);
    opacity: 0.65;
}

.disease-quote-emblem::after {
    width: 186px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(111, 243, 227, 0.45), transparent);
    opacity: 0.85;
}

.disease-quote-emblem-orbit,
.disease-quote-emblem-pulse,
.disease-quote-emblem-core {
    position: absolute;
}

.disease-quote-emblem-orbit {
    width: 86px;
    height: 86px;
    border: 1px solid rgba(217, 197, 150, 0.35);
    border-radius: 50%;
    box-shadow:
        0 0 24px rgba(112, 244, 230, 0.18),
        inset 0 0 18px rgba(255, 255, 255, 0.07);
}

.disease-quote-emblem-pulse {
    width: 144px;
    height: 30px;
    background:
        linear-gradient(90deg, transparent 0 16%, rgba(111, 243, 227, 0.2) 16% 18%, transparent 18% 30%, rgba(111, 243, 227, 0.65) 30% 31%, rgba(111, 243, 227, 0.2) 31% 33%, transparent 33% 52%, rgba(111, 243, 227, 0.62) 52% 53%, rgba(111, 243, 227, 0.18) 53% 55%, transparent 55% 100%);
    filter: drop-shadow(0 0 14px rgba(111, 243, 227, 0.25));
    opacity: 0.95;
}

.disease-quote-emblem-core {
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(217, 197, 150, 0.34);
    border-radius: 50%;
    color: #78e5da;
    background:
        radial-gradient(circle at 50% 35%, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.03) 46%, transparent 76%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.04));
    box-shadow:
        0 0 0 8px rgba(14, 92, 89, 0.2),
        0 0 30px rgba(111, 243, 227, 0.2);
}

.disease-quote-emblem-core i {
    font-size: 1.8rem;
    line-height: 1;
}

.disease-principle-card {
    position: relative;
    overflow: hidden;
    min-height: 148px;
    padding: 12px 8px 10px;
    clip-path: none;
    border-radius: 18px;
    border: 1px solid rgba(217, 198, 154, 0.24);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.025)),
        linear-gradient(180deg, rgba(4, 36, 36, 0.26), rgba(4, 36, 36, 0.1));
    backdrop-filter: blur(12px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 30px rgba(2, 16, 16, 0.18);
}

.disease-principle-card::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.44;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 34%, rgba(116, 243, 229, 0.18), transparent 20%),
        linear-gradient(90deg, transparent 49%, rgba(116, 243, 229, 0.1) 50%, transparent 51%),
        linear-gradient(rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 100%);
    background-size: auto, auto, 100% 26px;
}

.disease-principle-icon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 62px;
    color: rgba(216, 195, 149, 0.92);
    filter: none;
}

.disease-principle-icon i {
    font-size: 2rem;
    line-height: 1;
}

.disease-principle-card h3 {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #f5f0e7;
    font-family: var(--font-sans);
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1.18;
    text-align: center;
    text-transform: uppercase;
}

@media (max-width: 991px) {
    .disease-page .page-hero {
        min-height: auto;
        padding: 40px 0 34px;
    }

    .disease-hero-content {
        max-width: 100%;
        padding: 24px 0 18px 2px;
    }

    .disease-hero-title {
        max-width: 100%;
        font-size: clamp(3rem, 8vw, 4rem);
    }

    .disease-architecture,
    .disease-stages,
    .disease-insight {
        padding-top: 54px;
        padding-bottom: 56px;
    }

    .disease-architecture {
        padding-top: 0;
        padding-bottom: 0;
    }

    .disease-architecture-stage {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 24px 0 40px;
    }

    .disease-architecture-copy-panel {
        padding: 34px 18px 10px 0;
        min-height: auto;
    }

    .disease-architecture-media {
        padding: 0;
    }

    .disease-viewer-card {
        max-width: 100%;
        margin: 0;
    }

    .disease-stages-shell {
        padding: 30px 18px 24px;
    }

    .disease-stages-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .disease-stage-card {
        min-height: 220px;
    }

    .disease-insight-row {
        --bs-gutter-x: 1.8rem;
    }

    .disease-insight-copy {
        max-width: 100%;
    }

    .disease-insight-visual {
        max-width: 100%;
        margin-left: 0;
    }

    .disease-quote-band {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .disease-quote-main {
        max-width: 100%;
        padding: 8px 0 28px;
    }

    .disease-quote-main::before {
        left: 50%;
        top: 180px;
        width: 380px;
        height: 240px;
        transform: translateX(-50%);
    }

    .disease-quote-mark-open {
        display: none;
    }

    .disease-quote-mark-close {
        right: 10px;
        bottom: 36px;
    }

    .disease-quote-text {
        max-width: 24ch;
        font-size: clamp(1.9rem, 4vw, 2.5rem);
    }

    .disease-quote-side {
        position: static;
        width: min(100%, 520px);
        margin: 8px auto 0;
    }

    .disease-quote-emblem {
        min-height: 78px;
    }
}

@media (max-width: 767px) {
    .disease-page .container {
        padding-left: 18px;
        padding-right: 18px;
    }

    .disease-page .page-hero {
        padding: 30px 0 26px;
    }

    .disease-page .page-hero-bg img {
        object-position: center center;
        opacity: 0.72;
    }

    .disease-page .page-hero-overlay {
        background:
            linear-gradient(180deg, rgba(23, 58, 83, 0.76) 0%, rgba(21, 75, 95, 0.42) 100%);
    }

    .disease-hero-title {
        max-width: none;
        font-size: clamp(2.3rem, 10.4vw, 3rem);
        line-height: 0.9;
    }

    .disease-hero-line {
        white-space: normal;
    }

    .disease-architecture-title,
    .disease-insight-title {
        max-width: none;
    }

    .disease-architecture-title span {
        white-space: normal;
    }

    .disease-architecture-copy-panel {
        padding: 28px 0 8px;
    }

    .disease-highlight-box {
        margin-bottom: 16px;
    }

    .disease-viewer-card {
        max-width: 100%;
        padding: 12px 12px 14px;
        border-radius: 16px;
    }

    .disease-viewer-title {
        font-size: 0.92rem;
    }

    .disease-viewer-stage {
        padding: 16px 8px 14px;
    }

    .disease-viewer-flow {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .disease-viewer-link {
        width: 2px;
        height: 18px;
        margin: 0 auto;
    }

    .disease-viewer-link::after {
        right: 50%;
        top: auto;
        bottom: -2px;
        transform: translateX(50%);
    }

    .disease-insight-image {
        min-height: 230px;
        border-radius: 14px;
    }

    .disease-stages {
        padding-top: 62px;
        padding-bottom: 62px;
    }

    .disease-stages-head {
        margin-bottom: 28px;
    }

    .disease-stages-title,
    .disease-stages-subtitle {
        max-width: 100%;
    }

    .disease-stages-title {
        font-size: clamp(2rem, 8.8vw, 2.65rem);
    }

    .disease-stages-subtitle {
        font-size: 0.9rem;
    }

    .disease-stages-shell {
        padding: 24px 12px 18px;
    }

    .disease-stages-grid {
        grid-template-columns: 1fr;
    }

    .disease-stage-card {
        min-height: auto;
        padding: 14px 14px 64px;
    }

    .disease-stage-card .root360-approach-number {
        font-size: 2.8rem;
    }

    .disease-stage-card h3 {
        max-width: none;
        font-size: 0.95rem;
    }

    .disease-stage-card p {
        max-width: none;
        font-size: 0.86rem;
    }

    .disease-stage-visual {
        right: 14px;
        bottom: 10px;
        min-width: 54px;
        min-height: 54px;
    }

    .disease-stage-visual i {
        font-size: 2.35rem;
    }

    .disease-insight-row {
        row-gap: 24px;
    }

    .disease-insight-visual-col {
        order: 2;
    }

    .disease-insight-copy-col {
        order: 1;
    }

    .disease-insight-visual {
        border-radius: 20px;
        box-shadow: 0 16px 30px rgba(23, 47, 40, 0.1);
    }

    .disease-insight-title {
        font-size: clamp(2rem, 8.8vw, 2.6rem);
    }

    .disease-insight-intro {
        margin-bottom: 18px;
        font-size: 0.92rem;
    }

    .disease-benefits-list li {
        margin-bottom: 16px;
    }

    .disease-benefits-list span {
        font-size: 0.9rem;
    }

    .disease-cta-section {
        padding: 36px 0 26px;
    }

    .disease-quote-mark {
        font-size: clamp(3.2rem, 11vw, 4.2rem);
    }

    .disease-quote-mark-open {
        left: -2px;
        top: -6px;
    }

    .disease-quote-mark-close {
        right: 0;
        bottom: 56px;
    }

    .disease-quote-text {
        max-width: none;
        font-size: clamp(1.45rem, 5.9vw, 1.9rem);
        margin-bottom: 18px;
        line-height: 1.04;
    }

    .disease-quote-principles-heading {
        gap: 10px;
    }

    .disease-quote-label {
        font-size: 0.74rem;
        text-align: center;
    }

    .disease-quote-side {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }

    .disease-quote-emblem {
        min-height: 70px;
    }

    .disease-quote-emblem::before {
        width: 104px;
        height: 104px;
    }

    .disease-quote-emblem::after {
        width: 148px;
    }

    .disease-quote-emblem-orbit {
        width: 72px;
        height: 72px;
    }

    .disease-quote-emblem-pulse {
        width: 116px;
    }

    .disease-quote-emblem-core {
        width: 56px;
        height: 56px;
    }

    .disease-quote-emblem-core i {
        font-size: 1.45rem;
    }

    .disease-principle-card {
        min-height: 132px;
        padding: 12px 8px 10px;
    }

    .disease-principle-icon {
        min-height: 54px;
    }

    .disease-principle-icon i {
        font-size: 2rem;
    }

    .disease-principle-card h3 {
        font-size: 0.72rem;
    }
}

@media (max-width: 575px) {
    .disease-page .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .disease-page .page-hero {
        padding: 24px 0 22px;
    }

    .disease-hero-title {
        font-size: clamp(1.95rem, 11vw, 2.45rem);
        letter-spacing: -0.05em;
    }

    .disease-architecture-copy,
    .disease-highlight-box p,
    .disease-insight-intro,
    .disease-cta-text {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .disease-stages {
        padding-top: 52px;
        padding-bottom: 52px;
    }

    .disease-stages-shell {
        padding: 20px 8px 14px;
    }

    .disease-stage-card {
        padding: 13px 13px 58px;
    }

    .disease-stage-card .root360-approach-number {
        font-size: 2.45rem;
    }

    .disease-stage-card p {
        font-size: 0.82rem;
    }

    .disease-stage-visual i {
        font-size: 2.1rem;
    }

    .disease-insight-row {
        row-gap: 18px;
    }

    .disease-viewer-card {
        padding: 10px 10px 12px;
        border-radius: 14px;
    }

    .disease-viewer-head {
        margin-bottom: 10px;
    }

    .disease-viewer-title {
        font-size: 0.88rem;
    }

    .disease-viewer-play {
        width: 26px;
        height: 26px;
        flex-basis: 26px;
    }

    .disease-viewer-footer {
        font-size: 0.88rem;
        margin-top: 10px;
    }

    .disease-insight-image {
        min-height: 210px;
        aspect-ratio: 1.28 / 1;
    }

    .disease-quote-text {
        font-size: clamp(1.22rem, 7vw, 1.55rem);
        line-height: 1.02;
    }

    .disease-quote-mark-close {
        bottom: 28px;
    }

    .disease-principle-card {
        min-height: 118px;
    }

    .disease-principle-icon i {
        font-size: 1.7rem;
    }
}

/* ---------------- CONDITIONS WE SUPPORT PAGE ---------------- */
.premium-conditions-page .page-hero {
    min-height: 378px;
    border-bottom: 0;
    background:
        radial-gradient(circle at 82% 16%, rgba(186, 212, 177, 0.18), transparent 12%),
        linear-gradient(90deg, #183f3b 0%, #123632 46%, #0f2f2c 100%);
}

.premium-conditions-page .page-hero::before,
.premium-conditions-page .page-hero::after {
    display: none;
}

.premium-conditions-page .page-hero-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.premium-conditions-page .page-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0.16;
    filter: grayscale(0.18) sepia(0.28) saturate(0.78) brightness(0.68);
}

.premium-conditions-page .page-hero-overlay {
    background:
        linear-gradient(90deg, rgba(18, 54, 50, 0.88) 0%, rgba(18, 54, 50, 0.72) 42%, rgba(16, 47, 44, 0.34) 76%, rgba(16, 47, 44, 0.12) 100%);
}

.conditions-hero-content {
    max-width: 760px;
    padding: 34px 0 26px 2px;
}

.conditions-hero-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(280px, 0.88fr);
    gap: 40px;
    align-items: center;
}

.conditions-hero-badge {
    display: inline-block;
    min-height: 34px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(230, 242, 255, 0.28);
    background: rgba(255, 255, 255, 0.1);
    color: rgba(245, 249, 255, 0.94);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 34px;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.conditions-hero-title {
    max-width: 9ch;
    color: #ffffff;
    font-size: clamp(3.25rem, 4.8vw, 4.55rem);
    line-height: 0.9;
    letter-spacing: -0.06em;
    margin-bottom: 16px;
}

.conditions-hero-line {
    display: block;
    white-space: nowrap;
}

.conditions-hero-line-light {
    color: #ffffff;
}

.conditions-hero-line-accent {
    color: #9dd6a6;
}

.conditions-hero-copy {
    max-width: 66ch;
    color: rgba(244, 249, 246, 0.9);
    font-size: 0.94rem;
    line-height: 1.7;
    margin: 0;
}

.conditions-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.conditions-hero-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: rgba(244, 249, 246, 0.88);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.conditions-hero-aside {
    display: flex;
    justify-content: flex-end;
}

.conditions-hero-panel {
    width: min(100%, 360px);
    padding: 20px;
    border-radius: 26px;
    border: 1px solid rgba(216, 196, 153, 0.18);
    background:
        linear-gradient(180deg, rgba(15, 39, 36, 0.72), rgba(15, 39, 36, 0.38)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02));
    backdrop-filter: blur(14px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 24px 44px rgba(4, 16, 14, 0.22);
}

.conditions-hero-panel-stat {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: center;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.conditions-hero-panel-stat strong {
    color: #f3ece2;
    font-family: var(--font-serif);
    font-size: 3rem;
    line-height: 0.9;
    letter-spacing: -0.05em;
}

.conditions-hero-panel-stat span {
    color: rgba(244, 249, 246, 0.82);
    font-size: 0.9rem;
    line-height: 1.5;
}

.conditions-hero-panel-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.conditions-hero-mini-card {
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 18px;
    border: 1px solid rgba(216, 196, 153, 0.12);
    background:
        radial-gradient(circle at 18% 14%, rgba(255, 255, 255, 0.06), transparent 18%),
        linear-gradient(180deg, rgba(22, 54, 50, 0.78), rgba(16, 39, 36, 0.88));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.conditions-hero-mini-card i {
    display: inline-flex;
    color: #cdb27a;
    font-size: 1.2rem;
    margin-bottom: 10px;
}

.conditions-hero-mini-card span {
    display: block;
    color: rgba(244, 249, 246, 0.88);
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.32;
}

.conditions-architecture {
    padding-top: 0;
    padding-bottom: 0;
    background:
        linear-gradient(180deg, #173f3b 0 10px, #f8f5ef 10px 100%);
}

.conditions-architecture-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr);
    gap: 30px;
    align-items: center;
    padding: 54px 0 78px;
}

.conditions-architecture-copy-panel {
    padding: 28px 0 16px 0;
    min-height: 0;
}

.conditions-architecture-copy-panel .architecture-left {
    max-width: none;
}

.conditions-architecture-copy-panel .section-label {
    margin-bottom: 18px;
}

.conditions-architecture-title {
    max-width: 10ch;
    font-size: clamp(3.1rem, 4.4vw, 4.5rem);
    line-height: 0.9;
    letter-spacing: -0.06em;
}

.conditions-architecture-title span {
    display: block;
    white-space: nowrap;
}

.conditions-architecture-copy {
    max-width: 56ch;
    color: #545a60;
    font-size: 1.02rem;
    line-height: 1.62;
    margin-bottom: 18px;
}

.conditions-architecture-copy-last {
    margin-bottom: 0;
}

.conditions-highlight-box {
    max-width: 54ch;
    margin: 0 0 18px;
    padding: 14px 18px;
    border: 1px solid rgba(207, 176, 131, 0.22);
    border-left: 3px solid #cfb083;
    border-radius: 0 12px 12px 0;
    background: linear-gradient(180deg, rgba(255, 251, 243, 0.98), rgba(249, 244, 235, 0.92));
    box-shadow: 0 12px 26px rgba(73, 57, 36, 0.06);
}

.conditions-highlight-box p {
    margin: 0;
    color: #17242a;
    font-size: 0.98rem;
    line-height: 1.68;
}

.conditions-architecture-media {
    padding: 0;
}

.conditions-architecture-visual {
    position: relative;
    min-height: 0;
    padding: 0;
}

.conditions-prevention-screen {
    position: relative;
    width: min(100%, 760px);
    margin: 0 0 0 auto;
    padding: 0;
    border-radius: 24px;
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: hidden;
}

.conditions-prevention-screen img {
    width: 100%;
    min-height: 0;
    object-fit: contain;
    object-position: center center;
    border-radius: 20px;
    display: block;
    background: transparent;
    filter: none;
}

.conditions-focus {
    background:
        radial-gradient(circle at 12% 12%, rgba(194, 165, 120, 0.12), transparent 24%),
        radial-gradient(circle at 82% 84%, rgba(127, 195, 176, 0.14), transparent 24%),
        linear-gradient(180deg, #0b221f 0%, #12332f 100%);
    padding-top: 72px;
    padding-bottom: 78px;
}

.conditions-focus-shell {
    position: relative;
    overflow: hidden;
    padding: 38px 36px 40px;
    border-radius: 34px;
    border: 1px solid rgba(220, 197, 159, 0.22);
    background:
        radial-gradient(circle at 12% 10%, rgba(194, 165, 120, 0.08), transparent 22%),
        linear-gradient(180deg, rgba(12, 34, 31, 0.76), rgba(10, 29, 27, 0.82));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 24px 46px rgba(5, 17, 15, 0.24);
}

.conditions-focus-shell::before,
.conditions-focus-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.conditions-focus-shell::before {
    opacity: 0.28;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.06) 0, rgba(255, 255, 255, 0.06) 1px, transparent 1px, transparent 100%),
        linear-gradient(rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 100%);
    background-size: 80px 100%, 100% 100px;
}

.conditions-focus-shell::after {
    inset: 18px;
    border-radius: 28px;
    border: 1px solid rgba(220, 197, 159, 0.14);
}

.conditions-focus-head {
    position: relative;
    z-index: 1;
    max-width: 760px;
    margin: 0 auto 34px;
}

.conditions-focus-head .sub-title {
    justify-content: center;
    margin-bottom: 14px;
    color: rgba(233, 238, 233, 0.78);
}

.conditions-focus-head .sub-title::before {
    background: rgba(194, 165, 120, 0.9);
}

.conditions-focus-title {
    margin-left: auto;
    margin-right: auto;
    color: #f2e8d7;
    font-family: var(--font-serif);
    font-size: clamp(2.7rem, 4vw, 3.9rem);
    line-height: 0.92;
    letter-spacing: -0.05em;
}

.conditions-focus-subtitle {
    max-width: 62ch;
    margin-left: auto;
    margin-right: auto;
    color: rgba(231, 236, 231, 0.72);
    font-size: 0.92rem;
    line-height: 1.55;
}

.conditions-focus-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 16px;
}

.conditions-focus-card {
    overflow: hidden;
    min-height: 262px;
    padding: 14px 16px 18px;
    border-radius: 20px;
    border: 1px solid rgba(220, 197, 159, 0.34);
    background:
        radial-gradient(circle at 18% 14%, rgba(255, 255, 255, 0.05), transparent 20%),
        linear-gradient(180deg, rgba(17, 47, 43, 0.82), rgba(13, 33, 31, 0.9));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 16px 30px rgba(5, 17, 15, 0.18);
}

.conditions-focus-cluster {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(216, 196, 153, 0.1);
    border: 1px solid rgba(216, 196, 153, 0.12);
    color: rgba(239, 228, 207, 0.82);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.conditions-focus-card h3,
.conditions-focus-card p {
    max-width: none;
}

.conditions-focus-card h3 {
    max-width: 12ch;
    margin-bottom: 10px;
    color: #f7f4ee;
    font-size: 0.98rem;
    line-height: 1.08;
}

.conditions-focus-watermark {
    position: absolute;
    right: 10px;
    bottom: 10px;
    color: rgba(122, 214, 196, 0.09);
    font-size: 3.8rem;
    line-height: 1;
    pointer-events: none;
}

.conditions-focus-card::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 72px;
    opacity: 0.12;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 100%),
        linear-gradient(rgba(255, 255, 255, 0.03) 0, rgba(255, 255, 255, 0.03) 1px, transparent 1px, transparent 100%);
    background-size: 64px 100%, 100% 24px;
    pointer-events: none;
}

.conditions-focus-card .root360-approach-card-head {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}

.conditions-focus-card .root360-approach-number {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid rgba(214, 220, 214, 0.26);
    background: transparent;
    box-shadow: none;
    color: rgba(238, 242, 238, 0.74);
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 700;
}

.conditions-focus-card .root360-approach-icon {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    color: #4a3a22;
    font-size: 1.35rem;
    background:
        radial-gradient(circle at 30% 28%, #f6eac9 0%, #e0c58d 52%, #af8f58 100%);
    border: 0;
    box-shadow:
        inset 0 2px 4px rgba(255, 255, 255, 0.32),
        0 8px 18px rgba(0, 0, 0, 0.22);
}

.conditions-focus-card .root360-approach-line {
    width: 28px;
    background: rgba(227, 207, 170, 0.82);
    margin-bottom: 12px;
}

.conditions-focus-card p {
    color: rgba(232, 237, 232, 0.68);
    font-size: 0.88rem;
    line-height: 1.56;
}

.conditions-focus-card:hover {
    transform: translateY(-3px);
    border-color: rgba(232, 214, 180, 0.48);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 18px 34px rgba(5, 17, 15, 0.24);
}

.conditions-matters {
    padding-top: 70px;
    padding-bottom: 76px;
}

.conditions-matters-row {
    --bs-gutter-x: 2.8rem;
}

.conditions-matters-copy {
    max-width: 620px;
}

.conditions-matters-title {
    max-width: 11ch;
    margin-bottom: 14px;
}

.conditions-matters-intro {
    max-width: 58ch;
    margin-bottom: 22px;
}

.conditions-matters-list {
    margin-top: 6px;
}

.conditions-matters-list li {
    gap: 12px;
    margin-bottom: 18px;
}

.conditions-matters-icon {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    margin-top: 1px;
    border-radius: 50%;
    background: rgba(194, 165, 120, 0.12);
    border: 1px solid rgba(194, 165, 120, 0.22);
    color: #b79660;
    font-size: 0.84rem;
}

.conditions-matters-list strong {
    color: #1d2d2b;
    font-size: 0.98rem;
    margin-bottom: 5px;
}

.conditions-matters-list span {
    color: #666e77;
    font-size: 0.92rem;
    line-height: 1.58;
}

.conditions-matters-visual {
    max-width: 520px;
    margin-left: auto;
    border-radius: 18px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: 0 20px 42px rgba(23, 47, 40, 0.12);
}

.conditions-matters-image {
    width: 100%;
    min-height: 0;
    aspect-ratio: 1.45 / 1;
    object-fit: cover;
    object-position: center;
    border-radius: 18px;
}

.conditions-context {
    padding: 22px 0 84px;
    background: #ffffff;
}

.conditions-context .container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.conditions-context-stage {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 780px;
    overflow: hidden;
    border-radius: 0;
    background: #09131b;
    box-shadow: 0 28px 70px rgba(16, 31, 43, 0.2);
    isolation: isolate;
}

.conditions-context-stage::before,
.conditions-context-stage::after {
    content: "";
    position: absolute;
    pointer-events: none;
    z-index: 1;
}

.conditions-context-stage::before {
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255, 252, 247, 1) 0%, rgba(255, 252, 247, 1) 18%, rgba(255, 252, 247, 0.96) 31%, rgba(255, 252, 247, 0.86) 42%, rgba(255, 252, 247, 0.58) 51%, rgba(247, 250, 252, 0.22) 60%, rgba(18, 27, 36, 0.08) 100%);
}

.conditions-context-stage::after {
    left: 38%;
    top: -12%;
    width: 600px;
    height: 124%;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.76) 23%, rgba(255, 255, 255, 0.28) 49%, transparent 72%);
    transform: translateX(-50%);
    filter: blur(46px);
    opacity: 1;
}

.conditions-context-media {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.conditions-context-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(5, 14, 23, 0.22) 0%, rgba(5, 14, 23, 0.06) 24%, rgba(5, 14, 23, 0.08) 100%),
        linear-gradient(90deg, rgba(255,255,255,0.04) 0%, transparent 18%, transparent 100%);
    pointer-events: none;
}

.conditions-context-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 62% center;
    transform: scale(1.045);
}

.conditions-context-copy {
    position: relative;
    z-index: 2;
    width: min(100%, 700px);
    padding: 112px clamp(34px, 5.6vw, 82px) 88px clamp(34px, 6.6vw, 102px);
}

.conditions-context-title {
    max-width: 10.8ch;
    margin-bottom: 26px;
    color: #152721;
    line-height: 0.8;
    font-size: clamp(3.7rem, 5.5vw, 5.8rem);
    letter-spacing: -0.082em;
    text-wrap: balance;
}

.conditions-context-title span {
    display: block;
}

.conditions-context-intro {
    max-width: 52ch;
    margin: 0 0 36px;
    color: #727b84;
    font-size: 0.96rem;
    line-height: 1.82;
}

.conditions-context-list {
    max-width: 540px;
    margin: 0;
}

.conditions-context-list li {
    gap: 12px;
    margin-bottom: 18px;
}

.conditions-context-list li:last-child {
    margin-bottom: 0;
}

.conditions-context-icon {
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    margin-top: 3px;
    border-radius: 50%;
    background: rgba(194, 165, 120, 0.1);
    border: 1px solid rgba(194, 165, 120, 0.24);
    color: #c19a61;
    font-size: 0.72rem;
}

.conditions-context-list strong {
    color: #1d2d2b;
    font-size: 0.97rem;
    margin-bottom: 4px;
}

.conditions-context-list span {
    color: #65707a;
    font-size: 0.89rem;
    line-height: 1.58;
}

.conditions-cta-section {
    padding: 12px 0 0;
    background:
        radial-gradient(circle at 14% 50%, rgba(194, 165, 120, 0.07), transparent 22%),
        radial-gradient(circle at 82% 16%, rgba(194, 165, 120, 0.04), transparent 20%),
        linear-gradient(90deg, #173f3a 0%, #133530 45%, #102b28 100%);
    border-top: 1px solid rgba(194, 165, 120, 0.12);
}

.conditions-cta-panel {
    display: grid;
    grid-template-columns: minmax(420px, 0.92fr) minmax(420px, 1.08fr);
    align-items: center;
    gap: 18px;
    min-height: 540px;
    overflow: hidden;
    padding: 22px 34px 0;
    border: 1px solid rgba(194, 165, 120, 0.14);
    border-bottom: 0;
    background:
        radial-gradient(circle at 26% 58%, rgba(104, 180, 154, 0.08), transparent 22%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.015) 0%, rgba(255, 255, 255, 0.008) 100%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.015) 0%, rgba(255, 255, 255, 0) 22%, rgba(255, 255, 255, 0) 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.03),
        inset 0 -1px 0 rgba(194, 165, 120, 0.12);
}

.conditions-cta-visual {
    position: relative;
    align-self: stretch;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 34px 18px 0;
    min-height: 500px;
}

.conditions-cta-dashboard {
    position: absolute;
    left: 34px;
    right: 28px;
    top: 74px;
    height: 246px;
    border-radius: 22px;
    border: 1px solid rgba(194, 165, 120, 0.12);
    background:
        linear-gradient(180deg, rgba(255,255,255,0.032) 0%, rgba(255,255,255,0.014) 100%);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.018),
        0 22px 42px rgba(7, 18, 16, 0.18);
    z-index: 0;
}

.conditions-cta-dashboard::before {
    content: "";
    position: absolute;
    inset: 22px 26px 24px 26px;
    border-radius: 16px;
    border: 1px solid rgba(194, 165, 120, 0.08);
    background:
        linear-gradient(90deg, rgba(255,255,255,0.032) 0, rgba(255,255,255,0.032) 1px, transparent 1px, transparent 100%),
        linear-gradient(180deg, rgba(255,255,255,0.028) 0, rgba(255,255,255,0.028) 1px, transparent 1px, transparent 100%),
        linear-gradient(180deg, rgba(255,255,255,0.018), rgba(255,255,255,0.006));
    background-size: 102px 100%, 100% 56px, auto;
}

.conditions-cta-dashboard-header {
    position: absolute;
    left: 24px;
    right: 24px;
    top: 14px;
    display: flex;
    justify-content: space-between;
    z-index: 1;
}

.conditions-cta-dashboard-header span {
    display: block;
    height: 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
}

.conditions-cta-dashboard-header span:first-child {
    width: 118px;
}

.conditions-cta-dashboard-header span:last-child {
    width: 78px;
}

.conditions-cta-dashboard-body {
    position: absolute;
    inset: 34px 26px 22px;
    display: grid;
    grid-template-columns: 88px 1fr;
    gap: 18px;
    z-index: 1;
}

.conditions-cta-dashboard-sidebar {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding-top: 18px;
}

.conditions-cta-dashboard-sidebar span {
    width: 44px;
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.07);
}

.conditions-cta-dashboard-main {
    display: grid;
    grid-template-rows: 1fr auto;
    gap: 16px;
}

.conditions-cta-dashboard-top {
    display: grid;
    grid-template-columns: 108px 1fr 1fr;
    gap: 14px;
    align-items: stretch;
}

.conditions-cta-dashboard-ring,
.conditions-cta-dashboard-stat,
.conditions-cta-dashboard-bar,
.conditions-cta-dashboard-mini {
    border-radius: 12px;
    border: 1px solid rgba(194, 165, 120, 0.08);
    background: rgba(255, 255, 255, 0.018);
}

.conditions-cta-dashboard-ring {
    position: relative;
}

.conditions-cta-dashboard-ring::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    background:
        radial-gradient(circle at center, #234640 0 17px, transparent 18px),
        conic-gradient(#dfbf78 0 112deg, #d96664 112deg 220deg, #4fc5c0 220deg 360deg);
    box-shadow: 0 0 18px rgba(223, 191, 120, 0.18);
}

.conditions-cta-dashboard-stat {
    position: relative;
    overflow: hidden;
}

.conditions-cta-dashboard-stat::before,
.conditions-cta-dashboard-stat::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.conditions-cta-dashboard-stat::before {
    top: 18px;
    height: 6px;
}

.conditions-cta-dashboard-stat::after {
    top: 36px;
    right: 44px;
    height: 28px;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
}

.conditions-cta-dashboard-bottom {
    display: grid;
    grid-template-columns: 1.2fr 1fr 0.82fr;
    gap: 14px;
    min-height: 74px;
}

.conditions-cta-dashboard-bar,
.conditions-cta-dashboard-mini {
    position: relative;
    overflow: hidden;
}

.conditions-cta-dashboard-bar::before,
.conditions-cta-dashboard-mini::before {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    top: 16px;
    height: 34px;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
}

.conditions-cta-dashboard-bar::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 40%;
    bottom: 14px;
    height: 6px;
    border-radius: 999px;
    background: rgba(223, 191, 120, 0.45);
}

.conditions-cta-image {
    position: relative;
    z-index: 2;
    width: min(100%, 395px);
    height: auto;
    object-fit: contain;
    object-position: center bottom;
    transform: translate(-34px, -2px);
    filter:
        drop-shadow(0 0 0.5px rgba(223, 166, 81, 0.75))
        drop-shadow(0 18px 30px rgba(7, 18, 16, 0.3));
}

.conditions-cta-copy {
    max-width: 960px;
    padding: 22px 24px 58px 0;
    color: #ffffff;
}

.conditions-cta-kicker {
    display: inline-block;
    color: #bca46e;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.conditions-cta-title {
    width: 100%;
    max-width: none;
    margin: 0 0 24px;
    color: #efe2c8;
    font-family: var(--font-serif);
    font-size: clamp(2.18rem, 2.55vw, 2.88rem);
    line-height: 0.93;
    letter-spacing: -0.05em;
    text-wrap: balance;
}

.conditions-cta-text {
    max-width: 48ch;
    margin: 0;
    color: rgba(240, 237, 230, 0.82);
    font-size: 1rem;
    line-height: 1.6;
}

.conditions-cta-signals {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 30px;
}

.conditions-cta-signals span {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(216, 195, 149, 0.18);
    background: rgba(255, 255, 255, 0.016);
    color: rgba(244, 238, 228, 0.76);
    font-size: 0.82rem;
    font-weight: 700;
}

.conditions-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
    padding: 0 28px;
    border-radius: 999px;
    border: 1px solid rgba(216, 195, 149, 0.2);
    background: rgba(255, 255, 255, 0.018);
    color: rgba(244, 238, 228, 0.92);
    font-size: 0.98rem;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.conditions-cta-button:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(216, 195, 149, 0.75);
}

@media (max-width: 991px) {
    .premium-conditions-page .page-hero {
        min-height: auto;
        padding: 48px 0 42px;
    }

    .conditions-hero-content {
        max-width: 100%;
        padding: 34px 0 26px;
    }

    .conditions-hero-title {
        max-width: 10.5ch;
        font-size: clamp(2.9rem, 8vw, 3.9rem);
    }

    .conditions-hero-layout {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .conditions-hero-aside {
        justify-content: flex-start;
    }

    .conditions-hero-panel {
        width: min(100%, 420px);
    }

    .conditions-hero-meta {
        margin-top: 18px;
    }

    .conditions-architecture,
    .conditions-focus,
    .conditions-matters {
        padding-top: 54px;
        padding-bottom: 56px;
    }

    .conditions-architecture {
        padding-top: 0;
        padding-bottom: 0;
    }

    .conditions-architecture-stage {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 32px 0 44px;
    }

    .conditions-architecture-copy-panel {
        padding: 34px 0 10px;
        min-height: auto;
    }

    .conditions-architecture-media {
        padding: 0;
    }

    .conditions-architecture-visual {
        min-height: 500px;
        padding-top: 14px;
    }

    .conditions-prevention-screen {
        width: min(100%, 680px);
        margin: 0 auto;
    }

    .conditions-prevention-screen img {
        min-height: 360px;
    }

    .conditions-prevention-card-left {
        left: 16px;
        top: 48px;
    }

    .conditions-prevention-card-right {
        right: 16px;
        top: 150px;
    }

    .conditions-prevention-pill {
        left: 42px;
    }

    .conditions-focus-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .conditions-focus-shell {
        padding: 28px 22px 30px;
    }

    .conditions-matters-row {
        --bs-gutter-x: 1.8rem;
    }

    .conditions-matters-copy {
        max-width: 100%;
    }

    .conditions-matters-visual {
        max-width: 100%;
        margin-left: 0;
    }

    .conditions-cta-panel {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: auto;
        padding: 24px 24px 0;
    }

    .conditions-cta-visual {
        min-height: 340px;
        padding: 8px 16px 0;
    }

    .conditions-cta-dashboard {
        left: 18px;
        right: 18px;
        top: 34px;
        height: 184px;
    }

    .conditions-cta-dashboard-body {
        grid-template-columns: 62px 1fr;
        gap: 12px;
    }

    .conditions-cta-dashboard-top {
        grid-template-columns: 88px 1fr 1fr;
        gap: 10px;
    }

    .conditions-cta-image {
        width: min(100%, 320px);
        transform: translateY(8px);
    }

    .conditions-cta-copy {
        max-width: 100%;
        padding: 10px 0 42px;
        text-align: center;
    }

    .conditions-cta-title {
        max-width: none;
        margin-bottom: 18px;
        font-size: clamp(2.25rem, 5.6vw, 3.1rem);
        line-height: 1;
    }

    .conditions-cta-text {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .premium-conditions-page .container {
        padding-left: 18px;
        padding-right: 18px;
    }

    .premium-conditions-page .page-hero {
        padding: 40px 0 34px;
    }

    .premium-conditions-page .page-hero-bg img {
        object-position: center center;
        opacity: 0.12;
    }

    .premium-conditions-page .page-hero-overlay {
        background:
            linear-gradient(180deg, rgba(18, 59, 54, 0.92) 0%, rgba(18, 59, 54, 0.72) 100%);
    }

    .conditions-hero-badge {
        min-height: 38px;
        padding: 0 18px;
        font-size: 0.68rem;
        line-height: 38px;
        margin-bottom: 14px;
    }

    .conditions-hero-title {
        max-width: none;
        font-size: clamp(2.45rem, 11vw, 3.1rem);
        line-height: 0.9;
    }

    .conditions-hero-line {
        white-space: normal;
    }

    .conditions-hero-copy {
        max-width: 100%;
        font-size: 0.96rem;
        line-height: 1.6;
    }

    .conditions-hero-panel {
        width: 100%;
        padding: 16px;
        border-radius: 22px;
    }

    .conditions-hero-panel-stat strong {
        font-size: 2.5rem;
    }

    .conditions-hero-meta {
        gap: 8px;
        margin-top: 16px;
    }

    .conditions-hero-meta span {
        min-height: 32px;
        padding: 0 12px;
        font-size: 0.74rem;
    }

    .conditions-architecture-title,
    .conditions-matters-title {
        max-width: none;
    }

    .conditions-architecture-title span {
        white-space: normal;
    }

    .conditions-architecture-copy-panel {
        padding: 28px 0 8px;
    }

    .conditions-highlight-box {
        margin-bottom: 16px;
    }

    .conditions-architecture-visual {
        min-height: auto;
        padding: 0;
    }

    .conditions-prevention-screen {
        padding: 8px;
        border-radius: 22px;
    }

    .conditions-prevention-screen img {
        min-height: 280px;
        border-radius: 16px;
    }

    .conditions-prevention-card {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        width: 100%;
        margin-top: 12px;
        border-radius: 18px;
    }

    .conditions-prevention-card h3 {
        max-width: none;
    }

    .conditions-prevention-pill {
        position: relative;
        left: auto;
        bottom: auto;
        margin-top: 12px;
        min-height: 46px;
        font-size: 0.82rem;
    }

    .conditions-focus {
        padding-top: 62px;
        padding-bottom: 62px;
    }

    .conditions-focus-head {
        margin-bottom: 28px;
    }

    .conditions-focus-shell {
        padding: 24px 16px 22px;
        border-radius: 24px;
    }

    .conditions-focus-shell::after {
        inset: 12px;
        border-radius: 18px;
    }

    .conditions-focus-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .conditions-focus-card .root360-approach-icon {
        width: 48px;
        height: 48px;
        font-size: 1.2rem;
    }

    .conditions-focus-card h3 {
        max-width: none;
    }

    .conditions-focus-card p {
        max-width: none;
    }

    .conditions-focus-watermark {
        font-size: 3.4rem;
    }

    .conditions-context {
        padding-top: 18px;
        padding-bottom: 72px;
    }

    .conditions-context-stage {
        min-height: 700px;
        border-radius: 0;
    }

    .conditions-context-stage::before {
        background:
            linear-gradient(90deg, rgba(255, 252, 247, 0.99) 0%, rgba(255, 252, 247, 0.97) 38%, rgba(255, 252, 247, 0.8) 52%, rgba(255, 252, 247, 0.4) 66%, rgba(14, 21, 27, 0.08) 100%);
    }

    .conditions-context-stage::after {
        left: 42%;
        width: 420px;
        height: 114%;
        filter: blur(32px);
    }

    .conditions-context-copy {
        max-width: 560px;
        padding: 96px 38px 80px;
    }

    .conditions-context-title {
        font-size: clamp(2.75rem, 6.6vw, 4rem);
        max-width: 10.5ch;
    }

    .conditions-context-intro {
        margin-bottom: 20px;
        font-size: 0.92rem;
    }

    .conditions-context-list li {
        margin-bottom: 16px;
    }

    .conditions-context-list span {
        font-size: 0.89rem;
    }

    .conditions-cta-title {
        font-size: clamp(2.25rem, 10vw, 3rem);
    }

    .conditions-cta-text {
        font-size: 0.92rem;
    }

    .conditions-cta-signals {
        justify-content: center;
        margin-bottom: 20px;
    }

    .conditions-cta-button {
        min-height: 44px;
        padding: 0 18px;
        font-size: 0.9rem;
    }
}

@media (max-width: 575px) {
    .premium-conditions-page .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .premium-conditions-page .page-hero {
        padding: 34px 0 30px;
    }

    .conditions-hero-title {
        font-size: clamp(2.1rem, 11.5vw, 2.7rem);
        letter-spacing: -0.05em;
        margin-bottom: 12px;
    }

    .conditions-hero-badge {
        min-height: 34px;
        padding: 0 14px;
        font-size: 0.62rem;
        line-height: 34px;
    }

    .conditions-hero-copy,
    .conditions-architecture-copy,
    .conditions-highlight-box p,
    .conditions-context-intro,
    .conditions-cta-text {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .conditions-hero-panel-grid {
        grid-template-columns: 1fr 1fr;
    }

    .conditions-hero-meta span,
    .conditions-cta-signals span {
        font-size: 0.72rem;
    }

    .conditions-focus {
        padding-top: 52px;
        padding-bottom: 52px;
    }

    .conditions-context {
        padding-top: 12px;
        padding-bottom: 58px;
    }

    .conditions-context-stage {
        min-height: auto;
        border-radius: 0;
    }

    .conditions-context-stage::before {
        inset: 0;
        background:
            linear-gradient(180deg, rgba(255, 251, 245, 0.97) 0%, rgba(255, 251, 245, 0.92) 28%, rgba(255, 251, 245, 0.68) 52%, rgba(255, 251, 245, 0.18) 100%);
    }

    .conditions-context-stage::after {
        top: 34%;
        left: 50%;
        width: 260px;
        height: 260px;
        transform: translate(-50%, -50%);
        filter: blur(26px);
    }

    .conditions-context-media img {
        object-position: 70% center;
    }

    .conditions-context-copy {
        max-width: none;
        padding: 54px 22px 310px;
    }

    .conditions-context-title {
        margin-bottom: 14px;
        font-size: clamp(2.35rem, 11vw, 3rem);
        line-height: 0.84;
        max-width: 10.2ch;
    }

    .conditions-context-list li {
        gap: 10px;
    }

    .conditions-context-icon {
        width: 28px;
        height: 28px;
        flex-basis: 28px;
        font-size: 0.78rem;
    }

    .conditions-cta-panel {
        gap: 2px;
        padding: 18px 16px 0;
    }

    .conditions-cta-dashboard {
        height: 162px;
    }

    .conditions-cta-copy {
        padding: 4px 0 28px;
    }

    .conditions-cta-title {
        max-width: none;
        font-size: clamp(2rem, 10vw, 2.65rem);
        margin-bottom: 10px;
        line-height: 1.02;
    }
}

/* ---------------- ROOT360 PAGE ---------------- */
.root360-page .page-hero {
    min-height: 388px;
    border-bottom: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 80% 14%, rgba(162, 187, 128, 0.18), transparent 12%),
        linear-gradient(90deg, #1a4742 0%, #163f3c 42%, #113532 100%);
}

.root360-page .page-hero::before,
.root360-page .page-hero::after {
    content: "";
    position: absolute;
    inset: auto;
    display: block;
    pointer-events: none;
}

.root360-page .page-hero::before {
    top: -68px;
    right: -40px;
    width: 920px;
    height: 520px;
    opacity: 0.24;
    background:
        radial-gradient(circle at 72% 16%, rgba(188, 208, 150, 0.24), transparent 12%),
        radial-gradient(circle at 74% 18%, transparent 0 88px, rgba(118, 164, 127, 0.12) 90px, transparent 114px),
        radial-gradient(circle at 76% 20%, transparent 0 166px, rgba(118, 164, 127, 0.08) 168px, transparent 196px),
        radial-gradient(circle at 78% 22%, transparent 0 248px, rgba(118, 164, 127, 0.05) 250px, transparent 280px);
    filter: blur(2px);
}

.root360-page .page-hero::after {
    right: 0;
    top: -18px;
    width: 980px;
    height: 460px;
    opacity: 0.22;
    background:
        radial-gradient(ellipse at 72% 16%, rgba(181, 205, 154, 0.16), transparent 30%),
        linear-gradient(122deg, transparent 42%, rgba(113, 163, 126, 0.12) 43%, transparent 45%) 0 0 / 220px 220px,
        linear-gradient(133deg, transparent 54%, rgba(113, 163, 126, 0.1) 55%, transparent 57%) 30px 20px / 250px 250px,
        linear-gradient(144deg, transparent 61%, rgba(113, 163, 126, 0.08) 62%, transparent 64%) 10px 0 / 280px 280px;
}

.root360-page .page-hero-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.root360-page .page-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
    opacity: 0.08;
    filter: grayscale(1) sepia(0.4) hue-rotate(45deg) saturate(0.6) brightness(0.62);
}

.root360-page .page-hero-overlay {
    background:
        linear-gradient(90deg, rgba(18, 59, 54, 0.88) 0%, rgba(18, 59, 54, 0.74) 40%, rgba(16, 47, 44, 0.48) 72%, rgba(16, 47, 44, 0.16) 100%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 0%, rgba(255, 255, 255, 0.035) 1px, transparent 1px, transparent 100%);
    background-size: auto, 118px 100%;
}

.root360-page .page-hero-content {
    position: relative;
    z-index: 2;
}

.root360-hero-content {
    max-width: 780px;
    padding: 26px 0 22px 2px;
}

.root360-hero-badge {
    display: inline-block;
    min-height: 34px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(230, 242, 255, 0.32);
    background: rgba(255, 255, 255, 0.12);
    color: rgba(243, 249, 255, 0.96);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 34px;
    text-transform: uppercase;
    margin-bottom: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.root360-hero-title {
    max-width: 9.8ch;
    color: #ffffff;
    font-size: clamp(3.25rem, 4.8vw, 4.55rem);
    line-height: 0.9;
    letter-spacing: -0.065em;
    margin-bottom: 16px;
    text-shadow: 0 8px 26px rgba(0, 0, 0, 0.08);
}

.root360-hero-line {
    display: block;
    white-space: nowrap;
}

.root360-hero-line-light {
    color: #ffffff;
}

.root360-hero-line-light,
.root360-hero-line-light * {
    color: #ffffff !important;
}

.root360-hero-line-accent {
    color: #89cff0;
}

.root360-hero-copy {
    max-width: none;
    color: rgba(245, 249, 255, 0.96);
    font-size: 0.9rem;
    line-height: 1.65;
    margin: 0;
    white-space: nowrap;
}

.root360-architecture {
    padding-top: 0;
    padding-bottom: 0;
    background:
        linear-gradient(180deg, #153f3b 0 18px, #f8f5ef 18px 100%);
}

.root360-page .section-architecture .section-label,
.root360-page .section-philosophy .section-label {
    color: #6d6f73;
}

.root360-page .section-architecture .section-label::before {
    background: rgba(194, 165, 120, 0.95);
}

.root360-page .section-architecture .section-heading,
.root360-page .section-philosophy .section-heading {
    color: var(--root-dark);
}

.root360-architecture-title {
    max-width: 9.8ch;
}

.root360-architecture-title span {
    display: block;
    white-space: nowrap;
}

.root360-architecture-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(320px, 0.98fr);
    gap: 0;
    align-items: center;
    padding: 34px 0 54px;
}

.root360-architecture-copy-panel {
    padding: 54px 52px 42px 24px;
    background: transparent;
    min-height: 260px;
}

.root360-architecture-copy-panel .architecture-left {
    max-width: 500px;
}

.root360-architecture-copy {
    max-width: 46ch;
    color: #474d54;
    font-size: 0.95rem;
    line-height: 1.55;
    margin-bottom: 14px;
}

.root360-architecture-copy-last {
    margin-bottom: 0;
}

.root360-highlight-box {
    max-width: 44ch;
    margin: 0 0 16px;
    padding: 10px 0 10px 14px;
    border-left: 3px solid #cfb083;
    background: linear-gradient(90deg, rgba(207, 176, 131, 0.08) 0%, rgba(207, 176, 131, 0.02) 100%);
}

.root360-highlight-box p {
    margin: 0;
    color: #5f6468;
    font-size: 0.94rem;
    line-height: 1.58;
    font-style: italic;
}

.root360-architecture-media {
    position: relative;
    padding: 0 18px 0 0;
}

.root360-architecture-visual {
    position: relative;
    margin-top: -44px;
    padding: 10px;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(245, 238, 225, 0.98), rgba(239, 229, 211, 0.96));
    border: 2px solid rgba(189, 166, 129, 0.8);
    box-shadow: 0 22px 46px rgba(35, 44, 39, 0.18);
}

.root360-architecture-visual img {
    width: 100%;
    min-height: 302px;
    object-fit: cover;
    border-radius: 16px;
}

.root360-video-overlay {
    position: absolute;
    inset: 10px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, rgba(18, 23, 29, 0.2), rgba(18, 23, 29, 0.34));
}

.root360-video-label {
    color: #ffffff;
    font-size: 0.96rem;
    font-weight: 700;
    text-shadow: 0 8px 18px rgba(0, 0, 0, 0.24);
}

.root360-methodology {
    background:
        radial-gradient(circle at 15% 16%, rgba(194, 165, 120, 0.12), transparent 24%),
        radial-gradient(circle at 82% 82%, rgba(127, 195, 176, 0.14), transparent 24%),
        linear-gradient(180deg, #0d2522 0%, #143531 100%);
    padding-top: 76px;
    padding-bottom: 80px;
}

.root360-methodology-head {
    max-width: 900px;
    margin-bottom: 40px;
}

.root360-methodology-subtitle {
    max-width: 72ch;
    color: rgba(233, 238, 233, 0.78);
}

.root360-approach-shell {
    position: relative;
    overflow: hidden;
    padding: 42px 46px 46px;
    border-radius: 34px;
    border: 1px solid rgba(220, 197, 159, 0.32);
    background:
        linear-gradient(180deg, rgba(8, 24, 22, 0.34), rgba(8, 24, 22, 0.08)),
        linear-gradient(180deg, rgba(15, 39, 36, 0.96), rgba(15, 44, 40, 0.9));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 26px 46px rgba(5, 17, 15, 0.28);
}

.root360-approach-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.32;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%),
        linear-gradient(rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 100%);
    background-size: 98px 100%, 100% 98px;
}

.root360-approach-head {
    position: relative;
    z-index: 1;
}

.root360-approach-head .sub-title {
    justify-content: center;
    margin-bottom: 16px;
    color: rgba(255, 255, 255, 0.8);
}

.root360-approach-head .sub-title::before {
    display: block;
    background: rgba(194, 165, 120, 0.9);
}

.root360-methodology-title {
    color: #f4eee5;
    font-size: clamp(2.6rem, 4vw, 3.7rem);
    margin-bottom: 14px;
    text-transform: none;
}

.root360-approach-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.root360-approach-card {
    position: relative;
    height: 100%;
    min-height: 214px;
    padding: 18px 18px 20px;
    border-radius: 18px;
    border: 1px solid rgba(220, 197, 159, 0.62);
    background:
        radial-gradient(circle at 16% 14%, rgba(255, 255, 255, 0.08), transparent 18%),
        linear-gradient(180deg, rgba(18, 48, 44, 0.96), rgba(12, 31, 29, 0.98));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 14px 28px rgba(5, 17, 15, 0.24);
    transition: transform 0.24s ease, border-color 0.24s ease, box-shadow 0.24s ease;
}

.root360-approach-card:hover {
    transform: translateY(-4px);
    border-color: rgba(234, 214, 177, 0.92);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 34px rgba(5, 17, 15, 0.28);
}

.root360-approach-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.root360-approach-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: rgba(241, 245, 240, 0.9);
    font-size: 1.18rem;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(227, 207, 170, 0.2);
}

.root360-approach-number {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    color: #3a3122;
    font-family: var(--font-serif);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    background:
        radial-gradient(circle at 30% 28%, #f6eac9 0%, #e0c58d 52%, #af8f58 100%);
    box-shadow:
        inset 0 2px 4px rgba(255, 255, 255, 0.42),
        0 8px 18px rgba(0, 0, 0, 0.22);
}

.root360-approach-card h3 {
    max-width: 14ch;
    color: #f7f5ef;
    font-family: var(--font-sans);
    font-size: 1.02rem;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.02em;
    margin-bottom: 12px;
}

.root360-approach-line {
    width: 34px;
    height: 1px;
    background: rgba(227, 207, 170, 0.88);
    margin-bottom: 12px;
}

.root360-approach-card p {
    max-width: 25ch;
    margin: 0;
    color: rgba(235, 239, 235, 0.82);
    font-size: 0.89rem;
    line-height: 1.55;
}

.root360-page .root360-methodology-title {
    color: #f4eee5;
    font-family: var(--font-serif);
}

.root360-page .root360-methodology-subtitle {
    color: rgba(255, 255, 255, 0.8);
}

.root360-insight {
    padding-top: 66px;
    padding-bottom: 72px;
}

.root360-beyond-row {
    --bs-gutter-x: 1.8rem;
}

.root360-beyond-media {
    width: 100%;
    max-width: 520px;
    overflow: hidden;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 248, 243, 0.96));
    border: 1px solid rgba(194, 165, 120, 0.22);
    box-shadow: 0 18px 36px rgba(23, 47, 40, 0.08);
}

.root360-beyond-image {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center center;
}

.root360-beyond-media-caption {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 64px;
    padding: 14px 20px;
    background: linear-gradient(180deg, #173f3b 0%, #123531 100%);
    color: #f4eee4;
    font-family: var(--font-serif);
    font-size: clamp(1.25rem, 2vw, 1.7rem);
    line-height: 1;
    letter-spacing: -0.03em;
    text-align: center;
}

.root360-beyond-copy-wrap {
    max-width: 620px;
    margin-left: -18px;
}

.root360-signal-visual {
    border-radius: 16px;
    box-shadow: none;
}

.root360-signal-visual .signal-visual-image {
    min-height: 370px;
}

.root360-insight-title {
    max-width: 12ch;
    font-size: clamp(2.4rem, 3.4vw, 3.35rem);
    line-height: 0.92;
    margin-bottom: 14px;
}

.root360-insight-title span {
    display: block;
    white-space: nowrap;
}

.root360-page .philosophy-copy {
    max-width: 60ch;
}

.root360-beyond-intro {
    max-width: 56ch;
    margin-bottom: 26px;
}

.root360-beyond-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 18px;
}

.root360-beyond-list li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.root360-beyond-dot {
    width: 11px;
    height: 11px;
    flex: 0 0 11px;
    margin-top: 8px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #f7e8bf 0%, #d3b072 60%, #b58e54 100%);
    box-shadow: 0 2px 8px rgba(181, 142, 84, 0.3);
}

.root360-beyond-list strong {
    display: block;
    color: var(--root-dark);
    font-size: 1rem;
    font-weight: 800;
    margin-bottom: 5px;
    letter-spacing: -0.02em;
}

.root360-beyond-list span {
    display: block;
    color: #66717b;
    font-size: 0.93rem;
    line-height: 1.68;
}

.root360-list-icon {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    margin-top: 4px;
    background: rgba(61, 188, 103, 0.12);
    border-color: rgba(61, 188, 103, 0.18);
    color: #30b85f;
    font-size: 0.7rem;
}

.root360-page .medical-list li {
    gap: 12px;
    margin-bottom: 18px;
}

.root360-page .medical-list strong {
    color: var(--root-dark);
    font-size: 0.98rem;
    margin-bottom: 4px;
}

.root360-page .medical-list span {
    font-size: 0.9rem;
    line-height: 1.62;
}

.root360-quote-section {
    padding: 0;
    background:
        radial-gradient(circle at 18% 50%, rgba(194, 165, 120, 0.1), transparent 24%),
        radial-gradient(circle at 82% 16%, rgba(194, 165, 120, 0.06), transparent 20%),
        linear-gradient(90deg, #163f3b 0%, #123632 38%, #10322f 100%);
}

.root360-founder-panel {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(360px, 1.1fr);
    align-items: center;
    gap: 34px;
    min-height: 420px;
    overflow: hidden;
}

.root360-founder-visual {
    align-self: stretch;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-top: 28px;
}

.root360-founder-image {
    width: min(100%, 400px);
    height: auto;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(0 20px 38px rgba(4, 14, 13, 0.28));
}

.root360-founder-copy {
    max-width: 620px;
    padding: 56px 18px 54px 0;
    color: #ffffff;
}

.root360-founder-kicker {
    display: inline-block;
    color: #d8c395;
    font-size: 0.95rem;
    font-weight: 500;
    margin-bottom: 8px;
}

.root360-founder-name {
    margin: 0 0 10px;
    color: #f4eee4;
    font-family: var(--font-serif);
    font-size: clamp(2.85rem, 4vw, 4.2rem);
    line-height: 0.94;
    letter-spacing: -0.05em;
}

.root360-founder-role {
    margin: 0 0 18px;
    color: rgba(243, 236, 223, 0.8);
    font-size: 0.95rem;
    line-height: 1.55;
}

.root360-founder-text {
    max-width: 58ch;
    margin: 0 0 28px;
    color: rgba(255, 255, 255, 0.84);
    font-size: 1rem;
    line-height: 1.68;
}

.root360-founder-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 22px;
    border-radius: 999px;
    border: 1px solid rgba(216, 195, 149, 0.46);
    color: #f4eee4;
    font-size: 0.95rem;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.root360-founder-button:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(216, 195, 149, 0.75);
}

@media (max-width: 1199px) {
    .root360-approach-shell {
        padding: 36px 28px 32px;
    }

    .root360-approach-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .root360-approach-card h3 {
        max-width: none;
    }
}

@media (max-width: 991px) {
    .root360-page .page-hero {
        min-height: auto;
        padding: 48px 0 42px;
    }

    .root360-hero-content {
        max-width: 100%;
        padding: 34px 0 26px;
    }

    .root360-hero-title {
        max-width: 10.5ch;
        font-size: clamp(2.9rem, 8vw, 3.9rem);
    }

    .root360-architecture,
    .root360-methodology,
    .root360-insight {
        padding-top: 54px;
        padding-bottom: 56px;
    }

    .root360-page .philosophy-row {
        --bs-gutter-x: 1.8rem;
    }

    .root360-beyond-row,
    .root360-page .root360-insight .root360-beyond-row {
        --bs-gutter-x: 1.5rem;
    }

    .root360-beyond-row {
        row-gap: 24px;
    }

    .root360-architecture {
        padding-top: 0;
        padding-bottom: 0;
    }

    .root360-architecture-stage {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 24px 0 40px;
    }

    .root360-architecture-copy-panel {
        padding: 34px 26px 12px;
        min-height: auto;
    }

    .root360-approach-shell {
        padding: 32px 24px 28px;
        border-radius: 28px;
    }

    .root360-approach-card {
        min-height: 200px;
    }

    .root360-beyond-media {
        max-width: 100%;
        margin: 0 auto;
    }

    .root360-beyond-copy-wrap {
        margin-left: 0;
        max-width: 100%;
    }

    .root360-architecture-media {
        padding: 0;
    }

    .root360-architecture-visual {
        margin-top: 0;
    }

    .root360-architecture-visual img,
    .root360-signal-visual .signal-visual-image {
        min-height: 300px;
    }

    .root360-founder-panel {
        grid-template-columns: 1fr;
        gap: 8px;
        min-height: auto;
        padding-top: 24px;
    }

    .root360-founder-visual {
        padding-top: 0;
    }

    .root360-founder-image {
        width: min(100%, 320px);
    }

    .root360-founder-copy {
        max-width: 100%;
        padding: 6px 0 42px;
        text-align: center;
    }

    .root360-founder-text {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .root360-page .container {
        padding-left: 18px;
        padding-right: 18px;
    }

    .root360-page .page-hero {
        padding: 40px 0 34px;
    }

    .root360-page .page-hero-overlay {
        background:
            linear-gradient(180deg, rgba(18, 59, 54, 0.92) 0%, rgba(18, 59, 54, 0.72) 100%);
    }

    .root360-page .page-hero::before {
        right: -180px;
        top: -30px;
        width: 420px;
        height: 260px;
        opacity: 0.18;
    }

    .root360-page .page-hero::after {
        right: -40px;
        top: 10px;
        width: 260px;
        height: 180px;
        opacity: 0.14;
    }

    .root360-page .page-hero-bg img {
        object-position: center center;
        opacity: 0.06;
    }

    .root360-hero-content {
        padding: 26px 0 20px;
    }

    .root360-hero-badge {
        min-height: 38px;
        padding: 0 18px;
        font-size: 0.68rem;
        line-height: 38px;
        margin-bottom: 14px;
    }

    .root360-hero-title {
        max-width: none;
        font-size: clamp(2.45rem, 11vw, 3.1rem);
        line-height: 0.9;
    }

    .root360-hero-line {
        white-space: normal;
    }

    .root360-hero-copy {
        max-width: 100%;
        font-size: 0.96rem;
        line-height: 1.6;
        white-space: normal;
    }

    .root360-page .section-architecture .section-heading,
    .root360-page .section-philosophy .section-heading,
    .root360-page .phase-title {
        font-size: clamp(2.05rem, 9vw, 2.65rem);
        text-wrap: balance;
    }

    .root360-architecture-title {
        max-width: none;
    }

    .root360-architecture-title span {
        white-space: normal;
    }

    .root360-architecture-copy-panel {
        padding: 28px 18px 8px;
    }

    .root360-highlight-box {
        padding-left: 12px;
    }

    .root360-architecture-visual {
        border-radius: 20px;
        padding: 8px;
    }

    .root360-architecture-visual img,
    .root360-signal-visual .signal-visual-image {
        min-height: 230px;
        border-radius: 14px;
    }

    .root360-video-overlay {
        inset: 8px;
        border-radius: 14px;
    }

    .root360-video-label {
        font-size: 0.88rem;
    }

    .root360-beyond-copy-col {
        order: 1;
    }

    .root360-beyond-visual-col {
        order: 2;
    }

    .root360-beyond-media-caption {
        min-height: 58px;
        font-size: clamp(1.15rem, 5vw, 1.45rem);
    }

    .root360-beyond-copy-wrap {
        padding-top: 4px;
    }

    .root360-insight-title {
        margin-bottom: 12px;
    }

    .root360-beyond-intro {
        max-width: 100%;
        margin-bottom: 20px;
    }

    .root360-beyond-list {
        gap: 14px;
    }

    .root360-beyond-list li {
        gap: 12px;
    }

    .root360-beyond-list strong {
        font-size: 0.96rem;
    }

    .root360-beyond-list span {
        font-size: 0.9rem;
        line-height: 1.58;
    }

    .root360-methodology {
        padding-top: 62px;
        padding-bottom: 62px;
    }

    .root360-methodology-head {
        margin-bottom: 28px;
    }

    .root360-methodology-subtitle {
        font-size: 0.92rem;
        line-height: 1.6;
    }

    .root360-approach-shell {
        padding: 26px 16px 18px;
        border-radius: 22px;
    }

    .root360-approach-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .root360-approach-card {
        min-height: auto;
        padding: 16px 16px 18px;
        border-radius: 16px;
    }

    .root360-approach-number {
        width: 54px;
        height: 54px;
        font-size: 1.7rem;
    }

    .root360-approach-icon {
        width: 30px;
        height: 30px;
        font-size: 1rem;
        border-radius: 8px;
    }

    .root360-approach-card h3 {
        max-width: none;
    }

    .root360-approach-card p {
        max-width: none;
    }

    .root360-insight-title {
        max-width: none;
    }

    .root360-insight-title span {
        white-space: normal;
    }

    .root360-founder-name {
        font-size: clamp(2.3rem, 10vw, 3rem);
    }

    .root360-founder-role,
    .root360-founder-text {
        font-size: 0.92rem;
    }

    .root360-founder-role {
        line-height: 1.6;
    }

    .root360-founder-copy {
        padding-bottom: 34px;
    }

    .root360-founder-kicker {
        font-size: 0.88rem;
    }

    .root360-founder-button {
        width: 100%;
        max-width: 220px;
        min-height: 44px;
        padding: 0 18px;
        font-size: 0.9rem;
        margin: 0 auto;
    }
}

@media (max-width: 575px) {
    .root360-page .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .root360-page .page-hero {
        padding: 34px 0 30px;
    }

    .root360-hero-title {
        font-size: clamp(2.1rem, 11.5vw, 2.7rem);
        letter-spacing: -0.05em;
        margin-bottom: 12px;
    }

    .root360-hero-badge {
        min-height: 34px;
        padding: 0 14px;
        font-size: 0.62rem;
        line-height: 34px;
    }

    .root360-hero-copy,
    .root360-architecture-copy,
    .root360-highlight-box p,
    .root360-beyond-intro,
    .root360-founder-text {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .root360-page .section-architecture .section-heading,
    .root360-page .section-philosophy .section-heading,
    .root360-page .phase-title {
        font-size: clamp(1.8rem, 9vw, 2.3rem);
        line-height: 0.98;
    }

    .root360-methodology {
        padding-top: 52px;
        padding-bottom: 52px;
    }

    .root360-approach-shell {
        padding: 22px 12px 16px;
        border-radius: 20px;
    }

    .root360-approach-card {
        padding: 15px 14px 16px;
    }

    .root360-approach-card-head {
        margin-bottom: 14px;
    }

    .root360-approach-number {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .root360-approach-icon {
        width: 28px;
        height: 28px;
        font-size: 0.95rem;
    }

    .root360-approach-card h3 {
        font-size: 0.96rem;
        margin-bottom: 10px;
    }

    .root360-approach-card p,
    .root360-beyond-list span {
        font-size: 0.88rem;
        line-height: 1.55;
    }

    .root360-beyond-row {
        row-gap: 18px;
    }

    .root360-beyond-media {
        border-radius: 16px;
    }

    .root360-beyond-image {
        aspect-ratio: 1.1 / 1;
    }

    .root360-beyond-media-caption {
        min-height: 54px;
        padding: 12px 16px;
        font-size: 1.1rem;
    }

    .root360-beyond-intro {
        margin-bottom: 16px;
    }

    .root360-beyond-list {
        gap: 12px;
    }

    .root360-beyond-list li {
        gap: 10px;
    }

    .root360-beyond-dot {
        width: 10px;
        height: 10px;
        flex-basis: 10px;
    }

    .root360-founder-panel {
        gap: 2px;
        padding-top: 18px;
    }

    .root360-founder-image {
        width: min(100%, 260px);
    }

    .root360-founder-copy {
        padding: 4px 0 28px;
    }

    .root360-founder-name {
        font-size: clamp(2rem, 10.5vw, 2.55rem);
        margin-bottom: 8px;
    }

    .root360-founder-role {
        font-size: 0.88rem;
        margin-bottom: 14px;
    }

    .root360-founder-text {
        margin-bottom: 20px;
    }
}

/* ---------------- HOW WE APPROACH PAGE ---------------- */
.approach-page .page-hero {
    min-height: 318px;
    padding: 0;
    background:
        linear-gradient(90deg, #0d4a45 0%, #0d4c46 40%, #0d453f 72%, #0b3c38 100%);
    border-bottom: 4px solid rgba(255, 255, 255, 0.98);
}

.approach-page .page-hero .container {
    position: relative;
    z-index: 2;
}

.approach-page .page-hero-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.approach-page .page-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0.92;
}

.approach-page .page-hero-overlay {
    inset: 0;
    background:
        linear-gradient(90deg, rgba(8, 40, 35, 0.94) 0%, rgba(9, 52, 45, 0.9) 34%, rgba(10, 63, 54, 0.72) 52%, rgba(10, 63, 54, 0.28) 74%, rgba(10, 63, 54, 0.06) 100%),
        linear-gradient(90deg, rgba(7, 49, 45, 0.16) 0%, rgba(7, 49, 45, 0.16) 1px, transparent 1px, transparent 100%);
    background-size: auto, 92px 100%;
    z-index: 1;
}

.approach-page .page-hero::before {
    left: -40px;
    top: -10px;
    width: 420px;
    height: 320px;
    opacity: 0.18;
    background:
        radial-gradient(circle at 18% 22%, transparent 42px, rgba(114, 191, 155, 0.12) 43px, transparent 56px),
        radial-gradient(circle at 10% 48%, transparent 68px, rgba(114, 191, 155, 0.1) 69px, transparent 84px),
        radial-gradient(circle at 36% 64%, transparent 54px, rgba(114, 191, 155, 0.1) 55px, transparent 68px);
}

.approach-page .page-hero::after {
    right: 160px;
    top: 18px;
    width: 360px;
    height: 240px;
    opacity: 0.14;
    background:
        radial-gradient(circle at 50% 50%, transparent 36px, rgba(114, 191, 155, 0.12) 37px, transparent 50px),
        radial-gradient(circle at 72% 18%, transparent 60px, rgba(114, 191, 155, 0.08) 61px, transparent 74px),
        radial-gradient(circle at 26% 22%, transparent 48px, rgba(114, 191, 155, 0.08) 49px, transparent 64px);
}

.approach-hero-stage {
    position: relative;
    z-index: 2;
    min-height: 318px;
    display: flex;
    align-items: center;
    padding: 30px 0 28px;
}

.approach-hero-copy {
    position: relative;
    z-index: 2;
    max-width: 640px;
    padding-left: 2px;
}

.approach-hero-title {
    max-width: none;
    color: #d7c09c;
    font-family: var(--font-serif);
    font-size: clamp(2.8rem, 3.95vw, 3.85rem);
    line-height: 0.92;
    letter-spacing: -0.045em;
    text-transform: uppercase;
    margin: 0 0 14px;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.18);
}

.approach-hero-title span {
    display: block;
    white-space: nowrap;
}

.approach-hero-text {
    max-width: none;
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.94rem;
    line-height: 1.42;
    margin: 0 0 20px;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.14);
}

.approach-hero-text span {
    display: block;
    white-space: nowrap;
}

.approach-hero-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(235, 225, 204, 0.62);
    background: linear-gradient(180deg, rgba(80, 112, 100, 0.5) 0%, rgba(44, 75, 64, 0.62) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 10px 24px rgba(7, 24, 21, 0.18);
    color: #f4efe4;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none;
}

.approach-hero-cta:hover {
    color: #ffffff;
    background: linear-gradient(180deg, rgba(94, 129, 116, 0.54) 0%, rgba(49, 81, 69, 0.7) 100%);
}

.approach-hero-cta i {
    font-size: 0.94rem;
    transform: rotate(-12deg);
}

.approach-intro-shell {
    background:
        radial-gradient(circle at 12% 8%, rgba(194, 165, 120, 0.09), transparent 28%),
        radial-gradient(circle at 88% 14%, rgba(194, 165, 120, 0.06), transparent 25%),
        linear-gradient(180deg, #fcfcf8 0%, #ffffff 100%);
}

.approach-intro-panel {
    position: relative;
    border-radius: 36px;
    padding: 48px 48px 42px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 249, 245, 0.98));
    border: 1px solid rgba(194, 165, 120, 0.18);
    box-shadow: 0 22px 44px rgba(31, 51, 44, 0.07);
}

.approach-intro-panel .section-label,
.approach-benefits .section-label {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #6d6f73;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 22px;
}

.approach-intro-panel .section-label::before,
.approach-benefits .section-label::before {
    content: "";
    width: 30px;
    height: 1px;
    background: rgba(194, 165, 120, 0.95);
}

.approach-intro-panel .section-heading {
    max-width: none;
    font-size: clamp(2.55rem, 3.2vw, 3.4rem);
    line-height: 0.96;
    letter-spacing: -0.045em;
}

.approach-intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
    gap: 44px;
    align-items: center;
}

.approach-intro-copy {
    max-width: 760px;
}

.approach-pull-quote {
    max-width: 17ch;
    margin: 0 0 24px;
    color: #1c231f;
    font-family: var(--font-serif);
    font-size: clamp(2.05rem, 3vw, 3rem);
    font-weight: 700;
    line-height: 1.04;
    letter-spacing: -0.04em;
}

.approach-intro-body {
    max-width: 60ch;
    color: #3f4946;
    font-size: 0.94rem;
    line-height: 1.55;
    margin: 0;
}

.approach-quote-stage {
    position: relative;
}

.approach-quote-card {
    position: relative;
    padding: 8px;
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(29, 76, 64, 0.96) 0%, rgba(17, 55, 47, 0.98) 100%);
    box-shadow: 0 18px 34px rgba(19, 44, 39, 0.22);
}

.approach-quote-card::before {
    content: "";
    position: absolute;
    inset: 7px;
    border-radius: 14px;
    border: 1px solid rgba(216, 196, 163, 0.42);
    pointer-events: none;
}

.approach-quote-card::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 18px;
    background:
        radial-gradient(circle at 10% 14%, rgba(216, 196, 163, 0.08), transparent 18%),
        radial-gradient(circle at 86% 18%, rgba(216, 196, 163, 0.06), transparent 22%),
        radial-gradient(circle at 20% 86%, rgba(216, 196, 163, 0.05), transparent 20%);
    pointer-events: none;
}

.approach-quote-card-inner {
    position: relative;
    min-height: 310px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 38px;
    overflow: hidden;
    background:
        radial-gradient(circle at 14% 10%, transparent 56px, rgba(155, 198, 183, 0.12) 57px, transparent 64px),
        radial-gradient(circle at 86% 82%, transparent 68px, rgba(155, 198, 183, 0.1) 69px, transparent 78px),
        linear-gradient(180deg, rgba(32, 81, 69, 0.94) 0%, rgba(17, 55, 47, 0.98) 100%);
}

.approach-quote-card-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.24;
    background:
        linear-gradient(135deg, transparent 0 47%, rgba(216, 196, 163, 0.08) 48%, transparent 49%) 0 0 / 120px 120px,
        linear-gradient(45deg, transparent 0 47%, rgba(216, 196, 163, 0.06) 48%, transparent 49%) 0 0 / 140px 140px;
}

.approach-quote-card-inner p {
    position: relative;
    z-index: 1;
    max-width: 11ch;
    margin: 0;
    color: #f4efe5;
    text-align: center;
    font-family: var(--font-serif);
    font-size: clamp(2rem, 2.7vw, 2.75rem);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.04em;
}

.approach-visual-stage {
    position: relative;
    padding: 22px 12px 18px;
}

.approach-visual-card {
    position: relative;
    z-index: 2;
}

.approach-visual-chip {
    position: absolute;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(194, 165, 120, 0.28);
    box-shadow: 0 12px 28px rgba(35, 50, 43, 0.12);
    color: #16352f;
    font-size: 0.88rem;
    font-weight: 700;
}

.approach-visual-chip i {
    color: #b5925e;
}

.approach-visual-chip-top {
    top: 0;
    right: -6px;
}

.approach-visual-chip-bottom {
    right: 18px;
    bottom: -2px;
}

.approach-principles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 32px;
}

.approach-principle {
    padding: 24px 22px 22px;
    border-radius: 24px;
    background: #f8f5ef;
    border: 1px solid rgba(194, 165, 120, 0.18);
}

.approach-principle-icon {
    width: 56px;
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(20, 58, 53, 0.08);
    color: #143a35;
    font-size: 1.55rem;
    margin-bottom: 14px;
}

.approach-principle h3 {
    font-family: var(--font-serif);
    color: var(--root-dark);
    font-size: 1.65rem;
    line-height: 0.98;
    letter-spacing: -0.04em;
    margin-bottom: 12px;
    max-width: 10ch;
}

.approach-principle p {
    color: #5d6671;
    font-size: 0.95rem;
    line-height: 1.65;
    margin: 0;
}

.approach-roadmap {
    position: relative;
    overflow: hidden;
}

.approach-roadmap::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.04)) 0 0 / 100% 1px no-repeat,
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 0%, transparent 0) 0 0 / 92px 100%;
    opacity: 0.22;
    pointer-events: none;
}

.approach-roadmap .phase-head {
    position: relative;
    z-index: 2;
    max-width: 820px;
    margin-bottom: 42px;
}

.approach-roadmap .phase-subtitle {
    max-width: 58ch;
}

.approach-roadmap .phase-grid {
    position: relative;
    z-index: 2;
}

.approach-roadmap .phase-card {
    min-height: 286px;
    padding: 24px 22px 20px;
    border-radius: 24px;
    border: 1px solid rgba(227, 207, 170, 0.14);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.03),
        0 18px 36px rgba(6, 18, 17, 0.16);
}

.approach-roadmap .phase-card::before {
    background:
        radial-gradient(circle at 16% 12%, rgba(255, 255, 255, 0.05), transparent 18%),
        linear-gradient(180deg, rgba(8, 17, 15, 0.04) 0%, rgba(8, 17, 15, 0.22) 32%, rgba(8, 17, 15, 0.64) 100%);
}

.phase-step-label {
    position: relative;
    z-index: 2;
    display: inline-block;
    color: rgba(227, 207, 170, 0.9);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.approach-roadmap .phase-number {
    top: 18px;
    right: 18px;
    font-size: 4.3rem;
    color: rgba(228, 194, 151, 0.98);
}

.approach-roadmap .phase-icon {
    margin-bottom: 16px;
}

.approach-roadmap .phase-card h4 {
    max-width: 14ch;
    font-size: 1.02rem;
    line-height: 1.06;
}

.approach-roadmap .phase-card p {
    max-width: 25ch;
    font-size: 0.84rem;
    line-height: 1.6;
}

.approach-benefits {
    background:
        radial-gradient(circle at 16% 10%, rgba(194, 165, 120, 0.07), transparent 24%),
        radial-gradient(circle at 82% 12%, rgba(194, 165, 120, 0.05), transparent 22%),
        linear-gradient(180deg, #fdfcf8 0%, #ffffff 100%);
}

.approach-benefits-head {
    max-width: 820px;
    margin: 0 auto 42px;
}

.approach-benefits .section-label {
    justify-content: center;
}

.approach-benefits .section-heading {
    max-width: none;
    margin: 0 auto 14px;
    font-size: clamp(2.4rem, 3vw, 3.2rem);
    line-height: 0.98;
}

.approach-benefits .section-heading span {
    display: block;
    white-space: nowrap;
}

.approach-benefits .approach-benefits-intro {
    max-width: 58ch;
    margin: 0 auto;
}

.approach-page .medical-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.benefit-panel {
    position: relative;
    height: 100%;
    padding: 34px 30px 28px;
    border-radius: 30px;
    border: 1px solid rgba(194, 165, 120, 0.18);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 249, 245, 0.96));
    box-shadow: 0 20px 42px rgba(26, 40, 34, 0.06);
}

.benefit-panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: 30px;
    right: 30px;
    height: 1px;
    background: linear-gradient(90deg, rgba(194, 165, 120, 0), rgba(194, 165, 120, 0.65), rgba(194, 165, 120, 0));
}

.benefit-kicker {
    display: inline-block;
    color: #8f7a57;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.benefit-title {
    color: var(--root-dark);
    font-family: var(--font-serif);
    font-size: clamp(1.95rem, 2.35vw, 2.45rem);
    line-height: 0.98;
    letter-spacing: -0.04em;
    margin-bottom: 24px;
    max-width: none;
}

.benefit-title span {
    display: block;
    white-space: nowrap;
}

.benefit-panel .medical-list li:last-child {
    margin-bottom: 0;
}

.approach-founder-section {
    padding-top: 76px;
    padding-bottom: 82px;
    background:
        radial-gradient(circle at 78% 18%, rgba(227, 207, 170, 0.1), transparent 28%),
        radial-gradient(circle at 16% 86%, rgba(117, 185, 164, 0.12), transparent 32%),
        linear-gradient(180deg, #07392f 0%, #062d27 100%);
}

.approach-founder-heading {
    display: flex;
    justify-content: center;
    padding-top: 0;
    margin-bottom: 34px;
}

.approach-founder-panel {
    display: grid;
    grid-template-columns: minmax(430px, 1.08fr) minmax(320px, 0.92fr);
    gap: 54px;
    align-items: center;
    min-height: auto;
    max-width: 1120px;
    margin: 0 auto;
    padding: 42px;
    border: 1px solid rgba(227, 207, 170, 0.18);
    border-radius: 30px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025));
    box-shadow: 0 28px 70px rgba(3, 21, 18, 0.22);
}

.approach-founder-visual {
    position: relative;
    width: 100%;
}

.founder-portrait-stage {
    position: relative;
    min-height: 430px;
    border-radius: 24px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background:
        radial-gradient(circle at 50% 34%, rgba(255, 255, 255, 0.45), transparent 26%),
        linear-gradient(180deg, #fbfaf6 0%, #f2f5ef 100%);
    border: 1px solid rgba(227, 207, 170, 0.28);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        0 20px 46px rgba(3, 21, 18, 0.2);
}

.founder-portrait-stage::before {
    content: "";
    position: absolute;
    top: 84px;
    left: 50%;
    width: 260px;
    height: 260px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: radial-gradient(circle at 50% 50%, rgba(13, 91, 86, 0.14), transparent 66%);
    filter: blur(6px);
}

.founder-portrait-label {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(7, 57, 47, 0.88);
    border: 1px solid rgba(227, 207, 170, 0.26);
    color: #fff7e7;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.founder-image-approach {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    object-position: center bottom;
    filter: none;
}

.approach-founder-copy {
    width: 100%;
    max-width: 820px;
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    text-align: center;
}

.approach-founder-copy .founder-kicker {
    margin-bottom: 12px;
    color: #e3cfaa;
    font-size: 0.94rem;
    font-weight: 600;
}

.approach-founder-copy .founder-name {
    max-width: 18ch;
    margin-bottom: 0;
    font-size: clamp(2.7rem, 4vw, 4.1rem);
    line-height: 0.96;
    letter-spacing: 0;
    text-shadow: 0 10px 20px rgba(7, 24, 21, 0.1);
}

.approach-founder-copy .founder-name span {
    display: block;
    white-space: nowrap;
}

.approach-founder-body {
    width: 100%;
    max-width: 600px;
    align-self: center;
}

.approach-founder-body .founder-kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    color: var(--root-accent);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.approach-founder-body .founder-kicker::before {
    content: "";
    width: 30px;
    height: 1px;
    background: var(--root-accent);
}

.approach-founder-body .founder-name {
    max-width: 13ch;
    margin: 0 0 22px;
    color: #f4eee5;
    font-size: clamp(2.7rem, 4vw, 4rem);
    line-height: 1.02;
    letter-spacing: 0;
}

.approach-founder-body .founder-name span {
    display: block;
}

.approach-founder-body .founder-name span:last-child {
    color: var(--root-accent);
}

.approach-founder-quote {
    position: relative;
    color: rgba(255, 255, 255, 0.88);
    font-family: var(--font-sans);
    font-size: clamp(1rem, 1.2vw, 1.14rem);
    line-height: 1.82;
    margin-bottom: 24px;
    max-width: 58ch;
}

.approach-founder-quote::before {
    content: "\"";
    position: absolute;
    left: -14px;
    top: -16px;
    color: rgba(227, 207, 170, 0.38);
    font-size: 4.2rem;
    line-height: 1;
}

.approach-founder-body .founder-role {
    margin-bottom: 10px;
    font-size: 1.04rem;
    font-weight: 700;
}

.approach-founder-body .founder-text {
    max-width: 46ch;
    font-size: 0.97rem;
    line-height: 1.7;
    margin-bottom: 28px;
}

.approach-founder-body .founder-button {
    min-height: 52px;
    padding: 0 34px;
    font-size: 0.98rem;
    border-color: rgba(227, 207, 170, 0.48);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.approach-cta-section {
    padding-top: 34px;
    padding-bottom: 72px;
}

.approach-page .approach-founder-section {
    padding-top: 82px;
    padding-bottom: 86px;
}

.approach-page .approach-founder-panel {
    grid-template-columns: minmax(440px, 1fr) minmax(340px, 0.82fr);
    gap: 52px;
    max-width: 1020px;
    padding: 34px 46px;
    border-radius: 24px;
}

.approach-page .approach-founder-body {
    max-width: 560px;
}

.approach-page .approach-founder-body .founder-name {
    max-width: 15.5ch;
    font-size: clamp(2.35rem, 3.15vw, 3.25rem);
    line-height: 1.04;
    margin-bottom: 16px;
}

.approach-page .approach-founder-quote {
    max-width: 52ch;
    font-size: 0.96rem;
    line-height: 1.64;
    margin-bottom: 18px;
}

.approach-page .approach-founder-quote::before {
    left: -12px;
    top: -18px;
    font-size: 3.2rem;
    opacity: 0.65;
}

.approach-page .approach-founder-body .founder-text {
    max-width: 44ch;
    margin-bottom: 22px;
}

.approach-page .approach-founder-body .founder-role {
    margin-bottom: 6px;
}

.approach-page .founder-portrait-stage {
    width: 100%;
    max-width: 330px;
    height: 440px;
    min-height: 0;
    margin-left: auto;
    border-radius: 24px;
    background: linear-gradient(180deg, #ffffff 0%, #f6f6f2 100%);
}

.approach-page .founder-image-approach {
    width: auto;
    max-width: 90%;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
}

.approach-cta-panel {
    position: relative;
    overflow: hidden;
    padding: 40px 28px 36px;
    border-radius: 18px;
    text-align: center;
    background:
        radial-gradient(circle at 20% 18%, rgba(126, 190, 160, 0.1), transparent 18%),
        radial-gradient(circle at 84% 50%, rgba(126, 190, 160, 0.08), transparent 22%),
        linear-gradient(90deg, #143f39 0%, #164842 46%, #1a4d46 100%);
    box-shadow: 0 24px 46px rgba(8, 27, 24, 0.18);
}

.approach-cta-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.16;
    background:
        radial-gradient(circle at 16% 38%, transparent 44px, rgba(189, 220, 201, 0.18) 45px, transparent 54px),
        radial-gradient(circle at 84% 24%, transparent 72px, rgba(189, 220, 201, 0.12) 73px, transparent 84px),
        linear-gradient(45deg, transparent 0 48%, rgba(255, 255, 255, 0.04) 49%, transparent 50%) 0 0 / 160px 160px;
    pointer-events: none;
}

.approach-cta-title {
    position: relative;
    z-index: 1;
    max-width: 34ch;
    margin: 0 auto 12px;
    color: #8fc08f;
    font-family: var(--font-serif);
    font-size: clamp(1.75rem, 2.5vw, 2.45rem);
    line-height: 0.98;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}

.approach-cta-title span {
    display: block;
    white-space: nowrap;
}

.approach-cta-copy {
    position: relative;
    z-index: 1;
    max-width: 44ch;
    margin: 0 auto 20px;
    color: rgba(244, 238, 228, 0.92);
    font-family: var(--font-serif);
    font-size: clamp(0.96rem, 1.25vw, 1.22rem);
    font-weight: 700;
    line-height: 1.18;
}

.approach-cta-copy span {
    display: block;
    white-space: nowrap;
}

.approach-cta-button {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 30px;
    border-radius: 999px;
    background: linear-gradient(180deg, #d0bc8e 0%, #bca36d 100%);
    color: #1c221d;
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(10, 27, 24, 0.2);
}

.approach-cta-button:hover {
    color: #141a16;
    background: linear-gradient(180deg, #d8c597 0%, #c0a972 100%);
}

.root360-page .approach-hero-copy {
    max-width: 600px;
}

.root360-page .approach-hero-title {
    max-width: 8.4ch;
}

.root360-page .approach-hero-text {
    max-width: 56ch;
}

.root360-page .approach-intro-copy .section-heading {
    max-width: 10ch;
}

.root360-page .approach-pull-quote {
    max-width: 16ch;
}

.root360-page .approach-intro-body {
    max-width: 58ch;
}

.root360-page .approach-principle h3 {
    max-width: 9ch;
}

.root360-page .root360-roadmap .phase-head {
    max-width: 900px;
}

.root360-page .root360-phase-grid .phase-card {
    min-height: 298px;
}

.root360-page .root360-phase-grid .phase-card h4 {
    max-width: 12ch;
    min-height: 3.3em;
}

.root360-page .root360-phase-grid .phase-card p {
    max-width: 27ch;
}

.root360-page .root360-insight {
    background:
        radial-gradient(circle at 14% 18%, rgba(194, 165, 120, 0.07), transparent 22%),
        radial-gradient(circle at 84% 16%, rgba(194, 165, 120, 0.05), transparent 18%),
        linear-gradient(180deg, #fcfcf8 0%, #ffffff 100%);
}

.root360-page .root360-insight .philosophy-row {
    --bs-gutter-x: 4rem;
}

.root360-page .root360-insight .root360-beyond-row {
    --bs-gutter-x: 4rem;
}

.root360-page .root360-insight .signal-visual {
    border-radius: 30px;
    padding: 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 249, 245, 0.96));
    border: 1px solid rgba(194, 165, 120, 0.22);
    box-shadow: 0 22px 44px rgba(23, 47, 40, 0.08);
}

.root360-page .root360-insight .signal-visual-image {
    border-radius: 22px;
}

.root360-page .root360-insight .section-label {
    margin-bottom: 20px;
}

.root360-page .root360-insight .section-heading {
    max-width: 10ch;
    font-size: clamp(2.5rem, 3vw, 3.35rem);
    line-height: 0.96;
    letter-spacing: -0.045em;
    margin-bottom: 16px;
}

.root360-page .root360-insight .philosophy-copy {
    max-width: 54ch;
    margin-bottom: 26px;
}

.root360-page .root360-insight .root360-insight-title {
    max-width: 12ch;
}

.root360-page .root360-insight .root360-beyond-copy-wrap {
    max-width: 600px;
}

.root360-page .section-label,
.root360-page .sub-title {
    font-family: "Manrope", sans-serif;
    color: #6d6f73;
}

.root360-page .section-heading,
.root360-page .phase-title,
.root360-page .root360-methodology-title {
    font-family: "Playfair Display", serif;
    color: var(--rp-teal-900);
}

.root360-page .philosophy-copy,
.root360-page .phase-subtitle {
    color: var(--rp-muted);
    font-family: "Manrope", sans-serif;
}

.root360-page .root360-methodology .sub-title {
    color: rgba(255, 255, 255, 0.8);
}

.root360-page .root360-methodology .sub-title::before {
    background: rgba(194, 165, 120, 0.9);
}

.root360-page .root360-methodology .phase-title,
.root360-page .root360-methodology .root360-methodology-title {
    color: #f4eee5;
}

.root360-page .root360-methodology .phase-subtitle,
.root360-page .root360-methodology .root360-methodology-subtitle {
    color: rgba(255, 255, 255, 0.8);
}

.root360-page .root360-insight .medical-list li {
    margin-bottom: 18px;
}

.root360-page .root360-insight .medical-list strong {
    display: block;
    margin-bottom: 4px;
}

.root360-page .root360-founder-section .approach-founder-copy .founder-name {
    max-width: 15ch;
}

.root360-page .root360-founder-section .approach-founder-quote {
    max-width: 24ch;
}

.root360-page .approach-cta-section {
    padding-top: 42px;
}

/* ---------------- ROOT CARE MODEL HERO ---------------- */
.care-model-page .care-model-hero {
    position: relative;
    min-height: 310px;
    padding: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 34% 42%, rgba(80, 160, 126, 0.18), transparent 24%),
        radial-gradient(circle at 70% 48%, rgba(42, 160, 151, 0.14), transparent 22%),
        radial-gradient(circle at 92% 18%, rgba(194, 165, 120, 0.08), transparent 20%),
        linear-gradient(90deg, #08251f 0%, #0d3b30 54%, #06251f 100%);
    border-bottom: 4px solid #ffffff;
}

.care-model-page .care-model-hero::before,
.care-model-page .care-model-hero::after {
    content: "";
    position: absolute;
    z-index: 2;
    pointer-events: none;
}

.care-model-page .care-model-hero::before {
    top: 40px;
    right: 314px;
    width: 280px;
    height: 170px;
    opacity: 0.28;
    background:
        linear-gradient(36deg, transparent 0 46%, rgba(214, 190, 130, 0.72) 47%, rgba(214, 190, 130, 0.72) 48%, transparent 49%) 0 0 / 100% 42px no-repeat,
        linear-gradient(-24deg, transparent 0 49%, rgba(214, 190, 130, 0.64) 50%, rgba(214, 190, 130, 0.64) 51%, transparent 52%) 12px 44px / 88% 42px no-repeat,
        linear-gradient(0deg, rgba(214, 190, 130, 0.55), rgba(214, 190, 130, 0.55)) 58px 22px / 64px 1px no-repeat,
        linear-gradient(0deg, rgba(214, 190, 130, 0.45), rgba(214, 190, 130, 0.45)) 128px 78px / 82px 1px no-repeat;
}

.care-model-page .care-model-hero::after {
    top: 78px;
    right: 188px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #d2b776;
    box-shadow:
        -110px -54px 0 rgba(210, 183, 118, 0.74),
        -74px 72px 0 rgba(210, 183, 118, 0.66),
        42px 18px 0 rgba(210, 183, 118, 0.5);
}

.care-model-page .care-model-hero .page-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 66% 50%, rgba(26, 128, 118, 0.24), transparent 30%);
}

.care-model-page .care-model-hero .page-hero-bg img {
    display: none;
}

.care-model-page .care-model-figure {
    position: absolute;
    top: 22px;
    left: 55%;
    z-index: 2;
    width: 230px;
    height: 270px;
    transform: translateX(-50%);
    opacity: 0.92;
    pointer-events: none;
    filter: drop-shadow(0 0 24px rgba(103, 220, 204, 0.22));
}

.care-model-page .care-model-figure::before {
    content: "";
    position: absolute;
    inset: -12px -60px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 30%, rgba(123, 231, 215, 0.22) 0 6px, transparent 7px),
        radial-gradient(circle at 50% 30%, transparent 0 52px, rgba(123, 231, 215, 0.2) 53px 55px, transparent 56px),
        radial-gradient(circle at 50% 30%, transparent 0 86px, rgba(123, 231, 215, 0.12) 87px 89px, transparent 90px),
        linear-gradient(90deg, transparent 0 45%, rgba(123, 231, 215, 0.18) 45.5%, transparent 46%) 0 0 / 100% 100%;
}

.care-model-page .care-model-figure::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 64px;
    width: 118px;
    height: 168px;
    transform: translateX(-50%);
    border-radius: 54px 54px 44px 44px;
    border: 2px solid rgba(136, 226, 216, 0.54);
    background:
        radial-gradient(circle at 50% 42%, rgba(223, 96, 76, 0.54) 0 11px, transparent 13px),
        radial-gradient(ellipse at 50% 70%, rgba(211, 176, 105, 0.38) 0 20px, transparent 22px),
        linear-gradient(90deg, transparent 0 48%, rgba(134, 220, 212, 0.4) 49%, rgba(134, 220, 212, 0.4) 51%, transparent 52%),
        radial-gradient(ellipse at center, rgba(68, 185, 179, 0.12), transparent 72%);
    box-shadow:
        inset 0 0 32px rgba(101, 223, 209, 0.16),
        0 0 22px rgba(101, 223, 209, 0.12);
}

.care-model-page .figure-head,
.care-model-page .figure-spine,
.care-model-page .figure-torso,
.care-model-page .figure-heart,
.care-model-page .figure-gut,
.care-model-page .figure-arm,
.care-model-page .figure-label {
    position: absolute;
    display: block;
}

.care-model-page .figure-head {
    left: 50%;
    top: 10px;
    width: 60px;
    height: 60px;
    transform: translateX(-50%);
    border-radius: 50%;
    border: 2px solid rgba(136, 226, 216, 0.58);
    background:
        radial-gradient(circle at 58% 42%, rgba(223, 96, 76, 0.48) 0 9px, transparent 10px),
        radial-gradient(circle at 50% 50%, rgba(84, 193, 188, 0.16), transparent 70%);
}

.care-model-page .figure-spine {
    left: 50%;
    top: 76px;
    width: 3px;
    height: 150px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(235, 117, 84, 0.88), rgba(225, 188, 106, 0.66));
    box-shadow: 0 0 12px rgba(235, 117, 84, 0.48);
}

.care-model-page .figure-arm {
    top: 96px;
    width: 2px;
    height: 126px;
    border-radius: 999px;
    background: rgba(123, 231, 215, 0.5);
}

.care-model-page .arm-left {
    left: 44px;
    transform: rotate(12deg);
}

.care-model-page .arm-right {
    right: 44px;
    transform: rotate(-12deg);
}

.care-model-page .figure-label {
    height: 1px;
    background: rgba(213, 188, 126, 0.62);
}

.care-model-page .figure-label::after {
    content: "";
    position: absolute;
    right: -4px;
    top: -3px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(213, 188, 126, 0.82);
}

.care-model-page .label-one {
    top: 36px;
    left: -76px;
    width: 92px;
    transform: rotate(24deg);
}

.care-model-page .label-two {
    top: 108px;
    right: -90px;
    width: 112px;
    transform: rotate(-18deg);
}

.care-model-page .label-three {
    top: 178px;
    left: -92px;
    width: 118px;
    transform: rotate(-10deg);
}

.care-model-page .care-model-hero .page-hero-overlay {
    z-index: 2;
    background:
        linear-gradient(90deg, rgba(5, 31, 25, 0.72) 0%, rgba(5, 31, 25, 0.28) 38%, rgba(5, 31, 25, 0.18) 58%, rgba(5, 31, 25, 0.64) 100%),
        linear-gradient(90deg, transparent 0 53%, rgba(213, 188, 126, 0.08) 53% 53.2%, transparent 53.2%),
        radial-gradient(circle at 65% 46%, transparent 0 110px, rgba(6, 33, 27, 0.18) 112px, transparent 190px);
}

.care-model-page .care-model-hero .container {
    position: relative;
    z-index: 3;
    min-height: 310px;
    display: flex;
    align-items: center;
}

.care-model-page .care-model-hero .page-hero-content {
    display: grid;
    grid-template-columns: minmax(0, 0.56fr) minmax(270px, 0.44fr);
    align-items: center;
    gap: 28px;
    width: 100%;
    max-width: none;
    padding: 0;
}

.care-model-page .care-model-hero .hero-badge,
.care-model-page .care-model-hero .hero-subtitle {
    display: none !important;
}

.care-model-page .care-model-hero .hero-title {
    max-width: 720px;
    margin: 0;
    color: #cdb27b;
    font-size: clamp(3rem, 4.35vw, 4.75rem);
    line-height: 0.92;
    letter-spacing: -0.055em;
    text-shadow: 0 12px 24px rgba(4, 22, 18, 0.18);
    white-space: nowrap;
}

.care-model-page .care-model-hero-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    padding: 0 34px;
    justify-self: end;
    margin-right: 34px;
    border-radius: 18px;
    border: 1px solid rgba(91, 67, 33, 0.36);
    background: linear-gradient(180deg, #d0b36f 0%, #b49455 100%);
    color: #1d2118;
    font-size: 1rem;
    font-weight: 850;
    text-decoration: none;
    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.18),
        0 10px 22px rgba(3, 17, 14, 0.34);
}

.care-model-page .care-model-hero-btn:hover {
    color: #151811;
    filter: brightness(1.06);
}

@media (max-width: 991px) {
    .care-model-page .care-model-hero {
        min-height: auto;
    }

    .care-model-page .care-model-hero .container {
        min-height: auto;
        padding-top: 64px;
        padding-bottom: 58px;
    }

    .care-model-page .care-model-hero .page-hero-bg img {
        display: none;
    }

    .care-model-page .care-model-figure {
        left: auto;
        right: -32px;
        opacity: 0.26;
        transform: none;
    }

    .care-model-page .care-model-hero .page-hero-content {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .care-model-page .care-model-hero .hero-title {
        white-space: normal;
    }

    .care-model-page .care-model-hero-btn {
        width: fit-content;
        margin-right: 0;
        justify-self: start;
    }
}

@media (max-width: 767px) {
    .care-model-page .care-model-hero .container {
        padding-top: 48px;
        padding-bottom: 46px;
    }

    .care-model-page .care-model-hero .hero-title {
        font-size: clamp(2.45rem, 12vw, 3.4rem);
    }

    .care-model-page .care-model-hero-btn {
        min-height: 48px;
        padding: 0 22px;
        border-radius: 14px;
        font-size: 0.92rem;
    }

    .care-model-page .care-model-figure {
        right: -86px;
        opacity: 0.18;
    }
}

@media (max-width: 1199px) {
    .approach-hero-copy {
        max-width: 560px;
    }

    .approach-hero-title {
        font-size: clamp(2.55rem, 4.2vw, 3.45rem);
    }

    .approach-principle h3 {
        max-width: none;
        font-size: 1.45rem;
    }

    .approach-founder-panel {
        grid-template-columns: minmax(360px, 1fr) minmax(280px, 0.9fr);
        gap: 30px;
        padding: 34px;
    }

    .founder-portrait-stage {
        min-height: 390px;
    }

    .approach-founder-body .founder-name {
        font-size: clamp(2.55rem, 3.8vw, 3.7rem);
    }

    .approach-founder-quote {
        font-size: clamp(1.14rem, 1.7vw, 1.34rem);
    }

    .root360-page .root360-insight .philosophy-row {
        --bs-gutter-x: 2rem;
    }

    .root360-page .root360-phase-grid .phase-card {
        min-height: 284px;
    }
}

@media (max-width: 991px) {
    .approach-page .page-hero {
        min-height: auto;
        padding: 0;
    }

    .approach-hero-copy {
        max-width: none;
    }

    .approach-hero-title {
        max-width: none;
        font-size: clamp(2.4rem, 8vw, 3.3rem);
    }

    .approach-hero-title span,
    .approach-hero-text span {
        white-space: normal;
    }

    .approach-hero-text {
        max-width: 34ch;
        font-size: 0.92rem;
    }

    .approach-intro-panel {
        padding: 34px 26px 28px;
        border-radius: 28px;
    }

    .approach-intro-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .approach-intro-panel .section-heading {
        max-width: none;
    }

    .approach-principles {
        grid-template-columns: 1fr;
    }

    .root360-page .approach-hero-title span,
    .root360-page .approach-hero-text span {
        white-space: normal;
    }

    .approach-roadmap .phase-card,
    .benefit-panel {
        min-height: auto;
    }

    .approach-benefits .section-heading {
        max-width: none;
    }

    .approach-benefits .section-heading span,
    .benefit-title span {
        white-space: normal;
    }

    .approach-founder-panel {
        grid-template-columns: 1fr;
        gap: 26px;
        min-height: auto;
        padding: 28px;
    }

    .approach-founder-visual {
        order: -1;
    }

    .approach-founder-copy {
        max-width: 100%;
        margin: 0 auto;
    }

    .approach-founder-body,
    .approach-founder-body .founder-name,
    .approach-founder-copy .founder-name,
    .approach-founder-quote {
        max-width: none;
    }

    .approach-founder-body .founder-name span,
    .approach-founder-copy .founder-name span {
        white-space: normal;
    }

    .approach-founder-heading {
        padding-top: 0;
        margin-bottom: 26px;
    }

    .founder-portrait-stage {
        min-height: 390px;
    }

    .approach-cta-section {
        padding-top: 24px;
        padding-bottom: 56px;
    }

    .root360-page .root360-insight .section-heading {
        max-width: none;
    }

    .approach-page .approach-founder-panel {
        grid-template-columns: 1fr;
        max-width: 680px;
        padding: 28px;
        gap: 28px;
    }

    .approach-page .approach-founder-visual {
        order: -1;
    }

    .approach-page .founder-portrait-stage {
        max-width: 310px;
        height: 390px;
        margin: 0 auto;
    }

    .approach-page .approach-founder-body {
        max-width: none;
        text-align: left;
    }

    .approach-page .approach-founder-body .founder-name {
        max-width: 16ch;
        font-size: clamp(2.2rem, 7vw, 3rem);
    }
}

@media (max-width: 767px) {
    .approach-page .page-hero::before {
        left: -80px;
        top: 6px;
        width: 240px;
        height: 180px;
    }

    .approach-page .page-hero::after {
        right: -80px;
        top: 10px;
        width: 220px;
        height: 160px;
    }

    .approach-hero-copy {
        max-width: 100%;
    }

    .approach-hero-title {
        font-size: clamp(2.05rem, 10.5vw, 2.9rem);
        line-height: 0.92;
        margin-bottom: 14px;
    }

    .approach-hero-text {
        max-width: 100%;
        font-size: 0.86rem;
        line-height: 1.46;
        margin-bottom: 18px;
    }

    .approach-hero-cta {
        min-height: 40px;
        padding: 0 14px;
        font-size: 0.78rem;
    }

    .approach-intro-panel {
        padding: 28px 18px 22px;
    }

    .approach-pull-quote {
        max-width: none;
        font-size: clamp(1.7rem, 8vw, 2.25rem);
        margin-bottom: 18px;
    }

    .approach-intro-body {
        font-size: 0.9rem;
    }

    .approach-quote-card {
        border-radius: 14px;
        padding: 6px;
    }

    .approach-quote-card::before {
        inset: 5px;
        border-radius: 11px;
    }

    .approach-quote-card-inner {
        min-height: 240px;
        border-radius: 10px;
        padding: 24px;
    }

    .approach-quote-card-inner p {
        max-width: 12ch;
        font-size: clamp(1.55rem, 7vw, 2rem);
    }

    .approach-principle {
        padding: 20px 18px;
        border-radius: 20px;
    }

    .approach-roadmap .phase-head,
    .approach-benefits-head {
        margin-bottom: 28px;
    }

    .phase-step-label {
        margin-bottom: 14px;
    }

    .approach-roadmap .phase-number {
        font-size: 3.8rem;
    }

    .benefit-panel {
        padding: 26px 20px 22px;
        border-radius: 22px;
    }

    .benefit-title {
        font-size: clamp(1.8rem, 8vw, 2.3rem);
        max-width: none;
    }

    .founder-portrait-stage {
        min-height: 340px;
        border-radius: 22px;
    }

    .founder-image-approach {
        width: 100%;
        max-height: none;
    }

    .approach-page .approach-founder-section {
        padding-top: 58px;
        padding-bottom: 62px;
    }

    .approach-page .approach-founder-panel {
        padding: 22px;
        border-radius: 22px;
    }

    .approach-page .founder-portrait-stage {
        max-width: 260px;
        height: 330px;
        min-height: 0;
        border-radius: 18px;
    }

    .approach-page .founder-portrait-label {
        top: 14px;
        left: 14px;
        min-height: 30px;
        padding: 0 12px;
        font-size: 0.62rem;
    }

    .approach-page .approach-founder-body .founder-name {
        max-width: none;
        font-size: clamp(2rem, 9vw, 2.55rem);
    }

    .approach-page .approach-founder-quote {
        font-size: 0.96rem;
        line-height: 1.66;
    }

    .approach-founder-quote::before {
        left: -8px;
        top: -16px;
        font-size: 3rem;
    }

    .approach-founder-body .founder-name {
        font-size: clamp(2.3rem, 10vw, 3rem);
        max-width: none;
    }

    .approach-founder-body .founder-role,
    .approach-founder-body .founder-text {
        font-size: 0.92rem;
    }

    .approach-founder-body .founder-button {
        min-height: 50px;
        padding: 0 24px;
        font-size: 0.94rem;
    }

    .approach-cta-panel {
        padding: 30px 18px 30px;
        border-radius: 22px;
    }

    .approach-cta-title {
        font-size: clamp(1.5rem, 7vw, 1.95rem);
        max-width: none;
    }

    .approach-cta-title span,
    .approach-cta-copy span {
        white-space: normal;
    }

    .approach-cta-copy {
        font-size: clamp(0.92rem, 4.5vw, 1.05rem);
        max-width: 100%;
    }

    .approach-cta-button {
        min-height: 44px;
        padding: 0 24px;
        font-size: 0.86rem;
    }

    .root360-page .root360-phase-grid .phase-card {
        min-height: auto;
    }
}

/* Root care hero final placement: image right, CTA links to contact page */
.care-model-page .care-model-hero .care-model-figure {
    display: none !important;
}

.care-model-page .care-model-hero .page-hero-bg img {
    display: block !important;
    position: absolute;
    top: 50%;
    right: 235px;
    left: auto;
    width: min(34vw, 500px);
    height: 118%;
    object-fit: cover;
    object-position: center;
    transform: translateY(-50%);
    opacity: 0.4;
    border-radius: 0;
    mix-blend-mode: screen;
    filter: saturate(0.9) contrast(1.06) brightness(0.82);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.9) 18%, #000 58%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.9) 18%, #000 58%, transparent 100%);
}

.care-model-page .care-model-hero .page-hero-content {
    grid-template-columns: minmax(0, 0.62fr) minmax(260px, 0.38fr);
}

.care-model-page .care-model-hero .hero-title,
.care-model-page .care-model-hero-btn {
    position: relative;
    z-index: 4;
}

.care-model-page .care-model-hero .hero-title {
    max-width: 760px;
}

.care-model-page .care-model-hero-btn {
    margin-right: 0;
    justify-self: end;
}

@media (max-width: 991px) {
    .care-model-page .care-model-hero .page-hero-bg img {
        right: -70px;
        width: 430px;
        opacity: 0.2;
    }

    .care-model-page .care-model-hero .page-hero-content {
        grid-template-columns: 1fr;
    }

    .care-model-page .care-model-hero-btn {
        justify-self: start;
    }
}

/* ---------------- ROOT CARE MODEL INTRO ---------------- */
.care-model-page .care-model-intro-section {
    position: relative;
    overflow: hidden;
    padding: 92px 0 96px;
    background:
        radial-gradient(circle at 9% 20%, rgba(194, 165, 120, 0.12), transparent 24%),
        radial-gradient(circle at 86% 18%, rgba(29, 73, 63, 0.06), transparent 22%),
        linear-gradient(180deg, #fffaf0 0%, #fbf6ea 100%);
}

.care-model-page .care-model-intro-section::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -90px;
    width: 420px;
    height: 270px;
    opacity: 0.11;
    background:
        repeating-linear-gradient(14deg, transparent 0 30px, rgba(24, 67, 60, 0.36) 31px 33px, transparent 34px 62px),
        radial-gradient(ellipse at 54% 45%, transparent 0 58%, rgba(24, 67, 60, 0.44) 59%, transparent 61%);
    pointer-events: none;
}

.care-model-page .care-model-intro-row {
    --bs-gutter-x: 5.2rem;
}

.care-model-page .care-model-intro-section .section-label {
    color: #685f4e;
    font-family: var(--font-sans);
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.care-model-page .care-model-intro-section .section-label::before {
    display: none;
}

.care-model-page .care-model-intro-title {
    max-width: 13ch !important;
    margin-bottom: 20px !important;
    color: #102e28 !important;
    font-size: clamp(2.45rem, 3.6vw, 4rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.035em !important;
}

.care-model-page .care-model-intro-section .section-heading:not(.care-model-intro-title) {
    max-width: 13ch;
    margin-bottom: 24px !important;
    color: #102e28;
    font-size: clamp(2.45rem, 3.6vw, 4rem);
    line-height: 1.02;
    letter-spacing: -0.035em;
}

.care-model-page .care-model-intro-title + .section-heading {
    display: block;
}

.care-model-page .care-model-intro-section .lead-text {
    max-width: 610px;
    color: #293f3a;
    font-size: clamp(1rem, 1.05vw, 1.14rem);
    line-height: 1.5;
    font-weight: 500;
}

.care-model-page .care-model-intro-section .highlight-box {
    position: relative;
    display: block;
    max-width: 700px;
    margin: 26px 0 0;
    padding: 18px 22px;
    border: 1px solid rgba(194, 165, 120, 0.22);
    border-left: 5px solid rgba(194, 165, 120, 0.9);
    border-radius: 0 14px 14px 0;
    background:
        linear-gradient(90deg, rgba(194, 165, 120, 0.13), rgba(255, 255, 255, 0.42));
    box-shadow: 0 14px 28px rgba(78, 66, 44, 0.06);
}

.care-model-page .care-model-intro-section .highlight-box p {
    color: #233d37;
    font-size: clamp(1rem, 1.05vw, 1.14rem);
    line-height: 1.5;
}

.care-model-page .care-model-intro-image {
    position: relative;
    overflow: hidden;
    padding: 8px;
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(139, 119, 80, 0.94), rgba(230, 213, 172, 0.78), rgba(122, 100, 65, 0.88));
    box-shadow:
        0 26px 46px rgba(58, 52, 39, 0.13),
        0 0 0 1px rgba(194, 165, 120, 0.28);
}

.care-model-page .care-model-intro-image::before {
    content: "";
    position: absolute;
    inset: 16px;
    z-index: 2;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 16px;
    pointer-events: none;
}

.care-model-page .care-model-intro-image img {
    display: block;
    width: 100%;
    aspect-ratio: 1.45 / 1;
    object-fit: cover;
    border-radius: 18px;
    filter: saturate(0.92) contrast(0.98) brightness(1.04);
}

.care-model-page .care-model-intro-image .floating-card {
    display: none;
}

.care-model-page .care-model-image-cta {
    position: absolute;
    left: 42px;
    bottom: 30px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    min-height: 58px;
    padding: 0 28px;
    border-radius: 999px;
    border: 1px solid rgba(29, 44, 39, 0.24);
    background: rgba(255, 255, 255, 0.95);
    color: #172a25;
    font-size: 1.08rem;
    font-weight: 850;
    text-decoration: none;
    box-shadow: 0 14px 28px rgba(33, 29, 20, 0.16);
}

.care-model-page .care-model-image-cta i {
    font-size: 1.28rem;
}

.care-model-page .care-model-image-cta:hover {
    color: #10231f;
    transform: translateY(-1px);
}

/* ---------------- ROOTOPATHY APPROACH GRID ---------------- */
.care-model-page .rootopathy-approach-section {
    position: relative;
    overflow: hidden;
    padding: 78px 0 88px;
    background:
        radial-gradient(circle at 18% 18%, rgba(61, 166, 128, 0.2), transparent 28%),
        radial-gradient(circle at 84% 78%, rgba(194, 165, 120, 0.1), transparent 24%),
        linear-gradient(135deg, #073026 0%, #12473c 52%, #0a2f28 100%) !important;
}

.care-model-page .rootopathy-approach-section::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.32;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 100%) 0 0 / 120px 100%,
        radial-gradient(circle at 50% 24%, rgba(255, 255, 255, 0.08), transparent 26%);
    pointer-events: none;
}

.care-model-page .rootopathy-approach-section .container {
    position: relative;
    z-index: 2;
}

.care-model-page .rootopathy-approach-head {
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}

.care-model-page .rootopathy-approach-section .sub-title {
    justify-content: center;
    color: rgba(227, 207, 170, 0.8);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.15em;
    margin-bottom: 10px;
}

.care-model-page .rootopathy-approach-section .sub-title::before {
    background: rgba(227, 207, 170, 0.72);
}

.care-model-page .rootopathy-approach-section .section-heading {
    margin: 0 auto 8px;
    color: #d4bd82;
    font-size: clamp(1.95rem, 2.6vw, 2.65rem);
    line-height: 1.05;
    letter-spacing: -0.035em;
}

.care-model-page .rootopathy-approach-section .section-desc {
    color: rgba(242, 237, 222, 0.78);
    font-size: 0.95rem;
    line-height: 1.5;
}

.care-model-page .rootopathy-approach-grid {
    --bs-gutter-x: 1.4rem;
    --bs-gutter-y: 1.4rem;
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
}

.care-model-page .rootopathy-approach-grid .body-layer-card {
    height: 100%;
    min-height: 142px;
    padding: 24px 24px 22px;
    border: 0;
    border-radius: 8px;
    background:
        radial-gradient(circle at 92% 12%, rgba(25, 79, 68, 0.08), transparent 20%),
        linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
    box-shadow: 0 18px 30px rgba(3, 18, 15, 0.18);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.care-model-page .rootopathy-approach-grid .body-layer-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 36px rgba(3, 18, 15, 0.22);
}

.care-model-page .rootopathy-approach-grid .body-layer-card i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-bottom: 12px;
    color: #16362f !important;
    font-size: 2rem !important;
    line-height: 1;
}

.care-model-page .rootopathy-approach-grid .body-layer-card h5 {
    margin: 0 0 4px;
    color: #16211f;
    font-family: var(--font-sans);
    font-size: 1.16rem;
    font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 1.08;
}

.care-model-page .rootopathy-approach-grid .body-layer-card p {
    color: #4b5552 !important;
    font-size: 0.86rem;
    line-height: 1.35;
}

/* ---------------- CORE INTEGRATIVE MODALITIES ---------------- */
.care-model-page .care-modalities-section {
    position: relative;
    overflow: hidden;
    padding: 86px 0 94px;
    background:
        radial-gradient(circle at 12% 10%, rgba(194, 165, 120, 0.08), transparent 22%),
        radial-gradient(circle at 86% 16%, rgba(31, 90, 76, 0.06), transparent 22%),
        linear-gradient(180deg, #fbfaf6 0%, #f5f8f6 46%, #ffffff 100%);
}

.care-model-page .care-modalities-section::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.5;
    background:
        linear-gradient(90deg, rgba(14, 56, 48, 0.025) 0 1px, transparent 1px 100%) 0 0 / 140px 100%,
        linear-gradient(180deg, rgba(14, 56, 48, 0.018) 0 1px, transparent 1px 100%) 0 0 / 100% 120px;
    pointer-events: none;
}

.care-model-page .care-modalities-section .container {
    position: relative;
    z-index: 2;
}

.care-model-page .care-modalities-head {
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
}

.care-model-page .care-modalities-head .sub-title {
    justify-content: center;
    color: #6d6659;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.16em;
}

.care-model-page .care-modalities-head .section-heading {
    margin-bottom: 10px;
    color: #0d3b35;
    font-size: clamp(2.3rem, 3.3vw, 3.45rem);
    line-height: 0.98;
    letter-spacing: -0.05em;
}

.care-model-page .care-modalities-head .section-desc {
    color: #4c5b57;
    font-size: 1rem;
}

.care-model-page .care-modalities-grid {
    --bs-gutter-x: 1.55rem;
    --bs-gutter-y: 1.55rem;
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

.care-model-page .care-modalities-section .modality-card {
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 326px;
    padding: 30px 30px 26px;
    border: 1px solid rgba(16, 63, 55, 0.1);
    border-radius: 14px;
    border-bottom: 3px solid rgba(16, 105, 88, 0.18);
    background:
        radial-gradient(circle at 0 0, rgba(16, 105, 88, 0.06), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(252, 253, 252, 0.98));
    box-shadow:
        0 18px 42px rgba(21, 43, 38, 0.07),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.care-model-page .care-modalities-section .modality-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 28px;
    right: 28px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(194, 165, 120, 0.54), transparent);
}

.care-model-page .care-modalities-section .modality-card:hover {
    transform: translateY(-4px);
    border-bottom-color: rgba(18, 105, 182, 0.72);
    box-shadow:
        0 22px 52px rgba(21, 43, 38, 0.11),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.care-model-page .care-modalities-section .modality-card .row {
    align-items: stretch;
    row-gap: 18px;
}

.care-model-page .care-modalities-section .modality-card .badge {
    border-radius: 7px;
    padding: 6px 10px;
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: -0.02em;
    box-shadow: 0 8px 18px rgba(13, 47, 40, 0.08);
}

.care-model-page .care-modalities-section .modality-card h4 {
    max-width: 15ch;
    margin-bottom: 12px;
    color: #0a3d48;
    font-family: var(--font-serif);
    font-size: clamp(1.45rem, 1.85vw, 2rem);
    line-height: 1.08;
    letter-spacing: -0.045em;
}

.care-model-page .care-modalities-section .modality-card p {
    color: #4b5661;
    font-size: 0.96rem;
    line-height: 1.52;
}

.care-model-page .care-modalities-section .modality-card strong {
    color: #263632;
    font-weight: 850;
}

.care-model-page .care-modalities-section .modality-card p.small {
    color: #263632;
    font-size: 0.88rem;
    line-height: 1.45;
}

.care-model-page .care-modalities-section .impact-list {
    height: 100%;
    margin-top: 0;
    padding: 22px 18px;
    border: 1px solid rgba(16, 63, 55, 0.05);
    border-radius: 12px;
    background:
        radial-gradient(circle at 90% 12%, rgba(18, 105, 182, 0.06), transparent 22%),
        linear-gradient(180deg, #f5f8fb, #f7faf9);
}

.care-model-page .care-modalities-section .impact-list h6 {
    margin-bottom: 14px;
    color: #172821;
    font-family: var(--font-serif);
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.care-model-page .care-modalities-section .impact-item {
    display: grid;
    grid-template-columns: minmax(68px, 0.72fr) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 0;
    padding: 7px 0;
    border-bottom: 1px dashed rgba(15, 57, 50, 0.1);
    font-size: 0.86rem;
}

.care-model-page .care-modalities-section .impact-item:last-child {
    border-bottom: 0;
}

.care-model-page .care-modalities-section .impact-label {
    color: #66756f;
    font-weight: 750;
    text-align: left;
}

.care-model-page .care-modalities-section .impact-value {
    color: #096ecf;
    font-weight: 850;
    text-align: right;
}

.care-model-page .care-modalities-section .modality-card .row > div:last-child {
    width: 100%;
}

.care-model-page .care-modalities-section .modality-card .row > div:last-child p {
    margin: 8px 0 0;
    padding-top: 12px;
    border-top: 1px solid rgba(16, 63, 55, 0.08);
    color: #40504b;
}

@media (max-width: 991px) {
    .care-model-page .care-modalities-section {
        padding: 70px 0 78px;
    }

    .care-model-page .care-modalities-section .modality-card {
        min-height: auto;
    }
}

@media (max-width: 767px) {
    .care-model-page .care-modalities-section {
        padding: 56px 0 62px;
    }

    .care-model-page .care-modalities-section .modality-card {
        padding: 24px 20px 22px;
    }

    .care-model-page .care-modalities-section .modality-card h4 {
        max-width: none;
    }

.care-model-page .care-modalities-section .impact-list {
    padding: 18px 16px;
    }
}

/* ---------------- ROOT CARE QUOTE PANEL ---------------- */
.care-model-page .quote-section {
    position: relative;
    overflow: hidden;
    padding: 76px 0;
    background:
        radial-gradient(circle at 50% 16%, rgba(216, 193, 141, 0.08), transparent 24%),
        radial-gradient(circle at 18% 80%, rgba(80, 160, 136, 0.16), transparent 26%),
        linear-gradient(90deg, #06251f 0%, #0b332e 52%, #06251f 100%);
}

.care-model-page .quote-section::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.32;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 100%) 0 0 / 130px 100%,
        radial-gradient(circle at 18% 50%, rgba(216, 193, 141, 0.12), transparent 20%),
        radial-gradient(circle at 86% 18%, rgba(216, 193, 141, 0.08), transparent 18%);
    pointer-events: none;
}

.care-model-page .quote-wrapper {
    position: relative;
    z-index: 2;
    max-width: 1060px;
    min-height: 0;
    margin: 0 auto;
    padding: 46px 58px 42px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 28px;
    border: 1px solid rgba(216, 193, 141, 0.22);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
        linear-gradient(180deg, rgba(10, 75, 67, 0.6), rgba(6, 37, 31, 0.72));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 24px 58px rgba(4, 20, 17, 0.28);
}

.care-model-page .quote-wrapper::before {
    content: "";
    position: absolute;
    top: 24px;
    left: 50%;
    width: 46px;
    height: 2px;
    border-radius: 999px;
    background: var(--rp-gold);
    transform: translateX(-50%);
    pointer-events: none;
}

.care-model-page .quote-wrapper::after {
    content: "";
    position: absolute;
    inset: auto 28px 24px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(216, 193, 141, 0.28), transparent);
    pointer-events: none;
}

.care-model-page .quote-text {
    position: relative;
    z-index: 2;
    max-width: 820px;
    margin: 0 auto 22px;
    color: #f5efe5;
    font-family: var(--font-serif);
    font-size: clamp(1.7rem, 2.35vw, 2.55rem);
    line-height: 1.18;
    letter-spacing: 0;
    text-shadow: 0 8px 18px rgba(4, 20, 17, 0.16);
}

.care-model-page .quote-author {
    position: relative;
    z-index: 2;
    display: block;
    color: rgba(245, 239, 229, 0.78);
}

.care-model-page .quote-author h5 {
    margin: 0 0 8px;
    color: var(--rp-gold);
    font-family: var(--font-sans);
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.care-model-page .quote-author span {
    color: rgba(245, 239, 229, 0.74);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

@media (max-width: 991px) {
    .care-model-page .quote-wrapper {
        padding: 42px 32px 36px;
        border-radius: 24px;
    }
}

@media (max-width: 767px) {
    .care-model-page .quote-section {
        padding: 54px 0;
    }

    .care-model-page .quote-wrapper {
        padding: 40px 20px 34px;
    }

    .care-model-page .quote-text {
        font-size: clamp(1.35rem, 6.8vw, 1.85rem);
        line-height: 1.22;
    }
}

/* Preserve original root-care content while keeping the redesigned layouts */
.care-model-page .care-model-hero .hero-badge {
    display: inline-flex !important;
    width: fit-content;
    margin-bottom: 14px;
}

.care-model-page .care-model-hero .hero-subtitle {
    display: block !important;
    max-width: 620px;
    margin-top: 14px;
    color: rgba(244, 238, 228, 0.82);
}

.care-model-page .care-model-hero .page-hero-content {
    display: block;
}

.care-model-page .care-model-hero .hero-title span {
    color: #d9c184;
}

.care-model-page .care-model-intro-section .highlight-box {
    display: block;
}

.care-model-page .care-model-intro-image .floating-card {
    display: flex;
}

/* ---------------- SERVICES HERO ---------------- */
.services-page .services-hero {
    position: relative;
    min-height: 330px;
    padding: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 30% 42%, rgba(75, 155, 123, 0.18), transparent 24%),
        radial-gradient(circle at 72% 44%, rgba(71, 203, 190, 0.14), transparent 24%),
        linear-gradient(90deg, #06251f 0%, #0d3b30 52%, #06251f 100%);
    border-bottom: 4px solid #ffffff;
}

.services-page .services-hero::before,
.services-page .services-hero::after {
    content: "";
    position: absolute;
    z-index: 2;
    pointer-events: none;
}

.services-page .services-hero::before {
    top: 0;
    bottom: 0;
    left: 53%;
    width: 1px;
    background: rgba(213, 188, 126, 0.08);
}

.services-page .services-hero::after {
    top: 58px;
    right: 14%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(213, 188, 126, 0.55);
    box-shadow:
        74px 70px 0 rgba(213, 188, 126, 0.5),
        128px 96px 0 rgba(213, 188, 126, 0.34),
        24px 156px 0 rgba(213, 188, 126, 0.25);
}

.services-page .services-hero .page-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    background: radial-gradient(ellipse at 70% 48%, rgba(35, 136, 124, 0.18), transparent 34%);
}

.services-page .services-hero .page-hero-bg img {
    position: absolute;
    top: 50%;
    right: 8%;
    width: min(36vw, 520px);
    height: 122%;
    object-fit: cover;
    object-position: center;
    transform: translateY(-50%);
    opacity: 0.18;
    mix-blend-mode: screen;
    filter: saturate(0.82) contrast(0.96) brightness(1.08);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.72) 22%, #000 62%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.72) 22%, #000 62%, transparent 100%);
}

.services-page .services-hero .page-hero-overlay {
    z-index: 2;
    background:
        linear-gradient(90deg, rgba(5, 31, 25, 0.68) 0%, rgba(5, 31, 25, 0.18) 52%, rgba(5, 31, 25, 0.72) 100%),
        radial-gradient(circle at 70% 44%, transparent 0 110px, rgba(6, 33, 27, 0.18) 112px, transparent 190px);
}

.services-page .services-hero .container {
    position: relative;
    z-index: 3;
    min-height: 330px;
    display: flex;
    align-items: center;
}

.services-page .services-hero .page-hero-content {
    max-width: 920px;
    padding: 0;
}

.services-page .services-hero .hero-badge {
    display: inline-flex !important;
    align-items: center;
    min-height: 34px;
    padding: 0 18px;
    margin: 0 0 20px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.11);
    color: rgba(244, 238, 228, 0.94);
    font-family: var(--font-sans);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.services-page .services-hero .hero-title {
    max-width: 900px;
    margin: 0 0 16px;
    color: #f4eee5;
    font-size: clamp(2.45rem, 3.72vw, 4.05rem);
    line-height: 1.02;
    letter-spacing: -0.045em;
}

.services-page .services-hero .hero-title span {
    color: #f4eee5;
}

.services-page .services-hero .hero-subtitle {
    display: block !important;
    max-width: 800px !important;
    margin: 0 !important;
    color: rgba(244, 238, 228, 0.86);
    font-size: clamp(0.92rem, 1.02vw, 1.02rem);
    line-height: 1.45;
}

@media (max-width: 991px) {
    .services-page .services-hero {
        min-height: auto;
    }

    .services-page .services-hero .container {
        min-height: auto;
        padding-top: 62px;
        padding-bottom: 58px;
    }

    .services-page .services-hero .page-hero-bg img {
        right: -90px;
        width: 520px;
        opacity: 0.22;
    }
}

@media (max-width: 767px) {
    .services-page .services-hero .container {
        padding-top: 48px;
        padding-bottom: 44px;
    }

    .services-page .services-hero .hero-badge {
        min-height: 34px;
        padding: 0 16px;
        margin-bottom: 18px;
        font-size: 0.68rem;
    }

    .services-page .services-hero .hero-title {
        font-size: clamp(2.45rem, 12vw, 3.5rem);
        line-height: 0.96;
    }

.services-page .services-hero .hero-subtitle {
    font-size: 0.94rem;
    }
}

/* ---------------- SERVICES ROOT360 FRAMEWORK ---------------- */
.services-page .services-framework-section {
    position: relative;
    overflow: hidden;
    padding: 92px 0 96px;
    background:
        radial-gradient(circle at 14% 8%, rgba(25, 119, 204, 0.04), transparent 20%),
        linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.services-page .services-framework-row {
    --bs-gutter-x: 4.2rem;
}

.services-page .services-framework-section .section-label {
    display: block;
    margin-bottom: 16px;
    color: var(--root-accent);
    font-family: var(--font-sans);
    font-size: 0.86rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.services-page .services-framework-section .section-label::before {
    display: none;
}

.services-page .services-framework-section .section-heading {
    max-width: none;
    margin-bottom: 24px;
    color: #102e28;
    font-size: clamp(2.45rem, 3.6vw, 4rem);
    line-height: 1.02;
    letter-spacing: -0.052em;
}

.services-page .services-framework-section .lead-text {
    max-width: 780px;
    margin-bottom: 26px;
    color: #263540;
    font-size: clamp(1.02rem, 1.2vw, 1.24rem);
    line-height: 1.6;
}

.services-page .services-framework-section .highlight-box {
    max-width: 820px;
    margin: 0;
    padding: 20px 28px;
    border: 0;
    border-left: 4px solid var(--root-accent);
    border-radius: 0 10px 10px 0;
    background: linear-gradient(90deg, rgba(216, 193, 141, 0.14), rgba(10, 75, 67, 0.035));
    box-shadow: none;
}

.services-page .services-framework-section .highlight-box p {
    color: #223b52;
    font-size: clamp(1rem, 1.12vw, 1.16rem);
    line-height: 1.55;
}

.services-page .services-framework-section .mapping-card {
    min-height: 362px;
    padding: 52px 56px;
    border-radius: 28px;
    background:
        radial-gradient(circle at 88% 24%, rgba(255, 255, 255, 0.06), transparent 20%),
        linear-gradient(135deg, #06372f 0%, #0a4b43 58%, #082922 100%);
    box-shadow: 0 26px 48px rgba(10, 44, 50, 0.22);
}

.services-page .services-framework-section .mapping-card::after {
    content: "";
    position: absolute;
    right: 58px;
    top: 50px;
    width: 260px;
    height: 188px;
    opacity: 0.12;
    background:
        linear-gradient(#ffffff, #ffffff) 50% 100% / 110px 22px no-repeat,
        linear-gradient(#ffffff, #ffffff) 50% 88% / 54px 54px no-repeat,
        linear-gradient(#ffffff, #ffffff) 50% 0 / 250px 150px no-repeat;
    border-radius: 34px;
}

.services-page .services-framework-section .mapping-card h4 {
    position: relative;
    z-index: 2;
    margin-bottom: 28px !important;
    color: #ffffff;
    font-family: var(--font-serif);
    font-size: clamp(1.65rem, 2.1vw, 2.25rem);
    line-height: 1.08;
}

.services-page .services-framework-section .mapping-card .medical-list {
    position: relative;
    z-index: 2;
    padding: 0;
    margin: 0;
    list-style: none;
}

.services-page .services-framework-section .mapping-card .medical-list li {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
    color: #ffffff;
    font-size: clamp(1rem, 1.18vw, 1.2rem);
    line-height: 1.35;
}

.services-page .services-framework-section .mapping-card .medical-list i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--root-dark);
    font-size: 0.78rem;
}

@media (max-width: 991px) {
    .services-page .services-framework-section {
        padding: 70px 0 76px;
    }

    .services-page .services-framework-row {
        --bs-gutter-x: 1.5rem;
    }

    .services-page .services-framework-section .mapping-card {
        min-height: auto;
        padding: 40px 32px;
    }
}

@media (max-width: 767px) {
    .services-page .services-framework-section {
        padding: 54px 0 60px;
    }

    .services-page .services-framework-section .section-heading {
        font-size: clamp(2.1rem, 10vw, 3rem);
    }

    .services-page .services-framework-section .mapping-card {
        padding: 30px 22px;
        border-radius: 22px;
    }
}

@media (max-width: 991px) {
    .care-model-page .care-model-intro-section {
        padding: 70px 0 76px;
    }

    .care-model-page .care-model-intro-row {
        --bs-gutter-x: 1.5rem;
        row-gap: 34px;
    }

    .care-model-page .care-model-intro-title {
        max-width: none !important;
    }
}

@media (max-width: 767px) {
    .care-model-page .care-model-intro-section {
        padding: 56px 0 60px;
    }

    .care-model-page .care-model-intro-title {
        font-size: clamp(2.1rem, 9vw, 2.85rem) !important;
        line-height: 1.04 !important;
    }

    .care-model-page .care-model-image-cta {
        left: 22px;
        bottom: 20px;
        min-height: 48px;
        padding: 0 20px;
        gap: 12px;
        font-size: 0.95rem;
    }
}

/* ---------------- SERVICES PAGE REFERENCE LAYOUT ---------------- */
.services-page {
    background: #fbf7ee;
}

.services-page .services-hero {
    min-height: 360px;
    background:
        radial-gradient(circle at 86% 24%, rgba(213, 188, 126, 0.12), transparent 12%),
        radial-gradient(circle at 24% 34%, rgba(61, 139, 114, 0.18), transparent 24%),
        linear-gradient(90deg, #06251f 0%, #0d3b30 54%, #092a24 100%);
}

.services-page .services-hero .container {
    min-height: 360px;
}

.services-page .services-hero .page-hero-content {
    max-width: 790px;
}

.services-page .services-hero .page-hero-bg img {
    right: 13%;
    width: min(42vw, 640px);
    opacity: 0.12;
    object-position: center;
    filter: grayscale(0.25) saturate(0.75) contrast(0.92) brightness(1.02);
}

.services-page .services-hero .hero-title {
    max-width: 790px;
    color: #d8bd78;
}

.services-page .services-hero .hero-title span {
    color: #d8bd78;
}

.services-page .services-hero .hero-subtitle {
    max-width: 700px !important;
    color: rgba(247, 241, 226, 0.9);
}

.services-page .services-framework-section {
    padding: 92px 0 96px;
    background:
        radial-gradient(circle at 14% 8%, rgba(25, 119, 204, 0.04), transparent 20%),
        linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.services-page .services-framework-section .section-label {
    color: #6f675a;
}

.services-page .services-framework-section .section-heading {
    max-width: 15.5ch;
    color: #102e28;
}

.services-page .services-framework-section .lead-text {
    color: #273c37;
}

.services-page .services-framework-section .highlight-box {
    border-left-color: #c5a162;
    background: linear-gradient(90deg, rgba(197, 161, 98, 0.16), rgba(255, 255, 255, 0.42));
}

.services-page .services-framework-section .highlight-box p {
    color: #102e28;
}

.services-page .services-framework-section .mapping-card {
    min-height: 352px;
    border: 1px solid rgba(213, 188, 126, 0.34);
    background:
        radial-gradient(circle at 80% 20%, rgba(213, 188, 126, 0.18), transparent 18%),
        radial-gradient(circle at 20% 78%, rgba(84, 170, 137, 0.16), transparent 22%),
        linear-gradient(135deg, #092a24 0%, #103e35 62%, #08251f 100%);
    box-shadow:
        0 24px 54px rgba(9, 42, 36, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.services-page .services-framework-section .mapping-card::after {
    opacity: 0.08;
}

.services-page .services-framework-section .mapping-card .medical-list i {
    color: #0c342d;
}

.services-page .departments {
    position: relative;
    padding: 96px 0;
    background:
        radial-gradient(circle at 16% 14%, rgba(61, 139, 114, 0.24), transparent 26%),
        radial-gradient(circle at 86% 72%, rgba(213, 188, 126, 0.08), transparent 22%),
        linear-gradient(135deg, #06251f 0%, #0d3b30 56%, #082922 100%);
    color: #f6efe2;
}

.services-page .departments .section-title {
    max-width: 1080px;
    margin: 0 auto 52px;
    padding-bottom: 0;
}

.services-page .departments .section-title h2 {
    color: #f4eee5;
    font-family: var(--font-serif);
    font-size: var(--shared-section-heading-size);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -0.052em;
    margin-bottom: 14px;
    padding-bottom: 0;
    white-space: nowrap;
}

.services-page .departments .section-title h2::before,
.services-page .departments .section-title h2::after {
    display: none;
}

.services-page .departments .section-title p {
    color: rgba(246, 239, 226, 0.72);
    font-size: 0.96rem;
    line-height: 1.65;
}

.services-page .departments > .container:last-child {
    position: relative;
    margin-top: 18px;
    padding: 36px;
    border: 1px solid rgba(213, 188, 126, 0.22);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.025);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.services-page .departments .row {
    --bs-gutter-x: 2rem;
    --bs-gutter-y: 2rem;
}

.services-page .departments .nav-tabs {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.services-page .departments .nav-link {
    min-height: 74px;
    padding: 16px 18px;
    border: 1px solid rgba(213, 188, 126, 0.18);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.035);
    color: rgba(246, 239, 226, 0.82);
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1.2;
}

.services-page .departments .nav-link:hover,
.services-page .departments .nav-link.active {
    border-color: rgba(213, 188, 126, 0.68);
    background: linear-gradient(135deg, rgba(213, 188, 126, 0.16), rgba(255, 255, 255, 0.05));
    color: #ffffff;
}

.services-page .departments .tab-content {
    height: 100%;
    padding-top: 70px;
}

.services-page .departments .tab-pane {
    min-height: 100%;
}

.services-page .departments .tab-pane > .row {
    min-height: 100%;
    padding: 28px;
    border: 1px solid rgba(213, 188, 126, 0.22);
    border-radius: 22px;
    background:
        radial-gradient(circle at 88% 18%, rgba(213, 188, 126, 0.12), transparent 18%),
        rgba(255, 255, 255, 0.045);
}

.services-page .departments .details h3 {
    color: #f4eee5;
    font-family: var(--font-serif);
    font-size: clamp(1.85rem, 2.6vw, 2.8rem);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.services-page .departments .details p {
    color: rgba(246, 239, 226, 0.76);
    font-size: 0.94rem;
    line-height: 1.72;
}

.services-page .departments .details .fst-italic {
    color: #d8bd78;
    font-style: normal !important;
    font-weight: 700;
}

.services-page .departments .tab-pane img {
    width: 100%;
    max-width: 330px;
    aspect-ratio: 1.1 / 1;
    object-fit: cover;
    border-radius: 20px;
    border: 1px solid rgba(213, 188, 126, 0.34);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.26);
}

.services-page .bg-soft-blue {
    position: relative;
    overflow: hidden;
    padding: 92px 0 102px;
    min-height: 620px;
    background:
        radial-gradient(circle at 50% 4%, rgba(213, 188, 126, 0.1), transparent 16%),
        radial-gradient(circle at 18% 28%, rgba(70, 164, 137, 0.22), transparent 22%),
        radial-gradient(circle at 88% 66%, rgba(213, 188, 126, 0.08), transparent 20%),
        linear-gradient(135deg, #06251f 0%, #0e4237 52%, #082922 100%) !important;
}

.services-page .bg-soft-blue::before {
    content: "";
    position: absolute;
    inset: 34px 6.6%;
    border: 1px solid rgba(213, 188, 126, 0.18);
    border-radius: 22px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 0 1px, transparent 1px 100%) 0 0 / 86px 100%,
        radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.04), transparent 28%);
    pointer-events: none;
}

.services-page .bg-soft-blue .container {
    position: relative;
    z-index: 2;
    max-width: 1380px;
}

.services-page .bg-soft-blue .text-center.mb-5 {
    max-width: 980px;
    margin: 0 auto 54px !important;
}

.services-page .bg-soft-blue .sub-title {
    display: block;
    margin-bottom: 10px;
    color: rgba(246, 239, 226, 0.58);
    font-size: 0.66rem;
    letter-spacing: 0.16em;
    text-align: center;
}

.services-page .bg-soft-blue .sub-title::before {
    display: none;
}

.services-page .bg-soft-blue .section-heading {
    color: #f4eee5;
    font-size: clamp(2.15rem, 3vw, 3.2rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.045em !important;
}

.services-page .bg-soft-blue .row.g-4 {
    --bs-gutter-x: 1.35rem;
    --bs-gutter-y: 1.35rem;
    max-width: 1210px;
    margin: 0 auto;
}

.services-page .domain-box {
    position: relative;
    overflow: hidden;
    min-height: 184px;
    padding: 34px 34px 30px;
    border: 1px solid rgba(213, 188, 126, 0.24);
    border-radius: 10px;
    border-top: 1px solid rgba(213, 188, 126, 0.24);
    background:
        radial-gradient(circle at 88% 18%, rgba(213, 188, 126, 0.12), transparent 13%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018));
    box-shadow: none;
}

.services-page .domain-box::before {
    content: "";
    position: absolute;
    right: -20px;
    bottom: -28px;
    width: 138px;
    height: 120px;
    opacity: 0.2;
    background:
        radial-gradient(ellipse at 54% 52%, transparent 0 38%, rgba(213, 188, 126, 0.62) 39% 40%, transparent 41%),
        radial-gradient(ellipse at 50% 50%, transparent 0 58%, rgba(92, 174, 147, 0.42) 59% 60%, transparent 61%),
        linear-gradient(36deg, transparent 48%, rgba(213, 188, 126, 0.5) 49% 50%, transparent 51%),
        linear-gradient(126deg, transparent 48%, rgba(92, 174, 147, 0.42) 49% 50%, transparent 51%);
}

.services-page .domain-box:hover {
    transform: translateY(-4px);
    border-color: rgba(213, 188, 126, 0.68);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.2);
}

.services-page .domain-box .institute-tag {
    color: #d8bd78;
    opacity: 1;
}

.services-page .domain-box h4 {
    position: relative;
    z-index: 2;
    color: #ffffff;
    font-family: var(--font-serif);
    font-size: clamp(1.2rem, 1.35vw, 1.48rem);
    line-height: 1.08;
    margin-bottom: 14px !important;
}

.services-page .domain-box p {
    position: relative;
    z-index: 2;
    color: rgba(246, 239, 226, 0.72) !important;
    max-width: 34ch;
    font-size: 0.9rem;
    line-height: 1.55;
}

.services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) {
    padding: 96px 0;
    background:
        linear-gradient(90deg, rgba(255, 250, 240, 0.98) 0%, rgba(255, 250, 240, 0.82) 46%, rgba(255, 250, 240, 0.16) 74%),
        url("../../img/domains/clinical-journey.avif") right center / cover no-repeat;
}

.services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) .section-label {
    color: #6f675a;
}

.services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) .section-heading {
    max-width: 10ch;
    color: #102e28;
}

.services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) .col-lg-5 > p {
    max-width: 50ch;
    color: #273c37;
    line-height: 1.72;
}

.services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) .col-lg-5 img {
    display: none;
}

.services-page .process-wrapper {
    padding: 34px 34px 18px 60px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(197, 161, 98, 0.2);
    box-shadow: 0 22px 44px rgba(28, 42, 37, 0.1);
    backdrop-filter: blur(12px);
}

.services-page .process-wrapper::before {
    left: 32px;
    top: 38px;
    height: calc(100% - 78px);
    background: linear-gradient(to bottom, #c5a162, rgba(197, 161, 98, 0.16));
}

.services-page .process-step {
    margin-bottom: 28px;
}

.services-page .step-number {
    left: -46px;
    width: 38px;
    height: 38px;
    background: #102e28;
    color: #d8bd78;
    border-color: #fffaf0;
}

.services-page .process-step h5 {
    color: #102e28;
}

.services-page .process-step p {
    color: #4a5b56 !important;
    font-size: 0.92rem;
    line-height: 1.62;
}

.services-page .appointment {
    padding: 92px 0;
    background:
        radial-gradient(circle at 18% 16%, rgba(25, 119, 204, 0.06), transparent 22%),
        linear-gradient(180deg, #f8fbfe 0%, #eef5f9 100%);
}

.services-page .appointment .section-title {
    max-width: 820px;
    margin: 0 auto;
    padding-bottom: 38px;
}

.services-page .appointment .section-title h2 {
    color: #102e28;
    font-family: var(--font-serif);
    font-size: var(--shared-section-heading-size);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -0.052em;
    padding-bottom: 0;
}

.services-page .appointment .section-title h2::before,
.services-page .appointment .section-title h2::after {
    display: none;
}

.services-page .appointment .section-title p {
    color: #33443f;
    line-height: 1.65;
}

.services-page .appointment .php-email-form {
    max-width: 1040px;
    margin: 0 auto;
    padding: 38px;
    border-radius: 24px;
    border: 1px solid rgba(197, 161, 98, 0.18);
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 26px 56px rgba(13, 75, 121, 0.1);
}

.services-page .quote-section {
    position: relative;
    overflow: hidden;
    padding: 96px 0 !important;
    background:
        radial-gradient(circle at 26% 30%, rgba(76, 169, 140, 0.22), transparent 24%),
        radial-gradient(circle at 78% 72%, rgba(213, 188, 126, 0.1), transparent 18%),
        linear-gradient(135deg, #041c18 0%, #0b352d 52%, #041c18 100%);
}

.services-page .quote-section::before,
.services-page .quote-section::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.services-page .quote-section::before {
    inset: 0;
    opacity: 0.18;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0 1px, transparent 1px 100%) 0 0 / 112px 100%,
        linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 100%) 0 0 / 100% 90px;
}

.services-page .quote-section::after {
    left: 50%;
    top: 50%;
    width: 860px;
    height: 260px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(ellipse at center, rgba(213, 188, 126, 0.1), transparent 68%);
}

.services-page .quote-section .container {
    position: relative;
    z-index: 2;
    max-width: 1120px;
    padding: 58px 72px !important;
    border: 1px solid rgba(213, 188, 126, 0.22);
    border-radius: 26px;
    background:
        radial-gradient(circle at 18% 20%, rgba(213, 188, 126, 0.1), transparent 22%),
        radial-gradient(circle at 84% 76%, rgba(77, 174, 143, 0.14), transparent 24%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025));
    box-shadow:
        0 28px 70px rgba(0, 0, 0, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
}

.services-page .quote-section .quote-text {
    max-width: 640px;
    margin: 0 auto 20px;
    color: #f4eee5 !important;
    font-size: clamp(2rem, 3.4vw, 3.6rem);
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.services-page .quote-section p {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
    color: rgba(244, 238, 229, 0.72) !important;
    font-size: 1rem;
    line-height: 1.65;
}

.services-page .quote-section .custom-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    min-height: 50px;
    padding: 0 30px;
    border-radius: 999px;
    border: 1px solid rgba(213, 188, 126, 0.35);
    background: linear-gradient(135deg, #d8bd78, #a98643);
    color: #071f1a;
    font-weight: 800;
    box-shadow:
        0 14px 28px rgba(0, 0, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.services-page .quote-section .custom-btn:hover {
    color: #071f1a;
    transform: translateY(-2px);
    filter: brightness(1.05);
}

@media (max-width: 991px) {
    .services-page .services-hero .page-hero-content {
        max-width: 620px;
    }

    .services-page .services-framework-section .section-heading {
        max-width: 15.5ch;
    }

    .services-page .services-framework-section .mapping-card {
        min-height: auto;
        padding: 38px 30px;
    }

    .services-page .departments > .container:last-child {
        padding: 24px;
    }

    .services-page .departments .nav-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-bottom: 18px;
    }

    .services-page .departments .tab-content {
        padding-top: 0;
    }

    .services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) {
        background:
            linear-gradient(180deg, rgba(255, 250, 240, 0.96), rgba(255, 250, 240, 0.9)),
            url("../../img/domains/clinical-journey.avif") center / cover no-repeat;
    }

    .services-page .bg-soft-blue {
        min-height: auto;
    }

    .services-page .bg-soft-blue::before {
        inset: 24px 4%;
    }

    .services-page .bg-soft-blue .container {
        max-width: 720px;
    }

    .services-page .domain-box {
        min-height: 170px;
    }
}

@media (max-width: 767px) {
    .services-page .services-hero,
    .services-page .services-hero .container {
        min-height: auto;
    }

    .services-page .services-hero .page-hero-bg img {
        right: -140px;
        width: 520px;
        opacity: 0.16;
    }

    .services-page .services-hero .container {
        padding-top: 46px;
        padding-bottom: 46px;
    }

    .services-page .services-hero .hero-title {
        max-width: 10.5ch;
        font-size: clamp(2.25rem, 10.5vw, 3.2rem) !important;
        line-height: 0.98 !important;
    }

    .services-page .services-hero .hero-subtitle {
        max-width: 34ch !important;
        font-size: 0.92rem;
    }

    .services-page .departments,
    .services-page .bg-soft-blue,
    .services-page .appointment,
    .services-page .services-framework-section {
        padding: 60px 0;
    }

    .services-page .services-framework-section .section-label,
    .services-page .services-framework-section .lead-text,
    .services-page .services-framework-section .highlight-box,
    .services-page .services-framework-section .section-heading {
        max-width: none;
    }

    .services-page .services-framework-section .section-heading {
        font-size: clamp(2.1rem, 10vw, 3rem) !important;
    }

    .services-page .services-framework-section .highlight-box {
        padding: 18px 18px 18px 20px;
    }

    .services-page .services-framework-section .mapping-card {
        padding: 30px 22px;
        border-radius: 22px;
    }

    .services-page .services-framework-section .mapping-card::after {
        right: 20px;
        top: 40px;
        width: 160px;
        height: 120px;
        opacity: 0.08;
    }

    .services-page .services-framework-section .mapping-card .medical-list li {
        align-items: flex-start;
        gap: 12px;
        margin-bottom: 16px;
        font-size: 0.96rem;
    }

    .services-page .departments .section-title {
        margin-bottom: 30px;
    }

    .services-page .departments .section-title h2 {
        font-size: clamp(2.1rem, 10vw, 3rem) !important;
        line-height: 1 !important;
    }

    .services-page .departments .section-title p {
        font-size: 0.9rem;
    }

    .services-page .departments > .container:last-child {
        margin-top: 0;
        padding: 18px;
        border-radius: 20px;
    }

    .services-page .departments .section-title h2 {
        white-space: normal;
    }

    .services-page .departments .nav-tabs {
        grid-template-columns: 1fr;
    }

    .services-page .departments .tab-pane > .row {
        padding: 20px;
        border-radius: 18px;
    }

    .services-page .departments .details h3 {
        font-size: clamp(1.65rem, 8vw, 2.2rem);
    }

    .services-page .departments .details p {
        font-size: 0.88rem;
        line-height: 1.62;
    }

    .services-page .departments .tab-pane img {
        max-width: none;
        margin-top: 12px;
        aspect-ratio: 1.35 / 1;
    }

    .services-page .bg-soft-blue {
        padding: 64px 0 70px;
    }

    .services-page .bg-soft-blue::before {
        inset: 16px 12px;
        border-radius: 18px;
    }

    .services-page .bg-soft-blue .text-center.mb-5 {
        margin-bottom: 28px !important;
    }

    .services-page .bg-soft-blue .section-heading {
        font-size: clamp(1.85rem, 9vw, 2.5rem) !important;
    }

    .services-page .bg-soft-blue .row.g-4 {
        --bs-gutter-y: 0.85rem;
    }

    .services-page .domain-box {
        min-height: auto;
        padding: 24px 22px;
        border-radius: 14px;
    }

    .services-page .domain-box h4 {
        font-size: 1.18rem;
    }

    .services-page .domain-box p {
        max-width: none;
        font-size: 0.86rem;
    }

    .services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) {
        padding: 62px 0;
    }

    .services-page .section:not(.services-framework-section):not(.departments):not(.bg-soft-blue):not(.appointment):not(.quote-section) .section-heading {
        max-width: 11ch;
        font-size: clamp(2rem, 10vw, 2.8rem) !important;
    }

    .services-page .process-wrapper {
        padding: 28px 20px 10px 48px;
        margin-left: 0 !important;
        border-radius: 18px;
    }

    .services-page .process-wrapper::before {
        left: 24px;
    }

    .services-page .step-number {
        left: -42px;
    }

    .services-page .quote-section {
        padding: 60px 0 !important;
    }

    .services-page .quote-section .container {
        width: calc(100% - 24px);
        padding: 38px 22px !important;
        border-radius: 22px;
    }

    .services-page .quote-section .quote-text {
        max-width: 9.5ch;
        font-size: clamp(2rem, 10vw, 2.8rem);
    }

    .services-page .quote-section p {
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .services-page .quote-section .custom-btn {
        width: min(100%, 260px);
        min-height: 48px;
        padding: 0 20px;
        text-align: center;
    }
}

/* ---------------- DOCTORS / TEAM PAGE ---------------- */
.team-page {
    background: #fbf7ee;
}

.team-page .page-hero {
    min-height: 292px;
    background:
        linear-gradient(90deg, #06251f 0%, #0a332b 50%, #06251f 100%);
    border-bottom: 4px solid #ffffff;
}

.team-page .page-hero .page-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
    opacity: 0.72;
    filter: saturate(0.82) contrast(0.92) brightness(0.78);
    mix-blend-mode: normal;
}

.team-page .page-hero-overlay {
    background:
        linear-gradient(90deg, rgba(5, 31, 25, 0.98) 0%, rgba(5, 31, 25, 0.86) 34%, rgba(5, 31, 25, 0.28) 62%, rgba(5, 31, 25, 0.16) 100%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 100%) 0 0 / 112px 100%;
}

.team-page .page-hero .container {
    min-height: 292px;
    display: flex;
    align-items: center;
}

.team-page .page-hero-content {
    max-width: 760px;
}

.team-page .hero-badge {
    display: none !important;
    align-items: center;
    min-height: 34px;
    padding: 0 18px;
    margin-bottom: 18px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.11);
    color: rgba(244, 238, 228, 0.94);
    font-family: var(--font-sans);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.team-page .hero-title {
    max-width: 760px;
    color: #d8bd78;
    font-size: clamp(3.05rem, 4.35vw, 4.3rem) !important;
    line-height: 0.94 !important;
}

.team-page .hero-title span {
    color: #f4eee5;
}

.team-page .hero-subtitle {
    display: none !important;
    max-width: 620px;
    margin: 14px 0 0;
    color: rgba(244, 238, 228, 0.86);
    font-size: 1rem;
    line-height: 1.6;
}

.team-page > .section:first-of-type {
    position: relative;
    overflow: hidden;
    padding: 96px 0 104px;
    background:
        radial-gradient(circle at 12% 22%, rgba(213, 188, 126, 0.12), transparent 24%),
        radial-gradient(circle at 86% 76%, rgba(12, 56, 47, 0.05), transparent 26%),
        linear-gradient(180deg, #f8f4ea 0%, #fffaf0 100%);
}

.team-page .doctor-leader-card {
    position: relative;
    overflow: hidden;
    max-width: 1320px;
    margin: 0 auto;
    border: 1px solid rgba(197, 161, 98, 0.16);
    border-radius: 22px;
    background:
        radial-gradient(circle at 72% 20%, rgba(213, 188, 126, 0.12), transparent 18%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(252, 249, 241, 0.98));
    box-shadow: 0 24px 52px rgba(33, 44, 39, 0.13);
}

.team-page .doctor-leader-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 34%;
    width: 44%;
    height: 130px;
    border: 0;
    border-radius: 0;
    opacity: 0.28;
    background:
        linear-gradient(90deg, transparent 0 12%, rgba(54, 158, 207, 0.55) 12% 13%, transparent 13% 100%) 0 50% / 80px 2px repeat-x,
        linear-gradient(118deg, transparent 0 46%, rgba(54, 158, 207, 0.7) 47% 49%, transparent 50% 100%) 100px 40px / 120px 80px no-repeat,
        linear-gradient(62deg, transparent 0 46%, rgba(54, 158, 207, 0.7) 47% 49%, transparent 50% 100%) 210px 22px / 120px 80px no-repeat,
        linear-gradient(112deg, transparent 0 46%, rgba(54, 158, 207, 0.55) 47% 49%, transparent 50% 100%) 310px 38px / 120px 80px no-repeat;
    pointer-events: none;
}

.team-page .doctor-leader-card .row {
    position: relative;
    z-index: 2;
}

.team-page .doctor-leader-card .col-lg-5 {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    min-height: 380px;
    background:
        radial-gradient(circle at 52% 44%, rgba(115, 191, 226, 0.18), transparent 32%),
        linear-gradient(135deg, rgba(244, 249, 250, 0.6), rgba(255, 255, 255, 0.1));
}

.team-page .doctor-leader-card .col-lg-5 img {
    width: min(82%, 360px) !important;
    height: 370px !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain;
    object-position: bottom center;
    filter: drop-shadow(0 24px 30px rgba(0, 0, 0, 0.18));
}

.team-page .doctor-leader-card .col-lg-7 {
    padding: clamp(2.5rem, 4.6vw, 5.2rem) clamp(2.4rem, 5vw, 5.6rem) !important;
}

.team-page .doc-designation {
    display: inline-flex;
    margin-bottom: 18px;
    color: #365f58;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.team-page .doctor-leader-card .section-heading {
    max-width: none;
    margin-bottom: 16px !important;
    color: #102e28;
    font-size: clamp(2.45rem, 3.8vw, 4.05rem) !important;
    line-height: 1.02 !important;
}

.team-page .doctor-leader-card p {
    max-width: 68ch;
    color: #33443f;
    font-size: 1rem;
    line-height: 1.72;
}

.team-page .doctor-leader-card .text-muted {
    color: #6a746f !important;
    font-weight: 600;
}

.team-page .doctor-leader-card .custom-btn,
.team-page .phase-card .custom-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 22px;
    border-radius: 999px;
    border: 1px solid rgba(213, 188, 126, 0.32);
    background: linear-gradient(135deg, #0b3f34, #082b25);
    color: #f7efe0;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(16, 46, 40, 0.14);
}

.team-page .doctor-leader-card .custom-btn:hover,
.team-page .phase-card .custom-btn:hover {
    color: #ffffff;
    transform: translateY(-2px);
    filter: brightness(1.05);
}

.team-page .bg-soft-blue {
    position: relative;
    overflow: hidden;
    padding: 96px 0 104px;
    background:
        radial-gradient(circle at 20% 18%, rgba(61, 139, 114, 0.24), transparent 26%),
        radial-gradient(circle at 84% 74%, rgba(213, 188, 126, 0.08), transparent 22%),
        linear-gradient(135deg, #06251f 0%, #0d3b30 56%, #082922 100%) !important;
}

.team-page .bg-soft-blue::before {
    content: "";
    position: absolute;
    inset: 32px 6.5%;
    border: 1px solid rgba(213, 188, 126, 0.18);
    border-radius: 26px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 0 1px, transparent 1px 100%) 0 0 / 96px 100%,
        radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.04), transparent 28%);
    pointer-events: none;
}

.team-page .bg-soft-blue .container {
    position: relative;
    z-index: 2;
}

.team-page .bg-soft-blue .text-center {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.team-page .bg-soft-blue .sub-title {
    display: block;
    margin-bottom: 12px;
    color: rgba(246, 239, 226, 0.58);
    font-size: 0.72rem;
    letter-spacing: 0.16em;
}

.team-page .bg-soft-blue .sub-title::before {
    display: none;
}

.team-page .bg-soft-blue .section-heading {
    color: #f4eee5;
    font-size: clamp(2.15rem, 3vw, 3.2rem) !important;
    line-height: 1.05 !important;
}

.team-page .section-desc {
    color: rgba(246, 239, 226, 0.72);
    font-size: 1rem;
    line-height: 1.65;
}

.team-page .bg-soft-blue .row.g-4 {
    --bs-gutter-x: 1.3rem;
    --bs-gutter-y: 1.3rem;
    justify-content: center;
}

.team-page .phase-card {
    position: relative;
    overflow: hidden;
    height: 100%;
    padding: 24px 22px 26px;
    border: 1px solid rgba(213, 188, 126, 0.24);
    border-radius: 18px;
    background:
        radial-gradient(circle at 88% 18%, rgba(213, 188, 126, 0.12), transparent 14%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02));
    box-shadow: none;
    transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.team-page .phase-card::after {
    content: "";
    position: absolute;
    right: -20px;
    bottom: -24px;
    width: 130px;
    height: 120px;
    opacity: 0.16;
    background:
        radial-gradient(ellipse at 54% 52%, transparent 0 38%, rgba(213, 188, 126, 0.62) 39% 40%, transparent 41%),
        linear-gradient(36deg, transparent 48%, rgba(213, 188, 126, 0.5) 49% 50%, transparent 51%);
    pointer-events: none;
}

.team-page .phase-card:hover {
    transform: translateY(-6px);
    border-color: rgba(213, 188, 126, 0.62);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.22);
}

.team-page .phase-card img {
    position: relative;
    z-index: 2;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 16px !important;
    border: 1px solid rgba(213, 188, 126, 0.22);
    box-shadow: none !important;
}

.team-page .phase-card h4 {
    position: relative;
    z-index: 2;
    margin-bottom: 8px !important;
    color: #ffffff;
    font-family: var(--font-serif);
    font-size: 1.26rem;
    line-height: 1.1;
}

.team-page .phase-card p {
    position: relative;
    z-index: 2;
    color: rgba(246, 239, 226, 0.72) !important;
    line-height: 1.52;
}

.team-page .phase-card .text-primary {
    color: #d8bd78 !important;
    font-size: 0.76rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.team-page .phase-card .phase-line {
    width: 64px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(213, 188, 126, 0.7), transparent);
}

@media (max-width: 991px) {
    .team-page .page-hero,
    .team-page .page-hero .container {
        min-height: auto;
    }

    .team-page .page-hero .container {
        padding-top: 58px;
        padding-bottom: 54px;
    }

    .team-page .doctor-leader-card .col-lg-5 {
        min-height: 360px;
    }

    .team-page .doctor-leader-card .col-lg-5 img {
        height: 340px !important;
    }

    .team-page .bg-soft-blue::before {
        inset: 24px 4%;
    }
}

@media (max-width: 767px) {
    .team-page .page-hero .container {
        padding-top: 46px;
        padding-bottom: 46px;
    }

    .team-page .hero-title {
        max-width: 10ch;
        font-size: clamp(2.25rem, 10.5vw, 3.2rem) !important;
        line-height: 0.98 !important;
    }

    .team-page .hero-subtitle {
        max-width: 34ch;
        font-size: 0.92rem;
    }

    .team-page > .section:first-of-type,
    .team-page .bg-soft-blue {
        padding: 62px 0;
    }

    .team-page .doctor-leader-card {
        border-radius: 22px;
    }

    .team-page .doctor-leader-card::before {
        inset: 10px;
        border-radius: 16px;
    }

    .team-page .doctor-leader-card .col-lg-5 {
        min-height: 300px;
    }

    .team-page .doctor-leader-card .col-lg-5 img {
        width: min(78%, 280px) !important;
        height: 290px !important;
    }

    .team-page .doctor-leader-card .col-lg-7 {
        padding: 28px 22px 32px !important;
    }

    .team-page .doctor-leader-card .section-heading {
        font-size: clamp(2rem, 10vw, 2.8rem) !important;
    }

    .team-page .doctor-leader-card p {
        font-size: 0.92rem;
    }

    .team-page .bg-soft-blue::before {
        inset: 16px 12px;
        border-radius: 18px;
    }

    .team-page .bg-soft-blue .section-heading {
        font-size: clamp(2rem, 10vw, 2.8rem) !important;
    }

    .team-page .phase-card {
        padding: 22px 20px 24px;
        border-radius: 16px;
    }
}