:root{--lime:#b5e126;--ink:#0a0a0a;--paper:#e9e7e0}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--ink);color:var(--paper);font-family:Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--lime);outline-offset:6px}header{height:85px;position:fixed;z-index:10;top:0;width:100%;display:flex;align-items:center;gap:45px;padding:0 4%;background:#0a0a0aeF;border-bottom:1px solid #ffffff20}.brand{margin-right:auto;width:155px;height:38px;overflow:hidden;position:relative}.brand img{width:155px;position:absolute;bottom:0}.shop-link,.bag{font-size:13px;letter-spacing:1px;font-weight:700}.shop-link span{color:var(--lime);margin-left:15px}.bag{border:0;background:none;color:var(--paper)}.bag span{border:1px solid #777;border-radius:50%;padding:7px 10px;margin-left:9px}.sequence{height:230svh}.stage{height:100svh;position:sticky;top:0;overflow:hidden}.edition{position:absolute;top:125px;left:4%;font-size:12px;letter-spacing:2px;color:#aaa}.hero-type{position:absolute;inset:29% 0 auto;text-align:center;font-weight:900;letter-spacing:-.07em;line-height:.85;font-size:clamp(70px,12.9vw,220px);color:#282a24;transform:translateY(calc(var(--p,0)*-65px));opacity:calc(1 - var(--p,0)*2)}.hero-type span{display:block}.hero-type span+span{color:var(--paper)}.capsule{position:absolute;width:clamp(265px,34vw,560px);aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;filter:drop-shadow(0 30px 30px #0009);opacity:calc(1 - max(0,var(--p,0) - .55)*3)}.half{width:100%;position:absolute;inset:0}.top{clip-path:polygon(0 0,100% 0,100% 91%,0 9.25%);transform:translate(calc(var(--p,0)*140px),calc(var(--p,0)*-150px)) rotate(calc(var(--p,0)*12deg))}.bottom{clip-path:polygon(0 9.25%,100% 91%,100% 100%,0 100%);transform:translate(calc(var(--p,0)*-110px),calc(var(--p,0)*80px)) rotate(calc(var(--p,0)*-12deg))}.hero-bottom{position:absolute;bottom:38px;left:4%;right:4%;display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:1px;z-index:4}.scroll{font-size:12px;display:flex;align-items:center;gap:22px}.scroll span{display:grid;place-items:center;width:35px;height:48px;border:1px solid #666;border-radius:25px;font-size:23px}.progress{position:absolute;bottom:0;height:3px;background:#333;width:100%}.progress i{display:block;width:calc(var(--p,0)*100%);height:100%;background:var(--lime)}#particles{position:absolute;inset:0;pointer-events:none;z-index:3}.particle{position:absolute;left:50%;top:50%;width:var(--size);height:var(--size);background:var(--lime);border-radius:50%;opacity:0}.reveal{position:absolute;inset:35% 2% auto;text-align:center;opacity:clamp(0,calc((var(--p,0) - .52)*4),1);transform:translateY(calc((1 - var(--p,0))*75px));z-index:4;pointer-events:none}.reveal>span{font-size:12px;letter-spacing:3px}.reveal h1{font-size:clamp(65px,12vw,190px);letter-spacing:-.08em;margin:10px 0 25px;line-height:1}.reveal i{color:var(--lime);font-style:normal}.reveal a{font-weight:bold;border-bottom:1px solid var(--lime);padding-bottom:8px;pointer-events:auto}.collection{padding:95px 4% 45px;background:var(--paper);color:var(--ink)}.collection-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:40px;gap:24px}.eyebrow{font-size:12px;letter-spacing:1.5px}.collection h2{font-size:clamp(35px,5vw,80px);letter-spacing:-.06em;margin:15px 0 0;line-height:1}.collection h2 em{font-style:normal}.collection-heading p{font-size:16px;margin:0 0 4px}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product{min-width:0}.art{height:360px;width:100%;border:0;position:relative;background:#d8d7d0;overflow:hidden;display:grid;place-items:center}.art img{width:75%;height:75%;object-fit:contain;transition:transform .45s}.art:hover img{transform:rotate(-5deg) scale(1.06)}.art .number{position:absolute;top:18px;left:18px;font-size:12px;mix-blend-mode:difference;color:white}.art .plus{position:absolute;right:15px;bottom:15px;border-radius:50%;background:var(--paper);color:#111;width:38px;height:38px;display:grid;place-items:center;font-size:25px}.art .type{position:absolute;left:18px;bottom:24px;font-size:11px;letter-spacing:1px;color:#888}.product h3{font-size:18px;letter-spacing:-.4px;margin:17px 0 7px}.product-info{display:flex;justify-content:space-between;font-size:13px;color:#555;gap:8px}.collection-note{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #aaa;margin-top:50px;padding-top:20px;font-size:12px;color:#555}footer{padding:55px 4%;display:flex;align-items:center;justify-content:space-between;gap:30px;font-size:12px;letter-spacing:1px}footer img{width:170px}dialog{border:1px solid #45463e;background:#151610;color:var(--paper);padding:45px;max-width:700px;width:calc(100% - 32px);max-height:90svh}dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}.close{position:absolute;top:12px;right:16px;border:0;background:none;color:var(--paper);font-size:30px}.detail-art{width:180px;height:180px;object-fit:contain;display:block;margin:auto}dialog h2{font-size:34px;letter-spacing:-1px;margin:20px 0}dialog p{line-height:1.5;color:#b6b7ae}.sizes{display:flex;gap:8px;margin:15px 0 25px}.sizes button{background:none;border:1px solid #666;color:var(--paper);padding:12px 18px}.sizes button[aria-pressed=true]{background:var(--lime);color:#111;border-color:var(--lime)}.buy{width:100%;padding:17px;background:var(--lime);border:0;color:#111;font-weight:700}.demo-note{font-size:12px}.bag-row{display:flex;align-items:center;gap:15px;padding:15px 0;border-bottom:1px solid #45463e}.bag-row img{width:70px;height:70px;object-fit:contain}.bag-row div{flex:1}.bag-row small{display:block;color:#aaa;margin-top:8px}.remove{background:none;border:0;color:#aaa;font-size:13px;text-decoration:underline}.total{display:flex;justify-content:space-between;margin:25px 0;font-size:20px}.accent{color:var(--lime)}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,100px);background:var(--lime);color:#111;z-index:30;padding:15px 25px;font-size:14px;transition:transform .2s;width:max-content;max-width:90%}#toast.show{transform:translate(-50%,0)}@media(min-width:1600px){.art{height:430px}}@media(max-width:900px){.products{grid-template-columns:repeat(2,1fr)}.art{height:360px}.collection-heading{display:block}.collection-heading p{margin-top:20px}.capsule{width:44vw}.hero-type{top:35%}footer span{display:none}}@media(max-width:560px){header{height:72px;padding:0 5%;gap:20px}.brand{width:120px}.brand img{width:120px}.shop-link,.bag{font-size:11px}.shop-link span{display:none}.bag span{padding:5px 8px;margin-left:3px}.edition{top:105px;font-size:10px;left:5%}.hero-type{font-size:16.5vw;top:37%;line-height:.95}.capsule{width:76vw;top:48%}.hero-bottom{left:5%;right:5%;bottom:25px}.hero-bottom>span:first-child{font-size:10px;max-width:85px;line-height:1.7}.serial{display:none}.scroll{font-size:10px;gap:10px}.reveal{top:39%}.reveal h1{font-size:20vw}.reveal>span{font-size:10px}.collection{padding:65px 5% 30px}.products{gap:25px 12px}.art{height:230px}.art .type{font-size:9px;left:10px}.art .number{left:10px;top:12px}.art .plus{width:30px;height:30px;right:10px;bottom:12px}.product h3{font-size:16px}.product-info{display:block;font-size:12px}.product-info span{display:block;margin-top:5px}.collection-note{display:block;line-height:1.8}.collection-note span{display:block}footer{padding:30px 5%;gap:20px}footer img{width:135px}footer a{font-size:10px}dialog{padding:30px 24px}.sizes button{flex:1;padding:12px 5px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.sequence{height:100svh}.hero-type,.capsule{transform:none;opacity:1}.capsule{transform:translate(-50%,-50%)}.half{transform:none}#particles,.reveal,.progress{display:none}.art img{transition:none}}

/* Capsule-first opening: the headline arrives with the drop. */
.capsule{width:min(48vw,58svh,680px);top:49%}
.hero-caption{position:absolute;top:81%;left:5%;right:5%;margin:0;text-align:center;font-size:14px;line-height:1.5;font-weight:700;letter-spacing:2px;color:#a4a59c;opacity:clamp(0,calc(1 - var(--p,0)*4),1);pointer-events:none}
.hero-caption span{color:var(--paper)}
@media(max-width:900px){.capsule{width:min(72vw,58svh)}}
@media(max-width:560px){.capsule{width:min(88vw,56svh);top:49%}.hero-caption{font-size:12px;letter-spacing:1.5px;top:80%}}
@media(max-height:500px){.edition{top:95px}.capsule{width:min(42vw,48svh);top:53%}.hero-caption{top:80%;font-size:12px}.hero-bottom{bottom:16px}.scroll span{height:30px}}
@media(prefers-reduced-motion:reduce){.hero-caption{opacity:1}}

/* Drop photography and permanent brand collection. */
.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:38px 24px}
.product .art{height:auto;aspect-ratio:4/3;background:#f4f4f4}
.product .art img{width:100%;height:100%;object-fit:contain}
.product .art:hover img{transform:scale(1.025)}
.product .art .type{display:none}
.detail-art{width:100%;height:auto;max-height:40svh;background:#f4f4f4;object-fit:contain}
.core-collection{padding:100px 7%;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:50px;border-bottom:1px solid #333;scroll-margin-top:85px}
.core-intro h2{font-size:clamp(40px,7vw,110px);line-height:.95;letter-spacing:-.065em;margin:24px 0}
.core-intro h2 em{font-style:normal;color:var(--lime)}
.core-intro p{font-size:18px;color:#b8bab0;line-height:1.6}
.core-status{display:inline-block;margin-top:20px;border-top:1px solid #555;padding-top:18px;letter-spacing:1.5px;font-size:12px;color:#b8bab0}
.core-mark{width:100%;max-width:400px;justify-self:center}
@media(max-width:560px){header{gap:12px}.core-link{font-size:10px}.brand,.brand img{width:100px}.products{grid-template-columns:1fr;gap:30px}.core-collection{padding:65px 5%;grid-template-columns:1fr;gap:35px}.core-mark{width:60%;max-width:240px}.core-intro h2{font-size:16vw}.core-intro p{font-size:16px}}

.core-collection{display:block;padding:85px 4% 55px}.core-intro{margin-bottom:40px}.core-intro h2{font-size:clamp(40px,5.5vw,85px)}.core-intro h2 br{display:none}.core-intro h2 em{margin-left:.2em}.core-intro p br{display:none}.core-collection .product-info{color:#b8bab0}.core-price-note{font-size:12px;color:#b8bab0;margin-top:35px;border-top:1px solid #444;padding-top:20px}@media(max-width:560px){.core-collection{padding:65px 5% 35px}.core-intro h2{font-size:10vw}}

/* Campaign -> dark stage -> capsule opening. */
.sequence{height:310svh}
.campaign{position:absolute;inset:0;overflow:hidden;opacity:calc(1 - var(--intro,0));pointer-events:none}
.campaign>img{width:100%;height:100%;object-fit:cover;object-position:38% center;transform:scale(calc(1 + var(--intro,0)*.04))}
.campaign-shade{position:absolute;inset:0;background:linear-gradient(90deg,transparent 35%,#0003 60%,#0007);opacity:calc(.65 + var(--intro,0)*.35)}
.campaign-copy{position:absolute;left:57%;right:4%;top:37%;color:#f3f1e9;opacity:clamp(0,calc(1 - var(--intro,0)*1.8),1);transform:translateY(calc(var(--intro,0)*-35px))}
.campaign-copy>span{font-size:12px;letter-spacing:2px}.campaign-copy h2{font-size:clamp(44px,6.6vw,110px);line-height:.94;letter-spacing:-.06em;margin:22px 0 35px}.campaign-copy h2 em{font-style:normal;color:var(--lime)}.campaign-copy a{pointer-events:auto;font-size:14px;font-weight:700;border-bottom:1px solid #f3f1e9;padding-bottom:10px}
.capsule{opacity:calc(var(--capsule-in,0)*(1 - max(0,var(--p,0) - .55)*3))}
.edition{opacity:var(--capsule-in,0)}.hero-caption{opacity:calc(var(--capsule-in,0)*clamp(0,calc(1 - var(--p,0)*4),1))}
@media(max-width:560px){.campaign>img{object-position:30% center}.campaign-copy{left:7%;right:7%;top:auto;bottom:17%}.campaign-copy h2{font-size:clamp(45px,13vw,70px);margin:15px 0 24px}.campaign-copy>span{font-size:10px}.campaign-shade{background:linear-gradient(0deg,#000b,transparent 75%)}.campaign-copy a{font-size:12px}}
@media(max-height:500px) and (min-width:561px){.campaign-copy{top:30%}.campaign-copy h2{font-size:45px;margin:12px 0 20px}}
@media(prefers-reduced-motion:reduce){.sequence{height:100svh}.campaign{opacity:1}.campaign>img{transform:none}.campaign-copy{opacity:1;transform:none}.capsule,.edition,.hero-caption{display:none}}

/* Official hollow 3D capsule; image remains as a loading/WebGL fallback. */
#capsule3d{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:var(--capsule-in,0)}
#capsule3d canvas{display:block;width:100%;height:100%}.has-3d .capsule,.has-3d #particles{display:none}
.sequence{height:350svh}
@media(prefers-reduced-motion:reduce){#capsule3d{display:none}.sequence{height:100svh}}

/* A compact opening, followed by the collection in normal document flow. */
.sequence{height:270svh}
.capsule{opacity:var(--capsule-in,0)}
.capsule .top{transform-origin:48% 25%;transform:translate(calc(var(--p,0)*25px),calc(var(--p,0)*-15px)) rotate(calc(var(--p,0)*32deg))}
.capsule .bottom{transform-origin:48% 25%;transform:translate(calc(var(--p,0)*-20px),calc(var(--p,0)*-15px)) rotate(calc(var(--p,0)*-30deg))}
.collection{padding-top:65px}.collection-heading{margin-bottom:32px}
@media(max-width:560px){.sequence{height:250svh}.collection{padding-top:48px}}
@media(prefers-reduced-motion:reduce){.sequence{height:100svh}.capsule .half{transform:none}}

/* Keep the original oversized title on its own screen below the capsule. */
.drop-title{min-height:48svh;padding:65px 4% 55px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:var(--ink)}
.drop-title>span{font-size:12px;letter-spacing:3px}
.drop-title h1{font-size:clamp(65px,12vw,190px);letter-spacing:-.08em;margin:10px 0 25px;line-height:1}
.drop-title i{color:var(--lime);font-style:normal}
.drop-title a{font-size:14px;font-weight:700;border-bottom:1px solid var(--lime);padding-bottom:8px}
.sequence{height:245svh}
.capsule{width:min(45vw,44svh,520px)}
@media(max-width:560px){.sequence{height:230svh}.drop-title{min-height:38svh;padding:45px 5%}.drop-title h1{font-size:20vw}.capsule{width:min(78vw,44svh)}}
@media(prefers-reduced-motion:reduce){.sequence{height:100svh}}

/* Capsule, falling trail and Drop 001 share one uninterrupted black scene. */
.drop-story{position:relative;background:var(--ink);isolation:isolate}
#capsule3d{position:fixed;inset:0;z-index:2;pointer-events:none}
.drop-title{position:relative;z-index:1;background:transparent;min-height:48svh}
.scene-scroll{position:absolute;right:9%;top:48%;z-index:4;font-size:12px;font-weight:700;letter-spacing:.5px;opacity:var(--capsule-in,0)}
.hero-caption{display:none}
.progress,.hero-bottom{display:none}
@media(max-width:560px){.scene-scroll{right:5%;top:69%;font-size:10px;gap:10px}.scene-scroll span{width:29px;height:39px}.drop-title{min-height:40svh}}
@media(prefers-reduced-motion:reduce){.scene-scroll{display:none}}
.drop-title>span,.drop-title>h1,.drop-title>a{opacity:var(--drop-reveal,1)}
@media(prefers-reduced-motion:reduce){.drop-title>span,.drop-title>h1,.drop-title>a{opacity:1}}

/* Mobile and narrow screens: the cue sits under the tagline, clear of the falling spheres; the canvas ignores the address bar. */
.campaign{will-change:opacity}
@media(max-width:900px),(max-aspect-ratio:11/10){.scene-scroll{left:4%;right:auto;top:170px;white-space:nowrap}}
@media(max-width:560px){.scene-scroll{left:5%;top:142px}}
@media(max-height:500px){.scene-scroll{top:125px}}
@media(pointer:coarse){#capsule3d{bottom:auto;height:100lvh}}
@media(max-width:360px){header{gap:10px;padding:0 3%}.brand,.brand img{width:84px}.shop-link,.bag,.core-link{font-size:10px;letter-spacing:.5px;white-space:nowrap}}
/* The drawn capsule is only a fallback for when 3D fails, never a loading placeholder. */
.capsule,#particles{display:none}.no-3d .capsule,.no-3d #particles{display:block}
#capsule3d canvas{animation:capsule-appear .3s ease-out}
@keyframes capsule-appear{from{opacity:0}to{opacity:1}}
/* The title settles into place as the splash clears it. */
.drop-title>h1{transform:scale(calc(.88 + var(--drop-reveal,1)*.12))}
/* The reveal gets a full black screen; without the splash the shorter block is enough. */
.drop-title{min-height:100svh}
.no-3d .drop-title{min-height:48svh}
@media(prefers-reduced-motion:reduce){.drop-title{min-height:48svh}}
/* The title rides up over the end of the capsule scene and holds for the reveal.
   The products then slide over the black, stopping just under the title, before everything scrolls on. */
.drop-title{position:sticky;top:0;margin-top:-45svh}
.drop-story::after{content:"";display:block;height:47svh}
.collection{position:relative;z-index:3;margin-top:-34svh;padding-top:28px}
@media(min-width:561px){.drop-story::after{height:43svh}.collection{margin-top:-30svh}}
@media(max-height:500px){.drop-story::after{height:33svh}.collection{margin-top:-20svh}}
.no-3d .drop-story::after{display:none}.no-3d .drop-title{position:relative;margin-top:0}.no-3d .collection{margin-top:0}
@media(prefers-reduced-motion:reduce){.drop-story::after{display:none}.drop-title{position:relative;margin-top:0}.collection{margin-top:0}}
