/* Lightweight premium motion for KAE Days Counseling.
   Interaction-only, CSS-first, GPU-friendly, and respectful of reduced-motion preferences. */

:root {
    --motion-ease: cubic-bezier(.22, 1, .36, 1);
    --motion-soft: cubic-bezier(.25, .8, .25, 1);
}

/* Keep non-interactive content visually still. */
.specialty-card,
.quality-highlight,
.home-recognize-list li,
.related-card,
.service-recognize-item,
.recognize-item,
.contact-practice-meta > div,
.modality-card,
.home-closing-card,
.quality-care-card,
.specialty-hero-panel,
.service-recognize-card,
.service-faq-card,
.faq-wrap,
.contact-choice {
    transform: none !important;
}

/* Primary CTA: two translucent panels fold inward slowly. */
.premium-fold-btn {
    isolation: isolate;
    overflow: hidden;
    position: relative;
    transition: box-shadow .6s var(--motion-ease), transform .45s var(--motion-ease) !important;
}

.premium-fold-btn > span,
.premium-fold-btn > i,
.premium-fold-btn > svg {
    position: relative;
    z-index: 3;
}

.premium-fold-btn::before,
.premium-fold-btn::after {
    content: '';
    inset: -2px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: transform .9s var(--motion-ease), opacity .45s ease;
    z-index: 1;
}

.premium-fold-btn::before {
    background: linear-gradient(115deg, rgba(255,255,255,.38), rgba(255,255,255,.12) 72%);
    clip-path: polygon(0 0, 64% 0, 48% 100%, 0 100%);
    transform: translateX(-72%) skewX(-10deg);
}

.premium-fold-btn::after {
    background: linear-gradient(245deg, rgba(255,255,255,.30), rgba(255,255,255,.08) 72%);
    clip-path: polygon(36% 0, 100% 0, 100% 100%, 52% 100%);
    transform: translateX(72%) skewX(10deg);
}

.premium-fold-btn:hover::before,
.premium-fold-btn:focus-visible::before,
.premium-fold-btn:hover::after,
.premium-fold-btn:focus-visible::after {
    opacity: 1;
    transform: translateX(0) skewX(0deg);
}

.premium-fold-btn:hover,
.premium-fold-btn:focus-visible {
    box-shadow: 0 13px 30px rgba(3,152,158,.24);
    transform: translateY(-1px);
}

.premium-fold-btn:active {
    transform: translateY(0) scale(.987);
}

/* Outline / light buttons: preserve strong contrast while a pale brand tint settles in. */
.premium-outline-btn {
    background-color: transparent !important;
    background-image: linear-gradient(100deg, rgba(3,152,158,.08), rgba(72,138,76,.10));
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 0 100%;
    position: relative;
    transform: none !important;
    transition: background-size .75s var(--motion-ease), background-color .45s ease, border-color .5s ease, color .4s ease, box-shadow .55s var(--motion-ease) !important;
}

.premium-outline-btn.btn-outline-secondary {
    border-color: #81908a !important;
    color: #465a53 !important;
}

.premium-outline-btn.btn-outline-primary {
    border-color: #58a9ad !important;
    color: #037b80 !important;
}

.premium-outline-btn.btn-light,
.site-footer-button.premium-outline-btn {
    background-color: #fff !important;
    border-color: rgba(63,93,110,.20) !important;
    color: #3f5d6e !important;
}

.premium-outline-btn:hover,
.premium-outline-btn:focus-visible {
    background-color: #f1f8f6 !important;
    background-size: 100% 100%;
    border-color: #5d9187 !important;
    box-shadow: 0 8px 22px rgba(48,64,57,.08);
    color: #294b43 !important;
    transform: none !important;
}

.premium-outline-btn.btn-outline-primary:hover,
.premium-outline-btn.btn-outline-primary:focus-visible {
    background-color: #edf8f8 !important;
    border-color: #279da1 !important;
    color: #035f63 !important;
}

.premium-outline-btn.btn-light:hover,
.premium-outline-btn.btn-light:focus-visible,
.site-footer-button.premium-outline-btn:hover,
.site-footer-button.premium-outline-btn:focus-visible {
    background-color: #edf6f3 !important;
    border-color: #6a9188 !important;
    color: #304f47 !important;
}

/* Solid gray secondary buttons: slow slate-to-teal wash with white text retained. */
.premium-muted-btn {
    background-color: #596b66 !important;
    background-image: linear-gradient(105deg, #596b66 0%, #536d68 44%, #3f5d6e 100%) !important;
    background-position: 100% 0;
    background-size: 220% 100%;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 7px 18px rgba(48,64,57,.11);
    transform: none !important;
    transition: background-position .85s var(--motion-ease), box-shadow .55s var(--motion-ease) !important;
}

.premium-muted-btn:hover,
.premium-muted-btn:focus-visible {
    background-color: #465e59 !important;
    background-position: 0 0;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(48,64,57,.17);
    transform: none !important;
}

/* Calm text-link interaction: a line draws in while the arrow gently drifts forward. */
.specialty-card-link,
.premium-text-link {
    background-image: linear-gradient(90deg, rgba(3,152,158,.58), rgba(72,138,76,.46));
    background-position: left calc(100% - 1px);
    background-repeat: no-repeat;
    background-size: 0 1px;
    display: inline-block;
    padding-right: 1.15rem;
    position: relative;
    text-decoration: none !important;
    transform: none !important;
    transition: background-size .65s var(--motion-ease), color .3s ease !important;
}

.specialty-card-link::after,
.premium-text-link::after {
    content: '→';
    opacity: .48;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-4px, -50%);
    transition: opacity .55s ease, transform .65s var(--motion-ease);
}

.specialty-card-link:hover,
.specialty-card-link:focus-visible,
.premium-text-link:hover,
.premium-text-link:focus-visible {
    background-size: 100% 1px;
    color: #026f74 !important;
    text-decoration: none !important;
}

.specialty-card-link:hover::after,
.specialty-card-link:focus-visible::after,
.premium-text-link:hover::after,
.premium-text-link:focus-visible::after {
    opacity: .95;
    transform: translate(1px, -50%);
}

/* Learn More buttons use a slow tonal wash instead of a lift. */
.modality-card .btn,
.premium-wash-btn {
    background-image: linear-gradient(105deg, #03989e 0%, #03989e 38%, #2aa6a3 54%, #488a4c 100%);
    background-position: 100% 0;
    background-size: 220% 100%;
    box-shadow: 0 7px 18px rgba(3,152,158,.13);
    overflow: hidden;
    padding-right: 2.2rem;
    position: relative;
    transform: none !important;
    transition: background-position .95s var(--motion-ease), box-shadow .6s var(--motion-ease) !important;
}

.modality-card .btn::after,
.premium-wash-btn::after {
    content: '→';
    opacity: .48;
    position: absolute;
    right: .9rem;
    top: 50%;
    transform: translate(-4px, -50%);
    transition: opacity .55s ease, transform .75s var(--motion-ease);
}

.modality-card .btn:hover,
.modality-card .btn:focus-visible,
.premium-wash-btn:hover,
.premium-wash-btn:focus-visible {
    background-position: 0 0;
    box-shadow: 0 10px 24px rgba(3,152,158,.18);
}

.modality-card .btn:hover::after,
.modality-card .btn:focus-visible::after,
.premium-wash-btn:hover::after,
.premium-wash-btn:focus-visible::after {
    opacity: .95;
    transform: translate(1px, -50%);
}

/* Navigational choice cards: soft directional fill + arrow reveal. */
.guided-home-option,
.premium-choice-link,
.start-helper-option {
    isolation: isolate;
    overflow: hidden;
    padding-right: 3.25rem !important;
    position: relative;
    transform: none !important;
    transition: border-color .7s ease, box-shadow .8s var(--motion-ease), color .45s ease !important;
}

.guided-home-option::before,
.premium-choice-link::before,
.start-helper-option::before {
    background: linear-gradient(100deg, rgba(3,152,158,.10), rgba(72,138,76,.075) 58%, rgba(255,255,255,0) 100%);
    content: '';
    inset: 0;
    pointer-events: none;
    position: absolute;
    transform: translateX(-103%);
    transition: transform .9s var(--motion-ease);
    z-index: 0;
}

.guided-home-option::after,
.premium-choice-link::after,
.start-helper-option::after {
    color: #038b90;
    content: '→';
    font-size: 1.1rem;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 1.05rem;
    top: 50%;
    transform: translate(-8px, -50%);
    transition: opacity .55s ease .08s, transform .75s var(--motion-ease);
    z-index: 2;
}

.guided-home-option > *,
.premium-choice-link > *,
.start-helper-option > * {
    position: relative;
    z-index: 1;
}

.guided-home-option:hover,
.guided-home-option:focus-visible,
.premium-choice-link:hover,
.premium-choice-link:focus-visible,
.start-helper-option:hover,
.start-helper-option:focus-visible {
    border-color: rgba(3,152,158,.28) !important;
    box-shadow: 0 12px 30px rgba(48,64,57,.075) !important;
    color: #2f5149 !important;
    transform: none !important;
}

.guided-home-option:hover::before,
.guided-home-option:focus-visible::before,
.premium-choice-link:hover::before,
.premium-choice-link:focus-visible::before,
.start-helper-option:hover::before,
.start-helper-option:focus-visible::before {
    transform: translateX(0);
}

.guided-home-option:hover::after,
.guided-home-option:focus-visible::after,
.premium-choice-link:hover::after,
.premium-choice-link:focus-visible::after,
.start-helper-option:hover::after,
.start-helper-option:focus-visible::after {
    opacity: .9;
    transform: translate(0, -50%);
}

/* Helper schedule CTA uses the primary CTA language without extra lift. */
.start-helper-schedule {
    transition: background-color .45s ease, box-shadow .55s var(--motion-ease) !important;
}

.start-helper-schedule:hover,
.start-helper-schedule:focus-visible {
    box-shadow: 0 9px 24px rgba(3,152,158,.18);
    transform: none !important;
}

/* Accordions are interactive, so only their controls animate. */
.accordion-button {
    transition: background-color .24s ease, color .24s ease, box-shadow .24s ease;
}

.accordion-button::after {
    transition: transform .35s var(--motion-ease);
}

/* Navigation remains subtle and directional. */
.site-header .nav-link,
.site-header .dropdown-item {
    transition: background-color .22s ease, color .22s ease, transform .22s var(--motion-ease);
}

.site-header .dropdown-item:hover,
.site-header .dropdown-item:focus-visible {
    transform: translateX(2px);
}

/* The helper panel itself may softly rise when intentionally opened. */
.start-helper.is-open .start-helper-panel {
    animation: helper-rise .32s var(--motion-ease) both;
}

@keyframes helper-rise {
    from { opacity: 0; transform: translateY(8px) scale(.99); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Keep the desktop hero copy clear of Kaelynn's face. */
@media (min-width: 769px) {
    #hero-flex {
        justify-content: flex-end !important;
        padding-left: clamp(1.5rem, 4vw, 4rem);
        padding-right: clamp(2rem, 7vw, 8rem);
    }

    .hero-desktop-panel {
        max-width: min(52rem, 55vw);
        width: 100%;
    }

    .hero-heading {
        margin-left: auto;
        margin-right: 0;
    }
}

/* Accessibility: remove motion while preserving visual states. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        transition-delay: 0ms !important;
    }
}