:root{
  /* ouro e palette */
  --gold-50:#f9f1cf;
  --gold-200:#f8e6a5;
  --gold-400:#e3c24d;    /* (mantém o valor do seu topo) */
  --gold-500:#d4af37;
  --gold-600:#b9911b;
  --gold-700:#a07f10;

  /* tons escuros / texto */
  --slate-900:#0f172a;
  --black:#0a0a0a;
  --dark-1:#111111;
  --dark-2:#161616;
  --dark-3:#1d1d1d;
  --grey-5:#2a2a2a;
  --muted:#b6b6b6;
  --text:#eaeaea;

  /* layout */
  --cartbar-h: 82px; 
  --dark-rgb: 0,0,0;

  --safe-top: env(safe-area-inset-top);
  --safe-bot: env(safe-area-inset-bottom);
}

body.has-cart main{padding-bottom: calc(var(--cartbar-h) + env(safe-area-inset-bottom, 0px) + 12px);}

/* Fundo */
body{
  margin:0;
  font-family: system-ui, Arial, sans-serif;
  background: url('/img/bg-tunnel.jpg') center/cover fixed no-repeat;
  position: relative;
  color: #e5e7eb;
}
body::before{
  content:''; position:fixed; inset:0; pointer-events:none; z-index: -1;
  background: radial-gradient(70% 50% at 50% 10%, rgba(0,0,0,.12), rgba(0,0,0,.55));
}
/* ===== Página de produto: fundo branco e texto escuro ===== */
body.product-page{ background:#fff; color:#0f172a; }
body.product-page::before{ content:none; }              /* remove o overlay radial escuro */

/* --- HERO / topo do site (apenas blocos de banner, não o <header> fixo) --- */
.hero, .top-banner{
  display:grid;
  place-items:center;
  min-height: 140px;
  max-height: clamp(160px, 30vh, 340px);
  overflow:hidden;
}
.hero img, .top-banner img{
  width: min(820px, 92vw);
  height: auto;
  object-fit: contain;
  display:block;
}

/* Segurança: qualquer imagem solta no conteúdo não estoura o layout */
main img { max-width:100%; height:auto; }

/* barra translúcida escura */
.bg-blur {
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background: rgba(var(--dark-rgb), .65);
}

/* ====== Cards ====== */
.card{
  background:#fff;                 /* card sempre branco */
  transition: transform .18s, box-shadow .18s, filter .18s;
  border-radius:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
  overflow:hidden;
}
.card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.22);
}

/* topo da imagem também branco */
.card-img{ background:#fff; overflow:hidden; aspect-ratio: 4 / 3; display:flex; align-items:center; justify-content:center;}
.card-img.portrait{ aspect-ratio: 3 / 4; }   /* fotos mais altas */
.card-img.landscape{ aspect-ratio: 16 / 10; }
.card-img.square{ aspect-ratio: 5 / 4; }
.card-img img{ width:100%; height:100%; object-fit:contain; object-position: center center; display:block; }

/* corpo sempre branco; hover só dá 1% de brilho */
.card-body{
  background:#fff; color:#0f172a;
  display:flex; flex-direction:column; gap:.25rem;
  padding:12px 12px 16px;
}
.card:hover .card-body{ filter:brightness(1.01); }  /* sutil */

.card-brand{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:#0f172a; opacity:.9; }
.card-id{ font-size:12px; color:#334155; margin-top:.125rem; }
.card-title{
  font-weight:700; color:#0b1220; line-height:1.2;
  display:-webkit-box;
  overflow:hidden;
  text-overflow:ellipsis;
  -webkit-box-orient: vertical;
  line-clamp: 2;              /* padrão */
  -webkit-line-clamp: 2;      /* webkit */
}
.card-title:hover{ cursor:pointer; }
.price{font-weight:800;color:#0b1220}
.price::after{content:'';display:block;height:2px;width:48px;margin-top:2px;background:linear-gradient(90deg,var(--gold-400),transparent)}

/* Botão dourado */
.btn-gold{
  position: relative;
  background: linear-gradient(180deg, #fde68a 0%, #f1c232 35%, var(--gold-500) 100%);
  border: 1px solid rgba(185,145,27,.55);
  color:#0f172a; font-weight:700; border-radius:.75rem;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    inset 0 -1px 0 rgba(0,0,0,.06),
    0 4px 10px rgba(212,175,55,.22),
    0 1px 2px rgba(0,0,0,.18);
  transition: filter .15s ease, transform .12s ease, box-shadow .15s ease;
}
/* hover/active globais para o site */
.btn-gold:hover{
  filter: brightness(1.04);
  background: linear-gradient(180deg, var(--gold-500), var(--gold-600));
}
.btn-gold:active{
  transform: translateY(1px);
  box-shadow:
    inset 0 1px 0 rgba(0,0,0,.10),
    0 4px 12px rgba(212,175,55,.24),
    0 1px 2px rgba(0,0,0,.25);
}
.btn-gold::after{
  content:''; position:absolute; left:2px; right:2px; top:2px; height:38%; border-radius:inherit;
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0)); pointer-events:none;
}
.container .btn-gold:hover{ filter: brightness(1.04); background: linear-gradient(180deg, var(--gold-500), var(--gold-600)); }
.container .btn-gold:active{ transform: translateY(1px); box-shadow: inset 0 1px 0 rgba(0,0,0,.10), 0 4px 12px rgba(212,175,55,.24), 0 1px 2px rgba(0,0,0,.25); }

/* ====== Modal ====== */
.modal-backdrop{touch-action: none;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.modal-panel{width:min(980px,94vw);max-height:min(88vh,980px);background:rgba(255,255,255,.98);border-radius:18px;box-shadow:0 18px 44px rgba(0,0,0,.35);overflow:auto;position:relative;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.modal-grid{display:grid;grid-template-columns:1.1fr 1.2fr;gap:18px;padding:18px}
.modal-media{background:#f1f5f9;border-radius:14px;overflow:hidden}
.modal-media img{width:100%;height:100%;object-fit:contain;display:block;aspect-ratio:4/3}
/* desce o conteúdo para não ficar embaixo do X */
.modal-body{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding-top:14px;   /* << deu “respiro” embaixo do X */
}
/* Produto: caixas informativas com contraste leve */
body.product-page .modal-media{ background:#f8fafc; }
body.product-page .modal-rows .row{ background:#f8fafc; border-color:#e2e8f0; }
/* Título do produto no detalhe */
.modal-title{
  font-size:1.14rem;           /* levemente maior */
  font-weight:800;
  color:#0b1220;
  text-transform:uppercase;     /* VISUAL antigo */
  line-height:1.2;
  margin: 0 0 8px;              /* respira do grid */
  padding-right:56px;           /* espaço pro X */
}
.modal-rows{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.modal-rows .row{display:flex;justify-content:space-between;gap:8px;font-size:.95rem;color:#0f172a;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:8px 10px}
.modal-rows .row span{color:#475569}
.modal-section h3{font-size:.85rem;color:#334155;font-weight:700;margin-bottom:4px}
.modal-section p{font-size:.95rem;color:#0f172a;max-height:140px;overflow:auto}
.modal-close{
  position:absolute; right:12px; top:6px; width:36px; height:36px; /* subimos um pouco */
  border-radius:9999px; background:#fff; color:#ef4444;            /* vermelho */
  border:1px solid rgba(239,68,68,.35); box-shadow:0 4px 10px rgba(0,0,0,.12);
}
.modal-close:hover{ filter:brightness(1.03); }
@media (max-width: 860px){
  .modal-grid{grid-template-columns:1fr}
  .modal-rows{grid-template-columns:1fr}
}

/* Garante que todos os cards ocupem a mesma altura na grade */
#grid > .card,
#resultsGrid > .card{ height:100%; }

/* ====== Inputs ====== */
.input{ background: rgba(255,255,255,.95); color:#0f172a; }
.select{ background: rgba(255,255,255,.95); color:#0f172a; border:1px solid rgba(15,23,42,.20); }
.select option{ color:#0f172a; background:#ffffff; }
.input::placeholder{ color:#64748b; opacity:.8; }

/* ====== Brand ====== */
.brand-title{font-weight:800;font-size:1.5rem;line-height:1;letter-spacing:.2px;color:#f8fafc}
.brand:hover .brand-title{color:var(--gold-50)}
.brand-logo{filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}

/* ====== Barra do carrinho ====== */
/* ====== Barra do carrinho ====== */
.cart-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:55;
  display:grid; place-items:center;
  /* preserva o safe-area no bottom sem perder o padding geral */
  padding:10px;
  padding-bottom: calc(10px + env(safe-area-inset-bottom,0));
}
.cart-bar-inner{
  width:min(980px,96vw); display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:rgba(var(--dark-rgb), .72); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:10px 12px; color:#e5e7eb;
  box-shadow:0 8px 30px rgba(0,0,0,.35);
}
.btn-dark{background:#1f2937;color:#f8fafc;border:1px solid rgba(255,255,255,.1);border-radius:.65rem;padding:.5rem .9rem}
.btn-dark:hover{filter:brightness(1.05)}
.btn-light{background:#e5e7eb;color:#0f172a;border:1px solid rgba(0,0,0,.08);border-radius:.65rem;padding:.5rem .9rem}
.btn-light:hover{filter:brightness(1.02)}
.btn-whats{background:#25D366;color:#062a10;font-weight:700;border-radius:.7rem;padding:.55rem 1rem;box-shadow:0 8px 18px rgba(37,211,102,.25)}
.btn-whats:hover{filter:brightness(1.05)}

/* ====== Modal do carrinho ====== */
.cart-modal-ctr{display:grid;place-items:center}
.cart-modal-panel{width:min(820px,94vw);max-height:min(88vh,980px);background:#fff;border-radius:18px;box-shadow:0 18px 44px rgba(0,0,0,.35);overflow:auto;position:relative;padding:18px; overscroll-behavior:contain;}
.cart-title{font-weight:800;color:#0b1220;font-size:1.25rem;margin:6px 0 12px 0;padding-right:56px}
.cart-list{display:flex;flex-direction:column;gap:10px;max-height:52vh;overflow:auto}
.cart-item{ display:grid; grid-template-columns:84px 1fr auto auto; gap:12px; align-items:center; border:1px solid #e5e7eb; border-radius:12px; padding:10px; }
.cart-item .remove{
  width:32px; height:32px; border-radius:8px;
  border:1px solid #e2e8f0; background:#fff; color:#991b1b;
  display:flex; align-items:center; justify-content:center;
}
.cart-item .remove:hover{ filter:brightness(1.05); }
.cart-item .remove svg{ width:18px; height:18px; }
.cart-item img{width:84px;height:63px;object-fit:cover;border-radius:8px;background:#f1f5f9}
.cart-item .meta .name{font-weight:700;color:#0b1220}
.cart-item .meta .brand{color:#1f2937;font-size:.9rem}
.cart-item .meta .price{color:#0b1220;font-weight:700;margin-top:4px}
.cart-item .qty{display:flex;align-items:center;gap:8px}
.cart-item .qty button{width:32px;height:32px;border-radius:8px;border:1px solid #cbd5e1;background:#f8fafc}
.cart-item .qty button:hover{filter:brightness(1.03)}
.cart-item .qty span{ color:#0b1220; font-weight:700; }
.cart-item .qty button{ color:#0b1220; line-height:1; } 
.cart-total{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding:10px;border-top:1px solid #0b1220}
.cart-total .left, .cart-total .right { color: #0b1220; }
.cart-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}
.cart-item .meta .price .unit{
  font-weight:600; color:#475569; margin-left:6px;
}

/* estado desabilitado para ações do carrinho */
.btn-disabled{
  opacity:.55;
  pointer-events:none;
  cursor:not-allowed;
  filter:saturate(.6) brightness(.95);
}

/* Mobile: iOS/Android */
@media (max-width: 640px){
  /* modal em tela cheia, coluna */
  .modal-panel{ width:100vw; max-height:100vh; border-radius:0 }
  .modal-grid{ grid-template-columns:1fr; gap:12px; padding:12px }
  .modal-media{ border-radius:10px }
  .modal-body h2{ font-size:1.05rem; padding-right:44px }
  .modal-close{ right:8px; top:8px }

  /* alvos de toque maiores */
  .btn-gold{ padding:12px 16px; font-size:16px }
  .cart-item .qty button{ width:40px; height:40px; font-size:18px }
  #pager button{ min-width:40px; min-height:40px }

  .modal-body{ padding-top:8px; }
}

.ad-wrap { margin: 12px 0; }
@media (min-width: 640px){ .ad-wrap { margin: 16px 0; } }

/* ==== Footer ==== */
.site-footer { background: rgba(var(--dark-rgb), .80); border-top: 1px solid rgba(255,255,255,.08); }
.ft-title { color:#f8fafc; font-weight:800; margin-bottom:.5rem; }
.ft-list li a { color:#e5e7eb; }
.ft-list li a:hover { color: var(--gold-50); }
.ft-bottom { border-top:1px solid rgba(255,255,255,.08); background: rgba(var(--dark-rgb), .55); }
.ft-bottom-inner{ width:100%; margin:0 auto; padding-top:8px; padding-bottom:8px; max-width:72rem; }

/* ==== Cards horizontais no mobile ==== */
@media (max-width: 640px){
  .card{ display:grid; grid-template-columns:96px 1fr; align-items:stretch; } /* <= era 120px */
  .card-img{ height:96px; aspect-ratio:auto; }  /* caixa menor e fixa */
  .card-img img{ width:100%; height:100%; object-fit:contain; object-position:center center; display:block; } /* garante sem corte */
  .card-body{ padding:10px; }

  /* Título: 3 linhas no mobile */
  .card-title{ line-clamp:3; -webkit-line-clamp:3; }
}

/* Links com ícone semitransparente à esquerda */
.ft-list a.ico{ position:relative; padding-left:30px; display:inline-block; }
.ft-list a.ico::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:20px; height:20px; opacity:.65; background-size:contain; background-repeat:no-repeat;
}

/* WhatsApp / E-mail / Facebook / Instagram */
.ft-list a.ico-whats::before{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e5e7eb'><path d='M12 2a10 10 0 0 0-8.94 14.59L2 22l5.55-1.46A10 10 0 1 0 12 2zm0 2a8 8 0 0 1 6.86 12.21l-.31.49-.5.31A8 8 0 0 1 7 6.41 8 8 0 0 1 12 4zm4.44 9.38c-.24-.12-1.43-.7-1.65-.78-.22-.08-.38-.12-.55.12-.16.24-.64.78-.78.94-.14.16-.29.18-.53.06-.24-.12-1.01-.37-1.93-1.18-.71-.63-1.19-1.41-1.33-1.65-.14-.24-.02-.37.1-.5.1-.1.24-.26.37-.39.12-.14.16-.24.24-.4.08-.16.04-.3-.02-.42-.06-.12-.55-1.33-.75-1.82-.2-.48-.4-.42-.55-.43h-.47c-.16 0-.42.06-.64.3-.22.24-.84.82-.84 2s.86 2.32.98 2.48c.12.16 1.7 2.6 4.12 3.64.58.25 1.04.4 1.39.51.58.18 1.1.15 1.51.09.46-.07 1.43-.58 1.63-1.15.2-.57.2-1.05.14-1.15-.06-.1-.22-.16-.46-.28z'/></svg>");
}
.ft-list a.ico-mail::before{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e5e7eb'><path d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5L4 8V6l8 5 8-5v2z'/></svg>");
}
.ft-list a.ico-fb::before{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e5e7eb'><path d='M22 12a10 10 0 1 0-11.6 9.87v-6.98H7.9V12h2.5V9.8c0-2.46 1.47-3.82 3.72-3.82 1.08 0 2.22.19 2.22.19v2.44h-1.25c-1.23 0-1.61.76-1.61 1.54V12h2.74l-.44 2.89h-2.3v6.98A10 10 0 0 0 22 12z'/></svg>");
}
.ft-list a.ico-ig::before{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e5e7eb' stroke-width='2'><rect x='3' y='3' width='18' height='18' rx='4' ry='4'/><path d='M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z'/><line x1='17.5' y1='6.5' x2='17.5' y2='6.5'/></svg>");
}

/* Ícones quadradinhos (linha de redes) 
.social-icons{ display:flex; gap:8px; }
.social-icons a{
  width:36px; height:36px; border-radius:8px;
  display:grid; place-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
}
.social-icons a:hover{ background:rgba(255,255,255,.15); }
.social-icons svg{ width:18px; height:18px; fill:#e5e7eb; opacity:.9 }
*/

/* FAB WhatsApp */
.fab-whats{
  position:fixed; right:18px; bottom:20px; z-index:65;
  width:56px; height:56px; border-radius:9999px;
  background:#25D366; display:grid; place-items:center;
  box-shadow:0 10px 24px rgba(37,211,102,.35), 0 2px 8px rgba(0,0,0,.2);
  transition: transform .12s ease, filter .15s ease;
}
.fab-whats:hover{ filter:brightness(1.05); transform:translateY(-1px); }

/* Mini mapa no rodapé */
.mini-map{
  position:relative;
  width:100%;
  max-width:360px;    /* menor */
  height:140px;       /* mais fino */
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 4px 18px rgba(0,0,0,.15) inset, 0 1px 0 rgba(255,255,255,.03);
}
.mini-map iframe{
  width:100%; height:100%; border:0;
}
/* celulares médios */
@media (max-width: 640px){
  .mini-map{ height:120px; max-width:320px; }
}
/* MUITO pequenos (ex.: 320px) — some o mapa */
@media (max-width: 360px){
  .mini-map{ display:none; }
}

/* Telas muito pequenas: caixa de imagem e tipografia menores */
@media (max-width: 360px){
  .card{ grid-template-columns:72px 1fr; }
  .card-img{ height:72px; }
  .card-body{ padding:8px; }
  .card-title{ font-size:13px; line-height:1.25; line-clamp:2; -webkit-line-clamp:2; }
  .price{ font-size:13px; }
  .card-id, .card-brand{ font-size:10px; }
}

/* Layout para páginas estáticas (sobre/privacidade/termos) */
.doc{
  min-height: calc(100vh - 240px); /* ajusta considerando header+footer */
  display: flex; align-items: center; justify-content: center;
  padding: 40px 16px;
}
.doc-card{
  width: 100%; max-width: 880px;
  background: rgba(var(--dark-rgb), .60);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.doc h1{ font-size: 28px; font-weight:800; color:#f8fafc; margin-bottom: 8px; }
.doc p, .doc li{ color:#e5e7eb; line-height: 1.75; }
.doc h2{ font-size: 18px; margin-top: 18px; color:#f1f5f9; }
.doc ul{ list-style: disc; padding-left: 1.2rem; }
@media (max-width: 640px){
  .doc{ padding: 24px 12px; }
  .doc-card{ padding: 20px; }
  .doc h1{ font-size: 22px; }
}

/* no celular, manter só “Ver carrinho” para não quebrar layout */
@media (max-width: 480px){
  #cartBar .btn-whats{ display:none; }
}

/* Em telas bem pequenas, mostrar só "Ver carrinho" */
@media (max-width: 420px){
  #cartBar .btn-whats{ display:none !important; }
  .cart-actions .btn-whats{ display:none !important; } /* dentro do modal do carrinho */
}

/* Alinhar conteúdo interno do card no DESKTOP */
@media (min-width: 641px){
  .card{ display:flex; flex-direction:column; height:100%; }
  .card-img{ flex:0 0 auto; }
  .card-body{ display:flex; flex-direction:column; flex:1 1 auto; }
  .card-actions{ margin-top:auto; }  /* empurra o botão para o rodapé do card */
}

/* ===== Header fixo (barra de busca) ===== */
#searchBar{
  -webkit-backdrop-filter: blur(8px) saturate(120%);
  backdrop-filter: blur(8px) saturate(120%);
  background: rgba(var(--dark-rgb), .72);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
#searchBar .brand-logo{ height: 40px; width: auto; display:block; }

/* quando o layout vira linha, centralizar verticalmente */
@media (min-width:768px){
  .md\:items-center{ align-items: center; }   /* utilitário que faltava */
}


/* ===========================
   [LEGACY / FORM] estilos de páginas de formulário (.container)
   Escopados para não colidir com o site
   =========================== */

html,body{height:100%}
.container{max-width:960px;margin:32px auto;padding:28px;background:linear-gradient(180deg,var(--dark-2),var(--dark-1));border:1px solid #222;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.title{margin:0 0 12px 0;font-weight:900;letter-spacing:.3px;color:var(--black);background:linear-gradient(180deg,var(--gold-200),var(--gold-500));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 1px 0 rgba(255,255,255,.15);}
fieldset{border:1px solid var(--grey-5);border-radius:12px;padding:16px;margin:16px 0;background:linear-gradient(180deg,var(--dark-3),var(--dark-2));}
legend{color:var(--gold-400);padding:0 8px;font-weight:700;}
label{display:flex;flex-direction:column;gap:6px;margin:8px 0;}
input,select,button{padding:10px 12px;border-radius:10px;border:1px solid #2b2b2b;background:#121212;color:var(--text);outline:none;}
input:focus,select:focus{border-color:var(--gold-700);box-shadow:0 0 0 2px rgba(212,175,55,.15);}

/* Visual MAIÚSCULAS */
.allcaps input[type="text"], .allcaps select, .allcaps textarea { text-transform:uppercase; }
.caps{text-transform:uppercase;letter-spacing:.05em}

.row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media (max-width:720px){.row-2{grid-template-columns:1fr}}
.muted{color:var(--muted);font-size:.9rem;}
.hint{margin:6px 0 10px;color:#d6d6d6;font-size:.95rem;}
.link-wa{display:inline-block;margin-top:6px;color:var(--gold-400);text-decoration:none}
.link-wa:hover{filter:brightness(1.1)}

.photos{display:flex;flex-direction:column;gap:8px;}
.file-row{display:flex;gap:8px;align-items:center;}
.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;background:linear-gradient(180deg,var(--gold-200),var(--gold-500));border:1px solid rgba(185,145,27,.55);color:#0c0c0c;cursor:pointer;}
.btn-icon:hover{filter:brightness(1.06);}
.photo-actions{display:flex;align-items:center;gap:12px;}
.thumb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:8px;}
.thumb{position:relative;border-radius:10px;border:1px solid #2b2b2b;overflow:hidden;background:#0f0f0f;}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.thumb .tag{position:absolute;top:6px;left:6px;background:rgba(0,0,0,.6);color:#fff;font-size:.75rem;padding:2px 6px;border-radius:999px;border:1px solid rgba(255,255,255,.15);}
.thumb .rm{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;cursor:pointer;}

.item-row{display:grid;grid-template-columns: 1.5fr 1fr 90px 40px;gap:8px;margin:6px 0;}
.item-row input[type="number"]{text-align:center;}
.btn-ghost{background:transparent;border:1px dashed #2b2b2b;color:var(--gold-200);}
.btn-ghost:hover{border-style:solid;filter:brightness(1.08);}
.container .btn-gold{position:relative;background:linear-gradient(180deg,var(--gold-200) 0%,var(--gold-400) 35%,var(--gold-500) 100%);border:1px solid rgba(185,145,27,.55);color:#0c0c0c;font-weight:900;border-radius:.75rem;box-shadow:0 6px 18px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.02em;}
.container .btn-gold:hover{filter:brightness(1.04);}
.container .btn-gold:active{transform:translateY(1px);}
.msg{margin-top:16px;}
.success{background:#064e3b;padding:12px;border-radius:8px;}
.error{background:#7f1d1d;padding:12px;border-radius:8px;}

/* Modal */
.modal.hidden{display:none}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal-card{background:#121212;border:1px solid #2b2b2b;border-radius:14px;max-width:520px;width:100%;padding:20px}
.modal-card h3{margin:0 0 6px;color:var(--gold-400)}
.modal-card .num{font-size:1.15rem;margin:.25rem 0 .75rem}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap}
.modal-actions > *{flex:1}
.modal-actions { justify-content:center; }

.props-table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 12px 0;
}
.props-table thead th {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid #404040;
  color: #e4c95c; /* dourado */
  font-weight: 600;
}
.props-table tbody td {
  padding: 8px 10px;
}
.props-table tbody tr {
  border-bottom: 1px solid #2b2b2b; /* linha fina entre LINHAS */
}
.props-table tfoot td {
  padding: 10px 10px;
  border-top: 1px solid #404040;
  font-weight: 700;
}
.txr { text-align: right; }
.props-table thead th:nth-child(4),
.props-table tbody td:nth-child(4),
.props-table tfoot td:nth-child(4) { text-align: center; }

.props-table thead th:nth-child(5),
.props-table tbody td:nth-child(5),
.props-table tfoot td:nth-child(5) { text-align: right; }

/* Botão quadrado só com ícone */
.icon-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px; line-height:1;
}
.icon-btn i{ font-size:16px }

/* Azul-escuro para o "Compartilhar" do detalhe */
.btn-navy{
  background:#0f172a; color:#f8fafc; border:1px solid rgba(255,255,255,.12);
}
.btn-navy:hover{ filter:brightness(1.05); }

/* Ícone do WhatsApp verdinho dentro dos botões/links .btn-whats */
.btn-whats i.fa-square-whatsapp{ color:#25D366; margin-right:6px; font-size:18px }

/* === util-fallbacks (sem Tailwind) === */
.min-h-screen{min-height:100vh;}
.sticky{position:sticky;}
.top-0{top:0;}
.z-50{z-index:50;}
.mx-auto{margin-left:auto;margin-right:auto;}
.max-w-6xl{max-width:72rem;}
.px-4{padding-left:1rem;padding-right:1rem;}
.py-4{padding-top:1rem;padding-bottom:1rem;}
.pt-3{padding-top:.75rem;}
.mb-3{margin-bottom:.75rem;}
.mt-3{margin-top:.75rem;}
.mt-6{margin-top:1.5rem;}
.mt-8{margin-top:2rem;}
.flex{display:flex;}
.grid{display:grid;}
.flex-col{flex-direction:column;}
.items-center{align-items:center;}
.items-end{align-items:flex-end;}
.justify-center{justify-content:center;}
.justify-between{justify-content:space-between;}
.gap-2{gap:.5rem;}
.gap-3{gap:.75rem;}
.gap-4{gap:1rem;}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));}
.w-full{width:100%;}
.rounded-xl{border-radius:.75rem;}
.shadow-inner{box-shadow:inset 0 2px 4px rgba(0,0,0,.06);}
.text-sm{font-size:.875rem;line-height:1.25rem;}
.text-slate-200{color:#e2e8f0;}
.text-slate-300{color:#cbd5e1;}
.text-slate-400{color:#94a3b8;}
.h-10{height:2.5rem;}
.w-auto{width:auto;}
.hidden{display:none;}

/* responsivo (breakpoints padrão) */
@media (min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (min-width:768px){
  .md\:flex-row{flex-direction:row;}
  .md\:items-end{align-items:flex-end;}
  .md\:w-auto{width:auto;}
  .md\:w-96{width:24rem;}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
  .md\:block{ display:block; }
}
@media (min-width:1024px){
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (min-width:1280px){
  .xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
}

/* util extra usada no mapa */
.map-cover{position:absolute;inset:0;}

/* --- adicionar abaixo de .gap-4 --- */
.gap-8{gap:2rem;}
.text-xs{font-size:.75rem;line-height:1rem;}

.flex-1{ flex: 1 1 0%; }           /* ocupa o espaço livre na linha */

/* alguns utilitários gerais que seu JS/HTML usam em outras áreas */
.rounded-lg{ border-radius: .5rem; }
.mt-1{ margin-top: .25rem; }
.pt-2{ padding-top: .5rem; }
.pb-1{ padding-bottom: .25rem; }
.text-lg{ font-size: 1.125rem; line-height: 1.75rem; }
.text-center{ text-align: center; }

/* posiciona os modais (substitui fixed/inset/z-[...]) */
.modal-root{ position:fixed; inset:0; z-index:60; }
.cart-modal-root{ position:fixed; inset:0; z-index:70; }

/* centraliza o conteúdo do modal principal */
.modal-ctr{ position:absolute; inset:0; display:grid; place-items:center; padding:16px; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Página de produto: parágrafos sem “corte” */
body.product-page .modal-section p{
  max-height: none;
  overflow: visible;
}

/* ===== Carrossel de relacionados (produto) ===== */
.rel-wrap{ border-top:1px solid #e5e7eb; padding-top:12px; }
.rel-title{ font-weight:800; color:#0b1220; margin:0 0 8px; }

.rel-track{
  display:grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(240px, 1fr);
  gap:10px;
  overflow:auto;
  padding-bottom:6px;
  scroll-snap-type: x mandatory;
}
.rel-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:10px;
  text-decoration:none;
  color:#0b1220;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
  scroll-snap-align: start;
  transition: transform .12s ease, box-shadow .12s ease;
}
.rel-card:hover{ transform: translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.12); }
.rel-card .name{ font-weight:700; line-height:1.2; max-height:2.5em; overflow:hidden; }
.rel-card .meta{ display:flex; justify-content:space-between; color:#475569; font-size:.85rem; margin-top:2px; }
.rel-card .price{ font-weight:800; margin-top:4px; }

@media (max-width: 640px){
  .rel-track{ grid-auto-columns: 80%; }  /* cards maiores no mobile para “arrastar” */
}

/* ===== Toasts (confirmações) ===== */
.toast{
  position:fixed; right:18px; bottom:18px; z-index:90;
  padding:10px 12px; border-radius:12px; color:#f8fafc;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 24px rgba(0,0,0,.25);
  background:#111827;
}
.toast.ok { background:#065f46; border-color:#059669; }   /* sucesso */
.toast.err{ background:#7f1d1d; border-color:#ef4444; }   /* erro */

/* Produto: carrossel compatível com o loop por scrollLeft do JS */
body.product-page .rel-track{
  display:block;             /* não-grid para o loop */
  overflow:hidden;
  white-space:nowrap;
}
body.product-page .rel-card{
  display:inline-block;
  vertical-align:top;
  width:220px;               /* casa com o JS */
  white-space:normal;        /* texto quebra dentro do card */
}

.btn-back{
  display:inline-flex; align-items:center; gap:8px;
  height:42px; padding:0 14px;
  background:#0f172a; color:#f8fafc;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px; box-shadow:0 1px 2px rgba(0,0,0,.2);
}
.btn-back:hover{ filter:brightness(1.05); }
.btn-back i{ font-size:14px; line-height:1; }

/* Botão "Voltar" no produto: alinhado e altura padrão */
.btn-back{
  display:inline-flex; align-items:center; gap:8px;
  height:42px; padding:0 14px; border-radius:12px;
  font-weight:700; line-height:1;
}
.btn-back i{ font-size:14px; line-height:1; }

/* largura/centralização iguais ao restante do site */
.ad-wrap{
  max-width: 72rem;          /* ~1152px, equivalente a "max-w-6xl" */
  margin-inline: auto;
  padding-inline: 1rem;      /* equivalente ao "px-4" */
  overflow: hidden;          /* corta sobras */
  max-height: 110px;         /* <<< altura fina no desktop */
}

/* força o <ins> a respeitar a altura do wrapper */
.ad-wrap > ins.adsbygoogle{
  display: block !important;
  height: 110px !important;
  line-height: 0 !important; /* evita espaço extra */
}

/* mobile ainda mais baixo */
@media (max-width:640px){
  .ad-wrap, .ad-wrap > ins.adsbygoogle{
    max-height: 90px;
    height: 90px !important;
  }
}