@font-face{font-family:Fraunces;font-weight:400;font-style:normal;font-display:swap;src:url(fonts/fraunces-400.woff2) format("woff2")}
@font-face{font-family:Fraunces;font-weight:900;font-style:normal;font-display:swap;src:url(fonts/fraunces-900.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/hanken-grotesk-400.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/hanken-grotesk-500.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/hanken-grotesk-700.woff2) format("woff2")}
@font-face{font-family:"Space Mono";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/space-mono-400.woff2) format("woff2")}
@font-face{font-family:"Space Mono";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/space-mono-700.woff2) format("woff2")}

:root{--y:#ffe845;--k:#000;--cream:#ffefe1;--card:#fbf8f1;--org:#ff4713;--blue:#136f99;--green:#10312b;--ink:#1a172c}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--y);color:var(--k);font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:18px;line-height:1.5}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
a:focus-visible,button:focus-visible{outline:3px solid var(--org);outline-offset:3px}

/* bloco do pacote */
.pular{position:absolute;left:8px;top:-60px;z-index:20;background:var(--k);color:var(--y);padding:12px 16px;border-radius:14px;font-weight:700}
.pular:focus{top:8px}
.rascunho{background:var(--cream);color:var(--k);font-family:"Space Mono",monospace;font-size:13px;line-height:1.4;padding:8px 20px;text-align:center;border-bottom:2px solid var(--k)}
.pacote{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;background:var(--k);color:var(--y);padding:6px 20px}
.pacote-abas{display:flex;flex-wrap:wrap;gap:4px}
.pacote-abas a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:14px;color:var(--y);text-decoration:none;font-family:"Space Mono",monospace;font-size:14px;font-weight:700}
.pacote-abas a:hover{background:#222}
.pacote-abas a[aria-current="page"]{background:var(--y);color:var(--k)}
.pacote .curto{display:none}
.chat{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:14px;background:var(--y);color:var(--k);text-decoration:none;font-family:"Space Mono",monospace;font-size:14px;font-weight:700}
.chat:hover,.rodape-chat:hover{background:#fff}
.rodape{background:var(--k);color:#fff;padding:40px 28px;font-family:"Space Mono",monospace;font-size:14px;line-height:1.6}
.rodape p{margin:0 0 10px;max-width:90ch}
.rodape-chat{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:14px;background:var(--y);color:var(--k);text-decoration:none;font-weight:700}
.rodape-fontes{color:#fff}

/* base de seção */
.s{position:relative;overflow-x:clip;border-top:2px solid var(--k);padding:96px 0}
.wrap{max-width:1384px;margin:0 auto;padding:0 28px}
.wrap.narrow{max-width:1220px}
.eb,.mono{font-family:"Space Mono",monospace;text-transform:uppercase;letter-spacing:.1em;font-size:13px;font-weight:700}
.eb{margin-bottom:16px}
.t{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(32px,4.6vw,72px);line-height:1;letter-spacing:-.02em;max-width:24ch;margin-bottom:28px;text-wrap:balance}
.sub{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(24px,2.6vw,38px);line-height:1.05;margin:36px 0 14px}
.intro{max-width:64ch;font-size:19px;margin-bottom:44px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:2px solid var(--k);border-radius:14px;background:var(--k);color:var(--y);text-decoration:none;font-family:"Space Mono",monospace;text-transform:uppercase;font-size:14px;font-weight:700;letter-spacing:.04em}
.btn:hover{background:var(--y);color:var(--k)}
.btn.big{min-height:64px;padding:0 36px;font-size:18px}
.price{font-family:"Space Mono",monospace;font-size:14px;font-weight:700;margin:12px 0}
.card{background:var(--card);border:2px solid var(--k);border-radius:28px;overflow:hidden;display:grid;place-items:center}
.card img{width:100%}

/* revelação */
.rv{transition:opacity .6s ease,transform .6s ease}
.com-js .s:not(.in) .rv{opacity:0;transform:translateY(22px)}
@media (prefers-reduced-motion:reduce){.rv{transition:none}.com-js .s:not(.in) .rv{opacity:1;transform:none}}

/* 1 roost */
#roost{background-color:var(--green);color:var(--y);padding:56px 0 64px;border-top:0}
#roost .wrap{position:relative}
.wordmark{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:min(10.2vw,150px);line-height:.9;letter-spacing:-.045em;margin:6px 0 24px;color:var(--y)}
.hero-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;margin-bottom:36px}
.lede{flex:1 1 320px;max-width:none;font-size:clamp(20px,2.4vw,34px);line-height:1.25;color:#fff;margin:0}
.sticker{flex:none;transform:rotate(-8deg);background:var(--y);color:var(--k);border:2px solid var(--k);border-radius:50% 46% 52% 44%;padding:26px 30px;max-width:200px;text-align:center;font-family:"Space Mono",monospace;font-weight:700;font-size:15px;line-height:1.2}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.trio .card{color:var(--k)}
.trio .c1,.trio .c3{border-radius:28px}
.trio .c2{border-radius:0;clip-path:polygon(0 8%,8% 0,92% 0,100% 8%,100% 92%,92% 100%,8% 100%,0 92%)}

/* 2 tv-strip */
#tv-strip{background-color:var(--org);color:var(--k);padding:12px 0 14px}
.strip-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:0 28px;max-width:1384px;margin:0 auto}
.strip-label{margin:0;font-size:13px}
.pause{min-height:44px;padding:0 18px;border:2px solid var(--k);border-radius:14px;background:var(--k);color:var(--y);font-family:"Space Mono",monospace;font-size:13px;font-weight:700;text-transform:uppercase;cursor:pointer}
.pause:hover{background:var(--y);color:var(--k)}
.strip-window{overflow:hidden;padding:8px 0 0}
.strip-track{display:flex;flex-wrap:wrap;gap:14px;padding:0 28px}
.strip-track li{flex:none;width:64px;height:64px;background:var(--card);border:2px solid var(--k);border-radius:14px;display:grid;place-items:center;overflow:hidden}
.strip-track img{width:100%;height:100%;object-fit:contain}
@media (prefers-reduced-motion:no-preference){
  .com-js .strip-track{flex-wrap:nowrap;width:max-content;animation:marquee 30s linear infinite}
  .com-js .strip-track[data-paused]{animation-play-state:paused}
}
@keyframes marquee{from{transform:translateX(100vw)}to{transform:translateX(-100%)}}

/* 3 squeeze */
#squeeze{background-color:var(--y);padding:110px 0}
.statement{font-family:"Hanken Grotesk",sans-serif;font-weight:500;font-size:clamp(26px,4.2vw,61px);line-height:1.08;letter-spacing:-.035em;text-align:center;text-wrap:balance}

/* 4 heat-ladder */
#heat-ladder{background-color:var(--cream)}
.ladder{display:grid;gap:30px}
.rung{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:32px;align-items:stretch;padding-bottom:28px;border-bottom:6px solid var(--k);margin-left:calc(var(--n,0) * 4.5vw);max-width:1000px}
.lvl1{--n:0}.lvl2{--n:1}.lvl3{--n:2}.lvl4{--n:3}
.rung .card{align-self:stretch}
.rung-text{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.rung-text h3{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(26px,2.8vw,40px);line-height:1.05}
.level{display:inline-block;background:var(--k);color:var(--y);padding:5px 12px;border-radius:14px;margin:0}
.rung-text .btn{margin-top:auto}

/* 5 three-aisles */
#three-aisles{background-color:var(--y)}
#three-aisles .t,#three-aisles .eb{margin-left:auto;margin-right:auto;text-align:center}
.aisles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:40px}
.aisle{display:flex;flex-direction:column;align-items:center;gap:16px;background:var(--card);border:2px solid var(--k);padding:24px;text-align:center}
.aisle figure{width:100%;max-width:400px}
.aisle .btn{margin-top:auto}
.a-classic{border-radius:36px}
.a-organic{clip-path:polygon(0 28px,28px 0,calc(100% - 28px) 0,100% 28px,100% calc(100% - 28px),calc(100% - 28px) 100%,28px 100%,0 calc(100% - 28px))}
.a-small{border-radius:12px;border-style:dashed;border-width:3px}
.tag{display:inline-block;background:var(--y);border:2px solid var(--k);border-radius:14px;padding:6px 16px;font-family:"Space Mono",monospace;font-weight:700;font-size:16px}

/* 6 birdhouse */
#birdhouse{background-color:var(--blue);color:#fff}
.grid12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:28px;row-gap:40px}
.bh-text{grid-column:1 / span 7}
.bh-text p{margin-bottom:16px;max-width:62ch}
.bh-media{grid-column:9 / span 4;position:sticky;top:24px;align-self:start;display:grid;gap:20px}
.bh-media .card.wide{border-radius:14px}
.pull{font-family:Fraunces,Georgia,serif;font-weight:400;font-size:clamp(24px,2.6vw,34px);line-height:1.2}
.founders{margin:24px 0 8px}
.promise{display:grid;gap:0}
.promise li{border-top:2px solid #fff;padding:14px 0;max-width:62ch}

/* 7 word-on-the-bird */
#word-on-the-bird{background-color:var(--ink);color:#fff}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px}
.sticky-stat{position:sticky;top:24px;align-self:start;display:grid;gap:10px}
.sticky-stat .mono{color:var(--y);margin:0}
.big{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(64px,9vw,140px);line-height:.9;color:var(--y)}
.big.sm{font-size:clamp(48px,6vw,96px)}
.sticky-stat .card{max-width:300px;margin-top:12px}
.quote{border-top:2px solid var(--y);padding:32px 0}
.quote blockquote p{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(24px,2.7vw,40px);line-height:1.12;color:var(--y);margin-bottom:16px}
.who{color:#fff;margin:0}

/* 8 tv-guide (sem fundo próprio) */
.guide{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:48px;margin-bottom:40px}
.show{grid-column:span 3;border-top:2px solid var(--k);padding:22px 0 26px}
.show:nth-child(-n+3){grid-column:span 2}
.show h3{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(26px,3vw,42px);line-height:1.05;margin:10px 0 12px}
.show p{margin-bottom:10px;max-width:60ch}
.slot{display:inline-block;background:var(--k);color:var(--y);padding:4px 12px;border-radius:14px;margin:0}
.meta{font-family:"Space Mono",monospace;font-size:14px;font-weight:700}

/* 9 flavor-shelf */
#flavor-shelf{background-color:var(--cream)}
#flavor-shelf .t,#flavor-shelf .eb,#flavor-shelf .intro{margin-left:auto;text-align:right}
.shelf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.item{background:var(--card);border:2px solid var(--k);border-radius:20px;padding:18px}
.item .card{margin-bottom:14px}
.item h3,.bag h3,.set h3,.plot h3{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:26px;line-height:1.05}
.item p{margin-bottom:10px}

/* 10 gallon-bay */
#gallon-bay{background-color:var(--k);color:#fff}
#gallon-bay .t,#gallon-bay .eb{color:var(--y)}
.bags{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.bag{display:flex;flex-direction:column;background:var(--card);color:var(--k);border:2px solid var(--y);border-radius:20px;padding:16px}
.bag .price{margin-top:auto;padding-top:8px}
.bag .card{border:0;border-radius:12px;background:transparent;margin-bottom:10px}
.bag p{margin-bottom:8px}

/* 11 flight-plans */
#flight-plans{background-color:var(--y)}
.fp-side{grid-column:1 / span 4;position:sticky;top:24px;align-self:start;display:grid;gap:16px}
.fp-side .card{max-width:220px}
.faq{grid-column:6 / span 7}
.qa{border-top:2px solid var(--k);padding:20px 0}
.qa dt{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(22px,2.2vw,30px);line-height:1.1;margin-bottom:10px}
.qa dd{max-width:64ch}

/* 12 variety-sets */
#variety-sets{background-color:var(--cream)}
.sets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.set{background:var(--card);border:2px solid var(--k);border-radius:20px;padding:20px}
.set .card{margin-bottom:14px}
.set p{margin-bottom:10px}
.giftnote{max-width:80ch;margin-top:44px;border-top:2px solid var(--k);padding-top:22px}

/* 13 sauce-school (sem fundo próprio) */
.grid2{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px}
.ss-text p{margin-bottom:16px;max-width:64ch}
.ss-media{position:sticky;top:24px;align-self:start;display:grid;gap:20px}
.ss-media .card{max-width:360px}

/* 14 organic-field */
#organic-field{background-color:var(--ink);color:#fff}
#organic-field .t,#organic-field .eb{color:var(--y)}
.field{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.plot{background:var(--card);color:var(--k);border-radius:20px;padding:16px}
.plot .card{margin-bottom:12px}
.plot p{margin-bottom:8px}

/* 15 cta-final */
#cta-final{background-color:var(--y);text-align:center}
#cta-final .t,#cta-final .intro{margin-left:auto;margin-right:auto;text-align:center}
.notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:48px;text-align:left}
.note{background:var(--card);border:2px solid var(--k);border-radius:20px;padding:20px}
.note img{width:100%;max-width:180px;margin-bottom:10px}

@media (max-width:1099px){
  .bags{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:1100px){
  .bags{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media (max-width:900px){
  .s{padding:56px 0}
  .wrap{padding:0 18px}
  .rung{grid-template-columns:minmax(0,1fr);margin-left:0}
  .rung .card{max-width:260px}
  .aisles,.shelf,.sets,.field,.notes{grid-template-columns:minmax(0,1fr)}
  .bh-text,.bh-media,.fp-side,.faq{grid-column:1 / -1}
  .bh-media,.fp-side,.ss-media,.sticky-stat{position:static}
  .split,.grid2{grid-template-columns:minmax(0,1fr);gap:36px}
  .guide{grid-template-columns:minmax(0,1fr)}
  .show,.show:nth-child(-n+3){grid-column:auto}
  .bag .card{max-width:240px;margin-left:auto;margin-right:auto}
  .sticker{position:static;display:inline-block;margin-bottom:20px;transform:rotate(-4deg)}
  .trio{gap:8px}
  .lede{font-size:19px}
  #flavor-shelf .t,#flavor-shelf .eb,#flavor-shelf .intro{text-align:left;margin-left:0}
  .bh-media .card,.ss-media .card,.fp-side .card,.sticky-stat .card{max-width:300px}
}
@media (max-width:700px){
  .pacote .longo{display:none}
  .pacote .curto{display:inline}
  .pacote{padding:6px 12px}
  .trio{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .trio .c1{grid-column:1 / -1}
  .pacote-abas a{padding:0 10px;font-size:13px}
}