/* Fakhr Holding v32 — Motion system: compositor-only, progressive enhancement, mobile-first */
:root{--fh32-duration:480ms;--fh32-spring:cubic-bezier(.22,1,.36,1);--fh32-gold:#bc9257}
/* Limit scrolling animation to user-triggered CSS scroll; turn it off on reduced motion. */
html{scroll-padding-top:clamp(76px,8vw,108px)}
/* Disable old paint-heavy / perpetual effects, expensive persistent compositing and tilt. */
.hero-mesh,.portal-person-ring:after,.current-line,.portal-hero .kicker,.hero .pill{animation:none!important}
.sec-card,.post-card,.product-card,.stat,.quick-grid>a{will-change:auto!important;transform:none!important}
.sec-card::before,.post-card::before,.product-card::before,.stat::before{display:none!important}
.fh-reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
.hero h1,.portal-hero h1,.hero-info>p,.portal-hero p,.hero-photo>img,.portal-copy>*,.portal-page-v6 .portrait-stage{animation:none!important;filter:none!important}
.fh32-reading-progress{width:100%!important;transform:scaleX(0);transition:none;box-shadow:none;contain:paint}
/* Reveal remains visible unless JS has successfully installed a supported observer. */
html.fh32-motion-ready .fh32-reveal{opacity:0;translate:0 15px;transition:opacity var(--fh32-duration) ease-out,translate var(--fh32-duration) var(--fh32-spring);transition-delay:var(--fh32-delay,0ms)}
html.fh32-motion-ready .fh32-reveal.fh32-visible{opacity:1;translate:0 0}
/* Avoid placing fixed GPU layers on hundreds of cards. Promote only on interaction. */
@media (hover:hover) and (pointer:fine){
 :is(.sec-card,.post-card,.product-card,.v31-plan,.sector-depth-step,.v30-brief,.c24-sector):hover{translate:0 -3px;transition:translate 230ms var(--fh32-spring),border-color 230ms ease,box-shadow 230ms ease;will-change:auto}
 :is(.button,.v31-plan-cta,.c24-primary,.c24-secondary,.dept-primary,.fh-select-button):hover{transition:transform 180ms ease,background-color 180ms ease,border-color 180ms ease;transform:translateY(-1px)}
}
:where(button,a,[role=button],input,select,textarea):focus-visible{outline-offset:3px}
:where(button,.button,[type=submit]):active{transform:scale(.99)}
/* Purposeful, never-blocking loading feedback on actual form submission. */
.fh32-pending :is(button[type=submit],input[type=submit],button:not([type])){cursor:progress}
.fh32-pending button[type=submit]::after,.fh32-pending button:not([type])::after{content:'';display:inline-block;width:13px;height:13px;vertical-align:middle;margin-inline-start:9px;border:2px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:fh32-spin 650ms linear infinite}
@keyframes fh32-spin{to{transform:rotate(360deg)}}
.fh32-loading-skeleton{background:linear-gradient(105deg,var(--soft,#edf1f5) 25%,var(--card,#fff) 43%,var(--soft,#edf1f5) 61%);background-size:200% 100%;animation:fh32-skeleton 1400ms ease-in-out infinite}
@keyframes fh32-skeleton{to{background-position-x:-200%}}
/* Lightweight scroll cue on public hero sections. */
.fh32-scroll-cue{position:absolute;z-index:5;inset-inline-start:50%;inset-block-end:10px;transform:translateX(50%);display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid color-mix(in srgb,currentColor 16%,transparent);border-radius:999px;background:color-mix(in srgb,var(--card,#fff) 91%,transparent);color:var(--ink,#152941);box-shadow:0 7px 20px #071b3012;font-size:11px;font-weight:750;line-height:1.4;text-decoration:none;white-space:nowrap;opacity:.94;transition:opacity 180ms ease,box-shadow 180ms ease}
.fh32-scroll-cue:hover{opacity:1;box-shadow:0 8px 22px #071b3023}
.fh32-scroll-cue svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;animation:fh32-nudge 2s ease-in-out 3}
@keyframes fh32-nudge{0%,100%{transform:translateY(-1px)}50%{transform:translateY(3px)}}
.fh32-top{position:fixed;z-index:81;inset-inline-end:clamp(14px,3vw,25px);bottom:clamp(18px,3vw,28px);width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--edge,#dde4e8);border-radius:14px;background:var(--card,#fff);color:var(--ink,#12253c);box-shadow:0 8px 24px #13283e1b;cursor:pointer;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity 220ms ease,transform 220ms var(--fh32-spring)}
.fh32-top.fh32-top-visible{opacity:1;transform:translateY(0);pointer-events:auto}
.fh32-top svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.9;fill:none}
.fh32-top:focus-visible,.fh32-scroll-cue:focus-visible{outline:3px solid #b58b50;outline-offset:3px}
/* Keep animations especially light on small, touch-first and lower-end devices. */
@media(max-width:720px){:root{--fh32-duration:380ms}.fh32-scroll-cue{font-size:10px;padding:7px 11px;inset-block-end:5px}.fh32-top{height:42px;width:42px}.fh32-loading-skeleton{animation-duration:1800ms}}
@media(hover:none){:is(.sec-card,.post-card,.product-card,.v31-plan):hover{translate:0 0!important;transform:none!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}html.fh32-motion-ready .fh32-reveal{opacity:1!important;translate:0 0!important;transition:none!important}.fh32-scroll-cue svg,.fh32-pending button::after,.fh32-loading-skeleton{animation:none!important}.fh32-top{transition:none!important}.fh32-top.fh32-top-visible{transform:none!important}}

/* Entrance in the first viewport: one short transform/opacity pass, not endless particles. */
@keyframes fh32-enter{from{opacity:.42;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
 .portal-page-v6 .portal-copy,.hero .hero-info,.v30-sector-hero>div:first-child,.sector-resource-head>h1{animation:fh32-enter 630ms var(--fh32-spring) both}
}
/* Accessible live availability placeholder only for actual network requests. */
.fh29-availability.fh32-slot-loading{display:block;min-height:42px;border-radius:10px;padding:10px 12px;line-height:1.8;animation:fh32-skeleton 1400ms ease-in-out infinite;background:linear-gradient(105deg,var(--soft,#e6ecf1) 25%,var(--card,#fff) 43%,var(--soft,#e6ecf1) 61%);background-size:200% 100%}
@media(prefers-reduced-motion:reduce){.fh29-availability.fh32-slot-loading{animation:none!important}}

html[dir=ltr] .fh32-scroll-cue{transform:translateX(-50%)}
