/* =====================================================================
   Morrighan UI — CSS unificado, limpio y documentado (v1)
   ---------------------------------------------------------------------
   Objetivos:
   1) Eliminar reglas duplicadas o en conflicto y ordenar por secciones.
   2) Documentar en español cada bloque con "perillas" para tunear rápido.
   3) Mantener intactos botones (.btn-cta, .btn-primary) e íconos (.icon-pill).
   4) Mantener tamaños del carrusel (520 / 420 / 300) y estilos del caption.
   5) Corregir visibilidad de la sección #calidad (modo claro vs oscuro).

   Recomendación de uso: reemplaza tu style.css actual por este archivo y
   elimina style.min.css ó re-genéralo a partir de este (build pipeline).
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) Variables y tipografías base
   - Cambia colores o fuentes aquí para afectar todo el sitio.
   --------------------------------------------------------------------- */
:root{
  /* Paleta (marca) */
  --morrighan-primary:#0f4c81;
  --morrighan-dark:#111827;
  --morrighan-muted:#6b7280;
  --morrighan-accent:#2563eb;
  --morrighan-bg:#0b1220;

  /* Tipografías */
  --font-body:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  --font-heading:"Plus Jakarta Sans",var(--font-body);

  /* Caption estilo “burbuja” (galería y carrusel) */
  --cap-bg: rgba(15,23,42,.78);
  --cap-text: #fff;
  --cap-shadow: 0 6px 18px rgba(2,6,23,.35);
  --cap-title-size: clamp(1rem, 1vw + .8rem, 1.5rem);
  --cap-desc-size: .95rem;

  /* Carrusel custom (.portfolio-carousel) — alturas */
  --pc-height: 520px;     /* desktop */
  --pc-height-md: 420px;  /* tablet */
  --pc-height-sm: 300px;  /* móvil */
  --pc-radius: 16px;      /* radio del contenedor */

  /* Tipografía fluida */
  --step-0: clamp(1rem, .85rem + .6vw, 1.125rem);
  --step-1: clamp(1.25rem, 1rem + 1.2vw, 1.5rem);
  --step-3: clamp(2rem, 1.5rem + 3vw, 2.75rem);
}

html,body{font-family:var(--font-body); color:#0f172a; overflow-x:hidden;}
h1,h2,h3,h4,.display-1,.display-2,.display-3,.display-4{
  font-family:var(--font-heading); letter-spacing:.1px;
}
a{color:var(--morrighan-primary);} a:hover{color:#0b3a63;}
section{padding:80px 0;}
img,svg,video{max-width:100%; height:auto;}

/* Tipografía utilitaria */
.fluid-text{ font-size: var(--step-0); line-height:1.45; }
.fluid-lead{ font-size: var(--step-1); line-height:1.35; }
.fluid-h1{ font-size: var(--step-3); line-height:1.1; letter-spacing:.015em; }

/* ---------------------------------------------------------------------
   2) Componentes base reutilizables
   --------------------------------------------------------------------- */
/* Tarjetas genéricas */
.tile{ border:1px solid #e5e7eb; border-radius:1rem; padding:24px; background:#fff; }

/* Ícono en píldora (conservar look) */
.icon-pill{
  width:44px; height:44px; border-radius:999px; display:grid; place-items:center;
  background:linear-gradient(180deg,#eef2ff,#e0e7ff); border:1px solid #dbeafe; color:#1d4ed8;
}

/* Títulos de sección */
.section-title .subtitle{
  color:var(--morrighan-primary); font-weight:700; text-transform:uppercase;
  letter-spacing:.14em; font-size:.85rem;
}
.section-title h2{ font-family:var(--font-heading); font-weight:800; }

/* Navbar: sombra sutil */
.navbar{ box-shadow:0 4px 16px rgba(2,8,23,.05); min-height:64px; }
.navbar .container{ align-items:center; }

/* ---------------------------------------------------------------------
   3) Hero (bg con imagen + velo)
   --------------------------------------------------------------------- */
.hero{
  position:relative; padding:min(10vh,6rem) 0;
  background:
    radial-gradient(1200px 600px at 80% -20%, rgba(245,158,11,.20), transparent 60%),
    radial-gradient(1000px 600px at -10% 20%, rgba(15,76,129,.18), transparent 60%),
    linear-gradient(180deg,#0b1220 0%,#0b1220 60%,#0e1627 100%);
  color:#e5e7eb;
}
.hero p{ color:#cbd5e1; }
.hero .accent{ color:var(--morrighan-accent); }

/* Hero full-bleed con imagen */
.hero-full{
  position:relative; min-height:88vh; display:grid; align-items:center;
  padding:18vh 0 10vh; color:#fff;
  background-image:url('../img/hero-industrial.png');
  background-size:cover; background-position:center; background-repeat:no-repeat;
  z-index:0; /* menor prioridad que secciones siguientes */
}
.hero-full::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.85) 100%);
  z-index:1;
}
.hero-full .container{ position:relative; z-index:2; }

/* Marca tipográfica */
.navbar-brand, .hero-full h1{
  font-family:'Manrope', sans-serif !important;
  font-weight:800; letter-spacing:1px; text-transform:uppercase;
  text-shadow:0 2px 6px rgba(0,0,0,.45);
}

/* Badge del hero */
#hero .badge, .hero .badge{
  padding:1rem 2rem !important; font-size:1.30rem !important; font-weight:800 !important;
  border-radius:999px !important; line-height:1 !important;
  border:1px solid rgba(255,255,255,.35) !important; background:rgba(255,255,255,.14) !important;
  color:#fff !important; backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
}

/* CTA legible sobre hero oscuro */
#hero .btn.btn-outline-light, .hero .btn-outline-light{
  color:#ffffff !important; border-color:rgba(255,255,255,.85) !important;
}
#hero .btn.btn-outline-light:hover, .hero .btn-outline-light:hover{
  background:#ffffff !important; color:#111827 !important; border-color:#ffffff !important;
}

/* ---------------------------------------------------------------------
   4) Navbar con modos (oscuro sobre hero / scrolled)
   --------------------------------------------------------------------- */
.nav-main{ --bs-navbar-color:#111827; --bs-navbar-hover-color:#ffffff; background:transparent; transition:.25s ease; }
.nav-main .nav-link{ color:var(--bs-navbar-color) !important; transition:color .15s ease; }
.nav-main .nav-link:hover{ color:var(--bs-navbar-hover-color) !important; }

.nav-main .navbar-brand span{
  text-transform:uppercase; font-weight:800; letter-spacing:.08em; color:#e5e7eb;
  font-size: clamp(1rem, .8rem + 1.2vw, 1.6rem); max-width:28ch; white-space:normal; overflow-wrap:normal;
}
.nav-main .navbar-brand img{ height:70px; width:auto; object-fit:contain; display:block; }
@media (max-width:768px){ .nav-main .navbar-brand img{ height:50px; } }

.nav-main--dark .nav-link{ color:rgba(229,231,235,.9) !important; }
.nav-main--dark .nav-link:hover{ color:#fff !important; }
.nav-main--dark .navbar-brand span{ color:#e5e7eb; }

.nav-main.scrolled, .nav-main.is-scrolled{
  background:rgba(255,255,255,.96); box-shadow:0 8px 24px rgba(2,6,23,.06);
}
.nav-main.scrolled .navbar-brand span,
.nav-main.is-scrolled .navbar-brand span,
.nav-main.scrolled .nav-link,
.nav-main.is-scrolled .nav-link{ color:#000000 !important; }
.nav-main.scrolled .nav-link:hover,
.nav-main.is-scrolled .nav-link:hover{ color:#000000 !important; }

/* Activo */
.nav-main .nav-link.active{ color:#2563eb !important; font-weight:700; position:relative; }
.nav-main .nav-link.active::after{ content:""; position:absolute; left:0; right:0; bottom:-10px; height:3px; border-radius:3px; background:#2563eb; opacity:.9; }
/* Oscuro: tono más suave */
.nav-main--dark .nav-link.active{ color:#93c5fd !important; }
.nav-main--dark .nav-link.active::after{ background:#93c5fd; }

/* Hamburguesa */
.navbar-toggler .navbar-toggler-icon{
  width:24px; height:24px; background-position:center; background-repeat:no-repeat; background-size:24px 24px;
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath stroke='rgba(17,17,17,0.85)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.2' d='M6 9h20M6 16h20M6 23h20'/%3e%3c/svg%3e");
}
.nav-main--dark .navbar-toggler .navbar-toggler-icon{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath stroke='rgba(255,255,255,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.2' d='M6 9h20M6 16h20M6 23h20'/%3e%3c/svg%3e");
}

/* Offcanvas (panel lateral) */
.offcanvas-modern{ width:360px; background:#fff; border-left:0; box-shadow:-24px 0 64px rgba(2,6,23,.18); font-family:var(--font-body); }
.offcanvas-backdrop.show{ opacity:.45; backdrop-filter:blur(1px); }
.off-hdr-center{ justify-content:center; position:relative; padding:.9rem 1rem; border-bottom:1px solid #eef2f7; }
.off-hdr-center .brand-center{ display:flex; align-items:center; justify-content:center; }
.off-hdr-center .btn-close{ position:absolute; right:12px; top:12px; }

/* Navegación del panel */
.off-nav{ display:flex; flex-direction:column; gap:.25rem; margin:.5rem 0 1rem; }
.off-item{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.85rem 1rem; border-radius:.75rem; text-decoration:none;
  background:#fff; color:#0f172a; font-weight:600; letter-spacing:.01em; border:1px solid #eef2f7; box-shadow:0 1px 0 rgba(2,6,23,.02);
}
.off-item::after{ content:"›"; font-size:1.2rem; line-height:1; opacity:.35; }
.off-item:hover{ border-color:#dbeafe; box-shadow:0 6px 18px rgba(37,99,235,.08); }
.off-item:focus-visible{ outline:3px solid rgba(37,99,235,.35); outline-offset:2px; }

/* Variante plana actual */
.off-nav--flat{ margin:.25rem 0 1rem; }
.off-nav--flat .off-item{ background:transparent; border-radius:0; box-shadow:none; border:0; border-bottom:1px solid #eef2f7; padding:1rem 0; }
.off-nav--flat .off-item:first-child{ border-top:1px solid #eef2f7; }
.off-nav--flat .off-item:hover{ color:#0b3a63; }

/* CTA centrado en panel */
.off-cta{ margin:1rem 0; padding:0 2px; }
.off-cta--center .btn-cta,
.off-cta .btn-cta{ display:inline-flex; align-items:center; justify-content:center; height:46px; padding:0 16px; line-height:1; border-radius:.75rem; font-weight:700; }

/* Contacto plano del panel */
.off-contact{ margin-top:.25rem; padding-top:.9rem; border-top:1px solid #eef2f7; display:flex; flex-direction:column; gap:.5rem; }
.off-contact-item{ color:#64748b; text-decoration:none; font-size:clamp(.95rem,.9rem + .2vw,1.02rem); }
.off-contact-item:hover{ color:#0f172a; text-decoration:underline; }
.offcanvas-modern, .offcanvas-modern a, .offcanvas-modern .btn{ font-size: clamp(.98rem, .9rem + .2vw, 1.05rem); }

@media (max-width:991.98px){
  .nav-main .navbar-toggler{ margin-left:auto; width:40px; height:40px; border-radius:12px; background:rgba(0,0,0,.08); border:1px solid rgba(0,0,0,.15); display:grid; place-items:center; padding:0; }
  .nav-main .navbar-collapse{ order:3; }
  .off-nav--flat .off-item{ padding:1.05rem 0; }
  .off-cta .btn-cta{ height:48px; }
}

/* ---------------------------------------------------------------------
   5) Tarjetas de servicio y portfolio
   --------------------------------------------------------------------- */
.service-card{ border:1px solid #e5e7eb; border-radius:1rem; padding:28px; transition:.25s ease; height:100%; background:#fff; }
.service-cards-zone{ background:#ffffff; padding:4rem 0; }
.service-card:hover{ transform:translateY(-4px); box-shadow:0 16px 40px rgba(2,8,23,.07); }

.portfolio{ background:#f1f5f9; padding:4rem 0; position:relative; z-index:1; }
.portfolio-item{ position:relative; overflow:hidden; border-radius:1rem; border:1px solid #e5e7eb; }
.portfolio-item img{ width:100%; height:260px; object-fit:cover; transition:transform .5s ease; }
.portfolio-item:hover img{ transform:scale(1.05); }
.portfolio-item .overlay{ position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.6) 100%); }
.portfolio-item .label{ position:absolute; left:16px; bottom:12px; color:#fff; font-weight:600; }

/* Carrusel Bootstrap dentro de .portfolio (conservar alturas) */
.portfolio .carousel-item img{ object-fit:cover; height:520px; }
@media (max-width: 768px){ .portfolio .carousel-item img{ height:300px; } }

/* Controles y caption del carrusel */
#portfolioCarousel{ position:relative; overflow:hidden; border-radius:16px; isolation:isolate; z-index:2; }
#portfolioCarousel .carousel-inner, #portfolioCarousel .carousel-item{ position:relative; }
#portfolioCarousel .carousel-item::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:50%;
  background:linear-gradient(to top, rgba(2,6,23,.65), rgba(2,6,23,0)); pointer-events:none; opacity:.9; z-index:5;
}
#portfolioCarousel .carousel-caption.carrusel-caption{
  left:50%; transform:translateX(-50%); right:auto; bottom:56px; padding:0; text-align:center; z-index:30;
}
@media (max-width:576px){ #portfolioCarousel .carousel-caption.carrusel-caption{ bottom:44px; } }
#portfolioCarousel .carousel-caption.carrusel-caption .caption-box{
  position:relative; display:inline-block; max-width:min(620px,84%); padding:.55rem .9rem; border-radius:.75rem;
  background:var(--cap-bg); color:var(--cap-text); box-shadow:var(--cap-shadow);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  text-shadow:0 1px 2px rgba(0,0,0,.35); pointer-events:none; line-height:1.25;
}
@media (max-width:576px){ #portfolioCarousel .carousel-caption.carrusel-caption .caption-box{ max-width:92%; } }
#portfolioCarousel .carousel-caption.carrusel-caption h5{
  margin:0 0 .2rem; font-weight:700; letter-spacing:.1px; font-family:var(--font-heading); font-size:var(--cap-title-size); color:var(--cap-text);
}
#portfolioCarousel .carousel-caption.carrusel-caption small{
  display:block; margin-top:.2rem; font-family:var(--font-body); font-weight:500; font-size:var(--cap-desc-size); color:rgba(255,255,255,.95);
}

/* Controles circulares con blur */
#portfolioCarousel .carousel-control-prev, #portfolioCarousel .carousel-control-next{
  position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:50%;
  background: rgba(24, 27, 33, 0.62); backdrop-filter: blur(6px) saturate(1.05); -webkit-backdrop-filter: blur(6px) saturate(1.05);
  border:1px solid rgba(255,255,255,.08); box-shadow: 0 6px 18px rgba(0,0,0,.40); opacity:1; z-index:3;
  transition: background .15s ease, transform .15s ease, box-shadow .15s ease;
}
#portfolioCarousel .carousel-control-prev{ left:1rem; }
#portfolioCarousel .carousel-control-next{ right:1rem; }
#portfolioCarousel .carousel-control-prev:hover, #portfolioCarousel .carousel-control-next:hover{ background: rgba(24, 27, 33, 0.72); box-shadow: 0 8px 22px rgba(0,0,0,.45); transform: translateY(-50%) scale(1.04); }
#portfolioCarousel .carousel-control-prev:active, #portfolioCarousel .carousel-control-next:active{ background: rgba(24, 27, 33, 0.54); transform: translateY(-50%) scale(0.98); }
#portfolioCarousel .carousel-control-prev-icon, #portfolioCarousel .carousel-control-next-icon{
  width:18px; height:18px; background-size:18px 18px; background-repeat:no-repeat; background-position:center; filter:none;
}
#portfolioCarousel .carousel-control-prev-icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 4 L6 8 L10 12'/%3E%3C/svg%3E"); }
#portfolioCarousel .carousel-control-next-icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 4 L10 8 L6 12'/%3E%3C/svg%3E"); }
#portfolioCarousel .carousel-control-prev:focus-visible, #portfolioCarousel .carousel-control-next:focus-visible{ outline:2px solid #93c5fd; outline-offset:2px; }
@media (prefers-reduced-motion: reduce){ #portfolioCarousel .carousel-control-prev, #portfolioCarousel .carousel-control-next{ transition:none; } }
@media (max-width: 576px){
  #portfolioCarousel .carousel-control-prev, #portfolioCarousel .carousel-control-next{ width:42px; height:42px; }
  #portfolioCarousel .carousel-control-prev{ left:.5rem; } #portfolioCarousel .carousel-control-next{ right:.5rem; }
}

/* Anchor scroll: que no tape el título el header fijo */
header#hero, section[id]{ scroll-margin-top: 84px; }

/* ---------------------------------------------------------------------
   6) Sección Nosotros (tuning local)
   --------------------------------------------------------------------- */
#nosotros .tile{ padding:32px; border-radius:18px; }
#nosotros .tile h6{ font-size:1.15rem; font-weight:700; }
#nosotros .tile p{ font-size:1rem; }
#nosotros .icon-pill{ width:52px; height:52px; border-radius:14px; }
#nosotros .section-title h2{ font-size:2.2rem; }
/* Icono redondo solo aquí */
#nosotros .tile.elevated .icon-pill{ width:56px; height:56px; border-radius:999px !important; display:grid; place-items:center; }

/* ---------------------------------------------------------------------
   7) Sección Calidad (modo claro + oscuro)
   - FIX: antes se forzaba negro con !important en cualquier modo.
   - Ahora el negro solo aplica en modo claro; en oscuro va texto claro.
   --------------------------------------------------------------------- */
/* ======= Sección: Gestión de la calidad (#calidad) ======= */
/* Base (común a claro/oscuro) */
#calidad{ padding:4rem 0; }
#calidad .section-title .subtitle{ font-weight:700; text-transform:uppercase; letter-spacing:.14em; }
#calidad .tile{ border:1px solid #e5e7eb; border-radius:1rem; padding:24px; background:#fff; }
#calidad .tile h5{ font-size:1.125rem; font-weight:700; line-height:1.25; margin:0; }
#calidad .icon-pill{
  width:44px; height:44px; border-radius:999px; display:grid; place-items:center;
  background:linear-gradient(180deg,#eef2ff,#e0e7ff); border:1px solid #dbeafe; color:#1d4ed8;
}
#calidad .tile ul{ margin:0; padding-left:0; }
#calidad .tile li{ list-style:none; font-size:.98rem; line-height:1.55; }
#calidad .tile li + li{ margin-top:.25rem; }
#calidad .tile li::before{ content:"•"; margin-right:.5rem; color:#9aa4b2; }

/* Modo CLARO (cuando la sección NO tiene .quality-dark) */
#calidad:not(.quality-dark) .section-title p,
#calidad:not(.quality-dark) .tile p,
#calidad:not(.quality-dark) .tile li{ color:#000; }
#calidad:not(.quality-dark) .section-title h2{ color:#0f172a; }

/* Modo OSCURO (activar agregando .quality-dark a la sección) */
#calidad.quality-dark{ background:#f1f5f9; }              /* oscuro real */
#calidad.quality-dark .section-title .subtitle{ color: var(--morrighan-primary); }
#calidad.quality-dark .section-title h2{ color:#000000; }
#calidad.quality-dark .section-title p{ color:#000000; }

#calidad.quality-dark .tile{
  background:#0f172a; border-color:#0f172a; color:#e5e7eb;
  box-shadow:0 18px 40px rgba(2,6,23,.35);
}
#calidad.quality-dark .tile h5{ color:#fff; }
#calidad.quality-dark .tile p,
#calidad.quality-dark .tile li,
#calidad.quality-dark .tile a,
#calidad.quality-dark .tile span,
#calidad.quality-dark .tile .small{ color:#fff; }
#calidad.quality-dark .tile li{ color:#ffffff; }          /* <-- ; agregado */
#calidad.quality-dark .tile li::before{ color:rgba(255,255,255,.45); }

/* Anti-ocultamiento si AOS no inicializa */
#calidad [data-aos]{ opacity:1 !important; transform:none !important; }
/* Garantizar que el grid esté visible */
#calidad .row.g-4{ display:flex; flex-wrap:wrap; }



/* ---------------------------------------------------------------------
   8) Contacto — bloque moderno (oculta legacy)
   --------------------------------------------------------------------- */
.contact-card{ display:none !important; }
.ubication-zone{ background:#fff; padding:4rem 0; }
.contact-zone{ background:#f1f5f9; padding:4rem 0; }
.contact-block{ background:#f1f5f9; border:1px solid #e5e7eb; border-radius:1rem; box-shadow:0 10px 28px rgba(15,23,42,.08); padding:1.25rem; }
.contact-row{ display:flex !important; align-items:center !important; gap:1rem !important; padding:.9rem 0 !important; border-bottom:0 !important; background:transparent !important; box-shadow:none !important; transform:none !important; transition:none !important; }
.contact-row:last-child{ border-bottom:0 !important; }
.contact-icon{ flex:0 0 44px; width:44px; height:44px; display:grid; place-items:center; border-radius:999px; background:linear-gradient(180deg,#eef2ff,#e0e7ff); border:1px solid #dbeafe; color:#1d4ed8; font-size:20px; }
.contact-text{ flex:1 1 auto; min-width:0; }
.contact-label{ display:block; font-size:.9rem; color:#64748b; margin-bottom:.125rem; }
.contact-value{ color:#0f172a; font-weight:700; text-decoration:none; word-break:break-word; }
.contact-value:hover{ text-decoration:underline; }
.contact-inline{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.contact-copy{ padding:.25rem .45rem; line-height:1; display:inline-flex; align-items:center; justify-content:center; }
.copy-msg{ margin-left:.5rem; font-size:.85rem; color:#065f46; background:#ecfdf5; border:1px solid #a7f3d0; padding:.15rem .5rem; border-radius:.5rem; opacity:0; transform:translateY(-2px); pointer-events:none; transition:opacity .18s ease, transform .18s ease; }
.copy-msg.show{ opacity:1; transform:translateY(0); }
.copy-msg.error{ color:#7f1d1d; background:#fef2f2; border-color:#fecaca; }
#form-status{ transition: opacity .3s ease; }
#form-status[hidden]{ display:none; }

/* ---------------------------------------------------------------------
   9) Botones (mantener apariencia)
   --------------------------------------------------------------------- */
.btn-cta{ background:#3b82f6; color:#111827 !important; border:0; box-shadow:0 4px 14px rgba(59,130,246,.25); transition: background .15s ease, box-shadow .15s ease, color .15s ease; }
.btn-cta:hover, .btn-cta:focus{ background:#2563eb; color:#fff !important; box-shadow:0 6px 20px rgba(37,99,235,.35); }

.btn-primary{ background:#3b82f6; border-color:#3b82f6; color:#111827; }
.btn-primary:hover, .btn-primary:focus{ background:#2563eb; border-color:#2563eb; color:#fff; }

/* Botón outline en navbar (según contexto) */
.nav-main .btn-outline-light{ color:#e5e7eb; border-color:rgba(255,255,255,.6); }
.nav-main.scrolled .btn-outline-light{ color:#111827; border-color:#94a3b8; }
.nav-main.scrolled .btn-outline-light:hover{ background:#111827; color:#fff; border-color:#111827; }

/* ---------------------------------------------------------------------
   10) Footer
   --------------------------------------------------------------------- */
footer{ background:#0b1220; color:#cbd5e1; }
footer a{ color:#cbd5e1; } footer a:hover{ color:#fff; }

/* ---------------------------------------------------------------------
   11) Página de portafolio — fondo específico
   --------------------------------------------------------------------- */
body.portfolio-page{
  background: linear-gradient(rgba(11,18,32,.50), rgba(11,18,32,.50)), url('assets/img/hero-industrial@2x.webp') center/cover fixed no-repeat;
}