/* A coastal route, physical paper and separate landscape planes, all on native scroll. */
.life-layer{translate:var(--life-x,0px) var(--life-y,0px);rotate:var(--life-turn,0deg)}
[data-coastal-motion]{position:relative}
.travel{row-gap:30px;overflow:clip}
.coastal-route{grid-column:1/-1;margin-top:25px;border-top:1px solid #284d6533;padding-top:26px}
.route-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
.route-heading>span{font-size:10px;opacity:.8}
.route-scene{height:320px;position:relative;margin-top:22px;isolation:isolate}
.route-water{position:absolute;inset:75px -2% 0;width:104%;height:230px;opacity:.2;z-index:-1}
.route-water path,.note-tide path{fill:none;stroke:currentColor;stroke-width:.8}
.route-line{position:absolute;top:50px;left:0;width:100%;height:230px;overflow:visible}
.route-line path{fill:none;stroke:var(--ink);stroke-width:1.3}
.route-guide{opacity:.15;stroke-dasharray:3 6}
.route-line .route-draw{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--life-reveal,0));opacity:.8}
.route-line circle{fill:var(--paper);stroke:var(--ink);stroke-width:1.5}
.route-stop{position:absolute;top:16px;width:25%;max-width:250px;background:#f8f5ed;padding:9px 9px 15px;box-shadow:0 2px 2px #284d6508,0 13px 25px -15px #284d6566;transition:box-shadow .3s,transform .4s;transform:rotate(var(--base-turn,0deg))}
.route-stop:after,.calendar-card:after,.packing-paper:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.09'/%3E%3C/svg%3E");opacity:.45;mix-blend-mode:multiply}
.route-stop:hover,.route-stop:focus-visible{transform:rotate(0) translateY(-8px);box-shadow:0 18px 35px -16px #284d6566;z-index:3}
.route-stop img{width:100%;height:100px;object-fit:cover}
.route-stop span{display:block;padding:10px 7px 0}
.route-stop small{display:block;font-size:6.5px;letter-spacing:.13em}
.route-stop strong{font:27px/1.2 'Caveat',cursive;display:block;margin-top:3px}
.route-stop-one{left:0;--base-turn:-5deg;top:42px}
.route-stop-two{left:38%;--base-turn:3deg;top:0}
.route-stop-three{right:0;--base-turn:-2deg;top:27px}
.route-footnote{text-align:center;font:26px/1.3 'Caveat',cursive;opacity:.85}
.weekend-kit{gap:7vw;align-items:center;overflow:clip;padding-block:100px}
.kit-intro>p:not(.eyebrow){max-width:390px}
.calendar-fan{height:235px;margin:24px 0 0;max-width:450px;perspective:900px}
.calendar-card{position:absolute;top:19px;width:40%;height:185px;padding:17px 12px 15px;display:flex;flex-direction:column;align-items:center;background:#eeeae0;box-shadow:1px 2px 2px #284d6512,0 15px 25px -15px #284d6550;transform:rotate(var(--base-turn,0deg));transform-origin:50% 95%}
.calendar-card>span{font-size:7px;letter-spacing:.16em;border-bottom:1px solid var(--line);padding-bottom:9px;width:100%;text-align:center}
.calendar-card>strong{font:74px/.95 var(--serif);letter-spacing:-.06em;margin:9px 0 4px}
.calendar-card>em{font:20px/1.1 'Caveat',cursive;white-space:nowrap}
.calendar-card>small{font-size:6px;letter-spacing:.16em;margin-top:13px}
.calendar-friday{left:3%;--base-turn:-10deg}
.calendar-saturday{left:30%;z-index:2;background:#faf8f1;top:5px}
.calendar-saturday:before{content:"";position:absolute;top:39px;width:92px;height:92px;border:1px solid #7494a5;border-radius:50%;transform:rotate(-13deg)}
.calendar-sunday{right:3%;--base-turn:10deg;background:#dbe6e8}
.packing-paper{padding:30px 30px 20px;background:#faf8f1;box-shadow:1px 2px 2px #284d6512,0 17px 35px -24px #284d6548;border:1px solid #284d6510;transform:rotate(1.3deg);max-width:510px;width:100%;justify-self:end}
.packing-top{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:24px;font-size:7px;letter-spacing:.13em}
.packing-top .packing-count{letter-spacing:.04em;font-size:9px;white-space:nowrap}
.packing-list{padding-top:20px}
.packing-list legend{font:italic 31px/1.2 var(--serif);letter-spacing:-.02em;float:left;width:100%;margin-bottom:10px}
.packing-list label{clear:both;font-size:12px;padding:17px 0}
.packing-list input{appearance:none;width:18px;height:18px;border:1px solid #6a899a;background:transparent;flex-shrink:0;cursor:pointer;border-radius:0;position:relative;transition:background .2s,transform .2s}
.packing-list input:checked{background:var(--ink);transform:rotate(-6deg)}
.packing-list input:checked:after{content:'✓';color:var(--paper);position:absolute;inset:-4px 0 0;text-align:center;font-size:16px}
.packing-bottom{height:100px;display:flex;align-items:center;gap:14px;padding-top:10px;position:relative}
.packing-bottom>svg{width:34px;height:34px;flex-shrink:0;transform:rotate(-90deg)}
.packing-bottom circle{fill:none;stroke:#284d6520;stroke-width:1.3}
.packing-bottom .packing-ring{stroke:var(--ink);stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--packing-complete,0));transition:stroke-dashoffset .5s ease}
.packing-bottom>span{font:22px/1.1 'Caveat',cursive;max-width:200px;padding-right:35px}
.packing-shell{position:absolute;right:-8px;bottom:-15px;width:90px;height:90px;object-fit:contain;transform:rotate(20deg);opacity:.75;pointer-events:none}
.gift-note{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center;text-align:left;min-height:650px;overflow:clip;background:#e7eeeb;border:0}
.gift-copy{position:relative;z-index:1}
.gift-copy h2{margin:24px 0;font-size:clamp(48px,5.1vw,78px)}
.gift-copy>p:not(.eyebrow){font-size:14px;line-height:1.95;max-width:440px}
.gift-stationery{height:490px;position:relative;perspective:1000px}
.note-object{position:absolute;width:85%;height:100%;left:3%;top:8px;transform:rotate(-6deg);filter:drop-shadow(0 18px 13px #284d6514)}
.note-object>img{width:100%;height:100%;object-fit:contain}
.note-handwriting{position:absolute;top:22%;left:25%;width:49%;font:clamp(22px,2.4vw,36px)/1.05 'Caveat',cursive;text-align:center;transform:rotate(2deg)}
.note-tide{position:absolute;inset:35px -14% 0 -24%;opacity:.3;pointer-events:none}
.note-tide svg{width:100%;height:100%}
.note-shell{position:absolute;width:125px;height:125px;object-fit:contain;right:-6%;bottom:2%;transform:rotate(16deg);opacity:.8}
.gift-copy #wish-preview{margin:30px 0 0;background:#f7f4eb;max-width:440px}
.questions{position:relative;overflow:clip;background:#f7f4eb;align-items:start}
.question-art{position:relative;height:220px;max-width:350px;margin:10px 0 22px}
.question-shell{position:absolute;width:190px;height:190px;object-fit:contain;left:18%;top:0;transform:rotate(12deg)}
.question-orbit{position:absolute;border:1px solid #284d651c;width:180px;height:180px;border-radius:50%;left:8%;top:15px}
.question-script{position:absolute;bottom:8px;right:0;font:28px 'Caveat',cursive;transform:rotate(-4deg)}
.questions .question-intro>p:last-child{max-width:310px;font-size:14px}
.questions .travel-list{padding-top:25px;position:relative;z-index:1}
.travel-list details[open]>p,.travel-list details[open]>a{animation:answer-in .4s ease both}
@keyframes answer-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
.reply{isolation:isolate;overflow:clip;min-height:700px;padding-block:100px 75px;background:#e7ede9}
.reply-landscape{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.reply-ocean{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%;opacity:.75}
.reply-dune{position:absolute;inset:6% -5% -10%;width:110%;height:110%;object-fit:cover;object-position:50% 60%}
.reply-oats{position:absolute;bottom:-90px;height:83%;width:27%;object-fit:contain;object-position:bottom;opacity:.94}
.reply-oats-left{left:-3%;transform:rotate(-6deg)}
.reply-oats-right{right:-5%;transform:scaleX(-1) rotate(-5deg);height:72%}
.reply-paper{position:relative;max-width:640px;width:76%;margin:0 auto;padding:45px 20px 35px;background:#f7f4ebf5;box-shadow:0 1px 2px #284d6512,0 18px 40px -25px #284d6530;border:1px solid #fff8}
.reply .reply-paper h2{font-size:clamp(55px,6vw,88px);margin:24px 0}
.reply-paper>p:not(.eyebrow){font-size:13px}
.reply-paper .replay{display:block;margin:20px auto 0}
.reply>p.reply-signoff{position:relative;display:table;max-width:90%;padding:1px 14px 4px;font:30px 'Caveat',cursive;margin:28px auto 0;z-index:1;background:#f7f4ebed;transform:rotate(-2deg)}
@media(min-width:1500px){.route-stop{max-width:300px}.route-stop img{height:125px}.route-scene{height:350px}.calendar-fan{max-width:500px}.calendar-card{height:200px}.note-object{max-width:480px}}
@media(max-width:800px){
 .travel{gap:35px}.coastal-route{margin-top:0;padding-top:22px}.route-heading{display:block}.route-heading>span{display:block;font-size:9px;margin-top:10px}.route-scene{height:280px;margin-top:22px}.route-stop{width:29%;padding:6px 6px 11px}.route-stop img{height:85px}.route-stop span{padding:9px 1px 0}.route-stop strong{font-size:22px}.route-stop small{font-size:5.5px;letter-spacing:.06em}.route-stop-two{left:35%}.route-stop-one{top:35px}.route-stop-three{top:35px}.route-line{top:25px}.route-footnote{font-size:23px}
 .weekend-kit{padding-block:70px;gap:35px}.kit-intro>p:not(.eyebrow){max-width:450px}.calendar-fan{max-width:420px;margin:20px auto 5px;height:220px}.calendar-card{height:180px}.packing-paper{justify-self:center;max-width:550px;padding:25px 24px 15px;transform:rotate(.6deg)}.packing-list label{font-size:12px}.packing-bottom{height:88px}
 .gift-note{grid-template-columns:1fr;gap:15px;padding-top:45px;padding-bottom:65px;min-height:0}.gift-stationery{height:360px;max-width:450px;width:100%;margin:auto}.note-object{width:88%;left:0;top:5px}.note-handwriting{font-size:29px}.note-shell{width:95px;height:95px;right:-3%;bottom:1%}.gift-copy{max-width:550px;margin:auto;width:100%}.gift-copy h2{font-size:53px}.gift-copy>p:not(.eyebrow){font-size:13px;max-width:100%}.note-tide{inset:10px -10% 0 -15%}
 .questions{gap:30px}.question-intro{position:relative;min-height:220px;padding-right:120px}.question-intro h2{font-size:50px;margin:22px 0}.questions .question-intro>p:last-child{font-size:12px;max-width:280px}.question-art{position:absolute;right:-18px;top:18px;width:130px;height:180px;margin:0}.question-shell{width:120px;height:120px;left:0;top:0}.question-orbit{width:110px;height:110px;left:0;top:13px}.question-script{font-size:22px;right:3px;bottom:0;max-width:100px;line-height:1.1}.questions .travel-list{padding-top:0}
 .reply{min-height:650px;padding-block:85px 70px}.reply-paper{width:92%;padding:35px 15px 30px}.reply .reply-paper h2{font-size:59px}.reply-paper .eyebrow{font-size:7px}.reply-paper>p:not(.eyebrow){font-size:12px}.reply-oats{width:43%;height:58%;bottom:-65px}.reply-oats-left{left:-17%}.reply-oats-right{right:-23%;height:50%}.reply-dune{width:160%;left:-30%;object-position:center bottom}.reply>p.reply-signoff{font-size:27px;margin-top:35px}
}
@media(max-width:480px){.route-scene{height:245px}.route-stop{width:31%}.route-stop img{height:70px}.route-stop strong{font-size:18px;line-height:1.1}.route-stop small{font-size:5px;line-height:1.5;min-height:16px;letter-spacing:0}.route-stop-two{left:34.5%;top:0}.route-stop-three{top:38px}.route-water{inset:45px -15% 0;width:130%;height:190px}.route-line{height:190px}.route-footnote{font-size:22px;max-width:270px;margin:auto}.calendar-fan{height:220px}.calendar-card{width:43%;padding:15px 7px;height:172px}.calendar-friday{left:0}.calendar-saturday{left:28.5%}.calendar-sunday{right:0}.calendar-card>strong{font-size:68px}.calendar-card>em{font-size:17px}.calendar-saturday:before{width:83px;height:83px;top:38px}.packing-top{font-size:6px;letter-spacing:.1em}.packing-top .packing-count{font-size:8px}.packing-bottom>span{font-size:20px}.gift-stationery{height:330px}.note-handwriting{font-size:26px}.gift-copy h2{font-size:49px}.question-intro{padding-right:100px}.question-art{right:-12px;width:110px}.question-shell{width:110px;height:110px}.question-orbit{width:100px;height:100px}.question-script{font-size:21px}.question-intro h2{font-size:47px}.questions .question-intro>p:last-child{font-size:12px}.reply .reply-paper h2{font-size:52px}.reply-paper{width:100%}}
@media(prefers-reduced-motion:reduce){.life-layer{translate:none!important;rotate:none!important}.route-line .route-draw{stroke-dashoffset:0}.route-stop,.packing-ring{transition:none!important}.travel-list details[open]>p,.travel-list details[open]>a{animation:none}.route-stop:hover,.route-stop:focus-visible{transform:rotate(var(--base-turn,0deg))}}