@font-face{font-family:'Lilita One';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/lilita-one-400.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/nunito-sans-400.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/nunito-sans-700.woff2) format('woff2')}

:root{--cream:#fffef1;--dk:#f2f1e5;--gray:#ededde;--dg:#bebdb0;--off:#272831;--purple:#6d13ec;--green:#32c992;--yellow:#f2cd0f;--blue:#1a45c4;--ink:#000}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background-color:var(--cream);color:var(--ink);font-family:'Nunito Sans',system-ui,sans-serif;font-size:1.0625rem;line-height:1.55;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:'Lilita One','Nunito Sans',system-ui,sans-serif;font-weight:400;line-height:1.02;letter-spacing:-.01em;margin:0 0 .5em;text-wrap:balance}
p{margin:0 0 1em}
ul,dl,dd,blockquote,figure{margin:0;padding:0}
a{color:var(--blue)}
a:focus-visible,.btn:focus-visible{outline:3px solid var(--purple);outline-offset:3px}

/* ---- pacote (obrigatório) ---- */
.pular{position:absolute;left:-999px;top:8px;background:#000;color:#fff;padding:10px 16px;z-index:100;border-radius:8px}
.pular:focus{left:8px}
.rascunho{background:var(--off);color:var(--cream);font-size:.8125rem;text-align:center;padding:6px 12px;line-height:1.35}
.pacote{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;padding:8px 20px;background-color:var(--cream);border-bottom:1px solid var(--dg)}
.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:999px;color:#000;font-weight:700;text-decoration:none}
.pacote-abas a:hover{background:var(--gray)}
.pacote-abas a[aria-current="page"]{background:#000;color:var(--cream)}
.pacote-abas .curto{display:none}
.chat{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--green);color:#000;font-weight:700;text-decoration:none}
.chat:hover,.rodape-chat:hover{background:#28b07f}
.rodape{background-color:var(--off);color:var(--cream);padding:36px 20px 48px;text-align:center}
.rodape p{max-width:760px;margin:0 auto 14px}
.rodape-chat{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 22px;border-radius:999px;background:var(--green);color:#000;font-weight:700;text-decoration:none}
.rodape-fontes{font-size:.875rem;color:var(--dg)}
@media (max-width:720px){
  .pacote{padding:8px 12px}
  .pacote-abas .longo{display:none}
  .pacote-abas .curto{display:inline}
  .pacote-abas a{padding:0 10px}
}

/* ---- base de seção ---- */
.wrap{max-width:1400px;margin-inline:auto;padding-inline:20px}
.s{overflow-x:clip;padding-block:clamp(40px,5vw,72px);position:relative}
.eyebrow{font-size:.8125rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--purple);margin:0 0 .6em}
.t{font-size:clamp(2rem,4.6vw,3.9rem);margin-bottom:.45em}
.big{font-size:clamp(1.15rem,1.8vw,1.5rem);font-weight:700;line-height:1.3}
.lead{font-size:clamp(1.15rem,2vw,1.55rem);font-weight:700;line-height:1.3;max-width:62ch}
h3{font-size:1.5rem;margin-bottom:.35em}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:999px;background:var(--green);color:#000;font-family:'Lilita One',sans-serif;font-size:1.2rem;text-decoration:none;border:2px solid #000;transition:transform .2s}
@media (hover:hover) and (pointer:fine){.btn:hover{transform:translateY(-3px)}}
.btn.ghost{background:transparent}
.btn.dark{background:#000;color:var(--cream)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}

/* revelação: estado escondido só com JS */
.rv{transition:opacity .6s ease,transform .6s ease}
.com-js .rv:not(.in){opacity:0;transform:translateY(22px)}
@media (prefers-reduced-motion:reduce){
  .com-js .rv:not(.in){opacity:1;transform:none}
  .rv,.btn,.tray img{transition:none}
  html{scroll-behavior:auto}
}

/* alinhamento dos títulos por seção */
.s-table .t,.s-table .eyebrow,.s-table .big,.s-table .note,.s-table .rows{text-align:right}
.s-rail .t,.s-rail .eyebrow,.s-last .wrap{text-align:center}
.s-blitz .t,.s-blitz .eyebrow,.s-daily .t,.s-daily .eyebrow,.s-storage .t,.s-storage .eyebrow,.s-made .t,.s-made .eyebrow{text-align:right}

/* ---- 1 hero ---- */
.s-hero{padding-top:clamp(24px,3vw,40px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
@media (min-width:1000px){
  /* grade de 12 colunas: copy em 7, foto em 5 (mesmo desenho do 7fr/5fr) */
  .hero-grid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(32px,4vw,64px);row-gap:20px;align-items:center}
  .hero-grid .hero-copy{grid-column:1/8}
  .hero-grid .hero-photo{grid-column:8/13}
  .s-hero .hero-photo{margin-top:0}
  .s-hero .hero-photo img{aspect-ratio:4/5;object-position:55% center}
}
.mega{font-size:clamp(2.6rem,5.2vw,5rem);letter-spacing:-.02em;margin-bottom:.25em;text-wrap:pretty}
.chip{margin:0 0 14px}
.chip a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;background:var(--green);color:#000;font-weight:700;text-decoration:none}
.s-hero .lead{max-width:none;margin-bottom:.4em}
.intro{max-width:1000px}
.hero-photo{margin-top:20px}
.hero-photo img{width:100%;aspect-ratio:3/1;object-fit:cover;border-radius:28px}

/* ---- 2 pieces ---- */
.pieces-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:stretch}
.fill{position:relative;overflow:hidden;border-radius:28px;min-height:320px}
.fill img{width:100%;height:100%;object-fit:cover}
.dots{list-style:none}
.dots li{position:relative;padding:8px 0 8px 28px}
.dots li::before{content:"";position:absolute;left:0;top:.9em;width:14px;height:14px;border-radius:50%;background:var(--purple)}

/* ---- 3 table (cor) ---- */
.s-table{background-color:var(--purple);color:var(--cream)}
.s-table .eyebrow{color:var(--cream)}
.rows{list-style:none;margin:28px 0}
.rows li{border-top:2px solid var(--cream);padding:18px 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 32px;align-items:baseline}
.rows h3{font-size:clamp(1.8rem,3.6vw,3rem);margin:0;color:var(--yellow)}
.rows p{margin:0;font-size:1.2rem;font-weight:700}
.note{max-width:62ch;margin-left:auto}

/* ---- cartões e bandejas ---- */
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:24px;align-items:stretch}
.card{display:flex;flex-direction:column;gap:12px;background-color:#fff;border:2px solid #000;border-radius:24px;padding:20px}
.card p{margin:0}
.card .shot{width:100%;border-radius:14px}
.card .head{display:flex;gap:16px;align-items:flex-start}
.card .sq{width:104px;height:104px;object-fit:cover;border-radius:14px;flex:none}
.tray{background-color:var(--dk);border-radius:16px;padding:12px;margin-top:auto;transition:box-shadow .25s}
.tray img{width:100%;transition:transform .25s ease}
.tray:focus-within{box-shadow:0 8px 0 rgba(0,0,0,.18)}
@media (hover:hover) and (pointer:fine){
  .tray:hover{box-shadow:0 8px 0 rgba(0,0,0,.18)}
  .tray:hover img{transform:translateY(-6px) rotate(-.6deg)}
}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.two img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px}
.lead+.duo{margin-top:28px}

/* ---- 5 retro rail (escuro) ---- */
.s-rail{background-color:var(--off);color:var(--cream)}
.s-rail .eyebrow{color:var(--yellow)}
.cols3{columns:3;column-gap:36px;margin:8px 0 28px;text-align:left}
.cols3 p{break-inside:avoid}
.cols3 strong{color:var(--yellow)}
.rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.rail .tray{margin-top:0;background-color:var(--cream)}

/* ---- 6 bloogs ---- */
.bloogs-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:stretch}
.media{display:flex;flex-direction:column;gap:14px}
.media .shot{width:100%;border-radius:20px}
.media .two{flex:1 1 auto;min-height:0}
.media .two img{aspect-ratio:auto}

/* ---- 7 blitz (foto) ---- */
.s-blitz{padding-block:40px}
.s-blitz .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.s-blitz .wrap{position:relative;z-index:1}
.blitz-flex{display:flex;justify-content:space-between;align-items:flex-end;gap:32px}
.boxart{width:320px;border-radius:20px;border:4px solid var(--cream)}
.panel{width:min(760px,100%);background-color:var(--cream);border-radius:28px;padding:28px}
.panel .t{font-size:clamp(1.9rem,3.6vw,3rem)}
.panel .tray{margin-top:8px}
.panel p{margin-bottom:.8em}

/* ---- 8 case files ---- */
.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:20px;text-align:left}
.cards3 .card{padding:18px}
.cards3 .card .shot{aspect-ratio:16/9;object-fit:cover}
.cards3 .card .tray{margin-top:auto}

/* ---- 9 daily ---- */
.daily-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:start}
.sticky{position:sticky;top:20px}
.s-daily .txt{text-align:right}
.daily-grid .media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.daily-grid .media img{width:100%;height:100%;min-height:300px;object-fit:cover;border-radius:20px}

/* ---- 10 olympus (cor) ---- */
.s-olympus{background-color:var(--yellow)}
.s-olympus .eyebrow{color:#000}
.olympus-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px);align-items:stretch}
.s-olympus .shot{border-radius:20px}
.s-olympus .tray{background-color:var(--cream);margin-top:auto}
.s-olympus .media{height:100%}

/* ---- 11 sports ---- */
.sports-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px);align-items:start}
.s-sports .media .two img{aspect-ratio:1/1;height:auto}

/* ---- 13 shelf (claro) ---- */
.s-shelf{background-color:var(--dk)}
.cards4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:24px}
.cards4 .card{padding:16px}
.cards4 .card .shot{aspect-ratio:1/1;object-fit:cover}
.price{font-weight:700}
.more{display:inline-flex;align-items:center;min-height:44px;margin-top:auto;font-weight:700}

/* ---- 14 storage ---- */
.storage-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:stretch}
.s-storage .txt{text-align:left}
.s-storage .t,.s-storage .eyebrow{text-align:right}
.gear>div{border-top:2px solid #000;padding:12px 0}
.gear dt{font-weight:700;font-size:1.1rem}
.gear dd{margin:2px 0 0}
.storage-grid .media{display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:14px}
.storage-grid .media img{width:100%;height:100%;aspect-ratio:16/10;object-fit:contain;mix-blend-mode:multiply}

/* ---- 15 made ---- */
.made-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,4vw,56px);align-items:stretch}
.beliefs{list-style:none;margin-bottom:20px}
.beliefs li{font-family:'Lilita One',sans-serif;font-size:clamp(1.3rem,2.2vw,1.9rem);line-height:1.15;padding:10px 0;border-top:2px solid #000}
.founder{margin:0 0 20px;padding:20px 24px;background-color:var(--dk);border-radius:20px}
.founder footer{font-weight:700}
.tray.clip{max-width:380px;margin-top:0}

/* ---- fundos chapados extras (variáveis do site) ---- */
.s-pieces,.s-daily,.s-faq{background-color:var(--dk)}
.s-voices{background-color:var(--blue);color:var(--cream)}
.s-voices .eyebrow{color:var(--yellow)}
.s-voices .score{color:#000}

/* ---- 16 voices ---- */
.quote{margin:12px 0 28px}
.quote p{font-family:'Lilita One',sans-serif;font-size:clamp(1.7rem,4.4vw,3.6rem);line-height:1.08;margin-bottom:.5em;max-width:none}
.quote footer{font-weight:700;font-size:1.1rem}
.score{list-style:none;display:flex;flex-wrap:wrap;gap:16px}
.score li{flex:1 1 280px;border:2px solid #000;border-radius:20px;padding:16px 20px;display:flex;flex-direction:column;gap:4px;background-color:var(--green)}
.score strong{font-family:'Lilita One',sans-serif;font-weight:400;font-size:1.8rem;line-height:1.1}

/* ---- 17 stores ---- */
.s-stores .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(24px,4vw,56px);align-content:center}
.s-stores .wrap>*{grid-column:1}
.s-stores .wrap>.cities{grid-column:2;grid-row:1/6;align-self:stretch}
.cities{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;align-content:center;margin:0;border:2px solid #000;border-radius:24px;padding:20px 24px;background-color:var(--dk)}
.cities li{position:relative;padding:12px 0 12px 26px;break-inside:avoid;font-weight:700;font-size:1.2rem}
@media (max-width:860px){.s-stores .wrap{display:block}.cities{margin-top:20px}}
@media (max-width:480px){.cities{grid-template-columns:minmax(0,1fr)}.cities li{padding-block:8px}}
.cities li::before{content:"";position:absolute;left:4px;top:1.05em;width:10px;height:10px;background:var(--blue);transform:rotate(45deg)}
.s-stores p{max-width:68ch}

/* ---- 18 faq ---- */
.qa{columns:2;column-gap:48px;text-align:left}
.qa>div{break-inside:avoid;margin-bottom:28px;border-top:2px solid #000;padding-top:12px}
.qa dt{font-weight:700;font-size:1.2rem;margin-bottom:6px}
.qa dd{margin:0}

/* ---- 19 last move (cor) ---- */
.s-last{background-color:var(--green);color:#000;padding-block:clamp(48px,6vw,88px)}
.s-last .eyebrow{color:#000}
.s-last .big{max-width:30ch;margin-inline:auto}
.s-last p{max-width:56ch;margin-inline:auto}
.s-last .t{font-size:clamp(2.4rem,7vw,5.5rem)}

/* ---- trilha do peão ---- */
.track{position:fixed;left:0;right:0;bottom:0;height:10px;background-color:var(--off);z-index:20;pointer-events:none}
.peg{position:absolute;top:-6px;left:calc(var(--p,0) * (100% - 22px));width:22px;height:22px;border-radius:50%;background-color:var(--yellow);border:3px solid #000}

/* ---- responsivo ---- */
@media (max-width:1000px){
  .cards4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards3{grid-template-columns:minmax(0,1fr)}
  .cols3{columns:1}
  .qa{columns:1}
}
@media (max-width:860px){
  .pieces-grid,.bloogs-grid,.daily-grid,.olympus-grid,.sports-grid,.storage-grid,.made-grid,.duo,.rail{grid-template-columns:minmax(0,1fr)}
  .fill{min-height:0}
  .fill img{height:auto}
  .sticky{position:static}
  .rows li{grid-template-columns:minmax(0,1fr)}
  .blitz-flex{flex-direction:column;align-items:flex-start}
  .boxart{width:180px}
  .panel{padding:20px}
  .hero-photo img{aspect-ratio:4/3}
  .storage-grid .media{grid-template-rows:none;grid-template-columns:repeat(2,minmax(0,1fr))}
  .storage-grid .media img{aspect-ratio:1/1}
  .media .two img{aspect-ratio:1/1}
  .made-grid .fill img{max-height:560px;object-position:top}
  .daily-grid .media{grid-template-columns:minmax(0,1fr)}
  .daily-grid .media img{min-height:0;height:auto}
}
@media (max-width:560px){
  body{font-size:1rem}
  .cards4{grid-template-columns:minmax(0,1fr)}
  .card .head{flex-direction:column}
  .rodape{padding-bottom:56px}
}
