:root{
  --cream:#fff1f1;
  --red:#e21b1b;
  --blue:#0646ff;
  --yellow:#ffd900;
  --black:#050505;
  --white:#fff;
  --text:#090909;
  --site-max:900px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',Arial,sans-serif;background:var(--cream);color:var(--text);overflow-x:hidden}
a{text-decoration:none;color:inherit}
button{font-family:inherit;cursor:pointer}
main{max-width:900px;margin:auto;border:4px solid var(--black);background:#fff}
.container{width:min(var(--site-max),94%);margin:auto}

.hero{position:relative;padding:24px 0 86px;background:#0c47be;overflow:hidden}
.hero-bg{position:absolute;inset:auto -10% -58px -10%;height:106px;background:var(--red);border-top:8px solid var(--black)}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;gap:24px;align-items:center}
.hero-left {
    display: grid;
    grid-template-columns: 1fr 118px;
    gap: 20px;
    align-items: center;
}

.hero-left img {
    order: 2;
}

.hero-left > :nth-child(2) {
    order: 1;
}
.logo-sst{width:118px;max-width:100%;filter:drop-shadow(0 7px 9px rgba(0,0,0,.13));}
.hero-text h1{color:#fff;font-size:20px;line-height:1.08;font-weight:900;max-width:620px;letter-spacing:-.045em}
.hero-text h2{margin-top:18px;font-size:17px;line-height:1.05;color:var(--yellow);letter-spacing:-.045em}
.hero-right{display:flex;flex-direction:column;align-items:flex-end;gap:18px}
.lang-switch{width:min(420px,100%);display:grid;grid-template-columns:repeat(4,1fr);border:2px solid #222;border-radius:14px;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);overflow:hidden;box-shadow:0 8px 20px rgba(0,0,0,.08)}
.lang-btn{border:0;background:transparent;padding:13px 8px;font-size:.92rem;font-weight:900;color:#111;transition:.25s}
.lang-btn:hover,.lang-btn.active{background:#111;color:#fff}
.contact-actions{width:min(420px,100%);display:grid;grid-template-columns:1fr 1fr;gap:14px}
.btn{min-height:56px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:clamp(.92rem,1.22vw,1.16rem);font-weight:900;transition:.25s;box-shadow:7px 7px 0 rgba(0,0,0,.12);text-align:center;padding:8px 14px}
.btn:hover{transform:translate(-3px,-3px);box-shadow:11px 11px 0 rgba(0,0,0,.2)}
.btn-whatsapp{background:#00ff00;color:#fff;border-radius:9999px}.btn-whatsapp i{font-size:1.7em;margin-right:2px}
.btn-email{background:#fff;color:#2c2222; border-radius: 50px;}

.carousel-section{position:relative;background:var(--red);border-bottom:8px solid var(--black);padding:0 0 34px;margin-top:-54px}
.carousel-wrap{position:relative;z-index:5;padding-top:0}
.carousel-viewport{overflow:hidden;padding:0 5px 18px}
.carousel-track{display:flex;gap:16px;transition:transform .45s cubic-bezier(.22,.61,.36,1);will-change:transform}
.card{flex:0 0 calc((100% - 32px)/3);min-height:158px;border:7px solid var(--black);display:flex;flex-direction:column;justify-content:center;padding:26px 22px;box-shadow:0 9px 0 rgba(0,0,0,.16);position:relative;overflow:hidden;transition:.28s;color:#fff}
.card:after{content:"";position:absolute;right:-28px;top:-28px;width:90px;height:90px;border-left:7px solid var(--black);border-bottom:7px solid var(--black);background:rgba(255,255,255,.18);transform:rotate(8deg);transition:.25s}
.card:hover{transform:translateY(-8px) scale(1.015);box-shadow:0 17px 0 rgba(0,0,0,.19)}
.card-number{font-size:clamp(2rem,2.7vw,2.9rem);font-weight:900;letter-spacing:-.06em;position:relative;z-index:1}
.card-title{margin-top:10px;font-size:clamp(.96rem,1.18vw,1.18rem);line-height:1.08;font-weight:900;position:relative;z-index:1}

/* 15 cores distintas: mantêm as anteriores e ampliam a paleta sem repetição */
.card-blue{background:#0646ff}
.card-yellow{background:#ffd900;color:#111}
.card-red{background:#fff; color: #111;}
.card-orange{background:#ef6c00}
.card-green{background:#2e7d32}
.card-green-light{background:#78a94f}
.card-green-dark{background:#be0988}
.card-green-wood{background:#526b43}
.card-blue-light{background:#4f9bd8}
.card-blue-sky{background:#1976b9}
.card-blue-steel{background:#3f647e}
.card-blue-navy{background:#173f73}
.card-brown{background:#795548}
.card-gray{background:#8b8b8b; color: #000;}
.card-teal{background:#1babff}
.card-yellow:after{background:rgba(0,0,0,.06)}

.carousel-controls{display:flex;justify-content:flex-end;gap:16px;padding-right:14px;margin-top:2px}
.arrow{width:48px;height:48px;border:3px solid var(--black);background:#fff;color:#111;font-size:1.35rem;transition:.2s;border-radius:999px;box-shadow:5px 5px 0 rgba(0,0,0,.15)}
.arrow:hover{background:var(--yellow);transform:translateY(-3px)}

.qr-section{background:#fff;padding:22px;border-bottom:7px solid #000;display:flex;justify-content:center}
.qr-card{width:min(260px,72%);background:#0c47be;border:6px solid #000;padding:8px;box-shadow:10px 10px 0 rgba(0,0,0,.16);transition:.28s}
.qr-card:hover{transform:translateY(-5px) rotate(-.4deg);box-shadow:14px 14px 0 rgba(0,0,0,.2)}
.qr-card img{display:block;width:100%;height:auto}

.footer{background:#000}
.security-block{background:#fff;padding:18px;border-top:0;border-bottom:7px solid #000; display: flex;}
.security-banner{border:4px solid #000;background:#00689f;max-width:500px;margin:auto;padding:10px;color:#fff;font-weight:900;text-align:center}
.footer-contact{background:var(--yellow);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:16px 12px;font-weight:900;color:#040404;border-bottom:7px solid #000}
.footer-contact h3{font-size:clamp(.95rem,1.25vw,1.15rem)}
.footer-contact p{font-size:clamp(.9rem,1.25vw,1.12rem);line-height:1.08;max-width:320px;word-break:break-word}
.footer-logos{
    background:#fff;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:13px 22px;
}

.footer-logos-left{
    display:flex;
    align-items:center;
    gap:28px;
}

.footer-logos img{
    max-width:100%;
    height:auto;
}

/* Responsivo */
@media (max-width:768px){

    .footer-logos{
        flex-direction:column;
        gap:20px;
        padding:20px;
    }

    .footer-logos-left{
        justify-content:center;
        gap:20px;
        flex-wrap:wrap;
    }

    .footer-logos > img:last-child{
        order:-1; /* coloca a primeira logo (que está sozinha) acima */
        max-width:180px;
    }

    .footer-logos-left img{
        max-width:120px;
    }
}
.footer-oma{display:block;max-width:430px;width:52%;height:auto}
.footer-vinci{display:block;max-width:250px;width:31%;height:auto} /* Powered by VINCI menor */

@media (max-width:860px){
  .hero{padding-bottom:100px}.hero-grid{grid-template-columns:1fr;gap:26px}.hero-right{align-items:stretch}.contact-actions,.lang-switch{width:100%}
}
@media (max-width:780px){
  .hero{padding:22px 0 92px}.hero-left{grid-template-columns:100px 1fr;gap:18px}.logo-sst{width:100px}.contact-actions{grid-template-columns:1fr}.carousel-section{margin-top:-48px}.card{flex-basis:calc((100% - 18px)/2);min-height:150px}.footer-logos{gap:14px;padding:12px}.footer-vinci{width:34%}

}
@media (max-width:520px){
  .container{width:min(100% - 24px,var(--site-max))}.hero-left{grid-template-columns:1fr;text-align:center;justify-items:center}.hero-right{gap:16px}.lang-switch{grid-template-columns:repeat(2,1fr)}.lang-btn{padding:12px 8px}.btn{min-height:54px;border-width:4px}.carousel-track{gap:12px}.card{flex-basis:100%;min-height:146px;border-width:6px;padding:24px 22px}.carousel-controls{justify-content:center;padding-right:0}.qr-card{width:min(250px,88%)}.footer-logos{flex-direction:column}.footer-oma{width:92%;max-width:430px}.footer-vinci{width:58%;max-width:230px}
}

/* Nota de retorno - área vermelha abaixo dos cards, ao lado das setas */
.carousel-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 14px;margin-top:2px}
.carousel-note{flex:1;color:#fff;font-weight:800;font-style:italic;line-height:1.45;font-size:.92rem}
.carousel-bottom .carousel-controls{flex:0 0 auto;padding-right:0;margin-top:0}
@media (max-width:520px){.carousel-bottom{flex-direction:column;align-items:stretch}.carousel-note{text-align:center}.carousel-bottom .carousel-controls{justify-content:center}}
