/* ===== RESPONSIVE ===== */

/* ≤ 1200px — laptop pequeño */
@media (max-width: 1200px) {
  .ft-main { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .pqn-grid { grid-template-columns: repeat(2, 1fr); }
  .val-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ≤ 992px — tablet horizontal / laptop pequeño */
@media (max-width: 992px) {
  .hero-inner { grid-template-columns: 1fr; }
  .seo-card { display: none; }
  .hero-proof { gap: 1.5rem; }
  .prob-cards { margin-top: 1.5rem; }
  .problema-inner { grid-template-columns: 1fr; gap: 2rem; }
  .porque-grid { grid-template-columns: 1fr; }
  .garantias { grid-template-columns: 1fr; gap: 1.5rem; }
  .gar-item:not(:last-child) {
    border-right: none;
    border-bottom: 1px solid rgba(253,250,244,0.08);
    padding-bottom: 1.5rem;
  }
  .proceso .container { grid-template-columns: 1fr; }
  .serv-grid { grid-template-columns: 1fr; max-width: 400px; margin: 0 auto; }
  .plans-grid { grid-template-columns: 1fr; max-width: 400px; margin: 0 auto; }
  .sds-item { grid-template-columns: 1fr; gap: 1.5rem; }
  .sds-item.rev { direction: ltr; }
  .pqn-grid { grid-template-columns: 1fr; }
  .ai-inner { grid-template-columns: 1fr; }
  .val-grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .contact-grid { grid-template-columns: 1fr; }
  .art-layout { grid-template-columns: 1fr; }
  .art-sidebar { position: static; }
  .ft-main { grid-template-columns: 1fr 1fr; }
}

/* ≤ 768px — tablet / móvil grande */
@media (max-width: 768px) {
  .nav-links { display: none; }
  .nav-cta { display: none; }
  .nav-hamburger {
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
  }
  .nav-hamburger span {
    width: 20px; height: 2px;
    background: rgba(253,250,244,0.6);
    border-radius: 2px;
    transition: all 0.3s;
  }
  .nav-hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(4px, 4px); }
  .nav-hamburger.active span:nth-child(2) { opacity: 0; }
  .nav-hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(4px, -4px); }
  .nav-links.open {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 56px;
    left: 0;
    right: 0;
    background: var(--nav);
    padding: 1rem 0;
    border-bottom: 1px solid rgba(196,101,42,0.18);
    z-index: 199;
  }
  .nav-links.open a {
    height: auto;
    padding: 0.7rem 2.5rem;
    border-bottom: none;
    border-left: 2px solid transparent;
  }
  .nav-links.open a:hover,
  .nav-links.open a.active {
    border-left-color: var(--clay);
    border-bottom-color: transparent;
  }

  .container { padding: 1.5rem; }
  .hero-inner { padding: 2rem 1.5rem; }
  .hero-ticker { padding: 0.4rem 2.5rem; }
  .ticker-label { flex-shrink: 0; }
  .ticker-items { animation-duration: 10s; }
  .trust-bar { padding: 1rem 1.5rem; flex-direction: column; align-items: flex-start; }
  .trust-sep { display: none; }
  .problema { padding: 1.5rem; }
  .cta-final { padding: 2rem 1.5rem; }
  .sds-list { padding: 1.5rem; }
  .ph { padding: 2rem 1.5rem; }
  .art-layout { padding: 1.5rem; }
  .ctable { font-size: 0.7rem; }
  .ctable th, .ctable td { padding: 0.5rem; }
  .hero-proof { gap: 1rem; flex-wrap: wrap; }
  .proof-item .num { font-size: 1.4rem; }
  .ft-main { grid-template-columns: 1fr 1fr; gap: 1rem; padding: 1.8rem 1.5rem; }
  .ft-main > :first-child { grid-column: 1 / -1; }
  .ft-main > :last-child { grid-column: 1 / -1; }
  .ft-bottom { padding: 1rem 1.5rem; flex-direction: column; }
  .plan.pop { margin-top: 0; }
}

/* ≤ 576px — móvil pequeño */
@media (max-width: 576px) {
  html { font-size: 15px; }
  nav { padding: 0 1.2rem; }
  .hero-ticker { padding: 0.4rem 1.2rem; }
  .ph { padding: 1.5rem 1.2rem; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
  .stat-dark .big { font-size: 2rem; }
  .team-grid { grid-template-columns: 1fr; }
  .bf { font-size: 0.65rem; padding: 0.25rem 0.7rem; }
}

/* ===== SCROLL REVEAL ===== */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal--left { opacity: 0; transform: translateX(-30px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal--left.visible { opacity: 1; transform: translateX(0); }
.reveal--right { opacity: 0; transform: translateX(30px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal--right.visible { opacity: 1; transform: translateX(0); }
.reveal--scale { opacity: 0; transform: scale(0.95); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal--scale.visible { opacity: 1; transform: scale(1); }
.reveal-stagger .reveal-item { opacity: 0; transform: translateY(20px); }
.reveal-stagger .reveal-item.visible { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal--left, .reveal--right, .reveal--scale,
  .reveal-item, .ticker-items { transition: none !important; animation: none !important; }
  .reveal, .reveal--left, .reveal--right, .reveal--scale,
  .reveal-item { opacity: 1; transform: none; }
}

/* ===== WHATSAPP FLOATING ===== */
.whatsapp-float {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 300;
  width: 52px;
  height: 52px;
  background: #25D366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px rgba(37,211,102,0.3);
  transition: transform 0.2s;
}
.whatsapp-float:hover { transform: scale(1.1); background: #1da051; }
.whatsapp-float svg { width: 26px; height: 26px; fill: white; }


