/* ====== Variables & Reset ====== */
:root{
  --bg: #000;
  --surface: #111218;
  --text: #eaeaf2;
  --muted: #b4b6c4;
  --primary: #f0c200;
  --accent: #7bd1ff;
  --card: #141622;
  --shadow: 0 10px 30px rgba(0,0,0,.25);
  --radius: 18px;
}

@media (prefers-color-scheme: light){
  :root{
    --bg:#ffffff;
    --surface:#f7f7fb;
    --text:#13141a;
    --muted:#5b5e6d;
    --card:#ffffff;
    --shadow: 0 10px 30px rgba(0,0,0,.08);
  }
}

*{ box-sizing:border-box; }
html,body{ height:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, Apple Color Emoji, Segoe UI Emoji;
  color:var(--text);
  background:var(--bg);
}

/* ====== Nav ====== */
.nav{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 20px; backdrop-filter: blur(8px);
  background: color-mix(in oklab, var(--bg) 70%, transparent);
  border-bottom: 1px solid color-mix(in oklab, var(--text) 10%, transparent);
}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand-text{font-weight:700; letter-spacing:.3px; color:var(--text);}
.nav-list{display:flex; align-items:center; gap:18px;}
.nav-list a{ color:var(--text); text-decoration:none; opacity:.9; }
.nav-list .btn{ margin-left:6px; }
.mode-toggle{ background:none; border:1px solid color-mix(in oklab, var(--text) 15%, transparent); border-radius:999px; padding:6px 10px; color:var(--text); cursor:pointer; }

.nav-toggle{ display:none; background:none; border:none; font-size: 19.20px; color:var(--text); }

@media (max-width: 880px){
  /* On small screens make the header part of the normal flow so it scrolls with the page */
  .nav{ position: relative; }

  /* show hamburger */
  .nav-toggle{ display:block; }

  /* dropdown anchored to the header (not fixed to the viewport) */
  .nav-list{
    position: absolute;
    right: 16px;
    left: 16px;
    top: calc(100% + 8px);
    background:var(--surface);
    padding:16px;
    border-radius:12px;
    box-shadow:var(--shadow);
    transform:translateY(-8px);
    opacity:0;
    pointer-events:none;
    transition: transform .25s ease, opacity .25s ease;
    flex-direction:column;
    align-items:flex-start;
    z-index:60;
  }
  .nav-list.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
}


/* ====== Hero ====== */
.hero{ position:relative; overflow:hidden; min-height: 90vh; display:grid; place-items:center; }
.hero-media{ position:absolute; inset:0; }
.gradient-bg{
  position:absolute; inset:-20%;
  background: radial-gradient(1200px 800px at 20% 20%, #ffefad33, transparent 70%),
              radial-gradient(800px 600px at 80% 10%, #7bd1ff22, transparent 70%),
              radial-gradient(800px 800px at 50% 80%, #ff8bd622, transparent 70%);
  filter: blur(40px);
}
.hero-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.25;
  transform: scale(1.1);
  clip-path: path('M0.62,0.06 C0.79,0.15,0.96,0.34,0.97,0.53 C0.98,0.72,0.83,0.91,0.66,0.96 C0.49,1.01,0.29,0.93,0.17,0.79 C0.05,0.66,0.01,0.47,0.05,0.31 C0.1,0.15,0.26,0.02,0.43,0.01 C0.5,0.01,0.56,0.03,0.62,0.06 Z');
}
.hero-content{ position:relative; text-align:center; padding: 80px 16px; }
.display{ font-size: clamp(36px, 6vw, 72px); line-height:1.05; letter-spacing:-.02em; margin:0 0 12px; }
.display .accent{ color:var(--primary); }
.lead{ font-size: clamp(16px, 2.4vw, 22px); color:var(--muted); max-width:960px; margin: 0 auto 28px; }
.hero-ctas{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.meta{ margin-top:18px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; color:var(--muted); font-size:14px; }

/* Buttons */
.btn{ --btn-bg:var(--primary); --btn-fg:#000; background:var(--btn-bg); color:var(--btn-fg);
  border:none; border-radius:12px; padding:10px 16px; text-decoration:none; font-weight:700; transition: transform .15s ease, box-shadow .2s ease, background .2s ease; box-shadow: 0 6px 18px rgba(0,0,0,.15);
}
.btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 26px rgba(0,0,0,.2); }
.btn:active{ transform: translateY(0); }
.btn-lg{ padding:14px 22px; font-size:16px; }
.btn-pill{ border-radius:999px; padding:10px 14px; }
.ghost{ background:transparent; color:var(--text); border:1.5px solid color-mix(in oklab, var(--text) 18%, transparent); box-shadow:none; }
.ghost:hover{ background: color-mix(in oklab, var(--text) 6%, transparent); }

/* ====== Sections ====== */
.container{ width:min(1120px, 92vw); margin-inline:auto; }
.section{ padding: 80px 0; }
.section-head{ margin-bottom: 26px; }
.display-sm{ font-size: clamp(28px, 4.8vw, 44px); line-height:1.1; margin:0; }
.muted{ color:var(--muted); }

/* Split grid (assimetria) */
.split{ display:grid; gap:18px; padding: 60px 0; grid-template-columns: 1.2fr 1fr; }
.split .card:nth-child(3){ grid-column: 1 / -1; }
@media (max-width: 880px){ .split{ grid-template-columns: 1fr; } }

/* Cards */
.card{ background:var(--card); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow); border: 1px solid color-mix(in oklab, var(--text) 8%, transparent); }
.card.glass{ background:#000; backdrop-filter: blur(8px); }
.card.gradient{ background:#000; }
.elevate{ transition: transform .2s ease, box-shadow .2s ease; }
.elevate:hover{ transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,0,0,.25); }

/* Timeline */
.timeline{ display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:16px; }
.step{ position:relative; padding:18px 18px 18px 56px; background:var(--card); border-radius:16px; border:1px solid color-mix(in oklab, var(--text) 8%, transparent); }
.badge{ position:absolute; left:14px; top:16px; background:var(--primary); color:#000; width:28px; height:28px; display:grid; place-items:center; font-weight:800; border-radius:50%; }

/* About blob */
.about{ display:grid; gap:24px; grid-template-columns: .9fr 1.1fr; align-items:center; }
.about .blob{ width:min(380px, 80vw); aspect-ratio: 1 / 1; background: radial-gradient(#ffd54a55, transparent 60%); border-radius: 60% 40% 55% 45% / 62% 38% 62% 38%; padding:14px; box-shadow: var(--shadow); }
.about .blob img{ width:100%; height:100%; object-fit:cover; border-radius: 48% 52% 40% 60% / 40% 60% 40% 60%; }
.about .ticks{ padding-left:16px; }
@media (max-width: 880px){ .about{ grid-template-columns: 1fr; } }

/* Rail (horizontal scroll) */
.rail{ padding: 24px 0; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); background: color-mix(in oklab, var(--surface) 90%, transparent); }
.rail-inner{ display:flex; gap:28px; overflow:auto; scroll-snap-type:x mandatory; padding: 10px 4vw; }
.rail-inner span{ white-space:nowrap; scroll-snap-align:center; padding: 10px 16px; border-radius:999px; background: color-mix(in oklab, var(--text) 8%, transparent); color:var(--muted); border:1px solid color-mix(in oklab, var(--text) 10%, transparent); }

/* Contact */
.contact{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.contact a{ color:var(--text); }
.contact .btn{ --btn-bg: var(--primary); --btn-fg: #000; }

/* Footer */
.footer{ padding: 36px 0; border-top: 1px solid color-mix(in oklab, var(--text) 10%, transparent); background: color-mix(in oklab, var(--surface) 70%, transparent); }
.footer-inner{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }

/* Fab */
.fab{ position:fixed; right:18px; bottom:18px; width:56px; height:56px; display:grid; place-items:center; border-radius:50%; background:#25d366; color:#fff; text-decoration:none; font-size:22px; box-shadow:var(--shadow); transition: transform .2s ease; }
.fab:hover{ transform: translateY(-2px); }

/* Fade-in Intersection */
.fade-in{ opacity:0; transform: translateY(8px); transition: .5s ease; }
.fade-in.visible{ opacity:1; transform: none; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .parallax, .fade-in{ transition:none; transform:none !important; }
}

/* Accessibility */
:focus-visible{ outline: 2px solid var(--accent); outline-offset:2px; }


/* ==== HOTFIX VISIBILIDADE ====
   Força exibição mesmo se JS não rodar ou observer falhar */
.fade-in{ opacity:1 !important; transform:none !important; }
.nav-list{ opacity:1 !important; }


/* ===== Hero Logo placement ===== */
.hero .hero-content{
  display:flex; flex-direction:column; align-items:center; gap:1rem;
}
.hero-logo{
  width:min(42vw, 330px);
  height:auto;
  border-radius:1rem;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.35));
  opacity:1 !important;
}
@media (max-width: 768px){
  T0px; }
}


/* === Hero Lead Text Fix === */
.hero .lead{
  white-space: nowrap;
  text-align: center;
}
@media (max-width: 768px){
  .hero .lead{
    white-space: normal;
    text-align: justify;
  }
}



/* === Cards Uniform Fix (v5.7) === */
.card{
  background: var(--card) !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 1.75rem;
  border-radius: var(--radius);
  gap: .5rem;
  min-height: 140px;
}

/* Neutralize variant backgrounds para todas ficarem iguais */
.card.glass,
.card.elevate,
.card.gradient{
  background: var(--card) !important;
}

/* Títulos e textos dentro do card */
.card h3, .card h4{
  margin: 0 0 .25rem 0;
}
.card p{ margin: 0; }



/* === Uppercase Titles Fix (v5.8) === */
.card h3, .card h4,
.section-title, .step h3, .step h4,
.hero h1 span, .hero h1{
  text-transform: uppercase;
  letter-spacing: 0.5px;
}



/* === Uppercase Titles Fix Expanded (v5.9) === */
.card h3, .card h4,
.section-title, section h2, section h3,
.step h3, .step h4{
  text-transform: uppercase;
  letter-spacing: 0.5px;
}



/* === Steps Grid Fix (v6.0) === */
.steps-grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: auto;
  gap: 1.5rem;
}

.steps-grid .card:nth-child(n+3){
  grid-column: span 1;
}

@media (max-width: 768px){
  .steps-grid{
    grid-template-columns: 1fr;
  }
}



/* === Step Cards Equal Height Fix (v6.1) === */
.steps-grid{
  align-items: stretch;
}

.steps-grid .card{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 220px;
}



/* === Timeline Layout Option B (v6.2): 2 steps on first row, 3 on second === */
.timeline{
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}
.timeline .step{
  background: var(--card);
  border-radius: var(--radius);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 200px;
  flex: 1 1 calc(50% - 1.5rem); /* default: first row 2 items */
}

/* From the 3rd item onward, use thirds to form the second row with 3 items */
.timeline .step:nth-child(n+3){
  flex-basis: calc(33.333% - 1.5rem);
}

/* Badges consistent */
.timeline .step .badge{
  width: 32px; height: 32px;
  border-radius: 999px;
  display: inline-flex; align-items:center; justify-content:center;
  font-weight: 700;
  background: var(--primary);
  color: #111;
}

/* Mobile: single column */
@media (max-width: 768px){
  .timeline .step{
    flex-basis: 100% !important;
    min-height: auto;
  }
}



/* === Section Head Centering (v6.3) === */
.section-head{
  text-align: center;
}
.section-head .muted{
  margin-left: auto;
  margin-right: auto;
}

/* === Timeline badge and title on same line; description below (v6.3) === */
.timeline .step{
  display: grid;
  grid-template-columns: auto 1fr;
  grid-auto-rows: auto;
  column-gap: .75rem;
  row-gap: .75rem;
  align-items: center;
}
.timeline .step .badge{
  grid-column: 1;
  grid-row: 1;
  margin: 0;
}
.timeline .step h4{
  grid-column: 2;
  grid-row: 1;
  margin: 0;
}
.timeline .step p{
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
}



/* === Timeline Badge Overlap Fix (v6.4) === */
.timeline .step{ 
  position: relative;
  column-gap: 1rem;            /* mais espaço entre número e título */
  align-items: center; 
}
.timeline .step .badge{
  position: static !important;  /* garante que não fique absolute */
  margin: 0; 
  flex: 0 0 auto;
  transform: none !important;   /* remove possíveis translate */
}
.timeline .step h4{
  line-height: 1.2;
  padding-top: auto;               /* evita empurrar para baixo */
}



/* === About Section Harmonization (v6.5) === */
.about-photo{
  width: min(34vw, 340px);
  height: auto;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(0,0,0,.35);
  object-fit: cover;
}
@media (max-width: 1024px){
  .about-photo{ width: min(50vw, 320px); }
}
@media (max-width: 768px){
  .about-photo{ width: 100%; border-radius: 12px; }
}

/* Chips alignment */
.about-chips{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: center;
  padding: 0;
  margin: 1.25rem auto 0;
  list-style: none;
}
.about-chips li{
  background: #15161a;
  border: 1px solid rgba(255,255,255,.06);
  padding: .5rem .9rem;
  border-radius: 999px;
  color: #d9d9d9;
  font-weight: 600;
  font-size: .9rem;
}



/* === About Photo Crop & Chips Align (v6.6) === */
/* Deixa a foto circular, com foco mais alto para não cortar a cabeça */
.about-photo{
  aspect-ratio: 1 / 1;
  width: min(34vw, 360px);
  height: auto;
  border-radius: 50% !important;
  object-fit: cover;
  object-position: 50% 18%; /* sobe o enquadramento */
  box-shadow: 0 24px 48px rgba(0,0,0,.35);
}
@media (max-width: 1024px){
  .about-photo{ width: min(46vw, 340px); object-position: 50% 16%; }
}
@media (max-width: 768px){
  .about-photo{ width: 72vw; object-position: 50% 14%; }
}

/* Chips: alinhamento central, mesma altura e sem variações de estilo */
.about-chips{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin: 1.25rem auto 0;
  list-style: none;
}
.about-chips li{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  white-space: nowrap;
  background: #15161a;
  border: 1px solid rgba(255,255,255,.08);
  color: #d9d9d9;
  font-weight: 600;
  font-size: .92rem;
}

/* Remove estados especiais que criem desalinhamento visual */
.about-chips li.active,
.about-chips li.is-active,
.about-chips li:first-child{
  background: #15161a;
  border-color: rgba(255,255,255,.08);
  color: #d9d9d9;
}



/* === Chips Perfect Align (v6.7) === */
.about-chips{
  display: grid;
  grid-template-columns: repeat(6, max-content);
  justify-content: center;
  gap: .75rem 1rem;
  margin: 1.25rem auto 0;
  padding: 0;
  list-style: none;
  max-width: 1100px;
}
@media (max-width: 900px){
  .about-chips{ grid-template-columns: repeat(3, max-content); }
}
@media (max-width: 560px){
  .about-chips{ grid-template-columns: repeat(2, max-content); }
}
.about-chips li{
  display: inline-flex; align-items:center; justify-content:center;
  height: 40px; padding: 0 16px; border-radius: 999px;
  background: #15161a; border: 1px solid rgba(255,255,255,.08);
  color: #d9d9d9; font-weight: 600; font-size: .92rem;
}

/* === Modern CTA (v6.7) === */
#contato, #contact{
  text-align: center;
}
#contato h2, #contact h2{
  margin-bottom: .5rem;
}
#contato .muted, #contact .muted{
  max-width: 680px; margin: 0 auto 1.25rem;
}
.cta-row{
  display: flex; flex-wrap: wrap; gap: .75rem;
  justify-content: center; align-items: center;
  margin-bottom: 1rem;
}
.btn{
  padding: .75rem 1rem; border-radius: .75rem; text-decoration:none;
  font-weight: 700; letter-spacing:.2px; display:inline-flex; align-items:center; justify-content:center;
}
.btn-primary{ background: var(--primary); color: #111; }
.btn-outline{ background: transparent; color: #eaeaea; border: 1px solid rgba(255,255,255,.16); }
.btn-outline:hover{ background: rgba(255,255,255,.06); }
.contact-tags{
  display:flex; gap:.5rem; justify-content:center; flex-wrap:wrap;
  list-style:none; padding:0; margin:.5rem 0 0;
}
.contact-tags li{
  padding:.4rem .7rem; border-radius:999px;
  background:#121317; color:#bdbdbd; border:1px solid rgba(255,255,255,.08);
  font-weight:600; font-size:.85rem;
}



/* === Contact Instagram Card (v6.8) === */
.social-card{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.25rem; text-decoration:none;
  width: min(520px, 92%);
  margin: 1rem auto 0;
  padding: 1rem 1.25rem;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1rem;
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
  color: #eaeaea;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.social-card strong{ font-size: 1rem; }
.social-card span{ font-size: .95rem; color:#bdbdbd; }
.social-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(0,0,0,.32);
  border-color: rgba(255,255,255,.16);
}



/* === v6.9: Chips centered, all CTAs yellow, floating WhatsApp yellow === */
.about-chips{
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem 1rem;
  width: 100%;
  margin: 1.25rem auto 0;
  padding: 0;
  list-style: none;
  max-width: none;
}
.about-chips li{
  height: 40px; padding: 0 16px;
  display: inline-flex; align-items:center; justify-content:center;
}

/* Make all CTAs in contact row yellow */
#contato .cta-row .btn, #contact .cta-row .btn{
  background: var(--primary) !important;
  color: #111 !important;
  border: none !important;
}

/* Floating WhatsApp to yellow */
.whatsapp-fab, .fab-whatsapp, .floating-whatsapp, a[href*="wa.me"].fab, a[href*="wa.me"].floating{
  background: var(--primary) !important;
  color: #111 !important;
  border-color: var(--primary) !important;
}
.whatsapp-fab svg, .fab-whatsapp svg, .floating-whatsapp svg{
  fill: #111 !important;
  stroke: #111 !important;
}



/* === v7.0: Force floating WhatsApp yellow + chips hard center === */

/* Stronger selectors to catch most WhatsApp floating widgets */
a[href*="wa.me"], a[href*="api.whatsapp.com"], a[href*="wa.link"],
[class*="whats"], [class*="wa-"], .wa-widget, .wa-btn, .whatsapp, .whatsapp-fab, .floating-whatsapp {
  background: var(--primary) !important;
  color: #111 !important;
  border-color: var(--primary) !important;
}
/* If icon is SVG inside */
a[href*="wa.me"] svg *, [class*="whats"] svg * {
  fill: #111 !important;
  stroke: #111 !important;
}
/* If vendor sets inline green color (#25D366) */
*[style*="#25D366"]{
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

/* Chips row: absolute centering safeguards */
.about-chips{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: fit-content !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  gap: .75rem 1rem !important;
}
/* Ensure the strip it sits in doesn't push it */
.about-chips::before, .about-chips::after{ content: none !important; }



/* === v7.1: Floating WhatsApp uses custom yellow icon, chips hard-centered === */
.whatsapp-fab, .fab-whatsapp, .floating-whatsapp,
a[href*="wa.me"].fab, a[href*="wa.me"].floating,
a[href*="api.whatsapp.com"].fab, a[href*="api.whatsapp.com"].floating,
[class*="whats"].fab, [class*="whats"].floating {
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  background: transparent !important;
  background-image: url('assets/img/whatsapp-yellow-round.png') !important;
  background-size: cover !important;
  background-position: center !important;
  border: none !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.35) !important;
}
/* Hide any inner icon/svg that plugin injects */
.whatsapp-fab svg, .fab-whatsapp svg, .floating-whatsapp svg,
a[href*="wa.me"].fab svg, a[href*="wa.me"].floating svg,
[class*="whats"] svg { display: none !important; }

/* Chips absolute centering regardless of container styles */
.about-chips{
  position: relative !important;
  display: inline-flex !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  justify-content: center !important;
  align-items: center !important;
  gap: .75rem 1rem !important;
  margin: 1.25rem 0 0 0 !important;
  padding: 0 !important;
}



/* === v7.2: Center 'rail' chips strip === */
.rail{ display:flex; justify-content:center; }
.rail-inner{
  display:flex; gap:.75rem 1rem; flex-wrap:wrap;
  justify-content:center; align-items:center;
  margin: 0 auto; padding: .75rem 0;
}
.rail-inner span{
  display:inline-flex; align-items:center; justify-content:center;
  height: 40px; padding: 0 16px;
  background:#15161a; border:1px solid rgba(255,255,255,.08);
  border-radius:999px; color:#d9d9d9; font-weight:600; font-size:.92rem;
}



/* === v7.3: Card titles in brand yellow === */
.card h3, .card h4, .feature h3, .feature h4{
  color: var(--primary) !important;
}


/* v7.4 WA FAB style fallback */
#fab-wa-custom{ display:inline-block; }


/* === v7.5: hard center the rail chips === */
.rail{ display:flex !important; justify-content:center !important; }
.rail-inner{
  display:flex !important; flex-wrap:wrap !important;
  gap:.75rem 1rem !important; justify-content:center !important;
  align-items:center !important; width:fit-content !important;
}
.rail-inner > span{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  height:40px !important; padding:0 16px !important;
  border-radius:999px !important; background:#15161a !important; color:#d9d9d9 !important;
  border:1px solid rgba(255,255,255,.08) !important; font-weight:600 !important; font-size:.92rem !important;
}


/* === v7.6.2 Overrides: Pure Black Home === */
body, .home, .hero { background:#000 !important; }
.gradient-bg{ display:none !important; background:none !important; }
.hero-img{ opacity:0 !important; } /* remove any residual light overlay */

/* v7.6.4: CSS guardrails for floating WA */
a[style*="position:fixed"][href*="wa.me"],
a[style*="position:fixed"][href*="api.whatsapp.com"],
div[style*="position:fixed"][class*="whats"],
a[style*="position:fixed"][class*="whats"]{
  display:none !important; visibility:hidden !important; opacity:0 !important;
}


/* === Hero logo fix: aumentar em 50% === */
.hero-logo img {
  max-width: 150% !important;
  height: auto !important;
}


/* Força logo maior no menu */
.nav .brand img {
  width: 54px !important;
  height: 54px !important;
}


/* === Force hero logo 50% bigger === */
.hero-logo{
  width: min(42vw, 330px) !important;
  height: auto !important;
}
@media (max-width: 640px){
  .hero-logo{ width: 240px !important; }
}

/* Força a remoção do botão flutuante do WhatsApp */
#whats-fab, .fab {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* Custom override for horizontal mobile menu */

@media (max-width: 880px) {
  .nav__list {
    position: absolute;
    top: 100%;
    left: auto;
    right: auto;
    display: flex;
    flex-direction: row;       /* horizontal layout */
    justify-content: space-around;
    align-items: center;
    background: #000;
    padding: 10px 0;
    z-index: 99;
  }

  .nav__list li {
    margin: 0 10px;
  }

  .nav__list a {
    padding: 5px 10px;
    font-size: 14px;
    color: #fff;
  }
}


/* === MOBILE HORIZONTAL NAVBAR FIX (v2) === */
@media (max-width: 880px){
  /* Keep header fixed on top to prevent covering content */
  .nav{
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    z-index: 1000;
    background: #000; /* solid to ensure readability */
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  /* Provide space so logo/hero isn't hidden under nav */
  /* body scroll-padding-top removed for static nav */
  .hero, #home, main{ padding-top: 10px; }

  /* Horizontal list with swipe/scroll */
  .nav-list{
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    white-space: nowrap;
    padding: 10px 12px;
    background: #000;
    box-shadow: none;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: static !important; /* part of the flow, below header line */
  }
  .nav-list a{
    display: inline-flex;
    padding: 8px 12px;
    border-radius: 999px;
    text-decoration: none;
    color: #fff;
    font-weight: 600;
    letter-spacing: .2px;
    background: rgba(255,255,255,.08);
  }
  .nav-toggle{
    /* hide hamburger since we show the list horizontally */
    display: none !important;
  }
}
/* Ensure logo isn't overlapped by any dropdowns */
.nav, .nav *{ z-index: inherit; }