:root{--black:#000000;--soft:#101010;--white:#fff;--red:#e31b23;--red-dark:#b8070d;--blue:#116fd1;--blue-dark:#074e9d;--gray:#777;--border:#e6e6e6}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#111;background:#fff;font-family:Inter,Arial,sans-serif}.shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}a{color:inherit;text-decoration:none}button{font:inherit}.skip-link{position:fixed;z-index:99;top:-60px;left:20px;background:#fff;padding:12px}.skip-link:focus{top:12px}.site-header{background:#000000;color:#fff}.topbar{height:92px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:#000000}.topbar__item{display:flex;align-items:center;gap:12px;font-family:'Barlow Condensed',sans-serif}.topbar__item span:last-child{display:grid}.topbar__item small{font-size:10px;color:#999}.topbar__item strong{font-size:13px}.truck{font-size:27px;color:var(--red);transform:rotate(90deg)}.site-logo{display:flex;align-items:center;justify-content:center;height:92px}.site-logo img{display:block;width:auto;height:72px;max-width:260px;object-fit:contain}.brand{position:relative;display:flex;align-items:center;color:#e6f3ff;font:900 34px/1 'Barlow Condensed',sans-serif;font-style:italic;text-shadow:0 0 5px #268de8}.brand i{position:absolute;z-index:0;left:42%;font-size:82px;color:#ec1c24;text-shadow:0 0 12px #8b0000;transform:rotate(8deg)}.brand span{position:relative;z-index:1}.brand small{display:block;text-align:center;color:#fff;font-size:17px;letter-spacing:1px;text-shadow:2px 2px #111}.topbar__social{justify-self:end;display:flex;gap:20px;font-size:11px}.topbar__social a{color:#ddd}.topbar__social a:first-child{font-weight:700}.main-nav{border-block:1px solid #1f2733;height:54px;background:#000000}.nav-inner{height:100%;display:flex;align-items:center;background:#000000}.category-toggle{height:38px;padding:0 24px;color:#fff;border:1px solid #2789eb;border-radius:4px;background:linear-gradient(#167be8,#0755ad);font-size:12px;font-weight:700}.category-toggle span{font-size:17px;margin-right:9px}.menu{display:flex;flex:1;justify-content:center;gap:37px}.menu a{font:700 12px 'Barlow Condensed',sans-serif;letter-spacing:.3px}.menu a:hover,.menu a:focus,.menu .active{color:var(--red)}.nav-actions{display:flex;gap:17px;align-items:center}.nav-actions button,.nav-actions a{border:0;background:none;color:#fff;font-size:22px;padding:2px}.cart{position:relative}.cart span{position:absolute;right:-7px;top:-8px;background:var(--red);border-radius:50%;font:700 9px Inter;padding:3px 5px}.mobile-toggle{display:none}.hero{position:relative;min-height:490px;background:#000000;color:#fff;overflow:hidden}.hero-art{position:absolute;inset:0 0 0 38%;background:linear-gradient(90deg,#030303 0%,transparent 38%),linear-gradient(0deg,#030303 0%,transparent 35%),radial-gradient(circle at 68% 40%,rgba(238,18,28,.46),transparent 28%),linear-gradient(125deg,transparent 0 49%,rgba(238,18,28,.85) 49.2% 49.7%,transparent 50% 100%),linear-gradient(35deg,transparent 0 59%,rgba(238,18,28,.6) 59.2% 59.6%,transparent 60% 100%),linear-gradient(110deg,#050505 0%,#100002 62%,#030303 100%);background-repeat:no-repeat;filter:saturate(1.3)}.hero-art::before{content:'';position:absolute;right:11%;bottom:0;width:34%;height:88%;background:radial-gradient(ellipse at 50% 14%,#301b19 0 8%,#0a0a0a 9% 12%,transparent 13%),radial-gradient(ellipse at 50% 45%,#171717 0 23%,transparent 24%),linear-gradient(74deg,transparent 0 38%,#121212 39% 60%,transparent 61%);filter:drop-shadow(0 0 20px rgba(227,27,35,.55));clip-path:polygon(40% 0,60% 0,67% 12%,84% 27%,100% 53%,86% 61%,73% 42%,76% 100%,24% 100%,27% 43%,14% 62%,0 54%,16% 27%,33% 12%)}.hero-art::after{content:'';position:absolute;right:16%;bottom:7%;width:18%;height:14%;border:12px solid #151515;border-radius:50%;box-shadow:-95px -18px 0 -7px #151515;transform:rotate(-20deg)}.hero-inner{position:relative;z-index:1;min-height:408px;display:flex;align-items:center}.hero-copy{padding-left:48px}.hero-title{margin:0;font:italic 900 58px/.83 'Barlow Condensed',sans-serif;letter-spacing:-2px}.hero-title strong{display:block;color:#ef2025;font-size:92px;text-shadow:4px 4px 0 #680008}.hero-subtitle{font:700 17px/1.25 'Barlow Condensed';letter-spacing:.3px}.hero-subtitle em{color:#66a8ef}.button{display:inline-flex;align-items:center;justify-content:center;color:#fff;border-radius:4px;font:800 12px Inter}.button--hero{margin-top:10px;padding:14px 24px;background:linear-gradient(90deg,#0876de 0 72%,#e51b23 72%);box-shadow:0 0 17px #0755ad}.hero-institutional-section{width:100%;margin:0;padding:0;background:#000}.hero-institutional{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:0;line-height:0;background:#000}.hero-institutional img{display:block;width:100%;height:auto;margin:0;padding:0;object-fit:contain}.storefront{background:#fff;padding:24px 0 28px}.catalog-section{padding:0 0 22px}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-head h2{display:flex;align-items:center;gap:8px;margin:0;font:italic 800 28px 'Barlow Condensed'}.section-head h2 i{color:var(--red);font-size:16px}.section-head h2 span{display:block;width:55px;height:7px;border-block:2px solid var(--red);transform:skewX(-35deg)}.section-head>a{border:1px solid #ccc;border-radius:4px;padding:9px 22px;font:700 9px Inter}.section-head>a:hover{color:#fff;background:#111}.category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.category-card{min-width:0;height:188px;border:1px solid var(--border);border-radius:4px;box-shadow:0 2px 5px #00000008;padding:7px 10px 13px;display:flex;flex-direction:column;justify-content:flex-end;transition:.2s}.category-card:hover{transform:translateY(-3px);box-shadow:0 7px 18px #00000012;border-color:#ccc}.category-card img{width:100%;height:142px;object-fit:contain}.category-card strong{font:700 14px/1 'Barlow Condensed';text-transform:uppercase;display:flex;align-items:flex-start}.category-card strong i{color:var(--red);font-size:10px;margin-right:4px}.product-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.product-card{border:1px solid var(--border);border-radius:4px;padding:10px 14px 13px;min-width:0}.product-card img{width:100%;height:170px;object-fit:contain}.product-card small{color:#999;font-size:10px}.product-card h3{height:32px;margin:4px 0 7px;font:600 13px/1.2 Inter}.price{font:700 17px 'Barlow Condensed'}.product-card p{color:#888;font-size:9px;margin:2px 0 9px}.buy-button{width:100%;height:32px;border:0;border-radius:4px;color:#fff;background:linear-gradient(#ed2024,#bf080b);font-size:10px;font-weight:800;cursor:pointer}.buy-button:hover,.buy-button:focus{filter:brightness(1.15);box-shadow:0 3px 8px #b8070d55}.buy-button.added{background:#188046}.promo-grid{display:grid;gap:14px;align-items:start}.promo{height:220px;border:1px solid var(--border);display:flex;overflow:hidden;padding:25px 30px}.promo>div:first-child{position:relative;z-index:1;max-width:50%}.promo h2{margin:0;font:italic 700 31px/.9 'Barlow Condensed'}.promo p{font-size:10px;line-height:1.5;color:#777}.button--red{padding:10px 22px;margin-top:8px;background:linear-gradient(#ed2024,#b8070d)}.promo--community{background:linear-gradient(115deg,#fff 60%,#f4f4f4 60%);justify-content:space-between}.promo--community h2{font-weight:500}.promo--community h2 strong{color:var(--red);font-weight:900}.phone{width:130px;height:240px;background:#080808;border:6px solid #222;border-radius:22px;transform:rotate(9deg);box-shadow:0 5px 15px #0003;display:grid;place-items:center;margin:-15px 10px 0 0}.phone span{display:grid;text-align:center;color:red;font-size:45px}.phone small{color:#53a2eb;font:900 18px 'Barlow Condensed'}.footer{background:#030303;color:#aaa;padding:35px 0 14px}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:65px}.brand--footer{font-size:29px;width:max-content;margin:13px 0 28px}.brand--footer i{font-size:70px}.footer h3{color:#fff;font:700 14px 'Barlow Condensed'}.footer-grid>div>a:not(.brand){display:block;font-size:10px;margin:9px 0}.footer p{font-size:10px;line-height:1.7}.location{color:#fff;margin-top:18px}.copyright{border-top:1px solid #151515;margin-top:25px;padding-top:13px;font-size:8px;color:#666}.mobile-toggle span{width:22px;height:2px;background:#fff;display:block;margin:4px}
@media(max-width:980px){.topbar__item,.topbar__social{display:none}.topbar{grid-template-columns:1fr;justify-items:center}.menu{gap:18px}.hero-art{inset:0;background-position:center;background-size:cover;opacity:.48}.category-grid{grid-template-columns:repeat(3,1fr)}.product-grid{grid-template-columns:repeat(3,1fr)}.promo{height:240px}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.shell{width:min(100% - 24px,1180px)}.topbar{height:74px}.site-logo{height:60px}.site-logo img{max-height:60px}.brand{font-size:27px}.brand i{font-size:62px}.brand small{font-size:13px}.main-nav{height:52px}.category-toggle{padding:0 12px}.mobile-toggle{display:block;margin-left:auto;border:0;background:none}.menu{display:none;position:absolute;z-index:20;top:126px;left:0;right:0;background:#090909;padding:20px;flex-direction:column;align-items:center}.menu.menu--open{display:flex}.nav-actions{margin-left:12px}.hero{min-height:650px}.hero-inner{align-items:flex-start;padding-top:55px}.hero-copy{padding-left:10px}.hero-title{font-size:43px}.hero-title strong{font-size:70px}.hero-art{inset:210px 0 130px;background-position:65% center;opacity:.75}.category-grid{grid-template-columns:repeat(2,1fr)}.product-grid{grid-template-columns:repeat(2,1fr)}.product-card{padding:8px}.product-card img{height:135px}.promo{padding:20px;height:220px}.footer-grid{grid-template-columns:1fr 1fr;gap:25px}.footer-grid>div:first-child{grid-column:1/-1}.section-head h2{font-size:24px}.section-head>a{padding:8px 12px}}@media(max-width:390px){.product-grid{grid-template-columns:1fr}.product-card img{height:180px}.category-card{height:165px}.category-card img{height:120px}.hero-title strong{font-size:62px}.promo>div:first-child{max-width:65%}}

/* ===== FIX VISUAL DEFINITIVO ===== */

body {
    background: #fff !important;
}

/* HEADER */
.site-header,
.topbar,
.main-nav,
.nav-inner {
    background: #000 !important;
}

/* LOGO */
.site-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 280px !important;
    height: 92px !important;
    margin: 0 auto !important;
}

.site-logo img {
    display: block !important;
    width: 240px !important;
    height: 80px !important;
    max-width: 240px !important;
    max-height: 80px !important;
    object-fit: contain !important;
    object-position: center !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* HERO */
.hero {
    position: relative !important;
    height: 490px !important;
    min-height: 490px !important;
    max-height: 490px !important;
    overflow: hidden !important;
    background: #000 !important;
}

.hero-art {
    position: absolute !important;
    inset: 0 0 0 38% !important;
    overflow: hidden !important;
}

.hero-art::before,
.hero-art::after {
    overflow: hidden !important;
}

/* BANNER INSTITUCIONAL */
.hero-institutional-section {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 100px !important;
    min-height: 100px !important;
    max-height: 100px !important;
    overflow: hidden !important;
    background: #000 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hero-institutional {
    width: 1180px !important;
    max-width: calc(100% - 40px) !important;
    height: 100px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
}

.hero-institutional img {
    display: block !important;
    width: 100% !important;
    height: 100px !important;
    max-height: 100px !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* CATEGORIAS E CONTEÚDO */
.storefront {
    position: relative !important;
    z-index: 50 !important;
    display: block !important;
    width: 100% !important;
    background: #fff !important;
    color: #111 !important;
    margin: 0 !important;
    padding: 24px 0 28px !important;
    clear: both !important;
}

.catalog-section,
.products-section,
.category-grid,
.product-grid {
    position: relative !important;
    z-index: 51 !important;
    background: #fff !important;
}

/* mata qualquer arte preta/vermelha entrando no catálogo */
.storefront * {
    isolation: auto;
}

@media (max-width:700px) {

    .site-logo {
        width: 210px !important;
        height: 74px !important;
    }

    .site-logo img {
        width: 190px !important;
        height: 60px !important;
    }

    .hero-institutional-section,
    .hero-institutional,
    .hero-institutional img {
        height: 76px !important;
        min-height: 76px !important;
        max-height: 76px !important;
    }
}

/* ===== FIM FIX VISUAL DEFINITIVO ===== */

/* AJUSTE FINAL LOGO */
.site-logo {
}

.site-logo img {
}

@media (max-width:700px) {
    .site-logo img {
    }
}

/* AJUSTE FINAL LOGO */
.site-logo {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    height:92px !important;
    margin:0 auto !important;
}

.site-logo img {
    display:block !important;
    width:100px !important;
    max-width:100px !important;
    height:auto !important;
    max-height:80px !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 auto !important;
}

@media (max-width:700px) {
    .site-logo img {
        width:85px !important;
        max-width:85px !important;
        height:auto !important;
    }
}

/* AJUSTE LOGO 120PX - SOMENTE LOGO */
.site-logo img {
    width: 120px !important;
    max-width: 120px !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
}

/* AJUSTE LOGO 120PX - SOMENTE LOGO */
.site-logo img {
    width: 120px !important;
    max-width: 120px !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
}

/* LOGO OFICIAL - AJUSTE VISUAL */
.site-logo {
    width: 120px !important;
    height: 92px !important;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.site-logo img {
    display: block !important;
    width: 120px !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;

    /* compensa margem interna existente no PNG */
    transform: scale(1.65) !important;
    transform-origin: center center !important;
}

/* LOGO OFICIAL - AJUSTE VISUAL */
.site-logo {
    width: 120px !important;
    height: 92px !important;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.site-logo img {
    display: block !important;
    width: 120px !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;

    /* compensa margem interna existente no PNG */
    transform: scale(1.65) !important;
    transform-origin: center center !important;
}

/* ==================================================
   HEADER / LOGO - PROPORCAO FINAL LENDARIOS
   Referencia visual: lampi2
   ================================================== */

.site-header {
    background: #000000 !important;
}

/* faixa superior */
.topbar {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    background: #000000 !important;
    align-items: center !important;
}

/* container da logo */
.site-logo {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 140px !important;
    height: 72px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    overflow: visible !important;

    transform: none !important;
}

/* LOGO OFICIAL */
.site-logo img {
    display: block !important;

    width: 120px !important;
    max-width: 120px !important;

    height: auto !important;
    max-height: 62px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;

    transform: none !important;
    scale: 1 !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* navbar totalmente independente da logo */
.main-nav {
    position: relative !important;
    z-index: 20 !important;

    height: 48px !important;
    min-height: 48px !important;

    margin: 0 !important;

    background: #000000 !important;
}

.nav-inner {
    height: 48px !important;
    min-height: 48px !important;

    display: flex !important;
    align-items: center !important;

    background: #000000 !important;
}

/* desktop: impede logo de invadir menu */
@media (min-width: 701px) {

    .site-logo {
        width: 140px !important;
        height: 72px !important;
    }

    .site-logo img {
        width: 120px !important;
        max-width: 120px !important;
        height: auto !important;
        max-height: 62px !important;
        transform: none !important;
    }
}

/* mobile */
@media (max-width: 700px) {

    .topbar {
        height: 64px !important;
        min-height: 64px !important;
        max-height: 64px !important;
    }

    .site-logo {
        width: 115px !important;
        height: 64px !important;
    }

    .site-logo img {
        width: 100px !important;
        max-width: 100px !important;
        height: auto !important;
        max-height: 54px !important;
        transform: none !important;
    }

    .main-nav,
    .nav-inner {
        height: 48px !important;
        min-height: 48px !important;
    }
}

/* ==================================================
   FIM HEADER / LOGO
   ================================================== */

/* ===== LOGO 130PX ALTURA - AJUSTE FINAL ===== */

.topbar {
    height: 150px !important;
    min-height: 150px !important;
    max-height: 150px !important;
}

.site-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    height: 150px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    overflow: visible !important;
    transform: none !important;
}

.site-logo img {
    display: block !important;

    width: auto !important;
    max-width: none !important;

    height: 130px !important;
    min-height: 130px !important;
    max-height: 130px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;

    transform: none !important;
    scale: 1 !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* ===== FIM LOGO 130PX ALTURA ===== */

/* ===== LOGO 350PX ALTURA ===== */

.topbar {
    height: 380px !important;
    min-height: 380px !important;
    max-height: 380px !important;
}

.site-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: 380px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    transform: none !important;
}

.site-logo img {
    display: block !important;

    width: auto !important;
    max-width: none !important;

    height: 350px !important;
    min-height: 350px !important;
    max-height: 350px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center !important;

    transform: none !important;
    scale: 1 !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* ===== FIM LOGO 350PX ALTURA ===== */

/* ===== AJUSTE LOGO CORTADA NO CONTAINER ===== */

/* Container superior mais baixo */
.topbar {
    height: 120px !important;
    min-height: 120px !important;
    max-height: 120px !important;

    overflow: hidden !important;
}

/* Container exclusivo da logo */
.site-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;

    height: 120px !important;
    min-height: 120px !important;
    max-height: 120px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    overflow: hidden !important;

    position: relative !important;
}

/* Logo continua grande */
.site-logo img {
    display: block !important;

    width: auto !important;
    max-width: none !important;

    height: 350px !important;
    min-height: 350px !important;
    max-height: 350px !important;

    object-fit: contain !important;
    object-position: center center !important;

    margin: 0 auto !important;
    padding: 0 !important;

    transform: none !important;
    scale: 1 !important;
}

/* ===== FIM AJUSTE LOGO CORTADA ===== */

/* ===== AJUSTE LOGO 400PX / CONTAINER 220PX ===== */

.topbar {
    height: 220px !important;
    min-height: 220px !important;
    max-height: 220px !important;
    overflow: hidden !important;
}

.site-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;

    height: 220px !important;
    min-height: 220px !important;
    max-height: 220px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    overflow: hidden !important;
    position: relative !important;
}

.site-logo img {
    display: block !important;

    width: auto !important;
    max-width: none !important;

    height: 400px !important;
    min-height: 400px !important;
    max-height: 400px !important;

    object-fit: contain !important;
    object-position: center center !important;

    margin: 0 auto !important;
    padding: 0 !important;

    transform: none !important;
    scale: 1 !important;
}

/* ===== FIM AJUSTE LOGO 400PX / CONTAINER 220PX ===== */

/* ===== BANNER1 HERO START ===== */

/*
   O hero agora e composto pela imagem /img/banner1.png.
   Ela ocupa toda a largura disponivel.
*/

.hero.hero-banner1 {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    background: #000000 !important;

    isolation: isolate !important;
}


/* imagem principal */
.hero-banner1__media {
    position: relative !important;

    display: block !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 0 !important;

    background: #000000 !important;
}


.hero-banner1__media img {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;

    border: 0 !important;
}


/*
   Desliga completamente o esboco antigo.
*/
.hero-banner1 .hero-art,
.hero-banner1 .hero-copy,
.hero-banner1 .hero-inner,
.hero-banner1 .hero-title,
.hero-banner1 .hero-subtitle,
.hero-banner1 .button--hero {
    display: none !important;
}


/* ======================================================
   CARD INSTITUCIONAL SOBREPOSTO AO BANNER
   ====================================================== */

.hero-banner1 .hero-institutional-section {
    position: absolute !important;

    z-index: 10 !important;

    left: 0 !important;
    right: 0 !important;
    bottom: 12px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 20px !important;

    overflow: visible !important;

    background: transparent !important;
}


.hero-banner1 .hero-institutional {
    position: relative !important;

    width: min(1180px, 100%) !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 auto !important;
    padding: 0 !important;

    overflow: hidden !important;

    background: transparent !important;

    line-height: 0 !important;
}


.hero-banner1 .hero-institutional img {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;

    border: 0 !important;
}


/*
   Catalogo branco inicia depois do banner.
*/
.hero-banner1 + .storefront {
    position: relative !important;
    z-index: 20 !important;

    width: 100% !important;

    margin: 0 !important;

    background: #ffffff !important;
}


/* ======================================================
   RESPONSIVO
   ====================================================== */

@media (max-width: 980px) {

    .hero-banner1 .hero-institutional-section {
        bottom: 8px !important;
        padding: 0 14px !important;
    }

    .hero-banner1 .hero-institutional {
        width: min(94%, 1180px) !important;
    }
}


@media (max-width: 700px) {

    .hero-banner1__media img {
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }

    .hero-banner1 .hero-institutional-section {
        bottom: 4px !important;
        padding: 0 8px !important;
    }

    .hero-banner1 .hero-institutional {
        width: 96% !important;
    }
}


/* ===== BANNER1 HERO END ===== */

/* ===== MENU LENDARIOS AJUSTADO START ===== */

/*
   Navbar compacta baseada no esboco original.
   NAO altera logo, hero ou restante da homepage.
*/

.main-nav {
    position: relative !important;
    z-index: 50 !important;

    width: 100% !important;

    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #000000 !important;

    border-top: 1px solid #1b2430 !important;
    border-bottom: 1px solid #1b2430 !important;
}


/* largura util do menu */
.main-nav .nav-inner {
    width: min(1180px, calc(100% - 40px)) !important;

    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    display: grid !important;

    grid-template-columns:
        155px
        minmax(0, 1fr)
        120px !important;

    align-items: center !important;

    column-gap: 24px !important;

    background: #000000 !important;
}


/* ==========================
   BOTAO CATEGORIAS
   ========================== */

.category-toggle {
    width: 155px !important;
    height: 36px !important;

    margin: 0 !important;
    padding: 0 17px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 9px !important;

    border: 1px solid #2789eb !important;
    border-radius: 4px !important;

    background:
        linear-gradient(
            180deg,
            #1683ef 0%,
            #0867c8 100%
        ) !important;

    color: #ffffff !important;

    font-family: Inter, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;

    line-height: 1 !important;

    white-space: nowrap !important;
}

.category-toggle span {
    margin: 0 !important;

    font-size: 17px !important;
    line-height: 1 !important;
}


/* ==========================
   LINKS CENTRAIS
   ========================== */

.menu {
    min-width: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 30px !important;

    margin: 0 !important;
    padding: 0 !important;
}

.menu a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #ffffff !important;

    font-family: "Barlow Condensed", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;

    line-height: 1 !important;

    letter-spacing: 0.15px !important;

    white-space: nowrap !important;

    transition:
        color .18s ease,
        opacity .18s ease !important;
}

.menu a:hover,
.menu a:focus {
    color: #ef2025 !important;
}

.menu a.active {
    color: #ef2025 !important;
}


/* ==========================
   ICONES DIREITA
   ========================== */

.nav-actions {
    width: 120px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    gap: 15px !important;

    margin: 0 !important;
    padding: 0 !important;
}

.nav-actions button,
.nav-actions a {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 22px !important;
    height: 32px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    color: #ffffff !important;

    font-size: 18px !important;
    line-height: 1 !important;
}


/* contador carrinho */
.nav-actions .cart span {
    position: absolute !important;

    top: -2px !important;
    right: -5px !important;

    min-width: 16px !important;
    height: 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 4px !important;

    border-radius: 50% !important;

    background: #ed1c24 !important;
    color: #ffffff !important;

    font-family: Inter, sans-serif !important;
    font-size: 8px !important;
    font-weight: 800 !important;
}


/* ==========================
   NOTEBOOK / TELA MEDIA
   ========================== */

@media (max-width: 1150px) {

    .main-nav .nav-inner {
        grid-template-columns:
            145px
            minmax(0, 1fr)
            105px !important;

        column-gap: 14px !important;
    }

    .category-toggle {
        width: 145px !important;
    }

    .menu {
        gap: 20px !important;
    }

    .menu a {
        font-size: 10px !important;
    }

    .nav-actions {
        width: 105px !important;
        gap: 11px !important;
    }
}


/* ==========================
   TABLET / MOBILE
   preserva menu hamburger
   ========================== */

@media (max-width: 700px) {

    .main-nav,
    .main-nav .nav-inner {
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
    }

    .main-nav .nav-inner {
        display: flex !important;
        width: calc(100% - 24px) !important;
        column-gap: 0 !important;
    }

    .category-toggle {
        width: auto !important;
        height: 36px !important;
        padding: 0 12px !important;
    }

    .mobile-toggle {
        display: block !important;
        margin-left: auto !important;
    }

    .menu {
        display: none !important;
    }

    .menu.menu--open {
        position: absolute !important;

        z-index: 100 !important;

        top: 52px !important;
        left: 0 !important;
        right: 0 !important;

        display: flex !important;
        flex-direction: column !important;

        gap: 0 !important;

        padding: 12px 20px !important;

        background: #080808 !important;

        border-bottom: 1px solid #222 !important;
    }

    .menu.menu--open a {
        width: 100% !important;
        height: 42px !important;

        font-size: 14px !important;
    }

    .nav-actions {
        width: auto !important;
        margin-left: 12px !important;
    }
}

/* ===== MENU LENDARIOS AJUSTADO END ===== */

/* ===== NAV ICONS SEARCH START ===== */


/* ========================================================
   ICONES DA NAVBAR
   ======================================================== */

.nav-actions {
    position: relative !important;

    width: 125px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    gap: 13px !important;

    margin: 0 !important;
    padding: 0 !important;
}


.nav-actions > button,
.nav-actions > a {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 30px !important;

    width: 30px !important;
    height: 36px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    outline: 0 !important;

    background: transparent !important;
    color: #ffffff !important;

    cursor: pointer !important;

    transition:
        color .18s ease,
        transform .18s ease,
        opacity .18s ease !important;
}


.nav-actions > button:hover,
.nav-actions > a:hover {
    color: #e31b23 !important;
    transform: translateY(-1px) !important;
}


.nav-actions svg {
    display: block !important;

    width: 21px !important;
    height: 21px !important;

    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


/* busca */
.search-toggle svg {
    width: 19px !important;
    height: 19px !important;
}


/* usuario */
.account-link svg {
    width: 22px !important;
    height: 22px !important;
}


/* carrinho */
.cart-link {
    overflow: visible !important;
}

.cart-link svg {
    width: 23px !important;
    height: 23px !important;
}


.cart-count {
    position: absolute !important;

    top: -1px !important;
    right: -3px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 15px !important;
    height: 15px !important;

    padding: 0 4px !important;

    border-radius: 999px !important;

    background: #ec1c24 !important;
    color: #ffffff !important;

    font-family: Inter, Arial, sans-serif !important;
    font-size: 8px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    box-shadow: 0 0 0 2px #000000 !important;
}


/* ========================================================
   PAINEL DE BUSCA
   ======================================================== */

.header-search {
    position: absolute !important;

    z-index: 200 !important;

    top: 100% !important;
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;

    background: rgba(0, 0, 0, .97) !important;

    border-top: 1px solid #1d2530 !important;
    border-bottom: 1px solid #1d2530 !important;

    opacity: 0 !important;
    visibility: hidden !important;

    transform: translateY(-8px) !important;

    pointer-events: none !important;

    transition:
        opacity .2s ease,
        transform .2s ease,
        visibility .2s ease !important;
}


.header-search.is-open {
    opacity: 1 !important;
    visibility: visible !important;

    transform: translateY(0) !important;

    pointer-events: auto !important;
}


.header-search__inner {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
}


.header-search__form {
    position: relative !important;

    display: grid !important;

    grid-template-columns:
        32px
        minmax(0, 1fr)
        100px
        36px !important;

    align-items: center !important;

    width: 100% !important;
    max-width: 900px !important;

    height: 48px !important;

    margin: 0 auto !important;

    background: #ffffff !important;

    border: 1px solid #d8d8d8 !important;
    border-radius: 4px !important;

    overflow: hidden !important;
}


.header-search__icon {
    width: 19px !important;
    height: 19px !important;

    margin-left: 12px !important;

    fill: none !important;
    stroke: #555555 !important;

    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


.header-search__input {
    width: 100% !important;
    height: 46px !important;

    margin: 0 !important;
    padding: 0 14px !important;

    border: 0 !important;
    outline: 0 !important;

    background: #ffffff !important;
    color: #111111 !important;

    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
}


.header-search__input::placeholder {
    color: #888888 !important;
}


.header-search__submit {
    height: 34px !important;

    margin-right: 5px !important;
    padding: 0 18px !important;

    border: 0 !important;
    border-radius: 3px !important;

    background: linear-gradient(
        180deg,
        #1683ef 0%,
        #0867c8 100%
    ) !important;

    color: #ffffff !important;

    font-family: Inter, Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: 800 !important;

    cursor: pointer !important;
}


.header-search__close {
    width: 36px !important;
    height: 46px !important;

    border: 0 !important;

    background: transparent !important;
    color: #777777 !important;

    font-size: 25px !important;
    line-height: 1 !important;

    cursor: pointer !important;
}


.header-search__close:hover {
    color: #e31b23 !important;
}


/*
   O painel absoluto precisa usar o header como referencia.
*/
.site-header {
    position: relative !important;
}


/* ========================================================
   DESKTOP
   ======================================================== */

@media (min-width: 701px) {

    .nav-actions {
        flex-shrink: 0 !important;
    }

}


/* ========================================================
   MOBILE
   ======================================================== */

@media (max-width: 700px) {

    .nav-actions {
        gap: 7px !important;
        width: auto !important;
    }

    .nav-actions > button,
    .nav-actions > a {
        flex-basis: 27px !important;
        width: 27px !important;
    }

    .nav-actions svg {
        width: 19px !important;
        height: 19px !important;
    }

    .header-search__inner {
        width: calc(100% - 20px) !important;

        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .header-search__form {
        grid-template-columns:
            28px
            minmax(0, 1fr)
            36px !important;

        height: 46px !important;
    }

    .header-search__submit {
        display: none !important;
    }

    .header-search__input {
        font-size: 16px !important;
    }

}


/* ===== NAV ICONS SEARCH END ===== */

/* ===== NAV SCALE TEST START ===== */

/* NAVBAR MAIS VISIVEL */
.main-nav {
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
}

.main-nav .nav-inner {
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;

    grid-template-columns:
        175px
        minmax(0, 1fr)
        160px !important;

    column-gap: 30px !important;
}


/* BOTAO CATEGORIAS */
.category-toggle {
    width: 175px !important;
    height: 42px !important;

    padding: 0 20px !important;

    gap: 11px !important;

    font-size: 15px !important;
    font-weight: 800 !important;
}

.category-toggle span {
    font-size: 22px !important;
}


/* LINKS PRINCIPAIS */
.menu {
    gap: 38px !important;
}

.menu a {
    height: 58px !important;

    font-size: 16px !important;
    font-weight: 800 !important;

    letter-spacing: .2px !important;
}


/* ICONES DIREITA */
.nav-actions {
    width: 160px !important;

    gap: 22px !important;
}

.nav-actions > button,
.nav-actions > a {
    flex: 0 0 34px !important;

    width: 34px !important;
    height: 42px !important;
}


/* lupa */
.search-toggle svg {
    width: 26px !important;
    height: 26px !important;
}


/* avatar */
.account-link svg {
    width: 28px !important;
    height: 28px !important;
}


/* carrinho */
.cart-link svg {
    width: 29px !important;
    height: 29px !important;
}


/* badge carrinho */
.cart-count {
    top: -2px !important;
    right: -4px !important;

    min-width: 18px !important;
    height: 18px !important;

    padding: 0 5px !important;

    font-size: 10px !important;
}


/* NOTEBOOK */
@media (max-width: 1250px) {

    .main-nav .nav-inner {
        grid-template-columns:
            165px
            minmax(0, 1fr)
            145px !important;

        column-gap: 22px !important;
    }

    .category-toggle {
        width: 165px !important;
        font-size: 14px !important;
    }

    .menu {
        gap: 28px !important;
    }

    .menu a {
        font-size: 14px !important;
    }

    .nav-actions {
        width: 145px !important;
        gap: 17px !important;
    }

    .search-toggle svg {
        width: 24px !important;
        height: 24px !important;
    }

    .account-link svg {
        width: 26px !important;
        height: 26px !important;
    }

    .cart-link svg {
        width: 27px !important;
        height: 27px !important;
    }
}


/* MOBILE PRESERVADO */
@media (max-width: 700px) {

    .main-nav,
    .main-nav .nav-inner {
        height: 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
    }

    .category-toggle {
        width: auto !important;
        height: 38px !important;
        font-size: 13px !important;
    }

    .nav-actions {
        width: auto !important;
        gap: 8px !important;
    }

    .nav-actions > button,
    .nav-actions > a {
        width: 29px !important;
        flex-basis: 29px !important;
    }

    .search-toggle svg,
    .account-link svg,
    .cart-link svg {
        width: 21px !important;
        height: 21px !important;
    }
}

/* ===== NAV SCALE TEST END ===== */

/* ===== NAV SCALE REFINADO START ===== */

/* navbar um pouco mais alta */
.main-nav {
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
}

.main-nav .nav-inner {
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;

    grid-template-columns:
        185px
        minmax(0, 1fr)
        175px !important;

    column-gap: 34px !important;
}


/* BOTAO CATEGORIAS */
.category-toggle {
    width: 185px !important;
    height: 44px !important;

    padding: 0 22px !important;

    gap: 12px !important;

    font-size: 18px !important;
    font-weight: 200 !important;
}

.category-toggle span {
    font-size: 25px !important;
    font-weight: 200 !important;
}


/* LINKS */
.menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 46px !important;
}

.menu a {
    height: 62px !important;

    font-size: 19px !important;
    font-weight: 200 !important;

    letter-spacing: .35px !important;

    line-height: 1 !important;
}


/* garante uniformidade visual */
.menu a.active {
    font-weight: 200 !important;
}


/* ICONES */
.nav-actions {
    width: 175px !important;

    gap: 26px !important;
}

.nav-actions > button,
.nav-actions > a {
    flex: 0 0 38px !important;

    width: 38px !important;
    height: 46px !important;
}


/* lupa */
.search-toggle svg {
    width: 30px !important;
    height: 30px !important;

    stroke-width: 1.5 !important;
}


/* avatar */
.account-link svg {
    width: 32px !important;
    height: 32px !important;

    stroke-width: 1.5 !important;
}


/* carrinho */
.cart-link svg {
    width: 33px !important;
    height: 33px !important;

    stroke-width: 1.5 !important;
}


/* badge */
.cart-count {
    top: -1px !important;
    right: -4px !important;

    min-width: 19px !important;
    height: 19px !important;

    font-size: 10px !important;
    font-weight: 600 !important;
}


/* NOTEBOOK */
@media (max-width: 1350px) {

    .main-nav .nav-inner {
        grid-template-columns:
            175px
            minmax(0, 1fr)
            160px !important;

        column-gap: 26px !important;
    }

    .category-toggle {
        width: 175px !important;
        font-size: 16px !important;
    }

    .menu {
        gap: 34px !important;
    }

    .menu a {
        font-size: 17px !important;
        font-weight: 200 !important;
    }

    .nav-actions {
        width: 160px !important;
        gap: 20px !important;
    }

    .search-toggle svg {
        width: 27px !important;
        height: 27px !important;
    }

    .account-link svg {
        width: 29px !important;
        height: 29px !important;
    }

    .cart-link svg {
        width: 30px !important;
        height: 30px !important;
    }
}


/* MOBILE */
@media (max-width: 700px) {

    .main-nav,
    .main-nav .nav-inner {
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
    }

    .category-toggle {
        width: auto !important;
        height: 40px !important;

        font-size: 14px !important;
        font-weight: 300 !important;
    }

    .nav-actions {
        width: auto !important;
        gap: 9px !important;
    }

    .nav-actions > button,
    .nav-actions > a {
        width: 31px !important;
        flex-basis: 31px !important;
    }

    .search-toggle svg,
    .account-link svg,
    .cart-link svg {
        width: 23px !important;
        height: 23px !important;
    }
}

/* ===== NAV SCALE REFINADO END ===== */

/* ===== TOPBAR CONTATOS LENDARIOS START ===== */


/* lado esquerdo */
.topbar-delivery {
    display: flex !important;
    align-items: center !important;

    gap: 14px !important;

    min-width: 270px !important;

    color: #ffffff !important;
}


.topbar-delivery__icon {
    flex: 0 0 40px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


.topbar-delivery__icon svg {
    display: block !important;

    width: 38px !important;
    height: 30px !important;

    fill: none !important;

    stroke: #ed1c24 !important;
    stroke-width: 2.1 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;

    filter: drop-shadow(0 0 4px rgba(237,28,36,.28)) !important;
}


.topbar-delivery__text {
    display: flex !important;
    flex-direction: column !important;

    justify-content: center !important;

    gap: 3px !important;

    line-height: 1 !important;
}


.topbar-delivery__text small {
    color: #b8b8b8 !important;

    font-family: "Barlow Condensed", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;

    letter-spacing: .25px !important;
}


.topbar-delivery__text strong {
    color: #ffffff !important;

    font-family: "Barlow Condensed", Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;

    letter-spacing: .25px !important;
}


/* lado direito */
.topbar-contact {
    justify-self: end !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: flex-start !important;
    justify-content: center !important;

    gap: 10px !important;

    min-width: 315px !important;

    margin: 0 !important;
    padding: 0 !important;
}


.topbar-contact__row {
    display: flex !important;
    align-items: center !important;

    gap: 10px !important;

    color: #ffffff !important;

    font-family: Inter, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;

    line-height: 1.1 !important;

    white-space: nowrap !important;

    transition:
        color .18s ease,
        opacity .18s ease !important;
}


.topbar-contact__row:hover {
    color: #e31b23 !important;
}


.topbar-contact__icon {
    flex: 0 0 22px !important;

    width: 22px !important;
    height: 22px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}


.topbar-contact__icon svg {
    display: block !important;

    width: 20px !important;
    height: 20px !important;

    fill: none !important;

    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


.topbar-contact__icon--whatsapp svg {
    width: 22px !important;
    height: 22px !important;

    stroke-width: 1.65 !important;
}


/* desktop */
@media (min-width: 981px) {

    .topbar {
        grid-template-columns:
            minmax(300px, 1fr)
            auto
            minmax(330px, 1fr) !important;

        column-gap: 30px !important;
    }

}


/* tablet */
@media (max-width: 1100px) and (min-width: 701px) {

    .topbar-delivery {
        min-width: 230px !important;
    }

    .topbar-delivery__text small {
        font-size: 10px !important;
    }

    .topbar-delivery__text strong {
        font-size: 14px !important;
    }

    .topbar-contact {
        min-width: 250px !important;
    }

    .topbar-contact__row {
        font-size: 11px !important;
    }

}


/* mobile */
@media (max-width: 700px) {

    .topbar-delivery,
    .topbar-contact {
        display: none !important;
    }

}


/* ===== TOPBAR CONTATOS LENDARIOS END ===== */

/* ===== TOPBAR REFINO V2 START ===== */


/* ======================================================
   DISTRIBUICAO GERAL
   Mais distancia entre logo e blocos laterais
   ====================================================== */

@media (min-width: 1101px) {

    .topbar {
        grid-template-columns:
            minmax(330px, 1fr)
            auto
            minmax(330px, 1fr) !important;

        column-gap: 80px !important;
    }

}


/* ======================================================
   ESQUERDA - ENTREGA
   Icone em cima + texto embaixo
   ====================================================== */

.topbar-delivery {
    justify-self: start !important;

    min-width: 290px !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: flex-start !important;
    justify-content: center !important;

    gap: 8px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* caminhão */
.topbar-delivery__icon {
    width: 42px !important;
    height: 30px !important;

    flex: 0 0 auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    margin: 0 !important;
}


/*
   Caminhao vermelho CHAPADO.
   Preenche as formas do SVG existente.
*/
.topbar-delivery__icon svg {
    width: 40px !important;
    height: 30px !important;

    display: block !important;

    fill: #ed1c24 !important;
    stroke: #ed1c24 !important;
    stroke-width: 1.4 !important;

    filter:
        drop-shadow(0 0 3px rgba(237, 28, 36, .25))
        !important;
}

.topbar-delivery__icon svg path {
    fill: #ed1c24 !important;
    stroke: #ed1c24 !important;
}

.topbar-delivery__icon svg circle {
    fill: #ed1c24 !important;
    stroke: #ed1c24 !important;
}


/* texto abaixo do caminhão */
.topbar-delivery__text {
    display: flex !important;
    flex-direction: column !important;

    align-items: flex-start !important;

    gap: 4px !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 1 !important;
}


.topbar-delivery__text small {
    font-size: 13.5px !important;
    font-weight: 400 !important;

    letter-spacing: .25px !important;

    color: #c7c7c7 !important;
}


.topbar-delivery__text strong {
    font-size: 17.5px !important;
    font-weight: 500 !important;

    letter-spacing: .2px !important;

    color: #ffffff !important;
}


/* ======================================================
   DIREITA - CONTATOS
   Mais afastado da logo e alinhado visualmente
   ====================================================== */

.topbar-contact {
    justify-self: end !important;

    min-width: 365px !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: flex-start !important;
    justify-content: center !important;

    gap: 13px !important;

    margin: 0 !important;
    padding: 0 !important;

    /*
       pequeno deslocamento para aproximar o eixo
       dos contatos ao eixo dos icones da navbar
    */
    transform: translateX(25px) !important;
}


/* email e whatsapp */
.topbar-contact__row {
    display: flex !important;

    align-items: center !important;

    gap: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #ffffff !important;

    font-size: 14.5px !important;
    font-weight: 400 !important;

    line-height: 1.15 !important;

    letter-spacing: .1px !important;

    white-space: nowrap !important;
}


/* Icones email / WhatsApp */
.topbar-contact__icon {
    flex: 0 0 25px !important;

    width: 25px !important;
    height: 25px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    color: #ffffff !important;
}


.topbar-contact__icon svg {
    display: block !important;

    width: 23px !important;
    height: 23px !important;

    fill: none !important;

    stroke: #ffffff !important;
    stroke-width: 1.7 !important;

    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


.topbar-contact__icon--whatsapp svg {
    width: 25px !important;
    height: 25px !important;

    stroke-width: 1.6 !important;
}


/* hover discreto */
.topbar-contact__row:hover {
    color: #ffffff !important;
    opacity: .82 !important;
}


/* ======================================================
   TELAS INTERMEDIARIAS
   ====================================================== */

@media (max-width: 1300px) and (min-width: 701px) {

    .topbar {
        column-gap: 40px !important;
    }

    .topbar-delivery {
        min-width: 240px !important;
    }

    .topbar-contact {
        min-width: 300px !important;
        transform: none !important;
    }

    .topbar-contact__row {
        font-size: 13px !important;
    }

}


/* MOBILE continua limpo */
@media (max-width: 700px) {

    .topbar-delivery,
    .topbar-contact {
        display: none !important;
    }

}


/* ===== TOPBAR REFINO V2 END ===== */

/* ===== TOPBAR CENTER FIX START ===== */


/* ======================================================
   TOPBAR COM LOGO CENTRALIZADA NA VIEWPORT
   ====================================================== */

.topbar {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: min(1180px, calc(100% - 40px)) !important;

    margin: 0 auto !important;

    padding: 0 !important;
}


/* ======================================================
   LOGO - CENTRO EXATO DA PAGINA
   ====================================================== */

.site-logo {
    position: absolute !important;

    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    margin: 0 !important;

    z-index: 5 !important;
}


.site-logo img {
    display: block !important;

    width: auto !important;
    height: 400px !important;

    max-width: none !important;
    max-height: 400px !important;

    object-fit: contain !important;

    transform: none !important;
}


/* ======================================================
   BLOCO ESQUERDO
   ====================================================== */

.topbar-delivery {
    position: relative !important;

    z-index: 10 !important;

    margin-right: auto !important;

    flex: 0 0 auto !important;
}


/* ======================================================
   BLOCO DIREITO - O MAIS PARA DIREITA POSSIVEL
   ====================================================== */

.topbar-contact {
    position: relative !important;

    z-index: 10 !important;

    margin-left: auto !important;
    margin-right: 0 !important;

    padding-right: 0 !important;

    transform: translateX(0) !important;

    flex: 0 0 auto !important;

    align-items: flex-start !important;
}


/* empurra visualmente para o limite direito do shell */
@media (min-width: 1200px) {

    .topbar-contact {
        margin-right: -20px !important;
    }

}


/* ======================================================
   RESPONSIVO
   ====================================================== */

@media (max-width: 1100px) and (min-width: 701px) {

    .topbar {
        width: calc(100% - 24px) !important;
    }

    .site-logo img {
        height: 320px !important;
        max-height: 320px !important;
    }

    .topbar-contact {
        margin-right: 0 !important;
    }

}


@media (max-width: 700px) {

    .topbar {
        justify-content: center !important;
    }

    .site-logo {
        position: relative !important;

        left: auto !important;
        top: auto !important;

        transform: none !important;
    }

    .site-logo img {
        height: 120px !important;
        max-height: 120px !important;
    }

}


/* ===== TOPBAR CENTER FIX END ===== */




/* ===== CONTACT MOVE 100PX START ===== */

/* SOMENTE email + WhatsApp: 100px para direita */
@media (min-width: 701px) {
    .topbar-contact {
        transform: translateX(100px) !important;
    }
}

/* ===== CONTACT MOVE 100PX END ===== */



/* ===== CONTACT FOREGROUND 150PX START ===== */

@media (min-width: 701px) {

    /*
       SOMENTE bloco email + WhatsApp
       Total: 150px para direita
    */
    .topbar-contact {
        position: relative !important;
        transform: translateX(150px) !important;

        /* primeiro plano */
        z-index: 9999 !important;

        isolation: isolate !important;

        overflow: visible !important;
    }


    /*
       Mantem icones e textos acima dos demais
       elementos visuais do header.
    */
    .topbar-contact__row {
        position: relative !important;
        z-index: 10000 !important;

        opacity: 1 !important;
        visibility: visible !important;

        overflow: visible !important;
    }


    .topbar-contact__row span {
        position: relative !important;
        z-index: 10001 !important;
    }


    .topbar-contact__icon,
    .topbar-contact__icon svg {
        position: relative !important;
        z-index: 10002 !important;
    }
}

/* ===== CONTACT FOREGROUND 150PX END ===== */

/* ===== CONTACT NO CLIP START ===== */

/*
   O problema aqui nao e apenas z-index.
   Nenhum ancestral do contato pode cortar o email.
*/

.site-header,
.topbar,
.topbar-contact,
.topbar-contact__row {
    overflow: visible !important;
}


/* Mantem exatamente o deslocamento atual */
@media (min-width: 701px) {

    .topbar-contact {
        position: relative !important;

        transform: translateX(150px) !important;

        /*
           Largura suficiente para o email inteiro.
           Nao deixa o flex/grid comprimir o bloco.
        */
        width: 390px !important;
        min-width: 390px !important;
        max-width: none !important;

        flex: 0 0 390px !important;
        flex-shrink: 0 !important;

        z-index: 999999 !important;

        overflow: visible !important;
    }


    .topbar-contact__row {
        position: relative !important;

        width: max-content !important;
        min-width: max-content !important;
        max-width: none !important;

        flex: none !important;
        flex-shrink: 0 !important;

        white-space: nowrap !important;

        overflow: visible !important;
        text-overflow: clip !important;

        z-index: 1000000 !important;

        opacity: 1 !important;
        visibility: visible !important;
    }


    .topbar-contact__row > span:last-child {
        position: relative !important;

        display: inline-block !important;

        width: max-content !important;
        min-width: max-content !important;
        max-width: none !important;

        white-space: nowrap !important;

        overflow: visible !important;
        text-overflow: clip !important;

        z-index: 1000001 !important;
    }


    .topbar-contact__icon {
        position: relative !important;

        flex: 0 0 25px !important;

        overflow: visible !important;

        z-index: 1000002 !important;
    }


    /*
       A logo permanece centralizada, mas em uma camada
       inferior aos contatos.
    */
    .site-logo {
        z-index: 5 !important;
    }

}


/* ===== CONTACT NO CLIP END ===== */

/* ===== FOOTER INSTITUTIONAL BANNER START ===== */

.footer-institutional-banner {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    background: #000000 !important;

    overflow: hidden !important;
}

.footer-institutional-banner__inner {
    width: min(1180px, calc(100% - 40px)) !important;

    margin: 0 auto !important;
    padding: 0 !important;

    line-height: 0 !important;

    background: #000000 !important;
}

.footer-institutional-banner img {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;

    border: 0 !important;
}


@media (max-width: 700px) {

    .footer-institutional-banner__inner {
        width: calc(100% - 20px) !important;
    }

}

/* ===== FOOTER INSTITUTIONAL BANNER END ===== */

/* ===== PUBLIC FOOTER START ===== */

.footer {
    width: 100%;
    max-width: none;
    color: #d7d7d7;
    padding: 54px 0 18px;
    background:
        radial-gradient(circle at right, rgba(120, 0, 0, .45), transparent 45%),
        radial-gradient(circle at 5% 100%, rgba(87, 0, 0, .28), transparent 35%),
        linear-gradient(135deg, #050505 0%, #0b0505 48%, #350707 100%);
}

.footer-grid {
    width: calc(100% - 80px);
    max-width: none;
    margin: 0 auto;
    display: grid;
    grid-template-columns:
        260px
        minmax(220px, 260px)
        minmax(220px, 260px)
        minmax(420px, 1fr);
    column-gap: clamp(55px, 5vw, 100px);
    align-items: start;
}

.footer-brand > a {
    display: inline-block;
}

.footer-brand img {
    display: block;
    width: 190px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    object-position: left center;
}

.footer .footer-brand p {
    margin: 18px 0 0;
    color: #f0f0f0;
    font-size: 15px;
    line-height: 1.6;
}

.footer h3 {
    position: relative;
    width: fit-content;
    margin: 8px 0 24px;
    padding-bottom: 10px;
    color: #fff;
    font: 600 19px/1.3 'Barlow Condensed', sans-serif;
    letter-spacing: .4px;
}

.footer h3::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 34px;
    height: 2px;
    background: #ed1c24;
    box-shadow: 0 0 8px rgba(237, 28, 36, .55);
}

.footer .footer-column > a {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 9px;
    color: #d7d7d7;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.45;
    overflow-wrap: anywhere;
    transition: color .2s ease;
}

.footer .footer-column > a:hover,
.footer .footer-column > a:focus-visible {
    color: #ed1c24;
}

.footer-contact svg {
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    margin-top: 2px;
    fill: #fff;
}

.footer-contact {
    min-width: 420px;
}

.footer .footer-contact > a,
.footer .footer-contact .location {
    white-space: nowrap;
    overflow: visible;
    word-break: normal;
    overflow-wrap: normal;
}

.footer .location {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 17px 0 0;
    color: #fff;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.45;
}

.copyright {
    width: calc(100% - 80px);
    max-width: none;
    margin-right: auto;
    margin-left: auto;
    margin-top: 38px;
    padding-top: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    border-top: 1px solid rgba(255, 255, 255, .13);
    color: #aaa;
    font-size: 12px;
    line-height: 1.5;
}

.copyright > span,
.copyright a {
    white-space: nowrap;
}

.copyright a:hover,
.copyright a:focus-visible {
    color: #fff;
}

@media (max-width: 1280px) {
    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 42px 54px;
    }

    .footer-contact {
        min-width: 0;
    }

    .copyright {
        align-items: flex-start;
    }
}

@media (max-width: 700px) {
    .footer {
        padding-top: 42px;
    }

    .footer-grid {
        width: calc(100% - 24px);
        grid-template-columns: minmax(0, 1fr);
        gap: 34px;
    }

    .footer-grid > div:first-child {
        grid-column: auto;
    }

    .footer-brand {
        text-align: center;
    }

    .footer-brand > a {
        display: flex;
        justify-content: center;
    }

    .footer .footer-contact > a,
    .footer .footer-contact .location,
    .copyright > span,
    .copyright a {
        white-space: normal;
    }

    .copyright {
        width: calc(100% - 24px);
        margin-top: 32px;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        text-align: center;
    }
}

/* ===== PUBLIC FOOTER END ===== */

/* ===== FOOTER LOGO HARD FIX START ===== */

/*
   Trava absoluta da logo do footer.
   Evita heranca de width:100%, grid, flex ou regras antigas.
*/

.footer .footer-brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;

    overflow: visible !important;
}


.footer .footer-brand > a {
    display: block !important;

    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 0 16px 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}


.footer .footer-brand > a > img {
    display: block !important;

    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: left center !important;

    transform: none !important;
    scale: 1 !important;

    position: static !important;
}


.footer .footer-brand .footer-slogan {
    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;

    margin: 0 !important;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    text-align: center !important;
    white-space: normal !important;
}

.footer .footer-brand .footer-slogan strong {
    color: #ed1c24;
    font-weight: 700;
}


/* tablet */
@media (max-width: 980px) {

    .footer .footer-brand,
    .footer .footer-brand .footer-slogan {
        width: 210px !important;
        min-width: 210px !important;
        max-width: 210px !important;
    }

    .footer .footer-brand > a,
    .footer .footer-brand > a > img {
        width: 210px !important;
        min-width: 210px !important;
        max-width: 210px !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
}


/* mobile */
@media (max-width: 700px) {

    .footer .footer-brand {
        align-items: center !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .footer .footer-brand > a,
    .footer .footer-brand > a > img {
        width: 180px !important;
        min-width: 180px !important;
        max-width: 180px !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .footer .footer-brand > a > img {
        object-position: center center !important;
    }

    .footer .footer-brand .footer-slogan {
        width: 180px !important;
        min-width: 180px !important;
        max-width: 180px !important;

        text-align: center !important;
    }
}

/* ===== FOOTER LOGO HARD FIX END ===== */

/* ===== FOOTER COLUMNS CLOSER START ===== */

/*
   Aproxima SOMENTE as colunas no desktop.
   Mantem logo, slogan, tipografia e contatos como estao.
*/

@media (min-width: 981px) {

    .footer-grid {
        display: grid !important;

        grid-template-columns:
            260px
            260px
            260px
            minmax(420px, 1fr) !important;

        column-gap: 28px !important;

        justify-content: start !important;
        align-items: start !important;
    }

}

/* ===== FOOTER COLUMNS CLOSER END ===== */



/* ===== FOOTER BLOCO CENTRALIZADO ===== */
@media (min-width: 981px) {

    .footer-grid {
        width: fit-content !important;
        max-width: calc(100% - 80px) !important;

        margin-left: auto !important;
        margin-right: auto !important;

        grid-template-columns:
            260px
            260px
            260px
            minmax(420px, 420px) !important;

        column-gap: 28px !important;

        justify-content: center !important;
        align-items: start !important;
    }

}
/* ===== FOOTER BLOCO CENTRALIZADO END ===== */


/* ===== FOOTER CENTRALIZACAO DEFINITIVA ===== */

@media (min-width: 981px) {

    .footer-grid {
        width: 1264px !important;
        max-width: calc(100vw - 80px) !important;

        grid-template-columns:
            260px
            260px
            260px
            400px !important;

        column-gap: 28px !important;

        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        justify-content: start !important;
        align-items: start !important;
    }

}

/* ===== FOOTER CENTRALIZACAO DEFINITIVA END ===== */

/* ===== FOOTER GRID CENTER REAL FIX ===== */

@media (min-width: 981px) {

    .footer-grid {
        /* container continua ocupando a largura do footer */
        width: calc(100% - 80px) !important;
        max-width: none !important;

        margin-left: auto !important;
        margin-right: auto !important;

        /* remove os deslocamentos anteriores */
        position: relative !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;

        /* mantem exatamente as larguras atuais */
        grid-template-columns:
            260px
            260px
            260px
            400px !important;

        column-gap: 28px !important;

        /*
         * ESTE E O PONTO PRINCIPAL:
         * centraliza o conjunto das quatro colunas
         * dentro do footer
         */
        justify-content: center !important;

        justify-items: start !important;
        align-items: start !important;
    }

}

/* ===== FOOTER GRID CENTER REAL FIX END ===== */

/* ===== FOOTER CONTACT FONT HARD FIX START ===== */

.footer .footer-contact > a,
.footer .footer-contact > p.location {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;

    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;

    color: #ffffff !important;

    white-space: nowrap !important;
}

.footer .footer-contact > a > span,
.footer .footer-contact > p.location > span {
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;

    color: #ffffff !important;

    white-space: nowrap !important;
}

.footer .footer-contact > a svg,
.footer .footer-contact > p.location svg {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;

    flex: 0 0 20px !important;

    fill: currentColor !important;
}

/* email explicitamente branco e inteiro */
.footer .footer-contact a[href^="mailto:"] {
    color: #ffffff !important;
    font-size: 17px !important;
    white-space: nowrap !important;
}

.footer .footer-contact a[href^="mailto:"] span {
    color: #ffffff !important;
    font-size: 17px !important;
    white-space: nowrap !important;
}

/* ===== FOOTER CONTACT FONT HARD FIX END ===== */



/* ===== COPYRIGHT MAIS JUNTO ===== */

@media (min-width: 981px) {

    .copyright {
        width: fit-content !important;
        max-width: calc(100% - 80px) !important;

        margin-left: auto !important;
        margin-right: auto !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        gap: 120px !important;
    }

    .copyright > span:first-child,
    .copyright > span:last-child {
        margin: 0 !important;
        text-align: left !important;
    }

}

/* ===== COPYRIGHT MAIS JUNTO END ===== */


/* ===== FOOTER BACKGROUND FINAL ===== */

.footer {
    background: linear-gradient(
        90deg,
        #000000 0%,
        #000000 50%,
        #000000 60%,
        #180000 70%,
        #300000 82%,
        #4a0000 92%,
        #600000 100%
    ) !important;

    background-color: #000000 !important;
}

/* Nao permitir overlays alterando a cor do fundo */
.footer::before,
.footer::after {
    content: none !important;
    display: none !important;
}

/* Elementos estruturais internos sem fundo */
.footer-grid,
.footer-brand,
.footer-column,
.footer-contact {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* Combo banner: keep this as the single authoritative implementation. */
@media (min-width: 701px) {
    .promo-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 14px !important;
        align-items: stretch !important;
    }

    .combo-banner {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        overflow: hidden !important;
    }

    .combo-banner img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    .promo--community {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100% !important;
    }
}

@media (max-width: 700px) {
    .promo-grid {
        grid-template-columns: 1fr !important;
    }

    .combo-banner,
    .combo-banner img,
    .promo--community {
        width: 100% !important;
        height: auto !important;
    }
}