/* One response per object; no moving background or full-cover spotlight. */
.cover-studio .story-intro::before { background-image: url('../assets/hero-studio-backdrop.webp'); opacity: .64; }
.masthead-letter { display: inline-block; position: relative; transform-origin: 50% 85%; backface-visibility: hidden; user-select: none; transition: text-shadow 280ms ease; }
.cover-studio .masthead-letter.is-near { text-shadow: 0 6px 18px rgb(231 174 191 / .17); }
.cover-studio .hero-masthead { white-space: nowrap; }
@media (min-width: 761px) {
  .cover-studio .hero-masthead { font-size: min(28vw, 43svh, 460px); }
}
@media (min-width: 761px) and (max-height: 620px) {
  .cover-studio .hero-masthead { top: 56px; font-size: min(27vw, 36svh, 235px); }
}
/* Animate the real letters in place, without a duplicate-word handoff. */
html[data-opening] .cover-studio .hero-masthead { visibility: visible; }
html[data-opening="pending"] .cover-studio .masthead-letter { opacity: 0; }
html[data-opening] .opening-screen { pointer-events: none; }
html[data-opening] .opening-skip { pointer-events: auto; }
.opening-veil, .opening-word { display: none; }
/* Frame-driven transforms must not chase a second CSS interpolation. */
.cover-studio.story-animated .story-card,
.cover-studio.story-animated .card-flipper { transition: none; }
@media (max-width: 760px) {
  .cover-studio .story-intro::before { background-position: 47% center; opacity: .46; }
}
@media (prefers-reduced-motion: reduce), (hover: none), (pointer: coarse) {
  .cover-studio .masthead-letter { transform: none !important; text-shadow: none !important; }
}
html[data-motion="reduced"] .cover-studio .masthead-letter { transform: none !important; text-shadow: none !important; }

/* The cover uses the same portrait publications as the profile gallery. */
.cover-studio .post-art { background:var(--paper); }
.cover-studio .post-art img { object-fit:cover; object-position:center; }
.cover-studio.story-animated .post-header { min-height:42px; padding-block:6px; }
.cover-studio.story-animated .post-footer { min-height:26px; padding-top:4px; }
.cover-studio.story-animated .post-caption { min-height:24px; padding-block:3px 5px; }
@media (max-width:760px) {
  .cover-studio.story-animated .post-header { min-height:28px; padding-block:3px; }
  .cover-studio.story-animated .post-footer { min-height:18px; padding-top:3px; }
  .cover-studio.story-animated .post-caption { min-height:18px; padding-block:2px 3px; }
}
.site-header .main-nav a[aria-current="location"] { color:var(--rose-light); background:rgb(231 174 191 / .12); box-shadow:0 0 0 7px rgb(231 174 191 / .12); border-radius:3px; }
#sobre .note-post:focus-visible { outline:2px solid var(--rose-light); outline-offset:6px; border-radius:6px; }
#sobre .note-card .post-avatar { transition:box-shadow 240ms ease; }
#faq summary { transition:color 220ms ease, background-color 220ms ease; border-radius:4px; }
#faq summary:focus-visible { outline:2px solid var(--brick); outline-offset:4px; }
@media (hover:hover) and (pointer:fine) {
  #sobre .note-post:hover .post-avatar { box-shadow:0 0 0 2px var(--paper),0 0 0 3px var(--brick); }
  #faq summary:hover { color:var(--brick); background:rgb(231 174 191 / .10); }
}
@media (prefers-reduced-motion:no-preference) {
  html:not([data-motion="reduced"]) :is(.button,.service-cta,.orbit-navigation button) { transition:background-color var(--feedback-fast) ease,color var(--feedback-fast) ease,transform var(--feedback-main) var(--feedback-ease),scale var(--feedback-fast) var(--feedback-ease); }
  html:not([data-motion="reduced"]) .note-card { transition:scale 180ms var(--feedback-ease); }
  html:not([data-motion="reduced"]) :is(.button,.service-cta,.orbit-navigation button):active { scale:.975; }
  html:not([data-motion="reduced"]) .note-post:active .note-card { scale:.985; }
  html:not([data-motion="reduced"]) .note-card .post-actions img { transition:translate 260ms var(--feedback-ease); }
}
@media (prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine) {
  html:not([data-motion="reduced"]) .note-post:hover .post-actions img:last-child { translate:2px -2px; }
}
