:root{
    --ink:#0c0a08;
    --card:#17130d;
    --card-2:#1d1810;
    --white:#f5efe4;
    --soft:#cdc1ac;
    --muted:#94886f;
    --gold:#dcb978;
    --gold-2:#f0d8a3;
    --gold-deep:#a07d3c;
    --line:rgba(220,185,120,.16);
    --line-2:rgba(220,185,120,.30);
    --wa:#25d366;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
  body{
    font-family:'Inter',system-ui,sans-serif;
    color:var(--white);background:#080705;
    min-height:100vh;min-height:100dvh;line-height:1.5;
    overflow-x:hidden;-webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.disp{font-family:'Sora',sans-serif}

  /* backdrop */
  .bg{position:fixed;inset:0;z-index:-2;
    background:#080705;overflow:hidden;}
  .bg::before{content:"";position:absolute;inset:0;
    height:70vh;bottom:auto;
    background:url('img/dormitorio.png') center 40%/cover no-repeat;
    image-rendering:-webkit-optimize-contrast;
    filter:saturate(1.02) contrast(1.02) brightness(.82);}
  .bg::after{content:"";position:absolute;inset:0;
    background:
      linear-gradient(180deg, rgba(8,7,5,.25) 0%, rgba(8,7,5,.55) 30%, rgba(8,7,5,.92) 52%, #080705 64%, #080705 100%),
      radial-gradient(60% 40% at 50% 8%, rgba(220,185,120,.10), transparent 70%);}
  .grain{position:fixed;inset:0;z-index:-1;opacity:.05;pointer-events:none;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");}

  .wrap{max-width:452px;margin:0 auto;
    padding:30px 20px calc(120px + env(safe-area-inset-bottom));
    position:relative;z-index:2;}

  .r{opacity:0;transform:translateY(16px);animation:rise .7s cubic-bezier(.22,1,.36,1) forwards}
  @keyframes rise{to{opacity:1;transform:none}}

  /* brand */
  .brand{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:18px}
  .mark{width:88px;height:88px;border-radius:22px;display:grid;place-items:center;margin-bottom:14px;
    background:linear-gradient(155deg,#1a150d,#0c0a07);border:1px solid var(--line-2);
    box-shadow:0 18px 44px -16px rgba(0,0,0,.8), inset 0 1px 0 rgba(240,216,163,.14)}
  .mark svg{width:60px;height:60px}
  .wm{font-family:'Sora';font-weight:700;font-size:25px;letter-spacing:-.3px;line-height:1}
  .wm b{color:var(--gold);font-weight:800}
  .kicker{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);
    font-weight:600;margin-top:9px}

  /* authority pill */
  .center{display:flex;justify-content:center}
  .pill{display:inline-flex;align-items:center;gap:8px;margin:14px auto 16px;
    padding:8px 15px;border-radius:40px;border:1px solid var(--line-2);
    background:linear-gradient(135deg,rgba(220,185,120,.16),rgba(220,185,120,.04));
    font-size:11px;letter-spacing:1px;text-transform:uppercase;font-weight:600;color:var(--gold-2)}
  .pill .dot{width:6px;height:6px;border-radius:50%;background:var(--gold);
    box-shadow:0 0 0 4px rgba(220,185,120,.18)}

  /* hero */
  .hero{text-align:center;margin-bottom:16px}
  .hero h1{font-size:31px;line-height:1.12;font-weight:800;letter-spacing:-.6px}
  .hero h1 .hl{position:relative;color:var(--gold);white-space:nowrap}
  .hero h1 .hl::after{content:"";position:absolute;left:-2%;right:-2%;bottom:.06em;height:.32em;
    background:linear-gradient(90deg,rgba(220,185,120,.34),rgba(220,185,120,.1));z-index:-1;border-radius:3px}
  .hero p{font-size:14.5px;color:var(--soft);margin-top:13px;line-height:1.55}
  .hero p b{color:var(--white);font-weight:600}

  /* social proof */
  .proof{display:flex;align-items:center;justify-content:center;gap:11px;margin:16px 0 24px;flex-wrap:wrap}
  .proof .st{color:var(--gold);letter-spacing:2px;font-size:13px}
  .proof .pt{text-align:left;font-size:11.5px;color:var(--soft);line-height:1.3}
  .proof .pt b{color:var(--white);font-weight:700}

  /* primary CTA */
  .cta{display:block;text-decoration:none;position:relative;overflow:hidden;cursor:pointer;
    border-radius:16px;padding:17px 18px;margin-bottom:12px;text-align:center;
    background:linear-gradient(135deg,#f0d8a3 0%,#dcb978 46%,#a07d3c 100%);
    color:#1a1206;box-shadow:0 16px 40px -14px rgba(220,185,120,.6)}
  .cta .t{font-family:'Sora';font-size:16.5px;font-weight:800;letter-spacing:.2px;display:flex;
    align-items:center;justify-content:center;gap:9px}
  .cta .t svg{width:20px;height:20px;fill:#1a1206}
  .cta .s{font-size:11.5px;font-weight:500;opacity:.7;margin-top:3px}
  .cta::after{content:"";position:absolute;top:0;left:-130%;width:60%;height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);
    transform:skewX(-18deg);animation:sheen 4.5s ease-in-out infinite}
  @keyframes sheen{0%,74%{left:-130%}86%{left:130%}100%{left:130%}}

  /* link buttons */
  .link{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--white);cursor:pointer;
    background:var(--card);border:1px solid var(--line);border-radius:15px;
    padding:15px 16px;margin-bottom:11px;position:relative;
    transition:transform .3s cubic-bezier(.22,1,.36,1),border-color .3s,background .3s}
  .link:hover,.link:active{transform:translateY(-2px);border-color:var(--gold);background:var(--card-2)}
  .link.feat{background:linear-gradient(160deg,#241c10,#17130d);border-color:var(--line-2)}
  .kitchen-card{flex-direction:column;align-items:stretch;padding:0;overflow:hidden;gap:0}
  .kitchen-card .kitchen-img{width:100%;height:180px;object-fit:cover;display:block;border-bottom:1px solid var(--line)}
  .kitchen-card .body{padding:14px 16px}
  .kitchen-card .arr{position:absolute;right:14px;bottom:14px}
  .kitchen-card{position:relative}
  .dormitorio-card{flex-direction:column;align-items:stretch;justify-content:flex-end;min-height:220px;padding:0;overflow:hidden;gap:0;position:relative;border-color:var(--line-2)}
  .dormitorio-card::before{content:"";position:absolute;inset:0;background:url('img/dormitorio.png') center/cover no-repeat;z-index:0}
  .dormitorio-card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top, rgba(12,10,8,.92) 0%, rgba(12,10,8,.5) 50%, rgba(12,10,8,.2) 100%);z-index:1}
  .dormitorio-card .body{position:relative;z-index:2;padding:14px 16px}
  .dormitorio-card .arr{position:absolute;right:14px;bottom:14px;z-index:2}
  .dormitorio-card .h{color:var(--white);text-shadow:0 2px 10px rgba(0,0,0,.5)}
  .dormitorio-card .d{color:var(--soft);text-shadow:0 1px 6px rgba(0,0,0,.5)}
  .ico{flex:0 0 44px;height:44px;border-radius:12px;display:grid;place-items:center;
    background:radial-gradient(circle at 40% 30%,rgba(220,185,120,.26),rgba(220,185,120,.05));
    border:1px solid var(--line);color:var(--gold-2)}
  .ico svg{width:21px;height:21px;fill:currentColor}
  .ico.wa{background:rgba(37,211,102,.16);border-color:rgba(37,211,102,.4);color:#43e07f}
  .link .body{flex:1;min-width:0}
  .link .h{font-family:'Sora';font-size:14.5px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .link .d{font-size:11.5px;color:var(--muted);margin-top:2px}
  .link .arr{color:var(--gold);font-size:17px;opacity:.55;transition:transform .3s,opacity .3s}
  .link:hover .arr{transform:translateX(3px);opacity:1}
  .tag{font-size:9px;letter-spacing:.6px;text-transform:uppercase;color:#1a1206;font-weight:800;
    background:linear-gradient(135deg,#f0d8a3,#dcb978);padding:3px 7px;border-radius:30px}

  /* section divider */
  .sec{display:flex;align-items:center;gap:12px;margin:28px 2px 14px}
  .sec span{font-family:'Sora';font-size:10.5px;letter-spacing:2.6px;text-transform:uppercase;
    color:var(--gold);font-weight:600;white-space:nowrap}
  .sec::before,.sec::after{content:"";height:1px;flex:1;
    background:linear-gradient(90deg,transparent,var(--line-2),transparent)}

  /* value props */
  .why{display:grid;gap:10px}
  .vp{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);
    border-radius:15px;padding:15px 16px}
  .vp .vi{flex:0 0 44px;height:44px;border-radius:12px;display:grid;place-items:center;
    background:radial-gradient(circle at 38% 30%,rgba(220,185,120,.28),rgba(220,185,120,.05));
    border:1px solid var(--line);color:var(--gold-2)}
  .vp .vi svg{width:21px;height:21px;fill:currentColor}
  .vp .h{font-family:'Sora';font-size:14.5px;font-weight:600}
  .vp .d{font-size:12px;color:var(--muted);margin-top:2px}

  /* stats */
  .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .stat{text-align:center;background:linear-gradient(165deg,var(--card-2),#100c08);
    border:1px solid var(--line);border-radius:16px;padding:17px 6px}
  .stat .n{font-family:'Sora';font-size:25px;font-weight:800;color:var(--white);line-height:1;letter-spacing:-.6px}
  .stat .n span{color:var(--gold)}
  .stat .l{font-size:9px;letter-spacing:.6px;color:var(--muted);margin-top:7px;text-transform:uppercase;font-weight:600}

  /* testimonials */
  .ratehead{text-align:center;margin:14px 0}
  .rate-n{font-family:'Sora';font-size:46px;font-weight:800;color:var(--white);line-height:1;letter-spacing:-1.5px}
  .rate-n span{font-size:19px;color:var(--muted)}
  .rate-stars{color:var(--gold);font-size:16px;letter-spacing:4px;margin-top:5px}
  .rate-l{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);margin-top:7px;font-weight:600}
  .reviews{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
    padding:2px 2px 6px;margin:0 -2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .reviews::-webkit-scrollbar{display:none}
  .rev{flex:0 0 86%;scroll-snap-align:center;background:var(--card);
    border:1px solid var(--line);border-radius:16px;padding:18px}
  .rate-stars.sm{font-size:12px;letter-spacing:3px;margin:0 0 11px}
  .rev p{font-size:14px;line-height:1.55;color:var(--white)}
  .rev .who{font-size:12px;color:var(--soft);margin-top:12px;font-weight:500}
  .swipe-hint{text-align:center;font-size:10px;letter-spacing:2px;text-transform:uppercase;
    color:var(--muted);opacity:.7;margin-top:11px}

  /* footer */
  .foot{text-align:center;margin-top:30px;color:var(--muted);font-size:11px}
  .foot a{color:var(--gold);text-decoration:none}
  .social{display:flex;justify-content:center;gap:13px;margin-bottom:15px}
  .social a{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
    border:1px solid var(--line);background:var(--card);color:var(--white);
    text-decoration:none;transition:transform .3s,border-color .3s}
  .social a:hover{transform:translateY(-3px);border-color:var(--gold)}
  .social svg{width:18px;height:18px;fill:currentColor}

  /* floating whatsapp */
  .float{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:50;cursor:pointer;
    width:58px;height:58px;border-radius:50%;background:var(--wa);display:grid;place-items:center;
    box-shadow:0 10px 28px -6px rgba(37,211,102,.6);text-decoration:none;animation:bob 3s ease-in-out infinite}
  .float svg{width:30px;height:30px;fill:#fff}
  .float::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--wa);
    opacity:.5;animation:ripple 2.4s ease-out infinite;z-index:-1}
  @keyframes ripple{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.9);opacity:0}}
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

  @media (prefers-reduced-motion:reduce){
    .r,.cta::after,.float,.float::before{animation:none!important;opacity:1!important;transform:none!important}
    html{scroll-behavior:auto}
  }