:root{
    --ink:#13201E;
    --ink-2:#1B2D2A;
    --paper:#F4EFE6;
    --paper-2:#ECE4D6;
    --sea:#15635D;
    --sea-deep:#0E433F;
    --foam:#A7C8BF;
    --gold:#C49A5E;
    --ink-dim:rgba(19,32,30,.66);
    --paper-dim:rgba(244,239,230,.74);
    --line:rgba(19,32,30,.16);
    --line-dark:rgba(244,239,230,.18);
    --maxw:1240px;
    --pad:clamp(1.15rem,5vw,3rem);
    --sec:clamp(4.2rem,10vw,9rem);
    --head-h:74px;
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
  body{
    margin:0; background:var(--paper); color:var(--ink);
    font-family:"Mulish",system-ui,sans-serif;
    font-size:clamp(1rem,1.05vw,1.0625rem);
    line-height:1.72; -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  body.locked{overflow:hidden;}
  /* height:auto is essential — the width/height HTML attributes act as presentational
     hints and would otherwise beat every aspect-ratio below, stretching photos. */
  img{display:block; max-width:100%; height:auto;}
  a{color:inherit; text-decoration:none;}
  h1,h2,h3{margin:0; font-family:"Fraunces",Georgia,serif; font-weight:340; line-height:1.04; letter-spacing:-.015em; overflow-wrap:break-word;}
  p{margin:0;}
  ::selection{background:var(--sea); color:var(--paper);}
  :focus-visible{outline:2px solid var(--gold); outline-offset:3px;}
  .sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

  .wrap{max-width:var(--maxw); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad);}
  .section{padding-block:var(--sec); scroll-margin-top:var(--head-h);}

  /* ---------- type helpers ---------- */
  .eyebrow{
    font-family:"Jost",sans-serif; font-weight:500; font-size:.72rem;
    text-transform:uppercase; letter-spacing:.3em; color:var(--sea);
    display:inline-flex; align-items:center; gap:.7rem;
  }
  .eyebrow::before{content:""; width:26px; height:1px; background:var(--gold); flex:none;}
  .section--dark .eyebrow{color:var(--foam);}
  .h2{font-size:clamp(2rem,5vw,3.9rem);}
  .lead{font-size:clamp(1.06rem,1.6vw,1.32rem); line-height:1.65; color:var(--ink-dim); max-width:54ch;}
  /* Every dark-backed section, not just .section--dark — .lead sets its own colour,
     so inheritance won't save it and the text vanishes into the photo. */
  .section--dark .lead,.section--visit .lead,.section--sun .lead{color:var(--paper-dim);}

  /* ---------- buttons ---------- */
  .btn{
    font-family:"Jost",sans-serif; font-weight:500; font-size:.82rem;
    text-transform:uppercase; letter-spacing:.16em;
    display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
    padding:1.02em 1.8em; border-radius:2px; cursor:pointer;
    border:1px solid transparent; transition:background .35s ease,color .35s ease,border-color .35s ease,transform .35s ease;
    text-align:center;
  }
  .btn--primary{background:var(--sea); color:var(--paper);}
  .btn--primary:hover{background:var(--sea-deep); transform:translateY(-2px);}
  .btn--ghost{background:transparent; border-color:var(--line); color:var(--ink);}
  .btn--ghost:hover{background:var(--ink); color:var(--paper); border-color:var(--ink);}
  .btn--light{background:var(--paper); color:var(--ink);}
  .btn--light:hover{background:#fff; transform:translateY(-2px);}
  .btn--onvideo{background:transparent; border-color:rgba(255,255,255,.45); color:#fff;}
  .btn--onvideo:hover{background:#fff; color:var(--ink); border-color:#fff;}
  .btn .arr{transition:transform .35s ease;}
  .btn:hover .arr{transform:translateX(4px);}

  .text-link{
    font-family:"Jost",sans-serif; font-weight:500; font-size:.85rem;
    text-transform:uppercase; letter-spacing:.14em; color:var(--sea);
    display:inline-flex; align-items:center; gap:.55rem; padding-bottom:.3rem;
    border-bottom:1px solid var(--line); transition:border-color .35s ease,gap .35s ease;
  }
  .text-link:hover{border-color:var(--sea); gap:.85rem;}

  /* ---------- header / nav ---------- */
  .head{
    position:fixed; inset:0 0 auto 0; z-index:60;
    padding-block:1.1rem; transition:padding .4s ease,background .4s ease,box-shadow .4s ease,border-color .4s ease;
    border-bottom:1px solid transparent;
  }
  .head .wrap{display:flex; align-items:center; justify-content:space-between; gap:.8rem;}
  .brand{display:flex; align-items:center; flex:none; transition:opacity .45s ease;}
  .brand img{width:clamp(84px,9vw,104px); height:auto; filter:brightness(0) invert(1) drop-shadow(0 2px 10px rgba(0,0,0,.35)); transition:filter .4s ease,opacity .4s ease;}
  /* The hero already carries the big logo — no need to say it twice up top. */
  .head:not(.scrolled) .brand{opacity:0; pointer-events:none;}
  /* Source artwork is white: on the cream header it must be inked, not left as-is. */
  .head.scrolled .brand img{filter:brightness(0); opacity:.88;}

  .nav{display:flex; align-items:center; gap:1.6rem;}
  .navlink{
    font-family:"Jost",sans-serif; font-weight:500; font-size:.76rem; text-transform:uppercase; letter-spacing:.15em;
    color:var(--paper); opacity:.92; position:relative; padding:.2rem 0; transition:opacity .3s ease,color .4s ease; white-space:nowrap;
  }
  .navlink::after{content:""; position:absolute; left:0; bottom:-3px; width:0; height:1px; background:currentColor; transition:width .35s ease;}
  .navlink:hover{opacity:1;}
  .navlink:hover::after{width:100%;}
  .nav .btn{padding:.78em 1.4em;}

  /* --- btn--ghost es tinta sobre claro: sobre cualquier banda oscura
         hay que invertirlo o desaparece (bug: "Cómo llegar" invisible) --- */
  .section--visit .btn--ghost,
  .section--dark .btn--ghost,
  .section--sun .btn--ghost,
  .cta-band .btn--ghost,
  .lp-hero .btn--ghost{border-color:rgba(244,239,230,.45); color:var(--paper);}
  .section--visit .btn--ghost:hover,
  .section--dark .btn--ghost:hover,
  .section--sun .btn--ghost:hover,
  .cta-band .btn--ghost:hover,
  .lp-hero .btn--ghost:hover{background:var(--paper); color:var(--ink); border-color:var(--paper);}
  /* over the hero video the header is transparent — the ghost button must go light,
     or "Reservar" is ink-on-dark and vanishes (it only worked after scrolling) */
  .head:not(.scrolled) .nav .btn--ghost{border-color:rgba(244,239,230,.5); color:var(--paper);}
  .head:not(.scrolled) .nav .btn--ghost:hover{background:var(--paper); color:var(--ink); border-color:var(--paper);}
  .head.scrolled .navlink{color:var(--ink);}
  .head.scrolled .btn--ghost{border-color:var(--line); color:var(--ink);}

  .head-right{display:flex; align-items:center; gap:.7rem;}
  .head.scrolled{background:var(--paper); border-bottom-color:var(--line); box-shadow:0 8px 30px -22px rgba(0,0,0,.45); padding-block:.7rem;}

  /* language switcher */
  .lang{position:relative; flex:none;}
  .lang-btn{
    font-family:"Jost",sans-serif; font-weight:500; font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
    display:inline-flex; align-items:center; gap:.42rem; padding:.6em .85em; border-radius:40px;
    background:transparent; border:1px solid rgba(244,239,230,.42); color:var(--paper); cursor:pointer;
    transition:color .4s ease,border-color .4s ease,background .3s ease; line-height:1;
  }
  .lang-btn:hover{background:rgba(255,255,255,.1);}
  .lang-btn .car{font-size:.5rem; opacity:.8;}
  .head.scrolled .lang-btn{border-color:var(--line); color:var(--ink);}
  .head.scrolled .lang-btn:hover{background:rgba(19,32,30,.05);}
  .lang-menu{
    position:absolute; top:calc(100% + 10px); right:0; min-width:158px;
    background:var(--paper); border:1px solid var(--line); border-radius:4px;
    box-shadow:0 22px 46px -18px rgba(0,0,0,.45); padding:.35rem; z-index:5;
    opacity:0; visibility:hidden; transform:translateY(-6px);
    transition:opacity .25s ease,visibility .25s ease,transform .25s ease;
  }
  .lang.open .lang-menu{opacity:1; visibility:visible; transform:none;}
  .lang-menu button{
    display:flex; width:100%; align-items:center; gap:.6rem;
    background:none; border:0; cursor:pointer; text-align:left;
    font-family:"Jost",sans-serif; font-size:.8rem; letter-spacing:.05em; color:var(--ink);
    padding:.6em .7em; border-radius:3px; line-height:1.2;
  }
  .lang-menu button:hover{background:var(--paper-2);}
  .lang-menu button .dot{width:6px; height:6px; border-radius:50%; background:transparent; flex:none;}
  .lang-menu button[aria-current="true"]{color:var(--sea);}
  .lang-menu button[aria-current="true"] .dot{background:var(--gold);}

  .burger{display:none; flex-direction:column; gap:5px; width:28px; height:20px; justify-content:center; background:none; border:0; cursor:pointer; padding:0; z-index:80; flex:none;}
  .burger span{display:block; height:1.5px; width:100%; background:var(--paper); transition:transform .35s ease,opacity .25s ease,background .4s ease;}
  .head.scrolled .burger span{background:var(--ink);}
  body.menu-open .burger span{background:var(--paper);}
  body.menu-open .burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
  body.menu-open .burger span:nth-child(2){opacity:0;}
  body.menu-open .burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}

  /* mobile overlay menu */
  .mobile-nav{
    position:fixed; inset:0; z-index:70; background:var(--ink);
    display:flex; flex-direction:column; gap:.1rem;
    padding:calc(var(--head-h) + 1rem) var(--pad) 2rem; opacity:0; visibility:hidden;
    transition:opacity .4s ease,visibility .4s ease; overflow-y:auto; -webkit-overflow-scrolling:touch;
  }
  /* centred when there's room, scrollable from the top when there isn't —
     justify-content:center would clip the first links on short screens */
  .mobile-nav > a:first-of-type{margin-top:auto;}
  .mobile-nav > .m-foot{margin-bottom:auto;}
  body.menu-open .mobile-nav{opacity:1; visibility:visible;}
  .mobile-nav a{font-family:"Fraunces",serif; font-size:clamp(1.5rem,5.4vh,2.2rem); color:var(--paper); padding:.42rem 0; line-height:1.15; border-bottom:1px solid var(--line-dark);}
  .mobile-nav a.m-reserve{color:var(--foam); border-bottom:0;}
  .m-foot{margin-top:1.6rem; font-family:"Jost",sans-serif; text-transform:uppercase; letter-spacing:.16em; font-size:.72rem; color:var(--foam); line-height:2;}
  .m-foot a{font-family:"Jost",sans-serif; font-size:.72rem; border:0; display:inline; padding:0; color:var(--foam);}

  /* ---------- hero ---------- */
  .hero{position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; background:#0c1a18;}
  .hero-base{position:absolute; inset:0; z-index:0;}
  .hero-base img{width:100%; height:100%; object-fit:cover;}
  .hero-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; opacity:0; transition:opacity 1.2s ease;}
  .hero-video.is-live{opacity:1;}
  .hero::before{content:""; position:absolute; inset:0; z-index:1; background:radial-gradient(125% 95% at 50% 44%, rgba(6,15,13,.18) 0%, rgba(6,15,13,.5) 58%, rgba(6,15,13,.74) 100%);}
  .hero::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(6,15,13,.6) 0%,rgba(6,15,13,.18) 26%,rgba(6,15,13,.26) 58%,rgba(6,15,13,.84) 100%);}
  .hero-inner{position:relative; z-index:2; width:100%;}
  .hero-inner .wrap{display:flex; flex-direction:column; align-items:center; padding-top:calc(var(--head-h) + 1.4rem); padding-bottom:4.6rem;}
  .hero-logo{width:clamp(150px,19vw,240px); height:auto; margin-bottom:1.5rem; filter:brightness(0) invert(1) drop-shadow(0 3px 22px rgba(0,0,0,.45));}
  .hero .eyebrow{color:var(--foam); justify-content:center;}
  .hero .eyebrow::before{background:var(--gold);}
  .hero h1{color:#fff; font-size:clamp(2.4rem,7.6vw,6rem); font-weight:320; margin:.85rem 0 1.15rem; max-width:18ch; text-shadow:0 2px 38px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.4);}
  .hero h1 em{font-style:italic; font-weight:300; color:var(--foam);}
  .hero .sub{color:#fff; font-size:clamp(1rem,1.7vw,1.3rem); max-width:46ch; opacity:.97; line-height:1.6; text-shadow:0 1px 18px rgba(0,0,0,.55);}
  .hero-cta{display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2rem; justify-content:center;}

  .hero-meta{
    position:absolute; left:var(--pad); right:var(--pad); bottom:1.3rem; z-index:2;
    display:flex; justify-content:space-between; align-items:flex-end; gap:1rem;
    font-family:"Jost",sans-serif; text-transform:uppercase; letter-spacing:.2em; font-size:.64rem; color:var(--paper-dim);
    pointer-events:none;
  }
  .hero-meta .coord{text-align:right;}
  .scrollcue{display:flex; align-items:center; gap:.7rem;}
  .scrollcue .stem{width:1px; height:32px; background:linear-gradient(var(--foam),transparent); display:inline-block; animation:pulse 2.4s ease-in-out infinite;}
  @keyframes pulse{0%,100%{opacity:.35; transform:scaleY(.7)}50%{opacity:1; transform:scaleY(1)}}

  /* ---------- horizon / sun signature ---------- */
  .horizon{position:relative; height:1px; background:var(--line); max-width:760px; margin:0 auto;}
  .horizon::before{content:""; position:absolute; top:50%; left:50%; width:14px; height:14px; transform:translate(-50%,-50%); border-radius:50%; background:var(--gold);}
  .horizon::after{content:""; position:absolute; top:50%; left:50%; width:120px; height:120px; transform:translate(-50%,-78%); border-radius:50%; background:radial-gradient(circle,rgba(196,154,94,.28),transparent 68%); pointer-events:none;}

  /* ---------- the place ---------- */
  .place-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,5rem); align-items:center;}
  .place-copy h2{margin:1.1rem 0 1.4rem; max-width:14ch;}
  .place-copy p+p{margin-top:1.05rem;}
  .place-copy .lead{color:var(--ink);}
  .tags{display:flex; flex-wrap:wrap; gap:.55rem; margin:1.9rem 0 0; list-style:none; padding:0;}
  .tags li{font-family:"Jost",sans-serif; font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; padding:.55em 1em; border:1px solid var(--line); border-radius:40px; color:var(--ink-dim);}
  .place-figure{position:relative; margin:0;}
  .place-figure img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px;}
  .place-figure .tab{position:absolute; left:0; bottom:1.5rem; background:var(--ink); color:var(--paper); padding:.85rem 1.3rem; font-family:"Jost",sans-serif; text-transform:uppercase; letter-spacing:.16em; font-size:.62rem; max-width:calc(100% - 1.5rem);}
  .place-figure .tab b{font-family:"Fraunces",serif; font-weight:400; text-transform:none; letter-spacing:0; font-size:1.02rem; display:block; margin-top:.15rem;}

  /* ---------- the day ---------- */
  .section--day{background:var(--paper-2);}
  .day-head{max-width:var(--maxw); margin:0 auto; text-align:center; padding-inline:var(--pad);}
  .day-head h2{margin:1.1rem auto 1.1rem; max-width:18ch;}
  .day-head .lead{margin:0 auto;}
  .day{list-style:none; margin:clamp(2.8rem,6vw,5rem) auto 0; padding:0; max-width:1080px; border-left:1px solid var(--line);}
  .day-stage{position:relative; padding:0 var(--pad) clamp(2.8rem,6vw,5rem) clamp(1.5rem,4vw,3.2rem);}
  .day-stage:last-child{padding-bottom:0;}
  .day-stage::before{content:""; position:absolute; left:-7px; top:.4rem; width:13px; height:13px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 6px var(--paper-2);}
  .day-when{display:flex; align-items:baseline; gap:.8rem; margin-bottom:1rem; flex-wrap:wrap;}
  .day-time{font-family:"Fraunces",serif; font-size:1.45rem; color:var(--sea); line-height:1;}
  .day-tag{font-family:"Jost",sans-serif; text-transform:uppercase; letter-spacing:.2em; font-size:.68rem; color:var(--ink-dim);}
  .day-body{display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.4rem,4vw,3.5rem); align-items:center;}
  .day-body h3{font-size:clamp(1.5rem,3vw,2.3rem); margin-bottom:.75rem;}
  .day-body p{color:var(--ink-dim); max-width:42ch;}
  .day-body figure{margin:0;}
  .day-body img{width:100%; aspect-ratio:16/11; object-fit:cover; border-radius:3px;}

  /* the Friday music stage — the crescendo: full width, live video */
  .stage--music .day-body{grid-template-columns:1fr; gap:1.6rem;}
  .music-figure{position:relative; margin:0; border-radius:3px; overflow:hidden; background:#0c1a18;}
  .music-figure video{display:block; width:100%; aspect-ratio:16/8.6; object-fit:cover;}
  .music-figure::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,18,16,.04),rgba(8,18,16,.3) 90%); pointer-events:none;}
  .music-badge{
    position:absolute; z-index:2; left:1rem; top:1rem;
    display:inline-flex; align-items:center; gap:.5rem;
    background:rgba(12,26,24,.76); color:var(--paper); backdrop-filter:blur(4px);
    font-family:"Jost",sans-serif; font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
    padding:.6em 1em; border-radius:40px; border:1px solid rgba(244,239,230,.22); white-space:nowrap;
  }
  .music-badge::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--gold); animation:pulse 2.4s ease-in-out infinite; flex:none;}
  .music-copy{max-width:60ch;}

  /* ---------- huerto: from the garden to the table ---------- */
  .huerto-head{max-width:var(--maxw); margin:0 auto; padding-inline:var(--pad);}
  .huerto-head h2{margin:1.1rem 0 1.3rem; max-width:15ch;}
  .chain{
    max-width:var(--maxw); margin:clamp(2.6rem,6vw,4.5rem) auto 0; padding-inline:var(--pad);
    display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,3.5vw,3rem); position:relative;
  }
  .chain::before{content:""; position:absolute; top:6px; left:calc(var(--pad) + 60px); right:calc(var(--pad) + 60px); height:1px; background:var(--line); z-index:0;}
  .step{position:relative; z-index:1;}
  .step-head{display:flex; align-items:center; gap:.7rem; margin-bottom:1.1rem; background:var(--paper); padding-right:.4rem;}
  .step-dot{width:13px; height:13px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 6px var(--paper); flex:none;}
  .step-label{font-family:"Jost",sans-serif; font-weight:500; font-size:.68rem; letter-spacing:.24em; text-transform:uppercase; color:var(--sea);}
  .step figure{margin:0 0 1.2rem;}
  .step img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px;}
  .step h3{font-size:clamp(1.4rem,2.4vw,1.85rem); margin-bottom:.6rem;}
  .step p{color:var(--ink-dim); font-size:.97rem; max-width:38ch;}

  /* postcards from the garden — slow film strip */
  .strip{margin-top:clamp(2.8rem,6.5vw,5rem); overflow:hidden; position:relative;}
  .strip::before,.strip::after{content:""; position:absolute; top:0; bottom:0; width:clamp(26px,8vw,110px); z-index:2; pointer-events:none;}
  .strip::before{left:0; background:linear-gradient(90deg,var(--paper),rgba(244,239,230,0));}
  .strip::after{right:0; background:linear-gradient(-90deg,var(--paper),rgba(244,239,230,0));}
  .strip-track{display:flex; gap:12px; width:max-content; animation:drift 74s linear infinite;}
  .strip:hover .strip-track{animation-play-state:paused;}
  .strip-track img{height:clamp(136px,20vw,220px); width:auto; border-radius:3px; flex:none;}
  @keyframes drift{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 6px))}}

  /* ---------- menu ---------- */
  .menu-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,4.5rem); align-items:start;}
  .menu-figure{margin:0; position:sticky; top:calc(var(--head-h) + 2rem);}
  .menu-figure img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px;}
  /* min-width:0 is load-bearing: a grid item defaults to min-width:auto, so it can't
     shrink below its content — the nowrap chip row would stretch the whole page. */
  .menu-copy{min-width:0;}
  .menu-copy h2{margin:1.1rem 0 1.15rem; max-width:15ch;}

  /* category chips — the whole carta lives here, one course at a time.
     Wide screens wrap them; phones swipe them (a cut-off chip on desktop reads as a bug). */
  .menu-tabs{display:flex; flex-wrap:wrap; gap:.5rem; margin:1.9rem 0 1.6rem; min-width:0;}
  .chip{
    font-family:"Jost",sans-serif; font-weight:500; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
    padding:.72em 1.1em; border-radius:40px; border:1px solid var(--line); background:transparent; color:var(--ink-dim);
    cursor:pointer; white-space:nowrap; flex:none; transition:background .3s ease,color .3s ease,border-color .3s ease; line-height:1;
  }
  .chip:hover{border-color:var(--ink); color:var(--ink);}
  .chip.is-on{background:var(--sea); border-color:var(--sea); color:var(--paper);}

  .panel{display:none;}
  .panel.is-on{display:block; animation:fadein .4s ease;}
  @keyframes fadein{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}
  .panel-note{font-family:"Jost",sans-serif; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--sea); display:flex; align-items:center; gap:.55rem; margin-bottom:1.1rem;}
  .panel-note::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--gold); flex:none;}

  .menu-list{margin:0 0 1.5rem; padding:0; list-style:none;}
  .menu-row{display:flex; align-items:baseline; gap:.5rem; padding:.5rem 0; flex-wrap:wrap; border-bottom:1px solid rgba(19,32,30,.07);}
  .menu-row:last-child{border-bottom:0;}
  .menu-row .name{font-family:"Fraunces",serif; font-size:1.08rem; font-weight:400; line-height:1.25;}
  .menu-row .leader{flex:1 1 20px; border-bottom:1px dotted var(--line); transform:translateY(-.3rem); min-width:14px;}
  .menu-row .price{font-family:"Jost",sans-serif; font-weight:500; font-size:.92rem; letter-spacing:.03em; color:var(--ink); white-space:nowrap;}
  .menu-row .desc{flex:1 0 100%; font-size:.85rem; color:var(--ink-dim); margin-top:.1rem; line-height:1.5;}
  .menu-row .desc:empty{display:none;}
  .menu-row--star .name,.menu-row--star .price{color:var(--sea);}
  .menu-row--star .price{font-weight:600;}

  .menu-extra{display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap; background:var(--paper); border:1px solid var(--line); border-radius:3px; padding:.85rem 1rem; margin-bottom:1.4rem;}
  .menu-extra .name{font-family:"Fraunces",serif; font-size:1rem;}
  .menu-extra .price{font-family:"Jost",sans-serif; font-size:.85rem; font-weight:500; color:var(--sea); margin-left:auto; white-space:nowrap;}

  .cocktail-list{display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.4rem; padding:0; list-style:none;}
  .cocktail-list li{font-family:"Jost",sans-serif; font-size:.74rem; text-transform:uppercase; letter-spacing:.12em; padding:.55em 1em; border:1px solid var(--line); border-radius:40px; color:var(--ink-dim);}

  .menu-note{font-size:.82rem; color:var(--ink-dim); font-style:italic; line-height:1.6;}

  /* their own words, straight off the printed carta */
  .creed{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.9rem clamp(1.5rem,5vw,3.5rem); margin-top:clamp(3rem,6vw,4.5rem); padding-top:clamp(2rem,4vw,2.8rem); border-top:1px solid var(--line); font-family:"Jost",sans-serif; font-size:.68rem; text-transform:uppercase; letter-spacing:.18em; color:var(--ink-dim); text-align:center;}
  .creed .tag{font-family:"Fraunces",serif; font-size:1.05rem; text-transform:none; letter-spacing:0; color:var(--sea);}

  /* ---------- sun beds & beach service ---------- */
  .section--sun{position:relative; background:#0c1a18; color:var(--paper); overflow:hidden;}
  .sun-bg{position:absolute; inset:0; z-index:0;}
  .sun-bg img{width:100%; height:100%; object-fit:cover; opacity:.5;}
  .section--sun::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(96deg,rgba(9,19,17,.93) 0%,rgba(9,19,17,.8) 46%,rgba(9,19,17,.42) 100%);}
  .section--sun .wrap{position:relative; z-index:2;}
  .sun-copy{max-width:56ch;}
  .sun-copy h2{color:var(--paper); margin:1.1rem 0 1.3rem; max-width:15ch;}
  .sun-copy p+p{margin-top:1rem;}
  .sun-list{list-style:none; margin:1.9rem 0 0; padding:0; display:grid; gap:.8rem;}
  .sun-list li{display:flex; gap:.8rem; align-items:flex-start; color:var(--paper-dim); font-size:.98rem; line-height:1.5;}
  .sun-list li::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--gold); flex:none; margin-top:.6rem;}
  .sun-cta{display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2.2rem;}

  /* ---------- gallery ---------- */
  .gal-head{margin-bottom:clamp(2rem,4vw,3rem);}
  .gal-head h2{margin-top:1.1rem; max-width:16ch;}
  .gallery{column-count:4; column-gap:12px;}
  .gallery a{display:block; margin:0 0 12px; overflow:hidden; border-radius:3px; position:relative; cursor:zoom-in; break-inside:avoid;}
  .gallery a img{width:100%; height:auto; transition:transform .8s cubic-bezier(.2,.7,.2,1);}
  .gallery a::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(8,18,16,.4)); opacity:0; transition:opacity .4s ease;}
  .gallery a:hover img{transform:scale(1.06);}
  .gallery a:hover::after{opacity:1;}

  /* lightbox */
  .lightbox{position:fixed; inset:0; z-index:120; background:rgba(9,16,14,.95); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .35s ease,visibility .35s ease; padding:clamp(3.2rem,8vw,4.5rem) clamp(.6rem,4vw,3rem);}
  .lightbox.open{opacity:1; visibility:visible;}
  .lightbox img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; border-radius:3px; box-shadow:0 30px 80px -20px rgba(0,0,0,.6);}
  .lb-btn{position:absolute; background:none; border:0; color:var(--paper); cursor:pointer; opacity:.85; transition:opacity .25s ease; font-family:"Jost",sans-serif; z-index:2;}
  .lb-btn:hover{opacity:1;}
  .lb-close{top:clamp(.8rem,3vw,2rem); right:clamp(.8rem,3vw,2rem); font-size:.72rem; text-transform:uppercase; letter-spacing:.2em; padding:.6rem;}
  .lb-prev,.lb-next{top:50%; transform:translateY(-50%); font-size:2.2rem; line-height:1; padding:.4rem .7rem; font-family:Fraunces,serif; background:rgba(12,26,24,.5); border-radius:50%;}
  .lb-prev{left:.35rem;} .lb-next{right:.35rem;}

  /* ---------- testimonials ---------- */
  .section--dark{background:var(--ink); color:var(--paper);}
  .section--dark h2{color:var(--paper);}
  .quotes-head{text-align:center; max-width:var(--maxw); margin:0 auto;}
  .quotes-head h2{margin:1.1rem auto 0; max-width:20ch;}
  .quotes{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.6rem,3vw,2.8rem); margin-top:clamp(2.6rem,6vw,4.5rem);}
  .quote{border-top:1px solid var(--line-dark); padding:1.5rem 0 0; margin:0;}
  .stars{color:var(--gold); letter-spacing:.18em; font-size:.82rem; margin-bottom:1rem;}
  .quote p{font-family:"Fraunces",serif; font-size:1.18rem; font-weight:340; line-height:1.45; color:var(--paper);}
  .quote .who{display:block; margin-top:1.2rem; font-family:"Jost",sans-serif; text-transform:uppercase; letter-spacing:.16em; font-size:.68rem; color:var(--foam);}

  /* ---------- visit ---------- */
  .section--visit{position:relative; background:#0c1a18; color:var(--paper); overflow:hidden;}
  .visit-bg{position:absolute; inset:0; z-index:0;}
  .visit-bg img{width:100%; height:100%; object-fit:cover; opacity:.34;}
  .section--visit::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(10,20,18,.72),rgba(10,20,18,.93));}
  .section--visit .wrap{position:relative; z-index:2;}
  .visit-top{text-align:center; max-width:760px; margin:0 auto;}
  .visit-top h2{color:var(--paper); margin:1.1rem 0 1.4rem;}
  .visit-top .lead{margin:0 auto;}
  .visit-cta{display:flex; flex-wrap:wrap; gap:.85rem; justify-content:center; margin-top:2rem;}
  .visit-info{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1.6rem,3vw,2.5rem); margin-top:clamp(3rem,7vw,5.5rem); border-top:1px solid var(--line-dark); padding-top:clamp(2.2rem,5vw,3.5rem);}
  .visit-info h4{margin:0 0 .8rem; font-family:"Jost",sans-serif; text-transform:uppercase; letter-spacing:.2em; font-size:.7rem; color:var(--foam); font-weight:500;}
  .visit-info p,.visit-info a{font-size:.96rem; color:var(--paper-dim); line-height:1.75;}
  .visit-info a:hover{color:var(--paper);}
  .visit-info .big{font-family:"Fraunces",serif; font-size:1.3rem; color:var(--paper); line-height:1.2;}
  .visit-info .u{border-bottom:1px solid var(--line-dark); padding-bottom:.15rem;}

  /* ---------- footer ---------- */
  .foot{background:var(--ink-2); color:var(--paper-dim); padding-block:clamp(2.8rem,6vw,4.5rem);}
  .foot .wrap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:1.8rem; align-items:flex-start;}
  .foot-logo{width:142px; height:auto; display:block; filter:brightness(0) invert(1); opacity:.95;}
  .foot-nav{display:flex; flex-wrap:wrap; gap:1.2rem;}
  .foot-nav a{font-family:"Jost",sans-serif; text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; color:var(--paper-dim);}
  .foot-nav a:hover{color:var(--paper);}
  .foot-bottom{width:100%; border-top:1px solid var(--line-dark); margin-top:2.4rem; padding-top:1.5rem; font-family:"Jost",sans-serif; font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; display:flex; flex-wrap:wrap; gap:.6rem 1.4rem; justify-content:space-between; color:rgba(244,239,230,.5);}
  .foot-bottom a{color:rgba(244,239,230,.62);}
  .foot-bottom a:hover{color:var(--paper);}

  /* ---------- booking modal ---------- */
  .modal{position:fixed; inset:0; z-index:130; display:flex; align-items:center; justify-content:center; padding:clamp(.6rem,3vw,2rem); opacity:0; visibility:hidden; transition:opacity .3s ease,visibility .3s ease;}
  .modal.open{opacity:1; visibility:visible;}
  .modal-veil{position:absolute; inset:0; background:rgba(9,16,14,.86); backdrop-filter:blur(3px);}
  .modal-card{
    position:relative; z-index:1; background:var(--paper); border-radius:4px; overflow:hidden;
    width:min(1080px,100%); height:min(920px,94svh); display:flex; flex-direction:column;
    box-shadow:0 40px 90px -25px rgba(0,0,0,.7); transform:translateY(12px); transition:transform .35s ease;
  }
  /* el iframe necesita ALTURA propia: sin esto colapsa a los 150px por
     defecto del navegador y la tarjeta flex se encoge con él */
  .modal-body{min-height:520px;}
  .modal.open .modal-card{transform:none;}
  .modal-head{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.15rem; border-bottom:1px solid var(--line); background:var(--paper); flex:none;}
  .modal-head .mt{font-family:"Fraunces",serif; font-size:1.2rem; line-height:1.2;}
  .modal-head .ms{display:block; font-family:"Jost",sans-serif; font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-dim); margin-top:.25rem;}
  .modal-close{background:none; border:1px solid var(--line); color:var(--ink); border-radius:40px; cursor:pointer; font-family:"Jost",sans-serif; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; padding:.6em 1em; transition:background .3s ease,color .3s ease; flex:none;}
  .modal-close:hover{background:var(--ink); color:var(--paper);}
  .modal-body{position:relative; flex:1 1 auto; min-height:0; background:#fff;}
  .modal-body iframe{width:100%; height:100%; border:0; display:block;}
  .modal-spin{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem; background:var(--paper); color:var(--ink-dim); font-family:"Jost",sans-serif; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; transition:opacity .4s ease;}
  .modal-spin.hide{opacity:0; pointer-events:none;}
  .modal-spin .sun{width:18px; height:18px; border-radius:50%; background:var(--gold); animation:beat 1.5s ease-in-out infinite;}
  @keyframes beat{0%,100%{transform:scale(.65); opacity:.5}50%{transform:scale(1); opacity:1}}
  .modal-foot{padding:.85rem 1.15rem; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; flex:none;}
  .modal-foot span{font-size:.78rem; color:var(--ink-dim);}
  .modal-foot a{font-family:"Jost",sans-serif; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--sea); border-bottom:1px solid var(--line); padding-bottom:.15rem; white-space:nowrap;}
  .modal-foot a:hover{border-color:var(--sea);}

  /* ---------- reveal ---------- */
  .reveal{opacity:0; transform:translateY(24px); transition:opacity .9s ease,transform .9s ease;}
  .reveal.is-visible{opacity:1; transform:none;}
  .no-js .reveal{opacity:1; transform:none;}

  /* ---------- responsive ---------- */
  @media (max-width:1100px){
    .nav{gap:1.15rem;}
    .navlink{font-size:.72rem; letter-spacing:.12em;}
  }
  @media (max-width:1000px){
    .gallery{column-count:3;}
  }
  @media (max-width:900px){
    :root{--head-h:66px;}
    .nav{display:none;}
    .burger{display:flex;}
    .place-grid{grid-template-columns:1fr; gap:2.2rem;}
    .place-copy{order:2;}
    .place-figure{order:1;}
    .place-figure img{aspect-ratio:3/2;}
    .menu-grid{grid-template-columns:1fr; gap:2.2rem;}
    .menu-figure{order:2; position:static;}
    .menu-figure img{aspect-ratio:3/2;}
    .menu-tabs{flex-wrap:nowrap; overflow-x:auto; padding-bottom:.5rem; -webkit-overflow-scrolling:touch; scrollbar-width:none;}
    .menu-tabs::-webkit-scrollbar{display:none;}
    .day-body{grid-template-columns:1fr; gap:1.3rem;}
    .day-body figure{order:-1;}
    .quotes{grid-template-columns:1fr;}
    .quote{border-top:0; border-left:1px solid var(--line-dark); padding:.2rem 0 .2rem 1.3rem;}
    .visit-info{grid-template-columns:1fr 1fr; gap:1.8rem;}
    .chain{grid-template-columns:1fr; gap:2.4rem;}
    .chain::before{display:none;}
    .step-head{background:none;}
    .step img{aspect-ratio:3/2;}
    .step p{max-width:46ch;}
  }
  @media (max-width:560px){
    .gallery{column-count:2; column-gap:9px;}
    .gallery a{margin-bottom:9px;}
    .hero-meta .scrollcue{display:none;}
    .hero-meta{justify-content:flex-end; font-size:.58rem; letter-spacing:.16em;}
    .hero-cta{flex-direction:column; align-items:stretch; width:100%; max-width:330px;}
    .hero-cta .btn{width:100%;}
    .visit-cta{flex-direction:column; align-items:stretch;}
    .visit-cta .btn{width:100%;}
    .visit-info{grid-template-columns:1fr; gap:1.6rem;}
    .foot-bottom{flex-direction:column; gap:.4rem;}
    .foot .wrap{gap:1.4rem;}
    .modal{padding:0;}
    .modal-card{width:100%; max-height:100svh; height:100svh; border-radius:0;}
    .music-badge{left:.6rem; top:.6rem; font-size:.56rem; padding:.55em .85em;}
    .music-figure video{aspect-ratio:4/3;}
  }
  @media (max-height:700px) and (min-width:561px){
    .hero-logo{width:clamp(120px,14vw,170px); margin-bottom:1rem;}
    .hero h1{font-size:clamp(2.1rem,5.4vw,3.4rem); margin:.6rem 0 .8rem;}
    .hero-cta{margin-top:1.4rem;}
  }
  @media (max-width:380px){
    .brand img{width:74px;}
    .lang-btn{padding:.55em .7em; letter-spacing:.12em;}
  }

  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    .reveal{opacity:1!important; transform:none!important; transition:none!important;}
    .strip-track{animation:none!important;}
    .scrollcue .stem,.music-badge::before,.modal-spin .sun{animation:none!important;}
    *{transition-duration:.001ms!important;}
  }


/* ================================================================
   CAPA 2 — landings, 3D y efectos (Nassau-grade)
   ================================================================ */

/* ---------- landing hero ---------- */
.lp-hero{position:relative; min-height:72svh; display:flex; align-items:flex-end; overflow:hidden; background:#0c1a18; color:var(--paper);}
.lp-hero--tall{min-height:88svh;}
.lp-media{position:absolute; inset:-8% 0; z-index:0; will-change:transform;}
.lp-media img,.lp-media video{width:100%; height:100%; object-fit:cover;}
/* Scrim de dos capas: vertical (el texto vive abajo) + horizontal (oscurece
   el lado del texto y deja respirar la foto a la derecha). Un solo degradado
   vertical dejaba el h1 sobre la zona clara de la foto: ilegible. */
  .lp-hero::before{content:""; position:absolute; inset:0; z-index:1;
    background:
      linear-gradient(180deg, rgba(6,15,13,.62) 0%, rgba(6,15,13,.34) 24%, rgba(6,15,13,.74) 58%, rgba(6,15,13,.93) 100%),
      linear-gradient(90deg, rgba(6,15,13,.78) 0%, rgba(6,15,13,.42) 44%, rgba(6,15,13,0) 76%);
  }
.lp-hero .wrap{position:relative; z-index:2; width:100%; padding-top:calc(var(--head-h) + 3rem); padding-bottom:clamp(2.5rem,7vw,5rem);}
.lp-kicker{font-family:"Jost",sans-serif; font-weight:500; font-size:.72rem; letter-spacing:.32em; text-transform:uppercase; color:var(--foam); display:inline-flex; align-items:center; gap:.7rem; text-shadow:0 1px 3px rgba(6,15,13,.7), 0 2px 14px rgba(6,15,13,.6);}
.lp-kicker::before{content:""; width:30px; height:1px; background:var(--gold);}
.lp-kicker em{font-family:"Fraunces",serif; font-style:italic; text-transform:none; letter-spacing:.02em; font-size:1.05rem; color:var(--paper);}
.lp-hero h1{font-size:clamp(2.5rem,6.5vw,5.2rem); color:#fff; max-width:16ch; margin:.9rem 0 1rem; text-shadow:0 1px 3px rgba(6,15,13,.55), 0 6px 44px rgba(6,15,13,.7);}
.lp-hero h1 em{font-style:italic; font-weight:300; color:var(--foam);}
.lp-hero .sub{max-width:52ch; color:var(--paper-dim); font-size:clamp(1.02rem,1.5vw,1.22rem); line-height:1.65; text-shadow:0 1px 3px rgba(6,15,13,.6), 0 2px 18px rgba(6,15,13,.55);}
.lp-hero .lp-cta{display:flex; flex-wrap:wrap; gap:.85rem; margin-top:1.8rem;}
.lp-meta{position:absolute; right:var(--pad); bottom:1.2rem; z-index:2; font-family:"Jost",sans-serif; font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--paper-dim); text-align:right; pointer-events:none;}

/* ---------- experience cards (the 3D moment) ---------- */
.cards-head{text-align:center; max-width:var(--maxw); margin:0 auto clamp(2.4rem,5vw,3.6rem); padding-inline:var(--pad);}
.cards-head h2{margin:1.1rem auto 0; max-width:18ch;}
.cards{max-width:var(--maxw); margin:0 auto; padding-inline:var(--pad); display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.2rem,2.6vw,2rem); perspective:1400px;}
.card3d{
  position:relative; display:block; border-radius:4px; overflow:hidden; background:var(--ink);
  transform-style:preserve-3d; transform:rotateX(0) rotateY(0);
  transition:transform .55s cubic-bezier(.2,.7,.2,1), box-shadow .55s ease;
  box-shadow:0 24px 60px -34px rgba(12,26,24,.55);
}
.card3d:hover{box-shadow:0 44px 90px -36px rgba(12,26,24,.75);}
.card3d figure{margin:0; position:relative; aspect-ratio:16/10.5; overflow:hidden; transform:translateZ(0);}
.card3d figure img{width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.7,.2,1); will-change:transform;}
.card3d:hover figure img{transform:scale(1.07);}
.card3d figure::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,18,16,0) 30%,rgba(8,18,16,.82) 100%);}
.card3d .card-in{position:absolute; left:0; right:0; bottom:0; padding:clamp(1.1rem,2.4vw,1.7rem); color:var(--paper); transform:translateZ(46px);}
.card3d .card-k{font-family:"Jost",sans-serif; font-size:.6rem; letter-spacing:.26em; text-transform:uppercase; color:var(--foam);}
.card3d h3{font-size:clamp(1.45rem,2.6vw,2.1rem); margin:.35rem 0 .3rem; color:#fff;}
.card3d .card-p{font-size:.92rem; color:var(--paper-dim); max-width:40ch; line-height:1.5;}
.card3d .card-go{display:inline-flex; align-items:center; gap:.5rem; margin-top:.8rem; font-family:"Jost",sans-serif; font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); transition:gap .35s ease;}
.card3d:hover .card-go{gap:.9rem;}
.card3d::after{/* gold sheen that follows the tilt */
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; opacity:0;
  background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%), rgba(196,154,94,.16), transparent 45%);
  transition:opacity .4s ease;
}
.card3d:hover::after{opacity:1;}

/* ---------- marquee (their own words, drifting) ---------- */
.marquee{overflow:hidden; border-block:1px solid var(--line); padding-block:.95rem; background:var(--paper);}
.marquee-track{display:flex; gap:0; width:max-content; animation:mq 38s linear infinite; will-change:transform;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-track span{font-family:"Jost",sans-serif; font-size:.7rem; letter-spacing:.26em; text-transform:uppercase; color:var(--ink-dim); white-space:nowrap; display:inline-flex; align-items:center;}
.marquee-track span::after{content:""; width:9px; height:9px; border-radius:50%; background:var(--gold); margin:0 2.1rem; flex:none;}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- CTA band (conversion closer on every page) ---------- */
.cta-band{position:relative; background:var(--ink); color:var(--paper); text-align:center; overflow:hidden;}
.cta-band .wrap{position:relative; z-index:1;}
.cta-band::before{content:""; position:absolute; left:50%; top:-90px; width:520px; height:520px; transform:translateX(-50%); border-radius:50%; background:radial-gradient(circle, rgba(196,154,94,.16), transparent 62%); pointer-events:none;}
.cta-band h2{color:var(--paper); font-size:clamp(1.9rem,4.4vw,3.3rem); max-width:20ch; margin:0 auto 1rem;}
.cta-band p{color:var(--paper-dim); max-width:46ch; margin:0 auto;}
.cta-band .visit-cta{margin-top:2rem;}

/* ---------- sticky reserve bar (mobile conversion) ---------- */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:55; display:none;
  padding:.6rem var(--pad) calc(.6rem + env(safe-area-inset-bottom));
  background:rgba(244,239,230,.92); backdrop-filter:blur(10px); border-top:1px solid var(--line);
  transform:translateY(110%); transition:transform .45s cubic-bezier(.2,.7,.2,1);
}
.sticky-cta.on{transform:none;}
.sticky-cta .btn{width:100%; padding:.95em 1.2em;}
@media (max-width:900px){ .sticky-cta{display:block;} }

/* ---------- word-by-word hero reveal ---------- */
.split .w{display:inline-block; overflow:hidden; vertical-align:bottom;}
.split .w > span{display:inline-block; transform:translateY(112%); transition:transform .9s cubic-bezier(.2,.7,.15,1);}
.split.go .w > span{transform:none;}

/* ---------- reveal v2: blur in ---------- */
.reveal{opacity:0; transform:translateY(26px); filter:blur(6px); transition:opacity .95s ease, transform .95s cubic-bezier(.2,.7,.2,1), filter .95s ease;}
.reveal.is-visible{opacity:1; transform:none; filter:blur(0);}
[data-stagger] > .reveal:nth-child(2){transition-delay:.12s;}
[data-stagger] > .reveal:nth-child(3){transition-delay:.24s;}
[data-stagger] > .reveal:nth-child(4){transition-delay:.36s;}

/* ---------- sunrise: the horizon sun rises into place ---------- */
.horizon::before{transform:translate(-50%,calc(-50% + 18px)); opacity:0; transition:transform 1.5s cubic-bezier(.2,.7,.2,1), opacity 1.2s ease;}
.horizon::after{opacity:0; transition:opacity 1.6s ease .3s;}
.horizon.is-sunrise::before{transform:translate(-50%,-50%); opacity:1;}
.horizon.is-sunrise::after{opacity:1;}

/* ---------- custom cursor (fine pointers only) ---------- */
@media (pointer:fine){
  .cursor-dot,.cursor-ring{position:fixed; top:0; left:0; z-index:200; pointer-events:none; border-radius:50%; transform:translate(-50%,-50%); will-change:transform;}
  .cursor-dot{width:7px; height:7px; background:var(--gold);}
  .cursor-ring{width:34px; height:34px; border:1px solid rgba(196,154,94,.55); transition:width .3s ease,height .3s ease,border-color .3s ease,background .3s ease;}
  .cursor-ring.is-link{width:52px; height:52px; border-color:rgba(196,154,94,.9); background:rgba(196,154,94,.08);}
  body.has-cursor, body.has-cursor a, body.has-cursor button{cursor:none;}
}
.cursor-dot,.cursor-ring{display:none;}
body.has-cursor .cursor-dot,body.has-cursor .cursor-ring{display:block;}

/* ---------- grain on dark sections (premium texture) ---------- */
.section--dark,.section--visit,.section--sun,.cta-band,.lp-hero{isolation:isolate;}
.section--dark::before,.cta-band::after,.lp-hero::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}
.lp-hero::after{z-index:1;}

/* ---------- landing content helpers ---------- */
.lp-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,5rem); align-items:center;}
.lp-grid figure{margin:0;}
.lp-grid figure img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px;}
.lp-list{list-style:none; margin:1.8rem 0 0; padding:0; display:grid; gap:.75rem;}
.lp-list li{display:flex; gap:.8rem; align-items:flex-start; color:var(--ink-dim); line-height:1.55;}
.lp-list li::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--gold); flex:none; margin-top:.62rem;}
.grow-chips{display:flex; flex-wrap:wrap; gap:.55rem; margin-top:1.6rem; list-style:none; padding:0;}
.grow-chips li{font-family:"Jost",sans-serif; font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; padding:.55em 1.05em; border:1px solid var(--line); border-radius:40px; color:var(--ink-dim); background:var(--paper);}
.big-hour{font-family:"Fraunces",serif; font-size:clamp(2.6rem,6vw,4.4rem); line-height:1; color:var(--sea);}
.big-hour small{display:block; font-family:"Jost",sans-serif; font-size:.7rem; letter-spacing:.28em; text-transform:uppercase; color:var(--ink-dim); margin-top:.7rem;}

@media (max-width:900px){
  .cards{grid-template-columns:1fr;}
  .lp-grid{grid-template-columns:1fr; gap:2rem;}
  .lp-grid figure{order:-1;}
  .lp-grid figure img{aspect-ratio:3/2;}
  .lp-hero{min-height:64svh;}
  .lp-meta{display:none;}
  .lp-hero::before{background:
      linear-gradient(180deg, rgba(6,15,13,.66) 0%, rgba(6,15,13,.42) 22%, rgba(6,15,13,.80) 56%, rgba(6,15,13,.95) 100%),
      linear-gradient(90deg, rgba(6,15,13,.62) 0%, rgba(6,15,13,.45) 70%, rgba(6,15,13,.25) 100%);}
}

@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none!important;}
  .split .w > span{transform:none!important; transition:none!important;}
  .reveal{filter:none!important;}
  .horizon::before{transform:translate(-50%,-50%)!important; opacity:1!important;}
  .horizon::after{opacity:1!important;}
  .card3d{transform:none!important;}
  .cursor-dot,.cursor-ring{display:none!important;}
  body.has-cursor, body.has-cursor a, body.has-cursor button{cursor:auto!important;}
}

/* ================================================================
   Vídeos ambientales: JAMÁS interfaz de reproductor.
   Si iOS bloquea el autoplay (Modo Bajo Consumo), pinta su botón
   de play nativo encima del póster — estas reglas lo eliminan del
   shadow DOM de WebKit. Resultado: póster limpio, sin glifo.
   ================================================================ */
video::-webkit-media-controls,
video::-webkit-media-controls-panel,
video::-webkit-media-controls-play-button,
video::-webkit-media-controls-start-playback-button{
  display:none!important; -webkit-appearance:none!important; opacity:0!important;
}
video::-webkit-media-controls-enclosure{display:none!important;}

/* fallback de vídeo: si el sistema bloquea la reproducción, el vídeo se
   oculta y su póster ocupa el sitio como imagen — nunca un botón de play */
.video-hidden{opacity:0!important;}
.video-poster-fb{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}