/* =========================================================================
   LA · Lily Ardiles Ayre — Consultoría Inmobiliaria
   Sistema de diseño  ·  v1.0
   ========================================================================= */

/* ---------- 1. Tokens ---------------------------------------------------- */
:root{
  /* Marca */
  --ink:        #14110F;
  --ink-2:      #231F20;   /* carbón de la marca */
  --ink-3:      #35302E;
  --gold:       #CEAC6C;   /* dorado extraído del logotipo */
  --gold-deep:  #A9863F;
  --gold-soft:  #EADCC0;
  --paper:      #FBFAF8;
  --paper-2:    #F2EEE8;
  --paper-3:    #E7E1D8;
  --muted:      #6F6763;
  --muted-dark: #A79E96;
  --line:       rgba(35,31,32,.14);
  --line-dark:  rgba(255,255,255,.14);

  /* Tipografía */
  --serif: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Ritmo */
  --pad:      clamp(1.25rem, 4vw, 3.5rem);
  --section:  clamp(4.5rem, 9vw, 9rem);
  --maxw:     1320px;
  --radius:   2px;

  /* Movimiento */
  --ease:     cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

/* ---------- 2. Base ------------------------------------------------------ */
*,*::before,*::after{ box-sizing:border-box; }

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:96px;
}
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(.95rem,.35vw + .88rem,1.0625rem);
  font-weight:350;
  line-height:1.72;
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
body.is-locked{ overflow:hidden; }

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

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

button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }

::selection{ background:var(--gold); color:var(--ink); }

:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
  border-radius:1px;
}

.skip-link{
  position:absolute; left:1rem; top:-4rem; z-index:9999;
  background:var(--ink); color:#fff; padding:.7rem 1.1rem;
  font-size:.8rem; letter-spacing:.12em; text-transform:uppercase;
  transition:top .2s var(--ease);
}
.skip-link:focus{ top:1rem; }

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

/* ---------- 3. Layout ---------------------------------------------------- */
.container{
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:var(--pad);
}
.container--narrow{ max-width:920px; }

.section{ padding-block:var(--section); position:relative; }
.section--tight{ padding-block:clamp(3rem,6vw,5.5rem); }
.section--paper2{ background:var(--paper-2); }
.section--dark{ background:var(--ink); color:#EDE9E4; }
.section--dark .lead{ color:var(--muted-dark); }

/* ---------- 4. Tipografía ------------------------------------------------ */
.eyebrow{
  display:inline-flex; align-items:center; gap:.75rem;
  font-size:.6875rem; font-weight:500;
  letter-spacing:.28em; text-transform:uppercase;
  color:var(--gold-deep);
  margin:0 0 1.35rem;
}
.eyebrow::before{
  content:""; width:clamp(24px,4vw,44px); height:1px;
  background:var(--gold); flex:none;
}
.section--dark .eyebrow,
.hero .eyebrow{ color:var(--gold); }

.h-display{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(2.6rem,7.2vw,5.6rem);
  line-height:1.03;
  letter-spacing:-.018em;
  margin:0;
}
.h1{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(2.25rem,5.2vw,4.1rem);
  line-height:1.08;
  letter-spacing:-.015em;
  margin:0 0 1.25rem;
}
.h2{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(1.9rem,3.8vw,3.15rem);
  line-height:1.12;
  letter-spacing:-.012em;
  margin:0 0 1.15rem;
}
.h3{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.3rem,2vw,1.75rem);
  line-height:1.22;
  letter-spacing:-.005em;
  margin:0 0 .7rem;
}
.h4{
  font-size:.78rem; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase;
  margin:0 0 .85rem;
}
.italic-gold{ font-style:italic; color:var(--gold-deep); }
.section--dark .italic-gold{ color:var(--gold); }

.lead{
  font-size:clamp(1.02rem,.5vw + .92rem,1.22rem);
  line-height:1.72;
  color:var(--muted);
  font-weight:350;
  max-width:62ch;
}
.section--dark p{ color:#CFC8C1; }
.small{ font-size:.82rem; color:var(--muted); }

.rule{
  width:100%; height:1px; background:var(--line);
  border:0; margin:0;
}
.section--dark .rule{ background:var(--line-dark); }

/* ---------- 5. Botones --------------------------------------------------- */
.btn{
  --bg:var(--ink); --fg:#fff; --bd:var(--ink);
  position:relative; display:inline-flex; align-items:center; gap:.7rem;
  padding:1.02rem 1.85rem;
  background:var(--bg); color:var(--fg);
  border:1px solid var(--bd);
  font-size:.7rem; font-weight:600;
  letter-spacing:.19em; text-transform:uppercase;
  line-height:1; white-space:nowrap;
  transition:background .38s var(--ease), color .38s var(--ease),
             border-color .38s var(--ease), transform .38s var(--ease);
}
.btn svg{ width:14px; height:14px; flex:none; transition:transform .38s var(--ease); }
.btn:hover{ transform:translateY(-2px); }
.btn:hover svg{ transform:translateX(4px); }

.btn--gold{ --bg:var(--gold); --fg:var(--ink); --bd:var(--gold); }
.btn--gold:hover{ --bg:var(--gold-deep); --bd:var(--gold-deep); --fg:#fff; }

.btn--ghost{ --bg:transparent; --fg:currentColor; --bd:currentColor; }
.btn--ghost:hover{ --bg:currentColor; }
.btn--ghost:hover span{ mix-blend-mode:difference; }

.btn--light{ --bg:transparent; --fg:#fff; --bd:rgba(255,255,255,.45); }
.btn--light:hover{ --bg:#fff; --fg:var(--ink); --bd:#fff; }

.btn--sm{ padding:.78rem 1.3rem; font-size:.65rem; }

.link-arrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.72rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  padding-bottom:.35rem;
  background-image:linear-gradient(var(--gold),var(--gold));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:100% 1px;
  transition:background-size .45s var(--ease-out), color .3s var(--ease);
}
.link-arrow svg{ width:13px; height:13px; transition:transform .4s var(--ease); }
.link-arrow:hover{ color:var(--gold-deep); }
.link-arrow:hover svg{ transform:translateX(5px); }
.section--dark .link-arrow:hover{ color:var(--gold); }

/* ---------- 6. Logotipo -------------------------------------------------- */
.logo{ display:inline-flex; align-items:center; gap:.8rem; }
.logo__mark{
  width:52px; height:38px; flex:none;
  background:var(--ink-2);
  display:grid; place-items:center;
  transition:background .4s var(--ease);
}
.logo__mark svg{ width:38px; height:26px; }
.logo__txt{ display:flex; flex-direction:column; line-height:1; }
.logo__name{
  font-family:var(--serif); font-weight:600;
  font-size:1.06rem; letter-spacing:.11em; text-transform:uppercase;
}
.logo__sub{
  font-size:.5rem; font-weight:500;
  letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold-deep); margin-top:.28rem;
}
.is-over-hero .logo__sub{ color:var(--gold); }

/* ---------- 7. Header ---------------------------------------------------- */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:900;
  transition:background .45s var(--ease), box-shadow .45s var(--ease),
             transform .5s var(--ease);
}
.site-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:1.5rem;
  height:clamp(66px,7vw,92px);
  transition:height .45s var(--ease);
}
.site-header.is-scrolled{
  background:rgba(251,250,248,.92);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  box-shadow:0 1px 0 var(--line);
}
.site-header.is-scrolled .site-header__inner{ height:clamp(58px,5.4vw,72px); }
.site-header.is-hidden{ transform:translateY(-102%); }

/* estado sobre hero oscuro */
.is-over-hero{ color:#fff; }
.is-over-hero .logo__mark{ background:rgba(255,255,255,.08); }
.is-over-hero .nav__link{ color:rgba(255,255,255,.86); }
.is-over-hero .burger span{ background:#fff; }

.nav{ display:flex; align-items:center; gap:clamp(1.1rem,2.2vw,2.3rem); }
.nav__link{
  position:relative;
  font-size:.72rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-3);
  padding-block:.4rem;
  transition:color .3s var(--ease);
}
.nav__link::after{
  content:""; position:absolute; left:0; bottom:0;
  width:100%; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--ease-out);
}
.nav__link:hover::after,
.nav__link[aria-current="page"]::after{ transform:scaleX(1); transform-origin:left; }
.nav__link[aria-current="page"]{ color:var(--gold-deep); }
.is-over-hero .nav__link[aria-current="page"]{ color:var(--gold); }

.header-actions{ display:flex; align-items:center; gap:1rem; }

.burger{
  display:none; width:44px; height:44px;
  align-items:center; justify-content:center;
  flex-direction:column; gap:5px;
}
.burger span{
  display:block; width:22px; height:1.5px; background:var(--ink);
  transition:transform .4s var(--ease), opacity .3s var(--ease), background .4s var(--ease);
}
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* Menú móvil */
.mobile-menu{
  position:fixed; inset:0; z-index:890;
  background:var(--ink);
  display:flex; flex-direction:column; justify-content:center;
  padding:6rem var(--pad) 3rem;
  opacity:0; visibility:hidden;
  clip-path:inset(0 0 100% 0);
  transition:clip-path .65s var(--ease-out), opacity .3s var(--ease), visibility .3s;
}
.mobile-menu.is-open{ opacity:1; visibility:visible; clip-path:inset(0 0 0 0); }
.mobile-menu__list{ list-style:none; margin:0; padding:0; }
.mobile-menu__list li{
  border-bottom:1px solid rgba(255,255,255,.1);
  opacity:0; transform:translateY(18px);
}
.mobile-menu.is-open .mobile-menu__list li{
  animation:mmIn .55s var(--ease-out) forwards;
}
.mobile-menu.is-open li:nth-child(1){ animation-delay:.14s }
.mobile-menu.is-open li:nth-child(2){ animation-delay:.19s }
.mobile-menu.is-open li:nth-child(3){ animation-delay:.24s }
.mobile-menu.is-open li:nth-child(4){ animation-delay:.29s }
.mobile-menu.is-open li:nth-child(5){ animation-delay:.34s }
.mobile-menu.is-open li:nth-child(6){ animation-delay:.39s }
.mobile-menu.is-open li:nth-child(7){ animation-delay:.44s }
@keyframes mmIn{ to{ opacity:1; transform:none; } }
.mobile-menu__list a{
  display:flex; align-items:baseline; gap:1rem;
  padding:1.05rem 0;
  font-family:var(--serif); font-size:1.9rem; font-weight:500;
  color:#fff;
}
.mobile-menu__list a span{
  font-family:var(--sans); font-size:.6rem; letter-spacing:.22em;
  color:var(--gold);
}
.mobile-menu__foot{ margin-top:2.5rem; color:var(--muted-dark); font-size:.85rem; }
.mobile-menu__foot a{ color:var(--gold); }

/* ---------- 8. Hero ------------------------------------------------------ */
.hero{
  position:relative;
  min-height:clamp(600px,100svh,1000px);
  display:flex; align-items:flex-end;
  background:var(--ink);
  color:#fff;
  overflow:hidden;
  isolation:isolate;
}
.hero__media{ position:absolute; inset:0; z-index:-2; }
.hero__media video,
.hero__media img{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.06);
  animation:heroZoom 22s ease-out forwards;
}
@keyframes heroZoom{ to{ transform:scale(1); } }
.hero__media::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(20,17,15,.72) 0%, rgba(20,17,15,.18) 34%, rgba(20,17,15,.55) 72%, rgba(20,17,15,.92) 100%),
    linear-gradient(90deg, rgba(20,17,15,.68) 0%, rgba(20,17,15,.05) 62%);
}
.hero__inner{ position:relative; width:100%; padding-block:clamp(6.5rem,14vh,9rem) clamp(3rem,7vh,5rem); }
.hero__title{
  font-family:var(--serif); font-weight:500;
  font-size:clamp(2.5rem,6.6vw,5.4rem);
  line-height:1.02; letter-spacing:-.02em;
  margin:0 0 1.6rem; max-width:17ch;
}
.hero__title em{ font-style:italic; color:var(--gold); }
.hero__sub{
  max-width:52ch; color:rgba(255,255,255,.8);
  font-size:clamp(1rem,.5vw + .9rem,1.18rem); margin:0 0 2.4rem;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:.9rem; }

/* animación de entrada por líneas */
.reveal-line{ display:block; overflow:hidden; }
.reveal-line > span{
  display:block;
  transform:translateY(105%);
  animation:lineUp 1.05s var(--ease-out) forwards;
}
.reveal-line:nth-child(1) > span{ animation-delay:.15s }
.reveal-line:nth-child(2) > span{ animation-delay:.27s }
.reveal-line:nth-child(3) > span{ animation-delay:.39s }
@keyframes lineUp{ to{ transform:none; } }

.fade-up{ opacity:0; transform:translateY(22px); animation:fadeUp .95s var(--ease-out) forwards; }
.d1{ animation-delay:.55s } .d2{ animation-delay:.68s } .d3{ animation-delay:.8s }
@keyframes fadeUp{ to{ opacity:1; transform:none; } }

.hero__bar{
  position:relative;
  margin-top:clamp(3rem,7vh,5rem);
  padding-top:1.6rem;
  border-top:1px solid rgba(255,255,255,.18);
  display:flex; flex-wrap:wrap; align-items:center;
  gap:clamp(1.4rem,4vw,3.5rem);
}
.hero__badge{
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(255,255,255,.62);
}
.hero__badge b{ color:var(--gold); font-weight:600; }

.scroll-cue{
  position:absolute; right:var(--pad); bottom:clamp(3rem,7vh,5rem);
  display:flex; flex-direction:column; align-items:center; gap:.9rem;
  font-size:.58rem; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(255,255,255,.55);
  writing-mode:vertical-rl;
}
.scroll-cue::after{
  content:""; width:1px; height:64px;
  background:linear-gradient(180deg,var(--gold),transparent);
  animation:cue 2.4s var(--ease) infinite;
}
@keyframes cue{ 0%,100%{ opacity:.25; transform:scaleY(.5); transform-origin:top } 50%{ opacity:1; transform:scaleY(1); transform-origin:top } }

.hero__social{
  position:absolute; left:var(--pad); bottom:clamp(3rem,7vh,5rem);
  display:flex; flex-direction:column; gap:1rem; z-index:2;
}
.hero__social a{
  width:34px; height:34px; display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.22); color:rgba(255,255,255,.8);
  transition:background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}
.hero__social a:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.hero__social svg{ width:15px; height:15px; }

/* botón de audio/reproducción del vídeo */
.video-toggle{
  position:absolute; right:var(--pad); top:clamp(6rem,12vh,9rem);
  width:42px; height:42px; z-index:3;
  border:1px solid rgba(255,255,255,.3); color:#fff;
  display:grid; place-items:center;
  transition:background .35s var(--ease), border-color .35s var(--ease);
}
.video-toggle:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.video-toggle svg{ width:15px; height:15px; }

/* ---------- 9. Cifras ---------------------------------------------------- */
.stats{
  background:var(--ink-2); color:#fff;
  border-top:1px solid rgba(255,255,255,.08);
}
.stats__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}
.stat{
  padding:clamp(2rem,4vw,3.2rem) clamp(1rem,2.2vw,2rem);
  border-right:1px solid rgba(255,255,255,.1);
}
.stat:last-child{ border-right:0; }
.stat__num{
  font-family:var(--serif); font-weight:500;
  font-size:clamp(2.3rem,4.4vw,3.5rem);
  line-height:1; color:var(--gold);
  display:flex; align-items:baseline; gap:.08em;
}
.stat__num small{ font-size:.44em; }
.stat__label{
  margin-top:.85rem;
  font-size:.7rem; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.62); line-height:1.6;
}

/* ---------- 10. Split / retrato ------------------------------------------ */
.split{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:clamp(2.2rem,6vw,6rem);
  align-items:center;
}
.split--reverse{ direction:rtl; }
.split--reverse > *{ direction:ltr; }

/* Sobre mí: el retrato manda */
.split--retrato{ grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); }

.portrait{ position:relative; }
.portrait img{
  width:100%; aspect-ratio:4/5; object-fit:cover; object-position:50% 20%;
  transition:transform .8s var(--ease-out);
}
.portrait:hover img{ transform:scale(1.02); }
.portrait::before{
  content:""; position:absolute;
  inset:auto -22px -22px auto; width:62%; height:62%;
  border:1px solid var(--gold); z-index:-1;
}
.portrait__tag{
  position:absolute; left:0; bottom:0;
  background:var(--ink); color:#fff;
  padding:1rem 1.25rem;
  font-size:.62rem; letter-spacing:.18em; text-transform:uppercase;
  line-height:1.8;
}
.portrait__tag b{ color:var(--gold); font-weight:600; }

/* Credenciales */
.chips{ display:flex; flex-wrap:wrap; gap:.5rem; margin:1.8rem 0 0; padding:0; list-style:none; }
.chips li{
  border:1px solid var(--line);
  padding:.5rem .85rem;
  font-size:.68rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink-3);
  background:#fff;
}
.chips li b{ color:var(--gold-deep); font-weight:600; }
.section--dark .chips li{ background:transparent; border-color:var(--line-dark); color:#D8D2CB; }
.section--dark .chips li b{ color:var(--gold); }

.sig{
  margin-top:2.2rem; display:flex; align-items:center; gap:1.1rem;
  font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
.sig span{ font-family:var(--serif); font-size:1.5rem; letter-spacing:.02em; text-transform:none; color:var(--ink); }

/* ---------- 11. Pilares (servicios) -------------------------------------- */
.pillar{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,5rem);
  align-items:center;
  padding-block:clamp(2.6rem,5vw,4.2rem);
  border-top:1px solid var(--line);
}
.pillar:nth-child(even) .pillar__media{ order:2; }
.pillar__media{ position:relative; overflow:hidden; }
.pillar__media img{
  width:100%; aspect-ratio:4/3; object-fit:cover;
  transform:scale(1.01);
  transition:transform 1.1s var(--ease-out), filter .8s var(--ease);
  filter:saturate(.88);
}
.pillar:hover .pillar__media img{ transform:scale(1.06); filter:none; }
.pillar__idx{
  position:absolute; left:0; top:0;
  background:var(--ink); color:var(--gold);
  font-family:var(--serif); font-size:1.1rem; font-weight:600;
  padding:.65rem 1rem; letter-spacing:.08em;
}
.pillar__body p{ color:var(--muted); }
.pillar__list{ list-style:none; margin:1.5rem 0 1.9rem; padding:0; }
.pillar__list li{
  position:relative; padding-left:1.6rem; padding-block:.42rem;
  font-size:.94rem; line-height:1.62;
  border-bottom:1px solid var(--line);
}
.pillar__list li:last-child{ border-bottom:0; }
.pillar__list li::before{
  content:""; position:absolute; left:0; top:1.05em;
  width:8px; height:1px; background:var(--gold);
}

/* ---------- 12. Marquee -------------------------------------------------- */
.marquee{
  overflow:hidden; background:var(--ink); color:#fff;
  padding-block:1.15rem;
  border-block:1px solid rgba(255,255,255,.1);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee__track{
  display:flex; width:max-content;
  animation:slide 42s linear infinite;
}
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__group{ display:flex; align-items:center; flex:none; }
.marquee__group span{
  padding-inline:clamp(1.2rem,3vw,2.4rem);
  font-size:.74rem; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(255,255,255,.7); white-space:nowrap;
  display:flex; align-items:center; gap:clamp(1.2rem,3vw,2.4rem);
}
.marquee__group span::after{ content:"◆"; color:var(--gold); font-size:.5rem; }
@keyframes slide{ to{ transform:translateX(-50%); } }

/* ---------- 13. Proceso -------------------------------------------------- */
.steps{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:1px; background:var(--line); border:1px solid var(--line);
}
.step{
  background:var(--paper); padding:clamp(1.8rem,3vw,2.6rem);
  transition:background .4s var(--ease);
}
.step:hover{ background:#fff; }
.step__n{
  font-family:var(--serif); font-size:2.6rem; font-weight:500;
  color:var(--paper-3); line-height:1; margin-bottom:1.2rem;
  transition:color .4s var(--ease);
}
.step:hover .step__n{ color:var(--gold); }
.step h3{ font-family:var(--sans); font-size:.86rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; margin:0 0 .6rem; }
.step p{ font-size:.9rem; color:var(--muted); margin:0; line-height:1.65; }
.section--paper2 .step{ background:var(--paper-2); }
.section--paper2 .step:hover{ background:#fff; }

/* ---------- 14. Trayectoria --------------------------------------------- */
.timeline{ position:relative; margin-top:3rem; }
.timeline::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:1px;
  background:linear-gradient(180deg,var(--gold),rgba(255,255,255,.12));
}
.tl-item{
  position:relative; padding:0 0 2.6rem clamp(1.6rem,4vw,3.2rem);
}
.tl-item::before{
  content:""; position:absolute; left:-3.5px; top:.62em;
  width:8px; height:8px; background:var(--gold); border-radius:50%;
}
.tl-year{
  font-size:.68rem; font-weight:600; letter-spacing:.2em;
  color:var(--gold); text-transform:uppercase;
}
.tl-item h3{
  font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.7rem);
  font-weight:600; margin:.45rem 0 .1rem; color:#fff;
}
.tl-role{ font-size:.8rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted-dark); margin:0 0 .7rem; }
.tl-item p{ margin:0; max-width:66ch; font-size:.94rem; }

/* ---------- 15. Proyectos ------------------------------------------------ */
.cards{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(285px,1fr));
  gap:clamp(1.1rem,2.2vw,1.9rem);
}
.card{
  position:relative; background:#fff;
  border:1px solid var(--line);
  padding:clamp(1.6rem,2.6vw,2.2rem);
  display:flex; flex-direction:column;
  transition:transform .5s var(--ease-out), box-shadow .5s var(--ease), border-color .5s var(--ease);
}
.card::after{
  content:""; position:absolute; left:0; top:0; width:100%; height:2px;
  background:var(--gold); transform:scaleX(0); transform-origin:left;
  transition:transform .55s var(--ease-out);
}
.card:hover{ transform:translateY(-6px); box-shadow:0 22px 48px -26px rgba(20,17,15,.38); border-color:transparent; }
.card:hover::after{ transform:scaleX(1); }
.card__meta{
  font-size:.63rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold-deep); margin-bottom:.9rem;
}
.card h3{ font-family:var(--serif); font-size:1.35rem; font-weight:600; margin:0 0 .55rem; line-height:1.24; }
.card p{ font-size:.9rem; color:var(--muted); margin:0 0 1.2rem; line-height:1.65; }
.card__foot{
  margin-top:auto; padding-top:1.1rem; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:.4rem 1.4rem;
}
.card__kpi{ font-size:.72rem; letter-spacing:.06em; color:var(--ink-3); }
.card__kpi b{ font-family:var(--serif); font-size:1.15rem; color:var(--ink); font-weight:600; display:block; }

/* ---------- 16. Banda de vídeo ------------------------------------------- */
.band{
  position:relative; min-height:clamp(420px,68vh,660px);
  display:grid; place-items:center; text-align:center;
  color:#fff; overflow:hidden; isolation:isolate;
  padding:var(--section) var(--pad);
}
.band__media{ position:absolute; inset:0; z-index:-2; }
.band__media video, .band__media img{ width:100%; height:100%; object-fit:cover; }
.band__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(20,17,15,.72),rgba(20,17,15,.62));
}
.band blockquote{
  margin:0; max-width:22ch;
  font-family:var(--serif); font-weight:500;
  font-size:clamp(1.9rem,4.6vw,3.6rem); line-height:1.16; letter-spacing:-.015em;
}
.band blockquote em{ font-style:italic; color:var(--gold); }
.band cite{
  display:block; margin-top:2rem; font-style:normal;
  font-size:.68rem; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(255,255,255,.62);
}

/* ---------- 17. Clientes ------------------------------------------------- */
.clients{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1px; background:var(--line); border:1px solid var(--line); margin-top:2.6rem;
}
.clients span{
  background:var(--paper); padding:1.6rem 1rem; text-align:center;
  font-family:var(--serif); font-size:1.02rem; font-weight:600;
  letter-spacing:.06em; color:var(--ink-3);
  transition:background .4s var(--ease), color .4s var(--ease);
}
.clients span:hover{ background:var(--ink); color:var(--gold); }

/* ---------- 18. Blog ----------------------------------------------------- */
.posts{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:clamp(1.4rem,3vw,2.6rem);
}
.post-card{ display:flex; flex-direction:column; height:100%; }
.post-card__img{
  position:relative; overflow:hidden; background:var(--paper-3);
  aspect-ratio:16/10; margin-bottom:1.4rem;
}
.post-card__img img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1s var(--ease-out);
}
.post-card:hover .post-card__img img{ transform:scale(1.05); }
.post-card__img--empty{
  display:grid; place-items:center;
  background:var(--ink); color:var(--gold);
}
.post-card__img--empty svg{ width:52px; height:38px; opacity:.55; }
.post-card__tag{
  position:absolute; left:0; top:0;
  background:var(--gold); color:var(--ink);
  padding:.45rem .8rem;
  font-size:.6rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
}
.post-card time{
  font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);
}
.post-card h3{
  font-family:var(--serif); font-size:clamp(1.25rem,1.8vw,1.55rem);
  font-weight:600; line-height:1.24; margin:.6rem 0 .6rem;
  transition:color .35s var(--ease);
}
.post-card:hover h3{ color:var(--gold-deep); }
.post-card p{ font-size:.92rem; color:var(--muted); margin:0 0 1.1rem; line-height:1.66; }
.post-card .link-arrow{ margin-top:auto; align-self:flex-start; }

.filters{ display:flex; flex-wrap:wrap; gap:.5rem; margin:2.4rem 0 3.2rem; }
.filter{
  border:1px solid var(--line); padding:.6rem 1.1rem;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  transition:background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}
.filter:hover{ border-color:var(--ink); }
.filter.is-active{ background:var(--ink); color:#fff; border-color:var(--ink); }

.empty-state{
  border:1px dashed var(--line); padding:clamp(2.5rem,6vw,4.5rem);
  text-align:center; color:var(--muted);
}

/* Artículo */
.post-hero{
  background:var(--ink); color:#fff;
  padding:clamp(8rem,16vh,11rem) 0 clamp(3rem,6vw,4.5rem);
}
.post-hero h1{
  font-family:var(--serif); font-weight:500;
  font-size:clamp(2rem,4.6vw,3.6rem); line-height:1.1; letter-spacing:-.015em;
  margin:1rem 0 1.4rem; max-width:20ch;
}
.post-meta{
  display:flex; flex-wrap:wrap; gap:.6rem 1.6rem; align-items:center;
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(255,255,255,.6);
}
.post-meta .dot{ color:var(--gold); }
.post-cover{ margin:0; }
.post-cover img{ width:100%; aspect-ratio:16/8; object-fit:cover; }
.post-cover figcaption{
  padding:.9rem var(--pad); font-size:.76rem; color:var(--muted);
  max-width:var(--maxw); margin-inline:auto;
}

.prose{ max-width:72ch; margin-inline:auto; }
.prose > * + *{ margin-top:1.35em; }
.prose h2{
  font-family:var(--serif); font-size:clamp(1.55rem,2.6vw,2.15rem);
  font-weight:600; line-height:1.2; margin-top:2.4em; letter-spacing:-.008em;
}
.prose h3{
  font-family:var(--serif); font-size:clamp(1.2rem,1.8vw,1.5rem);
  font-weight:600; margin-top:1.9em;
}
.prose p{ line-height:1.82; }
.prose ul,.prose ol{ padding-left:1.3rem; }
.prose li{ margin-bottom:.5em; line-height:1.75; }
.prose ul li::marker{ color:var(--gold-deep); }
.prose a{
  color:var(--gold-deep);
  background-image:linear-gradient(var(--gold),var(--gold));
  background-repeat:no-repeat; background-position:0 100%; background-size:100% 1px;
}
.prose a:hover{ background-size:100% 2px; }
.prose blockquote{
  margin-inline:0; padding:.3rem 0 .3rem 1.6rem;
  border-left:2px solid var(--gold);
  font-family:var(--serif); font-size:1.35rem; font-style:italic; line-height:1.5;
  color:var(--ink-3);
}
.prose img{ width:100%; margin-block:2.2em; }
.prose hr{ border:0; height:1px; background:var(--line); margin-block:2.6em; }
.prose strong{ font-weight:600; }

.post-nav{
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
  border-top:1px solid var(--line); padding-top:2rem; margin-top:3.5rem;
}

/* ---------- 18b. Ficha de autora (artículos) ----------------------------- */
.author{
  display:flex; gap:clamp(1.2rem,3vw,2rem); align-items:flex-start;
  background:var(--paper-2); border:1px solid var(--line);
  padding:clamp(1.4rem,3vw,2.2rem);
  margin-top:3rem;
}
/* La ficha va dentro de .prose, así que hay que ganarle a `.prose img` */
.author .author__photo{
  flex:none; margin:0; width:clamp(84px,12vw,116px);
  aspect-ratio:1; border-radius:50%; object-fit:cover;
  border:1px solid var(--gold);
  padding:4px; background:var(--paper);
}
.author__body{ min-width:0; }
.author__body .h4{ color:var(--gold-deep); margin-bottom:.35rem; }
.author__body h2{
  font-family:var(--serif); font-size:clamp(1.3rem,2vw,1.65rem);
  font-weight:600; margin:0 0 .2rem; line-height:1.2;
}
.author__role{
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--muted); margin:0 0 .9rem;
}
.author__body p{ font-size:.93rem; color:var(--muted); margin:0 0 1.1rem; line-height:1.66; }
@media (max-width:560px){
  .author{ flex-direction:column; }
}

/* ---------- 19b. Firma en contacto --------------------------------------- */
.contact-sign{
  display:flex; align-items:center; gap:1.1rem;
  margin-bottom:1.8rem;
}
.contact-sign img{
  width:62px; height:62px; flex:none;
  border-radius:50%; object-fit:cover;
  border:1px solid var(--gold); padding:3px;
}
.contact-sign b{
  display:block; font-family:var(--serif); font-size:1.15rem;
  font-weight:600; color:#fff; letter-spacing:.02em;
}
.contact-sign span{
  font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold);
}

/* ---------- 19. Contacto ------------------------------------------------- */
.contact-grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(2.4rem,6vw,5.5rem);
}
.contact-list{ list-style:none; margin:2.4rem 0 0; padding:0; }
.contact-list li{
  display:flex; gap:1.2rem; align-items:flex-start;
  padding:1.15rem 0; border-top:1px solid var(--line-dark);
}
.contact-list svg{ width:17px; height:17px; color:var(--gold); flex:none; margin-top:.28rem; }
.contact-list .k{
  display:block; font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted-dark); margin-bottom:.25rem;
}
.contact-list .v{ color:#fff; font-size:1rem; }
.contact-list a.v:hover{ color:var(--gold); }

.form{ display:grid; gap:1.1rem; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
.field{ position:relative; display:block; }
.field span{
  display:block; font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted-dark); margin-bottom:.5rem;
}
.field input,.field textarea,.field select{
  width:100%; padding:.9rem 0; background:transparent;
  border:0; border-bottom:1px solid rgba(255,255,255,.24);
  color:#fff; font:inherit; font-size:.98rem;
  transition:border-color .35s var(--ease);
}
.field textarea{ resize:vertical; min-height:110px; }
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none; border-bottom-color:var(--gold);
}
.field select option{ background:var(--ink); }
.form small{ color:var(--muted-dark); font-size:.74rem; line-height:1.55; }

/* ---------- 20. CTA final ------------------------------------------------ */
.cta{
  background:var(--gold); color:var(--ink);
  padding-block:clamp(3.4rem,7vw,5.5rem);
}
.cta__inner{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:2rem;
}
.cta h2{ margin:0; max-width:18ch; }
.cta .btn{ --bg:var(--ink); --fg:var(--gold); --bd:var(--ink); }
.cta .btn:hover{ --bg:#fff; --fg:var(--ink); --bd:#fff; }

/* ---------- 21. Footer --------------------------------------------------- */
.site-footer{ background:#0E0C0B; color:#B9B2AB; padding-block:clamp(3.2rem,6vw,5rem) 2rem; }
.site-footer .logo__name{ color:#fff; }
.footer-grid{
  display:grid; grid-template-columns:1.4fr repeat(3,minmax(0,1fr));
  gap:clamp(2rem,4vw,3.5rem); padding-bottom:3rem;
}
.footer-grid h4{ color:#fff; }
.footer-grid ul{ list-style:none; margin:0; padding:0; display:grid; gap:.65rem; }
.footer-grid a{ font-size:.88rem; transition:color .3s var(--ease); }
.footer-grid a:hover{ color:var(--gold); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1); padding-top:1.8rem;
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
  font-size:.74rem; color:#7C756F;
}
.social-row{ display:flex; gap:.55rem; margin-top:1.5rem; }
.social-row a{
  width:36px; height:36px; display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.16);
  transition:background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}
.social-row a:hover{ background:var(--gold); color:var(--ink); border-color:var(--gold); }
.social-row svg{ width:15px; height:15px; }

/* ---------- 22. WhatsApp flotante ---------------------------------------- */
.wa-float{
  position:fixed; right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem);
  z-index:880;
  display:flex; align-items:center; gap:.7rem;
  background:#1FA855; color:#fff;
  padding:.85rem 1.1rem;
  box-shadow:0 14px 34px -12px rgba(31,168,85,.65);
  font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  transform:translateY(120%); opacity:0;
  transition:transform .6s var(--ease-out), opacity .4s var(--ease), background .3s var(--ease);
}
.wa-float.is-in{ transform:none; opacity:1; }
.wa-float:hover{ background:#17913f; }
.wa-float svg{ width:20px; height:20px; flex:none; }
@media (max-width:640px){ .wa-float span{ display:none; } .wa-float{ padding:1rem; border-radius:50%; } }

/* ---------- 23. Revelado al hacer scroll --------------------------------- */
[data-reveal]{
  opacity:0; transform:translateY(26px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
  transition-delay:var(--delay,0ms);
}
[data-reveal].is-visible{ opacity:1; transform:none; }
[data-reveal="mask"]{ opacity:1; transform:none; clip-path:inset(0 0 100% 0); transition:clip-path 1.1s var(--ease-out); }
[data-reveal="mask"].is-visible{ clip-path:inset(0 0 0 0); }

/* ---------- 24. Documento / Brochure ------------------------------------- */
.doc-hero{
  position:relative; min-height:clamp(460px,78vh,760px);
  display:flex; align-items:flex-end; color:#fff;
  background:var(--ink); overflow:hidden; isolation:isolate;
}
.doc-hero__media{ position:absolute; inset:0; z-index:-2; }
.doc-hero__media img{ width:100%; height:100%; object-fit:cover; }
.doc-hero__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(20,17,15,.78) 0%,rgba(20,17,15,.42) 45%,rgba(20,17,15,.92) 100%);
}
.doc-hero__inner{ position:relative; width:100%; padding-block:clamp(8rem,16vh,11rem) clamp(3rem,6vh,4.5rem); }

.doc-index{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:1px; background:var(--line-dark);
  border:1px solid var(--line-dark); margin-top:clamp(2.4rem,5vw,4rem);
}
.doc-index a{
  background:var(--ink); padding:1.3rem 1.4rem;
  display:flex; flex-direction:column; gap:.5rem;
  transition:background .4s var(--ease);
}
.doc-index a:hover{ background:var(--ink-3); }
.doc-index b{ font-size:.62rem; letter-spacing:.2em; color:var(--gold); font-weight:600; }
.doc-index span{ font-family:var(--serif); font-size:1.15rem; color:#fff; }

.doc-section{ border-top:1px solid var(--line); padding-block:clamp(3.2rem,6vw,5rem); }
.doc-section:first-of-type{ border-top:0; }
.doc-head{
  display:grid; grid-template-columns:minmax(0,.42fr) minmax(0,1fr);
  gap:clamp(1.6rem,4vw,4rem); align-items:start;
}
.doc-num{
  font-family:var(--serif); font-size:clamp(3rem,7vw,5.5rem);
  font-weight:500; line-height:.9; color:var(--paper-3);
}
.check-list{ list-style:none; margin:1.6rem 0 0; padding:0; display:grid; gap:.2rem; }
.check-list li{
  display:flex; gap:1rem; align-items:flex-start;
  padding:.95rem 0; border-bottom:1px solid var(--line);
  font-size:.96rem; line-height:1.66;
}
.check-list li::before{
  content:""; flex:none; width:18px; height:18px; margin-top:.28rem;
  background:var(--gold);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/contain no-repeat;
}
.check-list li b{ font-weight:600; }

.deliverables{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:1px; background:var(--line); border:1px solid var(--line); margin-top:2rem;
}
.deliverables div{ background:#fff; padding:1.6rem 1.4rem; }
.deliverables b{
  display:block; font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold-deep); margin-bottom:.6rem;
}
.deliverables p{ margin:0; font-size:.9rem; color:var(--muted); line-height:1.6; }

.terms{
  background:var(--ink); color:#EDE9E4;
  padding:clamp(2rem,4vw,3.2rem); margin-top:2rem;
}
.terms dl{ display:grid; gap:0; margin:0; }
.terms > dl > div{
  display:grid; grid-template-columns:minmax(0,.4fr) minmax(0,1fr);
  gap:1.5rem; padding:1.15rem 0; border-bottom:1px solid var(--line-dark);
}
.terms > dl > div:last-child{ border-bottom:0; }
.terms dt{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); }
.terms dd{ margin:0; font-size:.95rem; color:#D3CDC6; line-height:1.65; }
.terms dd b{ color:#fff; font-weight:600; }

/* ---------- 25. Panel de publicación (admin) ----------------------------- */
.adm .site-header{
  background:rgba(242,238,232,.94);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  box-shadow:0 1px 0 var(--line);
}
.adm{ background:var(--paper-2); min-height:100vh; padding-block:clamp(6.5rem,12vh,9rem) 4rem; }
.adm-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(1.6rem,3vw,2.6rem); align-items:start; }
.adm-panel{ background:#fff; border:1px solid var(--line); padding:clamp(1.4rem,2.6vw,2.2rem); }
.adm-panel h2{ font-size:1.6rem; }
.adm-field{ display:block; margin-bottom:1.15rem; }
.adm-field > span{
  display:block; font-size:.64rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted); margin-bottom:.45rem;
}
.adm-field input[type=text],
.adm-field input[type=date],
.adm-field select,
.adm-field textarea{
  width:100%; padding:.75rem .85rem; background:var(--paper);
  border:1px solid var(--line); color:var(--ink); font:inherit; font-size:.94rem;
  transition:border-color .3s var(--ease);
}
.adm-field textarea{ min-height:340px; resize:vertical; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.86rem; line-height:1.7; }
.adm-field input:focus,.adm-field select:focus,.adm-field textarea:focus{ outline:none; border-color:var(--gold); }
.adm-hint{ font-size:.76rem; color:var(--muted); margin:.4rem 0 0; line-height:1.55; }
.adm-toolbar{ display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:.5rem; }
.adm-toolbar button{
  border:1px solid var(--line); background:var(--paper);
  padding:.4rem .7rem; font-size:.7rem; letter-spacing:.06em;
  transition:background .3s var(--ease), border-color .3s var(--ease);
}
.adm-toolbar button:hover{ background:#fff; border-color:var(--ink); }
.adm-drop{
  border:1px dashed var(--line); padding:1.4rem; text-align:center;
  color:var(--muted); font-size:.86rem; cursor:pointer;
  transition:border-color .3s var(--ease), background .3s var(--ease);
}
.adm-drop:hover,.adm-drop.is-over{ border-color:var(--gold); background:#FFFDF8; }
.adm-thumb{ margin-top:.9rem; position:relative; }
.adm-thumb img{ width:100%; aspect-ratio:16/10; object-fit:cover; }
.adm-actions{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem; }
.adm-steps{ counter-reset:s; list-style:none; margin:1.2rem 0 0; padding:0; display:grid; gap:.75rem; }
.adm-steps li{
  counter-increment:s; position:relative; padding-left:2.4rem;
  font-size:.9rem; line-height:1.6; color:var(--ink-3);
}
.adm-steps li::before{
  content:counter(s); position:absolute; left:0; top:0;
  width:24px; height:24px; display:grid; place-items:center;
  background:var(--ink); color:var(--gold);
  font-size:.7rem; font-weight:600;
}
.adm-steps code, .adm-hint code{
  background:var(--paper-2); padding:.12em .4em; font-size:.88em;
  border:1px solid var(--line);
}
.adm-preview{ position:sticky; top:100px; }
.adm-status{
  margin-top:1rem; padding:.9rem 1.1rem; font-size:.86rem;
  background:#F1F8F2; border:1px solid #BFDCC5; color:#1F6B33;
}
.adm-status.is-error{ background:#FCF1F1; border-color:#E4C0C0; color:#8B2B2B; }
.adm-list{ list-style:none; margin:1rem 0 0; padding:0; display:grid; gap:.55rem; max-height:280px; overflow:auto; }
.adm-list li{
  display:flex; gap:1rem; align-items:center; justify-content:space-between;
  border:1px solid var(--line); padding:.7rem .9rem; font-size:.86rem; background:var(--paper);
}
.adm-list button{ color:#8B2B2B; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }

/* ---------- 26. Página 404 ----------------------------------------------- */
.err{
  min-height:100svh; display:grid; place-items:center; text-align:center;
  background:var(--ink); color:#fff; padding:var(--pad);
}
.err__num{ font-family:var(--serif); font-size:clamp(5rem,18vw,12rem); line-height:1; color:var(--gold); }

/* ---------- 27. Responsive ----------------------------------------------- */
@media (max-width:1080px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .adm-grid{ grid-template-columns:1fr; }
  .adm-preview{ position:static; }
}
@media (max-width:900px){
  .nav{ display:none; }
  .header-actions .btn{ display:none; }
  .burger{ display:flex; }
  .split,.pillar,.doc-head{ grid-template-columns:1fr; }
  .split--reverse{ direction:ltr; }
  .pillar:nth-child(even) .pillar__media{ order:0; }
  .hero__social,.scroll-cue{ display:none; }
  .doc-num{ font-size:2.6rem; }
  .terms > dl > div{ grid-template-columns:1fr; gap:.35rem; }
}
@media (max-width:680px){
  .stat{ border-right:0; border-bottom:1px solid rgba(255,255,255,.1); }
  .stats__grid{ grid-template-columns:1fr 1fr; }
  .stat:nth-child(odd){ border-right:1px solid rgba(255,255,255,.1); }
  .footer-grid{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  .cta__inner{ flex-direction:column; align-items:flex-start; }
  .portrait::before{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  [data-reveal]{ opacity:1 !important; transform:none !important; clip-path:none !important; }
  .reveal-line > span{ transform:none !important; }
  .fade-up{ opacity:1 !important; transform:none !important; }
  .hero__media video,.hero__media img{ transform:none !important; }
}

/* ---------- 28. Impresión ------------------------------------------------ */
@media print{
  .site-header,.mobile-menu,.wa-float,.scroll-cue,.hero__social,
  .video-toggle,.doc-index,.cta,.site-footer,.filters{ display:none !important; }
  body{ background:#fff; color:#000; font-size:11pt; }
  .section,.doc-section{ padding-block:1.2rem; break-inside:avoid; }
  .doc-hero{ min-height:auto; color:#000; background:#fff; }
  .doc-hero__media{ display:none; }
  .terms{ background:#fff; color:#000; border:1px solid #999; }
  .terms dt{ color:#000; }
  .terms dd,.terms dd b{ color:#000; }
  a[href^="http"]::after{ content:" (" attr(href) ")"; font-size:8pt; color:#555; }
}
