/* ═══════════════════════════════════════════════════════════════
   TES ELEVADORES — PREMIUM VISUAL LAYER
   Referência: Linear, Vercel, Framer, Apple
   Estratégia: overrides precisos sobre style.css
   ═══════════════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ───────────────────────────────────────────── */
:root {
  --red:       #C8202A;
  --red-dark:  #a01520;
  --red-dim:   rgba(200,32,42,0.12);
  --red-glow:  rgba(200,32,42,0.22);
  --red-grad:  linear-gradient(135deg,#C8202A 0%,#e83840 100%);

  --s0: #060304;
  --s1: #0c0607;
  --s2: #120809;
  --s3: #180c0e;
  --s4: #1f1012;
  --s5: #261417;

  /* override style.css gray vars → warm red-black */
  --gray-900: #060304; --g900: #060304; --b0: #060304;
  --gray-800: #0c0607; --g800: #0c0607; --b1: #0c0607;
  --gray-750: #110809; --g750: #110809;
  --gray-700: #190d0f; --g700: #190d0f; --b3: #190d0f;
  --gray-600: #241215; --g600: #241215; --b4: #241215;

  --bd: rgba(255,255,255,0.065);
  --bd-hi: rgba(255,255,255,0.13);
  --bd-red: rgba(200,32,42,0.35);

  --sh-sm: 0 1px 4px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.25);
  --sh-md: 0 4px 12px rgba(0,0,0,.5), 0 16px 48px rgba(0,0,0,.35);
  --sh-red: 0 8px 40px rgba(200,32,42,0.25);

  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out:    cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --t1: 150ms;
  --t2: 280ms;
  --t3: 480ms;
}

/* ── SCROLL OFFSET (navbar fixa = 62px + 16px folga) ─────────── */
html { scroll-behavior: smooth; scroll-padding-top: 78px; }
section[id], div[id].section-anchor { scroll-margin-top: 78px; }

/* ── SCROLLBAR ───────────────────────────────────────────────── */
html { scrollbar-width: thin; scrollbar-color: #232326 var(--s0); }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--s0); }
::-webkit-scrollbar-thumb { background: #2a2a2f; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--red); }

/* ── SELECTION ───────────────────────────────────────────────── */
::selection { background: rgba(200,32,42,0.22); color: #fff; }

/* ── BASE ────────────────────────────────────────────────────── */
body {
  background:
    radial-gradient(ellipse 140% 90% at -8% 110%, rgba(172,10,18,0.65) 0%, transparent 50%),
    radial-gradient(ellipse 90% 70% at 108% -10%, rgba(148,7,14,0.40) 0%, transparent 48%),
    #050203;
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
@media (max-width: 768px) {
  body { background-attachment: scroll; }
}

/* Grain overlay global */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.028'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9998;
  opacity: 1;
}

/* ── HERO CONTENT — LEFT-ALIGNED ────────────────────────────── */
/* margin:0 auto no hero-content cria margem esquerda excessiva em
   notebooks/laptops largos. O hero é texto-esq + imagem-dir,
   então o conteúdo deve partir da borda esquerda com padding. */
#hero .hero-content {
  margin-left: 0;
  margin-right: auto;
}

/* ── HERO STATS ALIGNMENT ────────────────────────────────────── */
/* Simplifica: com conteúdo left-aligned, stats alinha ao padding */
#hero .hero-stats {
  left: clamp(24px, 5vw, 80px);
}

/* ── NAVBAR ──────────────────────────────────────────────────── */
#tes-navbar {
  height: 90px;
  padding: 0 clamp(24px,5vw,80px);
  background: transparent;
  transition: background var(--t2) var(--ease-out),
              border-color var(--t2) var(--ease-out),
              box-shadow var(--t2) var(--ease-out);
}
#tes-navbar.scrolled {
  background: rgba(5,5,7,0.92);
  border-bottom-color: var(--bd);
  backdrop-filter: blur(20px) saturate(1.5);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
  box-shadow: 0 1px 0 var(--bd), 0 4px 24px rgba(0,0,0,.45);
}
.nav-logo { height: 72px; }
.nav-link {
  font-size: 11px;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.42);
  padding: 6px 13px;
  border-radius: 5px;
  transition: color var(--t1), background var(--t1);
  position: relative;
}
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 50%; right: 50%;
  height: 1px;
  background: var(--red);
  transition: left var(--t2) var(--ease-spring), right var(--t2) var(--ease-spring);
  border-radius: 1px;
}
.nav-link:hover  { color: rgba(255,255,255,0.85); background: rgba(255,255,255,0.04); }
.nav-link.active { color: #fff; background: rgba(255,255,255,0.06); }
.nav-link.active::after { left: 13px; right: 13px; }
.nav-cta {
  background: var(--red);
  border-radius: 5px;
  padding: 9px 20px;
  gap: 8px;
  box-shadow: 0 2px 12px var(--red-glow);
  transition: background var(--t1), box-shadow var(--t1), transform var(--t1);
}
.nav-cta:hover {
  background: var(--red-dark);
  box-shadow: 0 6px 24px var(--red-glow), 0 2px 8px rgba(0,0,0,0.4);
  transform: translateY(-1px);
}
#scroll-top-btn {
  border-radius: 6px;
  bottom: 28px; left: 28px;
  width: 40px; height: 40px;
  transition: background var(--t2), border-color var(--t2),
              box-shadow var(--t2), transform var(--t2);
}
#scroll-top-btn:hover {
  background: var(--red);
  border-color: var(--red);
  box-shadow: var(--sh-red);
  transform: translateY(-3px);
}

/* ── LOW-RES IMAGE COMPENSATION ─────────────────────────────── */
/* Imagens originais a 480px/360px — técnicas para mascarar pixelação          */

/* Hero: nova imagem clara/quente — reduz brilho, dessatura levemente */
#hero .hero-bg-image {
  filter: saturate(0.88) brightness(0.78) contrast(1.05);
  transform-origin: right center;
}
/* Overlay — lado esquerdo quase opaco p/ legibilidade do texto,
   lado direito mais aberto p/ mostrar a imagem */
#hero .hero-overlay {
  background: linear-gradient(
    105deg,
    rgba(5,5,7,0.97) 0%,
    rgba(5,5,7,0.90) 25%,
    rgba(5,5,7,0.65) 48%,
    rgba(5,5,7,0.38) 65%,
    rgba(5,5,7,0.18) 82%,
    rgba(5,5,7,0.08) 100%
  ) !important;
}

/* Quem Somos: blur leve + overlay mais forte */
#quem-somos .qs-img-wrap img {
  filter: saturate(0.88) blur(0.6px) brightness(0.9) !important;
}
#quem-somos .qs-img-wrap::before {
  background: linear-gradient(135deg,
    rgba(5,5,7,0.65) 0%,
    rgba(5,5,7,0.25) 50%,
    transparent 75%
  ) !important;
}

/* Modal hero image */
.modal-hero img {
  filter: brightness(0.72) saturate(0.82) blur(0.4px) !important;
}


/* Modernização e Manutenção — CTA band backgrounds */
#modernizacao .mod-cta-band-img,
#manutencao   .man-cta-band-img,
#manutencao   .man-split-img,
#manutencao   .man-header-img {
  filter: blur(0.8px) saturate(1.05) brightness(0.85);
}

/* ── HERO ────────────────────────────────────────────────────── */
section#hero { background: transparent; }

#hero .hero-headline .line1,
#hero .hero-headline .line2,
#hero .hero-headline .line3 {
  font-size: clamp(38px, 5vw, 72px);
  letter-spacing: -0.02em;
  line-height: 0.92;
}
/* Gradient accent on line2 (vermelho) */
#hero .hero-headline .line2 {
  background: var(--red-grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

#hero .hero-sub {
  font-size: clamp(14px,1.5vw,17px);
  color: rgba(255,255,255,0.48);
  max-width: 420px;
  line-height: 1.8;
}
#hero .btn-orcamento {
  border-radius: 5px;
  padding: 16px 36px;
  background: var(--red);
  border-color: var(--red);
  box-shadow: 0 2px 16px var(--red-glow);
  transition: background var(--t2), box-shadow var(--t2), transform var(--t2);
}
#hero .btn-orcamento:hover {
  background: var(--red-dark);
  box-shadow: var(--sh-red);
  transform: translateY(-3px);
}
#hero .btn-solucoes {
  border-radius: 5px;
  border-color: rgba(255,255,255,0.16);
  transition: border-color var(--t2), background var(--t2), transform var(--t2);
}
#hero .btn-solucoes:hover {
  border-color: rgba(255,255,255,0.45);
  background: rgba(255,255,255,0.04);
  transform: translateY(-3px);
}
/* Stats numbers */
#hero .stat-num {
  font-size: clamp(30px,3.2vw,46px);
  letter-spacing: -0.02em;
  font-weight: 900;
}

/* ── SECTION RHYTHM — alternating backgrounds ───────────────── */
#quem-somos,
#quem-somos .qs-section  { background: transparent; }
#produtos,
#produtos .prod-section   { background: transparent; }
#modernizacao,
#modernizacao .mod-section { background: transparent; }
#manutencao,
#manutencao .man-section  { background: transparent; }
#portfolio,
#portfolio .pf-section    { background: transparent; }
#contato,
#contato .ct-section      { background: transparent; }

/* Padding correto — o elemento É #contato, não descendente */
#contato {
  padding-top: clamp(100px, 11vw, 150px);
  padding-bottom: clamp(80px, 10vw, 130px);
}

/* Subtítulo um pouco maior */
#contato .ct-sub {
  font-size: 17px;
}

/* Section left-border refined — more subtle and premium */
#quem-somos  .qs-section::after,
#produtos    .prod-section::before,
#modernizacao .mod-section::before,
#manutencao  .man-section::before,
#portfolio   .pf-section::before,
#contato     .ct-section::before {
  width: 2px;
  background: linear-gradient(to bottom, var(--red) 0%, transparent 45%);
  opacity: 0.6;
}

/* ── SECTION HEADERS — Label refinement ─────────────────────── */
.qs-label-text, .prod-label-text, .mod-label-text,
.man-label-text, .pf-label-text,
#contato .lbl-txt, #contato .section-tag,
#contato .ct-info-tag, #contato .form-tag {
  font-size: 10.5px;
  letter-spacing: 0.3em;
  color: var(--red);
}

/* Section title scale */
#quem-somos .qs-title,
#produtos   .prod-title,
#modernizacao .mod-title,
#manutencao  .man-title,
#portfolio   .pf-title,
#contato     .ct-h1 {
  font-size: clamp(34px, 4vw, 58px);
  letter-spacing: -0.02em;
  line-height: 0.92;
}

/* ── STATS NUMBERS — Gradient accent ────────────────────────── */
#quem-somos .qs-ind-num,
#quem-somos .qs-band-num,
#manutencao .man-stat-num,
#portfolio  .pf-stat-num {
  font-size: clamp(38px,4.5vw,62px);
  letter-spacing: -0.025em;
  font-weight: 900;
}
/* Numeric accent span keeps red color */

/* ── CARD ELEVATION SYSTEM ───────────────────────────────────── */
#quem-somos .qs-ind-item,
#quem-somos .qs-valor-card,
#produtos   .prod-card,
#modernizacao .mod-benefit-card,
#modernizacao .kit-card,
#manutencao  .man-stat,
#manutencao  .man-service-card,
#portfolio   .pf-card,
#portfolio   .pf-dep-card,
#contato     .wa-card,
#contato     .quick-card {
  transition:
    background var(--t2) var(--ease-out),
    transform  var(--t2) var(--ease-spring),
    box-shadow var(--t2) var(--ease-out);
  will-change: transform;
}

#quem-somos .qs-ind-item:hover,
#quem-somos .qs-valor-card:hover,
#produtos   .prod-card:hover,
#modernizacao .mod-benefit-card:hover,
#modernizacao .kit-card:hover,
#manutencao  .man-stat:hover,
#manutencao  .man-service-card:hover,
#portfolio   .pf-card:hover,
#portfolio   .pf-dep-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
}
#contato .wa-card:hover,
#contato .quick-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-sm);
}

/* Product card image — deeper overlay */
#produtos .card-img-overlay {
  background: linear-gradient(to top,
    rgba(5,5,7,0.92) 0%,
    rgba(5,5,7,0.35) 55%,
    transparent 100%);
}

/* ── PRODUCT CARD grid gap refinement ───────────────────────── */
#produtos .prod-grid,
#produtos .prod-grid-bottom {
  gap: 1px;
  border-radius: 6px;
  overflow: hidden;
  background: rgba(255,255,255,0.04);
}
#produtos .prod-card { background: var(--s2); }
#produtos .prod-card:hover { background: var(--s3); }

/* ── IMAGE BADGES — Glassmorphism ───────────────────────────── */
#quem-somos .qs-img-badge,
#manutencao .man-img-badge {
  background: rgba(5,5,7,0.88);
  border-color: var(--bd-red);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-radius: 5px;
}

/* ── MODAL — Premium glass ───────────────────────────────────── */
.tes-modal-backdrop {
  background: rgba(0,0,0,0.88);
  backdrop-filter: blur(12px) saturate(1.4);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
}
.tes-modal {
  background: var(--s2);
  border: 1px solid var(--bd);
  border-top: 2px solid var(--red);
  border-radius: 6px;
  box-shadow: 0 32px 80px rgba(0,0,0,0.7), 0 1px 0 var(--bd-hi);
}
#contato .modal-back { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
#contato .modal-box {
  background: var(--s2);
  border-radius: 6px;
  border-top: 2px solid var(--red);
  box-shadow: 0 24px 64px rgba(0,0,0,0.65);
}

/* ── FORM FOCUS — Refined ───────────────────────────────────── */
#contato .f-field input,
#contato .f-field select,
#contato .f-field textarea,
.mf-field input,
.mf-field select,
.mf-field textarea {
  background: rgba(255,255,255,0.025);
  border-color: rgba(255,255,255,0.07);
  border-radius: 4px;
  transition:
    border-color var(--t2) var(--ease-out),
    background   var(--t2) var(--ease-out),
    box-shadow   var(--t2) var(--ease-out);
}
#contato .f-field input:focus,
#contato .f-field select:focus,
#contato .f-field textarea:focus,
.mf-field input:focus,
.mf-field select:focus,
.mf-field textarea:focus {
  border-color: var(--red);
  background: rgba(200,32,42,0.04);
  box-shadow: 0 0 0 3px rgba(200,32,42,0.12);
  outline: none;
}

/* ── BUTTONS — Global glow refinement ───────────────────────── */
/* Primary CTA buttons */
#hero .btn-orcamento,
.modal-btn-primary,
#modernizacao .mod-btn-primary,
#manutencao .btn-primary,
#contato .btn-send,
.btn-modal-send {
  border-radius: 5px;
  box-shadow: 0 2px 12px var(--red-glow);
  transition:
    background   var(--t2) var(--ease-out),
    box-shadow   var(--t2) var(--ease-out),
    transform    var(--t2) var(--ease-spring),
    border-color var(--t2) var(--ease-out);
}
#hero .btn-orcamento:hover,
.modal-btn-primary:hover,
#modernizacao .mod-btn-primary:hover,
#manutencao .btn-primary:hover,
#contato .btn-send:hover,
.btn-modal-send:hover {
  box-shadow: var(--sh-red);
  transform: translateY(-2px);
}

/* Ghost/outline buttons */
#hero .btn-solucoes,
.modal-btn-secondary,
#modernizacao .mod-btn-secondary,
#manutencao .btn-outline,
#produtos .card-btn,
#modernizacao .kit-btn {
  border-radius: 5px;
  transition:
    border-color var(--t2) var(--ease-out),
    color        var(--t2) var(--ease-out),
    background   var(--t2) var(--ease-out),
    transform    var(--t2) var(--ease-spring);
}
#hero .btn-solucoes:hover,
.modal-btn-secondary:hover,
#modernizacao .mod-btn-secondary:hover,
#manutencao .btn-outline:hover,
#produtos .card-btn:hover,
#modernizacao .kit-btn:hover {
  transform: translateY(-2px);
}

/* ── FILTER BUTTONS — Portfolio ─────────────────────────────── */
#portfolio .pf-filter-btn {
  border-radius: 20px;
  transition: all var(--t2) var(--ease-out);
}
#portfolio .pf-filter-btn:hover {
  border-color: var(--red);
  color: #fff;
  background: rgba(200,32,42,0.08);
}
#portfolio .pf-filter-btn.active {
  background: var(--red);
  border-color: var(--red);
  box-shadow: 0 4px 16px var(--red-glow);
}

/* ── PORTFOLIO CARDS ─────────────────────────────────────────── */
#portfolio .pf-spec-tag.cap {
  background: rgba(200,32,42,0.15);
  color: #f05060;
  border: 1px solid rgba(200,32,42,0.3);
}
#portfolio .pf-spec-tag.other {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.07);
}

/* ── TESTIMONIAL CARDS — More impactful ─────────────────────── */
#portfolio .pf-dep-quote-mark {
  font-size: 96px;
  color: rgba(200,32,42,0.12);
  line-height: 0.8;
}
#portfolio .pf-dep-text {
  color: rgba(255,255,255,0.72);
  font-size: 14.5px;
}

/* ── WHATSAPP CARDS ──────────────────────────────────────────── */
#contato .wa-icon {
  border-radius: 6px;
  background: rgba(37,211,102,0.08);
  border-color: rgba(37,211,102,0.2);
}
#contato .wa-card:hover .wa-icon {
  background: rgba(37,211,102,0.15);
  box-shadow: 0 4px 20px rgba(37,211,102,0.12);
}

/* ── BENEFIT ICONS ───────────────────────────────────────────── */
#modernizacao .mod-benefit-icon,
#manutencao   .man-service-icon,
#contato      .quick-icon,
#contato      .info-ico,
.modal-ico {
  border-radius: 6px;
  transition: background var(--t2), box-shadow var(--t2);
}
#modernizacao .mod-benefit-card:hover .mod-benefit-icon,
#manutencao .man-service-card:hover  .man-service-icon,
#contato .quick-card:hover           .quick-icon {
  background: rgba(200,32,42,0.2);
  box-shadow: 0 4px 16px rgba(200,32,42,0.15);
}

/* ── SECTION CTA BANDS ───────────────────────────────────────── */
#modernizacao .mod-cta-band,
#manutencao   .man-cta-band {
  border-radius: 6px;
  border-color: var(--bd);
  overflow: hidden;
}

/* ── NORMA / BADGE CHIPS ─────────────────────────────────────── */
#produtos .norma-badge {
  border-radius: 20px;
  background: rgba(200,32,42,0.08);
  border-color: rgba(200,32,42,0.22);
}

/* ── SEGMENT PILLS — Hero-style ─────────────────────────────── */
#produtos .seg-pill,
#hero .pill {
  border-radius: 20px;
  transition: border-color var(--t2), color var(--t2), background var(--t2);
}
#produtos .seg-pill:hover,
#hero .pill:hover {
  background: rgba(200,32,42,0.08);
}

/* ── VALOR / INDICATOR CARDS ─────────────────────────────────── */
#quem-somos .qs-valor-card,
#quem-somos .qs-ind-item {
  background: var(--s3);
}
#quem-somos .qs-valor-card:hover,
#quem-somos .qs-ind-item:hover {
  background: var(--s4);
}
#quem-somos .qs-indicators,
#quem-somos .qs-valores-grid {
  background: rgba(255,255,255,0.035);
}

/* ── QUICK GRID: 2 cards centrados ──────────────────────────── */
#contato .quick-grid {
  grid-template-columns: repeat(2, 1fr);
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
}

/* ── FILE INPUT ──────────────────────────────────────────────── */
.mf-file-hint {
  font-size: 11px;
  font-weight: 400;
  color: rgba(255,255,255,0.3);
  margin-left: 6px;
}
.mf-file-input {
  display: none;
}
.mf-file-label {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  margin-top: 4px;
}
.mf-file-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: rgba(204,32,32,0.1);
  border: 1px solid rgba(204,32,32,0.3);
  border-radius: 2px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--red);
  white-space: nowrap;
  transition: background 0.2s;
}
.mf-file-btn svg {
  stroke: var(--red);
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}
.mf-file-label:hover .mf-file-btn {
  background: rgba(204,32,32,0.2);
}
.mf-file-name {
  font-size: 12px;
  color: rgba(255,255,255,0.4);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── MAP WRAP ────────────────────────────────────────────────── */
#quem-somos .qs-map-header {
  margin-top: 20px;
}

#quem-somos .qs-map-svg-wrap {
  background: var(--s3);
  border-color: var(--bd);
  border-radius: 5px;
}

/* ── CARD GRID BACKGROUNDS ───────────────────────────────────── */
#modernizacao .mod-benefits-grid,
#modernizacao .mod-kits-grid,
#manutencao   .man-services-grid,
#manutencao   .man-stats,
#portfolio    .pf-dep-grid,
#contato      .quick-grid,
#contato      .wa-grid,
#contato      .ct-bottom {
  background: rgba(255,255,255,0.03);
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--bd);
}
/* inner cards */
#modernizacao .mod-benefit-card,
#modernizacao .kit-card,
#manutencao   .man-service-card,
#manutencao   .man-stat,
#portfolio    .pf-dep-card,
#contato      .quick-card,
#contato      .wa-card,
#contato      .ct-info,
#contato      .ct-form-wrap {
  background: var(--s2);
}
#modernizacao .mod-benefit-card:hover,
#modernizacao .kit-card:hover,
#manutencao   .man-service-card:hover,
#manutencao   .man-stat:hover,
#portfolio    .pf-dep-card:hover {
  background: var(--s3);
}
#contato .wa-card:hover  { background: var(--s3); }
#contato .quick-card:hover { background: var(--s3); }

/* ── QUEM SOMOS IMAGE SECTION ────────────────────────────────── */
#quem-somos .qs-img-wrap {
  border-radius: 5px;
  overflow: hidden;
  box-shadow: var(--sh-md);
}
#quem-somos .qs-img-wrap::after { height: 2px; }

/* ── MODAL CLOSE BTN ─────────────────────────────────────────── */
.modal-close {
  border-radius: 5px;
  transition: background var(--t1), border-color var(--t1);
}
.modal-x {
  border-radius: 4px;
  transition: background var(--t1), color var(--t1);
}

/* ── BOTTOM BAND STATS ───────────────────────────────────────── */
#quem-somos .qs-bottom-band img {
  filter: saturate(0.6) brightness(0.6);
}

/* ── PAGINAÇÃO/DIVIDER ───────────────────────────────────────── */
#produtos .prod-divider {
  background: linear-gradient(90deg,
    var(--red) 0%,
    rgba(200,32,42,0.3) 25%,
    rgba(255,255,255,0.04) 60%,
    transparent 100%);
  height: 1px;
}

/* ── HERO SCANLINE — More subtle ────────────────────────────── */
#hero .hero-scanline {
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(200,32,42,0.45) 50%,
    transparent 100%);
}

/* ── HERO GRID — Refined ────────────────────────────────────── */
#hero .hero-grid {
  background-image:
    linear-gradient(rgba(200,32,42,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(200,32,42,0.03) 1px, transparent 1px);
  background-size: 72px 72px;
}

/* ── HERO BOTTOM LINE ────────────────────────────────────────── */
#hero .hero-bottom-line {
  height: 2px;
  background: linear-gradient(90deg,
    var(--red) 0%,
    rgba(200,32,42,0.4) 60%,
    transparent 100%);
}

/* ── SPEC TAGS (Modal) ───────────────────────────────────────── */
.modal-spec { background: var(--s3); }
.modal-specs { background: rgba(255,255,255,0.03); border-radius: 4px; }
.modal-catalog { background: var(--s3); border-radius: 5px; }

/* ── CONTATO INFO/FORM PADDING ───────────────────────────────── */
#contato .ct-info,
#contato .ct-form-wrap { border-radius: 0; }

/* ── SCROLL TOP BTN ─────────────────────────────────────────── */
#scroll-top-btn { border-radius: 6px; }

/* ── FOCUSABLE ELEMENTS ─────────────────────────────────────── */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 3px;
  border-radius: 3px;
}

/* ── INTERSECTION OBSERVER — Animation classes ──────────────── */
[data-reveal] {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity  var(--t3) var(--ease-spring),
    transform var(--t3) var(--ease-spring);
}
[data-reveal].revealed {
  opacity: 1;
  transform: none;
}
[data-reveal][data-delay="1"] { transition-delay: 80ms; }
[data-reveal][data-delay="2"] { transition-delay: 160ms; }
[data-reveal][data-delay="3"] { transition-delay: 240ms; }
[data-reveal][data-delay="4"] { transition-delay: 320ms; }
[data-reveal][data-delay="5"] { transition-delay: 400ms; }

/* ── PREFERS REDUCED MOTION ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  [data-reveal] { opacity: 1; transform: none; }
}

/* ── TIPOS DE MANUTENÇÃO ─────────────────────────────────────── */
.man-tipos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  margin: 48px 0;
}
.man-tipos-card {
  background: var(--s2);
  border: 1px solid var(--bd);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  overflow: hidden;
}
.man-tipos-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--red);
}
.man-tipos-indireta::before {
  background: linear-gradient(90deg, var(--red), #7c0d14);
}
.man-tipos-icon {
  width: 44px; height: 44px;
  background: rgba(204,32,32,.12);
  border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  color: var(--red);
}
.man-tipos-icon svg { width: 22px; height: 22px; }
.man-tipos-label {
  font-size: 10px; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--red);
}
.man-tipos-title {
  font-size: 20px; font-weight: 800; color: #fff;
  line-height: 1.2; margin: 0;
}
.man-tipos-desc {
  font-size: 13px; color: rgba(255,255,255,.58);
  line-height: 1.65; margin: 0;
}
.man-tipos-list {
  list-style: none; margin: 8px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.man-tipos-list li {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: rgba(255,255,255,.7);
}
.man-tipos-list svg { width: 12px; height: 12px; flex-shrink: 0; }

@media (max-width: 640px) {
  .man-tipos { grid-template-columns: 1fr; }
}

/* ── LOJA TES ───────────────────────────────────────────────── */
.shop-section { background:transparent; }
.shop-inner { max-width:1280px; margin:0 auto; padding:100px clamp(24px,5vw,80px) 80px; }

.shop-header { margin-bottom:48px; }
.shop-title { font-size:clamp(2rem,5vw,3.2rem); font-weight:900; line-height:.95; letter-spacing:-.02em; color:#fff; margin:16px 0 14px; }
.shop-title em { color:var(--red); font-style:normal; }
.shop-sub { color:rgba(255,255,255,.55); font-size:15px; max-width:520px; line-height:1.6; }

.shop-controls { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-bottom:36px; }
.shop-search-wrap { position:relative; flex:1; min-width:220px; max-width:380px; }
.shop-search-icon { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:rgba(255,255,255,.35); pointer-events:none; }
.shop-search { width:100%; background:var(--s2); border:1px solid var(--bd); border-radius:4px; padding:10px 14px 10px 36px; font-size:13px; color:#fff; outline:none; transition:border-color .2s; }
.shop-search::placeholder { color:rgba(255,255,255,.3); }
.shop-search:focus { border-color:var(--red); }

.shop-cats { display:flex; flex-wrap:wrap; gap:8px; }
.shop-cat { background:transparent; border:1px solid var(--bd); border-radius:20px; padding:6px 16px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.5); cursor:pointer; transition:all .2s; }
.shop-cat:hover { border-color:rgba(255,255,255,.3); color:rgba(255,255,255,.8); }
.shop-cat.active { background:var(--red); border-color:var(--red); color:#fff; }

.shop-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:2px; }

.shop-card { background:var(--s2); border:1px solid var(--bd); display:flex; flex-direction:column; transition:background .2s,border-color .2s; }
.shop-card:hover { background:var(--s3); border-color:rgba(204,32,32,.3); }
.shop-card-img { aspect-ratio:1/1; overflow:hidden; background:var(--s1); }
.shop-card-img img { width:100%;height:100%;object-fit:cover;transition:transform .4s; }
.shop-card:hover .shop-card-img img { transform:scale(1.04); }
.shop-card-body { padding:16px; display:flex; flex-direction:column; flex:1; gap:6px; }
.shop-card-name { font-size:13px; font-weight:700; color:#fff; line-height:1.3; }
.shop-card-cat { font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--red); }
.shop-card-desc { font-size:12px; color:rgba(255,255,255,.5); line-height:1.5; flex:1; }
.shop-card-price { font-size:16px; font-weight:800; color:#fff; }
.shop-card-price span { font-size:11px; font-weight:400; color:rgba(255,255,255,.4); }
.shop-add-btn { margin-top:auto; background:var(--red); border:none; border-radius:2px; padding:9px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#fff; cursor:pointer; transition:background .2s; display:flex; align-items:center; justify-content:center; gap:6px; }
.shop-add-btn:hover { background:var(--rdk); }
.shop-add-btn.added { background:#16a34a; }

.shop-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:80px 24px; gap:16px; text-align:center; }
.shop-empty svg { width:64px; height:64px; color:rgba(255,255,255,.12); }
.shop-empty p { font-size:18px; font-weight:700; color:rgba(255,255,255,.5); margin:0; }
.shop-empty span { font-size:13px; color:rgba(255,255,255,.3); line-height:1.6; }
.shop-empty-btn { display:inline-flex; align-items:center; gap:8px; background:#25D366; border-radius:4px; padding:11px 22px; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#fff; text-decoration:none; margin-top:8px; transition:background .2s; }
.shop-empty-btn:hover { background:#1ebe5d; }

/* ── CARRINHO DRAWER ── */
.cart-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:1000; backdrop-filter:blur(4px); }
.cart-backdrop.open { display:block; }
.cart-drawer { position:fixed; top:0; right:0; bottom:0; width:360px; max-width:95vw; background:var(--s1); border-left:1px solid var(--bd); z-index:1001; display:flex; flex-direction:column; transform:translateX(100%); transition:transform .3s ease; }
.cart-drawer.open { transform:none; }

.cart-head { display:flex; align-items:center; justify-content:space-between; padding:20px 20px; border-bottom:1px solid var(--bd); }
.cart-head-title { font-size:16px; font-weight:800; color:#fff; }
.cart-head-close { background:none; border:none; cursor:pointer; color:rgba(255,255,255,.5); padding:4px; transition:color .2s; }
.cart-head-close:hover { color:#fff; }
.cart-head-close svg { width:18px; height:18px; }

.cart-items { flex:1; overflow-y:auto; padding:12px; display:flex; flex-direction:column; gap:8px; }
.cart-item { background:var(--s2); border:1px solid var(--bd); border-radius:4px; padding:12px; display:flex; gap:12px; align-items:flex-start; }
.cart-item-img { width:52px; height:52px; border-radius:2px; overflow:hidden; background:var(--s3); flex-shrink:0; }
.cart-item-img img { width:100%;height:100%;object-fit:cover; }
.cart-item-info { flex:1; min-width:0; }
.cart-item-name { font-size:13px; font-weight:700; color:#fff; margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cart-item-price { font-size:12px; color:rgba(255,255,255,.5); }
.cart-item-qty { display:flex; align-items:center; gap:8px; margin-top:8px; }
.cart-qty-btn { width:26px; height:26px; background:var(--s3); border:1px solid var(--bd); border-radius:2px; color:#fff; cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; transition:background .2s; }
.cart-qty-btn:hover { background:var(--red); border-color:var(--red); }
.cart-qty-val { font-size:13px; font-weight:700; color:#fff; min-width:20px; text-align:center; }
.cart-item-remove { background:none; border:none; color:rgba(255,255,255,.25); cursor:pointer; padding:2px; font-size:16px; line-height:1; transition:color .2s; }
.cart-item-remove:hover { color:var(--red); }

.cart-footer { padding:16px; border-top:1px solid var(--bd); }
.cart-total-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; font-size:15px; font-weight:700; color:#fff; }
.cart-checkout-btn { width:100%; background:#25D366; border:none; border-radius:4px; padding:14px; font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; transition:background .2s; }
.cart-checkout-btn:hover { background:#1ebe5d; }

.cart-empty-state { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; color:rgba(255,255,255,.25); }
.cart-empty-state svg { width:48px; height:48px; }
.cart-empty-state p { font-size:14px; font-weight:600; margin:0; }

.cart-float-btn { position:fixed; bottom:100px; right:32px; z-index:899; width:52px; height:52px; border-radius:50%; background:var(--s2); border:1px solid var(--bd); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(0,0,0,.4); transition:background .2s,transform .2s; }
.cart-float-btn:hover { background:var(--s3); transform:scale(1.06); }
.cart-float-btn svg { width:22px; height:22px; }
.cart-float-badge { position:absolute; top:-4px; right:-4px; background:var(--red); color:#fff; font-size:10px; font-weight:800; border-radius:50%; width:18px; height:18px; display:flex; align-items:center; justify-content:center; }

@media (max-width:640px) {
  .shop-inner { padding-top:80px; }
  .shop-grid { grid-template-columns:repeat(2,1fr); }
}

/* ── CHATBOT FLUTUANTE ───────────────────────────────────────── */
#tes-chat-widget { position:fixed; bottom:32px; right:32px; z-index:900; }

#tes-chat-btn {
  width:58px; height:58px; border-radius:50%;
  background:#25D366; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,0.45);
  transition:transform .2s, box-shadow .2s;
  position:relative; color:#fff;
}
#tes-chat-btn:hover { transform:scale(1.08); box-shadow:0 6px 28px rgba(37,211,102,0.6); }
#tes-chat-btn svg { width:28px; height:28px; }

#tes-chat-badge {
  position:absolute; top:-3px; right:-3px;
  background:var(--red); color:#fff;
  font-size:10px; font-weight:700; border-radius:50%;
  width:18px; height:18px; display:flex; align-items:center; justify-content:center;
  animation:badgePulse 2s ease infinite;
}
@keyframes badgePulse {
  0%,100% { transform:scale(1); }
  50%      { transform:scale(1.2); }
}

#tes-chat-popup {
  display:none; position:absolute; bottom:70px; right:0;
  width:320px; background:var(--s1);
  border:1px solid var(--bd); border-radius:12px;
  box-shadow:0 16px 48px rgba(0,0,0,0.6);
  overflow:hidden; flex-direction:column;
}
#tes-chat-popup.open { display:flex; }

.tesc-header {
  background:#075E54; padding:14px 16px;
  display:flex; align-items:center; gap:12px;
}
.tesc-avatar {
  width:64px; height:64px; border-radius:50%;
  overflow:hidden; flex-shrink:0; background:#fff;
}
.tesc-avatar img {
  width:100%; height:100%; object-fit:cover;
  object-position:center 20%;
}
.tesc-name { font-size:14px; font-weight:700; color:#fff; }
.tesc-status { font-size:11px; color:rgba(255,255,255,.7); }

.tesc-messages {
  padding:16px; display:flex; flex-direction:column; gap:10px;
  max-height:240px; overflow-y:auto;
}
.tesc-msg {
  background:var(--s3); border-radius:8px 8px 8px 2px;
  padding:10px 14px; font-size:13px; color:rgba(255,255,255,.88);
  line-height:1.5; max-width:90%; animation:msgIn .25s ease;
}
@keyframes msgIn {
  from { opacity:0; transform:translateY(6px); }
  to   { opacity:1; transform:none; }
}
.tesc-msg strong { color:#fff; }

.tesc-options {
  padding:0 12px 14px; display:flex; flex-direction:column; gap:7px;
}
.tesc-opt {
  background:transparent; border:1px solid var(--bd);
  border-radius:20px; padding:9px 16px; cursor:pointer;
  font-size:12px; font-weight:600; color:rgba(255,255,255,.8);
  text-align:left; transition:background .2s, border-color .2s, color .2s;
}
.tesc-opt:hover { background:#25D366; border-color:#25D366; color:#fff; }
.tesc-opt-back { border-color:rgba(255,255,255,.15); color:rgba(255,255,255,.45); font-size:11px; }
.tesc-opt-back:hover { background:var(--s3); border-color:var(--bd); color:rgba(255,255,255,.7); }

@media (max-width:480px) {
  #tes-chat-widget { bottom:20px; right:16px; }
  #tes-chat-popup { width:calc(100vw - 32px); right:0; }
}

/* ── MODEL SELECTION OVERLAY ────────────────────────────────── */
.model-sel-backdrop {
  display: none;
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(0,0,0,0.82);
  backdrop-filter: blur(10px);
  align-items: center; justify-content: center;
  padding: 24px;
}
.model-sel-box {
  position: relative;
  background: var(--s2);
  border: 1px solid var(--bd);
  border-top: 2px solid var(--red);
  border-radius: 8px;
  padding: 40px 36px 36px;
  width: 100%; max-width: 660px;
  box-shadow: 0 32px 80px rgba(0,0,0,0.7);
}
.model-sel-close {
  position: absolute; top: 16px; right: 16px;
  background: none; border: none; cursor: pointer;
  color: rgba(255,255,255,0.5); padding: 6px;
  transition: color .2s;
}
.model-sel-close:hover { color: #fff; }
.model-sel-close svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 1.8; }
.model-sel-label {
  font-size: 10px; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--red); margin-bottom: 6px;
}
.model-sel-title {
  font-size: 22px; font-weight: 700; color: #fff;
  margin: 0 0 28px;
}
.model-sel-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 12px;
}
.model-sel-card {
  background: var(--s3); border: 1px solid var(--bd);
  border-radius: 6px; overflow: hidden; cursor: pointer;
  text-align: left; padding: 0; transition: border-color .2s, transform .2s;
  display: flex; flex-direction: column;
}
.model-sel-card:hover { border-color: var(--red); transform: translateY(-2px); }
.model-sel-card img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; object-position: center top; display: block;
}
.model-sel-card--luxury img { object-position: center 55%; }
.model-sel-card--luxury { border-color: rgba(200,168,50,0.3); }
.model-sel-card--luxury:hover { border-color: #c8a832; }
.model-sel-tier {
  font-size: 9px; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--red);
  padding: 12px 14px 2px;
}
.model-sel-tier--luxury { color: #c8a832; }
.model-sel-name {
  font-size: 13px; font-weight: 700; color: #fff;
  padding: 0 14px 4px;
}
.model-sel-abbr {
  font-size: 10px; color: rgba(255,255,255,.45);
  padding: 0 14px 14px;
}
/* ── LIGHTBOX ────────────────────────────────────────────────── */
.tes-lightbox {
  display: none;
  position: fixed; inset: 0; z-index: 1300;
  background: rgba(0,0,0,.92);
  backdrop-filter: blur(10px);
  align-items: center;
  justify-content: center;
}
.lb-img-wrap {
  max-width: 90vw;
  max-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lb-img-wrap img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 24px 80px rgba(0,0,0,.8);
  user-select: none;
}
.lb-close {
  position: absolute; top: 20px; right: 20px;
  width: 40px; height: 40px;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15);
  border-radius: 4px; cursor: pointer; color: rgba(255,255,255,.7);
  display: flex; align-items: center; justify-content: center;
  transition: background .2s, color .2s;
}
.lb-close:hover { background: rgba(204,32,32,.2); color: #fff; }
.lb-close svg { width: 16px; height: 16px; }
.lb-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 48px; height: 48px;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15);
  border-radius: 4px; cursor: pointer; color: rgba(255,255,255,.7);
  display: flex; align-items: center; justify-content: center;
  transition: background .2s, color .2s;
}
.lb-nav:hover { background: rgba(204,32,32,.25); color: #fff; border-color: var(--red); }
.lb-nav svg { width: 22px; height: 22px; }
.lb-prev { left: 20px; }
.lb-next { right: 20px; }
.lb-counter {
  position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
  font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.45); background: rgba(0,0,0,.4);
  padding: 5px 14px; border-radius: 20px;
  pointer-events: none;
}
@media (max-width: 640px) {
  .lb-prev { left: 8px; }
  .lb-next { right: 8px; }
}

/* ── MODAL GALLERY ───────────────────────────────────────────── */
.modal-gallery { margin-bottom: 24px; }
.modal-gallery-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 10px;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: rgba(204,32,32,.4) transparent;
}
.modal-gallery-strip::-webkit-scrollbar { height: 4px; }
.modal-gallery-strip::-webkit-scrollbar-track { background: transparent; }
.modal-gallery-strip::-webkit-scrollbar-thumb { background: rgba(204,32,32,.4); border-radius: 2px; }
.lb-thumb {
  flex-shrink: 0; scroll-snap-align: start;
  background: none; border: 1px solid rgba(255,255,255,.08);
  border-radius: 4px; padding: 0; cursor: pointer; overflow: hidden;
  transition: border-color .2s;
}
.lb-thumb:hover { border-color: var(--red); }
.lb-thumb img {
  height: 110px; width: auto; object-fit: cover; display: block;
  transition: opacity .2s;
}
.lb-thumb:hover img { opacity: .82; }

.model-sel-grid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 520px) {
  .model-sel-grid { grid-template-columns: 1fr; }
  .model-sel-grid--2 { grid-template-columns: 1fr; }
  .model-sel-box { padding: 32px 20px 24px; }
}

/* ── RESPONSIVE REFINEMENTS ─────────────────────────────────── */
@media (max-width: 768px) {
  #quem-somos .qs-title,
  #produtos   .prod-title,
  #modernizacao .mod-title,
  #manutencao  .man-title,
  #portfolio   .pf-title,
  #contato     .ct-h1 {
    font-size: clamp(28px, 5.5vw, 42px);
  }
  .nav-cta span { display: none; }
}
@media (max-width: 480px) {
  #hero .hero-headline .line1,
  #hero .hero-headline .line2,
  #hero .hero-headline .line3 {
    font-size: clamp(30px, 8vw, 46px);
    letter-spacing: -0.01em;
  }
  #quem-somos .qs-title,
  #produtos   .prod-title,
  #modernizacao .mod-title,
  #manutencao  .man-title,
  #portfolio   .pf-title,
  #contato     .ct-h1 {
    font-size: clamp(26px, 7vw, 36px);
  }
  /* Gradient text fallback for older iOS */
  #hero .hero-headline .line2 {
    -webkit-text-fill-color: var(--red);
    background: none;
  }
}

/* ── GRID FIXES — corrige especificidade ID vs classe ────────── */
/* style.css usa .grid sem ID nas media queries, mas base tem #section .grid   */
/* Resultado: especificidade base (110) > media query (010) → grids não colapsam */
/* Solução: replicar as regras com especificidade correta (ID+classe)            */
@media (max-width: 1024px) {
  #produtos     .prod-grid              { grid-template-columns: repeat(2, 1fr); }
  #produtos     .prod-grid-bottom       { grid-template-columns: repeat(2, 1fr); }
  #modernizacao .mod-kits-grid          { grid-template-columns: repeat(2, 1fr); }
  #manutencao   .man-services-grid      { grid-template-columns: repeat(2, 1fr); }
  #contato      .wa-grid                { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  #produtos     .prod-grid,
  #produtos     .prod-grid-bottom      { grid-template-columns: 1fr; }
  #modernizacao .mod-benefits-grid,
  #modernizacao .mod-kits-grid         { grid-template-columns: 1fr; }
  #manutencao   .man-stats             { grid-template-columns: 1fr 1fr; }
  #manutencao   .man-services-grid     { grid-template-columns: 1fr; }
  #contato      .wa-grid               { grid-template-columns: 1fr 1fr; }
  #contato      .quick-grid            { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  #contato      .wa-grid               { grid-template-columns: 1fr; }
  #contato      .quick-grid            { grid-template-columns: 1fr; }
  #contato      .ct-bottom             { grid-template-columns: 1fr; }
  #contato      .f-row                 { grid-template-columns: 1fr; }
  #manutencao   .man-stats             { grid-template-columns: 1fr; }
}

/* ── FOOTER ──────────────────────────────────────────────────── */
.tes-footer {
  background: rgba(5,2,3,0.92);
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: 0 clamp(24px,5vw,80px);
}

.tes-footer-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  padding: 48px 0 40px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

.tes-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer-logo {
  height: 44px;
  width: auto;
  align-self: flex-start;
}

.footer-tagline {
  font-size: 12px;
  color: rgba(255,255,255,0.28);
  letter-spacing: 0.06em;
}

.tes-footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 32px;
  justify-content: flex-end;
}

.tes-footer-nav a {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  text-decoration: none;
  transition: color 0.2s;
}

.tes-footer-nav a:hover {
  color: var(--red);
}

.tes-footer-bottom {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 0;
  font-size: 11px;
  color: rgba(255,255,255,0.22);
  letter-spacing: 0.04em;
}

.footer-cnpj {
  text-align: right;
}

@media (max-width: 768px) {
  .tes-footer-inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 0 32px;
  }
  .tes-footer-nav {
    justify-content: flex-start;
  }
  .tes-footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .footer-cnpj { text-align: left; }
}

/* ══════════════════════════════════════════════════════════════════
   RESPONSIVIDADE — NOTEBOOKS · TABLETS · SMARTPHONES
   Breakpoints: 1440 · 1280 · 1024 · 768 · 640 · 480 · 375 · 320
   ══════════════════════════════════════════════════════════════════ */

/* ── NOTEBOOK LARGO 1280px–1599px ─────────────────────────────── */
/* Reduz padding lateral do hero para conteúdo ocupar mais espaço  */
@media (min-width: 1280px) and (max-width: 1599px) {
  #hero .hero-content {
    padding: 0 clamp(32px, 4vw, 64px);
  }
  #hero .hero-stats {
    left: clamp(32px, 4vw, 64px);
  }
}

/* ── NOTEBOOK PEQUENO / TABLET LANDSCAPE 1024px–1279px ─────────── */
@media (min-width: 1024px) and (max-width: 1279px) {
  #hero .hero-content {
    padding: 0 clamp(28px, 3.5vw, 52px);
    max-width: 100%;
  }
  #hero .hero-stats {
    left: clamp(28px, 3.5vw, 52px);
  }
  /* Seções — padding lateral mais compacto */
  .qs-inner, .prod-inner, .mod-inner, .man-inner, .pf-inner {
    padding-left: clamp(20px, 3.5vw, 52px);
    padding-right: clamp(20px, 3.5vw, 52px);
  }
}

/* ── TABLET 768px–1023px ──────────────────────────────────────── */
@media (max-width: 1023px) {
  section#hero {
    min-height: 560px;
    padding-bottom: 100px;
  }
  #hero .hero-content {
    padding: 0 clamp(20px, 4vw, 40px);
    max-width: 100%;
  }
  #hero .hero-sub {
    max-width: 90%;
  }
  #hero .hero-stats {
    left: clamp(20px, 4vw, 40px);
    gap: 24px;
  }
  /* Overlay mais opaco para garantir legibilidade em telas menores */
  #hero .hero-overlay {
    background: linear-gradient(
      105deg,
      rgba(5,5,7,0.98) 0%,
      rgba(5,5,7,0.92) 35%,
      rgba(5,5,7,0.70) 55%,
      rgba(5,5,7,0.40) 72%,
      rgba(5,5,7,0.18) 88%,
      rgba(5,5,7,0.06) 100%
    ) !important;
  }
}

/* ── TABLET PORTRAIT 640px–767px ────────────────────────────────  */
@media (max-width: 767px) {
  section#hero {
    min-height: 100dvh;
    padding-bottom: 90px;
    align-items: flex-end;
    padding-top: 88px;
  }
  #hero .hero-content {
    padding: 0 clamp(18px, 5vw, 32px);
    padding-bottom: 12px;
  }
  #hero .hero-sub {
    max-width: 100%;
    font-size: clamp(13px, 2.2vw, 16px);
  }
  #hero .hero-stats {
    left: clamp(18px, 5vw, 32px);
    bottom: 16px;
    gap: 18px;
  }
  #hero .btn-orcamento,
  #hero .btn-solucoes {
    padding: 13px 22px;
    font-size: 12px;
  }
}

/* ── SMARTPHONE 480px–639px ──────────────────────────────────── */
@media (max-width: 639px) {
  section#hero {
    padding-top: 100px;   /* navbar=90px + 10px de respiro */
    padding-bottom: 80px;
  }
  #hero .hero-content {
    padding: 0 clamp(16px, 5vw, 24px);
  }
  #hero .hero-stats {
    left: clamp(16px, 5vw, 24px);
    bottom: 14px;
    gap: 14px;
  }
  #hero .hero-cta {
    width: 100%;
  }
  #hero .btn-orcamento,
  #hero .btn-solucoes {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
  #hero .hero-pills {
    gap: 5px;
  }
  #hero .pill {
    font-size: 10px;
    padding: 6px 10px;
  }
  /* Seções — padding mínimo */
  .qs-inner, .prod-inner, .mod-inner, .man-inner, .pf-inner {
    padding-left: clamp(16px, 4.5vw, 24px);
    padding-right: clamp(16px, 4.5vw, 24px);
  }
}

/* ── SMARTPHONE PEQUENO ≤ 479px ──────────────────────────────── */
@media (max-width: 479px) {
  section#hero {
    min-height: 100svh;
    padding-top: 100px;   /* navbar=90px + 10px de respiro */
    padding-bottom: 70px;
    align-items: flex-start; /* coluna: alinha à esquerda, não à direita */
  }
  #hero .hero-content {
    padding: 0 16px;
  }
  #hero .hero-stats {
    left: 16px;
    bottom: 12px;
    gap: 12px;
  }
  #hero .stat-num {
    font-size: clamp(22px, 6vw, 32px);
  }
  #tes-navbar {
    padding: 0 16px;
  }
  /* Seções — padding mínimo absoluto */
  .qs-inner, .prod-inner, .mod-inner, .man-inner, .pf-inner {
    padding-left: 16px;
    padding-right: 16px;
  }
  .shop-inner {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* ── EYEBROW TEXT — cabe em uma linha em iPhones e Androids ─────── */
/* Navbar=90px; sem essa redução o texto "GUAÍBA · RS · ATUAÇÃO…"   */
/* quebra em 2 linhas por causa do letter-spacing de 0.22em.         */
@media (max-width: 639px) {
  #hero .eyebrow-text {
    font-size: 10px;
    letter-spacing: 0.1em;
  }
  #hero .hero-eyebrow {
    margin-bottom: 8px;
  }
}

/* ── TELA MUITO PEQUENA ≤ 375px ──────────────────────────────── */
@media (max-width: 375px) {
  #hero .hero-content { padding: 0 14px; }
  #hero .hero-stats   { left: 14px; gap: 10px; }
  #hero .hero-pills   { display: none; }
  #tes-navbar         { padding: 0 14px; }
  .qs-inner, .prod-inner, .mod-inner, .man-inner, .pf-inner {
    padding-left: 14px;
    padding-right: 14px;
  }
}

/* ── TOQUE — tamanhos mínimos de alvo ────────────────────────── */
@media (max-width: 1023px) {
  /* Garante área mínima de toque de 44px em todos os dispositivos */
  .nav-link, #nav-drawer .nav-link { min-height: 44px; display: flex; align-items: center; }
  #hero .btn-orcamento,
  #hero .btn-solucoes  { min-height: 44px; }
  .pill                { min-height: 36px; }
  #scroll-top-btn      { width: 44px; height: 44px; }
  #tes-chat-btn        { width: 52px; height: 52px; }
}

/* ── LANDSCAPE MOBILE (altura < 500px) ───────────────────────── */
@media (max-height: 500px) and (orientation: landscape) {
  section#hero {
    height: auto;
    min-height: 100vw;
    padding-top: 70px;
    padding-bottom: 60px;
    align-items: flex-start;
  }
  #hero .hero-headline .line1,
  #hero .hero-headline .line2,
  #hero .hero-headline .line3 {
    font-size: clamp(28px, 5vh, 42px);
  }
  #hero .hero-pills { display: none; }
  #hero .scroll-indicator { display: none; }
}

/* ── KIT DETAIL MODAL ────────────────────────────────────────── */
.kit-modal-backdrop {
  display: none;
  position: fixed; inset: 0; z-index: 1200;
  background: rgba(5,2,3,0.82);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.kit-modal-backdrop.open {
  display: flex;
}
.kit-modal-box {
  position: relative;
  background: #120d0e;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 48px 44px 40px;
  max-width: 600px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(204,32,32,.4) transparent;
}
.kit-modal-box::-webkit-scrollbar { width: 4px; }
.kit-modal-box::-webkit-scrollbar-track { background: transparent; }
.kit-modal-box::-webkit-scrollbar-thumb { background: rgba(204,32,32,.4); border-radius: 2px; }
.kit-modal-close {
  position: absolute; top: 18px; right: 18px;
  width: 36px; height: 36px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: rgba(255,255,255,0.6);
  transition: background .2s, color .2s;
}
.kit-modal-close:hover { background: rgba(204,32,32,.2); color: #fff; }
.kit-modal-eyebrow {
  font-size: 11px; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; color: var(--red);
  margin-bottom: 10px;
}
.kit-modal-name {
  font-size: clamp(22px, 3.5vw, 30px); font-weight: 700;
  color: #fff; letter-spacing: -.02em;
  line-height: 1.15; margin-bottom: 18px;
}
.kit-modal-desc {
  font-size: 15px; line-height: 1.65;
  color: rgba(255,255,255,0.62);
  margin-bottom: 28px;
}
.kit-modal-section-label {
  font-size: 10px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(255,255,255,0.3);
  margin-bottom: 14px;
}
.kit-modal-items {
  list-style: none; padding: 0; margin: 0 0 36px;
  display: flex; flex-direction: column; gap: 10px;
}
.kit-modal-items li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 14px; color: rgba(255,255,255,0.72); line-height: 1.5;
}
.kit-modal-items li::before {
  content: '';
  flex-shrink: 0;
  margin-top: 6px;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--red);
}
.kit-modal-note {
  font-size: 13px;
  color: rgba(255,255,255,0.38);
  line-height: 1.55;
  margin-bottom: 24px;
  padding: 12px 14px;
  background: rgba(255,255,255,0.04);
  border-left: 2px solid var(--red);
  border-radius: 0 6px 6px 0;
}
.kit-modal-note strong { color: rgba(255,255,255,0.58); font-weight: 600; }
.kit-modal-footer {
  display: flex; gap: 12px; align-items: center;
  flex-wrap: wrap;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.07);
}
.kit-modal-cta {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--red); color: #fff;
  padding: 13px 24px;
  border-radius: 8px;
  font-size: 14px; font-weight: 600; letter-spacing: .02em;
  text-decoration: none;
  transition: background .2s, transform .15s;
  flex: 1; justify-content: center;
}
.kit-modal-cta:hover { background: #a81818; transform: translateY(-1px); }
.kit-modal-cta svg { width: 14px; height: 14px; }
.kit-modal-close-btn {
  padding: 13px 20px;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;
  color: rgba(255,255,255,0.5);
  font-size: 14px; font-weight: 500;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.kit-modal-close-btn:hover { background: rgba(255,255,255,0.06); color: #fff; }
@media (max-width: 520px) {
  .kit-modal-box { padding: 40px 20px 28px; }
  .kit-modal-cta { flex: 1 0 100%; }
  .kit-modal-close-btn { flex: 1 0 100%; text-align: center; }
}