/* ==========================================================================
   Index Premium 2026 — scroll progress and subtle reveal animations.
   Cohesive, clean medical palette: primary blue, neutral greys, minimal green.
   ========================================================================== */

/* ---------- Scroll progress bar ------------------------------------------ */
.idx-scroll-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0%;
    background: linear-gradient(90deg, var(--primary) 0%, var(--primary-light) 100%);
    box-shadow: 0 0 10px rgba(37, 99, 235, 0.5);
    z-index: 10000;
    transition: width 0.1s linear;
}

/* ---------- Reveal enhancements ------------------------------------------ */
html.js-reveal .reveal {
    opacity: 0;
    transform: translateY(40px) scale(0.96);
    transition: opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

html.js-reveal .reveal.in-view {
    opacity: 1;
    transform: translateY(0) scale(1);
}

html.js-reveal .reveal.in-view.reveal-d1 { transition-delay: 0.08s; }
html.js-reveal .reveal.in-view.reveal-d2 { transition-delay: 0.16s; }
html.js-reveal .reveal.in-view.reveal-d3 { transition-delay: 0.24s; }
html.js-reveal .reveal.in-view.reveal-d4 { transition-delay: 0.32s; }
html.js-reveal .reveal.in-view.reveal-d5 { transition-delay: 0.40s; }

/* ---------- Animated counters -------------------------------------------- */
.idx-counter {
    font-variant-numeric: tabular-nums;
}

/* ---------- Static professional text accent ----------------------------- */
.text-gradient {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: var(--primary) !important;
    color: var(--primary) !important;
    animation: none !important;
}

/* Remove badge sheen */
.section-badge::after {
    display: none !important;
}

/* ---------- Cohesive cleanup overrides ------------------------------------ */

/* Quick Start: remove multicolour blobs / glows */
.quick-start {
    background: #f8fafc !important;
}
.quick-start::before,
.quick-start-media-glow {
    display: none !important;
}
.quick-start-title span {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: var(--primary) !important;
    color: var(--primary) !important;
}

/* Section badges: single blue tint, no green tint */
.section-badge {
    background: rgba(37, 99, 235, 0.08) !important;
    border-color: rgba(37, 99, 235, 0.2) !important;
    color: var(--primary) !important;
}

/* App feature icons: single blue instead of rainbow gradients */
.anf-icon {
    background: var(--primary) !important;
}

/* Video heading gradient text → solid blue */
#video h2 span {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: var(--primary) !important;
    color: var(--primary) !important;
}

/* Social icon: remove Instagram rainbow, use primary blue */
a[href*="instagram.com"] > div:first-child {
    background: var(--primary) !important;
}

/* Video star stat: blue instead of green */
#video p.idx-counter[data-prefix="★ "] {
    color: var(--primary) !important;
}

/* Dove Siamo modal header icon: blue instead of green */
#doveSiamoModal > div > div:first-child > div:first-child > div:first-child {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
}

/* Dove Siamo modal CTA: remove purple, use blue + outline blue */
#doveSiamoModal a[href="/tipo-paziente"] {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35) !important;
}
#doveSiamoModal a[href="/tipo-paziente"]:hover {
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.45) !important;
    transform: translateY(-2px) !important;
}
#doveSiamoModal a[href="../prenota.php"] {
    background: #fff !important;
    color: #2563eb !important;
    border: 1px solid #2563eb !important;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.15) !important;
}
#doveSiamoModal a[href="../prenota.php"]:hover {
    background: #eff6ff !important;
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.25) !important;
    transform: translateY(-2px) !important;
}

/* Support modal unified to primary blue */
.support-modal-header,
.support-form-submit {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
}
.support-contact-type label:hover,
.support-contact-type input:checked + label,
.support-contact-type input:focus-visible + label {
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}
.support-contact-type input:checked + label {
    background: rgba(37, 99, 235, 0.08) !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.12) !important;
}
.support-form-input:focus,
.support-form-textarea:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12) !important;
}
.support-privacy a {
    color: var(--primary) !important;
}
.support-privacy input {
    accent-color: var(--primary);
}

/* Remove leftover sheen/animation hooks */
.hero-blob,
.cta-box::before,
.section-badge::after {
    animation: none !important;
    display: none !important;
}
.experience-badge {
    animation: none !important;
}

/* ---------- Reduced motion ----------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    .text-gradient,
    .reveal {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}
