/* latin-ext */
@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/bebas-neue-400.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/bebas-neue-400-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/jetbrains-mono-400.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/jetbrains-mono-400-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/jetbrains-mono-400.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/jetbrains-mono-400-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/oswald-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/oswald-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/oswald-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/oswald-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/oswald-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/oswald-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/oswald-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/oswald-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/roboto-300-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===== next block ===== */

/* ══ RESET & DS TOKENS ══════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --teal:        #1C9684;
  --teal-dark:   #15776A;
  --teal-deep:   #0E5B51;
  --teal-soft:   #7BE8D8;
  --teal-mist:   #E5F5F2;
  --orange:      #F89C48;
  --orange-dark: #D9772B;
  --black:       #090A0A;
  --ink:         #1A1A1A;
  --graphite:    #494949;
  --slate:       #4C4C4C;
  --gray:        #7D7D7D;
  --line:        #ECECEC;
  --gray-100:    #F4F4F6;
  --surface:     #FAFAFA;
  --white:       #FFFFFF;
  --grad-hero:   linear-gradient(135deg, #090A0A 0%, #0E5B51 55%, #1C9684 100%);
  --display:     "Bebas Neue", Impact, sans-serif;
  --text:        "Roboto", "Helvetica Neue", Arial, sans-serif;
  --ui:          "Roboto", "Helvetica Neue", Arial, sans-serif;
  --mono:        "Roboto", "Helvetica Neue", Arial, sans-serif;
  --shadow-1:    0 2px 8px rgba(9,10,10,.06);
  --shadow-2:    0 10px 20px rgba(0,0,0,.4);
  --shadow-3:    0 18px 36px rgba(9,10,10,.16);
  --r-sm: 4px; --r-md: 8px; --r-lg: 20px; --r-pill: 999px;
  --sp-xs:4px; --sp-sm:8px; --sp-md:16px; --sp-lg:24px; --sp-xl:40px; --sp-2xl:64px;
}

html { scroll-behavior: smooth; }
body { font-family: var(--ui); background: var(--white); color: var(--ink); font-size: 16px; line-height: 1.6; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--teal); color: #fff; }

/* ══ PAGE SWITCHING ══════════════════════════════════════════════ */
.page { display: none; }
.page.active { display: block; }

/* ══ NAV ════════════════════════════════════════════════════════ */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 300;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 60px; height: 88px;
  background: rgba(9,10,10,0.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: background 0.35s, box-shadow 0.35s;
}
nav.scrolled, nav.solid {
  background: rgba(255,255,255,0.97);
  box-shadow: 0 1px 0 var(--line);
  backdrop-filter: blur(8px);
}
.nav-logo {
  display: block;
  width: 160px; height: 40px;
  flex-shrink: 0;
  cursor: pointer;
}
.nav-logo-img {
  display: block; height: 65px; width: auto; cursor: pointer;
}
/* Inverted logo for dark/transparent nav */
nav:not(.scrolled):not(.solid) .nav-logo-img { filter: brightness(0) invert(1); }
.nav-links { display: flex; gap: 28px; list-style: none; align-items: center; }
.nav-links a {
  font-family: var(--ui);
  font-size: 16px; font-weight: 400;
  letter-spacing: 0.03em;
  color: var(--white);
  cursor: pointer;
  padding-bottom: 4px; position: relative;
  transition: color 0.2s;
}
nav.scrolled .nav-links a, nav.solid .nav-links a { color: var(--ink); }
.nav-links a:hover,
nav.scrolled .nav-links a:hover,
nav.solid .nav-links a:hover { color: var(--teal); }
.nav-links a.active { color: var(--teal); }
.nav-links a.active::after {
  content: ""; position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: -6px;
  width: 5px; height: 5px;
  background: var(--teal);
  border-radius: 50%;
}
nav.scrolled .nav-links a.active,
nav.solid .nav-links a.active { color: var(--teal); }
nav.scrolled .nav-links a.active::after,
nav.solid .nav-links a.active::after { background: var(--teal); }
.nav-cta {
  font-family: var(--ui); font-size: 13px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--teal); background: transparent;
  border: 1px solid var(--teal);
  border-radius: 100px;
  padding: 8px 26px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.nav-cta:hover { background: var(--teal); color: #fff; }
nav:not(.scrolled):not(.solid) .nav-cta { color: #fff; border-color: #fff; }
nav:not(.scrolled):not(.solid) .nav-cta:hover { background: #fff; color: var(--teal); }

/* ══ HERO ═══════════════════════════════════════════════════════ */
.hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: flex-end;
  overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0;
  background: linear-gradient(160deg, rgba(9,10,10,0.15) 0%, rgba(9,10,10,0.60) 55%, rgba(9,10,10,0.88) 100%);
}
.hero-video,
.hero-photo {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
}
/* La turbina queda apenas a la izquierda del centro: en celular,
   donde la foto se recorta, así siguen entrando las chimeneas. */
.hero-photo {
  object-position: 45% center; max-width: none;
  transform-origin: 45% 55%;
  animation: hero-respira 22s ease-in-out infinite alternate;
  will-change: transform;
}
/* Acercamiento lento con un leve desplazamiento: se percibe movimiento
   sin que distraiga del título. Va y vuelve, así nunca salta. */
@keyframes hero-respira {
  from { transform: scale(1)    translate3d(0, 0, 0); }
  to   { transform: scale(1.09) translate3d(-1.2%, -0.8%, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-photo { animation: none; }
}
/* DS gradient overlay accent */
.hero-teal-accent {
  position: absolute; left: 0; right: 0; bottom: 0; height: 6px;
  background: var(--teal);
}
.hero-content {
  position: relative; z-index: 2;
  padding: 0 60px 100px;
  max-width: 900px;
}
.hero-eyebrow {
  font-family: var(--mono);
  font-size: 12px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--teal-soft);
  margin-bottom: 24px;
  display: flex; align-items: center; gap: 14px;
}
.hero-eyebrow::before { display: none; }
.hero h1 {
  font-family: var(--display);
  font-size: clamp(64px, 9vw, 120px);
  line-height: 0.92; letter-spacing: 0.01em;
  color: var(--white);
  margin-bottom: 24px;
}
.hero h1 em { font-style: normal; color: var(--teal); }
.hero-sub {
  font-family: var(--text);
  font-size: 20px; font-weight: 400;
  color: rgba(255,255,255,0.72);
  max-width: 560px; margin-bottom: 44px; line-height: 1.6;
}
.hero-actions { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.btn-primary {
  display: inline-block;
  font-family: var(--ui); font-weight: 700;
  font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase;
  color: #fff; background: var(--teal);
  padding: 0 36px; height: 56px; line-height: 56px;
  border-radius: 100px;
  cursor: pointer; transition: background 0.2s;
  border: none;
}
.btn-primary:hover { background: var(--teal-dark); }
.btn-ghost {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--ui); font-weight: 700;
  font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  cursor: pointer; transition: background 0.2s, color 0.2s; background: none;
  border: 1px solid rgba(255,255,255,0.55);
  border-radius: 100px;
  padding: 0 28px; height: 56px;
}
.btn-ghost:hover { background: rgba(255,255,255,0.1); color: #fff; border-color: #fff; }
.btn-ghost::after { content: ''; display: none; }

/* ══ STATS STRIP ════════════════════════════════════════════════ */
.stats-strip {
  background: var(--white);
  border-bottom: 1px solid var(--line);
  padding: 0 60px;
  display: grid; grid-template-columns: repeat(4, 1fr);
}
.stat-item {
  padding: 32px 28px;
  border-right: 1px solid var(--line);
  text-align: center;
}
.stat-item:first-child { padding-left: 0; }
.stat-item:last-child { border-right: none; padding-right: 0; }
.stat-num {
  font-family: var(--display);
  font-size: 56px; line-height: 1;
  color: var(--teal); letter-spacing: 0.005em;
  display: block;
}
.stat-label {
  font-family: var(--display);
  font-size: 18px; font-weight: 400;
  text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--teal); margin-top: 10px;
  line-height: 1.35;
  display: block;
}

/* ══ SECTION BASE ════════════════════════════════════════════════ */
section { padding: 96px 60px; }
.section-eyebrow {
  font-family: var(--text);
  font-size: 13px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--teal);
  margin-bottom: 14px;
  display: flex; align-items: center; gap: 14px;
}
.section-eyebrow::before { content: ''; width: 32px; height: 1px; background: var(--teal); flex-shrink: 0; }
.section-divider {
  width: 107px; height: 2px;
  background: var(--teal);
  margin-bottom: 28px;
}
.section-title {
  font-family: var(--display);
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1; letter-spacing: 0.01em;
  color: var(--ink); margin-bottom: 20px;
}
.section-title em { font-style: normal; color: var(--teal); }
.section-title.on-dark { color: var(--white); }
.section-title.on-dark em { color: var(--teal-soft); }
.section-eyebrow.on-dark { color: var(--teal-soft); }
.section-eyebrow.on-dark::before { background: var(--teal-soft); }
.section-divider.on-dark { background: var(--teal-soft); }

/* ══ REP SECTION ════════════════════════════════════════════════ */
.rep-section { background: var(--surface); padding: 96px 60px; }
.rep-section .section-eyebrow { justify-content: center; white-space: nowrap; }
.rep-section .section-eyebrow::before { display: none; }
.asesora-text .section-eyebrow::before { display: none; }
.rep-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  margin-top: 56px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow: hidden;
}
.rep-card {
  background: var(--white);
  padding: 32px 28px 36px;
  position: relative; overflow: hidden;
  transition: background 0.25s;
  cursor: default;
}
.rep-card::before {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0; height: 3px;
  background: var(--teal);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.35s;
}
.rep-card:hover { background: var(--teal-mist); }
.rep-card:hover::before { transform: scaleX(1); }
.rep-card.featured { background: var(--teal-mist); }
.rep-card.featured:hover { background: var(--teal); }
.rep-brand {
  font-family: var(--display);
  font-size: 30px; letter-spacing: 0.02em;
  color: var(--ink); margin-bottom: 6px;
}
.rep-card.featured .rep-brand { color: var(--ink); }
.rep-card.featured:hover .rep-brand { color: var(--white); }
.rep-origin {
  font-family: var(--mono);
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--teal); margin-bottom: 14px;
}
.rep-card.featured .rep-origin { color: var(--teal); }
.rep-card.featured:hover .rep-origin { color: rgba(255,255,255,0.8); }
.rep-desc {
  font-family: var(--text);
  font-size: 14px; font-weight: 300;
  color: var(--slate); line-height: 1.65; margin-bottom: 20px;
}
.rep-card.featured .rep-desc { color: var(--slate); }
.rep-card.featured:hover .rep-desc { color: rgba(255,255,255,0.75); }
.rep-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag {
  font-family: var(--text);
  font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--teal-deep);
  background: var(--teal-mist);
  border: 1px solid rgba(28,150,132,0.25);
  padding: 5px 12px;
  border-radius: 100px;
  display: inline-block;
}
/* card hover → fondo teal-mist, píldora fondo blanco para contrastar */
.rep-card:hover .tag { background: var(--white); color: var(--teal-deep); border-color: rgba(28,150,132,0.2); }
/* featured base → fondo teal-mist, ídem */
.rep-card.featured .tag { background: var(--white); color: var(--teal-deep); border-color: rgba(28,150,132,0.2); }
/* featured hover → fondo teal sólido, píldora blanca con texto teal-deep */
.rep-card.featured:hover .tag { background: var(--white); color: var(--teal-deep); border-color: transparent; }

/* ══ SERVICES SECTION ═══════════════════════════════════════════ */
.asesora-section {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0; background: var(--black);
}
.asesora-visual {
  position: relative; min-height: 560px;
  overflow: hidden; background: var(--teal-deep);
}
.asesora-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.asesora-video-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(9,10,10,0.35) 0%, rgba(14,91,81,0.15) 100%);
  z-index: 1;
}
.asesora-text {
  padding: 56px 52px;
  background: var(--black);
  display: flex; flex-direction: column; justify-content: center;
}
.asesora-text .section-eyebrow { margin-bottom: 6px; color: var(--teal-soft); }
.asesora-text .section-eyebrow::before { background: var(--teal-soft); }
.asesora-text .section-title { margin-bottom: 32px; color: var(--white); }
.asesora-text .section-title em { color: var(--teal); }
.serv-card strong { color: var(--teal-soft) !important; }
.serv-card span { color: var(--white) !important; }
.serv-card { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.10) !important; }

.servicios-cards {
  display: flex; flex-direction: column;
  gap: 10px; margin-top: 8px;
}
.serv-card {
  display: flex; align-items: center; gap: 16px;
  padding: 16px 20px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 14px;
  cursor: default;
}
.serv-icon {
  width: 42px; height: 42px; flex-shrink: 0;
  background: var(--teal-mist); border: 1px solid rgba(28,150,132,0.2);
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px;
  transition: background 0.22s, border-color 0.22s;
}
.serv-icon svg { width: 18px; height: 18px; stroke: var(--teal); fill: none; stroke-width: 1.5; }
.serv-body { flex: 1; }
.serv-card strong {
  display: block; font-family: var(--text); font-weight: 600;
  font-size: 15px; color: var(--ink); margin-bottom: 4px; line-height: 1.3;
}
.serv-card span {
  font-family: var(--text); font-weight: 300;
  font-size: 13.5px; color: var(--gray); line-height: 1.55;
}

/* ══ CLIENTES SECTION ═══════════════════════════════════════════ */
.clientes-section {
  background: var(--white);
  border-top: 3px solid var(--teal);
  padding: 80px 0; overflow: hidden;
}
.clientes-inner { padding: 0 60px; margin-bottom: 52px; text-align: center; }
.clientes-inner .section-eyebrow { justify-content: center; color: var(--teal); }
.clientes-inner .section-eyebrow::before { display: none; }
.clientes-inner .section-divider { margin: 14px auto 28px; }
.clientes-track-wrap { overflow: hidden; position: relative; }
.clientes-track-wrap::before, .clientes-track-wrap::after {
  content: ''; position: absolute; top: 0; bottom: 0; width: 160px; z-index: 2; pointer-events: none;
}
.clientes-track-wrap::before { left: 0; background: linear-gradient(90deg, var(--white), transparent); }
.clientes-track-wrap::after  { right: 0; background: linear-gradient(-90deg, var(--white), transparent); }
.clientes-track { display: flex; width: max-content; animation: scroll-clients 28s linear infinite; }
.clientes-track:hover { animation-play-state: paused; }
@keyframes scroll-clients { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.clientes-logo-strip {
  height: 78px;
  width: auto;
  display: block;
  mix-blend-mode: multiply;
  opacity: 1;
}
.cliente-pill:hover span { color: var(--teal-soft); }

/* ══ MISIÓN / VISIÓN / VALORES ══════════════════════════════════ */
.mision-section {
  background: var(--gray-100);
  padding: 96px 60px;
  text-align: center;
}
.mision-section .section-eyebrow { justify-content: center; }
.mision-section .section-eyebrow::before { display: none; }
.mision-section .section-title { text-align: center; }
.mision-intro {
  font-family: var(--text);
  font-size: 17px; font-weight: 300;
  color: var(--slate); max-width: 680px;
  line-height: 1.8; margin: 0 auto 56px;
  text-align: center;
}
.mvv-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px; margin-top: 0;
  max-width: 1100px; margin-left: auto; margin-right: auto;
  align-items: stretch;
}
.mvv-card {
  background: var(--white);
  border-radius: 20px;
  border: 1px solid rgba(28,150,132,0.35);
  box-shadow: 0 8px 32px rgba(28,150,132,0.10);
  padding: 36px;
  display: flex; flex-direction: column;
}
.mvv-header {
  display: flex; flex-direction: row; align-items: center;
  gap: 16px; margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
.mvv-icon {
  width: 46px; height: 46px; flex-shrink: 0;
  background: var(--teal-mist);
  border: 1px solid rgba(28,150,132,0.2);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
}
.mvv-icon svg { width: 22px; height: 22px; stroke: var(--teal); fill: none; stroke-width: 1.5; }
.mvv-label {
  font-family: var(--display);
  font-size: 26px; letter-spacing: 0.01em;
  color: var(--teal-deep);
  text-transform: uppercase;
  line-height: 1;
}
.mvv-body {
  flex: 1;
}
.mvv-body p {
  font-family: var(--text); font-weight: 300;
  font-size: 14.5px; color: var(--slate); line-height: 1.75;
  text-align: left;
}

/* ══ CONTACTO ═══════════════════════════════════════════════════ */
.contacto-section {
  background: var(--black);
  padding: 100px 60px;
  display: flex; flex-direction: column; align-items: center;
}
.contacto-intro {
  text-align: center; max-width: 600px; margin-bottom: 16px;
}
.contacto-intro .section-eyebrow { justify-content: center; }
.contacto-intro .section-eyebrow::before { display: none; }
.contacto-intro .section-title { text-align: center; }
.contacto-intro p {
  font-family: var(--text); font-weight: 300;
  font-size: 16px; color: rgba(255,255,255,0.55);
  line-height: 1.8; margin-top: 16px;
}
.contacto-chips {
  display: flex; gap: 12px; flex-wrap: wrap;
  justify-content: center; margin: 28px 0 48px;
}
.contacto-chip {
  display: flex; align-items: center; gap: 8px;
  background: rgba(28,150,132,0.12);
  border: 1px solid rgba(28,150,132,0.3);
  border-radius: 100px;
  padding: 10px 20px;
  font-family: var(--text); font-size: 14px; font-weight: 400;
  color: rgba(255,255,255,0.75);
}
.contacto-chip svg { width: 15px; height: 15px; stroke: var(--teal); fill: none; stroke-width: 1.5; flex-shrink: 0; }
.contacto-chip a { color: inherit; text-decoration: none; }
.contacto-chip a:hover { color: var(--teal-soft); }
.contacto-card {
  width: 100%; max-width: 820px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 24px;
  padding: 48px 52px;
  backdrop-filter: blur(8px);
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-group { margin-bottom: 20px; }
.form-group.full { grid-column: 1 / -1; }
.form-label {
  font-family: var(--text);
  font-size: 13px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--teal);
  display: block; margin-bottom: 10px;
}
.form-input, .form-textarea {
  width: 100%;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 12px;
  color: var(--white);
  padding: 14px 18px;
  font-family: var(--ui); font-size: 15px;
  outline: none; transition: border-color 0.2s, background 0.2s;
  box-sizing: border-box;
}
.form-input:focus, .form-textarea:focus {
  border-color: var(--teal);
  background: rgba(28,150,132,0.08);
}
.form-textarea { resize: none; height: 130px; }
.form-input::placeholder, .form-textarea::placeholder { color: rgba(255,255,255,0.22); }
.form-actions {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 8px; gap: 20px;
}
.form-note {
  font-family: var(--text); font-size: 15px; font-weight: 400;
  color: var(--white);
}
.form-submit {
  background: var(--teal); color: #fff;
  border: none; border-radius: 100px;
  padding: 16px 48px;
  font-family: var(--ui); font-size: 13px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  cursor: pointer; transition: background 0.2s; white-space: nowrap;
}
.form-submit:hover { background: var(--teal-deep); }

/* ══ FOOTER ═════════════════════════════════════════════════════ */
footer {
  background: var(--graphite);
  padding: 24px 60px;
  display: grid; grid-template-columns: auto 1fr auto;
  gap: 24px; align-items: center;
}
.footer-logo-wrap {
  width: 160px; height: 40px;
  filter: brightness(0) invert(1);
}
.footer-logo-img {
  display: block; height: 36px; width: auto;
  filter: brightness(0) invert(1);
}
.footer-info {
  font-family: var(--text); font-weight: 300;
  font-size: 13px; color: rgba(255,255,255,0.65); line-height: 1.5;
}
.footer-info a { color: rgba(255,255,255,0.65); transition: color 0.2s; }
.footer-info a:hover { color: var(--white); }
.footer-links-wrap { display: flex; flex-direction: row; gap: 28px; align-items: center; }
.footer-links-wrap a {
  font-family: var(--text); font-weight: 400;
  font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(255,255,255,0.5); cursor: pointer;
  transition: color 0.2s;
}
.footer-links-wrap a:hover { color: var(--teal-soft); }
.footer-bottom {
  background: var(--black);
  padding: 20px 60px;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(255,255,255,0.35); text-align: center;
}
.footer-btn-top {
  width: 48px; height: 48px;
  background: var(--teal);
  display: grid; place-items: center;
  cursor: pointer; border: 0;
  transition: background 0.2s;
}
.footer-btn-top:hover { background: var(--teal-dark); }
.footer-btn-top svg { width: 18px; height: 18px; color: #fff; stroke: #fff; }

/* ══ VÁLVULAS – HERO ════════════════════════════════════════════ */
.v-hero {
  padding-top: 72px; position: relative;
  height: 62vh; min-height: 480px;
  display: flex; align-items: flex-end; overflow: hidden;
}
.v-hero-bg {
  position: absolute; inset: 0;
}
.v-hero-bg img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; object-position: center;
}
.v-hero-bg::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(160deg, rgba(9,10,10,0.25) 0%, rgba(9,10,10,0.75) 60%, rgba(9,10,10,0.95) 100%);
}
.v-hero-teal { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--teal); }
.v-hero-content { position: relative; z-index: 2; padding: 0 60px 52px; }
.v-hero-eyebrow {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  color: var(--teal-soft); letter-spacing: 0.22em; text-transform: uppercase;
  margin-bottom: 12px; display: flex; align-items: center; gap: 12px;
}
.v-hero-eyebrow::before { display: none; }
.v-hero h1 {
  font-family: var(--display);
  font-size: clamp(44px, 6.5vw, 80px); line-height: 0.92;
  letter-spacing: 0.01em; color: var(--white);
}
.v-hero h1 em { font-style: normal; color: var(--teal-soft); }
.v-hero-sub {
  font-family: var(--text); font-size: 20px; font-weight: 400;
  color: rgba(255,255,255,0.72); margin-top: 14px; max-width: none; white-space: normal; line-height: 1.55; letter-spacing: 0;
}

/* ══ FILTER BAR ═════════════════════════════════════════════════ */
/* ── Filter bar dropdown ── */
.filter-bar {
  position: relative; z-index: 200;
  background: var(--black); border-bottom: 1px solid rgba(255,255,255,0.08);
  display: flex; flex-direction: column; align-items: center;
}
.filter-row-1 {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap: 8px;
  width: 100%; padding: 12px 60px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.fdd-row {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; padding: 12px 48px;
}
.fdd-wrap { position: relative; }
.fdd-btn {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--text); font-size: 13px; font-weight: 500;
  letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--teal); background: rgba(28,150,132,0.06);
  border: 1px solid rgba(28,150,132,0.3); border-radius: 100px;
  padding: 8px 18px; cursor: pointer; white-space: nowrap;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
}
.fdd-btn svg { width: 12px; height: 12px; stroke: currentColor; fill: none; stroke-width: 2.5; transition: transform 0.25s; flex-shrink: 0; }
.fdd-btn:hover,
.fdd-btn.open { color: var(--white); border-color: var(--teal); background: var(--teal); }
.fdd-btn.open svg { transform: rotate(180deg); }
.fdd-btn.has-selection { color: var(--white); border-color: var(--teal); background: var(--teal); }
.fdd-menu {
  position: absolute; top: calc(100% + 8px); left: 0;
  background: var(--white); border: 1.5px solid var(--line);
  border-radius: 16px; padding: 8px;
  min-width: 220px; box-shadow: 0 8px 32px rgba(9,10,10,0.10);
  opacity: 0; pointer-events: none; transform: translateY(-6px);
  transition: opacity 0.2s, transform 0.2s; z-index: 300;
}
.fdd-menu.open { opacity: 1; pointer-events: all; transform: translateY(0); }
.fdd-item {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--ui); font-size: 11px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--gray); padding: 10px 14px; border-radius: 10px;
  cursor: pointer; transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}
.fdd-item:hover { background: var(--teal-mist); color: var(--teal-deep); }
.fdd-item.active { background: var(--teal-mist); color: var(--teal-deep); }
.fdd-item.active::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--teal); flex-shrink: 0; }
.fdd-item:not(.active)::before { content: ''; width: 6px; height: 6px; flex-shrink: 0; }
.fdd-divider { height: 1px; background: var(--line); margin: 4px 8px; }

/* legacy selectors kept for JS compat — hidden */
.filter-row-2 { display: none; }
.ftype-btn {
  font-family: var(--text); font-size: 12px; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(255,255,255,0.45); background: none; border: none;
  padding: 16px 18px 14px; cursor: pointer; white-space: nowrap;
  position: relative; transition: color 0.2s;
}
.ftype-btn::after {
  content: ''; position: absolute;
  bottom: 0; left: 18px; right: 18px; height: 2px;
  background: var(--teal); transform: scaleX(0);
  transition: transform 0.25s cubic-bezier(0.22,1,0.36,1);
}
.ftype-btn:hover { color: rgba(255,255,255,0.8); }
.ftype-btn.active { color: var(--white); }
.ftype-btn.active::after { transform: scaleX(1); }
.ftag-btn {
  font-family: var(--ui); font-size: 11px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--gray); background: none;
  border: 1px solid transparent; padding: 4px 12px;
  cursor: pointer; transition: all 0.2s; border-radius: var(--r-sm);
}
.ftag-btn:hover { color: var(--ink); }
.ftag-btn.active { color: var(--teal); border-color: rgba(28,150,132,0.35); background: var(--teal-mist); }
.filter-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--teal); margin-left: auto; }

/* ── Logos ticker válvulas ── */
.v-logos-ticker {
  background: var(--white);
  border-bottom: 1px solid var(--line);
  padding: 24px 0;
  overflow: hidden; position: relative;
}
.v-logos-ticker::before, .v-logos-ticker::after {
  content: ''; position: absolute; top: 0; bottom: 0; width: 120px; z-index: 2; pointer-events: none;
}
.v-logos-ticker::before { left: 0; background: linear-gradient(90deg, var(--white), transparent); }
.v-logos-ticker::after  { right: 0; background: linear-gradient(-90deg, var(--white), transparent); }
.v-logos-track {
  display: flex; align-items: center;
  width: max-content; gap: 64px;
  animation: scroll-clients 32s linear infinite;
}
.v-logos-track:hover { animation-play-state: paused; }
.v-logos-track img {
  height: 52px; width: auto; display: block;
  mix-blend-mode: multiply; opacity: 0.78;
  transition: opacity 0.2s; flex-shrink: 0;
}
.v-logos-track img:hover { opacity: 1; }

.count-bar {
  padding: 12px 48px;
  display: flex; align-items: center;
  border-bottom: 1px solid var(--line);
  background: var(--gray-100);
}
.count-text {
  font-family: var(--mono); font-size: 11px;
  color: var(--gray); letter-spacing: 0.1em; text-transform: uppercase;
}
.count-num { color: var(--teal); font-weight: 500; }
.count-filters { display: flex; gap: 8px; margin-left: 20px; align-items: center; flex-wrap: wrap; }
.count-filter-tag {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--teal-deep); background: var(--teal-mist);
  border: 1px solid rgba(28,150,132,0.25);
  padding: 3px 10px; border-radius: 100px;
  display: flex; align-items: center; gap: 6px;
}
.count-filter-tag button {
  background: none; border: none; cursor: pointer;
  color: var(--teal); font-size: 14px; line-height: 1;
  padding: 0; display: flex; align-items: center;
}

/* ══ PRODUCTS GRID ══════════════════════════════════════════════ */
.products-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--line);
  border-top: 1px solid var(--line);
}
.prod-card {
  background: var(--white);
  display: flex; flex-direction: column;
  cursor: default; transition: background 0.2s;
  position: relative; overflow: hidden;
}
.prod-card:hover { background: var(--teal-mist); }
.prod-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--teal);
  transform: scaleX(0); transform-origin: left; transition: transform 0.35s; z-index: 2;
}
.prod-card:hover::before { transform: scaleX(1); }
.prod-card:hover .card-body { border-top-color: rgba(28,150,132,0.2); }
.prod-card:hover .card-desc { color: var(--ink); }
.prod-card:hover .card-spec-row { border-bottom-color: rgba(28,150,132,0.15); }
.prod-card:hover .card-footer { border-top-color: rgba(28,150,132,0.2); }
.card-img {
  position: relative; height: 240px;
  background: var(--gray-100);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.card-img img {
  width: 100%; height: 100%; object-fit: contain; padding: 24px;
  transition: transform 0.5s; filter: brightness(0.95) saturate(0.9);
}
.prod-card:hover .card-img img { transform: scale(1.04); filter: brightness(1) saturate(1); }
.card-badge {
  position: absolute; top: 16px; left: 16px; z-index: 2;
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #fff; background: var(--teal); padding: 3px 10px;
}
.card-code {
  position: absolute; bottom: 12px; right: 14px;
  font-family: var(--mono); font-size: 10px; color: var(--gray); letter-spacing: 0.08em;
}
.card-placeholder {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 100%; height: 100%;
}
.card-placeholder-svg { opacity: 0.12; }
.card-placeholder-svg svg { width: 72px; height: 72px; stroke: var(--teal); fill: none; stroke-width: 0.8; }
.card-body {
  padding: 24px 28px 28px; flex: 1;
  display: flex; flex-direction: column;
  border-top: 1px solid var(--line);
}
.card-brand {
  font-family: var(--mono); font-size: 10px;
  color: var(--gray); letter-spacing: 0.18em; text-transform: uppercase; margin-bottom: 8px;
}
.card-name {
  font-family: var(--text); font-size: 18px; font-weight: 500;
  color: var(--teal); line-height: 1.2; margin-bottom: 10px;
}
.card-desc {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: var(--slate); line-height: 1.65; margin-bottom: 16px; flex: 1;
}
.card-specs { display: flex; flex-direction: column; margin-bottom: 20px; }
.card-spec-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 6px 0; border-bottom: 1px solid var(--line); gap: 8px;
}
.card-spec-row:last-child { border-bottom: none; }
.spec-k { font-family: var(--mono); font-size: 10px; color: var(--gray); text-transform: uppercase; letter-spacing: 0.08em; flex-shrink: 0; }
.spec-v { font-family: var(--mono); font-size: 11px; color: var(--slate); text-align: right; }
.spec-v.hi { color: var(--teal); font-weight: 500; }
.card-footer {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: auto; padding-top: 16px; border-top: 1px solid var(--line);
}
.card-cta {
  font-family: var(--ui); font-size: 12px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--teal); background: none; border: none;
  cursor: pointer; display: flex; align-items: center; gap: 6px;
  transition: gap 0.2s; padding: 0;
}
.card-cta:hover { gap: 10px; }
.card-norm {
  font-family: var(--mono); font-size: 10px;
  color: var(--gray); letter-spacing: 0.08em; text-transform: uppercase;
}
.prod-card[data-hidden="true"] { display: none; }

/* ══ TALLER VALVULAS ════════════════════════════════════════════ */
.v-taller {
  background: var(--black);
  border-top: 1px solid rgba(255,255,255,0.08);
  display: grid; grid-template-columns: 1fr 1fr;
}
.v-taller-visual {
  min-height: 380px; position: relative;
  overflow: hidden; display: flex;
  align-items: center; justify-content: center;
}
.v-taller-bg {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(9,10,10,0.4) 0%, rgba(14,91,81,0.2) 100%);
}
.v-taller-play {
  position: relative; z-index: 2; width: 60px; height: 60px;
  border: 2px solid var(--white); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.3s;
}
.v-taller-play:hover { background: var(--teal); border-color: var(--teal); }
.v-taller-play svg { width: 22px; height: 22px; fill: var(--white); margin-left: 3px; transition: fill 0.3s; }
.v-taller-text { padding: 60px 56px; }
.v-taller-label {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  color: var(--teal); letter-spacing: 0.22em; text-transform: uppercase;
  margin-bottom: 14px; display: flex; align-items: center; gap: 12px;
}
.v-taller-label::before { display: none; }
.v-taller-title {
  font-family: var(--display); font-size: 44px;
  letter-spacing: 0.01em; color: var(--white); line-height: 1; margin-bottom: 10px;
}
.v-taller-title em { font-style: normal; color: var(--teal); }
.v-taller-sub {
  font-family: var(--text); font-size: 15px; font-weight: 300;
  color: rgba(255,255,255,0.6); margin-bottom: 32px; line-height: 1.65;
}
.v-taller-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.v-taller-item {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 16px 18px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
}
.t-icon {
  width: 38px; height: 38px;
  background: rgba(28,150,132,0.12); border: 1px solid rgba(28,150,132,0.25);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 2px; border-radius: 10px;
}
.t-icon svg { width: 16px; height: 16px; stroke: var(--teal-soft); fill: none; stroke-width: 1.5; }
.v-taller-item strong { display: block; font-family: var(--text); font-size: 14px; font-weight: 600; color: var(--teal-soft); margin-bottom: 4px; }
.v-taller-item p { font-family: var(--text); font-size: 13px; font-weight: 300; color: rgba(255,255,255,0.75); line-height: 1.5; }

/* ══ ANIMATIONS ═════════════════════════════════════════════════ */
@keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
.hero-content > * { animation: fadeInUp 0.8s ease both; }
.hero-eyebrow  { animation-delay: 0.2s; }
.hero h1       { animation-delay: 0.4s; }
.hero-sub      { animation-delay: 0.6s; }
.hero-actions  { animation-delay: 0.8s; }

/* ══ RESPONSIVE ═════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  nav { padding: 0 32px; }
  .hero-content, section, .contacto-section { padding-left: 32px; padding-right: 32px; }
  .stats-strip { padding: 0 32px; grid-template-columns: repeat(2,1fr); }
  .stat-item:nth-child(2) { border-right: none; }
  .rep-grid { grid-template-columns: repeat(2,1fr); }
  .mvv-grid { grid-template-columns: 1fr; }
  .asesora-section { grid-template-columns: 1fr; }
  .asesora-visual { min-height: 320px; }
  .contacto-inner { grid-template-columns: 1fr; gap: 48px; }
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  footer { grid-template-columns: 1fr; gap: 24px; text-align: center; }
  .footer-links-wrap { align-items: center; flex-direction: row; flex-wrap: wrap; justify-content: center; }
  .footer-bottom { padding: 20px 32px; }
}
@media (max-width: 640px) {
  nav { padding: 0 20px; }
  .nav-links { display: none; }
  .hero-content { padding: 0 20px 80px; }
  .stats-strip { grid-template-columns: 1fr 1fr; padding: 0 20px; }
  section { padding: 64px 20px; }
  .rep-grid { grid-template-columns: 1fr; }
  .products-grid { grid-template-columns: 1fr; padding: 24px 20px 48px; }
  .v-taller { grid-template-columns: 1fr; }
  .v-taller-grid { grid-template-columns: 1fr; }
}

/* ══ TURBINAS PAGE ═══════════════════════════════════════════════ */

/* Hero angosto */
.t-hero {
  position: relative; height: 62vh; min-height: 480px;
  overflow: hidden;
  display: flex; align-items: flex-end;
}
.t-hero-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; z-index: 0;
}
.t-hero-overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(160deg, rgba(9,10,10,0.25) 0%, rgba(9,10,10,0.65) 50%, rgba(9,10,10,0.92) 100%);
}
.t-hero-content {
  position: relative; z-index: 2;
  padding: 0 60px 52px;
  width: 100%;
}
.t-hero-eyebrow {
  font-family: var(--text); font-size: 12px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--teal-soft); margin-bottom: 12px;
}
.t-hero-title {
  font-family: var(--display); font-size: 72px; line-height: 1;
  color: var(--white); text-transform: uppercase; margin-bottom: 16px;
}
.t-hero-title em { color: var(--teal); font-style: normal; }
.t-hero-sub {
  font-family: var(--text); font-size: 15px; font-weight: 300;
  color: rgba(255,255,255,0.75); max-width: 620px;
  line-height: 1.65; margin-bottom: 32px;
}
.t-hero-stats {
  display: flex; gap: 40px; align-items: flex-start;
}
.t-stat { display: flex; flex-direction: column; gap: 6px; }
.t-stat-num {
  font-family: var(--display); font-size: 56px; line-height: 1;
  color: var(--teal);
}
.t-stat-label {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  line-height: 1.55;
  color: rgba(255,255,255,0.75);
  max-width: 280px;
}
.t-stat-divider {
  width: 1px; align-self: stretch;
  background: rgba(255,255,255,0.15);
  margin: 4px 0;
}

/* Subnav */
.t-subnav {
  display: flex; gap: 8px; flex-wrap: wrap;
  justify-content: center;
  padding: 20px 60px;
  background: var(--black);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  position: sticky; top: 88px; z-index: 200;
}
.t-subnav-btn {
  font-family: var(--text); font-size: 13px; font-weight: 500;
  letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--teal);
  padding: 8px 18px; border-radius: 100px;
  border: 1px solid rgba(28,150,132,0.3);
  background: rgba(28,150,132,0.06);
  cursor: pointer; text-decoration: none;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
}
.t-subnav-btn:hover,
.t-subnav-btn.active {
  color: var(--white);
  border-color: var(--teal);
  background: var(--teal);
}

/* Secciones */
.t-section { padding: 80px 60px; background: var(--white); }
.t-section-dark { background: var(--black); }
.t-section-teal { background: var(--teal-deep); }
.t-section-inner { max-width: 1100px; margin: 0 auto; }
.t-intro {
  font-family: var(--text); font-size: 16px; font-weight: 300;
  color: var(--slate); line-height: 1.75;
  max-width: 760px; margin: 20px 0 48px;
}

/* Tabla de modelos */
.t-table-wrap { overflow-x: auto; margin-top: 40px; }
.t-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--text);
}
.t-table thead tr {
  background: var(--teal-deep); color: var(--white);
}
.t-table th {
  padding: 16px 20px; font-size: 12px; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase; text-align: left;
}
.t-table td {
  padding: 18px 20px; font-size: 14px; color: var(--slate);
  border-bottom: 1px solid var(--line);
}
.t-table tbody tr:hover td { background: var(--teal-mist); }
.t-model-name {
  font-family: var(--display); font-size: 20px !important;
  color: var(--ink) !important; letter-spacing: 0.02em;
}
.t-model-name span {
  font-family: var(--text); font-size: 12px;
  color: var(--teal); font-weight: 500; margin-left: 6px;
}
.t-row-featured td {
  background: var(--teal-mist);
  color: var(--teal-deep) !important;
}
.t-row-featured .t-model-name { color: var(--teal-deep) !important; }

/* Modularidad */
.t-mod-subtitle {
  font-family: var(--text); font-size: 14px; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal-soft); margin-bottom: 36px;
}
.t-mod-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.t-mod-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px; overflow: hidden;
  display: flex; flex-direction: column;
}
.t-mod-img {
  width: 100%; height: 260px; object-fit: cover; object-position: center;
  display: block;
}
.t-mod-card > .t-mod-label,
.t-mod-card > .t-mod-full,
.t-mod-card > p { padding: 0 32px; }
.t-mod-card > .t-mod-label { padding-top: 28px; }
.t-mod-card > p { padding-bottom: 32px; }
.t-mod-label {
  font-family: var(--display); font-size: 36px;
  color: var(--teal); letter-spacing: 0.02em; margin-bottom: 4px;
}
.t-mod-full {
  font-family: var(--text); font-size: 13px; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--teal-soft); margin-bottom: 14px;
}
.t-mod-card p {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,0.7); line-height: 1.75;
}

/* Card Generación Eléctrica */
.t-gen-card {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0; border-radius: 20px; overflow: hidden;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.12);
  margin-top: 48px; min-height: 380px;
}
.t-gen-card-img,
.t-serv-card-img {
  width: 100%; height: auto;
  object-fit: cover; object-position: center;
  display: block;
}
.t-gen-card-body {
  padding: 40px 44px;
}

/* Oil & Gas extra items */
.t-oilgas-extra {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px; margin-top: 36px;
}
.t-oilgas-item {
  background: var(--teal-mist);
  border: 1px solid rgba(28,150,132,0.2);
  border-radius: 16px; padding: 28px 24px;
}
.t-energia-termica {
  display: flex; align-items: flex-start; gap: 14px;
  margin-top: 36px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(123,232,216,0.2);
  border-radius: 16px; padding: 24px 28px;
}
.t-energia-termica p {
  font-family: var(--text); font-size: 15px; font-weight: 300;
  color: rgba(255,255,255,0.85); line-height: 1.65;
  margin: 0;
}
.t-energia-termica strong { color: var(--teal-soft); font-weight: 600; }
.t-gen-apps-text {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,0.7); line-height: 1.7; margin-top: 10px;
}

/* Card Servicio */
.t-serv-card {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0; border-radius: 20px; overflow: hidden;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  margin-top: 36px; min-height: 420px;
}
.t-serv-card-body {
  padding: 40px 44px;
}

/* Bullet list claro (sobre fondos oscuros) */
.t-bullet-list.t-bullet-light li { color: var(--white) !important; }
.t-bullet-list.t-bullet-light li::before { background: var(--teal) !important; }
.t-bullet-list.t-bullet-light li strong { color: var(--white) !important; }

/* Caldera cards sin descripción */
.t-caldera-card p { display: none; }

/* Bullet list */
.t-bullet-list {
  list-style: none; padding: 0; margin: 14px 0 0;
  display: flex; flex-direction: column; gap: 8px;
}
.t-bullet-list li {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: var(--slate); line-height: 1.6;
  display: flex; gap: 10px; align-items: flex-start;
}
.t-bullet-list li::before {
  content: ''; width: 5px; height: 5px; border-radius: 50%;
  background: var(--teal); flex-shrink: 0; margin-top: 7px;
}
.t-bullet-list li strong { font-weight: 600; color: var(--ink); }

/* Apps grid */
.t-apps-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 60px; margin-top: 48px;
}
.t-apps-title {
  font-family: var(--display); font-size: 28px;
  color: var(--teal-deep); margin-bottom: 16px;
  text-transform: uppercase;
}
.t-apps-desc {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: var(--slate); line-height: 1.75; margin-bottom: 24px;
}
.t-apps-tags { display: flex; flex-wrap: wrap; gap: 8px; }

/* Generación */
.t-gen-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 60px; margin-top: 48px; align-items: start;
}
.t-gen-grid p {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,0.75); line-height: 1.75; margin-bottom: 20px;
}
.t-gen-sub {
  font-family: var(--display); font-size: 22px;
  color: var(--teal-soft); margin-bottom: 12px; text-transform: uppercase;
}
.t-gen-apps {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 20px; padding: 32px;
}
.t-gen-app-title {
  font-family: var(--text); font-size: 11px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal-soft); margin-bottom: 20px;
}
.t-gen-app-item {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,0.8); padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  display: flex; align-items: center; gap: 10px;
}
.t-gen-app-item::before {
  content: ''; width: 5px; height: 5px;
  background: var(--teal); border-radius: 50%; flex-shrink: 0;
}

/* Calderas */
.t-caldera-grid {
  display: grid; grid-template-columns: repeat(4,1fr);
  gap: 20px; margin-top: 48px;
}
.t-caldera-card {
  background: var(--white);
  border: 1px solid rgba(28,150,132,0.25);
  box-shadow: 0 6px 24px rgba(28,150,132,0.08);
  border-radius: 20px; padding: 32px 28px;
}
.t-caldera-icon {
  width: 46px; height: 46px;
  background: var(--teal-mist); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 20px;
}
.t-caldera-icon svg { width: 22px; height: 22px; stroke: var(--teal); }
.t-caldera-card strong {
  display: block; font-family: var(--text); font-size: 15px;
  font-weight: 600; color: var(--teal-deep); margin-bottom: 10px;
}
.t-caldera-card p {
  font-family: var(--text); font-size: 13.5px; font-weight: 300;
  color: var(--slate); line-height: 1.7;
}
.t-rentech-badge {
  margin-top: 36px; display: inline-block;
  font-family: var(--text); font-size: 13px; font-weight: 500;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--teal-deep);
  background: var(--teal-mist);
  border: 1px solid rgba(28,150,132,0.25);
  padding: 10px 24px; border-radius: 100px;
}

/* Servicio */
.t-serv-grid {
  display: grid; grid-template-columns: repeat(4,1fr);
  gap: 16px; margin-top: 48px;
}
.t-serv-item {
  display: flex; flex-direction: column; gap: 12px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 16px; padding: 24px 20px;
}
.t-serv-item svg {
  width: 22px; height: 22px; stroke: var(--teal);
  fill: none; stroke-width: 1.5; flex-shrink: 0;
}
.t-serv-item span {
  font-family: var(--text); font-size: 13.5px; font-weight: 400;
  color: rgba(255,255,255,0.8); line-height: 1.5;
}

/* ── Reveal animations ── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.65s cubic-bezier(0.22,1,0.36,1), transform 0.65s cubic-bezier(0.22,1,0.36,1);
}
.reveal.revealed { opacity: 1; transform: translateY(0); }
.reveal-left  { opacity: 0; transform: translateX(-32px); transition: opacity 0.65s cubic-bezier(0.22,1,0.36,1), transform 0.65s cubic-bezier(0.22,1,0.36,1); }
.reveal-left.revealed  { opacity: 1; transform: translateX(0); }
.reveal-right { opacity: 0; transform: translateX(32px);  transition: opacity 0.65s cubic-bezier(0.22,1,0.36,1), transform 0.65s cubic-bezier(0.22,1,0.36,1); }
.reveal-right.revealed { opacity: 1; transform: translateX(0); }
.reveal-scale { opacity: 0; transform: scale(0.94); transition: opacity 0.6s cubic-bezier(0.22,1,0.36,1), transform 0.6s cubic-bezier(0.22,1,0.36,1); }
.reveal-scale.revealed { opacity: 1; transform: scale(1); }

/* ═══════════════════════════════════════════════════════════
   V4 — HOME REBUILD
   ═══════════════════════════════════════════════════════════ */

/* ── GENERACIÓN ELÉCTRICA v5 — full-bleed 2-col ─────────── */
/* Section keeps normal margins — layout contained within artboard */
#t-modelos.t-section { background: #f7f6f4 !important; padding-top: 120px !important; padding-bottom: 120px !important; }
#t-modularidad.t-section { background: #ffffff !important; padding-top: 0 !important; padding-bottom: 0 !important; }

.tgelec-outer { width: 100%; }
.tgelec-main {
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: stretch; min-height: 820px;
}

/* LEFT column — two zones */
.tgelec-left { display: flex; flex-direction: column; }
.tgelec-left-top {
  background: #ffffff;
  padding: 80px 48px 60px 48px;
}
.tgelec-left-items {
  background: #f7f6f4;
  flex: 1;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.tgelec-eyebrow {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--teal); margin-bottom: 14px;
}
.tgelec-title {
  font-family: var(--display); font-size: 56px;
  color: var(--ink); line-height: 0.95; margin: 0 0 20px;
}
.tgelec-intro {
  font-family: var(--text); font-size: 12px; font-weight: 600;
  color: var(--slate); line-height: 1.65; margin: 0;
  text-transform: uppercase; letter-spacing: 0.015em;
}
.tgelec-items { display: flex; flex-direction: column; flex: 1; }
.tgelec-item {
  border-bottom: 1px solid rgba(0,0,0,0.10);
  padding: 20px 48px; flex: 1;
  display: flex; align-items: center;
}
.tgelec-items > .tgelec-item:first-child { border-top: 1px solid rgba(0,0,0,0.10); }
.tgelec-item-head {
  display: flex; align-items: center; gap: 0; width: 100%;
}
.tgelec-item-name {
  font-family: var(--text); font-size: 12px; font-weight: 400;
  color: var(--ink); text-transform: uppercase; letter-spacing: 0.07em;
  flex: 0 0 58%; line-height: 1.5;
}
.tgelec-item-line {
  flex: 1; height: 0; margin: 0 12px;
  border-top: 1px solid rgba(0,0,0,0.20);
}
.tgelec-item-icon {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.tgelec-item-icon svg { width: 18px; height: 18px; stroke: var(--teal-deep); }

/* RIGHT column — extends to right viewport edge */
.tgelec-right { display: flex; flex-direction: column; }
.tgelec-prod-header {
  background: transparent;
  font-family: var(--display); font-size: clamp(36px, 4.8vw, 58px); font-weight: 400;
  color: var(--teal-mist);
  text-transform: uppercase;
  text-align: justify; text-align-last: justify; text-justify: inter-character;
  padding: 16px 24px; line-height: 1;
  flex-shrink: 0;
}
.tgelec-prod-img-wrap {
  background: #fff; overflow: hidden; line-height: 0; flex: 1;
}
.tgelec-prod-img {
  width: 100%; height: 100%; min-height: 280px;
  object-fit: contain; object-position: center; display: block;
}
.tgelec-prod-panels { display: flex; flex-direction: column; flex-shrink: 0; }
.tgelec-prod-panel {
  display: grid; grid-template-columns: 2fr 3fr;
  border-top: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px; overflow: hidden;
}
.tgelec-prod-panel-name {
  background: var(--teal);
  font-family: var(--display); font-size: 36px; font-weight: 300;
  color: #ffffff;
  display: flex; align-items: center; justify-content: center;
  padding: 32px 24px; line-height: 1; letter-spacing: 0.02em;
}
.tgelec-prod-panel-body {
  background: var(--teal-mist);
  padding: 28px 28px;
  display: flex; flex-direction: column; justify-content: center; gap: 8px;
}
.tgelec-prod-panel-label {
  font-family: var(--text); font-size: 14px; font-weight: 700;
  color: var(--teal); letter-spacing: 0.12em; text-transform: uppercase;
}
.tgelec-prod-panel-desc {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: var(--ink); line-height: 1.6; margin: 0;
}

/* RECUPERACIÓN block — full-bleed plaque, edge to edge */
.tgelec-recup {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-top: 72px;
  background: var(--ink);
  border-top: 1px solid rgba(255,255,255,0.20);
  border-bottom: 8px solid var(--teal);
}
.tgelec-recup-inner {
  max-width: 1440px; margin: 0 auto;
  padding: 110px 60px;
  display: grid; grid-template-columns: 1fr 1fr 2fr;
  gap: 0; align-items: center;
}
.tgelec-recup-left {
  padding-right: 48px;
  border-right: 1px solid rgba(255,255,255,0.25);
}
.tgelec-recup-body { padding: 0 48px; }
.tgelec-recup-img-wrap-col { padding-left: 48px; }
.tgelec-recup-title {
  font-family: var(--display); font-size: 56px;
  color: var(--teal-soft); line-height: 0.95;
  text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 18px;
}
.tgelec-recup-hr {
  border: none; border-top: 1px solid rgba(255,255,255,0.25);
  margin: 0 -48px 18px 0;
}
.tgelec-recup-lead {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  color: var(--teal); letter-spacing: 0.10em;
  text-transform: uppercase; line-height: 1.65; margin: 0;
}
.tgelec-recup-text {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,0.75); line-height: 1.65; margin: 0;
}
.tgelec-recup-text + .tgelec-recup-text { margin-top: 14px; }
.tgelec-recup-img-wrap {
  position: relative;
  padding-top: 67%;
  clip-path: inset(0 round 12px);
  background: var(--ink);
}
.tgelec-recup-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; }

/* ── FABRICANTES — todas las cards igual a Solar Turbines ─── */
.rep-card { background: var(--teal-mist) !important; }
.rep-card:hover { background: var(--teal) !important; }
.rep-card .rep-brand { color: var(--ink) !important; }
.rep-card:hover .rep-brand { color: var(--white) !important; }
.rep-card .rep-origin { color: var(--teal) !important; }
.rep-card:hover .rep-origin { color: rgba(255,255,255,0.8) !important; }
.rep-card .rep-desc { color: var(--slate) !important; }
.rep-card:hover .rep-desc { color: rgba(255,255,255,0.75) !important; }
.rep-card .tag { background: var(--white) !important; color: var(--teal-deep) !important; border-color: rgba(28,150,132,0.2) !important; }
.rep-card:hover .tag { background: var(--white) !important; color: var(--teal-deep) !important; border-color: transparent !important; }

/* ── Turbinas — todos los títulos: mismo estilo que GENERACIÓN ELÉCTRICA ── */
#page-turbinas .section-title,
#t-modelos .section-title,
#t-compresion .section-title,
#t-servicio .section-title {
  text-align: center !important;
  font-family: var(--display) !important;
  font-size: 56px !important;
  color: var(--ink) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  font-style: normal !important;
  font-weight: 400 !important;
}
#page-turbinas .section-title em,
#t-modelos .section-title em,
#t-compresion .section-title em,
#t-servicio .section-title em { font-style: normal !important; color: inherit !important; }
.t-title-green { color: var(--ink) !important; }
/* SERVICIO: sobre fondo negro → verde claro */
#t-servicio .section-title { color: var(--teal-soft) !important; }

/* ── Isologo de fondo: oculto ─────────────────────────── */
#t-modularidad { overflow: visible !important; }
#t-modularidad::before { display: none !important; }

/* ── NAV override — always on top ────────────────────────── */
/* ── TURBINAS subnav sticky — pegado al header (88px) ──────── */
.t-subnav { position: sticky !important; top: 88px !important; z-index: 500 !important; }
.t-subnav-btn:focus { outline: none; }
/* ── Válvulas: la barra de filtros acompaña el scroll y desaparece
      al bajar, en lugar de quedar fija debajo del nav ─────────────── */
#filterBar { position: relative !important; top: auto !important; z-index: 490 !important; }

/* ── NAV override — logo siempre a color ─────────────────── */
nav:not(.scrolled):not(.solid) .nav-logo-img { filter: none !important; }

/* ── Footer: centrado, sin links de navegación ──────────────── */
footer {
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  text-align: center !important; gap: 16px !important;
  padding: 60px 60px 48px !important;
}
.footer-links-wrap { display: none !important; }
nav.v4-footer-links { display: none !important; }
.footer-info { text-align: center !important; white-space: normal !important; }

/* ── HERO V4 ──────────────────────────────────────────────── */
.v4-hero {
  position: relative; height: 100vh; min-height: 640px;
  background: var(--black); overflow: hidden;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
}
.v4-hero-video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0; opacity: 0.4;
}
.v4-hero-overlay {
  position: absolute; inset: 0; z-index: 1;
  background: radial-gradient(ellipse at center, rgba(9,10,10,0.05) 0%, rgba(9,10,10,0.72) 100%);
}
.v4-hero-content {
  position: relative; z-index: 2;
  display: flex; flex-direction: column;
  align-items: center; text-align: center; padding: 0 60px;
  width: 100%; margin-bottom: -80px;
}
.v4-hero-eyebrow {
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.3em;
  text-transform: uppercase; color: var(--teal-soft); margin-bottom: 28px;
}
.v4-hero-sub {
  font-family: var(--text); font-size: 18px; font-weight: 300;
  color: var(--white); max-width: 560px;
  line-height: 1.7; margin: 0 0 44px; text-align: center; text-transform: uppercase;
}
.v4-hero-actions {
  display: flex; gap: 16px;
  align-items: center; justify-content: center;
}
.v4-hero-btn-primary {
  border: 2px solid var(--teal); border-radius: 999px;
  padding: 18px 52px;
  font-family: var(--ui); font-size: 11px; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--white); background: transparent;
  cursor: pointer; transition: background 0.25s;
}
.v4-hero-btn-primary:hover { background: var(--teal); }
.v4-hero-btn-ghost {
  font-family: var(--ui); font-size: 11px; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--white); background: none; border: none;
  cursor: pointer; padding: 18px 28px; transition: color 0.2s;
}
.v4-hero-btn-ghost:hover { color: var(--teal); }
/* title pinned to bottom above ticker */
.v4-hero-title-wrap {
  position: absolute; bottom: 58px; left: 0; right: 0; z-index: 2;
  padding: 0; text-align: center; overflow: hidden;
}
.v4-hero-title {
  font-family: var(--display);
  font-size: 10vw;
  line-height: 0.9; letter-spacing: 0.01em;
  white-space: nowrap; margin: 0; display: block;
}
.v4-hero-title-white { color: var(--white); }
.v4-hero-title-teal  { color: var(--teal); }
/* Válvulas ticker — JS scroll seamless */
.v-logos-ticker { overflow: hidden !important; }
.v-logos-track {
  display: flex; align-items: center;
  width: max-content; gap: 0;
  will-change: transform;
}
.v-logos-track img {
  height: 44px; width: auto; object-fit: contain; flex-shrink: 0; display: block;
  padding: 0 40px;
}
.v-logos-track img[alt="MANKENBERG"] { height: 28px; }

/* ticker */
.v4-ticker {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 3;
  background: var(--teal); padding: 16px 0; overflow: hidden;
}
@keyframes v4-ticker-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.v4-ticker-track {
  display: flex; align-items: center; width: max-content;
  animation: v4-ticker-scroll 42s linear infinite;
}
.v4-ticker-item {
  font-family: var(--display); font-size: 18px;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--teal-deep); white-space: nowrap; padding: 0 28px; line-height: 1;
}
.v4-ticker-sep { color: var(--teal-deep); opacity: 0.5; font-size: 10px; line-height: 1; flex-shrink: 0; }

/* ── STATS V4 ─────────────────────────────────────────────── */
.v4-stats {
  background: var(--black); border-top: 1px solid rgba(255,255,255,0.06);
  display: grid; grid-template-columns: repeat(4,1fr);
}
.v4-stat {
  padding: 60px 52px; border-right: 1px solid rgba(255,255,255,0.06);
  position: relative; overflow: hidden; cursor: default;
  display: flex; flex-direction: column; align-items: center; text-align: center;
}
.v4-stat:last-child { border-right: none; }
.v4-stat::after {
  content: ''; position: absolute; bottom: 0; left: 20%; right: 20%; height: 1px;
  background: var(--teal); transform: scaleX(0); transform-origin: left;
  transition: transform 0.5s cubic-bezier(0.22,1,0.36,1);
}
.v4-stat:hover::after { transform: scaleX(1); }
.v4-stat-num {
  font-family: var(--display); font-size: clamp(76px, 9vw, 120px);
  color: rgba(28,150,132,0.25); line-height: 0.86; letter-spacing: -0.01em; display: block;
}
.v4-stat-label {
  display: block; font-family: var(--text); font-size: 11px; font-weight: 400;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.55); margin-top: 22px; line-height: 1.8;
}

/* ── FAB LIST (Fabricantes) ───────────────────────────────── */
.v4-fab { background: var(--black); border-top: 1px solid rgba(255,255,255,0.06); }
.v4-fab-header {
  padding: 80px 60px 56px;
  text-align: center;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.v4-fab-header .section-eyebrow { justify-content: center; }
.v4-fab-header .section-eyebrow::before { display: none; }
.v4-fab-header-sub {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: var(--white); max-width: 480px; margin: 16px auto 0;
  line-height: 1.7;
}
.v4-fab-list {}
.v4-fab-row {
  display: grid; grid-template-columns: 56px 280px 1fr 300px;
  align-items: center; gap: 40px; padding: 0 60px; min-height: 120px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  cursor: default; position: relative; transition: background 0.35s;
}
.v4-fab-row::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--teal);
  transform: scaleY(0); transform-origin: bottom;
  transition: transform 0.4s cubic-bezier(0.22,1,0.36,1);
}
.v4-fab-row:hover { background: rgba(28,150,132,0.04); }
.v4-fab-row:hover::before { transform: scaleY(1); }
.v4-fab-num { font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em; color: rgba(255,255,255,0.18); transition: color 0.3s; }
.v4-fab-row:hover .v4-fab-num { color: rgba(123,232,216,0.45); }
.v4-fab-brand { font-family: var(--display); font-size: clamp(36px, 3.2vw, 52px); color: var(--white); line-height: 1; letter-spacing: 0.01em; transition: color 0.3s; white-space: nowrap; }
.v4-fab-row:hover .v4-fab-brand { color: var(--teal-soft); }
.v4-fab-desc { font-family: var(--text); font-size: 18px; font-weight: 300; color: rgba(255,255,255,0.8); line-height: 1.65; margin: 0; }
.v4-fab-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.v4-fab-origin { font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.3); transition: color 0.3s; }
.v4-fab-row:hover .v4-fab-origin { color: rgba(255,255,255,0.55); }
.v4-fab-tags { display: flex; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.v4-fab-tag { font-family: var(--text); font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.3); border: 1px solid rgba(255,255,255,0.1); padding: 5px 12px; border-radius: 3px; transition: color 0.3s, border-color 0.3s; }
.v4-fab-row:hover .v4-fab-tag { color: var(--teal-soft); border-color: rgba(28,150,132,0.35); }

/* ── ASESORAMIENTO V4 — card blur centrada ───────────────── */
.v4-asesora {
  position: relative; min-height: 92vh;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.v4-asesora-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.v4-asesora-overlay { position: absolute; inset: 0; z-index: 1; background: rgba(9,10,10,0.52); }
.v4-asesora-card {
  position: relative; z-index: 2;
  background: rgba(9,10,10,0.48);
  backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
  border: 1px solid rgba(255,255,255,0.13);
  border-radius: 24px; padding: 64px 80px;
  max-width: 980px; width: 92%; text-align: center;
}
.v4-asesora-card .section-eyebrow { justify-content: center; color: var(--teal-soft); margin-bottom: 10px; }
.v4-asesora-card .section-eyebrow::before { display: none; }
.v4-asesora-card-title {
  font-family: var(--display); font-size: clamp(44px, 5vw, 68px);
  color: var(--teal-soft); text-align: center; line-height: 1; margin: 0 0 40px;
}
.v4-serv-list { list-style: none; padding: 0; margin: 0; text-align: left; }
.v4-serv-item { display: flex; align-items: flex-start; gap: 16px; padding: 15px 0; border-top: 1px solid rgba(255,255,255,0.08); }
.v4-serv-item:last-child { border-bottom: 1px solid rgba(255,255,255,0.08); }
.v4-serv-icon { width: 40px; height: 40px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
.v4-serv-icon svg { width: 26px; height: 26px; stroke: var(--teal-soft); fill: none; stroke-width: 1.5; }
.v4-serv-title { font-family: var(--text); font-size: 17px; font-weight: 600; color: var(--white); display: block; margin-bottom: 4px; text-transform: uppercase; }
.v4-serv-desc { font-family: var(--text); font-size: 15px; font-weight: 300; color: var(--white); line-height: 1.55; }

/* ── CLIENTES V4 — fondo blanco ───────────────────────────── */
.v4-clientes { background: #fff; border-top: 1px solid rgba(0,0,0,0.06); }
.v4-clientes-top {
  display: flex; flex-direction: column; align-items: center;
  padding: 72px 60px 48px; text-align: center;
  border-bottom: 1px solid rgba(0,0,0,0.07);
}
.v4-clientes-top .section-eyebrow { color: var(--teal); justify-content: center; }
.v4-clientes-top .section-eyebrow::before { background: var(--teal); display: none; }
.v4-clientes-title {
  font-family: var(--display); font-size: clamp(44px, 5vw, 72px);
  color: var(--teal); line-height: 1; margin: 0 0 16px;
}
.v4-clientes-note {
  font-family: var(--text); font-size: 15px; font-weight: 300;
  color: #090A0A; max-width: 480px; line-height: 1.75; margin: 0;
}
.v4-clientes-ticker { padding: 44px 0; overflow: hidden; position: relative; background: #fff; }
.v4-clientes-ticker::before, .v4-clientes-ticker::after {
  content: ''; position: absolute; top: 0; bottom: 0; width: 100px; z-index: 2; pointer-events: none;
}
.v4-clientes-ticker::before { left: 0; background: linear-gradient(90deg, #fff, transparent); }
.v4-clientes-ticker::after  { right: 0; background: linear-gradient(-90deg, #fff, transparent); }
.v4-clientes-track { display: flex; width: max-content; animation: scroll-clients 28s linear infinite; }
.v4-clientes-track:hover { animation-play-state: paused; }
.v4-clientes-strip { height: 68px; width: auto; display: block; opacity: 0.55; transition: opacity 0.3s; }
.v4-clientes-strip:hover { opacity: 1; }

/* ── IDENTIDAD V4 — 3 cards visibles ─────────────────────── */
.v4-ident {
  background: var(--teal-deep); border-top: none;
  padding: 80px 60px;
}
.v4-ident-cols {
  display: grid; grid-template-columns: 1fr 1fr; gap: 60px;
  align-items: start; max-width: 1280px; margin: 0 auto;
}
.v4-ident-left { display: flex; flex-direction: column; gap: 28px; }
.v4-ident-img-wrap { position: relative; border-radius: 20px; overflow: visible; }
.v4-ident-img-placeholder {
  width: 100%; aspect-ratio: 4/3; border-radius: 20px;
  background: rgba(0,0,0,0.25);
}
.v4-ident-float-card {
  position: absolute; bottom: 28px; left: -24px;
  background: rgba(255,255,255,0.15); backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 16px; padding: 20px 24px;
  display: flex; align-items: flex-start; gap: 14px;
}
.v4-ident-float-icon {
  font-size: 22px; color: var(--white);
  background: rgba(28,150,132,0.5); border-radius: 10px;
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.v4-ident-float-lines { display: flex; flex-direction: column; gap: 6px; }
.v4-ident-float-lines span {
  font-family: var(--text); font-size: 12px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--white);
}
.v4-ident-right { display: flex; flex-direction: column; gap: 16px; }
.v4-ident-eyebrow::before { display: none !important; }
.v4-ident-top {
  text-align: center; margin-bottom: 72px;
}
.v4-ident-top .section-eyebrow { justify-content: center; color: var(--teal-soft); }
.v4-ident-top .section-eyebrow::before { display: none; }
.v4-ident-top-title {
  font-family: var(--display); font-size: clamp(44px, 5vw, 68px);
  color: var(--teal-soft); line-height: 1; margin: 0 0 20px;
}
.v4-ident-top-sub {
  font-family: var(--text); font-size: 15px; font-weight: 300;
  color: var(--white); max-width: 600px; margin: 0 auto;
  line-height: 1.85;
}
.v4-mvv-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.v4-mvv-card {
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 20px; padding: 48px 40px 52px;
  position: relative; overflow: hidden;
  background: rgba(0,0,0,0.30);
  transition: border-color 0.3s, background 0.3s;
}
.v4-mvv-card:hover { border-color: rgba(28,150,132,0.4); background: rgba(28,150,132,0.04); }
.v4-mvv-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--teal);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.5s cubic-bezier(0.22,1,0.36,1);
}
.v4-mvv-card:hover::before { transform: scaleX(1); }
.v4-mvv-num {
  font-family: var(--display); font-size: 80px; line-height: 1;
  color: rgba(28,150,132,0.12); position: absolute;
  top: 28px; right: 32px; letter-spacing: -0.03em;
  transition: color 0.3s;
}
.v4-mvv-card:hover .v4-mvv-num { color: rgba(28,150,132,0.22); }
.v4-mvv-label {
  font-family: var(--display); font-size: 52px; color: var(--teal-soft);
  line-height: 1; margin-bottom: 24px; position: relative;
}
.v4-mvv-body {
  font-family: var(--text); font-size: 15px; font-weight: 300;
  color: var(--white); line-height: 1.85; position: relative;
}

/* ── CONTACTO V4 ──────────────────────────────────────────── */
.v4-contacto {
  background: var(--black); border-top: 1px solid rgba(255,255,255,0.06);
  padding: 100px 60px;
}
.v4-contacto-top { text-align: center; margin-bottom: 60px; }
.v4-contacto-top .section-eyebrow { justify-content: center; color: var(--teal-soft); }
.v4-contacto-top .section-eyebrow::before { display: none; }
.v4-contacto-top-title {
  font-family: var(--display); font-size: clamp(44px, 5vw, 68px);
  color: var(--teal-soft); line-height: 1; margin: 0 0 18px;
}
.v4-contacto-top-sub {
  font-family: var(--text); font-size: 15px; font-weight: 300;
  color: var(--white); max-width: 460px; margin: 0 auto; line-height: 1.75;
}
.v4-contacto-chips { display: flex; justify-content: center; gap: 28px; margin: 28px 0 52px; flex-wrap: wrap; }
.v4-contacto-chip {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: var(--white); border: 1px solid rgba(255,255,255,0.2);
  padding: 10px 20px; border-radius: 999px;
}
.v4-contacto-chip svg { width: 13px; height: 13px; stroke: var(--teal-soft); fill: none; stroke-width: 1.5; flex-shrink: 0; }
.v4-contacto-chip a { color: var(--white); }
.v4-contacto-chip a:hover { color: var(--teal-soft); }
.v4-form-wrap {
  max-width: 760px; margin: 0 auto;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 20px; padding: 52px 56px 48px;
}
.v4-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 28px; }
.v4-form-full { grid-column: 1 / -1; }
.v4-form-field { display: flex; flex-direction: column; gap: 8px; }
.v4-form-label {
  font-family: var(--text); font-size: 15px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--teal-soft);
}
.v4-form-input, .v4-form-textarea {
  width: 100%; box-sizing: border-box;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.25); border-radius: 10px;
  color: var(--white); padding: 14px 18px;
  font-family: var(--ui); font-size: 15px;
  outline: none; transition: border-color 0.2s, background 0.2s;
}
.v4-form-input:focus, .v4-form-textarea:focus { border-color: var(--teal); background: rgba(255,255,255,0.18); }
.v4-form-input::placeholder, .v4-form-textarea::placeholder { color: rgba(255,255,255,0.55); }
.v4-form-textarea { resize: none; height: 130px; }
.v4-form-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 32px; }
.v4-form-note { font-family: var(--text); font-size: 13px; color: var(--white); }
.v4-form-submit {
  background: var(--teal); color: #fff; border: none; border-radius: 999px;
  padding: 16px 52px; font-family: var(--ui); font-size: 12px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  cursor: pointer; transition: background 0.2s;
}
.v4-form-submit:hover { background: var(--teal-deep); }

/* ── FOOTER V4 ────────────────────────────────────────────── */
.v4-footer {
  background: #666666; border-top: none;
  padding: 80px 60px 64px;
  display: flex; flex-direction: column;
  align-items: center; gap: 40px;
}
.v4-footer-logo { height: 44px; width: auto; filter: brightness(0) invert(1); opacity: 1; }
.v4-footer-links {
  display: flex; gap: 36px; align-items: center; flex-wrap: wrap; justify-content: center;
}
.v4-footer-links a {
  font-family: var(--text); font-size: 11px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--white); cursor: pointer; transition: color 0.2s;
}
.v4-footer-links a:hover { color: var(--teal-deep); }
.v4-footer-divider { width: 1px; height: 16px; background: rgba(0,0,0,0.2); }
.v4-footer-address {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: var(--white); text-align: center; line-height: 1.9;
}
.v4-footer-address a { color: var(--white); transition: color 0.2s; }
.v4-footer-address a:hover { color: var(--teal-deep); }
.v4-footer-copy {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--white); text-align: center;
}
.v4-footer-bottom {
  background: rgba(0,0,0,0.6); padding: 14px 60px;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em;
  text-transform: uppercase; color: rgba(255,255,255,0.12); text-align: center;
}

/* ── VÁLVULAS brand row ───────────────────────────────────── */
.v4-brand-row {
  display: flex; flex-wrap: wrap; gap: 10px;
  justify-content: center; padding: 14px 60px 18px;
  border-top: 1px solid rgba(255,255,255,0.07);
}
.v4-brand-btn {
  font-family: var(--ui); font-size: 11px; font-weight: 600;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--teal-soft); background: transparent;
  border: 1px solid rgba(123,232,216,0.35); border-radius: 999px;
  padding: 7px 20px; cursor: pointer; transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.v4-brand-btn:hover { background: rgba(123,232,216,0.1); }
.v4-brand-btn.active { background: var(--teal-soft); color: var(--black); border-color: var(--teal-soft); }

/* ── VÁLVULAS product cards — 2-col grid, image left, specs full-width ── */
/* ── PRODUCTOS GRID — 4 columnas compactas ──────────────── */
.products-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  align-items: start; gap: 14px; padding: 24px 40px 48px;
}
.prod-card {
  background: var(--white); border: 1.5px solid rgba(28,150,132,0.2);
  border-radius: 14px; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  transition: box-shadow 0.2s, transform 0.2s;
}
.prod-card[data-hidden="true"] { display: none !important; }
.prod-card:hover { box-shadow: 0 6px 18px rgba(28,150,132,0.13); transform: translateY(-2px); }

/* Respaldo card — negro con título verde */
.prod-card.card-respaldo {
  background: var(--black); border-color: rgba(123,232,216,0.2);
}
.prod-card.card-respaldo .card-name { color: var(--teal-soft) !important; }
.prod-card.card-respaldo .card-brand { color: rgba(123,232,216,0.5) !important; }
.prod-card.card-respaldo .card-desc { color: rgba(255,255,255,0.75) !important; }
.prod-card.card-respaldo .card-footer { border-top-color: rgba(255,255,255,0.08); }
.prod-card.card-respaldo .card-toggle { border-color: var(--teal-soft); color: var(--teal-soft); }
.prod-card.card-respaldo .card-specs { border-top-color: rgba(255,255,255,0.08); background: rgba(255,255,255,0.03); }
.prod-card.card-respaldo .spec-k { color: rgba(255,255,255,0.45); }
.prod-card.card-respaldo .spec-v { color: rgba(255,255,255,0.85); }
.prod-card.card-respaldo .card-spec-desc { color: rgba(255,255,255,0.75); border-top-color: rgba(255,255,255,0.08); }
.prod-card.card-respaldo .card-tipo-label { color: rgba(255,255,255,0.4); }

/* Badge — small pill */
.card-badge {
  display: inline-block; align-self: flex-start;
  margin: 10px 0 0 12px;
  background: var(--teal); color: var(--white);
  font-family: var(--ui); font-size: 8px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 999px;
}
.card-code { display: none; }

/* Vertical layout: image top, body below */
.card-inner { display: flex; flex-direction: column; }
.card-img {
  background: #f5f5f5; width: 100%; height: 130px;
  display: flex; align-items: center; justify-content: center;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  position: relative; flex-shrink: 0;
}
.card-img img { width: 100%; height: 100%; object-fit: contain; padding: 10px; }
.card-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.card-placeholder-svg svg { width: 40px; height: 40px; stroke: #ccc; fill: none; stroke-width: 1.5; }
.card-body {
  padding: 12px 14px 10px; display: flex; flex-direction: column;
  gap: 4px; flex: 1; min-width: 0;
}
.card-brand {
  font-family: var(--ui); font-size: 10px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase; color: #bbb;
}
.card-series {
  font-family: var(--text) !important; font-size: 15px !important; font-weight: 700 !important;
  color: var(--teal) !important; line-height: 1.2 !important; margin-top: 0;
}
.card-name {
  font-family: var(--text) !important; font-size: 15px !important; font-weight: 700 !important;
  color: var(--teal) !important; line-height: 1.2 !important; margin-bottom: 0 !important;
}
.card-desc {
  font-family: var(--ui) !important; font-size: 16px !important; font-weight: 400 !important;
  color: #000 !important; line-height: 1.45 !important; margin: 0 !important;
  flex: unset !important; overflow: visible !important; display: block !important;
}
.card-tipo-label {
  font-family: var(--ui); font-size: 14px; font-weight: 400;
  color: #000; display: block; margin-bottom: 1px; text-transform: uppercase; letter-spacing: 0.05em;
}

/* Footer: chevron toggle */
.card-footer {
  display: flex; align-items: center; justify-content: flex-end;
  padding: 8px 12px 10px;
  border-top: 1px solid rgba(0,0,0,0.04);
  margin-top: auto;
}
.card-footer-line { display: none; }
.card-toggle {
  width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0;
  background: transparent; border: 1.5px solid var(--teal);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  color: var(--teal); transition: transform 0.3s ease, background 0.2s;
}
.card-toggle:hover { background: rgba(28,150,132,0.08); }
.card-toggle.open { transform: rotate(180deg); }
.card-toggle svg { width: 11px; height: 11px; stroke: currentColor; stroke-width: 2.5; fill: none; }

/* Specs panel */
.card-specs {
  display: none; flex-direction: column; gap: 0;
  border-top: 1px solid #f0f0f0;
  padding: 14px 14px 16px;
}
.card-specs.open { display: flex; }
.card-spec-row {
  display: flex; gap: 8px; padding: 5px 0;
  border-bottom: 1px solid #f7f7f7;
}
.card-spec-row:last-child { border-bottom: none; }
.spec-k { color: #000; min-width: 80px; font-family: var(--ui); font-size: 10px !important; }
.spec-v { color: #000; font-family: var(--ui); font-weight: 600; font-size: 11px !important; }
.spec-v.hi { color: var(--teal); }
.card-spec-desc {
  margin-top: 10px; padding-top: 10px; border-top: 1px solid #f0f0f0;
  font-family: var(--ui); font-size: 11px; color: #444; line-height: 1.55;
}
.spec-k-desc { display: block; margin-bottom: 3px; min-width: unset; }
.card-cta { display: none; }
.card-norm { display: none; }


/* ── VÁLVULAS HERO — centrado ────────────────────────────── */
.v-hero-content { width: 100% !important; text-align: center !important; }
.v-hero-content h1 { text-align: center !important; }
.v-hero-eyebrow { justify-content: center !important; }
.v-hero-sub { text-align: center !important; }
.v-hero h1 em { color: var(--teal) !important; }

/* ── VIDEO TALLER — override Unsplash background ─────────── */
.v-taller-bg { background-image: none !important; }
.v-taller-bg video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ── RESPALDO TÉCNICO LOCAL v4 ───────────────────────────── */
/* SERVICIO btn — mismo estilo que los demás ftype-btn */

.v-respaldo {
  background: var(--black);
  padding: 80px 60px 90px;
  scroll-margin-top: 190px;
}
.v-respaldo-inner {
  max-width: 1100px; margin: 0 auto;
}
.v-respaldo-eyebrow {
  font-family: var(--ui); font-size: 11px; font-weight: 600;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--teal); margin-bottom: 16px;
}
.v-respaldo-title {
  font-family: var(--display); font-size: clamp(36px, 5vw, 64px);
  color: var(--teal-soft); line-height: 1; margin-bottom: 56px;
}
.v-respaldo-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid rgba(123,232,216,0.15);
  border-radius: 20px; overflow: hidden;
}
.v-respaldo-item {
  padding: 36px 32px 40px;
  border-right: 1px solid rgba(123,232,216,0.1);
  position: relative;
}
.v-respaldo-item:last-child { border-right: none; }
.v-respaldo-num {
  font-family: var(--display); font-size: 72px; line-height: 1;
  color: rgba(28,150,132,0.15); position: absolute;
  top: 20px; right: 20px; user-select: none;
}
.v-respaldo-icon {
  width: 44px; height: 44px;
  background: rgba(28,150,132,0.12);
  border: 1px solid rgba(28,150,132,0.25);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 24px;
}
.v-respaldo-icon svg {
  width: 20px; height: 20px;
  stroke: var(--teal-soft); fill: none; stroke-width: 1.6;
}
.v-respaldo-item-title {
  font-family: var(--ui); font-size: 16px; font-weight: 700;
  color: var(--white); letter-spacing: 0.03em; margin-bottom: 10px;
}
.v-respaldo-item-desc {
  font-family: var(--ui); font-size: 15px; font-weight: 300;
  color: rgba(255,255,255,0.75); line-height: 1.65; margin: 0;
}


/* ── TURBINAS v4 PATCHES ─────────────────────────────────── */

/* Hero v4 */
.th-cards {
  position: absolute;
  top: 0; bottom: 60px; left: 0; right: 0;
  display: flex; align-items: center; justify-content: center;
  gap: 24px; z-index: 10; padding: 0 60px;
}
.th-stat-card {
  background: rgba(255,255,255,0.13);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 20px; padding: 28px 36px;
  color: var(--white); width: 320px; flex: 0 0 320px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
}
.th-stat-num {
  display: block; font-family: var(--display);
  font-size: 64px; line-height: 1; color: var(--teal-soft);
  margin-bottom: 10px;
}
.th-stat-text {
  display: block; font-size: 14px; line-height: 1.6; opacity: 0.9;
  font-family: var(--text); font-weight: 300;
}
.th-title-bar {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 28px 60px; z-index: 11;
  text-align: center;
}
.th-title {
  font-family: var(--display);
  font-size: clamp(44px, 6.5vw, 80px);
  white-space: nowrap; color: var(--white); margin: 0; line-height: 0.92;
}
.th-title-green { color: var(--teal); text-shadow: 0 2px 18px rgba(0,0,0,0.55), 0 1px 4px rgba(0,0,0,0.35); }

/* S1 title green */
.t-title-green { color: var(--teal) !important; }

/* S1 highlight card */
.t-highlight-card {
  display: flex; align-items: center; gap: 24px;
  background: linear-gradient(135deg, rgba(28,150,132,0.10) 0%, rgba(28,150,132,0.04) 100%);
  border: 1.5px solid rgba(28,150,132,0.28);
  border-radius: 16px; padding: 28px 36px;
  margin: 28px 0 48px;
}
.t-hc-icon {
  flex-shrink: 0; width: 56px; height: 56px;
  background: rgba(28,150,132,0.15); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  color: var(--teal);
}
.t-hc-text {
  font-family: var(--text); font-size: 17px; line-height: 1.6;
  color: var(--ink); margin: 0;
}
.t-hc-text strong { color: var(--teal); font-weight: 600; }

/* S2 Modularidad — title centered 2 lines */
.t-mod-title-v4 {
  font-family: var(--display); font-size: 48px; letter-spacing: 0.02em;
  color: var(--teal-soft); text-align: center;
  margin-bottom: 40px; line-height: 1.15;
}
/* Cards: light green transparent bg, white text */
.t-section-dark .t-mod-card {
  background: rgba(28,150,132,0.13) !important;
  border-color: rgba(123,232,216,0.2) !important;
}
.t-section-dark .t-mod-card p { color: rgba(255,255,255,0.85) !important; }

/* S3 OIL & GAS — 2-col layout */
.toil-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; margin-top: 48px; align-items: start; }
.toil-left {}
.toil-right { display: flex; flex-direction: column; gap: 16px; }
.toil-narrow-card {
  background: var(--teal-mist);
  border: 1px solid rgba(28,150,132,0.22);
  border-radius: 16px; padding: 20px 24px;
}
.toil-narrow-card h3 {
  font-family: var(--display); font-size: 20px; color: var(--teal-deep);
  text-transform: uppercase; margin: 0 0 8px;
}
.toil-narrow-card p {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: var(--slate); line-height: 1.65; margin: 0;
}

/* OIL & GAS feat grid */
.toil-feat-grid {
  display: grid; grid-template-columns: 1fr; gap: 10px; margin: 18px 0 0;
}
.toil-feat-item {
  display: flex; align-items: flex-start; gap: 10px;
  font-family: var(--text); font-size: 14px; font-weight: 500;
  color: var(--ink); line-height: 1.45;
}
.toil-feat-icon { width: 18px; height: 18px; stroke: var(--teal); flex-shrink: 0; margin-top: 1px; }

/* S3 OIL & GAS — new block + product card styles */
.toil-block {
  display: grid; grid-template-columns: 1fr 1fr; gap: 48px;
  align-items: center; margin-top: 48px;
}
.toil-block + .toil-block { margin-top: 56px; }
.toil-block-text {}
.toil-block-img {
  border-radius: 20px; overflow: hidden; aspect-ratio: 4/3;
}
.toil-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.toil-apps-text {
  font-family: var(--text); font-size: 13px; font-weight: 400;
  color: var(--slate); line-height: 1.6; margin: 18px 0 0;
}
.toil-req-label {
  font-family: var(--text); font-size: 12px; font-weight: 700;
  color: var(--slate); text-transform: uppercase; letter-spacing: 0.08em;
  margin: 16px 0 4px;
}
.toil-single-prod-wrap {
  max-width: 440px; margin: 40px 0 0;
}
.toil-prod-badge-above {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal); margin-bottom: 10px;
}
.toil-prod-card {
  display: flex; gap: 36px; align-items: center;
  background: var(--teal-mist);
  border: 1px solid rgba(28,150,132,0.22);
  border-radius: 20px; padding: 28px 36px; margin-top: 36px;
}
.toil-prod-card--flip { flex-direction: row-reverse; }
.toil-prod-img {
  width: 220px; height: 180px; object-fit: contain;
  border-radius: 12px; flex-shrink: 0;
}
.toil-prod-body { flex: 1; }
.toil-prod-badge {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal); margin-bottom: 6px;
}
.toil-prod-name {
  font-family: var(--display); font-size: 40px; font-weight: 400;
  color: var(--teal-deep); line-height: 1; margin-bottom: 2px;
}
.toil-prod-full {
  font-family: var(--text); font-size: 12px; font-weight: 700;
  color: var(--slate); text-transform: uppercase; letter-spacing: 0.07em;
  margin-bottom: 14px;
}
.toil-prod-desc {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: var(--ink); line-height: 1.65; margin: 0;
}

/* S4 CENTRALES v4 — mismo patrón que NUESTRA IDENTIDAD */
.t-gen-wrap { display: flex; gap: 40px; align-items: flex-start; margin-top: 48px; }
.t-gen-img-wrap { position: relative; border-radius: 20px; overflow: visible; flex-shrink: 0; width: 340px; }
.t-gen-card-img {
  width: 100% !important; height: auto !important; aspect-ratio: 3/4 !important;
  border-radius: 20px !important; background: rgba(0,0,0,0.25);
  object-fit: cover !important; object-position: center top !important;
  display: block !important; filter: brightness(0.5) !important;
}
.t-gen-card-body { padding: 40px 44px; }
/* Labels Beneficios / Aplicaciones */
.t-gen-app-title-v4 {
  font-family: var(--text); font-size: 16px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--teal-soft); margin-bottom: 16px; margin-top: 28px;
}
.t-gen-app-title-v4:first-child { margin-top: 0; }
.t-gen-row {
  display: flex; align-items: baseline; gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-family: var(--text); font-size: 14px; font-weight: 500;
  color: var(--white); line-height: 1.5;
  text-transform: uppercase; letter-spacing: 0.04em;
}
.t-gen-row::before { content: '→'; color: var(--teal); font-weight: 600; flex-shrink: 0; font-size: 14px; }
.t-gen-apps-p {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,0.7); line-height: 1.75; margin: 12px 0 0;
}
/* Floating card — outside top-right of image, same pattern as home */
.t-energia-float {
  position: absolute; bottom: 24px; right: -20px;
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 16px; padding: 20px 24px;
  max-width: 240px; z-index: 10;
  display: flex; align-items: flex-start; gap: 14px;
}
.t-energia-float-icon svg { width: 20px; height: 20px; stroke: var(--teal-soft); }
.t-energia-float p {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,0.88); line-height: 1.65; margin: 0;
}
.t-energia-float strong { color: var(--teal-soft); font-weight: 600; }

/* S4 CENTRALES — Beneficios + Aplicaciones cards */
.t-gen-bene-card, .t-gen-apli-card {
  background: rgba(0,0,0,0.50); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.10); border-radius: 18px; padding: 28px 32px;
}
.t-gen-bene-header {
  display: flex; align-items: center; gap: 12px; margin-bottom: 20px;
  border-bottom: 1px solid rgba(28,150,132,0.25); padding-bottom: 14px;
}
.t-gen-bene-icon { width: 20px; height: 20px; stroke: var(--teal-soft); flex-shrink: 0; }
.t-gen-bene-title {
  font-family: var(--display); font-size: 18px; font-weight: 400;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal-soft);
}
.t-gen-bene-grid { display: flex; flex-direction: column; gap: 0; }
.t-gen-bene-item {
  display: flex; align-items: center; gap: 14px;
  font-family: var(--text); font-size: 15px; color: rgba(255,255,255,0.88); line-height: 1.5;
  padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.08);
}
.t-gen-bene-item:last-child { border-bottom: none; }
.t-gen-bene-num {
  font-family: var(--mono); font-size: 11px; font-weight: 700;
  color: var(--teal); flex-shrink: 0; letter-spacing: 0.05em;
  background: rgba(28,150,132,0.15); border: 1px solid rgba(28,150,132,0.35);
  border-radius: 6px; width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
}
.t-gen-bene-num svg { width: 16px; height: 16px; stroke: var(--teal); fill: none; flex-shrink: 0; }
.t-gen-apli-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.t-gen-apli-tag {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--teal-soft); background: rgba(28,150,132,0.12);
  border: 1px solid rgba(28,150,132,0.30); border-radius: 999px;
  padding: 6px 14px;
}

/* S5 CALDERAS — centered cards, dark theme */
.t-caldera-card {
  display: flex; flex-direction: column; align-items: center;
  text-align: center !important;
  background: #0d1212 !important;
  border-color: rgba(255,255,255,0.10) !important;
  box-shadow: none !important;
}
.t-caldera-card strong { color: #fff !important; }
.t-caldera-icon {
  margin-bottom: 16px; margin-left: auto; margin-right: auto;
  background: rgba(28,150,132,0.20) !important;
}

/* S6 SERVICIO — service list redesign */
.t-serv-list {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0; padding: 0; margin: 0; list-style: none;
}
.t-serv-list li {
  font-family: var(--text); font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,0.85); line-height: 1.55;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  padding-right: 20px;
  display: flex; align-items: flex-start; gap: 10px;
}
.t-serv-list li::before {
  content: '—'; color: var(--teal); flex-shrink: 0;
  font-weight: 600; font-size: 13px; margin-top: 1px;
}
/* S6 SERVICIO — no-bullet list with dividers */
.t-serv-list-v4 { display: flex; flex-direction: column; }
.t-serv-row {
  display: flex; align-items: baseline; gap: 12px;
  font-family: var(--text); font-size: 14px; font-weight: 500;
  color: var(--white); line-height: 1.5;
  text-transform: uppercase; letter-spacing: 0.04em;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.t-serv-row::before { content: '→'; color: var(--teal); font-weight: 600; flex-shrink: 0; font-size: 14px; }

/* Servicio card image — fill cell with no white borders */
.t-serv-card {
  grid-template-columns: 340px 1fr !important;
  height: 480px !important;
}
.t-serv-card-img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; object-position: center !important;
  display: block !important;
}

/* ── S1 MODELOS — 4 cards horizontales ─────────────────── */
.t-models-v4 {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 16px; margin-top: 40px;
}
.t-mv4-card {
  background: #ffffff;
  border: 1.5px solid rgba(28,150,132,0.35);
  border-radius: 18px;
  padding: 28px 24px 24px;
  display: flex; flex-direction: column; gap: 12px;
  position: relative; overflow: hidden;
  transition: transform 0.22s, border-color 0.22s, box-shadow 0.22s;
}
.t-mv4-card:hover {
  transform: translateY(-4px);
  border-color: rgba(28,150,132,0.4);
  box-shadow: 0 12px 32px rgba(28,150,132,0.10);
}
.t-mv4-card.featured {
  background: #ffffff;
  border-color: rgba(28,150,132,0.35);
}
.t-mv4-num {
  font-family: var(--display); font-size: 13px; font-weight: 700;
  color: rgba(28,150,132,0.35); letter-spacing: 0.08em;
}
.t-mv4-name {
  font-family: var(--display); font-size: 25px;
  color: var(--ink); font-weight: 700; line-height: 1.1;
}
.t-mv4-name span {
  display: inline; font-family: var(--display); font-size: 1em;
  font-weight: 700; color: var(--ink); letter-spacing: inherit;
}
.t-mv4-power {
  font-family: var(--display) !important; font-size: 16px; font-weight: 400;
  color: var(--teal); line-height: 1; margin-bottom: 0; text-transform: uppercase; letter-spacing: 0.10em;
}
.t-mv4-power-alt {
  font-family: var(--display) !important; font-size: 16px; font-weight: 400;
  color: #888; line-height: 1; margin-top: 10px; margin-bottom: 0; text-transform: uppercase; letter-spacing: 0.10em;
}
.t-mv4-cifra {
  font-family: var(--display) !important; font-size: 22px; font-weight: 700; line-height: 1;
}
.t-mv4-cifra-hp { color: var(--teal); }
.t-mv4-cifra-kwe { color: #888; }
.t-mv4-unit, .t-mv4-lbl { font-family: var(--display) !important; font-size: 1em; font-weight: 400; }
.t-mv4-divider {
  width: 32px; height: 2px;
  background: rgba(28,150,132,0.25); border-radius: 2px;
}
.t-mv4-apps {
  font-family: var(--text); font-size: 13px;
  color: var(--slate); line-height: 1.5; margin: 0;
}
.t-mv4-card.featured .t-mv4-num { color: rgba(28,150,132,0.5); }
.t-mv4-card.featured .t-mv4-power { color: var(--teal); }

/* ── S2 MODULARIDAD — sección gris con ISO de fondo ─────── */
#t-modularidad {
  background-color: #eeecea !important;
  position: relative !important;
  overflow: hidden !important;
}
#t-modularidad::before {
  content: '';
  position: absolute; inset: 0; z-index: 0;
  background-image: url('assets/images/image-79d469f7.png');
  background-repeat: no-repeat;
  background-size: 880px auto;
  background-position: -120px center;
  opacity: 0.18;
  pointer-events: none;
}
#t-modularidad .t-section-inner { position: relative; z-index: 1; }

/* ── Outer teal — incluye título, sobresale del fondo ──── */
.t-modv4-outer {
  background: rgba(28,150,132,0.22);
  border-radius: 28px; padding: 40px 36px 36px;
  margin-top: 0;
  box-shadow: 0 16px 56px rgba(28,150,132,0.18), 0 4px 16px rgba(0,0,0,0.08);
}
.t-mod-title-v4 {
  font-family: var(--display); font-size: 44px; font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--teal-deep); text-align: center;
  line-height: 1.1; margin-bottom: 28px;
}
.t-modv4-inner {
  display: flex; flex-direction: column; gap: 8px;
  max-width: 700px; margin: 0 auto;
}
.t-modh-card {
  display: flex; background: #fff;
  border-radius: 12px; overflow: hidden; height: 160px;
}
.t-modh-img-side {
  position: relative; width: 40%; flex-shrink: 0; overflow: hidden;
}
.t-modh-num {
  position: absolute; left: 0; top: 0; bottom: 0; width: 54px;
  background: rgba(28,150,132,0.82);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--display); font-size: 22px; font-weight: 700;
  color: #fff; z-index: 2;
}
.t-modh-img {
  width: 100%; height: 100%; object-fit: cover;
  object-position: center; display: block;
}
.t-modh-body {
  padding: 16px 24px; display: flex; flex-direction: column;
  justify-content: center; gap: 4px;
}
.t-modh-label {
  font-family: var(--display); font-size: 30px; font-weight: 700;
  color: var(--teal); line-height: 1;
}
.t-modh-full {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal);
}
.t-modh-desc {
  font-family: var(--text); font-size: 13px;
  color: var(--ink); line-height: 1.5; margin: 2px 0 0;
}

/* ── Generación Eléctrica — intro + grid beneficios ─────── */
.t-gelec-intro {
  font-family: var(--text); font-size: 15px; color: var(--ink);
  line-height: 1.7; margin: 0 auto 20px; max-width: 680px;
  text-align: center;
}
.t-gelec-grid {
  display: flex; flex-direction: column; gap: 0;
  border-top: 1px solid rgba(28,150,132,0.20);
  margin-bottom: 40px; max-width: 580px; margin-left: auto; margin-right: auto;
}
.t-gelec-item {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 0; border-bottom: 1px solid rgba(28,150,132,0.15);
  font-family: var(--text); font-size: 14px; font-weight: 500; color: var(--ink);
  justify-content: center;
}
.t-gelec-icon { width: 20px; height: 20px; stroke: var(--teal); flex-shrink: 0; }

/* ── Productos Destacados ─────────────────────────────── */
.t-prod-dest-title {
  font-family: var(--display); font-size: 28px; color: var(--teal-deep);
  text-transform: uppercase; letter-spacing: 0.06em;
  margin-bottom: 20px; text-align: center;
}
.t-prod-carousel-wrap {
  position: relative; max-width: 900px; margin: 0 auto 44px;
}
.t-prod-carousel {
  display: flex; gap: 20px;
}
.t-prod-slide {
  flex: 1; display: flex; flex-direction: column; background: #fff;
  border-radius: 16px; overflow: hidden; min-height: 260px;
}
.t-prod-slide-img {
  width: 100%; height: 180px; object-fit: cover; object-position: center; display: block;
  flex-shrink: 0;
}
.t-prod-slide-body {
  padding: 20px 22px; display: flex; flex-direction: column; gap: 6px; flex: 1;
}
.t-prod-slide-label {
  font-family: var(--display); font-size: 32px; color: var(--teal); line-height: 1;
}
.t-prod-slide-full {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal);
}
.t-prod-slide-desc {
  font-family: var(--text); font-size: 13px; color: var(--ink); line-height: 1.55; margin: 0;
}

/* ── Recuperación de Gases de Escape ─────────────────── */
.t-recup-title {
  font-family: var(--display); font-size: 36px; font-weight: 700;
  color: var(--teal-deep); text-transform: uppercase;
  letter-spacing: 0.04em; line-height: 1.05;
  margin: 8px 0 18px; text-align: center;
  white-space: nowrap;
}
.t-recup-lead {
  font-family: var(--text); font-size: 17px; font-weight: 600;
  color: var(--teal-deep); margin: 0 auto 24px; line-height: 1.5;
  text-align: center; max-width: 600px;
}
.t-recup-card {
  display: flex; background: rgba(28,150,132,0.10);
  border: 1px solid rgba(28,150,132,0.25);
  border-radius: 18px; overflow: hidden; max-width: 900px;
  margin: 0 auto;
}
.t-recup-card-img {
  width: 40%; flex-shrink: 0; object-fit: cover; display: block;
}
.t-recup-card-body {
  padding: 24px 28px; display: flex; flex-direction: column; justify-content: center;
}
.t-recup-card-text {
  font-family: var(--text); font-size: 14px; color: var(--ink);
  line-height: 1.65; margin: 0;
}

/* ── S6 SERVICIO — 3 columnas estilo recuperación invertido ─── */
.t-serv-v5 {
  width: 100vw; margin-left: calc(50% - 50vw);
  background: var(--ink);
}
.t-serv-v5-inner {
  max-width: 1440px; margin: 0 auto;
  padding: 80px 60px;
  display: grid; grid-template-columns: 1fr 1fr 2fr;
  gap: 0; align-items: center;
}
.t-serv-v5-img-col {
  align-self: stretch; overflow: hidden;
  clip-path: inset(0 round 12px);
  margin-right: 48px;
}
.t-serv-v5-img {
  width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block;
}
.t-serv-v5-body {
  padding: 0 48px;
  border-right: 1px solid rgba(255,255,255,0.15);
}
.t-serv-v5-lead {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  color: var(--teal); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 16px;
}
.t-serv-v5-stat {
  font-family: var(--display); font-size: 72px; font-weight: 400;
  color: var(--teal-soft); line-height: 1; margin: 0 0 8px;
}
.t-serv-v5-stat-label {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,0.75); line-height: 1.65;
}
.t-serv-v5-desc {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: #ffffff; line-height: 1.65; margin: 12px 0 0;
}
.t-serv-v5-right { padding-left: 48px; }
.t-serv-v5-title {
  font-family: var(--display); font-size: 56px;
  color: var(--teal-soft); text-transform: uppercase; line-height: 0.95;
  margin: 0 0 20px;
}
.t-serv-v5-hr {
  border: none; border-top: 1px solid rgba(255,255,255,0.20);
  margin: 0 -48px 16px 0;
}
.t-serv-v5-item {
  border-bottom: 1px solid rgba(255,255,255,0.10);
  padding: 10px 0; display: flex; align-items: center; gap: 10px;
}
.t-serv-v5-items > .t-serv-v5-item:first-child {
  border-top: 1px solid rgba(255,255,255,0.10);
}
.t-serv-v5-item-dash {
  flex-shrink: 0; width: 18px; height: 0;
  border-top: 1.5px solid var(--teal); margin-right: 2px;
}
.t-serv-v5-item-text {
  font-family: var(--text); font-size: 11px; font-weight: 400;
  color: rgba(255,255,255,0.75); text-transform: uppercase;
  letter-spacing: 0.06em; line-height: 1.5;
}
.t-serv-cards-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 12px; margin-top: 0;
}
.t-serv-mini-card {
  display: flex; align-items: flex-start; gap: 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(123,232,216,0.15);
  border-radius: 14px; padding: 18px 20px;
  transition: background 0.2s, border-color 0.2s;
}
.t-serv-mini-card:hover {
  background: rgba(28,150,132,0.12);
  border-color: rgba(123,232,216,0.35);
}
.t-serv-icon {
  width: 22px; height: 22px; flex-shrink: 0;
  color: var(--teal); margin-top: 1px;
}
.t-serv-mini-card span {
  font-family: var(--text); font-size: 14px;
  color: rgba(255,255,255,0.82); line-height: 1.5;
}

/* ── OIL & GAS v5 — mismo lenguaje visual que Generación Eléctrica ── */
#t-compresion.t-section { padding: 0 !important; }
#t-compresion .t-section-inner { max-width: none !important; padding: 0 !important; }
#t-servicio.t-section { padding: 0 !important; }
#t-compresion .toil5-block:first-child { margin-top: 0 !important; }

.toil5-category {
  font-family: var(--display); font-size: 56px;
  color: var(--ink); line-height: 0.95; margin: 0 0 20px;
  text-transform: uppercase;
}

.toil5-block {
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: stretch; min-height: 300px; margin-top: 48px;
}
.toil5-block + .toil5-prod-panel { margin-top: 0; }
.toil5-img-col { overflow: hidden; }
.toil5-block--flip .toil5-img-col { order: 2; }
.toil5-block--flip .toil5-content { order: 1; }
.toil5-img { width: 100%; height: 100%; min-height: 240px; object-fit: cover; display: block; }
.toil5-content {
  display: flex; flex-direction: column; justify-content: flex-start;
  padding: 52px 48px 36px 48px; background: #ffffff;
}
.toil5-eyebrow {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--teal); margin-bottom: 14px;
}
.toil5-title {
  font-family: var(--display); font-size: 40px;
  color: var(--teal-deep); line-height: 0.95; margin: 0 0 16px;
}
.toil5-desc {
  font-family: var(--text); font-size: 12px; font-weight: 600;
  color: var(--slate); line-height: 1.65; margin: 0 0 32px;
  text-transform: uppercase; letter-spacing: 0.015em;
}
.toil5-items { display: flex; flex-direction: column; flex: 1; justify-content: space-between; }
.toil5-item {
  border-bottom: 1px solid rgba(0,0,0,0.10); padding: 18px 0;
  display: flex; align-items: center; gap: 0;
}
.toil5-items > .toil5-item:first-child { border-top: 1px solid rgba(0,0,0,0.10); }
.toil5-item::before { display: none; }
.toil5-item-name {
  font-family: var(--text); font-size: 12px; font-weight: 400;
  color: var(--ink); text-transform: uppercase; letter-spacing: 0.07em;
  flex: 0 0 58%; line-height: 1.5;
}
.toil5-item-line { flex: 0 0 36px; height: 0; margin: 0 14px 0 0; border-top: 1.5px solid rgba(0,0,0,0.30); }
.toil5-item-icon { display: none; }
.toil5-apps {
  margin-top: 20px; padding: 14px 18px;
  background: #f7f6f4; border-left: 3px solid var(--teal);
}
.toil5-apps-label {
  font-family: var(--text); font-size: 10px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal-deep); margin-bottom: 4px;
}
.toil5-apps-text {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: var(--ink); line-height: 1.6; margin: 0;
}
.toil5-prod-panel {
  display: grid; grid-template-columns: 2fr 3fr;
  border-top: 1px solid rgba(0,0,0,0.06);
}
.toil5-prod-panel--img {
  grid-template-columns: 1fr 1.4fr 2.2fr;
}
.toil5-prod-img-wrap {
  overflow: hidden; line-height: 0; background: #ffffff;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.toil5-prod-img {
  width: 100%; height: 100%; object-fit: contain; display: block;
}
.toil5-prod-name {
  background: var(--teal-deep);
  font-family: var(--display); font-size: 36px; font-weight: 300;
  color: #ffffff;
  display: flex; align-items: center; justify-content: center;
  padding: 28px 24px; line-height: 1; letter-spacing: 0.02em;
}
.toil5-prod-body {
  background: #f7f6f4; padding: 24px 28px;
  display: flex; flex-direction: column; justify-content: center; gap: 6px;
}
.toil5-prod-label {
  font-family: var(--text); font-size: 14px; font-weight: 700;
  color: var(--teal); letter-spacing: 0.12em; text-transform: uppercase;
}
.toil5-prod-desc {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: var(--ink); line-height: 1.6; margin: 0;
}

/* ── GENERACIÓN 3-col block ── */
.toil5-gen3 {
  display: grid; grid-template-columns: 1fr 0.55fr 460px 100px;
  align-items: stretch; min-height: 520px;
  margin-top: 100px;
}
.toil5-gen3-img-col { overflow: hidden; position: relative; }
.toil5-gen3-img-col::after {
  content: ''; position: absolute; inset: 0;
  background: rgba(0,0,0,0.55); mix-blend-mode: multiply; pointer-events: none;
}
.tgelec-v6-wrap .toil5-gen3-img-col::after { display: none !important; }
.toil5-gen3-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tgelec-v6-wrap .toil5-gen3-img-col { height: auto !important; max-height: none !important; display: flex; align-items: center; justify-content: center; }
.tgelec-v6-wrap .toil5-gen3-img-col .toil5-gen3-img { width: auto; max-width: 100%; height: auto; max-height: 429px; object-fit: contain; }
#t-compresion .tgelec-v6-img-row .tgelec-prod-img { max-height: 372px !important; max-width: 100% !important; object-fit: contain !important; height: auto !important; width: auto !important; }
#t-modularidad .tgelec-v6-img-row .tgelec-prod-img { max-height: 370px !important; max-width: 100% !important; object-fit: contain !important; height: auto !important; width: auto !important; }
#t-compresion .tgelec-v6-head { text-align: center; }
#t-compresion .tgelec-v6-head .tgelec-intro { margin-left: auto; margin-right: auto; }
#t-modularidad .tgelec-v6-head { text-align: center; }
#t-modularidad .tgelec-v6-head .tgelec-intro { margin-left: auto; margin-right: auto; }
#t-modularidad .tgelec-v6-bullets .tgelec-v6-card:last-child,
#t-compresion .tgelec-v6-bullets .tgelec-v6-card:last-child {
  grid-column: 1 / -1;
  justify-self: center;
  width: calc(50% - 2px);
}
#t-modularidad .tgelec-v6-wrap .tgelec-prod-header,
#t-compresion .tgelec-v6-wrap .tgelec-prod-header {
  text-align: center !important;
  text-align-last: center !important;
  text-justify: none !important;
}
.toil5-gen3-plate {
  background: var(--teal-deep);
  display: flex; flex-direction: column; justify-content: center;
  padding: 32px 36px;
}
.toil5-gen3-eyebrow {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--teal-soft); margin-bottom: 14px;
}
.toil5-gen3-title {
  font-family: var(--display); font-size: 56px;
  color: var(--teal-soft); line-height: 0.95;
  text-transform: uppercase; margin: 0 0 20px;
}
.toil5-gen3-desc {
  font-family: var(--text); font-size: 11px; font-weight: 700;
  color: #ffffff; letter-spacing: 0.12em; text-transform: uppercase;
  line-height: 1.7; margin: 0 0 24px;
  border-top: 1px solid rgba(255,255,255,0.25); padding-top: 18px;
}
.toil5-gen3-apps-wrap {
  border-top: 1px solid rgba(255,255,255,0.15); padding-top: 20px;
}
.toil5-gen3-apps-label {
  font-family: var(--text); font-size: 10px; font-weight: 700;
  color: var(--teal-soft); letter-spacing: 0.12em;
  text-transform: uppercase; margin-bottom: 6px;
}
.toil5-gen3-apps-text {
  font-family: var(--text); font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,0.65); line-height: 1.6; margin: 0;
}
.toil5-gen3-prod { background: #ffffff; display: flex; flex-direction: column; }
.toil5-gen3-prod-header {
  background: #ffffff;
  font-family: var(--display); font-size: clamp(36px, 4.8vw, 58px); font-weight: 400;
  color: var(--teal-mist); text-transform: uppercase;
  text-align: justify; text-align-last: justify; text-justify: inter-character;
  padding: 20px 20px; line-height: 1;
}
.toil5-gen3-prod-img-wrap {
  flex: 1; background: transparent; overflow: hidden; line-height: 0;
  display: flex; align-items: center; justify-content: center; padding: 28px;
}
.toil5-gen3-prod-img { width: 100%; height: auto; object-fit: contain; display: block; max-height: 220px; }
.toil5-gen3-prod-panel {
  display: grid; grid-template-columns: 1fr 2fr;
  border-top: 1px solid rgba(0,0,0,0.06);
}
.toil5-gen3-prod-name {
  background: var(--teal);
  font-family: var(--display); font-size: 32px; font-weight: 300;
  color: #ffffff;
  display: flex; align-items: center; justify-content: center;
  padding: 24px 16px; line-height: 1;
}
.toil5-gen3-prod-body {
  background: var(--teal-mist); padding: 20px;
  display: flex; flex-direction: column; justify-content: center; gap: 6px;
}
.toil5-gen3-prod-label {
  font-family: var(--text); font-size: 14px; font-weight: 700;
  color: var(--teal); letter-spacing: 0.12em; text-transform: uppercase;
}
.toil5-gen3-prod-desc {
  font-family: var(--text); font-size: 12px; font-weight: 300;
  color: var(--ink); line-height: 1.6; margin: 0;
}
.toil5-gen3-apps {
  padding: 16px 20px; background: #f7f6f4;
  border-top: 1px solid rgba(0,0,0,0.08);
}
.toil5-gen3-apps-inner-label {
  font-family: var(--text); font-size: 10px; font-weight: 700;
  color: var(--teal-deep); letter-spacing: 0.12em;
  text-transform: uppercase; margin-bottom: 4px;
}
.toil5-gen3-apps-inner-text {
  font-family: var(--text); font-size: 12px; font-weight: 300;
  color: var(--ink); line-height: 1.6; margin: 0;
}

/* ── OPGM overlay card — flota sobre la imagen de Oil & Gas ── */
.toil5-overlay {
  position: absolute;
  left: 160px; top: 55%;
  transform: translateY(-50%);
  width: 460px;
  background: #ffffff;
  border-radius: 0;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.35);
  z-index: 10;
}
.toil5-overlay-header {
  font-family: var(--display); font-size: clamp(36px, 4.8vw, 58px); font-weight: 400;
  color: var(--teal-mist); text-transform: uppercase;
  text-align: justify; text-align-last: justify; text-justify: inter-character;
  padding: 20px 20px; line-height: 1;
}
.toil5-overlay-img-wrap {
  background: #000; overflow: hidden; line-height: 0;
  padding: 0;
}
.toil5-overlay-img { width: 100%; height: auto; object-fit: cover; display: block; }
.toil5-overlay-panel { display: grid; grid-template-columns: 2fr 3fr; }
.toil5-overlay-name {
  background: var(--teal);
  font-family: var(--display); font-size: 36px; font-weight: 300;
  color: #ffffff;
  display: flex; align-items: center; justify-content: center;
  padding: 28px 16px; line-height: 1;
}
.toil5-overlay-body {
  background: var(--teal-mist);
  padding: 22px 20px;
  display: flex; flex-direction: column; justify-content: center; gap: 8px;
}
.toil5-overlay-label {
  font-family: var(--text); font-size: 10px; font-weight: 700;
  color: var(--teal-deep); letter-spacing: 0.12em; text-transform: uppercase;
}
.toil5-overlay-desc {
  font-family: var(--text); font-size: 12px; font-weight: 300;
  color: var(--ink); line-height: 1.6; margin: 0;
}


/* ── Scroll reveal ──────────────────────────────── */
.rv { opacity: 0; transition: opacity 0.7s cubic-bezier(.22,.68,0,1.1), transform 0.7s cubic-bezier(.22,.68,0,1.1); }
.rv-up  { transform: translateY(36px); }
.rv-lft { transform: translateX(-36px); }
.rv-rgt { transform: translateX(36px); }
.rv-scl { transform: scale(0.93); }
.rv.vi  { opacity: 1; transform: none; }

/* ── Scroll-to-top button ───────────────────────── */
#tg-scroll-top {
  position: fixed; bottom: 32px; right: 32px; z-index: 9999;
  width: 48px; height: 48px;
  background: var(--teal); color: #fff;
  border: none; border-radius: 3px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  opacity: 0; transform: translateY(16px);
  transition: opacity 0.3s, transform 0.3s, background 0.2s;
  pointer-events: none;
}
#tg-scroll-top.vis { opacity: 1; transform: none; pointer-events: auto; }
#tg-scroll-top:hover { background: var(--teal-deep); }
#tg-scroll-top svg { width: 22px; height: 22px; stroke: #fff; }


/* ── v6 overrides ──────────────────────────────────────────── */

/* Cards Válvulas: todas al mismo alto por fila */
.products-grid { align-items: stretch !important; }

/* Card hover: área de imagen cambia a teal-mist y el blanco de la foto
   desaparece con mix-blend-mode: multiply */
.prod-card:hover .card-img { background: var(--teal-mist) !important; }
.prod-card:hover .card-img img { mix-blend-mode: multiply !important; }

/* Línea verde full-width entre secciones */
.v6-section-hr {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: 5px;
  background: var(--teal);
  display: block;
}

/* gen3: margen negativo para absorber espacio fantasma del translateY(-100px).
   position+z-index aseguran que pinte encima del fondo blanco de Compresión */
.toil5-gen3 { margin-top: -50px !important; position: relative !important; z-index: 1 !important; }

/* Compresión y Bombeo: items y apps al ancho del título (max-width en el contenedor) */
#t-compresion .toil5-item-name { flex: 1 1 auto !important; }
#t-compresion .toil5-item      { width: 100% !important; max-width: 100% !important; }
#t-compresion .toil5-content   { display: flex !important; flex-direction: column !important; }
#t-compresion .toil5-apps      { max-width: 68% !important; flex: 0 0 auto !important; margin-top: auto !important; margin-bottom: 60px !important; }

/* Oil & Gas items: mayor interlineado y distribución vertical */
.toil5-item { padding: 28px 0 !important; }
.toil5-item-name { line-height: 1.7 !important; }

/* gen3 plate: gris claro, título verde oscuro, mismo tamaño que subtitle */
.toil5-gen3-plate {
  background: #e8e8e8 !important;
}
.toil5-gen3-title {
  color: var(--teal-deep) !important;
  font-size: 40px !important;
}
.toil5-gen3-desc {
  color: #555 !important;
  border-top-color: rgba(0,0,0,0.15) !important;
}
.toil5-gen3-apps-wrap {
  border-top-color: rgba(0,0,0,0.15) !important;
}

/* "Producto Destacado / Productos Destacados" → gris 40% en todos los contextos */
.tgelec-prod-header,
.toil5-overlay-header,
.toil5-gen3-prod-header {
  color: rgba(0,0,0,0.40) !important;
}

/* Títulos de productos: verde oscuro */
.tgelec-prod-panel-label,
.toil5-gen3-prod-label {
  color: var(--teal-deep) !important;
}

/* OPGM card: debajo de la imagen principal — sin flotante */
#t-compresion .toil5-block {
  grid-template-rows: auto auto !important;
}
#t-compresion .toil5-img-col {
  grid-column: 1 !important;
  grid-row: 1 !important;
}
#t-compresion .toil5-content {
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;
}
.toil5-overlay {
  position: static !important;
  transform: none !important;
  top: auto !important;
  left: auto !important;
  width: 460px !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  justify-self: end !important;
  transform: translateY(-100px) !important;
  box-shadow: 0 4px 18px rgba(0,0,0,0.12) !important;
}

/* Recuperación de Gases: fondo blanco, espacio reducido bajo línea decorativa */
.tgelec-recup {
  background: #fff !important;
  border-top: none !important;
  border-bottom: 5px solid var(--teal) !important;
  margin-top: 0 !important;
}
/* Líneas internas en verde; vertical toca arriba y llega al borde inferior de la imagen */
.tgelec-recup-inner {
  align-items: stretch !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.tgelec-recup-left {
  border-right-color: var(--teal) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  padding-top: 110px !important;
  padding-bottom: 0 !important;
}
.tgelec-recup-body {
  padding-top: 110px !important;
  padding-bottom: 0 !important;
}
.tgelec-recup-img-wrap-col {
  padding-top: 100px !important;
  padding-bottom: 60px !important;
}
.tgelec-recup-hr {
  border-top-color: var(--teal) !important;
}
.tgelec-recup-title {
  color: #000 !important;
}
.tgelec-recup-lead {
  color: #000 !important;
}
.tgelec-recup-text {
  color: #444 !important;
}

/* Imágenes producto: evitar drag ghost blanco y tap highlight */
.prod-card {
  -webkit-tap-highlight-color: transparent;
}
.card-img img {
  -webkit-user-drag: none;
  user-drag: none;
  pointer-events: none;
}

/* Línea divisora decorativa entre Generación Eléctrica y Recuperación */
.v6-recup-divider {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-top: 48px;
  padding: 0;
  display: flex;
  justify-content: center;
}
.v6-recup-divider-inner {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 60px;
  box-sizing: border-box;
}
.v6-recup-divider-line {
  width: 100%;
  height: 1px;
  background: var(--teal);
}

/* Contacto: layout dos columnas × dos filas */
/* Hero Turbinas: título multiline + subtítulo */
.th-title { white-space: normal !important; }
.th-hero-sub {
  font-size: 20px;
  color: rgba(255,255,255,0.72);
  margin: 12px 0 0;
  font-family: var(--text);
  font-weight: 400;
  letter-spacing: 0;
}
/* Logo bar Solar Turbines + Rentech */
.t-logos-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 80px;
  padding: 40px 60px;
  background: #fff;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.t-logos-bar img {
  height: 44px;
  width: auto;
  object-fit: contain;
  opacity: 0.65;
  filter: grayscale(0.3);
  transition: opacity 0.2s, filter 0.2s;
}
.t-logos-bar img:hover { opacity: 1; filter: grayscale(0); }

.v4-contacto { padding: 100px 60px !important; }
.v6-contacto-inner {
  display: grid;
  grid-template-columns: minmax(0, 620px) minmax(0, 400px);
  column-gap: 80px;
  row-gap: 0;
  align-items: stretch;
  max-width: 1060px;
  margin: 0 auto;
}
/* Select de Asunto: mismo estilo que v4-form-input */
.v4-form-select {
  width: 100%;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 6px;
  padding: 10px 14px;
  font-family: var(--text);
  font-size: 14px;
  color: #fff;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  cursor: pointer;
  transition: border-color .2s;
}
.v4-form-select:focus { outline: none; border-color: var(--teal); }
.v4-form-select option { background: #1a2530; color: #fff; }
/* Fila 1: header centrado abarca las dos columnas */
.v6-contacto-header {
  grid-column: 1 / -1;
  min-width: 0;
  text-align: center !important;
  margin-bottom: 48px !important;
}
.v6-contacto-header .v4-contacto-top-title { text-align: center !important; }
.v6-contacto-header .section-eyebrow { justify-content: center !important; }
.v6-contacto-header .v4-contacto-top-sub {
  margin: 0 auto 20px !important;
  max-width: none !important;
  text-align: center;
}
/* Fila 2 col 1: formulario — ancho completo de la columna */
.v6-form-wrap { grid-column: 1; min-width: 0; max-width: 100% !important; width: 100% !important; margin: 0 !important; }
/* Fila 2 col 2: contactos */
.v6-contacto-right {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
  align-self: stretch;
  padding-left: 48px;
  border-left: 1px solid rgba(255,255,255,0.10);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.v6-contacto-chips { justify-content: center !important; margin-bottom: 0 !important; }
/* Botón enviar: texto en una sola línea, no se encoge */
.v4-form-submit { white-space: nowrap !important; flex-shrink: 0 !important; }
/* Bajadas de texto: tamaños ajustados */
.tgelec-intro       { font-size: 15px !important; }
.tgelec-recup-lead  { font-size: 13px !important; }
.toil5-desc         { font-size: 13px !important; }
.toil5-gen3-desc    { font-size: 13px !important; }
.t-serv-v5-lead     { font-size: 13px !important; }
/* Descripciones productos destacados: 12→13px */
.toil5-overlay-desc       { font-size: 13px !important; }
.toil5-gen3-prod-desc     { font-size: 13px !important; }
/* Aplicaciones: 13→14px */
.toil5-apps-text          { font-size: 14px !important; }
.toil5-gen3-apps-inner-text { font-size: 12px !important; }

/* Hero Válvulas: texto al mismo tamaño que hero Inicio (20px / 72% blanco) */
.v-hero-sub {
  font-size: 20px;
  color: rgba(255,255,255,0.72);
  font-weight: 400;
  white-space: normal;
}

/* SMT subtitle: tagline verde debajo del label */
.v6-smt-sub {
  font-family: var(--text);
  font-size: 13px;
  font-weight: 400;
  color: #555;
  letter-spacing: 0.04em;
  text-transform: none;
  margin-bottom: 8px;
  margin-top: 2px;
}

/* Generación plate: contenido arriba, apps compacto y sin estiramiento vertical.
   Usar #t-compresion para ganar especificidad sobre la regla
   #t-compresion .toil5-apps { flex: 1 } */
.toil5-gen3-plate {
  justify-content: center !important;
}
#t-compresion .toil5-gen3-plate .toil5-apps {
  flex: 0 0 auto !important;
  max-width: none !important;
  align-self: auto !important;
  margin-top: 12px !important;
  padding: 14px 10px !important;
}

/* SMT panel: evitar desbordamiento */
.toil5-gen3-prod-panel {
  width: 100% !important;
  min-width: 0 !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) !important;
}
/* SMT: apps ancho completo. Supera max-width:68% de #t-compresion */
#t-compresion .toil5-gen3-prod .toil5-apps {
  flex: 0 0 auto !important;
  max-width: none !important;
  width: 100% !important;
  align-self: stretch !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* Compresión y Bombeo: espacio uniforme + ancho que el título */
#t-compresion .toil5-items {
  justify-content: flex-start !important;
  flex: none !important;
  max-width: 68% !important;
}
#t-compresion .toil5-item {
  flex: 0 0 auto !important;
  padding: 30px 0 !important;
}

/* Generación Industrial items: icono izquierda + texto derecha */
.tgelec-item-head {
  flex-direction: row !important;
  align-items: center !important;
  gap: 18px !important;
}
.tgelec-item-line { display: none !important; }
.tgelec-item-icon { order: -1 !important; flex-shrink: 0 !important; }
.tgelec-item-icon svg { width: 24px !important; height: 24px !important; }
.tgelec-item-name { order: 1 !important; text-align: left !important; }

/* Dirección sin oval */
.v6-address-plain {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; color: rgba(255,255,255,0.55); font-family: var(--ui);
}
.v6-address-plain svg { width: 14px; height: 14px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 2; }
/* Chip de email oval outline blanco */
.v6-email-chip {
  display: inline-flex; align-items: center;
  max-width: 100%;
  border: 1px solid rgba(255,255,255,0.50); border-radius: 100px;
  padding: 7px 16px; margin-top: 6px;
  font-size: 13px; font-weight: 300; font-family: var(--ui);
  color: #fff !important; text-decoration: none;
  overflow-wrap: anywhere;
  transition: border-color 0.2s, color 0.2s;
}
.v6-email-chip:hover { border-color: var(--teal) !important; color: var(--teal) !important; }
.v6-cat-block {
  margin-bottom: 8px;
  padding-bottom: 0;
  border-bottom: none;
}
.v6-cat-block:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.v6-cat-title {
  font-family: var(--text); font-size: 10px; font-weight: 700;
  color: var(--teal); letter-spacing: 0.14em; text-transform: uppercase;
  margin-bottom: 10px;
}
.v6-contact-item { margin-bottom: 10px; }
.v6-contact-item:last-child { margin-bottom: 0; }
.v6-contact-name {
  font-family: var(--text); font-size: 14px; font-weight: 600;
  color: var(--white); margin-bottom: 4px;
}
/* Hero gradient reducido */
.t-hero-overlay {
  background: linear-gradient(160deg, rgba(9,10,10,0.10) 0%, rgba(9,10,10,0.38) 50%, rgba(9,10,10,0.60) 100%) !important;
}
/* Generación Industrial — columna simple v7 */
.tgelec-v6-wrap { max-width: 1200px; margin: 0 auto; padding: 100px 60px 28px; box-sizing: border-box; }
.tgelec-v6-head { text-align: left; margin-bottom: 36px; }
.tgelec-v6-head .tgelec-eyebrow { margin-bottom: 6px; }
.tgelec-v6-head .tgelec-intro { max-width: 900px; margin: 14px 0 0; }
.tgelec-v6-bullets {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin-bottom: 44px;
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
}
.tgelec-v6-card {
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 10px;
  padding: 10px 14px;
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: left;
  gap: 14px;
}
.tgelec-v6-icon {
  width: 46px; height: 46px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,100,80,0.08);
  border: 1px solid rgba(0,100,80,0.18);
  border-radius: 10px;
  flex-shrink: 0;
}
.tgelec-v6-icon svg {
  width: 24px; height: 24px;
  stroke: var(--teal); fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.tgelec-v6-card-text {
  font-size: 15px; color: var(--teal);
  font-family: var(--text); font-weight: 600; line-height: 1.4;
}
.tgelec-v6-img-row { text-align: center; margin-bottom: 32px; }
.tgelec-v6-img-row .tgelec-prod-img {
  max-width: 60%; border-radius: 12px; display: inline-block;
  max-height: 220px; object-fit: cover;
}
.tgelec-v6-products {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
/* Recuperación de Gases — 2 columnas full-screen v6 */
.tgelec-recup { min-height: auto; display: flex; align-items: flex-start; }
.tgelec-recup-v6 { grid-template-columns: 1fr !important; width: 100%; padding-top: 72px; padding-bottom: 72px !important; column-gap: 0 !important; }
.tgelec-recup-v6 .tgelec-recup-left {
  display: flex; flex-direction: column; justify-content: flex-start;
  align-items: center; text-align: center;
}
.tgelec-recup-v6 .tgelec-recup-body { padding: 0 !important; margin-top: 28px; }
.tgelec-recup-v6 .tgelec-recup-hr { margin-right: 0 !important; }
.tgelec-recup-v6 .tgelec-recup-img-wrap-col { padding-left: 0; width: 100%; max-width: 700px; justify-self: center; }
/* Eliminar línea vertical */
.tgelec-recup-v6 *,
.tgelec-recup-v6 *::before,
.tgelec-recup-v6 *::after {
  border-left: none !important; border-right: none !important;
}
.tgelec-recup-v6 .tgelec-recup-img-wrap,
.tgelec-recup-v6 .tgelec-recup-img { border: none !important; }
/* Línea superior full-ancho */
.tgelec-recup-v6-top-hr {
  grid-column: 1 / -1;
  border: none;
  border-top: 1.5px solid rgba(0,0,0,0.18);
  margin-top: 60px;
  margin-bottom: 28px;
}
.tgelec-recup-subtitle {
  font-family: var(--display); font-size: 40px;
  color: var(--teal-deep); line-height: 0.95; margin-top: 10px;
}
.tgelec-v6-wrap .tgelec-prod-header {
  padding: 14px 20px !important;
  text-align: left !important; text-align-last: auto !important;
  text-justify: none !important;
  letter-spacing: 0.07em !important;
  font-size: clamp(28px, 3.6vw, 46px) !important;
  background: rgba(0,0,0,0.025) !important;
  border-radius: 6px !important;
  width: 100% !important; box-sizing: border-box !important;
}
/* Animaciones scroll v6 */
.v6-up,.v6-left,.v6-right { opacity: 0; }
.v6-up.v6-in   { animation: v6fu 0.65s cubic-bezier(0.22,1,0.36,1) forwards; }
.v6-left.v6-in { animation: v6fl 0.65s cubic-bezier(0.22,1,0.36,1) forwards; }
.v6-right.v6-in{ animation: v6fr 0.65s cubic-bezier(0.22,1,0.36,1) forwards; }
@keyframes v6fu { from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:none;} }
@keyframes v6fl { from{opacity:0;transform:translateX(-30px);}to{opacity:1;transform:none;} }
@keyframes v6fr { from{opacity:0;transform:translateX(30px);}to{opacity:1;transform:none;} }
.tgelec-v6-products { gap: 0 !important; }
/* OIL & GAS: imagen flush a línea verde, espacio solo en columna de texto */
#t-compresion .toil5-content { padding-top: 80px !important; }

/* ══ TURBINAS RESPONSIVE — al final para pisar el CSS base ══════ */
@media (max-width: 768px) {
  /* Hero */
  .t-hero-content { padding: 0 20px 40px; }
  .t-hero-title { font-size: 44px; }
  .t-hero-sub { font-size: 14px; }
  .t-hero-stats { flex-direction: column; gap: 20px; }
  .t-stat-divider { display: none; }

  /* Subnav — scroll horizontal */
  .t-subnav {
    padding: 10px 16px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    justify-content: flex-start !important;
    top: 56px !important;
  }
  .t-subnav-btn { white-space: nowrap !important; font-size: 11px; padding: 7px 14px; }

  /* Secciones */
  .t-section { padding: 48px 20px !important; }

  /* Modelos — 2 cols */
  .t-models-v4 { grid-template-columns: 1fr 1fr !important; gap: 12px; }

  /* Generación Industrial */
  .tgelec-v6-wrap { padding: 60px 20px 20px !important; }
  .tgelec-v6-bullets { grid-template-columns: 1fr !important; }
  .tgelec-v6-img-row .tgelec-prod-img { max-width: 100% !important; max-height: 180px; }

  /* PGM / MPP panels — apilados */
  .tgelec-v6-products { grid-template-columns: 1fr !important; }
  .tgelec-prod-panel { grid-template-columns: 1fr !important; }
  .tgelec-prod-panel-name { padding: 20px 24px !important; font-size: 28px; justify-content: flex-start; }
  .tgelec-prod-panel-body { padding: 20px 24px !important; }

  /* Cogeneración */
  .tgelec-recup { margin-top: 24px !important; }
  .tgelec-recup-inner { grid-template-columns: 1fr !important; padding: 40px 20px !important; }
  .tgelec-recup-left { padding-right: 0 !important; border-right: none !important; border-bottom: 1px solid rgba(255,255,255,0.25); padding-bottom: 32px !important; margin-bottom: 32px; }
  .tgelec-recup-body { padding: 0 !important; }
  .tgelec-recup-img-wrap-col { margin-top: 24px; width: 100% !important; max-width: 100% !important; justify-self: stretch !important; }

  /* OIL & GAS */
  .toil5-block { grid-template-columns: 1fr !important; margin-top: 24px; }
  .toil5-block--flip .toil5-img-col { order: 0 !important; }
  .toil5-block--flip .toil5-content { order: 0 !important; }
  .toil5-content { padding: 32px 20px 24px !important; }
  #t-compresion .toil5-content { padding-top: 32px !important; }
  .toil5-prod-panel { grid-template-columns: 1fr !important; }

  /* Títulos de sección: permitir salto de línea (algunos tienen white-space:nowrap inline) */
  .section-title { white-space: normal !important; }

  /* Contacto — apilado */
  .v6-contacto-inner { grid-template-columns: 1fr !important; column-gap: 0 !important; max-width: 100% !important; }
  .v6-contacto-right { grid-column: 1 !important; grid-row: auto !important; padding-left: 0 !important; border-left: none !important; margin-top: 32px; }
  .v4-form-submit { width: 100% !important; padding: 16px 20px !important; text-align: center; }


  /* Servicio */
  .t-serv-v5-inner { grid-template-columns: 1fr !important; padding: 40px 20px !important; }
  .t-serv-v5-inner > * { min-width: 0 !important; }
  .t-serv-cards-grid { grid-template-columns: 1fr !important; }
  .t-serv-cards-grid > * { min-width: 0 !important; }
  .t-serv-v5-img-col { margin-right: 0 !important; margin-bottom: 24px; max-height: 220px; }
  .t-serv-v5-body { padding: 0 !important; border-right: none !important; border-bottom: 1px solid rgba(255,255,255,0.15); padding-bottom: 32px !important; margin-bottom: 32px; }
  .t-serv-v5-hr { margin-right: 0 !important; }
  .t-serv-v5-right { padding-left: 0 !important; }
  .t-serv-v5-title { font-size: 40px !important; }
  .t-serv-v5-stat { font-size: 52px !important; }
}

@media (max-width: 480px) {
  .t-hero-title { font-size: 36px !important; }
  .t-models-v4 { grid-template-columns: 1fr !important; }
  .tgelec-v6-wrap { padding: 48px 16px 16px !important; }
}

/* ════════════════════════════════════════════════════════════════
   MENÚ MÓVIL
   ════════════════════════════════════════════════════════════════ */
.nav-burger {
  display: none;
  width: 44px; height: 44px;
  flex: none;
  align-items: center; justify-content: center;
  flex-direction: column; gap: 5px;
  background: transparent; border: 0; padding: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.nav-burger span {
  display: block;
  width: 24px; height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: transform 0.28s ease, opacity 0.18s ease, background 0.3s;
}
nav.scrolled .nav-burger span,
nav.solid .nav-burger span { background: var(--ink); }
.nav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity: 0; }
.nav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.nav-burger:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; border-radius: 4px; }

.nav-mobile {
  position: fixed; top: 88px; left: 0; right: 0; z-index: 299;
  background: var(--white);
  border-top: 1px solid var(--line);
  box-shadow: 0 18px 36px rgba(9,10,10,.18);
  padding: 8px 20px 24px;
  display: flex; flex-direction: column;
  transform: translateY(-12px);
  opacity: 0;
  transition: transform 0.26s ease, opacity 0.26s ease;
}
.nav-mobile.open { transform: translateY(0); opacity: 1; }
.nav-mobile-link {
  font-family: var(--ui);
  font-size: 18px; color: var(--ink);
  padding: 16px 4px;
  border-bottom: 1px solid var(--line);
  display: block;
  transition: color 0.18s;
}
.nav-mobile-link:hover, .nav-mobile-link:focus-visible { color: var(--teal); }
.nav-mobile-cta {
  font-family: var(--ui); font-size: 13px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--white); background: var(--teal);
  border: 0; border-radius: var(--r-pill);
  padding: 16px 24px; margin-top: 22px;
  cursor: pointer; width: 100%;
  transition: background 0.2s;
}
.nav-mobile-cta:hover { background: var(--teal-deep); }
.nav-mobile-foot {
  margin-top: 20px;
  display: flex; flex-direction: column; gap: 6px;
  font-size: 13px; color: var(--gray);
}
.nav-mobile-foot a { color: var(--teal); }

.nav-scrim {
  position: fixed; inset: 88px 0 0; z-index: 298;
  background: rgba(9,10,10,0.45);
  opacity: 0; transition: opacity 0.26s ease;
}
.nav-scrim.open { opacity: 1; }

/* Hasta 768 px los links entraban a dos líneas y chocaban con el botón
   Consultar, así que a partir de ahí manda el menú desplegable. */
@media (max-width: 768px) {
  .nav-burger { display: flex; }
  .nav-links  { display: none; }
  .nav-cta    { display: none; }
}
@media (max-width: 640px) {
  .nav-logo-img { height: 52px; }
}
@media (min-width: 769px) {
  .nav-mobile, .nav-scrim { display: none !important; }
}

/* ════════════════════════════════════════════════════════════════
   FORMULARIO DE CONTACTO: validación y estado
   ════════════════════════════════════════════════════════════════ */
.form-hp {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
  white-space: nowrap;
}
.form-error {
  font-family: var(--text);
  font-size: 13px; line-height: 1.4;
  color: #FFC4B3;
  margin: 2px 0 0;
}
.v4-form-input.is-invalid,
.v4-form-textarea.is-invalid,
.v4-form-select.is-invalid {
  border-color: #FF8A6B !important;
}
.form-status {
  font-family: var(--text);
  font-size: 14px; line-height: 1.5;
  margin: 20px 0 0;
  padding: 14px 18px;
  border-radius: var(--r-md);
  border: 1px solid transparent;
}
.form-status.ok {
  color: #C7F5EA;
  background: rgba(28,150,132,0.18);
  border-color: rgba(123,232,216,0.45);
}
.form-status.error {
  color: #FFC4B3;
  background: rgba(255,138,107,0.14);
  border-color: rgba(255,138,107,0.4);
}
.form-status.sending {
  color: rgba(255,255,255,0.85);
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.2);
}
.v4-form-submit:disabled { opacity: 0.6; cursor: default; }

/* Foco visible en todos los campos */
.v4-form-input:focus-visible,
.v4-form-textarea:focus-visible,
.v4-form-select:focus-visible,
.v4-form-submit:focus-visible {
  outline: 2px solid var(--teal-soft);
  outline-offset: 2px;
}

/* Logo del nav como enlace al inicio */
.nav-logo-link { display: block; flex-shrink: 0; line-height: 0; }

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE · contacto y asesoramiento en celular
   A 375 px el formulario conservaba los márgenes de escritorio
   (60 px de sección + 56 px de caja por lado) y dos columnas: cada
   campo quedaba de unos 70 px, y a 320 px la página se desbordaba.
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .v4-contacto { padding: 72px 24px !important; }
  .v4-form-wrap { padding: 32px 24px 28px; border-radius: 14px; }
  .asesora-section { grid-template-columns: minmax(0, 1fr); }
  .asesora-text { padding: 48px 24px; }
  /* El botón ya ocupa todo el ancho desde 768 px: la nota va arriba */
  .v4-form-footer { flex-direction: column; align-items: stretch; gap: 16px; margin-top: 24px; }
  .v4-form-note { text-align: center; }
}
@media (max-width: 640px) {
  .v4-contacto { padding: 56px 16px !important; }
  .v4-form-wrap { padding: 24px 18px; }
  .v4-form-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .v6-contacto-inner, .v6-form-wrap, .v4-form-field { min-width: 0; }
  .v4-form-input, .v4-form-select, .v4-form-textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
}

/* ════════════════════════════════════════════════════════════════
   UX · accesibilidad, lectura y uso con el dedo
   ════════════════════════════════════════════════════════════════ */

/* ── Saltar al contenido: invisible hasta que se navega con teclado ── */
.skip-link {
  position: fixed; top: 12px; left: 12px; z-index: 10000;
  background: var(--teal); color: #fff;
  font-family: var(--ui); font-size: 14px; font-weight: 700;
  padding: 12px 18px; border-radius: 8px;
  transform: translateY(-160%); transition: transform 0.2s;
}
.skip-link:focus { transform: none; }
main:focus { outline: none; }

/* ── Foco visible al navegar con teclado ── */
:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 3px;
}
.v4-contacto :focus-visible,
.filter-bar :focus-visible,
.t-section-dark :focus-visible,
footer :focus-visible { outline-color: var(--teal-soft); }

/* ── Los anclajes no quedan tapados por el nav fijo ── */
:where([id]) { scroll-margin-top: 104px; }
#contacto, #representaciones, #quienes-somos, #clientes { scroll-margin-top: 88px; }

/* ── Hero: alto real de la pantalla en celular, sin saltos por la barra
      del navegador. Si el contenido no entra (celular en horizontal),
      el hero crece en lugar de cortarlo. ── */
.hero { min-height: 100vh; min-height: 100svh; }
@media (max-height: 520px) and (orientation: landscape) {
  .hero-content { padding-top: 120px; padding-bottom: 48px; }
  .hero h1 { font-size: clamp(40px, 9vh, 64px); }
}

/* ── Estado vacío de los filtros de Válvulas ── */
.sin-resultados {
  text-align: center; padding: 56px 24px 72px;
  font-family: var(--text); color: var(--graphite);
}
.sin-resultados p { font-size: 17px; margin: 0 0 20px; }
.sin-resultados-btn {
  font-family: var(--ui); font-size: 13px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: #fff; background: var(--teal); border: 0; border-radius: 999px;
  padding: 0 28px; min-height: 48px; cursor: pointer;
}
.sin-resultados-btn:hover { background: var(--teal-dark); }

/* ── Textos mínimos legibles ── */
.card-badge { font-size: 10px !important; }
@media (max-width: 768px) {
  .rep-origin, .tag, .v6-cat-title, .footer-bottom,
  .t-subnav-btn, .v-hero-eyebrow, .v4-brand-btn,
  .count-text, .count-num, .card-brand { font-size: 12px !important; }
  .card-badge { font-size: 11px !important; }
}

/* ── Áreas para tocar de al menos 44 px en pantallas táctiles ── */
@media (pointer: coarse) {
  .footer-links-wrap a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px; }
  .footer-info a, .v4-contacto-chip a, .nav-mobile-foot a { display: inline-flex; align-items: center; min-height: 44px; }
  .v6-email-chip { min-height: 44px !important; display: inline-flex !important; align-items: center; }
  .t-subnav-btn { min-height: 44px; display: inline-flex !important; align-items: center; }
  .v4-brand-btn { min-height: 44px; }
  .v4-form-input, .v4-form-select { min-height: 48px; }
  .card-toggle { position: relative; }
  .card-toggle::before {
    content: ''; position: absolute; inset: -10px; border-radius: 50%;
  }
}

/* ── Botón volver arriba: más chico y fuera del contenido en celular ── */
@media (max-width: 640px) {
  #tg-scroll-top { width: 44px; height: 44px; right: 14px; bottom: 14px; }
}

/* ── Menos movimiento: el contenido aparece quieto ── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .reveal, .reveal-left, .reveal-right, .reveal-scale,
  .rv, .v6-up, .v6-left, .v6-right, .hero-content > * {
    opacity: 1 !important; transform: none !important; animation: none !important;
  }
  .clientes-track, .v4-clientes-track, .v-logos-track { animation: none !important; transform: none !important; }
}

/* ── Válvulas en celular: filtros en filas deslizables de costado ──
   Apilados ocupaban 723 px, casi una pantalla entera antes del primer
   producto. En una fila que se desliza con el dedo quedan en ~130 px. */
@media (max-width: 640px) {
  .filter-bar { align-items: stretch !important; max-width: 100%; }
  .filter-row-1, .v4-brand-row {
    width: 100% !important; max-width: 100% !important; min-width: 0; box-sizing: border-box;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    touch-action: pan-x pan-y;
    padding: 10px 40px 10px 16px !important; gap: 6px !important;
    scroll-padding-inline: 16px;
  }
  /* Fundido en el borde derecho que indica que hay más para deslizar.
     Va sobre la barra y no sobre las filas: en Safari de iPhone, una
     máscara aplicada al elemento que se desplaza bloqueaba el deslizamiento. */
  .filter-bar::after {
    content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 44px;
    background: linear-gradient(to right, rgba(9,10,10,0), var(--black));
    pointer-events: none; z-index: 2;
  }
  .filter-row-1::-webkit-scrollbar, .v4-brand-row::-webkit-scrollbar { display: none; }
  .filter-row-1 > *, .v4-brand-row > * { flex: 0 0 auto; white-space: nowrap; width: auto !important; }
  .ftype-btn { padding-left: 14px !important; padding-right: 14px !important; min-height: 44px; }
}

/* ── Válvulas: columnas de la grilla según el ancho ──
   Una regla general fijaba 4 columnas en todos los tamaños y pisaba las
   de celular: a 375 px cada ficha medía 63 px de ancho. */
@media (max-width: 1200px) { .products-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 24px 28px 48px; } }
@media (max-width: 900px)  { .products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 20px 20px 44px; } }
@media (max-width: 560px)  { .products-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 16px 16px 40px; } }

/* ── Turbinas en celular: el submenú se pegaba 32 px por encima del
      borde del nav y tapaba parte del logo ── */
@media (max-width: 768px) {
  .t-subnav { top: 88px !important; }
}
/* El menú desplegable siempre por encima del submenú y los filtros */
.nav-scrim  { z-index: 650 !important; }
.nav-mobile { z-index: 700 !important; }

/* ════════════════════════════════════════════════════════════════
   CONTRASTE AA (WCAG 2.1: 4,5:1 texto normal, 3:1 texto grande)
   El verde de marca #1C9684 da 3,66:1 con blanco. Para TEXTO se usa
   el --teal-dark del mismo sistema (#15776A, 5,41:1). Filetes, íconos
   y fondos decorativos siguen con el verde original.
   ════════════════════════════════════════════════════════════════ */

/* Verde como color de texto sobre fondos claros */
.stat-label,
.tgelec-v6-card-text,
.count-num,
.rep-card .rep-origin,
.prod-card:not(.card-respaldo) .card-series,
.prod-card:not(.card-respaldo) .card-name { color: var(--teal-dark) !important; }
.section-eyebrow { color: var(--teal-dark); }
nav.scrolled .nav-links a.active, nav.solid .nav-links a.active,
nav.scrolled .nav-links a:hover,  nav.solid .nav-links a:hover { color: var(--teal-dark); }
nav.scrolled .nav-cta, nav.solid .nav-cta { color: var(--teal-dark); border-color: var(--teal-dark); }
nav.scrolled .nav-cta:hover, nav.solid .nav-cta:hover { background: var(--teal-dark); color: #fff; }

/* Verde como fondo de botones con texto blanco */
.btn-primary, .v4-form-submit, .nav-mobile-cta, .sin-resultados-btn { background: var(--teal-dark) !important; }
.btn-primary:hover, .v4-form-submit:hover, .nav-mobile-cta:hover, .sin-resultados-btn:hover { background: var(--teal-deep) !important; }
.t-subnav .t-subnav-btn.active { background: var(--teal-dark) !important; border-color: var(--teal-dark) !important; }

/* Grises */
.t-mv4-lbl, .t-mv4-unit { color: #767676 !important; }
.count-text { color: #6F6F6F !important; }
.prod-card:not(.card-respaldo) .card-brand { color: #767676 !important; }
.tgelec-prod-header { color: rgba(0,0,0,0.5) !important; }

/* Blanco translúcido sobre negro */
.footer-bottom { color: rgba(255,255,255,0.55) !important; }
.prod-card.card-respaldo .card-tipo-label { color: rgba(255,255,255,0.55) !important; }
.ftype-btn:not(.active) { color: rgba(255,255,255,0.58) !important; }
.ftype-btn:not(.active):hover { color: rgba(255,255,255,0.85) !important; }
#clientes .section-eyebrow, #clientes .section-eyebrow span { color: var(--teal-dark) !important; }
.card-badge { background: var(--teal-dark) !important; }
.prod-card.card-respaldo .card-brand { color: rgba(123,232,216,0.72) !important; }
/* Subtítulos de los heroes: de 72 % a 90 % de opacidad para llegar a 4,5:1
   sobre las zonas más claras de las fotos */
.hero-sub, .hero-sub span, .th-hero-sub, .v-hero-sub { color: rgba(255,255,255,0.9) !important; }
/* Respaldo técnico local: al pasar el mouse, las demás fichas aclaran el
   área de la imagen, pero esta tiene un título blanco sobre fondo oscuro
   y el texto desaparecía. Mantiene su fondo, apenas más claro como señal. */
.prod-card.card-respaldo:hover .card-img { background: #162020 !important; }
/* Hover de las tarjetas de representaciones: verde oscuro de marca y
   textos casi blancos (antes 2,9:1) */
.rep-card:hover { background: var(--teal-dark) !important; }
.rep-card:hover .rep-origin, .rep-card:hover .rep-desc { color: rgba(255,255,255,0.92) !important; }
/* Marca de las fichas: también legible sobre el verde claro del hover */
.prod-card:not(.card-respaldo) .card-brand { color: #696969 !important; }

/* Hero de Válvulas: tenía alto fijo (62vh) con el texto alineado abajo.
   En celular el texto no entraba y sobresalía por arriba, detrás del nav
   (a 320 px empezaba 95 px fuera de la pantalla). Ahora es alto mínimo:
   en escritorio queda igual y en celular crece lo necesario. */
.v-hero { height: auto !important; min-height: max(62vh, 480px); padding-top: 120px; }

/* ── Heroes en AA (opción B, elegida) ──
   Medido sobre los píxeles de las fotos: el verde de marca en la palabra
   destacada daba 1,3 a 1,8 contra 3 requerido. Se usa el verde claro de la
   marca, el rótulo chico pasa a blanco y se suma una capa oscura suave
   desde abajo. Aprueba en las tres páginas a 1440, 768, 375 y 320 px. */
.hero h1 em, .v-hero h1 em, .th-title-green { color: var(--teal-soft) !important; }
.hero-eyebrow, .v-hero-eyebrow { color: #fff !important; }
.hero-bg {
  background:
    linear-gradient(to top, rgba(9,10,10,0.3) 0%, rgba(9,10,10,0.24) 55%, rgba(9,10,10,0) 90%),
    linear-gradient(160deg, rgba(9,10,10,0.15) 0%, rgba(9,10,10,0.6) 55%, rgba(9,10,10,0.88) 100%) !important;
}
.t-hero-overlay {
  background:
    linear-gradient(to top, rgba(9,10,10,0.3) 0%, rgba(9,10,10,0.24) 55%, rgba(9,10,10,0) 90%),
    linear-gradient(160deg, rgba(9,10,10,0.1) 0%, rgba(9,10,10,0.38) 50%, rgba(9,10,10,0.6) 100%) !important;
}
.v-hero-bg::after {
  background:
    linear-gradient(to top, rgba(9,10,10,0.3) 0%, rgba(9,10,10,0.24) 55%, rgba(9,10,10,0) 90%),
    linear-gradient(160deg, rgba(9,10,10,0.25) 0%, rgba(9,10,10,0.75) 60%, rgba(9,10,10,0.95) 100%) !important;
}
/* Válvulas en celular: el rótulo queda arriba, donde la foto es más clara */
@media (max-width: 640px) {
  .v-hero-bg::after {
    background:
      linear-gradient(rgba(9,10,10,0.3), rgba(9,10,10,0.3)),
      linear-gradient(to top, rgba(9,10,10,0.3) 0%, rgba(9,10,10,0.24) 55%, rgba(9,10,10,0) 90%),
      linear-gradient(160deg, rgba(9,10,10,0.25) 0%, rgba(9,10,10,0.75) 60%, rgba(9,10,10,0.95) 100%) !important;
  }
}

/* ── Página 404 ── */
.error-404 {
  background: var(--black);
  min-height: calc(100vh - 88px);
  min-height: calc(100svh - 88px);
  margin-top: 88px;
  display: flex; align-items: center;
  padding: 80px 60px;
  border-bottom: 4px solid var(--teal);
}
.error-404-inner { max-width: 720px; }
.error-404-text {
  font-family: var(--text); font-size: 18px; line-height: 1.6;
  color: rgba(255,255,255,0.85); margin: 0 0 36px; max-width: 46ch;
}
.error-404-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 36px; }
.error-404-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 28px; }
.error-404-links a {
  font-family: var(--ui); font-size: 15px; color: var(--teal-soft);
  display: inline-flex; align-items: center; min-height: 44px;
  border-bottom: 1px solid rgba(123,232,216,0.35);
}
.error-404-links a:hover { color: #fff; border-bottom-color: #fff; }
@media (max-width: 640px) {
  .error-404 { padding: 56px 20px; }
  .error-404-actions a { flex: 1 1 100%; text-align: center; justify-content: center; }
}

/* ── Títulos semánticos para buscadores y lectores de pantalla ──
   Estas cajas pasaron de <div> a <h2>/<h3> sin cambiar su aspecto: se
   anulan los estilos por defecto del navegador con especificidad cero,
   así siguen mandando las clases de siempre. */
:where(h2, h3):where(.tgelec-title, .tgelec-recup-title, .t-serv-v5-title,
  .tgelec-recup-subtitle, .t-mv4-name, .tgelec-prod-panel-name, .card-name, .v6-cat-title) {
  margin: 0; font-size: inherit; font-weight: inherit;
}

/* Rótulo del hero del inicio: en fila flexible, si el navegador envuelve
   parte del texto (Safari en iPhone lo convertía en enlace de dirección),
   la frase se parte con un hueco. Como bloque se lee siempre como una sola. */
.hero-eyebrow { display: block; }

/* ════════════════════════════════════════════════════════════════
   CELULAR · márgenes y bloques que conservaban el diseño de escritorio
   Medido a 390 px: las secciones del inicio mantenían 60 px de margen por
   lado (las tarjetas quedaban de 255 px), y en Turbinas la última tarjeta
   de beneficios y los paneles de productos destacados seguían en columnas.
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .rep-section, .mision-section, .clientes-inner, footer,
  .th-title-bar, .v-hero-content { padding-left: 32px !important; padding-right: 32px !important; }
}
@media (max-width: 640px) {
  .rep-section, .mision-section, .clientes-inner, footer,
  .th-title-bar, .v-hero-content { padding-left: 20px !important; padding-right: 20px !important; }
  .count-bar { padding-left: 20px !important; padding-right: 20px !important; }
  .rep-card { padding-left: 22px; padding-right: 22px; }
  .mvv-card { padding-left: 24px; padding-right: 24px; }

  /* Beneficios: todas las tarjetas al mismo ancho, también la última */
  .tgelec-v6-bullets > * {
    grid-column: auto !important; justify-self: stretch !important;
    width: auto !important; max-width: none !important;
  }

  /* Paneles de producto destacado (OPGM, SMT): de tres columnas a una */
  .tgelec-v6-wrap [style*="grid-template-columns:1fr 2fr 2fr"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .tgelec-v6-wrap [style*="grid-template-columns:1fr 2fr 2fr"] > * { min-width: 0; }
}

/* Bloques a todo el ancho: 100vw incluye la barra de desplazamiento en
   computadoras que la muestran fija (Windows, algunos Mac), y la página se
   corría unos píxeles de costado. --sb la calcula el script. */
.tgelec-recup, .t-serv-v5, .v6-section-hr, .v6-recup-divider {
  width: calc(100vw - var(--sb, 0px)) !important;
  margin-left: calc(50% - (100vw - var(--sb, 0px)) / 2) !important;
}

/* ════════════════════════════════════════════════════════════════
   Navegación en celular y tablet: botonera fija visible
   en lugar del menú hamburguesa. Se activa con body.menu-botonera.
   En escritorio no cambia nada.
   ════════════════════════════════════════════════════════════════ */
.botonera-movil { display: none; }

@media (max-width: 768px) {
  /* Fila del logo: más baja y siempre blanca, con «Consultar» a la vista */
  .menu-botonera #nav {
    height: 64px;
    background: rgba(255,255,255,0.98) !important;
    box-shadow: none !important;
    padding: 0 16px !important;
  }
  .menu-botonera .nav-logo-img { height: 42px !important; filter: none !important; }
  .menu-botonera .nav-burger,
  .menu-botonera .nav-mobile,
  .menu-botonera .nav-scrim { display: none !important; }
  .menu-botonera .nav-cta {
    display: inline-flex !important; align-items: center; justify-content: center;
    min-height: 44px; padding: 0 18px;
    color: var(--teal-dark) !important; border-color: var(--teal-dark) !important;
    background: #fff !important; font-size: 13px;
  }
  .menu-botonera .nav-cta:hover { background: var(--teal-dark) !important; color: #fff !important; }

  /* Botonera de secciones */
  .menu-botonera .botonera-movil {
    display: grid; grid-template-columns: 1fr 1.35fr 1fr;
    position: fixed; top: 64px; left: 0; right: 0; z-index: 299;
    background: #fff;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 6px 16px rgba(9,10,10,0.08);
  }
  .menu-botonera .botonera-item {
    display: flex; align-items: center; justify-content: center; text-align: center;
    min-height: 54px; padding: 6px 8px;
    font-family: var(--ui); font-size: 15px; font-weight: 600; line-height: 1.2;
    color: var(--ink);
  }
  .menu-botonera .botonera-item + .botonera-item { border-left: 1px solid var(--line); }
  .menu-botonera .botonera-item.activo {
    color: var(--teal-dark);
    box-shadow: inset 0 -4px 0 var(--teal-dark);
    background: var(--teal-mist);
  }
  .menu-botonera .botonera-item:active { background: var(--teal-mist); }

  /* El contenido arranca debajo de las dos filas (64 + 56 px) */
  .menu-botonera .hero-content { padding-top: 136px; }
  .menu-botonera :where([id]) { scroll-margin-top: 136px; }
  .menu-botonera #contacto, .menu-botonera #representaciones,
  .menu-botonera #quienes-somos, .menu-botonera #clientes { scroll-margin-top: 120px; }
}

@media (max-width: 768px) {
  /* Offsets propios de cada página (encabezado de 64 + 56 px) */
  .menu-botonera .t-subnav { top: 120px !important; }
  .menu-botonera .v-hero { padding-top: 150px; }
  .menu-botonera .error-404 {
    margin-top: 120px;
    min-height: calc(100vh - 120px);
    min-height: calc(100svh - 120px);
  }
}

/* ── Pie: logo en sus colores originales y firma del estudio ── */
.footer-logo-img { filter: none !important; height: 40px; }
.footer-bottom a {
  color: inherit; text-decoration: underline; text-decoration-color: rgba(255,255,255,0.35);
  text-underline-offset: 3px; transition: color 0.2s, text-decoration-color 0.2s;
}
.footer-bottom a:hover { color: var(--teal-soft); text-decoration-color: var(--teal-soft); }