:root {
    --primary:#123E7C;
    --primary-soft:#2b5aa8;
    --gold:#d4a94a;
    --gold-2:#b88a2f;
    --gold-fg:#2a1e05;
    --bg:#ffffff;
    --fg:#111827;
    --muted:#6b7280;
    --muted-bg:#f3f4f6;
    --secondary:#f4f6fb;
    --border:#e5e7eb;
    --card:#ffffff;
    --whatsapp:#25D366;
    --shadow-soft:0 4px 20px -6px rgba(18,62,124,.14);
    --shadow-elev:0 20px 50px -20px rgba(18,62,124,.35);
    --shadow-gold:0 10px 30px -12px rgba(212,169,74,.55);
    --grad-primary:linear-gradient(135deg,#123E7C 0%,#2b5aa8 100%);
    --grad-gold:linear-gradient(135deg,#e2b955 0%,#b88a2f 100%);
    --grad-hero:linear-gradient(135deg,#0f2f5e 0%,#1a4a8a 100%);
    --ease:cubic-bezier(.22,1,.36,1);
}

* {
    box-sizing:border-box;
    margin:0;
    padding:0
}

html {
    scroll-behavior:smooth;
    -webkit-text-size-adjust:100%
}

body {
    font-family:"Inter",system-ui,sans-serif;
    color:var(--fg);
    background:var(--bg);
    line-height:1.55;
    -webkit-font-smoothing:antialiased
}

img {
    max-width:100%;
    display:block
}

a {
    color:inherit;
    text-decoration:none
}

h1,h2,h3,h4 {
    font-family:"Poppins","Inter",sans-serif;
    letter-spacing:-.02em;
    color:var(--fg);
    line-height:1.15
}

h2 {
    font-size:clamp(1.8rem,3vw,2.75rem);
    font-weight:700
}

h3 {
    font-size:1.25rem;
    font-weight:600
}

h4 {
    font-size:.85rem;
    text-transform:uppercase;
    letter-spacing:.15em;
    color:var(--gold)
}

p {
    color:var(--muted)
}

.container {
    max-width:1200px;
    margin:0 auto;
    padding:0 20px
}

@media(min-width:768px) {
.container {
        padding:0 32px
}

}

.section {
    padding:5rem 0
}

@media(min-width:768px) {
.section {
        padding:7rem 0
}

}

.bg-secondary {
    background:var(--secondary)
}

.bg-light {
    background:#eef2f9
}

.section-head {
    max-width:640px
}

.section-head.center {
    margin:0 auto;
    text-align:center
}

.section-head p {
    margin-top:1rem;
    font-size:1.05rem
}

.eyebrow {
    font-size:.72rem;
    font-weight:600;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:var(--primary-soft)
}

.section-head h2 {
    margin-top:.75rem
}

.muted {
    color:var(--muted)
}

.fw600 {
    font-weight:600
}

.white {
    color:#fff
}

.lead {
    margin-top:1rem;
    font-size:1.05rem;
    color:var(--muted)
}


/* Buttons */
.btn {
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    padding:.7rem 1.3rem;
    border-radius:999px;
    font-weight:600;
    font-size:.9rem;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .25s var(--ease),background .25s,color .25s,box-shadow .25s;
    white-space:nowrap
}

.btn:hover {
    transform:translateY(-1px) scale(1.02)
}

.btn-lg {
    padding:1rem 1.75rem;
    font-size:1rem
}

.btn-gold {
    background:var(--grad-gold);
    color:var(--gold-fg);
    box-shadow:var(--shadow-gold)
}

.btn-primary {
    background:var(--grad-primary);
    color:#fff;
    box-shadow:var(--shadow-elev)
}

.btn-white {
    background:#fff;
    color:var(--primary);
    width:100%;
    justify-content:center;
    margin-top:1.25rem
}

.btn-ghost {
    background:rgba(255,255,255,.08);
    color:#fff;
    border-color:rgba(255,255,255,.3);
    backdrop-filter:blur(6px)
}

.btn-ghost:hover {
    background:rgba(255,255,255,.18)
}

.btn-outline {
    background:#fff;
    color:var(--primary);
    border-color:var(--border);
    padding:.55rem 1.1rem;
    font-size:.85rem;
    margin-top:1.2rem
}

.btn-outline:hover {
    background:var(--primary);
    color:#fff;
    border-color:var(--primary)
}


/* Navbar */
.navbar {
    position:fixed;
    inset:0 0 auto 0;
    z-index:50;
    transition:background .4s,box-shadow .4s,backdrop-filter .4s
}

.navbar.scrolled {
    background:rgba(255,255,255,.9);
    backdrop-filter:blur(14px);
    box-shadow:var(--shadow-soft)
}

.nav-inner {
    max-width:1200px;
    margin:0 auto;
    padding:1rem 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem
}

@media(min-width:768px) {
.nav-inner {
        padding:1rem 32px
}

}

.brand {
    display:flex;
    align-items:center;
    gap:.65rem
}

.brand-badge {
    display:grid;
    place-items:center;
    width:2.5rem;
    height:2.5rem;
    border-radius:.85rem;
    background:var(--grad-primary);
    color:#fff;
    font-family:"Poppins";
    font-weight:700;
    box-shadow:var(--shadow-soft)
}

.brand-badge.gold {
    background:var(--grad-gold);
    color:var(--gold-fg)
}

.brand-name {
    font-family:"Poppins";
    font-weight:600;
    font-size:.95rem;
    line-height:1.1;
    color:#fff;
    transition:color .3s
}

.navbar.scrolled .brand-name {
    color:var(--fg)
}

.brand-sub {
    display:block;
    font-size:.6rem;
    letter-spacing:.2em;
    font-weight:500;
    opacity:.7
}

.nav-links {
    display:none;
    gap:2rem
}

.nav-links a {
    font-size:.9rem;
    font-weight:500;
    color:rgba(255,255,255,.9);
    transition:color .2s
}

.nav-links a:hover {
    color:var(--gold)
}

.navbar.scrolled .nav-links a {
    color:rgba(17,24,39,.8)
}

.nav-cta {
    display:none
}

.menu-btn {
    background:none;
    border:0;
    color:#fff;
    cursor:pointer;
    padding:.25rem
}

.navbar.scrolled .menu-btn {
    color:var(--fg)
}

@media(min-width:1024px) {
.nav-links {
        display:flex
}

.nav-cta {
        display:inline-flex
}

.menu-btn {
        display:none
}

}

.mobile-menu {
    display:none;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(12px);
    border-top:1px solid var(--border);
    padding:1rem 20px;
    flex-direction:column;
    gap:.25rem
}

.mobile-menu.open {
    display:flex
}

.mobile-menu a {
    padding:.85rem 1rem;
    border-radius:.6rem;
    font-weight:500;
    color:rgba(17,24,39,.85)
}

.mobile-menu a:hover {
    background:var(--muted-bg)
}

.mobile-menu .btn-gold {
    margin-top:.75rem;
    justify-content:center
}


/* Hero */
.hero {
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    overflow:hidden;
    padding:6rem 0 3rem
}

.hero-img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:-2
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(8, 20, 45, .95),
        rgba(12, 35, 70, .88) 50%,
        rgba(5, 15, 35, .90)
    );
    z-index: -1;
}

.hero-inner {
    max-width:1200px;
    margin:0 auto;
    padding:2rem 20px;
    display:grid;
    grid-template-columns:1fr;
    gap:3rem;
    width:100%;
    color:#fff
}

@media(min-width:768px) {
.hero-inner {
        padding:2rem 32px
}

}

@media(min-width:1024px) {
.hero-inner {
        grid-template-columns:1fr;
        align-items:center
}

}

.hero-text {
    animation:fadeUp .9s var(--ease) both
}

.chip {
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    border:1px solid rgba(255,255,255,.25);
    background:rgba(255,255,255,.1);
    padding:.4rem 1rem;
    border-radius:999px;
    font-size:.75rem;
    font-weight:500;
    letter-spacing:.03em;
    backdrop-filter:blur(8px)
}

.dot {
    width:6px;
    height:6px;
    border-radius:999px;
    background:var(--gold)
}

.hero h1 {
    margin-top:1.5rem;
    font-size:clamp(2.2rem,5vw,3.8rem);
    font-weight:700;
    color:#fff;
    line-height:1.05
}

.gold-text {
    background:var(--grad-gold);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent
}

.hero p {
    margin-top:1.4rem;
    max-width:34rem;
    font-size:1.05rem;
    color:rgba(255,255,255,.85)
}

.hero-actions {
    margin-top:2rem;
    display:flex;
    flex-wrap:wrap;
    gap:1rem
}

.hero-stats {
    margin-top:3rem;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1.25rem;
    padding-top:2rem;
    border-top:1px solid rgba(255,255,255,.15);
    max-width:420px
}

.hero-stats dt {
    font-family:"Poppins";
    font-weight:700;
    font-size:1.5rem;
    color:var(--gold)
}

.hero-stats dd {
    font-size:.72rem;
    opacity:.8;
    margin-top:.15rem
}

.hero-card {
    display: none;
    width: 100%;
    max-width: 30rem;   /* antes era 22rem */
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.1);
    backdrop-filter: blur(20px);
    border-radius: 1.5rem;
    padding: 2rem;      /* opcional */
    box-shadow: var(--shadow-elev);
    animation: float 6s ease-in-out infinite;
    margin-left: auto;
}

@media(min-width:1024px) {
.hero-card {
        display:block
}

}

.hero-card-head{
    display: flex;
    align-items: center;
    gap: .75rem;
}

.hc-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: var(--grad-gold);
    border-radius: 16px;
    flex-shrink: 0;
}

.hc-title{
    margin: 0;
    line-height: 1.1;
}

.hc-sub{
    margin: 0;
    line-height: 1.1;
}


.hc-text{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:.15rem;       /* controla o espaço entre os dois textos */
}



.hc-list {
    list-style:none;
    margin-top:1.5rem;
    display:flex;
    flex-direction:column;
    gap:.75rem
}

.hc-list li {
    color:rgba(255,255,255,.9);
    font-size:.9rem;
    display:flex;
    align-items:center;
    gap:.75rem
}

.hc-list li::before {
    content:"›";
    display:grid;
    place-items:center;
    width:1.5rem;
    height:1.5rem;
    border-radius:999px;
    background:rgba(255,255,255,.15);
    color:var(--gold);
    font-weight:700
}


/* Grid & cards */
.grid {
    margin-top:3.5rem;
    display:grid;
    gap:1.5rem
}

.grid-3 {
    grid-template-columns:1fr
}

@media(min-width:640px) {
.grid-3 {
        grid-template-columns:repeat(2,1fr)
}

}

@media(min-width:1024px) {
.grid-3 {
        grid-template-columns:repeat(3,1fr)
}

}

.card {
    background:var(--card);
    border:1px solid var(--border);
    border-radius:1.5rem;
    box-shadow:var(--shadow-soft);
    transition:transform .5s var(--ease),box-shadow .5s
}

.card:hover {
    transform:translateY(-4px);
    box-shadow:var(--shadow-elev)
}

.product {
    overflow:hidden
}

.product-img {
    aspect-ratio:4/3;
    display:grid;
    place-items:center;
    font-size:5rem;
    color:rgba(255,255,255,.9);
    position:relative;
    transition:transform .7s
}

.product:hover .product-img {
    transform:scale(1.05)
}

.product-img.g1 {
    background:linear-gradient(135deg,#a9b8de,#5d78b8)
}

.product-img.g2 {
    background:linear-gradient(135deg,#f2c98a,#e2a04a)
}

.product-img.g3 {
    background:linear-gradient(135deg,#93a4d8,#4964ac)
}

.product-img.g4 {
    background:linear-gradient(135deg,#b0bde0,#6f8bc0)
}

.product-img.g5 {
    background:linear-gradient(135deg,#8fbfe0,#3b6faf)
}

.product-img.g6 {
    background:linear-gradient(135deg,#eab89b,#c6764b)
}

.card-body {
    padding:1.5rem
}

.card-body h3 {
    color:var(--fg)
}

.card-body p {
    margin-top:.5rem;
    font-size:.9rem
}


/* Diferenciais */
.feature {
    padding:2rem;
    display:flex;
    flex-direction:column;
    gap:1rem;
    align-items:flex-start
}

.feature-icon {
    display:grid;
    place-items:center;
    width:3.4rem;
    height:3.4rem;
    border-radius:1rem;
    background:var(--grad-primary);
    color:#fff;
    font-size:1.5rem;
    box-shadow:var(--shadow-soft);
    transition:transform .3s
}

.feature:hover .feature-icon {
    transform:scale(1.1)
}

.feature p {
    font-size:.95rem;
    line-height:1.6
}


/* Atendimento */
.two-col {
    display:grid;
    gap:3rem;
    align-items:center;
    grid-template-columns:1fr
}

@media(min-width:1024px) {
.two-col {
        grid-template-columns:1fr 1fr
}

}

.atendimento-visual {
    order:2
}

@media(min-width:1024px) {
.atendimento-visual {
        order:1
}

}

.atd-card {
    position:relative;
    aspect-ratio:4/3;
    border-radius:1.5rem;
    background:linear-gradient(135deg,#4a6ba8,#12356e);
    box-shadow:var(--shadow-elev);
    overflow:hidden;
    color:#fff
}

.atd-content {
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    text-align:center
}

.atd-badge {
    width:6rem;
    height:6rem;
    border-radius:999px;
    background:rgba(255,255,255,.15);
    backdrop-filter:blur(6px);
    display:grid;
    place-items:center;
    font-size:2.5rem;
    margin:0 auto
}

.atd-title {
    margin-top:1rem;
    font-family:"Poppins";
    font-weight:600;
    font-size:1.1rem
}

.atd-sub {
    font-size:.8rem;
    opacity:.8;
    margin-top:.25rem;
    color:rgba(255,255,255,.85)
}

.atd-chip {
    position:absolute;
    left:1.5rem;
    right:1.5rem;
    bottom:1.5rem;
    border:1px solid rgba(255,255,255,.2);
    background:rgba(255,255,255,.12);
    backdrop-filter:blur(12px);
    border-radius:1rem;
    padding:.85rem;
    display:flex;
    align-items:center;
    gap:.75rem
}

.atd-avatar {
    width:2.5rem;
    height:2.5rem;
    border-radius:999px;
    background:var(--grad-gold);
    color:var(--gold-fg);
    display:grid;
    place-items:center;
    font-weight:700;
    font-size:.8rem
}


/* Marquee */
.marquee-wrap {
    margin-top:3.5rem;
    overflow:hidden;
    -webkit-mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent);
    mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent)
}

.marquee {
    display:flex;
    gap:1.5rem;
    width:max-content;
    padding:0 20px;
    animation:marquee 40s linear infinite
}

.review {
    width:340px;
    flex-shrink:0;
    background:#fff;
    border:1px solid var(--border);
    border-radius:1.5rem;
    padding:1.5rem;
    box-shadow:var(--shadow-soft)
}

.stars {
    color:var(--gold);
    font-size:.95rem;
    letter-spacing:2px
}

.review p {
    margin-top:1rem;
    color:rgba(17,24,39,.85);
    font-size:.9rem;
    line-height:1.55
}

.review-user {
    margin-top:1.5rem;
    display:flex;
    align-items:center;
    gap:.75rem
}

.review-avatar {
    width:2.5rem;
    height:2.5rem;
    border-radius:999px;
    background:var(--grad-primary);
    color:#fff;
    display:grid;
    place-items:center;
    font-weight:600;
    font-size:.85rem
}

.review-name {
    font-weight:600;
    font-size:.9rem;
    color:var(--fg)
}

.review-role {
    font-size:.75rem;
    color:var(--muted)
}


/* Loja */
.loja-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:.75rem
}

@media(min-width:640px) {
.loja-grid {
        gap:1rem
}

}

.loja-tile {
    aspect-ratio:1/1;
    border-radius:1rem;
    display:grid;
    place-items:center;
    font-size:2rem;
    color:rgba(255,255,255,.85);
    box-shadow:var(--shadow-soft);
    transition:transform .5s
}

.loja-tile:hover {
    transform:scale(1.03)
}

.loja-tile.g1 {
    background:linear-gradient(135deg,#a2b3dc,#3b60a3)
}

.loja-tile.g2 {
    background:linear-gradient(135deg,#eab89b,#c6764b)
}

.loja-tile.g3 {
    background:linear-gradient(135deg,#8fbfe0,#3060a0)
}

.loja-tile.g4 {
    background:linear-gradient(135deg,#f2c98a,#dfa250)
}

.loja-tile.g5 {
    background:linear-gradient(135deg,#b3c0e0,#37528c)
}

.loja-tile.g6 {
    background:linear-gradient(135deg,#9ac9a8,#3f8b6c)
}


/* Localização */
.loc-grid {
    margin-top:3.5rem;
    display:grid;
    gap:1.5rem;
    grid-template-columns:1fr
}

@media(min-width:1024px) {
.loc-grid {
        grid-template-columns:1.4fr 1fr
}

}

.loc-map {
    border:1px solid var(--border);
    border-radius:1.5rem;
    overflow:hidden;
    box-shadow:var(--shadow-soft)
}

.loc-map iframe {
    display:block;
    width:100%;
    height:480px;
    border:0
}

.loc-info {
    padding:1.75rem
}

.loc-info h3 {
    color:var(--fg)
}

.loc-info>p {
    margin-top:.5rem;
    font-size:.9rem
}

.info-list {
    margin-top:1.5rem;
    display:flex;
    flex-direction:column;
    gap:1rem
}

.info-row {
    display:flex;
    gap:.75rem;
    align-items:flex-start
}

.info-ic {
    width:2.25rem;
    height:2.25rem;
    border-radius:.75rem;
    background:var(--secondary);
    color:var(--primary);
    display:grid;
    place-items:center;
    flex-shrink:0
}

.info-lbl {
    font-size:.7rem;
    font-weight:500;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:var(--muted)
}

.info-val {
    margin-top:.15rem;
    font-size:.9rem;
    font-weight:500;
    color:var(--fg);
    word-break:break-word
}

.loc-actions {
    margin-top:1.75rem;
    display:flex;
    flex-direction:column;
    gap:.75rem
}

.loc-actions .btn {
    justify-content:center
}


/* Footer */
.footer {
    background:#0f1e3d;
    color:rgba(255,255,255,.85)
}

.footer-grid {
    padding:4rem 20px;
    display:grid;
    grid-template-columns:1fr;
    gap:2.5rem
}

@media(min-width:768px) {
.footer-grid {
        grid-template-columns:repeat(3,1fr);
        padding:4rem 32px
}

}

.footer-about {
    margin-top:1.25rem;
    max-width:22rem;
    font-size:.9rem;
    opacity:.8;
    color:rgba(255,255,255,.8)
}

.footer-list {
    list-style:none;
    margin-top:1rem;
    display:flex;
    flex-direction:column;
    gap:.75rem;
    font-size:.9rem
}

.socials {
    margin-top:1rem;
    display:flex;
    flex-wrap:wrap;
    gap:.75rem
}

.socials a {
    width:2.75rem;
    height:2.75rem;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.15);
    background:rgba(255,255,255,.05);
    display:grid;
    place-items:center;
    font-size:.75rem;
    font-weight:600;
    transition:background .25s,color .25s
}

.socials a:hover {
    background:var(--grad-gold);
    color:var(--gold-fg);
    border-color:transparent
}

.footer-bar {
    border-top:1px solid rgba(255,255,255,.1)
}

.footer-bar-inner {
    display:flex;
    flex-direction:column;
    gap:.5rem;
    justify-content:space-between;
    padding:1.5rem 20px;
    font-size:.75rem;
    opacity:.7;
    text-align:center
}

@media(min-width:768px) {
.footer-bar-inner {
        flex-direction:row;
        text-align:left;
        padding:1.5rem 32px
}

}


/* FAB */
.fab-whats {
    position:fixed;
    bottom:1.5rem;
    right:1.5rem;
    z-index:40;
    width:3.5rem;
    height:3.5rem;
    border-radius:999px;
    background:var(--whatsapp);
    color:#fff;
    display:grid;
    place-items:center;
    font-size:1.4rem;
    box-shadow:0 10px 30px -8px rgba(37,211,102,.6);
    transition:transform .25s
}

.fab-whats:hover {
    transform:scale(1.1)
}

.fab-top {
    position:fixed;
    bottom:5.5rem;
    right:1.5rem;
    z-index:40;
    width:2.75rem;
    height:2.75rem;
    border-radius:999px;
    background:#fff;
    color:var(--primary);
    border:1px solid var(--border);
    display:none;
    place-items:center;
    cursor:pointer;
    box-shadow:var(--shadow-soft);
    font-size:1rem;
    font-weight:700
}

.fab-top.show {
    display:grid
}


/* Reveal */
.reveal {
    opacity:0;
    transform:translateY(24px);
    transition:opacity .8s var(--ease),transform .8s var(--ease)
}

.reveal.is-visible {
    opacity:1;
    transform:none
}


/* Keyframes */
@keyframes fadeUp {
from {
        opacity:0;
        transform:translateY(24px)
}

to {
        opacity:1;
        transform:none
}

}

@keyframes float {
0%,100% {
        transform:translateY(0)
}

50% {
        transform:translateY(-10px)
}

}

@keyframes marquee {
from {
        transform:translateX(0)
}

to {
        transform:translateX(-50%)
}

}



.fab-whats,
.whatsapp-pulse {
    animation: whatsappPulse 1.8s infinite;
}

.whatsapp-icon {
    width: 28px;
    height: 28px;
}

@keyframes whatsappPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(37,211,102,.55);
    }
    70% {
        box-shadow: 0 0 0 18px rgba(37,211,102,0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(37,211,102,0);
    }
}