/* ── PALETA: Nuevo Rumbo (S6.131 — proporciones definidas)
       60% Crema #ECE3D1 (fondo) · 25% Azul #2C4356 (títulos/estructura/footer)
       10% Verde oliva #5B6C46 (terreno: eyebrows, apoyos, secciones)
       5%  Amarillo arena #E3B96E (SOLO acentos/CTA, con texto azul encima:
           arena sobre crema no contrasta — el texto lleva el azul)
       + Gris neutro #3A3A3A para cuerpos de texto largos (el azul en párrafos
         largos cansa; queda para títulos).
    ── */
    :root {
      --azul:      #2C4356;      /* azul profundo (confianza): títulos/footer */
      --azul-osc:  #22374a;      /* azul hover */
      --dorado:    #E3B96E;      /* arena (acento/CTA) */
      --dorado-txt: #7A5614;   /* arena oscura para TEXTO sobre crema (5,2:1; el --dorado en texto da 1,4:1) */
      --dorado-cl: #9a7a45;      /* arena oscura (hover) */
      --negro:     #ECE3D1;      /* FONDO off-white/crema */
      --negro-cl:  #E4D8C0;      /* crema un tono más */
      --gris-osc:  #5B6C46;      /* verde oliva (eyebrows) */
      --gris:      #5B6C46;      /* verde oliva (muted) */
      --gris-cl:   #8aa88a;      /* verde claro */
      --crema:     #ffffff;      /* superficie clara */
      --crema-osc: #f1ede3;      /* superficie apenas cálida */
      --blanco:    #2C4356;      /* AZUL (títulos/marca) — el verde queda en
                                    eyebrows/apoyos para no pisar a la escribanía */
      --texto:     #3A3A3A;      /* gris neutro oscuro (cuerpo largo) */
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }

    body {
      font-family: 'Montserrat', sans-serif;
      font-weight: 300;
      background: var(--negro);
      color: var(--texto);
      overflow-x: hidden;
    }

    /* ══════════════════ NAV ══════════════════ */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 500;
      display: flex; align-items: center; justify-content: space-between;
      padding: 0 6%; height: 78px;
      background: rgba(236,227,209,0.97);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(227,185,110,0.2);
      transition: all .4s;
    }

    .nav-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
    .nav-logo-img {
      width: 54px; height: 54px;
      object-fit: contain;
      background: transparent;
      border-radius: 50%;
      padding: 4px;
    }
    .nav-brand-txt { display: flex; flex-direction: column; line-height: 1.2; }
    .nav-brand-txt .nb1 {
      font-family: 'Montserrat', serif;
      font-size: 17px; font-weight: 600;
      color: var(--blanco); letter-spacing: .3px;
    }
    .nav-brand-txt .nb2 {
      font-size: 9px; font-weight: 400;
      letter-spacing: 3px; text-transform: uppercase;
      color: var(--dorado);
    }

    .nav-links { display: flex; gap: 36px; list-style: none; align-items: center; }
    .nav-links a {
      color: #2C4356; text-decoration: none;
      font-size: 10px; font-weight: 400;
      letter-spacing: 2px; text-transform: uppercase;
      transition: color .2s;
    }
    .nav-links a:hover { color: var(--dorado); }
    .nav-cta {
      border: 1px solid var(--dorado) !important;
      background: var(--dorado) !important;
      color: var(--azul) !important;
      padding: 9px 22px !important;
      letter-spacing: 1.5px !important;
      transition: background .2s, color .2s !important;
    }
    .nav-cta:hover {
      background: var(--azul) !important;
      color: var(--crema) !important;
    }

    .hamburger { display: none; cursor: pointer; flex-direction: column; gap: 5px; }
    .hamburger span {
      display: block; width: 22px; height: 1px;
      background: var(--dorado); transition: .3s;
    }

    /* ══════════════════ HERO ══════════════════ */
    /* Fondo crema texturado, NO negro */
    .hero {
      min-height: 100vh;
      background-color: var(--negro);
      background-image:
        url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23bb955c' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
      display: grid;
      grid-template-columns: 1fr 1fr;
      overflow: hidden;
      padding-top: 78px;
    }

    .hero-left {
      display: flex; flex-direction: column;
      justify-content: center;
      padding: 80px 8% 80px 8%;
      position: relative; z-index: 2;
    }

    .hero-eyebrow {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 28px;
    }
    .hero-eyebrow-bar { width: 28px; height: 1px; background: var(--gris); }
    .hero-eyebrow span {
      font-size: 10px; font-weight: 400;
      letter-spacing: 3px; text-transform: uppercase;
      color: var(--gris-osc);
    }

    .hero h1 {
      font-family: 'Montserrat', serif;
      font-size: clamp(44px, 5.5vw, 80px);
      font-weight: 300; line-height: 1.05;
      color: var(--blanco); margin-bottom: 28px;
      letter-spacing: -.5px;
    }
    .hero h1 em {
      font-style: italic; font-weight: 300;
      color: var(--dorado);
    }

    .hero-tagline {
      font-family: 'Montserrat', serif;
      font-size: clamp(18px, 2.2vw, 28px);
      font-weight: 300; font-style: italic;
      color: #2C4356;
      line-height: 1.4;
      margin-bottom: 16px;
      letter-spacing: .3px;
    }

    .hero-desc {
      font-size: 15px; line-height: 1.85;
      color: #2C4356;
      max-width: 420px; margin-bottom: 48px;
    }

    .hero-btns { display: flex; gap: 14px; flex-wrap: wrap; }

    .btn-solid {
      display: inline-flex; align-items: center; gap: 10px;
      /* S6.131 — CTA en arena (el 5% de la paleta) con texto AZUL: arena con
         texto claro no llega a AA; el azul oscuro encima sí. */
      background: var(--dorado); color: var(--azul);
      padding: 15px 34px; text-decoration: none;
      font-size: 11px; font-weight: 600;
      letter-spacing: 2px; text-transform: uppercase;
      transition: background .2s;
    }
    .btn-solid:hover { background: #d6a751; }

    .btn-outline {
      display: inline-flex; align-items: center; gap: 10px;
      border: 1px solid rgba(91,108,70,0.25);
      color: #2C4356;
      padding: 14px 34px; text-decoration: none;
      font-size: 11px; font-weight: 400;
      letter-spacing: 2px; text-transform: uppercase;
      transition: border-color .2s, color .2s;
    }
    .btn-outline:hover { border-color: var(--dorado); color: var(--dorado); }

    /* Hero derecha — logo flotante sobre fondo crema */
    .hero-right {
      display: flex; align-items: center; justify-content: center;
      padding: 60px 8%;
      position: relative;
    }
    /* Círculo de fondo decorativo */
    /* 7/9/2026: el disco crema y el anillo eran del logo redondo (badge). Con el
       logo completo transparente el disco se veía como un "fondo crema distinto"
       al del sitio (dueño). Se apagan; el logo apoya directo sobre el hero. */
    .hero-right::before, .hero-right::after { display: none; }
    .hero-right::before {
      content: '';
      position: absolute;
      width: clamp(300px, 38vw, 500px);
      height: clamp(300px, 38vw, 500px);
      border-radius: 50%;
      border: 1px solid rgba(227,185,110,0.2);
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
    }
    .hero-right::after {
      content: '';
      position: absolute;
      width: clamp(280px, 35vw, 470px);
      height: clamp(280px, 35vw, 470px);
      border-radius: 50%;
      background: rgba(227,185,110,0.10);
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      opacity: 1;
      box-shadow: 0 0 0 20px rgba(227,185,110,0.08);
    }

    .hero-logo-img {
      width: clamp(470px, 56vw, 800px);
      height: clamp(470px, 56vw, 800px);
      object-fit: contain;
      position: relative; z-index: 2;
      animation: flotar 7s ease-in-out infinite;
    }
    @keyframes flotar {
      0%, 100% { transform: translateY(0) rotate(0deg); }
      33%       { transform: translateY(-10px) rotate(.5deg); }
      66%       { transform: translateY(-6px) rotate(-.3deg); }
    }

    /* Stats sobre el hero */
    .hero-stats {
      grid-column: 1 / -1;
      display: flex;
      border-top: 1px solid rgba(227,185,110,0.2);
    }
    .hero-stat {
      flex: 1; padding: 28px 6%;
      display: flex; align-items: center; gap: 20px;
      border-right: 1px solid rgba(227,185,110,0.15);
    }
    .hero-stat:last-child { border-right: none; }
    .stat-num {
      font-family: 'Montserrat', serif;
      font-size: 44px; font-weight: 300; line-height: 1;
      color: var(--dorado);
    }
    .stat-info {}
    .stat-lbl {
      font-size: 10px; font-weight: 400; letter-spacing: 2px;
      text-transform: uppercase; color: #2C4356;
    }
    .stat-sub { font-size: 11px; color: #2C4356; margin-top: 2px; }

    /* ══════════════════ MARQUEE ══════════════════ */
    .marquee-wrap {
      background: var(--dorado);
      overflow: hidden; padding: 15px 0;
    }
    .marquee-track {
      display: flex; white-space: nowrap;
      animation: mq 24s linear infinite;
    }
    .mq-item {
      flex-shrink: 0; padding: 0 40px;
      font-size: 10px; font-weight: 500;
      letter-spacing: 3px; text-transform: uppercase;
      color: var(--blanco);
    }
    .mq-sep {
      flex-shrink: 0; width: 3px; height: 3px;
      background: rgba(0,0,0,0.25); border-radius: 50%;
      align-self: center;
    }
    @keyframes mq {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }

    /* ══════════════════ SECCIONES ══════════════════ */
    .sec { padding: 110px 6%; }
    .sec-inner { max-width: 1200px; margin: 0 auto; }

    .eyebrow {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 20px;
    }
    .eyebrow-bar { width: 28px; height: 1px; background: var(--dorado); }
    .eyebrow span {
      font-size: 10px; font-weight: 400; letter-spacing: 3px;
      text-transform: uppercase; color: var(--gris-osc);
    }

    .sec-h2 {
      font-family: 'Montserrat', serif;
      font-size: clamp(30px, 3.5vw, 52px);
      font-weight: 300; line-height: 1.15; color: var(--blanco);
    }
    .sec-h2 em { font-style: italic; color: var(--dorado-txt); }
    .sec-h2.inv { color: var(--blanco); }
    .sec-h2.inv em { color: var(--dorado-txt); }

    /* ══════════════════ NOSOTROS ══════════════════ */
    .nosotros { background: var(--negro-cl); }

    .nos-grid {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 90px; align-items: center;
    }

    /* Marco cuadrado con logo centrado */
    .nos-visual {
      position: relative;
    }
    .nos-logo-frame {
      aspect-ratio: 1;
      background: rgba(227,185,110,0.08);
      border-radius: 50%;        /* círculo */
      border: 3px solid rgba(227,185,110,0.3);
      box-shadow: 0 0 0 12px rgba(227,185,110,0.08),
                  0 20px 60px rgba(0,0,0,0.4);
      display: flex; align-items: center; justify-content: center;
      position: relative; overflow: hidden;
    }
    .nos-logo-frame::before { display: none; }
    .nos-logo-frame img {
      width: 85%; height: 85%;
      object-fit: contain; position: relative; z-index: 2;
    }
    .nos-badge {
      position: absolute; bottom: 0; right: 0;
      background: var(--dorado); color: var(--azul);
      padding: 16px 20px;
      font-size: 10px; font-weight: 500;
      letter-spacing: 1px; text-transform: uppercase;
      line-height: 1.6;
    }

    .nos-text p {
      font-size: 15px; line-height: 1.9;
      color: #2C4356; margin-top: 22px;
    }

    /* Valores en la home: 4 columnas en desktop, 2 en mobile */
#valores .nos-valores { grid-template-columns:repeat(4,1fr); }
@media (max-width:820px){ #valores .nos-valores { grid-template-columns:1fr 1fr; } }

.mv-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:22px 0 6px; }
@media (max-width:720px){ .mv-grid { grid-template-columns:1fr; } }
.mv-card { border:1px solid rgba(227,185,110,.25); border-left:3px solid var(--dorado);
           background:rgba(227,185,110,.05); padding:16px 18px; border-radius:6px; }
.mv-t { font-family:'Cinzel', serif; font-size:14px; font-weight:700; color:var(--dorado-txt);
        letter-spacing:1px; text-transform:uppercase; margin-bottom:8px; }
.mv-d { font-size:12.5px; line-height:1.75; color:#2C4356; }

.nos-valores {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 1px; background: rgba(227,185,110,0.15);
      border: 1px solid rgba(227,185,110,0.15);
      margin-top: 36px;
    }
    .valor {
      background: rgba(91,108,70,0.04); padding: 22px 20px;
      border-left: 2px solid transparent;
      transition: border-color .3s, background .2s;
    }
    .valor:hover { border-left-color: var(--dorado); background: rgba(227,185,110,0.06); }
    .valor-t { font-size: 12px; font-weight: 500; color: var(--dorado-txt); margin-bottom: 5px; }
    .valor-d { font-size: 11px; line-height: 1.6; color: #2C4356; }

    /* ══════════════════ PROYECTOS ══════════════════ */
    .proyectos { background: var(--negro); }

    .proy-header {
      display: flex; justify-content: space-between; align-items: flex-end;
      margin-bottom: 56px;
    }
    .ver-link {
      color: var(--dorado); text-decoration: none;
      font-size: 10px; letter-spacing: 2px; text-transform: uppercase;
      display: flex; align-items: center; gap: 8px;
      transition: color .2s, gap .2s;
    }
    .ver-link::after { content: '→'; }
    .ver-link:hover { color: var(--blanco); gap: 14px; }

    .proy-grid {
      display: grid;
      grid-template-columns: 1.4fr 1fr 1fr;
      gap: 2px;
    }

    .proy-card {
      position: relative; overflow: hidden;
      background: var(--negro-cl);
      cursor: pointer;
      min-height: 440px;
    }
    .proy-card:first-child { min-height: 520px; }

    /* Fondo con textura del lino en tonos oscuros */
    .proy-bg {
      position: absolute; inset: 0;
      transition: transform .6s ease;
    }
    .proy-bg-1 { background: linear-gradient(150deg, #5B6C46 0%, #5B6C46 100%); }
    .proy-bg-2 { background: linear-gradient(150deg, #5B6C46 0%, #5B6C46 100%); }
    .proy-bg-3 { background: linear-gradient(150deg, #5B6C46 0%, #5B6C46 100%); }
    .proy-card:hover .proy-bg { transform: scale(1.04); }

    .proy-overlay {
      position: absolute; inset: 0;
      /* Con la foto al 100% este velo es lo ÚNICO que sostiene el texto de
         abajo, así que sube a 0.96 y arranca más arriba: sobre una foto clara
         un degradado corto dejaba el nombre del loteo en el aire. */
      background: linear-gradient(0deg, rgba(30,26,22,0.96) 0%, rgba(30,26,22,0.86) 28%, transparent 68%);
    }

    .proy-num {
      /* Va sobre la foto, que puede ser clara o oscura: la sombra lo sostiene
         en las dos. */
      text-shadow: 0 2px 12px rgba(20,16,12,0.55);
      position: absolute; top: 24px; left: 24px;
      font-family: 'Montserrat', serif;
      font-size: 96px; font-weight: 300;
      color: rgba(236,227,209,0.45); line-height: 1;
    }

    /* Patrón crema sutil en las cards */
    .proy-pattern {
      position: absolute; inset: 0; opacity: .04;
      background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23f0ece4' fill-opacity='1' fill-rule='evenodd'%3E%3Cpath d='M0 40L40 0H20L0 20M40 40V20L20 40'/%3E%3C/g%3E%3C/svg%3E");
    }

    .proy-info {
      position: absolute; bottom: 0; left: 0; right: 0;
      padding: 28px 26px;
    }
    .proy-tag {
      display: inline-block;
      border: 1px solid rgba(91,108,70,0.2);
      color: #ECE3D1;
      padding: 4px 12px;
      font-size: 9px; letter-spacing: 2px; text-transform: uppercase;
      margin-bottom: 12px;
    }
    .proy-nombre {
      font-family: 'Cinzel', serif;
      font-size: 24px; font-weight: 300;
      color: #ECE3D1; margin-bottom: 5px;
    }
    .proy-ubic {
      font-size: 11px; color: rgba(236,227,209,0.88); letter-spacing: 1px;
    }

    /* ══════════════════ INSTAGRAM ══════════════════ */
    .instagram { background: var(--negro-cl); }

    .ig-top {
      display: flex; justify-content: space-between; align-items: center;
      margin-bottom: 44px;
    }
    .ig-handle {
      display: flex; align-items: center; gap: 16px;
      text-decoration: none; color: var(--blanco);
    }
    .ig-icon {
      width: 44px; height: 44px; border-radius: 10px;
      background: linear-gradient(45deg,#E3B96E,#e6683c,#dc2743,#cc2366,#bc1888);
      display: flex; align-items: center; justify-content: center;
    }
    .ig-icon svg { width: 22px; height: 22px; fill: white; }
    .ig-name { font-size: 14px; font-weight: 500; color: var(--blanco); }
    .ig-sub  { font-size: 11px; color: #2C4356; margin-top: 2px; }

    .ig-grid {
      display: grid; grid-template-columns: repeat(4,1fr); gap: 3px;
    }
    .ig-post {
      aspect-ratio: 1;
      background: rgba(91,108,70,0.05);
      overflow: hidden; position: relative; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
    }
    .ig-post::after {
      content: ''; position: absolute; inset: 0;
      background: rgba(30,26,22,0.18);
      opacity: 0; transition: opacity .2s;
    }
    .ig-post:hover::after { opacity: 1; }
    .ig-post-label {
      font-size: 28px; opacity: .3;
    }

    /* ══════════════════ CONTACTO ══════════════════ */
    .contacto { background: var(--negro); }

    .contacto-grid {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 80px; align-items: start;
    }

    .c-intro p {
      font-size: 15px; line-height: 1.85;
      color: #2C4356; margin-top: 22px; max-width: 380px;
    }

    .c-datos { display: flex; flex-direction: column; gap: 0; margin-top: 36px; }
    .c-dato {
      display: flex; align-items: center; gap: 16px;
      padding: 18px 0; border-bottom: 1px solid var(--crema-osc);
      font-size: 14px; color: var(--gris-osc);
    }
    .c-dato:first-child { border-top: 1px solid var(--crema-osc); }
    .c-ico {
      width: 36px; height: 36px; flex-shrink: 0;
      border: 1px solid rgba(227,185,110,0.25);
      display: flex; align-items: center; justify-content: center;
    }
    .c-ico svg { width: 15px; height: 15px; fill: var(--dorado); }
    .c-dato a { color: #2C4356; text-decoration: none; transition: color .2s; }
    .c-dato a:hover { color: var(--dorado); }

    /* Form líneas minimalistas */
    .cf { display: flex; flex-direction: column; gap: 20px; }
    .cf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
    .cf-g {}
    .cf-g label {
      display: block; font-size: 9px; font-weight: 500;
      letter-spacing: 2px; text-transform: uppercase;
      color: var(--gris); margin-bottom: 10px;
    }
    .cf-g input, .cf-g select, .cf-g textarea {
      width: 100%;
      border: none; border-bottom: 1px solid rgba(91,108,70,0.18);
      padding: 10px 0; background: transparent;
      font-family: 'Montserrat', sans-serif;
      font-size: 14px; font-weight: 300; color: var(--blanco);
      outline: none; transition: border-color .2s; border-radius: 0;
    }
    .cf-g input::placeholder, .cf-g textarea::placeholder {
      color: #2C4356;
    }
    .cf-g input:focus, .cf-g select:focus, .cf-g textarea:focus {
      border-bottom-color: var(--dorado);
    }
    .cf-g textarea { height: 90px; resize: none; }
    .cf-g select { cursor: pointer; color-scheme: dark; }
    .cf-submit {
      background: var(--dorado); color: var(--crema);
      border: none; cursor: pointer; padding: 16px;
      font-family: 'Montserrat', sans-serif;
      font-size: 11px; font-weight: 600;
      letter-spacing: 2px; text-transform: uppercase;
      transition: background .2s; align-self: flex-start;
      padding-left: 40px; padding-right: 40px;
    }
    .cf-submit:hover { background: var(--dorado-cl); }

    /* ══════════════════ WA FLOAT ══════════════════ */
    /* S6.121 — botón flotante de WhatsApp OCULTO. Queda solo el asesor virtual
       (chatbot widget) que se abre automáticamente. */
    .wa-float {
      display: none !important;
    }
    .wa-float-hidden-old {
      position: fixed; bottom: 96px; right: 28px; z-index: 600;
      width: 56px; height: 56px; background: #25D366;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      text-decoration: none;
      box-shadow: 0 4px 18px rgba(37,211,102,0.3);
      animation: wapulse 3s ease-in-out infinite;
    }
    .wa-float svg { width: 26px; height: 26px; fill: white; }
    @keyframes wapulse {
      0%,100% { box-shadow:0 4px 18px rgba(37,211,102,.3); }
      50%      { box-shadow:0 4px 32px rgba(37,211,102,.55); }
    }

    /* ══════════════════ FOOTER ══════════════════ */
    footer {
      /* S6.131 — el footer es del azul (estructura/confianza). */
      background: var(--azul);
      padding: 64px 6% 32px;
    }
    .foot-inner { max-width: 1200px; margin: 0 auto; }
    .foot-top {
      display: grid; grid-template-columns: 1.5fr 1fr 1fr;
      gap: 48px;
      padding-bottom: 40px;
      border-bottom: 1px solid rgba(236,227,209,0.15);
      margin-bottom: 28px;
    }
    .foot-brand {
      display: flex; align-items: center; gap: 14px;
      margin-bottom: 18px;
    }
    /* Tickets #1544 y #1546 (11/10/2026) — son el MISMO bug visto dos veces:
       "sin ampliae wl.logo se ve mal" y, ampliando, "el logo letra azul con
       fondo azul queda mal.. (o lo poner con circulo tipo crema".
       El logo de Nuevo Rumbo trae la tipografía en navy y el footer ES navy
       (var(--azul)): la palabra "NUEVO RUMBO" desaparecía contra el fondo y lo
       único que se leía era el monograma. La regla de #1484 ya traía el chip
       crema, pero las páginas la ignoraban (ponían `style="height:84px"` a
       mano) y además el chip era de 60x60 con border-radius 50%: un círculo
       sobre un logo APAISADO recorta las puntas — la misma trampa que ya
       documentamos en .nos-logo-img. Ahora es una plaquita crema que se adapta
       al ancho del logo: el navy se lee contra crema y no se recorta nada. */
    .foot-brand-img {
      height: 84px; width: auto; max-width: 100%;
      object-fit: contain;
      background: var(--negro);
      /* 26/10: esquinas suaves en vez de píldora: la píldora recortaba "NUEVO RUMBO" en los bordes */
      border-radius: 18px;
      padding: 12px 22px;
      box-sizing: content-box;
      filter: none; opacity: 1;
    }
    .foot-brand-name {
      font-family: 'Montserrat', serif;
      font-size: 17px; font-weight: 400; color: var(--negro);
    }
    .foot-desc {
      font-size: 13px; line-height: 1.75;
      color: rgba(236,227,209,0.85);
    }
    .foot-col h3, .foot-col h5 {
      font-size: 9px; font-weight: 500; letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--dorado); margin-bottom: 18px;
    }
    .foot-col a {
      display: block; color: rgba(236,227,209,0.85); text-decoration: none;
      font-size: 13px; margin-bottom: 12px; transition: color .2s;
    }
    .foot-col a:hover { color: var(--dorado); }
    .foot-bottom {
      display: flex; justify-content: space-between; align-items: center;
      font-size: 11px; color: rgba(236,227,209,0.6);
      flex-wrap: wrap; gap: 12px;
    }
    .foot-ig {
      display: flex; align-items: center; gap: 8px;
      color: rgba(236,227,209,0.85) !important; text-decoration: none;
      transition: color .2s;
    }
    .foot-ig:hover { color: var(--dorado) !important; }

    /* ══════════════════ RESPONSIVE ══════════════════ */
    @media (max-width: 1024px) {
      .hero { grid-template-columns: 1fr; }
      .hero-right { display: none; }
      .hero-stats { flex-direction: column; }
      .hero-stat { border-right: none; border-bottom: 1px solid var(--crema-osc); }
      .nos-grid { grid-template-columns: 1fr; }
      .nos-visual { max-width: 360px; }
      .proy-grid { grid-template-columns: 1fr 1fr; }
      .contacto-grid { grid-template-columns: 1fr; }
      .ig-grid { grid-template-columns: repeat(3,1fr); }
      .foot-top { grid-template-columns: 1fr; }
    }
    @media (max-width: 720px) {
      .nav-links { display: none; }
      .nav-links.open {
        display: flex; flex-direction: column;
        position: absolute; top: 78px; left: 0; right: 0;
        /* #1445: el panel era crema plano y desentonaba sobre el hero verde.
           2026-08-31: pasa al AZUL de la marca (Confianza). Con el verde la
           letra crema quedaba en 4.4 —al filo— y encima el azul no aparecía en
           ningún lado desde el celular, que es donde más se entra. Sobre el
           azul la misma letra da 8.60 y el menú se lee de una. */
        background: #2C4356;
        padding: 22px 6%; gap: 18px;
        border-bottom: 2px solid var(--dorado);
        box-shadow: 0 14px 34px rgba(0,0,0,.28);
        z-index: 100;
      }
      .nav-links.open a { color: #ECE3D1; }   /* el crema de la paleta: 8.60 sobre el azul */
      .nav-links.open a:hover { color: var(--dorado); }
      .hamburger { display: flex; }
      .proy-grid { grid-template-columns: 1fr; }
      .ig-grid { grid-template-columns: repeat(2,1fr); }
      .proy-header { flex-direction: column; align-items: flex-start; gap: 16px; }
      .cf-row { grid-template-columns: 1fr; }
    }
  
    /* ══════════════════ HISTORIAS DE SUEÑOS ══════════════════ */
    .historias-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2px;
    }
    .historia-card {
      background: var(--negro-cl);
      display: flex; flex-direction: column;
      overflow: hidden;
      transition: transform .3s;
    }
    .historia-card:hover { transform: translateY(-4px); }
    .historia-media {
      aspect-ratio: 9/16;
      max-height: 420px;
      overflow: hidden; position: relative;
      background: var(--negro-cl);
    }
    .historia-media video,
    .historia-media img {
      width: 100%; height: 100%;
      object-fit: cover;
    }
    .historia-placeholder {
      width: 100%; height: 100%;
      background: linear-gradient(135deg, #5B6C46 0%, #5B6C46 100%);
      display: flex; align-items: center; justify-content: center;
      cursor: pointer;
      transition: background .3s;
    }
    .historia-placeholder:hover {
      background: linear-gradient(135deg, #5B6C46 0%, #5B6C46 100%);
    }
    .historia-info {
      padding: 24px 22px; flex: 1;
      border-top: 1px solid rgba(91,108,70,.06);
    }
    .historia-tag {
      display: inline-block;
      border: 1px solid rgba(91,108,70,.2);
      color: #2C4356;
      padding: 3px 10px;
      font-size: 9px; letter-spacing: 2px; text-transform: uppercase;
      margin-bottom: 12px;
    }
    .historia-texto {
      font-size: 14px; line-height: 1.7;
      color: #2C4356;
      font-style: italic;
      margin-bottom: 14px;
    }
    .historia-autor {
      font-size: 11px; letter-spacing: 1px;
      color: #2C4356;
    }

    /* Grid de proyectos — 4 en 2x2 en desktop */
    .proy-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2px;
    }

    @media (max-width: 768px) {
      .historias-grid { grid-template-columns: 1fr; }
    }

    /* Proyectos dinámicos */
    .proy-loading { display: contents; }
    .proy-skeleton {
      min-height: 440px;
      background: linear-gradient(90deg,
        var(--negro-cl) 25%, var(--gris-osc) 37%, var(--negro-cl) 63%);
      background-size: 400px 100%;
      animation: shimmer 1.4s ease infinite;
    }
    @keyframes shimmer {
      0%   { background-position: -400px 0; }
      100% { background-position: 400px 0; }
    }
    .proy-card-img {
      position: absolute; inset: 0;
      object-fit: cover; width: 100%; height: 100%;
      /* La foto se veía al 45% sobre un fondo casi negro: quedaba tan oscura
         que parecía que la tarjeta no tenía foto. Va entera. El texto de abajo
         no depende de esto: lo cubre .proy-overlay, que es un degradado oscuro
         propio. */
      opacity: 1;
      transition: transform .5s ease;
    }
    .proy-card:hover .proy-card-img { transform: scale(1.04); }
    .proy-precio {
      font-size: 13px; color: #2C4356;
      margin-top: 4px; letter-spacing: .5px;
    }

    .proy-cta {
      margin-top: 14px;
      font-size: 11px;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: #E3B96E;
      font-weight: 500;
      display: inline-block;
      padding-top: 8px;
      border-top: 1px solid rgba(91,108,70,0.15);
    }
    .proy-card:hover .proy-cta { color: #2C4356; }

    /* S6.71 — Autofill override (Chrome al autocompletar rompía theme dark
       con fondo amarillo claro y texto negro. Force shadow inset del bg). */
    input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus,
    input:-webkit-autofill:active, textarea:-webkit-autofill, select:-webkit-autofill {
      -webkit-box-shadow: 0 0 0 1000px #ECE3D1 inset !important;
      -webkit-text-fill-color: #5B6C46 !important;
      caret-color: #5B6C46;
      transition: background-color 5000s ease-in-out 0s;
    }

    /* ══════════════════ WORDMARK (placeholder texto — sin logo aún) ══════════════════
       Nuevo Rumbo todavía no subió su logo. Mientras tanto usamos wordmarks
       tipográficos con el color de acento. Reemplazar por <img> cuando llegue. */
    .nav-logo-text {
      font-family: 'Montserrat', serif;
      font-size: 22px; font-weight: 600;
      letter-spacing: 4px; text-transform: uppercase;
      color: var(--dorado); white-space: nowrap;
    }
    .hero-logo-text {
      font-family: 'Montserrat', serif;
      font-size: clamp(48px, 6vw, 96px);
      font-weight: 300; line-height: 1;
      letter-spacing: 8px; text-transform: uppercase;
      color: var(--dorado); text-align: center;
      position: relative; z-index: 2;
    }
    .nos-logo-text {
      font-family: 'Montserrat', serif;
      font-size: clamp(24px, 4vw, 40px);
      font-weight: 400; line-height: 1.1;
      letter-spacing: 4px; text-transform: uppercase;
      color: var(--blanco); text-align: center;
    }
    /* Logo real Nuevo Rumbo (emblema circular sobre fondo crema → badge). */
    .nav-logo-img { height: 46px; width: auto; border-radius: 0; display: block; object-fit: contain; }  /* monograma NR apaisado, sin recorte circular (7/9/2026) */
    /* Logo completo con fondo transparente (subido por el dueño el 7/9/2026): sin
       círculo ni box-shadow (sobre un PNG transparente el box-shadow dibuja un
       rectángulo); la sombra sigue la silueta con drop-shadow. Nunca más ancho que
       su columna. */
    .hero-logo-img { width: min(100%, clamp(400px, 40vw, 620px)); height: auto;
      display: block; margin: 0 auto; position: relative; z-index: 2;
      filter: drop-shadow(0 10px 22px rgba(0,0,0,0.28)); }
    /* 25/9/2026 — dueño: "en Nosotros el círculo tapa Nuevo Rumbo".
       El logo es apaisado y acá tenía border-radius: 50% aplicado A LA IMAGEN, no al marco:
       un redondeo circular sobre algo que no es cuadrado lo recorta en elipse y se come las
       puntas — en este caso la "O" final de NUEVO RUMBO y el borde derecho de
       "DESARROLLOS & PROPIEDADES". El círculo ya lo hace .nos-logo-frame, que además mete la
       imagen entera con object-fit: contain. La imagen no tiene que redondearse. */
    .nos-logo-img { width: clamp(170px, 24vw, 250px); height: auto;
      display: block; margin: 0 auto; }
    .foot-logo-img { height: 42px; width: 42px; border-radius: 50%; vertical-align: middle;
      margin-right: 10px; }
/* S6.126 — Hero con fondo verde → texto crema (contraste). El resto del sitio
   es crema con texto verde; solo el hero invierte. */
.hero-eyebrow span { color:#3D5165 !important; }
.hero-eyebrow-bar { background:rgba(249,240,225,0.5) !important; }
.hero h1 { color:#2C4356 !important; }
.hero h1 em { color:#8D641B !important; }
.hero-tagline { color:rgba(44,67,86,0.92) !important; }
.hero-desc { color:rgba(44,67,86,0.88) !important; }
.hero .btn-outline { color:#2C4356 !important; border-color:rgba(249,240,225,0.45) !important; }
.hero .btn-outline:hover { color:#8D641B !important; border-color:var(--dorado) !important; }
.hero-stats .stat-lbl, .hero-stats .stat-num { color:#2C4356 !important; }
.hero-stats .stat-sub { color:rgba(44,67,86,0.75) !important; }

/* ═══ Rebrand bronce + tipografía Cinzel/Montserrat (S6.126b) ═══ */
.hero h1, .foot-brand-name, .nav-brand-txt .nb1 { font-family:'Cinzel', serif !important; font-weight:700 !important; letter-spacing:.5px; }
.sec-h2, .hero-eyebrow span, .nav-brand-txt .nb2 { font-family:'Montserrat', sans-serif; font-weight:600; }
.valor, .valor-d, .valor-t, [class*="precio"], [class*="price"] { font-family:'Montserrat', sans-serif !important; font-weight:700; }
body { font-weight:400; }

/* ── Proyectos separados por partido ──────────────────────────────────────
   Los botones llevan a cada bloque y el bloque dice cuántos desarrollos tiene.
   El scroll suave ya está en html{scroll-behavior}, así que el salto no marea.

   Usa los nombres de variables de este sitio (--dorado, --blanco, --gris): el
   bloque venía escrito con otros nombres de un renombre que se dio de baja. */
.partido-botones { display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
                   margin:0 0 34px; }
.partido-btn { display:inline-flex; align-items:center; gap:8px;
               padding:14px 28px; border:1px solid rgba(91,108,70,0.25);
               color:#5B6C46; background:transparent; text-decoration:none;
               font-family:'Montserrat',sans-serif; font-size:11px; font-weight:400;
               letter-spacing:2px; text-transform:uppercase;
               transition:background .2s, color .2s, border-color .2s; }
.partido-btn:hover, .partido-btn:focus-visible {
               background:var(--dorado); border-color:var(--dorado);
               color:var(--crema); }
/* El contador hereda el color del botón: con un color propio quedaba ilegible
   al pasar el mouse, que es cuando el fondo cambia. */
.partido-btn-n { font-size:10px; opacity:.7; letter-spacing:.06em; }

.partido-bloque { margin-bottom:44px; }
.partido-bloque:last-child { margin-bottom:0; }
.partido-titulo { display:flex; align-items:baseline; gap:12px; margin:0 0 18px;
                  padding-bottom:10px; border-bottom:1px solid var(--crema-osc); }
.partido-titulo > span:first-child {
                  /* S6.128 — Cinzel es la tipografía de la marca y estaba sólo en el
                     hero, el nav y el footer: el título del partido y el nombre del
                     loteo se veían de otra familia que el resto del sitio. */
                  font-family:'Cinzel', serif; font-size:26px;
                  font-weight:300; line-height:1.15; color:var(--blanco); }
/* .partido-n retirado (S6.128): el dueño no quiere el número de desarrollos al
   lado del partido. Se deja la regla por si vuelve, sin nada que la use. */
.partido-n { font-family:'Montserrat',sans-serif; font-size:10px; font-weight:400;
             letter-spacing:3px; text-transform:uppercase; color:var(--gris-osc); }

/* El ancla queda debajo del header fijo si no se compensa: el título del
   partido terminaba tapado justo después de apretar el botón. */
.partido-bloque { scroll-margin-top:92px; }

@media (max-width:640px) {
  .partido-titulo > span:first-child { font-size:18px; }
  .partido-btn { padding:10px 16px; font-size:10px; }
}

/* ═══ Videos de la home: de la rotonda de Cañuelas al loteo (8/9/2026) ═══
   El dueño: "desde la rotonda, un botón para ir volando al loteo". Un solo
   player que cambia de video, con el CTA al loteo encima.
   OJO: --negro en este sitio es CREMA (#ECE3D1) desde el rebrand, así que la
   sección es de fondo claro y los textos van en azul/verde, nunca en crema. */
.videos-intro {
  font-family: Montserrat, sans-serif; font-size: 14px; color: #5B6C46;
  margin: 0 0 28px; max-width: 560px; line-height: 1.7;
}
.vuelo-player {
  position: relative; background: #000; border-radius: 12px; overflow: hidden;
  aspect-ratio: 16 / 9; max-height: 68vh;
}
.vuelo-player video { width: 100%; height: 100%; object-fit: cover; display: block; background: #000; }
.vuelo-cta {
  position: absolute; right: 16px; bottom: 60px;
  display: inline-flex; align-items: center; gap: 8px;
  background: #E3B96E; color: #2C4356; text-decoration: none;
  padding: 13px 26px; border-radius: 3px;
  font-family: Montserrat, sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase;
  box-shadow: 0 6px 18px rgba(0,0,0,0.35);
  transition: background .2s;
}
.vuelo-cta::after { content: '\2192'; }
.vuelo-cta:hover { background: #d6a751; }

.vuelo-pie {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap; margin-top: 12px;
}
.vuelo-donde {
  font-family: Montserrat, sans-serif; font-size: 12px; letter-spacing: 2px;
  text-transform: uppercase; color: #5B6C46;
}
.vuelo-reset {
  background: none; border: 1px solid rgba(91,108,70,0.35); color: #2C4356;
  padding: 9px 18px; border-radius: 30px; cursor: pointer;
  font-family: Montserrat, sans-serif; font-size: 10px; letter-spacing: 1.5px;
  text-transform: uppercase; transition: border-color .2s, background .2s;
}
.vuelo-reset:hover { border-color: #E3B96E; background: #E3B96E; }

.videos-loteos { margin-top: 34px; }
.videos-loteos-lbl {
  display: block; font-family: Montserrat, sans-serif; font-size: 10px;
  letter-spacing: 3px; text-transform: uppercase; color: #5B6C46; margin-bottom: 14px;
}
.videos-loteos-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.videos-loteos-btns a {
  display: inline-flex; align-items: center;
  border: 1px solid rgba(91,108,70,0.35); color: #2C4356; text-decoration: none;
  padding: 11px 22px; border-radius: 30px; background: #ffffff;
  font-family: Montserrat, sans-serif; font-size: 11px; letter-spacing: 1.5px;
  text-transform: uppercase; cursor: pointer;
  transition: border-color .2s, color .2s, background .2s;
}
.videos-loteos-btns a.con-vuelo { border-color: #E3B96E; }
.videos-loteos-btns a.con-vuelo::before { content: '\2708'; margin-right: 8px; }
.videos-loteos-btns a:hover {
  border-color: #E3B96E; color: #2C4356; background: #E3B96E;
}
@media (max-width: 560px) {
  .vuelo-player { aspect-ratio: 4 / 3; }
  .vuelo-cta { right: 10px; bottom: 54px; padding: 11px 18px; font-size: 10px; }
  .videos-loteos-btns a { padding: 10px 18px; font-size: 10px; }
}

/* La vista 360 de la rotonda y el CTA grande al terminar el vuelo (8/9/2026). */
.rotonda-360 {
  width: 100%; background: #000; border-radius: 12px; overflow: hidden;
  min-height: 320px; aspect-ratio: 16 / 9; max-height: 68vh;
}
.rotonda-360 canvas { display: block; width: 100% !important; height: 100% !important; }
.rotonda-pie {
  font-family: Montserrat, sans-serif; font-size: 12px; color: #5B6C46;
  letter-spacing: 1px; margin: 10px 0 0;
}
.vuelo-cta.vuelo-cta-fin {
  right: 50%; transform: translateX(50%); bottom: 50%;
  padding: 18px 40px; font-size: 13px;
}

/* Botones adentro de la foto 360 de la rotonda (dueño 8/9/2026). */
.rotonda-caja { position: relative; }
.rotonda-overlay {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 4;
  padding: 34px 16px 14px;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.72) 60%, rgba(0,0,0,0.82) 100%);
  border-radius: 0 0 12px 12px; pointer-events: none;
}
.rotonda-overlay-lbl {
  display: block; font-family: Montserrat, sans-serif; font-size: 10px;
  letter-spacing: 3px; text-transform: uppercase; color: #F0D9A8; margin-bottom: 10px;
  text-shadow: 0 1px 4px rgba(0,0,0,.9);
}
.rotonda-overlay-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.rotonda-overlay-btns a {
  pointer-events: auto;
  display: inline-flex; align-items: center;
  background: rgba(255,255,255,0.92); color: #2C4356; text-decoration: none;
  border: 1px solid rgba(255,255,255,0.5); border-radius: 30px;
  padding: 10px 18px; cursor: pointer;
  font-family: Montserrat, sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: 1.2px; text-transform: uppercase;
  transition: background .2s, color .2s;
}
.rotonda-overlay-btns a.con-vuelo { background: #E3B96E; }
.rotonda-overlay-btns a.con-vuelo::before { content: '\2708'; margin-right: 7px; }
.rotonda-overlay-btns a:hover { background: #E3B96E; color: #2C4356; }
@media (max-width: 560px) {
  .rotonda-overlay { padding: 26px 10px 10px; }
  .rotonda-overlay-btns a { padding: 9px 13px; font-size: 10px; letter-spacing: .8px; }
}

/* Flechas para girar la vista 360 y el cartel de hacia dónde se está mirando. */
.rotonda-flecha {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
  width: 46px; height: 46px; border-radius: 50%; cursor: pointer;
  border: 1px solid rgba(255,255,255,0.5); background: rgba(255,255,255,0.9);
  color: #2C4356; font-size: 26px; line-height: 1; font-family: Montserrat, sans-serif;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,0.3); transition: background .2s;
}
.rotonda-flecha:hover { background: #E3B96E; }
.rotonda-flecha.izq { left: 12px; }
.rotonda-flecha.der { right: 12px; }
.rotonda-mirando {
  position: absolute; top: 14px; left: 50%; transform: translateX(-50%); z-index: 5;
  background: rgba(44,67,86,0.85); color: #ECE3D1; border-radius: 30px;
  padding: 9px 18px; font-family: Montserrat, sans-serif; font-size: 12px;
  letter-spacing: 1px; white-space: nowrap;
}
@media (max-width: 560px) {
  .rotonda-flecha { width: 38px; height: 38px; font-size: 22px; }
  .rotonda-mirando { font-size: 10px; padding: 7px 12px; }
}

/* Volver a la rotonda desde el vuelo, adentro de la foto 360. */
.rotonda-volver {
  position: absolute; top: 14px; right: 14px; z-index: 6; cursor: pointer;
  background: rgba(44,67,86,0.85); color: #ECE3D1; border: 1px solid rgba(255,255,255,0.3);
  border-radius: 30px; padding: 9px 16px;
  font-family: Montserrat, sans-serif; font-size: 11px; letter-spacing: 1px;
}
.rotonda-volver:hover { background: #E3B96E; color: #2C4356; }

/* En el celular la franja de botones tapaba media foto: una sola fila que se
   desliza al costado (dueño 8/9). */
@media (max-width: 700px) {
  .rotonda-overlay { padding: 20px 8px 8px; }
  .rotonda-overlay-lbl { margin-bottom: 6px; font-size: 9px; letter-spacing: 2px; }
  .rotonda-overlay-btns {
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    -webkit-overflow-scrolling: touch; padding-bottom: 2px;
  }
  .rotonda-overlay-btns::-webkit-scrollbar { display: none; }
  .rotonda-overlay-btns a { flex: 0 0 auto; padding: 9px 14px; font-size: 10px; letter-spacing: .6px; }
  .rotonda-360 { aspect-ratio: 3 / 4; }
}

/* ── (20/9/2026) Tarjetas de loteos más chicas: 4 por línea ────────────────────────────────────────────
   Dueño: "las tarjetas de los lotes en web podrían ser más chicas, ocupan mucho espacio… poner 4 por línea".
   Antes: 2 por línea y 440-520 px de alto cada una. Va al final para ganarle a las reglas de arriba. */
.proy-grid { grid-template-columns: repeat(4, 1fr); gap: 2px; }
.proy-card, .proy-card:first-child { min-height: 300px; }
.proy-card .proy-nombre { font-size: 19px; }
.proy-card .proy-info { padding: 18px; }
@media (max-width: 1100px) { .proy-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .proy-grid { grid-template-columns: 1fr 1fr; }
                             .proy-card, .proy-card:first-child { min-height: 230px; }
                             .proy-card .proy-nombre { font-size: 16px; } .proy-card .proy-info { padding: 12px; } }

/* 27/10 (Martín): en el celu el titular va en 2 líneas exactas: "El punto de partida" / "para tus proyectos." */
@media (max-width: 600px) {
  .hero h1 { white-space: nowrap !important; font-size: clamp(22px, 7.4vw, 44px) !important; line-height: 1.15 !important; }
}

/* ══════════════ NR WEB: Quiénes somos, Propiedades, Cómo comprar (14/11/2026) ══════════════
   Todo con las variables de marca de arriba (lint_brand_hex): ni un hex nuevo. */
.nrq { background: var(--negro); }
.nrq .nrq-grid { display: grid; gap: 28px; grid-template-columns: 1fr; align-items: center; }
.nrq p { font-size: 15px; line-height: 1.8; color: var(--texto); max-width: 60ch; }
.nrq .nrq-links { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 22px; }
.nrq-dos { display: grid; gap: 14px; grid-template-columns: 1fr; }
.nrq-dos a { display: block; padding: 22px 22px; background: var(--crema); border: 1px solid rgba(91,108,70,.2); text-decoration: none; color: var(--azul); }
.nrq-dos a:hover { border-color: var(--dorado); }
.nrq-dos b { display: block; font-family: 'Cinzel', serif; font-size: 20px; margin-bottom: 6px; font-weight: 600; }
.nrq-dos span { font-size: 13px; line-height: 1.6; color: var(--gris-osc); }

.nrp-sec { background: var(--negro-cl); }
.nrp-sec .sec-inner, .nrc-sec .sec-inner { max-width: 1200px; margin: 0 auto; }
.nrp-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.nrp-grid { display: grid; gap: 18px; grid-template-columns: 1fr; }
.nrp-card { display: flex; flex-direction: column; background: var(--crema); text-decoration: none; color: var(--azul); border: 1px solid rgba(91,108,70,.18); overflow: hidden; transition: transform .2s, box-shadow .2s; }
.nrp-card:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(44,67,86,.14); }
.nrp-foto { position: relative; aspect-ratio: 4/3; background: var(--crema-osc); overflow: hidden; }
.nrp-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nrp-chip { position: absolute; left: 12px; top: 12px; background: var(--azul); color: var(--crema); font-size: 10px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; padding: 6px 10px; }
.nrp-body { padding: 16px 18px 20px; display: flex; flex-direction: column; gap: 6px; }
.nrp-tipo { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--gris-osc); font-weight: 600; }
.nrp-tit { font-family: 'Cinzel', serif; font-size: 20px; line-height: 1.25; font-weight: 600; color: var(--azul); }
.nrp-lugar, .nrp-specs { font-size: 13px; color: var(--gris-osc); line-height: 1.5; }
.nrp-precio { font-size: 20px; font-weight: 600; color: var(--azul); margin-top: 6px; }
.nrp-precio small { font-size: 12px; font-weight: 400; color: var(--gris-osc); }
.nrp-vacio { text-align: center; padding: 44px 22px; background: var(--crema); border: 1px dashed rgba(91,108,70,.35); }
.nrp-vacio-t { font-family: 'Cinzel', serif; font-size: 26px; color: var(--azul); margin-bottom: 10px; font-weight: 600; }
.nrp-vacio p { font-size: 14px; line-height: 1.7; max-width: 46ch; margin: 0 auto 22px; color: var(--texto); }

.nrc-sec { background: var(--negro); }
.nrc-grid { display: grid; gap: 16px; grid-template-columns: 1fr; margin-top: 26px; }
.nrc-card { background: var(--crema); border: 1px solid rgba(91,108,70,.18); padding: 20px 22px; display: flex; flex-direction: column; gap: 8px; }
.nrc-card h3 { font-family: 'Cinzel', serif; font-size: 20px; color: var(--azul); font-weight: 600; }
.nrc-desde { font-size: 13px; color: var(--gris-osc); }
.nrc-card ul { list-style: none; padding: 0; display: grid; gap: 6px; font-size: 14px; line-height: 1.5; color: var(--texto); }
.nrc-card li::before { content: '•'; color: var(--dorado-cl); margin-right: 8px; }
.nrc-link { margin-top: 6px; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--azul); font-weight: 600; text-decoration: none; }
.nrc-link:hover { color: var(--dorado-cl); }
.nrc-pasos { display: grid; gap: 14px; grid-template-columns: 1fr; counter-reset: paso; margin-top: 26px; }
.nrc-paso { position: relative; padding: 18px 20px 18px 62px; background: var(--crema-osc); }
.nrc-paso::before { counter-increment: paso; content: counter(paso); position: absolute; left: 18px; top: 16px; width: 30px; height: 30px; border-radius: 50%; background: var(--azul); color: var(--crema); font-weight: 600; font-size: 14px; display: grid; place-items: center; }
.nrc-paso b { display: block; color: var(--azul); font-size: 15px; margin-bottom: 4px; font-weight: 600; }
.nrc-paso span { font-size: 13.5px; line-height: 1.6; color: var(--texto); }
.nrc-sec[data-sin-planes] .nrc-grid, .nrc-sec[data-sin-planes] .nrc-planes-t { display: none; }

/* Página de propiedades y ficha */
.nrp-pagina { padding: 120px 6% 60px; min-height: 70vh; }
.nrp-pagina .sec-inner { max-width: 1200px; margin: 0 auto; }
.nrp-filtros { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 24px; }
.nrp-filtros a { padding: 9px 16px; border: 1px solid rgba(91,108,70,.3); font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none; color: var(--azul); }
.nrp-filtros a[aria-current="true"] { background: var(--azul); color: var(--crema); border-color: var(--azul); }
.nrf-cab { margin-bottom: 20px; }
.nrf-tit { font-family: 'Cinzel', serif; font-size: clamp(26px, 5vw, 40px); line-height: 1.2; color: var(--azul); font-weight: 600; margin: 4px 0 8px; }
.nrf-gal { margin-bottom: 26px; }
.nrf-grande { width: 100%; max-height: 620px; aspect-ratio: 16/10; object-fit: cover; display: block; background: var(--crema-osc); }
.nrf-tiras { display: flex; gap: 8px; overflow-x: auto; padding: 10px 0 4px; }
.nrf-mini { flex: 0 0 84px; height: 62px; padding: 0; border: 2px solid transparent; background: none; cursor: pointer; }
.nrf-mini.on { border-color: var(--dorado); }
.nrf-mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nrf-cols { display: grid; gap: 28px; grid-template-columns: 1fr; }
.nrf-datos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 24px; }
.nrf-dato { background: var(--crema); padding: 14px 16px; border: 1px solid rgba(91,108,70,.15); }
.nrf-dato b { display: block; font-size: 18px; color: var(--azul); font-weight: 600; }
.nrf-dato span { font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: var(--gris-osc); }
.nrf-bloque { margin-bottom: 24px; }
.nrf-bloque h2 { font-family: 'Cinzel', serif; font-size: 20px; color: var(--azul); margin-bottom: 10px; font-weight: 600; }
.nrf-bloque p { font-size: 15px; line-height: 1.8; margin-bottom: 10px; color: var(--texto); }
.nrf-lista { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.nrf-lista li { background: var(--crema); border: 1px solid rgba(91,108,70,.2); padding: 7px 12px; font-size: 13px; color: var(--azul); text-transform: capitalize; }
.nrf-card { background: var(--crema); border: 1px solid rgba(91,108,70,.2); padding: 22px; display: grid; gap: 14px; }
.nrf-precio { font-size: 28px; font-weight: 600; color: var(--azul); }
.nrf-exp { font-size: 13px; color: var(--gris-osc); margin-top: -8px; }
.nrf-wa { justify-content: center; }
.nrf-form { display: grid; gap: 12px; border-top: 1px solid rgba(91,108,70,.2); padding-top: 16px; }
.nrf-form h3 { font-size: 15px; color: var(--azul); font-weight: 600; }
.nrf-form label { display: grid; gap: 4px; }
.nrf-form label span { font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: var(--gris-osc); }
.nrf-form input, .nrf-form textarea { font: inherit; font-size: 16px; padding: 12px; border: 1px solid rgba(91,108,70,.35); background: var(--crema); color: var(--texto); width: 100%; }
.nrf-form button { border: 0; cursor: pointer; justify-content: center; }
.nrf-est { font-size: 13px; color: var(--azul); min-height: 1em; }
.nrf-est.err { color: #8D3B1B; }
[hidden] { display: none !important; }

@media (min-width: 700px) {
  .nrp-grid, .nrc-grid { grid-template-columns: repeat(2, 1fr); }
  .nrq .nrq-grid { grid-template-columns: 1.2fr 1fr; gap: 48px; }
  .nrc-pasos { grid-template-columns: repeat(3, 1fr); }
  .nrf-datos { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1000px) {
  .nrp-grid { grid-template-columns: repeat(3, 1fr); }
  .nrc-grid { grid-template-columns: repeat(3, 1fr); }
  .nrf-cols { grid-template-columns: 1.6fr 1fr; align-items: start; }
  .nrf-der { position: sticky; top: 96px; }
}

.nrh { min-height: 0; padding: 130px 6% 70px; background: var(--negro-cl); display: block; }
.nrh .nrh-in { max-width: 1200px; margin: 0 auto; }
.nrh-h1 { font-family: 'Montserrat', serif; font-weight: 300; font-size: clamp(34px, 7vw, 68px); line-height: 1.1; color: var(--azul); margin-bottom: 18px; }
.nrh-h1 em { color: var(--dorado-txt); font-style: italic; }
.nrh-p { font-size: 16px; line-height: 1.7; max-width: 52ch; color: var(--texto); margin-bottom: 28px; }