/* =========================================================================
   Alya Doula — custom overrides on top of ClinicMaster (skin-5)
   Loaded AFTER style.css + skin-5.css so these declarations win.
   Keeps the plum secondary (#3D203F) and swaps the pink primary for
   Alya rose (#c45b7a). Adds the MediCare-style hero slider.
   ========================================================================= */

html[data-theme-color="skin-5"],
:root {
    --primary: #c45b7a;
    --primarydark: #a84a66;
    --primary-rgb: 196, 91, 122;
    --primarylight: #f4e6ea;

    --secondary: #3d203f;
    --secondarydark: #2c1b2e;
    --secondary-rgb: 61, 32, 63;

    --heading-color: #3d203f;
    --body-color: #6b5468;
    --light: #faf6f3;

    --service-card-gradient: linear-gradient(90deg, rgb(196 91 122) 0%, rgb(61 32 63 / 55%) 100%);
    --icon-bx-gradient: 180deg, #ffffff 0%, #f4e6ea 100%;
    --bg3-gradient: linear-gradient(90deg, #f4e6ea 0%, #faf6f3 100%);
}

/* Poppins is the font actually loaded by the template head. */
html[data-theme-color="skin-5"] {
    --font-base: "Poppins";
    --font-title: "Poppins";
}

body { font-family: "Poppins", system-ui, sans-serif; }

/* Soft rose selection */
::selection { background: rgba(196, 91, 122, 0.18); color: #3d203f; }

/* =========================================================================
   HERO SLIDER — modern full-bleed, Ken Burns zoom, plum overlay
   Photo is a background layer, so it stays visible on every screen size.
   ========================================================================= */
.hero-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #2c1b2e;
}

.hero-slider .swiper-slide {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 560px;
    height: auto;
    overflow: hidden;
}
@media (min-width: 768px)  { .hero-slider .swiper-slide { min-height: 620px; } }
@media (min-width: 992px)  { .hero-slider .swiper-slide { min-height: 720px; } }
@media (min-width: 1600px) { .hero-slider .swiper-slide { min-height: 820px; } }

/* Full-bleed background photo */
.hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
}
.hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 26%;
    transform: scale(1.12);
    will-change: transform;
}
/* Ken Burns: slow zoom-out on the active slide */
.hero-slider .swiper-slide-active .hero-img {
    transform: scale(1);
    transition: transform 8s ease-out;
}

/* Plum gradient overlay for legible white text on any width */
.hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(102deg,
            rgba(44, 27, 46, 0.92) 0%,
            rgba(44, 27, 46, 0.70) 38%,
            rgba(44, 27, 46, 0.34) 70%,
            rgba(44, 27, 46, 0.12) 100%),
        linear-gradient(180deg,
            rgba(44, 27, 46, 0.05) 55%,
            rgba(44, 27, 46, 0.45) 100%);
}

/* Foreground content sits above the overlay */
.hero-fg { position: relative; z-index: 2; }
.hero-content {
    position: relative;
    max-width: 640px;
    padding: 92px 0;
    color: #fff;
}
@media (max-width: 767.98px) {
    .hero-content { padding: 64px 0; max-width: 100%; }
}

.hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    background: rgba(196, 91, 122, 0.92);
    color: #fff;
    padding: 8px 18px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 22px;
    box-shadow: 0 14px 30px -12px rgba(196, 91, 122, 0.7);
}
.hero-kicker::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
}

.hero-title {
    color: #fff;
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.01em;
    font-size: clamp(2rem, 1.15rem + 3.6vw, 4rem);
    margin-bottom: 20px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.22);
}

.hero-lead {
    color: rgba(255, 255, 255, 0.9);
    font-size: clamp(1rem, 0.9rem + 0.5vw, 1.25rem);
    font-weight: 300;
    line-height: 1.6;
    max-width: 34em;
    margin-bottom: 34px;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-bottom: 26px;
}

/* Ghost secondary button — always visible white-on-photo */
.hero-btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 15px 32px;
    border-radius: 100px;
    border: 1.5px solid rgba(255, 255, 255, 0.75);
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    background: rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}
.hero-btn-ghost:hover {
    background: #fff;
    color: var(--secondary);
    border-color: #fff;
    transform: translateY(-2px);
}

.hero-note {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 14px;
    font-weight: 500;
}
.hero-note i { color: #fff; font-size: 17px; }

/* --- Entrance animations, keyed to Swiper's active slide --- */
.hero-slider .anim-up {
    opacity: 0;
    transform: translate3d(0, 40px, 0);
    transition: opacity 0.9s ease, transform 0.9s cubic-bezier(.2, .7, .2, 1);
}
.hero-slider .swiper-slide-active .anim-up { opacity: 1; transform: none; }
.hero-slider .swiper-slide-active .anim-up.d1 { transition-delay: 0.25s; }
.hero-slider .swiper-slide-active .anim-up.d2 { transition-delay: 0.40s; }
.hero-slider .swiper-slide-active .anim-up.d3 { transition-delay: 0.55s; }

/* --- Arrows --- */
.hero-nav {
    position: absolute;
    top: 50%;
    z-index: 10;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: #fff;
    cursor: pointer;
    transform: translateY(-50%);
    backdrop-filter: blur(6px);
    transition: all 0.3s ease;
}
.hero-nav:hover { background: #fff; color: var(--secondary); border-color: #fff; }
.hero-nav.hero-prev { left: 26px; }
.hero-nav.hero-next { right: 26px; }
.hero-nav.swiper-button-disabled { opacity: 0; pointer-events: none; }
/* On touch / small screens rely on swipe + dots */
@media (max-width: 991.98px) { .hero-nav { display: none; } }

/* --- Pagination bullets --- */
.hero-pagination {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.hero-pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.5);
    opacity: 1;
    cursor: pointer;
    transition: all 0.35s ease;
}
.hero-pagination .swiper-pagination-bullet-active {
    width: 32px;
    background: #fff;
}

/* --- Autoplay progress bar --- */
.hero-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    z-index: 10;
    background: rgba(255, 255, 255, 0.16);
}
.hero-progress span {
    display: block;
    height: 100%;
    width: 100%;
    transform: scaleX(0);
    transform-origin: left center;
    background: var(--primary);
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .hero-slider .hero-img { transition: none !important; transform: scale(1) !important; }
    .hero-slider .anim-up { transition: none !important; opacity: 1 !important; transform: none !important; }
    .hero-progress span { display: none; }
}

/* =========================================================================
   Small quality-of-life fixes
   ========================================================================= */
/* Ensure the sticky header turns solid once scrolled */
.site-header.is-fixed { position: fixed; top: 0; animation: dzMoveDown .6s; }
@keyframes dzMoveDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }

/* Language switch pill in header */
.lang-switch { font-weight: 600; letter-spacing: .3px; }
.lang-switch .sep { opacity: .35; margin: 0 6px; }
.lang-switch a { color: #3d203f; }
.lang-switch a.is-active { color: var(--primary); }

/* Honeypot */
.hp-field { position: absolute !important; left: -9999px !important; top: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Inner-page banner */
.page-banner {
    background-image: linear-gradient(120deg, #faf6f3 0%, #f4e6ea 55%, #efd9e0 100%);
}
.page-banner-blob {
    position: absolute;
    top: -120px;
    inset-inline-end: -80px;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.55), rgba(196, 91, 122, 0.12) 70%);
    z-index: 0;
    pointer-events: none;
}
.page-banner::after {
    content: "";
    position: absolute;
    bottom: -60px;
    inset-inline-start: -60px;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    border: 1px dashed rgba(196, 91, 122, 0.25);
    z-index: 0;
    pointer-events: none;
}

/* Prose content (privacy / service / note bodies) */
.prose-content h2 { color: #3d203f; font-weight: 700; font-size: 1.5rem; margin: 1.8rem 0 0.8rem; }
.prose-content h3 { color: #3d203f; font-weight: 600; font-size: 1.2rem; margin: 1.4rem 0 0.6rem; }
.prose-content p { margin-bottom: 1rem; line-height: 1.8; }
.prose-content ul { list-style: none; margin: 0 0 1.2rem; padding: 0; }
.prose-content ul li { position: relative; padding-inline-start: 1.9rem; margin-bottom: 0.6rem; line-height: 1.7; }
.prose-content ul li::before { content: "\f109"; font-family: "flaticon"; color: #c45b7a; position: absolute; inset-inline-start: 0; top: 0.15rem; font-weight: 900; }
.prose-content a { color: #c45b7a; font-weight: 500; text-decoration: underline; text-underline-offset: 2px; }
.prose-content a:hover { color: #a84a66; }

/* =========================================================================
   Brand logo
   ========================================================================= */
.brand-logo { display: block; width: auto; object-fit: contain; }
.brand-logo-header { height: 62px; }
.brand-logo-mobile { height: 64px; }
.brand-logo-footer { height: 100px; }
@media (max-width: 575.98px) { .brand-logo-header { height: 52px; } }

/* =========================================================================
   WhatsApp button (visible on dark plum CTA)
   ========================================================================= */
.btn-whatsapp { background-color: #25d366; border-color: #25d366; color: #fff; }
.btn-whatsapp:hover { background-color: #1ebe5d; border-color: #1ebe5d; color: #fff; }
.btn-whatsapp i { color: #fff; }

/* =========================================================================
   Footer surface, calm cream-to-blush wash (replaces busy decorative bg)
   ========================================================================= */
.footer-surface {
    background: linear-gradient(180deg, #faf6f3 0%, #f4e6ea 100%);
}

/* =========================================================================
   Footer developer credit, blends with the footer surface
   Anthracite text with a neon-gradient brand mark that reads on light pink.
   ========================================================================= */
.footer-credit {
    background: transparent;
}
.footer-credit-text {
    color: #3a3340;
    letter-spacing: 0.2px;
}
.aksoy-neon {
    color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(90deg, #7c3aed 0%, #06b6d4 35%, #db2777 65%, #7c3aed 100%);
    background-size: 200%;
    -webkit-background-clip: text;
    background-clip: text;
    filter: drop-shadow(0 0 4px rgba(124, 58, 237, 0.4)) drop-shadow(0 0 8px rgba(219, 39, 119, 0.3));
    text-decoration: none;
    font-weight: 700;
    transition: filter 0.3s ease;
    animation: aksoy-neon-shift 3.2s linear infinite;
}
.aksoy-neon:hover {
    filter: drop-shadow(0 0 6px rgba(124, 58, 237, 0.6)) drop-shadow(0 0 12px rgba(219, 39, 119, 0.5));
}
@keyframes aksoy-neon-shift {
    0%   { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}
@media (prefers-reduced-motion: reduce) {
    .aksoy-neon { animation: none; }
}
