/* ============================================================
   Transporte GYG — Estilos base
   Reset, tipografía base, animaciones del asistente y mapa.
   Nota: el layout de las secciones usa estilos inline en index.html
   (se pueden migrar a clases aquí si se desea).
   ============================================================ */

*{ box-sizing:border-box; margin:0; padding:0; }
  html{ scroll-behavior:smooth; }
  body{ font-family:'Public Sans',system-ui,sans-serif; background:#16130F; color:#EDE4D6; -webkit-font-smoothing:antialiased; }
  ::selection{ background:#E58234; color:#16130F; }
  @keyframes gygrise{ from{ opacity:0; transform:translateY(24px);} to{ opacity:1; transform:translateY(0);} }
  input,select,textarea{ font-family:inherit; }
  @keyframes gygBlink{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.06); } }
  @keyframes gygTyping{ 0%{ opacity:.25; } 20%{ opacity:1; } 100%{ opacity:.25; } }
  @keyframes gygPop{ from{ opacity:0; transform:translateY(14px) scale(.96); } to{ opacity:1; transform:translateY(0) scale(1); } }
  @keyframes gygSonar{ 0%{ transform:scale(.85); opacity:.9; } 55%{ opacity:.4; } 100%{ transform:scale(5.4); opacity:0; } }
  @keyframes gygCore{ 0%,100%{ transform:scale(1); filter:brightness(1); } 50%{ transform:scale(1.18); filter:brightness(1.35); } }
  .gyg-pin:hover .gyg-tip{ opacity:1 !important; transform:translateX(-50%) translateY(-4px) !important; }
  #gyg-chat-panel::-webkit-scrollbar{ width:7px; } #gyg-chat-msgs::-webkit-scrollbar{ width:7px; }
  #gyg-chat-msgs::-webkit-scrollbar-thumb{ background:rgba(229,130,52,.3); border-radius:10px; }

  /* Tarjetas de Servicios (01) — hover leve y elegante */
  .gyg-service-card{ transition:transform .28s ease, box-shadow .28s ease; will-change:transform; }
  .gyg-service-card:hover{ transform:translateY(-6px); box-shadow:0 16px 38px rgba(0,0,0,.45), 0 0 0 1px rgba(229,130,52,.4); }
  @media (prefers-reduced-motion: reduce){
    .gyg-service-card{ transition:none; }
    .gyg-service-card:hover{ transform:none; }
  }

  /* Formularios — evita que los inputs se desborden del recuadro en móvil
     (en CSS grid, los inputs traen min-width:auto y no encogen) */
  #gyg-form-cotizacion input, #gyg-form-contacto input{ min-width:0; width:100%; }

  /* ===== Carrusel (Testimonios 06): auto-desplazamiento + arrastre ===== */
  /* Estado base (sin JS o reduced-motion): fila deslizable, no se rompe */
  .gyg-carousel{ position:relative; overflow-x:auto; scrollbar-width:none; }
  .gyg-carousel::-webkit-scrollbar{ display:none; }
  .gyg-carousel__track{ display:flex; gap:18px; align-items:stretch; }
  .gyg-carousel__track > *{ flex:0 0 min(300px, 78vw); }
  /* Activado por JS: la posición la controla carousel.js (transform) */
  .gyg-carousel.is-ready{ overflow:hidden; cursor:grab; user-select:none; touch-action:pan-y;
    -webkit-mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
            mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
  .gyg-carousel.is-ready .gyg-carousel__track{ width:max-content; will-change:transform; }
  .gyg-carousel.is-grabbing{ cursor:grabbing; }
  @media (prefers-reduced-motion: reduce){
    .gyg-carousel{ overflow-x:auto; }
  }