:root{--blue:#0046FF;--deep:#064aab;--ink:#fff;--display:'Barlow Condensed',Impact,'Arial Narrow',sans-serif;--body:'Manrope',Arial,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--blue);color:white}body{font-family:var(--body);overflow-x:hidden}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid white;outline-offset:6px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.screen{background:var(--blue);transition:opacity .25s,visibility .25s}.screen.finished{opacity:0;visibility:hidden;pointer-events:none}.screen.exiting .logo{animation:none;opacity:0}.screen.exiting .draw{animation:erase-badge .55s .05s both}.screen.exiting .draw .badge{animation:none;fill:white;stroke-dashoffset:0}.screen.exiting .lettering{animation:none;opacity:1}.screen.exiting .letter{animation:erase-letter .45s ease-in both;stroke-width:2;fill:transparent;stroke-dashoffset:0}.screen.exiting .pattern{animation:erase-background .55s both}@keyframes erase-letter{0%{fill:#0074f4;stroke-dashoffset:0}25%{fill:transparent}100%{fill:transparent;stroke-dashoffset:1}}@keyframes erase-badge{0%,45%{opacity:1}100%{opacity:0}}@keyframes erase-background{to{opacity:0;filter:blur(5px)}}
.cheese-stage{position:relative;isolation:isolate;overflow:hidden;min-height:850px;height:100svh;background:var(--blue)}.cheese-background{position:absolute;inset:0;z-index:-2;background:url('fourlaban-background-hq.png') center/100% 100% no-repeat;opacity:.43}.topline{position:absolute;top:26px;left:5%;right:5%;display:flex;justify-content:space-between;font-size:8px;font-weight:700;letter-spacing:.18em;opacity:0}.composition{position:absolute;top:40px;bottom:115px;left:0;right:0;margin:auto;width:min(850px,94%)}.headline{position:absolute;left:0;top:0;width:100%;height:auto;overflow:visible}.headline text{font-family:var(--display);font-weight:800;font-style:italic;fill:transparent;stroke:white;stroke-width:1;stroke-dasharray:1500;stroke-dashoffset:1500;paint-order:stroke fill;stroke-linejoin:round}.title-cheese{font-size:180px}.title-b,.title-mb{font-size:310px}.burst{fill:transparent;stroke:white;stroke-width:1;stroke-dasharray:1300;stroke-dashoffset:1300;transform-origin:300px 300px}.burst-hole{fill:var(--blue);stroke:none;opacity:0}.taste{position:absolute;top:56%;display:flex;flex-direction:column;font-family:var(--display);font-size:clamp(16px,1.5vw,24px);font-weight:600;z-index:3;width:18%;gap:5px;opacity:0}.taste-left{left:0}.taste-right{right:0;text-align:right}.taste i{height:1px;width:100%;background:#ffffff9c;transform-origin:left;transform:scaleX(0)}.base{position:absolute;left:50%;top:66%;width:160vw;height:90vh;transform:translateX(-50%) rotate(14deg);background:#0749a1;z-index:-1;opacity:0;box-shadow:0 -1px 0 #63b6ff66}.base-top{position:absolute;left:0;top:-135px;height:135px;right:0;background:linear-gradient(90deg,#0477dc,#0069d8);transform:skewX(-48deg);transform-origin:bottom;box-shadow:inset 0 -1px 0 #5faaf06b}.cake-shadow{position:absolute;width:450px;height:85px;left:53%;top:-95px;border-radius:50%;background:#003e8c77;filter:blur(8px);transform:rotate(-8deg)}.dessert{position:absolute;top:33%;left:50%;width:72%;aspect-ratio:1.25;z-index:4;opacity:0;transform:translateX(-50%) translateY(70px) scale(.86);transform-origin:50% 80%;will-change:transform,opacity}.dessert img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(7px 16px 11px #003e8c22)}.yum{position:absolute;right:-5%;bottom:9%;z-index:5;transform:rotate(-10deg) scale(.65);opacity:0;font-family:var(--display);font-weight:900;color:#8ac9ff;font-size:42px;line-height:.78;text-align:center;letter-spacing:-.03em}.yum>span{display:block}.yum>span:nth-child(2){margin-left:12px}.yum svg{width:80px;height:30px;stroke:#8ac9ff;stroke-width:2;fill:none;stroke-linecap:round}.spark{position:absolute;z-index:3;color:#8ac9ff;opacity:0}.spark-one{left:7%;top:75%;font-size:33px}.spark-two{right:7%;top:43%;font-size:24px}.hero-footer{position:absolute;bottom:24px;left:5%;right:5%;display:grid;grid-template-columns:auto auto 1fr;gap:15px 20px;align-items:end;opacity:0;z-index:6}.footer-logo{position:absolute;left:-5px;bottom:85px;width:86px;height:86px}.footer-logo img{width:100%;height:100%;object-fit:contain}.footer-line{grid-column:1/-1;height:1px;background:#ffffff55}.address{font-size:11px;line-height:1.6;font-weight:600}.address>span{margin-left:8px}.phone{font-size:12px;font-weight:600;padding-left:18px;border-left:1px solid #ffffff55;align-self:end;margin-bottom:2px}.order{justify-self:end;display:flex;flex-direction:column;gap:8px}.order>span{font-size:7px;letter-spacing:.12em;color:#b4dbff}.order>strong{font-size:13px;font-weight:800;display:flex;gap:35px;align-items:center}.order strong span{font-size:20px}.order:hover strong{text-decoration:underline;text-underline-offset:5px}
.shown .headline text{animation:title-draw .7s cubic-bezier(.3,0,.2,1) forwards,title-fill .3s .48s ease-out forwards}.shown .title-b,.shown .title-mb{animation-delay:.12s,.6s}.shown .burst{animation:burst-draw .6s .2s ease-out forwards,title-fill .25s .6s forwards}.shown .burst-hole{animation:fade-in .3s .6s forwards}.shown .dessert{animation:cake-enter .9s .38s cubic-bezier(.16,1,.3,1) forwards}.shown .base{animation:base-enter .7s .3s ease-out forwards}.shown .taste{animation:side-enter .45s .95s ease-out forwards}.shown .taste i{animation:line-in .45s 1.05s ease-out forwards}.shown .yum{animation:yum-pop .7s 1.02s cubic-bezier(.34,1.56,.64,1) forwards}.shown .spark{animation:spark-in .6s 1.1s both}.shown .spark-two{animation-delay:1.3s}.shown .hero-footer,.shown .topline{animation:fade-in .5s 1.2s forwards}@keyframes title-draw{to{stroke-dashoffset:0}}@keyframes title-fill{to{fill:white;stroke-width:0}}@keyframes burst-draw{to{stroke-dashoffset:0}}@keyframes fade-in{to{opacity:1}}@keyframes cake-enter{0%{opacity:0;transform:translateX(-50%) translateY(70px) scale(.86)}70%{opacity:1;transform:translateX(-50%) translateY(-8px) scale(1.015)}100%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}@keyframes base-enter{from{opacity:0;translate:0 45px}to{opacity:1;translate:0 0}}@keyframes side-enter{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}@keyframes line-in{to{transform:scaleX(1)}}@keyframes yum-pop{0%{opacity:0;transform:rotate(-17deg) scale(.65)}100%{opacity:1;transform:rotate(-10deg) scale(1)}}@keyframes spark-in{from{opacity:0;transform:rotate(-80deg) scale(.3)}to{opacity:.9;transform:rotate(0) scale(1)}}
@media(min-width:1500px){.composition{width:880px;top:25px;bottom:120px}.dessert{width:70%;top:31%}.hero-footer{left:7%;right:7%}.yum{right:-32%;bottom:5%;font-size:50px}.taste-left{left:-15%}.taste-right{right:-15%}.taste{width:24%}.spark-one{left:-15%}.spark-two{right:-15%}}
@media(max-height:780px) and (min-width:701px){.cheese-stage{min-height:760px}.composition{width:720px;top:25px;bottom:125px}.dessert{width:68%;top:33%}.hero-footer{bottom:20px}.footer-logo{width:70px;height:70px;bottom:75px}.yum{right:-8%;bottom:7%}}
@media(max-width:700px){.cheese-stage{min-height:800px;height:100svh}.topline{top:22px;left:6%;right:6%;font-size:6px;letter-spacing:.1em}.topline span:last-child{display:none}.composition{top:65px;bottom:160px;width:96%}.headline{top:0;left:-5%;width:110%;transform:rotate(-3deg)}.dessert{top:34%;width:94%;max-width:520px}.taste{top:57%;font-size:17px;width:21%;gap:6px}.taste-left{left:3%}.taste-right{right:3%}.yum{right:4%;bottom:0;font-size:34px}.yum svg{width:65px;height:25px}.base{top:66%;width:230vw}.cake-shadow{width:280px;height:55px;left:49%;top:-77px}.base-top{top:-90px;height:90px}.spark-one{left:3%;top:77%;font-size:24px}.spark-two{right:7%;top:32%;font-size:20px}.hero-footer{left:6%;right:6%;bottom:22px;grid-template-columns:1fr auto;gap:12px 10px}.footer-logo{width:80px;height:80px;bottom:93px;left:-7px}.address{font-size:10px}.phone{grid-column:1;grid-row:3;border:0;padding:0;font-size:11px}.order{grid-column:2;grid-row:2/4;align-self:center}.order>span{font-size:6px;letter-spacing:.08em}.order>strong{font-size:11px;gap:15px}.order strong span{font-size:18px}}
@media(max-width:420px){.cheese-stage{min-height:760px}.composition{top:66px;bottom:166px}.dessert{top:33%;width:96%}.taste{top:57%;font-size:14px;width:21%}.yum{bottom:0;font-size:31px}.footer-logo{width:72px;height:72px;bottom:88px}.address{font-size:9px}.hero-footer{gap:10px}.phone{font-size:10px}.order>strong{font-size:10px;gap:10px}.spark-one{top:74%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0s!important;transition:none!important}.cheese-stage .dessert{opacity:1;transform:translateX(-50%)}.cheese-stage .headline text,.cheese-stage .burst{fill:white;stroke:none}.cheese-stage .burst-hole,.cheese-stage .hero-footer,.cheese-stage .yum,.cheese-stage .taste,.cheese-stage .base,.cheese-stage .topline{opacity:1}.cheese-stage .yum{transform:rotate(-10deg)}.cheese-stage .taste i{transform:scaleX(1)}}
/* Keep the cake seated on the platform and side copy legible. */
.base{top:85%;transform:translateX(-50%) rotate(8deg)}
@media(max-width:700px){.base{top:73%;transform:translateX(-50%) rotate(12deg)}.taste{z-index:5;width:21%;font-size:14px}}
@media(max-width:420px){.taste{font-size:12px}}
/* A more compact, centered headline and product composition. */
@media(min-width:701px){.composition{width:min(720px,82vw);top:95px;bottom:145px}.dessert{width:70%;top:34%}}
@media(min-width:1500px){.composition{width:760px;top:75px;bottom:145px}}
@media(max-height:780px) and (min-width:701px){.composition{width:640px;top:65px;bottom:140px}.dessert{width:68%;top:34%}}
