/* SIGMA by Ceica Mota, site por T1 Digital */

/* Topo editorial SIGMA: intro preto com shuffle de fotos, cortina marfim,
   palavra viaja para o titulo gigante. Marca preto + dourado, pagina marfim. Tema unico. */
:root{
  --preto:#0A0807;
  --marfim:#EFE8DC;
  --ouro:#D2A13A;
  --ouro-texto:#8A6912;
  --grafite:#15110D;
  --linha:rgba(21,17,13,.18);
  --display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --script:"Cormorant Garamond",Georgia,serif;
  color-scheme: light;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--preto);
  color:var(--marfim);
  font-family:var(--display);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.gutter{
  padding-left:max(16px,env(safe-area-inset-left,0px));
  padding-right:max(16px,env(safe-area-inset-right,0px));
}

/* ---------- PRELOADER ---------- */
#pre{position:fixed; inset:0; z-index:90; background:var(--preto); display:grid; place-items:center; overflow:hidden; transition:background-color .45s linear}
#pre.clear{background:transparent; pointer-events:none}
#pre[hidden]{display:none!important}
#site{transition:transform .95s cubic-bezier(.22,1,.36,1), opacity .5s linear .1s}
#site.down{transform:translateY(86px); opacity:0}
#stack{
  --w:clamp(150px,15.5vw,300px);
  position:absolute; top:50%; left:50%;
  width:var(--w); height:calc(var(--w)*4/3);
  margin:calc(var(--w)*-2/3) 0 0 calc(var(--w)/-2);
  transform:scale(.26);
  transition:transform 2.4s cubic-bezier(.6,.05,.28,.99), opacity .26s ease;
}
#stack.go{transform:scale(1)}
#stack.out{opacity:0; transform:scale(.88)}
#stack .ph{position:absolute; inset:0; background-size:cover; background-position:center 30%; will-change:transform,opacity}
#wipe{position:absolute; inset:0; z-index:2; background:var(--preto); transform:scaleY(0); transform-origin:50% 100%}
#wipe.up{transform:scaleY(1); transition:transform .72s cubic-bezier(.76,0,.24,1)}
#word{
  position:relative; z-index:3;
  font-weight:900; font-variation-settings:"wdth" 120,"wght" 900;
  font-size:clamp(3.2rem,7.6vw,11rem);
  letter-spacing:-.03em; line-height:.82;
  overflow:hidden;
  color:#fff; mix-blend-mode:difference;
  transform-origin:50% 50%; white-space:nowrap;
}
#word.plain{mix-blend-mode:normal; color:var(--marfim)}
#word.fly{transition:transform .92s cubic-bezier(.76,0,.24,1), color .3s linear .34s}
#word .ltr{display:inline-block; will-change:transform,opacity}
#word .by{
  font-family:var(--script); font-style:italic; font-weight:600;
  font-size:.16em; letter-spacing:.02em; vertical-align:1.05em;
  margin-left:.18em; white-space:nowrap;
  transition:opacity .3s linear;
}
#word.fly .by{opacity:0}
#count{
  position:absolute; z-index:3;
  top:calc(50% - clamp(58px,5.4vw,104px));
  left:calc(50% + clamp(100px,16vw,312px));
  font-size:clamp(.95rem,1.6vw,1.9rem); font-weight:500; letter-spacing:.08em;
  color:var(--ouro); font-variant-numeric:tabular-nums;
}
@media (max-width:640px){ #count{top:max(18px,env(safe-area-inset-top,0px)); left:auto; right:18px} }

/* ---------- TICKER ---------- */
.ticker{background:var(--preto); color:var(--ouro); border-bottom:1px solid rgba(210,161,58,.22); overflow:hidden; font-size:.74rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase}
.ticker .trk{display:flex; width:max-content; animation:tk 26s linear infinite; padding-block:9px}
.ticker span{white-space:nowrap; padding-right:14px}
.ticker b{color:rgba(239,232,220,.45); font-weight:600; padding-right:14px}
@keyframes tk{to{transform:translateX(-50%)}}

/* ---------- TOPO ---------- */
.bar{display:flex; align-items:center; gap:14px; padding-block:14px 8px; font-size:.9rem; font-weight:600}
.bar img{width:38px; height:38px; display:block}
.bar .nm{line-height:1.05}
.bar .nm b{display:block; font-weight:900; font-variation-settings:"wdth" 120,"wght" 900; letter-spacing:-.03em; font-size:1.06rem; color:var(--ouro)}
.bar .nm i{font-family:var(--script); font-weight:600; font-size:.86rem; color:var(--ouro); white-space:nowrap}
.bar nav{margin-left:auto; display:flex; gap:10px; align-items:center}
.bar nav .ig{color:var(--marfim); text-decoration:none; font-size:.84rem; letter-spacing:.03em}
.bar nav .ig span{display:none}
@media(min-width:720px){.bar nav .ig span{display:inline}}
.wab{
  background:var(--ouro); color:var(--preto); text-decoration:none;
  font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:10px 16px; display:inline-block;
}

.hero{padding-block:2px 0}
.ban{position:relative; width:100%; aspect-ratio:3.92/1; margin-block:10px 16px; overflow:hidden}
@media(max-width:768px){.ban{aspect-ratio:1122/1402}}
.ban .bsl{position:absolute; inset:0; z-index:0; visibility:hidden}
.ban .bsl.prev{visibility:visible; z-index:1}
.ban .bsl.on{visibility:visible; z-index:2; animation:bwipe .85s cubic-bezier(.76,0,.24,1) both}
@keyframes bwipe{from{clip-path:polygon(0 0,0 0,-18% 100%,0 100%)} to{clip-path:polygon(0 0,118% 0,100% 100%,0 100%)}}
.ban .bsl picture{display:block; width:100%; height:100%}
.ban .bsl img{width:100%; height:100%; object-fit:cover; display:block}
.ban .bsl.on img,.ban .bsl.prev img{animation:bzoom 5.4s linear both}
@keyframes bzoom{from{transform:scale(1)} to{transform:scale(1.085)}}
.bbar{position:absolute; left:0; bottom:0; height:3px; width:100%; background:rgba(239,232,220,.18); z-index:3}
.bbar i{display:block; height:100%; width:0; background:var(--ouro)}
.bbar i.go{animation:bbarw 4s linear both}
@keyframes bbarw{from{width:0} to{width:100%}}
.bdots{position:absolute; right:12px; bottom:12px; display:flex; gap:7px; z-index:3}
.bdots button{width:10px; height:10px; border-radius:50%; border:0; cursor:pointer; padding:0; background:rgba(239,232,220,.4)}
.bdots button.on{background:var(--ouro)}

.meta{
  display:grid; gap:18px 30px;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  padding-block:14px 24px; font-size:.85rem; line-height:1.5;
}
.meta .lbl{font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ouro); margin:0 0 7px}
.meta h1{font-size:.92rem; font-weight:700; margin:0; letter-spacing:.02em; max-width:24ch}
.meta p{margin:0; max-width:36ch}
.meta .dim{color:rgba(239,232,220,.55)}
.meta a{color:var(--marfim); font-weight:600; text-decoration:none; display:block; margin-bottom:8px; font-size:.84rem}
.meta a small{color:var(--ouro); font-weight:700; letter-spacing:.06em; text-transform:uppercase; display:block; font-size:.68rem}
.hrs{list-style:none; margin:0; padding:0}
.hrs li{display:flex; justify-content:space-between; gap:14px; padding:2px 0; color:rgba(239,232,220,.72)}
.hrs li.hoje{color:var(--marfim); font-weight:700}
.hrs li.hoje::after{content:"hoje"; color:var(--ouro); font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; align-self:center}

.strip{overflow:hidden; padding-bottom:40px}
.strip .trk2{display:flex; width:max-content; animation:st 40s linear infinite}
.strip .cell{width:clamp(130px,16vw,190px); aspect-ratio:3/4; flex:none; margin-right:10px; background-size:cover; background-position:center 28%}
@keyframes st{to{transform:translateX(-50%)}}

@media (prefers-reduced-motion:reduce){
  #stack,#wipe,#word{transition:none!important}
  .ticker .trk{animation:tk 26s linear infinite!important}
  .strip .trk2{animation:st 40s linear infinite!important}
}


/* ---------- SECOES (padrao T1) ---------- */
:root{ --sec2:#100E0D; --card:#17120E; --borda:rgba(210,161,58,.22); --verde:#25D366 }
.sec{padding-block:clamp(50px,7.4vw,84px)}
.sec.alt{background:var(--sec2)}
.sec.glow{background:radial-gradient(circle at 86% 10%, rgba(210,161,58,.13), transparent 58%), var(--preto)}
.hd{text-align:center; max-width:760px; margin:0 auto clamp(26px,3.6vw,40px)}
.eyb{
  display:inline-flex; align-items:center; gap:7px; margin:0 0 14px;
  background:rgba(210,161,58,.14); color:var(--ouro);
  font-size:.7rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  padding:7px 15px; border-radius:999px;
}
.tt{margin:0; font-weight:900; font-variation-settings:"wdth" 106,"wght" 900; letter-spacing:-.025em; line-height:1.1; font-size:clamp(1.55rem,4.2vw,2.5rem); color:var(--marfim); text-wrap:balance}
.tt .hl{color:var(--ouro)}
.sub{margin:14px auto 0; font-size:.95rem; line-height:1.62; color:rgba(239,232,220,.6); max-width:58ch}
.pp{margin:14px 0 0; font-size:.96rem; line-height:1.65; color:rgba(239,232,220,.7); max-width:56ch}
.ctr{display:flex; justify-content:center; margin-top:30px}
.ic{width:18px; height:18px; flex:none}
.ic-t{width:24px; height:24px}

.bt{display:inline-flex; align-items:center; gap:10px; text-decoration:none; border-radius:999px;
  font-weight:800; font-size:.86rem; letter-spacing:.02em; padding:14px 26px;
  transition:transform .18s ease, background .18s ease, color .18s ease}
.bt:hover{transform:translateY(-2px)}
.bt-ouro{background:var(--ouro); color:var(--preto); box-shadow:0 8px 28px rgba(210,161,58,.26)}
.bt-out{background:transparent; color:var(--marfim); box-shadow:inset 0 0 0 1.5px var(--borda)}
.bt-out:hover{background:var(--ouro); color:var(--preto)}
.bt-verde{background:var(--verde); color:#06301A; width:100%; justify-content:center}
.bt-esc{background:var(--preto); color:var(--marfim); width:100%; justify-content:center; border-radius:14px; box-shadow:inset 0 0 0 1px var(--borda)}

/* marquee */
.marq{overflow:hidden; border-block:1px solid var(--borda); background:var(--preto)}
.marq-trk{display:flex; align-items:center; width:max-content; animation:marq 36s linear infinite; padding-block:14px}
@keyframes marq{to{transform:translateX(-50%)}}
.marq i{font-style:normal; white-space:nowrap; padding-inline:22px;
  font-weight:900; font-variation-settings:"wdth" 116,"wght" 900;
  font-size:clamp(2.1rem,7vw,5rem); letter-spacing:-.025em; line-height:1; color:#5E4A20}
.marq b{width:clamp(10px,1.4vw,18px); height:clamp(10px,1.4vw,18px); border-radius:50%; background:var(--ouro); flex:none}

/* a loja */
.gd2{display:grid; gap:clamp(24px,4vw,52px); grid-template-columns:1fr; align-items:center}
@media(min-width:900px){.gd2{grid-template-columns:minmax(0,clamp(280px,28vw,400px)) minmax(0,1fr); max-width:1080px; margin-inline:auto}}
.foto{border-radius:20px; overflow:hidden; box-shadow:0 18px 50px rgba(0,0,0,.6), inset 0 0 0 1px var(--borda)}
.foto img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover}
.lf{min-width:0}
.lf .eyb{margin-bottom:12px}
.lf .tt{text-align:left}
.chk{list-style:none; margin:22px 0 28px; padding:0; display:grid; gap:12px}
.chk li{display:flex; gap:12px; align-items:center; font-size:.92rem; font-weight:600; color:rgba(239,232,220,.88)}
.chk .cb{width:22px; height:22px; border-radius:50%; background:var(--ouro); color:var(--preto); display:grid; place-items:center; flex:none}
.chk .cb svg{width:13px; height:13px}

/* diferenciais */
.gd3{display:grid; gap:14px; grid-template-columns:1fr}
@media(min-width:620px){.gd3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.gd3{grid-template-columns:repeat(3,1fr)}}
.dcard{background:var(--card); border-radius:18px; padding:28px 22px; text-align:center; min-width:0; box-shadow:inset 0 0 0 1px var(--borda)}
.tile{width:50px; height:50px; border-radius:14px; background:rgba(210,161,58,.13); color:var(--ouro); display:grid; place-items:center; margin:0 auto 15px}
.dcard h3{margin:0 0 8px; font-size:1rem; font-weight:800; color:var(--marfim)}
.dcard p{margin:0; font-size:.86rem; line-height:1.55; color:rgba(239,232,220,.6)}

/* novidades */
.nbox{display:flex; flex-wrap:wrap; gap:20px; align-items:center; justify-content:space-between;
  padding:24px 26px; border-radius:18px; box-shadow:inset 0 0 0 1.5px var(--borda); margin-top:14px}
.nbox h3{margin:0 0 6px; font-size:1.02rem; font-weight:800; color:var(--marfim)}
.nbox p{margin:0; font-size:.88rem; line-height:1.5; color:rgba(239,232,220,.65); max-width:48ch}

/* instagram */
.iggd{display:grid; gap:10px; grid-template-columns:repeat(2,1fr)}
@media(min-width:620px){.iggd{grid-template-columns:repeat(4,1fr)}}
.iggd img{display:block; width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px}

/* faq */
.fgd{display:grid; gap:clamp(24px,4vw,46px); grid-template-columns:1fr; align-items:start}
@media(min-width:1024px){ .fgd{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)} .fap{position:sticky; top:24px} }
.fap .tt{text-align:left}
.fap .pp{margin-bottom:22px}
.fls{min-width:0; display:grid; gap:10px}
.fit{background:var(--card); border-radius:14px; box-shadow:inset 0 0 0 1px var(--borda); overflow:hidden}
.fit button{width:100%; display:flex; gap:16px; align-items:center; justify-content:space-between;
  background:none; border:0; cursor:pointer; text-align:left; font-family:inherit;
  font-size:.94rem; font-weight:700; color:var(--marfim); padding:18px 20px; line-height:1.4}
.fit .chev{color:var(--ouro); flex:none; transition:transform .25s ease; width:16px; height:16px}
.fit.on .chev{transform:rotate(180deg)}
.fit .ans{overflow:hidden; max-height:0; transition:max-height .32s ease}
.fit .ans p{margin:0; padding:0 20px 18px; font-size:.9rem; line-height:1.65; color:rgba(239,232,220,.66)}

/* contato */
.cgd{display:grid; gap:clamp(20px,3vw,30px); grid-template-columns:1fr; align-items:start}
@media(min-width:900px){
  .cgd{grid-template-columns:1fr 1fr; align-items:stretch}
  .cgd>div:last-child{display:flex; flex-direction:column}
  .cgd>div:last-child .mapa{flex:1; display:block; min-height:0}
  .cgd>div:last-child .mapa iframe{height:100%; min-height:0}
}
.ccard{background:var(--card); border-radius:20px; padding:clamp(22px,3vw,30px); min-width:0; box-shadow:inset 0 0 0 1px var(--borda)}
.cnap{display:flex; gap:12px; align-items:flex-start; padding-bottom:20px; border-bottom:1px solid var(--borda)}
.cnap div{font-size:.93rem; line-height:1.55; color:rgba(239,232,220,.85); min-width:0}
.cnap b{display:block; font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--ouro); margin-bottom:4px}
.csoc{display:grid; grid-template-columns:1fr 1fr; gap:14px; padding-block:20px; border-bottom:1px solid var(--borda); text-align:center}
.csoc a{text-decoration:none; color:rgba(239,232,220,.82); font-size:.84rem; display:grid; gap:7px; justify-items:center; min-width:0}
.csoc span{font-size:.64rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:rgba(239,232,220,.5)}
.csoc .sq{width:40px; height:40px; border-radius:11px; display:grid; place-items:center}
.sq.ig{background:linear-gradient(45deg,#F9CE34,#EE2A7B,#6228D7); color:#fff}
.sq.gg{background:#fff; color:#111}
.chrs{padding-top:18px}
.chrs .ttl{display:flex; align-items:center; justify-content:center; gap:8px; font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--ouro); margin:0 0 14px}
.chrs ul{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.chrs li{display:flex; justify-content:space-between; gap:14px; font-size:.87rem; color:rgba(239,232,220,.65); font-variant-numeric:tabular-nums}
.chrs li>span:last-child{text-align:right; white-space:nowrap}
@media(max-width:420px){.chrs li{font-size:.8rem}}
.chrs li.hoje{color:var(--ouro); font-weight:800}
.chrs li.hoje .dia::after{content:" · HOJE"; font-size:.62rem; letter-spacing:.1em}
.cwa{margin-top:18px; background:rgba(210,161,58,.07); border-radius:18px; padding:22px; text-align:center; box-shadow:inset 0 0 0 1px var(--borda)}
.cwa h3{margin:0 0 6px; font-size:1rem; font-weight:800; color:var(--marfim)}
.cwa p{margin:0 0 16px; font-size:.85rem; color:rgba(239,232,220,.6)}
.mapa{border-radius:18px; overflow:hidden; box-shadow:inset 0 0 0 1px var(--borda); background:var(--card);
  min-height:300px; display:grid; place-items:center; gap:10px; text-align:center; padding:30px 22px}
.mapa p{margin:0; font-size:.85rem; color:rgba(239,232,220,.5); max-width:34ch}
.mapa{padding:0; min-height:360px}
.mapa iframe{display:block; width:100%; height:100%; min-height:360px; border:0}
.cmd{margin-top:12px}

/* cta final */
.cta{background:radial-gradient(circle at 50% 120%, rgba(210,161,58,.16), transparent 60%), var(--preto);
  border-top:1px solid var(--borda); padding-block:clamp(52px,7.6vw,92px); text-align:center}
.cta .tt{font-size:clamp(1.8rem,5.4vw,3.2rem)}
.cbt{display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:28px}

/* rodape */
.rod{background:#060504; border-top:1px solid var(--borda); padding-block:40px 32px}
.rgd{display:grid; gap:28px; grid-template-columns:1fr}
@media(min-width:820px){.rgd{grid-template-columns:1.1fr 1fr .9fr; align-items:start}}
.rmk{display:flex; align-items:center; gap:12px; margin-bottom:14px}
.rmk img{width:42px; height:42px; display:block}
.rmk b{display:block; font-weight:900; font-variation-settings:"wdth" 120,"wght" 900; letter-spacing:-.03em; font-size:1.1rem; color:var(--ouro); line-height:1.05}
.rmk i{font-family:var(--script); font-weight:600; font-size:.88rem; color:var(--marfim)}
.rnap{margin:0; font-size:.85rem; line-height:1.65; color:rgba(239,232,220,.55)}
.rnav{display:flex; flex-wrap:wrap; gap:10px 20px}
.rnav a{color:rgba(239,232,220,.75); text-decoration:none; font-size:.86rem; font-weight:600}
.rnav a:hover{color:var(--ouro)}
.rcr{margin:0; font-size:.8rem; line-height:1.7; color:rgba(239,232,220,.42)}

/* flutuante */
.flut{position:fixed; z-index:60;
  right:calc(18px + env(safe-area-inset-right,0px)); bottom:calc(18px + env(safe-area-inset-bottom,0px));
  width:56px; height:56px; border-radius:50%; background:var(--verde); color:#fff;
  display:grid; place-items:center; text-decoration:none; box-shadow:0 10px 28px rgba(0,0,0,.55)}
.flut .ic{width:28px; height:28px}
.flut::after{content:""; position:absolute; inset:0; border-radius:50%; box-shadow:0 0 0 0 rgba(37,211,102,.55); animation:pulso 2.4s ease-out infinite}
@keyframes pulso{to{box-shadow:0 0 0 18px rgba(37,211,102,0)}}

@media (prefers-reduced-motion:reduce){
  .marq-trk{animation:marq 36s linear infinite!important}
  .flut::after{animation:none}
  .bt:hover{transform:none}
}
