/* ============================================
   AEROPORTO MATERIAIS PARA CONSTRUÇÕES
   CNPJ: 00.167.560/0001-35 — Desde 1994
   Design Corporativo Profissional v2
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700;9..40,800&family=Playfair+Display:wght@700;800&display=swap');

/* ============================================
   CSS VARIABLES
   ============================================ */
:root {
  --b900:#0075E2; --b800:#0075E2; --b700:#0075E2; --b600:#0075E2; --b500:#0075E2;
  --b300:#0075E2; --b100:#0075E2; --b50:#0075E2;
  --ink:#1A1A1A; --ink80:rgba(26,26,26,.80); --ink50:rgba(26,26,26,.50);
  --ink20:rgba(26,26,26,.12); --ink08:rgba(26,26,26,.06);
  --white:#fff; --s1:#F6F9FC; --s2:#EEF4FA;
  --red:#D32F2F; --orange:#F57C00;
  --fd:'Playfair Display',Georgia,serif;
  --fb:'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  --r2:6px; --r3:10px; --r4:16px; --r5:22px; --r6:28px; --rf:9999px;
  --sc:0 1px 4px rgba(0,0,0,.06),0 2px 10px rgba(0,0,0,.05);
  --sh:0 6px 24px rgba(0,0,0,.10),0 2px 8px rgba(0,0,0,.04);
  --sf:0 20px 60px rgba(0,0,0,.12);

  /* compat com includes existentes */
  --primary:#0075E2; --primary-light:#0075E2; --primary-dark:#0075E2;
  --accent:#0075E2; --accent-dark:#0075E2;
  --white:#fff; --gray-50:#F6F9FC; --gray-100:#EEF4FA;
  --gray-200:rgba(26,26,26,.12); --gray-500:rgba(26,26,26,.50);
  --gray-900:#1A1A1A;
  --font-display:'Playfair Display',Georgia,serif;
  --font-body:'DM Sans',-apple-system,sans-serif;
  --font-primary:'DM Sans',-apple-system,sans-serif;
  --shadow-sm:0 1px 4px rgba(0,0,0,.06),0 2px 10px rgba(0,0,0,.05);
  --shadow-lg:0 6px 24px rgba(0,0,0,.10),0 2px 8px rgba(0,0,0,.04);
  --shadow-md:0 4px 12px rgba(0,0,0,.08);
  --shadow-2xl:0 24px 48px rgba(0,0,0,.15);
  --shadow-xl:0 16px 32px rgba(0,0,0,.12);
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
  --radius-xl:22px; --radius-2xl:28px; --radius-full:9999px;
  --transition-base:all 0.2s cubic-bezier(.4,0,.2,1);
  --transition-smooth:all 0.3s cubic-bezier(.4,0,.2,1);
  --transition-elegant:all 0.4s cubic-bezier(.4,0,.1,1);
}

/* ============================================
   RESET & BASE
   ============================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;overflow-x:hidden;max-width:100vw;font-size:133%}
body{font-family:var(--fb);font-size:16px;line-height:1.6;color:var(--ink);background:linear-gradient(180deg,#0075E2 0%,#ffffff 100%);background-attachment:fixed;overflow-x:clip}
a{text-decoration:none;color:inherit;transition:var(--transition-base)}
img{max-width:100%;height:auto;display:block;-webkit-user-drag:none;user-drag:none}
button{cursor:pointer;border:none;background:none;font-family:var(--fb)}
input,select,textarea{font-family:var(--fb)}
.container{max-width:1260px;margin:0 auto;padding:0 5vw;background:transparent}

/* ============================================
   PROMO TICKER
   ============================================ */
.promo-ticker{background:#0075E2;overflow:hidden;white-space:nowrap;padding:9px 0;position:relative;z-index:1000}
.promo-ticker-track{display:inline-flex;animation:tickerScroll 38s linear infinite;padding:0}
.promo-ticker-track span{display:inline-flex;align-items:center;gap:10px;padding:0 44px;font-size:12px;font-weight:500;letter-spacing:.3px;color:rgba(255,255,255,.70)}
.promo-ticker-track span::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--b300);flex-shrink:0;display:inline-block}
@keyframes tickerScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ============================================
   TOP BAR
   ============================================ */
.top-bar{background:var(--ink);border-bottom:1px solid rgba(255,255,255,.06)}
.top-bar .container{display:flex;align-items:center;justify-content:space-between;padding-top:8px;padding-bottom:8px;gap:12px;flex-wrap:wrap}
.top-bar-left{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.top-bar-left span{color:rgba(255,255,255,.55);display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500}
.top-bar-left span strong{color:rgba(255,255,255,.85);font-weight:600}
.top-bar-left span svg{width:13px;height:13px;fill:var(--b300)}
.top-bar-right{display:flex;align-items:center;gap:2px}
.top-bar-right a{color:rgba(255,255,255,.50);padding:4px 10px;border-radius:var(--r2);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;transition:var(--transition-base)}
.top-bar-right a:hover{background:rgba(255,255,255,.07);color:#fff}

/* ============================================
   HEADER
   ============================================ */
.header{background:rgba(255,255,255,.92);backdrop-filter:saturate(140%) blur(8px);box-shadow:0 1px 10px rgba(0,0,0,.05);position:sticky;top:0;z-index:999;border-bottom:1px solid var(--ink20);transition:var(--transition-smooth)}
.header.scrolled{box-shadow:0 3px 20px rgba(0,0,0,.09)}
.header .container{display:flex;align-items:center;gap:16px;padding-top:12px;padding-bottom:12px;min-height:auto}

/* Logo */
.logo{display:flex;align-items:center;gap:11px;flex-shrink:0;text-decoration:none;transition:opacity .2s}
.logo:hover{opacity:.86}
.logo-icon{width:160px;height:160px;border-radius:var(--r3);background:var(--b800);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-icon img{height:128px;width:auto;filter:brightness(10)}
.logo-icon svg{width:26px;height:26px;fill:#fff}
.logo-text h1{font-family:var(--fd);font-size:20px;font-weight:800;color:var(--ink);line-height:1.1;margin:0;letter-spacing:-.3px}
.logo-text span{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--b700)}

/* Nav */
.header nav{flex:1}
.nav-links{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.nav-links li a{font-family:var(--fb);font-weight:600;font-size:14px;color:var(--ink80);padding:9px 14px;border-radius:var(--r3);transition:var(--transition-base);white-space:nowrap}
.nav-links li a:hover{background:var(--b50);color:var(--b700)}
.nav-links li a.active{background:var(--b900);color:#fff}

/* Search */
.search-bar{display:flex;align-items:center;background:var(--s1);border:1.5px solid var(--ink20);border-radius:var(--rf);overflow:hidden;transition:var(--transition-base);max-width:480px;flex:1}
.search-bar:focus-within{border-color:var(--b600);box-shadow:0 0 0 3px rgba(193,75,24,.10);background:#fff}
.search-bar input{flex:1;border:none;background:transparent;padding:11px 14px;font-size:13.5px;color:var(--ink);font-weight:500}
.search-bar input::placeholder{color:var(--ink50)}
.search-bar input:focus{outline:none}
.search-bar button{display:flex;align-items:center;gap:7px;padding:0 18px;height:44px;background:var(--b700);color:#fff;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;transition:background .2s;border:none;cursor:pointer;flex-shrink:0}
.search-bar button svg{width:15px;height:15px;fill:#fff}
.search-bar button:hover{background:var(--b900)}

/* Header actions */
.header-actions{display:flex;align-items:center;gap:4px;margin-left:auto}
.header-btn{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 11px;border-radius:var(--r3);border:1.5px solid transparent;color:var(--ink80);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;transition:var(--transition-base)}
.header-btn svg{width:22px;height:22px;fill:var(--ink80)}
.header-btn:hover{background:var(--b50);border-color:var(--b300)}
.cart-count{position:absolute;top:2px;right:2px;min-width:18px;height:18px;background:var(--red);color:#fff;border-radius:var(--rf);font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid #fff}

.mobile-toggle{display:none;flex-direction:column;gap:5px;width:40px;height:40px;align-items:center;justify-content:center;border-radius:var(--r3);background:var(--s1);border:1.5px solid var(--ink20);transition:var(--transition-base);flex-shrink:0}
.mobile-toggle:hover{background:var(--b50);border-color:var(--b300)}
.mobile-toggle span{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:var(--transition-base)}

/* ============================================
   NAVBAR
   ============================================ */
.nav-bar{background:linear-gradient(135deg,#1A0800 0%,#3D1800 50%,#6B2D0A 100%)}
.nav-inner{display:flex;align-items:center;overflow-x:auto;scrollbar-width:none;padding:0 24px}
.nav-inner::-webkit-scrollbar{display:none}
.nav-link{padding:13px 14px;font-size:13px;font-weight:600;color:rgba(255,255,255,.72);white-space:nowrap;border-bottom:2.5px solid transparent;transition:all .2s}
.nav-link:hover{color:#fff;border-bottom-color:rgba(255,255,255,.4)}
.nav-link.active{color:#fff;border-bottom-color:#fff;font-weight:700}

/* ============================================
   HERO
   ============================================ */
.hero{background:linear-gradient(135deg,var(--b900) 0%,#2A1A0A 60%,#1A1A1A 100%);position:relative;overflow:hidden;padding:68px 0 64px;color:#fff}
.hero::before{content:'';position:absolute;top:-80px;right:-80px;width:500px;height:500px;background:radial-gradient(circle,rgba(33,150,243,.12) 0%,transparent 65%);pointer-events:none}
.hero .container{position:relative;z-index:2;display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.hero-content{flex:1;min-width:280px}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:var(--rf);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;margin-bottom:18px;color:rgba(255,255,255,.85)}
.hero-title{font-family:var(--fd);font-size:clamp(32px,4.2vw,56px);font-weight:700;line-height:1.08;letter-spacing:-.6px;margin-bottom:16px}
.hero-desc{font-size:clamp(15px,1.6vw,19px);color:rgba(255,255,255,.75);line-height:1.6;margin-bottom:24px;max-width:520px}
.hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border-radius:var(--r3);font-weight:700;font-size:14px;cursor:pointer;transition:var(--transition-base);text-decoration:none}
.btn-primary{background:#fff;color:var(--b900)}
.btn-primary:hover{background:rgba(255,255,255,.9);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.hero-media{flex:1;min-width:260px;display:flex;justify-content:center}
.hero-media img{max-width:100%;height:auto;border-radius:var(--r4);box-shadow:var(--sf);border:1px solid rgba(255,255,255,.12)}

/* ============================================
   SECTIONS
   ============================================ */
.section-header{text-align:left;margin:0 0 10px}
.section-header .label{display:inline-flex;align-items:center;gap:8px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:1.4px;color:#fff;background:var(--b900);padding:5px 14px;border-radius:var(--rf);margin-bottom:14px}
.sec-title,.section-header h2{font-family:var(--fd);font-size:clamp(22px,2.6vw,32px);font-weight:700;color:var(--ink);line-height:1.15;letter-spacing:-.3px;margin-bottom:10px}
.sec-desc,.section-header p{font-size:15px;color:var(--ink50);line-height:1.65}
.sec-row,.section-header-flex{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:44px;flex-wrap:wrap}
.section-header{text-align:left;margin:0}

/* ============================================
   PRODUCTS
   ============================================ */
.products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.product-card{background:#fff;border-radius:var(--r4);border:1px solid var(--ink20);overflow:hidden;transition:var(--transition-smooth);position:relative;display:flex;flex-direction:column}
.product-card:hover{transform:translateY(-4px);box-shadow:var(--sh);border-color:var(--b300)}
.product-media{position:relative;background:var(--s1);padding:18px;display:flex;align-items:center;justify-content:center;min-height:220px}
.product-media img{max-height:180px;width:auto;object-fit:contain;transition:transform .35s}
.product-card:hover .product-media img{transform:scale(1.04)}
.product-badges{position:absolute;top:10px;left:10px;display:flex;gap:6px;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:var(--rf);font-size:11px;font-weight:700;letter-spacing:.3px;text-transform:uppercase}
.badge-off{background:#D32F2F;color:#fff}
.badge-new{background:var(--b700);color:#fff}
.badge-feat{background:#F59E0B;color:#fff}
.product-info{padding:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.product-category{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--b700)}
.product-name{font-family:var(--fb);font-size:15px;font-weight:700;color:var(--ink);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:auto}
.price-now{font-size:18px;font-weight:800;color:var(--b700)}
.price-old{font-size:13px;font-weight:600;color:var(--ink50);text-decoration:line-through}
.product-actions{display:flex;align-items:center;gap:8px;margin-top:4px}
.btn-cart{width:100%;padding:11px;border-radius:var(--r3);background:var(--b700);color:#fff;font-weight:700;font-size:13px;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:var(--transition-base)}
.btn-cart:hover{background:var(--b900)}
.product-actions-overlay{display:none}

/* ============================================
   CATALOG / PRODUCT LISTING
   ============================================ */
.catalog-layout{display:grid;grid-template-columns:260px 1fr;gap:28px;align-items:start}
.catalog-sidebar{background:#fff;border-radius:var(--r4);border:1px solid var(--ink20);padding:18px;position:sticky;top:90px}
.catalog-sidebar h3{font-family:var(--fd);font-size:18px;font-weight:700;color:var(--ink);margin-bottom:14px}
.catalog-filters{list-style:none;padding:0;margin:0 0 18px}
.catalog-filters li a{display:flex;align-items:center;justify-content:space-between;padding:9px 10px;border-radius:var(--r3);font-size:14px;font-weight:600;color:var(--ink80);transition:var(--transition-base)}
.catalog-filters li a:hover,.catalog-filters li a.active{background:var(--b50);color:var(--b700)}
.catalog-filters .count{font-size:12px;color:var(--ink50);background:var(--s1);padding:2px 8px;border-radius:var(--rf)}
.catalog-main{min-width:0}
.catalog-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.catalog-header h1{font-family:var(--fd);font-size:clamp(22px,2.4vw,30px);font-weight:700;color:var(--ink)}
.catalog-sort{display:flex;align-items:center;gap:10px}
.catalog-sort label{font-size:13px;font-weight:700;color:var(--ink50)}
.catalog-sort select{padding:9px 12px;border-radius:var(--r3);border:1.5px solid var(--ink20);background:#fff;font-size:13px;font-weight:600;color:var(--ink)}
.catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

/* ============================================
   CART / CHECKOUT
   ============================================ */
.checkout-layout{display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:start}
.checkout-main{background:#fff;border-radius:var(--r4);border:1px solid var(--ink20);padding:22px}
.checkout-aside{background:#fff;border-radius:var(--r4);border:1px solid var(--ink20);padding:22px;position:sticky;top:90px}
.checkout-aside h3{font-family:var(--fd);font-size:18px;font-weight:700;color:var(--ink);margin-bottom:14px}
.summary-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--ink20);font-size:14px;color:var(--ink80)}
.summary-row.total{font-weight:800;color:var(--ink);font-size:16px;border-bottom:none;padding-top:14px}
.checkout-form{display:grid;gap:14px}
.checkout-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-field{display:flex;flex-direction:column;gap:6px}
.form-field label{font-size:12px;font-weight:700;color:var(--ink80)}
.form-field input,.form-field select{border:1.5px solid var(--ink20);border-radius:var(--r3);padding:10px 12px;font-size:14px;color:var(--ink);background:#fff}
.form-field input:focus,.form-field select:focus{outline:none;border-color:var(--b600);box-shadow:0 0 0 3px rgba(33,150,243,.12)}
.btn-checkout{width:100%;padding:14px;background:var(--b700);color:#fff;border:none;border-radius:var(--r3);font-weight:800;font-size:14px;cursor:pointer;transition:var(--transition-base)}
.btn-checkout:hover{background:var(--b900)}

/* ============================================
   FOOTER (estilo Magalu completo)
   ============================================ */
:root {
    --mg-primary: #0075E2;
    --mg-primary-dark: #005CB8;
    --mg-primary-light: #E3F2FD;
    --mg-success: #16A34A;
    --mg-warning: #EA8C00;
    --mg-bg: #F5F5F5;
    --mg-surface: #FFFFFF;
    --mg-text: #0F172A;
    --mg-text-secondary: #64748B;
    --mg-border: #E2E8F0;
    --mg-font: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.footer {
    background: #ffffff;
    color: var(--mg-text-secondary);
    padding: 0;
    border-top: 1px solid var(--mg-border);
    position: relative;
    overflow: hidden;
    font-family: var(--mg-font);
}

.footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(circle at 80% 20%, rgba(0, 113, 228, 0.02) 0%, transparent 40%),
                radial-gradient(circle at 10% 80%, rgba(0, 113, 228, 0.01) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.footer .container {
    position: relative;
    z-index: 1;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 56px;
    padding-bottom: 48px;
    border-bottom: 1px solid var(--mg-border);
}

/* ===== BRAND ===== */
.footer-brand-logo {
    display: block;
    margin-bottom: 16px;
    text-decoration: none;
    transition: transform 0.3s ease;
}

.footer-brand-logo:hover {
    transform: scale(1.05);
}

.footer-brand-logo img {
    height: 40px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
    display: block;
}

.footer-brand .footer-brand-sub {
    display: block;
    font-weight: 800;
    font-size: 10px;
    color: var(--mg-primary);
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 12px;
    margin-top: 0;
}

.footer-brand p {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.7;
    margin-bottom: 16px;
    color: var(--mg-text-secondary);
}

.footer-badges-inline {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.footer-cnpj,
.footer-ie {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    color: var(--mg-primary);
    background: var(--mg-surface);
    border: 1px solid var(--mg-border);
    padding: 6px 12px;
    border-radius: 6px;
    letter-spacing: 0.4px;
    transition: all 0.2s ease;
}

.footer-cnpj:hover,
.footer-ie:hover {
    border-color: var(--mg-primary);
    background: var(--mg-primary-light);
}

/* ===== ACCORDION ===== */
.footer-accordion {
    border-bottom: 1px solid var(--mg-border);
    padding-bottom: 24px;
}

.footer h4,
.footer-accordion-toggle {
    font-weight: 800;
    font-size: 11px;
    color: var(--mg-primary);
    margin: 0 0 20px 0;
    text-transform: uppercase;
    letter-spacing: 2px;
    transition: color 0.2s ease;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    text-align: left;
    font-family: var(--mg-font);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-accordion-toggle:hover {
    color: var(--mg-primary-dark);
}

.accordion-arrow {
    display: none;
    transition: transform 0.3s ease;
    font-size: 14px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 10px;
}

.footer-links a {
    font-size: 13px;
    font-weight: 500;
    color: var(--mg-text-secondary);
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    position: relative;
}

.footer-links a::before {
    content: '';
    width: 0;
    height: 1.5px;
    background: var(--mg-primary);
    transition: width 0.2s ease;
    display: inline-block;
}

.footer-links a:hover {
    color: var(--mg-primary);
    font-weight: 600;
}

.footer-links a:hover::before {
    width: 10px;
}

/* ===== CONTATO ===== */
.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-contact li {
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 500;
    color: var(--mg-text-secondary);
    line-height: 1.6;
}

.footer-contact li strong {
    color: var(--mg-text);
    font-weight: 700;
    display: block;
    margin-top: 8px;
    margin-bottom: 4px;
}

.footer-contact li:first-child strong {
    margin-top: 0;
}

.footer-contact li a {
    color: var(--mg-primary);
    text-decoration: none;
    transition: color 0.2s ease;
    font-weight: 600;
}

.footer-contact li a:hover {
    color: var(--mg-primary-dark);
    text-decoration: underline;
}

/* ===== BADGES (PAGAMENTO + SELOS) ===== */
.footer-badges {
    padding: 32px 0;
    border-bottom: 1px solid var(--mg-border);
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.badge-label {
    font-weight: 800;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 2px;
    color: var(--mg-primary);
    margin: 0;
    white-space: nowrap;
}

.badge-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
}

.badge-icons img {
    height: 32px;
    width: auto;
    object-fit: contain;
    max-width: 100px;
    transition: transform 0.2s ease;
}

.badge-icons img:hover {
    transform: scale(1.08);
}

/* ===== PAYMENT CARDS ===== */
.pay-svg {
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    padding: 0 12px;
    transition: all 0.2s ease;
    font-weight: 800;
    font-size: 12px;
}

.pay-svg:hover {
    transform: translateY(-2px);
}

/* PIX */
.pay-svg.pix {
    background: var(--mg-surface);
    border: 1.5px solid var(--mg-border);
    gap: 8px;
}

.pay-svg.pix svg {
    width: 16px;
    height: 16px;
}

.pay-svg.pix span {
    color: #32BCAD;
    letter-spacing: 0.5px;
}

/* VISA */
.pay-svg.visa {
    background: #1A1F71;
    color: white;
    font-family: Georgia, serif;
    font-style: italic;
    letter-spacing: -0.5px;
    padding: 0 14px;
}

/* MASTERCARD */
.pay-svg.master {
    background: var(--mg-surface);
    border: 1.5px solid var(--mg-border);
    gap: 6px;
}

.pay-svg.master .mc-c1 {
    width: 16px;
    height: 16px;
    background: #EB001B;
    border-radius: 50%;
}

.pay-svg.master .mc-c2 {
    width: 16px;
    height: 16px;
    background: #F79E1B;
    border-radius: 50%;
    margin-left: -6px;
}

/* ===== FOOTER BOTTOM ===== */
.footer-bottom {
    padding: 24px 0 32px;
}

.footer-bottom-links {
    display: flex;
    justify-content: center;
    gap: 24px;
    margin-bottom: 16px;
    flex-wrap: wrap;
    border-top: 1px solid var(--mg-border);
    padding-top: 20px;
}

.footer-bottom-links a {
    font-size: 12px;
    font-weight: 700;
    color: var(--mg-primary);
    transition: all 0.2s ease;
    text-decoration: none;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.footer-bottom-links a:hover {
    color: var(--mg-primary-dark);
    transform: translateY(-1px);
}

.footer-bottom p {
    font-size: 12px;
    font-weight: 500;
    color: var(--mg-text-secondary);
    margin: 0;
    text-align: center;
    line-height: 1.7;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }
}

@media (max-width: 768px) {
    .footer {
        padding: 0;
    }

    .footer-brand {
        padding-bottom: 24px;
        border-bottom: 1px solid var(--mg-border);
    }

    .footer-accordion {
        border-bottom: 1px solid var(--mg-border);
        padding-bottom: 0;
    }

    .footer h4,
    .footer-accordion-toggle {
        margin: 0;
        padding: 16px 0;
        font-size: 13px;
    }

    .accordion-arrow {
        display: inline-block;
    }

    .footer-accordion-toggle.active .accordion-arrow {
        transform: rotate(90deg);
    }

    .footer-accordion-content {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition: all 0.3s ease;
    }

    .footer-accordion-content.open {
        max-height: 500px;
        opacity: 1;
        padding-bottom: 12px;
    }

    .footer-bottom {
        padding: 20px 0 24px;
    }

    .footer-bottom-links {
        flex-direction: column;
        gap: 0;
        align-items: stretch;
        text-align: center;
        border-top: none;
        padding-top: 0;
        margin-bottom: 16px;
    }

    .footer-bottom-links a {
        padding: 12px 0;
        font-size: 13px;
        border-bottom: 1px solid var(--mg-border);
        width: 100%;
        display: block;
    }

    .footer-bottom-links a:last-child {
        border-bottom: none;
    }

    .footer-bottom p {
        font-size: 11px;
        line-height: 1.6;
        padding: 0 12px;
    }

    .footer-badges {
        padding: 24px 0;
        flex-direction: column;
        align-items: flex-start;
    }

    .badge-label {
        width: 100%;
        margin-bottom: 12px;
    }

    .badge-icons {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 640px) {
    .footer {
        padding: 0;
    }

    .container {
        padding-left: 2.5vw !important;
        padding-right: 2.5vw !important;
    }
}

/* ===== MAIS INFORMAÇÕES (MAG-BOTTOM) ===== */
.more-info-bar {
    text-align: left;
    padding: 16px 24px;
    font-weight: 700;
    font-size: 13px;
    color: #666666;
    background: #ffffff;
    border: none;
    cursor: pointer;
    letter-spacing: 0.2px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    font-family: inherit;
    margin: 0;
}

.more-info-bar .more-info-arrow {
    transition: transform 0.3s ease;
}

.more-info-bar[aria-expanded="true"] .more-info-arrow {
    transform: rotate(180deg);
}

.mag-bottom {
    padding: 0 5vw;
    font-family: Arial, Helvetica, sans-serif;
    color: #0F172A;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease, padding 0.4s ease, opacity 0.3s ease;
    opacity: 0;
}

.mag-bottom.open {
    max-height: 4000px;
    padding-top: 48px;
    padding-bottom: 32px;
    opacity: 1;
}

.mag-bottom-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 40px;
    margin-bottom: 40px;
}

.mag-bottom-col h4 {
    font-size: 13px;
    font-weight: 700;
    color: #0F172A;
    margin-bottom: 10px;
}

.mag-bottom-col p {
    font-size: 12px;
    color: #64748b;
    line-height: 1.6;
}

.mag-chat-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1.5px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
    font-size: 14px;
    font-weight: 600;
    color: #0F172A;
    cursor: pointer;
    transition: all .2s;
    margin-bottom: 10px;
}

.mag-chat-btn:hover {
    background: #f8fafc;
    border-color: #94a3b8;
}

.mag-phone {
    font-size: 13px;
    color: #64748b;
    line-height: 1.5;
}

.mag-bottom-copy {
    font-size: 11px;
    color: #64748b;
    text-align: center;
    line-height: 1.7;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
}

@media (max-width: 1199px) {
    .mag-bottom-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 36px;
    }
}

@media (max-width: 768px) {
    .mag-bottom-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px 20px;
    }
}

@media (max-width: 480px) {
    .mag-bottom-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}

@media print{.promo-ticker,.top-bar,.header,.nav-bar,.mobile-sidebar,.cart-sidebar,.footer,.whatsapp-float{display:none}}

/* ============================================
   UTILS / COMPONENTS
   ============================================ */
.whatsapp-float{position:fixed;right:20px;bottom:20px;width:52px;height:52px;background:#25D366;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;text-decoration:none;box-shadow:var(--sh);z-index:900;transition:var(--transition-base)}
.whatsapp-float:hover{transform:translateY(-2px);box-shadow:var(--sf)}

.toast{position:fixed;top:20px;right:20px;background:#fff;border:1px solid var(--ink20);border-radius:var(--r3);padding:14px 18px;box-shadow:var(--sh);z-index:1100;display:flex;align-items:center;gap:10px;font-weight:700;color:var(--ink);transform:translateX(80px);opacity:0;transition:var(--transition-smooth)}
.toast.show{transform:translateX(0);opacity:1}
.toast-success{border-left:4px solid #16A34A}
.toast-error{border-left:4px solid #DC2626}

.skeleton{background:linear-gradient(90deg,var(--s1) 25%,var(--s2) 50%,var(--s1) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--r3)}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ============================================
   RESPONSIVO
   ============================================ */
@media(max-width:1200px){.products-grid{grid-template-columns:repeat(3,1fr)}.catalog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:992px){.products-grid{grid-template-columns:repeat(2,1fr)}.catalog-grid{grid-template-columns:repeat(2,1fr)}.checkout-layout{grid-template-columns:1fr}.catalog-layout{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:768px){
  .header nav{display:none}
  .nav-bar{display:none}
  .search-bar{max-width:240px}
  .logo-icon{width:120px;height:120px}
  .logo-icon img{height:96px}
  .hero{padding:48px 0 44px}
  .footer-grid{grid-template-columns:1fr}
  .sec-row,.section-header-flex{flex-direction:column;align-items:flex-start;gap:16px}
  .catalog-sidebar{position:static}
}
@media(max-width:640px){
  .search-bar{max-width:160px}
  .header-actions .header-btn span{display:none}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-media{width:100%}
}

.topo-banner {
    display: block;
    width: 100%;
    height: auto;
    max-height: 240px;
    object-fit: cover;
    object-position: center;
    margin-bottom: 20px;
    border-radius: 0;
}
@media print{.promo-ticker,.top-bar,.header,.nav-bar,.mobile-sidebar,.cart-sidebar,.footer,.whatsapp-float{display:none}}