/* SertanejoMil Promos — feed premium dark country (dark & gold) */
:root{
  --sm-bg:#120C08;            /* fundo principal (madeira escura quente) */
  --sm-bg2:#0D0906;           /* fundo secundário (mais profundo) */
  --sm-gold:#D4A017;          /* dourado principal */
  --sm-gold-hover:#F0C54A;    /* dourado hover */
  --sm-amber:#F0C54A;         /* compat. (gradientes) */
  --sm-border:rgba(212,160,23,.15); /* borda dourada discreta */
  --sm-card:rgba(15,12,18,.95);
  --sm-muted:#9b9088;
  --sm-dark:var(--sm-bg);
}
body{ background:var(--sm-bg); color:#f4ece0; }

/* página promos — arte no topo + gradiente cinematográfico de base (sem preto puro) */
body.page-id-9,
body.page-sertanejomil{
  background-color:var(--sm-bg);
  /* camada 1: arte (topo, largura cheia capada no nativo) | camada 2: gradiente quente global */
  background-image:
    url('/wp-content/themes/sertanejomil/assets/page-bg-native.jpg'),
    linear-gradient(180deg, var(--sm-bg) 0%, #100A06 45%, var(--sm-bg2) 100%);
  background-position:center top, center top;
  background-size:min(100%,1672px) auto, 100% 100%;
  background-repeat:no-repeat, no-repeat;
  background-attachment:scroll, fixed;
}
/* fade da arte para o fundo: transição imperceptível entre hero e conteúdo */
body.page-id-9::before,
body.page-sertanejomil::before{
  content:""; position:absolute; top:0; left:0; right:0; height:60vw;
  z-index:-1; pointer-events:none;
  background:linear-gradient(180deg,
    transparent 0%,
    transparent 44%,
    rgba(18,12,8,.72) 60%,
    var(--sm-bg) 76%,
    var(--sm-bg) 100%);
}
/* partículas douradas discretas (textura sutil sobre todo o fundo) */
body.page-id-9::after,
body.page-sertanejomil::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  opacity:.045;
  background-image:radial-gradient(circle, var(--sm-gold) 1px, transparent 1.6px);
  background-size:132px 132px;
}
body.page-id-9 .wp-site-blocks,
body.page-id-9 main,
body.page-sertanejomil .wp-site-blocks,
body.page-sertanejomil main{ background:transparent !important; }
body.page-id-9 header.wp-block-template-part,
body.page-sertanejomil header.wp-block-template-part{
  display:none !important;
}
body.page-id-9 footer.wp-block-template-part,
body.page-sertanejomil footer.wp-block-template-part{
  background:rgba(13,9,6,.9) !important;
  backdrop-filter:blur(8px);
  border-top:1px solid var(--sm-border) !important;
}
body.page-id-9 .sm-logo,
body.page-sertanejomil .sm-logo,
body.page-id-9 .wp-block-site-logo,
body.page-sertanejomil .wp-block-site-logo{ display:none !important; }

.sm-logo img,
.wp-block-site-logo.sm-logo img{
  border-radius:14px; border:1px solid rgba(212,160,23,.4);
  background:#000; padding:4px;
  box-shadow:0 8px 24px -8px rgba(212,160,23,.35), 0 0 0 1px rgba(255,255,255,.06) inset;
  object-fit:cover;
}

body.page-id-9 main.wp-block-group,
body.page-sertanejomil main.wp-block-group{ padding-top:.5rem !important; }

/* ── Feed wrapper ── */
.sm-promos{ max-width:920px; margin:0 auto; padding:0 1rem 2rem; }

/* ── Ícones sociais premium (canto superior direito) ── */
.sm-social{
  position:fixed; top:1rem; right:1rem; z-index:30;
  display:flex; gap:.5rem;
}
.sm-social__link{
  display:grid; place-items:center; width:40px; height:40px;
  border-radius:50%; color:var(--sm-gold-hover);
  background:linear-gradient(180deg, rgba(22,15,9,.72), rgba(13,9,6,.72));
  border:1px solid var(--sm-border);
  box-shadow:0 6px 18px -10px rgba(0,0,0,.85), 0 0 0 1px rgba(0,0,0,.25) inset;
  backdrop-filter:blur(10px);
  transition:transform .18s, color .18s, border-color .18s, box-shadow .18s, background .18s;
}
.sm-social__link svg{ width:18px; height:18px; fill:currentColor; display:block; }
.sm-social__link:hover{
  transform:translateY(-3px);
  color:#1a1206; border-color:transparent;
  background:linear-gradient(135deg, var(--sm-gold), var(--sm-gold-hover));
  box-shadow:0 10px 24px -8px rgba(212,160,23,.7);
}
.sm-social__link:active{ transform:translateY(-1px); }
@media(max-width:560px){
  .sm-social{ top:.6rem; right:.6rem; gap:.4rem; }
  .sm-social__link{ width:34px; height:34px; }
  .sm-social__link svg{ width:16px; height:16px; }
}
/* hero = espaçador transparente sobre a arte (que vem do background do body).
   altura ≈ logo + objetos, antes do chão escuro onde o conteúdo entra. */
.sm-promos__hero{
  position:relative; text-align:center; overflow:visible;
  height:min(26vw,440px);   /* acompanha a arte 16:9 (capada em 1672px) */
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  padding:0; margin:0 0 .25rem;
  background:transparent; border:none; box-shadow:none;
}
.sm-promos__hero::before{ content:none; }
/* reforço de fade no rodapé do hero (camada local de suavização) */
.sm-promos__hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:45%;
  pointer-events:none;
  background:linear-gradient(180deg, transparent 0%, rgba(18,12,8,.55) 100%);
}
.sm-promos__hero::after{ display:none; }
.sm-promos__hero > *{ position:relative; z-index:1; }
.sm-promos__brand{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.sm-promos__tagline{ display:none; }
.sm-promos__live{
  position:absolute; top:.85rem; left:50%; transform:translateX(-50%);
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:#fde68a; margin:0;
  padding:.25rem .65rem; border-radius:9999px;
  background:rgba(18,12,8,.55); border:1px solid var(--sm-border);
  backdrop-filter:blur(6px);
}
.sm-promos__live::before{
  content:""; width:7px; height:7px; border-radius:50%;
  background:#22c55e; box-shadow:0 0 8px #22c55e;
  animation:sm-pulse 2s ease infinite;
}
@keyframes sm-pulse{ 0%,100%{opacity:1} 50%{opacity:.45} }

.sm-promos__toolbar{
  position:sticky; top:.5rem; z-index:5;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:.75rem; margin-bottom:1.1rem;
  padding:.6rem .7rem; border-radius:16px;
  background:linear-gradient(180deg, rgba(20,14,9,.78), rgba(13,9,6,.78));
  border:1px solid var(--sm-border);
  box-shadow:0 8px 28px -16px rgba(0,0,0,.8), 0 0 0 1px rgba(0,0,0,.2) inset;
  backdrop-filter:blur(12px);
}
.sm-promos__filters{
  display:flex; flex-wrap:wrap; gap:.4rem; flex:1;
}
/* filtros — botão premium country, dourado só no ativo */
.sm-promos__filter{
  border:1px solid var(--sm-border);
  background:linear-gradient(180deg, rgba(30,22,14,.7), rgba(18,12,8,.7));
  color:#d8cbb8; font-size:.78rem; font-weight:600;
  padding:.42rem .9rem; border-radius:9999px; cursor:pointer;
  transition:border-color .18s, color .18s, background .18s, box-shadow .18s, transform .12s;
  font-family:inherit;
}
.sm-promos__filter:hover{
  border-color:rgba(212,160,23,.5); color:var(--sm-gold-hover);
  box-shadow:0 0 0 1px rgba(212,160,23,.15), 0 4px 14px -8px rgba(212,160,23,.4);
}
.sm-promos__filter:active{ transform:translateY(1px); }
.sm-promos__filter.is-active{
  background:linear-gradient(90deg,var(--sm-gold),var(--sm-gold-hover));
  color:#1a1206; border-color:transparent; font-weight:800;
  box-shadow:0 6px 18px -8px rgba(212,160,23,.65);
}
.sm-promos__count{ font-size:.75rem; color:var(--sm-muted); white-space:nowrap; }

.sm-promos__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:1rem;
}
@media(max-width:560px){
  .sm-promos__grid{ grid-template-columns:1fr; }
}

/* ── Card VK-style ── */
.sm-card{
  position:relative; display:flex; flex-direction:column;
  background:var(--sm-card);
  border:1px solid var(--sm-border);
  border-radius:18px; overflow:hidden;
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 12px 32px -18px rgba(0,0,0,.85);
  transition:border-color .2s, transform .2s, box-shadow .2s;
}
.sm-card::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg, rgba(212,160,23,.12), transparent 34%);
  opacity:0; transition:opacity .2s;
}
.sm-card:hover{
  border-color:rgba(212,160,23,.55); transform:translateY(-4px);
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,
             0 24px 48px -20px rgba(0,0,0,.9),
             0 0 0 1px rgba(212,160,23,.22),
             0 0 28px -6px rgba(212,160,23,.28);  /* brilho dourado suave */
}
.sm-card:hover::after{ opacity:1; }
.sm-card[hidden]{ display:none !important; }

.sm-card__top{
  display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; padding:.7rem .8rem 0;
}
.sm-card__badge{
  font-size:.6rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase;
  padding:.22rem .55rem; border-radius:9999px; line-height:1;
}
.sm-card__badge--destaque{
  background:linear-gradient(90deg,var(--sm-gold),var(--sm-amber)); color:#000;
  box-shadow:0 2px 10px -2px rgba(212,160,23,.5);
}
.sm-card__badge--store{
  background:#1c150d; color:#fcd34d; border:1px solid rgba(212,160,23,.3);
}
.sm-card__badge--cat{
  margin-left:auto;
  background:rgba(212,160,23,.12); color:var(--sm-gold-hover); border:1px solid var(--sm-border);
}

.sm-card__img{
  display:block; position:relative; aspect-ratio:1/1; margin:.7rem .8rem 0;
  border-radius:12px; overflow:hidden;
  background:radial-gradient(120% 120% at 50% 0%, #ffffff 0%, #f1f1f3 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.06) inset;
}
.sm-card__img img{
  width:100%; height:100%; object-fit:contain; padding:.7rem;
  transition:transform .35s ease;
}
.sm-card:hover .sm-card__img img{ transform:scale(1.06); }

.sm-card__body{ display:flex; flex-direction:column; flex:1; padding:.8rem; gap:.45rem; }
.sm-card__title{
  font-size:.88rem; font-weight:600; line-height:1.35; margin:0; color:#f4f4f5;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  min-height:2.4em;
}
.sm-card__title a{ color:inherit; text-decoration:none; }
.sm-card__title a:hover{ color:var(--sm-gold); }

.sm-card__price{
  font-size:1.25rem; font-weight:800; color:var(--sm-gold); margin:.1rem 0 .6rem;
  letter-spacing:-.01em; line-height:1.1;
}
.sm-card__price::before{
  content:"a partir de"; display:block;
  font-size:.6rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--sm-muted); margin-bottom:.15rem;
}
.sm-card__price--muted{ font-size:.95rem; color:#d4d4d8; font-weight:600; }
.sm-card__price--muted::before{ content:"preço"; }

.sm-card__cta{
  position:relative; margin-top:auto;
  display:flex; align-items:center; justify-content:center;
  width:100%; box-sizing:border-box; text-align:center;
  background:linear-gradient(90deg,var(--sm-gold),var(--sm-gold-hover)); color:#1a1206 !important;
  font-weight:800; font-size:.82rem; letter-spacing:.01em; border-radius:9999px;
  padding:.62rem 2rem; text-decoration:none;
  box-shadow:0 6px 16px -8px rgba(212,160,23,.65);
  transition:transform .15s, box-shadow .15s, filter .15s;
}
/* seta fixa à direita => o texto "Ver oferta" fica centralizado de verdade */
.sm-card__cta::after{
  content:"→"; position:absolute; right:1rem; top:50%; transform:translateY(-50%);
  font-size:.95em; transition:transform .15s;
}
.sm-card__cta:hover{ filter:brightness(1.05); box-shadow:0 8px 22px -8px rgba(212,160,23,.85); }
.sm-card__cta:hover::after{ transform:translateY(-50%) translateX(3px); }
.sm-card__cta:active{ transform:translateY(1px); }

.sm-promos__empty{
  grid-column:1/-1; text-align:center; color:var(--sm-muted);
  padding:2.5rem 1rem; border:1px dashed var(--sm-border); border-radius:16px;
}

.sm-promos__legal{
  text-align:center; font-size:.72rem; color:var(--sm-muted);
  margin-top:2rem; padding-top:1rem; border-top:1px solid var(--sm-border); line-height:1.6;
}

/* ── Responsividade premium ── */
@media(max-width:768px){
  /* a arte 16:9 escala por vw; garante que o conteúdo não suba sobre os objetos */
  .sm-promos__hero{ height:30vw; }
  .sm-promos__toolbar{ top:.35rem; }
  body.page-id-9::before,
  body.page-sertanejomil::before{ height:70vw; }
}
@media(max-width:560px){
  .sm-promos__hero{ height:34vw; }
  .sm-promos__filters{ gap:.35rem; }
  .sm-promos__filter{ font-size:.74rem; padding:.38rem .75rem; }
}
@media(min-width:1672px){
  /* arte capada no nativo: alinha o espaçador à altura fixa real da arte */
  .sm-promos__hero{ height:440px; }
  body.page-id-9::before,
  body.page-sertanejomil::before{ height:1003px; }
}
@media(prefers-reduced-motion:reduce){
  .sm-card, .sm-card__img img, .sm-promos__filter, .sm-card__cta{ transition:none; }
  .sm-promos__live::before{ animation:none; }
}

/* legado: blocos Hostinger ainda compatíveis se existirem */
.hostinger-affiliate-block-list-cards{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr)) !important;
  gap:1rem !important;
  overflow:visible !important;
}

/* rotator window for live rotating items (different specific offers cycle in/out) */
.sm-card.rot-hidden {
  display: none !important;
}
