/* =====================================================================
   CarGet — camada visual "premium" (carregada APÓS styles.css)
   Objetivo: refinamento visual + acessibilidade sem alterar estrutura.
   Rollback: remover o <link> de premium.css em partials/chrome.php.
   ===================================================================== */

/* ---------- 1. Tokens refinados ---------- */
:root{
  /* Amarelo da marca permanece para fundos/botões; para TEXTO pequeno
     sobre fundo claro usamos um dourado profundo (contraste AA). */
  --yellow-text:#8a6700;
  --muted:#5f6072;                 /* era #7c7c8f (4.1:1) → ~6:1 */
  --ink:#16172b;
  --line:#e6e7ee;
  --line-strong:#d6d8e2;
  --paper:#f7f7fa;
  --radius:12px;
  --radius-lg:16px;
  --shadow-sm:0 1px 2px rgba(16,18,40,.04),0 1px 3px rgba(16,18,40,.05);
  --shadow:0 2px 6px rgba(16,18,40,.04),0 10px 24px -8px rgba(16,18,40,.10);
  --shadow-lg:0 4px 10px rgba(16,18,40,.05),0 24px 48px -16px rgba(16,18,40,.18);
  --ring:0 0 0 3px rgba(232,184,13,.35),0 0 0 1px #b38a00;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- 2. Base ---------- */
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
body{font-feature-settings:"cv11","ss01","tnum" 0;letter-spacing:-.005em}
::selection{background:rgba(232,184,13,.35);color:var(--ink)}
img{max-width:100%}
textarea,input,select,button{font-family:inherit}   /* textarea estava monoespaçada */

/* Foco visível consistente e com contraste (teclado) */
:where(a,button,input,select,textarea,[tabindex]):focus{outline:none}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid #b38a00;outline-offset:2px;border-radius:8px
}

/* ---------- 3. Contraste de textos em amarelo ---------- */
.section-eyebrow,.news-item-cat,.feature-group-title{color:var(--yellow-text)}
.nav-desktop a.active{color:var(--ink)!important;font-weight:600}
.nav-desktop a.active:after{display:block!important;content:"";background:var(--carget-yellow)!important;height:2px!important;bottom:2px!important;border-radius:2px}
.v-price{color:var(--ink);letter-spacing:-.02em}
.footer h4{color:var(--carget-yellow)}  /* fundo escuro: contraste ok */

/* ---------- 4. Header ---------- */
.header{background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px)}
.header.scrolled,.header.is-scrolled{border-bottom-color:var(--line);box-shadow:0 6px 24px -12px rgba(16,18,40,.18)}

/* ---------- 5. Botões ---------- */
.btn{border-radius:var(--radius);transition:transform .18s var(--ease),box-shadow .18s var(--ease),background-color .18s,color .18s,border-color .18s}
.btn:active{transform:translateY(1px)}
.btn-primary{box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 1px 2px rgba(120,90,0,.25)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 20px -6px rgba(196,154,0,.55)}
.btn[disabled],.btn:disabled,.btn[aria-disabled=true]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}

/* ---------- 6. Cards ---------- */
.v-card{border-color:var(--line);box-shadow:var(--shadow-sm);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.v-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--line-strong)}
.v-card img{transition:transform .6s var(--ease)}
.v-card:hover img{transform:scale(1.035)}
.store-card{box-shadow:var(--shadow-sm);transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s}
.store-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--line-strong)}
.contact-form-card{background:#fff;box-shadow:var(--shadow)}

/* ---------- 7. Formulários ---------- */
.contact-form-card :is(input,select,textarea),
.interest-form :is(input,textarea),
#filters-form :is(input,select){
  border-color:var(--line-strong);transition:border-color .15s,box-shadow .15s,background-color .15s
}
.contact-form-card :is(input,select,textarea):hover,
.interest-form :is(input,textarea):hover,
#filters-form :is(input,select):hover{border-color:#b9bccb}
.contact-form-card :is(input,select,textarea):focus,
.interest-form :is(input,textarea):focus,
#filters-form :is(input,select):focus{border-color:#b38a00;box-shadow:var(--ring);outline:none}
.contact-form-card :is(input,textarea)::placeholder,
.interest-form :is(input,textarea)::placeholder{color:#8b8ca0}
.contact-form-card textarea,.interest-form textarea{font-family:inherit}

/* ---------- 8. Página da loja: e-mail longo estourava 375px ---------- */
.store-head-info,.store-head-meta{min-width:0}
.store-head-meta span{overflow-wrap:anywhere;word-break:break-word;min-width:0}

/* ---------- 9. Paginação (/veiculos) ---------- */
a[href*="page="][style*="width:36px"]{transition:background-color .15s,border-color .15s,color .15s}
a[href*="page="][style*="width:36px"]:hover{border-color:var(--carget-yellow)!important;color:var(--ink)!important}

/* ---------- 10. Galeria ---------- */
.gallery-main{box-shadow:var(--shadow)}
.gallery-lightbox{background:rgba(10,11,22,.92);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

/* ---------- 11. Movimento reduzido ---------- */
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .v-card:hover,.v-card:hover img,.store-card:hover,.btn-primary:hover{transform:none}
}

/* ---------- 12. Cabeçalho da loja no celular: avatar acima do texto ---------- */
@media (max-width:560px){
  .store-head{flex-direction:column;align-items:flex-start;gap:14px}
  .store-head-avatar{width:64px;height:64px}
}

/* ---------- 13. Filtros de /veiculos: grade organizada ---------- */
#filters-form > select,#filters-form > div > input{height:44px!important;border-radius:var(--radius)!important;background-color:#fff}
@media (max-width:640px){
  #filters-form{display:grid!important;grid-template-columns:1fr 1fr;gap:10px!important}
  #filters-form > div:first-child{grid-column:1 / -1;min-width:0!important}
  #filters-form > select{min-width:0!important;width:100%;max-width:100%}
  #filters-form > :is(button,a,.btn){grid-column:1 / -1}
  #filters-form > select:last-of-type{grid-column:1 / -1}
  #filters-form > select{font-size:.82rem!important;padding-right:28px!important;text-overflow:ellipsis}
}

/* ---------- 14. Abas da busca da home: não estourar em 360–375px ---------- */
@media (max-width:420px){
  .search-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
  .search-tab{min-width:0;padding-left:6px;padding-right:6px;gap:5px;font-size:.78rem;white-space:nowrap}
}