/* ARTICLE55.80 — Premium motion and micro-interactions. Native CSS/JS, no framework dependency. */
:root{--v580-ease:cubic-bezier(.22,1,.36,1);--v580-fast:220ms;--v580-medium:520ms}

/* Calm by design: remove continuous pulse, bounce, float and looping node effects. */
html.v580-js :is(.moemen-mobile-sticky-cta a[href*="wa.me"],.moemen-mobile-sticky-cta a[href*="whatsapp"],.floating-wa,.fab-whatsapp,[class*="whatsapp-float"],[class*="float-whatsapp"],.hero-badge-dot,.hero-img img,.hero img,[class*="doctor-img"],[class*="hero-doctor"],.moemen-motion-pathway .path-node){animation:none!important}
html.v580-js :is(.hero,[class*="hero-section"])::before{animation:none!important}

/* Sticky navigation morph: subtle separation and logo refinement after scroll. */
.site-header{transition:background-color var(--v580-fast) ease,box-shadow var(--v580-fast) ease,border-color var(--v580-fast) ease,backdrop-filter var(--v580-fast) ease,-webkit-backdrop-filter var(--v580-fast) ease}
.site-header .nav-shell{transition:height var(--v580-fast) var(--v580-ease)}
.site-header .brand img{transition:transform var(--v580-fast) var(--v580-ease),box-shadow var(--v580-fast) ease}
.site-header.v580-scrolled{background:rgba(255,255,255,.96)!important;border-bottom-color:rgba(7,27,51,.10)!important;box-shadow:0 10px 30px rgba(7,27,51,.09)!important;-webkit-backdrop-filter:blur(20px) saturate(1.15);backdrop-filter:blur(20px) saturate(1.15)}
.site-header.v580-scrolled .brand img{transform:scale(.94);box-shadow:0 8px 22px rgba(7,27,51,.12)}
@media(min-width:821px){.site-header.v580-scrolled .nav-shell{height:74px}}

/* Homepage reveal system. Elements are hidden only when JS is confirmed. */
html.v580-js:not(.v580-reduce-motion) body.v580-home :is(
.v580-reveal,
.v559-entry-card,
#services article,
.blog-card,
.en-blog-card,
.gallery-card,
.case-card,
.credential-card,
.timeline .step,
.clinic-card,
.faq-list details,
.v560-booking-option,
.moemen-v577-proof article,
.moemen-v577-proof [class*="item"]
):not(.v580-visible){opacity:0;transform:translate3d(0,18px,0);filter:blur(1.5px)}
html.v580-js:not(.v580-reduce-motion) body.v580-home :is(
.v580-reveal,
.v559-entry-card,
#services article,
.blog-card,
.en-blog-card,
.gallery-card,
.case-card,
.credential-card,
.timeline .step,
.clinic-card,
.faq-list details,
.v560-booking-option,
.moemen-v577-proof article,
.moemen-v577-proof [class*="item"]
){transition:opacity var(--v580-medium) var(--v580-ease),transform var(--v580-medium) var(--v580-ease),filter var(--v580-medium) var(--v580-ease);transition-delay:var(--v580-delay,0ms);will-change:opacity,transform}
html.v580-js body.v580-home :is(.v580-visible,.v580-failsafe-visible){opacity:1!important;transform:none!important;filter:none!important}
html.v580-failsafe body.v580-home :is(.v580-reveal,.v559-entry-card,#services article,.blog-card,.en-blog-card,.gallery-card,.case-card,.credential-card,.timeline .step,.clinic-card,.faq-list details,.v560-booking-option,.moemen-v577-proof article,.moemen-v577-proof [class*="item"]){opacity:1!important;transform:none!important;filter:none!important}

/* Premium, tactile hover states: short travel, low amplitude, no bounce. */
:is(.btn,.moemen-cta-primary,.moemen-cta-secondary,.booking-submit,.v560-cta-button,.hero-cta a,.hero-action-row a,.v559-entry-action,.moemen-compact-whatsapp-sticky){transition:transform var(--v580-fast) var(--v580-ease),box-shadow var(--v580-fast) ease,border-color var(--v580-fast) ease,background-color var(--v580-fast) ease,filter var(--v580-fast) ease!important}
:is(.v559-entry-card,#services article,.lux-card,.blog-card,.en-blog-card,.gallery-card,.case-card,.clinic-card,.credential-card,.patient-guide-card,.v560-booking-option){transition:transform 280ms var(--v580-ease),box-shadow 280ms ease,border-color 280ms ease!important}
@media(hover:hover) and (pointer:fine){
:is(.btn,.moemen-cta-primary,.moemen-cta-secondary,.booking-submit,.v560-cta-button,.hero-cta a,.hero-action-row a,.v559-entry-action):hover{transform:translateY(-2px) scale(1.01)!important;filter:brightness(1.015)}
:is(.v559-entry-card,#services article,.lux-card,.blog-card,.en-blog-card,.gallery-card,.case-card,.clinic-card,.credential-card,.patient-guide-card,.v560-booking-option):hover{transform:translateY(-4px)!important;box-shadow:0 20px 48px rgba(7,27,51,.12)!important;border-color:rgba(30,167,168,.28)!important}
}
:is(.btn,.moemen-cta-primary,.moemen-cta-secondary,.booking-submit,.v560-cta-button,.hero-cta a,.hero-action-row a,.v559-entry-action):active{transform:translateY(0) scale(.985)!important;transition-duration:90ms!important}

/* FAQ / details progressive enhancement. Unsupported browsers retain native behavior. */
details.v580-accordion>summary{position:relative;list-style:none;padding-inline-end:2.35rem;transition:color var(--v580-fast) ease}
details.v580-accordion>summary::-webkit-details-marker{display:none}
details.v580-accordion>summary::after{content:"+";position:absolute;inset-inline-end:.15rem;top:50%;display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:999px;background:rgba(30,167,168,.10);color:#0f7f83;font-size:1.22rem;font-weight:800;line-height:1;transform:translateY(-50%) rotate(0);transition:transform 260ms var(--v580-ease),background-color 260ms ease,color 260ms ease}
details.v580-accordion[open]>summary::after{transform:translateY(-50%) rotate(45deg);background:rgba(216,184,103,.18);color:#7a5a10}
details.v580-accordion[open]>summary{color:#0b2f4f}
@supports(interpolate-size:allow-keywords){
:root{interpolate-size:allow-keywords}
details.v580-accordion::details-content{block-size:0;opacity:0;overflow:hidden;transition:block-size 340ms var(--v580-ease),opacity 240ms ease,content-visibility 340ms allow-discrete}
details.v580-accordion[open]::details-content{block-size:auto;opacity:1}
}

/* Form micro-interactions: visible focus, calm feedback, no layout jump. */
:is(input,select,textarea){transition:border-color var(--v580-fast) ease,box-shadow var(--v580-fast) ease,background-color var(--v580-fast) ease!important}
:is(input,select,textarea):focus{border-color:#1ea7a8!important;box-shadow:0 0 0 4px rgba(30,167,168,.13)!important;background-color:#fff!important;outline:none!important}
:is(input,select,textarea)[aria-invalid="true"]{border-color:#b91c1c!important;box-shadow:0 0 0 4px rgba(185,28,28,.10)!important}

/* Gentle image polish without fake skeleton delays. */
body.v580-home :is(.blog-card,.en-blog-card,.gallery-card,.case-card) img{transition:transform 420ms var(--v580-ease),filter 320ms ease}
@media(hover:hover) and (pointer:fine){body.v580-home :is(.blog-card,.en-blog-card,.gallery-card,.case-card):hover img{transform:scale(1.018);filter:saturate(1.02)}}

@media(max-width:820px){
.site-header.v580-scrolled .brand img{transform:none}
:is(.v559-entry-card,#services article,.lux-card,.blog-card,.en-blog-card,.gallery-card,.case-card,.clinic-card,.credential-card,.patient-guide-card,.v560-booking-option):hover{transform:none!important}
}

@media(prefers-reduced-motion:reduce){
html.v580-js{scroll-behavior:auto!important}
html.v580-js *,html.v580-js *::before,html.v580-js *::after{animation:none!important;transition-duration:.001ms!important;transition-delay:0ms!important}
html.v580-js body.v580-home :is(.v580-reveal,.v559-entry-card,#services article,.blog-card,.en-blog-card,.gallery-card,.case-card,.credential-card,.timeline .step,.clinic-card,.faq-list details,.v560-booking-option,.moemen-v577-proof article,.moemen-v577-proof [class*="item"]){opacity:1!important;transform:none!important;filter:none!important}
}

/* ARTICLE55.80 regression closure: override legacy !important reveal rules and enhance custom Arabic accordion. */
html.v580-js:not(.v580-reduce-motion) body.v580-home :is(.v580-reveal,.v559-entry-card,#services article,.blog-card,.en-blog-card,.gallery-card,.case-card,.credential-card,.timeline .step,.clinic-card,.faq-list details,.home-cro-faq-item,.v560-booking-option,.moemen-v577-proof article,.moemen-v577-proof [class*="item"]):not(.v580-visible):not(.v580-failsafe-visible){opacity:0!important;transform:translate3d(0,18px,0)!important;filter:blur(1.5px)!important}
html.v580-failsafe body.v580-home :is(.home-cro-faq-item){opacity:1!important;transform:none!important;filter:none!important}
.home-cro-faq-item{transition:opacity var(--v580-medium) var(--v580-ease),transform var(--v580-medium) var(--v580-ease),filter var(--v580-medium) var(--v580-ease),border-color var(--v580-fast) ease,box-shadow var(--v580-fast) ease;transition-delay:var(--v580-delay,0ms)}
.home-cro-faq-item .accordion-btn{position:relative;padding-inline-end:2.55rem!important;transition:color var(--v580-fast) ease,background-color var(--v580-fast) ease}
.home-cro-faq-item .accordion-btn::after{content:"+";position:absolute;inset-inline-end:.75rem;top:50%;display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:999px;background:rgba(30,167,168,.10);color:#0f7f83;font-size:1.22rem;font-weight:800;line-height:1;transform:translateY(-50%);transition:transform 260ms var(--v580-ease),background-color 260ms ease,color 260ms ease}
.home-cro-faq-item.open .accordion-btn::after{transform:translateY(-50%) rotate(45deg);background:rgba(216,184,103,.18);color:#7a5a10}
.home-cro-faq-item .accordion-panel{opacity:0;transition:max-height 340ms var(--v580-ease),opacity 240ms ease!important}
.home-cro-faq-item.open .accordion-panel{opacity:1}
@media(prefers-reduced-motion:reduce){html.v580-js body.v580-home .home-cro-faq-item{opacity:1!important;transform:none!important;filter:none!important}.home-cro-faq-item .accordion-panel{transition:none!important}}

/* High-specificity form focus closure for legacy inline styles loaded after the global stylesheet. */
html.v580-js body form :is(input,select,textarea):focus,
html.v580-js body form :is(input,select,textarea):focus-visible,
html.v580-js body :is(.booking-form,.v560-booking-form-wrap,.v560-guide-section) :is(input,select,textarea):focus,
html.v580-js body :is(.booking-form,.v560-booking-form-wrap,.v560-guide-section) :is(input,select,textarea):focus-visible{border-color:#1ea7a8!important;box-shadow:0 0 0 4px rgba(30,167,168,.16)!important;background-color:#fff!important;outline:none!important}

/* CSP-safe focus class applied by the external motion script. */
html.v580-js body input.v580-field-focus,
html.v580-js body select.v580-field-focus,
html.v580-js body textarea.v580-field-focus{border-color:#1ea7a8!important;box-shadow:0 0 0 4px rgba(30,167,168,.16)!important;background-color:#fff!important;outline:none!important}