/* A native-scroll, pinned day story. No wheel interception or scroll locking. */
.day{--day-glow:#3e7775;--day-accent:#e3cfa5;--day-nav:72px;position:relative;padding:0;background:var(--night);isolation:isolate;scroll-margin-top:var(--day-nav)}
.day.is-ready{height:650svh}
.day-sticky{position:sticky;top:var(--day-nav);height:calc(100svh - var(--day-nav));min-height:600px;display:flex;align-items:center;overflow:hidden}
.day-sticky::before{content:"";position:absolute;inset:0;z-index:-1;background-color:var(--day-glow);mask-image:radial-gradient(ellipse at 50% 48%,#000 0%,transparent 70%);opacity:.22;transition:background-color 1s}
.day-shell{width:min(100% - var(--pad)*2,1120px);margin:0 auto;padding:24px 0}
.day-header{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:23px}
.day-header .label{font-size:.6rem;letter-spacing:.24em;color:var(--day-accent)}
.day-header h2{font-size:clamp(1.25rem,2.7vw,2.2rem);letter-spacing:.025em;text-transform:none;margin:.4rem 0 0;font-weight:300}
.day-header h2 span{font-weight:500}
.day-skip{font-size:.66rem;letter-spacing:.08em;text-decoration:none;white-space:nowrap;color:#bac5c1;padding:10px 0}
.day-skip span{margin-left:15px;color:var(--day-accent)}
.day-skip:hover{color:white}
.day-card{position:relative;width:min(100%,680px);height:clamp(340px,57svh,620px);margin-inline:auto;overflow:visible;border:0;border-radius:0;background:transparent;color:#fff;isolation:isolate}
.day-images,.day-image,.day-shade{position:absolute;inset:0;width:100%;height:100%}
.day-images{isolation:isolate;perspective:1400px;pointer-events:none}
.day-image{inset:50% auto auto 50%;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;opacity:0;visibility:hidden;z-index:0;transform:translate(85%,-50%) scale(.76) rotate(5deg);filter:blur(8px) brightness(.5);transition:transform .85s cubic-bezier(.22,.7,.18,1),filter .75s ease,opacity .65s ease,visibility 0s .85s;clip-path:inset(.6% 3% 3% round 6px)}
/* Trim the printed corner treatment while keeping the original captions intact. */
.day-image[data-moment="03-wellness"]{clip-path:inset(.6% 5.5% 1.2% round 6px)}
.day-image[data-moment="05-lunch"]{clip-path:inset(.6% 2.5% 4% round 6px)}
.day-image.is-active,.day-image.is-previous,.day-image.is-next{visibility:visible;transition-delay:0s}
.day-image.is-before{transform:translate(-185%,-50%) scale(.76) rotate(-5deg)}
.day-image.is-previous{z-index:1;opacity:.48;transform:translate(-118%,-50%) scale(.86) rotate(-3deg);filter:blur(3px) brightness(.65) saturate(.8)}
.day-image.is-next{z-index:1;opacity:.48;transform:translate(18%,-50%) scale(.86) rotate(3deg);filter:blur(3px) brightness(.65) saturate(.8)}
.day-image.is-active{z-index:2;opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0);filter:blur(0) brightness(1) saturate(1)}
.day-image[data-moment="night"]{object-position:center 78%}
.day-image[data-moment="sunset"]{object-position:center 65%}
.day-shade{background:linear-gradient(180deg,#04171565,transparent 43%),linear-gradient(0deg,#031010e8 0%,#03101088 30%,transparent 70%),linear-gradient(90deg,#03101042,transparent 75%);pointer-events:none}
.day-shade,.day-topline,.day-caption,.day-card-foot{display:none!important}
.day-topline{position:absolute;top:30px;left:36px;right:30px;display:flex;align-items:center;gap:28px}
.day-time{display:flex;align-items:baseline;gap:10px;white-space:nowrap;font-variant-numeric:tabular-nums}
#day-hour{font-size:clamp(2.4rem,5vw,4.4rem);line-height:1;letter-spacing:-.06em;font-weight:200}
#day-period{font-size:.72rem;letter-spacing:.14em}
.day-location{font-size:.58rem;line-height:1.8;letter-spacing:.1em;text-transform:uppercase;text-shadow:0 1px 8px #0008}
.day-location span{opacity:.7;font-size:.51rem;letter-spacing:.03em;text-transform:none}
.day-clock{margin-left:auto;width:75px;height:75px;flex:none;filter:drop-shadow(0 2px 5px #0004)}
.day-clock-face{fill:#061a1b20;stroke:#ffffff55;stroke-width:1}
.day-clock-ticks{stroke:#ffffffa0;stroke-width:1}
#day-clock-hour,#day-clock-minute{stroke:currentColor;stroke-width:1.6;stroke-linecap:round;transform-origin:50px 50px;transition:transform 1s cubic-bezier(.2,.65,.3,1)}
.day-caption{position:absolute;left:36px;bottom:68px;right:36px;max-width:650px}
.day-caption.is-entering{animation:day-caption-in .65s both}
@keyframes day-caption-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.day-eyebrow{display:flex;align-items:center;gap:9px;font-size:.59rem;letter-spacing:.2em;text-transform:uppercase;color:#f0d9b1;margin:0 0 10px}
.day-sun{font-size:1.1rem;line-height:1}
.day-caption h3{font-size:clamp(2rem,4.1vw,3.8rem);line-height:1.04;letter-spacing:-.045em;font-weight:300;text-wrap:balance}
.day-caption>p:last-of-type{max-width:400px;font-size:.77rem;line-height:1.75;color:#e1e7e3;margin:15px 0 0;text-shadow:0 1px 4px #0004}
.day-book{display:inline-flex;align-items:center;gap:25px;border-bottom:1px solid #ffffff80;padding:8px 0 5px;margin-top:10px;font-size:.73rem;text-decoration:none}
.day-book[hidden]{display:none}
.day-card-foot{position:absolute;bottom:21px;left:36px;right:36px;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:.52rem;letter-spacing:.09em;color:#d6dfdb}
.day-moment{display:flex;align-items:center;gap:12px}
#day-number{font-size:.65rem;font-variant-numeric:tabular-nums;color:#fff}
.day-moment-line{display:inline-block;width:28px;height:1px;background:#ffffff60}
.day-card-note{font-style:italic;opacity:.75}
.day-timeline{display:none}
.day-stop{font:inherit;color:#9aa9a7;background:none;border:0;text-align:left;padding:12px 0 8px;position:relative;cursor:pointer;min-height:54px}
.day-stop[aria-current="step"]{color:var(--day-accent)}
.day-stop-time{display:block;font-size:.64rem;white-space:nowrap;letter-spacing:.01em}
.day-stop-label{display:block;font-size:.51rem;margin-top:3px;opacity:.75}
.day-stop:hover{color:var(--day-accent)}
.day-bottom{display:flex;align-items:center;justify-content:center;margin-top:18px}
.day-bottom>p{font-size:.6rem;color:#a9b8b2;letter-spacing:.07em;margin:0;white-space:nowrap}
.day-bottom>p>span{display:inline-block;margin-right:9px;color:var(--day-accent)}
.day-progress{display:none}
#day-scrub{display:block;width:100%;height:24px;margin:0;cursor:pointer;appearance:none;-webkit-appearance:none;background:transparent;accent-color:var(--day-accent)}
#day-scrub::-webkit-slider-runnable-track{height:2px;background:#ffffff32;border-radius:2px}
#day-scrub::-moz-range-track{height:2px;background:#ffffff32;border-radius:2px}
#day-scrub::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:9px;height:9px;margin-top:-3.5px;border-radius:50%;border:0;background:var(--day-accent);box-shadow:0 0 10px #e3cfa522}
#day-scrub::-moz-range-thumb{width:9px;height:9px;border-radius:50%;border:0;background:var(--day-accent)}
.day-arrows{display:flex;align-items:center;gap:16px}
.day-arrows button{width:44px;height:44px;border:1px solid #ffffff30;border-radius:50%;background:none;color:#fff;font-size:1.1rem;cursor:pointer;transition:background .2s,transform .2s,border-color .2s}
.day-arrows button:hover:not(:disabled){background:#e3cfa51a;border-color:var(--day-accent);transform:translateY(-2px)}
.day-arrows button:active:not(:disabled){transform:scale(.94)}
.day-arrows button:disabled{opacity:.25;cursor:default}
.day-count{display:none}
.day :focus-visible{outline:2px solid var(--day-accent);outline-offset:4px}
.day-card:focus-visible{outline-offset:5px}
.day-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.day-fallback{font-size:.85rem;margin-top:20px}
body.day-in-view .wa{opacity:0;visibility:hidden;pointer-events:none}
#villa{scroll-margin-top:80px}
@media(min-width:761px) and (max-height:760px){
  .day-sticky{min-height:490px}
  .day-shell{padding:12px 0}
  .day-header{margin-bottom:14px}
  .day-header h2{font-size:1.5rem}
  .day-card{height:calc(100svh - var(--day-nav) - 220px);min-height:270px}
  .day-caption h3{font-size:2.7rem}
  .day-topline{top:20px}
  #day-hour{font-size:3rem}
  .day-clock{width:60px;height:60px}
  .day-timeline{margin-top:13px}
  .day-bottom{margin-top:18px}
}
@media(max-width:760px){
  .day.is-ready{height:620svh}
  .day-sticky{min-height:560px}
  .day-shell{width:calc(100% - 36px);padding:16px 0}
  .day-header{gap:8px;margin-bottom:17px;align-items:center}
  .day-header .label{font-size:.47rem;letter-spacing:.13em}
  .day-header h2{font-size:1.3rem}
  .day-skip{font-size:.55rem;max-width:80px;white-space:normal;text-align:right}
  .day-skip span{margin-left:3px}
  .day-card{height:min(calc(100svh - var(--day-nav) - 217px),calc((100vw - 36px) * 1.12));min-height:335px;max-height:650px;border-radius:0}
  .day-image{max-width:calc(100% - 34px)}
  .day-image.is-previous{transform:translate(-103%,-50%) scale(.88) rotate(-3deg);filter:blur(2px) brightness(.65) saturate(.8)}
  .day-image.is-next{transform:translate(3%,-50%) scale(.88) rotate(3deg);filter:blur(2px) brightness(.65) saturate(.8)}
  .day-topline{top:22px;left:22px;right:18px;gap:12px}
  #day-hour{font-size:3.15rem}
  .day-location{display:none}
  .day-clock{width:61px;height:61px}
  .day-caption{left:22px;right:22px;bottom:65px}
  .day-caption h3{font-size:clamp(2rem,8vw,3.3rem)}
  .day-caption>p:last-of-type{font-size:.72rem;line-height:1.65;margin-top:13px;max-width:340px}
  .day-card-foot{left:22px;right:22px;bottom:22px}
  .day-card-note{display:none}
  .day-timeline{gap:4px;margin-top:15px}
  .day-stop{padding:10px 0 4px;text-align:center;min-height:44px}
  .day-stop-time{font-size:.47rem}
  .day-stop-time small{display:block;font-size:.42rem;opacity:.65;line-height:1.4}
  .day-stop-label{display:none}
  .day-bottom{margin-top:18px}
  .day-bottom>p{font-size:.52rem;letter-spacing:.02em}
  .day-bottom>p>span{margin-right:4px}
  .day-progress{max-width:95px;min-width:40px}
  .day-arrows{gap:16px}
  .day-arrows button{width:44px;height:44px}
  .day-count{display:none}
}
/* Short screens and reduced motion get the same story with direct controls. */
@media(prefers-reduced-motion:reduce),(max-height:620px){
  .day.is-ready{height:auto}
  .day-sticky{position:relative;top:auto;height:auto;min-height:0;padding:25px 0}
  .day-image{transition:none}
  .day-card{height:460px;min-height:0}
  .day-caption.is-entering{animation:none}
}

@media(prefers-reduced-motion:reduce){
  .day-arrows button,.day-sticky::before{transition:none}
}