.day-story-section{position:relative;isolation:isolate;overflow:hidden;background:#fff;color:#33403a;padding:clamp(120px,10vw,160px) 0 130px}
.day-story-section *{box-sizing:border-box}
.day-story-section__header{position:relative;z-index:1;text-align:center;margin:0 auto 24px;width:calc(100% - 48px);max-width:900px}
.day-story-section__label{display:table;margin:0 auto;padding:6px 34px;border-radius:99px;background:#e5f2e2;color:#43876e;font:500 14px/1.5 YBConceptLabel,sans-serif;letter-spacing:.075em}
.day-story-section h2{display:table;position:relative;isolation:isolate;margin:24px auto 18px;font:500 clamp(40px,4.5vw,68px)/1.5 YorisoiHeadline,serif;letter-spacing:.02em;color:#1f3431}
.day-story-section h2::after{content:"";position:absolute;z-index:-1;left:-3%;right:-3%;bottom:9%;height:17%;border-radius:45% 60% 40% 60%;background:#f5f0df}
.day-story-section__lead{font:17px/1.9 YorisoiBody,sans-serif;margin:0}
.day-story-timeline{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 50px;width:calc(100% - 100px);max-width:1400px;margin:auto}
.day-story-step{--day-accent:#eea18c;--day-tint:#fff0e9;display:grid;grid-template-columns:38% 62%;align-items:center;min-width:0;position:relative}
.day-story-step--pickup,.day-story-step--dinner{grid-template-columns:62% 38%;translate:0 35px}
.day-story-step--pickup .day-story-step__image,.day-story-step--dinner .day-story-step__image{grid-column:1;grid-row:1}
.day-story-step--pickup .day-story-step__copy,.day-story-step--dinner .day-story-step__copy{grid-column:2;grid-row:1;padding-left:12px}
.day-story-step--pickup{--day-accent:#98c493;--day-tint:#edf6e8}.day-story-step--home{--day-accent:#99bee7;--day-tint:#eaf4ff}.day-story-step--dinner{--day-accent:#e3c16d;--day-tint:#fcf4df}.day-story-step--night{--day-accent:#abb1e9;--day-tint:#f0eefe}
.day-story-step__copy{position:relative;z-index:1;padding:12px 6px}
.day-story-step h3{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-weight:400;white-space:nowrap}
.day-story-step__icon{width:54px;height:54px;flex-shrink:0;border-radius:50%;background:var(--day-accent);display:grid;place-items:center}
.day-story-step__icon svg{width:34px;height:34px;fill:none;stroke:white;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.day-story-step__time{border-radius:99px;padding:4px 16px;background:var(--day-tint);font:24px/1.4 YorisoiHeadline,serif}
.day-story-step__copy>p{font:17px/1.8 YorisoiBody,sans-serif;margin:0 0 0 20px}
.day-story-step__copy>p.day-story-step__note{font:15px/1.7 YorisoiHandFull,cursive;transform:rotate(-6deg);margin:18px 0 0 40px;color:#77717a}
.day-story-step__image{width:100%;aspect-ratio:1.72;background-image:url('assets/day-story-artwork.webp');background-repeat:no-repeat;background-size:418% 409.13%;background-position:29.09% 26.72%;border-radius:39% 45% 32% 29% / 49% 43% 39% 36%}
.day-story-step--pickup .day-story-step__image{background-position:66.04% 32.35%;border-radius:44% 35% 32% 37%}
.day-story-step--home .day-story-step__image{background-position:30.66% 57.67%;border-radius:36% 43% 31% 27%}
.day-story-step--dinner .day-story-step__image{background-position:69.18% 63.29%;border-radius:42% 30% 38% 27%}
.day-story-step--night .day-story-step__image{background-position:33.02% 88.61%;border-radius:39% 46% 29% 35%}
.day-story-timeline__path{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible;pointer-events:none}
.day-story-timeline__path path{fill:none;stroke:#79b67c;stroke-width:1.7;stroke-dasharray:6 6;stroke-linecap:round;vector-effect:non-scaling-stroke}.day-story-timeline__path circle{fill:#accd99}
.day-story-section__closing{text-align:center;align-self:center;padding-top:30px;font:22px/1.9 YorisoiBody,sans-serif}.day-story-section__closing p{margin:0 0 20px}
.day-story-section__note{position:absolute;z-index:1;font:16px/1.8 YorisoiHandFull,cursive;color:#756f77;letter-spacing:.08em;transform:rotate(-9deg);margin:0}.day-story-section__note--left{top:160px;left:5%}.day-story-section__note--right{top:160px;right:5%}.day-story-section__note--bottom{bottom:95px;right:3%;font-size:14px}
.day-story-section__decoration{position:absolute;top:130px;width:370px;height:280px;z-index:0;pointer-events:none;background:url('assets/day-story-artwork.webp') 0 0/1672px 941px no-repeat;mask-image:linear-gradient(transparent,#000 15%,#000 85%,transparent)}.day-story-section__decoration--left{left:0}.day-story-section__decoration--right{right:0;background-position:right top}
.day-story-section__landscape{position:absolute;bottom:0;left:0;width:100%;height:120px;background:url('assets/day-story-artwork.webp') center bottom/100% auto no-repeat;mask-image:linear-gradient(transparent,#000 45%);z-index:0;pointer-events:none}
@media(max-width:1300px){.day-story-section__note,.day-story-section__decoration{display:none}.day-story-timeline{width:calc(100% - 64px);gap:24px 36px}.day-story-step{grid-template-columns:1fr}.day-story-step--pickup,.day-story-step--dinner{grid-template-columns:1fr;translate:0 55px}.day-story-step .day-story-step__image{grid-column:1;grid-row:2}.day-story-step .day-story-step__copy{grid-column:1;grid-row:1;padding:12px 0}.day-story-step__copy>p{margin-left:0}.day-story-step__copy>p.day-story-step__note{display:none}.day-story-section__closing{font-size:20px}.day-story-timeline__path{width:18%;left:41%}}
@media(max-width:600px){.day-story-section{padding:80px 0 95px}.day-story-section__label{font-size:12px;padding:6px 25px}.day-story-section h2{font-size:clamp(28px,7.5vw,40px);margin-top:24px}.day-story-section__lead{font-size:15px}.day-story-section__lead br{display:none}.day-story-timeline{display:flex;flex-direction:column;width:calc(100% - 48px);gap:32px;margin-top:30px;padding-left:20px}.day-story-timeline::before{content:"";position:absolute;left:0;top:20px;bottom:245px;border-left:1.5px dashed #9cc594}.day-story-timeline__path{display:none}.day-story-step{translate:none}.day-story-step::before{content:"";position:absolute;left:-24px;top:34px;width:9px;height:9px;border-radius:50%;background:var(--day-accent)}.day-story-step__icon{width:45px;height:45px}.day-story-step__time{font-size:22px}.day-story-step__copy>p{font-size:16px}.day-story-section__closing{font-size:18px;padding-top:8px;margin-left:-20px}.day-story-section__landscape{height:80px;background-size:auto 450px}}
@media(prefers-reduced-motion:no-preference){.day-story-motion{opacity:0;transform:translateY(16px);transition:opacity .85s ease,transform .85s ease}.day-story-motion.is-visible{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.day-story-motion{opacity:1;transform:none;transition:none}}
/* Source photo regions preserve each complete organic silhouette. */
.day-story-step--morning .day-story-step__image{aspect-ratio:381/211;background-size:438.845% 445.972%;background-position:28.970% 27.397%}
.day-story-step--pickup .day-story-step__image{aspect-ratio:401/220;background-size:416.958% 427.727%;background-position:66.326% 32.455%}
.day-story-step--home .day-story-step__image{aspect-ratio:390/221;background-size:428.718% 425.792%;background-position:31.747% 57.917%}
.day-story-step--dinner .day-story-step__image{aspect-ratio:407/217;background-size:410.811% 433.641%;background-position:70.356% 63.950%}
.day-story-step--night .day-story-step__image{aspect-ratio:419/209;background-size:399.045% 450.239%;background-position:33.200% 87.842%}
.day-story-section__decoration--left{width:460px;height:310px}
.day-story-section__decoration--right{width:520px;height:290px}
.day-story-section__landscape{height:clamp(55px,5.1vw,90px)}
@media(max-width:600px){.day-story-section__landscape{height:42px;background-size:auto 450px}}
.day-story-section__decoration--left{clip-path:polygon(0 0,100% 0,100% 35%,75% 35%,75% 100%,0 100%)}
.day-story-section__decoration--right{clip-path:polygon(0 0,100% 0,100% 100%,25% 100%,25% 65%,0 65%)}
.day-story-section__landscape{height:min(4.8vw,80px)}
@media(max-width:600px){.day-story-section__landscape{height:40px}}
/* Match the reference dialogue and its light handwritten underline. */
.day-story-step__copy>p.day-story-step__note{font-size:15px;line-height:1.65;letter-spacing:.04em;color:#706b76}
.day-story-step__note::after{content:"";display:block;width:100%;max-width:200px;height:18px;margin-top:3px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 24' fill='none'%3E%3Cpath d='M2 16C50 29 133 0 218 8' stroke='%2379B67C' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat}
@media(min-width:1301px){.day-story-step--morning .day-story-step__note{position:absolute;left:85%;top:-128px;width:220px;margin:0;text-align:center}.day-story-step--morning .day-story-step__note::after{display:none}.day-story-step--night .day-story-step__note{margin-left:20px}}


/* Keep the connecting thread inside the gap, independent of photo height. */
.day-story-timeline__path{left:0;width:100%;height:100%}

.day-story-timeline__leaf{position:absolute;width:57px;height:64px;background:url('assets/day-story-artwork.webp') -775px -316px/1672px 941px no-repeat;pointer-events:none;z-index:0;mix-blend-mode:multiply}
.day-story-timeline__leaf--2{width:43px;height:47px;background-position:-833px -568px}
@media(max-width:1300px){.day-story-timeline__leaf{display:none}}

/* Render above the white image margins so the thread stays continuous. */
.day-story-timeline__path{z-index:2}
.day-story-timeline__leaf{z-index:3}
/* The leaf sprite has a white paper background: keep it opaque over the thread. */
.day-story-timeline__leaf{mix-blend-mode:normal;background-color:#fff;border-radius:45%;box-shadow:0 0 0 3px #fff}
/* Foliage occupies the open row gap; no white cover or overlap with photos. */
.day-story-timeline__leaf{width:34.2px;height:38.4px;background-size:1003.2px 564.6px;background-position:-465px -189.6px;background-color:transparent;border-radius:0;box-shadow:none;mix-blend-mode:multiply}
.day-story-timeline__leaf--2{width:25.8px;height:28.2px;background-position:-499.8px -340.8px}
/* Fade each scene as one unit; keep photo geometry stable for the connecting path. */
@media(prefers-reduced-motion:no-preference){
  .day-story-sequenced .day-story-motion{transform:none;opacity:0;transition:opacity .95s ease;transition-delay:var(--day-arrival-delay,0ms)}
  .day-story-sequenced .day-story-motion.is-visible{opacity:1;transform:none}
  .day-story-sequenced .day-story-timeline__path{clip-path:inset(0 0 var(--day-thread-hidden,100%) 0);transition:clip-path 1.2s cubic-bezier(.22,.61,.36,1) .3s}
  .day-story-sequenced .day-story-timeline__leaf{opacity:0;transition:opacity .8s ease .6s}
  .day-story-leaf-one .day-story-timeline__leaf--1,.day-story-leaf-two .day-story-timeline__leaf--2{opacity:1}
}