:root {
  --ink: #040a11;
  --ink-soft: #07121f;
  --ink-warm: #060e18;
  --ink-wine: #060f1a;
  --ivory: #eaf0f3;
  --ivory-deep: #d7e1e7;
  --carmine: #c79d51;
  --carmine-dark: #ad8438;
  --carmine-soft: #ddc497;
  --gold-quiet: #8a9aa6;
  --text-on-dark: rgba(234, 240, 243, 0.82);
  --text-on-dark-muted: rgba(234, 240, 243, 0.64);
  --line-dark: rgba(234, 240, 243, 0.17);
  --line-dark-soft: rgba(234, 240, 243, 0.1);
  --line-light: rgba(4, 10, 17, 0.17);
  --measure-body: 64ch;
  --type-display-hero: clamp(3.35rem, 4.9vw, 5.4rem);
  --type-display-section: clamp(3.55rem, 5.8vw, 6.35rem);
  --type-display-section-compact: clamp(3.1rem, 5vw, 5.45rem);
  --type-heading-card: clamp(1.16rem, 1.45vw, 1.42rem);
  --type-body: clamp(1rem, 0.22vw + 0.95rem, 1.075rem);
  --leading-display: 0.92;
  --leading-body: 1.68;
  --tracking-display: -0.045em;
  --shell: min(100% - 64px, 1440px);
  --eventbar-height: 46px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--ink);
}

body {
  margin: 0;
  background: var(--ink);
  color: var(--ivory);
  font-family: var(--font-interface), Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.modal-open {
  overflow: hidden;
}

button,
input {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

img,
video {
  display: block;
  max-width: 100%;
}

::selection {
  color: var(--ivory);
  background: var(--carmine);
}

:focus-visible {
  outline: 2px solid var(--carmine);
  outline-offset: 4px;
}

.shell {
  width: var(--shell);
  margin-inline: auto;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.light-section {
  color: var(--ink);
  background: var(--ivory);
}

.dark-section {
  color: var(--ivory);
  background: var(--ink);
}

.section-number,
.eyebrow {
  margin-block: 0;
  font-size: 0.69rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 1.2;
  text-transform: uppercase;
}

.section-number {
  /* Era `opacity:.55` (19-09-2026). La opacidad rebaja el contraste real del
     texto sin que ningún token lo refleje: la auditoría de color daba por
     bueno un par que en pantalla no lo era. El matiz se consigue con el
     color, que sí se mide. */
  color: var(--pc-discreto);
}

.hero {
  position: relative;
  min-height: calc(100svh - var(--eventbar-height));
  overflow: hidden;
  isolation: isolate;
  background: #03080e;
}

.hero-media,
.hero-media img,
.hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-media {
  z-index: -3;
}

.hero-media img {
  object-fit: cover;
  object-position: center;
}

.hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3, 8, 14, 0.97) 0%, rgba(3, 8, 14, 0.86) 30%, rgba(3, 8, 14, 0.38) 56%, rgba(3, 8, 14, 0.04) 74%),
    linear-gradient(180deg, rgba(3, 8, 14, 0.55) 0%, transparent 26%, transparent 70%, rgba(3, 8, 14, 0.68) 100%);
}

.hero::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  pointer-events: none;
  opacity: 0.2;
  background-image:
    radial-gradient(circle at 12% 24%, rgba(255, 255, 255, 0.13) 0 0.5px, transparent 0.8px),
    radial-gradient(circle at 76% 62%, rgba(255, 255, 255, 0.1) 0 0.6px, transparent 0.9px);
  background-size: 5px 5px, 7px 7px;
  mix-blend-mode: soft-light;
}

.announcement {
  position: sticky;
  top: 0;
  z-index: 30;
  min-height: calc(var(--eventbar-height) + env(safe-area-inset-top));
  color: var(--ivory);
  background: var(--carmine);
}

.announcement-inner {
  display: grid;
  min-height: calc(var(--eventbar-height) + env(safe-area-inset-top));
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding-top: env(safe-area-inset-top);
}

.event-countdown {
  display: flex;
  min-height: 34px;
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  border: 1px solid rgba(234, 240, 243, 0.18);
  border-radius: 4px;
  background: rgba(12, 30, 52, 0.2);
  box-shadow:
    inset 0 0 0 1px rgba(234, 240, 243, 0.035),
    0 8px 22px rgba(11, 28, 49, 0.1);
  white-space: nowrap;
}

.countdown-kicker {
  color: #bfccd5;
  font-size: 0.48rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.countdown-digits {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  font-variant-numeric: tabular-nums;
}

.countdown-digits > i {
  color: #8297a8;
  font-size: 0.52rem;
  font-style: normal;
}

.countdown-unit {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
}

.countdown-unit strong {
  display: inline-block;
  width: 2ch;
  color: var(--ivory);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.035em;
  line-height: 1;
  text-align: center;
}

.countdown-unit small {
  color: #c0c9cf;
  font-size: 0.4rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.event-countdown--hero {
  display: none;
}

.announcement-static {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 18px;
  overflow: hidden;
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.announcement-static > i {
  width: 1px;
  height: 13px;
  flex: 0 0 auto;
  background: rgba(234, 240, 243, 0.32);
}

.as-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.as-item svg {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  opacity: 0.85;
}

.as-item small {
  font-size: 0.8em;
  opacity: 0.72;
}

.as-highlight {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 3px;
  background: var(--ivory);
  color: var(--carmine-dark);
  font-weight: 900;
  letter-spacing: 0.08em;
}

.as-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 4px;
  padding: 6px 12px;
  border: 0;
  border-radius: 4px;
  background: var(--ivory);
  color: var(--carmine-dark);
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.as-badge svg {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
}

[data-wow-cta] {
  --cta-pointer-x: 50%;
  --cta-pointer-y: 50%;
  --cta-magnetic-x: 0px;
  --cta-magnetic-y: 0px;
  --cta-sheen: rgba(255, 255, 255, 0.3);
  --cta-glint: rgba(255, 255, 255, 0.42);
  --cta-ripple: rgba(255, 255, 255, 0.72);
  --cta-attention-color: #8297a8;
  --cta-rest-shadow: 0 0 0 0 rgba(234, 240, 243, 0);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  scale: 1;
  translate: var(--cta-magnetic-x) var(--cta-magnetic-y);
  will-change: translate;
  transition: translate 150ms ease-out, scale 150ms ease-out;
}

[data-wow-cta] > span {
  position: relative;
  z-index: 2;
}

[data-wow-cta]::before,
[data-wow-cta]::after {
  position: absolute;
  z-index: 1;
  content: "";
  pointer-events: none;
}

[data-wow-cta]::before {
  inset: 0;
  background:
    radial-gradient(
      170px circle at var(--cta-pointer-x) var(--cta-pointer-y),
      var(--cta-sheen),
      transparent 68%
    ),
    linear-gradient(
      108deg,
      transparent 28%,
      var(--cta-glint) 48%,
      transparent 68%
    );
  background-position: center, 170% center;
  background-repeat: no-repeat;
  background-size: auto, 48% 100%;
  opacity: 0;
  transform: scale(0.82);
  transition: opacity 240ms ease, transform 360ms var(--ease-out);
}

[data-wow-cta]:hover::before,
[data-wow-cta][data-cta-active="true"]::before {
  opacity: 1;
  transform: scale(1);
}

[data-wow-cta]::after {
  top: var(--cta-pointer-y);
  left: var(--cta-pointer-x);
  width: 12px;
  height: 12px;
  border: 1px solid var(--cta-ripple);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0);
}

[data-wow-cta].is-cta-pressed::after {
  animation: cta-tailored-ripple 660ms var(--ease-out);
}

[data-wow-cta][data-cta-touching="true"] {
  scale: 0.985;
}

[data-wow-cta][data-cta-pulse="true"]:not([data-cta-interacting="true"]):not(:hover):not(:focus-visible):not(:active):not(:disabled) {
  animation: cta-double-pulse 2.3s ease-in-out infinite;
}

[data-wow-cta][data-cta-pulse="true"]:not([data-cta-interacting="true"]):not(:hover):not(:focus-visible):not(:active):not(:disabled)::before {
  animation: cta-idle-glint 2.3s var(--ease-out) infinite;
}

.announcement [data-wow-cta] {
  --cta-sheen: rgba(199, 157, 81, 0.16);
  --cta-ripple: rgba(199, 157, 81, 0.5);
}

.text-cta[data-wow-cta] {
  --cta-sheen: rgba(199, 157, 81, 0.13);
  --cta-ripple: rgba(199, 157, 81, 0.52);
}

@keyframes cta-tailored-ripple {
  0% {
    opacity: 0.72;
    transform: translate(-50%, -50%) scale(0.3);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(22);
  }
}

@keyframes cta-double-pulse {
  0%, 100% {
    scale: 1;
    box-shadow: var(--cta-rest-shadow);
  }

  12% {
    scale: 0.99;
    box-shadow: var(--cta-rest-shadow);
  }

  50% {
    scale: 1.04;
    box-shadow:
      var(--cta-rest-shadow),
      0 0 0 8px var(--cta-attention-color),
      0 0 32px var(--cta-attention-color);
  }

  78% {
    scale: 1.006;
    box-shadow: var(--cta-rest-shadow), 0 0 0 3px var(--cta-attention-color);
  }

  92% {
    scale: 1;
    box-shadow: var(--cta-rest-shadow);
  }
}

@keyframes cta-idle-glint {
  0%, 100% {
    background-position: center, 145% center;
    opacity: 0;
    transform: scale(0.98);
  }

  18% {
    background-position: center, 125% center;
    opacity: 0.08;
  }

  42% {
    background-position: center, 64% center;
    opacity: 0.28;
  }

  58% {
    background-position: center, -18% center;
    opacity: 0.68;
    transform: scale(1);
  }

  76% {
    background-position: center, -92% center;
    opacity: 0;
    transform: scale(1);
  }

  90% {
    background-position: center, -110% center;
    opacity: 0;
    transform: scale(0.99);
  }
}

.announcement button {
  --cta-attention-color: rgba(199, 157, 81, 0.2);
  --cta-glint: rgba(199, 157, 81, 0.25);
  --cta-rest-shadow:
    0 10px 24px rgba(9, 22, 37, 0.2),
    0 0 0 1px rgba(234, 240, 243, 0.16),
    inset 0 0 0 1px rgba(199, 157, 81, 0.08);
  display: inline-flex;
  min-height: 38px;
  grid-column: 3;
  align-items: center;
  justify-content: center;
  justify-self: end;
  padding: 0 18px;
  border: 1px solid rgba(234, 240, 243, 0.72);
  border-radius: 6px;
  color: var(--carmine-dark);
  background: var(--ivory);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: var(--cta-rest-shadow);
  transition: translate 150ms ease-out, scale 150ms ease-out, color 180ms ease, background 180ms ease, transform 180ms ease;
}

.announcement button:hover {
  color: var(--carmine-dark);
  background: #f2f5f7;
  transform: scale(1.025);
  box-shadow:
    0 14px 32px rgba(9, 22, 37, 0.26),
    0 0 20px rgba(234, 240, 243, 0.22),
    inset 0 0 0 1px rgba(25, 53, 87, 0.12);
  animation-play-state: paused;
}

.announcement button:active {
  scale: 0.985;
}

.announcement button[data-quiet="true"] {
  color: var(--ivory);
  border-color: #9baebb;
  background: transparent;
  box-shadow: none;
}

.announcement button[data-quiet="true"]:hover,
.announcement button[data-quiet="true"]:focus-visible {
  color: var(--carmine-dark);
  border-color: #f4f3ec;
  background: var(--ivory);
}

.nav {
  position: absolute;
  inset: 0 0 auto;
  z-index: 4;
  display: flex;
  min-height: 86px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line-dark);
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  line-height: 1;
}

.wordmark span {
  font-family: var(--font-editorial), Georgia, serif;
  font-size: 1.18rem;
  font-weight: 600;
  letter-spacing: 0.07em;
}

.wordmark small {
  display: grid;
  width: 29px;
  height: 29px;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 0.47rem;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.hero-content {
  display: flex;
  min-height: calc(100svh - var(--eventbar-height));
  flex-direction: column;
  justify-content: center;
  padding-top: 118px;
  padding-bottom: 42px;
}

.hero-intro {
  display: grid;
  margin-bottom: 30px;
}

.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hero-eyebrow span:first-child,
.hero-eyebrow span:nth-child(2) {
  color: var(--carmine-soft);
}

.hero-eyebrow .hero-eyebrow-byline {
  color: #bfccd5;
}

.hero-preheadline {
  position: relative;
  margin: 13px 0 0;
  padding-bottom: 17px;
  color: var(--ivory);
  font-size: clamp(0.98rem, 1.3vw, 1.26rem);
  font-weight: 800;
  letter-spacing: 0.16em;
  line-height: 1.2;
  text-transform: uppercase;
}

.hero-preheadline::after {
  position: absolute;
  bottom: 0;
  left: 2px;
  width: 78px;
  height: 2px;
  content: "";
  background: var(--carmine);
}

.hero h1,
.authority h2,
.identity h2,
.audience h2,
.founder h2,
.testimonials h2,
.faq h2,
.final-cta h2 {
  margin: 0;
  font-family: var(--font-editorial), Georgia, serif;
  font-weight: 500;
  letter-spacing: var(--tracking-display);
  text-wrap: balance;
}

h3 {
  text-wrap: balance;
}

p,
li {
  text-wrap: pretty;
}

.hero h1 {
  max-width: 900px;
  font-size: var(--type-display-hero);
  line-height: 0.96;
  text-wrap: balance;
}

h1 em,
h2 em {
  color: var(--carmine);
  font-weight: 500;
}

.hero-copy {
  max-width: 610px;
  margin: 24px 0 0;
  color: #bfccd5;
  font-size: clamp(0.96rem, 1.08vw, 1.08rem);
  line-height: 1.62;
}

.hero-conversion {
  width: min(700px, 100%);
  margin-top: 26px;
}

.primary-cta {
  --cta-rest-shadow:
    0 22px 52px -18px rgba(199, 157, 81, 0.72),
    0 0 34px -14px rgba(218, 191, 142, 0.62),
    inset 0 0 0 1px rgba(234, 240, 243, 0.19),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
  --cta-attention-color: rgba(199, 157, 81, 0.24);
  --cta-glint: rgba(255, 255, 255, 0.5);
  display: inline-flex;
  min-width: 326px;
  min-height: 60px;
  align-items: center;
  justify-content: center;
  padding: 0 34px;
  border: 1px solid rgba(234, 240, 243, 0.34);
  border-radius: 6px;
  color: var(--ivory);
  background: linear-gradient(105deg, #193456 0%, var(--carmine) 48%, #183151 100%);
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: var(--cta-rest-shadow);
  transition: translate 150ms ease-out, scale 150ms ease-out, background 180ms ease, border-color 180ms ease, transform 180ms ease, box-shadow 240ms ease;
}

.primary-cta:hover {
  border-color: #9baebb;
  background: linear-gradient(105deg, #162e4b 0%, var(--carmine-dark) 52%, #132942 100%);
  transform: translateY(-2px) scale(1.01);
  box-shadow:
    0 28px 62px -20px rgba(25, 53, 87, 0.82),
    0 0 42px -14px rgba(25, 53, 87, 0.72),
    inset 0 0 0 1px rgba(234, 240, 243, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.primary-cta:disabled {
  cursor: wait;
  opacity: 0.72;
}

.primary-cta:focus-visible {
  transform: translateY(-1px);
  box-shadow:
    0 0 0 3px var(--ink),
    0 0 0 5px var(--ivory),
    0 24px 56px -18px rgba(25, 53, 87, 0.72);
}

.primary-cta:active {
  transform: translateY(0) scale(0.992);
}

.primary-cta:disabled:hover,
.primary-cta:disabled:active {
  border-color: #8297a8;
  background: linear-gradient(105deg, #193456 0%, var(--carmine) 48%, #183151 100%);
  box-shadow: var(--cta-rest-shadow);
  transform: none;
}

.cta-arrow-inline {
  margin-left: 13px;
  font-size: 1.08em;
  line-height: 1;
  transition: transform 240ms var(--ease-out);
}

.primary-cta:hover .cta-arrow-inline,
.primary-cta:focus-visible .cta-arrow-inline {
  transform: translateX(4px);
}

.hero-event-details {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 18px 0 0;
  color: #bfccd5;
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.hero-event-details span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.hero-event-details svg {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  opacity: 0.75;
}

.hero-event-details strong {
  font-weight: 800;
}

.hero-event-details span:not(:last-child)::after {
  width: 1px;
  height: 13px;
  margin: 0 15px;
  content: "";
  background: rgba(234, 240, 243, 0.26);
}

.hero-note {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 13px 0 0;
  color: #bfccd5;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.hero-note--sub {
  margin-top: 13px;
  color: #9baebb;
  font-size: 0.6rem;
  letter-spacing: 0.04em;
}

.hero-index,
.scroll-cue {
  position: absolute;
  bottom: 25px;
  z-index: 3;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.hero-index {
  right: 32px;
  opacity: 0.52;
}

.scroll-cue {
  left: 50%;
  display: flex;
  align-items: center;
  gap: 12px;
  transform: translateX(-50%);
  opacity: 0.68;
}

.scroll-cue span {
  color: var(--carmine);
}

.problem {
  position: relative;
  overflow: hidden;
  padding: 126px 0 122px;
  color: var(--ivory);
  background-color: #040910;
  background-image:
    radial-gradient(76% 84% at 12% 14%, rgba(16, 34, 56, 0.16), transparent 54%),
    radial-gradient(60% 70% at 94% 88%, rgba(16, 34, 56, 0.1), transparent 52%),
    linear-gradient(rgba(3, 8, 15, 0.8), rgba(3, 8, 15, 0.8));
  background-repeat: no-repeat, no-repeat, repeat, repeat;
  background-size: auto, auto, auto, 512px 512px;
}

.problem::before {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.3;
  background: radial-gradient(circle at 27% 35%, rgba(16, 34, 56, 0.16), transparent 44%);
}

.problem-hem {
  position: absolute;
  right: 0;
  bottom: 22px;
  left: 0;
  height: 11px;
  pointer-events: none;
}

.problem-hem::before {
  position: absolute;
  top: 5px;
  right: 0;
  left: 0;
  height: 1px;
  content: "";
  background-image: repeating-linear-gradient(
    90deg,
    rgba(138, 154, 166, 0.38) 0 9px,
    transparent 9px 18px
  );
}

.problem-hem::after {
  position: absolute;
  top: 1px;
  left: 50%;
  width: 9px;
  height: 9px;
  content: "";
  border: 1px solid rgba(138, 154, 166, 0.75);
  background: #07111d;
  rotate: 45deg;
  translate: -50% 0;
}

.problem-pattern {
  position: absolute;
  top: 4%;
  right: -40px;
  width: min(44%, 540px);
  height: auto;
  color: var(--gold-quiet);
  opacity: 0.07;
  pointer-events: none;
}

.problem-drape {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -130px;
  z-index: 0;
  width: clamp(160px, 18vw, 280px);
  pointer-events: none;
  opacity: 0.24;
  mask-image: linear-gradient(90deg, #000 30%, transparent);
  -webkit-mask-image: linear-gradient(90deg, #000 30%, transparent);
}

.problem-drape img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
}

.problem-fold {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  z-index: 0;
  display: block;
  height: clamp(110px, 14vw, 200px);
  overflow: hidden;
  pointer-events: none;
  opacity: 0.5;
  mask-image: linear-gradient(180deg, transparent, #000 78%);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 78%);
}

.problem-fold img {
  width: min(100%, 1536px);
  height: 100%;
  margin-inline: auto;
  display: block;
  object-fit: cover;
  object-position: center bottom;
}

.problem-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  gap: 56px;
  align-items: center;
}

.problem-eyebrow {
  color: var(--gold-quiet);
  opacity: 1;
}

.problem-ornament {
  position: relative;
  display: block;
  width: 148px;
  height: 9px;
  margin: 18px 0 0;
}

.problem-ornament--mid {
  width: 96px;
  margin-top: 30px;
}

.problem-ornament::before {
  position: absolute;
  top: 4px;
  right: 0;
  left: 0;
  height: 1px;
  content: "";
  background: linear-gradient(
    90deg,
    rgba(138, 154, 166, 0.55),
    rgba(138, 154, 166, 0.1)
  );
}

.problem-ornament::after {
  position: absolute;
  top: 1px;
  left: 46%;
  width: 7px;
  height: 7px;
  content: "";
  border: 1px solid rgba(138, 154, 166, 0.7);
  background: #07111d;
  rotate: 45deg;
}

.problem h2 {
  max-width: 21ch;
  margin: 26px 0 0;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(2.5rem, 3.6vw, 3.85rem);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.08;
}

.problem h2 mark {
  background: none;
  color: #a9b5be;
  font-style: italic;
}

.problem-body {
  max-width: 54ch;
  margin: 32px 0 0;
  color: #bfccd5;
  font-size: 1.02rem;
  line-height: 1.78;
}

.problem-lede {
  max-width: 54ch;
  margin: 26px 0 0;
  color: #bfccd5;
  font-size: 1.02rem;
  line-height: 1.7;
}

.problem-lede b {
  color: #a9b5be;
}

.problem-tags-col {
  position: relative;
}

.problem-thread {
  position: absolute;
  top: -36px;
  left: 50%;
  width: min(100%, 370px);
  height: calc(100% + 72px);
  color: rgba(138, 154, 166, 0.55);
  pointer-events: none;
  translate: -50% 0;
}

.stitch-tags {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.stitch-tag {
  position: relative;
  width: min(100%, 376px);
  padding: 34px 38px 26px;
  border-radius: 9px;
  background-color: #0c1f35;
  background-image:
    radial-gradient(120% 90% at 20% 0%, rgba(234, 240, 243, 0.07), transparent 55%),
    linear-gradient(155deg, rgba(14, 33, 58, 0.7) 0%, rgba(12, 29, 50, 0.74) 55%, rgba(14, 33, 58, 0.7) 100%);
  background-repeat: no-repeat, no-repeat, repeat;
  background-size: auto, auto, 256px 256px;
  box-shadow:
    0 2px 5px rgba(0, 0, 0, 0.6),
    0 30px 60px rgba(0, 0, 0, 0.62),
    inset 0 1px 0 rgba(234, 240, 243, 0.1),
    inset 0 -16px 32px rgba(0, 0, 0, 0.28);
}

.stitch-tag::before {
  position: absolute;
  inset: 9px;
  content: "";
  pointer-events: none;
  border: 1px dashed rgba(156, 170, 180, 0.48);
  border-radius: 5px;
}

.stitch-tag p {
  position: relative;
  margin: 0;
  color: #f4f3ec;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: 1.13rem;
  font-style: italic;
  line-height: 1.45;
  text-align: center;
  text-wrap: balance;
}

.tag-ornament {
  position: relative;
  display: block;
  width: 74px;
  height: 9px;
  margin: 13px auto 0;
}

.tag-ornament::before {
  position: absolute;
  top: 4px;
  right: 0;
  left: 0;
  height: 1px;
  content: "";
  background: linear-gradient(
    90deg,
    transparent,
    rgba(138, 154, 166, 0.55) 18%,
    rgba(138, 154, 166, 0.55) 82%,
    transparent
  );
}

.tag-ornament::after {
  position: absolute;
  top: 1px;
  left: 50%;
  width: 7px;
  height: 7px;
  content: "";
  border: 1px solid rgba(138, 154, 166, 0.75);
  background: #091625;
  rotate: 45deg;
  translate: -50% 0;
}

.tag-needle {
  position: absolute;
  top: -21px;
  left: 18px;
  width: 34px;
  height: 48px;
  color: var(--gold-quiet);
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.55));
}

.tag-corner {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 30px;
  height: 30px;
  border-top: 2px solid rgba(138, 154, 166, 0.55);
  border-right: 2px solid rgba(138, 154, 166, 0.55);
  border-radius: 0 6px 0 0;
}

.tag-corner::after {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 18px;
  height: 18px;
  content: "";
  border-top: 1px solid rgba(138, 154, 166, 0.4);
  border-right: 1px solid rgba(138, 154, 166, 0.4);
  border-radius: 0 4px 0 0;
}

.tag-selvage {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: -13px;
  width: 15px;
  background: linear-gradient(165deg, #0e1d2f, #0c1d32);
  box-shadow: -2px 3px 8px rgba(0, 0, 0, 0.4);
  clip-path: polygon(
    100% 0%, 100% 100%, 0% 100%, 55% 93.75%, 0% 87.5%, 55% 81.25%,
    0% 75%, 55% 68.75%, 0% 62.5%, 55% 56.25%, 0% 50%, 55% 43.75%,
    0% 37.5%, 55% 31.25%, 0% 25%, 55% 18.75%, 0% 12.5%, 55% 6.25%, 0% 0%
  );
}

.tag-crossstitch {
  position: absolute;
  top: 17px;
  right: 12px;
  bottom: 17px;
  width: 13px;
  background-image:
    linear-gradient(45deg, transparent 43%, rgba(138, 154, 166, 0.72) 43% 57%, transparent 57%),
    linear-gradient(-45deg, transparent 43%, rgba(138, 154, 166, 0.72) 43% 57%, transparent 57%);
  background-position: center top;
  background-repeat: repeat-y;
  background-size: 13px 15px;
}

.stitch-tag:nth-child(1) {
  z-index: 1;
  align-self: flex-start;
  rotate: -1.8deg;
}

.stitch-tag:nth-child(2) {
  z-index: 2;
  align-self: flex-end;
  margin-top: -26px;
  rotate: 1.4deg;
}

.stitch-tag:nth-child(3) {
  z-index: 3;
  align-self: flex-start;
  margin: -30px 0 0 6%;
  rotate: -1.1deg;
}

.stitch-tag:nth-child(4) {
  z-index: 4;
  align-self: flex-end;
  margin: -26px 2% 0 0;
  padding-right: 44px;
  rotate: 1.9deg;
}

.reassure-band {
  position: relative;
  overflow: hidden;
  padding: 108px 0 116px;
  color: var(--ivory);
  background:
    radial-gradient(70% 60% at 50% 0%, rgba(19, 41, 67, 0.3), transparent 66%),
    radial-gradient(80% 70% at 50% 118%, rgba(19, 41, 67, 0.46), transparent 62%),
    linear-gradient(180deg, #060f1a 0%, #081423 52%, #0b1b2f 100%);
}

.reassure-band::before {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.13;
  background-image:
    radial-gradient(circle at 24% 30%, rgba(234, 240, 243, 0.5) 0 0.5px, transparent 0.9px),
    radial-gradient(circle at 72% 62%, rgba(234, 240, 243, 0.4) 0 0.5px, transparent 0.9px);
  background-size: 6px 6px, 9px 9px;
  mix-blend-mode: soft-light;
}

.reassure-band::after {
  position: absolute;
  right: 0;
  bottom: -2px;
  left: 0;
  height: clamp(120px, 15vw, 220px);
  content: "";
  pointer-events: none;
  opacity: 0.72;
  /* Era `burgundy-fabric-folds.webp` (tela del lanzamiento anterior). */
  background:
    radial-gradient(circle at 15% 22%, rgba(255, 255, 255, 0.08) 0 0.5px, transparent 0.9px) 0 0 / 5px 5px,
    radial-gradient(circle at 72% 64%, rgba(255, 255, 255, 0.05) 0 0.6px, transparent 1px) 0 0 / 7px 7px,
    radial-gradient(90% 70% at 50% 100%, rgba(47, 95, 138, 0.16), transparent 70%);
  mask-image: linear-gradient(180deg, transparent, #000 42%);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 42%);
}

.reassure-band > * {
  position: relative;
  z-index: 1;
}

.reassure {
  max-width:900px;
  margin-top:0;
  text-align: center;
}

.reassure .small-label {
  margin: 0 0 22px;
  color: var(--gold-quiet);
  font-size: 0.63rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.reassure h2 {
  font-family:var(--font-editorial), Georgia, serif;
  margin:0;
  font-size:clamp(1.6rem,2.9vw,2.7rem);
  font-weight:500;
  letter-spacing: -0.02em;
  line-height:1.28;
  text-wrap: balance;
}

.reassure h2 b {
  color: #a9b5be;
  font-weight: 500;
}

.reassure-ornament {
  position: relative;
  display: block;
  width: 170px;
  height: 11px;
  margin: 34px auto 0;
}

.reassure-ornament::before {
  position: absolute;
  top: 5px;
  right: 0;
  left: 0;
  height: 1px;
  content: "";
  background: linear-gradient(
    90deg,
    transparent,
    rgba(138, 154, 166, 0.55) 20%,
    rgba(138, 154, 166, 0.55) 80%,
    transparent
  );
}

.reassure-ornament::after {
  position: absolute;
  top: 0;
  left: 50%;
  width: 11px;
  height: 11px;
  content: "";
  border: 1px solid rgba(138, 154, 166, 0.78);
  background: #081423;
  rotate: 45deg;
  translate: -50% 0;
}

.midcta-wrap {
  max-width: 900px;
  margin-top: 46px;
}

.midcta {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 30px;
  padding: 34px 40px 30px;
  border: 1px solid rgba(138, 154, 166, 0.3);
  border-radius: 12px;
  background:
    radial-gradient(90% 80% at 12% 0%, rgba(234, 240, 243, 0.05), transparent 58%),
    linear-gradient(158deg, #081321 0%, #060e18 60%, #081320 100%);
  box-shadow: 0 30px 64px rgba(0, 0, 0, 0.4);
}

.midcta-monogram {
  width: 74px;
  height: auto;
  color: rgba(138, 154, 166, 0.42);
}

.midcta-line {
  margin: 0;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.1rem, 1.6vw, 1.45rem);
  line-height: 1.32;
  text-align: left;
  text-wrap: balance;
}

.midcta-line b {
  color: #a9b5be;
  font-weight: 500;
}

.midcta-meta {
  grid-column: 2 / -1;
  margin: 4px 0 0;
  color: #9baebb;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-align: left;
  text-transform: uppercase;
}

.text-cta {
  min-height:44px;
  color:inherit;
  letter-spacing:.1em;
  text-transform:uppercase;
  cursor:pointer;
  background:0 0;
  border:0;
  border-bottom:1px solid;
  justify-content:center;
  align-items:center;
  padding:0 0 4px;
  font-size:.78rem;
  font-weight:800;
  transition:translate .15s ease-out,scale .15s ease-out,color .18s;
  display:inline-flex;
}

.text-cta>span:first-child {
  color:inherit;
  font-size:inherit;
}

.text-cta:hover,.text-cta:focus-visible {
  color:var(--carmine);
}

.text-cta:active {
  scale:.985;
}

.authority {
  padding:132px 0 150px;
  overflow:hidden;
}

.authority-heading {
  grid-template-columns:.8fr 2fr 1fr;
  align-items:end;
  gap:40px;
  display:grid;
}

.authority-heading .eyebrow {
  color:var(--carmine);
  margin-bottom:20px;
}

.authority h2 {
  font-size:clamp(4rem,6.4vw,7rem);
  line-height:.88;
}

.authority-intro {
  color:#bfccd5;
  max-width:390px;
  margin:0 0 6px;
  line-height:1.75;
}

.editorial-grid {
  grid-template-rows:auto auto;
  grid-template-columns:repeat(12,1fr);
  gap:20px;
  margin-top:88px;
  display:grid;
}

.editorial-grid figure {
  background:#081322;
  margin:0;
  position:relative;
  overflow:hidden;
}

.editorial-grid figure:after {
  content:"";
  pointer-events:none;
  position:absolute;
  inset:0;
  box-shadow:inset 0 0 0 1px #eaf0f314;
}

.editorial-grid img {
  object-fit:cover;
  filter:saturate(.82)contrast(1.03);
  width:100%;
  height:100%;
  transition:transform .9s var(--ease-out), filter .6s ease;
}

.editorial-grid figure:hover img {
  filter:saturate()contrast(1.03);
  transform:scale(1.018);
}

.editorial-grid figcaption {
  z-index:2;
  background:linear-gradient(#0000,#000000d6);
  gap:3px;
  padding:48px 20px 18px;
  display:grid;
  position:absolute;
  inset:auto 0 0;
}

.editorial-grid figcaption span {
  color:#bfccd5;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.56rem;
  font-weight:800;
}

.editorial-grid figcaption strong {
  font-family:var(--font-editorial), Georgia, serif;
  font-size:1.08rem;
  font-weight:500;
}

.editorial-main {
  grid-area:1/1/span 2/span 6;
  min-height:850px;
}

.editorial-dubai {
  grid-column:7/span 3;
  min-height:510px;
}

.editorial-backstage {
  grid-column:10/span 3;
  min-height:510px;
}

.editorial-award {
  grid-column:7/span 6;
  grid-template-columns:1fr 1fr;
  min-height:320px;
  display:grid;
}

.editorial-award .award-card {
  color:var(--ink);
  background:var(--ivory);
  flex-direction:column;
  justify-content:center;
  padding:42px;
  display:flex;
}

.award-card p,.award-card span {
  letter-spacing:.13em;
  text-transform:uppercase;
  margin:0;
  font-size:.6rem;
  font-weight:800;
}

.award-card p {
  color:var(--carmine);
}

.award-card strong {
  font-family:var(--font-editorial), Georgia, serif;
  letter-spacing:-.04em;
  margin:20px 0;
  font-size:clamp(2.3rem,4vw,4.3rem);
  font-weight:500;
  line-height:.8;
}

.identity {
  position: relative;
  padding:145px 0 135px;
  overflow:hidden;
  background:
    radial-gradient(58% 46% at 50% 26%, rgba(19, 41, 67, 0.26), transparent 66%),
    linear-gradient(255deg, rgba(19, 41, 67, 0.34), transparent 34%),
    linear-gradient(180deg, #050c14 0%, #040a11 46%, #050c15 100%);
}

.identity::before {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.55;
  /* Era `identity-dark-texture` (tela del lanzamiento anterior). */
  background-image:
    radial-gradient(80% 60% at 20% 0%, rgba(47, 95, 138, 0.14), transparent 60%),
    radial-gradient(70% 50% at 90% 100%, rgba(47, 95, 138, 0.1), transparent 60%);
  background-repeat: repeat;
  background-size: 384px 384px;
  mix-blend-mode: soft-light;
}

.identity > * {
  position: relative;
  z-index: 1;
}

.identity-head {
  grid-template-columns:1fr 3fr;
  align-items:start;
  gap:40px;
  display:grid;
}

.identity-head .eyebrow {
  color:var(--carmine-soft);
}

.identity-head > .section-number {
  position: relative;
  color: var(--gold-quiet);
  opacity: 1;
}

.identity-head > .section-number::after {
  position: absolute;
  top: 26px;
  left: 2px;
  width: 132px;
  height: 9px;
  content: "";
  background-image:
    linear-gradient(90deg, rgba(138, 154, 166, 0.5), rgba(138, 154, 166, 0.08));
  background-position: 0 4px;
  background-repeat: no-repeat;
  background-size: 100% 1px;
}

.identity-head > div {
  text-align: center;
}

.identity-sub {
  color:#bfccd5;
  font-family:var(--font-editorial), Georgia, serif;
  margin:16px 0 0;
  font-size:clamp(1.25rem,1.8vw,1.7rem);
  font-style:italic;
}

.big-word-stage {
  position: relative;
  margin-top: 40px;
}

.big-word {
  font-family:var(--font-editorial), Georgia, serif;
  letter-spacing:.015em;
  text-align:center;
  white-space:nowrap;
  margin:0;
  font-size:clamp(3.4rem,14.5vw,15rem);
  font-weight:500;
  line-height:.95;
  position:relative;
}

.big-word span {
  display:block;
}

.big-word-outline {
  color:#0000;
  -webkit-text-stroke:1px rgba(138, 154, 166, 0.3);
}

.big-word-fill {
  position:absolute;
  inset:0;
  color: transparent;
  background-image: linear-gradient(
    178deg,
    #193557 0%,
    #183253 34%,
    #11243b 68%,
    #0e213a 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 2px 1px rgba(0, 0, 0, 0.55));
}

.identity-thread {
  position: absolute;
  right: 0;
  bottom: -14px;
  left: 0;
  width: 100%;
  height: 90px;
  color: rgba(138, 154, 166, 0.42);
  pointer-events: none;
}

.identity-thread-node {
  position: absolute;
  bottom: 4px;
  left: 50%;
  width: 11px;
  height: 11px;
  border: 1px solid rgba(138, 154, 166, 0.8);
  background: #050c14;
  rotate: 45deg;
  translate: -50% 0;
}

.identity-hem {
  position: absolute;
  right: 0;
  bottom: 46px;
  left: 0;
  height: 11px;
  pointer-events: none;
}

.identity-hem::before {
  position: absolute;
  top: 5px;
  right: 0;
  left: 0;
  height: 1px;
  content: "";
  background-image: repeating-linear-gradient(
    90deg,
    rgba(138, 154, 166, 0.32) 0 9px,
    transparent 9px 18px
  );
}

.identity-hem::after {
  position: absolute;
  top: 1px;
  left: 50%;
  width: 9px;
  height: 9px;
  content: "";
  border: 1px solid rgba(138, 154, 166, 0.7);
  background: #050c14;
  rotate: 45deg;
  translate: -50% 0;
}

html[data-reveal-ready] .big-word-fill {
  clip-path:inset(-4% 100% -4% 0);
  transition:clip-path 1.5s var(--ease-out) .2s;
}

html[data-reveal-ready] .big-word.is-inview .big-word-fill {
  clip-path:inset(-4% 0% -4% 0);
}

.identity-lede {
  text-align:center;
  max-width:720px;
  margin-top:60px;
}

.identity-lede p {
  color:#bfccd5;
  margin:0;
  font-size:1.02rem;
  line-height:1.7;
  text-wrap: balance;
}

.groups {
  position: relative;
  grid-template-columns:1fr 1fr;
  gap: 26px;
  margin-top:58px;
  display:grid;
}

.group {
  position: relative;
  flex-direction:column;
  padding:46px 48px 40px;
  display:flex;
  border: 1px solid rgba(234, 240, 243, 0.15);
  border-radius: 10px;
  background: linear-gradient(158deg, #07101c 0%, #040a11 62%, #060f1a 100%);
  box-shadow:
    0 26px 54px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(234, 240, 243, 0.05);
}

.group-seam-img {
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 14px;
  width: 78px;
  pointer-events: none;
}

.group-seam-img img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  opacity: 0.92;
}

.groups-seam {
  position: absolute;
  top: 18%;
  bottom: 18%;
  left: 50%;
  width: 15px;
  background-image:
    linear-gradient(45deg, transparent 43%, rgba(138, 154, 166, 0.6) 43% 57%, transparent 57%),
    linear-gradient(-45deg, transparent 43%, rgba(138, 154, 166, 0.6) 43% 57%, transparent 57%);
  background-position: center top;
  background-repeat: repeat-y;
  background-size: 15px 30px;
  pointer-events: none;
  translate: -50% 0;
}

.group-tag {
  position: relative;
  color:#bfccd5;
  letter-spacing:.15em;
  text-transform:uppercase;
  margin:0 0 26px;
  font-size:.63rem;
  font-weight:800;
}

.group>p:not(.group-tag) {
  position: relative;
  font-family:var(--font-editorial), Georgia, serif;
  margin:0;
  font-size:clamp(1.15rem,1.6vw,1.5rem);
  line-height:1.42;
}

.group footer {
  position: relative;
  border-top:1px solid var(--line-dark);
  color:#bfccd5;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-top:30px;
  padding-top:18px;
  font-size:.63rem;
  font-weight:700;
}

.group-adn {
  overflow: hidden;
  color:var(--ivory);
  border-color: rgba(138, 154, 166, 0.32);
  background-color: #0a182a;
  background-image:
    linear-gradient(158deg, rgba(4, 9, 16, 0.4), rgba(4, 9, 16, 0.22) 52%, rgba(4, 9, 16, 0.5));
  background-repeat: no-repeat, no-repeat;
  background-position: center, center;
  background-size: cover, cover;
}

.group-adn::before {
  position: absolute;
  inset: 9px;
  content: "";
  pointer-events: none;
  border: 1px dashed rgba(138, 154, 166, 0.5);
  border-radius: 6px;
}

.group-form {
  position: absolute;
  right: -10px;
  bottom: 4px;
  width: 168px;
  pointer-events: none;
  opacity: 0.82;
}

.group-form img {
  width: 100%;
  height: auto;
}

.identity-drape {
  position: absolute;
  top: 0;
  right: -60px;
  z-index: 0;
  width: min(46%, 640px);
  pointer-events: none;
  opacity: 0.9;
  mask-image: linear-gradient(90deg, transparent, #000 30%);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 30%);
}

.identity-drape img {
  width: 100%;
  height: auto;
}

.group-adn .group-tag,.group-adn footer {
  color:#bfccd5;
}

.group-adn footer {
  border-top-color: rgba(138, 154, 166, 0.34);
}

.group-adn > p:not(.group-tag),
.group-adn footer {
  max-width: 74%;
}

.whynow {
  position: relative;
  padding:138px 0 122px;
  overflow:hidden;
  isolation: isolate;
  color: var(--ivory);
  background: #03080e;
}

.whynow::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.42;
  mix-blend-mode: soft-light;
  background:
    radial-gradient(circle at 16% 16%, rgba(14, 29, 47, 0.2), transparent 31rem),
    radial-gradient(circle at 84% 26%, rgba(15, 31, 50, 0.15), transparent 30rem),
    linear-gradient(180deg, rgba(5, 5, 5, 0.18), rgba(6, 15, 26, 0.26)),
    radial-gradient(circle at 15% 22%, rgba(255, 255, 255, 0.07) 0 0.5px, transparent 0.9px) 0 0 / 5px 5px;
  /* La última capa era `dark-couture-texture.webp` (tela del lanzamiento anterior). */
  background-repeat: no-repeat, no-repeat, no-repeat, repeat;
  background-size: auto, auto, auto, 512px 512px;
}

.whynow-number {
  margin-bottom: 30px;
  color: #bec7ce;
  opacity: 1;
}

.whynow-head {
  grid-template-columns:0.94fr 1.06fr;
  align-items:center;
  gap:56px;
  display:grid;
}

.whynow-head .eyebrow {
  color:#bec7ce;
  margin-bottom:22px;
}

.whynow h2 {
  max-width:620px;
  font-size:clamp(2rem,2.75vw,2.85rem);
  line-height:1.12;
  text-wrap:balance;
}

.whynow h2 b {
  color: #bec7ce;
  font-weight: 500;
}

.whynow-intro {
  color:#bfccd5;
  max-width:600px;
  margin:28px 0 0;
  font-size:clamp(0.98rem,1.15vw,1.05rem);
  line-height:1.78;
}

.market-concept {
  position: relative;
  min-height: 30rem;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(158, 171, 181, 0.2);
  border-radius: 10px;
  background:
    linear-gradient(rgba(155, 169, 179, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155, 169, 179, 0.035) 1px, transparent 1px),
    linear-gradient(145deg, rgba(255, 255, 255, 0.025), transparent 42%),
    rgba(3, 8, 14, 0.5);
  background-size: 42px 42px, 42px 42px, auto, auto;
  box-shadow:
    0 2rem 5rem rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.mc-copy {
  position: relative;
  z-index: 7;
  width: min(46%, 21.5rem);
  padding: clamp(1.7rem, 2.4vw, 2.4rem);
}

.mc-line {
  margin: 0;
  max-width: 42ch;
  color: #f4f3ec;
  font-size: 0.97rem;
  line-height: 1.68;
  text-wrap: pretty;
}

.mc-line b {
  color: #bec7ce;
  font-weight: 600;
}

.mc-art {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.mc-collage {
  position: absolute;
  z-index: 2;
  right: clamp(0.6rem, 2vw, 2rem);
  bottom: 0.8rem;
  width: min(50%, 24rem);
  height: auto;
  filter: drop-shadow(0 1.4rem 1.6rem rgba(0, 0, 0, 0.45));
}

.mc-traditional {
  position: absolute;
  z-index: 4;
  bottom: 2.6rem;
  left: clamp(1.6rem, 3.4vw, 3.6rem);
  display: grid;
  width: clamp(10.5rem, 19vw, 13.5rem);
  min-height: 8.4rem;
  place-items: end center;
  padding: 0 0.7rem 0.9rem;
  background: linear-gradient(180deg, #b3bec6, #738796);
  box-shadow: 0 1.2rem 2rem rgba(0, 0, 0, 0.36);
}

.mc-swatch {
  position: absolute;
  inset: 0 0 3.4rem;
  background:
    repeating-linear-gradient(93deg, transparent 0 5px, rgba(255, 255, 255, 0.025) 6px),
    #050e17;
  clip-path: polygon(
    0 7%, 3% 0, 8% 5%, 13% 1%, 19% 5%, 25% 0, 31% 5%,
    37% 1%, 44% 5%, 50% 0, 57% 5%, 64% 1%, 70% 5%,
    77% 0, 84% 5%, 91% 1%, 97% 5%, 100% 2%, 100% 100%, 0 100%
  );
}

.mc-plaque {
  position: relative;
  display: grid;
  gap: 6px;
  width: 100%;
  color: #06101b;
  text-align: center;
}

.mc-plaque b {
  font-family: var(--font-editorial), Georgia, serif;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  line-height: 1.15;
  text-transform: uppercase;
}

.mc-plaque i,
.mc-emerging i {
  position: relative;
  display: block;
  padding-top: 7px;
  font-size: 0.63rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1.25;
  text-transform: none;
}

.mc-plaque i::before,
.mc-emerging i::before {
  position: absolute;
  top: 0;
  left: 50%;
  width: 68%;
  height: 1px;
  content: "";
  background: currentColor;
  opacity: 0.42;
  translate: -50% 0;
}

.mc-emerging {
  position: absolute;
  z-index: 5;
  right: clamp(1.4rem, 3.2vw, 3.2rem);
  bottom: 2.9rem;
  display: grid;
  gap: 6px;
  width: min(38%, 14rem);
  padding: 0.8rem 0.7rem 0.75rem;
  color: #081322;
  text-align: center;
  background: rgba(228, 235, 239, 0.94);
  box-shadow: 0 0.8rem 1.8rem rgba(0, 0, 0, 0.3);
}

.mc-emerging b {
  font-family: var(--font-editorial), Georgia, serif;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.055em;
  line-height: 1.24;
  text-transform: uppercase;
  text-wrap: balance;
}

.mc-note {
  position: absolute;
  z-index: 6;
  right: 1.6rem;
  bottom: 0.7rem;
  left: 1.6rem;
  color: rgba(192, 201, 208, 0.82);
  font-size: 0.62rem;
  line-height: 1.45;
  text-align: center;
}

.script-note {
  color:#bec7ce;
  font-family:var(--font-editorial), Georgia, serif;
  margin:18px 0 0;
  font-size:1.25rem;
  font-style:italic;
}

.reasons-grid {
  border-top:1px solid rgba(158, 171, 181, 0.18);
  border-left:1px solid rgba(158, 171, 181, 0.18);
  grid-template-columns:1fr 1fr 1fr;
  margin:92px auto 0;
  padding:0;
  list-style:none;
  display:grid;
}

.reasons-grid li {
  border-right:1px solid rgba(158, 171, 181, 0.18);
  border-bottom:1px solid rgba(158, 171, 181, 0.18);
  grid-template-columns:auto 1fr;
  gap:22px;
  padding:40px 38px 44px;
  display:grid;
}

.reasons-grid li>span {
  border:1px solid rgba(158, 171, 181, 0.3);
  width:34px;
  height:34px;
  color:#bec7ce;
  border-radius:50%;
  place-items:center;
  font-size:.58rem;
  font-weight:800;
  display:grid;
}

.reasons-grid h3 {
  font-family:var(--font-editorial), Georgia, serif;
  margin:2px 0 12px;
  font-size:clamp(1.2rem,1.6vw,1.5rem);
  font-weight:500;
  line-height:1.15;
}

.reasons-grid li>div>p {
  color:#bfccd5;
  margin:0;
  font-size:.9rem;
  line-height:1.6;
}

.democ {
  text-align:center;
  max-width:760px;
  margin-top:68px;
}

.democ>p:first-child {
  color:#bfccd5;
  margin:0;
  font-size:1.02rem;
  line-height:1.75;
}

.democ-close {
  font-family:var(--font-editorial), Georgia, serif;
  margin:30px 0 0;
  font-size:clamp(1.4rem,2.2vw,1.95rem);
  font-style:italic;
  line-height:1.35;
}

.democ-close strong {
  color:#bec7ce;
  font-style:normal;
  font-weight:500;
}

.democ .text-cta {
  margin-top:34px;
}

/* La sesión · «El patrón de cuatro momentos».
   Pliego técnico de atelier sobre negro cálido: cabecera editorial,
   costura horizontal con nodos de patronaje y cuatro columnas con
   numeración monumental dorada. */
.agenda {
  padding:138px 0 96px;
  overflow:hidden;
  background:
    radial-gradient(34% 28% at 0% 0%, rgba(14, 30, 49, 0.34), transparent 72%),
    radial-gradient(40% 42% at 100% 88%, rgba(14, 30, 49, 0.14), transparent 70%),
    linear-gradient(180deg, #060f1a, #050c15 56%, #060f1a);
}

.agenda-head {
  grid-template-columns:.85fr 2.7fr 1.2fr;
  align-items:start;
  gap:40px;
  display:grid;
}

.agenda-head .eyebrow {
  color:var(--gold-quiet);
  margin-bottom:22px;
}

.agenda h2 {
  font-family:var(--font-editorial), Georgia, serif;
  letter-spacing:-.045em;
  font-size:clamp(2.7rem,4.2vw,4.7rem);
  font-weight:500;
  line-height:1.02;
}

.agenda h2 em {
  color:#bec7ce;
  font-weight:500;
}

/* Subtítulo en columna derecha, colgado de un hilo vertical dorado. */
.agenda-sub {
  color:#bfccd5;
  max-width:620px;
  margin:14px 0 0;
  padding-left:26px;
  border-left:1px solid rgba(138, 154, 166, 0.5);
  position:relative;
  font-size:1.0625rem;
  line-height:1.7;
}

.agenda-sub::before {
  content:"";
  position:absolute;
  top:-5px;
  left:-4px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--gold-quiet);
}

/* Costura horizontal: hilván a sangre completa con nodos de patronaje,
   uno centrado sobre cada columna del pliego. */
.agenda-seam {
  position:relative;
  height:1px;
  margin-top:clamp(56px,6vw,84px);
  background:repeating-linear-gradient(90deg, rgba(138, 154, 166, 0.44) 0 12px, transparent 12px 24px);
}

.seam-node {
  position:absolute;
  top:50%;
  translate:-50% -50%;
  width:30px;
  height:30px;
  color:var(--gold-quiet);
  background:#050d17;
  padding:2px;
}

.seam-node:nth-child(1) { left:12.5%; }
.seam-node:nth-child(2) { left:37.5%; }
.seam-node:nth-child(3) { left:62.5%; }
.seam-node:nth-child(4) { left:87.5%; }

/* Pliego de cuatro columnas separadas por hilvanes verticales. */
.timeline {
  max-width:none;
  margin-top:0;
  padding-left:0;
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  list-style:none;
  padding-block:0;
}

.moment {
  padding:clamp(40px,4.4vw,64px) clamp(20px,2.2vw,38px) clamp(30px,3vw,44px);
  position:relative;
}

.moment + .moment {
  border-left:1px solid rgba(138, 154, 166, 0.2);
}

.moment:first-child {
  padding-left:0;
}

.moment-ghost {
  display:block;
  color:var(--gold-quiet);
  font-family:var(--font-editorial), Georgia, serif;
  -webkit-user-select:none;
  user-select:none;
  font-size:clamp(4.4rem,6vw,6.4rem);
  font-weight:500;
  line-height:1;
  margin-bottom:26px;
}

.moment-tag {
  color:rgba(138, 154, 166, 0.9);
  letter-spacing:.22em;
  text-transform:uppercase;
  margin:0 0 14px;
  font-size:.66rem;
  font-weight:700;
}

.moment h3 {
  color:var(--ivory);
  font-family:var(--font-editorial), Georgia, serif;
  margin:0 0 14px;
  font-size:clamp(1.4rem,1.8vw,1.75rem);
  font-weight:500;
  line-height:1.14;
}

.moment>p:not(.moment-tag) {
  color:#bfccd5;
  max-width:520px;
  margin:0;
  font-size:1.0625rem;
  line-height:1.62;
}

/* Remate inferior: hilván fino con doble puntada en aspa. */
.agenda-close {
  position:relative;
  height:1px;
  margin-top:clamp(20px,2.6vw,36px);
  background:repeating-linear-gradient(90deg, rgba(138, 154, 166, 0.26) 0 9px, transparent 9px 20px);
}

.agenda-close svg {
  position:absolute;
  top:50%;
  left:50%;
  translate:-50% -50%;
  width:40px;
  height:18px;
  color:rgba(138, 154, 166, 0.75);
  background:#050d17;
  padding-inline:8px;
}

/* El filtro · mesa de patronaje editorial oscura.
   La superficie continúa la agenda, pero gana profundidad de vino, textura
   de corte y fichas oscuras para evitar el salto marfil. */
.audience {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(104px, 8vw, 132px) 0 0;
  color: var(--ivory);
  background:
    radial-gradient(72% 52% at 84% 22%, rgba(15, 31, 52, 0.18), transparent 72%),
    linear-gradient(180deg, #050d17 0%, #040b12 22%, #060e19 68%, #060f1a 100%);
}

.audience::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.24;
  background-image:
    linear-gradient(rgba(138, 154, 166, 0.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(138, 154, 166, 0.1) 1px, transparent 1px);
  background-size: 84px 84px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.68), transparent 76%);
}

.audience::after {
  position: absolute;
  z-index: 0;
  inset: 0 0 auto;
  height: 1px;
  content: "";
  pointer-events: none;
  background: repeating-linear-gradient(90deg, rgba(138, 154, 166, 0.5) 0 8px, transparent 8px 18px);
  opacity: 0.55;
}

.audience-heading {
  position: relative;
  z-index: 1;
  display: block;
}

.audience-heading > .section-number {
  position: absolute;
  top: 8px;
  left: 0;
  color: var(--text-on-dark-muted);
  opacity: 1;
}

.audience-heading > div {
  max-width: 820px;
  margin-inline: auto;
  text-align: center;
}

.audience-heading .eyebrow {
  color: rgba(138, 154, 166, 0.9);
}

.audience-ornament {
  position: relative;
  display: block;
  width: 84px;
  height: 11px;
  margin: 14px auto 24px;
}

.audience-ornament::before {
  position: absolute;
  top: 5px;
  right: 0;
  left: 0;
  height: 1px;
  content: "";
  background: rgba(138, 154, 166, 0.42);
}

.audience-ornament::after {
  position: absolute;
  top: 1px;
  left: 50%;
  width: 9px;
  height: 9px;
  content: "";
  translate: -50%;
  rotate: 45deg;
  border: 1px solid rgba(234, 240, 243, 0.22);
  background: var(--gold-quiet);
  box-shadow: 0 0 0 4px #050b14;
}

.audience-heading h2 {
  max-width: 760px;
  margin-inline: auto;
  font-size: var(--type-display-section);
  line-height: var(--leading-display);
}

.audience-heading h2 em {
  color: var(--carmine-soft);
}

.audience-sub {
  max-width: 580px;
  margin: 26px auto 0;
  color: var(--text-on-dark);
  font-size: var(--type-body);
  line-height: 1.7;
}

.audience-sub strong {
  color: var(--ivory);
  font-weight: 800;
  box-shadow: inset 0 -1px 0 rgba(25, 53, 87, 0.9);
}

.qualify-board {
  position: relative;
  z-index: 1;
  overflow: hidden;
  margin-top: clamp(52px, 5vw, 72px);
  padding: clamp(30px, 3.2vw, 48px);
  border: 1px solid rgba(138, 154, 166, 0.28);
  color: var(--ivory);
  background-color: #07121f;
  background-image:
    linear-gradient(180deg, rgba(3, 8, 14, 0.46), rgba(5, 12, 21, 0.82)),
    radial-gradient(70% 50% at 50% 0%, rgba(47, 95, 138, 0.18), transparent 70%);
  /* Era `qualify-board-mat-1586` (tablero de corte del lanzamiento anterior). */
  background-position: center;
  background-size: cover;
  box-shadow:
    inset 0 0 0 1px rgba(234, 240, 243, 0.035),
    inset 0 -100px 140px rgba(5, 4, 5, 0.28),
    0 42px 90px -56px rgba(0, 0, 0, 0.9);
}

.qualify-board::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: "";
  pointer-events: none;
  background:
    radial-gradient(80% 70% at 78% 24%, rgba(20, 42, 69, 0.12), transparent 72%),
    linear-gradient(90deg, rgba(3, 8, 14, 0.22), rgba(3, 8, 14, 0.02) 56%, rgba(3, 8, 14, 0.2));
}

.qualify-board::after {
  position: absolute;
  z-index: 1;
  inset: 0 0 auto;
  height: 10px;
  content: "";
  pointer-events: none;
  border-bottom: 1px solid rgba(138, 154, 166, 0.2);
  background: repeating-linear-gradient(90deg, rgba(138, 154, 166, 0.38) 0 1px, transparent 1px 23px);
}

.q-thread {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.72;
}

.qcard-thread {
  position: absolute;
  top: 0;
  left: 0;
  width: 112px;
  height: 86px;
  pointer-events: none;
  opacity: 0.52;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.45));
}

.q-photo {
  position: absolute;
  z-index: 2;
  inset: 0 0 0 auto;
  width: clamp(290px, 28vw, 414px);
  margin: 0;
  pointer-events: none;
}

.q-photo::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    linear-gradient(90deg, #07121f 0%, transparent 34%),
    linear-gradient(180deg, transparent 64%, #07121f 100%);
}

.q-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 58% top;
  filter: saturate(0.78) contrast(1.04) brightness(0.76);
}

.qualify-grid {
  position: relative;
  z-index: 3;
  display: grid;
  width: calc(100% - clamp(290px, 28vw, 414px) - clamp(20px, 2.4vw, 34px));
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 1.6vw, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.qualify-card:nth-child(n) {
  grid-column: auto;
  grid-row: auto;
  margin-top: 0;
  rotate: 0deg;
  clip-path: none;
}

.qualify-card:nth-child(5) {
  grid-column: 1 / -1;
}

.qualify-card {
  position: relative;
  display: grid;
  min-width: 0;
  grid-template-columns: auto 1fr;
  column-gap: 16px;
  align-content: start;
  align-items: center;
  padding: clamp(24px, 2.1vw, 32px) clamp(20px, 2vw, 30px) clamp(24px, 2.2vw, 34px) clamp(46px, 3.6vw, 58px);
  border: 1px solid rgba(234, 240, 243, 0.13);
  color: var(--ivory);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.035), transparent 52%),
    rgba(9, 22, 37, 0.94);
  box-shadow:
    inset 0 1px 0 rgba(234, 240, 243, 0.045),
    0 24px 48px -34px rgba(0, 0, 0, 0.88);
}

.qualify-card:nth-child(2),
.qualify-card:nth-child(5) {
  background:
    linear-gradient(145deg, rgba(25, 53, 87, 0.06), transparent 60%),
    rgba(9, 22, 39, 0.95);
}

.qualify-card:nth-child(3) {
  background:
    linear-gradient(145deg, rgba(138, 154, 166, 0.055), transparent 60%),
    rgba(9, 22, 37, 0.96);
}

.qualify-card::before {
  position: absolute;
  top: 29px;
  left: 18px;
  width: 16px;
  height: 16px;
  content: "";
  border-radius: 50%;
  background: radial-gradient(circle at 38% 30%, #c8d6de 0 10%, #738796 24%, #050d17 43% 58%, #637583 68%, #96a5af 78%, #637583 100%);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.6);
}

/* RETIRADO el 19-09-2026. Era un cuadrado discontinuo de 25 px en la esquina
   de cada tarjeta. Junto al copy de la sección —«no hace falta que te veas en
   todas las casillas»— se leía como una casilla que se puede marcar, y no
   responde a nada: una interacción falsa en la sección que decide si el
   visitante se siente aludido. El marco de la tarjeta ya la delimita.
.qualify-card::after { … }  */

.qcard-number {
  grid-row: 1;
  margin: 0;
  color: rgba(138, 154, 166, 0.76);
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(2.35rem, 2.7vw, 3rem);
  font-weight: 500;
  line-height: 0.9;
}

.qualify-tag {
  grid-row: 1;
  margin: 0 26px 0 0;
  color: var(--ivory);
  font-family: var(--font-editorial), Georgia, serif;
  font-size: var(--type-heading-card);
  font-weight: 500;
  line-height: 1.18;
}

.qualify-card ul {
  display: grid;
  grid-column: 1 / -1;
  gap: 11px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.qualify-card li {
  position: relative;
  padding-left: 22px;
  color: #bfccd5;
  font-size: clamp(0.95rem, 0.28vw + 0.9rem, 1.03rem);
  line-height: 1.58;
}

.qualify-card li::before {
  position: absolute;
  top: 0.72em;
  left: 2px;
  width: 6px;
  height: 6px;
  content: "";
  border-radius: 50%;
  background: var(--carmine-soft);
  box-shadow: 0 0 0 3px rgba(25, 53, 87, 0.1);
}

.qualify-card li:nth-child(even)::before {
  background: var(--gold-quiet);
  box-shadow: 0 0 0 3px rgba(138, 154, 166, 0.1);
}

.qualify-note {
  position: relative;
  z-index: 3;
  width: min(660px, calc(100% - clamp(290px, 28vw, 414px) - 28px));
  margin: clamp(28px, 3vw, 42px) auto 0 0;
  padding: 18px clamp(24px, 3.2vw, 44px);
  border-top: 1px solid rgba(138, 154, 166, 0.35);
  border-bottom: 1px solid rgba(234, 240, 243, 0.09);
  color: var(--ivory);
  background: linear-gradient(90deg, rgba(25, 53, 87, 0.13), rgba(234, 240, 243, 0.025));
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.3rem, 1.75vw, 1.65rem);
  font-style: italic;
  line-height: 1.38;
  text-align: center;
}

.qualify-note::before {
  position: absolute;
  top: 50%;
  left: -18px;
  width: 36px;
  height: 12px;
  content: "";
  translate: 0 -50%;
  rotate: -22deg;
  border: 1px solid rgba(138, 154, 166, 0.85);
  border-radius: 8px;
}

.together {
  position: relative;
  overflow: hidden;
  margin-top: 0;
  padding: clamp(68px, 7vw, 98px) 0 clamp(78px, 8vw, 112px);
  color: var(--ivory);
  background: #091728;
  text-align: center;
}

.together-fabric {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.together-fabric img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.72) brightness(0.6) contrast(1.05);
}

.together::before {
  position: absolute;
  inset: 0;
  content: "";
  background:
    radial-gradient(70% 90% at 50% 38%, rgba(14, 33, 58, 0.2), rgba(4, 11, 18, 0.76)),
    linear-gradient(180deg, rgba(4, 11, 18, 0.24), rgba(4, 11, 18, 0.72));
}

.together::after {
  position: absolute;
  inset: auto 0 0;
  height: 44%;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, transparent, #050d16 100%);
}

.together-inner {
  position: relative;
  z-index: 1;
}

.together .eyebrow {
  margin-bottom: 16px;
  color: #bec7ce;
}

.together .eyebrow::before,
.together .eyebrow::after {
  margin-inline: 14px;
  color: rgba(190, 199, 206, 0.55);
  content: "◆";
  font-size: 0.6em;
  vertical-align: 0.18em;
}

.together-inner > p:last-child {
  max-width: 640px;
  margin: 0 auto;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.3rem, 1.8vw, 1.7rem);
  line-height: 1.42;
}

/* Pliego de la agenda a dos columnas en anchos intermedios. */
@media (width>=768px) and (width<=1100px) {
  .timeline {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .moment + .moment {
    border-left:0;
  }
  .moment:nth-child(even) {
    border-left:1px solid rgba(138, 154, 166, 0.2);
  }
  .moment:nth-child(n+3) {
    border-top:1px solid rgba(138, 154, 166, 0.2);
  }
  .moment:nth-child(3) {
    padding-left:0;
  }
  .seam-node:nth-child(1) { left:25%; }
  .seam-node:nth-child(2) { left:75%; }
  .seam-node:nth-child(3),
  .seam-node:nth-child(4) { display:none; }
}

/* En tablet la fotografía entra en el flujo y las fichas conservan dos columnas. */
@media (width <= 1100px) {
  .q-thread {
    display: none;
  }

  .qualify-board {
    background-image:
      linear-gradient(180deg, rgba(3, 8, 14, 0.5), rgba(5, 12, 21, 0.84)),
      radial-gradient(70% 50% at 50% 0%, rgba(47, 95, 138, 0.18), transparent 70%);
  }

  .q-photo {
    position: relative;
    inset: auto;
    width: min(42%, 330px);
    height: clamp(250px, 34vw, 360px);
    margin: 0 0 28px auto;
  }

  .q-photo::after {
    background:
      linear-gradient(90deg, #07121f 0%, transparent 24%),
      linear-gradient(180deg, transparent 56%, #07121f 100%);
  }

  .qualify-grid,
  .qualify-note {
    width: 100%;
  }

  .qualify-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .qualify-card:nth-child(5) {
    grid-column: 1 / -1;
  }

  .qualify-note {
    margin-right: auto;
  }
}

@media (width >= 1101px) and (width <= 1280px) {
  .qualify-board {
    padding-inline: 30px;
  }

  .qualify-grid {
    gap: 16px;
  }

  .qualify-card {
    padding-right: 20px;
    padding-left: 48px;
  }

  .qualify-tag {
    margin-right: 20px;
    font-size: 1.08rem;
  }

  .qualify-card li {
    font-size: 0.94rem;
  }
}

@media (width <= 767px) {
  .audience {
    padding-top: 86px;
  }

  .audience::before {
    background-size: 56px 56px;
    opacity: 0.16;
  }

  .audience-heading > .section-number {
    position: static;
    display: block;
    margin-bottom: 20px;
  }

  .audience-heading > div {
    text-align: left;
  }

  .audience-ornament {
    margin-right: auto;
    margin-left: 0;
  }

  .audience-heading h2 {
    margin-inline: 0;
    font-size: clamp(3rem, 14vw, 4.35rem);
  }

  .audience-sub {
    margin-right: 0;
    margin-left: 0;
  }

  .q-photo,
  .qcard-thread {
    display: none;
  }

  .qualify-board {
    margin-top: 44px;
    padding: 26px 18px 30px;
    background-image:
      linear-gradient(180deg, rgba(3, 8, 14, 0.52), rgba(5, 12, 21, 0.86)),
      radial-gradient(70% 50% at 50% 0%, rgba(47, 95, 138, 0.18), transparent 70%);
  }

  .qualify-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .qualify-card:nth-child(5) {
    grid-column: auto;
  }

  .qualify-card {
    padding: 24px 20px 26px 46px;
  }

  .qualify-card::before {
    left: 16px;
  }

  .qualify-tag {
    font-size: 1.18rem;
  }

  .qualify-note {
    margin-top: 30px;
    padding-inline: 20px;
    font-size: 1.24rem;
  }

  .qualify-note::before {
    display: none;
  }

  .together {
    padding: 60px 0 82px;
  }
}

.founder {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(118px, 9vw, 150px) 0 clamp(116px, 8vw, 142px);
  color: var(--ivory);
  background:
    radial-gradient(58% 52% at 27% 42%, rgba(17, 36, 59, 0.24), transparent 72%),
    radial-gradient(48% 38% at 84% 18%, rgba(138, 154, 166, 0.07), transparent 78%),
    linear-gradient(180deg, #050d16 0%, #050c15 55%, #040a11 100%);
}

.founder::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.25;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(234, 240, 243, 0.13) 0 0.6px, transparent 0.9px),
    radial-gradient(circle at 74% 66%, rgba(138, 154, 166, 0.11) 0 0.6px, transparent 0.9px);
  background-size: 6px 6px, 8px 8px;
  mix-blend-mode: soft-light;
}

.founder::after {
  position: absolute;
  z-index: -1;
  inset: auto 0 0;
  height: 25%;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, transparent, var(--ink));
}

.founder-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.98fr);
  grid-template-rows: auto 1fr;
  column-gap: clamp(44px, 5.2vw, 86px);
  row-gap: 30px;
  align-items: start;
}

.founder-image {
  position: relative;
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: center;
  margin: 0;
}

.founder-image::before {
  position: absolute;
  z-index: 0;
  inset: -26px 28px 30px -28px;
  content: "";
  border: 1px solid rgba(138, 154, 166, 0.26);
  background:
    radial-gradient(circle at 42% 38%, rgba(25, 53, 87, 0.15), transparent 66%),
    #081320;
  rotate: -0.7deg;
  box-shadow: 0 36px 80px -54px rgba(0, 0, 0, 0.95);
}

.founder-image::after {
  position: absolute;
  z-index: 3;
  inset: -36px 16px 18px -38px;
  content: "";
  pointer-events: none;
  background-image:
    linear-gradient(var(--line-dark), var(--line-dark)),
    linear-gradient(var(--line-dark), var(--line-dark)),
    linear-gradient(var(--line-dark), var(--line-dark)),
    linear-gradient(var(--line-dark), var(--line-dark));
  background-repeat: no-repeat;
  background-size: 1px 28px, 28px 1px, 1px 28px, 28px 1px;
  background-position: left top, left top, right bottom, right bottom;
}

.founder-plate {
  position: relative;
  z-index: 1;
  padding: 14px 14px 12px;
  border: 1px solid rgba(234, 240, 243, 0.13);
  background: #07121f;
  box-shadow:
    inset 0 1px 0 rgba(234, 240, 243, 0.045),
    0 34px 70px -44px rgba(0, 0, 0, 0.95);
  rotate: -0.35deg;
}

.founder-frame {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #040b12;
}

.founder-frame::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(3, 8, 14, 0.03), rgba(3, 8, 14, 0.34)),
    linear-gradient(90deg, rgba(5, 12, 20, 0.16), transparent 42%);
}

.founder-image img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 50% 16%;
  filter: saturate(0.72) contrast(1.08) brightness(0.83);
}

.founder-image figcaption {
  margin-top: 12px;
  color: #9baebb;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: 0.88rem;
  font-style: italic;
  letter-spacing: 0.01em;
}

.founder-seal {
  position: absolute;
  top: 16%;
  left: -20px;
  z-index: 4;
  width: 66px;
  height: 66px;
  border: 1px solid rgba(138, 154, 166, 0.55);
  border-radius: 50%;
  background: rgba(4, 11, 18, 0.78);
  opacity: 0.9;
}

.founder-seal::before {
  position: absolute;
  inset: 5px;
  content: "";
  border: 1px dashed rgba(138, 154, 166, 0.42);
  border-radius: 50%;
}

.founder-seal::after {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  content: "FL";
  color: rgba(190, 199, 206, 0.9);
  font-family: var(--font-editorial), Georgia, serif;
  font-size: 1.1rem;
  letter-spacing: 0.06em;
}

.founder-head {
  grid-column: 2;
  grid-row: 1;
}

.founder-eyebrow {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 0 0 20px;
}

.founder-eyebrow > i {
  position: relative;
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(138, 154, 166, 0.5), rgba(138, 154, 166, 0.08));
}

.founder-eyebrow > i::after {
  position: absolute;
  top: -4px;
  right: 0;
  width: 8px;
  height: 8px;
  content: "";
  rotate: 45deg;
  border: 1px solid rgba(138, 154, 166, 0.7);
  background: #050d16;
}

.founder-eyebrow .section-number {
  flex: 0 0 auto;
  color: #9baebb;
  opacity: 1;
}

.signature {
  flex: 0 0 auto;
  margin: 0;
  color: var(--carmine-soft);
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.1rem, 1.4vw, 1.4rem);
  font-style: italic;
}

.founder h2 {
  max-width: 620px;
  font-size: var(--type-display-section-compact);
  line-height: 0.9;
}

.founder-role {
  margin: 16px 0 0;
  color: rgba(190, 199, 206, 0.82);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
}

.founder-body {
  grid-column: 2;
  grid-row: 2;
  padding-top: 24px;
}

.founder-body > p {
  max-width: var(--measure-body);
  margin: 22px 0 0;
  color: var(--text-on-dark);
  font-size: var(--type-body);
  line-height: 1.72;
}

.founder-body .founder-lead {
  max-width: 44ch;
  margin: 0 0 30px;
  padding: 3px 0 3px 26px;
  border-left: 2px solid var(--carmine);
  color: var(--ivory);
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.28rem, 1.7vw, 1.62rem);
  line-height: 1.45;
}

.founder-body b {
  color: var(--ivory);
  font-weight: 750;
  box-shadow: inset 0 -1px 0 rgba(138, 154, 166, 0.74);
}

.founder-body .founder-close {
  position: relative;
  max-width: 47ch;
  margin-top: 34px;
  padding-left: 26px;
  color: var(--ivory);
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.16rem, 1.45vw, 1.42rem);
  font-style: italic;
  line-height: 1.54;
}

.founder-body .founder-close::before {
  position: absolute;
  top: 0.85em;
  left: -14px;
  width: 26px;
  height: 1px;
  content: "";
  background: rgba(138, 154, 166, 0.72);
}

.founder-stamp {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 44px;
  padding-top: 20px;
  border-top: 1px solid var(--line-dark-soft);
  color: #bfccd5;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.founder-stamp > i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  rotate: 45deg;
  border: 1px solid rgba(138, 154, 166, 0.75);
  background: var(--gold-quiet);
}

.founder-stamp span:last-child {
  margin-left: auto;
  color: #9baebb;
  font-weight: 700;
}

.school-strip {
  min-height:410px;
  color:var(--ivory);
  background:var(--ink);
  grid-template-columns:1.25fr .75fr;
  margin-top:145px;
  display:grid;
  position:relative;
}

.school-strip img {
  object-fit:cover;
  filter:saturate(.72)contrast(1.06);
  width:100%;
  height:100%;
  max-height:520px;
}

.school-strip p {
  flex-direction:column;
  justify-content:center;
  gap:12px;
  margin:0;
  padding:55px;
  display:flex;
}

.school-strip span {
  color:#9baebb;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:.64rem;
  font-weight:800;
}

.school-strip strong {
  font-family:var(--font-editorial), Georgia, serif;
  font-size:clamp(2.1rem,3.2vw,3.6rem);
  font-weight:500;
  line-height:1;
}

.testimonials {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding:135px 0 145px;
}

.testimonials::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.4;
  mix-blend-mode: soft-light;
  /* Era `testimonials-dark-couture-texture.webp` (tela del lanzamiento anterior). */
  background:
    radial-gradient(circle at 15% 22%, rgba(255, 255, 255, 0.07) 0 0.5px, transparent 0.9px) 0 0 / 5px 5px,
    radial-gradient(circle at 72% 64%, rgba(255, 255, 255, 0.05) 0 0.6px, transparent 1px) 0 0 / 7px 7px;
  background-size: 512px 512px;
}

.tst-pattern {
  position: absolute;
  top: 8%;
  z-index: -1;
  width: clamp(140px, 15vw, 220px);
  height: auto;
  color: rgba(138, 154, 166, 0.34);
  pointer-events: none;
}

.tst-pattern--left {
  left: -10px;
}

.testimonials-heading {
  position: relative;
  grid-template-columns:0.62fr 1.9fr 1.02fr;
  align-items:start;
  gap:46px;
  display:grid;
}

.tst-eyebrow {
  position: relative;
  padding-top: 8px;
  color: #bfccd5;
  opacity: 1;
}

.tst-eyebrow::first-line {
  color: inherit;
}

.tst-eyebrow::after {
  position: absolute;
  top: 34px;
  left: 0;
  width: 120px;
  height: 9px;
  content: "";
  background-image: linear-gradient(90deg, rgba(138, 154, 166, 0.55), rgba(138, 154, 166, 0.1));
  background-position: 0 4px;
  background-repeat: no-repeat;
  background-size: 100% 1px;
}

.tst-eyebrow::before {
  position: absolute;
  top: 34px;
  left: 108px;
  width: 7px;
  height: 7px;
  content: "";
  border: 1px solid var(--carmine-soft);
  background: var(--carmine);
  rotate: 45deg;
}

.testimonials h2 {
  font-size:clamp(4rem,6.25vw,6.8rem);
  line-height:.9;
}

.tst-context {
  margin: 8px 0 0;
  padding-left: 26px;
  border-left: 1px solid rgba(138, 154, 166, 0.35);
  color: #bfccd5;
  font-size: 0.94rem;
  line-height: 1.72;
}

.video-grid {
  /* Carril editorial de tarjetas UNIFORMES: las cuatro historias comparten
     marco 4/5; el vídeo completo sigue disponible en fullscreen. En
     escritorio la fila entera cabe y los mandos se auto-ocultan. */
  display:flex;
  gap:22px;
  margin-top:85px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
}

.video-grid::-webkit-scrollbar {
  display:none;
}

.video-grid > .video-story {
  flex:0 0 auto;
  scroll-snap-align:start;
  width:clamp(230px, 22.5vw, 322px);
}

.video-story {
  border:1px solid var(--line-dark);
  background:#060f1a;
}

.video-story video {
  aspect-ratio:4/5;
  object-fit:cover;
  background:#050505;
  width:100%;
  height:auto;
}

/* Encuadre por historia dentro del marco común: el punto de interés manda
   (verificado sobre los pósters reales). El frame completo vive en el
   propio vídeo: controles y fullscreen no recortan nada. */
.video-story:nth-child(1) video {
  object-position: 60% 50%;
}

.video-story:nth-child(2) video {
  object-position: 55% 50%;
}

.video-story--vertical video {
  object-position: 50% 30%;
}

.video-story {
  position: relative;
  padding: 10px;
  border: 1px solid rgba(138, 154, 166, 0.3);
}

/* remaches dorados en las esquinas del marco */
.video-story::before,
.video-story::after {
  position: absolute;
  z-index: 2;
  width: 9px;
  height: 9px;
  content: "";
  border-radius: 50%;
  background: radial-gradient(circle at 34% 32%, #c3d2db, var(--gold-quiet) 62%, #637583);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.65);
}

.video-story::before {
  top: -5px;
  left: -5px;
}

.video-story::after {
  right: -5px;
  bottom: -5px;
}

.video-caption {
  justify-content:space-between;
  align-items:center;
  gap:20px;
  min-height:78px;
  padding:18px 22px;
  display:flex;
}

.video-caption {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 10px;
  padding: 12px 4px 2px;
  border-top: 1px solid rgba(138, 154, 166, 0.24);
}

.video-caption > i {
  width: 1px;
  height: 13px;
  flex: 0 0 auto;
  background: rgba(138, 154, 166, 0.4);
}

.video-stitch {
  width: 22px;
  height: 15px;
  flex: 0 0 auto;
  margin-left: auto;
  color: rgba(138, 154, 166, 0.6);
}

.video-story span,.video-story strong {
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:.62rem;
}

.video-story span {
  color:var(--carmine);
  font-weight:800;
}

.video-story strong {
  font-weight:650;
}

/* Pasador de lookbook: aguja e hilván, discreto en reposo. Solo existe
   donde hay puntero con hover; en táctil manda el gesto. */
.rail-cabecera {
  display:flex;
  justify-content:flex-end;
  margin-top:54px;
}

.rail-cabecera + .video-grid {
  margin-top:16px;
}

.rail-pager {
  display:flex;
  gap:10px;
}

/* El script pone `hidden` cuando el carril no desborda y no hay nada
   que pasar; sin esta regla, `display:flex` lo anulaba y las flechas
   seguían a la vista prometiendo un contenido que no existe. */
.rail-pager[hidden] {
  display:none;
}

.pager-btn {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  padding:0;
  color:var(--gold-quiet);
  background:transparent;
  border:1px solid rgba(138, 154, 166, 0.38);
  border-radius:2px;
  cursor:pointer;
  transition:color .18s, background .18s, border-color .18s, opacity .18s;
}

.pager-btn svg {
  width:19px;
  height:19px;
}

.pager-btn:hover:not(:disabled) {
  color:var(--ivory);
  background:rgba(138, 154, 166, 0.14);
  border-color:rgba(138, 154, 166, 0.66);
}

.pager-btn:focus-visible {
  outline:2px solid var(--gold-quiet);
  outline-offset:2px;
}

.pager-btn:disabled {
  opacity:.28;
  cursor:default;
}

.rail-pager--banda {
  position:absolute;
  top:0;
  right:clamp(18px, 2.2vw, 40px);
  z-index:3;
  translate:0 -50%;
}

.rail-pager--banda .pager-btn {
  background:#050d17;
}

/* En táctil el pasador se queda (para muchas usuarias tocar una flecha es
   más directo que descubrir el swipe), con área táctil de 44px. El swipe
   sigue siendo el gesto principal. */
@media (hover: none) and (pointer: coarse) {
  .pager-btn {
    width:44px;
    height:44px;
  }
}

/* Hilo de progreso: un hilván dorado que se va cosiendo con el avance del
   carril. Es posición y afordance a la vez, también en táctil. */
.rail-hilo {
  position:relative;
  height:9px;
  margin-top:22px;
}

.rail-hilo::before {
  content:"";
  position:absolute;
  inset:4px 0 auto;
  height:1px;
  background:repeating-linear-gradient(90deg, rgba(138, 154, 166, 0.34) 0 6px, transparent 6px 13px);
}

.rail-hilo > i {
  position:absolute;
  top:3px;
  left:0;
  width:0%;
  height:3px;
  border-radius:2px;
  background:linear-gradient(90deg, rgba(138, 154, 166, 0.55), #b1bcc4);
  transition:width .35s ease;
}

.rail-hilo [data-rail-contador] {
  position:absolute;
  right:0;
  top:-15px;
  color:rgba(138, 154, 166, 0.72);
  font-family:var(--font-interface), Arial, sans-serif;
  font-size:.56rem;
  font-weight:800;
  letter-spacing:.16em;
  font-variant-numeric:tabular-nums;
}

.rail-hilo--banda {
  margin:26px 0 8px;
}

.quote-band {
  position: relative;
  margin-top: 78px;
  padding: 6px 0 10px;
  border-block: 1px solid rgba(138, 154, 166, 0.2);
  background: rgba(0, 0, 0, 0.28);
}

.quote-swatch {
  position: absolute;
  top: -14px;
  bottom: -14px;
  left: 0;
  z-index: 0;
  width: clamp(70px, 7.4vw, 122px);
  pointer-events: none;
}

.quote-swatch img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
}

/* etiqueta de lino con monograma (el asset raster quedó pendiente) */
.quote-label {
  /* Con el muro convertido en carril, la etiqueta cuelga del filete superior
     de la banda (antes flotaba a media altura sobre una zona sin texto que
     ahora recorren las citas). */
  position: absolute;
  top: 0;
  left: clamp(18px, 2.2vw, 40px);
  z-index: 2;
  display: grid;
  width: 54px;
  height: 54px;
  place-content: center;
  justify-items: center;
  gap: 2px;
  border: 1px solid rgba(138, 154, 166, 0.4);
  background: linear-gradient(150deg, #cbd8e1, #afbac2);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.45);
  rotate: -2deg;
  translate: 0 -50%;
}

.quote-label b {
  color: #0d2139;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: 1.3rem;
  line-height: 1;
}

.quote-label small {
  color: #637583;
  font-size: 0.4rem;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.quote-wall {
  position: relative;
  z-index: 1;
  display:flex;
  margin-top:0;
  padding-inline: clamp(58px, 7.6vw, 132px) clamp(46px, 5.4vw, 92px);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
}

.quote-wall::-webkit-scrollbar {
  display:none;
}

.quote-wall blockquote {
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  scroll-snap-align:start;
  width:clamp(320px, 30vw, 460px);
  border-left:1px solid var(--line-dark);
  min-height:280px;
  margin:0;
  padding:32px 30px 30px;
}

.quote-wall blockquote:last-child {
  border-right:1px solid var(--line-dark);
}

.quote-wall blockquote>span {
  height:44px;
  color:var(--carmine);
  font-family:var(--font-editorial), Georgia, serif;
  font-size:4.2rem;
  line-height:1;
  display:block;
}

.quote-wall blockquote p {
  font-family:var(--font-editorial), Georgia, serif;
  margin:6px 0 26px;
  font-size:clamp(1.12rem,1.3vw,1.38rem);
  line-height:1.34;
}

.famous-quote {
  text-align:center;
  margin-top:100px;
}

.famous-quote p {
  color:#bfccd5;
  font-family:var(--font-editorial), Georgia, serif;
  margin:0;
  font-size:clamp(1.25rem,2vw,1.8rem);
  font-style:italic;
  line-height:1.35;
}

.famous-quote .famous-quote-line2 {
  color:var(--ivory);
  letter-spacing:-.03em;
  margin-top:8px;
  font-size:clamp(2.1rem,4vw,3.6rem);
  font-style:normal;
  font-weight:500;
}

.famous-quote .famous-quote-line2 em {
  color:var(--carmine);
}

.quote-wall footer {
  margin-top:auto;
  color:#9baebb;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:.59rem;
  font-weight:800;
}

.faq {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(118px, 8.5vw, 148px) 0 clamp(132px, 9vw, 164px);
  color: var(--ivory);
  background:
    radial-gradient(64% 48% at 92% 18%, rgba(25, 53, 87, 0.12), transparent 74%),
    linear-gradient(180deg, #040a11 0%, #050c14 52%, #060e19 100%);
}

.faq::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.22;
  background-image:
    linear-gradient(90deg, transparent 0 49.85%, rgba(138, 154, 166, 0.12) 49.9% 50%, transparent 50.05%),
    repeating-linear-gradient(0deg, transparent 0 71px, rgba(234, 240, 243, 0.035) 71px 72px);
}

.faq::after {
  position: absolute;
  z-index: -1;
  inset: auto 0 0;
  height: 34%;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, transparent, #060f1a 100%);
}

.faq-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: clamp(64px, 9vw, 144px);
  align-items: start;
}

.faq h2 {
  margin-top: 36px;
  font-size: var(--type-display-section);
  line-height: 0.88;
}

.faq-heading > .section-number {
  color: #9baebb;
  opacity: 1;
}

.faq-heading > p:last-child {
  max-width: 36ch;
  margin: 34px 0 0;
  color: var(--text-on-dark-muted);
  font-size: var(--type-body);
  line-height: 1.72;
}

.faq-list {
  border-top: 1px solid rgba(138, 154, 166, 0.32);
}

.faq-list details {
  position: relative;
  border-bottom: 1px solid var(--line-dark-soft);
  background: transparent;
  transition: background-color 220ms ease, border-color 220ms ease;
}

.faq-list details[open] {
  border-bottom-color: rgba(199, 157, 81, 0.34);
  background: linear-gradient(90deg, rgba(25, 53, 87, 0.1), rgba(234, 240, 243, 0.02) 64%, transparent);
}

.faq-list details[open]::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  content: "";
  background: var(--carmine);
}

.faq-list summary {
  display: grid;
  min-height: 94px;
  grid-template-columns: 42px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 18px;
  padding: 0 14px 0 10px;
  color: var(--ivory);
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.16rem, 1.55vw, 1.5rem);
  font-weight: 500;
  line-height: 1.3;
  list-style: none;
  cursor: pointer;
  transition: color 180ms ease, background-color 180ms ease;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary:hover {
  background: rgba(234, 240, 243, 0.025);
}

.faq-list summary:focus-visible {
  z-index: 1;
  outline: 2px solid var(--carmine-soft);
  outline-offset: -2px;
  background: rgba(25, 53, 87, 0.08);
}

.faq-list summary > span {
  color: rgba(138, 154, 166, 0.76);
  font-family: var(--font-interface), Arial, sans-serif;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.faq-list summary b {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  justify-self: end;
  border: 1px solid rgba(234, 240, 243, 0.16);
  border-radius: 50%;
  color: var(--carmine-soft);
  font-family: var(--font-interface), Arial, sans-serif;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1;
  transition: rotate 260ms var(--ease-out), border-color 220ms ease, background-color 220ms ease;
}

.faq-list details[open] summary b {
  rotate: 45deg;
  border-color: rgba(199, 157, 81, 0.58);
  background: rgba(25, 53, 87, 0.1);
}

.faq-list details > p {
  max-width: 66ch;
  margin: -2px 52px 34px 70px;
  color: var(--text-on-dark);
  font-size: var(--type-body);
  line-height: 1.76;
}

@media (hover: none) {
  .faq-list summary:hover {
    background: transparent;
  }
}

/* Cierre · «Tu sitio ya existe».
   El carmín se retira del fondo y queda solo en el CTA: el rojo plano
   competía con el botón y aplanaba toda la sección. */
.final-cta {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(112% 78% at 74% 58%, rgba(14, 30, 49, 0.34), transparent 64%),
    radial-gradient(76% 58% at 10% 8%, rgba(18, 38, 63, 0.2), transparent 72%),
    linear-gradient(180deg, #060f1a 0%, #040a11 54%, #050e17 100%);
}

/* Costura superior: hilván dorado que cose el cierre con las FAQ. */
.final-cta::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  pointer-events: none;
  background: repeating-linear-gradient(
    90deg,
    rgba(138, 154, 166, 0.42) 0 14px,
    transparent 14px 30px
  );
}

.final-cta-texture {
  position: absolute;
  right: clamp(1rem, 2.4vw, 2.6rem);
  bottom: 5%;
  z-index: 0;
  color: #8297a8;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(3.2rem, 5vw, 5.6rem);
  font-weight: 500;
  line-height: 0.8;
  letter-spacing: 0.06em;
  text-align: right;
  pointer-events: none;
}

.fc-thread {
  display: none;
}

/* Orden DOM = orden móvil (copy → foto → beneficios → CTA).
   El escritorio recoloca la foto a la primera columna sin duplicar nada. */
.final-cta-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: min(100% - 44px, 1440px);
  margin-inline: auto;
  padding-block: clamp(72px, 9vw, 112px);
}

.final-cta .eyebrow {
  color: var(--gold-quiet);
}

.final-cta-inner > p.cta-whisper {
  margin: 12px 0 22px;
  color: #f4f3ec;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.3rem, 2vw, 1.75rem);
  font-style: italic;
  line-height: 1.1;
}

.final-cta h2 {
  max-width: 13ch;
  font-size: clamp(2.9rem, 4.7vw, 4.6rem);
  line-height: 0.94;
  color: var(--ivory);
}

/* La segunda frase baja de escala: es la coda del titular, no un segundo
   titular. Sin esto el bloque ocupa cuatro líneas y domina el viewport. */
.fc-title-coda {
  display: block;
  max-width: 20ch;
  margin-top: 0.34em;
  font-size: 0.58em;
  line-height: 1.06;
}

.final-cta h2 em {
  color: #f4f3ec;
  font-style: italic;
}

.fc-scene {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: clamp(30px, 5vw, 44px) 0 0;
  border-radius: 18px;
  aspect-ratio: 5 / 4;
}

.fc-scene img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 36% 58%;
}

/* Fundido hacia carbón: en móvil por los cuatro bordes, en escritorio
   solo por la derecha para que la foto entregue la mirada al copy. */
.fc-scene::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(4, 10, 17, 0.5), transparent 22%, transparent 74%, rgba(4, 10, 17, 0.62)),
    linear-gradient(90deg, rgba(4, 10, 17, 0.42), transparent 20%, transparent 82%, rgba(4, 10, 17, 0.55));
}

.benefit-list {
  display: grid;
  gap: 0;
  width: 100%;
  max-width: 34rem;
  margin: clamp(28px, 4vw, 40px) 0 clamp(28px, 4vw, 38px);
  padding: 0;
  list-style: none;
  text-align: left;
}

.benefit-list li {
  position: relative;
  padding: 15px 0 15px 44px;
  border-top: 1px solid rgba(234, 240, 243, 0.11);
  color: #f4f3ec;
  font-size: 1.0625rem;
  line-height: 1.5;
}

.benefit-list li:last-child {
  border-bottom: 1px solid rgba(234, 240, 243, 0.11);
}

/* Rombo de costura + hilván vertical: marcador de atelier, no check de SaaS. */
.benefit-list li::before {
  content: "";
  position: absolute;
  top: 21px;
  left: 3px;
  width: 7px;
  height: 7px;
  background: var(--gold-quiet);
  rotate: 45deg;
}

.benefit-list li::after {
  content: "";
  position: absolute;
  top: 15px;
  bottom: 15px;
  left: 26px;
  width: 1px;
  background: rgba(138, 154, 166, 0.34);
}

.final-cta-inner > p.cta-push {
  max-width: 30ch;
  margin: clamp(26px, 3.4vw, 34px) 0 0;
  color: #bfccd5;
  font-family: var(--font-editorial), Georgia, serif;
  font-size: clamp(1.2rem, 1.8vw, 1.6rem);
  font-style: italic;
  line-height: 1.35;
}

.final-cta-inner > p.cta-push strong {
  display: block;
  color: var(--ivory);
  font-style: normal;
  font-weight: 500;
}

.final-cta-inner > small {
  margin-top: clamp(20px, 2.6vw, 28px);
  color: #bfccd5;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  line-height: 1.6;
  text-transform: uppercase;
}

/* Tablet: a 768 px un recorte 5/4 daría casi 580 px de foto y se comería
   la sección antes de llegar a los beneficios. */
@media (min-width: 620px) and (max-width: 899px) {
  .fc-scene {
    aspect-ratio: 16 / 9;
  }
}

@media (min-width: 900px) {
  .final-cta-inner {
    display: grid;
    /* calle central: aloja el hilo sin que roce el copy */
    grid-template-columns: minmax(0, 42%) clamp(2.4rem, 5vw, 6rem) minmax(0, 1fr);
    /* Filas explícitas — una por bloque de copy — para que `grid-row: 1 / -1`
       de la foto tenga una última línea real a la que agarrarse. */
    grid-template-rows: repeat(7, auto);
    width: 100%;
    padding-block: 0;
    padding-right: clamp(2rem, 5.5vw, 6rem);
  }

  /* El escenario ocupa todas las filas: sangra arriba y abajo hasta el borde
     de la sección, y el aire vertical lo ponen los márgenes del copy. */
  /* Al abarcar todas las filas, la altura intrínseca de la foto se repartiría
     entre ellas y abriría huecos enormes en el copy. La imagen se saca del
     flujo para que el escenario no aporte altura y solo se estire. */
  .fc-scene {
    grid-column: 1;
    grid-row: 1 / -1;
    /* el `align-items: flex-start` del layout móvil impediría el estirado */
    align-self: stretch;
    margin: 0;
    border-radius: 0;
    aspect-ratio: auto;
    min-height: 0;
  }

  .fc-scene img {
    position: absolute;
    inset: 0;
    object-position: 34% 56%;
  }

  .fc-scene::after {
    background: linear-gradient(
      90deg,
      rgba(4, 10, 17, 0.3),
      transparent 26%,
      transparent 52%,
      rgba(4, 10, 17, 0.86) 88%,
      #040a11
    );
  }

  .final-cta-inner > :not(.fc-scene) {
    grid-column: 3;
  }

  /* En grid los hijos se estiran: el botón debe conservar su ancho propio. */
  .final-cta-inner > .primary-cta {
    justify-self: start;
  }

  .final-cta-inner > .eyebrow {
    margin-top: clamp(84px, 8.5vw, 128px);
  }

  .final-cta-inner > small {
    margin-bottom: clamp(84px, 8.5vw, 128px);
  }

  .fc-thread {
    display: block;
    position: absolute;
    z-index: 1;
    left: 33%;
    width: 11.5%;
    top: 40%;
    height: 32%;
    pointer-events: none;
    opacity: 0.7;
  }
}

.footer {
  border-top:1px solid var(--line-dark);
  background:var(--ink);
  padding:64px 0 28px;
}

.footer-top {
  grid-template-columns:1fr 1fr 1fr;
  align-items:center;
  padding-bottom:52px;
  display:grid;
}

.footer-top>p {
  color:#9baebb;
  text-align:center;
  max-width:330px;
  margin:0 auto;
  font-size:.7rem;
}

.footer-top>a:last-child {
  letter-spacing:.1em;
  text-transform:uppercase;
  justify-self:end;
  font-size:.61rem;
  font-weight:800;
}

.footer-bottom {
  border-top:1px solid var(--line-dark);
  color:#9baebb;
  letter-spacing:.06em;
  text-transform:uppercase;
  justify-content:space-between;
  align-items:center;
  padding-top:25px;
  font-size:.58rem;
  font-weight:700;
  display:flex;
}

.footer-bottom nav {
  gap:24px;
  display:flex;
}

.footer-disclaimer {
  letter-spacing:.02em;
  text-align:center;
  text-transform:none;
  max-width:460px;
  margin:0;
  font-weight:500;
}

.sticky-cta {
  z-index:20;
  color:var(--ivory);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  opacity:0;
  pointer-events:none;
  transition:opacity .32s ease, transform .42s var(--ease-out);
  background:#040a11eb;
  border:1px solid #eaf0f326;
  align-items:center;
  gap:26px;
  padding:8px 8px 8px 20px;
  display:flex;
  position:fixed;
  inset:auto 18px 18px auto;
  transform:translateY(24px);
  box-shadow:0 18px 48px #00000047;
}

.sticky-cta.is-visible {
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}

.sticky-cta>div {
  display:grid;
}

.sticky-cta strong {
  font-family:var(--font-editorial), Georgia, serif;
  font-size:1rem;
  font-weight:500;
}

.sticky-cta>div span {
  color:#9baebb;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.52rem;
  font-weight:700;
}

.sticky-cta button {
  --cta-rest-shadow:0 16px 36px -14px #c79d51c2, 0 0 28px -14px #dabf8e9e, inset 0 0 0 1px #eaf0f32e;
  --cta-attention-color:#c79d5138;
  min-height:46px;
  color:var(--ivory);
  background:linear-gradient(105deg, #193456 0%, var(--carmine) 52%, #183151 100%);
  letter-spacing:.07em;
  text-align:center;
  text-transform:uppercase;
  cursor:pointer;
  border:1px solid #eaf0f33d;
  border-radius:6px;
  justify-content:center;
  align-items:center;
  padding:0 22px;
  font-size:.72rem;
  font-weight:800;
  transition:translate .15s ease-out,scale .15s ease-out,background .18s,box-shadow .22s;
  display:inline-flex;
}

.sticky-cta button:hover,.sticky-cta button:focus-visible {
  background:linear-gradient(105deg, #162e4b 0%, var(--carmine-dark) 52%, #132942 100%);
  box-shadow:0 20px 44px -14px #193557d6,0 0 32px -14px #193557b8,inset 0 0 0 1px #eaf0f338;
}

.sticky-cta button:active {
  scale:.985;
}

/* Popup de registro: panel único vino profundo, centrado, sin arte lateral.
   Todo el formulario visible de una vez; el CTA del hero es el único punto
   de máxima intensidad. */
.registration-dialog {
  width:min(94vw,960px);
  max-width:none;
  max-height:calc(100dvh - 32px);
  color:var(--ivory);
  background:0 0;
  border:0;
  padding:0;
  overflow:visible;
  margin:auto;
}

.registration-dialog::backdrop {
  background:rgba(3, 8, 14, 0.82);
}

.dialog-panel {
  position:relative;
  overflow:hidden;
  /* controles nativos (radio, checkbox, inputs) en su variante oscura */
  color-scheme:dark;
  background:linear-gradient(180deg, #091524 0%, #07111e 46%, #081422 100%);
  border:1px solid rgba(138, 154, 166, 0.42);
  border-radius:18px;
  box-shadow:0 40px 110px rgba(0,0,0,.65);
}

.dialog-close {
  z-index:4;
  border:1px solid rgba(234, 240, 243, 0.22);
  width:44px;
  height:44px;
  color:var(--ivory);
  cursor:pointer;
  background:rgba(234, 240, 243, 0.06);
  border-radius:50%;
  place-items:center;
  font-size:1.5rem;
  line-height:1;
  display:grid;
  position:absolute;
  top:16px;
  right:16px;
  transition:background .16s,border-color .16s;
}

.dialog-close:hover {
  background:rgba(234, 240, 243, 0.12);
  border-color:#9baebb;
}

.dialog-close:focus-visible {
  outline:2px solid var(--gold-quiet);
  outline-offset:2px;
}

.dialog-content {
  max-height:calc(100dvh - 34px);
  overflow-y:auto;
  padding:clamp(28px,3.6vw,42px) clamp(24px,6vw,72px) clamp(24px,3vw,34px);
  scrollbar-width:thin;
  scrollbar-color:rgba(138, 154, 166, 0.35) transparent;
}

.dialog-head {
  text-align:center;
  /* el eyebrow no debe correr bajo el botón de cierre */
  padding-inline:34px;
  margin-bottom:clamp(18px,2.2vw,26px);
}

.dialog-head .eyebrow {
  color:#a6b2bb;
  letter-spacing:.22em;
}

.dialog-head h2 {
  font-family:var(--font-editorial), Georgia, serif;
  letter-spacing:-.03em;
  color:var(--ivory);
  margin:14px 0 12px;
  font-size:clamp(2.4rem,3.8vw,3.55rem);
  font-weight:500;
  line-height:.96;
}

.dialog-head p:not(.eyebrow) {
  color:#bfccd5;
  max-width:520px;
  margin:0 auto;
  font-size:.98rem;
  line-height:1.6;
}

.dialog-content form {
  gap:16px;
  display:grid;
}

.dialog-content label {
  gap:7px;
  display:grid;
}

.dialog-content input[type=text],
.dialog-content input[type=email],
.dialog-content input[type=tel] {
  width:100%;
  height:52px;
  color:var(--ivory);
  background:rgba(234, 240, 243, 0.055);
  border:1px solid rgba(138, 154, 166, 0.26);
  border-radius:10px;
  outline:0;
  padding:0 16px;
  font-size:1rem;
  transition:border-color .16s,background .16s;
}

.dialog-content input::placeholder {
  color:#9baebb;
}

.dialog-content input:focus-visible {
  border-color:var(--gold-quiet);
  background:rgba(234, 240, 243, 0.09);
}

.dialog-content input:user-invalid {
  border-color:var(--carmine-soft);
}

.consent {
  color:#bfccd5;
  grid-template-columns:auto 1fr;
  justify-content:center;
  align-items:start;
  gap:11px;
  width:fit-content;
  max-width:100%;
  margin:6px auto 0;
  font-size:.8rem;
  line-height:1.5;
  display:grid;
  cursor:pointer;
}

.consent a {
  color:var(--ivory);
  text-underline-offset:2px;
  text-decoration:underline;
}

.form-submit {
  width:100%;
  margin-top:4px;
}

html[data-reveal-ready] [data-reveal]:not([data-reveal=fill]) {
  opacity:0;
  transition:opacity .85s var(--ease-out), translate .85s var(--ease-out);
  translate:0 28px;
}

html[data-reveal-ready] [data-reveal]:not([data-reveal=fill]).is-inview {
  opacity:1;
  translate:0;
}

html[data-reveal-ready] .stitch-tag:nth-child(2),html[data-reveal-ready] .reasons-grid li:nth-child(3n+2),html[data-reveal-ready] .qualify-card:nth-child(3n+2) {
  transition-delay:.1s;
}

html[data-reveal-ready] .stitch-tag:nth-child(3),html[data-reveal-ready] .reasons-grid li:nth-child(3n),html[data-reveal-ready] .qualify-card:nth-child(3n) {
  transition-delay:.2s;
}

html[data-reveal-ready] .stitch-tag:nth-child(4) {
  transition-delay:.3s;
}

@media (prefers-reduced-motion: no-preference) {
  .hero-intro,.hero h1,.hero-copy,.hero-conversion {
    animation:hero-rise .9s var(--ease-out) both;
  }
  .hero-intro {
    animation-delay:80ms;
  }
  .hero h1 {
    animation-delay:.2s;
  }
  .hero-copy {
    animation-delay:.36s;
  }
  .hero-conversion {
    animation-delay:.48s;
  }
  .hero-index,.scroll-cue {
    animation:hero-fade 1.1s var(--ease-out) .95s both;
  }
}

@keyframes hero-rise {
  0% {
    opacity:0;
    transform:translateY(26px);
  }
  to {
    opacity:1;
    transform:none;
  }
}

@keyframes hero-fade {
  0% {
    opacity:0;
  }
  to {
    opacity:1;
  }
}

@media (width >= 1101px) and (width <= 1280px) {
  .founder-grid {
    grid-template-columns: minmax(0, 0.96fr) minmax(390px, 1.04fr);
    column-gap: 48px;
  }

  .founder-body > p {
    font-size: 1rem;
  }

  .faq-grid {
    grid-template-columns: minmax(250px, 0.68fr) minmax(0, 1.32fr);
    gap: clamp(54px, 6vw, 82px);
  }
}

@media (width<=1100px) {
  :root {
    --shell:min(100% - 42px, 1440px);
  }
  .hero h1 {
    max-width:700px;
    font-size:clamp(3.65rem,7vw,5.2rem);
  }
  .authority-heading,.testimonials-heading {
    grid-template-columns:.5fr 2fr 1fr;
  }
  .editorial-main {
    grid-column:1/span 7;
  }
  .editorial-dubai {
    grid-column:8/span 5;
  }
  .editorial-backstage {
    grid-area:2/8/auto/span 5;
  }
  .editorial-award {
    grid-area:3/1/auto/span 12;
  }
  .founder-grid {
    grid-template-columns: 50% minmax(0, 1fr);
    column-gap: 42px;
  }
  .founder-seal {
    display: none;
  }
}

@media (width>=768px) and (width<=900px) {
  .announcement-inner {
    gap:12px;
  }
  .event-countdown {
    gap:0;
    padding-inline:10px;
  }
  .countdown-kicker {
    display:none;
  }
  .announcement-static {
    letter-spacing:.06em;
    gap:12px;
    font-size:.58rem;
  }
  .announcement-static .as-item--time small {
    display:none;
  }
  .announcement button {
    padding-inline:14px;
    font-size:.62rem;
  }
}

@media (width<=767px) {
  .announcement-inner {
    grid-template-columns:minmax(0,1fr) auto;
    gap:6px;
  }
  .event-countdown--topbar {
    display:none;
  }
  .event-countdown--hero {
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);
    background:linear-gradient(90deg,#0c1e34ad,#19355738),#040a11c7;
    border-color:#8297a8;
    border-radius:6px;
    justify-content:space-between;
    gap:10px;
    width:100%;
    min-height:40px;
    margin-bottom:9px;
    padding-inline:12px;
    display:flex;
    box-shadow:inset 0 0 0 1px #eaf0f30b,0 12px 30px #0003,0 0 26px -18px #193557cc;
  }
  .countdown-kicker {
    display:none;
  }
  .event-countdown--hero .countdown-kicker {
    color:#bfccd5;
    letter-spacing:.095em;
    font-size:.47rem;
    display:inline;
  }
  .countdown-digits {
    gap:2px;
  }
  .event-countdown--hero .countdown-digits {
    gap:4px;
  }
  .countdown-digits>i {
    font-size:.42rem;
  }
  .countdown-unit {
    gap:1px;
  }
  .countdown-unit strong {
    font-size:.56rem;
  }
  .event-countdown--hero .countdown-unit strong {
    font-size:.66rem;
  }
  .countdown-unit small {
    font-size:.34rem;
  }
  .event-countdown--hero .countdown-unit small {
    font-size:.38rem;
  }
  :root {
    --shell:calc(100% - 32px);
    --eventbar-height:48px;
  }
  html {
    scroll-padding-top:calc(var(--eventbar-height) + env(safe-area-inset-top));
  }
  .announcement-inner {
    grid-template-columns:minmax(0,1fr) auto;
    gap:6px;
  }
  .announcement-static {
    letter-spacing:.035em;
    justify-content:flex-start;
    gap:9px;
    font-size:.55rem;
    overflow:hidden;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 14px),#0000);
    mask-image:linear-gradient(90deg,#000 calc(100% - 14px),#0000);
  }
  .announcement-static .as-item--date,.announcement-static .as-item--time,.announcement-static>i,.announcement-static .as-badge {
    display:none;
  }
  .announcement button {
    letter-spacing:.03em;
    grid-column:2;
    min-height:36px;
    padding:0 10px;
    font-size:.6rem;
  }
  .nav {
    min-height:70px;
  }
  .wordmark span {
    font-size:.92rem;
  }
  .wordmark small {
    width:25px;
    height:25px;
    font-size:.4rem;
  }
  .hero {
    min-height:max(720px, calc(100svh - var(--eventbar-height) - env(safe-area-inset-top)));
  }
  .hero-media img {
    object-position:46% center;
  }
  .hero-shade {
    background:linear-gradient(#03080ef2 0%,#03080eb3 35%,#03080e0f 58%,#03080ef0 83%,#03080efa 100%),linear-gradient(90deg,#03080ea6 0%,#0000 82%);
  }
  .hero-content {
    min-height:max(720px, calc(100svh - var(--eventbar-height) - env(safe-area-inset-top)));
    justify-content:flex-start;
    padding-top:101px;
    padding-bottom:214px;
  }
  .hero-intro {
    gap:8px;
    margin-bottom:17px;
    display:grid;
  }
  .hero-eyebrow {
    gap:6px;
    font-size:.55rem;
  }
  .hero-preheadline {
    letter-spacing:.12em;
    margin-top:8px;
    padding-bottom:12px;
    font-size:.86rem;
  }
  .hero-preheadline:after {
    width:56px;
  }
  .hero h1 {
    max-width:100%;
    font-size:clamp(2.15rem,9.7vw,2.75rem);
    line-height:.98;
  }
  .hero-copy {
    /* Era .84rem ≈ 13,4 px: el párrafo que explica la clase quedaba por
       debajo del cuerpo del resto de la página. */
    max-width:340px;
    margin-top:18px;
    font-size:1rem;
    line-height:1.55;
  }
  .hero-conversion {
    width:auto;
    margin:0;
    position:absolute;
    inset:auto 16px 10px;
  }
  .primary-cta {
    width:100%;
    min-width:0;
    min-height:56px;
  }
  .hero-event-details {
    /* Eran .49rem ≈ 7,8 px (19-09-2026). Gratuito, fecha, hora y «en directo»
       no son adorno: son los cuatro datos con los que se decide asistir. A ese
       cuerpo no se leen. Se permite que envuelvan en dos filas antes que
       encogerlos más. */
    letter-spacing:.02em;
    justify-content:center;
    flex-wrap:wrap;
    row-gap:4px;
    margin-top:12px;
    font-size:.78rem;
  }
  .hero-event-details span:not(:last-child):after {
    margin-inline:7px;
  }
  .hero-event-details svg {
    display:none;
  }
  .hero-note {
    font-size:.62rem;
  }
  .hero-index,.scroll-cue {
    display:none;
  }
  .authority,.identity,.whynow,.agenda,.audience,.founder,.testimonials,.faq {
    padding-block:86px;
  }
  .authority-heading,.identity-head,.whynow-head,.agenda-head,.audience-heading,.founder-grid,.testimonials-heading,.faq-grid {
    grid-template-columns:1fr;
    gap:35px;
  }
  .authority h2,.audience-heading h2,.founder h2,.testimonials h2,.faq h2 {
    font-size:clamp(3.05rem,15vw,4.15rem);
    line-height:.91;
  }
  .whynow h2,.agenda h2 {
    font-size:clamp(2.05rem,9.4vw,2.7rem);
    line-height:1.06;
  }
          .whynow-number {
    margin-bottom: 18px;
  }
  .whynow-head {
    gap: 44px;
  }
  .market-concept {
    min-height: 34rem;
  }
  .mc-copy {
    width: auto;
    max-width: 30rem;
    padding: 1.5rem;
  }
  .mc-collage {
    right: -0.6rem;
    bottom: 1.4rem;
    width: min(64%, 22rem);
  }
  .mc-traditional {
    bottom: 3.2rem;
    left: 1rem;
    width: min(42vw, 11.5rem);
    min-height: 7.6rem;
  }
  .mc-plaque b {
    font-size: 0.68rem;
    letter-spacing: 0.06em;
  }
  .mc-emerging {
    right: 0.6rem;
    bottom: 3.7rem;
    width: min(42%, 11.5rem);
    padding: 0.7rem 0.55rem 0.65rem;
  }
  .mc-emerging b {
    font-size: 0.66rem;
    letter-spacing: 0.035em;
  }
  .mc-plaque i,
  .mc-emerging i {
    padding-top: 6px;
    font-size: 0.55rem;
  }
.mc-note {
    right: 1rem;
    left: 1rem;
    font-size: 0.55rem;
  }
  .reassure-band {
    padding: 72px 0 84px;
  }
  .reassure-ornament {
    margin-top: 26px;
  }
  .midcta-wrap {
    margin-top: 34px;
  }
  .midcta {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 28px 22px 26px;
    text-align: center;
  }
  .midcta-monogram {
    width: 58px;
    justify-self: center;
  }
  .midcta-line {
    text-align: center;
  }
  .midcta .primary-cta {
    width: 100%;
    padding-inline: 14px;
    font-size: 0.78rem;
    letter-spacing: 0.05em;
  }
  .midcta-meta {
    grid-column: 1;
    text-align: center;
  }
  .authority-intro,.testimonials-heading>p:last-child {
    max-width:100%;
  }
  .editorial-grid {
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    gap:12px;
    width:calc(100% - 16px);
    margin-top:55px;
    margin-left:16px;
    margin-right:0;
    padding-right:16px;
    display:flex;
    overflow-x:auto;
  }
  .editorial-grid::-webkit-scrollbar {
    display:none;
  }
  .editorial-grid figure {
    scroll-snap-align:center;
    min-width:82vw;
    min-height:560px;
  }
  .editorial-award {
    grid-template-rows:.8fr 1fr;
    grid-template-columns:1fr!important;
    min-width:88vw!important;
    display:grid!important;
  }
  .editorial-award .award-card {
    padding:30px;
  }
  .editorial-award img {
    min-height:0;
  }
  .problem {
    padding: 86px 0 92px;
  }
  .problem-grid {
    grid-template-columns: 1fr;
    gap: 56px;
  }
  /* README: ocultar la tela lateral en móvil; el pliegue usa su variante */
  .problem-drape {
    display: none;
  }
  .problem h2 {
    max-width: 100%;
    font-size: clamp(2.05rem, 9.4vw, 2.7rem);
  }
  .problem-thread,
  .problem-pattern {
    display: none;
  }
  .stitch-tags {
    gap: 18px;
  }
  .stitch-tag {
    width: min(100%, 324px);
    padding: 26px 30px 20px;
  }
  .stitch-tag p {
    font-size: 1.04rem;
  }
  .stitch-tag:nth-child(2) {
    margin-top: 0;
  }
  .stitch-tag:nth-child(3) {
    margin: 0;
  }
  .stitch-tag:nth-child(4) {
    margin: 0;
  }
  .tag-selvage {
    left: -9px;
    width: 12px;
  }
  .identity {
    padding-block: 86px 96px;
  }
  .identity-head {
    text-align: left;
  }
  .identity-head > div {
    text-align: left;
  }
  .identity-head > .section-number::after {
    display: none;
  }
  .big-word-stage {
    margin-top: 26px;
  }
  .big-word {
    margin-top:0;
    font-size:clamp(2.9rem,13.5vw,4.6rem);
  }
  .identity-thread {
    height: 46px;
    bottom: -8px;
  }
  .identity-thread-node {
    width: 9px;
    height: 9px;
  }
  .identity-lede {
    text-align:center;
    margin-top:42px;
  }
  .groups {
    grid-template-columns:1fr;
    gap: 20px;
    margin-top:42px;
  }
  .group {
    padding:34px 26px 32px;
  }
  .group-seam-img {
    top: 10px;
    bottom: 10px;
    left: 8px;
    width: 52px;
  }
  .groups-seam,
  .identity-drape {
    display: none;
  }
  .group-form {
    right: -18px;
    width: 122px;
    opacity: 0.7;
  }
  .group-adn > p:not(.group-tag),
  .group-adn footer {
    max-width: 100%;
  }
  .identity-hem {
    bottom: 30px;
  }
  .reasons-grid {
    grid-template-columns:1fr;
    margin-top:56px;
  }
  .reasons-grid li {
    padding:28px 22px 32px;
  }
  .democ {
    text-align:left;
    margin-top:60px;
  }
  .agenda {
    padding-bottom:64px;
  }
  .agenda-sub {
    margin-top:0;
  }
  .agenda-seam {
    margin-top:44px;
  }
  /* En una columna los nodos se amontonan: queda solo el hilván. */
  .seam-node {
    display:none;
  }
  .timeline {
    grid-template-columns:1fr;
  }
  .moment {
    padding:34px 0 38px;
  }
  .moment + .moment {
    border-left:0;
    border-top:1px solid rgba(138, 154, 166, 0.2);
  }
  .moment-ghost {
    font-size:3.4rem;
    margin-bottom:14px;
  }
  /* El filtro ya define aquí su composición móvil; se mantiene a sangre. */
  .audience {
    padding-bottom: 0;
  }
  .famous-quote {
    margin-top:64px;
  }
  .benefit-list {
    max-width:100%;
  }
  .founder {
    padding: 92px 0 104px;
  }
  .founder h2 {
    font-size: clamp(3.15rem, 14vw, 4.5rem);
  }
  /* orden móvil de la spec: cabecera, foto, cuerpo */
  .founder-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    row-gap: 34px;
  }
  .founder-head {
    grid-column: 1;
    grid-row: 1;
  }
  .founder-image {
    grid-column: 1;
    grid-row: 2;
    width: auto;
    margin: 0;
  }
  .founder-body {
    grid-column: 1;
    grid-row: 3;
    padding-top: 0;
  }
  .founder-eyebrow {
    flex-wrap: wrap;
    gap: 10px 14px;
  }
  .founder-eyebrow > i {
    display: none;
  }
  .founder-image::before,
  .founder-image::after {
    display: none;
  }
  .founder-plate {
    padding: 11px 11px 9px;
    rotate: 0deg;
  }
  /* el marco se mantiene 1/1: con zoom 165% un 4/5 dejaría la base sin cubrir */
  .founder-body .founder-lead {
    padding-left: 18px;
    max-width: 100%;
  }
  .founder-body .founder-close {
    padding-left: 0;
  }
  .founder-body .founder-close::before {
    display: none;
  }
  .founder-stamp {
    display: grid;
    gap: 10px;
    justify-items: start;
  }
  .founder-stamp > i {
    display: none;
  }
  .founder-stamp span:last-child {
    margin-left: 0;
  }
  .school-strip {
    grid-template-columns:1fr;
    margin-top:85px;
  }
  .school-strip img {
    min-height:310px;
  }
  .school-strip p {
    padding:36px 28px;
  }
  /* Carril editorial deslizable: la tarjeta activa queda alineada al gutter
     izquierdo y la siguiente asoma por la derecha como invitación al gesto.
     Sin scrollbar visible, pero con scroll funcional e inercia nativa. */
  .video-grid {
    align-items:center;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    gap:14px;
    width:calc(100% - 16px);
    margin-top:55px;
    margin-left:16px;
    margin-right:0;
    padding-right:16px;
    display:flex;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .video-grid::-webkit-scrollbar {
    display:none;
  }
  .video-story {
    scroll-snap-align:start;
    width:min(66vw, 300px);
    min-width:min(66vw, 300px);
  }
  .video-story>div {
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    gap:6px;
  }
  /* en móvil las decoraciones estorban a la lectura: fuera */
  .quote-swatch,
  .quote-label,
  .tst-pattern {
    display: none;
  }
  .quote-band {
    margin-top: 48px;
  }
  /* Mismo carril deslizable que las historias en vídeo: cada testimonio se
     enmarca como panel editorial (filete a ambos lados) y la comilla del
     siguiente asoma como reclamo del gesto. */
  .quote-wall {
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    gap:14px;
    width:calc(100% - 16px);
    margin-top:0;
    margin-left:16px;
    margin-right:0;
    padding-inline: 0 16px;
    display:flex;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .quote-wall::-webkit-scrollbar {
    display:none;
  }
  .quote-wall blockquote {
    scroll-snap-align:start;
    min-width:min(78vw, 440px);
    min-height:280px;
    border-right:1px solid var(--line-dark);
    padding:34px 28px 30px;
  }
  .faq {
    padding-block: 92px 120px;
  }
  .faq-grid {
    grid-template-columns: 1fr;
    gap: 58px;
  }
  .faq h2 {
    margin-top: 24px;
    font-size: clamp(3.15rem, 13.8vw, 4.5rem);
  }
  .faq-heading > p:last-child {
    max-width: 40ch;
  }
  .faq-list summary {
    grid-template-columns: 30px minmax(0, 1fr) 32px;
    gap: 12px;
    min-height: 84px;
    padding-inline: 8px;
    font-size: 1.14rem;
  }
  .faq-list summary b {
    width: 30px;
    height: 30px;
  }
  .faq-list details > p {
    margin: -2px 12px 30px 50px;
    font-size: 0.98rem;
  }
  .final-cta-inner {
    width: min(100% - 44px, 1440px);
  }
  .final-cta h2 {
    max-width: none;
    font-size: clamp(2.6rem, 10.4vw, 3.6rem);
    line-height: 0.98;
  }
  .footer {
    padding-top:52px;
  }
  .footer-top {
    grid-template-columns:1fr;
    justify-items:start;
    gap:30px;
    display:grid;
  }
  .footer-top>p {
    text-align:left;
    margin:0;
  }
  .footer-top>a:last-child {
    justify-self:start;
  }
  .footer-bottom {
    gap:20px;
    display:grid;
  }
  .footer-bottom nav {
    flex-wrap:wrap;
    gap:14px 22px;
  }
  .sticky-cta {
    inset:auto 8px calc(8px + env(safe-area-inset-bottom)) 8px;
    justify-content:stretch;
    gap:8px;
    padding:7px;
  }
  .sticky-cta>div {
    display:none;
  }
  .sticky-cta button {
    width:100%;
    min-height:50px;
  }
  .registration-dialog {
    width:calc(100% - 24px);
    max-height:calc(100dvh - 16px);
  }
  .dialog-panel {
    border-radius:14px;
  }
  .dialog-content {
    max-height:calc(100dvh - 18px);
    padding:52px 20px calc(24px + env(safe-area-inset-bottom));
  }
  .dialog-head h2 {
    font-size:2.35rem;
  }
  .dialog-head p:not(.eyebrow) {
    font-size:1.0625rem;
  }
  .consent {
    font-size:.92rem;
  }
  .dialog-close {
    top:10px;
    right:10px;
  }
}

@media (width<=380px) {
  .event-countdown--hero {
    gap:6px;
    min-height:38px;
    margin-bottom:7px;
    padding-inline:9px;
  }
  .event-countdown--hero .countdown-kicker {
    white-space:normal;
    max-width:82px;
    font-size:.43rem;
    line-height:1.15;
  }
  .announcement-inner.shell {
    width:calc(100% - 16px);
  }
  .hero h1 {
    /* Era 2.58rem ≈ 41,3 px, MÁS grande que los 37,8 px que da el clamp a
       390 px: el titular crecía al estrecharse la pantalla. Se continúa la
       curva en vez de romperla. */
    font-size:clamp(2rem,9.4vw,2.35rem);
  }
  .hero-copy {
    font-size:.8rem;
  }
  .announcement-static {
    font-size:.52rem;
  }
  .announcement button {
    letter-spacing:.02em;
    padding-inline:8px;
    font-size:.58rem;
  }
  .hero .primary-cta {
    letter-spacing:.06em;
    padding:0 20px;
    font-size:.82rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,:before,:after {
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
  .announcement button {
    animation:none!important;
  }
  [data-wow-cta] {
    animation:none!important;
    translate:0!important;
    scale:1!important;
  }
  [data-wow-cta]:before,[data-wow-cta]:after {
    display:none!important;
  }
}


/* Tramo intermedio: a dos columnas el panel conceptual baja de su ancho útil
   (~440px) y las placas se solapan. Se apila hasta recuperar espacio real. */
@media (min-width: 768px) and (max-width: 1039px) {
  .whynow-head {
    grid-template-columns: 1fr;
    gap: 44px;
  }

  .whynow h2,
  .whynow-intro {
    max-width: 100%;
  }

  .market-concept {
    min-height: 32rem;
  }

}

/* README: en tablet la tela lateral se reduce y baja de opacidad */
@media (min-width: 768px) and (max-width: 1199px) {
  .problem-drape {
    width: clamp(180px, 22vw, 280px);
    left: -60px;
    opacity: 0.55;
  }
}