/* ============================================================
   GEOMARINE — Página de servicio: dragado (servicio-dragado.html)
   ------------------------------------------------------------
   Página breve: encabezado con fotografía, un párrafo y el
   llamado a consultar por WhatsApp o correo. Colores, radios,
   tipografía y ritmo de secciones vienen de geomarine-theme.css;
   aquí no se agrega ningún color.

   Todo cuelga de .gm-dr (en <main>) para ganar en especificidad
   a las reglas genéricas del tema (.content-section p, etc.)
   sin recurrir a !important.
   ============================================================ */

/* ── Encabezado con fotografía propia ──
   .page-header fija su fondo con !important (PUERTO.JPG). Aquí la foto va en
   un <img> con srcset, para que el navegador elija el tamaño; el fondo queda
   en azul marino y así no se descarga además la imagen por omisión. Por eso
   este !important: es la única forma de desplazar al del tema. */
.page-header.gm-dr-hero { background: var(--dark-navy) !important; }
.gm-dr-hero__media { position: absolute; inset: 0; z-index: 0; }
.gm-dr-hero__media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }

/* ── Texto central ── */
.gm-dr-intro { max-width: 780px; margin: 0 auto; text-align: center; }
.gm-dr .gm-dr-intro__lede {
    margin: 0 0 1.1rem;
    font-size: clamp(1.3rem, 2.2vw, 1.75rem);
    font-weight: 700;
    line-height: 1.4;
    color: var(--primary-blue);
}
.gm-dr .gm-dr-intro__texto { margin: 0; font-size: 1.1rem; line-height: 1.8; color: var(--text-dark); }
.gm-dr .gm-dr-relacionado { margin: 2rem 0 0; font-size: 0.97rem; }
.gm-dr-enlace {
    display: inline-block;
    padding: 10px 0;
    font-weight: 700;
    color: var(--ocean-blue);
    text-decoration: underline;
    text-underline-offset: 4px;
}
.gm-dr-enlace i { margin-left: 10px; }
.gm-dr-enlace:hover { color: var(--primary-blue); }

/* ── Cierre ── */
.gm-dr-cierre__acciones { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.gm-dr-cierre__acciones .btn-monitoring { margin: 0; }
/* El correo se escribe en minúsculas: los botones del tema van en mayúsculas. */
.gm-dr .gm-dr-correo { text-transform: none !important; letter-spacing: 0 !important; }
@media (max-width: 400px) {
    .gm-dr-cierre__acciones a { flex: 1 1 100%; }
}