/* NÉA 181 — Global styles */
:root{
  --ink:#1f211d;
  --muted:#6d7068;
  --paper:#f0eee8;
  --paper-2:#e8e4dc;
  --stone:#d7d1c6;
  --olive:#777d6a;
  --night:#171915;
  --line:rgba(31,33,29,.18);
  --serif:"Instrument Serif", Georgia, serif;
  --sans:"DM Sans", Arial, sans-serif;
  --pad:clamp(24px,4vw,72px);
  --radius:2px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  overflow-x:hidden;
}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{color:inherit}
img{max-width:100%}
::selection{background:#23251f;color:#f4f0e9}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0
}

.site-header{
  position:fixed;inset:0 0 auto 0;height:84px;z-index:50;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:0 var(--pad);
  color:#fff;
  transition:background .45s ease,color .45s ease,height .35s ease,backdrop-filter .45s ease;
}
.site-header.scrolled{
  height:70px;color:var(--ink);
  background:rgba(240,238,232,.88);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(31,33,29,.08);
}
.brand{font-size:20px;letter-spacing:.02em;font-weight:500;justify-self:start}
.brand-nea{margin-right:7px}.brand-181{font-weight:300;opacity:.76}
.desktop-nav{display:flex;gap:30px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.desktop-nav a,.header-cta{transition:opacity .25s}
.desktop-nav a:hover,.header-cta:hover{opacity:.55}
.header-cta{
  justify-self:end;border:0;background:transparent;cursor:pointer;
  padding:10px 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase
}
.menu-toggle{
  display:none;justify-self:end;width:38px;height:38px;border:0;background:transparent;cursor:pointer;padding:8px
}
.menu-toggle span{display:block;height:1px;background:currentColor;margin:7px 0;transition:.25s}

.mobile-menu{
  position:fixed;inset:0;z-index:45;background:var(--paper);
  padding:120px var(--pad) 48px;
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:.35s ease;
}
.mobile-menu.open{opacity:1;visibility:visible;transform:none}
.mobile-menu nav{display:flex;flex-direction:column;gap:10px}
.mobile-menu nav a{
  font-family:var(--serif);font-size:clamp(42px,12vw,74px);line-height:.95
}
.mobile-menu .text-link{margin-top:52px;border:0;background:none;padding:0;text-align:left;cursor:pointer}

.hero{
  position:relative;height:100svh;min-height:680px;color:#fff;
  display:flex;align-items:flex-end;overflow:hidden
}
.hero-media{
  position:absolute;inset:0;
  background:
    linear-gradient(110deg,rgba(0,0,0,.08),rgba(0,0,0,.02)),
    var(--media-home-001-hero-aegean-view)
    center 56% / cover no-repeat;
  transform:scale(1.03);
  animation:heroBreath 14s ease-out forwards
}
@keyframes heroBreath{to{transform:scale(1)}}
.hero-shade{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(12,17,15,.34) 0%,rgba(12,17,15,.03) 40%,rgba(12,17,15,.47) 100%)
}
.hero-topline{
  position:absolute;top:108px;left:var(--pad);right:var(--pad);
  display:flex;justify-content:space-between;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase
}
.hero-copy{position:relative;z-index:2;padding:0 var(--pad) clamp(104px,12vh,150px)}
.eyebrow{
  font-size:10px;line-height:1.4;letter-spacing:.18em;text-transform:uppercase;
  font-weight:500;margin:0 0 24px;color:var(--muted)
}
.eyebrow.light{color:rgba(255,255,255,.72)}
h1,h2{
  font-family:var(--serif);font-weight:400;margin:0;letter-spacing:-.035em
}
h1{font-size:clamp(74px,10.2vw,168px);line-height:.78;max-width:1100px}
h1 em,h2 em{font-weight:400}
.scroll-cue{
  position:absolute;z-index:3;right:var(--pad);bottom:45px;
  display:flex;align-items:center;gap:16px;font-size:10px;
  letter-spacing:.16em;text-transform:uppercase
}
.scroll-line{width:70px;height:1px;background:rgba(255,255,255,.7)}

.section-pad{padding:clamp(100px,13vw,210px) var(--pad)}
.section-index{
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  margin-bottom:clamp(60px,8vw,110px)
}
.intro{min-height:850px;display:grid;grid-template-columns:.8fr 2.2fr .8fr;column-gap:5vw;align-items:start}
.intro .section-index{grid-column:1}
.intro-copy{grid-column:2}
.intro-copy h2,.split-title h2,.dark-copy h2,.experience-head h2,.location-copy h2,.preopen-inner h2{
  font-size:clamp(56px,7.6vw,118px);line-height:.88
}
.body-large{
  max-width:650px;font-family:var(--serif);font-size:clamp(23px,2.3vw,34px);
  line-height:1.25;margin:58px 0 0;color:#4d5148
}
.intro-meta{
  grid-column:3;padding-top:50px;display:flex;flex-direction:column;gap:13px;
  font-size:11px;line-height:1.4;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)
}

.image-break{
  height:86svh;min-height:620px;position:relative;background-size:cover;background-position:center
}
.image-break-one{
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.18)),
    var(--media-home-002-atmosphere-mediterranean)
}
.floating-label{
  position:absolute;right:var(--pad);bottom:42px;color:#fff;
  display:flex;flex-direction:column;align-items:flex-end;
  font-family:var(--serif);font-size:clamp(20px,2.5vw,34px);line-height:1.05
}

.story{padding-bottom:clamp(100px,10vw,170px)}
.split-grid{display:grid;grid-template-columns:1.55fr .65fr;gap:10vw;align-items:end}
.split-copy{padding-bottom:10px}
.split-copy p,.dark-copy p,.location-copy>p,.preopen-inner>p{
  font-size:15px;line-height:1.7;color:var(--muted);max-width:440px;margin:0 0 32px
}
.arrow-link{
  display:inline-flex;gap:35px;align-items:center;
  padding:12px 0;border-bottom:1px solid var(--line);
  font-size:11px;letter-spacing:.12em;text-transform:uppercase
}
.arrow-link span{transition:transform .25s}
.arrow-link:hover span{transform:translate(3px,-3px)}
.editorial-image{
  margin-top:100px;height:70vw;max-height:900px;min-height:620px;position:relative;
  background-size:cover;background-position:center
}
.stay-image{
  background-image:
    linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.16)),
    var(--media-home-003-stay-room)
}
.image-caption{
  position:absolute;bottom:25px;left:25px;right:25px;
  display:flex;justify-content:space-between;color:#fff;
  font-size:9px;letter-spacing:.13em;text-transform:uppercase
}

.dark-section{height:100svh;min-height:760px;position:relative;background:var(--night);color:#fff;overflow:hidden}
.dark-media{
  position:absolute;inset:0 0 0 46%;
  background:
    linear-gradient(90deg,rgba(23,25,21,.6),rgba(23,25,21,.02)),
    var(--media-home-004-eat-mediterranean-table)
    center / cover no-repeat;
}
.dark-content{position:relative;z-index:2;height:100%;padding:var(--pad);display:flex;flex-direction:column}
.light-index{color:rgba(255,255,255,.42);margin-top:70px}
.dark-copy{margin:auto 0 9vh;max-width:720px}
.dark-copy p{color:rgba(255,255,255,.62);margin-top:38px}
.light-link{border-color:rgba(255,255,255,.25)}

.experience-head{max-width:1100px;margin-bottom:90px}
.experience-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:start}
.experience-card{position:relative}
.experience-card:nth-child(2){margin-top:90px}
.card-number{
  font-size:9px;letter-spacing:.16em;color:var(--muted);margin-bottom:12px
}
.card-image{height:46vw;max-height:650px;min-height:400px;background-size:cover;background-position:center}
.pool-image{background-image:var(--media-home-005-pool)}
.wellness-image{background-image:var(--media-home-006-wellness)}
.coast-image{background-image:var(--media-home-007-coast)}
.experience-card h3{
  font-family:var(--serif);font-size:34px;font-weight:400;margin:18px 0 5px
}
.experience-card p{font-size:12px;line-height:1.6;color:var(--muted);max-width:290px;margin:0}

.location{display:grid;grid-template-columns:1fr 1fr;min-height:920px;border-top:1px solid var(--line)}
.location-map{
  position:relative;overflow:hidden;background:#d6d4cb;
  background-image:
    radial-gradient(circle at 78% 25%,rgba(255,255,255,.7),transparent 18%),
    radial-gradient(circle at 21% 64%,rgba(128,136,116,.24),transparent 22%),
    linear-gradient(137deg,transparent 42%,rgba(255,255,255,.55) 42.2%,transparent 42.6%),
    linear-gradient(21deg,transparent 55%,rgba(255,255,255,.45) 55.2%,transparent 55.5%);
}
.location-map:before,.location-map:after{
  content:"";position:absolute;border:1px solid rgba(64,70,59,.18);border-radius:50%
}
.location-map:before{width:75%;height:75%;left:-18%;top:15%}
.location-map:after{width:48%;height:48%;right:-10%;bottom:-10%}
.map-lines{
  position:absolute;inset:12%;
  border-left:1px solid rgba(64,70,59,.18);border-bottom:1px solid rgba(64,70,59,.18);
  transform:rotate(-18deg)
}
.map-dot{
  position:absolute;left:56%;top:44%;width:12px;height:12px;border-radius:50%;
  background:var(--ink);box-shadow:0 0 0 8px rgba(31,33,29,.1)
}
.map-label{
  position:absolute;left:calc(56% + 20px);top:calc(44% - 1px);
  font-size:10px;letter-spacing:.14em;text-transform:uppercase
}
.location-copy{display:flex;flex-direction:column;justify-content:center}
.location-copy .section-index{margin-bottom:75px}
.location-copy>p{margin-top:35px;margin-bottom:0}
.location-copy .location-small{font-size:12px;max-width:360px;margin-top:18px}
.location-copy .arrow-link{margin-top:42px;align-self:flex-start}

.preopen-cta{
  min-height:820px;position:relative;overflow:hidden;background:#cfd0c3;
  display:grid;place-items:center;padding:130px var(--pad)
}
.oversize-181{
  position:absolute;left:-3vw;bottom:-14vw;
  font-family:var(--serif);font-size:46vw;line-height:.7;color:rgba(255,255,255,.25);
  letter-spacing:-.08em;pointer-events:none;user-select:none
}
.preopen-inner{position:relative;z-index:2;text-align:center;max-width:760px}
.preopen-inner>p{margin:34px auto 38px;color:#4d5148}
.preopen-email-cta{
  display:flex;justify-content:space-between;align-items:center;
  width:min(360px,100%);margin:0 auto;border:1px solid rgba(31,33,29,.55);
  padding:17px 20px;font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  transition:background .25s,color .25s
}
.preopen-email-cta:hover{background:var(--ink);color:#fff}
.site-footer{background:var(--night);color:#ece9e1;padding:80px var(--pad) 28px}
.footer-brand{
  font-family:var(--serif);font-size:clamp(95px,17vw,260px);line-height:.75;
  letter-spacing:-.06em;border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:58px
}
.footer-brand span{font-family:var(--sans);font-weight:300;letter-spacing:-.08em}
.footer-grid{
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;padding:58px 0 85px
}
.footer-grid div{display:flex;flex-direction:column;align-items:flex-start}
.footer-grid p,.footer-grid a,.footer-grid .footer-item{
  margin:0 0 8px;font-size:11px;line-height:1.6;color:rgba(255,255,255,.67)
}
.footer-label{
  color:#fff!important;text-transform:uppercase;letter-spacing:.15em!important;
  font-size:9px!important;margin-bottom:20px!important
}
.footer-grid a:hover{color:#fff}
.footer-grid .footer-item{display:block}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.15);padding-top:22px;
  display:flex;justify-content:space-between;font-size:9px;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(255,255,255,.45)
}

.reveal{
  opacity:1;
  transform:none;
}
html.motion-ready .reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)
}
html.motion-ready .reveal.visible{
  opacity:1;
  transform:none;
}

.cursor-glow{
  position:fixed;z-index:999;width:220px;height:220px;border-radius:50%;
  pointer-events:none;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(255,255,255,.08),transparent 65%);
  mix-blend-mode:soft-light;opacity:0;transition:opacity .3s
}

@media (max-width: 980px){
  .desktop-nav,.header-cta{display:none}
  .site-header{grid-template-columns:1fr auto}
  .menu-toggle{display:block}
  .hero-topline{top:96px}
  .intro{grid-template-columns:1fr 3fr}
  .intro-copy{grid-column:2}
  .intro-meta{grid-column:2;flex-direction:row;flex-wrap:wrap;padding-top:36px}
  .split-grid{grid-template-columns:1fr}
  .split-copy{max-width:460px}
  .experience-grid{grid-template-columns:1fr 1fr}
  .experience-card:nth-child(2){margin-top:70px}
  .experience-card:nth-child(3){grid-column:2;margin-top:10px}
  .location{grid-template-columns:1fr}
  .location-map{min-height:620px}
  .footer-grid{grid-template-columns:2fr 1fr 1fr}
  .footer-grid>div:last-child{grid-column:2}
}
@media (max-width: 680px){
  :root{--pad:22px}
  .site-header{height:68px}
  .site-header.scrolled{height:62px}
  .hero{min-height:650px}
  .hero-topline{top:84px;flex-direction:column;gap:7px}
  .hero-copy{padding-bottom:110px}
  h1{font-size:clamp(66px,21vw,106px);line-height:.82}
  .scroll-cue{right:auto;left:var(--pad);bottom:38px}
  .intro{display:block;min-height:0}
  .intro .section-index{margin-bottom:60px}
  .intro-copy h2,.split-title h2,.dark-copy h2,.experience-head h2,.location-copy h2,.preopen-inner h2{
    font-size:clamp(52px,16vw,82px)
  }
  .body-large{font-size:24px;margin-top:40px}
  .intro-meta{padding-top:38px}
  .image-break{height:72svh;min-height:540px}
  .floating-label{align-items:flex-start;left:var(--pad);right:auto}
  .editorial-image{height:105vw;min-height:540px;margin-top:70px}
  .image-caption{flex-direction:column;gap:5px}
  .dark-section{min-height:760px}
  .dark-media{inset:0;background-position:62% center;opacity:.62}
  .dark-content{background:linear-gradient(90deg,rgba(23,25,21,.82),rgba(23,25,21,.16))}
  .dark-copy{margin-bottom:70px}
  .experience-grid{display:block}
  .experience-card,.experience-card:nth-child(2),.experience-card:nth-child(3){margin:0 0 70px}
  .card-image{height:112vw;min-height:450px}
  .location-map{min-height:480px}
  .location-copy{padding-top:110px;padding-bottom:110px}
  .preopen-cta{min-height:700px}
.footer-brand{font-size:27vw;padding-bottom:40px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:44px 20px;padding:50px 0 65px}
  .footer-grid>div:last-child{grid-column:auto}
  .footer-bottom{gap:16px;flex-direction:column}
  .cursor-glow{display:none}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
}