@import url('assets/fonts.css');

:root{
  --pink:#ee3f8a;--pink-soft:#ff8fbf;--lime:#c8fb4c;--black:#141014;--cream:#f3ede2;--white:#fffdf8;
  --body:'Nunito','DM Sans',Arial,sans-serif;
  --display:'Matcha World','Arial Black',sans-serif;
  --second:'Mistur Sleuth',Georgia,serif;
  --marker:'Gochi Hand','Permanent Marker',cursive;
  --page:min(1320px,calc(100% - 80px));
}
*{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;overflow-x:clip;color:var(--black);background:var(--pink);font:16px/1.6 var(--body)}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:3px solid var(--black);outline-offset:5px}
.menu-section a:focus-visible,.franchise a:focus-visible,.franchise button:focus-visible,.site-footer a:focus-visible{outline-color:var(--lime)}
::selection{background:var(--lime);color:var(--black)}
.skip-link{position:fixed;top:-80px;left:20px;z-index:20;padding:10px 20px;background:var(--lime);border:2px solid var(--black)}
.skip-link:focus{top:15px}

/* top bar */
.scream-bar{background:var(--lime);border-bottom:3px solid var(--black);padding:11px 20px;text-align:center}
.scream-bar p{margin:0;font:400 19px/1.25 var(--display);letter-spacing:1px}
.sep{display:inline-block;width:.4em;height:.4em;border-radius:50%;background:var(--pink);vertical-align:middle}.scream-bar a{border-bottom:2px solid var(--black)}.scream-bar a:hover{color:var(--pink)}.footer-links{display:flex;gap:28px;flex-wrap:wrap}.footer-links a:hover{color:var(--pink-soft)}.visit-copy .hero-actions .button{font-size:19px}.scream-bar span{font-family:var(--body);font-weight:900;margin:0 14px;color:var(--pink)}

/* header + hero share one framed card */
.shell{width:var(--page);margin:40px auto 0;background:var(--cream);border:3px solid var(--black);box-shadow:10px 10px 0 var(--black)}
.site-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:18px 40px;background:var(--black);color:var(--cream)}
.screamers-brand{grid-column:2;grid-row:1;display:flex;align-items:center;gap:8px;transform:rotate(-3deg)}
.brand-logo{width:72px;height:72px;object-fit:contain}
.brand-type{display:flex;flex-direction:column;gap:4px}
.brand-type strong{font:400 32px/.94 var(--display);color:var(--pink);-webkit-text-stroke:1.5px var(--black);paint-order:stroke fill;text-shadow:2px 3px 0 var(--lime)}
.brand-type>span{font-size:12px;font-weight:900;letter-spacing:1px;color:var(--lime)}
.site-header nav{grid-column:1;grid-row:1;display:flex;gap:26px;font-size:15px;font-weight:800}
.site-header nav a{border-bottom:2px solid transparent}
.site-header nav a:hover{border-color:var(--lime);color:var(--lime)}
.header-link{justify-self:end;font-size:13px;font-weight:900;letter-spacing:.4px;white-space:nowrap;border:2px solid var(--black);padding:10px 16px;background:var(--lime);color:var(--black);box-shadow:3px 3px 0 var(--pink)}
.header-link span{margin-left:8px}

.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:30px;padding:48px 48px 56px}
.eyebrow{display:inline-block;margin:0;padding:7px 14px;background:var(--black);color:var(--lime);font-size:13px;font-weight:900;letter-spacing:1.4px;transform:rotate(-2deg)}
.hero h1{margin:24px 0 20px;font:400 clamp(58px,6.3vw,92px)/.92 var(--display);color:var(--lime);-webkit-text-stroke:3px var(--black);paint-order:stroke fill;text-shadow:5px 6px 0 var(--black)}
.hero h1>span{display:inline-block;color:var(--pink);transform:rotate(-2deg)}
.hero-intro{max-width:470px;margin:0 0 28px;font-size:18px;font-weight:600;line-height:1.6}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px}

.button{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 16px 13px 22px;border:3px solid var(--black);font:400 20px/1.1 var(--display);box-shadow:5px 5px 0 var(--black);transition:transform .15s,box-shadow .15s}
.button>span{display:grid;place-items:center;width:28px;height:28px;border:2px solid var(--black);border-radius:50%;background:var(--white);color:var(--black);font:900 17px/1 var(--body)}
.button:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--black)}
.primary-button{background:var(--pink);color:var(--white)}
.lime-button{background:var(--lime);color:var(--black)}

.hero-art{position:relative}
.photo-slot,.storefront-slot{display:grid;place-items:center;aspect-ratio:4/3;border:3px dashed var(--black);background:repeating-linear-gradient(-45deg,var(--white) 0 22px,#ffe0ee 22px 44px)}
.photo-slot{transform:rotate(2deg)}
.hero-art img{display:block;width:100%;height:auto;border:3px solid var(--black)}
.slot-note{font:400 clamp(26px,2.6vw,36px)/1.15 var(--marker);text-align:center;transform:rotate(-4deg)}
.postcards{position:relative;aspect-ratio:1/1.02;margin-top:clamp(70px,8vw,110px)}.postcard{position:absolute;width:52%;margin:0;filter:drop-shadow(3px 0 0 var(--black)) drop-shadow(-3px 0 0 var(--black)) drop-shadow(0 3px 0 var(--black)) drop-shadow(0 -3px 0 var(--black)) drop-shadow(7px 7px 0 var(--black));transition:transform .2s}.stamp-paper{--r:7px;padding:calc(2.2*var(--r));background:var(--white);-webkit-mask:radial-gradient(var(--r),#0000 97%,#000) round calc(-1.5*var(--r)) calc(-1.5*var(--r))/calc(3*var(--r)) calc(3*var(--r)),linear-gradient(#000 0 0) no-repeat 50%/calc(100% - 3*var(--r)) calc(100% - 3*var(--r));mask:radial-gradient(var(--r),#0000 97%,#000) round calc(-1.5*var(--r)) calc(-1.5*var(--r))/calc(3*var(--r)) calc(3*var(--r)),linear-gradient(#000 0 0) no-repeat 50%/calc(100% - 3*var(--r)) calc(100% - 3*var(--r))}.stamp-paper>img{display:block;width:100%;height:auto;border:2px solid var(--black);transform:none}.postcard figcaption{padding:9px 2px 0;font:400 clamp(19px,1.8vw,25px)/1.1 var(--marker);text-align:center;white-space:nowrap}.postcard-one{left:0;top:17%;transform:rotate(-7deg);z-index:2}.postcard-two{right:1%;top:0;transform:rotate(6deg);z-index:1}.postcard-two figcaption{text-align:right;padding-right:6px}.postmark{position:absolute;z-index:4;left:30%;top:-13%;width:clamp(120px,15vw,190px);transform:rotate(-12deg);opacity:.9;pointer-events:none}.postmark svg{display:block;width:100%;height:auto}.postmark img{position:absolute;left:27.3%;top:50%;width:26%;height:auto;border:0;transform:translate(-50%,-50%)}.postcard:hover{z-index:3;transform:rotate(0) scale(1.03)}.loc-label{margin:0 0 10px;font-size:13px;font-weight:900;letter-spacing:2px}.franchise .loc-label{color:var(--lime)}.status-chip{display:inline-block;padding:4px 12px;background:var(--pink);color:var(--white);border:2px solid var(--black);font:900 12px/1.3 var(--body);letter-spacing:1px;vertical-align:middle;transform:rotate(-2deg)}.visit-place .status-chip{margin-left:10px}.page-intro{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);padding-bottom:60px}.intro-art{display:grid;place-items:center}.intro-art img{width:min(300px,100%);height:auto;transform:rotate(8deg);filter:drop-shadow(8px 8px 0 var(--black))}.next-card .button{font-size:17px;gap:12px}.page-intro .hero-intro{max-width:620px}.site-header nav a[aria-current=page]{color:var(--lime);border-color:var(--lime)}.locations{padding:72px 0 80px}.locations-inner{width:var(--page);margin:0 auto}.locations-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:36px;padding-bottom:18px;border-bottom:3px solid var(--black)}.locations-head h2{margin:0;font:400 clamp(40px,4.4vw,60px)/1 var(--display);color:var(--white);-webkit-text-stroke:2.5px var(--black);paint-order:stroke fill;text-shadow:4px 4px 0 var(--black)}.loc-count{margin:0;font-size:14px;font-weight:900;letter-spacing:1.5px}.locations-grid{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(0,1fr);gap:36px;align-items:stretch}.location-card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--cream);border:3px solid var(--black);box-shadow:10px 10px 0 var(--black)}.location-media{display:grid;place-items:center;padding:26px;background:var(--lime);border-right:3px solid var(--black)}.location-img{display:block;width:100%;height:auto;filter:drop-shadow(6px 6px 0 var(--black))}.location-body{display:flex;flex-direction:column;align-items:flex-start;padding:30px 28px}.location-body h3,.next-card h3{margin:0;font:400 clamp(34px,3vw,44px)/1 var(--second)}.location-body .status-chip{margin:12px 0 4px}.loc-details{width:100%;margin:12px 0 24px}.loc-details div{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:2px dashed #14101440}.loc-details dt{font-weight:900}.loc-details dd{margin:0;font-weight:600}.next-card{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:32px 28px;background:transparent;border:3px dashed var(--black);box-shadow:none}.next-card>p:not(.loc-label){margin:12px 0 22px;font-size:17px;font-weight:700;line-height:1.55}.rating-sticker{position:absolute;right:8%;bottom:-24px;display:grid;place-items:center;width:128px;height:128px;border:3px solid var(--black);border-radius:50%;background:var(--lime);font:400 22px/1.05 var(--display);text-align:center;transform:rotate(10deg);box-shadow:4px 4px 0 var(--black)}

/* strip */
.rewind-strip{margin-top:64px;padding:14px 0;background:var(--black);overflow:hidden;transform:rotate(-1deg) scale(1.02);position:relative;z-index:3}
.rewind-strip>.marquee-track{display:flex;width:max-content;white-space:nowrap;font:400 27px/1.2 var(--display);color:var(--lime);animation:marquee 32s linear infinite}.marquee-group{flex-shrink:0}.rewind-strip:hover .marquee-track{animation-play-state:paused}@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.rewind-strip span{margin:0 26px;color:var(--pink);font:900 24px/1 var(--body)}

/* menu */
.drip{position:relative;z-index:4;height:78px;margin:-2px 0 -78px;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22360%22 height=%2278%22 viewBox=%220 0 360 78%22%3E%3Cpath d=%22M0 16 Q15.0 21 26.0 17 Q30.0 18 30.0 24 L30.0 46 A10.0 10.0 0 0 0 50.0 46 L50.0 24 Q50.0 18 54.0 17 Q69.5 21 85.0 17 Q89.0 18 89.0 24 L89.0 32 A7.0 7.0 0 0 0 103.0 32 L103.0 24 Q103.0 18 107.0 17 Q120.5 21 134.0 17 Q138.0 18 138.0 24 L138.0 60 A12.0 12.0 0 0 0 162.0 60 L162.0 24 Q162.0 18 166.0 17 Q184.0 21 202.0 17 Q206.0 18 206.0 24 L206.0 38 A8.0 8.0 0 0 0 222.0 38 L222.0 24 Q222.0 18 226.0 17 Q239.5 21 253.0 17 Q257.0 18 257.0 24 L257.0 52 A11.0 11.0 0 0 0 279.0 52 L279.0 24 Q279.0 18 283.0 17 Q297.0 21 311.0 17 Q315.0 18 315.0 24 L315.0 30 A7.0 7.0 0 0 0 329.0 30 L329.0 24 Q329.0 18 333.0 17 Q344.5 21 360 16 L360 0 L0 0 Z%22 fill=%22%23fff3d6%22/%3E%3Cpath d=%22M0 16 Q15.0 21 26.0 17 Q30.0 18 30.0 24 L30.0 46 A10.0 10.0 0 0 0 50.0 46 L50.0 24 Q50.0 18 54.0 17 Q69.5 21 85.0 17 Q89.0 18 89.0 24 L89.0 32 A7.0 7.0 0 0 0 103.0 32 L103.0 24 Q103.0 18 107.0 17 Q120.5 21 134.0 17 Q138.0 18 138.0 24 L138.0 60 A12.0 12.0 0 0 0 162.0 60 L162.0 24 Q162.0 18 166.0 17 Q184.0 21 202.0 17 Q206.0 18 206.0 24 L206.0 38 A8.0 8.0 0 0 0 222.0 38 L222.0 24 Q222.0 18 226.0 17 Q239.5 21 253.0 17 Q257.0 18 257.0 24 L257.0 52 A11.0 11.0 0 0 0 279.0 52 L279.0 24 Q279.0 18 283.0 17 Q297.0 21 311.0 17 Q315.0 18 315.0 24 L315.0 30 A7.0 7.0 0 0 0 329.0 30 L329.0 24 Q329.0 18 333.0 17 Q344.5 21 360 16%22 fill=%22none%22 stroke=%22%23141014%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cellipse cx=%2235.0%22 cy=%2244.0%22 rx=%222.5%22 ry=%224.0%22 fill=%22%23ffffff%22 opacity=%22.9%22/%3E%3Cellipse cx=%22144.0%22 cy=%2258.0%22 rx=%223.0%22 ry=%224.8%22 fill=%22%23ffffff%22 opacity=%22.9%22/%3E%3Cellipse cx=%22210.0%22 cy=%2236.0%22 rx=%222.0%22 ry=%223.2%22 fill=%22%23ffffff%22 opacity=%22.9%22/%3E%3Cellipse cx=%22262.5%22 cy=%2250.0%22 rx=%222.8%22 ry=%224.4%22 fill=%22%23ffffff%22 opacity=%22.9%22/%3E%3C/svg%3E") repeat-x 0 0/360px 78px;transform:rotate(-1deg) scale(1.02);pointer-events:none}
.menu-section{margin-top:-12px;padding:96px max(6%,calc((100% - 1200px)/2)) 64px;background:var(--black);color:var(--cream)}
.menu-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:48px}
.menu-head h2{margin:0;font:400 clamp(50px,5.6vw,80px)/.95 var(--second);color:var(--white)}
.menu-head h2 span{color:var(--lime)}
.menu-head p{max-width:360px;margin:0;font-size:17px;line-height:1.6}
.menu-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:start}
.menu-col{padding:30px 34px 14px;border:3px solid var(--black);color:var(--black)}
.sodas{background:var(--lime);box-shadow:8px 8px 0 var(--pink);transform:rotate(-.6deg)}
.floats{background:var(--pink-soft);box-shadow:8px 8px 0 var(--lime);transform:rotate(.6deg)}
.menu-col h3{display:inline-block;margin:0 0 8px;padding:7px 18px;background:var(--black);font:400 26px/1.1 var(--display);transform:rotate(-2deg)}
.sodas h3{color:var(--lime)}
.floats h3{color:var(--pink-soft)}
.menu-col ul{list-style:none;margin:0;padding:0}
.menu-item{padding:16px 0;border-bottom:2px dashed #14101466}
.menu-item:last-child{border-bottom:0}
.menu-item h4{margin:0;font:400 30px/1.1 var(--second)}
.menu-item p{margin:5px 0 0;font-size:15px;font-weight:700;line-height:1.5}
.matcha::before{content:"";position:absolute;left:0;right:0;top:0;height:60px;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22240%22 height=%2260%22 viewBox=%220 0 240 60%22%3E%3Cpath d=%22M0 12 Q9.5 16 16.0 13 Q19.0 14 19.0 19 L19.0 34 A7.0 7.0 0 0 0 33.0 34 L33.0 19 Q33.0 14 36.0 13 Q49.0 16 62.0 13 Q65.0 14 65.0 19 L65.0 24 A5.0 5.0 0 0 0 75.0 24 L75.0 19 Q75.0 14 78.0 13 Q89.5 16 101.0 13 Q104.0 14 104.0 19 L104.0 42 A8.0 8.0 0 0 0 120.0 42 L120.0 19 Q120.0 14 123.0 13 Q137.2 16 151.5 13 Q154.5 14 154.5 19 L154.5 28 A5.5 5.5 0 0 0 165.5 28 L165.5 19 Q165.5 14 168.5 13 Q181.2 16 194.0 13 Q197.0 14 197.0 19 L197.0 36 A7.0 7.0 0 0 0 211.0 36 L211.0 19 Q211.0 14 214.0 13 Q225.5 16 240 12 L240 0 L0 0 Z%22 fill=%22%238cc152%22/%3E%3Cpath d=%22M0 12 Q9.5 16 16.0 13 Q19.0 14 19.0 19 L19.0 34 A7.0 7.0 0 0 0 33.0 34 L33.0 19 Q33.0 14 36.0 13 Q49.0 16 62.0 13 Q65.0 14 65.0 19 L65.0 24 A5.0 5.0 0 0 0 75.0 24 L75.0 19 Q75.0 14 78.0 13 Q89.5 16 101.0 13 Q104.0 14 104.0 19 L104.0 42 A8.0 8.0 0 0 0 120.0 42 L120.0 19 Q120.0 14 123.0 13 Q137.2 16 151.5 13 Q154.5 14 154.5 19 L154.5 28 A5.5 5.5 0 0 0 165.5 28 L165.5 19 Q165.5 14 168.5 13 Q181.2 16 194.0 13 Q197.0 14 197.0 19 L197.0 36 A7.0 7.0 0 0 0 211.0 36 L211.0 19 Q211.0 14 214.0 13 Q225.5 16 240 12%22 fill=%22none%22 stroke=%22%23141014%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cellipse cx=%2222.5%22 cy=%2232.0%22 rx=%221.6%22 ry=%222.8%22 fill=%22%23e6f5c4%22/%3E%3Cellipse cx=%22108.0%22 cy=%2240.0%22 rx=%221.8%22 ry=%223.2%22 fill=%22%23e6f5c4%22/%3E%3Cellipse cx=%22200.5%22 cy=%2234.0%22 rx=%221.6%22 ry=%222.8%22 fill=%22%23e6f5c4%22/%3E%3C/svg%3E") repeat-x 0 0/240px 60px;pointer-events:none}.matcha>*{position:relative}.matcha{position:relative;padding-top:56px!important;}.matcha{background:var(--cream);box-shadow:8px 8px 0 var(--lime);transform:rotate(.5deg)}.milks{background:var(--white);box-shadow:8px 8px 0 var(--pink);transform:rotate(-.5deg)}.matcha h3{color:var(--lime)}.milks h3{color:var(--pink-soft)}.milks{position:relative;padding-right:210px}.milk-sticker{position:absolute;top:-46px;right:-44px;z-index:2;width:240px;margin:0;transform:rotate(7deg)}.milk-sticker img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:3px solid var(--black);border-radius:50%;box-shadow:6px 6px 0 var(--pink)}.milk-sticker figcaption{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%) rotate(-6deg);padding:5px 14px;background:var(--black);color:var(--lime);font:400 17px/1.1 var(--display);white-space:nowrap}.has-can{position:relative;padding-right:78px}.can-art{position:absolute;right:4px;top:50%;width:58px;transform:translateY(-50%) rotate(8deg)}.can-art img{display:block;width:100%;height:auto;filter:drop-shadow(3px 3px 0 var(--black))}.can-heart{position:absolute;top:-10px;left:-16px;width:26px;height:auto;transform:rotate(-14deg)}.col-tag{margin:6px 0 4px;font:400 24px/1.25 var(--marker)}.col-note{margin:10px 0 18px;font-size:13px;font-weight:700;font-style:italic;line-height:1.5}.col-note-top{margin:0 0 4px}.tag{display:inline-block;margin-left:6px;padding:2px 9px 3px;border:2px solid var(--black);background:var(--white);font:900 12px/1.3 var(--body);letter-spacing:.8px;text-transform:uppercase;vertical-align:middle;transform:rotate(-3deg)}.death-feature{position:relative;margin:14px 0 22px;padding:22px 84px 6px 22px;background:var(--black);color:var(--cream);border:3px solid var(--black);box-shadow:5px 5px 0 var(--lime);transform:rotate(-1deg)}.death-stack{position:absolute;right:-40px;top:50%;width:100px;height:auto;transform:translateY(-50%) rotate(5deg);filter:drop-shadow(5px 5px 0 var(--black));pointer-events:none}.death-title{display:inline-block;margin:0;padding:5px 12px;background:var(--lime);color:var(--black);font:400 21px/1.1 var(--display);transform:rotate(-2deg)}.death-tag{margin:10px 0 0;font:400 21px/1.3 var(--marker);color:var(--pink-soft)}.death-feature .menu-item{border-bottom-color:#f3ede24d}.death-feature .menu-item h4{color:var(--lime)}.menu-footnote{margin:48px 0 0;text-align:center;font-size:14px;color:#d8d0c4}

/* story */
.story{background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22260%22 height=%22260%22 viewBox=%220 0 260 260%22%3E %3Cg fill=%22none%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E %3Cpath d=%22M18 40 q14 -18 28 0 t28 0 t28 0%22 stroke=%22%23141014%22 stroke-width=%225%22/%3E %3Cpath d=%22M150 190 q14 -18 28 0 t28 0 t28 0%22 stroke=%22%23ee3f8a%22 stroke-width=%225%22/%3E %3Cpath d=%22M180 30 l22 38 h-44 z%22 stroke=%22%23141014%22 stroke-width=%224%22 fill=%22%23ee3f8a%22/%3E %3Cpath d=%22M40 150 l18 30 h-36 z%22 stroke=%22%23141014%22 stroke-width=%224%22 fill=%22%23fffdf8%22/%3E %3Ccircle cx=%22120%22 cy=%22110%22 r=%2216%22 stroke=%22%23141014%22 stroke-width=%224%22 fill=%22%23fffdf8%22/%3E %3Ccircle cx=%22230%22 cy=%22120%22 r=%229%22 fill=%22%23141014%22/%3E %3Cpath d=%22M90 230 l12 -12 l12 12 l12 -12 l12 12%22 stroke=%22%23141014%22 stroke-width=%224%22/%3E %3Crect x=%22100%22 y=%2212%22 width=%2226%22 height=%2226%22 rx=%223%22 stroke=%22%23141014%22 stroke-width=%224%22 transform=%22rotate%2818 113 25%29%22/%3E %3Cpath d=%22M205 235 l10 -24%22 stroke=%22%23ee3f8a%22 stroke-width=%225%22/%3E %3Cpath d=%22M60 90 l8 -20%22 stroke=%22%23141014%22 stroke-width=%224%22/%3E %3C/g%3E %3Cg fill=%22%23141014%22%3E%3Ccircle cx=%22160%22 cy=%22100%22 r=%223%22/%3E%3Ccircle cx=%22172%22 cy=%22100%22 r=%223%22/%3E%3Ccircle cx=%22160%22 cy=%22112%22 r=%223%22/%3E%3Ccircle cx=%22172%22 cy=%22112%22 r=%223%22/%3E%3Ccircle cx=%2220%22 cy=%22220%22 r=%223%22/%3E%3Ccircle cx=%2232%22 cy=%22220%22 r=%223%22/%3E%3Ccircle cx=%2220%22 cy=%22232%22 r=%223%22/%3E%3Ccircle cx=%2232%22 cy=%22232%22 r=%223%22/%3E%3C/g%3E %3C/svg%3E");background-size:260px 260px;background-repeat:repeat;}.story{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:8%;padding:80px max(6%,calc((100% - 1200px)/2));background-color:var(--lime);border-block:3px solid var(--black)}
.story h2{margin:0;font:400 clamp(42px,4.8vw,70px)/1 var(--display)}
.story h2>span{display:block;margin-top:10px;color:var(--pink);-webkit-text-stroke:2px var(--black);paint-order:stroke fill;text-shadow:4px 4px 0 var(--black)}
.story-copy{max-width:480px}.story-copy>p{padding:16px 18px;background:var(--lime);border:3px solid var(--black);box-shadow:5px 5px 0 var(--black)}.story h2{padding:18px 22px;background:var(--lime);border:3px solid var(--black);box-shadow:6px 6px 0 var(--black);transform:rotate(-1deg)}.story .handwritten{display:inline-block;padding:2px 12px;background:var(--lime)}
.handwritten{display:block;font:400 30px/1.3 var(--marker);transform:rotate(-4deg)}
.story-copy p{font-size:17px;font-weight:600;line-height:1.75}
.give-back{display:flex;align-items:center;gap:16px;margin-top:26px;padding:18px 20px;background:var(--black);color:var(--cream);box-shadow:6px 6px 0 var(--pink);transform:rotate(-1deg)}
.give-back img{flex-shrink:0;width:64px;height:64px;object-fit:contain}
.give-back p{margin:0;font-size:16px;font-weight:700;line-height:1.55}

/* visit */
.visit{padding:80px 0}
.visit-card{width:var(--page);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:48px;padding:40px;background:var(--cream);border:3px solid var(--black);box-shadow:10px 10px 0 var(--black)}
.storefront-slot{transform:rotate(-1.5deg)}
.visit-card img.storefront{display:block;width:100%;height:auto;filter:drop-shadow(8px 8px 0 var(--pink));transform:rotate(-1.5deg)}
.visit-copy h2{margin:0;font:400 clamp(40px,4.4vw,62px)/1 var(--display);color:var(--lime);-webkit-text-stroke:2.5px var(--black);paint-order:stroke fill;text-shadow:4px 4px 0 var(--black)}
.visit-place{margin:12px 0 0;font:400 clamp(32px,3.2vw,44px)/1 var(--second);color:var(--pink)}
.visit-copy>p:not(.visit-place){max-width:420px;margin:18px 0 26px;font-size:17px;font-weight:600;line-height:1.65}

/* franchise: checkerboard band */
.franchise{padding:72px 0;background:repeating-conic-gradient(var(--black) 0 25%,var(--pink) 0 50%) 0 0/44px 44px;border-block:3px solid var(--black)}
.franchise-panel{width:var(--page);margin:0 auto;padding:44px 48px;background:var(--black);color:var(--cream);border:3px solid var(--lime);box-shadow:10px 10px 0 var(--lime)}
.franchise-top{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.franchise h2{margin:0;font:400 clamp(40px,4.6vw,64px)/1 var(--display);color:var(--pink)}
.franchise-copy{flex:1 1 420px}.franchise-copy .button{margin-top:24px}.franchise-map{flex:0 0 auto;width:clamp(200px,22vw,280px);margin:-70px 10px -40px 0;transform:rotate(4deg)}.franchise-map-svg{display:block;width:100%;height:auto;filter:drop-shadow(6px 6px 0 var(--pink))}.franchise-intro{max-width:440px;margin:16px 0 0;font-size:17px;font-weight:600;line-height:1.6}
.franchise .button{border-color:var(--black);box-shadow:5px 5px 0 var(--pink)}
.franchise .button:hover{box-shadow:2px 2px 0 var(--pink)}
.franchise-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px;margin-top:36px;padding-top:32px;border-top:2px dashed #c8fb4c80}
.franchise-form[hidden]{display:none}
.field{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:800}
.optional{font-weight:600;color:#d8d0c4}
.field input,.field textarea{font:600 16px/1.4 var(--body);color:var(--black);background:var(--white);border:3px solid var(--black);outline:2px solid transparent;padding:12px 14px}
.field textarea{resize:vertical;min-height:120px}
.field input:focus-visible,.field textarea:focus-visible{outline:3px solid var(--lime);outline-offset:1px}
.field-wide,.form-actions{grid-column:1/-1}
.form-actions{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.form-note{margin:0;max-width:420px;font-size:14px}
.hidden-field{position:absolute;left:-9999px}

/* footer */
.site-footer{padding:44px max(6%,calc((100% - 1200px)/2)) 26px;background:var(--black);color:var(--lime)}
.footer-wordmark{display:flex;align-items:center;justify-content:space-between;gap:25px;font:400 clamp(40px,9vw,134px)/1 var(--display)}
.screamers-footer img{width:clamp(80px,13vw,170px);height:auto;transform:rotate(-5deg)}
.site-footer>div{display:flex;justify-content:space-between;gap:20px;padding:27px 0 20px;font-size:12px;font-weight:800;border-bottom:1px solid #c8fb4c55}
.legal-links{display:flex;flex-wrap:wrap;gap:8px 26px;margin:20px 0 0;padding:0;list-style:none;font-size:12px;font-weight:700;color:#d8d0c4}
.site-footer>p{margin:18px 0 0;font-size:12px;color:#d8d0c4}

/* thanks page */
.thanks{grid-template-columns:1fr}

@media(max-width:1100px){
  .location-card{grid-template-columns:1fr}.location-media{border-right:0;border-bottom:3px solid var(--black)}
  .death-feature{padding-right:64px}.death-stack{right:-30px;width:82px}
  .milks{padding-right:34px}.milk-sticker{width:150px;top:-56px;right:-26px}.milk-sticker figcaption{font-size:13px;padding:4px 10px}.milks .menu-item:first-child{margin-top:14px}
  :root{--page:calc(100% - 40px)}
  .site-header{grid-template-columns:1fr auto;padding-inline:26px}
  .screamers-brand{grid-column:1;justify-self:start}
  .site-header nav{grid-column:2;justify-self:end}
  .header-link{display:none}
  .hero{padding:40px 32px 52px}
}
@media(max-width:760px){
  :root{--page:calc(100% - 24px)}
  .scream-bar p{font-size:14px}
  .scream-bar span{display:none}
  .shell{margin-top:18px;box-shadow:6px 6px 0 var(--black)}
  .site-header{padding:14px 16px;gap:10px}
  .brand-logo{width:50px;height:50px}
  .brand-type strong{font-size:25px}
  .brand-type>span{font-size:11px;letter-spacing:.3px}
  .site-header nav{gap:14px;font-size:14px}
  .site-header nav a:not(:first-child){display:none}
  .hero{grid-template-columns:1fr;gap:34px;padding:30px 20px 46px}
  .eyebrow{font-size:12px;letter-spacing:.8px}
  .hero h1{font-size:clamp(50px,14.5vw,80px);-webkit-text-stroke-width:2.5px;text-shadow:4px 4px 0 var(--black)}
  .hero-intro{font-size:16px}
  .hero-actions .button{width:100%;font-size:18px}
  .rating-sticker{width:104px;height:104px;font-size:18px;right:4%}
  .rewind-strip{margin-top:44px}
  .rewind-strip>.marquee-track{font-size:21px;animation-duration:24s}
  .rewind-strip span{margin:0 18px}
  .menu-section{padding:70px 6% 44px}
  .menu-head{margin-bottom:32px}
  .menu-board{grid-template-columns:1fr;gap:34px}
  .menu-col{padding:24px 22px 8px}
  .menu-item h4{font-size:27px}
  .has-can{padding-right:0}.has-can p{padding-right:44px}.can-art{top:auto;bottom:8px;right:-16px;width:42px;transform:rotate(8deg)}.can-heart{width:19px;top:-10px;left:-10px}
  .death-feature{padding-right:58px}.death-stack{right:-26px;width:74px}
  .milks{padding-right:22px}.milk-sticker{width:128px;top:-58px;right:-10px}.milk-sticker figcaption{font-size:12px;padding:4px 9px}.milks .menu-item:first-child{margin-top:18px}
  .story{grid-template-columns:1fr;gap:36px;padding:56px 6%}
  .story h2>span{-webkit-text-stroke-width:1.5px;text-shadow:3px 3px 0 var(--black)}
  .visit{padding:52px 0}
  .visit-card{grid-template-columns:1fr;gap:30px;padding:22px;box-shadow:6px 6px 0 var(--black)}
  .visit-copy .button{width:100%}
  .intro-art{display:none}
  .locations{padding:48px 0 56px}.locations-grid{grid-template-columns:1fr;gap:28px}.location-card{grid-template-columns:1fr;box-shadow:6px 6px 0 var(--black)}.location-media{border-right:0;border-bottom:3px solid var(--black)}.location-body .button,.next-card .button{width:100%}.visit-place .status-chip{margin:8px 0 0}
  .postcards{margin-top:60px}
  .stamp-paper{--r:5px}.postcard figcaption{font-size:14px;padding:6px 2px 0}.postmark{width:110px;top:-9%}
  .scream-bar a{display:none}
  .franchise{padding:40px 0}
  .franchise-panel{padding:30px 20px;box-shadow:6px 6px 0 var(--lime)}
  .franchise-form{grid-template-columns:1fr}
  .franchise-toggle{width:100%;font-size:17px;gap:12px}
  .franchise-map{order:-1;width:210px;margin:-60px auto 0}.franchise-copy .button{width:100%;font-size:17px;gap:12px}
  .site-footer{padding:32px 6% 20px}
  .footer-wordmark{font-size:10vw;gap:10px}
  .screamers-footer img{width:20vw}
  .site-footer>div{flex-direction:column;gap:10px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}