@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,700;1,600&family=DM+Mono:wght@300;400;500&family=Permanent+Marker&display=swap');

:root { --paper:#e9e2d2; --ink:#181814; --red:#d64631; --blue:#315aa8; --acid:#d8e75a; --pink:#f0a9b4; --ease:cubic-bezier(.22,1,.36,1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Mono",monospace; overflow-x:hidden; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; z-index:99; background:repeating-linear-gradient(90deg,transparent 0 7px,rgba(20,20,15,.014) 8px 9px); mix-blend-mode:multiply; }
.noise { position:fixed; inset:-50%; z-index:98; pointer-events:none; opacity:.16; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E"); animation:grain .25s steps(2) infinite; }
@keyframes grain { 0%{transform:translate(0)} 25%{transform:translate(2%,-1%)} 50%{transform:translate(-1%,2%)} 75%{transform:translate(1%,1%)} }
a { color:inherit; }
button { font:inherit; }
.life-status { position:fixed; top:0; left:0; right:0; height:37px; z-index:70; display:flex; justify-content:center; align-items:center; gap:22px; padding:0 18px; background:var(--ink); color:var(--paper); border-bottom:1px solid #e9e2d244; box-shadow:0 3px 12px #0002; }
.status-item { display:flex; align-items:center; gap:9px; white-space:nowrap; }
.status-item b,.status-item small { font-size:7px; letter-spacing:.15em; font-weight:400; opacity:.68; }
.status-item strong { color:var(--acid); font-size:10px; letter-spacing:.08em; font-variant-numeric:tabular-nums; }
.status-australia strong { color:var(--pink); }
.status-dot { width:6px; height:6px; border-radius:50%; background:var(--red); animation:pulse-dot 1.8s ease-in-out infinite; }
.status-divider { color:var(--red); font-size:9px; }
@keyframes pulse-dot { 50%{opacity:.35;transform:scale(.7)} }
.topbar { position:fixed; top:37px; left:0; right:0; display:flex; justify-content:space-between; align-items:center; padding:18px 30px; z-index:50; mix-blend-mode:multiply; }
.topbar-actions { display:flex; align-items:center; gap:25px; }
.language-switcher { display:flex; align-items:center; gap:4px; padding:3px; border:1px solid var(--ink); background:var(--paper); box-shadow:3px 3px 0 var(--ink); transform:rotate(1deg); }
.language-switcher button { border:0; background:transparent; color:var(--ink); padding:5px 7px; font-size:9px; cursor:pointer; transition:background .2s,color .2s; }
.language-switcher button.active { background:var(--ink); color:var(--paper); }
.archive-mark { text-decoration:none; font-weight:500; font-size:15px; letter-spacing:.06em; }
.archive-mark span { display:block; font-size:8px; letter-spacing:.24em; margin-top:3px; }
.soundless-note { background:none; border:0; cursor:pointer; font-size:10px; text-transform:uppercase; border-bottom:1px solid; padding:4px 0; }
.hero { min-height:100svh; position:relative; padding:13vh 5vw 6vh; display:grid; grid-template-columns:.72fr 1.28fr; align-items:center; overflow:hidden; }
.hero-copy { z-index:4; }
.eyebrow,.chapter { font-size:10px; letter-spacing:.2em; font-weight:500; }
h1,h2,blockquote { font-family:"Cormorant Garamond",serif; }
h1 { font-size:clamp(73px,10.5vw,170px); font-weight:500; line-height:.7; letter-spacing:-.08em; margin:35px 0; position:relative; }
h1 span { display:block; }
h1 span:last-child { margin-left:.45em; }
h1 i { color:var(--red); font-size:.64em; position:absolute; left:.42em; top:.5em; transform:rotate(-12deg); font-weight:600; }
.intro { font-family:"Cormorant Garamond",serif; font-size:clamp(18px,2vw,27px); line-height:1.2; margin-left:7vw; }
.hero-collage { height:min(72vh,760px); position:relative; }
.paper { background:#f5efdF; box-shadow:3px 8px 25px rgba(35,29,18,.17); }
.origin-card { position:absolute; width:220px; height:140px; padding:30px 22px; z-index:3; transition:transform .7s var(--ease); }
.origin-card p,.origin-card small { font-size:8px; letter-spacing:.15em; }
.origin-card strong { font-family:"Cormorant Garamond",serif; display:block; font-size:27px; margin:7px 0; }
.origin-de { left:0; top:56%; transform:rotate(-7deg); }
.origin-nl { right:1%; top:10%; transform:rotate(7deg); background:#f2adbb; }
.pin { position:absolute; width:11px; height:11px; border-radius:50%; background:var(--red); top:12px; left:50%; box-shadow:2px 3px 4px #0005; }
.route { position:absolute; inset:10% 0 auto 2%; width:96%; height:70%; overflow:visible; }
.route-line { fill:none; stroke:var(--ink); stroke-width:2; stroke-dasharray:7 9; stroke-dashoffset:300; animation:route 3.2s var(--ease) forwards .5s; }
.route-line.second { stroke:var(--blue); animation-delay:.9s; }
@keyframes route { to{stroke-dashoffset:0} }
.route circle { fill:var(--red); animation:pulse 2s ease-in-out infinite; transform-origin:340px 168px; }
@keyframes pulse { 50%{transform:scale(1.6);opacity:.55} }
.route text { font:12px "DM Mono"; letter-spacing:.12em; }
.ticket { background:var(--acid); padding:15px 20px; border:2px solid var(--ink); box-shadow:5px 5px 0 var(--ink); display:flex; flex-direction:column; transform:rotate(-8deg); }
.ticket-hero { position:absolute; left:28%; top:8%; z-index:5; }
.ticket span,.ticket small { font-size:8px; letter-spacing:.15em; }
.ticket b { font-size:24px; margin:4px 0; }
.scribble { font-family:"Permanent Marker",cursive; color:var(--blue); transform:rotate(-12deg); }
.scribble-one { position:absolute; right:5%; bottom:18%; font-size:19px; }
.flower { position:absolute; right:28%; top:30%; font-size:80px; color:var(--red); animation:spin 18s linear infinite; }
@keyframes spin { to{transform:rotate(360deg)} }
.scroll-cue { position:absolute; bottom:27px; left:50%; text-decoration:none; font-size:9px; letter-spacing:.15em; text-transform:uppercase; }
.scroll-cue span { display:inline-block; animation:bounce 1.5s infinite; }
@keyframes bounce { 50%{transform:translateY(7px)} }
.profiles { min-height:125svh; padding:14vh 6vw 12vh; display:grid; grid-template-columns:.7fr 1.3fr; gap:5vw; align-items:center; position:relative; overflow:hidden; background:#aeb8cd; }
.profiles::before { content:"BREEZE / ARCHIVE / 2025"; position:absolute; left:-2vw; bottom:5vh; font:clamp(72px,13vw,210px)/.75 "Cormorant Garamond",serif; color:#8794af55; white-space:nowrap; transform:rotate(-4deg); }
.profiles-heading { align-self:start; padding-top:8vh; position:relative; z-index:4; }
.profiles-heading h2 { font-size:clamp(68px,9vw,132px); line-height:.72; letter-spacing:-.06em; font-weight:500; margin:38px 0; }
.profiles-heading h2 em { color:var(--red); }
.profiles-heading > p:last-child { font-family:"Cormorant Garamond",serif; font-size:24px; line-height:1.2; margin-left:6vw; }
.profile-stack { height:950px; position:relative; perspective:1400px; }
.profile-paper { position:absolute; width:min(42%,360px); margin:0; padding:13px 13px 55px; background:#f4eddf; box-shadow:13px 18px 35px #29314542; transition:transform .75s var(--ease),filter .4s; transform-style:preserve-3d; }
.profile-paper:hover { z-index:9; filter:saturate(1.08); }
.profile-paper img { display:block; width:100%; height:auto; }
.profile-paper figcaption { display:flex; justify-content:space-between; align-items:end; gap:15px; padding:17px 5px 0; }
.profile-paper figcaption b { font:31px "Cormorant Garamond",serif; }
.profile-paper figcaption span { max-width:145px; font-size:7px; line-height:1.4; letter-spacing:.09em; text-align:right; }
.profile-leon { left:5%; top:3%; transform:rotate(-7deg); }
.profile-leon:hover { transform:rotate(-2deg) translateY(-18px) rotateY(4deg); }
.profile-tessa { right:3%; bottom:0; transform:rotate(6deg); }
.profile-tessa:hover { transform:rotate(1deg) translateY(-18px) rotateY(-4deg); }
.profile-tape { width:105px; height:28px; position:absolute; top:-11px; left:50%; translate:-50% 0; background:#d8e75acc; transform:rotate(-3deg); z-index:2; }
.profile-tessa .profile-tape { background:#f0a9b4cc; transform:rotate(4deg); }
.profile-match { position:absolute; z-index:7; left:43%; top:41%; width:135px; height:135px; border-radius:50%; background:var(--red); color:var(--paper); display:grid; place-content:center; text-align:center; transform:rotate(-11deg); box-shadow:7px 7px 0 var(--ink); }
.profile-match span { font:47px/.7 "Cormorant Garamond",serif; }.profile-match b{font-size:8px;letter-spacing:.14em}.profile-match i{position:absolute;right:-45px;bottom:-13px;font:52px "Permanent Marker";transform:rotate(24deg)}
.profile-scribble { position:absolute; left:4%; bottom:2%; font:21px/1.1 "Permanent Marker",cursive; color:#244987; transform:rotate(-8deg); }
.counter-section { min-height:94svh; background:var(--ink); color:var(--paper); position:relative; padding:14vh 7vw 10vh; overflow:hidden; display:grid; grid-template-columns:1fr 1.4fr; gap:5vw; align-content:center; }
.torn-edge { position:absolute; top:-18px; left:0; right:0; height:36px; background:var(--paper); clip-path:polygon(0 0,3% 41%,7% 10%,11% 54%,17% 19%,22% 65%,28% 13%,34% 55%,40% 20%,46% 68%,51% 11%,56% 48%,62% 14%,69% 60%,75% 9%,81% 54%,88% 17%,94% 64%,100% 0); }
.counter-heading h2 { font-size:clamp(65px,9vw,135px); line-height:.72; letter-spacing:-.05em; font-weight:500; margin:35px 0; }
.counter-heading em { color:var(--pink); }
.counter { display:grid; grid-template-columns:1fr 1fr; align-self:center; }
.counter div { border-top:1px solid #e9e2d255; padding:21px 5px 38px; }
.counter div:nth-child(odd) { border-right:1px solid #e9e2d255; }
.counter strong { display:block; font-family:"Cormorant Garamond",serif; color:var(--acid); font-weight:500; font-size:clamp(55px,8vw,115px); line-height:.8; font-variant-numeric:tabular-nums; }
.counter span { font-size:9px; letter-spacing:.17em; text-transform:uppercase; }
.counter-footnote { font-family:"Cormorant Garamond",serif; font-size:20px; opacity:.72; }
.date-stamp { position:absolute; right:3vw; bottom:5vh; border:3px double var(--red); color:var(--red); border-radius:50%; width:150px; height:90px; display:grid; place-content:center; text-align:center; transform:rotate(-9deg); font-size:10px; }
.memory { min-height:120vh; padding:11vh 6vw; position:relative; background:#d8d0bf; }
.memory-index { position:absolute; font:46vw/.7 "Cormorant Garamond",serif; color:#cbc1ad; left:-3vw; top:11vh; }
.memory-board { max-width:1220px; min-height:850px; margin:auto; position:relative; }
.photo-placeholder { width:48%; aspect-ratio:4/5; background:#20201b; color:var(--paper); transform:rotate(-3deg); position:absolute; left:3%; top:2%; box-shadow:12px 18px 30px #685d4930; display:grid; place-content:center; text-align:center; clip-path:polygon(0 1%,100% 0,99% 98%,2% 100%); }
.photo-placeholder::before { content:""; position:absolute; inset:7%; border:1px solid #e9e2d233; background:repeating-radial-gradient(circle at 28% 40%,#ffffff08 0 1px,transparent 2px 10px); }
.photo-placeholder span { font-family:"Cormorant Garamond",serif; font-size:clamp(43px,6vw,82px); line-height:.73; z-index:2; }
.photo-placeholder small { margin-top:50px; z-index:2; }
.memory-note { position:absolute; z-index:5; width:43%; right:2%; top:10%; background:#efe6d3; padding:55px 55px 70px; transform:rotate(2deg); box-shadow:8px 12px 25px #685d4938; }
.memory-note h2 { font-size:clamp(80px,10vw,145px); font-weight:500; letter-spacing:-.06em; line-height:.61; margin:35px 0 45px; }
.memory-date { font-weight:500; line-height:1.7; }
.body-copy { font-family:"Cormorant Garamond",serif; font-size:21px; line-height:1.35; }
.memory-button { border:0; border-bottom:1px solid; padding:8px 0; background:none; cursor:pointer; font-size:10px; text-transform:uppercase; margin-top:20px; }
.receipt { position:absolute; z-index:7; background:#f7f4e8; width:245px; padding:28px 20px 42px; left:39%; bottom:4%; transform:rotate(8deg); display:flex; flex-direction:column; gap:9px; box-shadow:4px 8px 18px #0002; font-size:10px; }
.receipt b { font:52px/1 "Cormorant Garamond",serif; text-align:center; }
.receipt small { text-align:center; margin-top:20px; }
.coffee-ring { width:170px; height:170px; border:9px double #8d56364a; border-radius:50%; position:absolute; right:8%; bottom:5%; transform:rotate(13deg); }
.tape { width:125px; height:34px; background:#dfe1b8aa; position:absolute; z-index:8; }
.tape-one { left:42%; top:6%; transform:rotate(24deg); }
.pencil-note { position:absolute; left:51%; bottom:0; font-family:"Permanent Marker"; transform:rotate(-9deg); color:var(--blue); }
.moments { min-height:120svh; position:relative; padding:12vh 5vw; overflow:hidden; background:var(--acid); }
.moments-title { position:relative; z-index:5; }
.moments-title h2 { font-size:clamp(82px,13vw,185px); line-height:.62; font-weight:500; letter-spacing:-.07em; margin:35px 0; }
.moments-title em { color:var(--blue); }
.photo-reel { position:relative; max-width:1260px; height:850px; margin:-9vh auto 0; }
.snapshot { position:absolute; margin:0; background:#f3ecdc; padding:13px 13px 48px; width:36%; box-shadow:10px 15px 28px #46501938; transition:transform .65s var(--ease),z-index .1s; }
.snapshot:hover { z-index:10; transform:rotate(0) translateY(-20px) scale(1.025); }
.snapshot img { width:100%; aspect-ratio:3/4; object-fit:cover; display:block; filter:saturate(.9) contrast(1.04); }
.snapshot figcaption { font-size:8px; letter-spacing:.12em; margin:17px 6px 0; }
.snapshot-one { left:2%; top:24%; transform:rotate(-8deg); }.snapshot-two{left:33%;top:8%;transform:rotate(3deg)}.snapshot-three{right:0;top:28%;transform:rotate(8deg)}
.reel-note { position:absolute; z-index:12; right:3%; top:12%; font:22px/1.1 "Permanent Marker"; color:var(--red); transform:rotate(7deg); }
.between { background:var(--red); color:#f4e7cf; overflow:hidden; padding-bottom:12vh; }
.marquee { margin:0; white-space:nowrap; border-block:1px solid #f4e7cf; padding:18px 0; font-size:13px; letter-spacing:.13em; }
.marquee span { display:inline-block; min-width:max-content; animation:marquee 20s linear infinite; }
@keyframes marquee { to{transform:translateX(-50%)} }
.between-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; max-width:1200px; margin:11vh auto 0; padding:0 5vw; gap:6vw; }
blockquote { font-size:clamp(45px,6vw,85px); line-height:.85; margin:0; letter-spacing:-.04em; }
.map-card { position:relative; background:#e8dfcc; color:var(--ink); padding:30px; transform:rotate(3deg); box-shadow:10px 14px 0 #67291f; }
.map-card svg { width:100%; margin-top:20px; }
.map-card path { fill:none; stroke:var(--blue); stroke-width:2; stroke-dasharray:5 7; }
.map-card circle { fill:var(--red); }
.map-label,.map-point { font-size:8px; letter-spacing:.1em; }
.map-point { position:absolute; }.map-point.left{bottom:36px;left:25px}.map-point.middle{top:42%;left:46%}.map-point.right{top:29%;right:23px}
.future { min-height:120svh; padding:14vh 6vw 8vh; position:relative; overflow:hidden; background:#e4c26e; }
.future::before { content:"2027"; position:absolute; right:-3vw; bottom:-7vh; font:42vw/.7 "Cormorant Garamond"; color:#c59e4155; }
.travel-copy { position:relative; z-index:5; }
.travel-copy h2 { font-size:clamp(78px,12vw,175px); font-weight:500; line-height:.67; letter-spacing:-.06em; margin:40px 0; }
.travel-copy h2 em { color:var(--blue); }
.travel-intro { font:24px/1.2 "Cormorant Garamond"; margin-left:7vw; }
.travel-board { position:absolute; right:2vw; top:9vh; width:52vw; height:72vh; min-height:650px; background:#d7dfcf; transform:rotate(3deg); box-shadow:14px 18px 0 var(--ink); border:1px solid var(--ink); }
.travel-route { width:100%; height:100%; overflow:visible; }
.world-line { fill:none; stroke:var(--blue); stroke-width:3; stroke-dasharray:9 10; animation:route 4s linear infinite; }.travel-route circle{fill:var(--red)}.travel-route text{font:10px "DM Mono";letter-spacing:.12em}.route-aus{animation:pulse 2s infinite;transform-origin:405px 225px}
.boarding-pass { position:absolute; left:-5%; bottom:8%; background:#f3ecdc; padding:21px 25px; border:2px solid; box-shadow:6px 6px 0 var(--red); transform:rotate(-8deg); display:flex; flex-direction:column; }.boarding-pass span,.boarding-pass small{font-size:8px;letter-spacing:.12em}.boarding-pass b{font-size:27px;margin:7px 0}
.work-stamp { position:absolute; right:6%; top:10%; border:4px double var(--red); color:var(--red); border-radius:50%; width:160px;height:120px;display:grid;place-content:center;text-align:center;transform:rotate(12deg);font-size:14px}.work-stamp b{font-size:10px}
.nz-note { position:absolute; right:1%; bottom:4%; font:18px "Permanent Marker"; color:var(--blue); transform:rotate(-6deg); }
.trip-countdown { position:absolute; left:7vw; bottom:11vh; display:grid; grid-template-columns:auto auto; align-items:end; column-gap:14px; z-index:5; }.trip-countdown>span{grid-column:1/-1;font-size:9px;letter-spacing:.16em}.trip-countdown strong{font:clamp(80px,12vw,170px)/.7 "Cormorant Garamond";color:var(--red)}.trip-countdown b{font-size:12px;padding-bottom:9px}
.empty-memories { position:absolute; right:4vw; top:13vh; width:48%; height:65vh; }
.empty-card { position:absolute; width:260px; height:330px; border:1px solid var(--ink); padding:25px; text-align:left; background:var(--pink); box-shadow:7px 9px 0 var(--ink); cursor:pointer; transition:transform .55s var(--ease),filter .3s; }
.empty-card:hover { transform:translateY(-22px) rotate(0deg) !important; filter:saturate(1.2); z-index:4; }
.empty-card span { font:54px "Cormorant Garamond",serif; }.empty-card b{display:block;font-size:18px;margin-top:80px}.empty-card small{position:absolute;bottom:20px;left:25px;font-size:8px}
.card-a { right:46%; top:12%; transform:rotate(-9deg); }.card-b{right:16%;top:25%;transform:rotate(5deg);background:var(--acid)}.card-c{right:2%;top:2%;transform:rotate(14deg);background:#3b5fa2;color:white}
.special-message { font-family:"Permanent Marker"; color:var(--red); font-size:20px; transform:rotate(-4deg); max-width:400px; }
footer { background:var(--ink); color:var(--paper); padding:35px 4vw; display:flex; justify-content:space-between; font-size:8px; letter-spacing:.17em; }
.note-dialog { width:min(600px,90vw); border:0; background:#f2e9d7; padding:70px 60px; box-shadow:14px 18px 0 var(--red); transform:rotate(-1deg); }
.note-dialog::backdrop { background:#151510cc; backdrop-filter:blur(3px); }.note-dialog h2{font-size:48px;line-height:.9}.note-dialog p{line-height:1.6}.close-note{position:absolute;right:20px;top:15px;border:0;background:none;font-size:35px;cursor:pointer}
.reveal { opacity:0; transform:translateY(35px) rotate(.6deg); transition:opacity .9s var(--ease),transform .9s var(--ease); }.reveal.visible{opacity:1;transform:translateY(0) rotate(0)}
.cursor-dot { width:16px;height:16px;border:1px solid var(--red);border-radius:50%;position:fixed;left:0;top:0;z-index:110;pointer-events:none;transition:width .2s,height .2s,background .2s;mix-blend-mode:multiply; }
@media (max-width:800px){.cursor-dot{display:none}.life-status{height:39px;gap:8px;padding:0 8px;justify-content:space-around}.status-item{gap:5px}.status-item b{display:none}.status-item small{font-size:6px;letter-spacing:.07em}.status-item strong{font-size:9px}.status-divider{font-size:7px}.topbar{top:39px;padding:10px 14px}.topbar-actions{gap:10px}.soundless-note{display:none}.language-switcher button{padding:5px 6px}.hero{grid-template-columns:1fr;padding:15vh 6vw 5vh}.hero-copy{align-self:start}.hero-collage{height:49vh;margin-top:-3vh}.origin-card{width:150px;height:105px;padding:20px 14px}.origin-card strong{font-size:20px}.route{top:8%;height:80%}.ticket-hero{left:32%;top:2%}.flower{font-size:48px}.intro{margin-left:25vw}.profiles{min-height:1550px;display:block;padding:11vh 5vw}.profiles-heading{padding-top:0}.profiles-heading h2{font-size:73px}.profile-stack{height:1110px;margin-top:55px}.profile-paper{width:68%;padding:9px 9px 44px}.profile-leon{left:1%;top:0}.profile-tessa{right:1%;bottom:0}.profile-match{left:47%;top:45%;width:105px;height:105px}.profile-scribble{bottom:45%;left:2%}.counter-section{grid-template-columns:1fr;padding:12vh 7vw}.counter-heading h2{margin:28px 0 60px}.date-stamp{opacity:.7}.memory{min-height:1450px;padding-inline:4vw}.memory-board{min-height:1300px}.photo-placeholder{position:relative;width:91%;left:2%;}.memory-note{width:88%;right:0;top:31%;padding:45px 30px}.receipt{left:7%;bottom:10%}.coffee-ring{right:5%;bottom:3%}.pencil-note{left:46%;bottom:5%}.moments{min-height:1600px}.moments-title h2{font-size:90px}.photo-reel{height:1250px;margin-top:35px}.snapshot{width:72%;padding:8px 8px 40px}.snapshot-one{left:0;top:0}.snapshot-two{right:0;left:auto;top:32%}.snapshot-three{left:4%;right:auto;top:64%}.reel-note{top:29%;right:0}.between-grid{grid-template-columns:1fr}.map-card{margin-top:40px}.future{min-height:1300px;padding-inline:5vw}.travel-copy h2{font-size:76px}.travel-board{position:relative;right:auto;top:auto;width:94%;height:570px;min-height:0;margin:60px auto;}.boarding-pass{left:-2%;bottom:4%}.work-stamp{width:125px;height:95px}.trip-countdown{left:8vw;bottom:13vh}footer{gap:20px;flex-wrap:wrap}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.noise,.flower,.marquee span,.scroll-cue span,.route circle{animation:none}.route-line{animation:none;stroke-dashoffset:0}.reveal{opacity:1;transform:none;transition:none}*{transition-duration:.01ms!important}}