/* Shared motion and readability across the complete YAMAR site. */
/* The studio uses regular type throughout, including native heading/strong defaults. */
body[data-yamar-page],body[data-yamar-page] * { font-weight: 400 !important; font-synthesis: none; }
html[lang="ar"] body[data-yamar-page] :is(em,i) { font-style: normal !important; }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: yamar-page-out .18s ease both; }
::view-transition-new(root) { animation: yamar-page-in .42s cubic-bezier(.16,1,.3,1) both; }
@keyframes yamar-page-out { to { opacity: 0; } }
@keyframes yamar-page-in { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
body[data-yamar-page] [hidden] { display: none !important; }
body.studio-home > main[tabindex="-1"]:focus { outline: none; }
body[data-yamar-page] :where(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid #28917a; outline-offset: 4px; }
body[data-yamar-page] .motion-toggle { position: fixed; left: auto; right: auto; inset-inline-start: auto; inset-inline-end: 18px; inline-size: max-content; max-inline-size: calc(100vw - 36px); bottom: 18px; z-index: 950; min-height: 44px; padding: 10px 18px; border: 1px solid #d8decc70; border-radius: 30px; background: #14221ef5; color: #fff; box-shadow: 0 4px 20px #0002; font: 400 .875rem/1.5 Arial,sans-serif; cursor: pointer; }
body[data-yamar-page] .motion-toggle:disabled { opacity: 1; cursor: default; }
.studio-intro { position: fixed; inset: 0; z-index: 2000; background: #101914; color: #f4f4e9; display: grid; place-items: center; padding: 30px; overflow: hidden; animation: intro-curtain .5s 2.2s cubic-bezier(.76,0,.24,1) both; }
body.intro-active { overflow: hidden !important; }
.intro-lockup { display: flex; flex-direction: column; align-items: center; }
.intro-mark { display: block; width: clamp(95px,12vw,150px); height: auto; margin-bottom: 25px; animation: mark-arrive 1.35s cubic-bezier(.16,1,.3,1) both; }
.intro-name { display: flex; overflow: hidden; font-family: 'Cinzel Display',Georgia,serif; font-size: clamp(3.4rem,12vw,11rem); letter-spacing: .08em; line-height: 1.12; padding: 0 .04em 12px; }
.intro-name span { display: block; animation: name-arrive 1s cubic-bezier(.16,1,.3,1) both; }
.intro-name span:nth-child(2) { animation-delay: .12s; }.intro-name span:nth-child(3) { animation-delay: .24s; }.intro-name span:nth-child(4) { animation-delay: .36s; }.intro-name span:nth-child(5) { animation-delay: .48s; }
.intro-sub { font-size: .875rem; letter-spacing: .48em; text-transform: uppercase; color: #dfc68d; animation: name-arrive 1s .7s both; }
.intro-line { height: 1px; width: min(80vw,600px); background: #dfc68d; transform-origin: left; margin-top: 40px; animation: intro-line 2.4s cubic-bezier(.4,0,.2,1) both; }
.intro-corner { position: absolute; left: 4vw; top: 35px; font: .875rem/1.5 Arial,sans-serif; color: #c0cbbd; }
.intro-skip { position: absolute; bottom: 30px; right: 4vw; min-height: 48px; padding: 12px 22px; border: 1px solid #d8dfd568; background: transparent; color: #f3f4e8; font: .875rem/1.5 Arial,sans-serif; cursor: pointer; }
.intro-active .intro-lockup { animation: lockup-exit .4s 2.3s ease-in both; }
.replay-intro { display: inline-flex; align-items: center; min-height: 44px; background: transparent; border: 0; border-bottom: 1px solid #dfc68d66; color: #dfc68d; font-size: .875rem; padding: 8px 0; margin-top: 18px; cursor: pointer; }
@keyframes mark-arrive { from { opacity: 0; transform: scale(.65) rotate(-25deg); filter: blur(8px); } to { opacity: 1; transform: scale(1) rotate(0); filter: blur(0); } }
@keyframes name-arrive { from { opacity: 0; transform: translateY(115%); } to { opacity: 1; transform: translateY(0); } }
@keyframes intro-line { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes lockup-exit { to { opacity: 0; transform: translateY(-30px); } }
@keyframes intro-curtain { to { transform: translateY(-100%); } }

/* Operational views retain their layouts and visible controls. */
.yamar-workspace :where(.panel,.card,.stat-card,.metric,.modal,.product,.record,.venue-card,.shop-card) { border-color: #56726840; box-shadow: 0 6px 24px #16352908; }
.yamar-workspace :where(.nav-btn,.nav-item,.small-button,.top-actions button,.card-actions button,.modal-foot button,.lang button) { min-height: 44px; font-size: .875rem; }
.yamar-workspace :where(input,select,textarea) { font-size: 1rem; }
.yamar-workspace :where(.record-copy small,.metric small,.panel-head span,.section-head p,.proposal-note) { font-size: .8125rem; line-height: 1.6; }
.yamar-workspace :where(.main,.content,.view,.workspace,.panel) { min-width: 0; }
.yamar-workspace .workspace-brand-strip { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 7px 16px; border-bottom: 1px solid #56726840; font-size: .8125rem; color: inherit; }
.yamar-workspace .workspace-brand-strip img { width: 25px; height: 25px; background: #183b2c; border-radius: 50%; }
.yamar-workspace .workspace-photo { margin: 22px 16px; overflow: hidden; border-radius: 6px; flex-shrink: 0; background: #153b2b; }
.yamar-workspace .workspace-photo img { display: block; width: 100%; height: 90px; object-fit: cover; object-position: var(--photo-focus,50% 50%); }
.yamar-workspace .workspace-photo figcaption { padding: 7px 10px; color: #edf5e2; font-size: .75rem; line-height: 1.5; }
@media(prefers-reduced-motion:no-preference) {
  .yamar-workspace.motion-on :where(.view > .section-head,.view > .metrics,.view > .panel,.view > .cards,.view > .shop-grid,.view > .booking-agenda) { animation: workspace-arrive .3s ease both; }
  .yamar-editorial.motion-on .editorial-reveal { transition: opacity .8s, translate .9s cubic-bezier(.16,1,.3,1); }
  .yamar-editorial.motion-on.scene-observer-ready .editorial-reveal:not(.scene-revealed) { opacity: 0; translate: 0 24px; }
}
@keyframes workspace-arrive { from { opacity: .65; translate: 0 6px; } to { opacity: 1; translate: 0 0; } }
/* Free native scrolling; section links clear the measured sticky navigation. */
html:has(body:is(.studio-home,.yamar-editorial)) { scroll-padding-block-start: var(--yamar-scroll-offset,84px); scroll-behavior: smooth; }
body:is(.studio-home,.yamar-editorial) > main > :is(section,.photo-interlude,.editorial-photo-break,.editorial-work-detail) { scroll-margin-block-start: 0 !important; }
body[data-yamar-page].motion-off *,body[data-yamar-page].motion-off *::before,body[data-yamar-page].motion-off *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
body[data-yamar-page].motion-off .fade-in,body[data-yamar-page].motion-off .editorial-reveal { opacity: 1 !important; transform: none !important; translate: none !important; }
html:has(body[data-yamar-page].motion-off) { scroll-behavior: auto; }
html:has(body[data-yamar-page].motion-off)::view-transition-group(*) { animation: none; }
@media(max-width:700px) {
  body[data-yamar-page] .motion-toggle { inset-inline-end: 12px; bottom: 12px; padding: 10px 14px; font-size: .8125rem; }
  .intro-corner { left: 24px; font-size: .8125rem; }.intro-sub { letter-spacing: .3em; }
  .yamar-workspace .workspace-photo { display: none; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto !important; }
  @view-transition { navigation: none; }
  .studio-intro { display: none !important; }
  body[data-yamar-page] *,body[data-yamar-page] *::before,body[data-yamar-page] *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  body[data-yamar-page] .fade-in,body[data-yamar-page] .editorial-reveal { opacity: 1 !important; transform: none !important; translate: none !important; }
}