@font-face{font-family:'Russo One';font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2116,U+00BD,U+00BC,U+00BE,U+00D7,U+2212;src:url(fonts/russo-one-latin-400.woff2) format('woff2')}
@font-face{font-family:'Russo One';font-weight:400;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1;src:url(fonts/russo-one-cyrillic-400.woff2) format('woff2')}
@font-face{font-family:'Russo One';font-weight:400;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;src:url(fonts/russo-one-latin-ext-400.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2116,U+00BD,U+00BC,U+00BE,U+00D7,U+2212;src:url(fonts/play-latin-400.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:400;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1;src:url(fonts/play-cyrillic-400.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:400;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;src:url(fonts/play-latin-ext-400.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:400;font-display:swap;unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;src:url(fonts/play-cyrillic-ext-400.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2116,U+00BD,U+00BC,U+00BE,U+00D7,U+2212;src:url(fonts/play-latin-700.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:700;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1;src:url(fonts/play-cyrillic-700.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:700;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;src:url(fonts/play-latin-ext-700.woff2) format('woff2')}
@font-face{font-family:'Play';font-weight:700;font-display:swap;unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;src:url(fonts/play-cyrillic-ext-700.woff2) format('woff2')}
/* Layout: one orange field; a huge butter-and-ink headline set slightly askew, then two recipe cards built like the recipe sheets (cream, ink outline, hard drop shadow), each tinted with its recipe's own colour. Food stickers drift behind. One committed light look, kept in dark mode on purpose. */
:root{
  --field:#ff6a10; --field-0:rgba(255,106,16,0); --sheet:#fdf6ea; --tile:#f5e3c8; --ink:#141210; --butter:#f6d35c; --muted:#5a4a3c;
  --glow:rgba(255,140,40,.62); --drop:8px 8px 0 var(--ink);
  --display:"Russo One","Arial Black","Segoe UI",system-ui,sans-serif; --body:"Play","Trebuchet MS","Segoe UI",system-ui,sans-serif;
  --spring:cubic-bezier(.2,1.3,.35,1); color-scheme:light;
}
html{background:var(--field)}
body{background:var(--field);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.45;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--field)}
*{box-sizing:border-box}
h1,h2,p,ul{margin:0}
html:not([data-lang="en"]) .i-en,html:not([data-lang="pt"]) .i-pt,html[data-lang="en"] .i-ru,html[data-lang="pt"] .i-ru{display:none!important}
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.st{position:absolute}
.st-p{width:100%;height:100%;transition:transform 1s cubic-bezier(.3,1.3,.4,1)}
.st-f{display:block;width:100%;height:100%;overflow:visible;animation:bob 7s ease-in-out infinite alternate}
@keyframes bob{from{transform:translateY(-10px) rotate(-6deg)}to{transform:translateY(12px) rotate(7deg)}}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(6px)}}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;padding-block:12px 16px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:linear-gradient(var(--field) 70%,var(--field-0))}
.top-in{max-width:1180px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.ig{font-family:var(--display);font-size:.85rem;letter-spacing:.04em;color:var(--sheet);background:var(--ink);border-radius:10px;padding:5px 12px;text-decoration:none;transition:transform .15s}
.ig:hover{transform:translate(-1px,-1px) rotate(-2deg)}
.ig:focus-visible{outline:3px solid var(--sheet);outline-offset:2px}
.lang{display:flex;border:2.5px solid var(--ink);border-radius:10px;overflow:hidden;background:var(--sheet)}
.lang button{appearance:none;border:0;background:transparent;color:var(--ink);font:400 .9rem/1.5 var(--display);letter-spacing:.05em;padding:2px 11px;cursor:pointer;transition:background-color .2s}
.lang button+button{border-left:2px solid var(--ink)}
.lang button[aria-pressed="true"]{background:var(--butter)}
.lang button[aria-pressed="false"]:hover{background:#fff;box-shadow:inset 0 0 12px rgba(255,140,40,.55)}
.lang button:focus-visible{outline:3px solid var(--ink);outline-offset:-4px}
main.home{position:relative;z-index:1;max-width:1180px;margin-inline:auto;padding-block:18px 36px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.hero{text-align:center}
.mega{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(2.7rem,10.4vw,7.2rem);line-height:.9;letter-spacing:.005em;
  color:var(--butter);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:8px 8px 0 var(--ink);rotate:-2deg;text-wrap:balance}
.mega .w{display:inline-block}
.lead{display:inline-block;max-width:600px;margin-top:26px;background:var(--sheet);border:2.5px solid var(--ink);border-radius:18px;box-shadow:var(--drop);
  padding:12px 20px;font-size:1.12rem;rotate:1deg;text-wrap:balance}
/* menu: the home page is a café menu — six rubric tiles; a tile opens that rubric’s page */
.menu{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:1060px;margin:46px auto 0}
.mtile{--rx:0deg;--ry:0deg;--lift:0px;position:relative;display:flex;flex-direction:column;gap:6px;min-height:200px;padding:20px 22px 18px;color:var(--ink);text-decoration:none;
  background:var(--sheet);border:3px solid var(--ink);border-radius:24px;box-shadow:10px 10px 0 var(--ink);
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translate(var(--lift),var(--lift));transition:transform .4s var(--spring),box-shadow .3s ease}
.mtile:nth-child(odd){rotate:-.8deg}.mtile:nth-child(even){rotate:.8deg}
a.mtile:hover{--lift:-5px;box-shadow:15px 15px 0 var(--ink),0 0 0 3px rgba(255,176,92,.8),0 0 34px 12px var(--glow)}
a.mtile:active{--lift:3px;box-shadow:4px 4px 0 var(--ink)}
a.mtile:focus-visible{outline:4px solid var(--sheet);outline-offset:5px}
.mt-i{width:64px;height:64px;overflow:visible;transition:transform .5s var(--spring)}
a.mtile:hover .mt-i{transform:scale(1.15) rotate(-8deg)}
.mt-n{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.45rem,2.6vw,1.9rem);line-height:1;text-wrap:balance}
.mt-f{margin-top:auto;padding-top:10px;display:flex;align-items:center;gap:10px}
.mt-c{font-weight:700;border:2px solid var(--ink);border-radius:999px;background:var(--tile);padding:2px 12px;font-size:.92rem;white-space:nowrap}
.mt-th{display:flex;margin-left:auto}
.mt-th img{width:42px;height:42px;border-radius:50%;object-fit:cover;border:2.5px solid var(--ink);background:var(--tile)}
.mt-th img+img{margin-left:-12px}
.mtile .go-a{background:var(--ink)}
.soon-tile{background:#f3e6d3;box-shadow:10px 10px 0 rgba(20,18,16,.55)}
.soon-tile .mt-i,.soon-tile .mt-n{opacity:.5}
.soon-tile .mt-c{background:var(--butter)}
.sec-h{font-family:var(--display);font-weight:400;text-transform:uppercase;text-align:center;font-size:clamp(1.9rem,5vw,3.2rem);line-height:1;
  color:var(--butter);-webkit-text-stroke:2.5px var(--ink);paint-order:stroke fill;text-shadow:5px 5px 0 var(--ink);rotate:-1.5deg}
/* popular: a strip of photos running right to left forever; stops under the finger or mouse */
.pop{margin-top:64px}
.pop-win{margin:26px calc(50% - 50vw) 0;overflow:hidden;padding:6px 0 22px}
.pop-track{display:flex;gap:26px;width:max-content;padding-left:26px;animation:run calc(var(--n) * 5.5s) linear infinite}
.pop-win:hover .pop-track,.pop-win:focus-within .pop-track{animation-play-state:paused}
@keyframes run{to{transform:translateX(-50%)}}
.pop-i{flex:none;width:250px;display:flex;flex-direction:column;color:var(--ink);text-decoration:none;background:var(--sheet);border:3px solid var(--ink);border-radius:20px;
  overflow:hidden;box-shadow:7px 7px 0 var(--ink);transition:transform .3s var(--spring),box-shadow .3s}
.pop-i:nth-child(odd){rotate:-1.5deg}.pop-i:nth-child(even){rotate:1.5deg}
.pop-i:hover{transform:translate(-3px,-5px) scale(1.04);box-shadow:10px 12px 0 var(--ink),0 0 30px 10px var(--glow)}
.pop-i:focus-visible{outline:4px solid var(--sheet);outline-offset:4px}
.pop-i img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-bottom:3px solid var(--ink);background:var(--acc)}
.pop-i span{font-family:var(--display);text-transform:uppercase;font-size:1.05rem;line-height:1.05;padding:10px 14px 12px;border-top:6px solid var(--acc);margin-top:-3px}
/* rubric page */
.rhero{display:flex;flex-direction:column;align-items:center}
.rh-i{width:110px;height:110px;overflow:visible;animation:bob 6s ease-in-out infinite alternate;margin-bottom:6px}
.mega-s{font-size:clamp(2.4rem,8vw,5.4rem)}
.back{display:inline-block}
.soon{width:fit-content;max-width:100%;margin:40px auto 0;background:var(--sheet);border:2.5px solid var(--ink);border-radius:18px;box-shadow:var(--drop);
  padding:14px 22px;font-size:1.1rem;text-align:center;rotate:-1deg}
.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:34px;margin-top:40px}
.cards>.rcard{width:calc((100% - 68px)/3)}
@media (max-width:1020px){.cards>.rcard{width:calc((100% - 34px)/2)}.menu{grid-template-columns:1fr 1fr}}
.rcard{--rx:0deg;--ry:0deg;--lift:0px;position:relative;display:flex;flex-direction:column;color:var(--ink);text-decoration:none;background:var(--sheet);
  border:3px solid var(--ink);border-radius:26px;box-shadow:12px 12px 0 var(--ink);overflow:hidden;
  transform:perspective(1100px) rotateX(var(--rx)) rotateY(var(--ry)) translate(var(--lift),var(--lift));
  transition:transform .4s var(--spring),box-shadow .3s ease}
.rcard:hover{--lift:-5px;box-shadow:17px 17px 0 var(--ink),0 0 0 3px rgba(255,176,92,.8),0 0 34px 12px var(--glow)}
.rcard:active{--lift:3px;box-shadow:5px 5px 0 var(--ink)}
.rcard:focus-visible{outline:4px solid var(--sheet);outline-offset:5px}
.media{position:relative;display:block;aspect-ratio:16/10;border-bottom:3px solid var(--ink);overflow:hidden;background:var(--acc)}
.media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--spring)}
.rcard:hover .media img{transform:scale(1.07) rotate(-1deg)}
.hero-ico{position:absolute;inset:0;background:radial-gradient(120% 95% at 50% 32%,#fbe2ad 0%,#eeb066 28%,#c06d2c 58%,#5c2a0f 100%)}
.hero-ico .hi{position:absolute;overflow:visible;aspect-ratio:1;height:auto;animation:bob 6s ease-in-out infinite alternate;transition:transform .6s var(--spring)}
.hi-main{left:31%;top:12%;width:38%}
.hi-cookie{left:9%;top:52%;width:21%;animation-delay:-2s!important;animation-duration:7s!important}
.hi-cheese{right:8%;top:10%;width:22%;animation-delay:-4s!important}
.hi-fire{left:12%;top:8%;width:15%;animation-duration:4.5s!important}
.hi-egg{right:12%;top:58%;width:15%;animation-delay:-1s!important;animation-duration:8s!important}
.rcard:hover .hi-main{transform:scale(1.08) rotate(-4deg)}
.rbody{display:flex;flex-direction:column;gap:12px;padding:22px 24px 26px;flex:1}
.rbody h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(1.55rem,3.2vw,2.15rem);line-height:.98;text-wrap:balance}
.rsub{font-size:1.02rem;text-wrap:pretty}
.meta{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.meta li{border:2px solid var(--ink);border-radius:999px;background:var(--tile);padding:3px 12px;font-size:.92rem;font-weight:700;font-variant-numeric:tabular-nums}
.go{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:12px;font-family:var(--display);text-transform:uppercase;font-size:1.02rem;letter-spacing:.03em;
  color:var(--butter);background:var(--ink);border-radius:14px;padding:10px 10px 10px 18px;box-shadow:5px 5px 0 var(--acc)}
.go-a{width:34px;height:34px;border-radius:10px;background:var(--acc);display:grid;place-items:center}
.go-a svg{width:20px;height:20px;color:var(--sheet);animation:nudge 1.3s ease-in-out infinite}
.foot{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:8px 16px calc(28px + env(safe-area-inset-bottom,0px));text-align:center}
.foot .made{font-size:1.05rem;color:var(--sheet);background:var(--ink);border-radius:14px;padding:8px 16px;box-shadow:var(--drop)}
.foot .made b{font-family:var(--display);font-weight:400;letter-spacing:.02em}
.foot a{color:var(--butter);font-weight:700;text-underline-offset:3px}
.foot a:focus-visible{outline:2px solid var(--butter);outline-offset:3px;border-radius:4px}
.foot .icons{font-size:.8rem;color:var(--ink)}
@media (max-width:700px){
  .cards{gap:30px;margin-top:30px}
  .cards>.rcard{width:100%}
  .menu{grid-template-columns:1fr 1fr;gap:16px;margin-top:34px}
  .mtile{min-height:160px;padding:14px 14px 12px;border-radius:20px;box-shadow:6px 6px 0 var(--ink)}
  .soon-tile{box-shadow:6px 6px 0 rgba(20,18,16,.55)}
  .mt-i{width:46px;height:46px}
  .mt-n{font-size:1.12rem}
  .mt-f{flex-wrap:wrap;gap:6px}
  .mt-c{font-size:.8rem;padding:1px 9px}
  .mt-th{margin-left:0}.mt-th img{width:30px;height:30px;border-width:2px}.mt-th img+img{margin-left:-9px}
  .mtile .go-a{display:none}
  .pop{margin-top:48px}
  .pop-i{width:190px}.pop-track{gap:18px;padding-left:18px}
  .pop-i span{font-size:.92rem}
  .rh-i{width:84px;height:84px}
  .mega{-webkit-text-stroke:2.5px var(--ink);text-shadow:6px 6px 0 var(--ink)}
  .rcard{box-shadow:9px 9px 0 var(--ink)}
  .rbody{padding:18px 18px 22px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.pop-win{overflow-x:auto}}