/* =========================================================
   POLO ANDINO — hoja de estilos
   Maquetado a partir del prototipo pa_webnacha (desktop 1920 / mobile 360).
   Ver comentario "SISTEMA DE MEDIDAS" en index.html.
   ========================================================= */

@font-face{font-family:'HelveticaExt';src:url('fonts/HelveticaNeueLTStd-BdEx.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'HelveticaExt';src:url('fonts/HelveticaNeueLTStd-MdEx.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'HelveticaExt';src:url('fonts/HelveticaNeueLTStd-Ex.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'RFDewi';src:url('fonts/RFDewiExpanded-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'RFDewi';src:url('fonts/RFDewiExpanded-Semibold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Manrope';src:url('fonts/Manrope-var.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:'Anek';src:url('fonts/AnekDevanagari-var.woff2') format('woff2');font-weight:100 800;font-stretch:75% 125%;font-display:swap}

:root{
  --cream:#ece5d5;
  --brown:#7b6848;
  --black:#000100;
  --amber:#845100;
  --map-bg:#ebe4d4;

  /* 1 unidad de diseño en desktop = (ancho de ventana / 1920), máximo 1px */
  --u: calc(min(100vw, 1920px) / 1920);
  --U: var(--u);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  background:var(--black);
  color:var(--cream);
  font-family:'Manrope',sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img{ display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
picture{ display:contents; }

/* ---------- Secciones y "artboard" ---------- */
.sec{ position:relative; overflow:hidden; }
.art{
  position:relative;
  width:calc(1920 * var(--U));
  height:calc((var(--H) + var(--ext, 0)) * var(--U));
  margin:0 auto;
  z-index:1;
}
.bg, .bg img{ position:absolute; inset:0; width:100%; height:100%; }
.bg img, img.bg{ object-fit:cover; }
.ov{ position:absolute; inset:0; z-index:0; pointer-events:none; }

.brown{ background:var(--brown); }
.black{ background:var(--black); }
.white{ background:#fff; color:var(--black); }
.amber{ background:var(--amber); }
.map-sec{ background:#e7dfcc; color:var(--brown); }
.map-sec .bg img{ opacity:.165; }

/* ---------- Variables activas (desktop) ---------- */
.art *{
  --X:var(--x); --Y:var(--y); --W:var(--w); --HH:var(--h);
  --FS:var(--fs); --LH:var(--lh, calc(var(--fs) * 1.2));
  --CX:var(--cx); --R:var(--r, 0); --BW:var(--bw, 1);
  --DL:var(--dl); --DW:var(--dw); --DB:var(--db); --PAD:var(--pad, 0);
  --SH:0;
}

/* Texto posicionado por su línea base */
.t{
  position:absolute;
  left:calc(var(--X) * var(--U));
  top:calc((var(--Y) + var(--SH) - var(--LH) / 2 - var(--k) * var(--FS)) * var(--U));
  font-size:calc(var(--FS) * var(--U));
  line-height:calc(var(--LH) * var(--U));
  white-space:nowrap;
}
.t.c{ left:calc(var(--CX) * var(--U)); transform:translateX(-50%); text-align:center; }

/* Caja posicionada (imágenes, botones, líneas) */
.b{
  position:absolute;
  left:calc(var(--X) * var(--U));
  top:calc((var(--Y) + var(--SH)) * var(--U));
  width:calc(var(--W) * var(--U));
  height:calc(var(--HH) * var(--U));
}
img.b{ object-fit:contain; }
.b > img{ width:100%; height:100%; object-fit:contain; }

/* Fotos */
img.ph{ object-fit:cover; border-radius:calc(var(--R) * var(--U)); }
.rr{ border-top-left-radius:0 !important; border-bottom-left-radius:0 !important; }
.rl, .rl-d{ border-top-right-radius:0 !important; border-bottom-right-radius:0 !important; }

/* Líneas */
.hr{ border-top:max(1px, calc(var(--HH) * var(--U))) solid var(--cream); height:0 !important; }
.vr{ background:var(--cream); width:max(1px, calc(var(--W) * var(--U))) !important; }
.line{ background:var(--brown); height:max(1px, calc(var(--HH) * var(--U))) !important; }

/* ---------- Tipografías ---------- */
.fh { font-family:'HelveticaExt',sans-serif; font-weight:700; --k:.39; letter-spacing:var(--ls,.09em); }
.fhr{ font-family:'HelveticaExt',sans-serif; font-weight:400; --k:.39; letter-spacing:var(--ls,0); }
.fr { font-family:'RFDewi',sans-serif; font-weight:700; --k:.40; letter-spacing:var(--ls,.19em); }
.fn { font-family:'RFDewi',sans-serif; font-weight:700; --k:.40; letter-spacing:var(--ls,0); }
.idx{ --ls:.08em; }
.fm { font-family:'Manrope',sans-serif; font-weight:400; --k:.38; letter-spacing:var(--ls,0); }
.fm5{ font-weight:500; }
.fa { font-family:'Anek',sans-serif; font-weight:600; font-stretch:125%; font-variation-settings:'wdth' 125; --k:.16; letter-spacing:var(--ls,.068em); }
.hero-p{ --ls:.02em; }
.fm strong{ font-weight:700; }

small{ font-size:.595em; letter-spacing:inherit; margin-left:.37em; }
small.nogap{ margin-left:0; }
.u-hi{ position:relative; top:-.086em; }
.u-lo{ position:relative; top:-.03em; }
.plus{ position:relative; top:-.065em; margin-right:.3em; }

/* ---------- Header / nav ---------- */
.navlink{ transition:opacity .2s; }
.navlink:hover{ opacity:.7; }
.logo img{ width:100%; height:100%; }

/* ---------- Botones ---------- */
.btn{
  display:flex; align-items:center; justify-content:center; gap:.9em;
  border-radius:999px;
  border:max(1px, calc(var(--BW) * var(--U))) solid currentColor;
  font-family:'RFDewi',sans-serif; font-weight:600;
  font-size:calc(var(--FS) * var(--U));
  letter-spacing:.2em;
  text-indent:.2em;            /* compensa el espaciado final para centrar */
  white-space:nowrap;
  transition:background-color .25s, color .25s, border-color .25s;
}
.btn-glass{ background:rgba(0,0,0,.22); color:var(--cream); font-weight:700; }
.btn-glass:hover{ background:var(--cream); color:var(--black); border-color:var(--cream); }
.btn-line{ color:var(--cream); }
.map-sec .btn-line, .naves-sec .btn-line{ color:var(--brown); }
.btn-line:hover{ background:var(--cream); color:var(--black); border-color:var(--cream); }
.map-sec .btn-line:hover{ background:var(--brown); color:var(--cream); border-color:var(--brown); }
.naves-sec .btn-line:hover{ background:var(--brown); color:var(--black); border-color:var(--brown); }
.chev{ width:1.35em; height:.8em; fill:none; stroke:currentColor; stroke-width:1.2; flex:none; }
.chev.up{ transform:scaleY(-1); }

.pill{
  display:flex; align-items:center;
  padding-left:calc(var(--PAD) * var(--U));
  border:1px solid var(--cream);
  border-radius:999px;
  font-size:calc(var(--FS) * var(--U));
  line-height:1;
  padding-top:.36em;           /* Anek deja más aire arriba de las mayúsculas: baja el texto al centro óptico */
  white-space:nowrap;
  transition:background-color .25s, color .25s;
}
.pill:hover{ background:var(--cream); color:var(--amber); }

/* ---------- Listas con guion ---------- */
.dash li{ position:relative; display:block; }
.dash li::before, li.dash::before{
  content:""; position:absolute;
  left:calc(-1 * var(--DL) * var(--U));
  top:calc((var(--LH) / 2 + var(--k) * var(--FS) - var(--DB)) * var(--U));
  width:calc(var(--DW) * var(--U));
  height:max(1px, calc(1.5 * var(--U)));
  background:var(--cream);
}

/* ---------- Superposiciones de fotos de fondo ---------- */
.hero .ov{ background:
  linear-gradient(90deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.36) 25%, rgba(0,0,0,0) 48%),
  linear-gradient(180deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.52) 30%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.12) 70%, rgba(0,0,0,0) 90%); }
.master .ov{ background:rgba(0,0,0,.49); }
.corredor .ov{ background:linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.59) 20%, rgba(0,0,0,.5) 40%, rgba(0,0,0,.31) 62%, rgba(0,0,0,.25) 100%); }
.empresas .ov{ background:linear-gradient(90deg, rgba(0,0,0,.49) 0%, rgba(0,0,0,.5) 22%, rgba(0,0,0,.28) 45%, rgba(0,0,0,.08) 60%, rgba(0,0,0,0) 70%); }

/* ---------- Masterplan: sectores clicables ---------- */
.hotspot{ z-index:2; border-radius:calc(var(--R) * var(--U)); cursor:pointer;
  transition:background-color .25s, box-shadow .25s; }
.hotspot:hover, .hotspot:focus-visible{ background:rgba(255,255,255,.16); box-shadow:0 0 0 1px rgba(255,255,255,.9); outline:none; }
.anchor{ pointer-events:none; }

/* ---------- Novedades ---------- */
.news{ display:flex; gap:calc(53.9 * var(--U)); }
.card{ position:relative; flex:0 0 calc(541.4 * var(--U)); height:100%; color:var(--black); }
.card img{ transition:opacity .25s; }
.card:hover img{ opacity:.85; }
.news-t, .news-d{ color:var(--black); }
/* Tarjetas cargadas desde el panel: el texto corta solo, hasta 3 líneas */
.news-t[style*="--w"]{ width:calc(var(--W) * var(--U)); white-space:normal; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.news .card:nth-child(n+4){ display:none; }
.news.is-empty::before{ content:"Pronto vas a encontrar acá las últimas novedades del Polo."; font:400 calc(28 * var(--U))/1.3 'Manrope',sans-serif; color:var(--brown); }

/* ---------- Visibilidad por dispositivo ---------- */
.m-only{ display:none !important; }
br.m{ display:none; }

/* ---------- Menú mobile ---------- */
.menu{ position:fixed; inset:0; z-index:100; background:#ebe4d4; color:#7b6848;
  opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s; overflow-y:auto; }
.menu.open{ opacity:1; visibility:visible; }
.menu-close img{ width:100%; height:100%; }
.burger span{ position:absolute; left:calc(4.8 * var(--U)); width:calc(24.5 * var(--U)); height:1px; background:#fff; }
.burger span:nth-child(1){ top:calc(7.9 * var(--U)); }
.burger span:nth-child(2){ top:calc(15.5 * var(--U)); }
.burger span:nth-child(3){ top:calc(23.1 * var(--U)); }

/* =========================================================
   MOBILE (artboard 360 px, escala hasta 540 px de ancho)
   ========================================================= */
@media (max-width:1023px){
  :root{ --m: calc(min(100vw, 540px) / 360); --U: var(--m); }

  .art{ width:calc(360 * var(--U)); height:calc((var(--mH) + var(--ext, 0)) * var(--U)); }

  .art *{
    --X:var(--mx); --Y:var(--my); --W:var(--mw); --HH:var(--mh);
    --FS:var(--mfs); --LH:var(--mlh, calc(var(--mfs) * 1.2));
    --CX:var(--mcx); --R:var(--mr, 0); --BW:var(--mbw, 1);
    --DL:var(--mdl); --DW:var(--mdw); --DB:var(--mdb); --PAD:var(--mpad, 0);
  }
  .t[style*="--mls"]{ letter-spacing:var(--mls); }
  .t.mc{ left:calc(var(--CX) * var(--U)); transform:translateX(-50%); text-align:center; }

  .d-only{ display:none !important; }
  .m-only{ display:block !important; }
  .btn.m-only{ display:flex !important; }
  span.m-only, small.m-only{ display:inline !important; }
  small.nogap{ margin-left:.37em; }
  br.d{ display:none; }
  br.m{ display:inline; }
  .rl-d{ border-radius:calc(var(--R) * var(--U)) !important; }
  .nodash-m::before{ display:none; }

  /* Bloques desplegables ("Ver más") */
  .xo{ display:none !important; }
  .exp{ --ext:var(--dx); }
  .exp .xo{ display:block !important; }
  .exp .btn.xo{ display:flex !important; }
  .exp .btn-more{ display:none !important; }
  .exp .af{ --SH:var(--dx); }

  .btn{ border-width:max(1px, calc(var(--BW) * var(--U))); }
  .btn-glass-m{ background:rgba(0,0,0,.22); font-weight:700; }
  .btn-line{ font-weight:700; }
  .pill{ border-width:max(1px, calc(.48 * var(--U))); padding-top:.5em; }

  .hero .ov{ background:
    linear-gradient(90deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.3) 40%, rgba(0,0,0,0) 92%),
    linear-gradient(180deg, rgba(0,0,0,.83) 0%, rgba(0,0,0,.68) 20%, rgba(0,0,0,.52) 40%, rgba(0,0,0,.36) 60%, rgba(0,0,0,.2) 80%, rgba(0,0,0,.03) 100%); }
  .corredor .ov{ background:linear-gradient(90deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.59) 20%, rgba(0,0,0,.54) 40%, rgba(0,0,0,.49) 60%, rgba(0,0,0,.38) 80%, rgba(0,0,0,.3) 100%); }
  .empresas .ov{ background:linear-gradient(90deg, rgba(0,0,0,.48) 0%, rgba(0,0,0,.46) 20%, rgba(0,0,0,.42) 40%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.25) 80%, rgba(0,0,0,.13) 100%); }

  /* Novedades: carrusel horizontal */
  .news{
    gap:calc(21.1 * var(--U));
    width:calc(100vw - (100vw - 360 * var(--U)) / 2 - 35.4 * var(--U)) !important;
    overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;
    padding-right:calc(24 * var(--U));
  }
  .news::-webkit-scrollbar{ display:none; }
  .card{ flex-basis:calc(211.7 * var(--U)); scroll-snap-align:start; }
  .news .card:nth-child(n+4){ display:block; }
  .news.is-empty::before{ font-size:calc(15 * var(--U)); white-space:normal; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ transition:none !important; }
}