:root{
    --ink:#0C2545; --cobalt:#15407A; --cobalt-2:#1B538F; --teal:#2E8B96; --teal-light:#4FB3BF;
    --gold:#E8A23D; --gold-soft:#F2C879; --coral:#D8483B; --sand:#F4EFE6; --sand-2:#EAE2D2;
    --cream:#FBF7EF; --text:#22303f; --muted:#5b6b78; --wa:#25D366;
    --radius:18px; --shadow:0 18px 50px -22px rgba(12,37,69,.55);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0;font-family:'Mulish',system-ui,sans-serif;color:var(--text);background:var(--sand);line-height:1.6;-webkit-font-smoothing:antialiased;}
  h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:600;line-height:1.12;margin:0;}
  a{color:inherit;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1120px;margin:0 auto;padding:0 22px;}
  .script{font-family:'Pinyon Script',cursive;font-weight:400;}
  .star-div{display:flex;align-items:center;gap:16px;justify-content:center;margin:0 auto;max-width:340px;}
  .star-div .line{height:2px;flex:1;background:linear-gradient(90deg,transparent,var(--gold));}
  .star-div .line.r{background:linear-gradient(90deg,var(--gold),transparent);}
  .star-div svg{width:26px;height:26px;flex:none;color:var(--gold);}

  /* LANG TOGGLE */
  .lang-toggle{position:fixed;top:12px;right:12px;z-index:50;display:flex;background:rgba(12,37,69,.55);backdrop-filter:blur(6px);padding:2px;border-radius:8px;box-shadow:var(--shadow);}
  .lang-btn{border:none;cursor:pointer;font-family:'Mulish';font-weight:700;font-size:.6rem;letter-spacing:.03em;line-height:1;padding:5px 7px;border-radius:6px;background:transparent;color:#fff;opacity:.6;transition:all .15s ease;display:flex;align-items:center;gap:4px;}
  .lang-btn .flag-icon{width:15px;height:10px;border-radius:2px;flex-shrink:0;box-shadow:0 0 0 .5px rgba(255,255,255,.4);}
  .lang-btn.active{background:var(--gold);color:#3a2407;opacity:1;}
  .lang-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
  @media(max-width:820px){.lang-toggle{top:8px;right:8px;}.lang-btn{padding:4px 6px;font-size:.56rem;gap:3px;}.lang-btn .flag-icon{width:13px;height:9px;}}

  /* HERO */
  .hero{position:relative;background:var(--ink);}
  .hero-mural{display:block;width:100%;max-width:1400px;margin:0 auto;height:auto;}
  .hero-bar{position:relative;z-index:2;width:100%;padding:28px 0 34px;background:var(--ink);}
  .hero-eyebrow{color:var(--gold-soft);font-weight:700;letter-spacing:.22em;text-transform:uppercase;font-size:.72rem;margin-bottom:14px;}
  .hero-bar p.tag{color:#eaf2ff;font-size:1.18rem;max-width:34ch;margin:0 0 22px;font-weight:500;}
  .cta-row{display:flex;flex-wrap:wrap;gap:13px;}
  .btn{display:inline-flex;align-items:center;gap:9px;border:none;cursor:pointer;font-family:'Mulish';font-weight:700;font-size:.98rem;padding:14px 24px;border-radius:50px;text-decoration:none;transition:transform .15s ease,box-shadow .2s ease,background .2s ease;}
  .btn-gold{background:linear-gradient(135deg,var(--gold),#d98f2a);color:#3a2407;box-shadow:0 10px 26px -10px rgba(232,162,61,.8);}
  .btn-ghost{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.55);backdrop-filter:blur(4px);}
  .btn-wa{background:var(--wa);color:#04331a;}
  .btn:hover{transform:translateY(-2px);}
  .btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:3px;}

  /* STORY */
  .story{padding:78px 0 60px;text-align:center;}
  .story h2{font-size:clamp(1.9rem,4.4vw,2.9rem);color:var(--ink);}
  .story .lede{max-width:62ch;margin:18px auto 0;color:var(--muted);font-size:1.12rem;}
  .perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;max-width:900px;margin:44px auto 0;}
  .perk{background:var(--cream);border:1px solid var(--sand-2);border-radius:14px;padding:18px 14px;text-align:center;}
  .perk svg{width:28px;height:28px;color:var(--teal);margin-bottom:8px;}
  .perk b{display:block;font-family:'Fraunces';font-size:1rem;color:var(--ink);}
  .perk span{font-size:.84rem;color:var(--muted);}

  /* SUITES */
  .suites{padding:20px 0 74px;}
  .flyer-wrap{max-width:420px;margin:0 auto 44px;}
  .flyer-wrap img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);}
  .whole-wrap{background:linear-gradient(150deg,var(--ink),var(--cobalt));color:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);max-width:940px;margin:0 auto;padding:44px 34px;text-align:center;}
  .whole-wrap .kicker{color:var(--gold-soft);}
  .whole-wrap h2{color:#fff;margin:.2em 0 .4em;}
  .whole-wrap p{color:#eaf1fb;max-width:720px;margin:0 auto 16px;}
  .whole-wrap .sleeps{display:inline-block;background:var(--gold);color:#3a2407;font-weight:800;letter-spacing:.02em;padding:7px 16px;border-radius:999px;margin-bottom:20px;font-size:.9rem;}
  .whole-cta{margin-top:14px;}
  .b-vrbo{background:var(--gold);color:#3a2407;font-weight:800;}
  .xlinks{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;}
  .mnu{margin:14px 0 12px;border-top:1px solid var(--sand-2);border-bottom:1px solid var(--sand-2);}
  .mnu summary{cursor:pointer;list-style:none;padding:11px 2px;font-weight:700;color:var(--teal);font-size:.95rem;display:flex;align-items:center;gap:8px;}
  .mnu summary::-webkit-details-marker{display:none;}
  .mnu summary::after{content:"\203A";margin-left:auto;font-size:1.3rem;line-height:1;transform:rotate(90deg);transition:transform .2s;color:var(--muted);}
  .mnu[open] summary::after{transform:rotate(-90deg);}
  .mnu-body{padding:2px 0 16px;}
  .mnu-body h4{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:16px 0 7px;font-weight:800;}
  .mnu-body h4:first-child{margin-top:4px;}
  .mnu-body ul{list-style:none;margin:0;padding:0;}
  .mnu-body li{display:flex;align-items:baseline;gap:8px;padding:4px 0;font-size:.92rem;color:var(--ink);}
  .mnu-body li span{flex:1;}
  .mnu-body li em{font-style:normal;font-size:.8rem;color:var(--muted);display:block;}
  .mnu-body li b{font-variant-numeric:tabular-nums;color:var(--teal);white-space:nowrap;}
  .mnu-body li b em{display:inline;font-size:.75rem;color:var(--muted);}
  .mnu-note{margin-top:14px;font-size:.82rem;color:var(--muted);font-style:italic;}
  .terrace{padding:0 0 74px;}
  .terrace-wrap{background:var(--cream);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--sand-2);display:grid;grid-template-columns:1fr;max-width:900px;margin:0 auto;}
  .terrace-wrap .pw{position:relative;}
  .terrace-wrap .photo{aspect-ratio:16/9;width:100%;object-fit:cover;background:#dfe6ea;}
  .terrace-wrap .card-body{padding:24px 28px 30px;}
  @media(min-width:760px){.terrace-wrap{grid-template-columns:1.1fr 1fr;}.terrace-wrap .photo{aspect-ratio:4/3;height:100%;}}
  .sec-head{text-align:center;margin-bottom:40px;}
  .sec-head .kicker{color:var(--teal);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.74rem;}
  .sec-head h2{font-size:clamp(1.8rem,4vw,2.7rem);color:var(--ink);margin-top:8px;}
  .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px;}
  .card{background:var(--cream);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--sand-2);display:flex;flex-direction:column;transition:transform .18s ease;}
  .card:hover{transform:translateY(-4px);}
  .card .photo{aspect-ratio:4/3;width:100%;object-fit:cover;background:#dfe6ea;}
  .coming-soon-banner{background:var(--coral);color:#fff;font-weight:700;text-align:center;padding:11px 14px;border-radius:10px;margin-bottom:16px;font-size:.94rem;letter-spacing:.01em;box-shadow:var(--shadow);}
  .book-row{position:relative;}
  .book-row .soon-badge{position:absolute;inset:0;background:rgba(255,255,255,.94);border-radius:10px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-size:.76rem;line-height:1.25;color:var(--ink);padding:6px;z-index:3;}
  .book-row.soon .btn{visibility:hidden;}
  .balneario{padding:34px 0 8px;}
  .balneario h2{font-size:clamp(1.8rem,4vw,2.6rem);color:var(--ink);}
  .balneario .lede{max-width:60ch;margin:0 auto 22px;color:var(--muted);font-size:1.04rem;}
  .big-pw{position:relative;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);}
  .big-pw .photo{aspect-ratio:4/3;width:100%;object-fit:cover;background:#dfe6ea;}
  .big-pw .gal-nav{width:44px;height:44px;font-size:1.5rem;}
  @media(min-width:700px){.big-pw .photo{aspect-ratio:16/8;}}
  .badge{position:absolute;margin:12px;top:0;left:0;background:rgba(12,37,69,.86);color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 11px;border-radius:50px;}
  .card .pw{position:relative;}
  .gal-nav{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;border:none;background:rgba(12,37,69,.55);color:#fff;font-size:1.2rem;line-height:1;cursor:pointer;display:none;align-items:center;justify-content:center;z-index:5;backdrop-filter:blur(4px);}
  .pw[data-gallery] .gal-nav{display:flex;}
  .gal-prev{left:10px;}
  .gal-next{right:10px;}
  .gal-nav:hover{background:rgba(12,37,69,.8);}
  .gal-dots{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:5px;z-index:5;}
  .gal-dots span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5);cursor:pointer;}
  .gal-dots span.active{background:#fff;width:16px;border-radius:4px;}
  .card-body{padding:18px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1;}
  .card-body h3{font-size:1.4rem;color:var(--ink);}
  .card-body .es{font-family:'Pinyon Script';font-size:1.35rem;color:var(--teal);margin-top:-8px;}
  .beds{font-size:.9rem;color:var(--muted);}
  .beds b{color:var(--teal);font-weight:700;}
  .book-row{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap;}
  .book-row .btn{flex:1;justify-content:center;padding:11px 12px;font-size:.86rem;min-width:120px;}
  .b-airbnb{background:var(--coral);color:#fff;}
  .b-booking{background:var(--cobalt);color:#fff;}
  .b-vrbo{background:#1668e3;color:#fff;}
  .b-pending{background:transparent;color:var(--muted);border:1.5px dashed var(--sand-2);cursor:default;font-size:.78rem;opacity:.85;}

  /* GROUP / RESERVE */
  .reserve{background:linear-gradient(150deg,var(--ink),var(--cobalt));color:#fff;padding:72px 0;}
  .reserve .wrap{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:start;}
  .reserve h2{font-size:clamp(1.9rem,4vw,2.7rem);}
  .reserve p{color:#cfe0f4;font-size:1.06rem;margin:14px 0 22px;}
  .contact-btns{display:flex;flex-direction:column;gap:12px;max-width:330px;}
  .contact-btns .btn{justify-content:center;}
  .btn-call{background:var(--gold);color:#3a2407;}
  .btn-mail{background:rgba(255,255,255,.14);color:#fff;border:1.5px solid rgba(255,255,255,.5);}
  .btn-ig{background:linear-gradient(45deg,#F58529,#DD2A7B 55%,#8134AF);color:#fff;gap:8px;}
  .btn-tt{background:#111;color:#fff;gap:8px;}
  .btn-fb{background:#1877F2;color:#fff;gap:8px;}
  .grp-note{margin-top:20px;font-size:.92rem;color:#aec5e2;}
  form.res{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:var(--radius);padding:26px;backdrop-filter:blur(6px);}
  form.res label{display:block;font-size:.82rem;font-weight:600;color:#dce8f6;margin:0 0 5px;}
  form.res .field{margin-bottom:14px;}
  form.res .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
  form.res input,form.res select,form.res textarea{width:100%;padding:11px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.94);color:#1a2733;font-family:inherit;font-size:.95rem;}
  form.res textarea{min-height:74px;resize:vertical;}
  form.res .btn{width:100%;justify-content:center;margin-top:6px;}

  /* LOCATION */
  .loc{padding:74px 0;}
  .loc .wrap{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center;}
  .loc h2{font-size:clamp(1.8rem,4vw,2.6rem);color:var(--ink);}
  .loc ul{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px;}
  .loc li{display:flex;gap:12px;align-items:flex-start;font-size:1rem;}
  .loc li svg{width:20px;height:20px;color:var(--coral);flex:none;margin-top:3px;}
  .map{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--sand-2);min-height:330px;}
  .map iframe{width:100%;height:100%;min-height:330px;border:0;display:block;}

  /* SUNSET STRIP */
  .sunset{padding:10px 0 78px;}
  .sunset .sec-head{margin-bottom:26px;}
  .sunset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
  .sunset-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;box-shadow:var(--shadow);}

  /* CONTACT/QR */
  .contact{background:var(--ink);color:#fff;padding:66px 0 40px;}
  .contact .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:46px;align-items:center;}
  .contact .brandline{display:flex;align-items:center;gap:16px;margin-bottom:6px;}
  .contact .brandline img{width:74px;height:74px;border-radius:50%;box-shadow:0 8px 22px -8px rgba(0,0,0,.6);}
  .contact .script{font-size:2.3rem;color:var(--gold-soft);}
  .contact p{color:#c4d4e8;margin:12px 0;}
  .phone{font-family:'Fraunces';font-size:1.6rem;color:#fff;text-decoration:none;display:inline-flex;gap:10px;align-items:center;}
  .phone svg{width:22px;height:22px;color:var(--gold);}
  .contact .mini{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px;}
  .contact .mini a{font-size:.9rem;padding:9px 16px;}
  .qr-panel{background:var(--cream);color:var(--ink);border-radius:var(--radius);padding:24px;text-align:center;}
  .qr-panel h3{font-size:1.1rem;margin-bottom:3px;}
  .qr-panel p{color:var(--muted);font-size:.82rem;margin:0 0 14px;}
  #qrcode{display:inline-block;background:#fff;padding:12px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--sand-2);}
  #qrcode img,#qrcode canvas{display:block;}
  #qrlink{display:inline-block;text-decoration:none;transition:transform .15s ease,filter .15s ease;}
  #qrlink:hover,#qrlink:focus-visible{transform:scale(1.03);filter:brightness(1.04);}
  #qrlink:focus-visible{outline:2px solid var(--teal);outline-offset:4px;border-radius:14px;}
  .foot{border-top:1px solid rgba(255,255,255,.12);margin-top:44px;padding-top:20px;text-align:center;color:#8ea7c4;font-size:.82rem;}

  @media(max-width:820px){
    .hero-bar{padding-top:24px;}
    .reserve .wrap,.loc .wrap,.contact .wrap{grid-template-columns:1fr;}
    .sunset-grid{grid-template-columns:1fr;}
    .hero-bar p.tag{font-size:1.05rem;}
  }
  @media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;}.btn:hover,.card:hover{transform:none;}}

  /* Boricua */
  .boricua{padding:20px 0 60px;text-align:center;}
  .boricua h2{font-size:clamp(1.8rem,4vw,2.7rem);color:var(--ink);}
  .boricua .lede{max-width:66ch;margin:0 auto;color:var(--muted);font-size:1.1rem;}
  /* ===== ACTIVITIES & EXCURSIONS + RESTAURANTS ===== */
  .explore{padding:64px 0;background:linear-gradient(180deg,var(--cream),var(--sand));}
  .tabs{display:flex;gap:8px;justify-content:center;margin:0 0 30px;flex-wrap:wrap;}
  .tab-btn{border:2px solid var(--ink);background:transparent;color:var(--ink);font-family:'Mulish';font-weight:700;
    font-size:.9rem;letter-spacing:.02em;padding:11px 24px;border-radius:50px;cursor:pointer;transition:all .18s ease;}
  .tab-btn[aria-selected="true"]{background:var(--ink);color:#fff;}
  .tab-panel[hidden]{display:none;}
  .xgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;}
  .xcard{background:#fff;border-radius:16px;padding:20px 18px;box-shadow:0 10px 30px -20px rgba(12,37,69,.6);
    border-top:4px solid var(--teal);display:flex;flex-direction:column;gap:5px;}
  .xcard .ico{font-size:1.7rem;line-height:1;}
  .xcard strong{font-family:'Fraunces',Georgia,serif;font-size:1.12rem;color:var(--ink);}
  .xcard .meta{font-size:.82rem;color:var(--teal);font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
  .xcard p{margin:0;font-size:.92rem;color:var(--muted);line-height:1.55;}
  .xcard a.lnk{margin-top:auto;padding-top:10px;font-size:.88rem;font-weight:700;color:var(--cobalt-2);text-decoration:none;}
  .xcard a.lnk:hover{text-decoration:underline;}
  .op-bar{margin-top:26px;background:var(--ink);color:#fff;border-radius:18px;padding:26px 24px;display:flex;
    flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;}
  .op-bar h3{font-size:1.3rem;margin-bottom:4px;}
  .op-bar p{margin:0;font-size:.94rem;opacity:.9;max-width:56ch;}
  .op-bar .btn{flex:none;}
  .fineprint{margin-top:16px;font-size:.78rem;color:var(--muted);line-height:1.6;text-align:center;}
  @media(max-width:700px){
    .tab-btn{flex:1;min-width:140px;padding:11px 14px;font-size:.84rem;}
    .op-bar{flex-direction:column;align-items:flex-start;}
    .op-bar .btn{width:100%;justify-content:center;}
    .op-bar>div:last-child{width:100%;}
  }
  .menu-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;}
  .menu-thumbs img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:9px;
    border:1px solid var(--sand-2);box-shadow:0 6px 18px -12px rgba(12,37,69,.7);}
  .menu-hint{margin-top:8px!important;font-size:.79rem!important;font-style:italic;}
  /* Flyer lightbox */
  .zoomable{cursor:zoom-in;transition:transform .15s ease;}
  .zoomable:hover{transform:scale(1.015);}
  .lb{position:fixed;inset:0;z-index:200;background:rgba(6,18,34,.92);backdrop-filter:blur(6px);
    display:none;align-items:center;justify-content:center;padding:24px 16px;overflow:auto;-webkit-overflow-scrolling:touch;}
  .lb.open{display:flex;}
  .lb img{max-width:min(100%,1040px);max-height:88vh;width:auto;border-radius:14px;
    box-shadow:0 30px 80px -30px rgba(0,0,0,.9);cursor:zoom-out;}
  .lb-x{position:fixed;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;
    background:rgba(255,255,255,.15);color:#fff;font-size:1.6rem;line-height:1;display:flex;
    align-items:center;justify-content:center;backdrop-filter:blur(6px);}
  .lb-x:hover{background:rgba(255,255,255,.3);}
  /* Address line under the building band */
  .band-addr{display:flex;align-items:center;justify-content:center;gap:9px;
    padding:14px 22px 4px;text-align:center;text-decoration:none;
    color:var(--gold);font-weight:700;font-size:.86rem;letter-spacing:.03em;
    background:var(--ink);}
  .band-addr svg{width:17px;height:17px;flex:none;}
  .band-addr span{border-bottom:1px solid rgba(230,178,80,.45);padding-bottom:2px;}
  .band-addr:hover span,.band-addr:focus span{border-bottom-color:var(--gold);}
  @media (max-width:520px){ .band-addr{font-size:.79rem;gap:7px;padding:12px 16px 2px;} }

  /* Social row under the address */
  .band-social{display:flex;justify-content:center;gap:14px;padding:12px 22px 4px;background:var(--ink);}
  .band-social a{display:inline-flex;align-items:center;justify-content:center;
    width:42px;height:42px;border-radius:50%;
    border:1px solid rgba(232,162,61,.35);
    transition:background .15s ease,border-color .15s ease,transform .15s ease;}
  .band-social a:hover,.band-social a:focus{background:rgba(232,162,61,.14);
    border-color:var(--gold);transform:translateY(-1px);}
  .band-social svg{width:22px;height:22px;flex:none;}
  @media (max-width:520px){ .band-social a{width:38px;height:38px;} .band-social svg{width:20px;height:20px;} }

  /* Building band — sits directly under the hero mural */
  .building-band{position:relative;background:var(--ink);line-height:0;}
  .building-band img{display:block;width:100%;height:clamp(250px,40vw,470px);
    object-fit:cover;object-position:center 50%;}
  /* Property */
  .property{padding:60px 0 40px;text-align:center;}
  .property h2{font-size:clamp(1.8rem,4vw,2.7rem);color:var(--ink);}
  .property .lede{max-width:60ch;margin:0 auto;color:var(--muted);font-size:1.06rem;}
  .trio{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  .trio figure{margin:0;}
  .trio img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:14px;box-shadow:var(--shadow);}
  .trio figcaption{margin-top:8px;font-size:.86rem;color:var(--muted);font-weight:600;}
  /* Park */
  .park{padding:50px 0 40px;text-align:center;}
  .park h2{font-size:clamp(1.8rem,4vw,2.7rem);color:var(--ink);}
  .sunset-grid{grid-template-columns:repeat(3,1fr);}
  @media(max-width:820px){
    .trio{grid-template-columns:1fr;}
  }


  /* ---- Multipage nav (v18) ---- */
  .sitenav{position:sticky;top:0;z-index:40;background:rgba(12,37,69,.96);
    backdrop-filter:saturate(140%) blur(8px);
    border-bottom:1px solid rgba(232,162,61,.22);}
  /* side padding keeps links clear of the fixed ES/EN toggle (top-right) */
  .sitenav .wrap{display:flex;gap:4px;justify-content:center;flex-wrap:nowrap;
    padding:0 104px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .sitenav .wrap::-webkit-scrollbar{display:none;}
  .sitenav a{display:inline-block;padding:13px 15px;text-decoration:none;
    color:#cfe0f5;font-weight:700;font-size:.82rem;letter-spacing:.06em;
    text-transform:uppercase;border-bottom:2.5px solid transparent;
    transition:color .15s ease,border-color .15s ease;white-space:nowrap;}
  .sitenav a:hover,.sitenav a:focus{color:var(--gold-soft);}
  .sitenav a[aria-current="page"]{color:var(--gold);border-bottom-color:var(--gold);}
  @media (max-width:820px){
    .sitenav .wrap{justify-content:flex-start;padding:0 106px 0 8px;}
  }
  @media (max-width:520px){
    .sitenav .wrap{gap:0;padding:0 100px 0 6px;}
    .sitenav a{padding:12px 9px;font-size:.7rem;letter-spacing:.03em;}
  }
  /* inner pages start under the sticky nav, not under a hero */
  main > section:first-child{padding-top:34px;}


  /* ---- Family Lounges (v20) ---- */
  .terrace-wrap + .terrace-wrap{margin-top:22px;}
  .terrace-wrap.no-photo{grid-template-columns:1fr !important;}
  .lounge-name{font-family:'Fraunces',Georgia,serif;font-size:1.5rem;color:var(--ink);
    margin:0 0 8px;line-height:1.2;}
  .badge-inline{position:static;display:inline-block;margin-bottom:10px;}

  /* ============================================================
     TARIFA RESIDENTE PR  (v21)
     Direct-booking inquiry for Puerto Rico residents only.
     Classes prefixed .pr- to avoid clashing with form.res
     ============================================================ */
  .pr-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:10px;padding:13px 16px;border:2px solid #ED1C24;border-radius:50px;background:transparent;color:#C0141B;font-family:'Mulish';font-weight:800;font-size:.92rem;letter-spacing:.01em;line-height:1.2;text-decoration:none;cursor:pointer;transition:background .18s ease,color .18s ease,transform .15s ease;}
  .pr-cta:hover{background:#ED1C24;color:#fff;transform:translateY(-2px);}
  .pr-flag{width:24px;height:16px;flex:none;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.18);}

  .pr-band{background:var(--ink);color:var(--sand);padding:64px 0;border-top:4px solid #ED1C24;}
  .pr-inner{max-width:760px;margin:0 auto;}
  .pr-band .kicker{display:block;color:var(--gold);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.74rem;margin-bottom:10px;}
  .pr-band h2{font-size:clamp(1.7rem,4vw,2.4rem);color:#fff;margin-bottom:14px;}
  .pr-lede{color:#cfe0f4;font-size:1.06rem;margin:0 0 10px;max-width:58ch;}
  .pr-note{color:#9db4d0;font-size:.9rem;margin:0 0 26px;max-width:58ch;}

  .pr-chips{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:6px;}
  .pr-chip{position:relative;display:inline-flex;align-items:center;gap:8px;border:1.5px solid rgba(244,239,230,.32);border-radius:999px;padding:11px 17px;font-size:.9rem;font-weight:600;color:#eaf1fb;cursor:pointer;user-select:none;transition:border-color .15s ease,background .15s ease,color .15s ease;}
  /* hide the native box — iOS renders it as a big white square */
  .pr-chip input{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}
  .pr-tick{flex:none;width:17px;height:17px;border-radius:50%;border:1.5px solid rgba(244,239,230,.45);position:relative;transition:background .15s ease,border-color .15s ease;}
  .pr-tick::after{content:"";position:absolute;left:5px;top:1.5px;width:4px;height:9px;border:solid #3a2407;border-width:0 2px 2px 0;transform:rotate(45deg) scale(.4);opacity:0;transition:opacity .15s ease,transform .15s ease;}
  .pr-chip:hover{border-color:var(--gold);}
  .pr-chip:has(input:checked){border-color:var(--gold);background:rgba(232,162,61,.18);color:#fff;}
  .pr-chip:has(input:checked) .pr-tick{background:var(--gold);border-color:var(--gold);}
  .pr-chip:has(input:checked) .pr-tick::after{opacity:1;transform:rotate(45deg) scale(1);}
  .pr-chip:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:3px;}
  .pr-chips.pr-invalid .pr-chip{border-color:#ED6A62;}
  .pr-err{color:#FF9B93;font-size:.86rem;font-weight:600;margin:8px 0 0;}
  @media(prefers-reduced-motion:reduce){.pr-chip,.pr-tick,.pr-tick::after{transition:none;}}

  .pr-confirm{display:flex;gap:11px;align-items:flex-start;font-size:.9rem;line-height:1.5;color:#dce8f6;margin:16px 0 4px;cursor:pointer;}
  .pr-confirm input{accent-color:var(--gold);margin-top:4px;flex:none;}

  .pr-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px;}
  .pr-actions .btn{margin-top:0;}
  .pr-or{font-size:.86rem;color:#9db4d0;}
  .pr-pay{margin-top:22px;font-size:.86rem;color:#9db4d0;border-top:1px solid rgba(244,239,230,.14);padding-top:16px;}

  .pr-band form.res{margin-top:6px;}
  .pr-band form.res .btn{width:auto;}

  @media(max-width:620px){
    .pr-band{padding:48px 0;}
    .pr-actions{flex-direction:column;align-items:stretch;}
    .pr-actions .btn{justify-content:center;}
    .pr-or{text-align:center;}
  }
  @media(prefers-reduced-motion:reduce){.pr-cta{transition:none;}.pr-cta:hover{transform:none;}}

  /* PR resident button, .btn family — for dark backgrounds (hero, bands) */
  .btn-pr{background:#ED1C24;color:#fff;border:2px solid #ED1C24;padding:17px 30px;font-size:1.06rem;font-weight:800;box-shadow:0 10px 26px -10px rgba(237,28,36,.8);}
  .btn-pr:hover{background:#C0141B;border-color:#C0141B;color:#fff;}
  .btn-pr .pr-flag{width:28px;height:19px;}

  /* Hero CTA row — keep all three on one line where there's room,
     and on phones pair WhatsApp + PR Resident Rate side by side. */
  .hero-bar .cta-row .btn{flex:0 1 auto;}
  @media(max-width:900px){
    .hero-bar .cta-row .btn{padding:14px 18px;font-size:.92rem;}
    .hero-bar .cta-row .btn-pr{padding:14px 18px;font-size:.92rem;}
  }
  @media(max-width:640px){
    .hero-bar .cta-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
    .hero-bar .cta-row > .btn:first-child{grid-column:1 / -1;}
    .hero-bar .cta-row .btn{justify-content:center;text-align:center;padding:14px 10px;font-size:.86rem;gap:7px;}
    .hero-bar .cta-row .btn-pr{padding:14px 10px;font-size:.86rem;}
    .hero-bar .cta-row .pr-flag{width:22px;height:15px;}
  }

  /* full "Tarifa Residente PR" wording — allow a clean two-line wrap on phones */
  @media(max-width:640px){
    .hero-bar .cta-row .btn-pr{line-height:1.25;padding:12px 10px;}
    .hero-bar .cta-row .btn-pr span{display:inline-block;}
  }

  /* discount badge on the resident section */
  .pr-badge{display:inline-block;background:#6CACE4;color:#0C2545;font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;padding:7px 15px;border-radius:999px;margin-bottom:14px;}

  /* VRBO on a suite card = whole-property listing only, so it reads as
     secondary info rather than "book this suite here" */
  .b-vrbo-whole{background:transparent;color:#1668e3;border:1.5px solid #1668e3;font-weight:700;}
  .b-vrbo-whole:hover{background:#1668e3;color:#fff;}

  /* ---- Sale tag: PR resident rate, sits beside the social icons ---- */
  .band-social{flex-wrap:wrap;align-items:center;}
  /* the circular social buttons shouldn't stretch when the tag joins the row */
  .band-social > a.sale-tag{width:auto;height:auto;border-radius:8px;}

  .sale-tag{
    display:inline-flex;align-items:center;gap:8px;
    background:#ED1C24;color:#fff;
    padding:8px 15px 8px 12px;
    border-radius:6px;
    font-family:'Mulish';font-weight:800;line-height:1;
    text-decoration:none;
    box-shadow:0 6px 18px -6px rgba(237,28,36,.9);
    position:relative;
    transition:transform .15s ease,background .15s ease;
  }
  /* notch on the left so it reads as a price tag, not a button */
  .sale-tag::before{
    content:"";position:absolute;left:-7px;top:50%;transform:translateY(-50%);
    width:0;height:0;
    border-top:8px solid transparent;border-bottom:8px solid transparent;
    border-right:8px solid #ED1C24;
  }
  .sale-tag:hover{background:#C0141B;transform:translateY(-2px);}
  .sale-tag:hover::before{border-right-color:#C0141B;}
  .sale-tag .pr-flag{width:22px;height:15px;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.5);}
  .sale-lines{display:flex;flex-direction:column;gap:3px;}
  .sale-name{font-size:.64rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--sand);opacity:.85;}
  .sale-pct{font-size:.95rem;font-weight:800;letter-spacing:-.01em;color:#fff;}

  @media (max-width:520px){
    .band-social{gap:10px;padding:12px 14px 6px;}
    .sale-tag{padding:7px 12px 7px 10px;gap:6px;}
    .sale-name{font-size:.58rem;letter-spacing:.1em;}
    .sale-pct{font-size:.86rem;}
    .sale-tag .pr-flag{width:19px;height:13px;}
  }
  @media(prefers-reduced-motion:reduce){.sale-tag{transition:none;}.sale-tag:hover{transform:none;}}

  /* "Photos coming soon" panel — used for El Batey while it's being redone */
  .soon-box{display:flex;align-items:flex-start;gap:13px;margin-top:16px;padding:16px 18px;
    background:rgba(46,139,150,.08);border:1px dashed rgba(46,139,150,.45);border-radius:12px;}
  .soon-box svg{width:26px;height:26px;flex:none;color:var(--teal);margin-top:1px;}
  .soon-box strong{display:block;color:var(--ink);font-weight:800;font-size:.95rem;margin-bottom:3px;}
  .soon-box span{display:block;color:var(--muted);font-size:.88rem;line-height:1.5;}

  .lounge-line{margin:0 0 10px;font-size:.84rem;line-height:1.45;color:var(--teal);font-weight:600;}

  .whole-lounges{color:var(--gold-soft);font-weight:600;font-size:.94rem;margin:0 auto 16px;max-width:52ch;}

  /* nudge from the terraces down to the suite cards */
  .scroll-cue{display:flex;flex-direction:column;align-items:center;gap:6px;margin:34px auto 0;
    color:var(--teal);font-weight:800;font-size:.9rem;letter-spacing:.04em;text-transform:uppercase;
    text-decoration:none;width:max-content;}
  .scroll-cue svg{width:22px;height:22px;animation:cueBob 2s ease-in-out infinite;}
  .scroll-cue:hover{color:var(--ink);}
  @keyframes cueBob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
  @media(prefers-reduced-motion:reduce){.scroll-cue svg{animation:none;}}

  /* ---- Deep-linked suite cards (v45) ----
     /suites/#coqui lands on that card. A brief gold ring tells the guest
     which one they were sent to, then fades. Offset under the sticky nav is
     already handled by the anchor landing fix in site.js — no scroll-margin
     here, or the jump would overshoot twice. */
  .suites .card:target{animation:suite-land 2.4s ease-out 1;}
  @keyframes suite-land{
    0%   {box-shadow:0 0 0 3px var(--gold);}
    70%  {box-shadow:0 0 0 3px var(--gold);}
    100% {box-shadow:0 0 0 3px rgba(232,162,61,0);}
  }
  @media (prefers-reduced-motion:reduce){
    .suites .card:target{animation:none;box-shadow:0 0 0 2px var(--gold);}
  }

  /* ---- Deep-linked restaurant cards (v64) ----
     /patabajo -> /restaurants/#patabajo. Same gold-ring landing cue as the
     suite cards. No scroll-margin here either, for the same reason. */
  .xcard:target{animation:suite-land 2.4s ease-out 1;}
  @media (prefers-reduced-motion:reduce){
    .xcard:target{animation:none;box-shadow:0 0 0 2px var(--gold);}
  }

  /* ---- "Cotizando: <suite>" banner (v46) ----
     Sits above the heading in the resident-rate band so the guest lands
     already seeing which suite the quote is for. Hidden until one is picked. */
  .pr-forsuite{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
    margin:0 0 16px;padding:11px 16px;border-radius:12px;
    background:rgba(232,162,61,.12);border:1px solid rgba(232,162,61,.42);}
  .pr-forsuite[hidden]{display:none;}
  .pr-forsuite-k{color:var(--gold-soft);font-weight:800;font-size:.7rem;
    letter-spacing:.1em;text-transform:uppercase;}
  .pr-forsuite-n{color:#fff;font-weight:700;font-size:1.02rem;line-height:1.3;}

  /* ---- Standalone suite pages (v49) ----
     One card, centred, so it reads as that suite's own page rather than a
     one-item grid. */
  .suites .grid.one{grid-template-columns:minmax(0,620px);justify-content:center;}
  .suite-back{text-align:center;margin:34px 0 0;}
  .suite-back a{color:var(--teal);font-weight:700;letter-spacing:.04em;
    text-decoration:none;border-bottom:1.5px solid rgba(31,122,140,.4);
    padding-bottom:2px;}
  .suite-back a:hover,.suite-back a:focus{color:var(--gold);
    border-bottom-color:var(--gold);}
  .card h3 a.suite-link{color:inherit;text-decoration:none;}
  .card h3 a.suite-link:hover,.card h3 a.suite-link:focus{color:var(--teal);}

  /* ---- Send this suite (v50) ----
     One tap from the suite's own page to WhatsApp or Messages, carrying that
     suite's URL. */
  .share-row{max-width:620px;margin:26px auto 0;padding:16px 18px;
    border-radius:14px;background:var(--sand-2);border:1px solid rgba(12,37,69,.1);
    display:flex;flex-direction:column;gap:11px;align-items:center;}
  .share-k{color:var(--ink);font-weight:800;font-size:.72rem;
    letter-spacing:.12em;text-transform:uppercase;opacity:.72;}
  .share-btns{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;}
  .btn.btn-share{display:inline-flex;align-items:center;gap:7px;
    padding:10px 16px;border-radius:999px;border:1.5px solid var(--cobalt);
    background:#fff;color:var(--cobalt);font-weight:700;font-size:.9rem;
    cursor:pointer;text-decoration:none;}
  .btn.btn-share:hover,.btn.btn-share:focus{background:var(--cobalt);color:#fff;}
  .btn.btn-share.b-wa{border-color:#25D366;color:#128C4A;}
  .btn.btn-share.b-wa:hover,.btn.btn-share.b-wa:focus{background:#25D366;color:#fff;}
  .btn.btn-share.is-done{background:var(--teal);border-color:var(--teal);color:#fff;}
  @media (max-width:420px){ .btn.btn-share{padding:9px 13px;font-size:.84rem;} }

  /* v66: compact share row that sits INSIDE a restaurant card. The standard
     row is a full-width band under a suite; here it nests, so it drops the
     sand background (the card is already on white) and tightens spacing. */
  .xcard .share-row-sm{max-width:none;margin:14px 0 0;padding:12px 10px;
    background:rgba(12,37,69,.035);gap:9px;}
  .xcard .share-row-sm .share-k{font-size:.66rem;letter-spacing:.1em;}
  .xcard .share-row-sm .btn.btn-share{padding:8px 12px;font-size:.82rem;}
  .buildtag{opacity:.5;font-variant-numeric:tabular-nums;}

  /* ---- "Ver esta suite" (v52) ----
     The primary action on each card in the list: open that suite's own page.
     Sits above the platform buttons so it reads first. */
  .btn.see-suite{display:flex;align-items:center;justify-content:center;gap:7px;
    width:100%;margin:0 0 10px;padding:13px 18px;border-radius:999px;
    background:var(--ink);color:var(--sand);font-weight:700;font-size:.98rem;
    text-decoration:none;border:none;}
  .btn.see-suite:hover,.btn.see-suite:focus{background:var(--cobalt-2);color:#fff;}
  .btn.see-suite svg{flex:0 0 auto;}

  /* ---- List page shows the chooser only (v55) ----
     On /suites/all/ each card is a doorway: photo, name, what it is, and one
     button. Booking and the resident rate live on the suite's own page, so a
     guest is never picking from five sets of buttons at once. The markup stays
     in place because the suite pages are generated from these cards. */
  .suites.is-list .card .book-row,
  .suites.is-list .card .pr-cta{display:none;}
  .suites.is-list .card .see-suite{margin-bottom:0;}

  /* PRTC innkeeper licence line in the footer */
  .foot-lic{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;padding-top:12px;
    border-top:1px solid rgba(244,239,230,.14);font-size:.78rem;letter-spacing:.02em;opacity:.72;line-height:1.4;text-align:center;}
  .foot-lic svg{width:16px;height:16px;flex:none;color:var(--gold);}
  @media(max-width:520px){.foot-lic{flex-direction:column;gap:5px;font-size:.74rem;}}

  /* Direct booking leads; OTAs demoted to a secondary row */
  .card-body .pr-cta{margin-top:14px;padding:15px 18px;font-size:1rem;}
  .ota-label{margin:16px 0 8px;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);opacity:.75;text-align:center;}
  .card-body .book-row .btn{padding:9px 13px;font-size:.8rem;font-weight:700;opacity:.92;}
  .card-body .book-row .b-airbnb{background:transparent;color:#c8443c;border:1.5px solid rgba(200,68,60,.55);}
  .card-body .book-row .b-airbnb:hover{background:#c8443c;color:#fff;}
  .card-body .book-row .b-booking{background:transparent;color:#1668e3;border:1.5px solid rgba(22,104,227,.5);}
  .card-body .book-row .b-booking:hover{background:#1668e3;color:#fff;}