@font-face{font-family:"Tori Print";src:url("fonts/tori-print.ttf") format("truetype");font-display:swap}
/* Tori Allen — flyer branding */
:root{
  --espresso:#15110E; --walnut:#1E1712; --panel:#271E17; --ink:#1B110B;
  --cream:#F7EEDC; --parch:#E9DFCC; --linen:#D8CCB8;
  --gold:#D6AA5C; --gold-hi:#F8E2AE; --gold-lo:#8E6A2F; --brass:#C9A36A;
  --emerald:#3DB386; --emerald-hi:#C4F5DE; --emerald-lo:#17533F;
  --red:#E0574B; --red-hi:#FFC2B6; --red-lo:#7A1F18;
  --sapphire:#4C95C9; --sapphire-hi:#CBE7FA; --sapphire-lo:#1C4A6E;
  --pop:'Poppins','Avenir Next','Segoe UI',system-ui,sans-serif;
  --hand:'Dancing Script','Segoe Script','Brush Script MT',cursive;
  color-scheme:dark; box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--espresso:#15110E}}
:root[data-theme="dark"]{--espresso:#15110E}
*,*::before,*::after{box-sizing:inherit}
html,body{overflow-x:clip}
html{scroll-padding-top:130px}
body{margin:0;background:var(--espresso);color:var(--cream);font-family:var(--pop);font-weight:500;font-size:18px;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold);text-underline-offset:3px;text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nw{display:inline-block}

/* page frame like the flyer */
.page-frame{position:fixed;inset:10px;border:2px solid rgba(201,163,106,.55);border-radius:12px;pointer-events:none;z-index:60}
@media (max-width:600px){.page-frame{display:none}}

/* ---------- nav ---------- */
.site-nav{position:sticky;top:0;z-index:50;background:rgba(21,17,14,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-bottom:2px solid rgba(201,163,106,.45);padding:.6rem 0}
.nav-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:1.2rem;padding:0 1.4rem}
.nav-logo{flex:none}
.nav-logo img{height:46px;width:auto;filter:drop-shadow(0 3px 6px rgba(0,0,0,.6))}
.nav-inner>nav{margin-left:auto;min-width:0}
.nav-links{display:flex;gap:.35rem;list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:flex-end}
.nav-links a{display:block;white-space:nowrap;font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--cream);
  padding:.5em .95em;border-radius:999px;border:2px solid transparent}
.nav-links a:hover{border-color:rgba(201,163,106,.6)}
.nav-links a[aria-current="page"]{background:var(--gold);color:var(--ink);border-color:var(--ink);box-shadow:0 3px 0 var(--ink)}
@media (max-width:820px){
  .nav-inner{flex-direction:column;align-items:stretch;gap:.5rem}
  .nav-logo{align-self:flex-start}
  .nav-logo img{height:40px}
  .nav-inner>nav{margin:0}
  .nav-links{justify-content:center;row-gap:.3rem}
  .nav-links a{font-size:13px;padding:.45em .8em}
}

/* ---------- layout ---------- */
.wrap{max-width:820px;margin:0 auto;padding:clamp(1.6rem,5vw,3rem) 1.3rem 2rem;text-align:center;position:relative}
.wrap.wide{max-width:1100px}
.stage{position:relative;background:linear-gradient(rgba(21,17,14,.55),rgba(21,17,14,.25) 40%,rgba(21,17,14,.6) 80%,var(--espresso)),var(--curtain) center top/cover no-repeat}
.section{margin:4.5rem auto 0;max-width:720px}
.lead{font-size:1.15rem;max-width:42ch;margin:1rem auto 0;color:var(--parch)}

/* ---------- bubble lettering ---------- */
.bub{--c:var(--gold);--hi:var(--gold-hi);--lo:var(--gold-lo);
  position:relative;display:inline-block;font-family:var(--pop);font-weight:800;line-height:1.05;letter-spacing:.01em;margin:0;color:var(--c);
  text-shadow:
   -3px -3px 0 var(--ink),3px -3px 0 var(--ink),-3px 3px 0 var(--ink),3px 3px 0 var(--ink),0 -3px 0 var(--ink),0 3px 0 var(--ink),-3px 0 0 var(--ink),3px 0 0 var(--ink),
   1px 5px 0 var(--ink),2px 7px 0 var(--ink),2px 9px 0 var(--ink),3px 11px 0 var(--ink),0 14px 18px rgba(0,0,0,.55)}
.bub::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;color:transparent;text-shadow:none;
  background:linear-gradient(180deg,rgba(255,255,255,.85) 0%,rgba(255,255,255,.4) 26%,rgba(255,255,255,.1) 50%,transparent 70%,rgba(255,255,255,.15) 100%);
  -webkit-background-clip:text;background-clip:text}
.bub.emerald{--c:var(--emerald);--hi:var(--emerald-hi);--lo:var(--emerald-lo)}
.bub.red{--c:var(--red)}
.bub.cream{--c:var(--cream)}
.bub.sapphire{--c:var(--sapphire)}
.bub.glow{filter:drop-shadow(0 0 14px color-mix(in srgb,var(--c) 45%,transparent))}
.h1{font-size:clamp(2.5rem,10.5vw,4.6rem)}
.h2{font-size:clamp(2rem,8.4vw,3.3rem)}
.h3{font-size:clamp(1.5rem,6vw,2.2rem)}
.tilt{transform:rotate(-2deg)}

/* ---------- hero pieces ---------- */
.name-img{width:min(92%,640px);margin:0 auto;filter:drop-shadow(0 8px 14px rgba(0,0,0,.6))}
.rusty-img{width:min(96%,720px);margin:.4rem auto 0;filter:drop-shadow(0 0 14px rgba(61,179,134,.35))}
.with{margin-top:.6rem}
.doors{font-weight:700;font-size:clamp(1.05rem,4.4vw,1.5rem);letter-spacing:.08em;text-transform:uppercase;margin:1.4rem 0 0;color:var(--cream)}

/* polaroids */
.polas{position:relative;display:grid;grid-template-columns:1fr 1.5fr 1fr;align-items:center;max-width:860px;margin:2rem auto 1rem}
.pola{background:#F4EEE3;border:3px solid var(--ink);border-radius:5px;padding:9px 9px 30px;box-shadow:0 7px 0 var(--ink),0 18px 34px rgba(0,0,0,.55)}
.pola img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border:2px solid var(--ink)}
.polas .l{transform:rotate(-7deg) translateX(14px);z-index:1}
.polas .c{transform:rotate(-1.5deg);z-index:2;padding:11px 11px 38px}
.polas .r{transform:rotate(6deg) translateX(-14px);z-index:1}
@media (max-width:560px){.polas{grid-template-columns:1fr 1fr}.polas .c{grid-column:1/-1;order:-1;margin:0 auto 1.4rem;width:88%}.polas .l{transform:rotate(-5deg)}.polas .r{transform:rotate(5deg)}}
.pola.solo{max-width:560px;margin:2rem auto 0;transform:rotate(-2deg);padding:12px 12px 42px}

/* stars */
.stars{position:absolute;width:clamp(56px,10vw,92px);opacity:.75;pointer-events:none}

/* ---------- buttons ---------- */
.actions{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center;margin:1.8rem 0 .4rem}
.btn{display:inline-block;font-family:var(--pop);font-weight:800;font-size:15px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  padding:1em 1.8em;border-radius:999px;border:3px solid var(--ink);background:var(--gold);color:var(--ink);cursor:pointer;
  box-shadow:0 5px 0 var(--ink),0 12px 22px rgba(0,0,0,.35);transition:transform .08s,box-shadow .08s}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--ink)}
.btn.red{background:var(--red);color:#FFF6EC}
.btn.emerald{background:var(--emerald);color:var(--ink)}
.btn.sapphire{background:var(--sapphire);color:#F4FAFF}
.btn.ghost{background:transparent;color:var(--cream);border-color:var(--gold);box-shadow:none}
.countdown{font-weight:700;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase;margin:1rem 0 0;color:var(--parch);min-height:1.6em}
.countdown b{color:var(--gold);font-size:1.3em}

/* ---------- panels ---------- */
.box{position:relative;background:var(--panel);border:4px solid var(--ink);border-radius:26px;padding:2rem 1.4rem 1.8rem;margin:2.4rem auto 0;
  box-shadow:0 8px 0 var(--ink),inset 0 0 0 3px var(--brass)}
.box .cans{position:absolute;top:50%;transform:translateY(-50%);width:clamp(40px,8vw,64px);color:var(--brass)}
.box .cans.l{left:16px}.box .cans.r{right:16px}
@media (max-width:560px){.box .cans{display:none}}
.box .body{max-width:34ch;margin:1rem auto 0;font-weight:700;font-size:clamp(1.05rem,4.4vw,1.3rem);line-height:1.45}
.box .gold{color:var(--gold);font-size:clamp(1.15rem,4.8vw,1.45rem);font-weight:800;margin-top:1rem}
.box .small{font-weight:700;font-size:.95rem;letter-spacing:.14em;text-transform:uppercase;color:var(--linen);margin-top:.8rem}
.card{background:var(--panel);border:3px solid var(--ink);border-radius:20px;padding:1.6rem 1.4rem;text-align:left;margin:1.4rem auto 0;
  box-shadow:0 6px 0 var(--ink),inset 0 0 0 2px rgba(201,163,106,.65)}
.card h3{font-weight:800;font-size:1.6rem;line-height:1.15;margin:0;color:var(--gold)}
.card p{margin:.7rem 0 0;color:var(--parch)}
.card .btn{margin-top:1.2rem}
.highlight{display:block;background:rgba(214,170,92,.14);border:2px solid var(--gold);border-radius:12px;padding:.8rem 1rem;color:var(--cream)!important;font-weight:700;margin-top:1rem!important}
.hours{list-style:none;padding:0;margin:.6rem 0 0;display:grid;grid-template-columns:auto 1fr;gap:.25rem 1.2rem}
.hours li{display:contents}
.hours span:first-child{color:var(--gold);font-weight:800}
.fine{font-size:.95rem;color:var(--linen)}
.loc{display:flex;gap:1rem;align-items:flex-start}
.loc svg{flex:none;width:34px;margin-top:.3rem}
.stack{display:grid;gap:1.2rem;margin-top:1.4rem}
.stack .card{margin:0}
.grid-fly{display:flex;justify-content:center;margin-top:1.6rem}
.grid-fly figure{margin:0;max-width:420px}
.grid-fly img{height:auto;border:3px solid var(--ink);border-radius:8px;box-shadow:0 7px 0 var(--ink)}
.grid-fly figcaption{margin-top:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.quote{font-weight:700;font-size:clamp(1.15rem,4.6vw,1.45rem);line-height:1.5;color:var(--parch);max-width:30ch;margin:0 auto}
.sig-img{width:160px;margin:.9rem auto 0}
.inline-name{display:inline-block;height:1.5em;width:auto;vertical-align:-.42em;margin:0 .05em}

/* ---------- about ---------- */
.about-hero{display:grid;gap:2.6rem;align-items:center}
@media (min-width:860px){.about-hero{grid-template-columns:1fr 1.1fr;text-align:left}.about-hero .chips{justify-content:flex-start}}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;list-style:none;padding:0;margin:1.4rem 0 0}
.chips li{font-weight:800;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;background:var(--panel);border:2px solid var(--ink);box-shadow:inset 0 0 0 2px rgba(201,163,106,.6);border-radius:999px;padding:.4em 1em;color:var(--cream)}
.bio{max-width:680px;margin:3.6rem auto 0;text-align:left}
.bio h3{margin:2.4rem 0 .6rem}
.bio p{margin:0 0 1.1rem;color:var(--parch)}
.bio .first{font-size:1.25rem;font-weight:700;color:var(--cream)}

/* ---------- shows ---------- */
.shows{display:grid;gap:1.2rem;max-width:720px;margin:1.8rem auto 0;text-align:left}
.show{background:var(--panel);border:3px solid var(--ink);border-radius:20px;box-shadow:0 6px 0 var(--ink),inset 0 0 0 2px rgba(201,163,106,.6);overflow:hidden}
.show summary{list-style:none;display:flex;gap:1rem;align-items:center;padding:1.1rem;cursor:pointer}
.show summary::-webkit-details-marker{display:none}
.date{flex:none;width:80px;text-align:center;background:var(--gold);color:var(--ink);border:3px solid var(--ink);border-radius:14px;padding:.4rem 0 .5rem;line-height:1;box-shadow:0 4px 0 var(--ink)}
.show.ice .date{background:var(--sapphire);color:#F4FAFF}
.date .m{display:block;font-weight:800;font-size:.95rem;letter-spacing:.08em}
.date .d{display:block;font-weight:800;font-size:2.2rem;margin:.1rem 0}
.date .y{display:block;font-weight:700;font-size:.8rem}
.what{flex:1;min-width:0}
.what b{display:block;font-weight:800;font-size:1.3rem;line-height:1.2;color:var(--cream)}
.what span{display:block;font-size:.98rem;color:var(--parch);margin-top:.2rem}
.what .cause{color:var(--gold);font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase}
.show.ice .what .cause{color:var(--sapphire-hi)}
.chev{flex:none;width:36px;height:36px;border:3px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold);transition:transform .2s}
.chev::before{content:"";width:9px;height:9px;border-right:3px solid currentColor;border-bottom:3px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.show[open] .chev{transform:rotate(180deg)}
.show .body{padding:.2rem 1.2rem 1.5rem;border-top:2px dashed rgba(201,163,106,.4)}
.show .body p{margin:1rem 0 0;color:var(--parch)}
.times{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.times span{font-weight:800;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;border:2px solid var(--gold);border-radius:999px;padding:.35em .9em}
.bring{background:rgba(214,170,92,.12);border:2px solid var(--gold);border-left-width:6px;border-radius:12px;padding:.9rem 1rem;margin-top:1rem;color:var(--cream)}
.bring b{color:var(--gold)}
.show .btns{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.2rem}
.show .btns .btn{font-size:13px}
@media (prefers-reduced-motion:reduce){.chev{transition:none}}

/* ---------- contact ---------- */
.letter{position:relative;background:#F6EEE2;color:#2B1D13;border-radius:6px;font-family:var(--hand);font-weight:600;font-size:1.65rem;line-height:1.5;
  padding:2.4rem 1.6rem 2rem;box-shadow:0 22px 50px rgba(0,0,0,.55),0 6px 0 var(--ink);transform:rotate(-.6deg);text-align:left;max-width:620px;margin:2.6rem auto 0;
  border:3px solid var(--ink)}
.letter::before{content:"";position:absolute;top:-14px;left:50%;width:120px;height:28px;transform:translateX(-50%) rotate(-2deg);background:rgba(201,163,106,.85);border-radius:2px}
.letter p{margin:0 0 .9rem}
.letter .label{font-family:var(--pop);font-weight:800;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#8C6A3E;margin-bottom:1.1rem}
.letter-sig{width:210px;margin:.4rem 0 0 -.2rem}
@media (max-width:480px){.letter{font-size:1.5rem;padding:2.2rem 1.2rem 1.8rem}}
form.contact{background:var(--panel);border:3px solid var(--ink);border-radius:22px;box-shadow:0 7px 0 var(--ink),inset 0 0 0 2px rgba(201,163,106,.6);
  padding:1.8rem 1.4rem;text-align:left;max-width:620px;margin:2.6rem auto 0}
.field{margin:0 0 1.1rem}
.row{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
@media (max-width:540px){.row{grid-template-columns:1fr}}
label{display:block;font-weight:800;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:.4rem;color:var(--cream)}
label .opt{font-weight:500;text-transform:none;letter-spacing:0;color:var(--linen)}
input,textarea,select{width:100%;font:inherit;color:var(--cream);background:#120E0B;border:2px solid rgba(201,163,106,.6);border-radius:12px;padding:.8rem .9rem}
textarea{min-height:7rem;resize:vertical}
input:focus,textarea:focus,select:focus{outline:3px solid var(--gold);outline-offset:1px}
form.contact .btn{width:100%;margin-top:.6rem;background:var(--red);color:#FFF6EC}
.status{margin:1rem 0 0;text-align:center;font-weight:700;min-height:1.5em}
.hp{position:absolute;left:-9999px}
.only-jacket{display:none}
body.jacket .only-food{display:none}
body.jacket .only-jacket{display:block}
body.jacket span.only-jacket{display:inline-block}

/* ---------- footer ---------- */
footer.site-foot{margin-top:5rem;padding:2.6rem 1.2rem calc(2.4rem + env(safe-area-inset-bottom,0px));border-top:2px solid rgba(201,163,106,.45);text-align:center;background:var(--walnut)}
footer.site-foot img{width:220px;margin:0 auto 1.2rem}
footer.site-foot nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.3rem;margin-bottom:1rem}
footer.site-foot nav a{font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--cream)}
footer.site-foot .small{font-weight:700;color:var(--linen)}

/* retro script headers */
.bub.script{font-family:'Lobster','Pacifico','Brush Script MT',cursive;font-weight:400;letter-spacing:.01em;line-height:1.18;padding:0 .12em .08em}
.bub.script.h1{font-size:clamp(2.9rem,12vw,5.2rem)}
.bub.script.h2{font-size:clamp(2.4rem,9.6vw,3.8rem)}
.bub.script.h3{font-size:clamp(1.9rem,7.2vw,2.7rem)}
/* stars sit behind text */
.stars{z-index:0}
.wrap>*:not(.stars){position:relative;z-index:1}
.bub.script::after{padding:0 .12em .08em}

.letter{font-family:"Tori Print",var(--hand);font-weight:400;font-size:1.6rem;line-height:1.45;letter-spacing:.015em}
@media (max-width:480px){.letter{font-size:1.45rem}}

/* headers styled like The Rusty Nail lettering: wet gloss, droplets, glow */
.bub.script{
  text-shadow:
   -2.5px -2.5px 0 var(--ink),2.5px -2.5px 0 var(--ink),-2.5px 2.5px 0 var(--ink),2.5px 2.5px 0 var(--ink),
   0 -2.5px 0 var(--ink),0 2.5px 0 var(--ink),-2.5px 0 0 var(--ink),2.5px 0 0 var(--ink),
   1px 4px 0 var(--ink),2px 6px 0 var(--ink),0 0 22px color-mix(in srgb,var(--c) 55%,transparent)}
.bub.script::after{
  background:
   radial-gradient(circle at 9% 34%,rgba(255,255,255,.95) 0 .07em,transparent .09em),
   radial-gradient(circle at 31% 64%,rgba(255,255,255,.9) 0 .05em,transparent .07em),
   radial-gradient(circle at 54% 30%,rgba(255,255,255,.95) 0 .06em,transparent .08em),
   radial-gradient(circle at 73% 66%,rgba(255,255,255,.9) 0 .05em,transparent .07em),
   radial-gradient(circle at 92% 38%,rgba(255,255,255,.95) 0 .06em,transparent .08em),
   linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.5) 20%,rgba(255,255,255,.16) 44%,transparent 64%,rgba(0,0,0,.12) 100%);
  -webkit-background-clip:text;background-clip:text}

/* closest free match to The Rusty Nail lettering */
.bub.script{font-family:'Pacifico','Lobster','Brush Script MT',cursive;font-weight:400;line-height:1.38;letter-spacing:0;padding:.05em .16em .14em}
.bub.script::after{padding:.05em .16em .14em}
.bub.script.h1{font-size:clamp(2.4rem,10.2vw,4.4rem)}
.bub.script.h2{font-size:clamp(2rem,8.2vw,3.2rem)}
.bub.script.h3{font-size:clamp(1.6rem,6.2vw,2.3rem)}

/* poster branding: glossy wet bubble caps, colorful cans, gold pill */
.bub{text-shadow:
   -3px -3px 0 var(--ink),3px -3px 0 var(--ink),-3px 3px 0 var(--ink),3px 3px 0 var(--ink),0 -3px 0 var(--ink),0 3px 0 var(--ink),-3px 0 0 var(--ink),3px 0 0 var(--ink),
   1px 5px 0 var(--ink),2px 7px 0 var(--ink),2px 9px 0 var(--ink),0 0 24px color-mix(in srgb,var(--c) 40%,transparent),0 14px 18px rgba(0,0,0,.5)}
.bub::after{
  background:
   radial-gradient(circle at 10% 30%,rgba(255,255,255,.95) 0 .06em,transparent .08em),
   radial-gradient(circle at 33% 62%,rgba(255,255,255,.9) 0 .045em,transparent .065em),
   radial-gradient(circle at 57% 28%,rgba(255,255,255,.95) 0 .055em,transparent .075em),
   radial-gradient(circle at 78% 64%,rgba(255,255,255,.9) 0 .045em,transparent .065em),
   radial-gradient(circle at 93% 34%,rgba(255,255,255,.95) 0 .055em,transparent .075em),
   linear-gradient(180deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,.5) 20%,rgba(255,255,255,.15) 45%,transparent 62%,rgba(0,0,0,.1) 100%);
  -webkit-background-clip:text;background-clip:text}
.pill{display:inline-block;background:var(--gold);color:var(--ink);border:4px solid var(--ink);border-radius:999px;box-shadow:0 5px 0 var(--ink);
  font-weight:800;font-size:clamp(.95rem,4vw,1.35rem);letter-spacing:.08em;text-transform:uppercase;padding:.45em 1.3em;margin:1.4rem auto 0}
.canrow{display:flex;justify-content:center;align-items:flex-end;gap:.4rem;margin:1.8rem auto .6rem;filter:drop-shadow(0 14px 18px rgba(0,0,0,.45))}
.canrow svg{width:clamp(48px,13vw,var(--w,90px));height:auto}
.canrow svg:nth-child(3){width:clamp(66px,18vw,112px)}
.canrow svg:nth-child(2),.canrow svg:nth-child(4){width:clamp(56px,15vw,92px)}
.cstack{display:flex;flex-direction:column;align-items:center;gap:.6rem}
.cstack svg{height:auto}
.box .cans{width:clamp(44px,8vw,66px)}
.box .cans svg{width:100%;height:auto}
.box .cstack svg:last-child{width:76%}

.grid-fly{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:900px;margin:1.6rem auto 0}
@media (max-width:620px){.grid-fly{grid-template-columns:1fr 1fr}.grid-fly figure:first-child{grid-column:1/-1;max-width:70%;margin:0 auto}}
.grid-fly figure{max-width:none}

.pill.sapph{background:var(--sapphire);color:#F4FAFF}
.canrow.gear{gap:.2rem}
.canrow.gear svg:nth-child(1),.canrow.gear svg:nth-child(5){width:clamp(44px,12vw,64px)}
.canrow.gear svg:nth-child(2),.canrow.gear svg:nth-child(4){width:clamp(60px,16vw,90px)}
.canrow.gear svg:nth-child(3){width:clamp(76px,20vw,116px)}