/* A quiet opening gives the following sheep scene room to tell the story. */
.hero-journey { position:relative; }
.motion-ready .hero-journey { height:auto; }
.motion-ready .hero { position:relative; min-height:600px; height:calc(100svh - 82px); padding-block:38px 88px; overflow:visible; }
.motion-ready .hero-copy { position:relative; z-index:2; }
.motion-ready .hero h1 { font-size:clamp(3rem,5.25vw,4.7rem); }
.motion-ready .hero-latest-scene { min-height:0; height:100%; min-width:0; }
.motion-ready .hero-latest-shot { width:min(100%,460px); transform-origin:50% 55%; }
.motion-ready .hero-latest-shot img { width:100%; height:auto; max-height:75svh; object-fit:contain; animation:none; }
.flight-scroll-cue { position:absolute; bottom:-20px; left:50%; display:flex; align-items:center; gap:10px; width:max-content; transform:translateX(-50%); color:var(--soft); font-size:.875rem; font-weight:600; }
.flight-scroll-cue>span:first-child { display:grid; place-items:center; width:32px; height:32px; border:1px solid var(--line); border-radius:50%; }
.flight-scroll-cue:hover { color:var(--ink); }
.flight-scroll-cue:focus-visible,.sheep-guide a:focus-visible,.sheep-guide button:focus-visible { outline:2px solid var(--yellow); outline-offset:5px; }
[data-guide],#como-funciona { scroll-margin-top:32px; }

.sheep-guide { --guide-tilt:0deg; position:fixed; z-index:30; right:max(22px,env(safe-area-inset-right)); bottom:max(18px,env(safe-area-inset-bottom)); display:flex; align-items:flex-end; gap:2px; max-width:calc(100vw - 28px); pointer-events:none; }
.sheep-guide[hidden],.sheep-guide [hidden] { display:none; }
.sheep-guide-bubble { position:relative; width:242px; margin-bottom:22px; padding:18px 20px 16px; border:1px solid var(--line); border-radius:23px 23px 6px 23px; background:var(--raised); color:var(--ink); box-shadow:0 14px 44px #0000001c; pointer-events:auto; }
.sheep-guide-title { margin:0 0 6px; font-size:1rem; font-weight:800; letter-spacing:-.025em; }
.sheep-guide-text { margin:0 0 12px; color:var(--soft); font-size:.875rem; line-height:1.45; }
.sheep-guide-next { display:flex; justify-content:space-between; align-items:center; gap:14px; min-height:30px; font-size:.875rem; font-weight:750; }
.sheep-guide-next:hover { text-decoration:underline; text-underline-offset:4px; }
.sheep-guide-next>span:last-child { color:var(--soft); font-size:1.15rem; }
.sheep-guide-progress { height:3px; margin-top:12px; border-radius:3px; overflow:hidden; background:var(--line); }
.sheep-guide-progress>span { display:block; width:100%; height:100%; background:var(--yellow); transform-origin:left; transform:scaleX(.14); transition:transform .35s ease; }
.sheep-guide-mascot { position:relative; flex:none; width:104px; height:104px; padding:0; border:0; background:none; cursor:pointer; pointer-events:auto; -webkit-tap-highlight-color:transparent; }
.sheep-guide-mascot img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 8px 12px #0003); transform:rotate(var(--guide-tilt)); transition:transform .3s ease; }
.sheep-guide-mascot:hover img { transform:rotate(-8deg) translateY(-4px); }
.sheep-guide-toggle { position:absolute; right:7px; bottom:2px; display:grid; place-items:center; width:24px; height:24px; border:1px solid var(--line); border-radius:50%; background:var(--raised); color:var(--ink); font-size:16px; }
.sheep-guide[data-mood="calm"] .sheep-guide-mascot img { transform:rotate(-5deg); }
.sheep-guide[data-mood="cheer"] .sheep-guide-mascot img { transform:rotate(7deg) translateY(-5px); }

@media (min-width:981px) and (max-height:740px) {
  .motion-ready .hero { min-height:580px; padding-block:25px 65px; }
  .motion-ready .hero h1 { font-size:clamp(3rem,4.65vw,4rem); }
  .motion-ready .hero-lede { font-size:1.05rem; }
}
@media (max-width:980px) {
  .motion-ready .hero-journey { height:auto; min-height:0; overflow:clip; }
  .motion-ready .hero { position:relative; height:auto; min-height:0; padding-block:54px 78px; }
  .motion-ready .hero h1 { font-size:clamp(3rem,7vw,5rem); }
  .motion-ready .hero-latest-scene { height:auto; padding-block:12px 30px; }
  .motion-ready .hero-latest-shot { width:min(82%,430px); }
  .motion-ready .hero-latest-shot img { max-height:none; }
  .flight-scroll-cue { bottom:-30px; }
}
@media (max-width:680px) {
  .motion-ready .hero { gap:24px; padding-block:42px 76px; }
  .motion-ready .hero h1 { font-size:clamp(2.7rem,11.8vw,4.5rem); }
  .motion-ready .hero-latest-shot { width:min(86%,350px); }
  .sheep-guide { right:10px; bottom:max(10px,env(safe-area-inset-bottom)); gap:0; }
  .sheep-guide-bubble { width:224px; margin-bottom:6px; padding:13px 16px 11px; border-radius:19px 19px 5px 19px; }
  .sheep-guide-title { font-size:.9375rem; margin-bottom:4px; }
  .sheep-guide-text { display:none; }
  .sheep-guide-next { font-size:.875rem; min-height:30px; }
  .sheep-guide-progress { margin-top:6px; }
  .sheep-guide-mascot { width:76px; height:82px; }
  .sheep-guide-toggle { right:3px; bottom:0; }
}
@media (prefers-reduced-motion:reduce) {
  .motion-ready .hero-journey { height:auto; min-height:0; }
  .motion-ready .hero { position:relative; height:auto; min-height:0; padding-block:56px 80px; }
  .sheep-guide *, .sheep-guide *::after { transition:none!important; transform:none!important; }
}