/* ============================================================
   SUNNA STUDIO LEGAL · Activo de servicios (servicios.sunna.mx)
   Tokens y componentes heredados de sunna.mx (repo landing-sunna,
   SISTEMA-DISENO.md). Misma familia, misma paleta, mismos gestos.
   ============================================================ */

/* Plus Jakarta Sans (variable 400-800), autoalojada. Licencia OFL 1.1 */
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("assets/fonts/PlusJakartaSans-latin-ext.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;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("assets/fonts/PlusJakartaSans-latin.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;
}
/* Iconos Phosphor 2.1.1, subset autoalojado del sitio (27 glifos). Licencia MIT */
@font-face {
  font-family: "Phosphor";
  src: url("assets/fonts/Phosphor-sunna-v2.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
.ph {
  font-family: "Phosphor" !important;
  speak: never;
  font-style: normal; font-weight: normal; font-variant: normal;
  text-transform: none; line-height: 1; letter-spacing: 0;
  font-feature-settings: "liga";
  font-variant-ligatures: discretionary-ligatures;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
}
.ph.ph-arrow-right::before { content: "\e06c"; }
.ph.ph-buildings::before { content: "\e102"; }
.ph.ph-chats-circle::before { content: "\e17e"; }
.ph.ph-check::before { content: "\e182"; }
.ph.ph-file-text::before { content: "\e23a"; }
.ph.ph-instagram-logo::before { content: "\e2d0"; }
.ph.ph-linkedin-logo::before { content: "\e2ee"; }
.ph.ph-list-checks::before { content: "\eadc"; }
.ph.ph-rocket-launch::before { content: "\e3fe"; }
.ph.ph-shield-check::before { content: "\e40c"; }
.ph.ph-trend-up::before { content: "\e4ae"; }

:root {
  /* Paleta oficial */
  --sunna-carbon:  #080605;
  --sunna-naranja: #EA6029;
  --sunna-taupe:   #82746A;
  --sunna-blanco:  #FFFFFF;

  /* Escalas */
  --carbon-10: #E6E6E6;
  --carbon-30: #B5B4B4;
  --carbon-50: #848282;
  --carbon-70: #525150;
  --carbon-90: #211F1E;
  --naranja-10: #FDEFEA;
  --naranja-30: #F9CFBF;
  --naranja-60: #F2A07F;
  --naranja-hover: #CE5424;
  --taupe-10: #F2F1F0;
  --taupe-30: #DAD5D2;
  --taupe-60: #B4ACA6;

  --font-digital: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;

  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 150ms;
  --dur: 240ms;
  --dur-slow: 320ms;

  --shadow-md: 0 4px 16px rgba(8,6,5,.08);
  --shadow-lg: 0 12px 40px rgba(8,6,5,.16);

  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 24px;

  --z-nav: 40;

  --pad-x: clamp(20px, 5vw, 72px);
  --wrap: 1100px;
}

/* ============ Base ============ */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body {
  margin: 0;
  font-family: var(--font-digital);
  color: var(--sunna-carbon);
  background: var(--sunna-blanco);
  -webkit-font-smoothing: antialiased;
  -webkit-hyphens: manual; hyphens: manual;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }
h1, h2, h3, h4 { text-wrap: balance; margin: 0; }
p { text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--sunna-naranja); outline-offset: 3px; }
.wrap { max-width: var(--wrap); margin: 0 auto; }

/* ============ Botones ============ */
.btn {
  position: relative; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-weight: 600; font-size: 16px; line-height: 1.25;
  padding: 17px 30px; border: none; border-radius: 999px;
  transition: background var(--dur) var(--ease-out-quint),
              color var(--dur) var(--ease-out-quint),
              box-shadow var(--dur) var(--ease-out-quint),
              transform var(--dur-fast) var(--ease-out-quint);
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(-1px) scale(0.98); }
.btn i { font-size: 18px; }
.btn--naranja { background: var(--sunna-naranja); color: #fff; }
.btn--naranja:hover {
  background: var(--naranja-hover);
  box-shadow: 0 0 0 1.5px rgba(255,178,138,.6), 0 0 16px rgba(234,96,41,.5);
}
.btn--carbon { background: var(--sunna-carbon); color: #fff; }
.btn--carbon:hover {
  background: var(--carbon-90);
  box-shadow: 0 0 0 1.5px rgba(255,255,255,.35), 0 0 14px rgba(255,255,255,.22);
}
.btn--sm { font-size: 14px; padding: 12px 22px; }

/* Punto de Acento: cierra el titular principal. Uno por vista. */
.punto {
  display: inline-block; width: .18em; height: .18em; border-radius: 50%;
  background: var(--sunna-naranja); vertical-align: baseline; margin-left: .12em;
}
/* Kicker: rótulo con línea naranja (mismo gesto que el sitio) */
.kicker {
  margin: 0 0 16px;
  font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--sunna-taupe);
  display: flex; align-items: center; gap: 12px;
}
.kicker::before { content: ""; width: 36px; height: 1px; background: var(--sunna-naranja); flex: none; }
.oscuro .kicker { color: var(--naranja-60); }

/* ============ Nav ============ */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: var(--z-nav);
  display: flex; align-items: center; justify-content: space-between;
  height: 76px; padding: 0 var(--pad-x);
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background var(--dur-slow) var(--ease-out-quint),
              border-color var(--dur-slow) var(--ease-out-quint);
}
.nav.scrolled {
  background: rgba(8,6,5,.88);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border-bottom-color: rgba(255,255,255,.08);
}
.nav__logo { height: 34px; width: auto; }
.nav__links { display: flex; gap: 30px; align-items: center; }
.lnk { font-size: 14px; font-weight: 500; color: rgba(255,255,255,.85); transition: color var(--dur) var(--ease-out-quint); }
.lnk:hover { color: #fff; }

/* ============ Atmósfera de marca (sustituye la retícula de puntos, decisión 2026-08-31) ============ */
.trama {
  position: absolute; inset: 0; pointer-events: none; overflow: hidden;
  background-image:
    radial-gradient(118% 78% at 84% 4%, rgba(234,96,41,.14), transparent 58%),
    radial-gradient(88% 66% at 6% 98%, rgba(234,96,41,.07), transparent 62%);
}
.trama::after, .trama--clara::after {
  content: ""; position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}
.trama::after { opacity: .05; }
.trama--clara {
  position: absolute; inset: 0; pointer-events: none; overflow: hidden;
  background-image: radial-gradient(92% 72% at 90% 0%, rgba(234,96,41,.055), transparent 60%);
}
.trama--clara::after { opacity: .022; }
.linea { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }

/* ============ S1 · Hero (carbón) ============ */
.hero {
  position: relative; overflow: hidden;
  background: var(--sunna-carbon); color: #fff;
  padding: 150px var(--pad-x) clamp(56px, 8vh, 96px);
}
.hero__inner { position: relative; max-width: var(--wrap); margin: 0 auto; }
.hero h1 {
  font-weight: 700; font-size: clamp(38px, 6vw, 72px);
  line-height: 1.04; letter-spacing: -0.03em; max-width: 14ch;
}
.hero h1 span { display: block; }
.hero__sub {
  margin: 24px 0 0; font-size: clamp(17px, 1.6vw, 20px); line-height: 1.6;
  color: rgba(255,255,255,.78); max-width: 46ch;
}
/* Índice inicial: anclas a servicios y a los tres perfiles (píldoras del sistema) */
.hero__indice { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 8px; }
.hero__indice a {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; letter-spacing: .02em;
  color: rgba(255,255,255,.85);
  border: 1px solid rgba(255,255,255,.28); border-radius: 999px;
  padding: 10px 16px;
  transition: color var(--dur) var(--ease-out-quint), border-color var(--dur) var(--ease-out-quint), transform var(--dur) var(--ease-out-quint);
}
.hero__indice a::after { content: "\2192"; font-size: 12px; color: var(--taupe-60); transition: transform var(--dur) var(--ease-out-quint); }
.hero__indice a:hover { color: #fff; border-color: var(--sunna-naranja); transform: translateY(-2px); }
.hero__indice a:hover::after { color: var(--sunna-naranja); transform: translateX(3px); }

/* ============ S2 · El momento (blanco, statement) ============ */
.momento {
  position: relative; background: #fff;
  padding: clamp(56px, 8vh, 96px) var(--pad-x);
}
.momento > .wrap { position: relative; }
.momento h2 {
  font-weight: 700; font-size: clamp(30px, 4.6vw, 58px);
  line-height: 1.08; letter-spacing: -0.025em; max-width: 18ch;
}
.momento p {
  margin: 24px 0 0; font-size: 17px; line-height: 1.7;
  color: var(--carbon-70); max-width: 52ch;
}

/* ============ Secciones de dos columnas (patrón del sitio) ============ */
.dos {
  background: #fff;
  padding: clamp(56px, 8vh, 96px) var(--pad-x);
}
.dos > .wrap {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: clamp(36px, 6vw, 96px); align-items: start;
}
.dos h2 {
  font-weight: 700; font-size: clamp(28px, 3.6vw, 44px);
  line-height: 1.08; letter-spacing: -0.02em; max-width: 16ch;
}
.dos__lead { margin: 16px 0 0; font-size: 16px; line-height: 1.6; color: var(--carbon-70); max-width: 36ch; }
.dos--alt { background: var(--taupe-10); }

/* ============ S3 · Cómo trabajamos ============ */
.metodo { margin-top: 22px; display: inline-flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 600; letter-spacing: .04em; color: var(--sunna-carbon); }
.metodo i { width: 6px; height: 6px; border-radius: 50%; background: var(--sunna-naranja); display: inline-block; }
.pasos { display: grid; gap: 0; border-top: 1px solid var(--taupe-30); }
.paso { position: relative; padding: 20px 0; border-bottom: 1px solid var(--taupe-30); }
.paso h3 {
  font-weight: 600; font-size: 19px; letter-spacing: -0.01em;
  display: flex; align-items: baseline; gap: 10px;
}
.paso h3::before {
  content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%;
  background: var(--sunna-naranja); transform: translateY(-2px);
}
.paso p { margin: 10px 0 0 17px; font-size: 16px; line-height: 1.6; color: var(--carbon-70); max-width: 52ch; }

/* ============ S4 · Servicios ============ */
.svc { padding-bottom: 0; }
.svc > .wrap { display: block; }
.svc__head { max-width: 62ch; }
.svc__head .dos__lead { max-width: 52ch; }
.linea-svc {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: clamp(28px, 5vw, 88px); align-items: start;
  padding: clamp(40px, 6vh, 64px) 0;
  border-top: 1px solid var(--taupe-30);
}
.linea-svc:first-of-type { margin-top: clamp(36px, 5vh, 56px); }
.linea-svc__num { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--sunna-taupe); margin: 0 0 12px; }
.linea-svc h3 {
  font-weight: 700; font-size: clamp(24px, 2.8vw, 34px);
  line-height: 1.1; letter-spacing: -0.02em; max-width: 14ch;
}
.linea-svc__ben { margin: 14px 0 0; font-size: 16px; line-height: 1.6; color: var(--carbon-70); max-width: 34ch; }
.lista { display: grid; gap: 12px; margin: 0; }
.lista li {
  display: flex; gap: 10px; align-items: baseline;
  font-size: 15px; line-height: 1.5; color: var(--carbon-70);
}
.lista li::before {
  content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%;
  background: var(--sunna-naranja); transform: translateY(-1px);
}
.lista--dos { grid-template-columns: 1fr 1fr; gap: 12px 32px; }
/* Paquete ancla: mismo tratamiento que el "servicio core" de las tarjetas de perfil del sitio */
.paquete {
  background: var(--naranja-10);
  border: 1px solid var(--naranja-30); border-radius: var(--r-md);
  padding: 24px 24px 26px;
}
.paquete__tag {
  display: inline-flex; align-items: center; gap: 8px; margin: 0 0 10px;
  font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--sunna-naranja);
}
.paquete__tag i { font-size: 14px; }
.paquete h4 { font-weight: 700; font-size: 22px; letter-spacing: -0.015em; }
.paquete > p { margin: 8px 0 16px; font-size: 15px; line-height: 1.6; color: var(--carbon-70); }
.paquete .lista li { color: var(--sunna-carbon); }
.comp { margin-top: 26px; }
.comp__tag { margin: 0 0 12px; font-size: 13px; font-weight: 600; letter-spacing: .04em; color: var(--taupe-60); }
.svc__nota {
  margin: clamp(28px, 4vh, 40px) 0 0; padding: 22px 0 clamp(56px, 8vh, 96px);
  border-top: 1px solid var(--taupe-30);
  font-size: 15px; line-height: 1.6; color: var(--carbon-70); max-width: 58ch;
}

/* ============ S5 · Perfiles (carbón, tarjetas blancas) ============ */
.perfiles {
  position: relative; overflow: hidden;
  background: var(--sunna-carbon); color: #fff;
  padding: clamp(64px, 9vh, 110px) var(--pad-x);
}
.perfiles > .wrap { position: relative; }
.perfiles h2 {
  font-weight: 700; font-size: clamp(28px, 3.6vw, 44px);
  line-height: 1.08; letter-spacing: -0.02em; max-width: 20ch;
}
.perfiles__sub { margin: 18px 0 0; font-size: 16px; line-height: 1.6; color: rgba(255,255,255,.72); max-width: 58ch; }
.perfil-list { display: grid; gap: 20px; margin-top: clamp(32px, 5vh, 48px); }
.perfil {
  scroll-margin-top: 90px;
  background: #fff; color: var(--sunna-carbon);
  border-radius: var(--r-md);
  padding: clamp(24px, 4vw, 40px);
}
.perfil__head { display: flex; align-items: center; gap: 16px; }
.perfil__icon {
  flex: none; width: 52px; height: 52px; border-radius: var(--r-sm);
  background: var(--sunna-carbon); color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.perfil__icon i { font-size: 26px; }
.perfil h3 { font-weight: 700; font-size: clamp(21px, 2.2vw, 25px); letter-spacing: -0.01em; }
.perfil__dolor { margin: 18px 0 0; font-size: 16px; line-height: 1.65; color: var(--carbon-70); max-width: 68ch; }
.perfil__sub { margin: 22px 0 12px; font-size: 13px; font-weight: 600; letter-spacing: .04em; color: var(--taupe-60); }
.perfil .lista { grid-template-columns: 1fr 1fr; gap: 12px 28px; }
.perfil__cta {
  margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--taupe-30);
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
}
.perfil__cta p { margin: 0; font-size: 15px; font-weight: 600; line-height: 1.5; max-width: 40ch; }
.perfil--prioritario { box-shadow: 0 0 0 1.5px rgba(234,96,41,.55), 0 0 24px rgba(234,96,41,.18); }
.perfil__chip {
  font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--sunna-naranja);
  border: 1px solid var(--naranja-30); background: var(--naranja-10);
  padding: 4px 10px; border-radius: 999px; margin-left: auto;
}

/* ============ S6 · Por qué Sunna (blanco) ============ */
.difs { border-top: 1px solid var(--taupe-30); }
.dif { padding: 19px 0; border-bottom: 1px solid var(--taupe-30); }
.dif h3 {
  font-weight: 600; font-size: 19px; letter-spacing: -0.01em;
  display: flex; align-items: baseline; gap: 10px;
  transition: transform 320ms var(--ease-out-quint);
}
.dif:hover h3 { transform: translateX(6px); }
.dif h3::before {
  content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%;
  background: var(--sunna-naranja); transform: translateY(-2px);
}
.dif p { margin: 10px 0 0 17px; font-size: 16px; line-height: 1.6; color: var(--carbon-70); max-width: 46ch; }

/* ============ S7 · Cómo se ve nuestro trabajo (carbón enmarcado) ============ */
.trabajo-wrap { background: #fff; padding: 0 clamp(16px, 3vw, 40px) clamp(48px, 7vh, 84px); }
.trabajo {
  position: relative; overflow: hidden;
  background: var(--sunna-carbon); color: #fff;
  border-radius: var(--r-lg);
  padding: clamp(48px, 8vh, 96px) var(--pad-x);
}
.trabajo > .wrap { position: relative; }
.trabajo h2 {
  font-weight: 700; font-size: clamp(26px, 3.4vw, 42px);
  line-height: 1.12; letter-spacing: -0.02em; max-width: 22ch;
}
.trabajo__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: clamp(28px, 5vh, 44px); }
.plat {
  display: flex; flex-direction: column; gap: 10px;
  padding: 24px 26px;
  border: 1px solid rgba(255,255,255,.16); border-radius: var(--r-md);
  background: rgba(8,6,5,.45);
  transition: transform var(--dur-slow) var(--ease-out-quint), border-color var(--dur-slow) var(--ease-out-quint), box-shadow var(--dur-slow) var(--ease-out-quint);
}
.plat:hover { transform: translateY(-4px); border-color: rgba(234,96,41,.6); box-shadow: 0 14px 40px rgba(0,0,0,.4), 0 0 18px rgba(234,96,41,.18); }
.plat__head { display: flex; align-items: center; gap: 12px; }
.plat__head i { font-size: 22px; color: var(--sunna-naranja); }
.plat__head h3 { font-weight: 700; font-size: 18px; letter-spacing: -0.01em; }
.plat p { margin: 0; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.72); max-width: 44ch; }

/* ============ S8 · Cómo empezamos (proceso numerado: es una secuencia real) ============ */
.proceso { counter-reset: paso; }
.proceso .paso { counter-increment: paso; display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; }
.proceso .paso::before {
  content: counter(paso, decimal-leading-zero);
  font-size: 13px; font-weight: 700; letter-spacing: .08em; color: var(--sunna-naranja);
  font-variant-numeric: tabular-nums; padding-top: 4px;
}
.proceso .paso h3::before { display: none; }
.proceso .paso p { margin-left: 0; }

/* ============ S9 · Cierre: Bloque de Anclaje + footer (carbón) ============ */
.cierre { position: relative; overflow: hidden; background: var(--sunna-carbon); padding: clamp(72px, 10vh, 120px) var(--pad-x) 0; }
.cierre > .wrap { position: relative; }
.anclaje {
  background: var(--sunna-naranja); color: #fff;
  border-radius: var(--r-lg);
  padding: clamp(44px, 7vw, 88px) clamp(24px, 6vw, 88px);
  display: grid; grid-template-columns: minmax(0, 2fr) auto;
  gap: 36px; align-items: center;
}
.anclaje h2 {
  font-weight: 700; font-size: clamp(27px, 3.6vw, 46px);
  line-height: 1.1; letter-spacing: -0.02em; max-width: 18ch;
}
.anclaje p { margin: 14px 0 0; font-size: 17px; line-height: 1.55; color: rgba(255,255,255,.92); max-width: 40ch; }
.anclaje .btn--carbon { font-size: 16px; padding: 18px 34px; white-space: nowrap; }
.hub {
  margin: 28px auto 0; font-size: 15px; line-height: 1.6;
  color: rgba(255,255,255,.62); max-width: 60ch;
}
.hub a { color: var(--naranja-60); font-weight: 600; }
.hub a:hover { color: #fff; }

.footer { color: #fff; padding: clamp(56px, 8vh, 88px) 0 40px; }
.footer__grid {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 32px;
  padding-bottom: 40px; border-bottom: 1px solid rgba(255,255,255,.12);
}
.footer__brand img { height: 26px; width: auto; margin-bottom: 16px; }
.footer__brand p { font-size: 15px; font-weight: 600; color: #fff; line-height: 1.5; max-width: 280px; margin: 0; }
.footer__h { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--taupe-60); margin: 0 0 14px; font-weight: 600; }
.flink { display: block; font-size: 14px; color: rgba(255,255,255,.78); padding: 6px 0; transition: color var(--dur) var(--ease-out-quint); }
.flink:hover { color: var(--sunna-naranja); }
.footer__bottom {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 24px; font-size: 13px; color: var(--taupe-60);
  flex-wrap: wrap; gap: 12px;
}
.footer__social { display: flex; gap: 12px; }
.social {
  width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; color: #fff;
  transition: border-color var(--dur) var(--ease-out-quint), color var(--dur) var(--ease-out-quint);
}
.social:hover { color: var(--sunna-naranja); border-color: var(--sunna-naranja); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ============ Responsive (móvil primero en proporciones) ============ */
@media (max-width: 960px) {
  .dos > .wrap, .linea-svc { grid-template-columns: 1fr; gap: 24px; }
  .anclaje { grid-template-columns: 1fr; gap: 26px; }
  .trabajo__grid { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  html { scroll-padding-top: 76px; }
  .nav { height: 64px; }
  .nav__links .lnk { display: none; }
  .nav__logo { height: 30px; }
  .hero { padding-top: 116px; }
  .lista--dos, .perfil .lista { grid-template-columns: 1fr; }
  .perfil__cta .btn { width: 100%; }
  .anclaje .btn--carbon { width: 100%; white-space: normal; }
}
@media (max-width: 520px) {
  .footer__grid { grid-template-columns: 1fr; gap: 26px; }
  .hero__indice a { padding: 9px 13px; }
}