/* =========================
   RESET + BASE
   ========================= */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

:root{
  --padX: clamp(18px, 5vw, 64px);
  --padY: clamp(48px, 7vw, 98px);
  --padY-page: clamp(42px, 6vw, 84px);

  --sans: "Times New Roman", Times, serif;
  --serif: "Times New Roman", Times, serif;
  --display: "Times New Roman", Times, serif;

  --paper: #ffffff;
  --ink: #14120f;
  --ink-soft: rgba(20,18,15,0.68);
  --line: rgba(20,18,15,0.22);

  --accent: #5b2c2c;
  --accent-2: #2f3b33;
  --team-accent: #8a6443;

  --glass: rgba(255,255,255,0.72);
  --shadow: 0 28px 70px rgba(0,0,0,0.18);
  --ease: cubic-bezier(.77,0,.18,1);
  --easeSoft: cubic-bezier(.22,1,.18,1);
  --mx: 50%;
  --my: 20%;

  --menu-grad-a: #0f1d2a;
  --menu-grad-b: #1a2f42;
  --menu-grad-c: #2a4b64;
  --menu-grad-angle: 130deg;
  --menu-grad-angle-soft: 145deg;
  --menu-layer-a: rgba(0,0,0,0.26);
  --menu-layer-b: rgba(0,0,0,0.18);
}

body{
  font-family: var(--serif);
  background:
    radial-gradient(1000px 600px at 8% -10%, rgba(91,44,44,0.10), transparent 60%),
    radial-gradient(900px 500px at 92% -5%, rgba(47,59,51,0.08), transparent 60%),
    var(--paper);
  background-position: 0% 0%, 100% 0%, 0 0;
  background-size: 120% 120%, 120% 120%, auto;
  animation: ambientShift 18s ease-in-out infinite alternate;
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  min-height: 100vh;
}

body.page-home:not(.dark):not(.creative){
  background:
    radial-gradient(760px 360px at 12% 14%, rgba(194,158,92,0.046), transparent 74%),
    radial-gradient(620px 320px at 86% 84%, rgba(156,118,64,0.034), transparent 78%),
    radial-gradient(1000px 600px at 8% -10%, rgba(91,44,44,0.10), transparent 60%),
    radial-gradient(900px 500px at 92% -5%, rgba(47,59,51,0.08), transparent 60%),
    var(--paper);
  background-position: 0% 0%, 100% 100%, 0% 0%, 100% 0%, 0 0;
  background-size: 120% 120%, 120% 120%, 120% 120%, 120% 120%, auto;
}

img{ max-width: 100%; height: auto; display: block; }
a{ color: inherit; }
button{ font: inherit; }

/* =========================
   AUTHOR DETAILS (SUBTLE)
   ========================= */
.menu-items a,
.about-nav a,
.footer-right a,
.contact-card a,
.team-link,
.final-secondary,
.project-back,
.form-back{
  position: relative;
  text-decoration: none;
}
.about-nav a::after,
.footer-right a::after,
.contact-card a::after,
.team-link::after,
.final-secondary::after,
.project-back::after,
.form-back::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.35rem;
  height: 1px;
  background: currentColor;
  opacity: 0.35;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .45s var(--easeSoft), opacity .45s var(--easeSoft);
}

.final-secondary::after{
  content: none;
}
.about-nav a:hover::after,
.footer-right a:hover::after,
.contact-card a:hover::after,
.team-link:hover::after,
.final-secondary:hover::after,
.project-back:hover::after,
.form-back:hover::after,
.about-nav a:focus-visible::after,
.footer-right a:focus-visible::after,
.contact-card a:focus-visible::after,
.team-link:focus-visible::after,
.final-secondary:focus-visible::after,
.project-back:focus-visible::after,
.form-back:focus-visible::after{
  opacity: .75;
  transform: scaleX(1);
}

::selection{
  background: rgba(91,44,44,0.22);
  color: var(--ink);
}

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

@keyframes ambientShift{
  to{
    background-position: 12% 8%, 88% 10%, 0 0;
  }
}

/* =========================
   CURSOR DOT (DESKTOP)
   ========================= */
.cursor-dot{
  position: fixed;
  top: 0;
  left: 0;
  width: 8px;
  height: 8px;
  border: 1px solid rgba(20,20,20,0.6);
  border-radius: 50%;
  background: transparent;
  pointer-events: none;
  z-index: 9999;
  opacity: 0;
  transform: translate3d(-9999px, -9999px, 0);
  will-change: transform;
}
body.cursor-dot-active .cursor-dot{
  opacity: 0.85;
}
body.dark .cursor-dot{
  border-color: rgba(255,255,255,0.7);
}

/* =========================
   PAGE REVEAL (SUBTLE)
   ========================= */
html.has-js body.page-desarrollo .dev-shell,
html.has-js body.page-contacto .contact-hero,
html.has-js body.page-contacto .contact-cards,
html.has-js body.page-contacto .contact-cta,
html.has-js body.page-proyecto .project-hero,
html.has-js body.page-proyecto .project-gallery,
html.has-js body.page-proyecto .project-resources,
html.has-js body.page-equipo .equipo-title,
html.has-js body.page-equipo .equipo-desc,
html.has-js body.page-equipo .equipo-grid{
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .6s var(--easeSoft), transform .6s var(--easeSoft);
}
html.has-js body.page-ready.page-desarrollo .dev-shell,
html.has-js body.page-ready.page-contacto .contact-hero,
html.has-js body.page-ready.page-contacto .contact-cards,
html.has-js body.page-ready.page-contacto .contact-cta,
html.has-js body.page-ready.page-proyecto .project-hero,
html.has-js body.page-ready.page-proyecto .project-gallery,
html.has-js body.page-ready.page-proyecto .project-resources,
html.has-js body.page-ready.page-equipo .equipo-title,
html.has-js body.page-ready.page-equipo .equipo-desc,
html.has-js body.page-ready.page-equipo .equipo-grid{
  opacity: 1;
  transform: translateY(0);
}
html.has-js body.page-proyecto .project-hero{ transition-delay: .05s; }
html.has-js body.page-proyecto .project-gallery{ transition-delay: .12s; }
html.has-js body.page-proyecto .project-resources{ transition-delay: .18s; }
html.has-js body.page-equipo .equipo-title{ transition-delay: .05s; }
html.has-js body.page-equipo .equipo-desc{ transition-delay: .12s; }
html.has-js body.page-equipo .equipo-grid{ transition-delay: .18s; }
html.has-js body.page-contacto .contact-hero{ transition-delay: .05s; }
html.has-js body.page-contacto .contact-cards{ transition-delay: .12s; }
html.has-js body.page-contacto .contact-cta{ transition-delay: .2s; }

html.has-js .dev-project-card{
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .5s var(--easeSoft), transform .5s var(--easeSoft);
  transition-delay: var(--delay, 0ms);
}
html.has-js .dev-project-card.is-visible{
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce){
  html.has-js body.page-desarrollo .dev-shell,
  html.has-js body.page-contacto .contact-hero,
  html.has-js body.page-contacto .contact-cards,
  html.has-js body.page-contacto .contact-cta,
  html.has-js body.page-equipo .equipo-title,
  html.has-js body.page-equipo .equipo-desc,
  html.has-js body.page-equipo .equipo-grid,
  html.has-js .dev-project-card{
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Skip link */
.skip-link{
  position: fixed;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  background: var(--paper);
  color: var(--ink);
  text-decoration: none;
  font-size: .70rem;
  letter-spacing: .20em;
  text-transform: uppercase;
  border: 1px solid var(--line);
  border-radius: 999px;
  transform: translateY(-200%);
  z-index: 300;
}
.skip-link:focus{ transform: translateY(0); }

/* =========================
   SCROLL SNAP (desktop vertical)
   ========================= */
html, body{ scroll-snap-type: y proximity; }
.project{ scroll-snap-align: start; scroll-snap-stop: normal; }
.snap{ scroll-snap-align: start; }
@media (min-width: 1024px){
  html, body{ scroll-snap-type: none; }
  .project, .snap{ scroll-snap-align: none; }
}
html.has-stack, html.has-stack body{
  scroll-snap-type: none;
}

/* Accesibilidad: texto solo para lectores */
.sr-only{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* =========================
   GRAIN
   ========================= */
.grain{
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 5;
  opacity: 0.10;
  mix-blend-mode: multiply;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  background-size: 220px 220px;
}

/* =========================
   SPOTLIGHT
   ========================= */
.spotlight{
  position: fixed;
  inset: -20%;
  z-index: 4;
  pointer-events: none;
  opacity: 0;
  mix-blend-mode: screen;
  background: radial-gradient(600px 400px at var(--mx) var(--my), rgba(255,255,255,0.16), transparent 60%);
  transition: opacity .6s ease;
}
@media (hover: hover) and (pointer: fine){
  .spotlight{ opacity: .55; }
  body.menu-open .spotlight{ opacity: 0; }
}
body.dark .spotlight{
  background: radial-gradient(600px 400px at var(--mx) var(--my), rgba(255,255,255,0.10), transparent 60%);
}

/* =========================
   SCROLL PROGRESS
   ========================= */
.scroll-progress{
  position: fixed;
  top: 18vh;
  right: calc(var(--padX) - 6px);
  width: 2px;
  height: 64vh;
  background: rgba(0,0,0,0.12);
  border-radius: 999px;
  z-index: 180;
  transition: opacity .25s ease;
}
.scroll-progress::after{
  content: "";
  display: block;
  width: 100%;
  height: calc(var(--progress, 0) * 100%);
  background: rgba(0,0,0,0.65);
  border-radius: 999px;
  transition: height .2s ease;
}
body.dark .scroll-progress{ background: rgba(255,255,255,0.18); }
body.dark .scroll-progress::after{ background: rgba(255,255,255,0.85); }

/* Internal pages: reduce effects */
body.page-contacto .spotlight,
body.page-equipo .spotlight,
body.page-desarrollo .spotlight,
body.page-form .spotlight,
body.page-proyecto .spotlight{
  opacity: 0;
}
body.page-contacto .scroll-progress,
body.page-equipo .scroll-progress,
body.page-desarrollo .scroll-progress,
body.page-form .scroll-progress,
body.page-proyecto .scroll-progress{
  display: none;
}

/* =========================
   PAGE LOGO (interior)
   ========================= */
.page-logo{
  position: fixed;
  top: calc(22px + env(safe-area-inset-top));
  left: var(--padX);
  z-index: 200;

  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(14px, 1.4vw, 20px);
  letter-spacing: 0.40em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ink);
  transition: opacity .45s ease, transform .45s var(--easeSoft), filter .45s ease;
}
body.menu-open .page-logo{ opacity: 0; }
body.logo-faded .page-logo{ opacity: 0; transform: translateY(-6px); filter: blur(8px); }

body.page-desarrollo .page-logo.page-logo-box{
  display: inline-flex;
  flex-direction: column;
  align-items: stretch;
  width: fit-content;
  gap: 2px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  font-size: initial;
  letter-spacing: 0;
  text-transform: none;
}
body.page-desarrollo .page-logo-box .page-logo-main{
  display: block;
  width: max-content;
  white-space: nowrap;
  line-height: 1;
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(12px, .86vw, 14px);
  letter-spacing: .38em;
  text-transform: uppercase;
}
body.page-desarrollo .page-logo-box .page-logo-sub{
  display: block;
  width: 100%;
  white-space: nowrap;
  line-height: 1;
  text-align: justify;
  text-align-last: justify;
  font-family: var(--serif);
  font-size: clamp(8px, .54vw, 10px);
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
body.page-desarrollo .page-logo-box .page-logo-sub::after{
  content: "";
  display: inline-block;
  width: 100%;
}

/* =========================
   SITE LOGO (PC + MOBILE)
   - solo visible mientras body.in-hero
   ========================= */
.site-logo{
  position: fixed;
  top: calc(22px + env(safe-area-inset-top));
  left: var(--padX);
  z-index: 200;

  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(18px, 1.6vw, 24px);
  letter-spacing: 0.45em;
  text-transform: uppercase;

  color: #f5f2ee;
  pointer-events: none;
  text-shadow: 0 12px 32px rgba(0,0,0,0.45);

  opacity: 0;
  transform: translateY(-10px);
  filter: blur(10px);
  transition: opacity .45s ease, transform .45s var(--easeSoft), filter .45s ease;
}
body.in-hero .site-logo{
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}
body.menu-open .site-logo{ opacity: 0; filter: blur(12px); }
body.logo-faded .site-logo{ opacity: 0; transform: translateY(-6px); filter: blur(8px); }
body.site-logo-hide .site-logo{ opacity: 0 !important; transform: translateY(-6px); filter: blur(8px); }

@keyframes logoPopNice{
  from{ opacity: 0; transform: translateY(-10px); filter: blur(10px); }
  to  { opacity: 1; transform: translateY(0);  filter: blur(0); }
}
.site-logo.logo-pop{ animation: logoPopNice .55s var(--easeSoft) both; }

/* =========================
   INTRO
   ========================= */
.intro{
  position: fixed;
  inset: 0;
  background: var(--paper);
  display: grid;
  place-items: center;
  z-index: 240;
  transition: opacity 0.9s ease;
}
.intro.is-hidden{ opacity: 0; pointer-events: none; }

.intro .logo{
  width: 320px;
  max-width: 75vw;
  opacity: 0;
  transform: scale(.975);
  filter: blur(8px);
  transition:
    opacity .95s ease,
    transform .95s var(--easeSoft),
    filter .95s ease;
}
.intro.is-visible .logo{
  opacity: 1;
  transform: scale(1);
  filter: blur(0);
}
.intro.intro-dark{ background: #0c0b0a; }
.intro.intro-dark .logo{ filter: drop-shadow(0 24px 48px rgba(0,0,0,0.45)); }

/* =========================
   MENU BUTTON
   ========================= */
.menu-btn{
  position: fixed;
  top: calc(22px + env(safe-area-inset-top));
  right: calc(var(--padX) - 6px);
  z-index: 260;

  width: 36px;
  height: 28px;
  background: none;
  border: none;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
  cursor: pointer;

  color: var(--ink);
  transition: transform .25s ease;
  isolation: isolate;
}
.menu-btn:active{ transform: scale(0.98); }

body.in-hero .menu-btn{ color: #f5f2ee; }
body.menu-open .menu-btn{ color: #f5f2ee; }

.menu-btn span{
  height: 2px;
  background: currentColor;
  transition: transform .52s var(--easeSoft), opacity .28s ease;
  border-radius: 0;
  position: relative;
  z-index: 1;
}

.menu-btn.open span:nth-child(1){ transform: translateY(13px) rotate(45deg); }
.menu-btn.open span:nth-child(2){ opacity: 0; }
.menu-btn.open span:nth-child(3){ transform: translateY(-13px) rotate(-45deg); }

.menu-btn.menu-ink-dark{ color: rgba(0,0,0,0.92) !important; }
.menu-btn.menu-ink-light{ color: rgba(255,255,255,0.92) !important; }


body.menu-open{ overflow: hidden; }
body.menu-open .projects-dots{ opacity: 0; pointer-events: none; }
body.menu-open .scroll-progress{ opacity: 0; }

/* =========================
   MENU OVERLAY
   ========================= */
.menu-overlay{
  position: fixed;
  inset: 0;
  z-index: 220;
  background: radial-gradient(900px 500px at 20% 10%, rgba(255,255,255,0.06), transparent 60%), #0a0a0a;
  display: flex;
  align-items: center;
  padding-left: var(--padX);

  transform: translateX(100%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.95s var(--easeSoft), opacity 0.35s ease;
  will-change: transform, opacity;
}
.menu-overlay::before,
.menu-overlay::after{
  content:"";
  position: absolute;
  inset: -20%;
  pointer-events: none;
  opacity: 0;
  filter: blur(70px);
  transition: opacity .6s ease;
  z-index: 1;
}
.menu-overlay::before{
  background:
    radial-gradient(420px 240px at 20% 20%, rgba(255,255,255,0.10), transparent 70%),
    radial-gradient(380px 240px at 70% 40%, rgba(255,255,255,0.06), transparent 70%),
    radial-gradient(520px 320px at 40% 80%, rgba(255,255,255,0.08), transparent 75%);
  animation: smokeDrift 18s ease-in-out infinite alternate;
}
.menu-overlay::after{
  background:
    radial-gradient(520px 320px at 70% 10%, rgba(255,255,255,0.08), transparent 70%),
    radial-gradient(360px 220px at 15% 70%, rgba(255,255,255,0.05), transparent 70%);
  animation: smokeDrift 22s ease-in-out infinite alternate-reverse;
}
.menu-overlay.open::before,
.menu-overlay.open::after{
  opacity: .55;
}
.menu-items{ position: relative; z-index: 2; }

@keyframes smokeDrift{
  0%{ transform: translate3d(0,0,0) scale(1); }
  100%{ transform: translate3d(-4%, 3%, 0) scale(1.06); }
}
.menu-overlay.open{
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}

.menu-items{ display: flex; flex-direction: column; gap: 18px; position: relative; z-index: 2; }
.menu-items a{
  font-family: var(--display);
  font-size: clamp(2.4rem, 7vw, 6.4rem);
  font-weight: 700;
  color: rgba(255,255,255,0.30);
  text-decoration: none;
  letter-spacing: 0.08em;
  display: inline-block;
  max-width: 92vw;
  text-transform: uppercase;

  transform: translateX(10px);
  opacity: 0.92;
  transition: color .28s ease, letter-spacing .28s ease, transform .45s var(--easeSoft);
}
.menu-items a.menu-anim{
  animation: fadeIn 0.70s var(--easeSoft) forwards;
  animation-delay: calc(var(--i) * 0.08s);
}
@keyframes fadeIn{
  from{ opacity: 0; transform: translateX(52px); }
  to  { opacity: 1; transform: translateX(0); }
}
.menu-items a:hover{
  color: #fff;
  letter-spacing: 0.12em;
  transform: translateX(0);
}
.menu-line{
  position: absolute;
  left: var(--padX);
  right: var(--padX);
  bottom: calc(18px + env(safe-area-inset-bottom));
  height: 1px;
  background: rgba(255,255,255,0.12);
}

@media (min-width: 769px){
  .menu-btn{
    top: calc(18px + env(safe-area-inset-top));
    right: calc(var(--padX) - 2px);
    width: 30px;
    height: 22px;
    opacity: .82;
  }
  .menu-btn:hover{ opacity: 1; }
  .menu-btn span{ height: 1.5px; }
  .menu-btn.open span:nth-child(1){ transform: translateY(10.25px) rotate(45deg); }
  .menu-btn.open span:nth-child(3){ transform: translateY(-10.25px) rotate(-45deg); }

  .menu-overlay{
    align-items: flex-start;
    justify-content: flex-start;
    padding-left: clamp(26px, 4vw, 60px);
    padding-top: clamp(88px, 10vh, 130px);
    background: linear-gradient(var(--menu-grad-angle), var(--menu-grad-a), var(--menu-grad-b) 54%, var(--menu-grad-c));
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
  .menu-overlay::before,
  .menu-overlay::after{
    opacity: 0 !important;
    animation: none;
  }

  .menu-items{
    gap: 10px;
    max-width: min(72vw, 620px);
  }
  .menu-items a{
    font-size: clamp(1.7rem, 3.6vw, 3.4rem);
    font-weight: 500;
    color: rgba(255,255,255,0.62);
    letter-spacing: 0.06em;
    transform: translateX(0);
    opacity: 0.9;
    line-height: 1.02;
  }
  .menu-items a:hover{
    color: rgba(255,255,255,0.96);
    letter-spacing: 0.08em;
    transform: translateX(0);
  }
  .menu-line{
    left: clamp(26px, 4vw, 60px);
    right: clamp(26px, 4vw, 60px);
    bottom: calc(14px + env(safe-area-inset-bottom));
    background: rgba(255,255,255,0.08);
  }

  body.creative .menu-items a{
    color: rgba(11,11,11,0.52);
  }
  body.creative .menu-items a:hover{
    color: rgba(11,11,11,0.92);
  }
  body.creative .menu-line{
    background: rgba(11,11,11,0.18);
  }
}

/* Project pages only: giant icon inside open menu (desktop only) */
body.page-proyecto .menu-overlay .menu-project-giant{
  display: none;
}

@media (min-width: 981px){
  body.page-proyecto .menu-overlay .menu-project-giant{
    display: block;
    position: absolute;
    top: 50%;
    right: clamp(26px, 4vw, 82px);
    width: clamp(360px, 38vw, 760px);
    transform: translate3d(18px, -50%, 0) scale(0.92);
    transform-origin: center right;
    opacity: 0;
    pointer-events: none;
    z-index: 2;
    transition:
      opacity 0.28s ease,
      transform 0.48s cubic-bezier(.22,1,.2,1);
  }

  body.page-proyecto .menu-overlay.open .menu-project-giant.has-icon{
    opacity: 0.94;
    transform: translate3d(0, -50%, 0) scale(1);
  }

  body.page-proyecto .menu-overlay .menu-project-giant-icon{
    display: block;
    width: 100%;
    height: auto;
    filter: brightness(0) invert(1) contrast(1.16) saturate(0);
    mix-blend-mode: screen;
    opacity: 1;
  }

  body.dark.page-proyecto .menu-overlay .menu-project-giant-icon{
    filter: brightness(0) invert(1) contrast(1.2) saturate(0);
  }

  body.page-proyecto .menu-overlay .menu-items{
    position: relative;
    z-index: 3;
  }
}

@media (max-width: 980px){
  body.page-proyecto .menu-overlay .menu-project-giant{
    display: none !important;
  }
}

/* =========================
   PROJECTS (desktop vertical)
   ========================= */
.projects{ width: 100%; }
body:not(.intro-done) .projects{
  filter: blur(6px);
  opacity: 0.85;
}
body.intro-done .projects{
  filter: blur(0);
  opacity: 1;
  transition: filter .75s var(--easeSoft), opacity .75s var(--easeSoft);
}

@media (min-width: 769px){
  .projects.projects-stack{
    position: relative;
    height: calc(var(--stack-count, 1) * 100vh);
  }
  .projects.projects-stack .project{
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 100vh;
    transform: translateY(var(--stack-translate, 0px)) scale(var(--stack-scale, 1));
    opacity: var(--stack-opacity, 1);
    transform-origin: center center;
    will-change: transform, opacity;
    transition: transform .3s var(--easeSoft), opacity .3s var(--easeSoft);
    pointer-events: none;
  }
  .projects.projects-stack .project + .project{ margin-top: -100vh; }
  .projects.projects-stack .project.stack-active{
    pointer-events: auto;
  }
  .projects.projects-stack .project.stack-hidden{
    opacity: 0 !important;
    transform: scale(0.7);
  }
  .projects.projects-stack .project.stack-next{
    pointer-events: none;
  }
  .projects.projects-stack .project.stack-current .project-title{
    opacity: 1;
  }
  .projects.projects-stack .project.stack-next .project-title{
    opacity: .55;
  }
  .projects.projects-stack .project.title-animate .project-title h2 span{
    animation: titleRise .55s var(--easeSoft) both;
    animation-delay: calc(var(--i) * 0.05s);
  }
  .projects.projects-stack .project.title-animate .project-title p{
    animation: titleFade .45s var(--easeSoft) both;
  }
  .projects.projects-stack .project-title{
    transition: transform .5s var(--easeSoft), opacity .5s var(--easeSoft);
  }
}

@keyframes titleRise{
  from{ opacity: 0; transform: translateY(6px); }
  to{ opacity: 1; transform: translateY(0); }
}
@keyframes titleFade{
  from{ opacity: 0; transform: translateY(4px); }
  to{ opacity: 1; transform: translateY(0); }
}

.project{
  position: relative;
  height: 100svh;
  min-height: 100svh;
  display: grid;
  place-items: end start;
  padding: 0 var(--padX) calc(14vh + env(safe-area-inset-bottom));
  overflow: hidden;
  --title-base: 14px;
  --scale: 1.02;
}
.project.is-focus{
  --title-base: 0px;
  --scale: 1.06;
}
.project::after{
  content:"";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(to bottom, rgba(0,0,0,0.22), rgba(0,0,0,0) 28%),
    linear-gradient(to top, rgba(0,0,0,0.28), rgba(0,0,0,0) 40%);
  opacity: .75;
  transition: opacity .8s var(--easeSoft);
}
.project.is-focus::after{ opacity: .35; }

.project-media{
  position: absolute;
  inset: -3%;
  background-image: var(--bg);
  background-size: cover;
  background-position: center;
  transform: translate3d(0, var(--parallax, 0px), 0) scale(var(--scale));
  filter: saturate(0.96) contrast(0.96) brightness(0.90);
  will-change: transform, filter;
  transition: transform 1.2s var(--easeSoft), filter 1.2s var(--easeSoft);
}
.project-media .project-video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  opacity: 0.95;
  filter: saturate(0.98) contrast(0.98) brightness(0.95);
}
.project:hover .project-media{ --scale: 1.05; }
.project.is-focus .project-media{
  filter: saturate(1.05) contrast(1.05) brightness(1);
}
.project-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 50% 60%, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.68) 78%),
    linear-gradient(to top, rgba(0,0,0,0.68), rgba(0,0,0,0.06));
}

.project-link{
  position: absolute;
  inset: 0;
  z-index: 3;
  text-decoration: none;
}
.projects .project-title{
  position: relative;
  pointer-events: none;
  z-index: 2;
  text-align: left;
  color: #fff;
  font-family: var(--display);
  padding: 0;
  max-width: 720px;
  transform: translate3d(0, calc(var(--title-shift, 0px) + var(--title-base, 0px)), 0);
  opacity: .72;
  transition: transform .9s var(--easeSoft), opacity .9s var(--easeSoft);
  text-shadow: 0 14px 36px rgba(0,0,0,0.45);
}
.project.is-focus .project-title{
  opacity: 1;
  transform: translate3d(0, var(--title-shift, 0px), 0);
}
.project-title::before{
  content: none;
  display: none;
}
.project-title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-2.2rem;
  width: 420px;
  height: 7rem;
  background: radial-gradient(ellipse, rgba(0,0,0,.44), rgba(0,0,0,0));
  filter: blur(10px);
  z-index: -1;
}
.project-title h2{
  font-size: clamp(1.26rem, 2.88vw, 2.84rem);
  letter-spacing: 0.12em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.05;
}
.project-title h2 span{ display:inline-block; white-space: nowrap; }
.project-title p{
  margin-top: 14px;
  font-size: 0.68rem;
  letter-spacing: 0.40em;
  opacity: 0.85;
}

@keyframes slideFade{
  from{ opacity: .80; filter: blur(7px); transform: translateY(2px); }
  to  { opacity: 1;   filter: blur(0);  transform: translateY(0); }
}
.project.fade{ animation: slideFade .48s var(--easeSoft) both; }
.project.is-active .project-media{
  --scale: 1.05;
  transition: transform .65s var(--easeSoft);
}

/* =========================
   DOTS MOBILE
   ========================= */
.projects-dots{
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 210;
  display: none;
  gap: 10px;
  align-items: center;
  justify-content: center;

  padding: 10px 16px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(10,10,10,0.45), rgba(10,10,10,0.25));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  opacity: 0;
  transform: translateX(-50%) translateY(12px);
  filter: blur(10px);
  transition: opacity .40s ease, transform .40s var(--easeSoft), filter .40s ease;
}
.projects-dots::before{
  content:"";
  position:absolute;
  left: 12px;
  right: 12px;
  top: 50%;
  height: 1px;
  background: rgba(255,255,255,0.35);
  transform: translateY(-50%);
  opacity: .45;
}
body.in-hero .projects-dots{
  opacity: 1;
  transform: translateX(-50%) translateY(0);
  filter: blur(0);
}

.projects-dots .dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: 0;
  background: rgba(255,255,255,0.28);
  border: 1px solid rgba(255,255,255,0.55);
  cursor: pointer;
  transition: width .25s ease, opacity .25s ease, background .25s ease;
}
.projects-dots .dot[data-shape="diamond"]{ clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.projects-dots .dot[data-shape="square"]{ border-radius: 2px; }
.projects-dots .dot[data-shape="triangle"]{ clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.projects-dots .dot.active{
  width: 22px;
  background: rgba(255,255,255,0.95);
  opacity: 1;
}

/* Home: desktop scroll cue */
.home-scroll-cue{
  position: fixed;
  left: 50%;
  bottom: calc(30px + env(safe-area-inset-bottom));
  z-index: 210;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: 0;
  border-radius: 999px;
  padding: 10px 14px 10px 16px;
  background: rgba(10,10,10,0.42);
  color: #f7f4ee;
  box-shadow: 0 12px 34px rgba(0,0,0,0.26);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transform: translate(-50%, 14px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .34s ease, transform .42s var(--easeSoft);
}
body.page-home.in-hero .home-scroll-cue{
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
}
body.menu-open .home-scroll-cue{
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, 14px) !important;
}
.home-scroll-cue__text{
  font-family: var(--serif);
  font-size: .62rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  white-space: nowrap;
}
.home-scroll-cue__index{
  font-family: var(--serif);
  font-size: .58rem;
  letter-spacing: .28em;
  opacity: .78;
  white-space: nowrap;
}
.home-scroll-cue__arrow{
  width: 9px;
  height: 9px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  animation: homeCueArrow 1.45s ease-in-out infinite;
}
.home-scroll-cue.is-last .home-scroll-cue__text{
  opacity: .82;
}
@keyframes homeCueArrow{
  0%, 100%{ transform: rotate(45deg) translateY(-1px); opacity: .85; }
  50%{ transform: rotate(45deg) translateY(2px); opacity: 1; }
}
@media (prefers-reduced-motion: reduce){
  .home-scroll-cue__arrow{ animation: none; }
}
body.dark .home-scroll-cue{
  background: rgba(247,244,238,0.14);
  color: #f7f4ee;
  border: 1px solid rgba(247,244,238,0.26);
}
body.creative .home-scroll-cue{
  background: rgba(247,242,232,0.92);
  color: #0b0b0b;
  border: 1.5px solid #0b0b0b;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
@media (max-width: 768px){
  .home-scroll-cue{ display: none !important; }
}

/* =========================
   REVEAL
   ========================= */
.reveal{
  opacity: 0;
  transform: translateY(18px);
  filter: blur(12px);
  transition: opacity 1.05s var(--easeSoft), transform 1.05s var(--easeSoft), filter 1.05s var(--easeSoft);
  transition-delay: var(--reveal-delay, 0ms);
}
.reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

/* =========================
   ABOUT
   ========================= */
.about{
  background: var(--paper);
  padding: var(--padY) var(--padX);
  font-family: var(--serif);
  border-top: 1px solid var(--line);
}
.about-header{
  display:flex;
  justify-content: space-between;
  align-items:flex-start;
  gap: 24px;
  margin-bottom: clamp(32px, 5.2vw, 72px);
}
.about-logo{
  font-family: var(--display);
  font-size: .92rem;
  letter-spacing: .32em;
  background: transparent;
  border: none;
  cursor: default;
  text-align: left;
  color: var(--ink);
}
.about-logo span{
  display:block;
  font-size: .68rem;
  letter-spacing: .25em;
  margin-top: .45rem;
  opacity: .75;
}

.theme-toggle{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: transparent;
  cursor: pointer;
  color: var(--ink-soft);
  opacity: .6;
  transition: opacity .25s ease, border-color .25s ease, color .25s ease, transform .25s ease;
}
.theme-toggle::after{
  content:"";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: .85;
}
.theme-toggle:hover{
  opacity: 1;
  color: var(--ink);
  border-color: var(--ink);
  transform: translateY(-1px);
}
.theme-indicator{
  font-size: .55rem;
  letter-spacing: .38em;
  text-transform: uppercase;
}
body.dark .theme-toggle{
  color: rgba(255,255,255,0.6);
  border-color: rgba(255,255,255,0.24);
}
body.dark .theme-toggle:hover{
  color: #fff;
  border-color: #fff;
}

.about-nav{
  display: flex;
  align-items: center;
  gap: 1.8rem;
  flex-wrap: wrap;
}
.about-nav a{
  margin-left: 0;
  font-size: .65rem;
  letter-spacing: .25em;
  text-decoration: none;
  color: var(--ink);
  opacity: .82;
  position: relative;
}
.about-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-8px;
  width:0;
  height:1px;
  background: var(--ink);
  transition: width .25s ease;
}
.about-nav a:hover{ opacity: 1; }
.about-nav a:hover::after{ width: 100%; }

.about-content{
  display:grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(28px, 6vw, 92px);
  align-items: start;
}
.about-left p{
  font-size: .72rem;
  letter-spacing: .25em;
  opacity: .85;
}
.about-right{ max-width: 62ch; }
.about-right p{
  font-size: .95rem;
  line-height: 1.95;
  margin-bottom: 2.2rem;
}
.about-right strong{
  font-weight: 700;
  letter-spacing: .02em;
}
body.page-home .about-left p{
  color: var(--team-accent);
  opacity: .9;
}

/* =========================
   EXPERIMENTAL (ICON MARQUEE)
   ========================= */
.experimental{
  background: var(--paper);
  padding: calc(var(--padY) - 6px) var(--padX);
  padding-bottom: clamp(26px, 4vw, 54px);
  overflow: hidden;
  border-top: 1px solid var(--line);
}
.experimental-title{
  font-family: var(--serif);
  font-size: .70rem;
  letter-spacing: .35em;
  margin-bottom: clamp(22px, 4.2vw, 50px);
  text-transform: uppercase;
}
.icon-marquee{
  width: 100%;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);
}
.icon-track{
  display:flex;
  align-items:center;
  gap: clamp(80px, 10vw, 160px);
  width: max-content;
  animation: scrollIcons 62s linear infinite;
  will-change: transform;
}
@keyframes scrollIcons{
  from{ transform: translate3d(0,0,0); }
  to  { transform: translate3d(-50%,0,0); }
}
.icon-box{
  width: clamp(160px, 15vw, 240px);
  height: clamp(160px, 15vw, 240px);
  display:flex;
  align-items:center;
  justify-content:center;
}
.icon-box img{
  max-width:100%;
  max-height:100%;
  opacity:.46;
  transition: opacity .34s ease, transform .34s var(--easeSoft), filter .34s ease;
}
.icon-box:hover img{
  opacity: 1;
  transform: scale(1.20);
}
@media (hover: hover) and (pointer: fine){
  .icon-marquee:hover .icon-track{ animation-play-state: paused; }
}

/* =========================
   AREAS
   ========================= */
.home-timeline{
  padding: calc(var(--padY) - 6px) var(--padX);
  padding-top: clamp(26px, 4.6vw, 64px);
  background: var(--paper);
  font-family: var(--serif);
  border-top: 1px solid var(--line);
}
.section-title{
  font-size: .70rem;
  letter-spacing: .35em;
  margin-bottom: 1.4rem;
  text-transform: uppercase;
}
.section-title.center{ text-align:center; }

.section-title,
.experimental-title,
.team-title,
.equipo-title,
.dev-title,
.contact-title,
.form-question{
  position: relative;
  display: inline-block;
}
.section-title::after,
.experimental-title::after,
.team-title::after,
.equipo-title::after,
.dev-title::after,
.contact-title::after,
.form-question::after{
  content:"";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.6rem;
  height: 1px;
  background: var(--line);
  opacity: .65;
  transform: scaleX(0);
  transform-origin: left;
  animation: lineDraw 1.1s var(--easeSoft) .15s both;
}
@keyframes lineDraw{
  from{ opacity: 0; transform: scaleX(0); }
  to  { opacity: .65; transform: scaleX(1); }
}
body.page-home .experimental-title,
body.page-home .section-title{
  color: var(--team-accent);
  opacity: .9;
}
body.page-home .experimental-title::after,
body.page-home .section-title::after{
  background: linear-gradient(90deg, currentColor, var(--line));
  opacity: .72;
}

.areas-list{
  display:flex;
  justify-content:center;
  gap: clamp(12px, 2.6vw, 28px);
  margin-bottom: 0;
  flex-wrap: wrap;
}
.areas-list a{
  background:none;
  border: 1px solid var(--line);
  font-size: .65rem;
  letter-spacing: .32em;
  color: var(--ink-soft);
  cursor:pointer;
  position: relative;
  padding: 10px 18px;
  text-transform: uppercase;
  border-radius: 999px;
  transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}
.areas-list a.is-active{
  background: var(--ink);
  color: var(--paper);
  border-color: transparent;
  box-shadow: var(--shadow);
  transform: translateY(-1px);
}
.areas-list a:hover{ color: var(--ink); }

/* =========================
   TEAM / EQUIPO (home)
   ========================= */
.team{
  background: var(--paper);
  padding: var(--padY) var(--padX);
  border-top: 1px solid var(--line);
}
.team-grid{
  display:grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(28px, 6vw, 120px);
  align-items: start;
}
.team-right{
  display: grid;
  gap: 18px;
}
.eyebrow{
  font-size: .68rem;
  letter-spacing: .40em;
  text-transform: uppercase;
  opacity: .65;
  margin-bottom: 18px;
}
.team .eyebrow{
  color: var(--team-accent);
  opacity: .92;
}
.team-title{
  font-family: var(--display);
  font-size: clamp(1.56rem, 3.08vw, 2.72rem);
  font-weight: 500;
  letter-spacing: .055em;
  text-transform: uppercase;
  line-height: 1.16;
}
.team-right p{
  font-family: var(--serif);
  font-size: 1rem;
  line-height: 1.85;
  max-width: 60ch;
  color: var(--ink-soft);
}
.team-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 4px;
}
.team-tags span{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: .58rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.team-link{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  margin-top: 24px;
  text-decoration:none;
  font-size: .65rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: var(--team-accent);
  border-bottom: 1px solid currentColor;
  padding-bottom: 6px;
}
.team-link:hover{ opacity: .9; }

/* =========================
   CTA + FOOTER
   ========================= */
.final-cta{
  padding: calc(var(--padY) + 18px) var(--padX) calc(var(--padY) - 2px);
  background:
    radial-gradient(700px 320px at 50% -10%, rgba(91,44,44,0.14), transparent 70%),
    var(--paper);
  text-align:center;
  font-family: var(--serif);
  border-top: 1px solid var(--line);
}
.final-question{
  font-size: 1rem;
  letter-spacing: .35em;
  margin-bottom: 2.2rem;
  text-transform: uppercase;
}
.final-button{
  display:inline-block;
  background: var(--ink);
  color: var(--paper);
  text-decoration:none;
  padding: 1.05rem 3.2rem;
  font-size: .70rem;
  letter-spacing: .25em;
  border-radius: 999px;
  box-shadow: var(--shadow);
  transition: transform .25s ease, opacity .25s ease, box-shadow .25s ease;
}
.final-button:hover{
  transform: translateY(-2px);
  opacity: .92;
  box-shadow: 0 22px 70px rgba(0,0,0,0.22);
}
.final-secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top: 16px;
  padding: 0.9rem 2.6rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  text-decoration: none;
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: var(--ink);
  background: transparent;
  transition: transform .25s ease, opacity .25s ease, border-color .25s ease;
}
.final-secondary:hover{
  transform: translateY(-1px);
  opacity: .85;
  border-color: var(--ink);
}
body.page-home .final-secondary{
  color: var(--team-accent);
  border-color: currentColor;
}
body.page-home .final-secondary:hover{
  border-color: currentColor;
  opacity: .92;
}
.site-footer{
  border-top: 1px solid var(--line);
  padding: 2rem var(--padX);
  display:flex;
  justify-content: space-between;
  align-items:center;
  font-family: var(--serif);
  font-size: .65rem;
  letter-spacing: .20em;
  text-transform: uppercase;
  background: var(--paper);
}
.footer-right a{
  margin-left: 1.6rem;
  text-decoration:none;
  color: var(--ink);
  opacity:.85;
}
.footer-right a:hover{ opacity:1; text-decoration: underline; }

/* =========================
   EQUIPO PAGE
   ========================= */
.equipo{
  padding: clamp(74px, 8vw, 118px) var(--padX) clamp(54px, 7vw, 98px);
  min-height: 100vh;
  background:
    radial-gradient(760px 300px at 12% 2%, rgba(138,100,67,0.11), transparent 74%),
    radial-gradient(560px 260px at 88% 92%, rgba(138,100,67,0.07), transparent 78%),
    var(--paper);
  border-top: 1px solid var(--line);
  position: relative;
  overflow: hidden;
}
body.dark .equipo{
  background:
    radial-gradient(760px 300px at 12% 2%, rgba(211,178,119,0.11), transparent 74%),
    radial-gradient(560px 260px at 88% 92%, rgba(211,178,119,0.07), transparent 78%),
    #0d0b0a;
}
.equipo > *{ position: relative; z-index: 1; }
.equipo-watermark{
  position: absolute;
  inset: -10% -5% auto;
  height: 120%;
  z-index: 0;
  pointer-events: none;
  background-image:
    url("assets/branding/logos/ivan-facio-mark-primary.svg"),
    url("assets/branding/logos/ivan-facio-mark-secondary.svg");
  background-repeat: no-repeat;
  background-size: 70vmin auto, 85vmin auto;
  background-position: 12% 18%, 82% 68%;
  opacity: 0.03;
  filter: saturate(0);
}
body.dark .equipo-watermark{
  filter: invert(1) brightness(1.2);
  opacity: 0.045;
}
.equipo-title{
  font-family: var(--display);
  font-size: clamp(1.52rem, 4.08vw, 3.36rem);
  font-weight: 500;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-align: left;
}
.equipo-intro{
  display: grid;
  grid-template-columns: minmax(0, 74ch) minmax(0, 1fr);
  grid-template-areas:
    "title ."
    "desc signature";
  column-gap: clamp(18px, 4.5vw, 96px);
  row-gap: clamp(12px, 2vw, 22px);
  align-items: end;
}
.equipo-title{ grid-area: title; }
.equipo-desc{
  grid-area: desc;
  margin-top: clamp(16px, 2.6vw, 26px);
  max-width: min(74ch, 100%);
  color: var(--ink-soft);
  font-family: var(--serif);
  line-height: 1.85;
  text-align: left;
}
.equipo-signature{
  grid-area: signature;
  justify-self: end;
  align-self: end;
  text-align: right;
  font-size: .68rem;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--team-accent);
  opacity: .9;
  white-space: nowrap;
  margin-bottom: 2px;
}
.equipo-grid{
  margin-top: clamp(34px, 5.2vw, 72px);
  display:grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(16px, 2.4vw, 30px);
  align-items: start;
}
.miembro{
  background: linear-gradient(135deg, rgba(255,255,255,0.38), rgba(255,255,255,0.08));
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: clamp(14px, 2vw, 24px);
  display: grid;
  gap: 14px;
  box-shadow: 0 14px 32px rgba(0,0,0,0.05);
}
body.dark .miembro{
  background: linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,255,255,0.01));
  box-shadow: 0 16px 34px rgba(0,0,0,0.34);
}
.miembro-media{
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 4 / 5;
}
.miembro-media::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0));
  opacity: 0;
  transition: opacity .35s var(--easeSoft);
}
.miembro img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  filter: grayscale(0.06) contrast(1.04) brightness(1.04);
  object-position: center 28%;
}
body.dark .miembro img{
  filter: grayscale(0.04) contrast(1.08) brightness(1.1);
}
.miembro-overlay{
  position:absolute;
  z-index: 1;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: #fff;
  opacity: 0;
  transition: opacity .35s var(--easeSoft);
}
.miembro-media:hover .miembro-overlay,
.miembro-media:hover::after{
  opacity: 1;
}
.miembro-overlay.overlay-center{
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.miembro-overlay.overlay-tl{
  top: 12px;
  left: 12px;
}
.miembro-overlay.overlay-tr{
  top: 12px;
  right: 12px;
}
.miembro-overlay.overlay-bl{
  bottom: 12px;
  left: 12px;
}
.miembro-overlay.overlay-br{
  bottom: 12px;
  right: 12px;
}
.miembro h3{
  font-size: clamp(.82rem, 1.02vw, .98rem);
  letter-spacing: .2em;
  text-transform: uppercase;
  line-height: 1.35;
}
.miembro span{
  font-family: var(--serif);
  font-size: .68rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ink-soft);
  display:block;
}

.miembro--ivan{
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: clamp(300px, 35vw, 520px) minmax(260px, 1fr);
  grid-template-rows: auto auto;
  column-gap: clamp(18px, 2.8vw, 40px);
  align-items: end;
}
.miembro--emmanuel{
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) clamp(300px, 35vw, 520px);
  grid-template-rows: auto auto;
  column-gap: clamp(18px, 2.8vw, 40px);
  align-items: end;
}
.miembro--fernanda{
  grid-column: 1 / 4;
}
.miembro--axel{
  grid-column: 4 / 7;
}
.miembro--chapa{
  grid-column: 7 / 10;
}
.miembro--paula{
  grid-column: 10 / -1;
}

.miembro--ivan .miembro-media,
.miembro--emmanuel .miembro-media{
  grid-row: 1 / span 2;
  min-height: auto;
  max-height: clamp(460px, 62vh, 700px);
  aspect-ratio: 4 / 5;
}
.miembro--ivan .miembro-media{ grid-column: 1; }
.miembro--emmanuel .miembro-media{ grid-column: 2; }
.miembro--ivan img{ object-position: center 24%; }
.miembro--emmanuel img{ object-position: center 20%; }
.miembro--paula img{ object-position: center 26%; }
.miembro--axel img{ object-position: center 48%; }
.miembro--fernanda img{ object-position: center 34%; }
.miembro--chapa img{ object-position: center 30%; }
.miembro--fernanda img,
.miembro--chapa img{
  filter: grayscale(1) contrast(1.06) brightness(1.02);
}
body.dark .miembro--fernanda img,
body.dark .miembro--chapa img{
  filter: grayscale(1) contrast(1.1) brightness(1.08);
}

@media (max-width: 1240px){
  .miembro--paula,
  .miembro--axel,
  .miembro--fernanda,
  .miembro--chapa{
    grid-column: span 6;
  }
}

.miembro--ivan h3,
.miembro--ivan span{
  grid-column: 2;
  text-align: left;
}
.miembro--emmanuel h3,
.miembro--emmanuel span{
  grid-column: 1;
  text-align: left;
}
.miembro--ivan h3,
.miembro--emmanuel h3{
  font-size: clamp(.9rem, 1.16vw, 1.06rem);
  letter-spacing: .24em;
}
.miembro--ivan span,
.miembro--emmanuel span{
  font-size: .72rem;
  letter-spacing: .24em;
  opacity: .92;
  padding-bottom: 6px;
}

@media (max-width: 900px){
  .equipo-intro{
    display: block;
  }
  .equipo-title,
  .equipo-desc{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .equipo-signature{
    display: none;
  }
  .equipo-grid{
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .miembro,
  .miembro--ivan,
  .miembro--emmanuel,
  .miembro--paula,
  .miembro--axel,
  .miembro--fernanda,
  .miembro--chapa{
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    column-gap: 0;
    text-align: left;
  }
  .miembro--ivan .miembro-media,
  .miembro--emmanuel .miembro-media{
    grid-row: auto;
    grid-column: auto;
    min-height: auto;
    aspect-ratio: 4 / 5;
  }
  .miembro--ivan h3,
  .miembro--ivan span,
  .miembro--emmanuel h3,
  .miembro--emmanuel span{
    grid-column: auto;
  }
}

/* =========================
   DESARROLLO PAGE
   ========================= */
.dev-page{
  padding: clamp(84px, 9vw, 132px) var(--padX) clamp(42px, 6vw, 80px);
  min-height: 100vh;
  background:
    radial-gradient(760px 360px at 6% -2%, rgba(138,100,67,0.08), transparent 76%),
    radial-gradient(720px 340px at 94% 18%, rgba(138,100,67,0.05), transparent 78%),
    var(--paper);
  border-top: 1px solid var(--line);
}
body.dark .dev-page{
  background:
    radial-gradient(760px 360px at 6% -2%, rgba(211,178,119,0.08), transparent 76%),
    radial-gradient(720px 340px at 94% 18%, rgba(211,178,119,0.05), transparent 78%),
    #0d0b0a;
}
.dev-shell{
  display: grid;
  grid-template-columns: minmax(250px, 340px) minmax(0, 1fr);
  gap: clamp(26px, 4.6vw, 80px);
  align-items: start;
}
.dev-sidebar{
  position: sticky;
  top: calc(90px + env(safe-area-inset-top));
  align-self: start;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-height: auto;
  padding: clamp(14px, 1.9vw, 24px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255,255,255,0.34), rgba(255,255,255,0.06));
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
body.dark .dev-sidebar{
  background: linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.015));
}
.dev-sidebar-head{
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 20px;
}
.dev-kicker{
  font-size: .65rem;
  letter-spacing: .40em;
  text-transform: uppercase;
  opacity: .65;
  margin-bottom: 10px;
}
.dev-overline{
  font-size: .7rem;
  letter-spacing: .30em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 14px;
}
.dev-title{
  font-family: var(--display);
  font-size: clamp(1.6rem, 3.6vw, 3.3rem);
  letter-spacing: .16em;
  text-transform: uppercase;
  line-height: 1.1;
  margin-bottom: 16px;
}
.dev-intro{
  font-size: .95rem;
  line-height: 1.9;
  color: var(--ink-soft);
  max-width: 44ch;
}
.dev-switch{
  display: flex;
  gap: 12px;
  margin: 0;
  align-items: flex-start;
}
.dev-switch-btn{
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  padding: 8px 14px;
  font-size: .65rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  border-radius: 999px;
  transition: opacity .25s ease, border-color .25s ease, transform .25s ease;
}
.dev-switch-btn.is-active{
  border-color: var(--ink);
  opacity: .7;
}
.dev-switch-btn:hover{ transform: translateY(-1px); }

.dev-chrono{
  margin-top: 22px;
  align-self: flex-start;
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.06);
  color: var(--ink);
  padding: 10px 16px;
  font-size: .68rem;
  letter-spacing: .34em;
  text-transform: uppercase;
  border-radius: 999px;
  transition: border-color .3s var(--easeSoft), opacity .3s ease, transform .3s ease;
}
.dev-chrono:hover{ transform: translateY(-1px); border-color: var(--ink); }
.dev-chrono.is-active{
  border-color: var(--team-accent);
  color: var(--team-accent);
  opacity: .95;
}

.dev-nav{
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.dev-nav-sections{
  gap: 8px;
}
.dev-nav-button{
  border: 1px solid transparent;
  background: transparent;
  text-align: left;
  display: grid;
  grid-template-columns: 20px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid transparent;
  border-radius: 10px;
  color: var(--ink);
  text-transform: uppercase;
  letter-spacing: .24em;
  font-size: .75rem;
  transition: opacity .25s ease, border-color .25s ease, background-color .25s ease, transform .25s ease;
}
.dev-nav-button:last-child{ border-bottom: none; }
.dev-nav-button:hover{
  opacity: .96;
  transform: translateY(-1px);
  border-color: var(--line);
  background: rgba(255,255,255,0.06);
}
.dev-nav-button.is-active{
  opacity: 1;
  border-color: var(--line);
  background: rgba(255,255,255,0.08);
}
.dev-nav-icon{
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-soft);
  opacity: .6;
  transition: opacity .25s ease, color .25s ease;
}
.dev-nav-icon svg{ width: 100%; height: 100%; }
.dev-nav-button:hover .dev-nav-icon{ opacity: .9; color: var(--ink); }
.dev-nav-count{
  font-size: .6rem;
  letter-spacing: .28em;
  color: var(--ink-soft);
}

.dev-cat{
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}
.dev-cat:last-child{ border-bottom: none; }
.dev-cat-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.dev-cat-link{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.dev-cat-icon{
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink);
}
.dev-cat-icon svg{ width: 100%; height: 100%; }
.dev-cat-title{
  font-size: .7rem;
  letter-spacing: .32em;
  text-transform: uppercase;
}
.dev-cat-count{
  font-size: .6rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.dev-cat-list{
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dev-cat-list a{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  text-decoration: none;
  font-size: .82rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink);
}
.dev-cat-list a span:last-child{
  color: var(--ink-soft);
  font-size: .65rem;
  letter-spacing: .28em;
}
.dev-cat-list a span:last-child:empty{ display: none; }
.dev-cat-list a:hover{ opacity: .65; }

.dev-content-head{ margin-bottom: 26px; }
.dev-caption{
  font-size: .9rem;
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 62ch;
}
.dev-content{
  position: relative;
}
.dev-section{
  margin-bottom: clamp(28px, 4vw, 56px);
  padding: clamp(18px, 2.5vw, 30px);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,0.20), rgba(255,255,255,0.04));
  box-shadow: 0 16px 38px rgba(0,0,0,0.06);
}
body.dark .dev-section{
  background: linear-gradient(145deg, rgba(255,255,255,0.04), rgba(255,255,255,0.012));
  box-shadow: 0 18px 40px rgba(0,0,0,0.36);
}
.dev-section-head{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  padding: 0 2px 14px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 20px;
}
.dev-section-title{
  font-family: var(--display);
  font-size: clamp(1.05rem, 2.4vw, 1.95rem);
  letter-spacing: .16em;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1.1;
}
.dev-section-count{
  font-size: .68rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.dev-project-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: clamp(14px, 2.1vw, 24px);
}
.dev-project-card{
  text-decoration: none;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: transform .3s var(--easeSoft), opacity .3s ease;
  position: relative;
  background: linear-gradient(135deg, rgba(255,255,255,0.22), rgba(255,255,255,0.05));
  min-height: 142px;
}
.dev-project-card:hover{ transform: translateY(-3px); opacity: .96; border-color: var(--team-accent); }
.dev-project-card:focus-visible{ outline: 2px solid var(--accent); outline-offset: 6px; }
body.dark .dev-project-card{
  background: linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,255,255,0.012));
}
.dev-project-icon{
  position: absolute;
  right: 14px;
  top: 12px;
  width: 30px;
  height: 30px;
  opacity: .16;
  filter: grayscale(1);
  transition: opacity .3s var(--easeSoft), transform .3s var(--easeSoft);
}
.dev-project-card:hover .dev-project-icon{
  opacity: .28;
  transform: translateY(-2px);
}
body.dark .dev-project-icon{
  filter: invert(1) brightness(1.2);
  opacity: .25;
}

.dev-project-card.has-icon{
  padding-top: 16px;
  min-height: 142px;
}
.dev-project-card.has-icon .dev-project-icon{
  left: auto;
  right: 14px;
  top: 12px;
  width: clamp(24px, 2.2vw, 34px);
  height: clamp(24px, 2.2vw, 34px);
  opacity: .16;
  transform: none;
  filter: grayscale(1) contrast(1.08);
}
.dev-project-card.has-icon .dev-project-name,
.dev-project-card.has-icon .dev-project-meta{
  opacity: 1;
  transform: none;
  transition: opacity .25s var(--easeSoft), transform .25s var(--easeSoft);
}
.dev-project-card.has-icon:hover .dev-project-name,
.dev-project-card.has-icon:hover .dev-project-meta{
  opacity: 1;
  transform: translateY(0);
}
.dev-project-card.has-icon:hover .dev-project-icon{
  opacity: .28;
  transform: translateY(-2px);
}
body.dark .dev-project-card.has-icon .dev-project-icon{
  opacity: .24;
  filter: invert(1) brightness(1.2);
}
body.dark .dev-project-card.has-icon:hover .dev-project-icon{
  opacity: .3;
}
@media (hover: none){
  .dev-project-card.has-icon .dev-project-name,
  .dev-project-card.has-icon .dev-project-meta{
    opacity: 1;
    transform: none;
  }
  .dev-project-card.has-icon .dev-project-icon{
    left: auto;
    right: 0;
    top: 10px;
    width: 28px;
    height: 28px;
    opacity: .25;
    transform: none;
  }
}
.dev-project-name{
  font-size: .82rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  line-height: 1.32;
  padding-right: 38px;
}
.dev-project-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: .6rem;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.dev-project-meta:empty{ display: none; }
.dev-project-tag{
  font-size: .6rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--line);
  padding-bottom: 4px;
  width: fit-content;
}

@media (max-width: 980px){
  .dev-shell{ grid-template-columns: 1fr; }
  .dev-sidebar{
    position: static;
    min-height: auto;
    padding: 12px;
    border-radius: 14px;
  }
  .dev-nav{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px 14px;
  }
  .dev-nav-button{
    grid-template-columns: 18px auto;
    gap: 8px;
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 8px 12px;
    font-size: .6rem;
    letter-spacing: .22em;
    width: fit-content;
  }
  .dev-nav-count{ margin-left: 8px; }
  .dev-project-grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .dev-project-card{
    border: 1px solid var(--line);
    padding: 14px 14px 16px;
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255,255,255,0.22), rgba(255,255,255,0.05));
  }
  body.dark .dev-project-card{
    background: linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.015));
  }
  .dev-project-card.has-icon{
    min-height: auto;
    padding: 14px 14px 16px;
  }
  .dev-project-card.has-icon .dev-project-icon{
    left: auto;
    right: 12px;
    top: 12px;
    width: 34px;
    height: 34px;
    opacity: .25;
    transform: none;
    filter: grayscale(1) contrast(1.08);
  }
  .dev-project-card.has-icon .dev-project-name,
  .dev-project-card.has-icon .dev-project-meta{
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 680px){
  .dev-nav{ gap: 10px; }
  .dev-project-grid{ grid-template-columns: 1fr; }
  .dev-cat-list a{ letter-spacing: .16em; }
  .dev-switch{ flex-direction: column; width: 100%; }
  .dev-switch-btn{
    width: 100%;
    text-align: left;
    padding: 12px 14px;
    font-size: .6rem;
    letter-spacing: .20em;
  }
  .dev-nav-button{
    font-size: .6rem;
    letter-spacing: .18em;
    padding: 10px 12px;
    grid-template-columns: 18px auto;
  }
  .dev-nav-count{ letter-spacing: .20em; }
  .dev-section-title{ font-size: clamp(1.16rem, 5.4vw, 1.72rem); }
  .dev-section-count{ letter-spacing: .20em; }
  .dev-project-name{ font-size: .85rem; letter-spacing: .18em; }
  .dev-project-meta{ letter-spacing: .22em; }
  .dev-project-card{ gap: 8px; }
}

/* =========================
   DESARROLLO REFINEMENT
   ========================= */
body.page-desarrollo .dev-page{
  background:
    radial-gradient(860px 420px at 4% -4%, rgba(138,100,67,0.10), transparent 74%),
    radial-gradient(760px 420px at 96% 18%, rgba(68,103,122,0.07), transparent 78%),
    radial-gradient(620px 280px at 46% 100%, rgba(118,84,51,0.05), transparent 72%),
    var(--paper);
}
body.dark.page-desarrollo .dev-page{
  background:
    radial-gradient(860px 420px at 4% -4%, rgba(211,178,119,0.10), transparent 74%),
    radial-gradient(760px 420px at 96% 18%, rgba(93,132,154,0.07), transparent 78%),
    radial-gradient(620px 280px at 46% 100%, rgba(211,178,119,0.05), transparent 72%),
    #0d0b0a;
}
body.page-desarrollo .dev-shell{
  grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 72px);
}
body.page-desarrollo .dev-sidebar{
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(255,255,255,0.30), rgba(255,255,255,0.07));
}
body.dark.page-desarrollo .dev-sidebar{
  background: linear-gradient(145deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
}
body.page-desarrollo .dev-nav{
  gap: 10px;
}
body.page-desarrollo .dev-nav-sections{
  gap: 7px;
}
body.page-desarrollo .dev-nav-button{
  padding: 9px 11px;
  letter-spacing: .21em;
}
body.page-desarrollo .dev-nav-button:hover{
  background: rgba(255,255,255,0.08);
}
body.page-desarrollo .dev-nav-button.is-active{
  background: rgba(255,255,255,0.12);
}
body.page-desarrollo .dev-section{
  background: linear-gradient(145deg, rgba(255,255,255,0.24), rgba(255,255,255,0.05));
}
body.dark.page-desarrollo .dev-section{
  background: linear-gradient(145deg, rgba(255,255,255,0.045), rgba(255,255,255,0.015));
}
body.page-desarrollo .dev-project-grid{
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: clamp(14px, 2vw, 22px);
  align-items: stretch;
}
body.page-desarrollo .dev-project-card{
  border-radius: 15px;
  padding: 15px 16px 18px;
  min-height: 132px;
  justify-content: flex-end;
  gap: 9px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(255,255,255,0.23), rgba(255,255,255,0.05));
}
body.dark.page-desarrollo .dev-project-card{
  background: linear-gradient(135deg, rgba(255,255,255,0.05), rgba(255,255,255,0.014));
}
body.page-desarrollo .dev-project-card.has-icon{
  min-height: 132px;
  padding-top: 15px;
}
body.page-desarrollo .dev-project-card.has-icon .dev-project-icon{
  width: clamp(26px, 2.4vw, 36px);
  height: clamp(26px, 2.4vw, 36px);
  opacity: .24;
  filter: grayscale(1) contrast(1.08) brightness(1.02);
}
body.dark.page-desarrollo .dev-project-card.has-icon .dev-project-icon{
  filter: invert(1) brightness(1.24);
  opacity: .28;
}
body.page-desarrollo .dev-project-name{
  font-size: .82rem;
  letter-spacing: .2em;
}
body.page-desarrollo .dev-project-meta{
  font-size: .6rem;
  letter-spacing: .24em;
}
body.page-desarrollo .dev-project-footer{
  display: grid;
  gap: 8px;
}
body.page-desarrollo .dev-project-cat{
  font-size: .56rem;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--team-accent);
  opacity: .82;
}
body.page-desarrollo .dev-empty{
  font-size: .66rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--ink-soft);
  border: 1px dashed var(--line);
  border-radius: 14px;
  padding: 18px 16px;
}
body.page-desarrollo .dev-project-grid.is-icon-focus{
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.2vw, 26px);
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
  min-height: clamp(230px, 25vw, 320px);
  padding: clamp(12px, 1.8vw, 20px) clamp(10px, 1.2vw, 14px) clamp(18px, 2.1vw, 26px);
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::before{
  content: "";
  position: absolute;
  inset: 8% 10% 22%;
  background: radial-gradient(200px 120px at 50% 50%, rgba(138,100,67,0.12), transparent 74%);
  opacity: .32;
  pointer-events: none;
  transition: opacity .3s var(--easeSoft), transform .3s var(--easeSoft);
}
body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::before{
  background: radial-gradient(220px 130px at 50% 50%, rgba(211,178,119,0.13), transparent 74%);
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card:hover::before{
  opacity: .56;
  transform: scale(1.04);
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::after{
  content: "";
  position: absolute;
  left: 14%;
  right: 14%;
  bottom: 4px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
  opacity: .8;
  pointer-events: none;
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
  left: 50%;
  right: auto;
  top: 44%;
  width: clamp(124px, 11.4vw, 186px);
  height: clamp(124px, 11.4vw, 186px);
  transform: translate(-50%, -50%);
  opacity: .72;
  filter: grayscale(1) contrast(1.15);
}
body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
  filter: invert(1) brightness(1.22);
  opacity: .8;
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card:hover .dev-project-icon{
  opacity: .95;
  transform: translate(-50%, -52%) scale(1.055);
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-footer{
  gap: 7px;
  margin-top: auto;
  align-items: center;
  text-align: center;
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-name{
  padding-right: 0;
  font-size: .74rem;
  letter-spacing: .22em;
  line-height: 1.34;
}
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-meta{
  font-size: .54rem;
  letter-spacing: .25em;
  justify-content: center;
}

@media (min-width: 981px){
  body.page-desarrollo .dev-sidebar{
    top: 50vh;
    transform: translateY(-50%);
    max-height: calc(100vh - 72px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}

@media (max-width: 1120px){
  body.page-desarrollo .dev-project-grid.is-icon-focus{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px){
  body.page-desarrollo .dev-page{
    padding-top: clamp(78px, 10vw, 100px);
  }
  body.page-desarrollo .dev-shell{
    grid-template-columns: 1fr;
    gap: 18px;
  }
  body.page-desarrollo .dev-sidebar{
    position: static;
    padding: 12px;
    border-radius: 14px;
  }
  body.page-desarrollo .dev-nav{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  body.page-desarrollo .dev-nav-button{
    grid-template-columns: 16px 1fr auto;
    gap: 8px;
    padding: 8px 10px;
    font-size: .58rem;
    letter-spacing: .18em;
    width: 100%;
  }
  body.page-desarrollo .dev-nav-count{
    margin-left: 4px;
    letter-spacing: .2em;
  }
  body.page-desarrollo .dev-chrono{
    width: 100%;
    margin-top: 14px;
    text-align: center;
  }
  body.page-desarrollo .dev-section{
    padding: 14px;
    border-radius: 14px;
  }
  body.page-desarrollo .dev-section-head{
    padding-bottom: 10px;
    margin-bottom: 14px;
  }
  body.page-desarrollo .dev-project-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  body.page-desarrollo .dev-project-card{
    border-radius: 12px;
    padding: 13px 13px 15px;
    min-height: 122px;
  }
  body.page-desarrollo .dev-project-card.has-icon{
    padding: 13px 13px 15px;
  }
  body.page-desarrollo .dev-project-card.has-icon .dev-project-icon{
    width: 30px;
    height: 30px;
    opacity: .30;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    min-height: 188px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: linear-gradient(145deg, rgba(255,255,255,0.22), rgba(255,255,255,0.05));
  }
  body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    background: linear-gradient(145deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018));
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
    width: 88px;
    height: 88px;
    top: 44%;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-name{
    font-size: .66rem;
    letter-spacing: .2em;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-meta{
    font-size: .51rem;
    letter-spacing: .22em;
  }
}

@media (max-width: 680px){
  body.page-desarrollo .dev-page{
    padding: calc(74px + env(safe-area-inset-top)) var(--padX) 42px;
  }
  body.page-desarrollo .dev-sidebar{
    padding: 10px;
    border-radius: 12px;
  }
  body.page-desarrollo .dev-nav{
    grid-template-columns: 1fr 1fr;
    gap: 7px;
  }
  body.page-desarrollo .dev-nav-button{
    font-size: .55rem;
    letter-spacing: .15em;
    padding: 8px 9px;
    gap: 7px;
  }
  body.page-desarrollo .dev-nav-icon{
    width: 15px;
    height: 15px;
  }
  body.page-desarrollo .dev-nav-count{
    font-size: .52rem;
    letter-spacing: .18em;
  }
  body.page-desarrollo .dev-chrono{
    padding: 10px 12px;
    font-size: .54rem;
    letter-spacing: .26em;
  }
  body.page-desarrollo .dev-section{
    padding: 12px;
    border-radius: 12px;
  }
  body.page-desarrollo .dev-section-head{
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding-bottom: 8px;
    margin-bottom: 12px;
  }
  body.page-desarrollo .dev-section-title{
    font-size: clamp(.94rem, 5.6vw, 1.42rem);
    letter-spacing: .13em;
  }
  body.page-desarrollo .dev-section-count{
    font-size: .52rem;
    letter-spacing: .22em;
  }
  body.page-desarrollo .dev-project-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  body.page-desarrollo .dev-project-card{
    min-height: 108px;
    padding: 11px 11px 13px;
    gap: 7px;
  }
  body.page-desarrollo .dev-project-name{
    font-size: .74rem;
    letter-spacing: .17em;
    line-height: 1.3;
  }
  body.page-desarrollo .dev-project-meta{
    font-size: .52rem;
    letter-spacing: .18em;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    min-height: 166px;
    padding: 11px 10px;
    border-radius: 10px;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
    width: 78px;
    height: 78px;
    top: 44%;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-cat{
    font-size: .47rem;
    letter-spacing: .22em;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-name{
    font-size: .58rem;
    letter-spacing: .2em;
    line-height: 1.3;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-meta{
    font-size: .46rem;
    letter-spacing: .18em;
  }
  body.page-desarrollo .dev-empty{
    font-size: .56rem;
    letter-spacing: .18em;
    border-radius: 10px;
    padding: 14px 12px;
  }
}

/* =========================
   PROJECT PAGE
   ========================= */
.page-proyecto{
  background: var(--paper);
}
.project-header{
  position: sticky;
  top: 0;
  z-index: 220;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px var(--padX);
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
body.dark .project-header{ background: rgba(13,11,10,0.9); }
.project-logo{
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(14px, 1.4vw, 20px);
  letter-spacing: 0.40em;
  text-transform: uppercase;
  text-decoration: none;
}
.project-back{
  font-size: .65rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: border-color .25s ease, opacity .25s ease;
}
.project-back:hover{ border-color: currentColor; opacity: .7; }
.project-page{
  padding: calc(30px + var(--padY)) var(--padX) var(--padY);
}
.project-hero{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(24px, 6vw, 80px);
  align-items: start;
  margin-bottom: clamp(12px, 2.4vw, 30px);
}
.project-hero.project-hero--no-sign{
  grid-template-columns: 1fr;
}
.project-kicker{
  font-size: .65rem;
  letter-spacing: .40em;
  text-transform: uppercase;
  opacity: .65;
  margin-bottom: 14px;
}
.project-title{
  font-family: var(--display);
  font-size: clamp(2rem, 5vw, 4.6rem);
  letter-spacing: .12em;
  text-transform: uppercase;
  line-height: 1.08;
  margin-bottom: 12px;
}
.project-type{
  display: block;
  max-width: 36ch;
  font-size: .75rem;
  letter-spacing: .28em;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.project-type:empty{ display: none; }

.page-proyecto .project-title{
  text-shadow: none;
}
.page-proyecto .project-title::before,
.page-proyecto .project-title::after{
  content: none;
}
.project-meta{
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}
.project-meta:empty{ display: none; }
.project-sign{
  width: 100%;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.project-sign-icon{
  width: min(100%, clamp(230px, 30vw, 460px));
  height: auto;
  display: block;
  opacity: .84;
  filter: grayscale(1) contrast(1.1);
}
body.dark .project-sign-icon{
  opacity: .94;
  filter: grayscale(1) invert(1) brightness(1.15) contrast(1.06);
}
.project-gallery{
  display: grid;
  gap: clamp(18px, 3.5vw, 38px);
  transition: opacity .35s var(--easeSoft), transform .35s var(--easeSoft);
}
.project-gallery.is-refreshing{
  opacity: 0.35;
  transform: translateY(6px);
}

.project-gallery-grid{
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: clamp(16px, 3vw, 28px);
}
.project-shot--hero{ grid-row: span 2; min-height: clamp(240px, 34vw, 420px); }
.project-shot--stack{ min-height: clamp(200px, 24vw, 320px); }
.project-shot--video{ min-height: clamp(240px, 40vw, 520px); }
.project-shot--video video{ aspect-ratio: 16 / 9; }

@media (max-width: 900px){
  .project-gallery-grid{
    grid-template-columns: 1fr;
  }
  .project-shot--hero,
  .project-shot--stack{
    min-height: clamp(220px, 45vw, 420px);
  }
}
.project-shot{
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  min-height: 220px;
  position: relative;
}
.project-shot img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 3;
  transform: scale(1.02);
  transition: transform .6s var(--easeSoft), opacity .6s ease;
}
.project-shot video{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  aspect-ratio: 4 / 3;
  transform: scale(1.02);
  transition: transform .6s var(--easeSoft), opacity .6s ease;
  background: #000;
}
.project-shot:hover img{ transform: scale(1.06); }
.project-shot:hover video{ transform: scale(1.06); }
.project-shot img.placeholder{ filter: saturate(0.6); }
body.dark .project-shot img.placeholder{ filter: invert(1) brightness(0.85); opacity: .85; }
.project-shot .shot-overlay{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  text-align: left;
  gap: 6px;
  padding: 18px;
  color: #fff;
  opacity: 0;
  transition: opacity .35s var(--easeSoft);
}
.project-shot .shot-overlay::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(to top, rgba(0,0,0,0.72), rgba(0,0,0,0.15));
  opacity: .9;
  z-index: 0;
}
.project-shot:hover .shot-overlay{ opacity: 1; }
.shot-title{
  position: relative;
  z-index: 1;
  font-family: var(--display);
  font-size: clamp(0.32rem, 0.50vw, 0.48rem);
  letter-spacing: .18em;
  text-transform: uppercase;
}
.shot-sub{
  position: relative;
  z-index: 1;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  opacity: .85;
}
.shot-overlay.overlay-center{
  justify-content: center;
  align-items: center;
  text-align: center;
}
.shot-overlay.overlay-tl{
  justify-content: flex-start;
  align-items: flex-start;
  text-align: left;
}
.shot-overlay.overlay-tr{
  justify-content: flex-start;
  align-items: flex-end;
  text-align: right;
}
.shot-overlay.overlay-bl{
  justify-content: flex-end;
  align-items: flex-start;
  text-align: left;
}
.shot-overlay.overlay-br{
  justify-content: flex-end;
  align-items: flex-end;
  text-align: right;
}
.project-resources{
  margin-top: clamp(30px, 6vw, 70px);
  border-top: 1px solid var(--line);
  padding-top: 24px;
}
.project-resources h2{
  font-size: .7rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  margin-bottom: 16px;
}
.resources-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.resources-list a{
  text-decoration: none;
  font-size: .82rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--line);
  padding-bottom: 6px;
  width: fit-content;
}
.resources-list a:hover{ opacity: .7; }
.resources-empty{
  font-size: .85rem;
  color: var(--ink-soft);
}
.project-resources.is-empty .resources-list{ display: none; }

.project-next{
  margin-top: clamp(36px, 6vw, 80px);
  border-top: 1px solid var(--line);
  padding-top: clamp(24px, 4vw, 38px);
  text-align: center;
}
.next-project-kicker{
  font-size: .6rem;
  letter-spacing: .45em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 18px;
}
.next-project-card{
  display: grid;
  justify-items: center;
  gap: 12px;
  text-decoration: none;
  color: var(--ink);
  padding: clamp(14px, 3vw, 28px) clamp(14px, 3vw, 32px);
  border: none;
  border-radius: 0;
  background:
    radial-gradient(360px 220px at 50% 35%, rgba(20,18,15,0.06), transparent 70%);
  transition: transform .4s var(--easeSoft), opacity .4s var(--easeSoft);
}
.next-project-card:hover{
  transform: translateY(-2px);
  opacity: .9;
}
.next-project-title{
  font-family: var(--display);
  font-size: clamp(1.6rem, 4.6vw, 3.2rem);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.next-project-year{
  font-size: .9rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.next-project-icon{
  width: clamp(120px, 18vw, 240px);
  height: auto;
  opacity: .75;
  filter: grayscale(1);
}
body.dark .next-project-icon{
  filter: invert(1) brightness(1.2);
  opacity: .85;
}
body.dark .next-project-card{
  background:
    radial-gradient(420px 260px at 50% 35%, rgba(255,255,255,0.08), transparent 70%);
}
.next-project-empty{
  font-size: .9rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

@media (max-width: 900px){
  .project-hero{
    grid-template-columns: minmax(0, 1fr) minmax(112px, 40vw);
    gap: clamp(14px, 4vw, 24px);
    align-items: start;
  }
  .project-hero.project-hero--no-sign{
    grid-template-columns: 1fr;
  }
  .project-type{
    font-size: .66rem;
    letter-spacing: .24em;
    line-height: 1.52;
  }
  .project-sign{
    width: 100%;
    min-height: clamp(108px, 29vw, 170px);
  }
  .project-sign-icon{
    width: min(100%, clamp(150px, 38vw, 230px));
  }
  .project-header{
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
  }
  .project-back{
    font-size: .58rem;
    letter-spacing: .22em;
  }
}

@media (max-width: 680px){
  .project-gallery{ grid-template-columns: 1fr; }
}

@media (min-width: 981px){
  body.page-proyecto{
    overflow: hidden;
    height: 100dvh;
    animation: none;
  }
  body.page-proyecto .project-header,
  body.page-proyecto .site-footer{
    display: none;
  }
  body.page-proyecto .project-page{
    padding: 0;
    height: 100dvh;
    max-height: 100dvh;
  }

  body.page-proyecto .project-desktop-layout{
    display: grid;
    grid-template-columns: minmax(228px, 260px) minmax(0, 1fr) minmax(320px, 390px);
    height: 100%;
    border-top: 0;
    background: var(--paper);
  }

  body.page-proyecto .project-side-menu{
    border-right: 0;
    padding: clamp(18px, 2.1vw, 30px) clamp(14px, 1.6vw, 20px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: clamp(16px, 2vw, 28px);
    min-height: 0;
    background: var(--paper);
  }
  body.page-proyecto .project-side-brand{
    display: inline-flex;
    flex-direction: column;
    text-decoration: none;
    color: var(--ink);
    gap: 2px;
    width: fit-content;
  }
  body.page-proyecto .project-side-brand-main{
    font-family: var(--display);
    font-size: clamp(11px, .9vw, 14px);
    letter-spacing: .34em;
    text-transform: uppercase;
    line-height: 1;
    font-weight: 700;
  }
  body.page-proyecto .project-side-brand-sub{
    font-family: var(--serif);
    font-size: clamp(8px, .56vw, 10px);
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--ink-soft);
    line-height: 1;
  }
  body.page-proyecto .project-side-nav{
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 6px;
  }
  body.page-proyecto .project-side-link{
    text-decoration: none;
    color: var(--ink);
    display: grid;
    grid-template-columns: 13px 1fr auto;
    align-items: center;
    gap: 8px;
    padding: 8px 2px;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: .64rem;
    transition: opacity .25s ease;
  }
  body.page-proyecto .project-side-link:hover{
    opacity: .7;
  }
  body.page-proyecto .project-side-link.is-active{
    opacity: 1;
    color: var(--team-accent);
  }
  body.page-proyecto .project-side-icon{
    width: 12px;
    height: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: .72;
  }
  body.page-proyecto .project-side-icon svg{
    width: 100%;
    height: 100%;
    display: block;
  }
  body.page-proyecto .project-side-count{
    font-size: .5rem;
    letter-spacing: .22em;
    opacity: .78;
  }

  body.page-proyecto .project-media-column{
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding: clamp(18px, 2vw, 30px);
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  body.page-proyecto .project-media-column::-webkit-scrollbar{
    width: 0;
    height: 0;
    display: none;
  }
  body.page-proyecto .project-media-column::-webkit-scrollbar-thumb{
    background: transparent;
  }
  body.dark.page-proyecto .project-media-column::-webkit-scrollbar-thumb{
    background: transparent;
  }

  body.page-proyecto .project-media-column .project-gallery{
    gap: clamp(16px, 2vw, 24px);
    margin-bottom: clamp(20px, 2.2vw, 30px);
  }
  body.page-proyecto .project-media-column .project-gallery-grid{
    grid-template-columns: 1fr;
    gap: clamp(14px, 1.8vw, 24px);
  }
  body.page-proyecto .project-media-column .project-shot{
    border-radius: 12px;
  }
  body.page-proyecto .project-media-column .project-shot--hero,
  body.page-proyecto .project-media-column .project-shot--stack{
    min-height: clamp(280px, 38vw, 620px);
    grid-row: auto;
  }
  body.page-proyecto .project-media-column .project-shot .shot-overlay{
    display: flex;
  }

  body.page-proyecto .project-info-panel{
    border-left: 0;
    height: 100%;
    overflow: hidden;
    padding: clamp(20px, 2.2vw, 32px) clamp(16px, 1.8vw, 24px);
    display: flex;
    flex-direction: column;
    gap: clamp(14px, 1.7vw, 22px);
    background: var(--paper);
  }
  body.page-proyecto .project-info-back{
    text-decoration: none;
    font-size: .57rem;
    letter-spacing: .30em;
    text-transform: uppercase;
    color: var(--team-accent);
    width: fit-content;
    border-bottom: 0;
    padding-bottom: 2px;
    opacity: .84;
  }
  body.page-proyecto .project-info-panel .project-hero{
    display: block;
    margin: 0;
  }
  body.page-proyecto .project-info-panel .project-kicker{
    margin-bottom: 10px;
  }
  body.page-proyecto .project-info-panel .project-title{
    font-size: clamp(1.45rem, 2.15vw, 2.3rem);
    letter-spacing: .1em;
    margin-bottom: 8px;
  }
  body.page-proyecto .project-info-panel .project-type{
    font-size: .58rem;
    letter-spacing: .25em;
    line-height: 1.6;
  }
  body.page-proyecto .project-info-list{
    display: grid;
    gap: 10px;
    border-top: 0;
    padding-top: 14px;
  }
  body.page-proyecto .project-info-row{
    display: grid;
    grid-template-columns: minmax(100px, 1fr) minmax(0, 1fr);
    align-items: baseline;
    gap: 12px;
  }
  body.page-proyecto .project-info-row dt{
    font-size: .52rem;
    letter-spacing: .26em;
    text-transform: uppercase;
    color: var(--ink-soft);
  }
  body.page-proyecto .project-info-row dd{
    margin: 0;
    font-size: .64rem;
    letter-spacing: .2em;
    text-transform: uppercase;
  }

  body.page-proyecto .project-info-sign{
    margin-top: 4px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 0;
  }
  body.page-proyecto .project-info-sign .project-sign-icon{
    width: min(100%, clamp(220px, 19vw, 320px));
    opacity: .9;
  }
  body.dark.page-proyecto .project-info-sign .project-sign-icon{
    opacity: .95;
  }

  body.page-proyecto .project-media-column .project-resources{
    margin-top: 0;
    border-top: 0;
    padding-top: 16px;
  }
  body.page-proyecto .project-media-column .next-project-kicker{
    text-align: left;
    font-size: .58rem;
    letter-spacing: .34em;
    margin-bottom: 14px;
  }
  body.page-proyecto .next-project-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(12px, 1.6vw, 18px);
  }
  body.page-proyecto .next-project-card{
    position: relative;
    isolation: isolate;
    min-height: clamp(220px, 24vw, 310px);
    border: 0;
    border-radius: 0;
    padding: clamp(10px, 1.2vw, 16px);
    background: transparent;
    text-align: left;
    display: grid;
    gap: 8px;
    align-content: start;
    justify-items: start;
  }
  body.dark.page-proyecto .next-project-card{
    background: transparent;
  }
  body.page-proyecto .next-project-tag{
    position: relative;
    z-index: 2;
    font-size: .52rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--team-accent);
    opacity: .84;
  }
  body.page-proyecto .next-project-title{
    position: relative;
    z-index: 2;
    font-family: var(--display);
    font-size: clamp(1.02rem, 1.42vw, 1.42rem);
    letter-spacing: .14em;
    text-transform: uppercase;
    line-height: 1.25;
  }
  body.page-proyecto .next-project-meta{
    position: relative;
    z-index: 2;
    font-size: .54rem;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--ink-soft);
  }
  body.page-proyecto .next-project-icon{
    position: absolute;
    left: 50%;
    top: 62%;
    transform: translate(-50%, -50%);
    width: clamp(146px, 13.8vw, 220px);
    z-index: 1;
    opacity: .9;
    transition: transform .32s var(--easeSoft), opacity .32s var(--easeSoft);
  }
  body.page-proyecto .next-project-card:hover .next-project-icon{
    transform: translate(-50%, -51%) scale(1.045);
    opacity: 1;
  }
}

/* =========================
   CONTACTO PAGE
   ========================= */
body.page-contacto{
  --contact-glow-a: rgba(91,44,44,0.12);
  --contact-glow-b: rgba(47,59,51,0.10);
  --contact-shade: rgba(0,0,0,0.12);
  --contact-icon-field: .42;
  background: var(--paper);
  animation: none;
}
body.dark.page-contacto{
  --contact-glow-a: rgba(255,255,255,0.10);
  --contact-glow-b: rgba(255,255,255,0.06);
  --contact-shade: rgba(0,0,0,0.65);
  --contact-icon-field: .65;
}
body.page-contacto .grain{ opacity: .10; }
body.dark.page-contacto .grain{ mix-blend-mode: screen; opacity: .09; }
body.page-contacto .spotlight{ opacity: .25; }

.contact-page{
  padding: var(--padY-page) var(--padX);
  min-height: 100vh;
  background: var(--paper);
  border-top: 1px solid var(--line);
  position: relative;
  overflow: hidden;
}
.contact-page > *{ position: relative; z-index: 2; }

.contact-ambient{
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.contact-ambient::after{
  content:"";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(600px 420px at 15% 20%, var(--contact-glow-a), transparent 60%),
    radial-gradient(800px 520px at 85% 70%, var(--contact-glow-b), transparent 65%),
    linear-gradient(to bottom, rgba(0,0,0,0.18), var(--contact-shade));
  opacity: .85;
}
.contact-ambient-grid{
  position: absolute;
  inset: 0;
  opacity: var(--contact-icon-field);
  transition: opacity .35s var(--easeSoft), transform .35s var(--easeSoft);
}
.contact-ambient-grid.is-fading{
  opacity: .12;
  transform: scale(0.98);
}
.contact-icon{
  position: absolute;
  width: clamp(72px, 9vw, 150px);
  opacity: var(--icon-opacity, .14);
  filter: grayscale(1) brightness(0.25);
  mix-blend-mode: normal;
  transform: translate(-50%, -50%) rotate(var(--icon-rot, 0deg)) scale(var(--icon-scale, 1));
  animation: iconFloat var(--icon-dur, 22s) ease-in-out infinite alternate;
}
body.dark .contact-icon{
  filter: brightness(0) invert(1);
  mix-blend-mode: screen;
}
body.creative .contact-icon{
  filter: brightness(0);
  mix-blend-mode: multiply;
}
@keyframes iconFloat{
  from{ transform: translate(-50%, -50%) rotate(var(--icon-rot, 0deg)) scale(var(--icon-scale, 1)); }
  to{ transform: translate(-50%, -52%) rotate(calc(var(--icon-rot, 0deg) * -1)) scale(calc(var(--icon-scale, 1) * 1.04)); }
}

.contact-hero{
  display:grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(20px, 4.6vw, 90px);
  align-items: start;
  padding-bottom: clamp(26px, 4vw, 54px);
  border-bottom: 1px solid var(--line);
}
.contact-kicker{
  font-size: .65rem;
  letter-spacing: .40em;
  text-transform: uppercase;
  opacity: .65;
  margin-bottom: 18px;
}
.contact-title{
  font-family: var(--display);
  font-size: clamp(2.2rem, 5.6vw, 4.8rem);
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1.06;
  width: auto;
  max-width: none;
  font-weight: 500;
}
.contact-title span{
  display: inline;
}
.contact-intro{
  font-size: 1.08rem;
  line-height: 1.95;
  color: var(--ink-soft);
  max-width: 60ch;
}
.contact-hero > div:last-child{
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}
.contact-note{
  text-align: right;
  max-width: 42ch;
}
.contact-cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 4vw, 48px);
  margin-top: clamp(26px, 4.2vw, 56px);
}
.contact-card{
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 20px 0 24px;
  display: grid;
  gap: 12px;
  background: linear-gradient(120deg, rgba(255,255,255,0.02), transparent);
}
.contact-card h4{
  font-size: .70rem;
  letter-spacing: .30em;
  text-transform: uppercase;
  opacity: .7;
}
.contact-card a{
  text-decoration: none;
  font-size: .92rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  border-bottom: 1px solid transparent;
  padding-bottom: 4px;
  transition: border-color .25s ease, opacity .25s ease;
}
.contact-card a:hover{
  border-color: var(--ink);
  opacity: .8;
}
.contact-note{
  margin-top: 20px;
  font-size: .70rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  opacity: .6;
}
.contact-cta{
  margin-top: clamp(24px, 4vw, 46px);
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.contact-start{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0.9rem 2.6rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.02);
  text-decoration: none;
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: var(--ink);
  transition: transform .25s ease, opacity .25s ease, border-color .25s ease;
}
.contact-start:hover{
  transform: translateY(-1px);
  opacity: .8;
  border-color: #fff;
}
.contact-shuffle{
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink-soft);
  padding: 0.8rem 2.2rem;
  border-radius: 999px;
  font-size: .58rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .25s ease, border-color .25s ease, transform .25s ease;
}
.contact-shuffle:hover{
  color: #fff;
  border-color: #fff;
  transform: translateY(-1px);
}

@media (max-width: 1024px){
  .contact-cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =========================
   FORMULARIO (entrevista editorial)
   ========================= */
.form-header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 260;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px var(--padX);
  pointer-events: none;
}
.form-header > *{ pointer-events: auto; }
.form-header .page-logo{ position: static; }
.form-back{
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ink);
  opacity: .65;
  transition: opacity .25s ease;
}
.form-back:hover{ opacity: 1; }

.form-shell{
  min-height: 100svh;
  padding: calc(90px + var(--padY-page)) var(--padX) var(--padY-page);
  display: flex;
  align-items: center;
  justify-content: center;
}
.form-step, .form-summary{
  width: min(760px, 92vw);
  transition: opacity .35s ease, transform .35s var(--easeSoft);
}
.form-step{
  position: relative;
}
.form-step::after{
  content:"";
  position: absolute;
  inset: -8% -6%;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.08) 40%, transparent 70%);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: opacity .35s ease, transform .35s var(--easeSoft);
}
.form-step.is-leaving::after{
  opacity: .9;
  transform: translateY(0);
}
.form-step.is-entering::after{
  opacity: .6;
  transform: translateY(-6px);
}
.form-step.is-leaving{
  opacity: 0;
  transform: translateY(12px);
}
.form-step.is-entering{
  opacity: 0;
  transform: translateY(-8px);
}
.form-kicker{
  font-size: .60rem;
  letter-spacing: .42em;
  text-transform: uppercase;
  opacity: .55;
  margin-bottom: 18px;
}
.form-question{
  font-family: var(--display);
  font-size: clamp(1.8rem, 4.6vw, 3.8rem);
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1.15;
}
.form-note{
  margin-top: 16px;
  font-size: .70rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  opacity: .55;
}
.form-field{
  margin-top: 26px;
}
.form-input, .form-textarea{
  width: 100%;
  border: none;
  border-bottom: 1px solid var(--line);
  background: transparent;
  padding: 12px 0 10px;
  font-family: var(--serif);
  font-size: 1.05rem;
  letter-spacing: .03em;
  color: var(--ink);
  outline: none;
}
.form-textarea{
  min-height: 120px;
  resize: vertical;
}
.form-input::placeholder, .form-textarea::placeholder{
  color: var(--ink-soft);
}
.form-helper{
  margin-top: 12px;
  font-size: .60rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  opacity: .55;
}
.form-actions{
  margin-top: 32px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.form-prev{
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  padding: 0.85rem 2.2rem;
  border-radius: 999px;
  font-size: .60rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  cursor: pointer;
  opacity: .65;
  transition: transform .25s ease, opacity .25s ease, border-color .25s ease;
}
.form-prev:hover{
  opacity: 1;
  border-color: var(--ink);
  transform: translateY(-1px);
}
.form-prev[disabled]{
  opacity: .35;
  cursor: default;
  border-color: var(--line);
  transform: none;
}
.form-next{
  border: none;
  background: var(--ink);
  color: var(--paper);
  padding: 0.9rem 2.6rem;
  border-radius: 999px;
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .25s ease, opacity .25s ease;
}
.form-next:hover{ transform: translateY(-1px); opacity: .9; }
.form-progress{
  position: fixed;
  top: 86px;
  right: var(--padX);
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  opacity: .55;
  z-index: 220;
}
.summary-box{
  margin-top: 26px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--glass);
  padding: 20px;
  white-space: pre-wrap;
  font-size: .95rem;
  line-height: 1.8;
}
.summary-actions{
  margin-top: 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.summary-btn{
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  padding: 0.9rem 2.6rem;
  border-radius: 999px;
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  transition: transform .25s ease, opacity .25s ease, border-color .25s ease;
}
.summary-btn:hover{ transform: translateY(-1px); opacity: .85; border-color: var(--ink); }
.summary-primary{
  background: var(--ink);
  color: var(--paper);
  border-color: transparent;
}

@media (max-width: 768px){
  .form-shell{
    padding: calc(88px + var(--padY-page)) var(--padX) var(--padY-page);
  }
  .form-progress{
    top: 78px;
    letter-spacing: .25em;
  }
}

/* =========================
   DARK MODE
   ========================= */
body.dark{
  --paper: #0d0b0a;
  --ink: #f7f4ee;
  --ink-soft: rgba(247,244,238,0.65);
  --line: rgba(247,244,238,0.18);
  --glass: rgba(13,11,10,0.6);
  --accent: #b86b6b;
  --accent-2: #5a6a5a;
  --team-accent: #d3b277;
  --shadow: 0 30px 70px rgba(0,0,0,0.45);
  --menu-grad-a: #090d13;
  --menu-grad-b: #101a25;
  --menu-grad-c: #1a2c3b;
  --menu-layer-a: rgba(0,0,0,0.34);
  --menu-layer-b: rgba(0,0,0,0.24);
  background:
    radial-gradient(900px 600px at 8% -10%, rgba(184,107,107,0.16), transparent 60%),
    radial-gradient(900px 500px at 92% -5%, rgba(90,106,90,0.14), transparent 60%),
    #0d0b0a;
}
body.dark.page-home{
  background:
    radial-gradient(760px 360px at 12% 14%, rgba(211,221,236,0.056), transparent 74%),
    radial-gradient(620px 320px at 86% 84%, rgba(167,180,199,0.039), transparent 78%),
    radial-gradient(900px 600px at 8% -10%, rgba(184,107,107,0.16), transparent 60%),
    radial-gradient(900px 500px at 92% -5%, rgba(90,106,90,0.14), transparent 60%),
    #0d0b0a;
}
body.dark .grain{ mix-blend-mode: screen; opacity: 0.09; }
body.dark .project-title::after{
  background: radial-gradient(ellipse, rgba(0,0,0,.70), rgba(0,0,0,0));
}

body.dark .icon-box img{
  filter: invert(1) brightness(1.55);
  opacity: .82;
}
body.dark .icon-box:hover img{ opacity: 1; }
body.dark .form-step::after{
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.05) 40%, transparent 70%);
}

/* =========================
   CREATIVE MODE (BRUTALISMO)
   ========================= */
body.creative{
  --paper: #f7f2e8;
  --ink: #0b0b0b;
  --ink-soft: rgba(11,11,11,0.65);
  --line: #0b0b0b;
  --glass: transparent;
  --accent: #ff003d;
  --accent-2: #00a7ff;
  --team-accent: #0b0b0b;
  --shadow: none;
  --menu-grad-a: #f8e9cd;
  --menu-grad-b: #dfe6dc;
  --menu-grad-c: #c1d0d6;
  --menu-layer-a: rgba(255,255,255,0.18);
  --menu-layer-b: rgba(234,238,236,0.12);
  background:
    linear-gradient(90deg, rgba(0,0,0,0.08) 1px, transparent 1px) 0 0 / 36px 36px,
    linear-gradient(0deg, rgba(0,0,0,0.08) 1px, transparent 1px) 0 0 / 36px 36px,
    #f7f2e8;
  animation: none;
}
body.creative .grain{ opacity: 0.06; mix-blend-mode: normal; }
body.creative .spotlight{ opacity: 0; }
body.creative .scroll-progress{ background: rgba(0,0,0,0.25); }
body.creative .scroll-progress::after{ background: #000; }

body.creative .theme-toggle{
  color: var(--ink);
  border-color: var(--ink);
  background: #fff7a8;
  box-shadow: 3px 3px 0 var(--ink);
  opacity: 1;
  border-radius: 0;
}
body.creative .theme-toggle::after{ background: var(--accent); }
body.creative .theme-toggle:hover{ transform: translateY(-2px); }

body.creative .menu-overlay{
  background: linear-gradient(var(--menu-grad-angle), var(--menu-grad-a), var(--menu-grad-b) 52%, var(--menu-grad-c));
  color: var(--ink);
}
body.creative .menu-line{ background: var(--ink); opacity: .35; }

body.creative .project::after{ opacity: 0; }
body.creative .project-media{
  filter: grayscale(1) contrast(1.2) brightness(1);
}
body.creative .project-media::after{ background: none; }
body.creative .projects .project-title{
  color: var(--ink);
  text-shadow: none;
  background: var(--paper);
  border: 2px solid var(--ink);
  padding: clamp(16px, 2.6vw, 30px);
  box-shadow: 6px 6px 0 var(--ink);
  opacity: 1;
}
body.creative .project-title::after{ content: none; }
body.creative .project-title::before{ content: none; display: none; }
body.creative .project-title p{ opacity: .9; }
body.creative .projects .project-title{
  max-width: min(88vw, 860px);
}
body.creative .projects .project-title h2{
  font-size: clamp(1.51rem, 3.91vw, 3.91rem);
  letter-spacing: .14em;
  line-height: 1.02;
  text-transform: uppercase;
  text-shadow: 3px 3px 0 rgba(0,0,0,0.14);
  overflow-wrap: anywhere;
  word-break: break-word;
  text-wrap: balance;
}
body.creative .projects .project-title h2 span{
  display: inline-block;
}
body.creative .projects .project-title p{
  font-size: .78rem;
  letter-spacing: .55em;
  text-transform: uppercase;
}

body.creative .experimental-title,
body.creative .section-title,
body.creative .eyebrow,
body.creative .dev-kicker,
body.creative .dev-overline,
body.creative .form-kicker{
  font-size: .85rem;
  letter-spacing: .55em;
  color: var(--ink);
}

body.creative .team-title,
body.creative .equipo-title,
body.creative .dev-title,
body.creative .dev-section-title,
body.creative .contact-title,
body.creative .form-question{
  font-size: clamp(2rem, 4.8vw, 4.2rem);
  letter-spacing: .14em;
  line-height: 1.1;
  text-transform: uppercase;
}
body.creative.page-desarrollo .dev-section-title{
  font-size: clamp(1.05rem, 2.4vw, 1.95rem);
  letter-spacing: .16em;
  font-weight: 500;
}
body.creative .team-title{
  font-size: clamp(1.64rem, 3.9vw, 3.24rem);
  font-weight: 500;
  letter-spacing: .11em;
  line-height: 1.12;
}

body.creative .team-right p,
body.creative .equipo-desc,
body.creative .dev-intro,
body.creative .contact-intro,
body.creative .about-right p{
  font-size: 1.05rem;
  letter-spacing: .02em;
  line-height: 1.75;
  color: var(--ink);
}

body.creative .projects-dots{
  background: rgba(0,0,0,0.1);
  border: 1px solid var(--ink);
  backdrop-filter: none;
}
body.creative .projects-dots .dot{
  background: transparent;
  border: 1px solid var(--ink);
}
body.creative .projects-dots .dot.active{ background: var(--accent); }

body.creative .project-header{
  background: rgba(247,242,232,0.92);
  border-bottom: 2px solid var(--ink);
}
body.creative .project-back{
  border-color: var(--ink);
}
body.creative .project-shot{
  border-radius: 0;
  border: 2px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
}
body.creative .resources-list a{
  border-bottom: 2px solid var(--ink);
}

/* =========================
   MICRO ACCENTS (ALL PAGES)
   ========================= */
body.page-desarrollo .dev-nav-count,
body.page-desarrollo .dev-section-count{
  color: var(--team-accent);
  opacity: .86;
}
body.page-desarrollo .dev-chrono{
  color: var(--team-accent);
  border-color: currentColor;
}
body.page-desarrollo .dev-chrono:hover{
  border-color: currentColor;
  opacity: .92;
}

body.page-equipo .equipo-title::after{
  background: linear-gradient(90deg, var(--team-accent), var(--line));
  opacity: .72;
}
body.page-equipo .miembro span{
  color: var(--team-accent);
  opacity: .86;
}

body.page-contacto .contact-kicker,
body.page-contacto .contact-note,
body.page-contacto .contact-card h4{
  color: var(--team-accent);
}
body.page-contacto .contact-kicker{ opacity: .82; }
body.page-contacto .contact-note{ opacity: .78; }
body.page-contacto .contact-card h4{ opacity: .8; }

body.page-form .form-back,
body.page-form .form-kicker,
body.page-form .form-progress{
  color: var(--team-accent);
}
body.page-form .form-back{ opacity: .82; }
body.page-form .form-kicker{ opacity: .78; }
body.page-form .form-progress{ opacity: .76; }

body.page-proyecto .project-kicker,
body.page-proyecto .project-resources h2,
body.page-proyecto .next-project-kicker{
  color: var(--team-accent);
  opacity: .82;
}
body.page-proyecto .project-back{
  color: var(--team-accent);
  border-bottom-color: currentColor;
}
body.page-proyecto .project-back:hover{
  border-color: currentColor;
  opacity: .9;
}

/* =========================
   MOBILE
   ========================= */
@media (max-width: 768px){
  :root{ --padX: 18px; --padY: 58px; }

  body{ animation: none; }
  .scroll-progress{ display: none; }
  .project::after{ display: none; }

  .projects{
    height: 100svh;
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-snap-stop: always;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .projects::-webkit-scrollbar{ display:none; }
  .project{
    flex: 0 0 100%;
    width: 100%;
    scroll-snap-align: start;
  }

  .projects-dots{ display: flex; }

  .menu-overlay{
    align-items: center;
    justify-content: center;
    padding:
      calc(74px + env(safe-area-inset-top))
      clamp(18px, 6vw, 32px)
      calc(24px + env(safe-area-inset-bottom));
    background:
      linear-gradient(var(--menu-grad-angle-soft), var(--menu-layer-a), var(--menu-layer-b)),
      linear-gradient(var(--menu-grad-angle-soft), var(--menu-grad-a), var(--menu-grad-b) 54%, var(--menu-grad-c));
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
  .menu-items{
    width: min(88vw, 480px);
    max-width: min(88vw, 480px);
    margin: 0 auto;
    align-items: flex-start;
    text-align: left;
    gap: clamp(3px, 0.9vh, 9px);
    padding: clamp(4px, 1.1vh, 10px) 0  clamp(4px, 1.1vh, 10px) 4px;
  }
  .menu-items a{
    width: 100%;
    max-width: none;
    display: block;
    font-size: clamp(1.62rem, 9vw, 2.56rem);
    font-weight: 600;
    letter-spacing: 0.06em;
    line-height: 1.03;
    color: rgba(255,255,255,0.72);
    transform: translateX(0);
    padding: clamp(1px, 0.25vh, 4px) 0;
    text-align: left;
    text-shadow: 0 8px 18px rgba(0,0,0,0.24);
  }
  .menu-items a:hover{
    color: rgba(255,255,255,0.88);
    letter-spacing: 0.06em;
  }
  .menu-line{
    left: clamp(16px, 5vw, 28px);
    right: clamp(16px, 5vw, 28px);
    bottom: calc(14px + env(safe-area-inset-bottom));
    background: rgba(255,255,255,0.10);
  }

  body.creative .menu-items a{ color: rgba(11,11,11,0.7); }
  body.creative .menu-items a:hover{ color: rgba(11,11,11,0.96); }

  body.page-desarrollo .page-logo.page-logo-box{
    width: fit-content;
    gap: 2px;
  }
  body.page-desarrollo .page-logo-box .page-logo-main{
    font-size: .72rem;
    letter-spacing: .28em;
  }
  body.page-desarrollo .page-logo-box .page-logo-sub{
    font-size: .46rem;
    letter-spacing: .24em;
  }

  .icon-track{ animation-duration: 72s; gap: 64px; }
  .icon-box{ width: 172px; height: 172px; }
  .icon-box img{ opacity: 0.78; transform: scale(1.02); }

  .experimental{ padding-bottom: 22px; }

  .about-header{
    flex-direction: column;
    gap: 18px;
    margin-bottom: 46px;
  }
  .about-nav a{
    margin-left: 0;
    margin-right: 1.4rem;
    display: inline-block;
  }
  .theme-toggle{
    margin-top: 6px;
  }
  .about-content{
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .areas-list{
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    gap: 12px;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;
  }
  .areas-list a{ white-space: nowrap; }

  .team-grid{ grid-template-columns: 1fr; }
  .equipo-grid{ grid-template-columns: 1fr; }
  .dev-hero, .contact-hero{ grid-template-columns: 1fr; }
  .dev-grid{ grid-template-columns: 1fr; }
  .contact-cards{ grid-template-columns: 1fr; }
  .contact-title{ width: 100%; max-width: 100%; }

  .projects .project-title{
    max-width: min(92vw, 560px);
  }
  .projects .project-title h2{
    font-size: clamp(1.04rem, 6.4vw, 1.72rem);
    letter-spacing: .1em;
    line-height: 1.06;
  }
  .projects .project-title p{
    margin-top: 10px;
    font-size: .58rem;
    letter-spacing: .29em;
  }

  .about{
    padding-top: clamp(44px, 10vw, 64px);
    padding-bottom: clamp(44px, 10vw, 62px);
  }
  .about-header{
    gap: 14px;
    margin-bottom: 34px;
  }
  .about-logo{
    font-size: .7rem;
    letter-spacing: .24em;
  }
  .about-logo span{
    font-size: .52rem;
    letter-spacing: .18em;
  }
  .about-nav{
    width: 100%;
    gap: 0;
    overflow-x: auto;
    white-space: nowrap;
    flex-wrap: nowrap;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
  }
  .about-nav a{
    margin-right: 1.05rem;
    font-size: .56rem;
    letter-spacing: .2em;
    white-space: nowrap;
  }
  .theme-toggle{
    margin-top: 0;
    padding: 5px 9px;
  }
  .theme-indicator{
    font-size: .5rem;
    letter-spacing: .26em;
  }
  .about-content{
    gap: 20px;
  }
  .about-left p{
    font-size: .68rem;
    letter-spacing: .22em;
  }
  .about-right p{
    font-size: .85rem;
    line-height: 1.72;
    margin-bottom: 1.5rem;
  }

  .experimental{
    padding-top: clamp(40px, 10vw, 58px);
    padding-bottom: 20px;
  }
  .experimental-title,
  .section-title{
    font-size: .6rem;
    letter-spacing: .27em;
  }
  .icon-track{
    gap: 48px;
    animation-duration: 66s;
  }
  .icon-box{
    width: 132px;
    height: 132px;
  }

  .areas-list a{
    font-size: .52rem;
    letter-spacing: .2em;
    padding: 8px 12px;
  }

  .team{
    padding-top: clamp(48px, 10vw, 66px);
    padding-bottom: clamp(46px, 10vw, 62px);
  }
  .team-grid{
    gap: 18px;
  }
  .eyebrow{
    margin-bottom: 10px;
    font-size: .52rem;
    letter-spacing: .32em;
  }
  .team-title{
    font-size: clamp(1.14rem, 8.2vw, 1.62rem);
    line-height: 1.2;
    letter-spacing: .065em;
  }
  .team-right{
    gap: 14px;
  }
  .team-right p{
    font-size: .86rem;
    line-height: 1.7;
  }
  .team-tags{
    gap: 8px 8px;
  }
  .team-tags span{
    font-size: .49rem;
    letter-spacing: .22em;
    padding: 5px 8px;
  }
  .team-link{
    margin-top: 16px;
    font-size: .56rem;
    letter-spacing: .25em;
    padding-bottom: 4px;
  }

  .final-cta{
    padding: calc(var(--padY) + 4px) var(--padX) calc(var(--padY) - 6px);
  }
  .final-question{
    font-size: .76rem;
    letter-spacing: .24em;
    margin-bottom: 1.2rem;
  }
  .final-button,
  .final-secondary{
    width: 100%;
    max-width: 360px;
  }
  .final-button{
    padding: .9rem 1.2rem;
    font-size: .59rem;
    letter-spacing: .2em;
  }
  .final-secondary{
    padding: .76rem 1rem;
    font-size: .53rem;
    letter-spacing: .22em;
  }

  .equipo{
    padding: calc(74px + env(safe-area-inset-top)) var(--padX) 52px;
  }
  .equipo-intro{
    display: block;
  }
  .equipo-title{
    font-size: clamp(1.2rem, 8.4vw, 1.9rem);
    letter-spacing: .11em;
  }
  .equipo-desc{
    margin-top: 12px;
    font-size: .84rem;
    line-height: 1.72;
  }
  .equipo-signature{
    display: block;
    text-align: left;
    margin-top: 10px;
    font-size: .52rem;
    letter-spacing: .24em;
  }
  .equipo-grid{
    margin-top: 24px;
    gap: 12px;
  }
  .miembro{
    padding: 12px;
    gap: 10px;
    border-radius: 14px;
  }
  .miembro h3{
    font-size: .64rem;
    letter-spacing: .22em;
  }
  .miembro span{
    font-size: .52rem;
    letter-spacing: .18em;
  }

  .contact-page{
    padding: calc(78px + env(safe-area-inset-top)) var(--padX) 44px;
  }
  .contact-hero{
    gap: 14px;
    padding-bottom: 18px;
  }
  .contact-kicker{
    font-size: .54rem;
    letter-spacing: .3em;
    margin-bottom: 10px;
  }
  .contact-title{
    font-size: clamp(1.28rem, 10vw, 1.94rem);
    line-height: 1.08;
    letter-spacing: .07em;
  }
  .contact-intro{
    font-size: .85rem;
    line-height: 1.7;
  }
  .contact-note{
    text-align: left;
    margin-top: 0;
    font-size: .52rem;
    letter-spacing: .22em;
  }
  .contact-cards{
    margin-top: 18px;
    gap: 14px;
  }
  .contact-card{
    padding: 12px 0 14px;
    gap: 8px;
  }
  .contact-card h4{
    font-size: .56rem;
    letter-spacing: .24em;
  }
  .contact-card a{
    font-size: .76rem;
    letter-spacing: .08em;
    text-transform: none;
    overflow-wrap: anywhere;
  }
  .contact-cta{
    margin-top: 16px;
    gap: 10px;
  }
  .contact-start,
  .contact-shuffle{
    width: 100%;
    justify-content: center;
    font-size: .54rem;
    letter-spacing: .22em;
    padding: .74rem 1rem;
  }

  .project-page{
    padding-top: calc(14px + var(--padY));
  }
  .project-title{
    font-size: clamp(1.26rem, 8.6vw, 1.92rem);
    letter-spacing: .08em;
  }
  .project-sign{
    min-height: clamp(108px, 34vw, 156px);
  }
  .project-shot{
    min-height: 180px;
  }
  .next-project-title{
    font-size: clamp(1.2rem, 8vw, 2rem);
    letter-spacing: .1em;
  }

  .form-shell{
    padding: calc(84px + var(--padY-page)) var(--padX) 44px;
  }
  .form-progress{
    top: 74px;
    font-size: .5rem;
    letter-spacing: .18em;
  }
  .form-kicker{
    font-size: .5rem;
    letter-spacing: .3em;
    margin-bottom: 12px;
  }
  .form-question{
    font-size: clamp(1.22rem, 8.8vw, 1.82rem);
    letter-spacing: .06em;
    line-height: 1.16;
  }
  .form-note{
    margin-top: 12px;
    font-size: .56rem;
    letter-spacing: .18em;
  }
  .form-input,
  .form-textarea{
    font-size: .95rem;
  }
  .form-actions{
    margin-top: 22px;
    flex-wrap: wrap;
  }
  .form-prev,
  .form-next,
  .summary-btn{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: .78rem 1rem;
    letter-spacing: .2em;
  }
  .summary-actions{
    gap: 10px;
  }

  .site-footer{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 22px var(--padX) calc(22px + env(safe-area-inset-bottom));
  }
  .footer-right{
    display:flex;
    gap: 18px;
  }
  .footer-right a{ margin-left: 0; }

  .intro .logo{ width: min(280px, 72vw); }
}

@media (prefers-reduced-motion: reduce){
  .project-gallery,
  .menu-items a::after,
  .about-nav a::after,
  .footer-right a::after,
  .contact-card a::after,
  .team-link::after,
  .final-secondary::after,
  .project-back::after,
  .form-back::after,
  .section-title::after,
  .experimental-title::after,
  .team-title::after,
  .equipo-title::after,
  .dev-title::after,
  .contact-title::after,
  .form-question::after{
    transition: none;
    animation: none;
  }
}

/* =========================
   Reduced Motion
   ========================= */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }

  .reveal{ opacity: 1; transform: none; filter: none; transition: none; }
  .intro, .menu-overlay, .site-logo, .projects-dots{ transition: none; }

  .icon-track{ animation-duration: 110s; }
  body{ animation: none; }
  .spotlight, .scroll-progress{ display: none; }
}

/* =========================
   DESARROLLO PANEL LOOK
   ========================= */
body.page-desarrollo .dev-shell{
  --dev-sidebar-w: clamp(216px, 18.5vw, 280px);
  grid-template-columns: var(--dev-sidebar-w) minmax(0, 1fr);
  gap: 0;
  align-items: start;
}
body.page-desarrollo .dev-sidebar{
  position: fixed;
  left: var(--padX);
  top: 50%;
  transform: translateY(-50%);
  width: var(--dev-sidebar-w);
  align-self: start;
  min-height: auto;
  max-height: none;
  overflow: visible;
  padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  z-index: 70;
}
body.dark.page-desarrollo .dev-sidebar{
  background: transparent;
}
body.page-desarrollo .dev-nav{
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-right: 14px;
}
body.page-desarrollo .dev-nav-sections{
  gap: 2px;
}
body.page-desarrollo .dev-nav-button{
  border: none;
  border-radius: 0;
  border-bottom: none;
  background: transparent;
  padding: 10px 2px;
  grid-template-columns: 14px 1fr auto;
  gap: 9px;
  letter-spacing: .17em;
  font-size: .68rem;
  transform: none;
}
body.page-desarrollo .dev-nav-button:hover{
  background: transparent;
  border-color: transparent;
  transform: none;
  opacity: .72;
}
body.page-desarrollo .dev-nav-button.is-active{
  background: transparent;
  border-color: transparent;
  opacity: 1;
}
body.page-desarrollo .dev-nav-icon{
  width: 13px;
  height: 13px;
  opacity: .5;
}
body.page-desarrollo .dev-nav-button.is-active .dev-nav-icon{
  opacity: .85;
  color: var(--team-accent);
}
body.page-desarrollo .dev-nav-label{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.page-desarrollo .dev-nav-count{
  font-size: .54rem;
  letter-spacing: .22em;
  opacity: .74;
}
body.page-desarrollo .dev-chrono{
  display: none;
}
body.page-desarrollo .dev-chrono:hover{
  transform: none;
  opacity: .78;
}
body.page-desarrollo .dev-content{
  grid-column: 2 / -1;
  padding: 2px 0 0 clamp(18px, 2.1vw, 34px);
}
body.page-desarrollo .dev-section{
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.dark.page-desarrollo .dev-section{
  background: transparent;
  box-shadow: none;
}
body.page-desarrollo .dev-section-head{
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: clamp(14px, 2vw, 22px);
}
body.page-desarrollo .dev-project-grid{
  gap: clamp(12px, 1.6vw, 20px);
}

@media (max-width: 980px){
  body.page-desarrollo .dev-shell{
    --dev-sidebar-w: min(43vw, 188px);
    grid-template-columns: var(--dev-sidebar-w) minmax(0, 1fr);
    gap: 0;
    align-items: start;
  }
  body.page-desarrollo .dev-sidebar{
    position: fixed;
    left: var(--padX);
    top: 50%;
    transform: translateY(-50%);
    width: var(--dev-sidebar-w);
    min-height: auto;
    max-height: none;
    overflow: visible;
    padding: 8px 10px 12px 0;
    border: 0;
    border-right: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
  }
  body.page-desarrollo .dev-nav{
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-right: 10px;
  }
  body.page-desarrollo .dev-nav-button{
    width: 100%;
    grid-template-columns: 11px 1fr auto;
    gap: 6px;
    padding: 8px 2px;
    font-size: .5rem;
    letter-spacing: .12em;
  }
  body.page-desarrollo .dev-nav-icon{
    width: 11px;
    height: 11px;
  }
  body.page-desarrollo .dev-nav-count{
    font-size: .45rem;
    letter-spacing: .14em;
  }
  body.page-desarrollo .dev-chrono{
    display: none;
  }
  body.page-desarrollo .dev-section{
    padding: 0;
    border-radius: 0;
  }
  body.page-desarrollo .dev-content{
    grid-column: 2 / -1;
    padding: 2px 0 0 12px;
  }
  body.page-desarrollo .dev-project-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    min-height: 168px;
  }
}

@media (max-width: 680px){
  body.page-desarrollo .dev-shell{
    --dev-sidebar-w: min(46vw, 170px);
    grid-template-columns: var(--dev-sidebar-w) minmax(0, 1fr);
    gap: 10px;
  }
  body.page-desarrollo .dev-nav-button{
    font-size: .47rem;
    letter-spacing: .11em;
  }
}

html.has-js body.page-ready.page-desarrollo .dev-shell{
  transform: none;
}

/* =========================
   DESARROLLO: FIXED FOOTER + INTERNAL SCROLL
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo{
    overflow: hidden;
  }

  body.page-desarrollo .dev-page{
    --dev-top-space: clamp(92px, 10vh, 124px);
    --dev-footer-space: 76px;
    height: 100dvh;
    min-height: 100dvh;
    padding-top: var(--dev-top-space);
    padding-bottom: calc(var(--dev-footer-space) + env(safe-area-inset-bottom));
  }

  body.page-desarrollo .site-footer{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 75;
    padding: 14px var(--padX) calc(14px + env(safe-area-inset-bottom));
  }

  body.page-desarrollo .dev-shell{
    height: calc(100dvh - var(--dev-top-space) - var(--dev-footer-space) - env(safe-area-inset-bottom));
    min-height: 0;
    align-items: stretch;
  }

  body.page-desarrollo .dev-sidebar{
    max-height: none;
    overflow: visible;
  }

  body.page-desarrollo .dev-content{
    height: 100%;
    max-height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 10px;
  }

  body.page-desarrollo .dev-section{
    min-height: 100%;
    display: flex;
    flex-direction: column;
  }

  body.page-desarrollo .dev-section-head{
    position: sticky;
    top: 0;
    z-index: 4;
    background: var(--paper);
    padding-top: 2px;
  }

  body.page-desarrollo .dev-content::-webkit-scrollbar{
    width: 0;
    height: 0;
    display: none;
  }

  body.page-desarrollo .dev-content::-webkit-scrollbar-thumb{
    background: transparent;
  }

  body.dark.page-desarrollo .dev-content::-webkit-scrollbar-thumb{
    background: transparent;
  }
}

/* =========================
   PROYECTOS MOBILE: KEEP PREVIOUS LOOK
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-shot .shot-overlay{
    display: none !important;
  }

  body.page-proyecto .next-project-card{
    min-height: auto;
    padding: 14px 0;
    gap: 8px;
    justify-items: start;
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 0;
    transform: none;
  }

  body.page-proyecto .next-project-card:hover{
    transform: none;
    opacity: 1;
  }

  body.page-proyecto .next-project-title{
    font-size: clamp(1rem, 6.8vw, 1.52rem);
    letter-spacing: .1em;
  }

  body.page-proyecto .next-project-icon{
    width: clamp(94px, 28vw, 136px);
    opacity: .68;
  }
}

/* =========================
   HOTFIX: DESARROLLO FOOTER + PROJECT LOGO TOP
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo .site-footer{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 220;
    display: flex;
    opacity: 1;
    visibility: visible;
    transform: none;
  }

  body.page-proyecto .project-side-menu{
    justify-content: flex-start;
    align-content: start;
  }

  body.page-proyecto .project-side-brand{
    margin-bottom: clamp(12px, 1.7vw, 22px);
  }

  body.page-proyecto .project-side-nav{
    margin-top: 0;
  }
}

/* =========================
   HOTFIX V2: SIDEMENU BALANCE + FOOTER VISIBLE
   ========================= */
@media (min-width: 981px){
  /* Proyecto: logo arriba, menú centrado */
  body.page-proyecto .project-side-menu{
    position: relative;
    justify-content: center;
    align-content: center;
  }

  body.page-proyecto .project-side-brand{
    position: absolute;
    top: clamp(18px, 2.1vw, 30px);
    left: clamp(14px, 1.6vw, 20px);
    margin: 0;
  }

  body.page-proyecto .project-side-nav{
    margin-top: 0;
  }

  /* Footer siempre visible en desktop */
  body.page-desarrollo .site-footer,
  body.page-proyecto .site-footer{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 220;
    display: flex !important;
    opacity: 1;
    visibility: visible;
    transform: none;
  }

  /* Proyecto: reservamos espacio real para que no tape contenido */
  body.page-proyecto .project-desktop-layout{
    height: calc(100dvh - 68px - env(safe-area-inset-bottom));
  }

  body.page-proyecto .project-page{
    height: 100%;
    max-height: 100%;
  }
}
/* =========================
   HOTFIX V5: LIMITE + BANDA FULL-WIDTH SIGUIENTES
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    display: grid;
    grid-template-columns: minmax(228px, 260px) minmax(0, 1fr) minmax(320px, 390px);
    grid-template-rows: minmax(0, 1fr) clamp(180px, 30vh, 330px);
    grid-template-areas:
      "side media info"
      "next next next";
    height: calc(100dvh - 68px - env(safe-area-inset-bottom));
    min-height: 0;
  }

  body.page-proyecto .project-side-menu{
    grid-area: side;
  }

  body.page-proyecto .project-media-column{
    grid-area: media;
    display: block;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: clamp(18px, 2vw, 30px);
    margin: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.page-proyecto .project-media-column::-webkit-scrollbar{
    width: 0;
    height: 0;
    display: none;
  }

  body.page-proyecto .project-info-panel{
    grid-area: info;
  }

  body.page-proyecto .project-resources{
    grid-area: next;
    margin: 0;
    border-top: 1px solid var(--line);
    padding: clamp(10px, 1.2vw, 16px) clamp(18px, 2vw, 30px) clamp(8px, 1vw, 12px);
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--paper);
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.page-proyecto .project-resources::-webkit-scrollbar{
    width: 0;
    height: 0;
    display: none;
  }

  body.page-proyecto .project-resources .next-project-kicker{
    text-align: left;
    margin-bottom: 10px;
  }

  body.page-proyecto .next-project-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(14px, 1.8vw, 22px);
  }

  body.page-proyecto .next-project-card{
    min-height: clamp(138px, 18vh, 190px);
  }
}

/* =========================
   HOTFIX V6: LIMITE FIJO + SCROLL SECUENCIAL
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-resources.is-locked{
    overflow: hidden;
  }

  body.page-proyecto .project-resources.is-locked .next-project-grid{
    opacity: .88;
  }

  body.page-proyecto .project-resources:not(.is-locked) .next-project-grid{
    opacity: 1;
  }
}

/* =========================
   HOTFIX V7: MENU STABLE WITH FULL-WIDTH BAND
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-side-menu{
    grid-row: 1 / -1;
    min-height: 0;
    z-index: 2;
  }

  body.page-proyecto .project-info-panel{
    grid-row: 1 / -1;
    min-height: 0;
    z-index: 2;
  }

  body.page-proyecto .project-media-column{
    grid-row: 1;
    z-index: 1;
  }

  body.page-proyecto .project-resources{
    z-index: 4;
  }
}

/* =========================
   HOTFIX V8: SCROLL CONTINUO + MENU CENTRADO
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    display: grid;
    grid-template-columns: minmax(228px, 260px) minmax(0, 1fr) minmax(320px, 390px);
    grid-template-rows: minmax(0, 1fr);
    grid-template-areas: none;
    height: calc(100dvh - 68px - env(safe-area-inset-bottom));
    min-height: 0;
  }

  body.page-proyecto .project-side-menu{
    grid-column: 1;
    grid-row: 1;
    position: relative;
    justify-content: center;
    align-content: center;
    min-height: 0;
  }

  body.page-proyecto .project-side-brand{
    position: absolute;
    top: clamp(18px, 2.1vw, 30px);
    left: clamp(14px, 1.6vw, 20px);
    margin: 0;
  }

  body.page-proyecto .project-side-nav{
    margin-top: 0;
  }

  body.page-proyecto .project-media-column{
    grid-column: 2;
    grid-row: 1;
    display: block;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: clamp(18px, 2vw, 30px);
    margin: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.page-proyecto .project-media-column::-webkit-scrollbar{
    width: 0;
    height: 0;
    display: none;
  }

  body.page-proyecto .project-media-column .project-gallery{
    margin-bottom: clamp(20px, 2.2vw, 30px);
  }

  body.page-proyecto .project-media-column .project-resources,
  body.page-proyecto .project-resources{
    grid-area: auto;
    margin-top: 0;
    border-top: 1px solid var(--line);
    padding-top: 16px;
    padding-bottom: 8px;
    overflow: visible;
    opacity: 1;
    pointer-events: auto;
    background: transparent;
  }

  body.page-proyecto .project-resources.is-locked{
    overflow: visible;
  }

  body.page-proyecto .project-info-panel{
    grid-column: 3;
    grid-row: 1;
    min-height: 0;
  }
}

/* =========================
   HOTFIX V9: MENU MATCH DESARROLLO + SIDE NEXT
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-side-menu{
    border-right: 1px solid var(--line);
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0;
    background: transparent;
    gap: 0;
  }

  body.page-proyecto .project-side-brand-main{
    font-size: clamp(12px, .86vw, 14px);
    letter-spacing: .38em;
  }

  body.page-proyecto .project-side-brand-sub{
    width: 100%;
    text-align: justify;
    text-align-last: justify;
    font-size: clamp(8px, .54vw, 10px);
    letter-spacing: .24em;
    line-height: 1;
  }

  body.page-proyecto .project-side-brand-sub::after{
    content: "";
    display: inline-block;
    width: 100%;
  }

  body.page-proyecto .project-side-nav{
    gap: 2px;
    margin-top: 0;
    padding-right: 14px;
    padding-bottom: clamp(108px, 14vh, 160px);
  }

  body.page-proyecto .project-side-link{
    grid-template-columns: 14px 1fr auto;
    gap: 9px;
    padding: 10px 2px;
    font-size: .68rem;
    letter-spacing: .17em;
  }

  body.page-proyecto .project-side-icon{
    width: 13px;
    height: 13px;
    opacity: .5;
  }

  body.page-proyecto .project-side-link.is-active .project-side-icon{
    opacity: .85;
    color: var(--team-accent);
  }

  body.page-proyecto .project-side-count{
    font-size: .54rem;
    letter-spacing: .22em;
    opacity: .74;
  }

  body.page-proyecto .project-side-next{
    position: absolute;
    left: 0;
    right: 14px;
    bottom: clamp(10px, 1.5vw, 18px);
    z-index: 3;
    display: grid;
    gap: 4px;
    min-height: 78px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
    text-decoration: none;
    color: var(--ink);
    transition: opacity .25s ease;
  }

  body.page-proyecto .project-side-next:hover{
    opacity: .82;
  }

  body.page-proyecto .project-side-next-kicker{
    font-size: .5rem;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--team-accent);
    opacity: .84;
  }

  body.page-proyecto .project-side-next-title{
    font-family: var(--display);
    font-size: .72rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    line-height: 1.18;
    max-width: calc(100% - 72px);
  }

  body.page-proyecto .project-side-next-meta{
    font-size: .48rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ink-soft);
    max-width: calc(100% - 72px);
  }

  body.page-proyecto .project-side-next-icon{
    position: absolute;
    right: 0;
    bottom: 2px;
    width: clamp(56px, 5.4vw, 82px);
    opacity: .34;
    filter: grayscale(1);
    pointer-events: none;
  }

  body.dark.page-proyecto .project-side-next-icon{
    filter: grayscale(1) invert(1) brightness(1.18);
    opacity: .45;
  }
}

/* =========================
   HOTFIX V10: PROJECT MENU LIKE DESARROLLO
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    --project-sidebar-w: clamp(216px, 18.5vw, 280px);
    grid-template-columns: var(--project-sidebar-w) minmax(0, 1fr) minmax(320px, 390px);
    gap: 0;
  }

  body.page-proyecto .project-side-menu{
    position: fixed;
    left: var(--padX);
    top: 50%;
    transform: translateY(-50%);
    width: var(--project-sidebar-w);
    align-self: start;
    min-height: auto;
    max-height: none;
    overflow: visible;
    border-right: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0;
    z-index: 70;
  }

  body.page-proyecto .project-side-brand{
    position: fixed;
    top: calc(22px + env(safe-area-inset-top));
    left: var(--padX);
    margin: 0;
    z-index: 72;
  }

  body.page-proyecto .project-side-nav{
    gap: 2px;
    margin-top: 0;
    padding-right: 14px;
    padding-bottom: 0;
  }

  body.page-proyecto .project-side-next{
    position: fixed;
    left: var(--padX);
    right: auto;
    width: var(--project-sidebar-w);
    bottom: calc(70px + env(safe-area-inset-bottom));
    z-index: 72;
    border-top: 1px solid var(--line);
    padding-top: 10px;
    min-height: 78px;
  }

  body.page-proyecto .project-side-next-title,
  body.page-proyecto .project-side-next-meta{
    max-width: calc(100% - 78px);
  }

  body.page-proyecto .project-media-column{
    grid-column: 2;
  }

  body.page-proyecto .project-info-panel{
    grid-column: 3;
  }
}

/* =========================
   HOTFIX V11: MENU CLEAN (NO SIDE NEXT)
   ========================= */
@media (min-width: 981px){
  /* logo siempre arriba */
  body.page-proyecto .project-side-brand{
    position: fixed;
    top: calc(22px + env(safe-area-inset-top));
    left: var(--padX);
    margin: 0;
    z-index: 72;
  }

  /* menú centrado, limpio, sin extras */
  body.page-proyecto .project-side-menu{
    position: fixed;
    left: var(--padX);
    top: 50%;
    transform: translateY(-50%);
    width: clamp(216px, 18.5vw, 280px);
    min-height: auto;
    max-height: none;
    overflow: visible;
    border-right: 1px solid var(--line);
    background: transparent;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    z-index: 70;
  }

  body.page-proyecto .project-side-nav{
    gap: 2px;
    margin-top: 0;
    padding-right: 14px;
    padding-bottom: 0;
  }

  /* quitar totalmente el siguiente dentro del menú */
  body.page-proyecto .project-side-next,
  body.page-proyecto .project-side-next-kicker,
  body.page-proyecto .project-side-next-title,
  body.page-proyecto .project-side-next-meta,
  body.page-proyecto .project-side-next-icon{
    display: none !important;
  }
}

/* =========================
   HOTFIX V13: PROJECT DESKTOP CLEAN LAYOUT (FINAL OVERRIDE)
   ========================= */
@media (min-width: 981px){
  body.page-proyecto{
    overflow: hidden;
    height: 100dvh;
  }

  body.page-proyecto .project-page{
    padding: 0 var(--padX) calc(72px + env(safe-area-inset-bottom)) !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    box-sizing: border-box;
  }

  body.page-proyecto .project-desktop-layout{
    --project-sidebar-w: clamp(216px, 18.5vw, 280px);
    display: grid;
    grid-template-columns: var(--project-sidebar-w) minmax(0, 1fr) minmax(320px, 390px);
    gap: 0;
    height: 100%;
    min-height: 0;
    position: relative;
  }

  body.page-proyecto .project-side-brand{
    position: fixed !important;
    top: calc(22px + env(safe-area-inset-top)) !important;
    left: var(--padX) !important;
    width: var(--project-sidebar-w);
    margin: 0 !important;
    z-index: 92;
  }

  body.page-proyecto .project-side-menu{
    position: fixed !important;
    left: var(--padX) !important;
    top: 0 !important;
    bottom: calc(72px + env(safe-area-inset-bottom)) !important;
    margin-block: auto;
    height: max-content;
    max-height: calc(100dvh - 128px - env(safe-area-inset-bottom));
    width: var(--project-sidebar-w);
    transform: none !important;
    border-right: 1px solid var(--line);
    border-radius: 0;
    background: transparent !important;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0 !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    overflow: visible;
    z-index: 90;
  }

  body.page-proyecto .project-side-nav{
    margin-top: 0 !important;
    padding-right: 14px;
    padding-bottom: 0 !important;
    gap: 2px;
  }

  body.page-proyecto .project-media-column{
    grid-column: 2;
    grid-row: 1;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: clamp(20px, 2vw, 30px) clamp(26px, 2.4vw, 36px) clamp(20px, 2vw, 30px) clamp(30px, 2.8vw, 44px) !important;
    margin: 0 !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.page-proyecto .project-media-column::-webkit-scrollbar{
    width: 0;
    height: 0;
    display: none;
  }

  body.page-proyecto .project-media-column .project-gallery,
  body.page-proyecto .project-media-column .project-gallery-grid,
  body.page-proyecto .project-media-column .project-shot{
    margin: 0 !important;
  }

  body.page-proyecto .project-info-panel{
    grid-column: 3;
    grid-row: 1;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    border-left: 1px solid var(--line);
  }

  body.page-proyecto .project-side-next,
  body.page-proyecto .project-side-next-kicker,
  body.page-proyecto .project-side-next-title,
  body.page-proyecto .project-side-next-meta,
  body.page-proyecto .project-side-next-icon{
    display: none !important;
  }

  body.page-proyecto .site-footer{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 220;
  }
}

/* =========================
   HOTFIX V14: EQUIPO FRAMELESS CARDS
   ========================= */
body.page-equipo .equipo-grid{
  gap: clamp(18px, 2.1vw, 30px);
}

body.page-equipo .miembro{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  gap: 12px;
}

body.page-equipo .miembro-media{
  border-radius: 14px;
}

body.page-equipo .miembro--ivan,
body.page-equipo .miembro--emmanuel{
  padding-bottom: clamp(12px, 1.8vw, 20px) !important;
  border-bottom: 1px solid var(--line);
}

body.page-equipo .miembro h3{
  margin-top: 2px;
}

body.page-equipo .miembro span{
  padding-bottom: 0;
}

@media (max-width: 900px){
  body.page-equipo .equipo-grid{
    gap: 16px;
  }

  body.page-equipo .miembro{
    padding: 0 !important;
  }

  body.page-equipo .miembro-media{
    border-radius: 12px;
  }
}

/* =========================
   HOTFIX V15: GLOBAL LOGO UNIFIED (HOME STYLE)
   ========================= */
.page-logo,
.project-logo,
body.page-proyecto .project-side-brand-main{
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(18px, 1.6vw, 24px) !important;
  letter-spacing: 0.45em !important;
  text-transform: uppercase;
  line-height: 1;
  color: var(--ink);
}

.page-logo{
  text-decoration: none;
}

.page-logo.page-logo-box{
  display: inline-block;
  gap: 0 !important;
  width: auto !important;
  padding: 0 !important;
}

.page-logo.page-logo-box .page-logo-main{
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(18px, 1.6vw, 24px) !important;
  letter-spacing: 0.45em !important;
  text-transform: uppercase;
  line-height: 1;
}

body.page-desarrollo .page-logo-box .page-logo-sub,
body.page-proyecto .project-side-brand-sub{
  display: none !important;
}

body.page-proyecto .project-side-brand{
  text-decoration: none;
  color: var(--ink);
}

/* =========================
   HOTFIX V16: CONTACTO WHITE + NO SELECTION ANIMATIONS
   ========================= */
body.page-contacto,
body.dark.page-contacto{
  --paper: #ffffff;
  --ink: #14120f;
  --ink-soft: rgba(20,18,15,0.68);
  --line: rgba(20,18,15,0.22);
  background: #ffffff !important;
  animation: none !important;
}

body.page-contacto .contact-page{
  background: #ffffff !important;
}

body.page-contacto .contact-ambient,
body.page-contacto .grain,
body.page-contacto .spotlight{
  display: none !important;
}

body.page-contacto .contact-card a::after{
  transition: none !important;
  transform: scaleX(0) !important;
  opacity: 0 !important;
}

body.page-contacto .contact-card a,
body.page-contacto .contact-start,
body.page-contacto .contact-shuffle{
  transition: none !important;
}

body.page-contacto .contact-start:hover,
body.page-contacto .contact-shuffle:hover{
  transform: none !important;
  opacity: 1 !important;
}

body.page-contacto .contact-shuffle{
  border-color: var(--line);
  color: var(--ink-soft);
}

/* =========================
   HOTFIX V17: LOGO HOME EXACT MATCH (ALL PAGES)
   ========================= */
body:not(.page-home) .page-logo,
body:not(.page-home) .project-logo,
body.page-proyecto .project-side-brand{
  font-family: var(--display) !important;
  font-weight: 700 !important;
  font-size: clamp(18px, 1.6vw, 24px) !important;
  letter-spacing: 0.45em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: var(--ink) !important;
}

body.page-proyecto .project-side-brand{
  display: inline-block;
  width: auto !important;
  white-space: nowrap;
  text-decoration: none;
}

/* =========================
   HOTFIX V18: LOGO FORCE MATCH (PAGE BY PAGE)
   ========================= */
body.page-contacto .page-logo,
body.page-equipo .page-logo,
body.page-desarrollo .page-logo,
body.page-form .page-logo,
body.page-proyecto .project-logo,
body.page-proyecto .project-side-brand{
  font-family: var(--display) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: clamp(18px, 1.6vw, 24px) !important;
  letter-spacing: 0.45em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: var(--ink) !important;
}

body.page-desarrollo .page-logo{
  display: inline-block !important;
  text-decoration: none !important;
}

body.page-proyecto .project-side-brand{
  text-decoration: none !important;
}

/* =========================
   HOTFIX V19: GLOBAL BRANDMARK (NOT CARD STYLE)
   ========================= */
body:not(.page-home) .page-logo,
body.page-proyecto .project-logo,
body.page-proyecto .project-side-brand{
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2px !important;
  width: fit-content !important;
  text-decoration: none !important;
  color: var(--ink) !important;
  font-family: var(--display) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: clamp(12px, .86vw, 14px) !important;
  letter-spacing: .38em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body:not(.page-home) .page-logo::after,
body.page-proyecto .project-logo::after,
body.page-proyecto .project-side-brand::after{
  content: "TALLER DE ARQUITECTURA";
  display: block;
  width: 100%;
  white-space: nowrap;
  line-height: 1;
  text-align: justify;
  text-align-last: justify;
  font-family: var(--serif);
  font-size: clamp(8px, .54vw, 10px);
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

body:not(.page-home) .page-logo::after,
body.page-proyecto .project-logo::after{
  margin-top: 1px;
}

body:not(.page-home) .page-logo.page-logo-box::after{
  content: none !important;
}

body:not(.page-home) .page-logo.page-logo-box .page-logo-main{
  display: block;
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(12px, .86vw, 14px);
  letter-spacing: .38em;
  text-transform: uppercase;
  line-height: 1;
}

body:not(.page-home) .page-logo.page-logo-box .page-logo-sub{
  display: block !important;
  width: 100%;
  white-space: nowrap;
  line-height: 1;
  text-align: justify;
  text-align-last: justify;
  font-family: var(--serif);
  font-size: clamp(8px, .54vw, 10px);
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

/* =========================
   HOTFIX V20: EXPERIENCE POLISH
   ========================= */

/* Use one reveal system for Equipo/Contacto */
html.has-js body.page-equipo .equipo-title,
html.has-js body.page-equipo .equipo-desc,
html.has-js body.page-equipo .equipo-grid,
html.has-js body.page-contacto .contact-hero,
html.has-js body.page-contacto .contact-cards,
html.has-js body.page-contacto .contact-cta{
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.ui-reveal{
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  filter: blur(10px);
  transition:
    opacity .78s var(--easeSoft),
    transform .78s var(--easeSoft),
    filter .78s var(--easeSoft);
  transition-delay: var(--ui-delay, 0ms);
}
.ui-reveal.is-visible{
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

@media (prefers-reduced-motion: reduce){
  .ui-reveal{
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
}

/* Home: smoother transitions between cards */
@keyframes homeCardMediaIn{
  from{ opacity: .42; transform: translate3d(0, 24px, 0) scale(1.08); filter: saturate(.84) contrast(.9) brightness(.7) blur(4px); }
  to{ opacity: 1; transform: translate3d(0, var(--parallax, 0px), 0) scale(var(--scale)); filter: saturate(1.05) contrast(1.03) brightness(1); }
}
@keyframes homeCardMediaOut{
  from{ opacity: 1; filter: saturate(1.02) contrast(1.02) brightness(1); }
  to{ opacity: .62; filter: saturate(.9) contrast(.95) brightness(.78) blur(1.5px); }
}
@keyframes homeWordIn{
  from{ opacity: 0; transform: translate3d(0, 10px, 0); }
  to{ opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes homeMetaIn{
  from{ opacity: 0; letter-spacing: .28em; transform: translate3d(0, 8px, 0); }
  to{ opacity: .95; letter-spacing: .40em; transform: translate3d(0, 0, 0); }
}

@media (min-width: 769px){
  body.page-home .projects.projects-stack .project{
    transition: transform .58s var(--easeSoft), opacity .58s var(--easeSoft);
  }

  body.page-home .projects.projects-stack .project.stack-current .project-media{
    filter: saturate(1.05) contrast(1.03) brightness(1);
  }
  body.page-home .projects.projects-stack .project.stack-next .project-media{
    filter: saturate(.9) contrast(.94) brightness(.76) blur(1px);
  }

  body.page-home .projects.projects-stack .project.stack-enter .project-media{
    animation: homeCardMediaIn .74s var(--easeSoft) both;
  }
  body.page-home .projects.projects-stack .project.stack-exit .project-media{
    animation: homeCardMediaOut .38s ease both;
  }

  body.page-home .projects.projects-stack .project.stack-enter .project-title h2 span{
    animation: homeWordIn .56s var(--easeSoft) both;
    animation-delay: calc(var(--i) * .048s);
  }
  body.page-home .projects.projects-stack .project.stack-enter .project-title p{
    animation: homeMetaIn .44s var(--easeSoft) both;
  }

  body.page-home .projects .project-title{
    transition: transform .64s var(--easeSoft), opacity .64s var(--easeSoft), filter .64s var(--easeSoft);
  }

  body.page-home .projects.projects-stack .project.stack-next .project-title{
    opacity: .42 !important;
    filter: blur(1.5px);
  }

  body.page-home .projects.projects-stack .project.stack-current .project-title{
    opacity: 1 !important;
    filter: blur(0);
  }
}

/* Home pills: white default, invert on hover/active */
body.page-home .areas-list a{
  background: #ffffff;
  color: var(--ink);
  border-color: var(--line);
  box-shadow: none;
}
body.page-home .areas-list a:hover,
body.page-home .areas-list a:focus-visible,
body.page-home .areas-list a.is-active{
  background: #111111;
  color: #ffffff;
  border-color: #111111;
}

/* Equipo: more cohesive without boxed cards */
body.page-equipo .equipo{
  background:
    radial-gradient(780px 320px at 12% 4%, rgba(138,100,67,0.08), transparent 74%),
    radial-gradient(640px 280px at 88% 92%, rgba(138,100,67,0.06), transparent 78%),
    #ffffff;
}
body.dark.page-equipo .equipo{
  background:
    radial-gradient(760px 320px at 12% 4%, rgba(211,178,119,0.1), transparent 74%),
    radial-gradient(640px 280px at 88% 92%, rgba(211,178,119,0.07), transparent 78%),
    #0d0b0a;
}

body.page-equipo .equipo-intro{
  padding-bottom: clamp(18px, 3vw, 34px);
  border-bottom: 1px solid var(--line);
}
body.page-equipo .equipo-title{
  letter-spacing: .115em;
}
body.page-equipo .equipo-desc{
  max-width: 62ch;
}
body.page-equipo .equipo-signature{
  letter-spacing: .30em;
}

body.page-equipo .equipo-grid{
  margin-top: clamp(28px, 4.2vw, 54px);
  gap: clamp(20px, 2.3vw, 30px);
}

body.page-equipo .miembro{
  position: relative;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 clamp(12px, 1.6vw, 20px) !important;
  gap: 12px;
}
body.page-equipo .miembro::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
}
body.page-equipo .miembro--paula::after{
  opacity: .3;
}

body.page-equipo .miembro-media{
  border-radius: 16px;
  background: rgba(0,0,0,0.04);
}
body.page-equipo .miembro img{
  transition: transform .85s var(--easeSoft), filter .85s var(--easeSoft);
}
body.page-equipo .miembro:hover img{
  transform: scale(1.035);
}
body.page-equipo .miembro h3{
  font-size: clamp(.84rem, 1.05vw, .98rem);
  letter-spacing: .19em;
}
body.page-equipo .miembro span{
  font-size: .64rem;
  letter-spacing: .22em;
  color: var(--team-accent);
  opacity: .95;
}

body.page-equipo .miembro--ivan,
body.page-equipo .miembro--emmanuel{
  padding-bottom: clamp(14px, 2vw, 22px) !important;
}
body.page-equipo .miembro--ivan .miembro-media,
body.page-equipo .miembro--emmanuel .miembro-media{
  box-shadow: 0 16px 36px rgba(0,0,0,0.1);
}
body.dark.page-equipo .miembro--ivan .miembro-media,
body.dark.page-equipo .miembro--emmanuel .miembro-media{
  box-shadow: 0 18px 40px rgba(0,0,0,0.38);
}

/* Contacto: modern, clean, white */
body.page-contacto,
body.dark.page-contacto{
  --paper: #ffffff;
  --ink: #14120f;
  --ink-soft: rgba(20,18,15,0.7);
  --line: rgba(20,18,15,0.2);
  background: #ffffff !important;
}
body.page-contacto .grain,
body.page-contacto .spotlight{
  display: none !important;
}

body.page-contacto .contact-page{
  background:
    radial-gradient(720px 360px at 6% 8%, rgba(138,100,67,0.06), transparent 76%),
    radial-gradient(640px 300px at 90% 92%, rgba(138,100,67,0.04), transparent 76%),
    #ffffff !important;
}
body.page-contacto .contact-ambient::after{
  background:
    radial-gradient(520px 300px at 16% 20%, rgba(138,100,67,0.08), transparent 66%),
    radial-gradient(620px 360px at 84% 76%, rgba(138,100,67,0.06), transparent 70%);
  opacity: .48;
}
body.page-contacto .contact-ambient-grid{
  opacity: .12;
}
body.page-contacto .contact-icon{
  width: clamp(54px, 7vw, 108px);
  opacity: .08 !important;
  filter: grayscale(1) brightness(.2);
  animation: none !important;
}

body.page-contacto .contact-hero{
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  align-items: end;
  gap: clamp(20px, 4vw, 74px);
  padding-bottom: clamp(22px, 3.5vw, 42px);
}
body.page-contacto .contact-kicker{
  letter-spacing: .34em;
  opacity: .72;
}
body.page-contacto .contact-title{
  font-size: clamp(2rem, 5.2vw, 4.35rem);
  line-height: 1.04;
  letter-spacing: .072em;
}
body.page-contacto .contact-note{
  margin-top: 0;
  text-align: right;
  letter-spacing: .30em;
  font-size: .68rem;
  color: var(--team-accent);
  opacity: .9;
}

body.page-contacto .contact-cards{
  gap: clamp(12px, 2vw, 20px);
  margin-top: clamp(20px, 3vw, 36px);
}
body.page-contacto .contact-card{
  border: 1px solid rgba(20,18,15,0.14);
  border-radius: 14px;
  padding: 16px 16px 18px;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 28px rgba(0,0,0,0.04);
  transition: transform .35s var(--easeSoft), box-shadow .35s var(--easeSoft), border-color .35s var(--easeSoft);
}
body.page-contacto .contact-card:hover{
  transform: translateY(-4px);
  border-color: rgba(20,18,15,0.26);
  box-shadow: 0 18px 34px rgba(0,0,0,0.08);
}
body.page-contacto .contact-card h4{
  font-size: .6rem;
  letter-spacing: .32em;
  opacity: .72;
}
body.page-contacto .contact-card a{
  font-size: .86rem;
  letter-spacing: .12em;
  transition: opacity .25s ease, color .25s ease;
}
body.page-contacto .contact-card a:hover{
  opacity: 1;
  color: #000000;
}
body.page-contacto .contact-card a::after{
  content: none !important;
}

body.page-contacto .contact-cta{
  margin-top: clamp(18px, 2.6vw, 32px);
  justify-content: flex-start;
}
body.page-contacto .contact-start{
  border: 1px solid #111111;
  background: #111111;
  color: #ffffff;
  letter-spacing: .3em;
  padding: .86rem 2rem;
  transition: transform .25s var(--easeSoft), background .25s ease, color .25s ease;
}
body.page-contacto .contact-start:hover{
  background: #ffffff;
  color: #111111;
  border-color: #111111;
  transform: translateY(-2px);
}
body.page-contacto .contact-shuffle{
  display: none !important;
}

@media (max-width: 900px){
  body.page-equipo .equipo-intro{
    padding-bottom: 14px;
  }
  body.page-equipo .equipo-grid{
    gap: 18px;
  }
  body.page-equipo .miembro{
    padding-bottom: 12px !important;
  }
  body.page-equipo .miembro-media{
    border-radius: 12px;
  }

  body.page-contacto .contact-page{
    padding-top: calc(78px + env(safe-area-inset-top));
  }
  body.page-contacto .contact-hero{
    grid-template-columns: 1fr;
    gap: 12px;
    padding-bottom: 16px;
  }
  body.page-contacto .contact-note{
    text-align: left;
    font-size: .54rem;
  }
  body.page-contacto .contact-cards{
    grid-template-columns: 1fr;
    gap: 12px;
  }
  body.page-contacto .contact-card{
    border-radius: 12px;
    padding: 13px 13px 14px;
  }
  body.page-contacto .contact-card a{
    font-size: .78rem;
    letter-spacing: .08em;
    text-transform: none;
  }
  body.page-contacto .contact-cta{
    justify-content: stretch;
  }
  body.page-contacto .contact-start{
    width: 100%;
    justify-content: center;
    letter-spacing: .22em;
    padding: .78rem 1rem;
  }
}

/* =========================
   HOTFIX V22: GLOBAL LOGO = HOME LOGO
   ========================= */
body:not(.page-home) .page-logo,
body:not(.page-home) .project-logo,
body.page-proyecto .project-side-brand,
body.page-proyecto .project-side-brand-main,
body:not(.page-home) .page-logo.page-logo-box .page-logo-main{
  font-family: var(--display) !important;
  font-weight: 700 !important;
  font-size: clamp(18px, 1.6vw, 24px) !important;
  letter-spacing: 0.45em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: var(--ink) !important;
}

body:not(.page-home) .page-logo,
body:not(.page-home) .project-logo,
body.page-proyecto .project-side-brand{
  display: inline-block !important;
  width: auto !important;
  text-decoration: none !important;
}

body:not(.page-home) .page-logo::after,
body:not(.page-home) .project-logo::after,
body.page-proyecto .project-side-brand::after,
body.page-proyecto .project-side-brand-main::after{
  content: none !important;
}

body:not(.page-home) .page-logo.page-logo-box{
  display: inline-block !important;
  width: auto !important;
  padding: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

body:not(.page-home) .page-logo.page-logo-box .page-logo-sub,
body.page-proyecto .project-side-brand-sub{
  display: none !important;
}

/* =========================
   HOTFIX V23: LOGO LOCK (HOME WORDMARK EVERYWHERE)
   ========================= */
body:not(.page-home) .logo-home-lock,
body:not(.page-home) .page-logo,
body:not(.page-home) .project-logo,
body.page-proyecto .project-side-brand{
  display: inline-block !important;
  width: auto !important;
  text-decoration: none !important;
  font-family: var(--display) !important;
  font-weight: 700 !important;
  font-size: clamp(18px, 1.6vw, 24px) !important;
  letter-spacing: 0.45em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: var(--ink) !important;
}

body:not(.page-home) .page-logo.page-logo-box{
  display: inline-block !important;
  width: auto !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  gap: 0 !important;
}

body:not(.page-home) .logo-home-lock::after,
body:not(.page-home) .page-logo::after,
body:not(.page-home) .project-logo::after,
body.page-proyecto .project-side-brand::after,
body.page-proyecto .project-side-brand-main::after{
  content: none !important;
  display: none !important;
}

body:not(.page-home) .page-logo.page-logo-box .page-logo-main,
body.page-proyecto .project-side-brand-main{
  font-family: var(--display) !important;
  font-weight: 700 !important;
  font-size: clamp(18px, 1.6vw, 24px) !important;
  letter-spacing: 0.45em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: var(--ink) !important;
}

body:not(.page-home) .page-logo.page-logo-box .page-logo-sub,
body.page-proyecto .project-side-brand-sub{
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* =========================
   HOTFIX V24: DESKTOP STABILITY (PROYECTOS + DESARROLLO)
   ========================= */
@media (min-width: 981px){
  /* PROYECTOS: fondo limpio, sin jitter, layout fijo */
  body.page-proyecto,
  body.dark.page-proyecto{
    background: var(--paper) !important;
    animation: none !important;
    overflow: hidden !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    overscroll-behavior: none;
  }
  body.page-proyecto .grain,
  body.page-proyecto .spotlight,
  body.page-proyecto .scroll-progress{
    display: none !important;
  }

  body.page-proyecto .project-page{
    padding: 0 !important;
    height: calc(100dvh - 68px - env(safe-area-inset-bottom)) !important;
    max-height: calc(100dvh - 68px - env(safe-area-inset-bottom)) !important;
    min-height: 0 !important;
  }

  body.page-proyecto .project-desktop-layout{
    display: grid !important;
    grid-template-columns: minmax(228px, 260px) minmax(0, 1fr) minmax(320px, 390px) !important;
    height: 100% !important;
    min-height: 0 !important;
    background: var(--paper) !important;
    border-top: 0 !important;
  }

  body.page-proyecto .project-side-menu{
    position: relative !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    padding: clamp(18px, 2vw, 30px) clamp(16px, 1.8vw, 22px) !important;
    border-right: 1px solid var(--line) !important;
    background: var(--paper) !important;
    transform: none !important;
    transition: none !important;
    z-index: 4 !important;
  }

  body.page-proyecto .project-side-brand{
    position: absolute !important;
    top: clamp(18px, 2vw, 30px) !important;
    left: clamp(16px, 1.8vw, 22px) !important;
    margin: 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-nav{
    margin-top: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-link{
    transform: none !important;
  }

  body.page-proyecto .project-side-count{
    display: inline-block;
    width: 2.4ch;
    text-align: right;
  }

  body.page-proyecto .project-media-column{
    height: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain;
    padding: clamp(18px, 2vw, 30px) !important;
    margin: 0 !important;
    background: var(--paper) !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  body.page-proyecto .project-media-column::-webkit-scrollbar{
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }

  body.page-proyecto .project-media-column .project-gallery{
    margin-bottom: clamp(20px, 2.4vw, 30px) !important;
  }

  body.page-proyecto .project-media-column .project-resources,
  body.page-proyecto .project-resources{
    margin: 0 !important;
    border-top: 1px solid var(--line) !important;
    padding: 16px 0 10px !important;
    background: transparent !important;
  }

  body.page-proyecto .project-info-panel{
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: clamp(18px, 2vw, 30px) clamp(16px, 1.8vw, 24px) !important;
    border-left: 1px solid var(--line) !important;
    background: var(--paper) !important;
    transform: none !important;
    transition: none !important;
    z-index: 3 !important;
  }

  /* DESARROLLO: menú fijo centrado sin micro movimiento */
  body.page-desarrollo .dev-page{
    --dev-top-space: clamp(92px, 10vh, 124px);
    --dev-footer-space: 76px;
  }

  body.page-desarrollo .dev-sidebar{
    position: fixed !important;
    left: var(--padX) !important;
    top: var(--dev-top-space) !important;
    bottom: calc(var(--dev-footer-space) + env(safe-area-inset-bottom)) !important;
    width: var(--dev-sidebar-w) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    transform: none !important;
    will-change: auto !important;
    backface-visibility: hidden;
  }
}

/* =========================
   HOTFIX V25: LOGO STYLE = ABOUT SECTION
   ========================= */
body:not(.page-home) .logo-about-style,
body:not(.page-home) .page-logo,
body:not(.page-home) .project-logo,
body.page-proyecto .project-side-brand{
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 0.42rem !important;
  width: fit-content !important;
  text-decoration: none !important;
  color: var(--ink) !important;
  font-family: var(--display) !important;
  font-weight: 700 !important;
  font-size: .92rem !important;
  letter-spacing: .32em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body:not(.page-home) .page-logo.page-logo-box{
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 0.42rem !important;
  width: fit-content !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

body:not(.page-home) .page-logo.page-logo-box .page-logo-main,
body.page-proyecto .project-side-brand-main{
  display: block !important;
  font-family: var(--display) !important;
  font-size: .92rem !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
}

body:not(.page-home) .page-logo.page-logo-box .page-logo-sub,
body.page-proyecto .project-side-brand-sub{
  display: block !important;
  font-family: var(--display) !important;
  font-size: .62rem !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  margin-top: 0 !important;
  opacity: .75 !important;
  color: var(--ink-soft) !important;
  white-space: nowrap !important;
  visibility: visible !important;
  height: auto !important;
  overflow: visible !important;
}

body:not(.page-home) .page-logo::after,
body:not(.page-home) .project-logo::after,
body.page-proyecto .project-side-brand::after{
  content: "TALLER DE ARQUITECTURA" !important;
  display: block !important;
  font-family: var(--display) !important;
  font-size: .62rem !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  margin-top: .02rem !important;
  opacity: .75 !important;
  color: var(--ink-soft) !important;
  white-space: nowrap !important;
}

body:not(.page-home) .page-logo.page-logo-box::after{
  content: none !important;
  display: none !important;
}

/* =========================
   HOTFIX V26: DESARROLLO MENU CENTER + LOGO ALIGN
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo .dev-sidebar{
    top: 50% !important;
    bottom: auto !important;
    transform: translate3d(0, -50%, 0) !important;
    height: auto !important;
    max-height: calc(100dvh - 170px) !important;
    min-height: 0 !important;
    justify-content: flex-start !important;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(14px, 1.7vw, 20px) 0 !important;
  }

  body.page-desarrollo .dev-nav{
    margin: 0 !important;
    padding-right: 14px !important;
  }

  body.page-desarrollo .dev-nav-sections{
    margin: 0 !important;
  }

  body.page-desarrollo .page-logo.page-logo-box{
    left: calc(var(--padX) + 1px) !important;
    align-items: flex-start !important;
    text-align: left !important;
  }

  body.page-desarrollo .page-logo.page-logo-box .page-logo-main,
  body.page-desarrollo .page-logo.page-logo-box .page-logo-sub{
    display: block !important;
    text-align: left !important;
    text-align-last: auto !important;
    white-space: nowrap !important;
  }
}

/* =========================
   HOTFIX V27: SAME MENU POSITION (DESARROLLO + PROYECTOS)
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo .dev-shell,
  body.page-proyecto .project-desktop-layout{
    --menu-col-w: clamp(216px, 18.5vw, 280px);
  }

  body.page-desarrollo .dev-shell{
    --dev-sidebar-w: var(--menu-col-w) !important;
    grid-template-columns: var(--menu-col-w) minmax(0, 1fr) !important;
  }

  body.page-proyecto .project-desktop-layout{
    grid-template-columns: var(--menu-col-w) minmax(0, 1fr) minmax(320px, 390px) !important;
  }

  body.page-proyecto .project-side-menu{
    position: fixed !important;
    left: var(--padX) !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translate3d(0, -50%, 0) !important;
    width: var(--menu-col-w) !important;
    height: auto !important;
    max-height: calc(100dvh - 170px) !important;
    min-height: 0 !important;
    justify-content: flex-start !important;
    align-content: flex-start !important;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(14px, 1.7vw, 20px) 0 !important;
    border-right: 1px solid var(--line) !important;
    background: transparent !important;
    transition: none !important;
    will-change: auto !important;
    backface-visibility: hidden;
  }

  body.page-proyecto .project-side-brand{
    position: static !important;
    display: inline-flex !important;
    margin: 0 0 clamp(34px, 4.4vh, 56px) 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-nav{
    margin-top: 0 !important;
    padding-right: 14px !important;
    padding-bottom: 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-link{
    padding: 10px 2px !important;
  }
}

/* =========================
   HOTFIX V28: LOGO WIDTH MATCH (NO WEIRD WORD SPACES)
   ========================= */
body:not(.page-home) .logo-about-style,
body:not(.page-home) .page-logo,
body:not(.page-home) .project-logo,
body.page-proyecto .project-side-brand{
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 0.32rem !important;
  width: fit-content !important;
  text-decoration: none !important;
}

body:not(.page-home) .logo-about-style::after,
body:not(.page-home) .page-logo::after,
body:not(.page-home) .project-logo::after,
body.page-proyecto .project-side-brand::after{
  content: none !important;
  display: none !important;
}

body:not(.page-home) .logo-about-style .page-logo-main,
body:not(.page-home) .logo-about-style .project-side-brand-main,
body:not(.page-home) .logo-about-style .logo-main-lock,
body:not(.page-home) .page-logo.page-logo-box .page-logo-main,
body.page-proyecto .project-side-brand-main{
  display: block !important;
  font-family: var(--display) !important;
  font-weight: 700 !important;
  font-size: .92rem !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: var(--ink) !important;
  white-space: nowrap !important;
}

body:not(.page-home) .logo-about-style .page-logo-sub,
body:not(.page-home) .logo-about-style .project-side-brand-sub,
body:not(.page-home) .logo-about-style .logo-sub-lock,
body:not(.page-home) .page-logo.page-logo-box .page-logo-sub,
body.page-proyecto .project-side-brand-sub{
  display: block !important;
  font-family: var(--display) !important;
  font-weight: 500 !important;
  font-size: .62rem !important;
  letter-spacing: .18em !important;
  word-spacing: normal !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: var(--ink-soft) !important;
  opacity: .78 !important;
  white-space: nowrap !important;
  transform-origin: left center !important;
  transform: scaleX(var(--logo-sub-scale, 1)) !important;
}

/* =========================
   HOTFIX V29: MENU NO-SHIFT + IMAGE SPACING CLEAN
   ========================= */
@media (min-width: 981px){
  /* Same fixed envelope to avoid tiny jumps */
  body.page-desarrollo .dev-page,
  body.page-proyecto .project-page{
    --fixed-menu-top: clamp(92px, 10vh, 124px);
    --fixed-menu-bottom: calc(76px + env(safe-area-inset-bottom));
  }

  body.page-desarrollo .dev-sidebar{
    top: var(--fixed-menu-top) !important;
    bottom: var(--fixed-menu-bottom) !important;
    height: auto !important;
    max-height: none !important;
    transform: none !important;
    justify-content: center !important;
    align-items: stretch !important;
  }

  body.page-proyecto .project-side-menu{
    top: var(--fixed-menu-top) !important;
    bottom: var(--fixed-menu-bottom) !important;
    height: auto !important;
    max-height: none !important;
    transform: none !important;
    justify-content: center !important;
    align-items: stretch !important;
  }

  /* Keep logo above menu, stable */
  body.page-proyecto .project-side-brand{
    position: static !important;
    margin: 0 0 clamp(30px, 4vh, 52px) 0 !important;
    align-self: flex-start !important;
  }

  /* Remove click/hover movement in side menus */
  body.page-desarrollo .dev-nav-button,
  body.page-proyecto .project-side-link{
    transform: none !important;
    transition:
      color .18s ease,
      opacity .18s ease,
      background-color .18s ease,
      border-color .18s ease !important;
  }
  body.page-desarrollo .dev-nav-button:hover,
  body.page-desarrollo .dev-nav-button.is-active,
  body.page-proyecto .project-side-link:hover,
  body.page-proyecto .project-side-link.is-active{
    transform: none !important;
  }

  /* Numeric stability */
  body.page-desarrollo .dev-nav-count,
  body.page-proyecto .project-side-count{
    font-variant-numeric: tabular-nums;
    width: 2.5ch;
    text-align: right;
  }

  /* Image spacing so they don't "bite" borders/footer */
  body.page-proyecto .project-media-column{
    padding:
      clamp(22px, 2.4vw, 34px)
      clamp(22px, 2.4vw, 34px)
      clamp(28px, 3vw, 44px) !important;
  }

  body.page-proyecto .project-media-column .project-gallery{
    gap: clamp(18px, 2.2vw, 30px) !important;
    margin-bottom: clamp(28px, 3vw, 40px) !important;
  }

  body.page-proyecto .project-media-column .project-gallery-grid{
    gap: clamp(18px, 2.2vw, 30px) !important;
  }

  body.page-proyecto .project-media-column .project-shot{
    border-radius: 14px !important;
    overflow: hidden !important;
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
  }

  body.page-proyecto .project-media-column .project-shot img,
  body.page-proyecto .project-media-column .project-shot video{
    display: block !important;
  }

  body.page-proyecto .project-media-column .project-resources,
  body.page-proyecto .project-resources{
    padding-top: 18px !important;
  }
}

/* =========================
   HOTFIX V30: DESKTOP HARD LOCK (NO MENU JITTER)
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo,
  body.page-proyecto{
    overflow: hidden !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
  }

  body.page-desarrollo .dev-page,
  body.page-proyecto .project-page{
    --layout-top: clamp(90px, 9.8vh, 122px);
    --layout-bottom: calc(76px + env(safe-area-inset-bottom));
    height: 100dvh !important;
    min-height: 100dvh !important;
    padding-top: var(--layout-top) !important;
    padding-bottom: var(--layout-bottom) !important;
  }

  body.page-desarrollo .site-footer,
  body.page-proyecto .site-footer{
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 220 !important;
  }

  /* SAME left menu width envelope in both pages */
  body.page-desarrollo .dev-shell{
    --fixed-side-w: clamp(216px, 18.5vw, 280px);
    grid-template-columns: var(--fixed-side-w) minmax(0, 1fr) !important;
    height: calc(100dvh - var(--layout-top) - var(--layout-bottom)) !important;
    min-height: 0 !important;
    gap: 0 !important;
  }

  body.page-proyecto .project-desktop-layout{
    --fixed-side-w: clamp(216px, 18.5vw, 280px);
    display: grid !important;
    grid-template-columns: var(--fixed-side-w) minmax(0, 1fr) minmax(320px, 390px) !important;
    height: calc(100dvh - var(--layout-top) - var(--layout-bottom)) !important;
    min-height: 0 !important;
    border-top: 0 !important;
    background: var(--paper) !important;
  }

  body.page-desarrollo .dev-sidebar,
  body.page-proyecto .project-side-menu{
    position: fixed !important;
    left: var(--padX) !important;
    top: var(--layout-top) !important;
    bottom: var(--layout-bottom) !important;
    width: var(--fixed-side-w) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    transform: none !important;
    border-right: 1px solid var(--line) !important;
    background: transparent !important;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(14px, 1.7vw, 20px) 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    transition: none !important;
    will-change: auto !important;
    backface-visibility: hidden !important;
    z-index: 80 !important;
  }

  /* Logo fixed in flow, above nav, never jumping */
  body.page-proyecto .project-side-brand{
    position: static !important;
    margin: 0 0 clamp(30px, 4vh, 52px) 0 !important;
    align-self: flex-start !important;
    transform: none !important;
  }

  body.page-desarrollo .dev-nav,
  body.page-proyecto .project-side-nav{
    margin: 0 !important;
    padding-right: 14px !important;
    padding-bottom: 0 !important;
    transform: none !important;
  }

  /* NO movement on click/hover */
  body.page-desarrollo .dev-nav-button,
  body.page-proyecto .project-side-link{
    transform: none !important;
    transition:
      color .16s ease,
      opacity .16s ease,
      border-color .16s ease,
      background-color .16s ease !important;
  }
  body.page-desarrollo .dev-nav-button:hover,
  body.page-desarrollo .dev-nav-button.is-active,
  body.page-proyecto .project-side-link:hover,
  body.page-proyecto .project-side-link.is-active{
    transform: none !important;
  }

  body.page-desarrollo .dev-nav-count,
  body.page-proyecto .project-side-count{
    font-variant-numeric: tabular-nums !important;
    width: 2.5ch !important;
    text-align: right !important;
  }

  /* Gallery spacing: prevent images from touching lines/footer */
  body.page-proyecto .project-media-column{
    height: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    padding:
      clamp(24px, 2.6vw, 36px)
      clamp(24px, 2.6vw, 36px)
      clamp(36px, 4vw, 56px) !important;
    margin: 0 !important;
    background: var(--paper) !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }
  body.page-proyecto .project-media-column::-webkit-scrollbar{
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }

  body.page-proyecto .project-media-column .project-gallery{
    gap: clamp(20px, 2.3vw, 32px) !important;
    margin-bottom: clamp(32px, 3.6vw, 48px) !important;
  }
  body.page-proyecto .project-media-column .project-gallery-grid{
    gap: clamp(20px, 2.3vw, 32px) !important;
  }
  body.page-proyecto .project-media-column .project-shot{
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: var(--paper) !important;
  }
  body.page-proyecto .project-media-column .project-shot img,
  body.page-proyecto .project-media-column .project-shot video{
    display: block !important;
  }
}

/* =========================
   HOTFIX V31: ABSOLUTE MENU ANCHOR + SAFE GALLERY GAPS
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo .dev-sidebar,
  body.page-proyecto .project-side-menu{
    contain: layout paint;
    will-change: auto !important;
  }

  /* Desarrollo: nav absolutely centered inside fixed menu rail */
  body.page-desarrollo .dev-sidebar{
    display: block !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  body.page-desarrollo .dev-nav{
    position: absolute !important;
    left: 0 !important;
    right: 14px !important;
    top: 50% !important;
    transform: translate3d(0, -50%, 0) !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.page-desarrollo .dev-nav-sections{
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Proyectos: logo always top, nav always centered */
  body.page-proyecto .project-side-menu{
    display: block !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  body.page-proyecto .project-side-brand{
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    margin: 0 !important;
    transform: none !important;
  }
  body.page-proyecto .project-side-nav{
    position: absolute !important;
    left: 0 !important;
    right: 14px !important;
    top: 50% !important;
    transform: translate3d(0, -50%, 0) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* kill any vertical jump on active/hover */
  body.page-desarrollo .dev-nav-button,
  body.page-proyecto .project-side-link{
    transform: none !important;
    translate: none !important;
  }

  /* extra breathing room for media so cards don't touch rails/sections */
  body.page-proyecto .project-media-column{
    padding:
      clamp(28px, 2.9vw, 42px)
      clamp(30px, 3vw, 46px)
      clamp(40px, 4.2vw, 62px) !important;
  }
  body.page-proyecto .project-media-column .project-gallery{
    margin-top: clamp(6px, .8vw, 12px) !important;
    margin-bottom: clamp(38px, 4vw, 56px) !important;
    gap: clamp(22px, 2.5vw, 36px) !important;
  }
  body.page-proyecto .project-media-column .project-gallery-grid{
    gap: clamp(22px, 2.5vw, 36px) !important;
  }
  body.page-proyecto .project-media-column .project-resources,
  body.page-proyecto .project-resources{
    border-top: 1px solid var(--line) !important;
    padding-top: clamp(20px, 2.2vw, 30px) !important;
  }
}


/* =========================
   FALLBACK: KEEP MENUS VISIBLE IF JS FAILS
   ========================= */
@media (min-width: 981px){
  body.page-proyecto:not(.project-layout-ready){
    overflow: auto !important;
    height: auto !important;
    min-height: 100vh !important;
  }

  body.page-proyecto:not(.project-layout-ready) .project-header{
    display: flex !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 220 !important;
  }

  body.page-proyecto:not(.project-layout-ready) .site-footer{
    display: flex !important;
    position: static !important;
  }

  body.page-proyecto:not(.project-layout-ready) .project-page{
    padding: calc(30px + var(--padY)) var(--padX) var(--padY) !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
  }

  body.page-desarrollo .dev-sidebar{
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-desarrollo .dev-nav{
    opacity: 1 !important;
    visibility: visible !important;
  }
}


/* =========================
   HOTFIX V32: FORCE DESARROLLO MENU VISIBLE
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo .dev-shell{
    --dev-sidebar-w: clamp(216px, 18.5vw, 280px) !important;
    grid-template-columns: var(--dev-sidebar-w) minmax(0, 1fr) !important;
    gap: 0 !important;
    align-items: stretch !important;
  }

  body.page-desarrollo .dev-sidebar{
    position: fixed !important;
    left: var(--padX) !important;
    top: 50% !important;
    bottom: auto !important;
    width: var(--dev-sidebar-w) !important;
    transform: translateY(-50%) !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 220 !important;
    border-right: 1px solid var(--line) !important;
    background: transparent !important;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0 !important;
  }

  body.page-desarrollo .dev-nav{
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 14px 0 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-desarrollo .dev-nav-button{
    display: grid !important;
    grid-template-columns: 13px 1fr auto !important;
    align-items: center !important;
    color: var(--ink) !important;
    opacity: 1 !important;
  }

  body.page-desarrollo .dev-nav-count{
    opacity: .75 !important;
  }

  body.page-desarrollo .dev-content{
    grid-column: 2 / -1 !important;
    padding-left: clamp(18px, 2.1vw, 34px) !important;
  }
}

/* =========================
   HOTFIX V33: PROJECT CONTENT VISIBILITY SAFETY
   ========================= */
html.has-js body.page-proyecto .project-hero,
html.has-js body.page-proyecto .project-gallery,
html.has-js body.page-proyecto .project-resources{
  opacity: 1 !important;
  transform: none !important;
}

/* =========================
   HOTFIX V34: PROJECT MENU HARD VISIBILITY
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    display: grid !important;
  }

  body.page-proyecto .project-side-menu{
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.page-proyecto .project-side-nav{
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* =========================
   HOTFIX V35: PROJECT LEFT MENU FINAL RESTORE
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-side-menu{
    position: fixed !important;
    left: var(--padX) !important;
    top: calc(96px + env(safe-area-inset-top)) !important;
    bottom: calc(74px + env(safe-area-inset-bottom)) !important;
    width: clamp(216px, 18.5vw, 280px) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: 0 14px 0 0 !important;
    margin: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    border-right: 1px solid var(--line) !important;
    background: transparent !important;
    transform: none !important;
    z-index: 140 !important;
  }

  body.page-proyecto .project-side-brand{
    position: static !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    margin: 0 0 clamp(18px, 2.4vh, 30px) 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-nav{
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.page-proyecto .project-side-link{
    display: grid !important;
    grid-template-columns: 13px 1fr auto !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 10px 2px !important;
    font-size: .68rem !important;
    letter-spacing: .17em !important;
    color: var(--ink) !important;
    opacity: 1 !important;
    text-decoration: none !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-count{
    opacity: .75 !important;
  }
}

/* =========================
   HOTFIX V36: PROJECT MENU MATCH DESARROLLO + MEDIA SAFE GAP
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    --menu-col-w: clamp(216px, 18.5vw, 280px) !important;
    grid-template-columns: var(--menu-col-w) minmax(0, 1fr) minmax(320px, 390px) !important;
    gap: 0 !important;
    align-items: stretch !important;
  }

  body.page-proyecto .project-side-menu{
    top: calc(92px + env(safe-area-inset-top)) !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    width: var(--menu-col-w) !important;
    display: block !important;
    overflow: hidden !important;
    padding: 0 14px 0 0 !important;
  }

  body.page-proyecto .project-side-brand{
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-nav{
    position: absolute !important;
    left: 0 !important;
    right: 14px !important;
    top: 50% !important;
    transform: translate3d(0, -50%, 0) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  body.page-proyecto .project-side-link{
    transform: none !important;
    transition: color .16s ease, opacity .16s ease !important;
  }

  body.page-proyecto .project-media-column{
    grid-column: 2 !important;
    margin-left: clamp(14px, 1.4vw, 22px) !important;
    padding:
      clamp(28px, 2.8vw, 42px)
      clamp(28px, 2.8vw, 42px)
      clamp(44px, 4.2vw, 64px)
      clamp(36px, 3.2vw, 52px) !important;
    overflow-x: hidden !important;
  }

  body.page-proyecto .project-media-column .project-gallery{
    gap: clamp(18px, 2.1vw, 30px) !important;
    margin-bottom: clamp(30px, 3.2vw, 48px) !important;
  }

  body.page-proyecto .project-media-column .project-shot{
    max-width: 100% !important;
    border-radius: 14px !important;
  }
}

/* =========================
   HOTFIX V37: PROJECT MENU STABLE LIKE DESARROLLO
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    --project-menu-w: clamp(216px, 18.5vw, 280px) !important;
    grid-template-columns: var(--project-menu-w) minmax(0, 1fr) minmax(320px, 390px) !important;
    gap: 0 !important;
  }

  body.page-proyecto .project-side-menu{
    position: fixed !important;
    left: var(--padX) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: var(--project-menu-w) !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    border-right: 1px solid var(--line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 0 !important;
    z-index: 140 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-proyecto .project-side-brand{
    position: static !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    margin: 0 0 clamp(30px, 4vh, 52px) 0 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-proyecto .project-side-nav{
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
    padding-right: 14px !important;
    padding-bottom: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-proyecto .project-side-link{
    display: grid !important;
    grid-template-columns: 13px 1fr auto !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 10px 2px !important;
    font-size: .68rem !important;
    letter-spacing: .17em !important;
    text-decoration: none !important;
    transform: none !important;
    opacity: 1 !important;
  }

  body.page-proyecto .project-media-column{
    grid-column: 2 !important;
    margin-left: clamp(20px, 2vw, 30px) !important;
    padding:
      clamp(30px, 3vw, 46px)
      clamp(30px, 3vw, 46px)
      clamp(48px, 4.5vw, 70px)
      clamp(42px, 3.8vw, 62px) !important;
    overflow-x: hidden !important;
  }

  body.page-proyecto .project-media-column .project-gallery{
    gap: clamp(20px, 2.3vw, 32px) !important;
    margin-bottom: clamp(34px, 3.6vw, 52px) !important;
  }

  body.page-proyecto .project-media-column .project-shot,
  body.page-proyecto .project-media-column .project-shot img,
  body.page-proyecto .project-media-column .project-shot video{
    max-width: 100% !important;
  }
}

/* =========================
   HOTFIX V38: PROJECT LOGO TOP + MENU CENTER LOCK
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    --project-menu-w: clamp(216px, 18.5vw, 280px) !important;
    grid-template-columns: var(--project-menu-w) minmax(0, 1fr) minmax(320px, 390px) !important;
  }

  body.page-proyecto .project-side-menu{
    position: fixed !important;
    left: var(--padX) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: var(--project-menu-w) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    padding: clamp(12px, 1.6vw, 20px) clamp(16px, 1.8vw, 22px) clamp(16px, 1.8vw, 24px) 0 !important;
    border-right: 1px solid var(--line) !important;
    background: transparent !important;
    z-index: 140 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-proyecto .project-side-brand{
    position: fixed !important;
    left: var(--padX) !important;
    top: calc(22px + env(safe-area-inset-top)) !important;
    width: var(--project-menu-w) !important;
    margin: 0 !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    z-index: 141 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  body.page-proyecto .project-side-nav{
    position: static !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
    padding-right: 14px !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-proyecto .project-side-link{
    display: grid !important;
    grid-template-columns: 13px 1fr auto !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 10px 2px !important;
    font-size: .68rem !important;
    letter-spacing: .17em !important;
    transform: none !important;
    opacity: 1 !important;
  }

  body.page-proyecto .project-media-column{
    grid-column: 2 !important;
    margin-left: clamp(26px, 2.5vw, 38px) !important;
    padding:
      clamp(30px, 3vw, 46px)
      clamp(30px, 3vw, 46px)
      clamp(50px, 4.8vw, 72px)
      clamp(56px, 5vw, 82px) !important;
    overflow-x: hidden !important;
  }

  body.page-proyecto .project-media-column .project-gallery,
  body.page-proyecto .project-media-column .project-gallery-grid{
    gap: clamp(22px, 2.5vw, 36px) !important;
  }

  body.page-proyecto .project-media-column .project-shot,
  body.page-proyecto .project-media-column .project-shot img,
  body.page-proyecto .project-media-column .project-shot video{
    max-width: 100% !important;
  }
}

/* =========================
   HOTFIX V39: FIX LOGO TRUE TOP + NO MENU BITE
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-side-menu{
    top: calc(92px + env(safe-area-inset-top)) !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    left: var(--padX) !important;
    width: var(--project-menu-w, clamp(216px, 18.5vw, 280px)) !important;
    height: auto !important;
    transform: none !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    padding: 0 14px 0 0 !important;
    border-right: 1px solid var(--line) !important;
  }

  body.page-proyecto .project-side-brand{
    position: fixed !important;
    left: var(--padX) !important;
    top: calc(22px + env(safe-area-inset-top)) !important;
    width: var(--project-menu-w, clamp(216px, 18.5vw, 280px)) !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 160 !important;
  }

  body.page-proyecto .project-side-nav{
    position: static !important;
    transform: none !important;
    margin: 0 !important;
    padding-right: 14px !important;
  }

  body.page-proyecto .project-media-column{
    margin-left: clamp(34px, 3.2vw, 52px) !important;
    padding-left: clamp(66px, 5.5vw, 96px) !important;
    overflow-x: hidden !important;
  }

  body.page-proyecto .project-media-column .project-shot,
  body.page-proyecto .project-media-column .project-shot img,
  body.page-proyecto .project-media-column .project-shot video{
    max-width: 100% !important;
  }
}

/* =========================
   HOTFIX V40: PROJECT LOGO TOP + MENU TRUE CENTER
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .project-desktop-layout{
    --project-menu-w: clamp(216px, 18.5vw, 280px) !important;
    grid-template-columns: var(--project-menu-w) minmax(0, 1fr) minmax(320px, 390px) !important;
    gap: 0 !important;
  }

  body.page-proyecto .project-side-menu{
    position: fixed !important;
    left: var(--padX) !important;
    top: calc(92px + env(safe-area-inset-top)) !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    width: var(--project-menu-w) !important;
    height: auto !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 14px 0 0 !important;
    border-right: 1px solid var(--line) !important;
    background: transparent !important;
    transform: none !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 170 !important;
  }

  body.page-proyecto .project-side-brand{
    position: fixed !important;
    left: var(--padX) !important;
    top: calc(22px + env(safe-area-inset-top)) !important;
    width: var(--project-menu-w) !important;
    margin: 0 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 171 !important;
  }

  body.page-proyecto .project-side-nav{
    position: absolute !important;
    left: 0 !important;
    right: 14px !important;
    top: 50% !important;
    transform: translate3d(0, -50%, 0) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.page-proyecto .project-side-link{
    display: grid !important;
    grid-template-columns: 13px 1fr auto !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 10px 2px !important;
    font-size: .68rem !important;
    letter-spacing: .17em !important;
    transform: none !important;
    opacity: 1 !important;
  }

  body.page-proyecto .project-media-column{
    grid-column: 2 !important;
    margin-left: clamp(44px, 4.5vw, 72px) !important;
    padding-left: clamp(84px, 7vw, 128px) !important;
    padding-right: clamp(30px, 3vw, 46px) !important;
    overflow-x: hidden !important;
  }

  body.page-proyecto .project-media-column .project-shot,
  body.page-proyecto .project-media-column .project-shot img,
  body.page-proyecto .project-media-column .project-shot video{
    max-width: 100% !important;
  }
}

/* =========================
   HOTFIX V41: REMOVE GRAY LINES PROJECT
   ========================= */
@media (min-width: 981px){
  #fixedDevLikeSidebar,
  body.page-proyecto .project-side-menu{
    border-right: 0 !important;
  }

  body.page-proyecto .project-info-panel{
    border-left: 0 !important;
  }

  body.page-proyecto .project-shot,
  body.page-proyecto .project-media-column .project-shot{
    border: 0 !important;
    box-shadow: none !important;
  }
}

/* =========================
   HOTFIX V42: HIDE PROJECT SIDEBAR WHEN GLOBAL MENU OPEN
   ========================= */
body.menu-open #fixedDevLikeSidebar,
body.menu-open #fixedDevLikeLogo{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* =========================
   HOTFIX V43: REMOVE NEXT PROJECTS TOP LINE
   ========================= */
body.page-proyecto .project-next,
body.page-proyecto .project-resources,
body.page-proyecto .project-media-column .project-resources{
  border-top: 0 !important;
}

/* =========================
   HOTFIX V44: FORCE REMOVE NEXT PROJECTS DIVIDER
   ========================= */
body.page-proyecto .project-next,
body.page-proyecto .project-resources,
body.page-proyecto .project-media-column .project-resources,
body.page-proyecto .project-media-column .project-next{
  border-top: 0 !important;
  border-block-start: 0 !important;
  box-shadow: none !important;
}

body.page-proyecto .project-gallery,
body.page-proyecto .project-media-column .project-gallery,
body.page-proyecto .project-gallery-grid{
  border-bottom: 0 !important;
}

/* =========================
   HOTFIX V45: MEDIUM DESKTOP ANTI-OVERLAP
   ========================= */
@media (min-width: 981px) and (max-width: 1420px){
  body.page-proyecto .project-desktop-layout{
    grid-template-columns:
      var(--project-menu-w, clamp(216px, 18.5vw, 280px))
      minmax(0, 1fr)
      minmax(250px, 300px) !important;
  }

  body.page-proyecto .project-info-panel{
    padding: clamp(16px, 1.8vw, 22px) clamp(12px, 1.4vw, 16px) !important;
    gap: clamp(10px, 1.3vw, 16px) !important;
  }

  body.page-proyecto .project-info-panel .project-title{
    font-size: clamp(1.26rem, 2vw, 1.9rem) !important;
    letter-spacing: .08em !important;
  }

  body.page-proyecto .project-info-sign .project-sign-icon{
    width: min(100%, clamp(160px, 14vw, 220px)) !important;
  }

  body.page-proyecto .project-media-column{
    margin-left: clamp(20px, 2vw, 28px) !important;
    padding-left: clamp(34px, 3.2vw, 48px) !important;
    padding-right: clamp(20px, 2vw, 28px) !important;
  }

  body.page-proyecto .next-project-grid{
    grid-template-columns: 1fr !important;
    gap: clamp(12px, 1.5vw, 16px) !important;
  }

  body.page-proyecto .next-project-card{
    min-height: auto !important;
    padding: 12px 0 !important;
    gap: 8px !important;
  }

  body.page-proyecto .next-project-icon{
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: clamp(110px, 16vw, 156px) !important;
    margin-top: 8px !important;
    opacity: .82 !important;
  }

  body.page-proyecto .next-project-card:hover .next-project-icon{
    transform: none !important;
  }
}

/* =========================
   HOTFIX V46: NEXT PROJECTS NO OVERLAP (DESKTOP)
   ========================= */
@media (min-width: 981px){
  body.page-proyecto .next-project-card{
    min-height: clamp(220px, 24vh, 320px) !important;
    padding-bottom: clamp(92px, 9.2vw, 132px) !important;
    overflow: hidden !important;
  }

  body.page-proyecto .next-project-icon{
    top: auto !important;
    bottom: clamp(10px, 1.1vw, 18px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: clamp(120px, 12vw, 190px) !important;
    max-width: 82% !important;
  }

  body.page-proyecto .next-project-card:hover .next-project-icon{
    transform: translateX(-50%) !important;
  }
}

/* =========================
   HOTFIX V47: HOME PILLS DARK MODE CONTRAST
   ========================= */
body.dark.page-home .areas-list a{
  background: rgba(255,255,255,0.08) !important;
  color: rgba(245,242,238,0.9) !important;
  border-color: rgba(245,242,238,0.26) !important;
  box-shadow: none !important;
}

body.dark.page-home .areas-list a:hover,
body.dark.page-home .areas-list a:focus-visible,
body.dark.page-home .areas-list a.is-active{
  background: rgba(245,242,238,0.94) !important;
  color: #111111 !important;
  border-color: rgba(245,242,238,0.94) !important;
}

/* =========================
   HOTFIX V48: HOME COOL MOTION PACK
   ========================= */
@keyframes homeIconBob{
  0%, 100%{ transform: translate3d(0, 0, 0); }
  50%{ transform: translate3d(0, -7px, 0); }
}

body.page-home.home-cool-motion #iconTrack a{
  display: inline-flex;
  animation: homeIconBob 6.2s ease-in-out infinite;
  animation-delay: var(--icon-float-delay, 0ms);
}

body.page-home.home-cool-motion #iconTrack a:nth-child(2n){
  animation-duration: 7.4s;
}

body.page-home.home-cool-motion #areas .areas-list a{
  opacity: 0;
  transform: translate3d(0, 20px, 0) scale(0.96);
  filter: blur(7px);
  transition:
    opacity .58s var(--easeSoft),
    transform .58s var(--easeSoft),
    filter .58s var(--easeSoft),
    box-shadow .28s ease,
    background-color .28s ease,
    border-color .28s ease,
    color .28s ease;
  transition-delay: var(--chip-delay, 0ms);
  will-change: transform, opacity, filter;
}

body.page-home.home-cool-motion #areas.is-visible .areas-list a{
  opacity: 1;
  transform: translate3d(var(--mx, 0px), var(--my, 0px), 0) scale(1);
  filter: blur(0);
}

body.page-home.home-cool-motion .areas-list a:hover,
body.page-home.home-cool-motion .areas-list a:focus-visible{
  transform: translate3d(var(--mx, 0px), calc(var(--my, 0px) - 1px), 0) scale(1.03);
  box-shadow: 0 10px 26px rgba(0,0,0,0.16);
}

body.dark.page-home.home-cool-motion .areas-list a:hover,
body.dark.page-home.home-cool-motion .areas-list a:focus-visible{
  box-shadow: 0 12px 28px rgba(0,0,0,0.45);
}

body.page-home.home-cool-motion #equipo .team-tags span{
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  filter: blur(6px);
  transition:
    opacity .58s var(--easeSoft),
    transform .58s var(--easeSoft),
    filter .58s var(--easeSoft),
    border-color .3s ease;
  transition-delay: var(--tag-delay, 0ms);
}

body.page-home.home-cool-motion #equipo.is-visible .team-tags span{
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

@media (prefers-reduced-motion: reduce){
  body.page-home.home-cool-motion #iconTrack a{
    animation: none;
  }

  body.page-home.home-cool-motion #areas .areas-list a,
  body.page-home.home-cool-motion #equipo .team-tags span{
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
}

/* =========================
   HOTFIX V49: REMOVE STICKY HEADER BAND IN DESARROLLO
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo .dev-section-head{
    position: static !important;
    top: auto !important;
    z-index: auto !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* =========================
   HOTFIX V50: MOBILE SPACING + FOOTER/BUTTON ORDER
   (menu untouched)
   ========================= */
@media (max-width: 980px){
  .site-footer{
    align-items: center !important;
    text-align: center !important;
    gap: 10px !important;
    padding: 18px var(--padX) calc(22px + env(safe-area-inset-bottom)) !important;
  }

  .site-footer .footer-left{
    width: 100%;
    font-size: .58rem;
    letter-spacing: .16em;
    line-height: 1.5;
  }

  .site-footer .footer-right{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
  }

  .site-footer .footer-right a{
    margin-left: 0 !important;
    min-width: 2.4ch;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 4px 2px;
  }

  .final-button,
  .final-secondary,
  .contact-start,
  .contact-shuffle,
  .form-prev,
  .form-next,
  .summary-btn{
    width: min(100%, 360px) !important;
    margin-inline: auto !important;
    justify-content: center;
    text-align: center;
  }

  body.page-home .team-link{
    display: inline-flex;
    margin-inline: auto;
  }

  .final-question,
  .team-right p,
  .contact-intro,
  .form-note{
    max-width: 38ch;
    margin-inline: auto;
  }

  body.page-contacto .contact-cta,
  .form-actions,
  .summary-actions{
    align-items: center;
  }
}

@media (max-width: 680px){
  .site-footer{
    gap: 9px !important;
    padding: 16px var(--padX) calc(20px + env(safe-area-inset-bottom)) !important;
  }

  .site-footer .footer-left{
    font-size: .54rem;
    letter-spacing: .14em;
  }

  .site-footer .footer-right{
    gap: 12px;
  }

  .final-button{
    padding: .84rem 1rem !important;
    letter-spacing: .17em !important;
  }

  .final-secondary,
  .contact-start,
  .contact-shuffle,
  .form-prev,
  .form-next,
  .summary-btn{
    padding: .72rem .95rem !important;
    letter-spacing: .18em !important;
  }
}

/* =========================
   EQUIPO AESTHETIC REFRESH V2
   Keep team order, update visual style only.
   ========================= */
body.page-equipo .equipo{
  background:
    radial-gradient(860px 360px at 8% 2%, rgba(138,100,67,0.12), transparent 72%),
    radial-gradient(680px 320px at 92% 94%, rgba(138,100,67,0.09), transparent 76%),
    linear-gradient(180deg, rgba(255,255,255,0.98), rgba(250,248,245,0.98));
}
body.dark.page-equipo .equipo{
  background:
    radial-gradient(860px 360px at 8% 2%, rgba(211,178,119,0.16), transparent 72%),
    radial-gradient(680px 320px at 92% 94%, rgba(211,178,119,0.1), transparent 76%),
    linear-gradient(180deg, rgba(14,12,11,0.98), rgba(8,7,6,0.98));
}

body.page-equipo .equipo-intro{
  border: 1px solid rgba(24,20,16,0.12);
  border-radius: 22px;
  padding: clamp(16px, 2vw, 30px) clamp(16px, 2.4vw, 34px);
  background: linear-gradient(145deg, rgba(255,255,255,0.8), rgba(255,255,255,0.48));
  box-shadow: 0 16px 34px rgba(0,0,0,0.05);
}
body.dark.page-equipo .equipo-intro{
  border-color: rgba(255,255,255,0.12);
  background: linear-gradient(145deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
  box-shadow: 0 22px 42px rgba(0,0,0,0.34);
}

body.page-equipo .equipo-title{
  font-size: clamp(1.9rem, 5.1vw, 4rem);
  letter-spacing: .1em;
  line-height: .95;
}
body.page-equipo .equipo-desc{
  max-width: 64ch;
  font-size: clamp(.9rem, 1.12vw, 1.04rem);
  line-height: 1.82;
}
body.page-equipo .equipo-signature{
  padding: .6rem .96rem;
  border: 1px solid rgba(138,100,67,0.34);
  border-radius: 999px;
  background: rgba(138,100,67,0.08);
}
body.dark.page-equipo .equipo-signature{
  border-color: rgba(211,178,119,0.38);
  background: rgba(211,178,119,0.12);
}

body.page-equipo .equipo-grid{
  gap: clamp(18px, 2.5vw, 34px);
}

body.page-equipo .miembro{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(150deg, rgba(255,255,255,0.72), rgba(255,255,255,0.36)) !important;
  border: 1px solid rgba(24,20,16,0.12) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 36px rgba(0,0,0,0.06) !important;
  padding: clamp(12px, 1.4vw, 16px) !important;
  transition: transform .45s var(--easeSoft), border-color .45s var(--easeSoft), box-shadow .45s var(--easeSoft);
}
body.dark.page-equipo .miembro{
  background: linear-gradient(150deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02)) !important;
  border-color: rgba(255,255,255,0.14) !important;
  box-shadow: 0 22px 44px rgba(0,0,0,0.36) !important;
}
body.page-equipo .miembro::before{
  content: "";
  position: absolute;
  inset: -42% -8% auto;
  height: 120%;
  background: radial-gradient(closest-side, rgba(138,100,67,0.18), transparent 72%);
  opacity: 0;
  transition: opacity .45s var(--easeSoft);
  pointer-events: none;
  z-index: 0;
}
body.dark.page-equipo .miembro::before{
  background: radial-gradient(closest-side, rgba(211,178,119,0.22), transparent 72%);
}
body.page-equipo .miembro:hover{
  transform: translateY(-5px);
  border-color: rgba(138,100,67,0.38) !important;
  box-shadow: 0 26px 48px rgba(0,0,0,0.12) !important;
}
body.dark.page-equipo .miembro:hover{
  border-color: rgba(211,178,119,0.45) !important;
  box-shadow: 0 28px 52px rgba(0,0,0,0.46) !important;
}
body.page-equipo .miembro:hover::before{
  opacity: 1;
}
body.page-equipo .miembro > *{
  position: relative;
  z-index: 1;
}
body.page-equipo .miembro::after{
  background: linear-gradient(90deg, transparent, rgba(138,100,67,0.52), transparent);
  opacity: .55;
}
body.dark.page-equipo .miembro::after{
  background: linear-gradient(90deg, transparent, rgba(211,178,119,0.54), transparent);
}

body.page-equipo .miembro-media{
  border-radius: 14px;
  border: 1px solid rgba(24,20,16,0.14);
  background: rgba(0,0,0,0.04);
}
body.dark.page-equipo .miembro-media{
  border-color: rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.03);
}
body.page-equipo .miembro img{
  filter: grayscale(.16) contrast(1.06) brightness(1.03);
  transform: scale(1.01);
  transition: transform .9s var(--easeSoft), filter .9s var(--easeSoft);
}
body.dark.page-equipo .miembro img{
  filter: grayscale(.1) contrast(1.1) brightness(1.05);
}
body.page-equipo .miembro:hover img{
  transform: scale(1.055);
  filter: grayscale(0) contrast(1.06) brightness(1.04);
}

body.page-equipo .miembro-overlay{
  font-size: .56rem;
  letter-spacing: .24em;
  padding: .36rem .62rem;
  border: 1px solid rgba(255,255,255,0.42);
  border-radius: 999px;
  background: rgba(8,8,8,0.46);
  backdrop-filter: blur(2px);
}

body.page-equipo .miembro h3{
  font-size: clamp(.78rem, .98vw, .94rem);
  letter-spacing: .2em;
}
body.page-equipo .miembro span{
  font-size: .6rem;
  letter-spacing: .2em;
  opacity: .96;
}

body.page-equipo .miembro--ivan,
body.page-equipo .miembro--emmanuel{
  padding: clamp(14px, 1.6vw, 18px) !important;
}

@media (max-width: 900px){
  body.page-equipo .equipo-intro{
    border-radius: 14px;
    padding: 13px 12px 14px;
  }
  body.page-equipo .equipo-title{
    font-size: clamp(1.32rem, 8.4vw, 2.1rem);
    line-height: 1;
  }
  body.page-equipo .equipo-desc{
    font-size: .84rem;
    line-height: 1.72;
  }
  body.page-equipo .equipo-signature{
    justify-self: start;
    margin-top: 10px;
    font-size: .5rem;
    letter-spacing: .22em;
  }
  body.page-equipo .equipo-grid{
    gap: 14px;
  }
  body.page-equipo .miembro{
    border-radius: 14px !important;
    padding: 10px !important;
    transform: none !important;
  }
  body.page-equipo .miembro:hover{
    transform: none;
  }
  body.page-equipo .miembro-media{
    border-radius: 10px;
  }
  body.page-equipo .miembro h3{
    font-size: .67rem;
  }
  body.page-equipo .miembro span{
    font-size: .54rem;
  }
}

/* =========================
   EQUIPO AESTHETIC REFRESH V3 (FRAMELESS + CHAPA B/W)
   ========================= */
body.page-equipo .miembro{
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 clamp(14px, 1.6vw, 22px) !important;
  gap: 12px;
  transform: none !important;
}

body.page-equipo .miembro:hover{
  transform: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body.page-equipo .miembro::before{
  content: none !important;
}

body.page-equipo .miembro::after{
  height: 1px;
  opacity: .62;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
}

body.page-equipo .miembro-media{
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.03);
}

body.dark.page-equipo .miembro-media{
  border-color: rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.02);
}

body.page-equipo .miembro img{
  filter: grayscale(.1) contrast(1.06) brightness(1.03);
  transform: scale(1.005);
  transition: transform .8s var(--easeSoft), filter .8s var(--easeSoft);
}

body.dark.page-equipo .miembro img{
  filter: grayscale(.08) contrast(1.1) brightness(1.05);
}

body.page-equipo .miembro:hover img{
  transform: scale(1.03);
  filter: grayscale(.03) contrast(1.06) brightness(1.04);
}

/* Keep Fernanda + Emmanuel Chapa in black & white as before */
body.page-equipo .miembro--fernanda img,
body.page-equipo .miembro--chapa img{
  filter: grayscale(1) contrast(1.06) brightness(1.02) !important;
}

body.dark.page-equipo .miembro--fernanda img,
body.dark.page-equipo .miembro--chapa img{
  filter: grayscale(1) contrast(1.1) brightness(1.08) !important;
}

body.page-equipo .miembro--fernanda:hover img,
body.page-equipo .miembro--chapa:hover img{
  transform: scale(1.03);
  filter: grayscale(1) contrast(1.06) brightness(1.02) !important;
}

body.dark.page-equipo .miembro--fernanda:hover img,
body.dark.page-equipo .miembro--chapa:hover img{
  filter: grayscale(1) contrast(1.1) brightness(1.08) !important;
}

@media (max-width: 900px){
  body.page-equipo .miembro{
    border-radius: 0 !important;
    padding: 0 0 12px !important;
  }

  body.page-equipo .miembro-media{
    border-radius: 12px;
  }
}

/* =========================
   EQUIPO AESTHETIC REFRESH V4 (CLEAN MINIMAL)
   ========================= */
body.page-equipo .equipo{
  background: var(--paper);
}

body.dark.page-equipo .equipo{
  background: #0d0b0a;
}

body.page-equipo .equipo-watermark{
  opacity: .018;
}

body.dark.page-equipo .equipo-watermark{
  opacity: .03;
}

body.page-equipo .equipo-intro{
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

body.page-equipo .equipo-title{
  letter-spacing: .09em;
  line-height: .98;
}

body.page-equipo .equipo-desc{
  max-width: 60ch;
  font-size: clamp(.88rem, 1.05vw, 1rem);
  line-height: 1.78;
}

body.page-equipo .equipo-signature{
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  letter-spacing: .24em;
  opacity: .75;
}

body.page-equipo .equipo-grid{
  margin-top: clamp(24px, 3.4vw, 42px);
  gap: clamp(16px, 2vw, 24px);
}

body.page-equipo .miembro{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 clamp(10px, 1.2vw, 14px) !important;
  gap: 10px;
}

body.page-equipo .miembro::before{
  content: none !important;
}

body.page-equipo .miembro::after{
  height: 1px;
  opacity: .34;
  background: var(--line);
}

body.page-equipo .miembro-media{
  border: 0;
  border-radius: 10px;
  background: transparent;
}

body.dark.page-equipo .miembro-media{
  border: 0;
  background: transparent;
}

body.page-equipo .miembro img{
  filter: grayscale(.06) contrast(1.04) brightness(1.02);
  transform: none;
  transition: transform .65s var(--easeSoft), filter .65s var(--easeSoft);
}

body.dark.page-equipo .miembro img{
  filter: grayscale(.04) contrast(1.08) brightness(1.04);
}

body.page-equipo .miembro:hover img{
  transform: scale(1.018);
  filter: grayscale(0) contrast(1.05) brightness(1.03);
}

/* Keep Emmanuel Chapa and Fernanda in B/W */
body.page-equipo .miembro--fernanda img,
body.page-equipo .miembro--chapa img{
  filter: grayscale(1) contrast(1.06) brightness(1.02) !important;
}

body.dark.page-equipo .miembro--fernanda img,
body.dark.page-equipo .miembro--chapa img{
  filter: grayscale(1) contrast(1.1) brightness(1.08) !important;
}

body.page-equipo .miembro--fernanda:hover img,
body.page-equipo .miembro--chapa:hover img{
  transform: scale(1.018);
  filter: grayscale(1) contrast(1.06) brightness(1.02) !important;
}

body.dark.page-equipo .miembro--fernanda:hover img,
body.dark.page-equipo .miembro--chapa:hover img{
  filter: grayscale(1) contrast(1.1) brightness(1.08) !important;
}

body.page-equipo .miembro-overlay{
  font-size: .52rem;
  letter-spacing: .2em;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  text-shadow: 0 1px 4px rgba(0,0,0,.45);
  padding: 0;
}

body.page-equipo .miembro h3{
  font-size: clamp(.74rem, .92vw, .88rem);
  letter-spacing: .18em;
}

body.page-equipo .miembro span{
  font-size: .58rem;
  letter-spacing: .18em;
  opacity: .84;
}

@media (max-width: 900px){
  body.page-equipo .equipo-intro{
    padding: 0;
  }

  body.page-equipo .equipo-title{
    font-size: clamp(1.26rem, 8vw, 1.96rem);
  }

  body.page-equipo .equipo-signature{
    margin-top: 8px;
    font-size: .48rem;
    letter-spacing: .2em;
    opacity: .7;
  }

  body.page-equipo .equipo-grid{
    margin-top: 18px;
    gap: 12px;
  }

  body.page-equipo .miembro{
    padding: 0 0 10px !important;
    gap: 8px;
  }

  body.page-equipo .miembro-media{
    border-radius: 8px;
  }
}

/* =========================
   EQUIPO AESTHETIC REFRESH V5 (ULTRA CLEAN)
   ========================= */
body.page-equipo .equipo{
  background: var(--paper);
}

body.dark.page-equipo .equipo{
  background: #0c0a09;
}

body.page-equipo .equipo-watermark{
  display: none;
}

body.page-equipo .equipo-intro{
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

body.page-equipo .equipo-title{
  letter-spacing: .08em;
  line-height: 1;
}

body.page-equipo .equipo-desc{
  max-width: 56ch;
  line-height: 1.74;
  color: var(--ink-soft);
}

body.page-equipo .equipo-signature{
  display: none;
}

body.page-equipo .equipo-grid{
  margin-top: clamp(20px, 2.8vw, 34px);
  gap: clamp(14px, 1.6vw, 18px);
}

body.page-equipo .miembro{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  gap: 8px;
}

body.page-equipo .miembro::before,
body.page-equipo .miembro::after{
  content: none !important;
}

body.page-equipo .miembro-media{
  border: 0;
  border-radius: 8px;
  background: transparent;
}

body.page-equipo .miembro img{
  transform: none;
  filter: grayscale(.05) contrast(1.04) brightness(1.02);
  transition: transform .55s var(--easeSoft), filter .55s var(--easeSoft);
}

body.dark.page-equipo .miembro img{
  filter: grayscale(.03) contrast(1.08) brightness(1.04);
}

body.page-equipo .miembro:hover img{
  transform: scale(1.012);
  filter: grayscale(0) contrast(1.05) brightness(1.03);
}

/* Keep Fernanda + Emmanuel Chapa in B/W always */
body.page-equipo .miembro--fernanda img,
body.page-equipo .miembro--chapa img{
  filter: grayscale(1) contrast(1.06) brightness(1.02) !important;
}

body.dark.page-equipo .miembro--fernanda img,
body.dark.page-equipo .miembro--chapa img{
  filter: grayscale(1) contrast(1.1) brightness(1.08) !important;
}

body.page-equipo .miembro--fernanda:hover img,
body.page-equipo .miembro--chapa:hover img{
  transform: scale(1.012);
  filter: grayscale(1) contrast(1.06) brightness(1.02) !important;
}

body.dark.page-equipo .miembro--fernanda:hover img,
body.dark.page-equipo .miembro--chapa:hover img{
  filter: grayscale(1) contrast(1.1) brightness(1.08) !important;
}

body.page-equipo .miembro-overlay{
  display: none;
}

body.page-equipo .miembro h3{
  font-size: clamp(.72rem, .86vw, .82rem);
  letter-spacing: .16em;
}

body.page-equipo .miembro span{
  font-size: .54rem;
  letter-spacing: .15em;
  opacity: .78;
}

@media (max-width: 900px){
  body.page-equipo .equipo-grid{
    margin-top: 16px;
    gap: 10px;
  }

  body.page-equipo .miembro-media{
    border-radius: 7px;
  }

  body.page-equipo .miembro h3{
    font-size: .64rem;
    letter-spacing: .14em;
  }

  body.page-equipo .miembro span{
    font-size: .5rem;
    letter-spacing: .13em;
  }
}

/* =========================
   TITLE SIZE FIX V6
   - Raise project-page hover title (+40%)
   - Reduce only home initial cards title (desktop)
   ========================= */
.project-shot .shot-title{
  font-size: clamp(0.45rem, 0.70vw, 0.67rem);
}

@media (min-width: 769px){
  body.page-home .projects .project-title h2{
    font-size: clamp(0.88rem, 2.02vw, 1.99rem);
  }

  body.page-home .projects .project-title p{
    font-size: .56rem;
    letter-spacing: .32em;
  }
}

/* =========================
   TITLE + HOME LOGO TUNING V7
   ========================= */
.project-shot .shot-title{
  font-size: clamp(0.62rem, 0.96vw, 0.92rem);
}

@media (min-width: 769px){
  body.page-home .projects .project-title h2{
    font-weight: 600;
  }
}

body.page-home .site-logo{
  font-size: clamp(23px, 2.05vw, 31px);
}

/* =========================
   TITLE BALANCE V8
   ========================= */
body.page-proyecto .project-shot .shot-overlay,
body.page-proyecto .project-shot .shot-overlay.overlay-center,
body.page-proyecto .project-shot .shot-overlay.overlay-tl,
body.page-proyecto .project-shot .shot-overlay.overlay-tr,
body.page-proyecto .project-shot .shot-overlay.overlay-bl,
body.page-proyecto .project-shot .shot-overlay.overlay-br{
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

body.page-proyecto .project-shot .shot-title{
  font-size: clamp(0.86rem, 1.25vw, 1.22rem);
  letter-spacing: .14em;
  line-height: 1.2;
  font-weight: 600;
}

body.page-proyecto .project-shot .shot-sub{
  font-size: .74rem;
  letter-spacing: .26em;
  opacity: .92;
}

@media (min-width: 769px){
  body.page-home .projects .project-title h2{
    font-size: clamp(1.02rem, 2.22vw, 2.2rem);
    font-weight: 500;
    line-height: 1.04;
  }
}

/* =========================
   HOVER POSITIONS V9 (CORNERS + TOP-RIGHT ALIGN)
   ========================= */
body.page-proyecto .project-shot .shot-overlay.overlay-center{
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

body.page-proyecto .project-shot .shot-overlay.overlay-tl{
  justify-content: flex-start !important;
  align-items: flex-start !important;
  text-align: left !important;
}

body.page-proyecto .project-shot .shot-overlay.overlay-tr{
  justify-content: flex-start !important;
  align-items: flex-end !important;
  text-align: right !important;
}

body.page-proyecto .project-shot .shot-overlay.overlay-bl{
  justify-content: flex-end !important;
  align-items: flex-start !important;
  text-align: left !important;
}

body.page-proyecto .project-shot .shot-overlay.overlay-br{
  justify-content: flex-end !important;
  align-items: flex-end !important;
  text-align: right !important;
}

/* =========================
   DESARROLLO MOBILE CLEAN V10
   - Hide section sidebar on phone
   - Let project cards use full width
   ========================= */
@media (max-width: 980px){
  body.page-desarrollo .dev-page{
    padding: calc(84px + env(safe-area-inset-top)) 0 calc(26px + env(safe-area-inset-bottom)) !important;
  }

  body.page-desarrollo .dev-shell{
    --dev-sidebar-w: 0px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    align-items: start !important;
  }

  body.page-desarrollo .dev-sidebar,
  body.page-desarrollo .dev-nav,
  body.page-desarrollo .dev-nav-sections,
  body.page-desarrollo .dev-nav-button,
  body.page-desarrollo .dev-chrono{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.page-desarrollo .dev-sidebar{
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
  }

  body.page-desarrollo .dev-content{
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.page-desarrollo .dev-section{
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.page-desarrollo .dev-section-head{
    margin: 0 0 10px !important;
    padding: 0 var(--padX) 10px !important;
    border-bottom: 0 !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  body.page-desarrollo .dev-project-grid,
  body.page-desarrollo .dev-project-grid.is-icon-focus{
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 var(--padX) !important;
  }

  body.page-desarrollo .dev-project-card,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    width: 100% !important;
    min-height: clamp(176px, 48vw, 252px) !important;
    padding: 14px 14px 16px !important;
    border-radius: 14px !important;
    border: 1px solid var(--line) !important;
    background: linear-gradient(135deg, rgba(255,255,255,0.22), rgba(255,255,255,0.06)) !important;
    box-shadow: none !important;
  }

  body.dark.page-desarrollo .dev-project-card,
  body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    background: linear-gradient(135deg, rgba(255,255,255,0.055), rgba(255,255,255,0.02)) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::before,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::after{
    content: none !important;
    display: none !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
    width: clamp(92px, 24vw, 128px) !important;
    height: clamp(92px, 24vw, 128px) !important;
    top: 41% !important;
    opacity: .74 !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-name{
    font-size: .7rem !important;
    letter-spacing: .18em !important;
    line-height: 1.32 !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-meta{
    font-size: .54rem !important;
    letter-spacing: .2em !important;
  }
}

/* =========================
   CONTACT REBOOT V11 (TOTAL REDESIGN)
   ========================= */
body.page-contacto{
  --contact-reboot-bg: #efe8de;
  --contact-reboot-ink: #18120e;
  --contact-reboot-soft: rgba(24,18,14,0.72);
  --contact-reboot-line: rgba(24,18,14,0.18);
  --contact-reboot-accent-a: #9d6a35;
  --contact-reboot-accent-b: #2d6168;
  background:
    radial-gradient(900px 520px at 10% -8%, rgba(157,106,53,0.16), transparent 66%),
    radial-gradient(840px 540px at 92% 110%, rgba(45,97,104,0.12), transparent 70%),
    var(--contact-reboot-bg) !important;
}

body.dark.page-contacto{
  --contact-reboot-bg: #0f0c09;
  --contact-reboot-ink: #f1e5d8;
  --contact-reboot-soft: rgba(241,229,216,0.72);
  --contact-reboot-line: rgba(241,229,216,0.2);
  --contact-reboot-accent-a: #d3b277;
  --contact-reboot-accent-b: #8ec3cb;
  background:
    radial-gradient(900px 520px at 10% -8%, rgba(211,178,119,0.16), transparent 66%),
    radial-gradient(840px 540px at 92% 110%, rgba(142,195,203,0.12), transparent 70%),
    var(--contact-reboot-bg) !important;
}

body.page-contacto .grain{ opacity: .07; }
body.page-contacto .spotlight,
body.page-contacto .scroll-progress{ display: none !important; }

body.page-contacto .contact-reboot{
  position: relative;
  min-height: 100vh;
  padding: calc(94px + env(safe-area-inset-top)) var(--padX) calc(48px + env(safe-area-inset-bottom));
  display: grid;
  gap: clamp(22px, 3.2vw, 42px);
  color: var(--contact-reboot-ink);
}

body.page-contacto .contact-reboot-band{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  border-bottom: 1px solid var(--contact-reboot-line);
  padding-bottom: 10px;
  font-family: var(--sans);
  font-size: .57rem;
  letter-spacing: .34em;
  text-transform: uppercase;
  opacity: .78;
}

body.page-contacto .contact-reboot-band span:nth-child(2){ text-align: center; }
body.page-contacto .contact-reboot-band span:nth-child(3){ text-align: right; }

body.page-contacto .contact-reboot-hero{
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: clamp(18px, 3.2vw, 56px);
  align-items: end;
}

body.page-contacto .contact-reboot-copy{
  display: grid;
  gap: 12px;
}

body.page-contacto .contact-reboot .contact-kicker{
  font-size: .62rem;
  letter-spacing: .36em;
  text-transform: uppercase;
  color: var(--contact-reboot-accent-a);
  opacity: .9;
}

body.page-contacto .contact-reboot .contact-title{
  font-family: var(--display);
  font-size: clamp(2rem, 5.8vw, 5.3rem);
  line-height: .9;
  letter-spacing: .075em;
  text-transform: uppercase;
  max-width: 13ch;
}

body.page-contacto .contact-reboot .contact-note{
  font-family: var(--serif);
  font-size: clamp(.9rem, 1.08vw, 1.02rem);
  line-height: 1.8;
  color: var(--contact-reboot-soft);
  max-width: 44ch;
  border-left: 2px solid rgba(157,106,53,.35);
  padding-left: 12px;
}

body.dark.page-contacto .contact-reboot .contact-note{
  border-left-color: rgba(211,178,119,.45);
}

body.page-contacto .contact-reboot-aside{
  display: grid;
  gap: 14px;
}

body.page-contacto .contact-reboot-orbit-shell{
  border: 1px dashed var(--contact-reboot-line);
  border-radius: 16px;
  min-height: clamp(180px, 24vw, 300px);
  background: linear-gradient(160deg, rgba(255,255,255,0.52), rgba(255,255,255,0.14));
  overflow: hidden;
  position: relative;
}

body.dark.page-contacto .contact-reboot-orbit-shell{
  background: linear-gradient(160deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02));
}

body.page-contacto .contact-reboot-orbit{
  position: absolute;
  inset: 0;
  overflow: hidden;
}

body.page-contacto .contact-reboot-orbit.is-fading{ opacity: .55; }

body.page-contacto .contact-reboot .contact-icon{
  width: clamp(52px, 6.2vw, 102px);
  opacity: .34;
  filter: grayscale(1) contrast(1.06);
}

body.dark.page-contacto .contact-reboot .contact-icon{
  filter: grayscale(1) invert(1) brightness(1.14);
  opacity: .5;
}

body.page-contacto .contact-reboot-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 1.8vw, 20px);
}

body.page-contacto .contact-reboot .contact-card{
  display: grid;
  gap: 9px;
  padding: clamp(14px, 1.6vw, 20px);
  border: 1px solid var(--contact-reboot-line);
  border-radius: 14px;
  background: linear-gradient(150deg, rgba(255,255,255,0.8), rgba(255,255,255,0.36));
  color: var(--contact-reboot-ink);
  text-decoration: none;
  transition: transform .35s var(--easeSoft), border-color .35s var(--easeSoft), background .35s var(--easeSoft);
}

body.dark.page-contacto .contact-reboot .contact-card{
  background: linear-gradient(150deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02));
}

body.page-contacto .contact-reboot .contact-card:hover{
  transform: translateY(-4px);
  border-color: rgba(157,106,53,.45);
  background: linear-gradient(150deg, rgba(255,255,255,0.9), rgba(255,255,255,0.46));
}

body.dark.page-contacto .contact-reboot .contact-card:hover{
  border-color: rgba(211,178,119,.52);
  background: linear-gradient(150deg, rgba(255,255,255,0.12), rgba(255,255,255,0.04));
}

body.page-contacto .contact-reboot .contact-card small{
  font-size: .54rem;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--contact-reboot-accent-a);
  opacity: .9;
}

body.page-contacto .contact-reboot .contact-card strong{
  font-family: var(--display);
  font-size: clamp(.92rem, 1.3vw, 1.32rem);
  letter-spacing: .08em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.page-contacto .contact-reboot .contact-card span{
  font-size: .62rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--contact-reboot-soft);
}

body.page-contacto .contact-reboot .contact-card::after,
body.page-contacto .contact-reboot .contact-card a::after{
  content: none !important;
}

body.page-contacto .contact-reboot-flow{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(12px, 1.6vw, 20px);
}

body.page-contacto .contact-reboot-step{
  border-top: 1px solid var(--contact-reboot-line);
  padding-top: 12px;
  display: grid;
  gap: 8px;
}

body.page-contacto .contact-reboot-step > span{
  font-size: .54rem;
  letter-spacing: .3em;
  color: var(--contact-reboot-accent-b);
  text-transform: uppercase;
}

body.page-contacto .contact-reboot-step h3{
  font-family: var(--display);
  font-size: clamp(.9rem, 1.22vw, 1.14rem);
  letter-spacing: .1em;
  text-transform: uppercase;
  line-height: 1.2;
}

body.page-contacto .contact-reboot-step p{
  font-size: .82rem;
  line-height: 1.7;
  color: var(--contact-reboot-soft);
}

body.page-contacto .contact-reboot-cta{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  border-top: 1px solid var(--contact-reboot-line);
  padding-top: 14px;
}

body.page-contacto .contact-reboot .contact-start,
body.page-contacto .contact-reboot .contact-shuffle{
  margin: 0;
  min-height: 44px;
}

body.page-contacto .contact-reboot .contact-start{
  border: 1px solid #17120e;
  background: #17120e;
  color: #f7f1e8;
  letter-spacing: .28em;
  padding: .84rem 1.8rem;
}

body.page-contacto .contact-reboot .contact-start:hover{
  background: transparent;
  color: #17120e;
  border-color: #17120e;
}

body.dark.page-contacto .contact-reboot .contact-start{
  border-color: #f1e5d8;
  background: #f1e5d8;
  color: #110d09;
}

body.dark.page-contacto .contact-reboot .contact-start:hover{
  background: transparent;
  color: #f1e5d8;
  border-color: #f1e5d8;
}

body.page-contacto .contact-reboot .contact-shuffle{
  border: 1px solid var(--contact-reboot-line);
  background: transparent;
  color: var(--contact-reboot-soft);
  letter-spacing: .22em;
  padding: .84rem 1.2rem;
}

body.page-contacto .contact-reboot .contact-shuffle:hover{
  border-color: rgba(157,106,53,.44);
  color: var(--contact-reboot-ink);
}

@media (max-width: 980px){
  body.page-contacto .contact-reboot{
    padding: calc(84px + env(safe-area-inset-top)) var(--padX) calc(32px + env(safe-area-inset-bottom));
    gap: 18px;
  }

  body.page-contacto .contact-reboot-band{
    grid-template-columns: 1fr;
    gap: 6px;
    font-size: .5rem;
    letter-spacing: .24em;
  }

  body.page-contacto .contact-reboot-band span:nth-child(2),
  body.page-contacto .contact-reboot-band span:nth-child(3){
    text-align: left;
  }

  body.page-contacto .contact-reboot-hero{
    grid-template-columns: 1fr;
    gap: 12px;
  }

  body.page-contacto .contact-reboot .contact-title{
    font-size: clamp(1.34rem, 10.6vw, 2.36rem);
    line-height: .96;
    max-width: none;
  }

  body.page-contacto .contact-reboot .contact-note{
    font-size: .82rem;
    line-height: 1.68;
    max-width: none;
  }

  body.page-contacto .contact-reboot-orbit-shell{
    min-height: 150px;
    border-radius: 12px;
  }

  body.page-contacto .contact-reboot-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body.page-contacto .contact-reboot .contact-card{
    border-radius: 12px;
    padding: 12px;
  }

  body.page-contacto .contact-reboot .contact-card strong{
    font-size: clamp(.84rem, 5vw, 1.06rem);
  }

  body.page-contacto .contact-reboot-flow{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body.page-contacto .contact-reboot-step p{
    font-size: .78rem;
  }

  body.page-contacto .contact-reboot-cta{
    align-items: stretch;
    gap: 10px;
  }

  body.page-contacto .contact-reboot .contact-start,
  body.page-contacto .contact-reboot .contact-shuffle{
    width: 100%;
    justify-content: center;
  }
}

/* =========================
   CONTACT MONO REFERENCE V12
   ========================= */
body.page-contacto{
  --cm-bg: #f7f7f7;
  --cm-ink: #0b0b0b;
  --cm-soft: rgba(11,11,11,0.78);
  --cm-line: rgba(11,11,11,0.22);
  background: var(--cm-bg) !important;
  color: var(--cm-ink) !important;
}

body.dark.page-contacto{
  --cm-bg: #070707;
  --cm-ink: #f5f5f5;
  --cm-soft: rgba(245,245,245,0.78);
  --cm-line: rgba(245,245,245,0.24);
  background: var(--cm-bg) !important;
  color: var(--cm-ink) !important;
}

body.page-contacto .grain,
body.page-contacto .spotlight,
body.page-contacto .scroll-progress{
  display: none !important;
}

body.page-contacto .page-logo.page-logo-box{
  top: calc(24px + env(safe-area-inset-top)) !important;
  left: var(--padX) !important;
  opacity: 1 !important;
  filter: none !important;
}

body.page-contacto .page-logo.page-logo-box .page-logo-main{
  font-size: clamp(.9rem, 1vw, 1.08rem) !important;
  letter-spacing: .30em !important;
  color: var(--cm-ink) !important;
}

body.page-contacto .page-logo.page-logo-box .page-logo-sub{
  display: none !important;
}

body.page-contacto .menu-btn,
body.page-contacto .menu-btn.menu-ink-dark,
body.page-contacto .menu-btn.menu-ink-light{
  width: 86px !important;
  height: 24px !important;
  top: calc(24px + env(safe-area-inset-top)) !important;
  right: var(--padX) !important;
  color: var(--cm-ink) !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
}

body.page-contacto .menu-btn::before{
  content: "MENU";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-52%);
  font-family: var(--sans);
  font-size: .54rem;
  letter-spacing: .18em;
  color: var(--cm-ink);
}

body.page-contacto .menu-btn span{
  width: 34px !important;
  height: 2px;
  background: currentColor;
}

body.page-contacto .menu-btn span:nth-child(2){
  display: none;
}

body.page-contacto .menu-btn.open span:nth-child(1){
  transform: translateY(9px) rotate(45deg);
}

body.page-contacto .menu-btn.open span:nth-child(3){
  transform: translateY(-9px) rotate(-45deg);
}

body.page-contacto .contact-mono{
  min-height: 100vh;
  padding: calc(112px + env(safe-area-inset-top)) var(--padX) calc(46px + env(safe-area-inset-bottom));
}

body.page-contacto .contact-mono-shell{
  position: relative;
  border-top: 1px solid var(--cm-line);
  padding-top: clamp(24px, 2.6vw, 38px);
}

body.page-contacto .contact-mono .contact-title{
  font-family: var(--display);
  font-size: clamp(3rem, 7vw, 6.6rem);
  line-height: .9;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--cm-ink);
  margin: 0;
}

body.page-contacto .contact-mono-layout{
  margin-top: clamp(16px, 2vw, 26px);
  display: grid;
  grid-template-columns: minmax(240px, .9fr) minmax(260px, .9fr) minmax(320px, 1.2fr);
  gap: clamp(18px, 2.2vw, 34px);
  align-items: start;
}

body.page-contacto .contact-mono-intro{
  margin: 0;
  max-width: 28ch;
  font-family: var(--serif);
  font-size: clamp(.98rem, 1.12vw, 1.12rem);
  line-height: 1.46;
  letter-spacing: .01em;
  color: var(--cm-soft);
  text-transform: uppercase;
}

body.page-contacto .contact-mono-info{
  display: grid;
  gap: clamp(18px, 2vw, 26px);
  align-content: start;
  padding-top: 4px;
}

body.page-contacto .contact-mono-block{
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: grid;
  gap: 8px;
}

body.page-contacto .contact-mono .contact-kicker{
  margin: 0;
  font-family: var(--display);
  font-size: .88rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--cm-soft);
}

body.page-contacto .contact-mono-link{
  font-family: var(--display);
  font-size: clamp(1.02rem, 1.34vw, 1.4rem);
  letter-spacing: .03em;
  line-height: 1.22;
  color: var(--cm-ink);
  text-decoration: none;
  text-transform: uppercase;
  transition: opacity .22s ease;
}

body.page-contacto .contact-mono-link:hover{
  opacity: .68;
}

body.page-contacto .contact-mono-sign-wrap{
  margin: 0;
  min-height: clamp(260px, 32vw, 470px);
  position: relative;
  overflow: hidden;
}

body.page-contacto .contact-mono-sign{
  position: absolute;
  right: -8%;
  bottom: -10%;
  width: min(120%, 760px);
  height: auto;
  display: block;
  filter: grayscale(1);
  opacity: .95;
}

body.dark.page-contacto .contact-mono-sign{
  filter: invert(1) grayscale(1) brightness(1.24);
}

body.page-contacto .contact-mono-cta{
  margin-top: clamp(12px, 2vw, 26px);
}

body.page-contacto .contact-mono .contact-start{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: .82rem 1.65rem;
  border: 1px solid var(--cm-ink);
  background: transparent;
  color: var(--cm-ink);
  font-family: var(--sans);
  font-size: .58rem;
  letter-spacing: .24em;
  text-transform: uppercase;
}

body.page-contacto .contact-mono .contact-start:hover{
  background: var(--cm-ink);
  color: var(--cm-bg);
}

body.page-contacto .contact-mono .contact-card::after,
body.page-contacto .contact-mono .contact-card a::after{
  content: none !important;
}

@media (max-width: 1100px){
  body.page-contacto .contact-mono-layout{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  body.page-contacto .contact-mono-sign-wrap{
    grid-column: 1 / -1;
    min-height: clamp(220px, 42vw, 330px);
  }

  body.page-contacto .contact-mono-sign{
    right: -4%;
    width: min(100%, 680px);
  }
}

@media (max-width: 780px){
  body.page-contacto .menu-btn{
    width: 74px !important;
  }

  body.page-contacto .menu-btn::before{
    font-size: .5rem;
    letter-spacing: .15em;
  }

  body.page-contacto .menu-btn span{
    width: 28px !important;
  }

  body.page-contacto .contact-mono{
    padding: calc(96px + env(safe-area-inset-top)) var(--padX) calc(30px + env(safe-area-inset-bottom));
  }

  body.page-contacto .contact-mono-shell{
    padding-top: 18px;
  }

  body.page-contacto .contact-mono .contact-title{
    font-size: clamp(1.96rem, 14vw, 3.3rem);
    letter-spacing: .02em;
  }

  body.page-contacto .contact-mono-layout{
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 12px;
  }

  body.page-contacto .contact-mono-intro{
    max-width: none;
    font-size: .9rem;
    line-height: 1.44;
  }

  body.page-contacto .contact-mono .contact-kicker{
    font-size: .78rem;
  }

  body.page-contacto .contact-mono-link{
    font-size: clamp(.92rem, 5.6vw, 1.08rem);
    line-height: 1.24;
  }

  body.page-contacto .contact-mono-sign-wrap{
    min-height: 180px;
  }

  body.page-contacto .contact-mono-sign{
    right: -6%;
    width: min(112%, 520px);
  }

  body.page-contacto .contact-mono .contact-start{
    width: 100%;
  }
}

/* ========================================
   CONTACT MONO REFERENCE V13 (MATCH SHOT)
======================================== */
body.page-contacto{
  --cm-bg: #f2f2f0;
  --cm-ink: #0b0b0b;
  --cm-soft: rgba(11, 11, 11, .72);
  --cm-line: rgba(11, 11, 11, .14);
  --cm-logo: rgba(11, 11, 11, .88);
  background: var(--cm-bg) !important;
  color: var(--cm-ink) !important;
}

body.dark.page-contacto{
  --cm-bg: #040404;
  --cm-ink: #f3f3f1;
  --cm-soft: rgba(243, 243, 241, .76);
  --cm-line: rgba(243, 243, 241, .18);
  --cm-logo: rgba(243, 243, 241, .94);
  background: var(--cm-bg) !important;
  color: var(--cm-ink) !important;
}

body.page-contacto .grain,
body.page-contacto .spotlight,
body.page-contacto .scroll-progress,
body.page-contacto .page-deco{
  display: none !important;
}

body.page-contacto .page-logo.page-logo-box{
  top: calc(24px + env(safe-area-inset-top)) !important;
  left: var(--padX) !important;
  gap: 0 !important;
  color: var(--cm-logo) !important;
}

body.page-contacto .page-logo.page-logo-box .page-logo-main{
  font-family: var(--display) !important;
  font-size: clamp(1.26rem, 1.5vw, 1.64rem) !important;
  font-weight: 500 !important;
  letter-spacing: .3em !important;
  color: var(--cm-logo) !important;
}

body.page-contacto .page-logo.page-logo-box .page-logo-sub{
  display: none !important;
}

body.page-contacto .menu-btn,
body.page-contacto .menu-btn.menu-ink-dark,
body.page-contacto .menu-btn.menu-ink-light{
  width: 92px !important;
  height: 26px !important;
  top: calc(24px + env(safe-area-inset-top)) !important;
  right: var(--padX) !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0 !important;
  color: var(--cm-ink) !important;
}

body.page-contacto .menu-btn::before{
  content: "MENU";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--sans);
  font-size: .56rem;
  font-weight: 500;
  letter-spacing: .13em;
  color: var(--cm-ink);
}

body.page-contacto .menu-btn span{
  width: 36px !important;
  height: 1.6px !important;
  border-radius: 2px;
  background: currentColor !important;
}

body.page-contacto .menu-btn span:nth-child(2){
  display: none !important;
}

body.page-contacto .menu-btn.open span:nth-child(1){
  transform: translateY(8px) rotate(45deg) !important;
}

body.page-contacto .menu-btn.open span:nth-child(3){
  transform: translateY(-8px) rotate(-45deg) !important;
}

body.page-contacto .contact-mono{
  min-height: 100vh;
  padding: calc(112px + env(safe-area-inset-top)) var(--padX) calc(60px + env(safe-area-inset-bottom));
}

body.page-contacto .contact-mono-shell{
  position: relative;
  width: min(1520px, 100%);
  margin: 0 auto;
  border-top: 1px solid var(--cm-line);
  padding-top: clamp(26px, 2.8vw, 42px);
}

body.page-contacto .contact-mono .contact-title{
  margin: 0;
  font-family: var(--sans);
  font-size: clamp(3.4rem, 9.6vw, 9.4rem);
  font-weight: 700;
  line-height: .84;
  letter-spacing: -.02em;
  color: var(--cm-ink);
  text-transform: uppercase;
}

body.page-contacto .contact-mono-layout{
  margin-top: clamp(18px, 2.2vw, 30px);
  display: grid;
  grid-template-columns: minmax(230px, .86fr) minmax(300px, .95fr) minmax(390px, 1.36fr);
  gap: clamp(20px, 2.2vw, 40px);
  align-items: start;
}

body.page-contacto .contact-mono-intro{
  margin: 0;
  max-width: 24ch;
  font-family: var(--display);
  font-size: clamp(1.06rem, 1.15vw, 1.16rem);
  line-height: 1.34;
  letter-spacing: .01em;
  text-transform: uppercase;
  color: var(--cm-soft);
}

body.page-contacto .contact-mono-info{
  display: grid;
  gap: clamp(28px, 3vw, 44px);
  align-content: start;
  padding-top: 4px;
}

body.page-contacto .contact-mono-block{
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: grid;
  gap: 8px;
}

body.page-contacto .contact-mono .contact-kicker{
  margin: 0;
  font-family: var(--display);
  font-size: .92rem;
  font-weight: 500;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--cm-soft);
}

body.page-contacto .contact-mono-link{
  font-family: var(--display);
  font-size: clamp(1.2rem, 1.45vw, 1.58rem);
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: .018em;
  color: var(--cm-ink);
  text-decoration: none;
  text-transform: uppercase;
  transition: opacity .2s ease;
}

body.page-contacto .contact-mono-link:hover{
  opacity: .66;
}

body.page-contacto .contact-mono-sign-wrap{
  margin: 0;
  min-height: clamp(300px, 35vw, 520px);
  overflow: hidden;
  position: relative;
}

body.page-contacto .contact-mono-sign{
  position: absolute;
  right: -12%;
  bottom: -11%;
  width: min(132%, 900px);
  height: auto;
  display: block;
  filter: grayscale(1) contrast(1.1);
  opacity: .96;
}

body.dark.page-contacto .contact-mono-sign{
  filter: invert(1) grayscale(1) brightness(1.16) contrast(1.08);
}

body.page-contacto .contact-mono-cta{
  margin-top: clamp(18px, 2.4vw, 32px);
  display: flex;
  justify-content: flex-start;
}

body.page-contacto .contact-mono .contact-start{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: .78rem 1.66rem;
  border: 1px solid var(--cm-ink);
  border-radius: 999px;
  background: transparent;
  color: var(--cm-ink);
  font-family: var(--sans);
  font-size: .58rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background .22s ease, color .22s ease, transform .22s ease;
}

body.page-contacto .contact-mono .contact-start:hover{
  background: var(--cm-ink);
  color: var(--cm-bg);
  transform: translateY(-1px);
}

body.page-contacto .contact-mono .contact-card::after,
body.page-contacto .contact-mono .contact-card a::after{
  content: none !important;
}

@media (max-width: 1150px){
  body.page-contacto .contact-mono-layout{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  body.page-contacto .contact-mono-sign-wrap{
    grid-column: 1 / -1;
    min-height: clamp(240px, 44vw, 360px);
  }

  body.page-contacto .contact-mono-sign{
    right: -6%;
    bottom: -14%;
    width: min(110%, 760px);
  }
}

@media (max-width: 780px){
  body.page-contacto .menu-btn{
    width: 78px !important;
  }

  body.page-contacto .menu-btn::before{
    font-size: .5rem;
    letter-spacing: .12em;
  }

  body.page-contacto .menu-btn span{
    width: 30px !important;
  }

  body.page-contacto .contact-mono{
    padding: calc(94px + env(safe-area-inset-top)) var(--padX) calc(34px + env(safe-area-inset-bottom));
  }

  body.page-contacto .contact-mono-shell{
    border-top: 1px solid var(--cm-line);
    padding-top: 18px;
  }

  body.page-contacto .contact-mono .contact-title{
    font-size: clamp(2.52rem, 15vw, 4.22rem);
    line-height: .9;
  }

  body.page-contacto .contact-mono-layout{
    margin-top: 12px;
    grid-template-columns: 1fr;
    gap: 16px;
  }

  body.page-contacto .contact-mono-intro{
    max-width: none;
    font-size: .94rem;
    line-height: 1.4;
  }

  body.page-contacto .contact-mono .contact-kicker{
    font-size: .78rem;
  }

  body.page-contacto .contact-mono-link{
    font-size: clamp(1rem, 6vw, 1.2rem);
  }

  body.page-contacto .contact-mono-sign-wrap{
    min-height: 190px;
  }

  body.page-contacto .contact-mono-sign{
    right: -10%;
    bottom: -16%;
    width: min(128%, 560px);
  }

  body.page-contacto .contact-mono .contact-start{
    width: 100%;
  }
}

/* ========================================
   CONTACT MONO REFERENCE V14 (WHITE + FIT)
======================================== */
body.page-contacto,
body.dark.page-contacto{
  --cm-bg: #ffffff;
  --cm-ink: #000000;
  --cm-soft: rgba(0, 0, 0, .64);
  --cm-line: rgba(0, 0, 0, .16);
  --cm-logo: rgba(0, 0, 0, .9);
  background: #ffffff !important;
  color: #000000 !important;
}

body.page-contacto .site-footer,
body.dark.page-contacto .site-footer{
  background: #ffffff !important;
  border-top: 1px solid var(--cm-line) !important;
  color: #000000 !important;
}

body.page-contacto .site-footer a,
body.dark.page-contacto .site-footer a{
  color: #000000 !important;
}

body.page-contacto .contact-mono .contact-title{
  font-family: var(--display) !important;
  font-size: clamp(2.7rem, 6.9vw, 6.2rem) !important;
  font-weight: 500 !important;
  letter-spacing: -.008em !important;
  line-height: .9 !important;
}

body.page-contacto .contact-mono-layout{
  grid-template-columns: minmax(220px, .82fr) minmax(280px, .9fr) minmax(360px, 1.2fr) !important;
}

body.page-contacto .contact-mono-sign-wrap{
  min-height: clamp(280px, 32vw, 450px) !important;
  overflow: visible !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
}

body.page-contacto .contact-mono-sign,
body.dark.page-contacto .contact-mono-sign{
  position: relative !important;
  right: auto !important;
  bottom: auto !important;
  width: min(100%, 620px) !important;
  max-width: 100% !important;
  height: auto !important;
  filter: none !important;
  opacity: 1 !important;
}

@media (max-width: 1150px){
  body.page-contacto .contact-mono-layout{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  body.page-contacto .contact-mono-sign-wrap{
    grid-column: 1 / -1;
    min-height: clamp(220px, 40vw, 340px) !important;
  }

  body.page-contacto .contact-mono-sign{
    width: min(92%, 560px) !important;
  }
}

@media (max-width: 780px){
  body.page-contacto .contact-mono .contact-title{
    font-size: clamp(2.16rem, 11.8vw, 3.5rem) !important;
    font-weight: 500 !important;
  }

  body.page-contacto .contact-mono-sign-wrap{
    min-height: 190px !important;
  }

  body.page-contacto .contact-mono-sign{
    width: min(100%, 430px) !important;
  }
}

/* CONTACT MONO V15: INTRO COPY MUCH SMALLER */
body.page-contacto .contact-mono-intro{
  font-size: clamp(.76rem, .78vw, .84rem) !important;
  line-height: 1.28 !important;
  max-width: 22ch !important;
  letter-spacing: .002em !important;
}

@media (max-width: 780px){
  body.page-contacto .contact-mono-intro{
    font-size: .74rem !important;
    line-height: 1.26 !important;
    max-width: 20ch !important;
  }
}

/* ========================================
   CONTACT MONO V16 (CLEAN RESET + ORIGINAL MENU)
======================================== */
body.page-contacto,
body.dark.page-contacto{
  --cm-bg: #ffffff;
  --cm-ink: #000000;
  --cm-soft: rgba(0, 0, 0, .66);
  --cm-line: rgba(0, 0, 0, .14);
  background: #ffffff !important;
  color: #000000 !important;
}

body.page-contacto .grain,
body.page-contacto .spotlight,
body.page-contacto .scroll-progress,
body.page-contacto .page-deco{
  display: none !important;
}

/* restore original site menu button style */
body.page-contacto .menu-btn::before{
  content: none !important;
}

body.page-contacto .menu-btn,
body.page-contacto .menu-btn.menu-ink-dark,
body.page-contacto .menu-btn.menu-ink-light{
  top: calc(22px + env(safe-area-inset-top)) !important;
  right: calc(var(--padX) - 6px) !important;
  width: 36px !important;
  height: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  color: #000 !important;
}

body.page-contacto.menu-open .menu-btn,
body.dark.page-contacto.menu-open .menu-btn{
  color: #f5f2ee !important;
}

body.page-contacto .menu-btn span{
  width: auto !important;
  height: 2px !important;
  border-radius: 0 !important;
  background: currentColor !important;
}

body.page-contacto .menu-btn span:nth-child(2){
  display: block !important;
}

body.page-contacto .menu-btn.open span:nth-child(1){
  transform: translateY(13px) rotate(45deg) !important;
}

body.page-contacto .menu-btn.open span:nth-child(2){
  opacity: 0 !important;
}

body.page-contacto .menu-btn.open span:nth-child(3){
  transform: translateY(-13px) rotate(-45deg) !important;
}

body.page-contacto .page-logo.page-logo-box{
  top: calc(24px + env(safe-area-inset-top)) !important;
  color: #000 !important;
}

body.page-contacto .page-logo.page-logo-box .page-logo-main{
  font-size: clamp(1.12rem, 1.36vw, 1.5rem) !important;
  font-weight: 500 !important;
  letter-spacing: .28em !important;
}

body.page-contacto .page-logo.page-logo-box .page-logo-sub{
  display: none !important;
}

/* cleaner and shorter composition so footer is visible */
body.page-contacto .contact-mono{
  min-height: 0 !important;
  padding: calc(88px + env(safe-area-inset-top)) var(--padX) 12px !important;
}

body.page-contacto .contact-mono-shell{
  width: min(1420px, 100%);
  margin: 0 auto;
  border-top: 1px solid var(--cm-line);
  padding-top: clamp(14px, 1.7vw, 22px) !important;
}

body.page-contacto .contact-mono .contact-title{
  margin: 0;
  font-family: var(--display) !important;
  font-size: clamp(2.5rem, 5.2vw, 4.9rem) !important;
  font-weight: 500 !important;
  letter-spacing: -.01em !important;
  line-height: .9 !important;
  text-transform: uppercase;
}

body.page-contacto .contact-mono-layout{
  margin-top: clamp(8px, 1.2vw, 14px) !important;
  display: grid;
  grid-template-columns: minmax(220px, .82fr) minmax(280px, .94fr) minmax(320px, 1.06fr) !important;
  gap: clamp(14px, 1.7vw, 24px) !important;
  align-items: start;
}

body.page-contacto .contact-mono-intro{
  margin: 0;
  max-width: 26ch !important;
  font-size: clamp(.88rem, .9vw, .98rem) !important;
  line-height: 1.3 !important;
  letter-spacing: .01em !important;
  color: var(--cm-soft) !important;
}

body.page-contacto .contact-mono-info{
  gap: clamp(16px, 1.6vw, 24px) !important;
}

body.page-contacto .contact-mono .contact-kicker{
  font-size: .82rem !important;
  letter-spacing: .085em !important;
  color: var(--cm-soft) !important;
}

body.page-contacto .contact-mono-link{
  font-size: clamp(1rem, 1.05vw, 1.14rem) !important;
  line-height: 1.2 !important;
  letter-spacing: .035em !important;
}

body.page-contacto .contact-mono-sign-wrap{
  min-height: clamp(200px, 24vw, 320px) !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  overflow: visible !important;
}

body.page-contacto .contact-mono-sign,
body.dark.page-contacto .contact-mono-sign{
  position: relative !important;
  right: auto !important;
  bottom: auto !important;
  width: min(100%, 460px) !important;
  height: auto !important;
  max-width: 100% !important;
  filter: none !important;
  opacity: 1 !important;
}

body.page-contacto .contact-mono-cta{
  margin-top: 10px !important;
}

body.page-contacto .contact-mono .contact-start{
  min-height: 40px !important;
  padding: .66rem 1.34rem !important;
  font-size: .54rem !important;
  letter-spacing: .2em !important;
}

body.page-contacto .site-footer,
body.dark.page-contacto .site-footer{
  margin-top: 0 !important;
  background: #fff !important;
  border-top: 1px solid var(--cm-line) !important;
  color: #000 !important;
  padding: 1rem var(--padX) calc(1rem + env(safe-area-inset-bottom)) !important;
}

body.page-contacto .site-footer a,
body.dark.page-contacto .site-footer a{
  color: #000 !important;
}

@media (min-width: 769px){
  body.page-contacto .menu-btn,
  body.page-contacto .menu-btn.menu-ink-dark,
  body.page-contacto .menu-btn.menu-ink-light{
    top: calc(18px + env(safe-area-inset-top)) !important;
    right: calc(var(--padX) - 2px) !important;
    width: 30px !important;
    height: 22px !important;
  }

  body.page-contacto .menu-btn span{
    height: 1.5px !important;
  }

  body.page-contacto .menu-btn.open span:nth-child(1){
    transform: translateY(10.25px) rotate(45deg) !important;
  }

  body.page-contacto .menu-btn.open span:nth-child(3){
    transform: translateY(-10.25px) rotate(-45deg) !important;
  }
}

@media (max-width: 1150px){
  body.page-contacto .contact-mono-layout{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  body.page-contacto .contact-mono-sign-wrap{
    grid-column: 1 / -1;
    min-height: clamp(180px, 30vw, 260px) !important;
  }

  body.page-contacto .contact-mono-sign{
    width: min(88%, 420px) !important;
  }
}

@media (max-width: 780px){
  body.page-contacto .contact-mono{
    padding: calc(84px + env(safe-area-inset-top)) var(--padX) 8px !important;
  }

  body.page-contacto .contact-mono .contact-title{
    font-size: clamp(2rem, 10vw, 3.3rem) !important;
  }

  body.page-contacto .contact-mono-layout{
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body.page-contacto .contact-mono-intro{
    font-size: .84rem !important;
    max-width: 28ch !important;
  }

  body.page-contacto .contact-mono .contact-kicker{
    font-size: .75rem !important;
  }

  body.page-contacto .contact-mono-link{
    font-size: .98rem !important;
  }

  body.page-contacto .contact-mono-sign-wrap{
    min-height: 160px !important;
  }

  body.page-contacto .contact-mono-sign{
    width: min(100%, 360px) !important;
  }

  body.page-contacto .contact-mono .contact-start{
    width: 100%;
  }
}

/* ========================================
   CONTACT MONO V17 (REMOVE GIMMICK ANIMATIONS)
======================================== */
body.page-contacto .cursor-dot,
body.page-contacto.cursor-dot-active .cursor-dot,
body.dark.page-contacto .cursor-dot,
body.dark.page-contacto.cursor-dot-active .cursor-dot{
  display: none !important;
  opacity: 0 !important;
}

body.page-contacto .contact-mono,
body.page-contacto .contact-mono *{
  animation: none !important;
  transition: none !important;
}

body.page-contacto .contact-mono a::before,
body.page-contacto .contact-mono a::after,
body.page-contacto .contact-mono-link::before,
body.page-contacto .contact-mono-link::after,
body.page-contacto .contact-card a::before,
body.page-contacto .contact-card a::after{
  content: none !important;
  display: none !important;
}

body.page-contacto .contact-mono-link,
body.page-contacto .contact-card a,
body.page-contacto .contact-mono .contact-start{
  transform: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

body.page-contacto .contact-mono-link:hover,
body.page-contacto .contact-card a:hover,
body.page-contacto .contact-mono .contact-start:hover,
body.page-contacto .contact-mono-link:focus-visible,
body.page-contacto .contact-card a:focus-visible,
body.page-contacto .contact-mono .contact-start:focus-visible{
  transform: none !important;
  opacity: 1 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  outline: none !important;
}

body.page-contacto .contact-mono .contact-start{
  border-radius: 999px !important;
}

body.page-contacto .contact-mono ::selection{
  background: rgba(0,0,0,.10);
  color: #000;
}

/* =========================
   HOTFIX V49: NEXT PROJECT TITLE BIGGER (MOBILE/TABLET)
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .next-project-title{
    font-size: clamp(1.8rem, 10vw, 3.1rem) !important;
    letter-spacing: .075em !important;
    line-height: .94 !important;
    margin: 2px 0 2px !important;
  }
}

/* =========================
   HOTFIX V48: CLIENT REVIEW POLISH
   ========================= */

/* Home cards: remove harsh slide-style animation */
@media (min-width: 769px){
  body.page-home .project.fade{
    animation: none !important;
  }

  body.page-home .projects.projects-stack .project.stack-enter .project-media,
  body.page-home .projects.projects-stack .project.stack-exit .project-media,
  body.page-home .projects.projects-stack .project.stack-enter .project-title h2 span,
  body.page-home .projects.projects-stack .project.stack-enter .project-title p,
  body.page-home .projects.projects-stack .project.title-animate .project-title h2 span,
  body.page-home .projects.projects-stack .project.title-animate .project-title p{
    animation: none !important;
  }

  body.page-home .projects.projects-stack .project{
    transition: transform .3s ease-out, opacity .3s ease-out !important;
  }

  body.page-home .projects.projects-stack .project .project-media{
    transition: transform .38s var(--easeSoft), filter .38s var(--easeSoft) !important;
  }

  body.page-home .projects.projects-stack .project.stack-next .project-media{
    filter: saturate(.94) contrast(.97) brightness(.84) !important;
  }

  body.page-home .projects.projects-stack .project.stack-next .project-title{
    opacity: .6 !important;
    filter: none !important;
  }
}

/* Contact: cleaner CTA and no weird shadows */
body.page-contacto .contact-action-btn,
body.page-contacto .contact-mono .contact-start{
  box-shadow: none !important;
  filter: none !important;
}

/* Project page tablet: align icon higher + clean next-project cards */
@media (min-width: 981px) and (max-width: 1280px){
  body.page-proyecto .project-info-panel{
    justify-content: flex-start !important;
    gap: clamp(8px, 1.2vw, 14px) !important;
  }

  body.page-proyecto .project-info-sign{
    margin-top: 0 !important;
    padding-top: 0 !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
  }

  body.page-proyecto .project-info-sign .project-sign-icon{
    width: clamp(170px, 22vw, 230px) !important;
    opacity: .9 !important;
  }

  body.page-proyecto .next-project-grid{
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body.page-proyecto .next-project-card{
    min-height: 0 !important;
    border-bottom: 1px solid var(--line) !important;
    padding: 10px 0 8px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "tag icon"
      "title icon"
      "meta icon" !important;
    gap: 6px 14px !important;
    align-items: start !important;
  }

  body.page-proyecto .next-project-tag{ grid-area: tag !important; }
  body.page-proyecto .next-project-title{
    grid-area: title !important;
    font-size: clamp(.96rem, 1.45vw, 1.18rem) !important;
    line-height: 1.2 !important;
  }
  body.page-proyecto .next-project-meta{ grid-area: meta !important; }

  body.page-proyecto .next-project-icon{
    grid-area: icon !important;
    position: static !important;
    left: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: clamp(100px, 13vw, 136px) !important;
    max-width: 100% !important;
    margin: 0 !important;
    opacity: .86 !important;
  }

  body.page-proyecto .next-project-card:hover .next-project-icon{
    transform: none !important;
  }
}

/* Project page mobile/tablet: cleaner hero + visible large icon */
@media (max-width: 980px){
  body.page-proyecto .project-page{
    padding-top: clamp(16px, 4vw, 24px) !important;
    padding-bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  }

  body.page-proyecto .project-hero{
    grid-template-columns: 1fr minmax(120px, 42vw) !important;
    gap: 10px 14px !important;
    margin-bottom: 16px !important;
    align-items: start !important;
  }

  body.page-proyecto .project-kicker{
    margin-bottom: 8px !important;
    font-size: .58rem !important;
    letter-spacing: .36em !important;
  }

  body.page-proyecto .project-title{
    font-size: clamp(1.9rem, 10.4vw, 3rem) !important;
    letter-spacing: .09em !important;
    line-height: .95 !important;
    margin-bottom: 8px !important;
  }

  body.page-proyecto .project-meta{
    display: grid !important;
    justify-items: start !important;
    align-content: start !important;
    gap: 7px !important;
    font-size: .74rem !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
  }

  body.page-proyecto .project-meta span{
    display: block !important;
    line-height: 1.2 !important;
    color: var(--ink-soft) !important;
  }

  body.page-proyecto .project-inline-sign{
    width: 100% !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    margin-top: 3px !important;
  }

  body.page-proyecto .project-inline-sign .project-sign-icon{
    width: min(100%, clamp(160px, 48vw, 280px)) !important;
    opacity: .9 !important;
    filter: grayscale(1) contrast(1.08) !important;
  }

  body.dark.page-proyecto .project-inline-sign .project-sign-icon{
    filter: grayscale(1) invert(1) brightness(1.14) contrast(1.04) !important;
  }

  body.page-proyecto .project-gallery{
    gap: 14px !important;
  }

  body.page-proyecto .project-shot{
    border-radius: 18px !important;
    border: 1px solid var(--line) !important;
    overflow: hidden !important;
  }

  body.page-proyecto .project-shot--hero,
  body.page-proyecto .project-shot--stack{
    min-height: clamp(220px, 62vw, 340px) !important;
  }

  body.page-proyecto .project-resources{
    margin-top: 14px !important;
    padding-top: 14px !important;
  }

  body.page-proyecto .next-project-kicker{
    text-align: left !important;
    margin-bottom: 10px !important;
    letter-spacing: .3em !important;
  }

  body.page-proyecto .next-project-grid{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  body.page-proyecto .next-project-card{
    min-height: 0 !important;
    border-bottom: 1px solid var(--line) !important;
    padding: 0 0 16px !important;
    display: grid !important;
    justify-items: start !important;
    gap: 8px !important;
    background: transparent !important;
  }

  body.page-proyecto .next-project-title{
    font-size: clamp(1.02rem, 6vw, 1.5rem) !important;
    letter-spacing: .1em !important;
    line-height: 1.2 !important;
  }

  body.page-proyecto .next-project-icon{
    position: static !important;
    left: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: min(86vw, 320px) !important;
    max-width: 100% !important;
    margin-top: 4px !important;
    opacity: .9 !important;
  }

  body.page-proyecto .next-project-card:hover .next-project-icon{
    transform: none !important;
  }
}

/* =========================
   HOTFIX V50: FORCE BIG NEXT-PROJECT TITLE (FINAL OVERRIDE)
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .next-project-title{
    font-size: clamp(1.9rem, 10.8vw, 3.2rem) !important;
    letter-spacing: .07em !important;
    line-height: .94 !important;
    margin: 2px 0 2px !important;
  }
}

/* =========================
   HOTFIX V51: MOBILE PROJECT INFO COMPACT LAYOUT
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-hero{
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
  }

  body.page-proyecto .project-hero > div:first-child{
    width: 100% !important;
  }

  body.page-proyecto .project-kicker{
    margin-bottom: 6px !important;
  }

  body.page-proyecto .project-title{
    margin-bottom: 4px !important;
  }

  body.page-proyecto .project-meta{
    width: 100% !important;
    display: grid !important;
    align-items: end !important;
    column-gap: 14px !important;
    row-gap: 5px !important;
    margin-top: 2px !important;
    padding-top: 8px !important;
    border-top: 1px solid var(--line) !important;
  }

  body.page-proyecto .project-hero.has-inline-sign .project-meta{
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "year icon"
      "city icon" !important;
  }

  body.page-proyecto .project-hero:not(.has-inline-sign) .project-meta{
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "year"
      "city" !important;
  }

  body.page-proyecto .project-meta span{
    font-size: .72rem !important;
    letter-spacing: .17em !important;
    line-height: 1.15 !important;
    color: var(--ink-soft) !important;
  }

  body.page-proyecto .project-meta span:nth-child(1){
    grid-area: year !important;
  }

  body.page-proyecto .project-meta span:nth-child(2){
    grid-area: city !important;
  }

  body.page-proyecto .project-inline-sign{
    grid-area: icon !important;
    align-self: end !important;
    justify-self: end !important;
    margin-top: 0 !important;
    width: auto !important;
  }

  body.page-proyecto .project-inline-sign .project-sign-icon{
    width: clamp(124px, 30vw, 188px) !important;
    max-width: 42vw !important;
    opacity: .92 !important;
  }
}

/* =========================
   HOTFIX V52: PROJECT MOBILE REDESIGN (CLIENT-RUSH)
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-header{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    column-gap: 14px !important;
    row-gap: 4px !important;
    padding: calc(16px + env(safe-area-inset-top)) var(--padX) 10px !important;
    border-bottom: 1px solid var(--line) !important;
    background: var(--paper) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body.page-proyecto .project-logo{
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 3px !important;
    font-size: clamp(.9rem, 3.8vw, 1.08rem) !important;
    font-weight: 600 !important;
    letter-spacing: .34em !important;
    line-height: 1 !important;
  }

  body.page-proyecto .project-logo::after{
    content: "TALLER DE ARQUITECTURA";
    font-family: var(--display);
    font-size: clamp(.5rem, 1.9vw, .58rem);
    letter-spacing: .22em;
    line-height: 1.1;
    color: var(--ink-soft);
    opacity: .82;
  }

  body.page-proyecto .project-back{
    justify-self: end !important;
    align-self: start !important;
    margin-right: 44px !important;
    margin-top: 1px !important;
    font-size: clamp(.52rem, 1.9vw, .62rem) !important;
    letter-spacing: .28em !important;
    line-height: 1 !important;
    padding-bottom: 5px !important;
    border-bottom: 1px solid currentColor !important;
    white-space: nowrap !important;
    opacity: .9 !important;
  }

  body.page-proyecto .menu-btn{
    top: calc(48px + env(safe-area-inset-top)) !important;
    right: calc(var(--padX) - 2px) !important;
    width: 30px !important;
    height: 22px !important;
    z-index: 240 !important;
    color: var(--ink) !important;
  }

  body.page-proyecto .menu-btn span{
    height: 1.5px !important;
  }

  body.page-proyecto .menu-btn.open span:nth-child(1){
    transform: translateY(10.25px) rotate(45deg) !important;
  }

  body.page-proyecto .menu-btn.open span:nth-child(3){
    transform: translateY(-10.25px) rotate(-45deg) !important;
  }

  body.page-proyecto .project-page{
    padding-top: 14px !important;
    padding-bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  }

  body.page-proyecto .project-hero{
    grid-template-columns: minmax(0, 1fr) minmax(146px, 44vw) !important;
    grid-template-rows: auto auto !important;
    align-items: start !important;
    column-gap: 14px !important;
    row-gap: 10px !important;
    margin-bottom: 14px !important;
    padding-top: 12px !important;
    border-top: 1px solid var(--line) !important;
  }

  body.page-proyecto .project-hero > div:first-child{
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
  }

  body.page-proyecto .project-kicker{
    font-size: .58rem !important;
    letter-spacing: .38em !important;
    margin-bottom: 7px !important;
  }

  body.page-proyecto .project-title{
    font-size: clamp(1.72rem, 9.2vw, 2.72rem) !important;
    letter-spacing: .07em !important;
    line-height: .92 !important;
    margin-bottom: 2px !important;
  }

  body.page-proyecto .project-meta{
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    display: grid !important;
    gap: 10px !important;
    justify-items: start !important;
    align-content: start !important;
  }

  body.page-proyecto .project-meta span{
    display: block !important;
    font-size: .74rem !important;
    letter-spacing: .2em !important;
    line-height: 1.14 !important;
    color: var(--ink-soft) !important;
  }

  body.page-proyecto .project-inline-sign{
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    align-self: center !important;
    justify-self: end !important;
    width: auto !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  body.page-proyecto .project-inline-sign .project-sign-icon{
    width: clamp(172px, 48vw, 270px) !important;
    max-width: 100% !important;
    opacity: .95 !important;
    filter: grayscale(1) contrast(1.08) !important;
  }

  body.dark.page-proyecto .project-inline-sign .project-sign-icon{
    filter: grayscale(1) invert(1) brightness(1.12) contrast(1.04) !important;
  }
}

/* =========================
   HOTFIX V53: PROJECT MOBILE NO-HAMBURGER CLEAN MODE
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .menu-btn{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.page-proyecto .menu-overlay{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: none !important;
  }

  body.page-proyecto .project-back{
    margin-right: 0 !important;
    justify-self: end !important;
  }

  body.page-proyecto .project-hero{
    grid-template-columns: minmax(0, 1fr) minmax(150px, 42vw) !important;
    align-items: center !important;
  }

  body.page-proyecto .project-hero > div:first-child{
    min-width: 0 !important;
  }

  body.page-proyecto .project-title{
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  body.page-proyecto .next-project-kicker{
    margin-bottom: 8px !important;
    letter-spacing: .34em !important;
  }

  body.page-proyecto .next-project-card{
    gap: 10px !important;
    padding-bottom: 14px !important;
  }

  body.page-proyecto .next-project-tag,
  body.page-proyecto .next-project-meta{
    display: none !important;
  }

  body.page-proyecto .next-project-title{
    font-size: clamp(1.7rem, 9.6vw, 2.7rem) !important;
    line-height: .95 !important;
    letter-spacing: .08em !important;
    margin: 0 !important;
  }

  body.page-proyecto .next-project-icon{
    width: min(84vw, 300px) !important;
    margin-top: 0 !important;
    opacity: .94 !important;
  }
}

/* =========================
   HOTFIX V54: MOBILE TITLE NO-CROP + REMOVE HEADER LINES
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-header{
    border-bottom: 0 !important;
  }

  body.page-proyecto .project-back{
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  body.page-proyecto .project-hero{
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "text text"
      "meta icon" !important;
    align-items: end !important;
    border-top: 0 !important;
    padding-top: 0 !important;
    row-gap: 8px !important;
    column-gap: 12px !important;
  }

  body.page-proyecto .project-hero > div:first-child{
    grid-area: text !important;
  }

  body.page-proyecto .project-title{
    font-size: clamp(1.34rem, 6.7vw, 2.08rem) !important;
    letter-spacing: .045em !important;
    line-height: .94 !important;
    max-width: 100% !important;
    word-break: keep-all !important;
    overflow-wrap: anywhere !important;
  }

  body.page-proyecto .project-meta{
    grid-area: meta !important;
    border-top: 0 !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    gap: 7px !important;
  }

  body.page-proyecto .project-inline-sign{
    grid-area: icon !important;
    align-self: end !important;
    justify-self: end !important;
  }

  body.page-proyecto .project-inline-sign .project-sign-icon{
    width: clamp(150px, 40vw, 224px) !important;
  }
}

/* =========================
   HOTFIX V55: MOBILE SPACING RHYTHM (CLIENT FEEDBACK)
   ========================= */
@media (max-width: 980px){
  body.page-proyecto{
    --padX: clamp(18px, 5vw, 22px);
  }

  body.page-proyecto .project-header{
    padding: calc(18px + env(safe-area-inset-top)) var(--padX) 11px !important;
    border-bottom: 1px solid var(--line) !important;
    background: var(--paper) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body.page-proyecto .project-logo{
    font-size: clamp(.92rem, 3.9vw, 1.1rem) !important;
    letter-spacing: .33em !important;
  }

  body.page-proyecto .project-back{
    margin-right: 0 !important;
    margin-top: 2px !important;
    border-bottom: 1px solid rgba(157,106,53,.6) !important;
    padding-bottom: 3px !important;
    font-size: clamp(.52rem, 1.9vw, .62rem) !important;
    letter-spacing: .29em !important;
  }

  body.page-proyecto .project-page{
    padding: 10px var(--padX) calc(22px + env(safe-area-inset-bottom)) !important;
  }

  body.page-proyecto .project-hero{
    margin-bottom: 18px !important;
    padding-top: 14px !important;
    border-top: 1px solid var(--line) !important;
    row-gap: 12px !important;
    column-gap: 14px !important;
  }

  body.page-proyecto .project-kicker{
    margin-bottom: 8px !important;
  }

  body.page-proyecto .project-title{
    font-size: clamp(1.52rem, 7.8vw, 2.28rem) !important;
    letter-spacing: .055em !important;
    line-height: .93 !important;
    margin-bottom: 6px !important;
  }

  body.page-proyecto .project-meta{
    gap: 10px !important;
  }

  body.page-proyecto .project-meta span{
    font-size: .73rem !important;
    letter-spacing: .19em !important;
  }

  body.page-proyecto .project-inline-sign .project-sign-icon{
    width: clamp(160px, 40vw, 230px) !important;
    opacity: .94 !important;
  }

  body.page-proyecto .project-gallery{
    gap: 16px !important;
  }

  body.page-proyecto .project-shot{
    border-radius: 22px !important;
  }

  body.page-proyecto .project-shot--hero,
  body.page-proyecto .project-shot--stack{
    min-height: clamp(250px, 72vw, 410px) !important;
  }

  body.page-proyecto .project-resources{
    margin-top: 20px !important;
    padding-top: 16px !important;
  }
}

/* =========================
   HOTFIX V56: PROJECT MOBILE SPACING TEMPLATE (FINAL)
   ========================= */
@media (max-width: 980px){
  body.page-proyecto{
    --padX: clamp(20px, 5.6vw, 26px);
  }

  body.page-proyecto .project-header{
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    column-gap: 14px !important;
    row-gap: 6px !important;
    padding: calc(16px + env(safe-area-inset-top)) var(--padX) 12px !important;
    border-bottom: 0 !important;
    background: var(--paper) !important;
  }

  body.page-proyecto .project-logo{
    font-size: clamp(.92rem, 4vw, 1.12rem) !important;
    letter-spacing: .33em !important;
  }

  body.page-proyecto .project-back{
    justify-self: end !important;
    align-self: start !important;
    margin-right: 0 !important;
    margin-top: 4px !important;
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
    font-size: clamp(.54rem, 2vw, .64rem) !important;
    letter-spacing: .28em !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    opacity: .9 !important;
  }

  body.page-proyecto .project-page{
    padding: 18px var(--padX) calc(24px + env(safe-area-inset-bottom)) !important;
  }

  body.page-proyecto .project-hero{
    grid-template-columns: minmax(0, 1fr) minmax(132px, 42vw) !important;
    grid-template-areas:
      "text icon"
      "meta icon" !important;
    align-items: center !important;
    column-gap: 14px !important;
    row-gap: 14px !important;
    margin-bottom: 22px !important;
    padding-top: 0 !important;
    border-top: 0 !important;
  }

  body.page-proyecto .project-hero > div:first-child{
    grid-area: text !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body.page-proyecto .project-kicker{
    margin-bottom: 10px !important;
    font-size: .58rem !important;
    letter-spacing: .34em !important;
  }

  body.page-proyecto .project-title{
    font-size: clamp(1.32rem, 8.4vw, 2.34rem) !important;
    letter-spacing: .055em !important;
    line-height: .9 !important;
    margin: 0 !important;
    max-width: 100% !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    text-wrap: balance !important;
  }

  body.page-proyecto .project-meta{
    grid-area: meta !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    display: grid !important;
    gap: 9px !important;
    justify-items: start !important;
    align-content: start !important;
  }

  body.page-proyecto .project-meta span{
    display: block !important;
    font-size: .74rem !important;
    letter-spacing: .19em !important;
    line-height: 1.14 !important;
    color: var(--ink-soft) !important;
  }

  body.page-proyecto .project-inline-sign{
    grid-area: icon !important;
    align-self: center !important;
    justify-self: end !important;
    width: auto !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  body.page-proyecto .project-inline-sign .project-sign-icon{
    width: clamp(156px, 45vw, 236px) !important;
    max-width: 100% !important;
    opacity: .95 !important;
  }

  body.page-proyecto .project-gallery{
    gap: 14px !important;
  }

  body.page-proyecto .project-shot{
    border-radius: 22px !important;
  }

  body.page-proyecto .project-shot--hero,
  body.page-proyecto .project-shot--stack{
    min-height: clamp(250px, 74vw, 420px) !important;
  }

  body.page-proyecto .project-resources{
    margin-top: 18px !important;
    padding-top: 12px !important;
  }
}

/* =========================
   HOTFIX V57: HELVETICA MODE (REVERSIBLE)
   ========================= */
html.font-helvetica-mode{
  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --serif: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --display: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

html.font-helvetica-mode body{
  font-feature-settings: "kern" 1;
  text-rendering: optimizeLegibility;
}

html.font-helvetica-mode .menu-items a{
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: .005em !important;
  line-height: .9 !important;
  color: rgba(255,255,255,0.96) !important;
  opacity: 1 !important;
  transform: translateX(0) !important;
}

html.font-helvetica-mode .menu-items a:hover{
  letter-spacing: .012em !important;
  color: #ffffff !important;
}

@media (max-width: 768px){
  html.font-helvetica-mode .menu-items{
    gap: 14px !important;
  }

  html.font-helvetica-mode .menu-items a{
    font-size: clamp(2.55rem, 13.6vw, 5.05rem) !important;
  }
}

@media (min-width: 769px){
  html.font-helvetica-mode .menu-items{
    gap: 8px !important;
    max-width: min(78vw, 760px) !important;
  }

  html.font-helvetica-mode .menu-items a{
    font-size: clamp(2.2rem, 5.8vw, 5.05rem) !important;
  }
}

/* =========================
   HOTFIX V58: HELVETICA MENU XXL + WEIGHT PLAY
   ========================= */
html.font-helvetica-mode .menu-overlay{
  align-items: flex-start !important;
  justify-content: flex-start !important;
  padding-left: clamp(30px, 5.2vw, 76px) !important;
  padding-top: clamp(86px, 12vh, 170px) !important;
}

html.font-helvetica-mode .menu-items{
  gap: clamp(12px, 1.8vh, 26px) !important;
  max-width: min(84vw, 980px) !important;
}

html.font-helvetica-mode .menu-items a{
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: clamp(2.72rem, 8.6vw, 7.4rem) !important;
  font-weight: 760 !important;
  letter-spacing: -.012em !important;
  line-height: .9 !important;
  text-transform: none !important;
  color: rgba(255,255,255,0.97) !important;
  opacity: 1 !important;
  transform: translateX(0) !important;
}

html.font-helvetica-mode .menu-items a:nth-child(1){ font-weight: 800 !important; }
html.font-helvetica-mode .menu-items a:nth-child(2){ font-weight: 720 !important; }
html.font-helvetica-mode .menu-items a:nth-child(3){ font-weight: 690 !important; }
html.font-helvetica-mode .menu-items a:nth-child(4){ font-weight: 780 !important; }
html.font-helvetica-mode .menu-items a:nth-child(5){ font-weight: 700 !important; }
html.font-helvetica-mode .menu-items a:nth-child(6){ font-weight: 760 !important; }

html.font-helvetica-mode .menu-items a:hover{
  color: #ffffff !important;
  letter-spacing: -.006em !important;
  transform: translateX(8px) !important;
}

@media (max-width: 768px){
  html.font-helvetica-mode .menu-overlay{
    padding-left: clamp(24px, 6vw, 34px) !important;
    padding-top: calc(90px + env(safe-area-inset-top)) !important;
  }

  html.font-helvetica-mode .menu-items{
    gap: clamp(14px, 2.1vh, 22px) !important;
    max-width: calc(100vw - 44px) !important;
  }

  html.font-helvetica-mode .menu-items a{
    font-size: clamp(2.6rem, 14.2vw, 4.8rem) !important;
    line-height: .92 !important;
  }
}

@media (min-width: 769px){
  html.font-helvetica-mode .menu-overlay{
    padding-left: clamp(42px, 6.2vw, 98px) !important;
    padding-top: clamp(94px, 12vh, 176px) !important;
  }

  html.font-helvetica-mode .menu-items{
    gap: clamp(12px, 1.6vh, 22px) !important;
    max-width: min(78vw, 1040px) !important;
  }

  html.font-helvetica-mode .menu-items a{
    font-size: clamp(3rem, 6.6vw, 6.2rem) !important;
  }
}

/* =========================
   HOTFIX V59: HELVETICA BRUTALIST LOWERCASE (NO CARDS)
   ========================= */
html.font-helvetica-mode body{
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-weight: 560;
  letter-spacing: -0.004em;
}

html.font-helvetica-mode body :is(
  h1, h2, h3, h4, h5, h6,
  p, a, button, span, small, strong, em, label, li, dt, dd
){
  text-transform: lowercase;
}

html.font-helvetica-mode :is(
  .page-logo,
  .page-logo *,
  .site-logo,
  .site-logo *,
  .project-logo,
  .project-logo *,
  .project-side-brand,
  .project-side-brand *,
  .about-logo,
  .about-logo *
){
  text-transform: uppercase !important;
  letter-spacing: .18em !important;
}

html.font-helvetica-mode :is(
  .projects .project-title,
  .projects .project-title *,
  .dev-project-card,
  .dev-project-card *,
  .next-project-card,
  .next-project-card *,
  .project-shot .shot-overlay,
  .project-shot .shot-overlay *
){
  text-transform: uppercase !important;
}

html.font-helvetica-mode :is(
  .section-title,
  .experimental-title,
  .team-title,
  .equipo-title,
  .dev-title,
  .contact-title,
  .form-question,
  .page-proyecto .project-title
){
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-weight: 780 !important;
  letter-spacing: -0.018em !important;
  line-height: .96 !important;
}

html.font-helvetica-mode :is(
  .about-right p,
  .team-right p,
  .contact-note,
  .contact-mono-intro,
  .contact-mono-link,
  .equipo-desc,
  .project-meta span,
  .project-info-row dd,
  .footer-left,
  .footer-right a
){
  font-weight: 560 !important;
  letter-spacing: -0.003em !important;
}

html.font-helvetica-mode .dev-nav-button,
html.font-helvetica-mode .project-side-link{
  font-weight: 700 !important;
  letter-spacing: .03em !important;
}

@media (min-width: 769px){
  html.font-helvetica-mode .contact-title{
    font-size: clamp(3.4rem, 8.2vw, 7rem) !important;
  }

  html.font-helvetica-mode .team-title{
    font-size: clamp(2.1rem, 4.9vw, 4.25rem) !important;
  }
}

@media (max-width: 768px){
  html.font-helvetica-mode :is(
    .section-title,
    .experimental-title,
    .team-title,
    .equipo-title,
    .dev-title,
    .contact-title,
    .form-question,
    .page-proyecto .project-title
  ){
    letter-spacing: -0.01em !important;
  }
}

/* =========================
   HOTFIX V60: BRUTAL MAX SUITE
   - Menu Billboard
   - Motion Premium
   - Layout Polish
   - Contrast Soft/Hard
   ========================= */
html.contrast-soft{
  --paper: #f2f2f0;
  --ink: #2f2c32;
  --ink-soft: rgba(47,44,50,0.72);
  --line: rgba(47,44,50,0.2);
  --shadow: 0 24px 52px rgba(20,18,23,0.15);
}

html.contrast-hard{
  --paper: #ffffff;
  --ink: #090909;
  --ink-soft: rgba(9,9,9,0.78);
  --line: rgba(9,9,9,0.24);
  --shadow: 0 24px 54px rgba(0,0,0,0.22);
}

html.font-helvetica-mode.style-brutal-max :is(
  .contact-title,
  .team-title,
  .equipo-title,
  .dev-title,
  .section-title,
  .experimental-title,
  .final-question,
  .form-question,
  .page-proyecto .project-title
){
  font-weight: 800 !important;
  letter-spacing: -0.026em !important;
  line-height: .9 !important;
}

html.font-helvetica-mode.style-brutal-max :is(
  .about-right p,
  .team-right p,
  .contact-note,
  .contact-mono-intro,
  .contact-mono-link,
  .equipo-desc,
  .project-meta span,
  .project-info-row dd,
  .footer-left,
  .footer-right a,
  .dev-nav-button,
  .project-side-link
){
  font-weight: 560 !important;
}

html.font-helvetica-mode.style-brutal-max .menu-overlay{
  inset: 0 !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  padding-left: clamp(28px, 5vw, 88px) !important;
  padding-top: clamp(84px, 11vh, 170px) !important;
  transition: transform .56s cubic-bezier(.23,1,.2,1), opacity .22s ease !important;
}

html.font-helvetica-mode.style-brutal-max.contrast-soft .menu-overlay{
  background: radial-gradient(800px 440px at 18% 8%, rgba(255,255,255,0.06), transparent 58%), #1f2025 !important;
}

html.font-helvetica-mode.style-brutal-max.contrast-hard .menu-overlay{
  background: radial-gradient(900px 500px at 18% 8%, rgba(255,255,255,0.045), transparent 58%), #080808 !important;
}

html.font-helvetica-mode.style-brutal-max .menu-items{
  gap: clamp(16px, 2.6vh, 34px) !important;
  max-width: min(86vw, 1080px) !important;
}

html.font-helvetica-mode.style-brutal-max .menu-items a{
  font-size: clamp(3rem, 9.4vw, 8.2rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.024em !important;
  line-height: .84 !important;
  text-transform: none !important;
  opacity: 1 !important;
  transform: translateX(0) !important;
  transition:
    color .2s ease,
    transform .2s ease,
    letter-spacing .2s ease,
    opacity .2s ease !important;
}

html.font-helvetica-mode.style-brutal-max .menu-items a:nth-child(even){
  font-weight: 700 !important;
}

html.font-helvetica-mode.style-brutal-max .menu-items a.menu-anim{
  animation: menuLinePremium .42s cubic-bezier(.2,.95,.25,1) forwards !important;
  animation-delay: calc(var(--i) * 0.045s) !important;
}

html.font-helvetica-mode.style-brutal-max .menu-items a:hover{
  transform: translateX(6px) !important;
  letter-spacing: -0.018em !important;
  opacity: .96 !important;
}

html.font-helvetica-mode.style-brutal-max .menu-btn span{
  transition: transform .36s cubic-bezier(.22,1,.22,1), opacity .2s ease !important;
}

@keyframes menuLinePremium{
  from{
    opacity: 0;
    transform: translate3d(-14px, 12px, 0);
    filter: blur(4px);
  }
  to{
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}

@media (max-width: 768px){
  html.font-helvetica-mode.style-brutal-max{
    --padX: clamp(18px, 6vw, 28px);
  }

  html.font-helvetica-mode.style-brutal-max .menu-overlay{
    padding-left: var(--padX) !important;
    padding-top: calc(86px + env(safe-area-inset-top)) !important;
  }

  html.font-helvetica-mode.style-brutal-max .menu-items{
    gap: clamp(14px, 2.2vh, 22px) !important;
    max-width: calc(100vw - (var(--padX) * 2)) !important;
  }

  html.font-helvetica-mode.style-brutal-max .menu-items a{
    font-size: clamp(2.52rem, 14.4vw, 5.22rem) !important;
    line-height: .88 !important;
  }

  html.font-helvetica-mode.style-brutal-max :is(
    .about,
    .experimental,
    .home-timeline,
    .team,
    .final-cta,
    .dev-page,
    .contact-mono,
    .project-page
  ){
    padding-left: var(--padX) !important;
    padding-right: var(--padX) !important;
  }

  html.font-helvetica-mode.style-brutal-max .contact-title{
    font-size: clamp(2.6rem, 13vw, 4.8rem) !important;
  }
}

@media (min-width: 769px) and (max-width: 1180px){
  html.font-helvetica-mode.style-brutal-max{
    --padX: clamp(26px, 4vw, 42px);
  }

  html.font-helvetica-mode.style-brutal-max .menu-overlay{
    padding-left: clamp(34px, 5vw, 62px) !important;
    padding-top: clamp(96px, 11vh, 142px) !important;
  }

  html.font-helvetica-mode.style-brutal-max .menu-items a{
    font-size: clamp(3.2rem, 8.2vw, 6.2rem) !important;
  }

  html.font-helvetica-mode.style-brutal-max .contact-title{
    font-size: clamp(3.6rem, 7.8vw, 6.6rem) !important;
  }
}

@media (min-width: 1181px){
  html.font-helvetica-mode.style-brutal-max .menu-overlay{
    padding-left: clamp(48px, 6.6vw, 104px) !important;
    padding-top: clamp(100px, 11vh, 176px) !important;
  }

  html.font-helvetica-mode.style-brutal-max .menu-items a{
    font-size: clamp(4.2rem, 7.1vw, 8.4rem) !important;
  }

  html.font-helvetica-mode.style-brutal-max .contact-title{
    font-size: clamp(4.4rem, 8.8vw, 8.6rem) !important;
  }
}

/* =========================
   HOTFIX V61: DESARROLLO ICON ONLY + HOVER TITLE (DESKTOP)
   ========================= */
@media (min-width: 981px) and (hover: hover) and (pointer: fine){
  body.page-desarrollo .dev-hover-title{
    display: none;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(24px, 2.8vw, 40px) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    min-height: clamp(260px, 30vh, 360px) !important;
    padding: clamp(16px, 1.8vw, 26px) !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    isolation: isolate !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::before{
    content: none !important;
  }

  body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::before{
    content: none !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card::after{
    content: none !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    width: clamp(174px, 15.1vw, 250px) !important;
    height: clamp(174px, 15.1vw, 250px) !important;
    transform: translate(-50%, -50%) scale(1) !important;
    opacity: .9 !important;
    filter: grayscale(1) contrast(1.2) !important;
    transition: transform .22s cubic-bezier(.22,1,.2,1), opacity .22s ease !important;
    z-index: 3 !important;
  }

  body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
    filter: invert(1) brightness(1.24) contrast(1.1) !important;
    opacity: .92 !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-footer,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-cat,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-name,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-meta{
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(8px) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-hover-title{
    display: inline-flex !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -158%) !important;
    align-items: center !important;
    justify-content: center !important;
    max-width: min(90%, 320px) !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,0.24) !important;
    background: rgba(0,0,0,0.56) !important;
    color: #fff !important;
    font-family: var(--display) !important;
    font-size: clamp(.72rem, .9vw, .98rem) !important;
    font-weight: 600 !important;
    letter-spacing: .12em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity .18s ease, transform .18s cubic-bezier(.22,1,.2,1) !important;
    z-index: 5 !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,0.22) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card:hover .dev-hover-title{
    opacity: 1 !important;
    transform: translate(-50%, -170%) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card:hover .dev-project-icon{
    opacity: 1 !important;
    transform: translate(-50%, -50%) scale(1.11) !important;
  }
}

/* =========================
   HOTFIX V62: ICON SCALE + COMPACT GRID + TITLE POLISH
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo.dev-icon-focus-mode .dev-section-head{
    margin-bottom: 10px !important;
    padding-bottom: 8px !important;
    border-bottom-color: rgba(255,255,255,0.08) !important;
  }

  body.page-desarrollo.dev-icon-focus-mode .dev-section-title{
    font-family: var(--display) !important;
    font-size: clamp(1.58rem, 2.45vw, 2.42rem) !important;
    font-weight: 600 !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    line-height: 1 !important;
    color: var(--ink) !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 14px 6px !important;
    background: linear-gradient(90deg, rgba(20,18,15,0.08), rgba(20,18,15,0.02)) !important;
    border-left: 1px solid rgba(20,18,15,0.28) !important;
    text-shadow: none !important;
  }

  body.page-desarrollo.dev-icon-focus-mode .dev-section-count{
    font-size: .64rem !important;
    letter-spacing: .3em !important;
    opacity: .88 !important;
  }

  body.dark.page-desarrollo.dev-icon-focus-mode .dev-section-title{
    color: #f5f2ee !important;
    background: linear-gradient(90deg, rgba(255,255,255,0.12), rgba(255,255,255,0.03)) !important;
    border-left-color: rgba(255,255,255,0.34) !important;
  }
}

@media (min-width: 981px) and (hover: hover) and (pointer: fine){
  body.page-desarrollo .dev-project-grid.is-icon-focus{
    gap: clamp(12px, 1.8vw, 24px) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    min-height: clamp(220px, 25vh, 320px) !important;
    padding: clamp(8px, 1vw, 14px) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-icon{
    width: clamp(212px, 19vw, 330px) !important;
    height: clamp(212px, 19vw, 330px) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-hover-title{
    transform: translate(-50%, -172%) !important;
    max-width: min(92%, 360px) !important;
    padding: 8px 14px !important;
    font-size: clamp(.78rem, .98vw, 1.06rem) !important;
    letter-spacing: .1em !important;
    background: rgba(0,0,0,0.66) !important;
    border-color: rgba(255,255,255,0.34) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card:hover .dev-hover-title{
    transform: translate(-50%, -184%) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card:hover .dev-project-icon{
    transform: translate(-50%, -50%) scale(1.14) !important;
  }
}

/* =========================
   HOTFIX V63: DESARROLLO TITLE CLEAN RESET
   ========================= */
@media (min-width: 981px){
  body.page-desarrollo.dev-icon-focus-mode .dev-section-head{
    margin-bottom: 12px !important;
    padding-bottom: 8px !important;
    border-bottom: 0 !important;
  }

  body.page-desarrollo.dev-icon-focus-mode .dev-section-title{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: clamp(1.34rem, 2.05vw, 2.02rem) !important;
    font-weight: 760 !important;
    letter-spacing: -0.012em !important;
    text-transform: lowercase !important;
    line-height: .92 !important;
    color: #000 !important;
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    text-shadow: none !important;
  }

  body.page-desarrollo.dev-icon-focus-mode .dev-section-count{
    font-size: .62rem !important;
    letter-spacing: .3em !important;
    color: rgba(215,188,130,.95) !important;
    opacity: .92 !important;
  }
}

/* =========================
   HOTFIX V64: PROJECT NARRATIVE + SAFE SCROLL
   ========================= */
body.page-proyecto .project-narrative{
  text-align: left !important;
  margin: 0 0 clamp(24px, 3.8vw, 44px) !important;
  padding: clamp(16px, 2vw, 28px) clamp(16px, 2.2vw, 30px) !important;
  border: 1px solid var(--line) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(255,255,255,0.18), rgba(255,255,255,0.04)) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.08) !important;
}

body.dark.page-proyecto .project-narrative{
  background: linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.015)) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,0.34) !important;
}

body.page-proyecto .project-narrative-title{
  margin: 0 0 10px !important;
  font-size: .62rem !important;
  letter-spacing: .34em !important;
  text-transform: uppercase !important;
  color: var(--team-accent) !important;
}

body.page-proyecto .project-narrative p{
  margin: 0 !important;
  font-size: clamp(.92rem, 1.04vw, 1.06rem) !important;
  line-height: 1.66 !important;
  letter-spacing: .006em !important;
  color: var(--ink-soft) !important;
  text-transform: none !important;
}

body.page-proyecto .project-narrative p + p{
  margin-top: 12px !important;
}

@media (min-width: 981px){
  body.page-proyecto .project-media-column{
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding-bottom: clamp(94px, 14vh, 160px) !important;
    scroll-padding-bottom: clamp(94px, 14vh, 160px) !important;
  }

  body.page-proyecto .project-resources,
  body.page-proyecto .project-media-column .project-resources,
  body.page-proyecto .project-next{
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    margin-top: clamp(24px, 3vw, 40px) !important;
    padding-top: clamp(18px, 2.3vw, 32px) !important;
  }

  body.page-proyecto .next-project-grid{
    padding-bottom: clamp(18px, 3.2vw, 34px) !important;
  }
}

@media (max-width: 980px){
  body.page-proyecto .project-narrative{
    margin: 0 0 18px !important;
    padding: 14px 14px 15px !important;
    border-radius: 14px !important;
  }

  body.page-proyecto .project-narrative-title{
    font-size: .56rem !important;
    letter-spacing: .28em !important;
    margin-bottom: 8px !important;
  }

  body.page-proyecto .project-narrative p{
    font-size: clamp(.9rem, 3.8vw, .99rem) !important;
    line-height: 1.58 !important;
  }
}

/* =========================
   HOTFIX V65: PROJECT NARRATIVE TYPOGRAPHIC POLISH
   ========================= */
body.page-proyecto .project-media-column .project-resources .project-narrative,
body.page-proyecto .project-resources .project-narrative{
  margin: 0 0 clamp(28px, 4.4vw, 54px) 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  max-width: min(100%, 980px) !important;
  text-align: left !important;
  text-align-last: auto !important;
}

body.page-proyecto .project-media-column .project-resources .project-narrative-title,
body.page-proyecto .project-resources .project-narrative-title{
  margin: 0 0 clamp(12px, 1.4vw, 18px) 0 !important;
  font-family: var(--sans) !important;
  font-size: clamp(.74rem, .9vw, .92rem) !important;
  font-weight: 700 !important;
  letter-spacing: .24em !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
  color: var(--team-accent) !important;
  text-align: left !important;
  text-align-last: auto !important;
}

body.page-proyecto .project-media-column .project-resources .project-narrative p,
body.page-proyecto .project-resources .project-narrative p{
  margin: 0 !important;
  max-width: 66ch !important;
  font-family: var(--sans) !important;
  font-size: clamp(1.08rem, 1.28vw, 1.42rem) !important;
  font-weight: 520 !important;
  line-height: 1.64 !important;
  letter-spacing: .002em !important;
  text-transform: none !important;
  text-align: left !important;
  text-align-last: auto !important;
  color: var(--ink) !important;
  hyphens: none !important;
}

body.dark.page-proyecto .project-media-column .project-resources .project-narrative p,
body.dark.page-proyecto .project-resources .project-narrative p{
  color: rgba(255,255,255,.9) !important;
}

body.page-proyecto .project-media-column .project-resources .project-narrative p + p,
body.page-proyecto .project-resources .project-narrative p + p{
  margin-top: clamp(10px, 1.6vw, 18px) !important;
  text-indent: 1.5ch !important;
}

@media (max-width: 980px){
  body.page-proyecto .project-media-column .project-resources .project-narrative,
  body.page-proyecto .project-resources .project-narrative{
    margin: 0 0 22px !important;
    max-width: 100% !important;
  }

  body.page-proyecto .project-media-column .project-resources .project-narrative-title,
  body.page-proyecto .project-resources .project-narrative-title{
    font-size: .62rem !important;
    letter-spacing: .22em !important;
    margin-bottom: 10px !important;
  }

  body.page-proyecto .project-media-column .project-resources .project-narrative p,
  body.page-proyecto .project-resources .project-narrative p{
    max-width: 100% !important;
    font-size: clamp(.98rem, 4.2vw, 1.12rem) !important;
    line-height: 1.58 !important;
  }

  body.page-proyecto .project-media-column .project-resources .project-narrative p + p,
  body.page-proyecto .project-resources .project-narrative p + p{
    text-indent: 1.2ch !important;
    margin-top: 10px !important;
  }
}

/* =========================
   HOTFIX V66: MENU DESARROLLO SUBSECCIONES
   ========================= */
.menu-nav .menu-group{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.menu-nav .menu-group > .menu-main-link{
  width: 100%;
  position: relative;
}

.menu-nav .menu-group.is-open > .menu-main-link{
  color: #ffffff !important;
}

.menu-nav .menu-group.is-open > .menu-main-link::after{
  content: "";
  display: block;
  width: clamp(120px, 18vw, 340px);
  max-width: 100%;
  height: 2px;
  margin-top: clamp(4px, .95vh, 10px);
  background: currentColor;
  opacity: .92;
}

.menu-nav .menu-submenu{
  width: 100%;
  display: grid;
  gap: clamp(4px, .9vh, 10px);
  max-height: 0;
  overflow: hidden;
  margin-top: 0;
  padding-left: clamp(10px, 2vw, 24px);
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  transition:
    max-height .42s var(--easeSoft),
    opacity .24s ease,
    transform .32s var(--easeSoft),
    margin-top .32s var(--easeSoft);
}

.menu-nav .menu-group.is-open .menu-submenu{
  max-height: 460px;
  margin-top: clamp(8px, 1.2vh, 14px);
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.menu-nav .menu-submenu a{
  font-family: var(--display) !important;
  font-size: clamp(1.04rem, 3.2vw, 2.02rem) !important;
  font-weight: 680 !important;
  line-height: 1.03 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.82) !important;
  text-decoration: none !important;
  text-shadow: none !important;
  transform: translateX(0) !important;
  padding: 0 !important;
}

.menu-nav .menu-submenu a:hover{
  color: #ffffff !important;
  letter-spacing: .045em !important;
  transform: translateX(6px) !important;
}

body.creative .menu-nav .menu-group.is-open > .menu-main-link{
  color: rgba(11,11,11,.92) !important;
}

body.creative .menu-nav .menu-submenu a{
  color: rgba(11,11,11,.74) !important;
}

body.creative .menu-nav .menu-submenu a:hover{
  color: rgba(11,11,11,.98) !important;
}

html.font-helvetica-mode .menu-nav .menu-submenu a{
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: clamp(1.08rem, 3.5vw, 2.14rem) !important;
  font-weight: 650 !important;
  letter-spacing: -.004em !important;
  text-transform: none !important;
}

@media (max-width: 768px){
  .menu-nav .menu-group.is-open > .menu-main-link::after{
    width: clamp(96px, 42vw, 190px);
    height: 1.5px;
  }

  .menu-nav .menu-submenu{
    gap: clamp(3px, .8vh, 8px);
    padding-left: 8px;
  }

  .menu-nav .menu-group.is-open .menu-submenu{
    max-height: 360px;
    margin-top: 8px;
  }

  .menu-nav .menu-submenu a{
    font-size: clamp(.98rem, 5.8vw, 1.58rem) !important;
    line-height: 1.05 !important;
  }
}

/* =========================
   HOTFIX V67: GLOBAL IMAGE LOGO + PROJECT HEADER OFFSET
   ========================= */
:is(.page-logo, .project-logo, body.page-proyecto .project-side-brand, .site-logo){
  --brand-logo-width: clamp(186px, 18.4vw, 312px);
  width: var(--brand-logo-width) !important;
  max-width: 100% !important;
  aspect-ratio: 1080 / 219 !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  background-image: url("assets/branding/logos/ivan-facio-logo-black.png") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: 100% auto !important;
  line-height: 0 !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: transparent !important;
  overflow: visible !important;
}

body.dark :is(.page-logo, .project-logo, body.page-proyecto .project-side-brand, .site-logo){
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

:is(.page-logo, .project-logo, body.page-proyecto .project-side-brand, .site-logo)::after,
:is(.page-logo, .project-logo, body.page-proyecto .project-side-brand, .site-logo)::before{
  content: none !important;
  display: none !important;
}

:is(.page-logo, body.page-proyecto .project-side-brand) > *{
  display: none !important;
}

body.page-home .site-logo{
  --brand-logo-width: clamp(214px, 21.5vw, 336px);
}

body.page-proyecto .project-logo{
  --brand-logo-width: clamp(180px, 16.8vw, 268px);
}

body.page-proyecto .project-side-brand{
  --brand-logo-width: clamp(170px, 13.2vw, 224px);
}

@media (max-width: 980px){
  body.page-proyecto .project-header{
    padding-top: calc(12px + env(safe-area-inset-top) + 10mm) !important;
  }

  body.page-proyecto .project-logo{
    --brand-logo-width: clamp(176px, 50vw, 278px);
  }

  body.page-proyecto .menu-btn{
    top: calc(12px + env(safe-area-inset-top) + 10mm) !important;
  }
}

@media (min-width: 981px){
  body.page-proyecto .menu-btn{
    top: calc(18px + env(safe-area-inset-top) + 10mm) !important;
  }
}

/* =========================
   HOTFIX V68: PROJECT CARDS LOGO ALWAYS WHITE VERSION
   ========================= */
body.page-proyecto :is(.project-logo, .project-side-brand){
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

body.dark.page-proyecto :is(.project-logo, .project-side-brand){
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

/* =========================
   HOTFIX V69: FORCE BLACK LOGO IN DESARROLLO/EQUIPO/CONTACTO + HOME ABOUT
   ========================= */
body.page-desarrollo a.page-logo.page-logo-box,
body.page-equipo a.page-logo.page-logo-box,
body.page-contacto a.page-logo.page-logo-box{
  width: clamp(206px, 19.2vw, 318px) !important;
  max-width: min(74vw, 318px) !important;
  aspect-ratio: 1080 / 219 !important;
  height: auto !important;
  display: block !important;
  background: url("assets/branding/logos/ivan-facio-logo-black.png") no-repeat left center / 100% auto !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  overflow: visible !important;
}

body.dark.page-desarrollo a.page-logo.page-logo-box,
body.dark.page-equipo a.page-logo.page-logo-box,
body.dark.page-contacto a.page-logo.page-logo-box{
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

body.page-desarrollo a.page-logo.page-logo-box > .page-logo-main,
body.page-desarrollo a.page-logo.page-logo-box > .page-logo-sub,
body.page-equipo a.page-logo.page-logo-box > .page-logo-main,
body.page-equipo a.page-logo.page-logo-box > .page-logo-sub,
body.page-contacto a.page-logo.page-logo-box > .page-logo-main,
body.page-contacto a.page-logo.page-logo-box > .page-logo-sub{
  display: none !important;
}

body.page-home .about-logo{
  width: clamp(222px, 23.5vw, 390px) !important;
  max-width: min(82vw, 390px) !important;
  aspect-ratio: 1080 / 219 !important;
  height: auto !important;
  display: block !important;
  background: url("assets/branding/logos/ivan-facio-logo-black.png") no-repeat left center / 100% auto !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  overflow: hidden !important;
}

body.page-home .about-logo br,
body.page-home .about-logo span{
  display: none !important;
}

/* =========================
   HOTFIX V72: HOME TOP LOGO ALWAYS WHITE
   ========================= */
body.page-home .site-logo{
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

body.dark.page-home .site-logo{
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

/* =========================
   HOTFIX V70: EQUIPO TEXT ALIGN + TAX COPY
   ========================= */
body.page-equipo .miembro--ivan,
body.page-equipo .miembro--emmanuel{
  grid-template-rows: 1fr !important;
  align-items: center !important;
  row-gap: 0 !important;
}

body.page-equipo .miembro--ivan .miembro-media,
body.page-equipo .miembro--emmanuel .miembro-media{
  grid-row: 1 !important;
}

body.page-equipo .miembro--ivan .miembro-copy,
body.page-equipo .miembro--emmanuel .miembro-copy{
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
  max-width: min(52ch, 100%) !important;
}

body.page-equipo .miembro--ivan .miembro-copy{
  grid-column: 2 !important;
}

body.page-equipo .miembro--emmanuel .miembro-copy{
  grid-column: 1 !important;
}

body.page-equipo .miembro--ivan h3,
body.page-equipo .miembro--ivan span,
body.page-equipo .miembro--emmanuel h3,
body.page-equipo .miembro--emmanuel span{
  grid-column: auto !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
  text-align: left !important;
}

body.page-equipo .miembro-tax-copy{
  margin: clamp(10px, 1.2vw, 16px) 0 0 !important;
  font-family: var(--display) !important;
  font-size: clamp(1.24rem, 2.15vw, 2.22rem) !important;
  line-height: 1.08 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  color: var(--ink) !important;
  max-width: 22ch !important;
}

body.dark.page-equipo .miembro-tax-copy{
  color: rgba(255,255,255,.94) !important;
}

body.page-equipo .miembro h3.nombre-capitalizado,
body.page-equipo .miembro .miembro-overlay.nombre-capitalizado{
  text-transform: none !important;
}

@media (max-width: 980px){
  body.page-equipo .miembro--ivan,
  body.page-equipo .miembro--emmanuel{
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    align-items: start !important;
    row-gap: 10px !important;
  }

  body.page-equipo .miembro--ivan .miembro-media,
  body.page-equipo .miembro--emmanuel .miembro-media{
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.page-equipo .miembro--ivan .miembro-copy,
  body.page-equipo .miembro--emmanuel .miembro-copy{
    grid-column: 1 !important;
    grid-row: 2 !important;
    max-width: 100% !important;
  }

  body.page-equipo .miembro-tax-copy{
    font-size: clamp(1.02rem, 5.4vw, 1.42rem) !important;
    line-height: 1.14 !important;
    max-width: 100% !important;
    margin-top: 8px !important;
  }
}

/* =========================
   HOTFIX V71: EQUIPO NAMES CASE FIX
   ========================= */
body.page-equipo .miembro h3,
body.page-equipo .miembro .miembro-overlay{
  text-transform: none !important;
}



/* =========================
   HOTFIX V74: LOGO CLEAN + FOOTER ICONS + CONTACT MARK STATIC
   ========================= */
/* Force image-logo only (avoid old text overlay) on project/form pages */
body.page-proyecto .project-logo,
body.page-form .page-logo.page-logo-box{
  width: clamp(186px, 18.4vw, 312px) !important;
  max-width: 100% !important;
  aspect-ratio: 1080 / 219 !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  background-image: url("assets/branding/logos/ivan-facio-logo-black.png") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: 100% auto !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  overflow: visible !important;
}
body.dark.page-proyecto .project-logo,
body.dark.page-form .page-logo.page-logo-box{
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}
body.page-proyecto .project-logo::after,
body.page-form .page-logo.page-logo-box::after,
body.page-form .page-logo.page-logo-box::before{
  content: none !important;
  display: none !important;
}
body.page-form .page-logo.page-logo-box > .page-logo-main,
body.page-form .page-logo.page-logo-box > .page-logo-sub{
  display: none !important;
}

@media (max-width: 980px){
  body.page-proyecto .project-logo{
    width: clamp(176px, 50vw, 278px) !important;
  }
}

/* Footer social as icons (inherits white/black by mode) */
.site-footer .footer-right a{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 1.25rem;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  color: var(--ink);
  opacity: .9;
}
.site-footer .footer-right a::after{
  content: none !important;
}
.site-footer .footer-right a::before{
  content: "";
  width: 16px;
  height: 16px;
  display: block;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.site-footer .footer-right a[aria-label*="Instagram"]::before{
  -webkit-mask-image: 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  mask-image: 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%23000' stroke='none'/%3E%3C/svg%3E");
}
.site-footer .footer-right a[aria-label*="WhatsApp"]::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M20.52 3.48A11.82 11.82 0 0 0 12.06 0C5.53 0 .2 5.3.2 11.83c0 2.08.54 4.11 1.57 5.9L0 24l6.44-1.69a11.8 11.8 0 0 0 5.62 1.43h.01c6.52 0 11.84-5.3 11.85-11.83a11.73 11.73 0 0 0-3.4-8.43Zm-8.46 18.27h-.01a9.83 9.83 0 0 1-5.01-1.38l-.36-.21-3.83 1 1.02-3.73-.24-.38a9.86 9.86 0 0 1-1.52-5.24c0-5.44 4.43-9.87 9.88-9.87 2.64 0 5.13 1.03 7 2.9a9.82 9.82 0 0 1 2.9 7c0 5.45-4.43 9.88-9.87 9.88Zm5.41-7.39c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.23-.65.08-.3-.15-1.27-.47-2.42-1.5-.89-.8-1.5-1.8-1.67-2.1-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.38-.02-.53-.08-.15-.67-1.62-.92-2.22-.24-.58-.48-.5-.67-.5h-.57c-.2 0-.53.08-.8.38-.27.3-1.03 1-1.03 2.44s1.05 2.82 1.2 3.02c.15.2 2.05 3.12 4.96 4.37.7.3 1.25.48 1.68.61.71.23 1.35.2 1.86.12.57-.08 1.76-.72 2-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M20.52 3.48A11.82 11.82 0 0 0 12.06 0C5.53 0 .2 5.3.2 11.83c0 2.08.54 4.11 1.57 5.9L0 24l6.44-1.69a11.8 11.8 0 0 0 5.62 1.43h.01c6.52 0 11.84-5.3 11.85-11.83a11.73 11.73 0 0 0-3.4-8.43Zm-8.46 18.27h-.01a9.83 9.83 0 0 1-5.01-1.38l-.36-.21-3.83 1 1.02-3.73-.24-.38a9.86 9.86 0 0 1-1.52-5.24c0-5.44 4.43-9.87 9.88-9.87 2.64 0 5.13 1.03 7 2.9a9.82 9.82 0 0 1 2.9 7c0 5.45-4.43 9.88-9.87 9.88Zm5.41-7.39c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.23-.65.08-.3-.15-1.27-.47-2.42-1.5-.89-.8-1.5-1.8-1.67-2.1-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.38-.02-.53-.08-.15-.67-1.62-.92-2.22-.24-.58-.48-.5-.67-.5h-.57c-.2 0-.53.08-.8.38-.27.3-1.03 1-1.03 2.44s1.05 2.82 1.2 3.02c.15.2 2.05 3.12 4.96 4.37.7.3 1.25.48 1.68.61.71.23 1.35.2 1.86.12.57-.08 1.76-.72 2-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35Z'/%3E%3C/svg%3E");
}
.site-footer .footer-right a[aria-label*="YouTube"]::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31.4 31.4 0 0 0 0 12a31.4 31.4 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31.4 31.4 0 0 0 24 12a31.4 31.4 0 0 0-.5-5.8ZM9.6 15.6V8.4L16 12l-6.4 3.6Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31.4 31.4 0 0 0 0 12a31.4 31.4 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31.4 31.4 0 0 0 24 12a31.4 31.4 0 0 0-.5-5.8ZM9.6 15.6V8.4L16 12l-6.4 3.6Z'/%3E%3C/svg%3E");
}

/* =========================
   HOTFIX V73: EQUIPO SMALL SIGNATURE (DESKTOP ONLY)
   ========================= */
body.page-equipo .miembro-sign-wrap{
  display: none !important;
}

@media (min-width: 981px){
  body.page-equipo .miembro--ivan{
    position: relative;
  }

  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    display: block !important;
    position: absolute;
    right: clamp(34px, 5.2vw, 116px);
    bottom: clamp(34px, 6.2vw, 108px);
    width: clamp(130px, 12.5vw, 206px);
    pointer-events: none;
    z-index: 2;
  }

  body.page-equipo .miembro--ivan .miembro-sign{
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
    opacity: .94;
  }

  body.page-equipo .miembro--ivan .miembro-sign--dark{
    display: none;
  }

  body.dark.page-equipo .miembro--ivan .miembro-sign--light{
    display: none;
  }

  body.dark.page-equipo .miembro--ivan .miembro-sign--dark{
    display: block;
    opacity: .95;
  }
}

@media (max-width: 980px){
  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    display: none !important;
  }
}

/* =========================
   HOTFIX V74: MAYAKOBA ADS STANDALONE PAGE
   ========================= */
body.page-mayakoba .mayakoba-info{
  position: relative;
  background: var(--paper);
  border-top: 1px solid var(--line);
  padding: clamp(58px, 7vw, 116px) var(--padX) clamp(64px, 9vw, 132px);
}

body.page-mayakoba .mayakoba-info-inner{
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  align-items: center;
  gap: clamp(28px, 5vw, 92px);
  max-width: 1480px;
  margin: 0 auto;
}

body.page-mayakoba .mayakoba-kicker{
  font-family: var(--display);
  font-size: clamp(.58rem, .86vw, .74rem);
  letter-spacing: .36em;
  text-transform: uppercase;
  color: var(--team-accent);
  opacity: .84;
  margin-bottom: 16px;
}

body.page-mayakoba .mayakoba-copy h2{
  font-family: var(--display);
  font-size: clamp(1.34rem, 3.15vw, 3.14rem);
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1.05;
  text-transform: uppercase;
  margin: 0 0 20px;
  color: var(--ink);
  max-width: 18ch;
}

body.page-mayakoba .mayakoba-copy p{
  margin: 0 0 14px;
  font-size: clamp(.88rem, 1.16vw, 1.14rem);
  line-height: 1.72;
  color: rgba(20,18,15,.86);
  max-width: 58ch;
}

body.page-mayakoba .mayakoba-icon{
  margin: 0;
  justify-self: end;
  width: clamp(220px, 32vw, 520px);
  max-width: 100%;
}

body.page-mayakoba .mayakoba-icon img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
  opacity: .94;
  filter: contrast(1.02);
}

body.dark.page-mayakoba .mayakoba-copy h2,
body.dark.page-mayakoba .mayakoba-copy p{
  color: rgba(255,255,255,.92);
}

body.dark.page-mayakoba .mayakoba-icon img{
  filter: brightness(0) invert(1) contrast(1.08);
  opacity: .92;
}

@media (max-width: 980px){
  body.page-mayakoba .mayakoba-info-inner{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  body.page-mayakoba .mayakoba-icon{
    justify-self: center;
    width: min(72vw, 360px);
  }
}

@media (max-width: 768px){
  body.page-mayakoba .mayakoba-info{
    padding-top: clamp(34px, 8vw, 52px);
    padding-bottom: clamp(36px, 10vw, 64px);
  }

  body.page-mayakoba .mayakoba-kicker{
    margin-bottom: 10px;
    font-size: .54rem;
    letter-spacing: .3em;
  }

  body.page-mayakoba .mayakoba-copy h2{
    font-size: clamp(1.02rem, 6.2vw, 1.48rem);
    line-height: 1.12;
    margin-bottom: 12px;
  }

  body.page-mayakoba .mayakoba-copy p{
    font-size: .9rem;
    line-height: 1.62;
    margin-bottom: 10px;
  }

  body.page-mayakoba .mayakoba-icon{
    width: min(78vw, 300px);
  }
}

/* =========================
   HOTFIX V75: MAYAKOBA ADS MEDIA + CTA
   ========================= */
body.page-mayakoba .mayakoba-reel,
body.page-mayakoba .mayakoba-real,
body.page-mayakoba .mayakoba-cta{
  background: var(--paper);
  border-top: 1px solid var(--line);
  padding: clamp(48px, 7vw, 110px) var(--padX);
}

body.page-mayakoba .mayakoba-block-head{
  max-width: 980px;
  margin: 0 auto clamp(24px, 3.5vw, 42px);
}

body.page-mayakoba .mayakoba-block-head h2,
body.page-mayakoba .mayakoba-cta h2{
  margin: 0 0 12px;
  font-family: var(--display);
  font-size: clamp(1.28rem, 3vw, 2.82rem);
  line-height: 1.06;
  letter-spacing: .01em;
  text-transform: uppercase;
}

body.page-mayakoba .mayakoba-block-head p,
body.page-mayakoba .mayakoba-cta p{
  margin: 0;
  color: rgba(20,18,15,.84);
  font-size: clamp(.88rem, 1.12vw, 1.04rem);
  line-height: 1.72;
}

body.page-mayakoba .mayakoba-reel-grid{
  max-width: 1480px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(10px, 1.2vw, 18px);
}

body.page-mayakoba .mayakoba-video-card{
  border: 1px solid rgba(20,18,15,.14);
  border-radius: 18px;
  overflow: hidden;
  background: #000;
  transform: translateY(0);
  transition: transform .4s var(--easeSoft), border-color .4s ease;
}

body.page-mayakoba .mayakoba-video-card:hover{
  transform: translateY(-4px);
  border-color: rgba(20,18,15,.28);
}

body.page-mayakoba .mayakoba-video-card video{
  display: block;
  width: 100%;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  background: #000;
}

body.page-mayakoba .mayakoba-photo-grid{
  max-width: 1480px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 1.5vw, 22px);
}

body.page-mayakoba .mayakoba-photo{
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(20,18,15,.14);
  background: #f8f6f2;
  min-height: clamp(200px, 20vw, 310px);
}

body.page-mayakoba .mayakoba-photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .6s var(--easeSoft);
}

body.page-mayakoba .mayakoba-photo:hover img{
  transform: scale(1.035);
}

body.page-mayakoba .mayakoba-cta{
  text-align: center;
  padding-bottom: clamp(52px, 8vw, 112px);
}

body.page-mayakoba .mayakoba-cta h2,
body.page-mayakoba .mayakoba-cta p{
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

body.page-mayakoba .mayakoba-cta p{
  margin-top: 12px;
}

body.page-mayakoba .mayakoba-cta-actions{
  margin-top: clamp(20px, 3vw, 34px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

body.page-mayakoba .mayakoba-cta .final-button{
  min-width: min(90vw, 320px);
  justify-content: center;
}

body.page-mayakoba .mayakoba-cta .final-secondary{
  min-width: min(90vw, 250px);
}

body.page-mayakoba .project-media .mayakoba-card-video{
  opacity: .98;
}

body.dark.page-mayakoba .mayakoba-block-head p,
body.dark.page-mayakoba .mayakoba-cta p{
  color: rgba(255,255,255,.86);
}

body.dark.page-mayakoba .mayakoba-video-card,
body.dark.page-mayakoba .mayakoba-photo{
  border-color: rgba(255,255,255,.2);
  background: #0c0c0c;
}

@media (max-width: 1200px){
  body.page-mayakoba .mayakoba-reel-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.page-mayakoba .mayakoba-photo-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px){
  body.page-mayakoba .mayakoba-reel-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.page-mayakoba .mayakoba-photo-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px){
  body.page-mayakoba .mayakoba-reel,
  body.page-mayakoba .mayakoba-real,
  body.page-mayakoba .mayakoba-cta{
    padding-top: clamp(32px, 8vw, 48px);
    padding-bottom: clamp(36px, 10vw, 62px);
  }

  body.page-mayakoba .mayakoba-block-head{
    margin-bottom: 16px;
  }

  body.page-mayakoba .mayakoba-block-head h2,
  body.page-mayakoba .mayakoba-cta h2{
    font-size: clamp(1.02rem, 6.2vw, 1.46rem);
    line-height: 1.12;
    margin-bottom: 8px;
  }

  body.page-mayakoba .mayakoba-block-head p,
  body.page-mayakoba .mayakoba-cta p{
    font-size: .9rem;
    line-height: 1.6;
  }

  body.page-mayakoba .mayakoba-reel-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body.page-mayakoba .mayakoba-video-card video{
    aspect-ratio: 9 / 16;
  }

  body.page-mayakoba .mayakoba-photo-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body.page-mayakoba .mayakoba-photo{
    min-height: 230px;
    border-radius: 14px;
  }

  body.page-mayakoba .mayakoba-cta-actions{
    width: 100%;
    display: flex;
    gap: 10px;
  }

  body.page-mayakoba .mayakoba-cta .final-button,
  body.page-mayakoba .mayakoba-cta .final-secondary{
    width: 100%;
    min-width: 0;
  }
}

/* =========================
   HOTFIX V76: MAYAKOBA EDITORIAL POLISH
   ========================= */
body.page-mayakoba .projects .project-title h2{
  font-size: clamp(1.52rem, 3.45vw, 3.46rem);
  letter-spacing: .1em;
  line-height: 1.02;
}

body.page-mayakoba .projects .project-title p{
  font-size: clamp(.58rem, .78vw, .76rem);
  letter-spacing: .34em;
  opacity: .92;
}

body.page-mayakoba .mayakoba-info,
body.page-mayakoba .mayakoba-reel,
body.page-mayakoba .mayakoba-real,
body.page-mayakoba .mayakoba-cta{
  background:
    radial-gradient(560px 280px at 8% 0%, rgba(194,158,92,0.045), transparent 72%),
    radial-gradient(420px 220px at 92% 100%, rgba(47,59,51,0.04), transparent 74%),
    var(--paper);
}

body.page-mayakoba .mayakoba-kicker{
  font-size: clamp(.62rem, .84vw, .8rem);
  letter-spacing: .38em;
  font-weight: 700;
  opacity: .9;
}

body.page-mayakoba .mayakoba-copy h2,
body.page-mayakoba .mayakoba-block-head h2,
body.page-mayakoba .mayakoba-cta h2{
  font-size: clamp(1.7rem, 4.6vw, 4.6rem);
  line-height: .98;
  letter-spacing: -.012em;
  max-width: 13.5ch;
  text-wrap: balance;
}

body.page-mayakoba .mayakoba-copy p,
body.page-mayakoba .mayakoba-block-head p,
body.page-mayakoba .mayakoba-cta p{
  font-size: clamp(.92rem, 1.12vw, 1.1rem);
  line-height: 1.78;
  max-width: 66ch;
}

body.page-mayakoba .mayakoba-pillars{
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

body.page-mayakoba .mayakoba-pillars span{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(20,18,15,.22);
  padding: 8px 14px;
  font-family: var(--display);
  font-size: .64rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(20,18,15,.82);
  background: rgba(255,255,255,.64);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

body.page-mayakoba .mayakoba-block-head{
  margin-bottom: clamp(26px, 3.9vw, 54px);
}

body.page-mayakoba .mayakoba-reel-grid,
body.page-mayakoba .mayakoba-photo-grid{
  gap: clamp(12px, 1.5vw, 24px);
}

body.page-mayakoba .mayakoba-video-card,
body.page-mayakoba .mayakoba-photo{
  border-radius: 20px;
}

body.page-mayakoba .mayakoba-video-card{
  box-shadow: 0 18px 38px rgba(0,0,0,.12);
}

body.page-mayakoba .mayakoba-cta .final-button{
  font-size: clamp(.72rem, .84vw, .82rem);
  letter-spacing: .28em;
}

body.page-mayakoba .mayakoba-cta .final-secondary{
  letter-spacing: .26em;
}

body.dark.page-mayakoba .mayakoba-pillars span{
  border-color: rgba(255,255,255,.24);
  color: rgba(255,255,255,.9);
  background: rgba(255,255,255,.04);
}

@media (max-width: 980px){
  body.page-mayakoba .mayakoba-copy h2,
  body.page-mayakoba .mayakoba-block-head h2,
  body.page-mayakoba .mayakoba-cta h2{
    max-width: 18ch;
    font-size: clamp(1.28rem, 5.4vw, 2.2rem);
    line-height: 1.03;
  }

  body.page-mayakoba .mayakoba-copy p,
  body.page-mayakoba .mayakoba-block-head p,
  body.page-mayakoba .mayakoba-cta p{
    max-width: 100%;
  }
}

@media (max-width: 768px){
  body.page-mayakoba .projects .project-title h2{
    font-size: clamp(1.08rem, 7vw, 1.78rem);
    letter-spacing: .08em;
  }

  body.page-mayakoba .projects .project-title p{
    font-size: .58rem;
    letter-spacing: .29em;
  }

  body.page-mayakoba .mayakoba-kicker{
    font-size: .56rem;
    letter-spacing: .31em;
  }

  body.page-mayakoba .mayakoba-copy h2,
  body.page-mayakoba .mayakoba-block-head h2,
  body.page-mayakoba .mayakoba-cta h2{
    font-size: clamp(1.14rem, 6.8vw, 1.7rem);
    line-height: 1.1;
    max-width: 100%;
  }

  body.page-mayakoba .mayakoba-copy p,
  body.page-mayakoba .mayakoba-block-head p,
  body.page-mayakoba .mayakoba-cta p{
    font-size: .92rem;
    line-height: 1.64;
  }

  body.page-mayakoba .mayakoba-pillars{
    margin-top: 14px;
    gap: 8px;
  }

  body.page-mayakoba .mayakoba-pillars span{
    width: auto;
    padding: 7px 11px;
    font-size: .56rem;
    letter-spacing: .18em;
  }
}

/* =========================
   HOTFIX V77: MAYAKOBA MOBILE SWIPE GALLERIES + COPY TUNE
   ========================= */
@media (max-width: 768px){
  body.page-mayakoba .mayakoba-block-head{
    margin-bottom: 14px;
    padding-right: 2px;
  }

  body.page-mayakoba .mayakoba-block-head h2,
  body.page-mayakoba .mayakoba-cta h2{
    font-size: clamp(1.18rem, 7.2vw, 1.86rem);
    letter-spacing: -0.01em;
    line-height: 1.08;
    text-transform: none;
  }

  body.page-mayakoba .mayakoba-block-head p,
  body.page-mayakoba .mayakoba-copy p,
  body.page-mayakoba .mayakoba-cta p{
    font-size: .95rem;
    line-height: 1.66;
    color: rgba(20,18,15,.82);
  }

  body.page-mayakoba .mayakoba-reel-grid,
  body.page-mayakoba .mayakoba-photo-grid{
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: none;
    grid-auto-columns: min(82vw, 360px);
    gap: 12px;

    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;

    padding: 2px max(0px, calc(var(--padX) - 6px)) 10px;
    margin-left: calc(var(--padX) * -1);
    margin-right: calc(var(--padX) * -1);
  }

  body.page-mayakoba .mayakoba-reel-grid::-webkit-scrollbar,
  body.page-mayakoba .mayakoba-photo-grid::-webkit-scrollbar{
    display: none;
  }

  body.page-mayakoba .mayakoba-video-card,
  body.page-mayakoba .mayakoba-photo{
    scroll-snap-align: start;
    scroll-snap-stop: always;
    border-radius: 14px;
  }

  body.page-mayakoba .mayakoba-video-card video{
    aspect-ratio: 9 / 16;
  }

  body.page-mayakoba .mayakoba-photo{
    min-height: 0;
  }

  body.page-mayakoba .mayakoba-photo img{
    aspect-ratio: 4 / 5;
    height: auto;
  }

  body.page-mayakoba .mayakoba-reel::after,
  body.page-mayakoba .mayakoba-real::after{
    content: "desliza para ver mas";
    display: block;
    margin-top: 8px;
    font-family: var(--display);
    font-size: .53rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: rgba(20,18,15,.54);
  }

  body.dark.page-mayakoba .mayakoba-block-head p,
  body.dark.page-mayakoba .mayakoba-copy p,
  body.dark.page-mayakoba .mayakoba-cta p{
    color: rgba(255,255,255,.84);
  }

  body.dark.page-mayakoba .mayakoba-reel::after,
  body.dark.page-mayakoba .mayakoba-real::after{
    color: rgba(255,255,255,.5);
  }
}

/* =========================
   HOTFIX V78: MAYAKOBA MOBILE AUTOPLAY FLOW
   ========================= */
@media (max-width: 768px){
  body.page-mayakoba .reveal{
    filter: none;
    transition-duration: .55s;
  }

  body.page-mayakoba .mayakoba-reel-grid,
  body.page-mayakoba .mayakoba-photo-grid{
    scroll-padding-left: var(--padX);
    scroll-padding-right: var(--padX);
    overscroll-behavior-x: contain;
    touch-action: pan-x;
    padding-bottom: 14px;
  }

  body.page-mayakoba .mayakoba-video-card,
  body.page-mayakoba .mayakoba-photo{
    contain: layout paint;
    transform: translateZ(0);
    will-change: transform;
  }

  body.page-mayakoba .mayakoba-video-card video{
    transform: translateZ(0);
    backface-visibility: hidden;
  }

  body.page-mayakoba .mayakoba-copy p + p{
    margin-top: 8px;
  }

  body.page-mayakoba .mayakoba-cta{
    padding-top: clamp(30px, 8vw, 44px);
  }
}

/* =========================
   HOTFIX V79: MAYAKOBA INFO WITHOUT ICON
   ========================= */
body.page-mayakoba .mayakoba-info-inner.mayakoba-info-inner--solo{
  grid-template-columns: minmax(0, 1fr);
  max-width: 1180px;
}

body.page-mayakoba .mayakoba-info-inner.mayakoba-info-inner--solo .mayakoba-copy{
  max-width: 100%;
}


/* =========================
   HOTFIX V80: CRITICAL BRAND CONSISTENCY (LOGO + FOOTER ICON MODE)
   ========================= */
/* 1) Use image logo only on project + form to avoid overlap text artifacts */
body.page-proyecto .project-logo,
body.page-form .page-logo.page-logo-box{
  width: clamp(186px, 18.4vw, 312px) !important;
  max-width: min(74vw, 312px) !important;
  aspect-ratio: 1080 / 219 !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  background-image: url("assets/branding/logos/ivan-facio-logo-black.png") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: 100% auto !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  overflow: visible !important;
}

body.dark.page-proyecto .project-logo,
body.dark.page-form .page-logo.page-logo-box,
body.dark.page-desarrollo .page-logo.page-logo-box,
body.dark.page-equipo .page-logo.page-logo-box,
body.dark.page-contacto .page-logo.page-logo-box{
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

body.dark :is(.site-logo, .about-logo){
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

body.page-proyecto .project-logo::before,
body.page-proyecto .project-logo::after,
body.page-form .page-logo.page-logo-box::before,
body.page-form .page-logo.page-logo-box::after{
  content: none !important;
  display: none !important;
}

body.page-form .page-logo.page-logo-box > .page-logo-main,
body.page-form .page-logo.page-logo-box > .page-logo-sub,
body.page-proyecto .project-logo > *{
  display: none !important;
}

@media (max-width: 980px){
  body.page-proyecto .project-logo,
  body.page-form .page-logo.page-logo-box{
    width: clamp(172px, 50vw, 272px) !important;
  }
}

/* 2) Footer socials as true icons with strict black/white by color mode */
.site-footer .footer-right a{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 1.1rem;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  color: #111 !important;
  opacity: .95;
}

body.dark .site-footer .footer-right a,
body.dark.page-contacto .site-footer .footer-right a{
  color: #fff !important;
}

body.dark .site-footer .footer-left,
body.dark.page-contacto .site-footer .footer-left{
  color: #fff !important;
}

.site-footer .footer-right a::after{
  content: none !important;
}

.site-footer .footer-right a::before{
  content: "";
  width: 16px;
  height: 16px;
  display: block;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.site-footer .footer-right a[aria-label*="Instagram"]::before{
  -webkit-mask-image: 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  mask-image: 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%23000' stroke='none'/%3E%3C/svg%3E");
}

.site-footer .footer-right a[aria-label*="WhatsApp"]::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M20.52 3.48A11.82 11.82 0 0 0 12.06 0C5.53 0 .2 5.3.2 11.83c0 2.08.54 4.11 1.57 5.9L0 24l6.44-1.69a11.8 11.8 0 0 0 5.62 1.43h.01c6.52 0 11.84-5.3 11.85-11.83a11.73 11.73 0 0 0-3.4-8.43Zm-8.46 18.27h-.01a9.83 9.83 0 0 1-5.01-1.38l-.36-.21-3.83 1 1.02-3.73-.24-.38a9.86 9.86 0 0 1-1.52-5.24c0-5.44 4.43-9.87 9.88-9.87 2.64 0 5.13 1.03 7 2.9a9.82 9.82 0 0 1 2.9 7c0 5.45-4.43 9.88-9.87 9.88Zm5.41-7.39c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.23-.65.08-.3-.15-1.27-.47-2.42-1.5-.89-.8-1.5-1.8-1.67-2.1-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.38-.02-.53-.08-.15-.67-1.62-.92-2.22-.24-.58-.48-.5-.67-.5h-.57c-.2 0-.53.08-.8.38-.27.3-1.03 1-1.03 2.44s1.05 2.82 1.2 3.02c.15.2 2.05 3.12 4.96 4.37.7.3 1.25.48 1.68.61.71.23 1.35.2 1.86.12.57-.08 1.76-.72 2-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M20.52 3.48A11.82 11.82 0 0 0 12.06 0C5.53 0 .2 5.3.2 11.83c0 2.08.54 4.11 1.57 5.9L0 24l6.44-1.69a11.8 11.8 0 0 0 5.62 1.43h.01c6.52 0 11.84-5.3 11.85-11.83a11.73 11.73 0 0 0-3.4-8.43Zm-8.46 18.27h-.01a9.83 9.83 0 0 1-5.01-1.38l-.36-.21-3.83 1 1.02-3.73-.24-.38a9.86 9.86 0 0 1-1.52-5.24c0-5.44 4.43-9.87 9.88-9.87 2.64 0 5.13 1.03 7 2.9a9.82 9.82 0 0 1 2.9 7c0 5.45-4.43 9.88-9.87 9.88Zm5.41-7.39c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.23-.65.08-.3-.15-1.27-.47-2.42-1.5-.89-.8-1.5-1.8-1.67-2.1-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.38-.02-.53-.08-.15-.67-1.62-.92-2.22-.24-.58-.48-.5-.67-.5h-.57c-.2 0-.53.08-.8.38-.27.3-1.03 1-1.03 2.44s1.05 2.82 1.2 3.02c.15.2 2.05 3.12 4.96 4.37.7.3 1.25.48 1.68.61.71.23 1.35.2 1.86.12.57-.08 1.76-.72 2-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35Z'/%3E%3C/svg%3E");
}

.site-footer .footer-right a[aria-label*="YouTube"]::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31.4 31.4 0 0 0 0 12a31.4 31.4 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31.4 31.4 0 0 0 24 12a31.4 31.4 0 0 0-.5-5.8ZM9.6 15.6V8.4L16 12l-6.4 3.6Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31.4 31.4 0 0 0 0 12a31.4 31.4 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31.4 31.4 0 0 0 24 12a31.4 31.4 0 0 0-.5-5.8ZM9.6 15.6V8.4L16 12l-6.4 3.6Z'/%3E%3C/svg%3E");
}


/* =========================
   HOTFIX V81: PROJECT DUO GALLERY + DESARROLLO ICON-FIRST ORDER
   ========================= */
/* Project pages: 2 bloques (fachada fija + carrusel) */
body.page-proyecto .project-gallery-grid.project-gallery-grid--duo{
  grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr) !important;
  gap: clamp(16px, 2.4vw, 26px) !important;
}

body.page-proyecto .project-shot--facade{
  grid-row: auto !important;
  min-height: clamp(260px, 36vw, 480px) !important;
}

body.page-proyecto .project-shot--slider{
  min-height: clamp(260px, 36vw, 480px) !important;
}

body.page-proyecto .project-shot-slider{
  position: relative;
  width: 100%;
  height: 100%;
  min-height: inherit;
  overflow: hidden;
}

body.page-proyecto .project-shot-slider-track{
  position: relative;
  width: 100%;
  height: 100%;
}

body.page-proyecto .project-shot-slide{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.02);
  transition: opacity .36s ease, transform .52s var(--easeSoft);
}

body.page-proyecto .project-shot-slide.is-active{
  opacity: 1;
  z-index: 2;
}

body.page-proyecto .project-shot--slider .shot-overlay{
  pointer-events: none;
}

body.page-proyecto .project-shot-arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 999px;
  background: rgba(0,0,0,.38);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 4;
  transition: transform .2s var(--easeSoft), opacity .2s ease;
}

body.page-proyecto .project-shot-arrow:hover{
  transform: translateY(-50%) scale(1.05);
  opacity: .95;
}

body.page-proyecto .project-shot-arrow--prev{ left: 12px; }
body.page-proyecto .project-shot-arrow--next{ right: 12px; }

body.page-proyecto .project-shot-counter{
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  min-width: 64px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.4);
  border: 1px solid rgba(255,255,255,.35);
  color: #fff;
  font-family: var(--display);
  font-size: .56rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-align: center;
  z-index: 4;
}

body.page-proyecto .project-shot-swipe-hint{
  display: none;
}

body.page-proyecto .project-shot--slider.is-single .project-shot-arrow,
body.page-proyecto .project-shot--slider.is-single .project-shot-counter,
body.page-proyecto .project-shot--slider.is-single .project-shot-swipe-hint{
  display: none !important;
}

body.page-proyecto .project-media-column .project-gallery-grid.project-gallery-grid--duo{
  grid-template-columns: 1fr !important;
}

body.page-proyecto .project-media-column .project-shot--facade,
body.page-proyecto .project-media-column .project-shot--slider{
  min-height: clamp(280px, 38vw, 620px) !important;
}

@media (max-width: 980px){
  body.page-proyecto .project-gallery-grid.project-gallery-grid--duo{
    grid-template-columns: 1fr !important;
  }

  body.page-proyecto .project-shot-arrow,
  body.page-proyecto .project-shot-counter{
    display: none !important;
  }

  body.page-proyecto .project-shot-slider{
    touch-action: pan-x;
  }

  body.page-proyecto .project-shot-swipe-hint{
    position: absolute;
    right: 10px;
    bottom: 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.5);
    background: rgba(0,0,0,.35);
    z-index: 4;
  }

  body.page-proyecto .project-shot-swipe-hint .swipe-chevron{
    width: 7px;
    height: 7px;
    border-top: 1.4px solid rgba(255,255,255,.95);
    border-right: 1.4px solid rgba(255,255,255,.95);
    display: block;
  }

  body.page-proyecto .project-shot-swipe-hint .swipe-chevron--left{
    transform: rotate(-135deg);
    opacity: .88;
  }

  body.page-proyecto .project-shot-swipe-hint .swipe-chevron--right{
    transform: rotate(45deg);
    opacity: .88;
  }

  body.page-proyecto .project-shot-swipe-hint .swipe-dot{
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(255,255,255,.92);
    opacity: .66;
  }
}

/* =========================
   HOTFIX V82: REMOVE LEGACY OVERLAY LOGO IN PROJECT PAGES
   ========================= */
body.page-proyecto #fixedDevLikeLogo{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.page-proyecto .project-header .project-logo{
  color: transparent !important;
  text-indent: -9999px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

body.page-proyecto .project-header .project-logo::before,
body.page-proyecto .project-header .project-logo::after{
  content: none !important;
  display: none !important;
}


/* =========================
   HOTFIX V83: DESARROLLO ICON CARDS RESTORE (ICONS BIG, NAMES ONLY FOR NO-ICON)
   ========================= */
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon{
  min-height: clamp(260px, 30vh, 360px) !important;
  padding: clamp(16px, 1.8vw, 26px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  isolation: isolate !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-icon{
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  position: absolute !important;
  width: clamp(206px, 18vw, 310px) !important;
  height: clamp(206px, 18vw, 310px) !important;
  transform: translate(-50%, -50%) scale(1) !important;
  opacity: .9 !important;
  filter: grayscale(1) contrast(1.2) !important;
  transition: transform .22s cubic-bezier(.22,1,.2,1), opacity .22s ease !important;
  z-index: 3 !important;
  margin-top: 0 !important;
}

body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-icon{
  filter: invert(1) brightness(1.24) contrast(1.1) !important;
  opacity: .92 !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon:hover .dev-project-icon{
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(1.11) !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-footer,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-cat,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-name,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-meta{
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

@media (min-width: 981px) and (hover: hover) and (pointer: fine){
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-hover-title{
    display: inline-flex !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -158%) !important;
    align-items: center !important;
    justify-content: center !important;
    max-width: min(90%, 320px) !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,0.24) !important;
    background: rgba(0,0,0,0.56) !important;
    color: #fff !important;
    font-family: var(--display) !important;
    font-size: clamp(.72rem, .9vw, .98rem) !important;
    font-weight: 600 !important;
    letter-spacing: .12em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity .18s ease, transform .18s cubic-bezier(.22,1,.2,1) !important;
    z-index: 5 !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,0.22) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon:hover .dev-hover-title{
    opacity: 1 !important;
    transform: translate(-50%, -170%) !important;
  }
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card{
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(255,255,255,0.18), rgba(255,255,255,0.05)) !important;
  justify-content: center !important;
  min-height: 166px !important;
  padding: 14px 12px !important;
}

body.dark.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card{
  background: linear-gradient(145deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)) !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-footer,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-name,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-meta{
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  text-align: center !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-name{
  font-size: clamp(.64rem, .78vw, .86rem) !important;
  letter-spacing: .16em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-meta{
  margin-top: 4px !important;
  font-size: clamp(.46rem, .56vw, .6rem) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}

@media (max-width: 680px){
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-icon{
    width: 96px !important;
    height: 96px !important;
  }
}

/* =========================
   HOTFIX V84: MENU BOTTOM CTA + SOCIAL ICONS
   ========================= */
.menu-overlay .menu-bottom{
  position: absolute;
  left: var(--padX);
  right: var(--padX);
  bottom: calc(28px + env(safe-area-inset-bottom));
  z-index: 3;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  pointer-events: none;
}

.menu-overlay .menu-bottom > *{
  pointer-events: auto;
}

.menu-overlay .menu-interview-link{
  font-family: var(--sans);
  font-size: clamp(.64rem, 1.4vw, .8rem);
  font-weight: 700;
  letter-spacing: .22em;
  line-height: 1;
  text-transform: uppercase;
  color: #d39a56;
  text-decoration: none;
  transition: color .2s ease, transform .2s ease;
}

.menu-overlay .menu-interview-link:hover,
.menu-overlay .menu-interview-link:focus-visible{
  color: #f0bb7d;
  transform: translateY(-1px);
}

.menu-overlay .menu-socials{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.menu-overlay .menu-social{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.9);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform .22s ease, color .22s ease, border-color .22s ease, background-color .22s ease;
}

.menu-overlay .menu-social svg{
  width: 16px;
  height: 16px;
  display: block;
}

.menu-overlay .menu-social:hover,
.menu-overlay .menu-social:focus-visible{
  color: #fff;
  border-color: rgba(255,255,255,.56);
  background: rgba(255,255,255,.1);
  transform: translateY(-1px);
}

@media (min-width: 769px){
  .menu-overlay .menu-bottom{
    left: clamp(26px, 4vw, 60px);
    right: clamp(26px, 4vw, 60px);
    bottom: calc(26px + env(safe-area-inset-bottom));
  }

  .menu-overlay .menu-interview-link{
    font-size: clamp(.58rem, .88vw, .74rem);
    letter-spacing: .24em;
  }

  .menu-overlay .menu-social{
    width: 32px;
    height: 32px;
  }
}

@media (max-width: 768px){
  .menu-overlay .menu-bottom{
    bottom: calc(24px + env(safe-area-inset-bottom));
  }

  .menu-overlay .menu-interview-link{
    font-size: .62rem;
    letter-spacing: .2em;
  }

  .menu-overlay .menu-social{
    width: 30px;
    height: 30px;
  }

  .menu-overlay .menu-social svg{
    width: 14px;
    height: 14px;
  }
}

body.creative .menu-overlay .menu-social{
  color: rgba(11,11,11,.82);
  border-color: rgba(11,11,11,.22);
  background: rgba(11,11,11,.03);
}

body.creative .menu-overlay .menu-social:hover,
body.creative .menu-overlay .menu-social:focus-visible{
  color: rgba(11,11,11,.98);
  border-color: rgba(11,11,11,.44);
  background: rgba(11,11,11,.08);
}

body.creative .menu-overlay .menu-interview-link{
  color: #9f6328;
}

body.creative .menu-overlay .menu-interview-link:hover,
body.creative .menu-overlay .menu-interview-link:focus-visible{
  color: #7b4a1e;
}

/* =========================
   HOTFIX V85: PROJECT LOGO OFF + MENU SECTION STYLING
   ========================= */
body.page-proyecto .project-header .project-logo{
  display: none !important;
}

body.page-proyecto .project-header{
  justify-content: flex-end !important;
}

.menu-overlay .menu-bottom.menu-section{
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: min(92vw, 620px) !important;
  margin-top: clamp(10px, 2vh, 22px) !important;
  padding-top: clamp(8px, 1.3vh, 14px) !important;
  border-top: 1px solid rgba(255,255,255,.16) !important;
  display: grid !important;
  justify-items: start !important;
  align-items: center !important;
  gap: clamp(10px, 1.4vh, 14px) !important;
}

.menu-overlay .menu-bottom .menu-section-link,
.menu-overlay .menu-bottom .menu-interview-link{
  font-family: var(--display) !important;
  font-size: clamp(1rem, 2.2vw, 1.52rem) !important;
  font-weight: 560 !important;
  line-height: 1.02 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
  color: #d39a56 !important;
  text-decoration: none !important;
  opacity: .96 !important;
}

.menu-overlay .menu-bottom .menu-interview-link:hover,
.menu-overlay .menu-bottom .menu-interview-link:focus-visible{
  color: #efbc80 !important;
  letter-spacing: .065em !important;
  transform: translateX(0) !important;
}

.menu-overlay .menu-bottom .menu-socials{
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.menu-overlay .menu-bottom .menu-social{
  width: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  background: rgba(255,255,255,.05) !important;
  color: rgba(255,255,255,.94) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}

.menu-overlay .menu-bottom .menu-social svg{
  width: 16px !important;
  height: 16px !important;
}

.menu-overlay .menu-bottom .menu-social:hover,
.menu-overlay .menu-bottom .menu-social:focus-visible{
  color: #fff !important;
  border-color: rgba(255,255,255,.56) !important;
  background: rgba(255,255,255,.12) !important;
  transform: translateY(-1px) !important;
}

@media (max-width: 768px){
  .menu-overlay .menu-bottom.menu-section{
    margin-top: 8px !important;
    padding-top: 8px !important;
    gap: 10px !important;
  }

  .menu-overlay .menu-bottom .menu-interview-link{
    font-size: clamp(.88rem, 5.1vw, 1.14rem) !important;
    letter-spacing: .04em !important;
  }
}

body.creative .menu-overlay .menu-bottom.menu-section{
  border-top-color: rgba(11,11,11,.18) !important;
}

body.creative .menu-overlay .menu-bottom .menu-interview-link{
  color: #9f6328 !important;
}

body.creative .menu-overlay .menu-bottom .menu-social{
  color: rgba(11,11,11,.88) !important;
  border-color: rgba(11,11,11,.24) !important;
  background: rgba(11,11,11,.04) !important;
}

body.creative .menu-overlay .menu-bottom .menu-social:hover,
body.creative .menu-overlay .menu-bottom .menu-social:focus-visible{
  color: rgba(11,11,11,.98) !important;
  border-color: rgba(11,11,11,.44) !important;
  background: rgba(11,11,11,.1) !important;
}

/* refine menu section overrides */
.menu-overlay .menu-bottom .menu-interview-link,
.menu-overlay .menu-bottom .menu-social{
  transform: none !important;
  opacity: 1 !important;
  max-width: none !important;
  letter-spacing: inherit;
}

/* =========================
   HOTFIX V86: MENU CLEAN + COMPACT INTERVIEW + VISIBLE SOCIAL ICONS
   ========================= */
.menu-overlay .menu-line{
  display: none !important;
}

.menu-overlay .menu-bottom.menu-section{
  border-top: none !important;
  padding-top: 0 !important;
  margin-top: clamp(6px, 1.2vh, 12px) !important;
  gap: clamp(6px, .9vh, 10px) !important;
}

.menu-overlay .menu-bottom .menu-interview-link{
  font-family: var(--display) !important;
  font-size: clamp(.52rem, .9vw, .74rem) !important;
  font-weight: 560 !important;
  line-height: 1.1 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}

@media (max-width: 768px){
  .menu-overlay .menu-bottom .menu-interview-link{
    font-size: clamp(.48rem, 2.6vw, .66rem) !important;
    letter-spacing: .14em !important;
  }
}

.menu-overlay .menu-bottom .menu-socials{
  gap: 10px !important;
}

.menu-overlay .menu-bottom .menu-social{
  width: 30px !important;
  height: 30px !important;
  border-width: 1.2px !important;
}

.menu-overlay .menu-bottom .menu-social svg{
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  opacity: 1 !important;
}

.menu-overlay .menu-bottom .menu-social svg *{
  vector-effect: non-scaling-stroke;
}

body.dark .menu-overlay .menu-bottom .menu-interview-link{
  color: #d39a56 !important;
}

body.dark .menu-overlay .menu-bottom .menu-interview-link:hover,
body.dark .menu-overlay .menu-bottom .menu-interview-link:focus-visible{
  color: #efbc80 !important;
}

body.dark .menu-overlay .menu-bottom .menu-social{
  color: rgba(255,255,255,.96) !important;
  border-color: rgba(255,255,255,.4) !important;
  background: rgba(255,255,255,.08) !important;
}

body.dark .menu-overlay .menu-bottom .menu-social:hover,
body.dark .menu-overlay .menu-bottom .menu-social:focus-visible{
  color: #fff !important;
  border-color: rgba(255,255,255,.66) !important;
  background: rgba(255,255,255,.16) !important;
}

body:not(.dark) .menu-overlay .menu-bottom .menu-interview-link{
  color: #9f6328 !important;
}

body:not(.dark) .menu-overlay .menu-bottom .menu-interview-link:hover,
body:not(.dark) .menu-overlay .menu-bottom .menu-interview-link:focus-visible{
  color: #7b4a1e !important;
}

body:not(.dark) .menu-overlay .menu-bottom .menu-social{
  color: rgba(11,11,11,.95) !important;
  border-color: rgba(11,11,11,.34) !important;
  background: rgba(11,11,11,.05) !important;
}

body:not(.dark) .menu-overlay .menu-bottom .menu-social:hover,
body:not(.dark) .menu-overlay .menu-bottom .menu-social:focus-visible{
  color: #111 !important;
  border-color: rgba(11,11,11,.6) !important;
  background: rgba(11,11,11,.12) !important;
}

/* =========================
   HOTFIX V87: PROJECT LOGO FINAL FIX
   ========================= */
body.page-proyecto .project-header{
  justify-content: space-between !important;
}

body.page-proyecto .project-header .project-logo{
  display: block !important;
  width: clamp(178px, 16.8vw, 286px) !important;
  max-width: min(68vw, 286px) !important;
  aspect-ratio: 1080 / 219 !important;
  height: auto !important;
  background-image: url("assets/branding/logos/ivan-facio-logo-black.png") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: 100% auto !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

body.dark.page-proyecto .project-header .project-logo{
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

body.page-proyecto .project-header .project-logo::before,
body.page-proyecto .project-header .project-logo::after{
  content: none !important;
  display: none !important;
}

@media (max-width: 980px){
  body.page-proyecto .project-header .project-logo{
    width: clamp(156px, 50vw, 230px) !important;
  }
}

/* =========================
   HOTFIX V88: MENU CTA TINY + REAL SOCIAL ICONS (NO CIRCLES)
   ========================= */
.menu-overlay .menu-bottom .menu-section-link.menu-interview-link{
  font-size: clamp(1.08rem, 2.05vw, 1.62rem) !important;
  letter-spacing: .04em !important;
  line-height: .98 !important;
}

@media (max-width: 768px){
  .menu-overlay .menu-bottom .menu-section-link.menu-interview-link{
    font-size: clamp(.94rem, 5.1vw, 1.28rem) !important;
    letter-spacing: .03em !important;
  }
}

.menu-overlay .menu-bottom .menu-social{
  position: relative !important;
  width: 18px !important;
  height: 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

.menu-overlay .menu-bottom .menu-socials{
  margin-top: clamp(12px, 1.8vh, 22px) !important;
  gap: 16px !important;
}

.menu-overlay .menu-bottom .menu-social svg{
  display: none !important;
}

.menu-overlay .menu-bottom .menu-social::before{
  content: "" !important;
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  background-color: currentColor !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
}

.menu-overlay .menu-bottom .menu-social--ig::before{
  -webkit-mask-image: 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%23000' stroke='none'/%3E%3C/svg%3E") !important;
  mask-image: 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%23000' stroke='none'/%3E%3C/svg%3E") !important;
}

.menu-overlay .menu-bottom .menu-social--wp::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M20.52 3.48A11.82 11.82 0 0 0 12.06 0C5.53 0 .2 5.3.2 11.83c0 2.08.54 4.11 1.57 5.9L0 24l6.44-1.69a11.8 11.8 0 0 0 5.62 1.43h.01c6.52 0 11.84-5.3 11.85-11.83a11.73 11.73 0 0 0-3.4-8.43Zm-8.46 18.27h-.01a9.83 9.83 0 0 1-5.01-1.38l-.36-.21-3.83 1 1.02-3.73-.24-.38a9.86 9.86 0 0 1-1.52-5.24c0-5.44 4.43-9.87 9.88-9.87 2.64 0 5.13 1.03 7 2.9a9.82 9.82 0 0 1 2.9 7c0 5.45-4.43 9.88-9.87 9.88Zm5.41-7.39c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.23-.65.08-.3-.15-1.27-.47-2.42-1.5-.89-.8-1.5-1.8-1.67-2.1-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.38-.02-.53-.08-.15-.67-1.62-.92-2.22-.24-.58-.48-.5-.67-.5h-.57c-.2 0-.53.08-.8.38-.27.3-1.03 1-1.03 2.44s1.05 2.82 1.2 3.02c.15.2 2.05 3.12 4.96 4.37.7.3 1.25.48 1.68.61.71.23 1.35.2 1.86.12.57-.08 1.76-.72 2-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35Z'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M20.52 3.48A11.82 11.82 0 0 0 12.06 0C5.53 0 .2 5.3.2 11.83c0 2.08.54 4.11 1.57 5.9L0 24l6.44-1.69a11.8 11.8 0 0 0 5.62 1.43h.01c6.52 0 11.84-5.3 11.85-11.83a11.73 11.73 0 0 0-3.4-8.43Zm-8.46 18.27h-.01a9.83 9.83 0 0 1-5.01-1.38l-.36-.21-3.83 1 1.02-3.73-.24-.38a9.86 9.86 0 0 1-1.52-5.24c0-5.44 4.43-9.87 9.88-9.87 2.64 0 5.13 1.03 7 2.9a9.82 9.82 0 0 1 2.9 7c0 5.45-4.43 9.88-9.87 9.88Zm5.41-7.39c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.23-.65.08-.3-.15-1.27-.47-2.42-1.5-.89-.8-1.5-1.8-1.67-2.1-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.38-.02-.53-.08-.15-.67-1.62-.92-2.22-.24-.58-.48-.5-.67-.5h-.57c-.2 0-.53.08-.8.38-.27.3-1.03 1-1.03 2.44s1.05 2.82 1.2 3.02c.15.2 2.05 3.12 4.96 4.37.7.3 1.25.48 1.68.61.71.23 1.35.2 1.86.12.57-.08 1.76-.72 2-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35Z'/%3E%3C/svg%3E") !important;
}

.menu-overlay .menu-bottom .menu-social--yt::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31.4 31.4 0 0 0 0 12a31.4 31.4 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31.4 31.4 0 0 0 24 12a31.4 31.4 0 0 0-.5-5.8ZM9.6 15.6V8.4L16 12l-6.4 3.6Z'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31.4 31.4 0 0 0 0 12a31.4 31.4 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31.4 31.4 0 0 0 24 12a31.4 31.4 0 0 0-.5-5.8ZM9.6 15.6V8.4L16 12l-6.4 3.6Z'/%3E%3C/svg%3E") !important;
}

/* =========================
   HOTFIX V89: NO-ICON PROJECTS AS PLAIN NAMES (NO BOXES)
   ========================= */
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  min-height: auto !important;
  padding: 4px 0 !important;
  justify-content: center !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card::before,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card::after{
  content: none !important;
  display: none !important;
  background: transparent !important;
  border: 0 !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-footer{
  text-align: center !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-cat,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-meta{
  display: none !important;
}

body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-name{
  display: block !important;
  font-size: clamp(.78rem, .95vw, 1rem) !important;
  letter-spacing: .14em !important;
  line-height: 1.22 !important;
  text-transform: uppercase !important;
}

/* =========================
   HOTFIX V90: EQUIPO DESKTOP NAME SCALE + EMMANUEL ALIGN + SMALL SIGNATURE BELOW COPY
   ========================= */
@media (min-width: 981px){
  body.page-equipo .miembro--ivan,
  body.page-equipo .miembro--emmanuel{
    column-gap: clamp(10px, 1.6vw, 22px) !important;
    align-items: center !important;
  }

  body.page-equipo .miembro--ivan{
    grid-template-rows: auto auto !important;
    row-gap: clamp(8px, .9vw, 14px) !important;
    align-items: start !important;
  }

  body.page-equipo .miembro--ivan .miembro-copy{
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-content: start !important;
  }

  body.page-equipo .miembro--ivan h3,
  body.page-equipo .miembro--emmanuel h3{
    font-size: clamp(1.24rem, 1.9vw, 2rem) !important;
    letter-spacing: .08em !important;
    line-height: 1.04 !important;
    font-weight: 620 !important;
    margin: 0 0 4px !important;
  }

  body.page-equipo .miembro--ivan span,
  body.page-equipo .miembro--emmanuel span{
    font-size: clamp(.7rem, .84vw, .9rem) !important;
    letter-spacing: .14em !important;
  }

  body.page-equipo .miembro--emmanuel .miembro-copy{
    justify-self: end !important;
    width: min(30ch, 100%) !important;
    margin-right: clamp(2px, .5vw, 10px) !important;
  }

  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    display: block !important;
    position: static !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    align-self: start !important;
    width: clamp(72px, 7.8vw, 118px) !important;
    margin-top: clamp(6px, .8vw, 12px) !important;
    margin-left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 1 !important;
  }

  body.page-equipo .miembro--ivan .miembro-sign{
    width: 100% !important;
    height: auto !important;
    opacity: .9 !important;
  }
}

/* =========================
   HOTFIX V93: EQUIPO CLEAN PANELS OFF + SIGNATURE HIGHER
   ========================= */
body.page-equipo .miembro,
body.page-equipo .miembro--ivan,
body.page-equipo .miembro--emmanuel{
  background: transparent !important;
  border: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  padding: 0 !important;
}

body.page-equipo .miembro::before,
body.page-equipo .miembro::after,
body.page-equipo .miembro--ivan::before,
body.page-equipo .miembro--ivan::after,
body.page-equipo .miembro--emmanuel::before,
body.page-equipo .miembro--emmanuel::after{
  content: none !important;
  display: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

@media (min-width: 981px){
  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    width: clamp(54px, 4.6vw, 76px) !important;
    margin-top: 0 !important;
    transform: translateY(clamp(-118px, -10.2vw, -72px)) !important;
  }
}

/* =========================
   HOTFIX V92: DESARROLLO NO-ICON AS CLEAN TEXT (NO BOX / NO META)
   ========================= */
body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card::before,
body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card::after,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card::before,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-footer,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-footer{
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-cat,
body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-meta,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-cat,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-meta{
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-name,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-name{
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  font-family: var(--display) !important;
  font-size: clamp(.86rem, 1.05vw, 1.08rem) !important;
  font-weight: 600 !important;
  letter-spacing: .13em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  color: var(--ink) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* =========================
   HOTFIX V91: EQUIPO DESKTOP FINAL NAME EMPHASIS + EMMANUEL PROXIMITY + SIGN BELOW COPY
   ========================= */
@media (min-width: 981px){
  body.page-equipo .miembro--ivan,
  body.page-equipo .miembro--emmanuel{
    align-items: center !important;
  }

  body.page-equipo .miembro--ivan{
    grid-template-rows: auto auto !important;
    row-gap: clamp(10px, 1vw, 16px) !important;
    align-items: start !important;
  }

  body.page-equipo .miembro--ivan .miembro-copy{
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-content: start !important;
    max-width: min(54ch, 100%) !important;
  }

  body.page-equipo .miembro--ivan h3,
  body.page-equipo .miembro--emmanuel h3{
    font-size: clamp(1.72rem, 2.55vw, 2.86rem) !important;
    letter-spacing: .052em !important;
    line-height: .97 !important;
    font-weight: 700 !important;
    margin: 0 0 6px !important;
  }

  body.page-equipo .miembro--ivan span,
  body.page-equipo .miembro--emmanuel span{
    font-size: clamp(.76rem, .95vw, 1.02rem) !important;
    letter-spacing: .12em !important;
  }

  body.page-equipo .miembro--emmanuel{
    column-gap: clamp(4px, .95vw, 14px) !important;
  }

  body.page-equipo .miembro--emmanuel .miembro-copy{
    grid-column: 1 !important;
    justify-self: end !important;
    width: min(35ch, 100%) !important;
    margin-right: clamp(0px, .3vw, 8px) !important;
    transform: translateX(clamp(8px, 1.15vw, 18px)) !important;
    align-content: center !important;
  }

  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    display: block !important;
    position: static !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    align-self: start !important;
    width: clamp(58px, 5vw, 82px) !important;
    margin-top: clamp(6px, .9vw, 12px) !important;
    margin-left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 1 !important;
    pointer-events: none !important;
  }

  body.page-equipo .miembro--ivan .miembro-sign{
    width: 100% !important;
    height: auto !important;
    opacity: .9 !important;
  }
}

/* =========================
   HOTFIX V94: EQUIPO FINAL CLEAN (NO RECTANGLES) + SIGNATURE HIGHER
   ========================= */
body.page-equipo .miembro,
body.page-equipo .miembro--ivan,
body.page-equipo .miembro--emmanuel{
  background: transparent !important;
  border: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  padding: 0 !important;
}

body.page-equipo .miembro::before,
body.page-equipo .miembro::after,
body.page-equipo .miembro--ivan::before,
body.page-equipo .miembro--ivan::after,
body.page-equipo .miembro--emmanuel::before,
body.page-equipo .miembro--emmanuel::after{
  content: none !important;
  display: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

@media (min-width: 981px){
  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    width: clamp(50px, 4.2vw, 70px) !important;
    margin-top: 0 !important;
    transform: translateY(clamp(-170px, -13vw, -110px)) !important;
  }
}

/* =========================
   HOTFIX V95: PROJECT MOBILE INFO ORDER
   nombre -> icono -> ficha
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-inline-sign{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  body.page-proyecto .project-info-panel{
    display: flex !important;
    flex-direction: column !important;
    gap: clamp(10px, 3.4vw, 16px) !important;
    align-items: stretch !important;
  }

  body.page-proyecto .project-info-back{
    order: 1 !important;
  }

  body.page-proyecto .project-info-panel .project-hero{
    order: 2 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
  }

  body.page-proyecto .project-info-panel .project-hero .project-meta{
    display: none !important;
  }

  body.page-proyecto .project-info-sign{
    order: 3 !important;
    margin: 2px 0 4px !important;
    padding: 0 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
  }

  body.page-proyecto .project-info-sign .project-sign-icon{
    width: clamp(168px, 46vw, 222px) !important;
    max-width: 100% !important;
    height: auto !important;
    opacity: .95 !important;
  }

  body.page-proyecto .project-info-list{
    order: 4 !important;
    margin: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
    display: grid !important;
    gap: 10px !important;
  }
}


/* =========================
   HOTFIX V96: PROJECT MOBILE STACK
   nombre -> icono -> ficha (espaciado y escala uniforme)
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-inline-sign{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  body.page-proyecto .project-info-panel{
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: clamp(14px, 4vw, 22px) !important;
  }

  body.page-proyecto .project-info-back{
    order: 1 !important;
  }

  body.page-proyecto .project-info-panel .project-hero{
    order: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
  }

  body.page-proyecto .project-info-panel .project-hero .project-meta{
    display: none !important;
  }

  body.page-proyecto .project-info-sign{
    order: 3 !important;
    width: 100% !important;
    margin: clamp(2px, 1.4vw, 8px) 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  body.page-proyecto .project-info-sign .project-sign-icon{
    width: clamp(170px, 48vw, 230px) !important;
    max-width: 100% !important;
    height: auto !important;
    opacity: 0.95 !important;
  }

  body.page-proyecto .project-info-list{
    order: 4 !important;
    margin: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
  }
}


/* =========================
   HOTFIX V97: DESARROLLO NO-ICON CARDS CLEAN + CENTERED
   sin marco/sombra/cuadro + nombre centrado
   ========================= */
body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  min-height: clamp(130px, 13vw, 180px) !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card::before,
body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card::after,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card::before,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-icon,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-icon{
  display: none !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-footer,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-footer{
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-cat,
body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-meta,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-cat,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-meta{
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-name,
body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-name{
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
  font-family: var(--display) !important;
  font-size: clamp(.86rem, 1.05vw, 1.08rem) !important;
  font-weight: 600 !important;
  letter-spacing: .13em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  color: var(--ink) !important;
}

@media (max-width: 980px){
  body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card{
    min-height: auto !important;
    padding: 2px 0 !important;
  }
}


/* =========================
   HOTFIX V98: RESTORE PROJECT FIXED LOGO
   ========================= */
body.page-proyecto #fixedDevLikeLogo{
  display: inline-flex !important;
  position: fixed !important;
  left: var(--padX) !important;
  top: var(--padY) !important;
  flex-direction: column !important;
  gap: 2px !important;
  text-decoration: none !important;
  color: var(--ink) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 151 !important;
}

body.page-proyecto #fixedDevLikeLogo::before,
body.page-proyecto #fixedDevLikeLogo::after{
  content: none !important;
  display: none !important;
}

body.dark.page-proyecto #fixedDevLikeLogo{
  color: #fff !important;
}


/* =========================
   HOTFIX V99: TEAM SIGN LOWER + MENU SOCIAL SVG ALWAYS VISIBLE
   ========================= */
@media (min-width: 981px){
  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    transform: translateY(clamp(-92px, -7.2vw, -54px)) !important;
    margin-top: clamp(10px, 1vw, 16px) !important;
  }
}

.menu-overlay .menu-bottom .menu-social{
  width: 18px !important;
  height: 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: rgba(255,255,255,.96) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

.menu-overlay .menu-bottom .menu-social::before{
  content: none !important;
  display: none !important;
}

.menu-overlay .menu-bottom .menu-social svg{
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  opacity: 1 !important;
}

.menu-overlay .menu-bottom .menu-social:hover,
.menu-overlay .menu-bottom .menu-social:focus-visible{
  color: #fff !important;
  transform: translateY(-1px) !important;
}

.menu-overlay .menu-bottom .menu-socials{
  gap: 14px !important;
}

@media (max-width: 768px){
  .menu-overlay .menu-bottom .menu-social{
    width: 17px !important;
    height: 17px !important;
  }

  .menu-overlay .menu-bottom .menu-social svg{
    width: 17px !important;
    height: 17px !important;
  }
}


/* =========================
   HOTFIX V100: PROJECT FIXED LOGO AS REAL IMAGE FILE
   ========================= */
body.page-proyecto #fixedDevLikeLogo{
  display: block !important;
  position: fixed !important;
  left: var(--padX) !important;
  top: var(--padY) !important;
  width: clamp(178px, 16.8vw, 286px) !important;
  max-width: min(68vw, 286px) !important;
  aspect-ratio: 1080 / 219 !important;
  height: auto !important;
  min-height: 0 !important;
  background-image: url("assets/branding/logos/ivan-facio-logo-black.png") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: 100% auto !important;
  color: transparent !important;
  text-indent: -9999px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 151 !important;
}

body.dark.page-proyecto #fixedDevLikeLogo{
  background-image: url("assets/branding/logos/ivan-facio-logo-white.png") !important;
}

body.page-proyecto #fixedDevLikeLogo::before,
body.page-proyecto #fixedDevLikeLogo::after,
body.page-proyecto #fixedDevLikeLogo > *{
  content: none !important;
  display: none !important;
}

@media (max-width: 980px){
  body.page-proyecto #fixedDevLikeLogo{
    width: clamp(156px, 50vw, 230px) !important;
  }
}

/* =========================
   HOTFIX V101: MENU SOCIALS WHITE + MENU STACK FIX + PROJECT LOGO ALIGN
   ========================= */
.menu-overlay .menu-bottom.menu-section{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: clamp(8px, 1.2vh, 14px) !important;
}

.menu-overlay .menu-bottom .menu-socials{
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 2px !important;
}

.menu-overlay .menu-bottom .menu-social{
  width: 14px !important;
  height: 14px !important;
  color: rgba(255,255,255,0.92) !important;
  opacity: 0.86 !important;
  transform: translateY(0) scale(1) !important;
  filter: drop-shadow(0 0 0 rgba(255,255,255,0));
  transition:
    transform 0.24s cubic-bezier(.22,1,.36,1),
    opacity 0.24s ease,
    filter 0.24s ease !important;
}

.menu-overlay .menu-bottom .menu-social svg{
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  opacity: 1 !important;
}

.menu-overlay.open .menu-bottom .menu-social{
  animation: menuSocialLiftInV101 0.34s cubic-bezier(.2,.9,.25,1) both !important;
}

.menu-overlay.open .menu-bottom .menu-social:nth-child(1){
  animation-delay: 0.05s !important;
}

.menu-overlay.open .menu-bottom .menu-social:nth-child(2){
  animation-delay: 0.1s !important;
}

.menu-overlay.open .menu-bottom .menu-social:nth-child(3){
  animation-delay: 0.15s !important;
}

.menu-overlay .menu-bottom .menu-social:hover,
.menu-overlay .menu-bottom .menu-social:focus-visible{
  color: #fff !important;
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.12) !important;
  filter: drop-shadow(0 0 8px rgba(255,255,255,0.5));
}

@keyframes menuSocialLiftInV101{
  from{
    opacity: 0;
    transform: translateY(6px) scale(0.88);
  }
  to{
    opacity: 0.9;
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 768px){
  .menu-overlay .menu-bottom .menu-social,
  .menu-overlay .menu-bottom .menu-social svg{
    width: 13px !important;
    height: 13px !important;
  }
}

@media (min-width: 981px){
  body.page-desarrollo.menu-open .site-footer{
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(8px) !important;
  }

  body.page-proyecto #fixedDevLikeLogo,
  body.page-proyecto .project-side-brand{
    top: calc(18px + env(safe-area-inset-top)) !important;
  }
}

/* =========================
   HOTFIX V102: DESARROLLO MOBILE ICON BALANCE
   iconos grandes sin titulo + no-icon con espaciado armonico
   ========================= */
@media (max-width: 980px){
  body.page-desarrollo .dev-hover-title{
    display: none !important;
  }

  body.page-desarrollo .dev-shell{
    --dev-sidebar-w: min(35vw, 146px) !important;
    grid-template-columns: var(--dev-sidebar-w) minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  body.page-desarrollo .dev-content{
    padding-left: clamp(10px, 3.8vw, 16px) !important;
  }

  body.page-desarrollo .dev-project-grid,
  body.page-desarrollo .dev-project-grid.is-icon-focus{
    grid-template-columns: 1fr !important;
    gap: clamp(12px, 2.4vh, 20px) !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card{
    min-height: auto !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon{
    min-height: clamp(168px, 30vh, 238px) !important;
    padding: 8px 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-icon{
    position: relative !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
    width: clamp(142px, 44vw, 214px) !important;
    height: clamp(142px, 44vw, 214px) !important;
    margin: 0 auto !important;
    opacity: .95 !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon:hover .dev-project-icon,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon:focus-visible .dev-project-icon{
    transform: none !important;
  }

  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-footer,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-cat,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-name,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.has-icon .dev-project-meta{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card{
    min-height: 62px !important;
    padding: 6px 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-footer,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-footer{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 54px !important;
  }

  body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-name,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-name{
    font-size: clamp(.78rem, 3.35vw, .98rem) !important;
    letter-spacing: .12em !important;
    line-height: 1.24 !important;
    text-align: center !important;
    opacity: .9 !important;
  }

  body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-cat,
  body.page-desarrollo .dev-project-grid .dev-project-card.no-icon-card .dev-project-meta,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-cat,
  body.page-desarrollo .dev-project-grid.is-icon-focus .dev-project-card.no-icon-card .dev-project-meta{
    display: none !important;
  }
}

/* =========================
   HOTFIX V103: PROJECT MOBILE ICON LEFT
   proyectos con icono: icono visible a la izquierda
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-hero.has-inline-sign{
    grid-template-columns: clamp(92px, 28vw, 138px) minmax(0, 1fr) !important;
    grid-template-areas:
      "icon text"
      "icon meta" !important;
    align-items: start !important;
    column-gap: clamp(12px, 3.6vw, 18px) !important;
    row-gap: clamp(8px, 2.4vw, 12px) !important;
  }

  body.page-proyecto .project-hero.has-inline-sign > div:first-child{
    grid-area: text !important;
    min-width: 0 !important;
  }

  body.page-proyecto .project-hero.has-inline-sign .project-meta{
    grid-area: meta !important;
    margin: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
  }

  body.page-proyecto .project-inline-sign{
    display: flex !important;
    width: auto !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    pointer-events: none !important;
  }

  body.page-proyecto .project-hero.has-inline-sign .project-inline-sign{
    grid-area: icon !important;
    align-self: start !important;
    justify-self: start !important;
    margin: 2px 0 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-hero.has-inline-sign .project-inline-sign .project-sign-icon{
    width: clamp(98px, 28vw, 136px) !important;
    max-width: 100% !important;
    height: auto !important;
    opacity: .95 !important;
    filter: grayscale(1) contrast(1.06) !important;
  }

  body.dark.page-proyecto .project-hero.has-inline-sign .project-inline-sign .project-sign-icon{
    filter: grayscale(1) invert(1) brightness(1.1) contrast(1.02) !important;
  }
}

/* =========================
   HOTFIX V104: MENU SOCIAL ICONS FORCE WHITE
   ========================= */
.menu-overlay .menu-bottom .menu-socials{
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.menu-overlay .menu-bottom .menu-social{
  position: relative !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
  color: #ffffff !important;
  background: transparent !important;
  border: 0 !important;
  transform: none !important;
}

.menu-overlay .menu-bottom .menu-social svg{
  display: none !important;
}

.menu-overlay .menu-bottom .menu-social::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  opacity: 0.95 !important;
  transition: transform .22s cubic-bezier(.22,1,.36,1), opacity .22s ease, filter .22s ease !important;
}

.menu-overlay .menu-bottom .menu-social--ig::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.6' y='3.6' width='16.8' height='16.8' rx='4.8'/%3E%3Ccircle cx='12' cy='12' r='4.1'/%3E%3Ccircle cx='17.1' cy='6.9' r='1.1' fill='%23ffffff' stroke='none'/%3E%3C/svg%3E") !important;
}

.menu-overlay .menu-bottom .menu-social--wp::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M20.52 3.48A11.82 11.82 0 0 0 12.06 0C5.53 0 .2 5.3.2 11.83c0 2.08.54 4.11 1.57 5.9L0 24l6.44-1.69a11.8 11.8 0 0 0 5.62 1.43h.01c6.52 0 11.84-5.3 11.85-11.83a11.73 11.73 0 0 0-3.4-8.43Zm-8.46 18.27h-.01a9.83 9.83 0 0 1-5.01-1.38l-.36-.21-3.83 1 1.02-3.73-.24-.38a9.86 9.86 0 0 1-1.52-5.24c0-5.44 4.43-9.87 9.88-9.87 2.64 0 5.13 1.03 7 2.9a9.82 9.82 0 0 1 2.9 7c0 5.45-4.43 9.88-9.87 9.88Zm5.41-7.39c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.23-.65.08-.3-.15-1.27-.47-2.42-1.5-.89-.8-1.5-1.8-1.67-2.1-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.38-.02-.53-.08-.15-.67-1.62-.92-2.22-.24-.58-.48-.5-.67-.5h-.57c-.2 0-.53.08-.8.38-.27.3-1.03 1-1.03 2.44s1.05 2.82 1.2 3.02c.15.2 2.05 3.12 4.96 4.37.7.3 1.25.48 1.68.61.71.23 1.35.2 1.86.12.57-.08 1.76-.72 2-1.42.25-.7.25-1.3.17-1.42-.07-.12-.27-.2-.57-.35Z'/%3E%3C/svg%3E") !important;
}

.menu-overlay .menu-bottom .menu-social--yt::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31.4 31.4 0 0 0 0 12a31.4 31.4 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31.4 31.4 0 0 0 24 12a31.4 31.4 0 0 0-.5-5.8ZM9.6 15.6V8.4L16 12l-6.4 3.6Z'/%3E%3C/svg%3E") !important;
}

.menu-overlay .menu-bottom .menu-social:hover::before,
.menu-overlay .menu-bottom .menu-social:focus-visible::before{
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.12) !important;
  filter: drop-shadow(0 0 8px rgba(255,255,255,0.55)) !important;
}

@media (max-width: 768px){
  .menu-overlay .menu-bottom .menu-social{
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
  }
}

/* =========================
   HOTFIX V105: MENU SOCIAL ICONS ALWAYS VISIBLE (SVG FALLBACK FIRST)
   ========================= */
#menu.menu-overlay .menu-bottom .menu-social,
.menu-overlay .menu-bottom .menu-social{
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  opacity: 1 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  transform: none !important;
}

#menu.menu-overlay .menu-bottom .menu-social::before,
#menu.menu-overlay .menu-bottom .menu-social::after,
.menu-overlay .menu-bottom .menu-social::before,
.menu-overlay .menu-bottom .menu-social::after{
  content: none !important;
  display: none !important;
}

#menu.menu-overlay .menu-bottom .menu-social svg,
.menu-overlay .menu-bottom .menu-social svg{
  display: block !important;
  width: 24px !important;
  height: 24px !important;
  opacity: 1 !important;
}

#menu.menu-overlay .menu-bottom .menu-social svg *,
.menu-overlay .menu-bottom .menu-social svg *{
  stroke: currentColor !important;
  fill: currentColor !important;
}

#menu.menu-overlay .menu-bottom .menu-social--ig svg rect,
#menu.menu-overlay .menu-bottom .menu-social--ig svg circle,
.menu-overlay .menu-bottom .menu-social--ig svg rect,
.menu-overlay .menu-bottom .menu-social--ig svg circle{
  fill: none !important;
}

#menu.menu-overlay .menu-bottom .menu-social--ig svg circle:last-child,
.menu-overlay .menu-bottom .menu-social--ig svg circle:last-child{
  fill: currentColor !important;
}

#menu.menu-overlay .menu-bottom .menu-social:hover,
#menu.menu-overlay .menu-bottom .menu-social:focus-visible,
.menu-overlay .menu-bottom .menu-social:hover,
.menu-overlay .menu-bottom .menu-social:focus-visible{
  color: #ffffff !important;
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.1) !important;
  filter: drop-shadow(0 0 9px rgba(255,255,255,0.6)) drop-shadow(0 1px 3px rgba(0,0,0,0.4)) !important;
}

#menu.menu-overlay .menu-bottom .menu-socials,
.menu-overlay .menu-bottom .menu-socials{
  display: inline-flex !important;
  align-items: center !important;
  gap: 16px !important;
}

@media (max-width: 768px){
  #menu.menu-overlay .menu-bottom .menu-social,
  .menu-overlay .menu-bottom .menu-social{
    width: 23px !important;
    height: 23px !important;
    min-width: 23px !important;
    min-height: 23px !important;
  }

  #menu.menu-overlay .menu-bottom .menu-social svg,
  .menu-overlay .menu-bottom .menu-social svg{
    width: 23px !important;
    height: 23px !important;
  }
}

/* =========================
   HOTFIX V106: PROJECT MOBILE ICON RIGHT + TEXT LEFT
   ========================= */
@media (max-width: 980px){
  body.page-proyecto .project-hero.has-inline-sign{
    grid-template-columns: minmax(0, 1fr) clamp(92px, 28vw, 138px) !important;
    grid-template-areas:
      "text icon"
      "meta icon" !important;
    align-items: start !important;
    column-gap: clamp(12px, 3.6vw, 18px) !important;
    row-gap: clamp(8px, 2.4vw, 12px) !important;
  }

  body.page-proyecto .project-hero.has-inline-sign > div:first-child{
    grid-area: text !important;
    min-width: 0 !important;
    width: 100% !important;
    justify-self: start !important;
    text-align: left !important;
  }

  body.page-proyecto .project-hero.has-inline-sign .project-meta{
    grid-area: meta !important;
    width: 100% !important;
    margin: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }

  body.page-proyecto .project-inline-sign{
    display: flex !important;
    width: auto !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    pointer-events: none !important;
  }

  body.page-proyecto .project-hero.has-inline-sign .project-inline-sign{
    grid-area: icon !important;
    align-self: start !important;
    justify-self: end !important;
    margin: 2px 0 0 !important;
    transform: none !important;
  }

  body.page-proyecto .project-hero.has-inline-sign .project-inline-sign .project-sign-icon{
    width: clamp(98px, 28vw, 136px) !important;
    max-width: 100% !important;
    height: auto !important;
    opacity: .95 !important;
    filter: grayscale(1) contrast(1.06) !important;
  }

  body.dark.page-proyecto .project-hero.has-inline-sign .project-inline-sign .project-sign-icon{
    filter: grayscale(1) invert(1) brightness(1.1) contrast(1.02) !important;
  }
}

/* =========================
   HOTFIX V107: HIDE FOOTER WHILE MENU IS OPEN
   ========================= */
body.menu-open .site-footer{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(10px) !important;
}

body.menu-open .site-footer *{
  pointer-events: none !important;
}

/* =========================
   HOTFIX V108: MENU SOCIAL SVG HARD WHITE LOCK
   ========================= */
html body #menu.menu-overlay .menu-bottom .menu-social,
html body .menu-overlay .menu-bottom .menu-social{
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  mix-blend-mode: normal !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social::before,
html body #menu.menu-overlay .menu-bottom .menu-social::after,
html body .menu-overlay .menu-bottom .menu-social::before,
html body .menu-overlay .menu-bottom .menu-social::after{
  content: none !important;
  display: none !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social svg,
html body .menu-overlay .menu-bottom .menu-social svg{
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social svg [stroke],
html body .menu-overlay .menu-bottom .menu-social svg [stroke]{
  stroke: #ffffff !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social svg [fill]:not([fill="none"]),
html body .menu-overlay .menu-bottom .menu-social svg [fill]:not([fill="none"]){
  fill: #ffffff !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social svg path:not([fill="none"]),
html body .menu-overlay .menu-bottom .menu-social svg path:not([fill="none"]){
  fill: #ffffff !important;
}

/* =========================
   HOTFIX V109: MENU CTA + SOCIAL SCALE
   ========================= */
html body #menu.menu-overlay .menu-bottom .menu-section-link.menu-interview-link,
html body #menu.menu-overlay .menu-bottom .menu-interview-link,
html body .menu-overlay .menu-bottom .menu-section-link.menu-interview-link,
html body .menu-overlay .menu-bottom .menu-interview-link{
  font-size: clamp(1.404rem, 2.646vw, 2.16rem) !important;
  line-height: .98 !important;
  letter-spacing: .035em !important;
  font-weight: 620 !important;
  color: #ff8a1a !important;
  text-shadow: 0 0 12px rgba(255,138,26,.22) !important;
}

html body #menu.menu-overlay .menu-bottom .menu-section-link.menu-interview-link:hover,
html body #menu.menu-overlay .menu-bottom .menu-section-link.menu-interview-link:focus-visible,
html body #menu.menu-overlay .menu-bottom .menu-interview-link:hover,
html body #menu.menu-overlay .menu-bottom .menu-interview-link:focus-visible,
html body .menu-overlay .menu-bottom .menu-section-link.menu-interview-link:hover,
html body .menu-overlay .menu-bottom .menu-section-link.menu-interview-link:focus-visible,
html body .menu-overlay .menu-bottom .menu-interview-link:hover,
html body .menu-overlay .menu-bottom .menu-interview-link:focus-visible{
  color: #ffb15c !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social,
html body .menu-overlay .menu-bottom .menu-social{
  width: 30.24px !important;
  height: 30.24px !important;
  min-width: 30.24px !important;
  min-height: 30.24px !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social svg,
html body .menu-overlay .menu-bottom .menu-social svg{
  width: 30.24px !important;
  height: 30.24px !important;
}

@media (max-width: 768px){
  html body #menu.menu-overlay .menu-bottom .menu-section-link.menu-interview-link,
  html body #menu.menu-overlay .menu-bottom .menu-interview-link,
  html body .menu-overlay .menu-bottom .menu-section-link.menu-interview-link,
  html body .menu-overlay .menu-bottom .menu-interview-link{
    font-size: clamp(1.1664rem, 6.372vw, 1.62rem) !important;
  }

  html body #menu.menu-overlay .menu-bottom .menu-social,
  html body .menu-overlay .menu-bottom .menu-social{
    width: 28.08px !important;
    height: 28.08px !important;
    min-width: 28.08px !important;
    min-height: 28.08px !important;
  }

  html body #menu.menu-overlay .menu-bottom .menu-social svg,
  html body .menu-overlay .menu-bottom .menu-social svg{
    width: 28.08px !important;
    height: 28.08px !important;
  }
}

/* =========================
   HOTFIX V110: EQUIPO SIGNATURE BIGGER + HIGHER (DESKTOP)
   ========================= */
@media (min-width: 981px){
  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    display: block !important;
    position: static !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    align-self: start !important;
    width: clamp(112px, 9.2vw, 168px) !important;
    margin-top: clamp(14px, 1.5vw, 24px) !important;
    margin-left: 0 !important;
    transform: none !important;
    z-index: 2 !important;
    pointer-events: none !important;
  }

  body.page-equipo .miembro--ivan .miembro-sign{
    width: 100% !important;
    height: auto !important;
    opacity: .96 !important;
  }
}

/* =========================
   HOTFIX V111: EQUIPO SIGN ANCHOR BELOW COPY (NO OVERLAP)
   ========================= */
@media (min-width: 981px){
  body.page-equipo .miembro--ivan{
    display: grid !important;
    grid-template-columns: clamp(320px, 32vw, 500px) minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: clamp(10px, 1.2vw, 20px) !important;
    row-gap: 0 !important;
    align-items: start !important;
  }

  body.page-equipo .miembro--ivan .miembro-media{
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    align-self: stretch !important;
  }

  body.page-equipo .miembro--ivan .miembro-copy{
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-content: start !important;
    max-width: min(46ch, 100%) !important;
    gap: clamp(6px, .7vw, 12px) !important;
  }

  body.page-equipo .miembro--ivan .miembro-tax-copy{
    max-width: min(36ch, 100%) !important;
    font-size: clamp(1.21rem, 1.77vw, 1.93rem) !important;
    line-height: 1.08 !important;
  }

  body.page-equipo .miembro--ivan .miembro-sign-wrap{
    grid-column: 2 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    align-self: start !important;
    width: clamp(116px, 9.6vw, 176px) !important;
    margin-top: clamp(8px, .9vw, 14px) !important;
    transform: none !important;
  }
}

/* =========================
   HOTFIX V112: MENU ICONS HOVER OFF
   ========================= */
html body #menu.menu-overlay .menu-bottom .menu-social,
html body .menu-overlay .menu-bottom .menu-social{
  transition: none !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social:hover,
html body #menu.menu-overlay .menu-bottom .menu-social:focus-visible,
html body .menu-overlay .menu-bottom .menu-social:hover,
html body .menu-overlay .menu-bottom .menu-social:focus-visible{
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
}

html body #menu.menu-overlay .menu-bottom .menu-social:hover::before,
html body #menu.menu-overlay .menu-bottom .menu-social:focus-visible::before,
html body .menu-overlay .menu-bottom .menu-social:hover::before,
html body .menu-overlay .menu-bottom .menu-social:focus-visible::before{
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
}

/* =========================
   HOTFIX V113: MENU SOCIALS USE SAME MENU ANIMATION
   ========================= */
html body #menu.menu-overlay .menu-bottom .menu-social.menu-anim,
html body .menu-overlay .menu-bottom .menu-social.menu-anim{
  animation: fadeIn 0.70s var(--easeSoft) forwards !important;
  animation-delay: calc(var(--i, 0) * 0.08s) !important;
}

html.font-helvetica-mode.style-brutal-max #menu.menu-overlay .menu-bottom .menu-social.menu-anim,
html.font-helvetica-mode.style-brutal-max .menu-overlay .menu-bottom .menu-social.menu-anim{
  animation: menuLinePremium .42s cubic-bezier(.2,.95,.25,1) forwards !important;
  animation-delay: calc(var(--i, 0) * 0.045s) !important;
}