/* ==========================================================================
   EPIC TOWER — HOME
   Diseño cinematográfico cálido. Navy profundo + dorado. Fotos de fondo.
   Reusa tokens de style.css. Solo afecta al home (.home-page).
   ========================================================================== */

.home-page {
  --gold:      #d9a94f;
  --gold-soft: #eec886;
  --gold-deep: #b8862f;
  --ink:       #0a1720;              /* navy profundo de base */
  --ink-2:     #0d1e2a;
  --panel:     rgba(255,255,255,.045);
  --panel-bd:  rgba(255,255,255,.1);
  --txt:       rgba(255,255,255,.74);
  --r-xl: 22px;
  --shadow-deep: 0 40px 90px -44px rgba(0,0,0,.75);
  --e: cubic-bezier(.22,.61,.36,1);

  background: var(--ink);
  color: #fff;
}
.home-page ::selection { background: rgba(217,169,79,.28); }

/* ---- componentes heredados, afinados ---- */
.home-page .formcard {
  border-radius: var(--r-xl);
  background: linear-gradient(180deg, rgba(13,30,42,.94), rgba(10,23,32,.9));
  border: 1px solid var(--panel-bd);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: var(--shadow-deep);
  padding: clamp(26px, 3vw, 44px);
}
.home-page .formcard__title { color: var(--gold); font-size: clamp(20px,2vw,27px); letter-spacing: .01em; }
.home-page .formcard__sub { color: var(--txt); font-weight: 300; }
.home-page .field label { color: rgba(255,255,255,.6); font-size: 10.5px; letter-spacing: .16em; }
.home-page .field input, .home-page .phone { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.14); border-radius: 10px; }
.home-page .field input:focus, .home-page .phone:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(217,169,79,.18); }

/* Botones: ancho por contenido, sobrios, con tracking */
.home-page .btn {
  width: auto; min-height: 50px; padding: 14px 34px;
  border-radius: 8px;
  font-size: clamp(11.5px, .95vw, 13px); font-weight: 700; letter-spacing: .16em;
  background: var(--gold); color: #10202c;
  box-shadow: 0 10px 26px -14px rgba(217,169,79,.5);
  transition: background .3s var(--e), transform .3s var(--e), box-shadow .3s var(--e);
}
.home-page .btn:hover { background: var(--gold-soft); transform: translateY(-2px); box-shadow: 0 16px 32px -14px rgba(217,169,79,.55); }
.home-page .btn--ghost {
  background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.3); box-shadow: none;
}
.home-page .btn--ghost:hover { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.6); }
.home-page .formcard .btn { width: 100%; }

/* ==========================================================================
   Secciones y encabezados
   ========================================================================== */
.hsection { position: relative; padding-block: clamp(72px, 9vw, 150px); overflow: hidden; isolation: isolate; }
.hsection--dark { background: var(--ink); }
.hsection--alt  { background: var(--ink-2); }

/* fondo fotográfico con velo profundo */
.hsection--photo .hbg { position: absolute; inset: 0; z-index: -2; }
.hsection--photo .hbg picture { display: block; width: 100%; height: 100%; }
.hsection--photo .hbg img { width: 100%; height: 100%; object-fit: cover; }
.hsection--photo::before {
  content:''; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(10,23,32,.92) 0%, rgba(10,23,32,.7) 40%, rgba(10,23,32,.94) 100%),
    linear-gradient(90deg, rgba(10,23,32,.6), transparent 60%);
}

.hhead { max-width: 720px; margin: 0 auto clamp(44px, 5.5vw, 72px); text-align: center; }
.hhead h2 { font-size: clamp(27px, 3.4vw, 46px); font-weight: 200; line-height: 1.16; letter-spacing: -.015em; color: #fff; text-wrap: balance; }
.hhead h2 strong { font-weight: 600; color: var(--gold); }
.hhead p { margin-top: 18px; font-size: clamp(15px,1.25vw,18px); font-weight: 300; line-height: 1.7; color: var(--txt); text-wrap: pretty; }

.kicker { display: inline-flex; align-items: center; gap: 10px;
  color: var(--gold); font-size: clamp(10.5px,.95vw,12px); font-weight: 700; letter-spacing: .26em; text-transform: uppercase; margin-bottom: 16px; }
.kicker::before { content:''; width: 26px; height: 1px; background: var(--gold); opacity: .7; }
.hhead .kicker::after { content:''; width: 26px; height: 1px; background: var(--gold); opacity: .7; }

/* ==========================================================================
   NAV
   ========================================================================== */
.nav { position: fixed; inset: 0 0 auto 0; z-index: 100; padding-block: clamp(16px, 2.2vw, 26px);
  transition: background .45s var(--e), box-shadow .45s var(--e), padding .45s var(--e); }
.nav__inner { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.nav__logo img { width: clamp(78px, 8vw, 108px); height: auto; filter: brightness(0) invert(1); }
.nav__actions { display: flex; align-items: center; gap: 12px; }
.nav__link { display: none; position: relative; color: #fff; font-size: 14px; font-weight: 400; opacity: .8; transition: opacity .25s var(--e); }
.nav__link::after { content:''; position: absolute; left: 0; bottom: -6px; width: 0; height: 1px; background: var(--gold); transition: width .3s var(--e); }
.nav__link:hover { opacity: 1; }
.nav__link:hover::after { width: 100%; }
.nav.is-stuck { background: rgba(10,23,32,.9); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 10px 34px -18px rgba(0,0,0,.7); padding-block: 10px; }
.nav .btn { min-height: 42px; padding: 10px 24px; font-size: 11.5px; }
@media (min-width: 760px) { .nav__link { display: inline-block; } .nav__actions { gap: 30px; } }

/* ==========================================================================
   HERO
   ========================================================================== */
.hhero { position: relative; min-height: min(880px, 100svh); display: flex; align-items: center;
  padding-block: clamp(150px, 20vw, 220px) clamp(80px, 10vw, 130px); overflow: hidden; isolation: isolate; }
.hhero__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
/* <picture> es inline por defecto: sin esto el <img> no puede llenar el alto
   del hero en móvil y la foto queda "cortada" arriba con el texto por fuera. */
.hhero__media picture { display: block; width: 100%; height: 100%; }
.hhero__media img { width: 100%; height: 100%; object-fit: cover; object-position: center;
  transform: scale(1.05); animation: kenburns 30s ease-out both; }
@keyframes kenburns { from { transform: scale(1.05); } to { transform: scale(1.15); } }
.hhero::before { content:''; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(180deg, rgba(10,23,32,.5) 0%, rgba(10,23,32,.1) 30%, rgba(10,23,32,.85) 100%); }
.hhero__inner { position: relative; max-width: 800px; }

/* animación de entrada del hero, escalonada */
.hhero__badge, .hhero h1, .hhero__sub, .hhero__actions { animation: heroIn .95s var(--e) both; }
.hhero__badge   { animation-delay: .1s; }
.hhero h1       { animation-delay: .25s; }
.hhero__sub     { animation-delay: .4s; }
.hhero__actions { animation-delay: .55s; }
@keyframes heroIn { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }

.hhero__badge { display: inline-flex; flex-direction: column; align-items: center; line-height: 1;
  background: rgba(10,23,32,.42); border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  padding: 14px 30px; border-radius: 12px; margin-bottom: clamp(26px, 3vw, 38px); }
.hhero__badge small { font-size: clamp(9.5px,.9vw,11px); letter-spacing:.26em; text-transform:uppercase; color: rgba(255,255,255,.72); margin-bottom: 8px; }
.hhero__badge b { font-size: clamp(28px, 3.8vw, 44px); font-weight: 700; color: var(--gold); letter-spacing:.01em; }
.hhero__badge b span { color:#fff; font-weight:300; font-size:.36em; letter-spacing:.14em; }
.hhero h1 { font-size: clamp(36px, 5.6vw, 74px); font-weight: 200; line-height: 1.05; letter-spacing: -.025em; text-wrap: balance;
  text-shadow: 0 2px 50px rgba(0,0,0,.45); }
.hhero h1 strong { font-weight: 600; color: var(--gold); }
.hhero__sub { margin-top: 18px; font-size: clamp(12px,1.1vw,15px); font-weight:500; letter-spacing:.2em; text-transform:uppercase; color: rgba(255,255,255,.8); max-width: 30ch; }
.hhero__actions { margin-top: clamp(32px, 4vw, 46px); display: flex; flex-wrap: wrap; gap: 14px; }

/* indicador de scroll */
.hhero__scroll { position: absolute; left: 50%; bottom: 34px; translate: -50% 0; z-index: 3;
  width: 26px; height: 42px; border: 1px solid rgba(255,255,255,.35); border-radius: 14px;
  display: grid; justify-items: center; padding-top: 8px; opacity: .8; }
.hhero__scroll span { width: 3px; height: 8px; border-radius: 2px; background: var(--gold); animation: scrolldot 1.9s var(--e) infinite; }
@keyframes scrolldot { 0% { transform: translateY(0); opacity: 1; } 70% { transform: translateY(14px); opacity: 0; } 100% { opacity: 0; } }
@media (max-width: 760px) { .hhero__scroll { display: none; } }

/* ==========================================================================
   HIGHLIGHTS
   ========================================================================== */
.highlights { background: var(--ink-2); border-block: 1px solid var(--panel-bd); }
.highlights__row { display: grid; gap: clamp(30px, 3.4vw, 48px); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .highlights__row { grid-template-columns: 1.15fr 1px 1fr; } }
/* Diagramación: etiqueta pequeña ARRIBA, número GRANDE abajo */
.hl__stats { display: flex; flex-wrap: wrap; gap: clamp(26px, 3.6vw, 56px); justify-content: center; align-items: flex-start; }
.hl__stat { text-align: center; }
.hl__label { display: block; margin-bottom: 6px;
  font-size: clamp(9.5px,.85vw,11px); font-weight: 500; letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.45); }
.hl__stat b { display: block; font-size: clamp(42px, 5.4vw, 76px); font-weight: 600; color: var(--gold);
  line-height: .92; font-variant-numeric: tabular-nums; letter-spacing: -.035em; }
.hl__stat b small { font-size: .42em; font-weight: 500; letter-spacing: -.01em; }
.hl__div { display: none; background: var(--panel-bd); }
@media (min-width: 900px) { .hl__div { display: block; align-self: stretch; } }
.hl__feats { display: flex; flex-wrap: wrap; gap: clamp(20px,2.6vw,36px); justify-content: center; }
.hl__feat { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 128px; text-align: center; }
.hl__feat svg { width: 30px; height: 30px; stroke: var(--gold); fill: none; stroke-width: 1.3; }
.hl__feat span { font-size: clamp(11px,.98vw,13px); font-weight: 500; color: rgba(255,255,255,.78); line-height: 1.45; }
.hl__tag { text-align: center; margin-top: clamp(30px,3.4vw,44px); font-size: clamp(11.5px,1.05vw,14px); letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.55); font-weight: 400; }
.hl__tag strong { color: var(--gold); font-weight: 700; }

/* ==========================================================================
   INTRO — foto real del edificio
   ========================================================================== */
.intro { background: var(--ink); }
.intro__grid { display: grid; grid-template-columns: 1fr; align-items: center; gap: clamp(34px, 5vw, 80px); }
@media (min-width: 880px) { .intro__grid { grid-template-columns: 1fr 1fr; } }
.intro__photo { margin: 0; position: relative; border-radius: var(--r-xl); overflow: hidden;
  box-shadow: var(--shadow-deep); border: 1px solid var(--panel-bd); }
.intro__photo img { width: 100%; height: 100%; aspect-ratio: 4/4.4; object-fit: cover;
  transform: scale(1.05); transition: transform 1.6s var(--e); }
.intro__photo.is-in img { transform: scale(1); }
.intro h2 { font-size: clamp(28px, 3.6vw, 50px); font-weight: 200; line-height: 1.13; letter-spacing: -.02em; color: #fff; text-wrap: balance; }
.intro h2 strong { font-weight: 600; color: var(--gold); }
.intro p { margin-top: 20px; font-size: clamp(15px,1.3vw,19px); font-weight: 300; line-height: 1.75; color: var(--txt); max-width: 46ch; }
.intro .hhero__actions { animation: none; }

/* ==========================================================================
   UBICACIÓN
   ========================================================================== */
.ubic__grid { display: grid; grid-template-columns: 1fr; align-items: center; gap: clamp(32px, 4.5vw, 72px); }
@media (min-width: 880px) { .ubic__grid { grid-template-columns: 1.05fr 1fr; } }
.ubic__map img { width: 100%; height: auto; border-radius: var(--r-xl); filter: drop-shadow(0 34px 60px rgba(0,0,0,.55)); }
.ubic__text h2 { font-size: clamp(26px, 3.2vw, 44px); font-weight: 200; line-height: 1.16; letter-spacing: -.02em; color: #fff; }
.ubic__text h2 strong { font-weight: 600; color: var(--gold); }
.ubic__text p { margin-top: 16px; font-size: clamp(15px,1.3vw,19px); font-weight:300; line-height:1.75; color: var(--txt); }
.ubic__text .hhero__actions { animation: none; }

/* ==========================================================================
   3 MODOS
   ========================================================================== */
.modos { display: grid; gap: clamp(18px, 2vw, 26px); grid-template-columns: 1fr; }
@media (min-width: 700px)  { .modos { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .modos { grid-template-columns: repeat(3, 1fr); } }
.modo { position: relative; display: flex; flex-direction: column; padding: clamp(28px, 2.8vw, 42px);
  background: var(--panel); border: 1px solid var(--panel-bd); border-radius: var(--r-xl);
  overflow: hidden;
  transition: transform .55s var(--e), border-color .55s var(--e), background .55s var(--e); }
/* brillo dorado sutil que aparece al hover */
.modo::before { content:''; position: absolute; inset: 0; opacity: 0;
  background: radial-gradient(120% 90% at 50% 0%, rgba(217,169,79,.12), transparent 60%);
  transition: opacity .55s var(--e); }
.modo:hover { transform: translateY(-8px); border-color: rgba(217,169,79,.35); background: rgba(255,255,255,.06); }
.modo:hover::before { opacity: 1; }
.modo > * { position: relative; }
.modo__icon { width: 54px; height: 54px; margin-bottom: 26px; display: grid; place-items: center;
  border: 1px solid rgba(217,169,79,.3); border-radius: 14px; background: rgba(217,169,79,.08); }
.modo__icon svg { width: 27px; height: 27px; stroke: var(--gold); fill: none; stroke-width: 1.4; }
.modo__title { font-size: clamp(18px,1.5vw,22px); font-weight: 600; color: #fff; margin-bottom: 14px; letter-spacing: -.01em; }
.modo__text { font-size: clamp(14px,1.15vw,16px); font-weight: 300; line-height: 1.7; color: var(--txt); }

/* ==========================================================================
   BENEFICIOS
   ========================================================================== */
.benefcards { display: grid; gap: clamp(16px, 1.8vw, 22px); grid-template-columns: 1fr; }
@media (min-width: 760px) { .benefcards { grid-template-columns: repeat(2, 1fr); } }
.benefcard { display: grid; grid-template-columns: 52px 1fr; gap: 20px; align-items: start;
  padding: clamp(24px, 2.4vw, 34px); border-radius: var(--r-xl);
  background: rgba(10,23,32,.5); border: 1px solid var(--panel-bd);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  transition: transform .55s var(--e), background .55s var(--e), border-color .55s var(--e); }
.benefcard:hover { transform: translateY(-6px); background: rgba(10,23,32,.68); border-color: rgba(217,169,79,.35); }
.benefcard__ico { width: 52px; height: 52px; display: grid; place-items: center;
  background: rgba(217,169,79,.1); border: 1px solid rgba(217,169,79,.3); border-radius: 13px; }
.benefcard__ico svg { width: 25px; height: 25px; stroke: var(--gold); fill: none; stroke-width: 1.5; }
.benefcard h3 { font-size: clamp(16px,1.35vw,19px); font-weight: 600; color: #fff; letter-spacing: -.005em; }
.benefcard p { margin-top: 8px; font-size: clamp(13.5px,1.1vw,15.5px); font-weight: 300; line-height: 1.65; color: var(--txt); }
.benefcard p strong { color: var(--gold); font-weight: 600; }

/* ==========================================================================
   AMENIDADES
   ========================================================================== */
.amen__gallery { display: grid; gap: clamp(12px, 1.4vw, 18px); grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .amen__gallery { grid-template-columns: repeat(4, 1fr); } }
.amen__item { position: relative; border-radius: var(--r-xl); overflow: hidden; background: var(--ink-2);
  border: 1px solid var(--panel-bd); }
.amen__item img { width: 100%; aspect-ratio: 1/1.08; object-fit: cover; transition: transform .9s var(--e), filter .9s var(--e);
  filter: saturate(.92); }
.amen__item:hover img { transform: scale(1.07); filter: saturate(1.05); }
.amen__item::after { content:''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 55%, rgba(10,23,32,.55)); }

/* ==========================================================================
   APARTAMENTO
   ========================================================================== */
.apto__grid { display: grid; grid-template-columns: 1fr; align-items: center; gap: clamp(32px, 4.5vw, 72px); }
@media (min-width: 880px) { .apto__grid { grid-template-columns: 1fr 1fr; } }
.apto__media { border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--shadow-deep); border: 1px solid var(--panel-bd); }
.apto__media img { width: 100%; aspect-ratio: 1/1; object-fit: cover; transform: scale(1.04); transition: transform 1.6s var(--e); }
.apto__media.is-in img { transform: scale(1); }
.apto__feats { display: grid; gap: 12px; margin-top: clamp(26px,3vw,36px); }
.apto__feat { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start;
  padding: 16px 20px; background: var(--panel); border: 1px solid var(--panel-bd); border-radius: 12px;
  transition: transform .4s var(--e), background .4s var(--e), border-color .4s var(--e); }
.apto__feat:hover { transform: translateX(6px); background: rgba(255,255,255,.07); border-color: rgba(217,169,79,.3); }
.apto__feat svg { width: 22px; height: 22px; stroke: var(--gold); fill: none; stroke-width: 1.5; margin-top: 3px; }
.apto__feat b { display: block; font-size: clamp(14.5px,1.2vw,17px); font-weight: 600; color: #fff; margin-bottom: 3px; }
.apto__feat span { font-size: clamp(12.5px,1.05vw,14.5px); color: var(--txt); line-height: 1.5; font-weight: 300; }

/* ==========================================================================
   AGENDA
   ========================================================================== */
.agenda { text-align: center; }
.agenda h2 { margin-top: 12px; font-size: clamp(30px,4vw,54px); font-weight: 200; letter-spacing: -.02em; color: #fff; }
.agenda h2 strong { font-weight: 600; color: var(--gold); }
.agenda__row { margin-top: clamp(30px,4vw,46px); display: flex; flex-wrap: wrap; gap: 16px 36px; justify-content: center; align-items: center; }
.agenda__row a { display: inline-flex; align-items: center; gap: 11px; color: #fff; font-size: clamp(14px,1.25vw,17px); font-weight: 500; transition: color .25s var(--e); }
.agenda__row a:hover { color: var(--gold); }
.agenda__row svg { width: 21px; height: 21px; fill: currentColor; }
.agenda .hhero__actions { animation: none; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.hfooter { background: var(--ink-2); color: rgba(255,255,255,.6); padding-block: clamp(46px,5vw,70px) 30px; text-align: center; border-top: 1px solid var(--panel-bd); }
.hfooter__logo img { width: 112px; filter: brightness(0) invert(1); margin: 0 auto 20px; opacity: .9; }
.hfooter__social { display: flex; gap: 20px; justify-content: center; margin: 22px 0; }
.hfooter__social a svg { width: 22px; height: 22px; fill: rgba(255,255,255,.6); transition: fill .25s var(--e), transform .25s var(--e); }
.hfooter__social a:hover svg { fill: var(--gold); transform: translateY(-3px); }
.hfooter p { font-size: 13px; line-height: 1.7; font-weight: 300; }
.hfooter p strong { color: var(--gold); font-weight: 600; }
.hfooter__bottom { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--panel-bd); font-size: 12px; color: rgba(255,255,255,.4); }

/* ==========================================================================
   DECORACIÓN — hojas sutiles
   ========================================================================== */
.leaf { position: absolute; z-index: 0; pointer-events: none; opacity: .2;
  filter: drop-shadow(0 18px 26px rgba(0,0,0,.3)) saturate(.85); }
.leaf img { width: 100%; height: auto; display: block; }
.leaf--tr { top: -6%;  right: -5%;  width: clamp(100px, 12vw, 180px); transform: rotate(24deg); }
.leaf--tl { top: -7%;  left: -6%;   width: clamp(95px, 11vw, 165px); transform: rotate(-150deg); }
.leaf--bl { bottom: -8%; left: -5%; width: clamp(100px, 11.5vw, 175px); transform: rotate(150deg); }
.leaf--br { bottom: -7%; right: -6%; width: clamp(95px, 11vw, 165px); transform: rotate(-30deg); }
.leaf--sway { animation: sway 11s ease-in-out infinite; transform-origin: 50% 0; }
@keyframes sway { 0%,100% { rotate: 0deg; } 50% { rotate: 3deg; } }
.hsection > .container { position: relative; z-index: 2; }
@media (max-width: 700px) { .leaf { opacity: .14; } .leaf--tl, .leaf--br { display: none; } }

/* ==========================================================================
   ANIMACIONES DE ENTRADA
   ========================================================================== */
.js-reveal .home-page .reveal {
  opacity: 0; transform: translateY(38px);
  transition: opacity .9s var(--e), transform .9s var(--e);
  will-change: opacity, transform;
}
.js-reveal .home-page .reveal--left  { transform: translateX(-44px); }
.js-reveal .home-page .reveal--right { transform: translateX(44px); }
.home-page .reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .hhero__media img, .leaf--sway, .hhero__scroll span { animation: none !important; }
  .hhero__badge, .hhero h1, .hhero__sub, .hhero__actions { animation: none !important; opacity: 1 !important; transform: none !important; }
  .js-reveal .home-page .reveal { transition-duration: .3s; }
}

/* ==========================================================================
   MÓVIL
   ========================================================================== */
@media (max-width: 880px) {
  .intro__photo { order: -1; }
  .intro__photo img { aspect-ratio: 16/11; }
  .apto__media { order: -1; }
}
@media (max-width: 700px) {
  .home-page { --r-xl: 18px; }
  /* alto real de pantalla para que la foto cubra todo el hero */
  .hhero { min-height: 88svh; padding-block: clamp(120px, 26vw, 160px) clamp(56px,12vw,80px); }
  /* la foto encuadra hacia el horizonte, no al cielo vacío */
  .hhero__media img { object-position: 50% 42%; }
  /* velo más marcado abajo: el texto siempre legible sobre la foto */
  .hhero::before { background: linear-gradient(180deg,
      rgba(10,23,32,.42) 0%, rgba(10,23,32,.24) 26%, rgba(10,23,32,.82) 68%, rgba(10,23,32,.94) 100%); }
  .hhero__sub { max-width: none; }
  .hhero__actions .btn { flex: 1 1 140px; justify-content: center; }
  .hsection--photo .hbg img { object-position: center; }
  .agenda__row { flex-direction: column; gap: 18px; }
  .hl__stats { gap: 26px 32px; }
  .benefcard { grid-template-columns: 46px 1fr; gap: 16px; }
  .benefcard__ico { width: 46px; height: 46px; }
}
@media (max-width: 400px) {
  .amen__gallery { gap: 10px; }
  .modo { padding: 24px 22px; }
}