/* KING ONE V5 — acabamento premium e correções finais */

/* Cabeçalho premium flutuante, com profundidade e navegação em cápsulas */
.site-header{
  top:10px!important;
  left:0;right:0;
  width:min(1180px,calc(100% - 28px));
  margin-inline:auto;
  border:1px solid rgba(231,199,111,.26)!important;
  border-radius:24px!important;
  background:linear-gradient(145deg,rgba(20,20,18,.88),rgba(3,3,3,.78))!important;
  box-shadow:0 18px 55px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06),inset 0 -1px 0 rgba(231,199,111,.08);
  backdrop-filter:blur(22px) saturate(130%);
  -webkit-backdrop-filter:blur(22px) saturate(130%);
  overflow:visible;
  transition:width .35s ease,top .35s ease,background .35s ease,box-shadow .35s ease;
}
.site-header:before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(105deg,transparent 0 34%,rgba(255,255,255,.08) 47%,transparent 60%);
  transform:translateX(-105%);animation:navSheen 8s ease-in-out infinite;
}
.site-header.is-scrolled{top:6px!important;width:min(1040px,calc(100% - 20px));box-shadow:0 14px 42px rgba(0,0,0,.56)}
.site-header .nav{height:68px!important;padding-inline:14px!important;position:relative;z-index:2}
.site-header .brand img{height:52px!important;width:auto!important;filter:drop-shadow(0 8px 18px rgba(216,177,93,.2))}
.desktop-nav{gap:5px!important;padding:5px;border:1px solid rgba(255,255,255,.06);border-radius:999px;background:rgba(0,0,0,.3);box-shadow:inset 0 1px 10px rgba(0,0,0,.35)}
.desktop-nav a{
  position:relative;padding:10px 13px;border-radius:999px!important;
  font-family:"Manrope","Plus Jakarta Sans",Inter,system-ui,sans-serif!important;
  font-size:13px!important;font-weight:750;letter-spacing:-.01em;color:#dedede!important;
  transition:transform .22s ease,color .22s ease,background .22s ease,box-shadow .22s ease;
}
.desktop-nav a:after{content:"";position:absolute;left:50%;right:50%;bottom:5px;height:1px;background:linear-gradient(90deg,transparent,#e7c76f,transparent);transition:left .25s ease,right .25s ease}
.desktop-nav a:hover,.desktop-nav a.is-active{color:#fff!important;background:linear-gradient(145deg,rgba(231,199,111,.18),rgba(231,199,111,.06));box-shadow:0 9px 22px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08);transform:translateY(-2px)}
.desktop-nav a:hover:after,.desktop-nav a.is-active:after{left:22%;right:22%}
.desktop-cta{box-shadow:0 10px 26px rgba(205,167,93,.18),inset 0 1px 0 rgba(255,255,255,.25)!important;transform:perspective(500px) rotateX(0deg)}
.desktop-cta:hover{transform:perspective(500px) translateY(-3px) rotateX(4deg)!important}
@keyframes navSheen{0%,72%,100%{transform:translateX(-105%)}85%{transform:translateX(105%)}}

/* Compensa o cabeçalho flutuante */
.hero{padding-top:86px!important}
section{scroll-margin-top:100px!important}

/* Catálogo: qualquer conjunto visível ocupa toda a largura, inclusive os 2 headphones */
.catalogue-grid{width:100%!important;grid-auto-flow:row!important;align-items:stretch!important}
.catalogue-grid.visible-1{grid-template-columns:minmax(0,1fr)!important}
.catalogue-grid.visible-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.catalogue-grid.visible-3plus{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.catalogue-grid.visible-1>.product-card,.catalogue-grid.visible-2>.product-card,.catalogue-grid.visible-3plus>.product-card{grid-column:auto!important;width:100%!important;max-width:none!important}
.catalogue-grid.visible-2>.product-card{min-width:0!important;min-height:570px!important}
.catalogue-grid.visible-2 .product-image-wrap{min-height:310px!important}

/* FAQ em largura total, sem coluna morta */
.trust-faq{
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:24px!important;
  max-width:1120px;margin:18px auto 0!important;padding:clamp(24px,4vw,42px)!important;
}
.trust-faq>div:first-child{text-align:center;max-width:800px;margin-inline:auto}
.trust-faq>div:first-child h3{margin-inline:auto;max-width:760px}
.trust-faq>div:nth-child(2){width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;align-items:start}
.trust-faq details{margin:0!important;min-width:0}
.trust-faq details[open]{grid-row:span 2}
.trust-faq summary{display:flex;align-items:center;min-height:28px}

/* CTA final da FAQ centralizado */
.trust-faq .faq-cta{
  width:min(760px,100%);margin:12px auto 0!important;padding:clamp(26px,4vw,40px)!important;
  display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;
  text-align:center!important;border-radius:30px!important;
  background:radial-gradient(circle at 50% 0,rgba(231,199,111,.15),transparent 54%),rgba(216,177,93,.05)!important;
}
.trust-faq .faq-cta div{align-items:center!important;gap:8px!important}
.trust-faq .faq-cta strong{font-size:clamp(22px,3vw,34px)}
.trust-faq .faq-cta span{color:var(--muted);font-size:16px}
.trust-faq .faq-cta .button{min-width:240px;justify-content:center}

/* Footer links mais claros e clicáveis */
.premium-footer a{display:fit-content;position:relative;transition:color .2s ease,transform .2s ease}
.premium-footer a:hover{color:var(--gold-soft)!important;transform:translateX(4px)}

@media(max-width:1100px){
  .desktop-nav a{padding:9px 10px;font-size:12px!important}
  .desktop-cta{display:none!important}
}
@media(max-width:820px){
  .site-header{top:6px!important;width:calc(100% - 16px);border-radius:19px!important}
  .site-header .nav{height:62px!important}
  .hero{padding-top:74px!important}
  .catalogue-grid.visible-2,.catalogue-grid.visible-3plus{grid-template-columns:1fr!important}
  .trust-faq>div:nth-child(2){grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.site-header:before{animation:none}.desktop-nav a,.desktop-cta{transition:none}}

/* V5.1 — correções finais solicitadas */
/* Um único produto visível sempre ocupa a largura inteira, mesmo se scripts externos atrasarem. */
.catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))){
  grid-template-columns:minmax(0,1fr)!important;
}
.catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden){
  grid-column:1 / -1!important;
  width:100%!important;
  max-width:none!important;
  min-height:540px!important;
  display:grid!important;
  grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr)!important;
  grid-template-areas:"copy visual" "action visual"!important;
  column-gap:clamp(28px,5vw,72px)!important;
  align-items:center!important;
}
.catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden) .product-copy{grid-area:copy}
.catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden) .product-image-wrap{grid-area:visual;min-height:470px!important}
.catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden) > a{grid-area:action;align-self:end}
.catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden) .product-image-wrap img{height:420px!important;max-width:620px!important}

/* FAQ sempre equilibrada: nenhuma pergunta aberta altera a malha. */
.trust-faq details[open]{grid-row:auto!important}
.trust-faq>div:nth-child(2){grid-auto-flow:row!important}

/* Rodapé realmente interativo, acima de camadas decorativas e assistentes. */
.premium-footer{position:relative!important;z-index:30!important;isolation:isolate}
.premium-footer .footer-grid,.premium-footer .footer-bottom{position:relative;z-index:2}
.premium-footer a{pointer-events:auto!important;cursor:pointer!important;position:relative!important;z-index:3!important}

@media(max-width:820px){
  .catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden){
    grid-template-columns:1fr!important;
    grid-template-areas:"copy" "visual" "action"!important;
    min-height:auto!important;
  }
  .catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden) .product-image-wrap{min-height:340px!important}
  .catalogue-grid:not(:has(> .product-card:not(.is-hidden) ~ .product-card:not(.is-hidden))) > .product-card:not(.is-hidden) .product-image-wrap img{height:310px!important}
}

/* V6 — correções estruturais finais: transparência e catálogo sem áreas mortas */

/* O grid do catálogo sempre ocupa 100% da largura disponível. */
#catalogue-grid{
  width:100%!important;
  grid-auto-flow:row!important;
  align-items:stretch!important;
}
#catalogue-grid.layout-single{grid-template-columns:minmax(0,1fr)!important}
#catalogue-grid.layout-double{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#catalogue-grid.layout-multi{grid-template-columns:repeat(3,minmax(0,1fr))!important}
#catalogue-grid.layout-single > .product-card:not(.is-hidden),
#catalogue-grid.layout-double > .product-card:not(.is-hidden),
#catalogue-grid.layout-multi > .product-card:not(.is-hidden){
  width:100%!important;max-width:none!important;grid-column:auto!important;
}

/* Um produto vira uma apresentação horizontal premium, sem coluna vazia. */
#catalogue-grid.layout-single > .product-card:not(.is-hidden){
  min-height:540px!important;
  display:grid!important;
  grid-template-columns:minmax(300px,.9fr) minmax(420px,1.1fr)!important;
  grid-template-areas:"copy visual" "action visual"!important;
  column-gap:clamp(32px,6vw,88px)!important;
  align-items:center!important;
  padding:clamp(28px,4vw,54px)!important;
}
#catalogue-grid.layout-single > .product-card:not(.is-hidden) .product-copy{grid-area:copy!important;align-self:end}
#catalogue-grid.layout-single > .product-card:not(.is-hidden) .product-image-wrap{grid-area:visual!important;min-height:460px!important}
#catalogue-grid.layout-single > .product-card:not(.is-hidden) > a{grid-area:action!important;align-self:start!important}
#catalogue-grid.layout-single > .product-card:not(.is-hidden) .product-image-wrap img{height:430px!important;max-width:680px!important}

/* Dois produtos dividem toda a largura, sem terceira coluna reservada. */
#catalogue-grid.layout-double > .product-card:not(.is-hidden){min-width:0!important;min-height:570px!important}
#catalogue-grid.layout-double .product-image-wrap{min-height:320px!important}

/* Transparência antes da compra: composição limpa, sem selo ou imagem sobre o texto. */
#catalogue-grid .unboxing-card{
  min-height:560px!important;
  display:grid!important;
  grid-template-columns:minmax(300px,.88fr) minmax(420px,1.12fr)!important;
  grid-template-areas:"unbox-copy unbox-visual" "unbox-action unbox-visual"!important;
  gap:18px clamp(34px,6vw,92px)!important;
  align-items:center!important;
  padding:clamp(30px,4.5vw,58px)!important;
  overflow:hidden!important;
}
#catalogue-grid .unboxing-card .product-copy{grid-area:unbox-copy!important;align-self:end!important;max-width:540px!important}
#catalogue-grid .unboxing-card > a{grid-area:unbox-action!important;align-self:start!important;max-width:540px!important}
#catalogue-grid .unboxing-card .unboxing-visual{
  grid-area:unbox-visual!important;
  position:relative!important;
  min-height:470px!important;
  width:100%!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(216,177,93,.16)!important;
  background:radial-gradient(circle at 50% 44%,rgba(216,177,93,.17),transparent 56%),rgba(255,255,255,.018)!important;
}
#catalogue-grid .unboxing-card .unboxing-visual img{
  width:min(92%,700px)!important;
  max-width:700px!important;
  height:390px!important;
  object-fit:contain!important;
  transform:none!important;
}
#catalogue-grid .unboxing-card .unboxing-badge{
  position:absolute!important;
  right:18px!important;
  top:18px!important;
  bottom:auto!important;
  max-width:190px!important;
  padding:10px 14px!important;
  border-radius:999px!important;
  text-align:center!important;
  font-size:.78rem!important;
  line-height:1.25!important;
  pointer-events:none!important;
}
#catalogue-grid .unboxing-benefits{margin:22px 0 0!important;gap:12px!important}
#catalogue-grid .unboxing-benefits li{padding-left:31px!important;line-height:1.45!important}

@media(max-width:900px){
  #catalogue-grid.layout-multi,#catalogue-grid.layout-double{grid-template-columns:1fr!important}
  #catalogue-grid.layout-single > .product-card:not(.is-hidden),
  #catalogue-grid .unboxing-card{
    grid-template-columns:1fr!important;
    grid-template-areas:"copy" "visual" "action"!important;
    min-height:auto!important;
    gap:20px!important;
  }
  #catalogue-grid .unboxing-card{grid-template-areas:"unbox-copy" "unbox-visual" "unbox-action"!important}
  #catalogue-grid.layout-single > .product-card:not(.is-hidden) .product-copy{grid-area:copy!important}
  #catalogue-grid.layout-single > .product-card:not(.is-hidden) .product-image-wrap{grid-area:visual!important;min-height:350px!important}
  #catalogue-grid.layout-single > .product-card:not(.is-hidden) > a{grid-area:action!important}
  #catalogue-grid.layout-single > .product-card:not(.is-hidden) .product-image-wrap img{height:330px!important}
  #catalogue-grid .unboxing-card .unboxing-visual{min-height:350px!important}
  #catalogue-grid .unboxing-card .unboxing-visual img{height:300px!important;width:92%!important}
}

@media(max-width:560px){
  #catalogue-grid .unboxing-card{padding:24px!important;border-radius:24px!important}
  #catalogue-grid .unboxing-card .product-copy h3{font-size:clamp(34px,11vw,48px)!important}
  #catalogue-grid .unboxing-card .unboxing-visual{min-height:290px!important;border-radius:22px!important}
  #catalogue-grid .unboxing-card .unboxing-visual img{height:240px!important;width:100%!important}
  #catalogue-grid .unboxing-card .unboxing-badge{
    position:static!important;
    width:max-content!important;
    max-width:100%!important;
    margin:0 auto 14px!important;
    order:-1!important;
  }
  #catalogue-grid .unboxing-card .unboxing-visual{display:flex!important;flex-direction:column!important;justify-content:center!important;padding:16px!important}
  #catalogue-grid.layout-single > .product-card:not(.is-hidden){padding:24px!important}
}
