:root{
  --tz-navy:#0b0b4f;
  --tz-blue:#253e5c;
  --tz-coral:#d53d47;
  --tz-coral-2:#e85763;
  --tz-light:#5ba9d5;
  --tz-medium:#4c7db1;
  --tz-paper:#f6f8fb;
  --tz-ink:#0b0b4f;
  --tz-white:#ffffff;

  --shadow-soft: 0 30px 80px -30px rgba(11,11,79,0.45), 0 8px 24px -10px rgba(11,11,79,0.18);
  --shadow-glass: 0 18px 50px -16px rgba(11,11,79,0.35);
}

/* ============ Lenis smooth-scroll ============ */
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }
.lenis.lenis-stopped{ overflow:hidden; }
.lenis.lenis-smooth iframe{ pointer-events:none; }

*{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
html,body{ margin:0; padding:0; background:#0a1b2e; color:#fff; font-family:'Inter', system-ui, sans-serif; overflow-x:clip; }
body{ font-size:16px; line-height:1.5; }
.font-display{ font-family:'Inter Tight', sans-serif; letter-spacing:-0.025em; }

/* ============ stage ============ */
.stage{
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  isolation: isolate;
}

/* ============ background — cinematic awakening + breathing ============ */
.hero-photos{
  position:absolute; inset:0;
  z-index: 0;
  overflow: hidden;
  will-change: transform;
}
.hero-layer{
  position:absolute; inset:-4%;
  background-size: cover;
  background-position: center 55%;
  will-change: transform, filter, opacity;
  /* settled cinematic filter — applies to shots 2 + 3 from t=0;
     l-1 overrides during awaken and lands on the same values */
  filter: brightness(0.85) saturate(1.00) contrast(1.04);
  opacity: 0;
}

/* ============ 3-shot cinematic sequence ============
   Cycle = 25.5s: 6s solid · 2.5s cross-fade · 6s solid · 2.5s cross-fade · 6s solid · 2.5s cross-fade
   Shot 1 visible : 0.0 → 6.0 s   (cross-out 6.0 → 8.5)
   Shot 2 visible : 8.5 → 14.5 s  (cross-in 6.0 → 8.5,  cross-out 14.5 → 17.0)
   Shot 3 visible : 17.0 → 23.0 s (cross-in 14.5 → 17.0, cross-out 23.0 → 25.5)
   Each shot's Ken Burns motion runs only during its 6 s solid window. */
.hero-layer.l-1{
  background-image: url('https://images.unsplash.com/photo-1540541338287-41700207dee6?w=2400&q=88&auto=format&fit=crop');
  /* awaken runs over the first 2s of the cycle, in parallel with shot1Cycle.
     shot1Cycle holds opacity 1 across that window so the awakening shows. */
  animation:
    awaken     2.0s  cubic-bezier(0.16, 1, 0.3, 1) 0s both,
    shot1Cycle 25.5s cubic-bezier(0.4, 0, 0.2, 1)  0s infinite;
}
.hero-layer.l-2{
  background-image: url('https://images.unsplash.com/photo-1582719508461-905c673771fd?w=2400&q=90');
  background-position: center 50%;
  animation: shot2Cycle 25.5s cubic-bezier(0.4, 0, 0.2, 1) 0s infinite;
}
.hero-layer.l-3{
  background-image: url('https://images.unsplash.com/photo-1571896349842-33c89424de2d?w=2400&q=90');
  background-position: center 60%;
  animation: shot3Cycle 25.5s cubic-bezier(0.4, 0, 0.2, 1) 0s infinite;
}
@keyframes awaken{
  /* scale 1.18 + blur 16 + brightness 0.4 + saturate 0.7 → scale 1.08 + blur 0 + brightness 0.85 + saturate 1 */
  0%   { transform: scale(1.18) translate3d(0, 0, 0); filter: blur(16px) brightness(0.40) saturate(0.70); }
  100% { transform: scale(1.08) translate3d(0, 0, 0); filter: blur(0)    brightness(0.85) saturate(1.00) contrast(1.04); }
}
/* Shot 1 — slow zoom IN, centered. Visible 0–6s, cross-out 6–8.5s, dormant, cross-in 23–25.5s. */
@keyframes shot1Cycle{
  0%      { opacity: 1; transform: scale(1.08) translate3d(0, 0, 0); }
  23.529% { opacity: 1; transform: scale(1.14) translate3d(0, 0, 0); }   /* end of solid window */
  33.333% { opacity: 0; transform: scale(1.14) translate3d(0, 0, 0); }   /* faded out */
  90.196% { opacity: 0; transform: scale(1.08) translate3d(0, 0, 0); }   /* still dormant, transform reset */
  100%    { opacity: 1; transform: scale(1.08) translate3d(0, 0, 0); }   /* fading back in */
}
/* Shot 2 — horizontal pan left → right. Visible 8.5–14.5s. */
@keyframes shot2Cycle{
  0%      { opacity: 0; transform: scale(1.10) translate3d(-2%, 0, 0); }
  23.529% { opacity: 0; transform: scale(1.10) translate3d(-2%, 0, 0); }  /* cross-in begins */
  33.333% { opacity: 1; transform: scale(1.10) translate3d(-2%, 0, 0); }  /* fully visible at start of pan */
  56.863% { opacity: 1; transform: scale(1.10) translate3d( 2%, 0, 0); }  /* end of pan, start cross-out */
  66.667% { opacity: 0; transform: scale(1.10) translate3d( 2%, 0, 0); }  /* faded out */
  100%    { opacity: 0; transform: scale(1.10) translate3d(-2%, 0, 0); }  /* idle, reset for next cycle */
}
/* Shot 3 — slow zoom OUT, slight upward drift. Visible 17–23s. */
@keyframes shot3Cycle{
  0%      { opacity: 0; transform: scale(1.14) translate3d(0,  0,    0); }
  56.863% { opacity: 0; transform: scale(1.14) translate3d(0,  0,    0); } /* cross-in begins */
  66.667% { opacity: 1; transform: scale(1.14) translate3d(0,  0,    0); } /* fully visible */
  90.196% { opacity: 1; transform: scale(1.08) translate3d(0, -1.5%, 0); } /* end — zoomed out + lifted */
  100%    { opacity: 0; transform: scale(1.08) translate3d(0, -1.5%, 0); } /* cross-out done */
}

/* ============ scrim (subtle top/bottom inks, no center darkening) ============ */
.hero-scrim{
  position:absolute; inset:0; pointer-events:none;
  z-index: 4;
  background:
    linear-gradient(180deg, rgba(5,5,38,0.45) 0%, rgba(5,5,38,0) 22%, rgba(5,5,38,0) 78%, rgba(5,5,38,0.55) 100%);
}

/* ============ sunlight shimmer (upper-right, soft-light) — loop 2 ============ */
.shimmer{
  position:absolute; inset: 0;
  background: radial-gradient(ellipse 70% 50% at 78% 28%, rgba(255,220,170,0.18) 0%, transparent 65%);
  mix-blend-mode: soft-light;
  pointer-events:none;
  z-index: 2;
  opacity: 0;
  transform: scale(1);
  animation:
    shimmerIn   2.0s cubic-bezier(0.16, 1, 0.3, 1) 3.0s forwards,
    shimmerLoop 20s ease-in-out 5.0s infinite;
}
@keyframes shimmerIn{ to{ opacity: 0.85; } }
@keyframes shimmerLoop{
  0%   { transform: translate3d(0, 0, 0) scale(1.00);   opacity: 0.7; }
  50%  { transform: translate3d(-10%, 6%, 0) scale(1.20); opacity: 1.0; }
  100% { transform: translate3d(0, 0, 0) scale(1.00);   opacity: 0.7; }
}

/* ============ film grain overlay — loop 3 (static texture) ============ */
.grain{
  position:absolute; inset:0; pointer-events:none;
  z-index: 6;
  opacity: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.5 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  background-size: 240px 240px;
  mix-blend-mode: overlay;
  animation: grainIn 1.5s ease-out 2.5s forwards;
}
@keyframes grainIn{ to{ opacity: 0.05; } }

/* ============ vignette — phase 1: 0.9 → 0.4 ============ */
.vignette{
  position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(0,0,0,0.70) 100%);
  z-index: 5;
  opacity: 0.90;
  animation: vignetteSettle 2.0s cubic-bezier(0.16, 1, 0.3, 1) 0s forwards;
}
@keyframes vignetteSettle{
  0%   { opacity: 0.90; }
  100% { opacity: 0.40; }
}

/* ============ mid-depth wrapper (route + shimmer for scroll parallax) ============ */
.mid-depth{
  position: absolute; inset: 0;
  pointer-events: none;
  z-index: 2;
  will-change: transform;
}

/* (route line removed — hero is now pure brand) */

/* ============ nav ============ */
.nav{
  position: fixed; top:0; left:0; right:0; z-index:60;
  padding: 26px 48px;
  display:grid; grid-template-columns: auto 1fr auto; align-items:center;
  gap: 36px;
  background: linear-gradient(180deg, rgba(5,5,38,0.55) 0%, rgba(5,5,38,0.18) 60%, rgba(5,5,38,0) 100%);
}
.nav-brand{
  display:flex; align-items:center; gap:22px;
  opacity: 0;
  transform: translateY(-8px);
  animation: brandIn 1.2s cubic-bezier(0.22, 1, 0.36, 1) 0.6s forwards;
}
@keyframes brandIn{
  0%   { opacity: 0; transform: translateY(-8px); }
  100% { opacity: 1; transform: translateY(0); }
}
.tz-logo-svg{ height:62px; width:auto; color:#fff; display:block; filter: drop-shadow(0 2px 14px rgba(0,0,0,0.55)) drop-shadow(0 1px 2px rgba(0,0,0,0.35)); }
.tz-logo-svg path{ fill:currentColor; }
.nav-divider{ width:1px; height:44px; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.42) 50%, rgba(255,255,255,0) 100%); }
.anniv-mark{
  display:flex; align-items:center;
  height: 60px;
  position: relative;
}
.anniv-mark img{
  height: 60px; width:auto; display:block;
  filter: drop-shadow(0 2px 12px rgba(0,0,0,0.45)) drop-shadow(0 0 1px rgba(0,0,0,0.35));
}
.nav-links{ display:flex; gap: 2px; align-items:center; justify-self:center; }
.nav-link{
  padding: 10px 16px;
  font-family:'Inter Tight', sans-serif;
  font-size: 14px; font-weight:500; letter-spacing:0.005em;
  color: rgba(255,255,255,0.92);
  border-radius: 999px;
  transition: all .22s ease;
  text-decoration:none;
  text-shadow: 0 1px 8px rgba(7,7,46,0.55);
}
.nav-link:hover{ color:#fff; background: rgba(255,255,255,0.14); backdrop-filter: blur(8px); }
.nav-cta-row{ display:flex; gap:12px; align-items:center; justify-self:end; }

/* ============ buttons ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding: 14px 24px;
  font-family:'Inter Tight', sans-serif;
  font-size: 14.5px; font-weight:500; letter-spacing:0.005em;
  border-radius: 999px;
  border:1px solid transparent;
  cursor:pointer; user-select:none;
  transition: transform .22s ease, box-shadow .25s ease, background .25s ease, border-color .2s ease, color .2s ease;
  white-space:nowrap;
  text-decoration:none;
  color:#fff;
}
.btn-coral{
  background: linear-gradient(180deg, #e85763 0%, var(--tz-coral) 100%);
  box-shadow: 0 14px 32px -10px rgba(213,61,71,0.55), 0 2px 0 rgba(255,255,255,0.16) inset;
  position:relative;
}
.btn-coral::before{
  content:''; position:absolute; inset:-3px; border-radius:inherit; z-index:-1;
  background: radial-gradient(60% 80% at 50% 50%, rgba(213,61,71,0.5), transparent 70%);
  filter: blur(14px);
  animation: coralBreath 4s ease-in-out infinite;
}
@keyframes coralBreath{
  0%,100%{ opacity:0.45; transform:scale(1) }
  50%{ opacity:0.85; transform:scale(1.06) }
}
.btn-coral:hover{ transform: translateY(-1px); box-shadow: 0 20px 40px -10px rgba(213,61,71,0.75); }
.btn-ghost{
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.45);
  backdrop-filter: blur(10px);
}
.btn-ghost:hover{ background: rgba(255,255,255,0.20); border-color: rgba(255,255,255,0.85); }
.btn-link{
  background:transparent; padding: 14px 6px; color: rgba(255,255,255,0.92);
}
.btn-link:hover{ color:#fff; text-shadow: 0 0 12px rgba(255,255,255,0.5); }
.btn-sm{ padding: 10px 18px; font-size:13.5px; }

/* ============ hero copy ============ */
.hero-wrap{
  position:absolute; inset:0;
  z-index:10;
  pointer-events: none;
}
.h-mark{
  position:absolute;
  top: 62%;
  left: 50%;
  transform: translate(-50%, -50%) translateY(20px);
  width: 88vw;
  height: auto;
  filter: drop-shadow(0 8px 40px rgba(0,0,0,0.5));
  opacity: 0;
  clip-path: inset(0 100% 0 0);
  -webkit-clip-path: inset(0 100% 0 0);
  animation:
    markReveal  2.7s cubic-bezier(0.22, 1, 0.36, 1) 2.8s forwards,
    markFloat   9s   ease-in-out                     6.0s infinite,
    markFadeOut 0.4s ease-out                        8.0s forwards;
  pointer-events: none;
}
@keyframes markFadeOut{
  to{ opacity: 0; }
}

/* ============ split wordmark — Phase 6 (8.0s → 9.5s) ============ */
.h-line-top, .h-line-bot{
  position: absolute;
  width: 88vw;
  height: auto;
  display: block;
  transform-origin: top left;
  filter: drop-shadow(0 8px 40px rgba(0,0,0,0.5));
  opacity: 0;
  pointer-events: none;
  will-change: transform, top, left, opacity;
}
.h-line-top{
  animation:
    splitTopChoreo 1.5s cubic-bezier(0.22, 1, 0.36, 1) 8.0s forwards,
    splitTopFloat  9s   ease-in-out                    9.5s infinite;
}
.h-line-bot{
  animation:
    splitBotChoreo 1.5s cubic-bezier(0.22, 1, 0.36, 1) 8.0s forwards,
    splitBotFloat  9s   ease-in-out                    9.5s infinite;
}
/* both lines begin at the same centered position the single wordmark occupied;
   their transparent canvases overlap to recreate the original layout, then they migrate apart. */
@keyframes splitTopChoreo{
  0%   { opacity: 0; top: 62%; left: 50%; transform: translate(-50%, -50%) scale(1); }
  27%  { opacity: 1; top: 62%; left: 50%; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 1; top: 24%; left: 5%;  transform: translate(0, 0)       scale(0.40); }
}
@keyframes splitBotChoreo{
  0%   { opacity: 0; top: 62%; left: 50%; transform: translate(-50%, -50%) scale(1); }
  27%  { opacity: 1; top: 62%; left: 50%; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 1; top: 52%; left: 5%;  transform: translate(0, 0)       scale(0.40); }
}
/* ambient float — same gentle drift the single wordmark had, now on both split lines in sync */
@keyframes splitTopFloat{
  0%, 100% { top: 24%; left: 5%; transform: translate(0, -4px) scale(0.40); }
  50%      { top: 24%; left: 5%; transform: translate(0,  4px) scale(0.40); }
}
@keyframes splitBotFloat{
  0%, 100% { top: 52%; left: 5%; transform: translate(0, -4px) scale(0.40); }
  50%      { top: 52%; left: 5%; transform: translate(0,  4px) scale(0.40); }
}

/* ============ glass access in hero — Phase 7 (9.3s → 10.8s) ============ */
.access-hero{
  position: absolute;
  top: 50%;
  right: 6%;
  width: 38vw;
  max-width: 460px;
  z-index: 15;
  opacity: 0;
  transform: translateY(-50%) translateX(40px) scale(0.96);
  pointer-events: auto;
  will-change: transform, opacity;
  animation:
    accessHeroAppear 1.5s cubic-bezier(0.22, 1, 0.36, 1) 9.3s  forwards,
    accessHeroFloat  7s   ease-in-out                    10.8s infinite;
}
@keyframes accessHeroAppear{
  0%   { opacity: 0; transform: translateY(-50%) translateX(40px) scale(0.96); }
  100% { opacity: 1; transform: translateY(-50%) translateX(0)    scale(1);    }
}
@keyframes accessHeroFloat{
  0%, 100% { transform: translateX(0) translateY(calc(-50% - 4px)) scale(1); }
  50%      { transform: translateX(0) translateY(calc(-50% + 4px)) scale(1); }
}
/* glass blur ramps 0 → 24px during entrance for the 'condensing fog' feel */
.access-hero .access{
  margin: 0;
  max-width: none;
  animation: accessGlassBlur 1.5s cubic-bezier(0.22, 1, 0.36, 1) 9.3s both;
}
@keyframes accessGlassBlur{
  0%   { backdrop-filter: blur(0)    saturate(140%); -webkit-backdrop-filter: blur(0)    saturate(140%); }
  100% { backdrop-filter: blur(32px) saturate(140%); -webkit-backdrop-filter: blur(32px) saturate(140%); }
}
@keyframes markReveal{
  0%   { opacity: 0; transform: translate(-50%, -50%) translateY(20px); filter: drop-shadow(0 8px 40px rgba(0,0,0,0.5)) blur(10px); clip-path: inset(0 100% 0 0); -webkit-clip-path: inset(0 100% 0 0); }
  60%  { opacity: 1;                                                    filter: drop-shadow(0 8px 40px rgba(0,0,0,0.5)) blur(3px);  }
  100% { opacity: 1; transform: translate(-50%, -50%) translateY(0);    filter: drop-shadow(0 8px 40px rgba(0,0,0,0.5)) blur(0);    clip-path: inset(0 0   0 0); -webkit-clip-path: inset(0 0   0 0); }
}
@keyframes markFloat{
  0%, 100% { transform: translate(-50%, -50%) translateY(-4px); }
  50%      { transform: translate(-50%, -50%) translateY( 4px); }
}

/* ============ access section (below hero) ============ */
.access-section{
  position: relative;
  width: 100%;
  padding: 80px 24px 100px;
  background:
    radial-gradient(120% 80% at 50% -20%, rgba(91,169,213,0.22) 0%, transparent 55%),
    linear-gradient(180deg, #07072e 0%, #0b0b4f 55%, #07072e 100%);
  display: grid;
  place-items: center;
  isolation: isolate;
}
.access-section::before{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(60% 40% at 20% 30%, rgba(91,169,213,0.10), transparent 70%),
    radial-gradient(50% 50% at 85% 75%, rgba(213,61,71,0.10), transparent 70%);
  pointer-events:none;
  z-index:0;
}
.access-section-inner{
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 480px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  text-align: center;
}
.access-eyebrow{
  font-family:'Inter Tight'; font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  margin: 0;
}
.access-h{
  font-family:'Inter Tight'; font-weight: 400;
  font-size: clamp(28px, 3.6vw, 40px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: #fff;
  margin: 0;
  max-width: 22ch;
}
.access-section-inner .access{
  margin: 6px auto 0;
  max-width: 440px;
}

/* ============ access module (premium glass, navy-tinted for legibility) ============ */
.access{
  position: relative;
  z-index: 15;
  width: 100%;
  max-width: 380px;
  margin: 0 0 0 auto;
  background: rgba(11, 11, 79, 0.55);
  backdrop-filter: blur(32px) saturate(140%);
  -webkit-backdrop-filter: blur(32px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 22px;
  padding: 22px 22px 20px;
  box-shadow:
    0 30px 60px rgba(0, 0, 0, 0.4),
    0 0 0 1px rgba(255, 255, 255, 0.08) inset,
    0 1px 0 rgba(255, 255, 255, 0.40) inset;
  color: #fff;
  overflow: hidden;
  opacity: 1;
  transform: none;
}
/* subtle moving light edge — gives 'liquid glass' feel */
.access::before{
  content:''; position:absolute; inset:-1px;
  border-radius: 23px; padding:1px;
  background: linear-gradient(135deg,
    rgba(255,255,255,0.65) 0%,
    rgba(255,255,255,0.0) 35%,
    rgba(255,255,255,0.0) 70%,
    rgba(255,255,255,0.35) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events:none;
  animation: edgeShift 9s ease-in-out infinite alternate;
}
@keyframes edgeShift{
  0%{ filter: hue-rotate(0deg); opacity:0.7 }
  100%{ filter: hue-rotate(8deg); opacity:1 }
}
.access::after{
  content:''; position:absolute; top:-40%; left:-20%; width:60%; height:80%;
  background: radial-gradient(closest-side, rgba(255,255,255,0.22), transparent 70%);
  filter: blur(22px); pointer-events:none;
  animation: accGlow 11s ease-in-out infinite alternate;
}
@keyframes accGlow{
  0%{ transform: translate3d(0,0,0); opacity:0.55 }
  100%{ transform: translate3d(18%, 8%, 0); opacity:0.9 }
}
/* ============ portal selector (sin login) — split premium ============ */
.ps-head{
  display: flex; align-items: center;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(255,255,255,0.78);
  margin: 0 0 14px;
}
/* dos puertas: TZ azul corporativo luminoso · MR negro cálido-oro (nunca coral) */
.ps-portal{
  position: relative; display: flex; text-decoration: none;
  flex-direction: column; align-items: center; text-align: center;
  padding: 20px 14px 16px; gap: 8px;
  border-radius: 14px;
  overflow: hidden;
  transition: filter 300ms cubic-bezier(0.22, 1, 0.36, 1), transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ps-portal:hover{ filter: brightness(1.12); transform: translateY(-2px); }
.ps-portal:focus-visible{ outline: 2px solid #d53d47; outline-offset: 2px; }
/* nota: el brightness del hover ilumina foto+scrim juntos — sutil, sin motion continuo */
.ps-portal--tz{
  background:
    radial-gradient(ellipse 78% 72% at 50% 46%, rgba(24,42,66,0.42) 0%, rgba(24,42,66,0.20) 55%, transparent 78%),
    linear-gradient(168deg, rgba(49,82,123,0.60) 0%, rgba(37,62,92,0.55) 48%, rgba(11,11,79,0.64) 125%),
    url('../img/portal-tz-bg.png') center 62% / cover no-repeat #253e5c;
  border: 1px solid rgba(91,169,213,0.30);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.20),
    inset 0 -16px 26px -14px rgba(0,0,0,0.55),
    0 10px 24px -12px rgba(0,0,0,0.5);
}
.ps-portal--mr{
  background:
    radial-gradient(ellipse 78% 72% at 50% 46%, rgba(12,9,6,0.46) 0%, rgba(12,9,6,0.22) 55%, transparent 78%),
    linear-gradient(168deg, rgba(26,20,16,0.65) 0%, rgba(16,12,8,0.60) 55%, rgba(10,10,10,0.68) 100%),
    url('../img/portal-mr-bg.png') center 35% / cover no-repeat #0a0a0a;
  border: 1px solid rgba(201,169,97,0.30);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -16px 26px -14px rgba(0,0,0,0.7),
    0 10px 24px -12px rgba(0,0,0,0.55);
}
@media (prefers-reduced-motion: no-preference){
  .ps-portal:hover{ filter: brightness(1.12); transform: translateY(-2px); }
}
/* halo radial tras cada logo */
.ps-portal::before{
  content: ''; position: absolute; left: 50%; top: 0;
  width: 130px; height: 90px;
  transform: translateX(-50%);
  pointer-events: none;
}
.ps-portal--tz::before{ background: radial-gradient(ellipse 50% 60% at 50% 30%, rgba(91,169,213,0.28) 0%, transparent 70%); }
.ps-portal--mr::before{ background: radial-gradient(ellipse 50% 60% at 50% 30%, rgba(201,169,97,0.22) 0%, transparent 70%); }
.ps-logo{ position: relative; height: 34px; display: flex; align-items: center; justify-content: center; margin-bottom: 2px; }
.ps-logo img{ display: block; max-height: 100%; width: auto; max-width: 120px; object-fit: contain; }
.ps-name{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400; font-size: 19px; letter-spacing: -0.01em; line-height: 1.15;
  display: block;
}
.ps-portal--tz .ps-name{ color: #ffffff; }
.ps-portal--mr .ps-name{ color: #d4d4cb; }
.ps-desc{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; font-size: 11.5px; line-height: 1.4;
  margin: 0;
}
.ps-portal--tz .ps-desc{ color: rgba(255,255,255,0.62); }
.ps-portal--mr .ps-desc{ color: rgba(212,212,203,0.58); }
.ps-enter{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 12px;
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 4px;
}
.ps-portal--tz .ps-enter{ color: #5ba9d5; }
.ps-portal--mr .ps-enter{ color: #c9a961; }
.ps-split{
  position: relative;
  display: grid; grid-template-columns: 1fr 1fr; gap: 9px;
}
/* entrada única (tras la aparición del panel a los 9.3s): las puertas llegan de
   lados opuestos, los logos respiran después, un destello recorre el borde superior
   UNA vez — y todo queda estático */
@media (prefers-reduced-motion: no-preference){
  .ps-portal--tz{ animation: psInLeft 700ms cubic-bezier(0.22, 1, 0.36, 1) 9.55s backwards; }
  .ps-portal--mr{ animation: psInRight 700ms cubic-bezier(0.22, 1, 0.36, 1) 9.55s backwards; }
  .ps-portal .ps-logo{ animation: psFade 500ms cubic-bezier(0.22, 1, 0.36, 1) 10.2s backwards; }
  .ps-portal--mr .ps-logo{ animation-delay: 10.35s; }
  .ps-split::after{
    content: ''; position: absolute; z-index: 3;
    top: 0; bottom: 62%; left: 0; width: 34%;
    background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.22) 50%, transparent 100%);
    border-radius: 14px;
    pointer-events: none;
    opacity: 0;
    animation: psSheen 1100ms cubic-bezier(0.22, 1, 0.36, 1) 10.6s forwards;
  }
}
@keyframes psInLeft{ from{ opacity: 0; transform: translateX(-26px); } to{ opacity: 1; transform: translateX(0); } }
@keyframes psInRight{ from{ opacity: 0; transform: translateX(26px); } to{ opacity: 1; transform: translateX(0); } }
@keyframes psFade{ from{ opacity: 0; transform: translateY(6px); } to{ opacity: 1; transform: translateY(0); } }
@keyframes psSheen{
  0%{ opacity: 0; transform: translateX(-30%); }
  25%{ opacity: 1; }
  100%{ opacity: 0; transform: translateX(260%); }
}
@media (prefers-reduced-motion: reduce){
  .ps-portal{ transition: none; animation: none; }
  .ps-portal:hover{ filter: none; transform: none; }
  .ps-portal .ps-logo{ animation: none; }
}
.access > .access-help{ position: relative; z-index: 2; }
.access-help{
  margin-top: 12px;
  display:flex; align-items:center; justify-content:space-between;
  font-size: 12px;
}
.access-help a{
  color: #fff; text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,0.4);
  padding-bottom: 1px;
}
.access-help a:hover{ border-color:#fff; }
.access-trust{
  color: rgba(255,255,255,0.85);
  display:flex; align-items:center; gap:6px;
  font-size: 11.5px;
}

/* gold button (My Residence) */
.btn-gold{
  background: linear-gradient(180deg, #f4e589 0%, #c69e58 55%, #9a6c30 100%);
  color: #1a160c;
  box-shadow:
    0 14px 32px -10px rgba(198,158,88,0.55),
    0 2px 0 rgba(255,255,255,0.25) inset,
    0 0 0 1px rgba(232,200,122,0.5) inset;
  position: relative;
  font-weight: 600;
}
.btn-gold::before{
  content:''; position:absolute; inset:-3px; border-radius:inherit; z-index:-1;
  background: radial-gradient(60% 80% at 50% 50%, rgba(232,200,122,0.6), transparent 70%);
  filter: blur(14px);
  animation: coralBreath 4s ease-in-out infinite;
}
.btn-gold:hover{ transform: translateY(-1px); box-shadow: 0 20px 40px -10px rgba(232,200,122,0.85); }

/* ============ destination strip — loop 5 (70s marquee) ============ */
.strip{
  position: absolute; left:0; right:0; bottom: 18px;
  z-index: 8;
  padding: 14px 0;
  background: linear-gradient(180deg, rgba(7,7,46,0) 0%, rgba(7,7,46,0.18) 30%, rgba(7,7,46,0.42) 100%);
  overflow:hidden;
  opacity: 0;
  transform: translateY(60px);
  animation: stripIn 1.2s cubic-bezier(0.16, 1, 0.3, 1) 4.5s forwards;
}
@keyframes stripIn{ to{ opacity: 1; transform: translateY(0); } }
.strip::before, .strip::after{
  content:''; position:absolute; top:0; bottom:0; width:160px; z-index:2; pointer-events:none;
}
.strip::before{ left:0; background: linear-gradient(90deg, rgba(7,7,46,0.7), transparent); }
.strip::after{ right:0; background: linear-gradient(270deg, rgba(7,7,46,0.7), transparent); }
.strip-row{
  display:flex; align-items:center; gap: 56px;
  white-space:nowrap;
  animation: marquee 70s linear infinite;
  padding: 0 56px;
}
.strip-row:hover{ animation-play-state: paused; }
.strip-item{
  font-family:'Inter Tight'; font-weight: 300;
  color: rgba(255,255,255,0.88);
  font-size: 18px;
  letter-spacing: 0.005em;
  display:flex; align-items:center; gap: 56px;
}
.strip-item .sep{
  width: 4px; height: 4px; border-radius:50%;
  background: var(--tz-light);
  opacity: 0.75;
  flex:0 0 4px;
  box-shadow: 0 0 6px rgba(91,169,213,0.5);
}
@keyframes marquee{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}

/* ============ whatsapp FAB ============ */
.fab{
  position: fixed; right: 28px; bottom: 28px; z-index: 70;
  display:flex; align-items:center; gap: 12px;
  padding: 10px 18px 10px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  color: var(--tz-navy);
  text-decoration:none;
  box-shadow: 0 18px 40px -10px rgba(11,11,79,0.35), 0 0 0 1px rgba(255,255,255,0.5);
  backdrop-filter: blur(14px);
  font-family:'Inter Tight'; font-size: 14px; font-weight: 500;
  transition: transform .25s ease, box-shadow .25s ease;
}
.fab:hover{ transform: translateY(-2px); box-shadow: 0 24px 50px -10px rgba(11,11,79,0.45); }
.fab-icon{
  width:38px; height:38px; border-radius:50%;
  background: linear-gradient(180deg, #25d366 0%, #128c4f 100%);
  display:grid; place-items:center;
  color: #fff;
  position:relative;
}
.fab-icon::after{
  content:''; position:absolute; inset:-5px; border-radius:50%;
  border: 1.5px solid rgba(37,211,102,0.45);
  animation: ringPulse 2.8s ease-out infinite;
}
@keyframes ringPulse{
  0%{ transform: scale(0.85); opacity:1 }
  100%{ transform: scale(1.5); opacity:0 }
}

/* ============ reveals (soft) ============ */
.reveal{ opacity:0; transform: translateY(22px); animation: rise 1.1s cubic-bezier(.2,.7,.2,1) forwards; }
.r-1{ animation-delay: .15s }
.r-2{ animation-delay: .35s }
.r-3{ animation-delay: .65s }
.r-4{ animation-delay: .95s }
.r-5{ animation-delay: 1.2s }
@keyframes rise{ to{ opacity:1; transform: translateY(0); } }

/* ============ responsive ============ */
@media (max-width: 1180px){
  .nav-links{ display:none; }
  .nav{ grid-template-columns: auto 1fr; padding: 22px 28px; }
}
@media (max-width: 820px){
  .nav{ padding: 18px 20px; }
  .anniv-mark, .nav-divider{ display:none; }
  .tz-logo-svg{ height: 48px; }
  .nav-cta-row .btn:first-child{ display:none; }
  .h-mark{ width: 90vw; }
  .fab{ right: 18px; bottom: 18px; padding: 8px 14px 8px 10px; }
  .strip-item{ font-size: 15px; gap: 40px; }
  .strip-row{ gap: 40px; padding: 0 24px; }
  .strip{ bottom: 12px; }
}

/* ============ mobile (<768px) — vertical stack, no horizontal migration ============ */
@media (max-width: 767px){
  .h-line-top{
    animation:
      splitTopChoreoMobile 1.5s cubic-bezier(0.22, 1, 0.36, 1) 8.0s forwards,
      splitTopFloatMobile  9s   ease-in-out                    9.5s infinite;
  }
  .h-line-bot{
    animation:
      splitBotChoreoMobile 1.5s cubic-bezier(0.22, 1, 0.36, 1) 8.0s forwards,
      splitBotFloatMobile  9s   ease-in-out                    9.5s infinite;
  }
  @keyframes splitTopChoreoMobile{
    0%   { opacity: 0; top: 50%; left: 50%; transform: translate(-50%, -90%) scale(1);    }
    27%  { opacity: 1; top: 50%; left: 50%; transform: translate(-50%, -90%) scale(1);    }
    100% { opacity: 1; top: 36%; left: 50%; transform: translate(-50%, -50%) scale(0.45); }
  }
  @keyframes splitBotChoreoMobile{
    0%   { opacity: 0; top: 50%; left: 50%; transform: translate(-50%, -10%) scale(1);    }
    27%  { opacity: 1; top: 50%; left: 50%; transform: translate(-50%, -10%) scale(1);    }
    100% { opacity: 1; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0.45); }
  }
  @keyframes splitTopFloatMobile{
    0%, 100% { top: 36%; left: 50%; transform: translate(-50%, calc(-50% - 4px)) scale(0.45); }
    50%      { top: 36%; left: 50%; transform: translate(-50%, calc(-50% + 4px)) scale(0.45); }
  }
  @keyframes splitBotFloatMobile{
    0%, 100% { top: 50%; left: 50%; transform: translate(-50%, calc(-50% - 4px)) scale(0.45); }
    50%      { top: 50%; left: 50%; transform: translate(-50%, calc(-50% + 4px)) scale(0.45); }
  }
  .access-hero{
    top: auto;
    bottom: 76px;
    left: 5%;
    right: 5%;
    width: auto;
    max-width: none;
    transform: translateY(40px);
    animation:
      accessHeroAppearMobile 1.5s cubic-bezier(0.22, 1, 0.36, 1) 9.3s  forwards,
      accessHeroFloatMobile  7s   ease-in-out                    10.8s infinite;
  }
  @keyframes accessHeroAppearMobile{
    0%   { opacity: 0; transform: translateY(40px); }
    100% { opacity: 1; transform: translateY(0);    }
  }
  @keyframes accessHeroFloatMobile{
    0%, 100% { transform: translateY(-4px); }
    50%      { transform: translateY( 4px); }
  }
}

/* ============ chapter 02 — Una licencia, un acceso privado (editorial split) ============ */
.ch02{
  position: relative;
  background: linear-gradient(180deg, #f8fafd 0%, #eef3f9 100%);
  color: #0b0b4f;
  isolation: isolate;
  overflow: hidden;
}
.ch02-grid{
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.04fr 0.96fr;
  grid-template-rows: 1fr auto;
  grid-template-areas:
    "content visual"
    "lower   visual";
  min-height: 100vh;
  max-width: 2040px;
  margin: 0 auto;
  align-items: stretch;
  /* environmental blue glow tracks the (capped/centred) grid box, not the full bleed */
  background: radial-gradient(120% 130% at 100% 38%, rgba(91,169,213,0.22) 0%, rgba(91,169,213,0.05) 40%, transparent 64%);
}

/* ---- left content (top zone) ---- */
.ch02-content{
  grid-area: content;
  align-self: start;
  display: flex;
  flex-direction: column;
  padding: clamp(92px, 12vh, 132px) 44px 0 clamp(40px, 5vw, 100px);
}
/* ---- lower-left zone (stats + footer) anchored to the bottom of the scene ---- */
.ch02-lower{
  grid-area: lower;
  align-self: end;
  display: flex;
  flex-direction: column;
  padding: clamp(36px, 5vh, 60px) 44px clamp(48px, 7vh, 84px) clamp(40px, 5vw, 100px);
}
.ch02-eyebrow{
  display: flex; align-items: center; gap: 16px;
  margin-bottom: clamp(40px, 6vh, 78px);
  opacity: 0; transform: translateY(12px);
  transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1);
}
.ch02.is-in .ch02-eyebrow{ opacity:1; transform:none; }
.ch02-eyebrow-text{
  font-family:'Inter',system-ui,sans-serif; font-weight:600; font-size:12px;
  letter-spacing:.26em; text-transform:uppercase; color:#253e5c;
}
.ch02-eyebrow-rule{
  height:1px; width:clamp(64px,8vw,128px);
  background: linear-gradient(90deg, #d53d47 0%, #d53d47 30%, rgba(91,169,213,0.55) 100%);
}
.ch02-eyebrow-dot{ width:5px; height:5px; border-radius:50%; background:#d53d47; flex:0 0 5px; }

/* ---- statement: headline + copy ---- */
.ch02-statement{
  display:grid;
  grid-template-columns: 1.16fr 0.84fr;
  gap: clamp(28px, 3.4vw, 58px);
  align-items: start;
}
.ch02-h{
  font-family:'Fraunces','Cormorant Garamond',Georgia,serif;
  font-weight:400;
  font-size: clamp(46px, 5.6vw, 94px);
  line-height: 1.0;
  letter-spacing:-0.026em;
  margin:0;
}
.ch02-h .line{
  display:block;
  opacity:0; transform:translateY(24px); filter:blur(6px);
  transition: opacity 1s cubic-bezier(.22,1,.36,1), transform 1s cubic-bezier(.22,1,.36,1), filter 1s cubic-bezier(.22,1,.36,1);
}
.ch02-h .line-1{ color:#0b0b4f; }
.ch02-h .line-2{ font-style:italic; font-variation-settings:"opsz" 144; color:#4c7db1; }
.ch02-h .dot{ color:#d53d47; }
.ch02.is-in .ch02-h .line-1{ opacity:1; transform:none; filter:none; transition-delay:.15s; }
.ch02.is-in .ch02-h .line-2{ opacity:1; transform:none; filter:none; transition-delay:.45s; }

.ch02-detail{
  margin-top: 28px;
  display:flex; align-items:center; gap:12px;
  opacity:0; transform:translateY(12px);
  transition: opacity .8s cubic-bezier(.22,1,.36,1) .75s, transform .8s cubic-bezier(.22,1,.36,1) .75s;
}
.ch02.is-in .ch02-detail{ opacity:1; transform:none; }
.ch02-detail-rule{ width:44px; height:1px; background:#5ba9d5; }
.ch02-detail-text{
  font-family:'Inter',sans-serif; font-size:12px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:#5ba9d5;
}

.ch02-copy{ padding-top: 6px; }
.ch02-support{
  font-family:'Inter',sans-serif; font-weight:500;
  font-size: clamp(17px,1.35vw,20px); line-height:1.5;
  color:#253e5c; margin:0 0 22px; max-width: 28ch; text-wrap:pretty;
  opacity:0; transform:translateY(14px);
  transition: opacity .9s cubic-bezier(.22,1,.36,1) .58s, transform .9s cubic-bezier(.22,1,.36,1) .58s;
}
.ch02.is-in .ch02-support{ opacity:1; transform:none; }
.ch02-body{
  font-family:'Inter',sans-serif; font-weight:400;
  font-size:16px; line-height:1.72; color:rgba(11,11,79,0.72);
  margin:0; max-width:38ch; text-wrap:pretty;
  opacity:0; transform:translateY(14px);
  transition: opacity .9s cubic-bezier(.22,1,.36,1) .74s, transform .9s cubic-bezier(.22,1,.36,1) .74s;
}
.ch02-body .accent{ color:#0b0b4f; font-weight:600; }
.ch02.is-in .ch02-body{ opacity:1; transform:none; }
.ch02-secondary{
  margin: 26px 0 0;
  font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:400;
  font-size: clamp(18px,1.5vw,23px); line-height:1.42; color:#4c7db1;
  max-width:32ch; text-wrap:balance;
  opacity:0; transform:translateY(14px);
  transition: opacity .9s cubic-bezier(.22,1,.36,1) .92s, transform .9s cubic-bezier(.22,1,.36,1) .92s;
}
.ch02.is-in .ch02-secondary{ opacity:1; transform:none; }

/* ---- stats ---- */
.ch02-stats{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(20px, 2.4vw, 42px);
  max-width: 780px;
}
.ch02-stat{
  position:relative; padding-top:22px;
  opacity:0; transform:translateY(22px);
  transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1);
}
.ch02-stat::before{
  content:''; position:absolute; top:0; left:0;
  width:34px; height:2px; background:#d53d47; opacity:.9;
}
.ch02.is-in .ch02-stat-1{ transition-delay:1.05s; opacity:1; transform:none; }
.ch02.is-in .ch02-stat-2{ transition-delay:1.20s; opacity:1; transform:none; }
.ch02.is-in .ch02-stat-3{ transition-delay:1.35s; opacity:1; transform:none; }
.ch02-stat-num{
  font-family:'Fraunces',Georgia,serif; font-weight:400;
  font-size: clamp(40px,3.4vw,60px); line-height:1; letter-spacing:-0.02em;
  font-variant-numeric: lining-nums tabular-nums; display:block;
}
.ch02-stat-1 .ch02-stat-num{ color:#0b0b4f; }
.ch02-stat-2 .ch02-stat-num{ color:#4c7db1; }
.ch02-stat-3 .ch02-stat-num{ color:#5ba9d5; }
.ch02-stat-label{
  font-family:'Inter',sans-serif; font-weight:600; font-size:11px;
  letter-spacing:.16em; text-transform:uppercase; color:#253e5c;
  margin:16px 0 8px;
}
.ch02-stat-desc{
  font-family:'Inter',sans-serif; font-weight:400; font-size:13.5px; line-height:1.55;
  color:rgba(11,11,79,0.6); margin:0; max-width:24ch;
}

/* ---- footer line ---- */
.ch02-foot{
  display:flex; align-items:center; gap:24px;
  margin-top: clamp(38px,6vh,72px);
  opacity:0;
  transition: opacity 1s ease 1.5s;
}
.ch02.is-in .ch02-foot{ opacity:1; }
.ch02-foot-text{
  font-family:'Inter',sans-serif; font-weight:600; font-size:11px;
  letter-spacing:.26em; text-transform:uppercase; color:#4c7db1;
}
.ch02-foot-rule{ flex:1; height:1px; background: linear-gradient(90deg, rgba(37,62,92,0.28), rgba(37,62,92,0)); }

/* ---- visual / oceanfront image ---- */
.ch02-visual{ grid-area: visual; position:relative; overflow:hidden; }
.ch02-visual-mask{
  position:absolute; inset:0; z-index:0;
  clip-path: inset(0 0 0 100%);
  -webkit-clip-path: inset(0 0 0 100%);
  transition: clip-path 1.5s cubic-bezier(.62,0,.2,1), -webkit-clip-path 1.5s cubic-bezier(.62,0,.2,1);
}
.ch02.is-in .ch02-visual-mask{ clip-path: inset(0 0 0 0%); -webkit-clip-path: inset(0 0 0 0%); }
.ch02-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
  filter: blur(16px) saturate(1.04) brightness(1.02);
  transform: scale(1.09);
  transition: filter 1.8s cubic-bezier(.22,1,.36,1) .15s, transform 6.5s cubic-bezier(.22,1,.36,1) .15s;
}
.ch02.is-in .ch02-img{ filter: blur(0) saturate(1.04) brightness(1.02); transform: scale(1.0); }
.ch02-sheen{
  position:absolute; inset:-12%; z-index:1; pointer-events:none;
  background: radial-gradient(42% 32% at 58% 34%, rgba(255,255,255,0.40), transparent 72%);
  mix-blend-mode: soft-light; opacity:0;
  transition: opacity 2s ease 1s;
}
.ch02.is-in .ch02-sheen{ opacity:1; animation: ch02Sheen 16s ease-in-out 1.6s infinite alternate; }
@keyframes ch02Sheen{ 0%{transform:translate3d(0,0,0)} 100%{transform:translate3d(-7%,4%,0)} }
/* atmospheric tints + left fade into paper */
.ch02-visual::after{
  content:''; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    linear-gradient(90deg, #eef3f9 0%, rgba(238,243,249,0.55) 9%, rgba(238,243,249,0) 28%),
    linear-gradient(180deg, rgba(91,169,213,0.16) 0%, transparent 28%, transparent 72%, rgba(11,11,79,0.12) 100%),
    radial-gradient(58% 48% at 66% 40%, rgba(91,169,213,0.14), transparent 70%);
}
.ch02-monogram{
  position:absolute; top:43%; left:31%; transform:translate(-50%,-50%);
  z-index:3; text-align:center; pointer-events:none;
  opacity:0;
  transition: opacity 1.6s ease .85s;
}
.ch02.is-in .ch02-monogram{ opacity:1; }
.ch02-monogram-tz{
  font-family:'Fraunces',Georgia,serif; font-weight:300;
  font-size: clamp(110px, 15vw, 230px); line-height:.78;
  color: rgba(255,255,255,0.52); letter-spacing:-0.04em;
  text-shadow: 0 10px 50px rgba(11,11,79,0.20);
}
.ch02-monogram-label{
  font-family:'Inter',sans-serif; font-weight:500; font-size:13px;
  letter-spacing:.44em; text-transform:uppercase; color:rgba(255,255,255,0.82);
  margin-top: 8px;
}

/* ---- responsive ---- */
@media (max-width: 1280px){
  .ch02-content{ padding: clamp(88px,11vh,120px) 36px 0 clamp(32px,4.5vw,72px); }
  .ch02-lower{ padding: clamp(32px,5vh,52px) 36px clamp(44px,6vh,72px) clamp(32px,4.5vw,72px); }
  .ch02-statement{ grid-template-columns: 1fr; gap: 30px; }
  .ch02-copy{ max-width: 560px; }
}
@media (max-width: 860px){
  /* stack as one column: headline+copy, then image, then info blocks */
  .ch02-grid{
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas: "content" "visual" "lower";
    min-height: 0;
    max-width: none;
  }
  .ch02-content{ align-self:auto; padding: 56px 28px 32px; }
  .ch02-eyebrow{ margin-bottom: 36px; }
  .ch02-h{ font-size: clamp(40px, 11vw, 60px); }
  .ch02-visual{ height: 56vw; min-height: 280px; max-height: 420px; }
  .ch02-visual-mask, .ch02.is-in .ch02-visual-mask{ clip-path:none; -webkit-clip-path:none; }
  .ch02-monogram{ left:50%; top:50%; }
  .ch02-lower{ align-self:auto; padding: 36px 28px 56px; }
  .ch02-stats{ grid-template-columns: 1fr 1fr; gap: 28px 24px; max-width: none; }
  .ch02-foot{ margin-top: 40px; }
}
@media (max-width: 560px){
  .ch02-stats{ grid-template-columns: 1fr; gap: 28px; }
}
/* ---- short desktop/laptop heights: scale the scene so it fits without clipping the lower blocks ---- */
@media (min-width: 861px) and (max-height: 920px){
  .ch02-content{ padding-top: clamp(80px, 9vh, 104px); }
  .ch02-h{ font-size: clamp(42px, 4.8vw, 74px); }
  .ch02-detail{ margin-top: 22px; }
  .ch02-stat-num{ font-size: clamp(36px, 2.9vw, 50px); }
  .ch02-lower{ padding-top: clamp(28px, 4vh, 48px); padding-bottom: clamp(40px, 5vh, 60px); }
}
@media (min-width: 861px) and (max-height: 760px){
  .ch02-content{ padding-top: 76px; }
  .ch02-eyebrow{ margin-bottom: 28px; }
  .ch02-h{ font-size: clamp(38px, 4.1vw, 60px); }
  .ch02-detail{ margin-top: 16px; }
  .ch02-support{ margin-bottom: 16px; }
  .ch02-stat-num{ font-size: clamp(34px, 2.6vw, 44px); }
  .ch02-stat-desc{ font-size: 13px; }
  .ch02-lower{ padding-bottom: clamp(36px, 4.5vh, 52px); }
}

@media (prefers-reduced-motion: reduce){
  .ch02 .ch02-eyebrow,
  .ch02 .ch02-h .line,
  .ch02 .ch02-detail,
  .ch02 .ch02-support,
  .ch02 .ch02-body,
  .ch02 .ch02-secondary,
  .ch02 .ch02-stat,
  .ch02 .ch02-foot,
  .ch02 .ch02-monogram,
  .ch02 .ch02-sheen{
    opacity:1 !important; transform:none !important; filter:none !important; transition:none !important;
  }
  .ch02 .ch02-visual-mask{ clip-path:none !important; -webkit-clip-path:none !important; }
  .ch02 .ch02-img{ filter:none !important; transform:none !important; }
  .ch02 .ch02-sheen{ animation:none !important; }
}

/* ============ chapter 03 — Una manera distinta de viajar (sticky stacking cards) ============ */
.ch03{
  position: relative;
  background:
    radial-gradient(ellipse at top right, rgba(91, 169, 213, 0.18) 0%, transparent 50%),
    radial-gradient(ellipse at bottom left, rgba(76, 125, 177, 0.15) 0%, transparent 50%),
    linear-gradient(180deg, #0a0a14 0%, #0b0b4f 30%, #0b0b4f 70%, #0a0a14 100%);
  color: #ffffff;
  padding: 120px 0;
  isolation: isolate;
  /* NO overflow/clip-path here: los blobs sobresalen a los lados a propósito y
     es el body (overflow-x:clip) quien recorta el exceso sin crear un scroll
     container. (La restricción anti-sticky original ya no aplica: el Cap 03 es
     ahora un carrusel orbital sin position:sticky.) */
}
.ch03-blob{ position: absolute; pointer-events: none; z-index: 0; border-radius: 50%; }
.ch03-blob-sky{
  width: 700px; height: 700px;
  top: 8%; right: -250px;
  background: radial-gradient(circle, rgba(91, 169, 213, 0.22) 0%, transparent 65%);
  filter: blur(60px);
}
.ch03-blob-navy{
  /* repurposed: subtle coral glow at the bottom — brings brand accent into the cinema palette */
  width: 600px; height: 600px;
  bottom: 15%; left: -200px;
  background: radial-gradient(circle, rgba(213, 61, 71, 0.10) 0%, transparent 65%);
  filter: blur(50px);
}

/* Top fade: paper-warm whisper transitioning from Capítulo 02 light into Capítulo 03 navy */
.ch03-top-fade{
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 200px;
  background: linear-gradient(180deg, #f6f5f1 0%, transparent 100%);
  opacity: 0.15;
  pointer-events: none;
  z-index: 2;
}

/* ===== header ===== */
.ch03-header{
  position: relative; z-index: 1;
  max-width: 720px;
  margin: 0 auto;
  padding: 0 32px;
  text-align: center;
}
.ch03-eyebrow{ display: inline-flex; align-items: center; gap: 12px; }
.ch03-eyebrow-square{ width: 8px; height: 8px; background: #d53d47; }
.ch03-eyebrow-text{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 13px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: #5ba9d5;
}
.ch03-rule{
  width: 80px; height: 1px; margin: 24px auto 0;
  background: linear-gradient(to right, #d53d47 0 50%, rgba(255,255,255,0.60) 50% 100%);
}
.ch03-h{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400;
  font-size: clamp(40px, 5.6vw, 72px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: #ffffff;
  margin: 48px 0 0;
  text-wrap: balance;
  max-width: 720px;
}
.ch03-h .dot{ color: #d53d47; }
.ch03-sub{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; font-size: 18px; line-height: 1.55;
  color: rgba(255, 255, 255, 0.75);
  max-width: 560px; margin: 28px auto 0;
  text-wrap: pretty;
}

/* ===== Capítulo 03 — carrusel orbital (rotación por tiempo, scroll siempre libre) =====
   HARD RULE: sin sticky, sin pinning, sin wheel/scroll listeners. La rotación es un
   temporizador (auto) + clic (manual). El bloque vive en el flujo normal del documento. */
.ch03o{
  position: relative; z-index: 1;
  max-width: 1400px;
  width: calc(100% - 64px);
  margin: 96px auto 0;
}
.ch03o-stage{
  position: relative;
  height: clamp(540px, 70vh, 700px);
}
/* geometría de órbita: elipse hairline + glow sky tras el pilar activo */
.ch03o-orbit{
  position: absolute; left: 50%; top: 50%;
  width: 118%; height: 86%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(246,245,241,0.07);
  border-radius: 50%;
  pointer-events: none; z-index: 0;
}
.ch03o-orbit::after{
  content: ""; position: absolute; inset: -7%;
  border: 1px solid rgba(91,169,213,0.06);
  border-radius: 50%;
}
.ch03o-glow{
  position: absolute; left: 50%; top: 54%;
  width: 78%; height: 90%;
  transform: translate(-50%, -50%);
  background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(91,169,213,0.16) 0%, rgba(76,125,177,0.07) 45%, transparent 70%);
  pointer-events: none; z-index: 1;
  filter: blur(2px);
}
/* tarjetas: mismas dimensiones base, transformadas por posición en el anillo */
.ch03o-card{
  position: absolute; left: 17%; top: 0;
  width: 66%; height: 100%;
  border-radius: 26px;
  overflow: hidden;
  background: #0a0a14;
  transform-origin: 50% 50%;
  transition:
    transform 1350ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 1350ms cubic-bezier(0.22, 1, 0.36, 1),
    filter 1350ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 1350ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch03o-card.slot-0{
  transform: translate(0, 0) scale(1);
  opacity: 1; z-index: 5; filter: none;
  box-shadow: 0 50px 110px -34px rgba(0,0,0,0.72), 0 0 0 1px rgba(255,255,255,0.08), 0 0 90px -22px rgba(91,169,213,0.28);
  cursor: default;
}
.ch03o-card.slot-1{
  transform: translate(56%, 9%) scale(0.40);
  opacity: 0.55; z-index: 3;
  filter: blur(2px) saturate(0.82) brightness(0.85);
  box-shadow: 0 30px 70px -30px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.05);
  cursor: pointer;
}
.ch03o-card.slot-2{
  transform: translate(0, -31%) scale(0.26);
  opacity: 0.32; z-index: 2;
  filter: blur(3px) saturate(0.7) brightness(0.7);
  box-shadow: 0 20px 50px -24px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.04);
  cursor: pointer;
}
.ch03o-card.slot-3{
  transform: translate(-56%, 9%) scale(0.40);
  opacity: 0.55; z-index: 3;
  filter: blur(2px) saturate(0.82) brightness(0.85);
  box-shadow: 0 30px 70px -30px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.05);
  cursor: pointer;
}
.ch03o-card:focus-visible{ outline: 2px solid #d53d47; outline-offset: 4px; }
/* media */
.ch03o-media{ position: absolute; inset: 0; }
.ch03o-media img{
  width: 100%; height: 100%; object-fit: cover;
  object-position: var(--focal, 50% 40%);
  display: block;
}
.ch03o-ph{
  position: absolute; inset: 0;
  background:
    repeating-linear-gradient(-45deg, rgba(91,169,213,0.05) 0 14px, transparent 14px 28px),
    radial-gradient(ellipse 70% 80% at 78% 30%, rgba(76,125,177,0.35) 0%, transparent 62%),
    linear-gradient(160deg, #253e5c 0%, #0b0b4f 55%, #0a0a14 100%);
}
.ch03o-ph-note{
  position: absolute; top: 24px; right: 24px; z-index: 3;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 11px; line-height: 1.55; letter-spacing: 0.02em;
  color: rgba(246,245,241,0.60);
  background: rgba(10,10,20,0.55);
  border: 1px dashed rgba(91,169,213,0.45);
  border-radius: 8px; padding: 10px 14px;
  max-width: 320px; text-align: left;
  opacity: 0; transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1) 500ms;
}
.ch03o-card.slot-0 .ch03o-ph-note{ opacity: 1; }
/* scrim: base cinema desde abajo + tinte navy sutil — la foto respira arriba */
.ch03o-scrim{
  position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background:
    linear-gradient(0deg, rgba(10,10,20,0.85) 0%, rgba(10,10,20,0.50) 25%, rgba(10,10,20,0.10) 50%, transparent 62%),
    linear-gradient(180deg, rgba(11,11,79,0.14) 0%, rgba(11,11,79,0.04) 60%, rgba(11,11,79,0.10) 100%);
}
/* contenido del pilar activo */
.ch03o-content{
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  padding: 0 clamp(32px, 5vw, 64px) clamp(36px, 5vh, 52px);
  max-width: 720px;
}
.ch03o-index{ display: flex; align-items: center; gap: 14px; margin: 0 0 16px; }
.ch03o-roman{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 300; font-size: 26px; line-height: 1;
  color: rgba(246,245,241,0.85); letter-spacing: 0.04em;
}
.ch03o-index-rule{ width: 44px; height: 1px; background: #d53d47; }
.ch03o-micro{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-style: italic; font-weight: 400;
  font-size: 20px; line-height: 1.3;
  color: #5ba9d5; margin: 0 0 12px;
}
.ch03o-title{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400; font-size: 48px; line-height: 56px;
  letter-spacing: -0.02em; color: #ffffff;
  margin: 0 0 16px; text-wrap: balance;
}
.ch03o-desc{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; font-size: 16px; line-height: 26px;
  color: rgba(246,245,241,0.80);
  margin: 0 0 20px; max-width: 520px; text-wrap: pretty;
}
.ch03o-anchor{
  display: flex; align-items: center; gap: 10px;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 12px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(246,245,241,0.70); margin: 0;
}
.ch03o-anchor-sq{ display: inline-block; width: 5px; height: 5px; background: #d53d47; flex: 0 0 5px; }
/* etiqueta mini en tarjetas laterales (legible tras el scale) */
.ch03o-mini{
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  padding: 0 56px 56px;
  display: flex; align-items: baseline; gap: 26px;
  opacity: 1; transition: opacity 900ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch03o-mini-n{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 300; font-size: 84px; line-height: 1;
  color: rgba(246,245,241,0.9);
}
.ch03o-mini-t{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400; font-size: 44px; line-height: 1.1;
  letter-spacing: -0.02em; color: rgba(246,245,241,0.85);
  text-wrap: balance;
}
.ch03o-card.slot-0 .ch03o-mini{ opacity: 0; pointer-events: none; }
/* stagger del contenido activo (eyebrow → titular → línea → dato) */
.ch03o-content .ch03o-index,
.ch03o-content .ch03o-micro,
.ch03o-content .ch03o-title,
.ch03o-content .ch03o-desc,
.ch03o-content .ch03o-anchor{
  opacity: 0; transform: translateY(22px);
  transition: opacity 650ms cubic-bezier(0.22, 1, 0.36, 1), transform 650ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch03o-card.slot-0 .ch03o-index,
.ch03o-card.slot-0 .ch03o-micro,
.ch03o-card.slot-0 .ch03o-title,
.ch03o-card.slot-0 .ch03o-desc,
.ch03o-card.slot-0 .ch03o-anchor{ opacity: 1; transform: translateY(0); }
.ch03o-card.slot-0 .ch03o-index{ transition-delay: 380ms; }
.ch03o-card.slot-0 .ch03o-micro{ transition-delay: 500ms; }
.ch03o-card.slot-0 .ch03o-title{ transition-delay: 620ms; }
.ch03o-card.slot-0 .ch03o-desc{ transition-delay: 740ms; }
.ch03o-card.slot-0 .ch03o-anchor{ transition-delay: 860ms; }
/* ken-burns "vivo" en la foto activa — deriva lentísima, nunca estática */
@media (prefers-reduced-motion: no-preference){
  .ch03o-card.slot-0 .ch03o-media img,
  .ch03o-card.slot-0 .ch03o-ph{ animation: ch03oDrift 16s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate; }
  .ch03o.is-paused .ch03o-card.slot-0 .ch03o-media img,
  .ch03o.is-paused .ch03o-card.slot-0 .ch03o-ph{ animation-play-state: paused; }
}
@keyframes ch03oDrift{
  from{ transform: scale(1) translate(0, 0); }
  to{ transform: scale(1.07) translate(-1.2%, 0.8%); }
}
/* controles: fila bajo el escenario — indicadores + arco de progreso + flechas */
.ch03o-nav{
  position: relative; z-index: 6;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  margin-top: 30px;
  padding: 0 clamp(8px, 2vw, 24px);
}
.ch03o-dots{ display: flex; align-items: flex-end; gap: 6px; }
.ch03o-dot{
  appearance: none; -webkit-appearance: none; border: 0; background: transparent;
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  min-height: 44px; padding: 8px 12px 10px;
  cursor: pointer; border-radius: 8px;
  transition: background 300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch03o-dot:hover{ background: rgba(246,245,241,0.07); }
.ch03o-dot:focus-visible{ outline: 2px solid #d53d47; outline-offset: 2px; }
.ch03o-dot-n{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 11px; letter-spacing: 0.08em;
  color: rgba(246,245,241,0.50);
  transition: color 300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch03o-dot-bar{
  width: 34px; height: 2px; border-radius: 1px;
  background: rgba(246,245,241,0.25);
  transition: background 300ms cubic-bezier(0.22, 1, 0.36, 1), width 450ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch03o-dot.is-active .ch03o-dot-n{ color: #ffffff; }
.ch03o-dot.is-active .ch03o-dot-bar{ background: #d53d47; width: 52px; }
.ch03o-controls{ display: flex; align-items: center; gap: 14px; }
/* arco de progreso coral: cronometra la rotación; se pausa en hover */
.ch03o-ring{ position: relative; width: 48px; height: 48px; }
.ch03o-ring svg{ display: block; transform: rotate(-90deg); }
.ch03o-ring-track{ fill: none; stroke: rgba(246,245,241,0.14); stroke-width: 1.5; }
.ch03o-ring-arc{
  fill: none; stroke: #d53d47; stroke-width: 1.5; stroke-linecap: round;
  stroke-dasharray: 138.2;
  stroke-dashoffset: 138.2;
}
@media (prefers-reduced-motion: no-preference){
  .ch03o-ring-arc{ animation: ch03oArc var(--ch03o-dur, 5000ms) linear forwards; }
  .ch03o.is-paused .ch03o-ring-arc{ animation-play-state: paused; }
}
@keyframes ch03oArc{ to{ stroke-dashoffset: 0; } }
.ch03o-ring-n{
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 11px; letter-spacing: 0.08em;
  color: rgba(246,245,241,0.85); font-variant-numeric: tabular-nums;
}
.ch03o-arrow{
  appearance: none; -webkit-appearance: none;
  width: 48px; height: 48px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(10,10,20,0.45);
  border: 1px solid rgba(246,245,241,0.28);
  color: #f6f5f1; cursor: pointer;
  transition: background 300ms cubic-bezier(0.22, 1, 0.36, 1), border-color 300ms cubic-bezier(0.22, 1, 0.36, 1), transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch03o-arrow:hover{ background: #d53d47; border-color: #d53d47; }
.ch03o-arrow:active{ transform: scale(0.94); }
.ch03o-arrow:focus-visible{ outline: 2px solid #d53d47; outline-offset: 3px; }
.ch03o-arrow svg{ display: block; }

@media (max-width: 899px){
  .ch03{ padding: 80px 0 100px; }
  .ch03-h{ font-size: 36px; }
  .ch03-sub{ font-size: 16px; }
  .ch03o{ width: calc(100% - 32px); margin-top: 64px; }
  .ch03o-stage{ height: clamp(500px, 76vh, 620px); }
  .ch03o-card{ left: 6%; width: 88%; border-radius: 20px; }
  .ch03o-card.slot-1{ transform: translate(58%, 12%) scale(0.34); }
  .ch03o-card.slot-3{ transform: translate(-58%, 12%) scale(0.34); }
  .ch03o-card.slot-2{ transform: translate(0, -34%) scale(0.22); opacity: 0.24; }
  .ch03o-content{ padding: 0 24px 30px; }
  .ch03o-title{ font-size: 32px; line-height: 38px; }
  .ch03o-micro{ font-size: 17px; }
  .ch03o-desc{ font-size: 15px; line-height: 24px; }
  .ch03o-ph-note{ max-width: 220px; font-size: 10px; }
  .ch03o-mini{ padding: 0 32px 36px; gap: 18px; }
  .ch03o-mini-n{ font-size: 64px; }
  .ch03o-mini-t{ font-size: 34px; }
  .ch03o-nav{ margin-top: 22px; }
  .ch03o-dot-bar{ width: 22px; }
  .ch03o-dot.is-active .ch03o-dot-bar{ width: 34px; }
  .ch03o-arrow{ width: 44px; height: 44px; }
  .ch03-blob-sky{ width: 360px; height: 360px; top: 5%; right: -120px; }
  .ch03-blob-navy{ width: 320px; height: 320px; bottom: 5%; left: -120px; }
}

@media (prefers-reduced-motion: reduce){
  .ch03o-card{ transition: none; }
  .ch03o-content .ch03o-index,
  .ch03o-content .ch03o-micro,
  .ch03o-content .ch03o-title,
  .ch03o-content .ch03o-desc,
  .ch03o-content .ch03o-anchor{ transition: none; transform: none; }
  .ch03o-mini, .ch03o-ph-note{ transition: none; }
  .ch03o-ring{ display: none; }
  .ch03o-dot-bar, .ch03o-arrow, .ch03o-dot{ transition: none; }
}

/* ============ prefers-reduced-motion ============ */
@media (prefers-reduced-motion: reduce){
  /* kill every hero animation; render the final, settled state */
  .hero-layer.l-1,
  .hero-layer.l-2,
  .hero-layer.l-3,
  .shimmer,
  .vignette,
  .grain,
  .strip,
  .nav-brand,
  .h-mark,
  .h-line-top,
  .h-line-bot,
  .access-hero,
  .access-hero .access { animation: none !important; }

  /* reduced motion: render only Shot 1, static, in focus */
  .hero-layer.l-1{ opacity: 1; transform: scale(1.08); filter: brightness(0.85) saturate(1.0) contrast(1.04); }
  .hero-layer.l-2,
  .hero-layer.l-3{ opacity: 0; }
  .shimmer{ opacity: 0; }
  .vignette{ opacity: 0.40; }
  .grain{ opacity: 0.05; }
  .nav-brand{ opacity: 1; transform: none; }
  /* reduced-motion final state: single wordmark hidden, split lines on the left, access on the right */
  .h-mark{ display: none; }
  .h-line-top{ opacity: 1; top: 24%; left: 5%; transform: translate(0, 0) scale(0.40); }
  .h-line-bot{ opacity: 1; top: 52%; left: 5%; transform: translate(0, 0) scale(0.40); }
  .access-hero{ opacity: 1; transform: translateY(-50%); }
  .access-hero .access{ backdrop-filter: blur(32px) saturate(140%); -webkit-backdrop-filter: blur(32px) saturate(140%); }
  .strip{ opacity: 1; transform: none; }
  /* destination strip still scrolls, at half speed */
  .strip-row{ animation: marquee 140s linear infinite !important; }
}

/* ============ chapter 04 — Explora tu licencia (cinematic redesign) ============ */
.ch04{
  position: relative;
  color: #ffffff;
  padding: 0 0 120px;
  isolation: isolate;
  background:
    radial-gradient(ellipse at top left, rgba(11, 11, 79, 0.42) 0%, transparent 55%),
    radial-gradient(ellipse at bottom right, rgba(91, 169, 213, 0.12) 0%, transparent 60%),
    linear-gradient(180deg, #0b0b4f 0%, #0b1d3a 44%, #080812 100%);
}

/* ===== cinematic hero ===== */
.ch04-hero{
  position: relative;
  width: 100%;
  min-height: clamp(420px, 56vh, 640px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 132px 24px 152px;
  box-sizing: border-box;
}
.ch04-hero-photo{
  position: absolute;
  inset: 0;
  background-image: url('../img/thumb-1920-866045.jpg');
  background-size: cover;
  background-position: center 44%;
  background-repeat: no-repeat;
  z-index: 0;
}
.ch04-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(ellipse 120% 78% at 50% 42%, transparent 32%, rgba(8,8,18,0.48) 100%),
    linear-gradient(180deg, rgba(8,8,18,0.55) 0%, rgba(11,11,79,0.50) 50%, rgba(8,8,18,0.82) 100%);
  pointer-events: none;
}
.ch04-hero-inner{
  position: relative;
  z-index: 2;
  max-width: 760px;
  text-align: center;
}
.ch04-eyebrow{ display:inline-flex; align-items:center; gap:12px; justify-content:center; }
.ch04-eyebrow-square{ width:8px; height:8px; background:#d53d47; }
.ch04-eyebrow-text{
  font-family:'Inter', system-ui, sans-serif;
  font-weight:500; font-size:13px;
  letter-spacing:0.18em; text-transform:uppercase;
  color:#5ba9d5;
  text-shadow: 0 2px 12px rgba(8,8,18,0.6);
}
.ch04-h{
  font-family:'Fraunces','Cormorant Garamond',Georgia,serif;
  font-weight:400;
  font-size:clamp(34px, 5vw, 60px);
  line-height:1.04;
  letter-spacing:-0.02em;
  color:#ffffff;
  margin:26px 0 0;
  text-wrap:balance;
  text-shadow: 0 6px 34px rgba(8,8,18,0.6);
}
.ch04-h .dot{ color:#d53d47; }
.ch04-sub{
  font-family:'Inter', system-ui, sans-serif;
  font-weight:400; font-size:14px; line-height:1.6;
  color:rgba(246,245,241,0.85);
  max-width:560px; margin:18px auto 0;
  text-wrap:pretty;
  text-shadow: 0 2px 16px rgba(8,8,18,0.65);
}

/* ===== floating glass selector ===== */
.ch04-selector-wrap{
  position: relative;
  z-index: 3;
  max-width: 980px;
  margin: -88px auto 0;
  padding: 0 24px;
}
/* ambient light orbs behind the panel — give the backdrop-blur something to refract */
.ch04-selector-wrap::before{
  content:'';
  position:absolute;
  left:-4%; right:-4%; top:-46px; bottom:-30px;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 22% 92%, rgba(91,169,213,0.45), transparent 62%),
    radial-gradient(circle at 84% 8%, rgba(76,125,177,0.35), transparent 64%),
    radial-gradient(circle at 52% 6%, rgba(120,190,228,0.20), transparent 58%);
  filter: blur(64px);
  opacity:0.95;
}
.ch04-glass{
  position: relative;
  z-index: 1;
  border-radius: 22px;
  padding: 26px 28px 24px;
  background:
    radial-gradient(ellipse 80% 60% at 30% 0%, rgba(91,169,213,0.16), transparent 70%),
    linear-gradient(135deg, rgba(37,62,92,0.55), rgba(11,11,79,0.42) 50%, rgba(8,8,18,0.58));
  -webkit-backdrop-filter: blur(22px) saturate(140%);
  backdrop-filter: blur(22px) saturate(140%);
  box-shadow:
    0 30px 80px -20px rgba(0,0,0,0.7),
    0 10px 30px -10px rgba(11,11,79,0.6),
    0 0 60px rgba(91,169,213,0.10),
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 -1px 0 rgba(91,169,213,0.12);
}
.ch04-glass::before{
  content:'';
  position:absolute; inset:0;
  border-radius:22px;
  padding:1.5px;
  background: linear-gradient(135deg, rgba(255,255,255,0.4), rgba(91,169,213,0.3) 30%, transparent 55%, rgba(91,169,213,0.15) 80%, rgba(255,255,255,0.08));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events:none;
  z-index:2;
}
/* top specular sheen — reads as real glass */
.ch04-glass::after{
  content:'';
  position:absolute; left:0; right:0; top:0; height:42%;
  border-radius:22px 22px 0 0;
  background: linear-gradient(180deg, rgba(255,255,255,0.10), transparent);
  pointer-events:none;
  z-index:0;
}
.glass-tabs{
  position: relative; z-index:1;
  display:flex; flex-wrap:wrap; justify-content:center; gap:6px;
}
.glass-tab{
  position:relative;
  background:transparent;
  border:none;
  color:rgba(246,245,241,0.6);
  font-family:'Fraunces','Cormorant Garamond',Georgia,serif;
  font-size:15px; font-weight:400; letter-spacing:-0.01em; line-height:1;
  padding:11px 20px; border-radius:999px; cursor:pointer; white-space:nowrap;
  transition: color 280ms cubic-bezier(.22,1,.36,1), background 280ms cubic-bezier(.22,1,.36,1), box-shadow 280ms ease;
}
.glass-tab:hover{ color:#fff; background:rgba(255,255,255,0.06); }
.glass-tab.is-active{
  color:#fff;
  background: linear-gradient(135deg,#d53d47,#b8323b);
  box-shadow: 0 8px 22px -4px rgba(213,61,71,0.55), inset 0 1px 0 rgba(255,255,255,0.25);
}
.glass-tab:focus-visible{ outline:2px solid rgba(91,169,213,0.8); outline-offset:2px; }

.glass-cities{
  position: relative; z-index:1;
  overflow:hidden;
  max-height:170px; opacity:1;
  transition: max-height 420ms cubic-bezier(.22,1,.36,1), opacity 300ms ease;
}
.glass-cities.is-hidden{ max-height:0; opacity:0; pointer-events:none; }
.glass-divider{
  height:1px; margin:20px auto 16px; max-width:520px;
  background: linear-gradient(90deg, transparent, rgba(91,169,213,0.25) 30%, rgba(91,169,213,0.25) 70%, transparent);
}
.glass-cities-label{
  font-family:'Inter', system-ui, sans-serif;
  font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  color:#5ba9d5; font-weight:600; text-align:center; margin:0 0 14px;
}
.glass-pills{ display:flex; flex-wrap:wrap; justify-content:center; gap:7px; }
.glass-city{
  background: rgba(11,29,58,0.5);
  border:1px solid rgba(91,169,213,0.28);
  color:rgba(246,245,241,0.7);
  font-family:'Inter', system-ui, sans-serif;
  font-size:12px; font-weight:500; letter-spacing:0.04em;
  padding:8px 16px; border-radius:999px; cursor:pointer; white-space:nowrap;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
  transition: color 260ms cubic-bezier(.22,1,.36,1), background 260ms cubic-bezier(.22,1,.36,1), border-color 260ms cubic-bezier(.22,1,.36,1), box-shadow 260ms ease, transform 260ms cubic-bezier(.22,1,.36,1);
}
.glass-city:hover{ color:#fff; border-color:rgba(91,169,213,0.6); background:rgba(91,169,213,0.10); transform:translateY(-1px); }
.glass-city.is-active{
  background: linear-gradient(135deg, rgba(91,169,213,0.32), rgba(76,125,177,0.22));
  border-color:rgba(91,169,213,0.7); color:#bfe0f2;
  box-shadow: 0 6px 20px -6px rgba(91,169,213,0.5), inset 0 1px 0 rgba(255,255,255,0.2), 0 0 18px rgba(91,169,213,0.18);
}
.glass-city:focus-visible{ outline:2px solid rgba(91,169,213,0.8); outline-offset:2px; }

/* ===== cards gallery ===== */
.ch04-cards-wrap{
  position: relative; z-index:1;
  max-width:1180px; margin:64px auto 0; padding:0 24px;
}
.ch04-cards-wrap::before{
  content:'';
  position:absolute;
  left:2%; right:2%; top:-30px; bottom:40px;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 16% 28%, rgba(91,169,213,0.14), transparent 58%),
    radial-gradient(circle at 88% 72%, rgba(76,125,177,0.12), transparent 60%);
  filter: blur(70px);
}
.ch04-hint{
  display:flex; align-items:center; justify-content:center; gap:10px;
  min-height:128px;
  font-family:'Inter', system-ui, sans-serif;
  font-size:13px; letter-spacing:0.04em;
  color:rgba(246,245,241,0.42);
  text-align:center;
}
.ch04-hint-arrow{ color:#5ba9d5; font-size:14px; animation: ch04-hint-bob 2.2s ease-in-out infinite; }
@keyframes ch04-hint-bob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-4px); } }
@media (prefers-reduced-motion: reduce){ .ch04-hint-arrow{ animation:none !important; } }
.ch04-cards{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:22px;
}
.ch04-card{
  position:relative;
  display:block;
  width:100%;
  text-align:left;
  border-radius:18px;
  overflow:hidden;
  background: linear-gradient(155deg, #2c4a6e, #253e5c 55%, #1f3550);
  border: 1px solid rgba(246,245,241,0.10);
  -webkit-backdrop-filter: blur(14px) saturate(135%);
  backdrop-filter: blur(14px) saturate(135%);
  box-shadow:
    0 24px 60px -22px rgba(0,0,0,0.7),
    0 8px 24px -12px rgba(11,11,79,0.55),
    0 0 40px rgba(91,169,213,0.06),
    inset 0 1px 0 rgba(255,255,255,0.14),
    inset 0 -1px 0 rgba(91,169,213,0.10);
  cursor:pointer;
  opacity:0;
  transition: transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s ease;
}
.ch04-card::before{
  content:'';
  position:absolute; inset:0;
  border-radius:18px;
  padding:1.4px;
  background: linear-gradient(150deg, rgba(255,255,255,0.38), rgba(91,169,213,0.28) 32%, transparent 58%, rgba(91,169,213,0.12) 82%, rgba(255,255,255,0.06));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events:none;
  z-index:3;
  transition: background .5s ease;
}
.ch04-cards.is-revealed .ch04-card{
  opacity:1;
  transform-origin: top center;
  animation: ch04-unfold 0.6s cubic-bezier(0.34, 1.18, 0.64, 1) backwards;
}
@keyframes ch04-unfold{
  from{ opacity:0; transform: scaleY(0.4) translateY(24px); }
  to{   opacity:1; transform: scaleY(1) translateY(0); }
}
.ch04-cards.is-revealed .ch04-card:nth-child(1){ animation-delay:0.04s; }
.ch04-cards.is-revealed .ch04-card:nth-child(2){ animation-delay:0.10s; }
.ch04-cards.is-revealed .ch04-card:nth-child(3){ animation-delay:0.16s; }
.ch04-cards.is-revealed .ch04-card:nth-child(4){ animation-delay:0.22s; }
.ch04-cards.is-revealed .ch04-card:nth-child(5){ animation-delay:0.28s; }
.ch04-cards.is-revealed .ch04-card:nth-child(6){ animation-delay:0.34s; }
.ch04-card:hover{
  transform: translateY(-10px) scale(1.015);
  box-shadow:
    0 40px 90px -24px rgba(0,0,0,0.8),
    0 16px 40px -14px rgba(11,11,79,0.6),
    0 0 70px rgba(91,169,213,0.22),
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(91,169,213,0.16);
}
.ch04-card:hover::before{
  background: linear-gradient(150deg, rgba(255,255,255,0.55), rgba(91,169,213,0.45) 32%, transparent 58%, rgba(91,169,213,0.2) 82%, rgba(255,255,255,0.12));
}
.ch04-card:hover .card-photo img{ transform: scale(1.08); }
.ch04-card:focus-visible{ outline:2px solid rgba(91,169,213,0.8); outline-offset:3px; }

.card-photo{
  position:relative; height:140px; overflow:hidden;
  margin:9px 9px 0; border-radius:13px;
  background:#13233f;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), inset 0 0 30px rgba(91,169,213,0.12);
}
.card-photo img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition: transform .6s cubic-bezier(.16,1,.3,1);
}
.card-photo::after{
  content:''; position:absolute; inset:0; border-radius:13px;
  background: linear-gradient(180deg, rgba(8,8,18,0.05) 0%, transparent 35%, rgba(11,29,58,0.55) 100%);
  pointer-events:none;
}
.card-tag{
  position:absolute; top:10px; left:10px; z-index:2;
  font-family:'Inter', system-ui, sans-serif;
  font-size:10px; font-weight:600; letter-spacing:0.10em; text-transform:uppercase;
  color:#eaf4fb;
  padding:6px 11px; border-radius:999px;
  background: rgba(11,11,79,0.55);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border:1px solid rgba(91,169,213,0.4);
  box-shadow: 0 4px 12px -4px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.15);
}
.card-tag.is-urgent{ color:#ffd9dc; border-color:rgba(213,61,71,0.45); background:rgba(60,12,18,0.55); }
.card-body{ padding:16px 18px 18px; }
.card-loc{
  display:flex; align-items:center; gap:6px;
  font-family:'Inter', system-ui, sans-serif; font-size:12px; letter-spacing:0.02em;
  color:#5ba9d5; margin:0 0 6px;
}
.card-loc span:first-child{ font-size:9px; transform:translateY(-1px); }
.card-name{
  font-family:'Fraunces','Cormorant Garamond',Georgia,serif;
  font-weight:400; font-size:17px; line-height:1.2; letter-spacing:-0.01em;
  color:#ffffff; margin:0 0 8px; text-wrap:balance;
}
.card-facts{
  font-family:'Inter', system-ui, sans-serif;
  font-size:12px; line-height:1.45; color:rgba(246,245,241,0.55); margin:0 0 14px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.card-price{ display:flex; flex-direction:column; gap:1px; }
.card-price-label{
  font-family:'Inter', system-ui, sans-serif;
  font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:rgba(246,245,241,0.5);
}
.card-price-value{
  font-family:'Fraunces','Cormorant Garamond',Georgia,serif;
  font-weight:400; font-size:22px; letter-spacing:-0.01em; color:#ffffff;
}

.ch04-more{ display:flex; justify-content:center; margin-top:36px; }
.ch04-more-btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Inter', system-ui, sans-serif; font-size:13px; font-weight:500; letter-spacing:0.06em;
  color:#ffffff; text-decoration:none;
  padding:13px 30px; border-radius:999px;
  background:transparent; border:1px solid rgba(201,169,97,0.45);
  cursor:pointer;
  transition: border-color 280ms cubic-bezier(.22,1,.36,1), background 280ms ease, transform 280ms cubic-bezier(.22,1,.36,1);
}
.ch04-more-btn:hover{ border-color:rgba(201,169,97,0.85); background:rgba(201,169,97,0.08); transform:translateY(-2px); }

/* ===== empty state ===== */
.ch04-empty{
  display:flex; align-items:center; justify-content:center;
  min-height:360px; max-width:1180px; margin:0 auto;
  padding:48px 32px;
  border:1px dashed rgba(255,255,255,0.15);
  border-radius:20px; background:rgba(255,255,255,0.02);
  text-align:center; position:relative; z-index:1;
}
.ch04-empty-text{
  font-family:'Inter', system-ui, sans-serif;
  font-size:16px; line-height:1.65; color:rgba(255,255,255,0.65); max-width:460px;
}
.ch04-empty-text strong{ color:#5ba9d5; font-weight:500; }

/* ===== responsive ===== */
@media (max-width: 820px){
  .ch04-cards{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px){
  .ch04-hero{ padding:112px 18px 128px; min-height:420px; }
  .ch04-selector-wrap{ margin-top:-74px; padding:0 16px; }
  .ch04-glass{ padding:20px 18px; }
  .glass-tabs{
    flex-wrap:nowrap; justify-content:flex-start;
    overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none;
    -webkit-overflow-scrolling:touch;
  }
  .glass-tabs::-webkit-scrollbar{ display:none; }
  .glass-tab{ flex:0 0 auto; }
  .ch04-cards-wrap{ margin-top:48px; padding:0 16px; }
}
@media (max-width: 520px){
  .ch04-cards{ grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce){
  .ch04-card{ opacity:1 !important; }
  .ch04-cards.is-revealed .ch04-card{ animation:none !important; transform:none !important; }
  .ch04-card:hover{ transform:none !important; }
  .ch04-card:hover .card-photo img{ transform:none !important; }
  .ch04-modal[data-active="true"]{ animation: none !important; }
  .modal-container{ animation: none !important; }
}

/* ============ chapter 04 — detail modal ============ */
.ch04-modal{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 32px;
}
.ch04-modal[data-active="true"]{
  display: flex;
  animation: modalFadeIn 350ms cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes modalFadeIn{
  from{ opacity: 0; }
  to{   opacity: 1; }
}
@keyframes modalSlideIn{
  from{ opacity: 0; transform: translateY(40px) scale(0.96); }
  to{   opacity: 1; transform: translateY(0) scale(1); }
}
.modal-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(10, 6, 18, 0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  cursor: pointer;
}
.modal-container{
  position: relative;
  width: 100%;
  max-width: 1280px;
  max-height: 88vh;
  height: 720px;
  background: linear-gradient(135deg,
    rgba(20, 14, 28, 0.98) 0%,
    rgba(12, 10, 22, 0.98) 100%);
  border: 1px solid rgba(213, 61, 71, 0.25);
  border-radius: 28px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  box-shadow: 0 60px 120px -30px rgba(0, 0, 0, 0.8);
  animation: modalSlideIn 420ms cubic-bezier(0.22, 1, 0.36, 1);
}
.modal-close{
  position: absolute;
  top: 24px;
  right: 24px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  z-index: 10;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1),
              border-color 240ms cubic-bezier(0.22, 1, 0.36, 1),
              transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}
.modal-close:hover{
  background: rgba(213, 61, 71, 0.85);
  border-color: #d53d47;
  transform: rotate(90deg);
}

/* ===== gallery ===== */
.modal-gallery{
  position: relative;
  overflow: hidden;
  min-height: 0;
  height: 100%;
  width: 100%;
  background: #0a0a14;
  border: none;
  border-radius: 0;
  outline: none;
  box-shadow: none;
}
.gallery-stage{
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
}
.gallery-image{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 500ms cubic-bezier(0.22, 1, 0.36, 1);
}
.gallery-image.is-current{ opacity: 1; }
.gallery-prev, .gallery-next{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px; height: 48px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.20);
  color: #ffffff;
  font-size: 20px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1),
              border-color 240ms cubic-bezier(0.22, 1, 0.36, 1),
              transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}
.gallery-prev{ left: 20px; }
.gallery-next{ right: 20px; }
.gallery-prev:hover, .gallery-next:hover{
  background: rgba(213, 61, 71, 0.9);
  border-color: #d53d47;
  transform: translateY(-50%) scale(1.08);
}
.gallery-counter{
  position: absolute;
  top: 24px; left: 24px;
  background: rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 999px;
  padding: 8px 18px;
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-size: 14px;
  color: #ffffff;
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  z-index: 5;
}
.gallery-current{ font-weight: 500; }
.gallery-separator, .gallery-total{ color: rgba(255, 255, 255, 0.5); }
.gallery-dots{
  position: absolute;
  bottom: 24px; left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  gap: 10px;
  z-index: 5;
}
.gallery-dots .dot{
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1),
              width 240ms cubic-bezier(0.22, 1, 0.36, 1),
              border-radius 240ms cubic-bezier(0.22, 1, 0.36, 1);
}
.gallery-dots .dot.is-active{
  background: #d53d47;
  width: 24px;
  border-radius: 999px;
}

/* ===== details column ===== */
.modal-details{
  position: relative;
  padding: 44px 40px 32px 40px;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  color: #ffffff;
  background: rgba(10, 6, 18, 0.40);
  border: none;
  border-left: 1px solid rgba(213, 61, 71, 0.18);
  border-radius: 0;
  outline: none;
  box-shadow: none;
  scrollbar-width: thin;
  scrollbar-color: rgba(213, 61, 71, 0.5) rgba(255, 255, 255, 0.05);
}
.modal-details *{
  max-width: 100%;
  box-sizing: border-box;
}
.modal-details::-webkit-scrollbar{ width: 8px; }
.modal-details::-webkit-scrollbar-track{
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
}
.modal-details::-webkit-scrollbar-thumb{
  background: rgba(213, 61, 71, 0.5);
  border-radius: 8px;
}
.modal-details::-webkit-scrollbar-thumb:hover{
  background: rgba(213, 61, 71, 0.8);
}

.modal-tag{
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #5ba9d5;
  font-weight: 500;
  margin: 0 0 18px;
}
.modal-tag.is-urgent{ color: #d53d47; }
.modal-title{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.1;
  color: #ffffff;
  letter-spacing: -0.02em;
  margin: 0 0 12px;
  text-wrap: balance;
}
.modal-location{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.65);
  margin: 0 0 22px;
}
.modal-price-block{
  padding: 16px 20px;
  background: rgba(213, 61, 71, 0.08);
  border: 1px solid rgba(213, 61, 71, 0.25);
  border-radius: 16px;
  margin: 0 0 28px;
}
.modal-price-label{
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.60);
  margin: 0 0 6px;
}
.modal-price-value{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-size: 26px;
  font-weight: 400;
  color: #ffffff;
  letter-spacing: -0.02em;
}
.price-asterisk{ color: #d53d47; margin-left: 4px; }

.modal-section{
  margin: 0 0 20px;
  padding: 0 0 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.modal-section:last-of-type{ border-bottom: none; padding-bottom: 0; }
.section-heading{
  position: relative;
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-size: 18px;
  font-weight: 400;
  color: #ffffff;
  letter-spacing: -0.01em;
  margin: 0 0 12px;
  padding-left: 16px;
}
.section-heading::before{
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px; height: 5px;
  background: #d53d47;
}
.section-heading-muted{
  color: rgba(255, 255, 255, 0.7);
  font-size: 16px;
}
.section-heading-muted::before{ background: rgba(255, 255, 255, 0.4); }
.section-content,
.modal-description p{
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.82);
  margin: 0 0 14px;
}
.modal-description p:last-child{ margin-bottom: 0; }

.includes-list{
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.include-item{
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.85);
  padding: 4px 0;
}
.include-icon{
  flex-shrink: 0;
  width: 32px; height: 32px;
  background: rgba(91, 169, 213, 0.12);
  border: 1px solid rgba(91, 169, 213, 0.30);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 1;
  color: #5ba9d5;
}
.include-text{
  display: flex;
  align-items: center;
  line-height: 1.4;
}
.validity-block{
  background: rgba(91, 169, 213, 0.06);
  border-left: 2px solid #5ba9d5;
  padding: 14px 18px;
  border-radius: 8px;
}
.validity-main{
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
  margin: 0 0 6px;
}
.validity-note{
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 12px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.55);
}
.conditions-list{
  list-style: none;
  padding: 0; margin: 0;
}
.conditions-list li{
  position: relative;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 12px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.55);
  padding: 6px 0 6px 18px;
}
.conditions-list li::before{
  content: '·';
  position: absolute;
  left: 6px;
  color: rgba(255, 255, 255, 0.4);
}

.modal-actions{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 8px;
}
.modal-cta-primary,
.modal-cta-secondary{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 24px;
  border-radius: 999px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-decoration: none;
  cursor: pointer;
  transition: background 280ms cubic-bezier(0.22, 1, 0.36, 1),
              transform 280ms cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 280ms cubic-bezier(0.22, 1, 0.36, 1),
              border-color 280ms cubic-bezier(0.22, 1, 0.36, 1);
}
.modal-cta-primary{
  background: #d53d47;
  color: #ffffff;
  border: 1px solid #d53d47;
  box-shadow: 0 10px 28px -8px rgba(213, 61, 71, 0.6);
}
.modal-cta-primary:hover{
  background: #c12d37;
  transform: translateY(-2px);
  box-shadow: 0 14px 32px -8px rgba(213, 61, 71, 0.8);
}
.modal-cta-secondary{
  background: transparent;
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.30);
}
.modal-cta-secondary:hover{
  border-color: #ffffff;
  background: rgba(255, 255, 255, 0.05);
}
.cta-icon{ font-size: 18px; line-height: 1; }

@media (max-width: 900px){
  .ch04-modal{ padding: 0; }
  .modal-container{
    grid-template-columns: 1fr;
    max-height: 100vh;
    height: 100vh;
    border-radius: 0;
    border: none;
    overflow-y: auto;
  }
  .modal-gallery, .gallery-stage{
    min-height: 0;
    height: 40vh;
    max-height: 40vh;
  }
  .modal-details{
    padding: 32px 24px 48px;
    overflow-y: visible;
  }
  .modal-title{ font-size: 26px; }
  .modal-price-value{ font-size: 24px; }
  .modal-cta-primary, .modal-cta-secondary{ font-size: 14px; padding: 14px 24px; }
  .gallery-prev, .gallery-next{ width: 40px; height: 40px; font-size: 18px; }
  .modal-close{ top: 16px; right: 16px; width: 40px; height: 40px; }
}

/* ============ chapter 04 — card CTA button ============ */
.card-cta{
  display:block; width:100%; margin-top:14px;
  font-family:'Inter', system-ui, sans-serif; font-size:12.5px; font-weight:600; letter-spacing:0.04em;
  color:#fff; text-align:center;
  padding:11px 16px; border-radius:10px; border:none; cursor:pointer;
  background: linear-gradient(135deg,#d53d47,#b8323b);
  box-shadow: 0 8px 22px -8px rgba(213,61,71,0.6), inset 0 1px 0 rgba(255,255,255,0.22);
  transition: transform 280ms cubic-bezier(.16,1,.3,1), box-shadow 280ms ease, filter 280ms ease;
}
.card-cta:hover{ transform: translateY(-1px); box-shadow: 0 12px 28px -8px rgba(213,61,71,0.7), inset 0 1px 0 rgba(255,255,255,0.28); filter:brightness(1.05); }
.card-cta:focus-visible{ outline:2px solid rgba(91,169,213,0.85); outline-offset:2px; }

/* ============ chapter 04 — "Solicitar información" glass form modal ============ */
.sol-modal{
  position: fixed; inset: 0; z-index: 120;
  display: none; align-items: center; justify-content: center;
  padding: 28px;
}
.sol-modal[data-active="true"]{ display: flex; }
.sol-backdrop{
  position: absolute; inset: 0; z-index: 0;
  background: rgba(5,6,15,0.8);
  -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
}
.sol-orbs{
  position: absolute; z-index: 1; pointer-events: none;
  width: min(620px, 92vw); height: min(620px, 92vh);
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 22% 78%, rgba(91,169,213,0.45), transparent 65%),
    radial-gradient(circle at 80% 18%, rgba(76,125,177,0.35), transparent 65%);
  filter: blur(66px);
}
.sol-panel{
  position: relative; z-index: 2;
  width: 430px; max-width: 100%; max-height: 90vh; overflow-y: auto;
  border-radius: 22px;
  background:
    radial-gradient(ellipse 80% 50% at 30% 0%, rgba(91,169,213,0.16), transparent 70%),
    linear-gradient(155deg, rgba(37,62,92,0.62), rgba(11,11,79,0.55) 55%, rgba(8,8,18,0.75));
  -webkit-backdrop-filter: blur(24px) saturate(140%); backdrop-filter: blur(24px) saturate(140%);
  box-shadow:
    0 40px 100px -24px rgba(0,0,0,0.85),
    0 0 80px rgba(91,169,213,0.12),
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 -1px 0 rgba(91,169,213,0.12);
  animation: solIn 0.5s cubic-bezier(.16,1,.3,1);
}
@keyframes solIn{ from{ opacity:0; transform: scale(0.94) translateY(10px); } to{ opacity:1; transform: scale(1) translateY(0); } }
.sol-panel::before{
  content:''; position:absolute; inset:0; border-radius:22px; padding:1.5px; z-index:5;
  background: linear-gradient(150deg, rgba(255,255,255,0.4), rgba(91,169,213,0.3) 32%, transparent 58%, rgba(91,169,213,0.14) 82%, rgba(255,255,255,0.08));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events:none;
}
.sol-panel::after{
  content:''; position:absolute; left:0; right:0; top:0; height:120px;
  border-radius:22px 22px 0 0;
  background: linear-gradient(180deg, rgba(255,255,255,0.10), transparent);
  pointer-events:none; z-index:4;
}
.sol-photo{
  position: relative; height: 120px; overflow: hidden;
  border-radius: 22px 22px 0 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.22), inset 0 0 32px rgba(91,169,213,0.14);
}
.sol-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.sol-photo::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(8,8,18,0.15), rgba(11,11,79,0.7) 80%, rgba(8,8,18,0.92));
  pointer-events:none;
}
.sol-tag{
  position:absolute; top:12px; left:12px; z-index:3;
  font-family:'Inter', system-ui, sans-serif; font-size:10px; font-weight:600;
  letter-spacing:0.10em; text-transform:uppercase; color:#eaf4fb;
  padding:6px 11px; border-radius:999px;
  background: rgba(11,11,79,0.6);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border:1px solid rgba(91,169,213,0.4);
  box-shadow: 0 4px 12px -4px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.15);
}
.sol-close{
  position:absolute; top:12px; right:12px; z-index:6;
  width:34px; height:34px; border-radius:50%; cursor:pointer;
  display:grid; place-items:center; color:#fff;
  background: rgba(11,11,79,0.55);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border:1px solid rgba(255,255,255,0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16);
  transition: background 240ms ease, transform 240ms ease;
}
.sol-close:hover{ background: rgba(213,61,71,0.5); transform: rotate(90deg); }
.sol-close:focus-visible{ outline:2px solid rgba(91,169,213,0.85); outline-offset:2px; }
.sol-body{ position:relative; z-index:3; padding: 0 26px 26px; margin-top:-26px; }
.sol-body-general{ margin-top:0; padding-top:4px; }
/* general-mode header (no package photo) */
.sol-genhead{ position:relative; z-index:3; padding: 22px 26px 0; }
.sol-genhead-eyebrow{ display:inline-flex; align-items:center; gap:9px; font-family:'Inter', system-ui, sans-serif; font-weight:600; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#5ba9d5; }
.sol-genhead-eyebrow .sq{ width:7px; height:7px; background:#d53d47; display:inline-block; }
.sol-prompt-general{ border-top:none; padding-top:0; margin-top:0; }
.sol-loc{
  display:flex; align-items:center; gap:6px;
  font-family:'Inter', system-ui, sans-serif; font-size:12px; letter-spacing:0.02em; color:#5ba9d5; margin:0 0 6px;
}
.sol-loc span:first-child{ font-size:9px; }
.sol-name{
  font-family:'Fraunces','Cormorant Garamond',Georgia,serif; font-weight:400;
  font-size:21px; line-height:1.2; letter-spacing:-0.01em; color:#fff; margin:0 0 7px; text-wrap:balance;
}
.sol-facts{ font-family:'Inter', system-ui, sans-serif; font-size:12.5px; line-height:1.5; color:rgba(246,245,241,0.6); margin:0 0 16px; }
.sol-prompt{
  font-family:'Inter', system-ui, sans-serif; font-size:13px; font-weight:500; color:rgba(246,245,241,0.9);
  margin:0 0 16px; padding-top:14px; border-top:1px solid rgba(91,169,213,0.16);
}
.sol-field{ display:flex; flex-direction:column; gap:7px; margin:0 0 14px; }
.sol-label{
  font-family:'Inter', system-ui, sans-serif; font-size:11px; font-weight:600;
  letter-spacing:0.08em; text-transform:uppercase; color:rgba(246,245,241,0.7);
}
.sol-label .req{ color:#d53d47; margin-left:3px; }
.sol-label .opt{ color:rgba(246,245,241,0.4); font-weight:400; text-transform:none; letter-spacing:0; margin-left:5px; }
.sol-input{
  font-family:'Inter', system-ui, sans-serif; font-size:14px; color:#fff;
  padding:12px 14px; border-radius:10px;
  background: rgba(8,12,26,0.6);
  border:1px solid rgba(91,169,213,0.3);
  outline:none;
  transition: border-color 240ms ease, box-shadow 240ms ease;
}
.sol-input::placeholder{ color: rgba(246,245,241,0.38); }
.sol-input:focus{ border-color: rgba(91,169,213,0.75); box-shadow: 0 0 0 3px rgba(91,169,213,0.2); }
.sol-check{
  display:flex; align-items:flex-start; gap:10px; margin:4px 0 18px;
  font-family:'Inter', system-ui, sans-serif; font-size:12.5px; line-height:1.5; color:rgba(246,245,241,0.7); cursor:pointer;
}
.sol-check input{ width:17px; height:17px; margin:1px 0 0; flex:0 0 auto; accent-color:#d53d47; cursor:pointer; }
.sol-check a{ color:#5ba9d5; text-decoration:none; border-bottom:1px solid rgba(91,169,213,0.4); }
.sol-check a:hover{ color:#8ccaee; }
.sol-submit{
  display:block; width:100%; cursor:pointer;
  font-family:'Inter', system-ui, sans-serif; font-size:14px; font-weight:600; letter-spacing:0.03em; color:#fff;
  padding:14px; border-radius:12px; border:none;
  background: linear-gradient(135deg,#d53d47,#b8323b);
  box-shadow: 0 12px 30px -8px rgba(213,61,71,0.6), inset 0 1px 0 rgba(255,255,255,0.22);
  transition: transform 260ms cubic-bezier(.16,1,.3,1), box-shadow 260ms ease, opacity 260ms ease;
}
.sol-submit:hover:not(:disabled){ transform: translateY(-2px); box-shadow: 0 18px 40px -8px rgba(213,61,71,0.72), inset 0 1px 0 rgba(255,255,255,0.28); }
.sol-submit:focus-visible{ outline:2px solid rgba(91,169,213,0.85); outline-offset:2px; }
.sol-submit:disabled{ cursor:not-allowed; opacity:0.42; box-shadow:none; filter:grayscale(0.3); }
.sol-note{
  font-family:'Inter', system-ui, sans-serif; font-size:11px; line-height:1.5; text-align:center;
  color:rgba(246,245,241,0.45); margin:14px 0 0;
}
@media (max-width: 600px){
  .sol-modal{ padding:16px; }
  .sol-panel{ width:100%; }
}
@media (prefers-reduced-motion: reduce){
  .sol-panel{ animation:none !important; }
  .sol-close:hover{ transform:none !important; }
}

/* ============ chapter 05 — My Residence (cinematic interlude) ============ */
.ch05-mr{
  --mr-black: #0a0a0a;
  --mr-warm: #1a1410;
  --mr-gold: #c9a961;
  --mr-champagne: #d4d4cb;
  --mr-cream: #e8e4d8;
  --mr-mx: 50%;
  --mr-my: 50%;
  --mr-spot-opacity: 0;

  position: relative;
  width: 100%;
  min-height: 100vh;
  background: var(--mr-black);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 80px 0;
  color: var(--mr-champagne);
  /* contain mix-blend-mode within this section (so logos don't blend with prior chapters) */
  isolation: isolate;
}

/* ----- background (photo + overlays) ----- */
.ch05-bg{
  position: absolute;
  inset: 0;
  overflow: hidden;
  /* source-order painting handles stacking; no explicit z-index */
}
.ch05-parallax{
  position: absolute;
  inset: -40px 0 0 0;  /* extra top so parallax drift never reveals a gap at the bottom */
  height: calc(100% + 80px);
  transform: translate3d(0, var(--mr-py, 0px), 0);
  will-change: transform;
}
.ch05-image{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.5) contrast(1.1) saturate(0.85);
  opacity: 0;
  transform: scale(1.08);
  transform-origin: center;
  transition: opacity 1200ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 1200ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}
.ch05-mr.is-in .ch05-image{
  opacity: 1;
  transform: scale(1);
}
.ch05-overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(10, 10, 10, 0.85) 0%,
    rgba(26, 20, 16, 0.65) 50%,
    rgba(10, 10, 10, 0.85) 100%
  );
}
.ch05-vignette{
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse at center,
    transparent 30%,
    rgba(10, 10, 10, 0.6) 100%
  );
}

/* ----- cursor spotlight (desktop only) ----- */
.ch05-spotlight{
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(
    400px circle at var(--mr-mx) var(--mr-my),
    rgba(201, 169, 97, 0.08),
    transparent 60%
  );
  opacity: var(--mr-spot-opacity, 0);
  transition: opacity 400ms cubic-bezier(0.22, 1, 0.36, 1);
}
@media (hover: none), (max-width: 767.98px){
  .ch05-spotlight{ display: none; }
}

/* ----- content ----- */
/* No z-index on purpose: keeps mix-blend-mode on the wordmark reaching back
   to the photo backdrop. Source order places content above bg/spotlight/isologo. */
.ch05-content{
  position: relative;
  max-width: 720px;
  padding: 0 32px;
  text-align: center;
  color: var(--mr-champagne);
}

/* ambient isologo — sibling of content, painted between spotlight and content via source order */
.ch05-isologo-bg{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 720px;
  height: 720px;
  margin: -360px 0 0 -360px;
  pointer-events: none;
  opacity: 0;
  transform: rotate(-15deg) scale(0.85);
  transform-origin: center center;
  transition: opacity 800ms cubic-bezier(0.16, 1, 0.3, 1) 800ms,
              transform 800ms cubic-bezier(0.16, 1, 0.3, 1) 800ms;
  will-change: transform, opacity;
}
.ch05-mr.is-in .ch05-isologo-bg{
  opacity: 0.10;
  transform: rotate(0deg) scale(1);
}
.ch05-isologo-img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  mix-blend-mode: lighten;
  animation: mr-ambient-rotate 60s linear infinite;
  animation-delay: 1600ms;
  will-change: transform;
}

@keyframes mr-ambient-rotate{
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes mr-dot-pulse{
  0%, 100% { transform: scale(1); opacity: 1; }
  50%      { transform: scale(1.15); opacity: 0.8; }
}

/* ----- shared entrance pre-state ----- */
.ch05-wordmark,
.ch05-divider,
.ch05-headline,
.ch05-subhead,
.ch05-features .feature-item,
.ch05-cta-row,
.ch05-corner-mark{
  opacity: 0;
  transition: opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 800ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch05-wordmark{ transform: translateY(30px); }
.ch05-divider{ transform: scaleX(0); transform-origin: center; }
.ch05-headline{ transform: translateY(15px); }
.ch05-subhead{ transform: none; }
.ch05-features .feature-item{ transform: translateY(10px); }
.ch05-cta-row{ transform: scale(0.96); }
.ch05-corner-mark{
  transform: none;
  transition: opacity 1200ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* ----- entrance choreography (delay-from-previous-START accumulated) ----- */
/* step 3: wordmark   — starts @ 1200ms */
.ch05-mr.is-in .ch05-wordmark{
  opacity: 1; transform: translateY(0);
  transition-duration: 700ms; transition-delay: 1200ms;
}
/* step 4: divider    — starts @ 1500ms */
.ch05-mr.is-in .ch05-divider{
  opacity: 0.6; transform: scaleX(1);
  transition-duration: 600ms; transition-delay: 1500ms;
}
/* step 5: headline   — starts @ 1700ms */
.ch05-mr.is-in .ch05-headline{
  opacity: 1; transform: translateY(0);
  transition-duration: 800ms; transition-delay: 1700ms;
}
/* step 6: subhead    — starts @ 2000ms */
.ch05-mr.is-in .ch05-subhead{
  opacity: 0.85;
  transition-duration: 600ms; transition-delay: 2000ms;
}
/* step 7: bullets    — first @ 2400ms then +150ms each */
.ch05-mr.is-in .ch05-features .feature-item{
  opacity: 1; transform: translateY(0);
  transition-duration: 500ms;
}
.ch05-mr.is-in .ch05-features .feature-item:nth-child(1){ transition-delay: 2400ms; }
.ch05-mr.is-in .ch05-features .feature-item:nth-child(2){ transition-delay: 2550ms; }
.ch05-mr.is-in .ch05-features .feature-item:nth-child(3){ transition-delay: 2700ms; }
.ch05-mr.is-in .ch05-features .feature-item:nth-child(4){ transition-delay: 2850ms; }
.ch05-mr.is-in .ch05-features .feature-item:nth-child(5){ transition-delay: 3000ms; }
/* step 8: cta        — starts @ 3400ms (400ms after last bullet) */
.ch05-mr.is-in .ch05-cta-row{
  opacity: 1; transform: scale(1);
  transition-duration: 600ms; transition-delay: 3400ms;
}
.ch05-mr.is-in .ch05-corner-mark{
  opacity: 0.5; transition-delay: 3700ms;
}

/* ----- wordmark logo (Image 1) ----- */
.ch05-wordmark{
  display: block;
  width: 340px;
  height: auto;
  margin: 0 auto 24px auto;
  mix-blend-mode: lighten;
  user-select: none;
  -webkit-user-drag: none;
}

.ch05-divider{
  width: 60px;
  height: 1px;
  background: var(--mr-gold);
  opacity: 0;            /* held by pre-state; is-in moves it to 0.6 */
  margin: 0 auto 48px auto;
}

.ch05-headline{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-size: 72px;
  line-height: 1.05;
  font-weight: 400;
  letter-spacing: -0.025em;
  color: var(--mr-cream);
  margin: 0 0 28px 0;
  text-wrap: balance;
}
.headline-period{ color: var(--mr-gold); }
.mr-pulse-dot{
  display: inline-block;
  color: var(--mr-gold);
  transform-origin: center;
  animation: mr-dot-pulse 3s ease-in-out infinite;
  will-change: transform, opacity;
}

.ch05-subhead{
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  color: var(--mr-champagne);
  max-width: 540px;
  margin: 0 auto 48px auto;
}

.ch05-features{
  list-style: none;
  padding: 0;
  margin: 0 auto 56px auto;
  max-width: 480px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.ch05-features .feature-item{
  display: flex;
  align-items: center;
  gap: 26px;
  text-align: left;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: var(--mr-champagne);
  letter-spacing: 0.01em;
  cursor: default;
}
.ch05-features .feature-item .feature-text{
  transition: letter-spacing 300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch05-features .feature-item .feature-icon{
  transition: filter 300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch05-features .feature-item:hover .feature-icon{
  filter: brightness(1.2);
}
.ch05-features .feature-item:hover .feature-text{
  letter-spacing: 0.03em;
}
.ch05-features .feature-icon{
  width: 6px;
  height: 6px;
  background: var(--mr-gold);
  border-radius: 50%;
  flex-shrink: 0;
  position: relative;
  margin: 0 6px;
}
.ch05-features .feature-icon::before{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(201, 169, 97, 0.35);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.ch05-cta-row{
  display: flex;
  justify-content: center;
}
.ch05-cta-primary{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 18px 36px;
  background: transparent;
  border: 1px solid var(--mr-gold);
  color: var(--mr-gold);
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 999px;
  transition: letter-spacing 400ms cubic-bezier(0.22, 1, 0.36, 1),
              color 400ms cubic-bezier(0.22, 1, 0.36, 1),
              border-color 400ms cubic-bezier(0.22, 1, 0.36, 1);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.ch05-cta-primary::before{
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(201, 169, 97, 0.35) 0%,
    transparent 70%
  );
  transform: translate(-50%, -50%) scale(0);
  transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
  z-index: -1;
  pointer-events: none;
}
.ch05-cta-primary:hover::before{ transform: translate(-50%, -50%) scale(1.5); }
.ch05-cta-primary:hover{
  letter-spacing: 0.22em;
  border-color: var(--mr-gold);
  color: var(--mr-gold);
}
.ch05-cta-primary .cta-text,
.ch05-cta-primary .cta-arrow{
  position: relative;
}
.ch05-cta-primary .cta-arrow{
  transition: transform 380ms cubic-bezier(0.22, 1, 0.36, 1);
  font-family: 'Inter', system-ui, sans-serif;
}
.ch05-cta-primary:hover .cta-arrow{ transform: translateX(4px); }

.ch05-corner-mark{
  position: absolute;
  bottom: 32px;
  right: 40px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--mr-gold);
  opacity: 0;            /* pre-anim; is-in pushes to 0.5 */
  z-index: 2;
}

@media (max-width: 768px){
  .ch05-content{ padding: 0 24px; }
  .ch05-wordmark{ width: 200px; }
  .ch05-isologo-bg{
    width: 380px; height: 380px;
    margin: -190px 0 0 -190px;
  }
  .ch05-headline{ font-size: 40px; line-height: 1.1; }
  .ch05-subhead{ font-size: 15px; margin-bottom: 36px; }
  .ch05-features{ margin-bottom: 40px; }
  .ch05-features .feature-item{ font-size: 14px; }
  .ch05-cta-primary{ padding: 14px 28px; font-size: 12px; }
  .ch05-corner-mark{ bottom: 20px; right: 24px; font-size: 8px; }
  .ch05-mr{ min-height: 90vh; }
}
@media (min-width: 768.01px) and (max-width: 1024px){
  .ch05-wordmark{ width: 240px; }
  .ch05-isologo-bg{
    width: 520px; height: 520px;
    margin: -260px 0 0 -260px;
  }
}

/* short viewports — drop 100vh floor, shrink headline so content fits without overlap */
@media (max-height: 760px){
  .ch05-mr{
    min-height: 0;
    padding: 96px 0 88px;
  }
  .ch05-headline{ font-size: 56px; }
  .ch05-divider{ margin-bottom: 36px; }
  .ch05-subhead{ margin-bottom: 36px; }
  .ch05-features{ margin-bottom: 44px; }
}
@media (max-height: 600px){
  .ch05-headline{ font-size: 44px; }
}

@media (prefers-reduced-motion: reduce){
  .ch05-image,
  .ch05-isologo-bg,
  .ch05-wordmark,
  .ch05-divider,
  .ch05-headline,
  .ch05-subhead,
  .ch05-features .feature-item,
  .ch05-cta-row,
  .ch05-corner-mark{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .ch05-isologo-bg{ opacity: 0.10 !important; }
  .ch05-divider{ opacity: 0.6 !important; transform: scaleX(1) !important; }
  .ch05-corner-mark{ opacity: 0.5 !important; }
  .ch05-isologo-img{ animation: none !important; }
  .mr-pulse-dot{ animation: none !important; }
  .ch05-parallax{ transform: none !important; }
  .ch05-spotlight{ display: none !important; }
}

/* ============ chapter 07 — La Red Habla (editorial testimonials) ============ */
.ch07-red-habla{
  --tz07-paper: #f6f5f1;
  --tz07-ink: #0a0a1a;
  --tz07-blue: #253e5c;
  --tz07-navy: #0b0b4f;
  --tz07-sky: #5ba9d5;
  --tz07-coral: #d53d47;
  --tz07-gold: #c9a961;

  position: relative;
  width: 100%;
  min-height: 110vh;
  background-color: var(--tz07-paper);
  background-image: linear-gradient(135deg,
    rgba(91, 169, 213, 0.04) 0%,
    transparent 50%,
    rgba(11, 11, 79, 0.03) 100%);
  padding: 120px 80px;
  overflow: hidden;
  isolation: isolate;
  color: var(--tz07-ink);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* film grain via inline noise SVG */
.ch07-noise{
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.05;
  z-index: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  mix-blend-mode: multiply;
}

/* decorative blobs */
.ch07-blob{
  position: absolute;
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  transition: opacity 1200ms cubic-bezier(0.16, 1, 0.3, 1);
  filter: blur(60px);
}
.ch07-red-habla.tz-in .ch07-blob{ opacity: 1; }
.ch07-blob-a{
  top: 4%; right: -140px;
  width: 540px; height: 540px;
  background: radial-gradient(circle, rgba(91, 169, 213, 0.12), transparent 70%);
}
.ch07-blob-b{
  bottom: -140px; left: -100px;
  width: 480px; height: 480px;
  background: radial-gradient(circle, rgba(37, 62, 92, 0.10), transparent 70%);
}

.ch07-content{
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

/* ----- eyebrow ----- */
.ch07-eyebrow-block{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 0;
}
.ch07-coral-line{
  width: 80px;
  height: 1px;
  background: var(--tz07-coral);
  margin-bottom: 16px;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-coral-line{
  transform: scaleX(1);
  transition-delay: 200ms;
}
.ch07-eyebrow{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--tz07-blue);
  opacity: 0;
  transition: opacity 600ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-eyebrow{
  opacity: 1;
  transition-delay: 350ms;
}

/* ----- headline + subhead ----- */
.ch07-headline{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400;
  font-size: 72px;
  letter-spacing: -0.02em;
  color: var(--tz07-ink);
  line-height: 1.05;
  max-width: 720px;
  margin: 32px 0 24px 0;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 800ms cubic-bezier(0.16, 1, 0.3, 1);
  text-wrap: balance;
}
.ch07-red-habla.tz-in .ch07-headline{
  opacity: 1;
  transform: translateY(0);
  transition-delay: 700ms;
}
.tz-coral-dot{ color: var(--tz07-coral); }

.ch07-subhead{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400;
  font-size: 18px;
  letter-spacing: -0.005em;
  color: var(--tz07-blue);
  line-height: 1.5;
  max-width: 600px;
  margin: 0 0 80px 0;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 600ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-subhead{
  opacity: 1;
  transform: translateY(0);
  transition-delay: 1100ms;
}

/* ----- mosaic ----- */
.ch07-mosaic{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 64px;
  align-items: start;
}
.ch07-main{
  grid-column: 1 / span 7;
  position: relative;
  padding: 60px 16px 16px 16px;
  border-radius: 8px;
  /* entrance: translate + opacity (delayed). hover: scale + background (no delay).
     Using the individual `translate` property + `scale` property so they compose
     without the entrance transition stealing the hover timing. */
  translate: 0 15px;
  opacity: 0;
  scale: 1;
  background: radial-gradient(circle at center, rgba(91, 169, 213, 0) 0%, transparent 70%);
  transition:
    translate 700ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity   700ms cubic-bezier(0.16, 1, 0.3, 1),
    scale     400ms cubic-bezier(0.22, 1, 0.36, 1),
    background 400ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: translate, scale, opacity, background;
}
.ch07-red-habla.tz-in .ch07-main{
  translate: 0 0;
  opacity: 1;
  transition-delay: 1500ms, 1500ms, 0s, 0s;
}
.ch07-main:hover{
  scale: 1.015;
  background: radial-gradient(circle at center, rgba(91, 169, 213, 0.08) 0%, transparent 70%);
}
.ch07-side{
  grid-column: 9 / span 4;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.ch07-quote-mark{
  position: absolute;
  top: -10px;
  left: 4px;
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-size: 120px;
  line-height: 1;
  color: rgba(213, 61, 71, 0.20);
  user-select: none;
  pointer-events: none;
  opacity: 0;
  transform: translateY(15px);
  transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-quote-mark{
  opacity: 1; transform: translateY(0);
  transition-delay: 1500ms;
}

.ch07-main-text{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400;
  font-size: 32px;
  letter-spacing: -0.01em;
  color: var(--tz07-ink);
  line-height: 1.4;
  margin: 0;
  text-wrap: pretty;
  opacity: 0;
  transform: translateY(15px);
  transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-main-text{
  opacity: 1; transform: translateY(0);
  transition-delay: 1600ms;
}

.ch07-gold-divider{
  width: 30px;
  height: 1px;
  background: var(--tz07-gold);
  margin: 32px 0 24px 0;
  border: 0;
  opacity: 0;
  transform: translateY(15px);
  transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-gold-divider{
  opacity: 1; transform: translateY(0);
  transition-delay: 1700ms;
}

.ch07-author-line{
  display: flex;
  align-items: center;
  opacity: 0;
  transform: translateY(15px);
  transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-main .ch07-author-line{
  opacity: 1; transform: translateY(0);
  transition-delay: 1800ms;
}
.ch07-coral-bullet{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--tz07-coral);
  margin-right: 12px;
  flex: 0 0 6px;
  display: inline-block;
  transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ch07-main:hover .ch07-coral-bullet{
  transform: scale(1.2);
}
.ch07-author-name{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--tz07-blue);
}
.ch07-author-city{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.05em;
  color: var(--tz07-sky);
  margin-top: 6px;
  margin-left: 18px;
  opacity: 0;
  transform: translateY(15px);
  transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
}
.ch07-red-habla.tz-in .ch07-main .ch07-author-city{
  opacity: 1; transform: translateY(0);
  transition-delay: 1850ms;
}

/* ----- secondary cards ----- */
.ch07-card{
  padding: 24px 16px;
  position: relative;
  border-radius: 6px;
  translate: 0 10px;
  opacity: 0;
  scale: 1;
  background: radial-gradient(circle at center, rgba(91, 169, 213, 0) 0%, transparent 70%);
  transition:
    translate 600ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity   600ms cubic-bezier(0.16, 1, 0.3, 1),
    scale     400ms cubic-bezier(0.22, 1, 0.36, 1),
    background 400ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: translate, scale, opacity, background;
}
.ch07-card + .ch07-card{
  border-top: 1px solid rgba(11, 11, 79, 0.10);
}
.ch07-card:hover{
  scale: 1.015;
  background: radial-gradient(circle at center, rgba(91, 169, 213, 0.08) 0%, transparent 70%);
}
.ch07-red-habla.tz-in .ch07-card:nth-of-type(1){
  translate: 0 0; opacity: 1;
  transition-delay: 2100ms, 2100ms, 0s, 0s;
}
.ch07-red-habla.tz-in .ch07-card:nth-of-type(2){
  translate: 0 0; opacity: 1;
  transition-delay: 2250ms, 2250ms, 0s, 0s;
}
.ch07-card-text{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400;
  font-style: italic;
  font-size: 18px;
  letter-spacing: -0.005em;
  color: var(--tz07-ink);
  line-height: 1.5;
  margin: 0 0 20px 0;
  text-wrap: pretty;
}
.ch07-card .ch07-author-line{
  opacity: 1;
  transform: none;
  transition: none;
}
.ch07-card .ch07-author-name{
  font-size: 11px;
}
.ch07-card .ch07-author-city{
  font-size: 11px;
  margin-left: 0;
  margin-top: 4px;
  opacity: 1;
  transform: none;
  transition: none;
}

/* ----- responsive ----- */
@media (max-width: 768px){
  .ch07-red-habla{
    padding: 80px 24px;
    min-height: 0;
  }
  .ch07-headline{ font-size: 40px; margin: 24px 0 20px 0; }
  .ch07-subhead{ font-size: 16px; margin-bottom: 48px; max-width: 100%; }
  .ch07-mosaic{
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .ch07-main{ grid-column: 1 / -1; padding-top: 48px; }
  .ch07-side{ grid-column: 1 / -1; gap: 24px; }
  .ch07-quote-mark{ font-size: 88px; top: -8px; }
  .ch07-main-text{ font-size: 22px; }
  .ch07-card-text{ font-size: 16px; }
}

@media (prefers-reduced-motion: reduce){
  .ch07-coral-line,
  .ch07-eyebrow,
  .ch07-headline,
  .ch07-subhead,
  .ch07-main,
  .ch07-quote-mark,
  .ch07-main-text,
  .ch07-gold-divider,
  .ch07-main .ch07-author-line,
  .ch07-main .ch07-author-city,
  .ch07-card,
  .ch07-blob{
    opacity: 1 !important;
    transform: none !important;
    translate: 0 0 !important;
    transition: none !important;
  }
  .ch07-coral-line{ transform: scaleX(1) !important; }
  .ch07-main:hover, .ch07-card:hover{
    scale: 1 !important;
    background: transparent !important;
  }
  .ch07-main:hover .ch07-coral-bullet{ transform: none !important; }
}

/* ============ chapter 08 — Nuestro Respaldo (institutional trust chamber) ============ */
.ch08-respaldo{
  --tz08-sky:#5ba9d5; --tz08-med:#4c7db1; --tz08-coral:#d53d47; --tz08-navy:#0b0b4f;
  position:relative;
  background:
    radial-gradient(85% 65% at 16% 10%, rgba(37,62,92,0.55) 0%, transparent 55%),
    radial-gradient(70% 60% at 90% 88%, rgba(91,169,213,0.10) 0%, transparent 60%),
    linear-gradient(160deg, #0c0c3a 0%, #090926 48%, #06061a 100%);
  color:#eaf1f8;
  padding: clamp(72px, 9vh, 112px) 0;
  overflow:hidden;
  isolation:isolate;
  font-family:'Inter', system-ui, sans-serif;
  min-height: 100vh;
  display:flex; align-items:center; justify-content:center;
}
/* ---- night villa photo, integrated into the right of the navy field ---- */
.ch08-photo{ position:absolute; top:0; right:0; bottom:0; width:44%; z-index:0; overflow:hidden; background:#07071c; }
.ch08-photo img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
  filter: brightness(0.6) saturate(1.06) blur(16px);
  transform: scale(1.08);
  opacity:0;
  transition: filter 1.4s cubic-bezier(.22,1,.36,1), transform 9s cubic-bezier(.22,1,.36,1), opacity .9s ease;
}
.ch08-photo img.is-loaded{ opacity:1; }
.ch08-respaldo.ch08-in .ch08-photo img{ filter: brightness(0.6) saturate(1.06) blur(0); transform: scale(1.0); animation: ch08-photo-drift 26s ease-in-out 1.6s infinite alternate; }
@keyframes ch08-photo-drift{ 0%{ transform: scale(1.0) translate3d(0,0,0); } 100%{ transform: scale(1.04) translate3d(-1.2%,0.6%,0); } }
.ch08-photo::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(90deg, #07071c 0%, rgba(7,7,28,0.92) 22%, rgba(9,10,40,0.5) 46%, rgba(9,10,40,0.12) 78%),
    linear-gradient(180deg, rgba(7,7,28,0.6) 0%, transparent 22%, transparent 76%, rgba(7,7,28,0.7) 100%),
    radial-gradient(60% 50% at 72% 46%, rgba(37,62,92,0.32), transparent 70%);
}
/* ---- restrained network / route lines ---- */
.ch08-netlines{ position:absolute; top:0; right:0; width:54%; height:62%; z-index:0; pointer-events:none; opacity:0; transition: opacity 1.6s ease .6s; }
.ch08-respaldo.ch08-in .ch08-netlines{ opacity:.5; }
.ch08-netlines svg{ width:100%; height:100%; display:block; animation: ch08-net-drift 26s ease-in-out infinite; }
@keyframes ch08-net-drift{ 0%,100%{ transform:translate3d(0,0,0) } 50%{ transform:translate3d(-1.6%,1.1%,0) } }

.ch08-content{ position:relative; z-index:2; width:100%; max-width:1560px; padding: 0 clamp(28px, 4vw, 76px); }

/* ---- opening (header) ---- */
.ch08-top{ display:grid; grid-template-columns: minmax(340px, 0.82fr) 1.45fr; gap: clamp(36px,4vw,76px); align-items:start; }
.ch08-open{ padding-top:4px; }
.ch08-eyebrow-row{ display:flex; align-items:center; gap:13px; opacity:0; transform:translateY(10px);
  transition: opacity .7s cubic-bezier(.16,1,.3,1) .15s, transform .7s cubic-bezier(.16,1,.3,1) .15s; }
.ch08-respaldo.ch08-in .ch08-eyebrow-row{ opacity:1; transform:none; }
.ch08-cap{ font-family:'Inter'; font-weight:600; font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:#cdd9e6; }
.ch08-cap-line{ width:46px; height:1px; background:linear-gradient(90deg,#d53d47,rgba(91,169,213,.5)); }
.ch08-cap-dot{ width:5px; height:5px; border-radius:50%; background:#d53d47; flex:0 0 5px; }
.ch08-cap-sub{ font-family:'Inter'; font-weight:600; font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:var(--tz08-sky); }
.ch08-headline{ font-family:'Fraunces','Cormorant Garamond',Georgia,serif; font-weight:400; font-size:clamp(40px,4.6vw,76px); line-height:1.02; letter-spacing:-0.025em; color:#fff; margin:26px 0 0; text-wrap:balance;
  opacity:0; transform:translateY(20px); filter:blur(5px);
  transition: opacity .9s cubic-bezier(.16,1,.3,1) .35s, transform .9s cubic-bezier(.16,1,.3,1) .35s, filter .9s cubic-bezier(.16,1,.3,1) .35s; }
.ch08-respaldo.ch08-in .ch08-headline{ opacity:1; transform:none; filter:none; }
.ch08-hl-licencia{ color:var(--tz08-sky); }
.ch08-coral-dot{ color:var(--tz08-coral); }
.ch08-subhead{ font-family:'Inter'; font-weight:400; font-size:clamp(15px,1.15vw,18px); line-height:1.6; color:rgba(234,241,248,0.76); margin:22px 0 0; max-width:40ch;
  opacity:0; transform:translateY(14px);
  transition: opacity .8s cubic-bezier(.16,1,.3,1) .55s, transform .8s cubic-bezier(.16,1,.3,1) .55s; }
.ch08-respaldo.ch08-in .ch08-subhead{ opacity:1; transform:none; }
.ch08-subhead b{ font-weight:600; color:var(--tz08-sky); }
.ch08-subhead .med{ color:#7fb4dd; font-weight:600; }

/* ---- institutional cards ---- */
.ch08-accreds{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.ch08-card{ position:relative; padding:24px 22px 22px; border-radius:16px;
  background: linear-gradient(180deg, rgba(18,20,62,0.62) 0%, rgba(10,11,38,0.72) 100%);
  border:1px solid rgba(91,169,213,0.22);
  backdrop-filter: blur(14px) saturate(120%); -webkit-backdrop-filter: blur(14px) saturate(120%);
  box-shadow: 0 18px 44px -22px rgba(0,0,0,0.65), inset 0 1px 0 rgba(255,255,255,0.05);
  display:flex; flex-direction:column;
  opacity:0; transform:translateY(24px);
  transition: opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1), border-color .35s ease, box-shadow .35s ease; }
.ch08-respaldo.ch08-in .ch08-card{ opacity:1; transform:none; }
.ch08-respaldo.ch08-in .ch08-card:nth-child(1){ transition-delay:.8s,.8s,0s,0s; }
.ch08-respaldo.ch08-in .ch08-card:nth-child(2){ transition-delay:.94s,.94s,0s,0s; }
.ch08-respaldo.ch08-in .ch08-card:nth-child(3){ transition-delay:1.08s,1.08s,0s,0s; }
.ch08-card:hover{ border-color:rgba(91,169,213,0.55); box-shadow:0 28px 60px -24px rgba(0,0,0,0.7), 0 0 0 1px rgba(91,169,213,0.18); transform:translateY(-6px); }
.ch08-card-eyebrow{ font-family:'Inter'; font-weight:600; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--tz08-sky); line-height:1.45; margin-bottom:14px; min-height:30px; }
.ch08-card-title{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:22px; line-height:1.12; color:#fff; margin:0 0 6px; }
.ch08-card-id{ display:flex; align-items:center; gap:14px; margin-bottom:6px; }
.ch08-card-id .ch08-card-title{ margin:0; }
.ch08-card-logo{ flex:0 0 auto; height:46px; width:auto; max-width:94px; object-fit:contain; object-position:left center; display:block; }
.ch08-card-logo-iata{ height:48px; filter: drop-shadow(0 0 10px rgba(91,169,213,0.45)); }
.ch08-card-logo-aimx{ height:42px; filter: drop-shadow(0 0 10px rgba(91,169,213,0.4)); }
.ch08-card-sub{ font-family:'Inter'; font-weight:400; font-size:12.5px; color:rgba(234,241,248,0.6); margin:0; }
.ch08-card-rule{ width:30px; height:1.5px; background:rgba(91,169,213,0.5); margin:16px 0; }
.ch08-rnt{ font-family:'Inter'; font-weight:600; font-size:14px; letter-spacing:.02em; color:var(--tz08-coral); margin:0; }
.ch08-rnt-vig{ font-family:'Inter'; font-weight:400; font-size:12.5px; color:rgba(234,241,248,0.62); margin:5px 0 0; }
.ch08-card-body{ font-family:'Inter'; font-weight:400; font-size:13px; line-height:1.55; color:rgba(234,241,248,0.66); margin:0; }
.ch08-verify{ font-family:'Inter'; font-weight:500; font-size:12.5px; color:var(--tz08-sky); text-decoration:none; margin-top:auto; padding-top:18px; display:inline-flex; align-items:center; gap:6px; }
.ch08-arrow{ display:inline-block; transition: transform .3s cubic-bezier(.22,1,.36,1); }
.ch08-verify:hover{ color:#9ed0ee; }
.ch08-verify:hover .ch08-arrow{ transform:translateX(4px); }

/* ---- red security + banks panel ---- */
.ch08-unified-block{ position:relative; margin: clamp(34px,4.2vh,54px) 0 0; border-radius:20px; overflow:hidden;
  display:grid; grid-template-columns: 1.22fr 1fr;
  background: linear-gradient(135deg, #5a0e16 0%, #7d141d 40%, #380810 100%);
  border:1px solid rgba(213,61,71,0.55);
  box-shadow: 0 30px 72px -26px rgba(213,61,71,0.5), 0 0 0 1px rgba(213,61,71,0.2), inset 0 1px 0 rgba(255,180,180,0.14);
  opacity:0; transform:translateY(26px) scale(.99);
  transition: opacity .9s cubic-bezier(.16,1,.3,1) 1.4s, transform .9s cubic-bezier(.16,1,.3,1) 1.4s; }
.ch08-respaldo.ch08-in .ch08-unified-block{ opacity:1; transform:none; }
.ch08-unified-block::before{ content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background: radial-gradient(55% 95% at 12% 50%, rgba(255,72,84,0.32), rgba(150,22,30,0.14) 44%, transparent 66%);
  animation: ch08-red-breathe 6.5s ease-in-out infinite; }
@keyframes ch08-red-breathe{ 0%,100%{ opacity:.62 } 50%{ opacity:1 } }
.ch08-warning-half{ position:relative; z-index:1; padding: clamp(30px,3vw,44px); display:flex; flex-direction:row; align-items:center; gap:clamp(20px,2.2vw,36px); }
.ch08-warn-text{ display:flex; flex-direction:column; gap:14px; align-items:flex-start; min-width:0; }
/* dramatic luminous shield trophy */
.ch08-shield-stage{ position:relative; flex:0 0 auto; width:148px; height:176px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.ch08-shield-disc{ position:relative; z-index:3; width:106px; height:106px; border-radius:50%; display:grid; place-items:center; color:#ff5a63;
  background: radial-gradient(circle at 50% 40%, rgba(255,96,104,0.5), rgba(150,24,30,0.5) 58%, rgba(80,12,18,0.15) 100%);
  border:1.5px solid rgba(255,124,132,0.62);
  box-shadow: 0 0 42px rgba(255,66,78,0.5), inset 0 0 28px rgba(255,80,90,0.32), 0 0 0 1px rgba(255,150,158,0.22); }
.ch08-shield-disc svg{ filter: drop-shadow(0 0 10px rgba(255,96,104,0.85)); }
.ch08-respaldo.ch08-in .ch08-shield-disc{ animation: ch08-disc-breathe 4.6s ease-in-out 1.8s infinite; }
@keyframes ch08-disc-breathe{ 0%,100%{ box-shadow:0 0 34px rgba(255,66,78,0.42), inset 0 0 26px rgba(255,80,90,0.28), 0 0 0 1px rgba(255,150,158,0.2); } 50%{ box-shadow:0 0 54px rgba(255,66,78,0.62), inset 0 0 30px rgba(255,80,90,0.38), 0 0 0 1px rgba(255,150,158,0.3); } }
.ch08-shield-rings{ position:absolute; top:53px; left:50%; transform:translate(-50%,-50%); width:106px; height:106px; border-radius:50%; z-index:1;
  box-shadow: 0 0 0 9px rgba(255,66,78,0.10), 0 0 0 22px rgba(255,66,78,0.05), 0 0 0 36px rgba(255,66,78,0.025); }
.ch08-respaldo.ch08-in .ch08-shield-rings{ animation: ch08-rings 3.6s ease-out 1.8s infinite; }
@keyframes ch08-rings{ 0%{ box-shadow:0 0 0 4px rgba(255,66,78,0.24), 0 0 0 14px rgba(255,66,78,0.12), 0 0 0 26px rgba(255,66,78,0.05);} 100%{ box-shadow:0 0 0 18px rgba(255,66,78,0), 0 0 0 32px rgba(255,66,78,0), 0 0 0 48px rgba(255,66,78,0);} }
.ch08-shield-base{ position:relative; z-index:2; margin-top:-4px; width:94px; height:18px; border-radius:50%;
  background: radial-gradient(ellipse at 50% 28%, rgba(255,118,126,0.55), rgba(120,20,26,0.4) 58%, transparent 80%);
  box-shadow: 0 0 30px rgba(255,66,78,0.5); }
.ch08-shield-reflect{ position:absolute; z-index:1; bottom:14px; left:50%; transform:translateX(-50%); width:56px; height:44px;
  background: linear-gradient(180deg, rgba(255,96,104,0.34), transparent 82%); filter: blur(6px); opacity:.6; }
.ch08-warn-claim{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:clamp(28px,2.6vw,40px); line-height:1.05; color:#fff; margin:0; }
.ch08-warn-claim .tzred{ color:#ff5a63; }
.ch08-warn-body{ font-family:'Inter'; font-weight:400; font-size:14.5px; line-height:1.6; color:rgba(255,236,236,0.86); margin:0; max-width:48ch; }
.ch08-warn-verify{ font-family:'Inter'; font-weight:600; font-size:15px; color:#ff7a82; margin:4px 0 0; }
.ch08-warn-verify .u{ border-bottom:1.5px solid rgba(255,122,130,0.6); padding-bottom:2px; }
.ch08-banks-half{ position:relative; z-index:1; padding: clamp(30px,3vw,44px); display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  border-left:1px solid rgba(255,150,150,0.2); background: rgba(0,0,0,0.16); }
.ch08-banks-eyebrow{ font-family:'Inter'; font-weight:600; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#ff9aa0; }
.ch08-banks-holder{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:clamp(20px,1.7vw,26px); color:#fff; margin-top:8px; }
.ch08-banks-row{ display:flex; align-items:flex-start; gap:clamp(20px,2.4vw,40px); margin-top:24px; flex-wrap:wrap; }
.ch08-bank-col{ display:flex; flex-direction:column; gap:9px; align-items:flex-start; }
.ch08-bank-bbva{ width:148px; height:58px; object-fit:cover; border-radius:12px; border:1px solid rgba(255,255,255,0.12); display:block; }
.ch08-bank-chip{ width:148px; height:58px; border-radius:12px; border:1px solid rgba(255,255,255,0.12); background:linear-gradient(135deg,#0a1b3a,#0a1024); display:flex; align-items:center; justify-content:center; }
.ch08-bank-svg{ height:26px; width:auto; display:block; }
.ch08-bank-cap{ font-family:'Inter'; font-weight:500; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,236,236,0.72); }
.ch08-banks-note{ font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:400; font-size:15px; color:rgba(255,236,236,0.86); margin-top:22px; }

/* ---- contact strip ---- */
.ch08-channels{ margin-top: clamp(22px,2.8vh,36px); display:grid; grid-template-columns:repeat(3,1fr);
  background: linear-gradient(180deg, rgba(18,20,62,0.5), rgba(10,11,38,0.55));
  border:1px solid rgba(91,169,213,0.2); border-radius:18px; overflow:hidden;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.ch08-ch{ display:flex; align-items:center; gap:16px; padding: clamp(20px,2vw,28px) clamp(20px,2.2vw,32px); text-decoration:none; color:inherit; border-left:1px solid rgba(91,169,213,0.14);
  opacity:0; transform:translateY(14px);
  transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1), background .3s ease; }
.ch08-ch:first-child{ border-left:none; }
.ch08-respaldo.ch08-in .ch08-ch{ opacity:1; transform:none; }
.ch08-respaldo.ch08-in .ch08-ch:nth-child(1){ transition-delay:1.9s,1.9s; }
.ch08-respaldo.ch08-in .ch08-ch:nth-child(2){ transition-delay:2.0s,2.0s; }
.ch08-respaldo.ch08-in .ch08-ch:nth-child(3){ transition-delay:2.1s,2.1s; }
.ch08-ch:hover{ background: rgba(91,169,213,0.07); }
.ch08-ch-icon{ width:48px; height:48px; border-radius:50%; flex:0 0 48px; display:grid; place-items:center; }
.ch08-ch-icon-wa{ background:linear-gradient(180deg,#25d366,#128c4f); color:#fff; box-shadow:0 6px 18px -6px rgba(37,211,102,0.6); }
.ch08-respaldo.ch08-in .ch08-ch-icon-wa{ animation: ch08-wa-halo 3s ease-in-out 2.4s infinite; }
@keyframes ch08-wa-halo{ 0%,100%{ box-shadow:0 6px 18px -6px rgba(37,211,102,0.6), 0 0 0 0 rgba(37,211,102,0); } 50%{ box-shadow:0 6px 18px -6px rgba(37,211,102,0.6), 0 0 0 5px rgba(37,211,102,0.22); } }
.ch08-ch-icon-blue{ background: rgba(91,169,213,0.14); border:1px solid rgba(91,169,213,0.5); color:var(--tz08-sky); }
.ch08-ch-info{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.ch08-ch-label{ font-family:'Inter'; font-weight:600; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--tz08-sky); }
.ch08-ch-val{ font-family:'Inter'; font-weight:500; font-size:clamp(14px,1.05vw,17px); color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ch08-ch-meta{ font-family:'Inter'; font-weight:400; font-size:12px; color:rgba(234,241,248,0.55); }

/* ---- responsive ---- */
@media (max-width:1180px){
  .ch08-top{ grid-template-columns:1fr; gap:34px; }
  .ch08-headline{ max-width:18ch; }
  .ch08-photo{ width:42%; }
  .ch08-netlines{ width:46%; }
}
@media (max-width:900px){
  .ch08-respaldo{ min-height:0; display:flex; flex-direction:column; padding: 64px 0 0; }
  .ch08-content{ order:1; }
  .ch08-netlines{ display:none; }
  .ch08-photo{ position:relative; order:2; width:100%; height:240px; margin-top:48px; }
  .ch08-photo img{ filter: brightness(0.62) saturate(1.06) blur(0) !important; transform:none !important; animation:none !important; }
  .ch08-photo::after{ background: linear-gradient(180deg, #07071c 0%, rgba(7,7,28,0.3) 30%, transparent 60%), radial-gradient(70% 60% at 50% 40%, rgba(37,62,92,0.3), transparent 70%); }
  .ch08-unified-block{ grid-template-columns:1fr; }
  .ch08-banks-half{ border-left:none; border-top:1px solid rgba(255,150,150,0.2); }
}
@media (max-width:760px){
  .ch08-accreds{ grid-template-columns:1fr; }
  .ch08-channels{ grid-template-columns:1fr; }
  .ch08-ch{ border-left:none; border-top:1px solid rgba(91,169,213,0.14); }
  .ch08-ch:first-child{ border-top:none; }
  .ch08-headline{ font-size:clamp(36px,9vw,52px); max-width:none; }
  .ch08-warning-half{ flex-direction:column; align-items:flex-start; gap:20px; }
  .ch08-shield-stage{ width:130px; height:150px; }
  .ch08-warn-claim{ font-size:28px; }
  .ch08-banks-row{ gap:20px; }
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  .ch08-photo img, .ch08-netlines svg, .ch08-unified-block::before, .ch08-shield-disc, .ch08-shield-rings, .ch08-ch-icon-wa{ animation:none !important; }
  .ch08-eyebrow-row, .ch08-headline, .ch08-subhead, .ch08-card, .ch08-unified-block, .ch08-ch{
    opacity:1 !important; transform:none !important; filter:none !important;
    transition: border-color 200ms ease, box-shadow 200ms ease, background 200ms ease !important;
  }
  .ch08-photo img{ filter: brightness(0.6) saturate(1.06) blur(0) !important; transform:none !important; opacity:1 !important; }
  .ch08-netlines{ opacity:.4 !important; }
  .ch08-card:hover, .ch08-unified-block:hover{ transform:none !important; }
}


/* ============ chapter 06 — Travel Zone Privilege ============ */
.ch06-privilege{
  --c6-sky:#5ba9d5; --c6-coral:#d53d47; --c6-gold:#c9a961; --c6-paper:#f6f5f1;
  position:relative; isolation:isolate; overflow:hidden;
  background: linear-gradient(180deg, #0b0b4f 0%, #0b1d3a 42%, #080812 100%);
  color:#f6f5f1; font-family:'Inter', system-ui, sans-serif;
  padding: clamp(72px,8vh,112px) 0 clamp(48px,6vh,76px);
}
.ch06-inner{ position:relative; z-index:2; max-width:1500px; margin:0 auto; padding:0 clamp(24px,4vw,72px); }

/* hero */
.ch06-hero{ position:relative; min-height:clamp(432px,58vh,624px); }
.ch06-mosaic{ position:absolute; top:0; bottom:0; left:50%; width:100vw; margin-left:-50vw; z-index:0; display:flex; gap:0; background:#080812; will-change:transform; }
.ch06-tile{ position:relative; flex:1; overflow:hidden; background:#080812; }
.ch06-tile .c6img{ position:absolute; inset:-6%; width:112%; height:112%; object-fit:cover; opacity:0; filter:brightness(1.12) saturate(1.06); transition:opacity 1.1s ease; will-change:transform; }
.ch06-tile .c6img.is-loaded{ opacity:1; }
.ch06-privilege.ch06-in .ch06-tile-1 .c6img{ animation:c6kb-a 28s ease-in-out infinite alternate; }
.ch06-privilege.ch06-in .ch06-tile-2 .c6img{ animation:c6kb-b 32s ease-in-out infinite alternate; }
.ch06-privilege.ch06-in .ch06-tile-3 .c6img{ animation:c6kb-c 30s ease-in-out infinite alternate; }
.ch06-privilege.ch06-in .ch06-tile-4 .c6img{ animation:c6kb-d 34s ease-in-out infinite alternate; }
@keyframes c6kb-a{ 0%{transform:scale(1.0) translate(0,0)} 100%{transform:scale(1.09) translate(-2%,-1.5%)} }
@keyframes c6kb-b{ 0%{transform:scale(1.06) translate(1%,0)} 100%{transform:scale(1.0) translate(-1%,1.5%)} }
@keyframes c6kb-c{ 0%{transform:scale(1.0) translate(0,1%)} 100%{transform:scale(1.08) translate(1.5%,-1%)} }
@keyframes c6kb-d{ 0%{transform:scale(1.08) translate(-1%,0)} 100%{transform:scale(1.0) translate(1%,-1.5%)} }
.ch06-mosaic::after{ content:''; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(8,8,18,0.95) 0%, rgba(8,10,24,0.8) 30%, rgba(8,10,24,0.35) 55%, rgba(8,8,18,0.55) 100%),
    linear-gradient(180deg, rgba(8,8,18,0.5) 0%, transparent 22%, transparent 72%, rgba(8,8,18,0.66) 100%); }

.ch06-hero-inner{ position:relative; z-index:2; display:flex; flex-direction:column; min-height:clamp(432px,58vh,624px); padding-top:6px; }

.ch06-label{ }
.ch06-cap{ display:block; color:var(--c6-sky); font-weight:500; font-size:10px; letter-spacing:.3em; text-transform:uppercase; }
.ch06-cap2{ display:block; color:rgba(246,245,241,0.6); font-size:11px; letter-spacing:.24em; text-transform:uppercase; margin-top:7px; }
.ch06-cap-line{ width:118px; height:1px; background:linear-gradient(90deg,var(--c6-sky),transparent); margin-top:13px; }

.ch06-badge{ position:absolute; top:0; right:0; max-width:240px; display:flex; gap:11px; align-items:flex-start;
  background:rgba(11,11,79,0.5); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(91,169,213,0.4); border-radius:13px; padding:14px 18px; }
.ch06-badge-ic{ color:var(--c6-sky); flex:0 0 auto; margin-top:1px; }
.ch06-badge-title{ display:block; color:var(--c6-sky); font-weight:500; font-size:13px; line-height:1.2; }
.ch06-badge-text{ display:block; color:rgba(246,245,241,0.65); font-size:11px; line-height:1.4; margin-top:3px; }

.ch06-name{ margin-top:clamp(42px,9vh,96px); }
.ch06-name-tz{ display:block; font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:clamp(20px,4vw,36px);
  letter-spacing:.36em; line-height:1; margin-bottom:clamp(8px,1.6vh,18px); padding-left:.36em;
  background:linear-gradient(90deg,#7fc0e8,#4a86b8); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ch06-wordmark{ position:relative; display:inline-block; font-family:'Fraunces',Georgia,serif; font-weight:600;
  font-size:clamp(40px,7.2vw,86px); line-height:0.9; letter-spacing:-0.01em; margin:0; white-space:nowrap; }
.ch06-wordmark > span{ display:block; grid-area:1/1; }
.ch06-wm-fill{ position:relative;
  background:linear-gradient(177deg,#4a5663 2%,#8595a4 17%,#cdd9e3 36%,#f4f9fc 47%,#ffffff 50%,#e6eef4 54%,#b3c2cf 66%,#7c8b99 82%,#454f5b 98%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.4)) drop-shadow(0 3px 2px rgba(0,0,0,.5)) drop-shadow(0 14px 34px rgba(80,130,190,.35)); }
.ch06-wm-sweep{ position:absolute; inset:0;
  background:linear-gradient(110deg, transparent 41%, rgba(255,255,255,.5) 47%, rgba(255,255,255,.95) 50%, rgba(255,255,255,.5) 53%, transparent 59%);
  background-size:300% 100%; background-position:160% 0;
  -webkit-background-clip:text; background-clip:text; color:transparent; pointer-events:none;
  will-change:background-position; transform:translateZ(0); backface-visibility:hidden; }
.ch06-privilege.ch06-in .ch06-wm-sweep{ animation:c6-sweep 9s linear infinite; }
@keyframes c6-sweep{ 0%{ background-position:160% 0; } 40%{ background-position:-60% 0; } 100%{ background-position:-60% 0; } }
.ch06-wm-reflect{ position:absolute; left:0; top:100%; transform:scaleY(-1); transform-origin:top; opacity:.3; pointer-events:none;
  background:linear-gradient(177deg,#4a5663,#ffffff 50%,#454f5b); -webkit-background-clip:text; background-clip:text; color:transparent;
  -webkit-mask:linear-gradient(180deg, rgba(0,0,0,.55), transparent 52%); mask:linear-gradient(180deg, rgba(0,0,0,.55), transparent 52%); }

.ch06-lead{ margin-top:clamp(24px,3.5vh,40px); max-width:460px; }
.ch06-headline{ font-weight:500; font-size:clamp(19px,1.7vw,23px); line-height:1.35; color:#fff; max-width:440px; margin:0; }
.ch06-headline .sky{ color:var(--c6-sky); }
.ch06-subhead{ border-left:2px solid var(--c6-sky); padding-left:14px; margin:16px 0 0; max-width:440px;
  color:rgba(246,245,241,0.72); font-weight:400; font-size:13.5px; line-height:1.6; }

/* ally logo marquee (cordón) — same feel as hero strip */
.ch06-marquee{ position:relative; overflow:hidden; margin-top:clamp(40px,6vh,72px); padding:26px 0;
  border-top:1px solid rgba(91,169,213,0.18); border-bottom:1px solid rgba(91,169,213,0.18);
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 11%, #000 89%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0%, #000 11%, #000 89%, transparent 100%); }
.ch06-mq-row{ display:flex; align-items:center; gap:60px; white-space:nowrap; width:max-content;
  animation:ch06mq 46s linear infinite; }
.ch06-marquee:hover .ch06-mq-row{ animation-play-state:paused; }
.ch06-mq-item{ display:flex; align-items:center; gap:60px; }
.ch06-mq-logo{ width:auto; opacity:0.9; filter:brightness(0) invert(1); }/* todos los logos del cordón → blanco uniforme (tenue), sin importar sus colores reales */
.ch06-mq-ar{ height:30px; }
.ch06-mq-cb{ height:40px; }
.ch06-mq-hb{ height:26px; }
.ch06-mq-arena{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:22px; color:rgba(246,245,241,0.92); letter-spacing:.01em; white-space:nowrap; }
.ch06-mq-sep{ width:5px; height:5px; border-radius:50%; background:rgba(91,169,213,0.6); flex:0 0 5px; box-shadow:0 0 6px rgba(91,169,213,0.5); }
@keyframes ch06mq{ 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }

/* ally cards — continuous marquee rail (cards unchanged, mounted on a moving track; slower than and opposite to the logo cordón above) */
.ch06-cardmq{ position:relative; overflow:hidden; margin-top:clamp(36px,5vh,56px);
  --c6cw: calc((min(100vw - 2*clamp(24px,4vw,72px), 1500px) - 32px) / 3); }
.ch06-cardmq-row{ display:flex; align-items:stretch; width:max-content; will-change:transform;
  animation:ch06cardmq 271s linear infinite; }
.ch06-cardmq:hover .ch06-cardmq-row{ animation-play-state:paused; }
.ch06-cardmq-row > .ch06-card{ flex:0 0 var(--c6cw); width:var(--c6cw); min-width:var(--c6cw); margin-right:16px; }
@keyframes ch06cardmq{ 0%{ transform:translateX(-50%); } 100%{ transform:translateX(0); } }
.ch06-card-body > :last-child{ margin-bottom:0; }
/* placeholder ally cards (positions 4–8) — same shell, clearly-labeled */
.ch06-card--ph .ch06-card-bg{ background:repeating-linear-gradient(135deg, rgba(91,169,213,0.05) 0 14px, rgba(91,169,213,0.10) 14px 28px), linear-gradient(180deg,#0d1730,#0a0f1f); }
.ch06-ph-logo{ font-family:'Inter',sans-serif; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:rgba(91,169,213,0.78); border:1px dashed rgba(91,169,213,0.5); border-radius:9px; padding:9px 13px; }
.ch06-card--ph .ch06-card-name{ color:rgba(246,245,241,0.82); }

/* legacy grid (replaced by .ch06-cardmq) */
.ch06-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:clamp(36px,5vh,56px); }
.ch06-card{ position:relative; min-height:344px; border:1px solid rgba(91,169,213,0.28); border-radius:16px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end; transition:transform .4s ease, border-color .4s ease, box-shadow .4s ease; }
.ch06-card-bg{ position:absolute; inset:0; z-index:0; overflow:hidden; background:#080812; }
.ch06-card-bg img{ width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1s ease, transform .5s ease; }
.ch06-card-bg img.is-loaded{ opacity:1; }
.ch06-card::after{ content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(8,8,18,0.25) 0%, rgba(8,8,18,0.55) 45%, rgba(8,8,18,0.96) 100%); }
.ch06-card:hover{ transform:translateY(-6px); border-color:var(--c6-sky); box-shadow:0 26px 60px -24px rgba(0,0,0,0.7), 0 0 0 1px rgba(91,169,213,0.3); }
.ch06-card:hover .ch06-card-bg img{ transform:scale(1.06); }
/* real ally photo — blue/navy CSS tint to harmonize (photo content unaltered) */
.ch06-card--cb .ch06-card-bg::after{ content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:rgba(43,108,176,0.34); mix-blend-mode:multiply; }
.ch06-card--cb::after{ background:linear-gradient(180deg, rgba(11,29,58,0.45) 0%, rgba(11,29,58,0.5) 45%, rgba(8,8,18,0.95) 100%); }
.ch06-card-body{ position:relative; z-index:2; padding:24px; }
.ch06-card-ic{ width:42px; height:42px; border-radius:50%; border:1px solid rgba(91,169,213,0.5); color:var(--c6-sky); display:grid; place-items:center; margin-bottom:14px; }
.ch06-card-cat{ color:var(--c6-sky); font-weight:600; font-size:11px; letter-spacing:.14em; text-transform:uppercase; }
.ch06-card-name{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:21px; color:#fff; margin:8px 0 6px; }
/* ally logo band — prominent mark at the top of each card, consistent across the 3 */
.ch06-card-logobar{ display:flex; align-items:center; height:84px; margin:0 0 14px; }
.ch06-card-logo{ width:auto; max-width:90%; object-fit:contain; object-position:left center; opacity:0.97; display:block; }
.ch06-card-logo--arena{ height:62px; }
.ch06-card-logo--cb{ height:80px; }
.ch06-card-logo--hb{ height:46px; }
.ch06-card-desc{ color:rgba(246,245,241,0.7); font-size:12.5px; line-height:1.5; margin:0 0 16px; max-width:30ch; }
/* ── uniform ally-card benefit tiers (data-driven; value is free text) ───── */
.ch06-card-logo-text{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:30px; line-height:1; color:#fff; letter-spacing:.005em; }
.ch06-tiers{ display:flex; align-items:stretch; gap:8px; }/* compacto: gap entre tiers (mockup 10px) */
.ch06-tiers--single{ }
.ch06-tier{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; gap:5px; padding:10px 13px 11px; border-radius:12px; }/* compacto (mockup gap6/pad 13 15 14/radius13) */
.ch06-tiers--single .ch06-tier{ flex:0 1 auto; max-width:72%; }
.ch06-tier-lab{ font-family:'Inter',sans-serif; font-weight:600; font-size:9px; letter-spacing:.13em; text-transform:uppercase; }
.ch06-tier-val{ font-family:'Fraunces',Georgia,serif; font-weight:600; font-size:25px; line-height:0.95; letter-spacing:-0.01em; color:#fff; text-wrap:balance; }/* compacto: token de valor (mockup 30px) */
.ch06-tier-ctx{ font-family:'Inter',sans-serif; font-size:11px; line-height:1.35; color:rgba(246,245,241,0.64); }
.ch06-tier--tz{ background:rgba(91,169,213,0.13); border:1px solid rgba(91,169,213,0.42); }
.ch06-tier--tz .ch06-tier-lab{ color:var(--c6-sky); }
.ch06-tier--mr{ background:linear-gradient(158deg, rgba(201,169,97,0.26), rgba(201,169,97,0.07));
  border:1px solid rgba(201,169,97,0.6); box-shadow:0 0 22px -4px rgba(201,169,97,0.4), inset 0 1px 0 rgba(255,255,255,0.08); }
.ch06-tier--mr .ch06-tier-lab{ color:#e6cd8a; }
.ch06-tier--mr .ch06-tier-val{ color:#f0dca0; }
.ch06-card--ph .ch06-tier--ph{ background:rgba(246,245,241,0.03); border:1px dashed rgba(91,169,213,0.4); }
.ch06-tier--ph .ch06-tier-lab{ color:rgba(91,169,213,0.7); }
.ch06-tier--ph .ch06-tier-val{ color:rgba(246,245,241,0.5); font-weight:400; font-size:19px; }/* compacto: token placeholder (mockup 22px) */
.ch06-tier--ph .ch06-tier-ctx{ color:rgba(246,245,241,0.45); }
/* data-driven logo sizing fallback — panel-uploaded logos have no per-ally class (Parte 3) */
.ch06-card-logo--auto{ height:auto; max-height:60px; }
.ch06-mq-logo--auto{ height:34px; }
/* cordón: aliado sin logo → wordmark PEQUEÑO a escala del cordón (no titular gigante) */
.ch06-mq-name{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:22px; line-height:1; color:rgba(246,245,241,0.92); letter-spacing:.01em; white-space:nowrap; }

/* network strip */
.ch06-netstrip{ margin-top:clamp(34px,5vh,52px); border-top:1px solid rgba(91,169,213,0.22); padding-top:26px;
  display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.ch06-net-label{ color:var(--c6-sky); font-weight:600; font-size:11px; letter-spacing:.22em; text-transform:uppercase; }
.ch06-net-logos{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.ch06-net-dot{ width:4px; height:4px; border-radius:50%; background:rgba(91,169,213,0.6); }
.ch06-net-logo{ width:auto; opacity:0.92; }
.ch06-net-hb{ height:26px; }
.ch06-net-cb{ height:40px; }
.ch06-net-arena{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:17px; color:rgba(246,245,241,0.92); letter-spacing:.01em; }
.ch06-net-more{ margin-left:auto; font-style:italic; color:rgba(246,245,241,0.5); font-size:12.5px; }

/* entrance cascade */
.ch06-label,.ch06-badge,.ch06-name,.ch06-lead,.ch06-marquee,.ch06-card,.ch06-netstrip{
  opacity:0; transform:translateY(18px);
  transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.ch06-in .ch06-label{ opacity:1; transform:none; transition-delay:.1s; }
.ch06-in .ch06-name{ opacity:1; transform:none; transition-delay:.3s; }
.ch06-in .ch06-badge{ opacity:1; transform:none; transition-delay:.45s; }
.ch06-in .ch06-lead{ opacity:1; transform:none; transition-delay:.55s; }
.ch06-in .ch06-marquee{ opacity:1; transform:none; transition-delay:.66s; }
.ch06-in .ch06-card{ opacity:1; transform:none; }
.ch06-in .ch06-card:nth-child(1){ transition-delay:1.06s; }
.ch06-in .ch06-card:nth-child(2){ transition-delay:1.19s; }
.ch06-in .ch06-card:nth-child(3){ transition-delay:1.32s; }
.ch06-in .ch06-netstrip{ opacity:1; transform:none; transition-delay:1.5s; }

/* responsive */
@media (max-width:1024px){
  .ch06-cards{ grid-template-columns:1fr 1fr; }
  .ch06-cardmq{ --c6cw: calc((min(100vw - 2*clamp(24px,4vw,72px), 1500px) - 16px) / 2); }
}
@media (max-width:760px){
  .ch06-badge{ display:none; }
  .ch06-cards{ grid-template-columns:1fr; }
  .ch06-cardmq{ --c6cw: 80vw; }
  .ch06-hero, .ch06-hero-inner{ min-height:auto; }
  .ch06-name{ margin-top:46px; }
  .ch06-lead{ margin-top:24px; }
  .ch06-netstrip{ gap:14px; }
  .ch06-net-more{ margin-left:0; }
}
@media (prefers-reduced-motion: reduce){
  .ch06-tile .c6img, .ch06-wm-sweep, .ch06-mq-row, .ch06-cardmq-row{ animation:none !important; }
  .ch06-cardmq{ overflow:visible !important; }
  .ch06-cardmq-row{ flex-wrap:wrap; justify-content:center; width:auto !important; gap:16px; }
  .ch06-cardmq-row > .ch06-card{ margin-right:0 !important; }
  .ch06-card--dup{ display:none !important; }
  .ch06-label,.ch06-badge,.ch06-name,.ch06-lead,.ch06-marquee,.ch06-card,.ch06-netstrip{ opacity:1 !important; transform:none !important; transition:none !important; }
  .ch06-mosaic{ transform:none !important; }
  .ch06-tile .c6img, .ch06-card-bg img{ opacity:1 !important; }
  .ch06-card:hover{ transform:none !important; }
  .ch06-card:hover .ch06-card-bg img{ transform:none !important; }
}


/* ============ Site Footer ============ */
.tz-footer{
  position: relative;
  background: linear-gradient(135deg, #0b0b4f 0%, #0b1d3a 50%, #050514 100%);
  color: #fff;
  overflow: hidden;
  font-family: 'Inter', system-ui, sans-serif;
  isolation: isolate;
}
.tz-footer::before{
  content: "";
  position: absolute;
  bottom: 0; right: 0;
  width: 55%; height: 100%;
  background: radial-gradient(ellipse at bottom right, rgba(91, 169, 213, 0.16), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.tz-footer-inner{
  position: relative;
  z-index: 1;
  max-width: 1120px;
  margin: 0 auto;
  padding: 72px 40px 28px;
}
.tz-footer-top{
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 56px;
  padding-bottom: 48px;
  margin-bottom: 44px;
  border-bottom: 1px solid rgba(91, 169, 213, 0.14);
}
.tz-footer-brand{
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 800ms cubic-bezier(0.16, 1, 0.3, 1);
}
.tz-footer.tz-foot-in .tz-footer-brand{ opacity: 1; transform: translateY(0); }
.tz-foot-logo-row{ display: flex; align-items: center; gap: 14px; }
.tz-foot-logo-img{ height: 68px; width: auto; display: block; }
.tz-foot-wordmark{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400;
  font-size: 36px;
  letter-spacing: -0.025em;
  color: #fff;
  line-height: 1;
}
.tz-foot-tagline{
  margin-top: 16px;
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 18px;
  letter-spacing: 0.01em;
  color: #5ba9d5;
}
.tz-foot-legal{
  margin-top: 28px;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400;
  font-size: 11px;
  color: rgba(246, 245, 241, 0.5);
  line-height: 1.85;
  max-width: 340px;
}
.tz-foot-legal-rnt{ margin-top: 6px; color: rgba(246, 245, 241, 0.72); }
.tz-foot-socials{ margin-top: 26px; display: flex; gap: 14px; }
.tz-foot-social{
  width: 38px; height: 38px;
  border-radius: 50%;
  border: 0.5px solid rgba(91, 169, 213, 0.3);
  background: transparent;
  color: rgba(246, 245, 241, 0.6);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: border-color 300ms ease, color 300ms ease, transform 300ms ease;
}
.tz-foot-social:hover{
  border-color: rgba(91, 169, 213, 0.6);
  color: #5ba9d5;
  transform: scale(1.08);
}
.tz-foot-social svg{ width: 16px; height: 16px; display: block; }
.tz-foot-news{
  position: relative;
  overflow: hidden;
  padding: 36px;
  border-radius: 16px;
  border: 1px solid rgba(91, 169, 213, 0.35);
  background:
    radial-gradient(ellipse 500px 300px at 30% 20%, rgba(91, 169, 213, 0.16), transparent 70%),
    linear-gradient(135deg, rgba(91, 169, 213, 0.10), rgba(11, 11, 79, 0.30));
  background-size: 200% 200%, 100% 100%;
  background-position: 30% 20%, 0 0;
  box-shadow:
    0 16px 48px rgba(11, 11, 79, 0.4),
    0 0 60px rgba(91, 169, 213, 0.10),
    inset 0 1px 0 rgba(91, 169, 213, 0.18);
  opacity: 0;
  transform: translateY(16px) scale(0.98);
  transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
  animation: tz-foot-glow-drift 40s ease-in-out infinite;
}
.tz-footer.tz-foot-in .tz-foot-news{
  opacity: 1; transform: translateY(0) scale(1); transition-delay: 150ms;
}
@keyframes tz-foot-glow-drift{
  0%, 100% { background-position: 30% 20%, 0 0; }
  50%      { background-position: 24% 30%, 0 0; }
}
.tz-foot-news-badge{
  display: inline-flex; align-items: center; gap: 7px;
  margin-bottom: 14px;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 10px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: #5ba9d5;
}
.tz-foot-news-badge svg{ width: 14px; height: 14px; }
.tz-foot-news-title{
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  font-weight: 400; font-size: 26px;
  letter-spacing: -0.015em; line-height: 1.2;
  color: #fff; margin: 0 0 10px 0;
  text-wrap: balance;
}
.tz-foot-news-desc{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; font-size: 14px;
  line-height: 1.55; color: rgba(246, 245, 241, 0.75);
  margin: 0 0 22px 0; max-width: 400px;
}
.tz-foot-news-row{
  display: flex; align-items: center; gap: 8px;
  padding: 6px 6px 6px 18px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(91, 169, 213, 0.35);
  border-radius: 12px;
  flex-wrap: wrap;
}
.tz-foot-news-input{
  flex: 1 1 200px; min-width: 0;
  background: transparent; border: none;
  color: #fff;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 14px; padding: 10px 0;
  outline: none;
}
.tz-foot-news-input::placeholder{ color: rgba(246, 245, 241, 0.45); }
.tz-foot-news-btn{
  background: #d53d47; color: #fff;
  border: none; border-radius: 9px;
  padding: 12px 26px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 13px; font-weight: 500; letter-spacing: 0.02em;
  cursor: pointer; white-space: nowrap;
  transition: background 300ms ease, transform 300ms ease;
}
.tz-foot-news-btn:hover{ background: #e54a55; transform: translateY(-1px); }
.tz-foot-news-trust{
  margin-top: 14px;
  display: flex; align-items: center; gap: 6px;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; font-size: 11px;
  color: rgba(246, 245, 241, 0.5);
}
.tz-foot-news-trust svg{ width: 12px; height: 12px; }
.tz-foot-news-msg{
  display: none;
  margin: 12px 0 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; font-size: 12.5px; line-height: 1.5;
  color: rgba(246, 245, 241, 0.85);
}
.tz-foot-news-msg.is-show{ display: block; }
.tz-foot-news-msg.is-error{ color: #f2a7ad; }
.tz-foot-nav{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 36px; margin-bottom: 40px;
}
.tz-foot-col{
  opacity: 0; transform: translateY(12px);
  transition: opacity 600ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}
.tz-footer.tz-foot-in .tz-foot-col{ opacity: 1; transform: translateY(0); }
.tz-footer.tz-foot-in .tz-foot-col:nth-child(1){ transition-delay: 250ms; }
.tz-footer.tz-foot-in .tz-foot-col:nth-child(2){ transition-delay: 330ms; }
.tz-footer.tz-foot-in .tz-foot-col:nth-child(3){ transition-delay: 410ms; }
.tz-footer.tz-foot-in .tz-foot-col:nth-child(4){ transition-delay: 490ms; }
.tz-foot-col-title{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500; font-size: 10px;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: #5ba9d5; margin-bottom: 18px;
}
.tz-foot-col-list{ list-style: none; margin: 0; padding: 0; }
.tz-foot-col-list li{ margin-bottom: 11px; }
.tz-foot-col-list a{
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; font-size: 13px;
  color: rgba(246, 245, 241, 0.68);
  text-decoration: none; letter-spacing: 0.01em;
  transition: color 300ms ease;
}
.tz-foot-col-list a:hover{ color: #fff; }
.tz-foot-link-gold{ color: #c9a961 !important; }
.tz-foot-link-gold:hover{ color: #d8be7f !important; }
.tz-foot-bottom{
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 14px;
  padding-top: 28px;
  border-top: 1px solid rgba(91, 169, 213, 0.14);
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 11px; color: rgba(246, 245, 241, 0.45);
  opacity: 0; transform: translateY(8px);
  transition: opacity 500ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 500ms cubic-bezier(0.16, 1, 0.3, 1);
}
.tz-footer.tz-foot-in .tz-foot-bottom{
  opacity: 1; transform: translateY(0); transition-delay: 800ms;
}
.tz-foot-bottom-right{ display: flex; gap: 20px; }
.tz-foot-bottom-right a{
  color: rgba(246, 245, 241, 0.5);
  text-decoration: none; letter-spacing: 0.02em;
  transition: color 300ms ease;
}
.tz-foot-bottom-right a:hover{ color: #fff; }
@media (max-width: 760px){
  .tz-footer-inner{ padding: 56px 24px 24px; }
  .tz-footer-top{
    grid-template-columns: 1fr; gap: 36px;
    padding-bottom: 36px; margin-bottom: 36px;
  }
  .tz-foot-news{ padding: 28px; }
  .tz-foot-news-title{ font-size: 22px; }
  .tz-foot-nav{
    grid-template-columns: repeat(2, 1fr);
    gap: 28px; margin-bottom: 32px;
  }
  .tz-foot-bottom{ flex-direction: column; align-items: flex-start; }
}
@media (max-width: 460px){
  .tz-foot-news-row{ flex-direction: column; align-items: stretch; padding: 12px; }
  .tz-foot-news-input{ width: 100%; padding: 12px 4px; }
  .tz-foot-news-btn{ width: 100%; padding: 14px; }
}
@media (prefers-reduced-motion: reduce){
  .tz-footer .tz-foot-news,
  .tz-footer .tz-footer-brand,
  .tz-footer .tz-foot-col,
  .tz-footer .tz-foot-bottom{
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: color 200ms ease, background 200ms ease, border-color 200ms ease !important;
  }
  .tz-foot-social:hover,
  .tz-foot-news-btn:hover{ transform: none !important; }
}