.platinum-benefits.premium-space .platinum-benefits-bottom {
    height: 285px;
    padding-bottom: 16px;
}

.platinum-benefits.premium-space .platinum-benefits-slider-nav {
    margin-top: 0;
}

.checkup-section {
    padding-bottom: 0;
}

.checkup-section .checkup-top {
    margin-bottom: var(--hp-title-gap, 56px);
}

/* Check Up content on mobile / tablet (the accordion is only visible up to 1024px).
   8px rhythm, one inset-grouped list with hairline dividers instead of 16px gaps between loose rows,
   left-aligned header, quieter type, no scroll box inside the page. */
@media (max-width: 1024px) {
    /* The band texture is an 11MB SVG (embedded image + blur + soft-light blend). It was downloaded on phones
       and, because the band grows when a list opens, re-painted on every animation frame, which made the
       accordion stutter. On tablet / phone the same soft glows are drawn with plain CSS gradients instead. */
    .checkup-section .checkup::before {
        background-image:
            radial-gradient(70% 20% at 88% 5%, rgba(120, 230, 220, .20), transparent 70%),
            radial-gradient(60% 16% at 8% 36%, rgba(120, 230, 220, .13), transparent 70%),
            radial-gradient(70% 18% at 92% 68%, rgba(120, 230, 220, .15), transparent 70%),
            radial-gradient(60% 12% at 12% 96%, rgba(120, 230, 220, .11), transparent 70%);
        background-size: auto;
        mix-blend-mode: normal;
        filter: none;
    }

    .checkup-section .checkup-top {
        align-items: flex-start;
        gap: 8px;
    }

    .checkup-section .checkup-top .lc-typography--h1 {
        font-size: 34px;
        line-height: 38px;
        letter-spacing: -0.01em;
    }

    .checkup-section .checkup-top .lc-typography--h3 {
        font-size: 17px;
        line-height: 24px;
        opacity: .8;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-component--list {
        gap: 0;
        margin-top: 0;
        overflow: hidden;
        border-radius: 16px;
        background: rgba(250, 250, 250, .08);
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item.transparent-accordion {
        padding: 0 16px;
        border-radius: 0;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item.transparent-accordion + .lc-accordion-item.transparent-accordion {
        border-top: 1px solid rgba(250, 250, 250, .12);
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item.transparent-accordion.active {
        padding-bottom: 16px;
    }

    /* the list itself is the card, so the per-item highlight is not needed */
    .checkup-section .checkup-inner-mobile .lc-accordion-item.transparent-accordion.active::before {
        display: none;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--head {
        min-height: 56px;
        padding: 8px 0;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--head .lc-typography--p1 {
        font-size: 17px;
        line-height: 24px;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--head .action-button {
        width: 32px;
        height: 32px;
    }

    /* open height: the accordion script now writes the exact content height as an !important inline value, so
       the animation runs over the real height. The 2400px is only a fallback for a cached old script. */
    .checkup-section .checkup-inner-mobile .lc-accordion-item.transparent-accordion.active .lc-accordion-item--content {
        max-height: 2400px !important;
        overflow-y: hidden;
        margin-top: 4px;
    }

    /* faster, steadier open / close: height eases out in 0.3s, the text fades in a little quicker than the box grows */
    .checkup-section .checkup-inner-mobile .lc-accordion-item--content {
        transition: max-height .3s cubic-bezier(.32, .72, 0, 1), opacity .2s ease;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--head {
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--head:active {
        opacity: .6;
    }

    /* touch screens keep :hover after a tap, which left the tapped row half transparent */
    @media (hover: none) {
        .checkup-section .checkup-inner-mobile .lc-accordion-item--head:hover {
            opacity: 1;
        }

        .checkup-section .checkup-inner-mobile .lc-accordion-item--head:active {
            opacity: .6;
        }
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--content ul {
        gap: 8px;
        padding: 0 0 0 20px;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--content ul li {
        font-size: 16px;
        line-height: 22px;
        font-weight: 400;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--content ul li::marker {
        color: var(--primary-color-500, #2ad2c5);
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--content .list-wrapper {
        margin-bottom: 0;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--content .list-wrapper + .list-wrapper {
        margin-top: 24px;
    }

    .checkup-section .checkup-inner-mobile .lc-accordion-item--content .list-title {
        margin: 0 0 12px;
        font-size: 12px;
        line-height: 16px;
        font-style: normal;
        letter-spacing: .08em;
        opacity: .72;
    }

    .checkup-section .checkup .container > p.ozel {
        margin-top: 8px;
        font-size: 13px;
        line-height: 20px;
        color: rgba(250, 250, 250, .64);
    }

    .checkup-section .checkup-inner-mobile + p.ozel {
        margin-top: 24px;
    }

    .checkup-section .checkup .container > a.life-club-button {
        display: flex;
        width: 100%;
        max-width: 400px;
        height: 52px;
    }
}

/* "Sağlıklı Yaşam Yolculuğu" steps: flat light-grey cards instead of the stacked drop-shadows, a smaller
   icon medallion that overlaps the card edge, calmer type. On mobile / tablet the five cards become a
   vertical timeline (icon + line + text) instead of a sideways scroller with a 300px disc. */
.healthy-life .healthy-life-top {
    margin-bottom: var(--hp-title-gap, 56px);
}

.healthy-life .healthy-life-grid {
    align-items: stretch;
    gap: 24px;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item {
    height: auto;
    filter: none;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item::before {
    inset: 72px 0 0;
    height: auto;
    border-radius: 24px;
    background: #f5f5f7;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item > .icon-wrapper {
    width: 144px;
    padding: 12px;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item .icon-wrapper-inner {
    padding: 12px;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item .icon-wrapper-content svg {
    width: 40px;
    height: 40px;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item:hover .icon-wrapper {
    animation: none;
    transform: scale(1.04);
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item > .content {
    flex: 1 0 auto;
    width: 100%;
    height: auto;
    justify-content: flex-start;
    gap: 8px;
    padding: 0 20px 40px;
    background: transparent;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item .content .lc-typography--h5 {
    font-size: 20px;
    line-height: 26px;
}

.healthy-life .healthy-life-grid > .healthy-life-grid--item .content .lc-typography--p2 {
    font-size: 15px;
    line-height: 22px;
    color: #636366;
}

@media (max-width: 1024px) {
    .healthy-life .healthy-life-top {
        justify-content: flex-start;
    }

    /* "Acıbadem Life ile" / "Sağlıklı Yaşam Yolculuğu": balanced wrapping breaks the title after "ile", and the
       size scales down on small phones so the longer second line (10.5em) still fits on one line. */
    .healthy-life .healthy-life-top .lc-typography--h1 {
        font-size: clamp(24px, calc((100vw - 32px) / 10.9), 32px);
        line-height: 1.2;
        letter-spacing: -0.01em;
        text-align: left;
        text-wrap: balance;
    }

    /* browsers without text-wrap: balance (iOS < 17.5): same break from a fixed width, between the 10.49em of
       the second line and the 10.82em of "Acıbadem Life ile Sağlıklı" */
    @supports not (text-wrap: balance) {
        .healthy-life .healthy-life-top .lc-typography--h1 {
            max-width: 10.65em;
        }
    }

    .healthy-life .healthy-life-grid {
        display: flex;
        flex-direction: column;
        gap: 0;
        max-width: 640px;
        padding: 0;
        margin: 0 !important;
        overflow: visible;
        scroll-snap-type: none;
    }

    .healthy-life .healthy-life-grid::after {
        display: none;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item {
        flex: 0 0 auto;
        flex-direction: row;
        align-items: flex-start;
        gap: 16px;
        width: 100%;
        max-width: none;
        padding-bottom: 28px;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item:last-child {
        padding-bottom: 0;
    }

    /* the connecting line between two steps (was the grey card background) */
    .healthy-life .healthy-life-grid > .healthy-life-grid--item::before {
        inset: 64px auto 8px 27px;
        width: 2px;
        height: auto;
        border-radius: 1px;
        background: var(--primary-color-100, #c9f2ee);
        z-index: 0;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item:last-child::before {
        display: none;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item > .icon-wrapper {
        flex: 0 0 56px;
        width: 56px;
        padding: 4px;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item .icon-wrapper-inner {
        padding: 4px;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item .icon-wrapper-content svg {
        width: 20px;
        height: 20px;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item > .content {
        flex: 1 1 auto;
        align-items: flex-start;
        gap: 4px;
        padding: 6px 0 0;
        text-align: left;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item .content .lc-typography--h5 {
        font-size: 18px;
        line-height: 24px;
        text-align: left;
    }

    .healthy-life .healthy-life-grid > .healthy-life-grid--item .content .lc-typography--p2 {
        font-size: 15px;
        line-height: 22px;
        text-align: left;
    }
}

.premium-purchase-strip {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 48px 0;
    background: var(--primary-color-500, #20c9c0);
    color: #fff;
}
.premium-purchase-strip::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: url('/assets/images/globals/bubbles-variant-1.png') center / cover no-repeat;
    opacity: 0.15;
}
.premium-purchase-strip__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.premium-purchase-strip p { margin: 0; font-size: 22px; line-height: 1.4; }
.premium-purchase-strip .life-club-button {
    flex-shrink: 0;
    min-height: 60px;
    height: auto;
    padding: 18px 36px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    gap: 12px;
    background: #fff;
    color: var(--primary-color-500, #20c9c0);
}
.premium-purchase-strip .life-club-button svg { width: 24px; height: 24px; }
.premium-purchase-strip .life-club-button svg path { stroke: currentColor; }
@media (max-width: 767px) {
    .premium-purchase-strip { padding: 40px 0; }
    .premium-purchase-strip__inner { flex-direction: column; text-align: center; gap: 20px; }
    .premium-purchase-strip p { font-size: clamp(16px, calc((100vw - 32px) / 16.3), 20px); }
}

/* Premium hero copy on phones: "Acıbadem Life Premium ile" / "Belirti Beklemeyin" / "Tüm Vücut MR ile Önlem Alın",
   each on one line. The 44px gutter of the hero leaves only ~280px of text width on a 393px phone, so the copy
   area takes back 20px on each side and the type scales with the screen: the title is sized so that its 25
   characters fill the line (11.8em wide -> width / 12.2), the second and third lines are 80% of it, and the
   inline 24px the editor puts on the sub line is overridden. The line break after "Belirti Beklemeyin" is added
   by the view (br.hero-line-break) and only shown on phones. */
br.hero-line-break {
    display: none;
}

@media (max-width: 767px) {
    br.hero-line-break {
        display: inline;
    }

    .health-program-hero .inner-slider--content {
        margin-inline: -20px;
    }

    .health-program-hero .inner-slider--content h1 {
        white-space: nowrap;
        font-size: clamp(20px, calc((100vw - 72px) / 12.2), 34px);
        line-height: 1.2;
    }

    .health-program-hero .inner-slider--content p span {
        display: block;
        font-size: clamp(16px, calc((100vw - 72px) / 15.25), 26px) !important;
        line-height: 1.4;
    }
}