/* ═══════════════════════════════════════════════════════════════
   vertical.css — B3 owns this file.
   Cola vertical: las 6 secciones beige que siguen al pin horizontal.
   SPEC §6 · r4 §4.10 + §6.6 · r2 §7 (mod-title / mod-media / mod-content / mod-footer)
   Desktop-first: NINGUNA media query ≤950 aquí (las escribe B4 en mobile.css).
   px→rem = ÷15 (1rem = 15px @1440).
   ═══════════════════════════════════════════════════════════════ */

/* ── Rejilla local de 12 columnas (misma fórmula que r2 §4).
      Se expresa en vw para sobrevivir al re-base de rem del breakpoint 1024. ── */
/* shared by every vertical section: their absolutely-positioned children
   (footer letterforms, cards, parallax figures) anchor to their own section. */
.v-search,
.v-team,
.v-concierge,
.v-center,
.v-footer {
  position: relative;
}

:root {
  --v-col:  calc((99.9vw - var(--inset) * 2 - var(--grid-gap) * 11) / 12); /* 95.13px @1440 */
  --v-col6: calc(var(--v-col) * 6 + var(--grid-gap) * 5);                  /* 683.28px @1440 */
  --v-col4: calc(var(--v-col) * 4 + var(--grid-gap) * 3);                  /* 448.02px @1440 */
}

/* ═══════════════════════════════════════════════════════════════
   0 · v-hero — landing: the gold emblem opens the house (client ask:
   logo first, team + search up front, the story after). Full-viewport,
   white ground so the logo plate melts in via multiply. The chrome
   lockup stays in its big hero state here; compact engages when the
   visitor leaves this section (core.js IntersectionObserver).
   ═══════════════════════════════════════════════════════════════ */
.v-hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.2rem;
  padding: var(--inset);
  text-align: center;
}
/* ── the logo rebuilt CENTER-STAGE (client final): crown-and-key art, FIRM,
      LUXURY REALTY stacked in the middle of the section. Cinzel = the
      logo's engraved lettering (brand artwork only), gold-graded like the
      source art. Key always CLEAR of the letters. ── */
.v-hero__lockup {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.v-hero__key {
  width: 16rem;
  max-width: 46vw;
  height: auto;
}
.v-hero__word {
  font-family: "Cinzel", "Fraunces", serif;
  font-weight: 600;
  font-size: 4.6rem;
  line-height: 1;
  letter-spacing: .14em;
  margin-right: -.14em;                   /* optical center vs the tracking */
  margin-top: .4rem;                      /* clear of the key — no overlap */
  background: linear-gradient(180deg, #EAC96E 0%, #C6A24B 48%, #8E6B23 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.v-hero__word-sub {
  display: flex;
  align-items: center;
  margin-top: .65rem;
  font-family: "Cinzel", "Fraunces", serif;
  font-weight: 400;
  font-size: 1.35rem;
  line-height: 1.2;
  letter-spacing: .42em;
  text-transform: uppercase;
  background: linear-gradient(180deg, #E2BE62 0%, #A8853B 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
/* the logo's flanking hairlines, both sides */
.v-hero__word-sub::before,
.v-hero__word-sub::after {
  content: "";
  width: 4.2rem;
  height: 1px;
  flex: none;
}
.v-hero__word-sub::before { background: linear-gradient(90deg, transparent, #C6A24B); margin-right: 1rem; }
.v-hero__word-sub::after  { background: linear-gradient(90deg, #C6A24B, transparent); margin-left: calc(1rem + .42em); }
.v-hero__tag {
  font-family: var(--f-izmir);
  font-weight: 400;
  font-size: var(--t-subtitulo);
  line-height: var(--t-subtitulo-lh);
  letter-spacing: .42em;
  text-transform: uppercase;
  color: var(--grey);
}
.v-hero__sub {
  max-width: 34rem;
  font-family: var(--f-izmir);
  font-weight: 300;
  font-size: var(--t-parrafo);
  line-height: 1.7;
  color: var(--grey);
}
.v-hero__ctas {
  display: flex;
  align-items: center;
  gap: 1.8rem;
  margin-top: .4rem;
}
.v-hero__alt {
  font-family: var(--f-edit);
  font-size: var(--t-parrafo-l);
  font-variation-settings: "opsz" 96;
}
.v-hero__cue {
  position: absolute;
  bottom: 1.65rem;
  left: 50%;
  margin-left: -1.5rem;
  width: 3rem;
  font-family: var(--f-edit);
  font-size: var(--t-parrafo);
  color: var(--grey);
  animation: v-hero-cue 2.6s ease-in-out infinite;
}
@keyframes v-hero-cue {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(.55rem); }
}
@media (prefers-reduced-motion: reduce) {
  .v-hero__cue { animation: none; }
}


/* r2 §7: .mod-title__intro → columna centrada, margin-bottom 4.5rem (67.5px) */


/* r2 §7: line-height 1.225 + márgenes negativos que lo cancelan.
   Copiar el par o las máscaras recortan los descendentes. Caja de línea 220.5px. */

/* la máscara real vive en cada .char (core); el span interior es el que sube */

/* ═══════════════════════════════════════════════════════════════
   2 · v-media-double — col-6 + col-4 alineadas arriba, parallax en Y
   r4 §4.10 + medidas: 1440 × 834, padding 0 / 24.75 / 24; items 683.3 y 448 × 810
   ═══════════════════════════════════════════════════════════════ */
.v-media-double {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: var(--grid-gap);                    /* 22.5px (r2 §7 --double) */
  padding: 0 var(--inset) 3.8rem;          /* bottom grown from 1.6rem: room for the caption row */
}

.v-media-double .vmd__img {
  position: relative;
  flex: 0 0 auto;
  overflow: hidden;
}
/* col-6: retrato con aspect-ratio 1152/2048 topado por max-height 90vh → 810px @900 */
.v-media-double .vmd__img--a {
  width: var(--v-col6);
  aspect-ratio: 1152 / 2048;
  max-height: 90vh;
}
/* col-4: la .media__wrap-source genérica es 16/9 → 448 × 252 (medición: img 289.8 = 252 × 1.15) */
.v-media-double .vmd__img--b {
  width: var(--v-col4);
  aspect-ratio: 16 / 9;
}

/* Imagen sobredimensionada al 115 % y centrada: el recorrido total del parallax
   (15 % de la caja) nunca llega a enseñar un borde. r1 §7 (.media__source). */
.v-media-double .vmd__img img {
  position: absolute;
  left: 0;
  top: -7.5%;
  width: 100%;
  height: 115%;
  object-fit: cover;
  will-change: transform;
}

/* Figure A carries a figcaption that must sit BELOW its overflow-hidden box.
   CSS-only restructure: the figure goes static (so the absolutely positioned
   caption resolves against .v-media-double and escapes the overflow clip)
   and the img holds the same 115%/-7.5% overscan in-flow via position:relative
   (top % still resolves against the figure's definite ratio-derived height). */
.v-media-double .vmd__img--a { position: static; }
.v-media-double .vmd__img--a img {
  position: relative;
  display: block;
  /* browser-tuned face framing: full-length duo photo, faces at ~1/4 height —
     default 50% center crops the heads off in this box (client flagged it) */
  object-position: 50% 22%;
}
.v-media-double .vmd__img--b img {
  object-position: 50% 10%;   /* hug portrait: faces in the top band */
}

/* Caption row: small Bodoni italic, warm grey, parked in the section's grown
   bottom padding — visually a margin-top under the big image. */
.vmd__caption {
  position: absolute;
  left: var(--inset);
  bottom: 1.1rem;
  width: var(--v-col6);
  font-family: var(--f-edit-italic);
  font-style: italic;
  font-weight: 400;
  font-size: var(--t-parrafo-l);           /* 15px */
  line-height: var(--t-parrafo-l-lh);      /* 21px */
  color: var(--grey);
  text-align: left;
  font-variation-settings: "opsz" 96;
}

/* ═══════════════════════════════════════════════════════════════
   2b · v-team — #team: pretitle + masked 2-line title, broker feature,
   full-width roster band, placeholder agent grid.
   Rhythm mirrors the siblings: 135 top / 117 bottom (9rem / 7.8rem).
   ═══════════════════════════════════════════════════════════════ */
.v-team {
  padding: var(--pad-section) var(--inset) 7.8rem;   /* 135 / 24.75 / 117 */
  text-align: center;
}

/* shared pretitle voice for the two new sections: Bodoni, gold accent */
.v-team__pretitle,
.v-search__pretitle {
  font-family: var(--f-edit);
  font-weight: 400;
  font-size: var(--t-titulo);          /* 24.75px */
  line-height: var(--t-titulo-lh);     /* 33px */
  color: var(--red);                   /* gold #C6A24B — accent text only */
  font-variation-settings: "opsz" 96;
}
.v-team__pretitle { margin-bottom: 4.5rem; }         
.v-team__title {
  font-family: var(--f-regular);
  font-weight: 300;
  font-size: var(--t-supertitulo-l);       /* 142.5px */
  line-height: var(--t-supertitulo-l-lh);
  letter-spacing: var(--ls-display);
  text-transform: uppercase;
  font-variation-settings: "opsz" 144;
}

/.v-team .char { vertical-align: top; }

/* ── broker feature: portrait col-6 + info col-6, vertically centered ── */
.v-team__broker {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: var(--grid-gap);
  margin-top: 6rem;                        /* 90px below the title */
  text-align: left;
}

/* portrait carries the same 115%/-7.5% overscan pattern for parallax headroom */
.v-team__portrait {
  position: relative;
  flex: 0 0 auto;
  width: var(--v-col6);
  aspect-ratio: 3 / 4;
  max-height: 85vh;
  overflow: hidden;
}
.v-team__portrait img {
  position: absolute;
  left: 0;
  top: -7.5%;
  width: 100%;
  height: 115%;
  object-fit: cover;
  will-change: transform;
}

.v-team__broker-info { width: var(--v-col6); flex: 0 0 auto; }

/* logo png has an opaque light ground → multiply melts it into the champagne */
.v-team__logo {
  display: block;
  height: 10rem;                           /* 150px */
  width: auto;
  mix-blend-mode: multiply;
  margin-bottom: 2rem;
}

.v-team__broker-name {
  font-family: var(--f-medium);
  font-weight: 500;
  font-size: var(--t-titulo-l);            /* 33.75px */
  line-height: var(--t-titulo-l-lh);       /* 40.5px */
  margin-bottom: .6rem;
  font-variation-settings: "opsz" 144;
  overflow: hidden;                        /* .clip-y — mask for the char rise */
}
.v-team__broker-name .char { vertical-align: top; }

.v-team__broker-role {
  /* Archivo, NOT serif: the license number must read unambiguously
     (serif oldstyle figures made the 4 unreadable — client flagged) */
  font-family: var(--f-izmir);
  font-weight: 500;
  font-size: var(--t-parrafo-l);           /* 15px */
  line-height: var(--t-parrafo-l-lh);
  text-transform: uppercase;
  letter-spacing: .06em;
  letter-spacing: .08em;
  /* deep gold, not token gold: this line carries the broker license
     (BK# 3443361) — compliance text needs contrast on champagne */
  color: #8E6B23;
  margin-bottom: 1.6rem;
  font-variation-settings: "opsz" 96;
}

.v-team__broker-blurb {
  font-family: var(--f-izmir);
  font-weight: 400;
  font-size: var(--t-titulo);              /* 24.75px */
  line-height: var(--t-titulo-lh);         /* 33px */
  max-width: 24em;
  margin-bottom: 2.4rem;
}

/* ── full-width band: the roster's hero moment, same overscan pattern ── */
.v-team__band {
  position: relative;
  width: 100%;
  height: auto;                            /* full photo, whole team visible — never crop faces */
  margin-top: 7.8rem;                      /* 117px */
  overflow: hidden;
}
.v-team__band img {
  position: static;
  width: 100%;
  height: auto;                            /* width/height attrs on the img keep layout stable pre-load */
  object-fit: cover;
}

/* ── roster note + placeholder grid (intentional empty state) ── */
.v-team__note {
  font-family: var(--f-edit-italic);
  font-style: italic;
  font-weight: 400;
  font-size: var(--t-parrafo-l);           /* 15px */
  line-height: var(--t-parrafo-l-lh);
  color: var(--grey);
  margin: 6rem auto 2.4rem;                /* 90 / 36 */
}

.v-team__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--grid-gap);
}

.v-team__agent {
  border-top: 1px solid rgba(198, 162, 75, .4);   /* gold hairline top rule */
  padding: 2.6rem 1.2rem 3rem;
}

/* ✦ monogram inside a thin gold ring */
.v-team__agent-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.2rem;                           /* 48px */
  height: 3.2rem;
  margin: 0 auto 1.6rem;
  border: 1px solid rgba(198, 162, 75, .55);
  border-radius: 50%;
  color: var(--red);                       /* gold */
  font-size: 1.1rem;
}

.v-team__agent-name {
  font-family: var(--f-regular);
  font-weight: 300;
  font-size: var(--t-titulo);              /* 24.75px */
  line-height: var(--t-titulo-lh);
  margin-bottom: .4rem;
  font-variation-settings: "opsz" 144;
}

.v-team__agent-role {
  font-family: var(--f-edit);
  font-weight: 400;
  font-size: var(--t-parrafo);             /* 12.75px */
  line-height: var(--t-parrafo-lh);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--grey);
  font-variation-settings: "opsz" 96;
}

/* ═══════════════════════════════════════════════════════════════
   3 · v-lines — 3 líneas display a 97.5px. SIN animación (r4 §6.6 "no-anim")
   r4: 1440 × 427.5, padding 0 / 24.75 / 135; línea 3 a media caja, a la derecha
   ═══════════════════════════════════════════════════════════════ */
.v-lines {
  display: flex;
  flex-direction: column;
  padding: 0 var(--inset) var(--pad-section);
}

.v-lines__title {
  display: flex;
  flex-direction: column;
  font-family: var(--f-regular);
  font-weight: 300;
  font-size: var(--t-supertitulo);      /* 97.5px */
  line-height: var(--t-supertitulo-lh); /* 97.5px sólido */
  letter-spacing: var(--ls-display);
  text-transform: uppercase;
  font-variation-settings: "opsz" 144;
}

/* .line { overflow:hidden } se conserva aunque no anime (r2 §7) */
.v-lines__line {
  display: block;
  overflow: hidden;
}
.v-lines__line.is-full { width: 100%; }
.v-lines__line.is-half {
  width: 50%;                 /* 695.25px @1440 — coincide con la medición */
  align-self: flex-end;
}

/* ═══════════════════════════════════════════════════════════════
   3b · v-search — #search: editorial head + fixed-height IDX surface.
   Service block, not a chapter: title stays at --t-titulo-xl scale.
   ═══════════════════════════════════════════════════════════════ */
.v-search {
  padding: var(--pad-section) var(--inset);   /* 135 / 24.75 / 135 */
  text-align: center;
}

.v-search__pretitle { margin-bottom: 2.4rem; }   /* 36px — tighter than a chapter */

.v-search__title {
  font-family: var(--f-regular);
  font-weight: 300;
  font-size: var(--t-titulo-xl);           /* 45px */
  line-height: var(--t-titulo-xl-lh);      /* 52.5px */
  letter-spacing: var(--ls-display);
  text-transform: uppercase;
  margin-bottom: 1.6rem;
  font-variation-settings: "opsz" 144;
}

.v-search__copy {
  font-family: var(--f-izmir);
  font-weight: 400;
  font-size: var(--t-titulo);              /* 24.75px */
  line-height: var(--t-titulo-lh);         /* 33px */
  max-width: 34em;
  margin: 0 auto 4.5rem;                   /* 67.5px down to the frame */
}

/* IDX surface: FIXED height (svh = px-stable) so ScrollTrigger math never
   shifts when the iframe lands; slightly darker champagne + gold hairline. */
.idx-embed {
  position: relative;
  height: 85svh;
  background: #E4DBCB;
  border: 1px solid rgba(198, 162, 75, .55);
}

.idx-embed__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 var(--inset);
}

.idx-embed__headline {
  font-family: var(--f-medium);
  font-weight: 500;
  font-size: var(--t-titulo-l);            /* 33.75px */
  line-height: var(--t-titulo-l-lh);       /* 40.5px */
  margin-bottom: .8rem;
  font-variation-settings: "opsz" 144;
}

.idx-embed__sub {
  font-family: var(--f-izmir);
  font-weight: 400;
  font-size: var(--t-parrafo-l);           /* 15px */
  line-height: var(--t-parrafo-l-lh);
  margin-bottom: 2rem;
}
.idx-embed__sub a {
  text-decoration: underline;
  text-underline-offset: .12em;
  text-decoration-thickness: from-font;
}

/* 🔧 IDX: tomorrow's iframe paste fills the frame with zero extra CSS */
.idx-embed iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ═══════════════════════════════════════════════════════════════
   4 · v-cols — 2 columnas col-6; la derecha lleva el párrafo "big_text"
   r4 §4.10: 1440 × 397; texto 24.75 / 33 Archivo + mailto subrayado
   ═══════════════════════════════════════════════════════════════ */
.v-cols {
  display: flex;
  justify-content: flex-start;
  gap: var(--grid-gap);
  padding: 0 var(--inset) var(--pad-section);
  min-height: 26.47rem;                    /* 397px */
}

.v-cols__left,
.v-cols__right { width: var(--v-col6); flex: 0 0 auto; }

.v-cols__right p {
  font-family: var(--f-izmir);
  font-weight: 400;
  font-size: var(--t-titulo);              /* 24.75px */
  line-height: var(--t-titulo-lh);         /* 33px */
}
.v-cols__right p:not(:last-of-type) { margin-bottom: 1.25em; }

.v-cols__right a {
  text-decoration: underline;
  text-underline-offset: .12em;
  text-decoration-thickness: from-font;
}

/* ═══════════════════════════════════════════════════════════════
   5 · v-center — CTA pill XL centrada
   r4 §4.10: 1440 × 218 = botón 83 + 135 de padding inferior
   ═══════════════════════════════════════════════════════════════ */
.v-center {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 0 var(--inset) var(--pad-section);
}


/* ═══════════════════════════════════════════════════════════════
   2c · v-concierge — "Start your search today" (client ask): name/phone,
   free-text CITY next to ZIP, notes → prefilled WhatsApp to the broker.
   Reuses the v-search head classes for one consistent voice.
   ═══════════════════════════════════════════════════════════════ */
.v-concierge {
  padding: var(--pad-section) var(--inset) 7.8rem;
  text-align: center;
}
.v-concierge__form {
  margin: 3.4rem auto 0;
  max-width: 38rem;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.v-concierge__row {
  display: flex;
  gap: 1.5rem;
}
.v-concierge__row .v-concierge__field { flex: 1 1 0; }
.v-concierge__field--zip { flex: 0 0 11rem !important; }   /* ZIP stays compact beside City */
.v-concierge__field {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.v-concierge__field > span {
  font-family: var(--f-izmir);
  font-weight: 500;
  font-size: var(--t-subtitulo);
  line-height: var(--t-subtitulo-lh);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--grey);
}
.v-concierge__field input,
.v-concierge__field textarea {
  font-family: var(--f-izmir);
  font-weight: 400;
  font-size: var(--t-parrafo-l);
  line-height: var(--t-parrafo-l-lh);
  color: var(--black);
  background: rgba(255, 255, 255, .55);
  border: 1px solid rgba(198, 162, 75, .45);
  border-radius: 0;
  padding: .8rem 1rem;
  outline: none;
  transition: border-color .25s linear, background .25s linear;
  -webkit-appearance: none;
  appearance: none;
  resize: vertical;
}
.v-concierge__field input:focus,
.v-concierge__field textarea:focus {
  border-color: #C6A24B;
  background: var(--white);
}
.v-concierge__field input::placeholder,
.v-concierge__field textarea::placeholder { color: rgba(110, 103, 92, .55); }
.v-concierge__field.is-invalid input { border-color: #A33B2E; }
.v-concierge__actions {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  margin-top: .4rem;
}
.v-concierge__actions .pill { flex: none; }
.v-concierge__note {
  font-family: var(--f-edit-italic);
  font-style: italic;
  font-size: var(--t-parrafo);
  line-height: var(--t-parrafo-lh);
  color: var(--grey);
  text-align: left;
  font-variation-settings: "opsz" 96;
}

/* submit feedback — empty until the form actually says something */
.v-concierge__status {
  font-family: var(--f-izmir);
  font-size: .78rem;
  letter-spacing: .04em;
  line-height: 1.6;
  color: var(--grey);
  text-align: left;
  margin-top: .55rem;
  min-height: 1.2em;
}
.v-concierge__status:empty { margin-top: 0; min-height: 0; }
.v-concierge__status[data-tone="good"] { color: var(--red); }   /* house gold */
.v-concierge__status[data-tone="bad"]  { color: #9B3B2F; }

/* ═══════════════════════════════════════════════════════════════
   6 · v-footer — 1440 × 1395.8, padding 24 / 24.75
   Bloques: fondo SVG (letras gigantes) · fila de enlaces · tarjeta · fila legal
   ═══════════════════════════════════════════════════════════════ */
.v-footer {
  min-height: 93.05rem;                    /* 1395.8px */
  padding: 1.6rem var(--inset);            /* --padding-xs / --wrapper-padd */
  isolation: isolate;
}

/* ── 6a · fondo: letras gigantes recortadas (r4 §7.4 y §4.10 .mod-footer__bg).
      Caja 1390.5 × 1172.6 con overflow hidden, pegada al inset de página.
      Sustituye el morph de MorphSVG del original por un revelado con clip-path. ── */
.v-footer__bg {
  position: absolute;
  z-index: 0;
  top: 5.9rem;                             /* justo debajo de la fila de enlaces */
  left: var(--inset);
  right: var(--inset);
  aspect-ratio: 1390.5 / 1172.6;           /* 1172.6px de alto @1440 */
  overflow: hidden;
  pointer-events: none;
}
.v-footer__bg svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.v-footer__bg-text {
  fill: var(--black);
  font-family: var(--f-brand);             /* Cinzel — the brand letters 'FL' */
  font-weight: 600;
  /* Units are SVG user units (viewBox 1390×1172), so px here is
     resolution-independent. WHOLE letters visible (client spec: see the
     full F) — cap ≈660px tall sits comfortably inside the box; the
     scroll-scrubbed y-drag in vertical.js pulls them down as you scroll. */
  /* Browser-measured (client: F beside INSTAGRAM, clear of the broker
     card): ink spans y≈120–560, text right edge ≈630 vs card left ≈811 —
     182px horizontal clearance, so even the +170px scroll drag can never
     reach Neily's card. */
  font-size: 620px;
  letter-spacing: -0.02em;
  transform: translate(-20px, -346px);
}

/* ── 6b · fila superior de enlaces, alineada a la derecha ── */
.v-footer__links {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  gap: var(--grid-gap);
  padding-top: 3.2rem;   /* clears the fixed chrome Menu pill at top-right */
  margin-bottom: 1.6rem;
  text-align: right;
}
.v-footer__links a {
  font-family: var(--f-medium);
  font-weight: 500;
  font-size: var(--t-titulo-l);            /* 33.75px */
  line-height: var(--t-titulo-l-lh);       /* 40.5px */
  font-variation-settings: "opsz" 144;
}

/* ── 6c · tarjeta destacada, absoluta a la derecha del centro (x ≈ 811 @1440) ── */
.v-footer__card {
  position: absolute;
  z-index: 2;
  width: calc(var(--v-col4) + 2px);                                      /* ≈450px @1440 */
  right: calc(var(--inset) + var(--v-col) * 1.5 + var(--grid-gap) * .5); /* 178.7px */
  bottom: 11.75rem;                                                      /* 176.25px */
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.v-footer__card-year {
  display: block;
  font-family: var(--f-edit);
  font-size: var(--t-parrafo-l);           /* 15px */
  line-height: var(--t-parrafo-l-lh);      /* 21px */
  margin-bottom: 1.2rem;                   /* 18px */
  font-variation-settings: "opsz" 96;
}

.v-footer__card-img {
  position: relative;
  width: 100%;
  aspect-ratio: 450 / 253.1;               /* 253.1px de alto @450 */
  margin-bottom: 1.2rem;                   /* 18px */
  overflow: hidden;
}
.v-footer__card-img img {
  position: absolute;
  left: 0;
  top: -7.5%;
  width: 100%;
  height: 115%;                            /* 291.1px — margen del parallax interno */
  object-fit: cover;
  object-position: 50% 12%;                /* portrait in a landscape box: keep the face */
  will-change: transform;
}

.v-footer__card-name {
  font-family: var(--f-medium);
  font-weight: 500;
  font-size: var(--t-titulo-l);            /* 33.75px */
  line-height: var(--t-titulo-l-lh);       /* 40.5px */
  margin-bottom: .4rem;                    /* 6px */
  font-variation-settings: "opsz" 144;
  overflow: hidden;                        /* .clip-y — máscara del nombre */
}
.v-footer__card-name .char { vertical-align: top; }

.v-footer__card-text {
  /* Archivo: this line carries BK# 3443361 — lining figures only
     (serif figures made the 4 ambiguous; client flagged) */
  font-family: var(--f-izmir);
  font-weight: 400;
  font-size: var(--t-parrafo-l);           /* 15px */
  line-height: var(--t-parrafo-l-lh);      /* 21px */
}

/* ── 6d · fila legal al pie (r2 §7: __legal absoluto a top 55 %) ── */
.v-footer__footer {
  position: absolute;
  z-index: 2;
  left: var(--inset);
  right: var(--inset);
  bottom: 1.6rem;
}

.v-footer__copyright {
  position: relative;
  top: .1em;                               /* .t-adj — ajuste óptico */
  display: block;
  font-family: var(--f-izmir);
  font-size: var(--t-parrafo);             /* 12.75px */
  line-height: var(--t-parrafo-lh);        /* 17.25px */
  text-transform: uppercase;
}

.v-footer__legal {
  position: absolute;
  top: 55%;                                /* r2: 55 %, no 50 % */
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  gap: 1.8rem;                             /* 27px */
  font-family: var(--f-izmir);
  font-size: var(--t-parrafo);
  line-height: var(--t-parrafo-lh);
  text-transform: uppercase;
  white-space: nowrap;
}

/* ═══ hero waves — living gold thread background ═══ */
.v-hero { position: relative; }
.v-hero__waves {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.v-hero__waves svg { display: block; width: 100%; height: 100%; }
.v-hero__waves .waves-dot {
  position: absolute;
  top: 0; left: 0;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #b8912e;
  opacity: 0;
  transition: opacity .4s;
  will-change: transform;
}
.v-hero__waves.is-live .waves-dot { opacity: .8; }
.v-hero > *:not(.v-hero__waves) { position: relative; z-index: 1; }
