/* Hero composition inspired by the supplied Monster Burguer reference. */
.hero{display:block;min-height:0;height:auto;aspect-ratio:1.65;max-height:960px;isolation:isolate;background:#050c17;padding:4.5% 4.2% 17%}
.hero-photo{inset:0;width:100%;height:calc(100% - clamp(115px,14vw,190px) - 24px);object-fit:cover;object-position:center;filter:none;z-index:-3}
.hero-shade{z-index:-2;background:linear-gradient(90deg,rgba(3,9,18,.82),rgba(3,9,18,.3) 36%,transparent 59%),linear-gradient(0deg,#050b14 0%,rgba(5,11,20,.1) 35%,transparent 70%)}
.hero-copy{margin:0;max-width:45%;position:relative;z-index:1}
.hero-copy .eyebrow{font-size:clamp(9px,1.05vw,16px);letter-spacing:3px;color:#21acff;font-weight:600}
.hero h1{font-size:clamp(58px,8.8vw,135px);line-height:.99;letter-spacing:-2px;color:#f5f7fa;margin:17px 0 0;text-shadow:0 2px 12px #0005}
.hero-brush{display:block;width:76%;height:auto;max-height:35px;margin:5px 0 9px}
.hero-copy p{font-size:clamp(13px,1.65vw,23px);font-weight:400;line-height:1.3;color:#f5f7fa;margin:13px 0 22px}
.hero .button{border-radius:40px;padding:14px 30px;min-width:215px;gap:13px;justify-content:center;background:#1257ff;box-shadow:0 4px 28px #1260ff55;font-size:12px;letter-spacing:1px;font-weight:600}
.hero .button:hover{background:#347bff}
.hero .button span{font-size:20px}
.hero-categories{position:absolute;bottom:22px;left:1%;right:1%;display:grid;grid-template-columns:1fr 1.12fr 1.05fr;gap:14px;z-index:2}
.hero-category{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:flex-end;overflow:hidden;border:1px solid #ffffff4d;border-radius:13px;height:clamp(115px,14vw,190px);padding:20px 28px;background:#080c13;transition:border-color .2s,transform .2s}
.hero-category:hover{border-color:#55dfff;transform:translateY(-4px)}
.hero-category img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 50%;z-index:-2}
.hero-category:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 5%,#03070b35 30%,#03070be8 64%);z-index:-1}
.hero-category h2{font-family:Anton,Impact,sans-serif;font-size:clamp(16px,1.8vw,27px);letter-spacing:0;line-height:1.13;margin:0;max-width:60%;text-shadow:0 2px 8px #000}
.hero-category>span{position:absolute;bottom:12px;right:12px;border:1px solid white;border-radius:50%;width:29px;height:29px;display:grid;place-items:center;font-size:21px;line-height:1}
@media(min-width:1600px){.hero{padding-top:65px}.hero h1{font-size:140px}}
@media(max-width:1000px) and (min-width:701px){.hero{aspect-ratio:1.48;padding-top:4%}.hero h1{font-size:8.7vw}.hero-category{padding:15px}.hero-category h2{font-size:1.9vw}.hero .button{padding:10px 22px;min-width:190px}.hero-copy p{margin:10px 0 16px}.hero-categories{bottom:16px;gap:10px}}
@media(max-width:700px){.hero{aspect-ratio:auto;max-height:none;min-height:0;padding:315px 6% 22px}.hero-photo{height:470px;width:100%;object-fit:cover;object-position:75% top;inset:0;filter:none}.hero-shade{background:linear-gradient(0deg,#050b14 0%,#050b14 27%,#050b14ed 48%,transparent 77%)}.hero-copy{max-width:100%;margin:0}.hero h1{font-size:clamp(64px,14vw,90px);letter-spacing:-1px;margin-top:13px}.hero-copy .eyebrow{font-size:10px;letter-spacing:2.6px}.hero-brush{width:245px;max-height:27px}.hero-copy p{font-size:17px;margin:12px 0 22px}.hero .button{padding:14px 26px;min-width:210px}.hero-categories{position:relative;inset:auto;grid-template-columns:1fr;gap:12px;margin-top:30px}.hero-category{height:125px;padding:18px 22px;justify-content:flex-start;padding-left:51%}.hero-category h2{font-size:23px;max-width:100%}.hero-category img{object-position:30% 50%}.hero-category:after{background:linear-gradient(90deg,transparent,#03070b33 25%,#03070be8 57%)}.hero-category>span{width:27px;height:27px}}

/* Supplied Monster Burguer logo. */
header .logo,footer .logo{display:block;transform:none;flex-shrink:0;line-height:0}
header .logo img{display:block;width:92px;height:92px;object-fit:contain}
footer .logo img{display:block;width:112px;height:112px;object-fit:contain}
@media(max-width:800px){header .logo img{width:74px;height:74px}footer .logo img{width:96px;height:96px}}
/* Official menu, imported from Brendi. */
.menu-controls{flex-wrap:wrap}
.menu-status{color:#9da6b8;font-size:11px;letter-spacing:.6px;margin:-10px 0 22px}
.product{display:flex;flex-direction:column;min-width:0}
.product-copy{display:flex;flex-direction:column;flex:1}
.product h3{overflow-wrap:anywhere}
.product-description{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.product-price{font-size:19px;font-weight:800;color:#ffb347;margin:18px 0 0}
.product-copy .product-price{margin-top:auto;padding-top:18px}
.product-copy button{margin-top:18px}
.product-drink .product-image{background:#f5f7fa}
.product-drink .product-image img{object-fit:contain}
.menu-foot{line-height:1.8}
.menu-foot a{color:#55dfff;text-decoration:underline;text-underline-offset:3px}
.dialog-copy p{white-space:pre-line}
.dialog-copy .order-link{margin-top:24px;display:flex;justify-content:center}
.visit a{color:#55dfff;text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){.menu-controls button{flex:1 1 calc(33.333% - 8px);padding:12px 8px}.menu-foot{font-size:11px}.product-price{font-size:20px}}

/* Compact menu keeps the 240px source photos crisp and easy to scan. */
.menu .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.menu .product{flex-direction:row;align-items:flex-start;gap:18px;padding:18px;border-radius:12px}
.menu .product:hover{transform:translateY(-2px)}
.menu .product-image{flex:0 0 120px;width:120px;height:120px;border-radius:8px;background:#080e18}
.menu .product-image img{object-fit:contain}
.menu .product:hover img{transform:none}
.menu .product-image .badge{display:none}
.menu .product-copy{padding:0;min-width:0;align-self:stretch}
.menu .product h3{font-size:22px;line-height:1.16;margin:0 0 8px;letter-spacing:0}
.menu .product p{font-size:11px;line-height:1.65;min-height:0;margin:0 0 10px;-webkit-line-clamp:2}
.menu .product-copy .product-price{font-size:17px;padding-top:5px;margin-top:auto}
.menu .product-copy button{font-size:8px;letter-spacing:.7px;margin-top:10px;padding-top:10px}
.menu .product-copy button span{font-size:17px}
.menu .product-drink .product-image{background:#f5f7fa}
dialog>img{display:block;width:200px;height:200px;object-fit:contain;margin:28px auto 0;border-radius:10px;background:#080e18}
.dialog-copy{padding-top:22px}
@media(min-width:1500px){.menu .products{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1050px){.menu .products{grid-template-columns:1fr}}
@media(max-width:480px){.menu .product{gap:12px;padding:13px}.menu .product-image{flex-basis:96px;width:96px;height:96px}.menu .product h3{font-size:20px}.menu .product p{font-size:10px}.menu .product-copy .product-price{font-size:16px}.menu .products{gap:12px}dialog>img{width:180px;height:180px}}

/* Monster manifesto: a street poster and an editorial introduction. */
.manifesto{grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);gap:clamp(35px,6vw,95px);padding-top:110px;padding-bottom:110px;overflow:hidden;background:radial-gradient(ellipse at 22% 55%,#11274b55,transparent 55%),#070b14}
.monster-poster{position:relative;isolation:isolate;transform:rotate(-2deg);padding:24px 24px 20px;background:#081325;border:1px solid #3085ff66;box-shadow:12px 14px 0 #101e3880,0 25px 70px #0005}
.monster-poster:before{content:'';position:absolute;inset:0;z-index:-1;opacity:.22;background:repeating-linear-gradient(0deg,transparent 0 3px,#55dfff14 3px 4px);pointer-events:none}
.monster-poster:after{content:'';position:absolute;top:-12px;left:38%;width:105px;height:28px;transform:rotate(6deg);background:#a0b3ca55;border:1px solid #cedef233;backdrop-filter:blur(3px)}
.poster-topline,.poster-bottomline{display:flex;justify-content:space-between;gap:10px;font-size:8px;font-weight:600;letter-spacing:1.4px;color:#7e9ec7}
.poster-topline{padding-bottom:17px;border-bottom:1px solid #ffffff20}
.poster-headline{position:relative;z-index:1;font-family:Anton,Impact,sans-serif;font-size:clamp(32px,4.2vw,64px);line-height:1.03;letter-spacing:-.7px;margin:22px 0 -5px;color:#f5f7fa}
.poster-headline span{color:#55dfff}
.poster-mascot{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;mix-blend-mode:lighten;margin:-8px 0 0;transform:rotate(2deg)}
.poster-sticker{position:absolute;top:30%;right:-20px;z-index:2;padding:15px 20px;background:#ffb347;color:#070b14;transform:rotate(9deg);font-size:10px;font-weight:800;letter-spacing:.6px;box-shadow:3px 5px 0 #0004}
.poster-sticker strong{font-family:Anton,Impact,sans-serif;font-size:25px;display:block;letter-spacing:0;margin-top:2px}
.poster-sticker svg{display:block;width:45px;height:18px;margin-top:5px}
.poster-ticket{display:flex;align-items:center;gap:14px;padding:18px;margin:0 -10px 18px;background:#246bfd;color:white;border-top:1px dashed #ffffff70;border-bottom:1px dashed #ffffff70;transform:rotate(2deg)}
.ticket-star{font-size:42px;color:#55dfff;line-height:1}
.poster-ticket small{display:block;font-size:7px;letter-spacing:1.6px;margin-bottom:8px;color:#d6e8ff}
.poster-ticket strong{display:block;font-family:Anton,Impact,sans-serif;font-size:23px;font-weight:400;letter-spacing:.3px;line-height:1.2}
.poster-ticket strong span{color:#55dfff;margin-left:10px;white-space:nowrap}
.poster-ticket>a{display:grid;place-items:center;flex-shrink:0;width:35px;height:35px;margin-left:auto;border:1px solid #ffffff80;border-radius:50%;font-size:25px}
.poster-ticket>a:hover{background:#070b14}
.manifesto-copy .eyebrow{font-size:9px;letter-spacing:1.8px}
.manifesto-copy h2{position:relative;font-size:clamp(44px,4.8vw,74px);line-height:1.06;letter-spacing:-.7px;margin:24px 0 30px}
.manifesto-underline{display:block;width:65%;max-width:285px;height:18px;color:#55dfff;margin-top:5px}
.manifesto-copy .manifesto-intro{font-size:15px;line-height:1.7;color:#d0d9e7;margin:0 0 25px;max-width:none}
.monster-principles{border-top:1px solid #ffffff20;margin:0 0 27px}
.monster-principles>div{display:flex;gap:18px;border-bottom:1px solid #ffffff13;padding:17px 0}
.principle-number{font-family:Anton,Impact,sans-serif;font-size:19px;color:#55dfff;flex-shrink:0;line-height:1.2}
.monster-principles h3{font-family:Inter,Arial,sans-serif;font-size:10px;font-weight:800;line-height:1.5;letter-spacing:.7px;margin:0 0 5px}
.monster-principles p{font-size:11px;line-height:1.7;margin:0;max-width:370px;color:#8f9fb6}
.manifesto-cta{gap:26px;padding:15px 21px;font-size:10px}
.manifesto-signoff{display:block;margin-top:17px;font-size:7px;letter-spacing:1.5px;color:#75849b}
@media(min-width:1600px){.monster-poster{max-width:610px;justify-self:center;width:100%}.manifesto-copy h2{font-size:78px}}
@media(max-width:1000px){.manifesto{gap:35px;padding-left:6%;padding-right:6%}.monster-poster{padding:18px}.poster-ticket{gap:9px;padding:14px 10px}.poster-ticket strong{font-size:18px}.poster-ticket strong span{margin-left:5px}.ticket-star{font-size:30px}.poster-ticket small{font-size:6px;letter-spacing:1px}.poster-topline,.poster-bottomline{font-size:6px;letter-spacing:1px}.poster-sticker{right:-13px;padding:12px}.manifesto-copy h2{font-size:46px}.manifesto-copy .eyebrow{font-size:8px;letter-spacing:1px}.manifesto-copy .manifesto-intro{font-size:13px}}
@media(max-width:760px){.manifesto{grid-template-columns:1fr;gap:55px;padding-top:65px;padding-bottom:65px}.monster-poster{width:100%;max-width:480px;justify-self:center}.poster-headline{font-size:clamp(40px,10vw,60px)}.poster-topline,.poster-bottomline{font-size:7px}.poster-ticket strong{font-size:22px}.poster-ticket small{font-size:7px}.poster-sticker{top:31%;right:-8px}.manifesto-copy h2{font-size:clamp(47px,11vw,68px)}.manifesto-copy .eyebrow{font-size:9px}.manifesto-copy .manifesto-intro{font-size:15px}.monster-principles p{font-size:12px;max-width:none}.monster-principles h3{font-size:10px}.manifesto-signoff{font-size:8px}.manifesto-cta{width:100%;justify-content:space-between;padding:17px 23px}}
@media(prefers-reduced-motion:reduce){.monster-poster,.poster-mascot,.poster-ticket{transform:none}}

/* Real storefront: preserve the portrait photo without stretching it. */
.place-layout{grid-template-columns:minmax(0,335px) minmax(0,1fr);gap:28px;max-width:960px;margin-left:auto;margin-right:auto;align-items:center}
.place-image{overflow:hidden;background:#050911;border:1px solid #246bfd40;border-radius:16px;min-height:0;isolation:isolate;box-shadow:0 18px 45px #0004}
.place-image:before{content:none}
.place-image img{position:static;display:block;width:100%;max-width:none;height:auto;inset:auto;margin:0;object-fit:contain;filter:none}
.place-image>span{z-index:1;left:12px;bottom:12px;font-size:7px;max-width:calc(100% - 24px)}
.place-layout .visit{border-radius:16px;width:100%;padding:32px}
@media(max-width:760px){.place-layout{grid-template-columns:1fr;gap:22px}.place-image{width:100%;max-width:335px;justify-self:center;min-height:0}.place-layout .visit{padding:28px}}
