/* GEMARC · iPhone e iPad (2026-09-28): arreglos de la auditoría táctil + punch en móvil.
   Va el último: gana a styles.css, punch.css y extras.css. */

/* ---------- Obra: la regla «.obra-grid .obra-card:nth-child(n)» ganaba a las de móvil y dejaba 3 columnas de 110 px ---------- */
@media (min-width: 701px) and (max-width: 980px) {
  .obra-grid .obra-card:nth-child(n), .obra-grid .obra-card.obra-wide:nth-child(n) { grid-column: span 6; }
  .obra-grid .obra-card.obra-wide:nth-child(n) { grid-column: span 12; }
}
@media (max-width: 700px) {
  .obra-grid {
    display: flex; gap: 0.9rem; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter);
    margin-inline: calc(var(--gutter) * -1); padding: 0.4rem var(--gutter) 0.8rem;
    overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .obra-grid::-webkit-scrollbar { display: none; }
  .obra-grid > .obra-card:nth-child(n), .obra-grid > .obra-card.obra-wide:nth-child(n) {
    flex: 0 0 84%; max-width: 360px; grid-column: auto; scroll-snap-align: start; scroll-snap-stop: always;
  }
  .obra-grid > .obra-card .obra-media { aspect-ratio: 4 / 3; }
  .obra-nav { display: flex; align-items: center; gap: 0.8rem; margin: 0.2rem 0 0; color: #a9bad0; font: 600 0.72rem var(--mono); letter-spacing: 0.12em; text-transform: uppercase; }
  .obra-nav b { color: #fff; font-weight: 700; }
  .obra-nav i { flex: 1; height: 3px; border-radius: 3px; background: rgba(160, 190, 235, 0.18); position: relative; overflow: hidden; }
  .obra-nav i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--op, 14%); border-radius: 3px; background: linear-gradient(90deg, var(--volt), var(--copper-bright)); transition: width 0.3s var(--ease); }
  .obra-nav span { display: inline-flex; align-items: center; gap: 0.35rem; }
  .obra-nav svg { width: 16px; height: 16px; animation: pz-nudge 1.6s ease-in-out infinite; }
}
@media (min-width: 701px) { .obra-nav { display: none; } }
@keyframes pz-nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(5px); } }

/* ---------- Portada en iPhone: primero la marca, el titular y el buscador; el mosaico detrás ---------- */
@media (max-width: 700px) {
  .hero-body { display: flex !important; flex-direction: column; }
  .hero-body > .hero-copy { order: 1; }
  .hero-body > .mosaic { order: 2; margin-top: 0.4rem; }
  .hero { min-height: auto; padding-top: 1.2rem; }
  .hero h1 { margin-top: 0.4rem; }
}

/* ---------- Pantallas táctiles: letra mínima y dedos ---------- */
@media (hover: none), (pointer: coarse) {
  .hero-sub, .hero-sub span, .lt-hint, .mo figcaption, .eyebrow, .qs-cap, .elec-more, .tab-n,
  .obra-open, .obra-kicker, .hm-caption-text, .frame-tag, .hoteles-media figcaption, .workorder label, .stat > span { font-size: 11.5px !important; }
  .brand { min-height: 44px; display: inline-flex; align-items: center; }
  .lang button { min-height: 40px; min-width: 44px; }
  .nav-links a { min-height: 44px; display: inline-flex; align-items: center; }
  .nav-mail { min-width: 44px; min-height: 44px; }
  .workorder select { min-height: 44px; }
  /* el botón fijo «Enviar consulta» se retira cuando ya estás en el formulario o en el pie */
  .mobile-call { transition: transform 0.35s var(--ease), opacity 0.35s ease; }
  body.pz-en-contacto .mobile-call { transform: translateY(140%); opacity: 0; pointer-events: none; }
}
