@font-face{font-family:Lilita;src:url('lilita-one.ttf') format('truetype');font-display:swap;font-weight:400}
:root{--cream:#fff9e9;--green:#285c40;--ink:#173d2b;--red:#cf2f35;--blue:#204d35;--yellow:#ffdf43}
body{background:var(--blue);color:var(--cream)}
.nav{left:4%;right:4%;top:17px;padding:14px 0;border:0;border-radius:0;background:transparent;backdrop-filter:none;color:var(--cream);transition:background .2s,padding .2s,top .2s}
.nav.scrolled{background:#173f2fee;backdrop-filter:blur(12px);border-radius:30px;padding:12px 22px;box-shadow:0 4px 20px #173d2b22}
.word{font-family:Lilita,Arial,sans-serif;font-weight:400;font-size:38px;letter-spacing:-1.8px}.word b{color:var(--red)}
.links{gap:32px;font-size:13px}.links a:hover{text-decoration:underline;text-underline-offset:5px}
.nav button.nav-cta{background:transparent;color:var(--cream);border:1px solid #ffffff88;border-radius:24px;padding:12px 19px}
.nav button.nav-cta:hover{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
.stage{background:var(--blue);min-height:720px}.journey{height:1000vh}
#world{z-index:2;pointer-events:none}.intro{left:0;top:0;width:100%;max-width:none;height:100%;z-index:1;transform:none!important;text-align:center}
.intro .eyebrow{position:absolute;top:18%;left:0;width:100%;margin:0;font-size:11px;letter-spacing:3px}
.intro h1{position:absolute;top:28%;left:3%;width:94%;display:flex;justify-content:space-between;gap:10%;align-items:center;margin:0;font-family:Lilita,Arial,sans-serif;font-weight:400;font-size:clamp(100px,15.6vw,250px);line-height:.95;letter-spacing:-.055em;color:var(--cream)}
.intro h1 span:first-child{transform:rotate(-5deg)}.intro h1 span:last-child{transform:rotate(4deg)}
.intro .hero-copy{position:absolute;bottom:18%;left:5%;width:230px;max-width:230px;text-align:left;font-size:19px!important;line-height:1.3!important;font-weight:700}
.intro .flavour{position:absolute;bottom:20%;right:5%;border:0;font-size:12px;max-width:190px;text-align:right;letter-spacing:.03em}
.intro .scroll-note{position:absolute;bottom:10%;left:5%;font-size:11px;margin:0}.scroll-line{height:22px}
.hero-action{position:absolute;z-index:4;top:76%;left:50%;transform:translateX(-50%);text-align:center;transition:opacity .12s}
.hero-action button{background:var(--yellow);border:0;color:var(--ink);padding:17px 28px;border-radius:40px;font-weight:800;font-size:15px;box-shadow:0 8px 0 #102f2524;white-space:nowrap}.hero-action button:hover{transform:rotate(-3deg)}
.hero-action small{display:block;margin-top:12px;font-size:10px;letter-spacing:.08em}
.hero-stamp{position:absolute;top:24%;right:22%;width:98px;height:98px;display:grid;place-content:center;border-radius:50%;background:var(--yellow);color:var(--ink);font-weight:800;font-size:12px;line-height:1.35;transform:rotate(14deg);z-index:4;pointer-events:none;text-align:center}
.hero-doodle{position:absolute;left:7%;top:27%;font-family:Lilita;font-size:55px;color:var(--yellow);transform:rotate(-15deg)}
.caption,.final-message{z-index:4}.caption{left:6%;bottom:135px;max-width:400px}.caption h2,.final-message h2{font-family:Lilita,Arial,sans-serif;font-weight:400;letter-spacing:-.02em}.caption h2{font-size:clamp(36px,4.4vw,65px)}.caption p{font-size:15px;line-height:1.6}.caption .kicker{font-size:10px;letter-spacing:1.6px}
.final-message{left:5%;top:25%;max-width:33%}.final-message h2{font-size:clamp(40px,5.8vw,85px)}.final-message p{font-size:15px}
.controls{z-index:5;left:5%;right:5%;bottom:22px}.flavours{background:#153d2c80;border-color:#ffffff44}.flavours button{color:var(--cream)}.flavours button[aria-pressed=true]{background:var(--cream);color:var(--ink)}.skip{color:var(--cream)}
.track,.phase-index{z-index:5;color:var(--cream)}.track{background:#ffffff40}.chapter-flash{background:var(--blue);z-index:6}.demo-mark{display:none}
.finish{background:var(--blue);color:var(--cream);padding:36px 5% 100px;display:grid;grid-template-columns:.85fr 2fr;gap:32px;align-items:start}
.finish .section-head{display:block;margin:0;padding:32px 10px 0 0}.finish h2{font:400 clamp(38px,4vw,62px)/1.02 Lilita,Arial,sans-serif;letter-spacing:-.025em}.finish .lead{font-size:14px;line-height:1.7;max-width:270px}.finish .eyebrow{font-size:9px;letter-spacing:1.6px}.products{gap:18px}
.product{position:relative;min-height:470px;padding:30px 26px 25px;display:flex;flex-direction:column;align-items:stretch;gap:0;border-radius:28px;background:#ffd0ba;color:var(--ink);overflow:hidden}
.product.purple{background:#a9afff}.product .mini-jar{order:2;position:relative;max-width:none;width:100%;height:255px;transform:rotate(-8deg);margin:10px 0 0}.product.purple .mini-jar{transform:rotate(8deg)}
.product h3{font:400 clamp(28px,3vw,42px)/.98 Lilita,Arial,sans-serif;letter-spacing:-.025em;margin:0 0 10px}.product h3 br{display:none}.product p{font-size:12px;line-height:1.55;max-width:270px;margin:0 0 10px}.product button.inquiry-product{font-size:12px;position:relative;z-index:1}.mini-lid,.mini-glass{display:none}.product-jar{position:relative;inset:auto;width:100%;height:100%;display:block}
.about{position:relative;background:var(--cream);color:var(--ink);border-radius:44px 44px 0 0;gap:8%;padding:100px 7%}.about h2,.contact h2{font-family:Lilita,Arial,sans-serif;font-weight:400;letter-spacing:-.03em;line-height:1.02}.about .bear{border-radius:30px;transform:rotate(5deg);max-width:480px}.about p{font-size:16px}.names{gap:8px}.names span{border-color:#204d3540;font-size:11px}.about:before{content:'Mit Liebe. Mit Bär.';position:absolute;right:9%;bottom:50px;font-family:Lilita;font-size:25px;transform:rotate(-5deg)}
.contact{background:var(--red);color:var(--cream);margin:0;padding:75px 7%;border-radius:0;gap:8%}.contact h2{font-size:clamp(42px,5.7vw,80px)}.inquiry-open{background:var(--blue);color:white;padding:17px 25px}.mail{font-size:clamp(16px,2.1vw,28px)}.phones{font-size:14px;line-height:2.2}footer{padding:30px 5%;opacity:1;background:#173d2b;color:var(--cream)}
.inquiry-dialog{color:var(--ink)}.inquiry-aside{background:var(--blue)}.inquiry-aside h2,.inquiry-main h3,.plan-title{font-family:Lilita;font-weight:400}.inquiry-aside h2{font-size:39px}.inquiry-send{background:var(--blue)}.kind-option input:checked+span,.occasion label:has(:checked){background:#ffe980}.planner-summary{font-family:Arial,sans-serif}.inquiry-privacy,.inquiry-field em,.request-required{color:#566a55}.inquiry-close{background:#e4eadc}
@media(min-width:1700px){.intro{top:0}}
@media(max-width:1000px){.finish{grid-template-columns:1fr}.finish .section-head{display:flex;gap:40px;align-items:center}.finish h2{font-size:48px}.finish .lead{max-width:330px}.product{min-height:450px}.product-jar{height:260px}.intro h1{top:31%}.hero-stamp{right:16%}.intro .hero-copy{font-size:16px!important;max-width:190px}}
@media(max-width:760px){.nav{left:5%;right:5%;top:10px;padding:12px 0}.nav.scrolled{left:3%;right:3%;padding:12px 15px}.word{font-size:32px}.nav button.nav-cta{font-size:10px;padding:10px 12px}.links{gap:12px}.stage{height:100svh;min-height:740px}.intro{left:0;top:0;width:100%;max-width:none}.intro .eyebrow{top:15%;font-size:9px;letter-spacing:2px}.intro h1{left:4%;top:21%;width:92%;max-width:none;font-size:17vw;gap:0;letter-spacing:-.05em}.intro .hero-copy{display:block!important;left:7%;bottom:18%;max-width:155px;width:155px;font-size:13px!important;line-height:1.4!important}.intro .flavour{bottom:19%;right:7%;max-width:120px;font-size:10px}.intro .scroll-note{display:none}.hero-action{top:70%}.hero-action button{padding:14px 23px;font-size:13px}.hero-action small{display:none}.hero-stamp{top:35%;right:8%;width:73px;height:73px;font-size:10px}.hero-doodle{top:30%;left:7%;font-size:40px}.controls{bottom:22px;left:6%;right:6%;gap:16px;justify-content:center}.flavours{width:100%;justify-content:center}.flavours button{font-size:11px;flex:1;padding:11px 7px}.skip{font-size:10px}.track,.phase-index{display:none}.caption{top:16%;bottom:auto;left:7%;max-width:86%}.caption h2{font-size:36px;max-width:340px}.caption p{font-size:13px;max-width:280px}.final-message{top:16%;left:7%;max-width:86%}.final-message h2{font-size:43px}.final-message h2 br{display:none}.final-message p{max-width:270px}.finish{padding:10px 6% 65px;gap:24px}.finish .section-head{display:block;padding:20px 0 0}.finish h2{font-size:43px;max-width:330px}.finish .lead{font-size:14px}.products{grid-template-columns:1fr;gap:20px}.product{min-height:0;padding:26px}.product h3{font-size:35px}.product p{max-width:280px;font-size:13px}.product .mini-jar{height:245px}.product-jar{height:245px}.about{padding:60px 7% 90px;border-radius:28px 28px 0 0;gap:28px}.about h2,.contact h2{font-size:46px}.about .bear{max-width:320px}.about:before{bottom:35px;right:20%;font-size:24px}.about p{font-size:15px}.contact{padding:55px 7%;gap:35px}.contact p{font-size:14px}.mail{font-size:19px}footer{padding:25px 7%;line-height:1.7}.inquiry-aside h2{font-size:28px}}

@media(max-width:760px){.intro h1{font-size:14.6vw;left:5%;width:90%;gap:4%}.intro .hero-copy{top:78%;bottom:auto;margin:0;font-size:11px!important;line-height:1.3!important;max-width:180px}.intro .flavour{top:79%;bottom:auto;max-width:108px}.hero-action{top:69%}}

.jar-sizes{background:#eee9d8;color:var(--ink);padding:75px 7% 80px;text-align:center}.sizes-heading h2{font:400 clamp(40px,5vw,68px)/1.02 Lilita,Arial,sans-serif;letter-spacing:-.025em;margin:0 0 18px}.sizes-heading>p:last-child{font-size:15px;line-height:1.6}.sizes-heading .eyebrow{font-size:10px}.sizes-lineup{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;max-width:1000px;margin:30px auto 0}.size-jar{position:relative;inset:auto;width:100%;height:auto;max-width:300px;margin:0 auto;display:block}.size-name{font-size:11px;text-transform:uppercase;letter-spacing:2px;margin:0 0 10px}.size-option h3{font:400 43px/1 Lilita,Arial,sans-serif;margin:0 0 20px}.size-option h3 span{font-size:.65em}.size-option button{background:transparent;color:var(--ink);border:0;border-bottom:1px solid #204d3566;padding:0 0 7px;font-size:13px;font-weight:700}.size-option button:hover{border-color:var(--ink)}.jar-sizes+.about{border-radius:0}
@media(max-width:760px){.jar-sizes{padding:50px 5%}.sizes-heading h2{font-size:42px}.sizes-heading>p:last-child{font-size:13px;max-width:270px;margin:0 auto}.sizes-lineup{gap:7px;margin-top:25px}.size-name{font-size:9px;letter-spacing:1px}.size-option h3{font-size:30px;margin-bottom:15px}.size-option button{font-size:10px;line-height:1.5}.size-jar{margin-bottom:10px}}

/* Keep the 600 × 560 canvas proportional at every card width. */
.product .mini-jar{width:min(100%,340px);height:auto;aspect-ratio:15/14;align-self:center;margin:10px auto 0}
.product .product-jar{width:100%;height:auto;aspect-ratio:15/14}
.size-option{position:relative}
.gift-note{position:absolute;z-index:1;top:10px;left:0;width:140px;margin:0;padding:18px 12px 17px;background:#fff0a5;color:#30462b;font:700 18px/1.25 'Segoe Print','Comic Sans MS',cursive;text-align:center;transform:rotate(-9deg);box-shadow:3px 6px 9px #4c391d20;border-radius:1px 1px 13px 1px}
.gift-note:before{content:'';position:absolute;top:-8px;left:45px;width:48px;height:18px;background:#fffaf0aa;transform:rotate(4deg);border-left:1px solid #fffdf5;border-right:1px solid #fffdf5}
@media(max-width:760px){.product .mini-jar{width:min(100%,300px);height:auto}.sizes-lineup{margin-top:60px}.gift-note{top:-27px;left:0;width:100%;max-width:110px;padding:13px 5px 11px;font-size:12px}.gift-note:before{left:30%;width:37%;height:14px;top:-6px}}