/* ============================================================
   NEFES ALAÇATI HOTEL — Design System · Aegean Editorial v1.0
   ============================================================ */

/* ---------- 1. TOKENS ---------- */
:root{
  --bone:#F4F1EA; --bone-2:#EAE5DB; --bone-3:#DED7C9;
  --ink:#14181A; --ink-2:#2C3336; --ink-3:#5B6467; --muted:#8B9295;
  --aegean:#3C5F73; --aegean-d:#2B4657; --sand:#C2A278; --sand-l:#D9C3A2;
  --line:rgba(20,24,26,.14); --line-soft:rgba(20,24,26,.07); --white:#fff;

  --serif:"Cormorant Garamond",'Times New Roman',Georgia,serif;
  --sans:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --t-hero:clamp(3.2rem,11.5vw,11rem);
  --t-d1:clamp(2.6rem,6.4vw,6rem);
  --t-d2:clamp(2.1rem,4.4vw,4rem);
  --t-d3:clamp(1.65rem,2.9vw,2.6rem);
  --t-lead:clamp(1.06rem,1.55vw,1.4rem);
  --t-body:clamp(.98rem,1.05vw,1.075rem);
  --t-small:.8125rem; --t-micro:.6875rem;

  --gap:clamp(1rem,2.2vw,2rem);
  --pad-x:clamp(1.25rem,5.2vw,6.5rem);
  --sec:clamp(4rem,7.6vw,7.5rem);
  --sec-s:clamp(2.75rem,4.8vw,4.5rem);

  --e-out:cubic-bezier(.16,1,.3,1);
  --e-io:cubic-bezier(.65,.05,.36,1);
  --maxw:1560px; --hdr:clamp(64px,7vw,92px);
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bone);color:var(--ink);font-family:var(--sans);
  font-size:var(--t-body);font-weight:300;line-height:1.7;letter-spacing:.006em;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
body.is-locked{overflow:hidden}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
svg{display:block}
::selection{background:var(--aegean);color:var(--bone)}
:focus-visible{outline:2px solid var(--aegean);outline-offset:3px;border-radius:2px}

/* ---------- 3. PRIMITIVES ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad-x)}
.wrap-n{max-width:1080px;margin-inline:auto}
.sec{padding-block:var(--sec)}
.sec-s{padding-block:var(--sec-s)}
.sec-t{padding-block:clamp(2rem,3.4vw,3.2rem)}
.hr{height:1px;background:var(--line-soft);border:0;margin:0}
.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}
.skip{position:fixed;top:-100px;left:1rem;z-index:9999;background:var(--ink);color:var(--bone);padding:.75rem 1.25rem;font-size:var(--t-small);letter-spacing:.12em;text-transform:uppercase}
.skip:focus{top:1rem}

.d1{font-family:var(--serif);font-size:var(--t-d1);font-weight:300;line-height:.98;letter-spacing:-.018em}
.d2{font-family:var(--serif);font-size:var(--t-d2);font-weight:300;line-height:1.04;letter-spacing:-.014em}
.d3{font-family:var(--serif);font-size:var(--t-d3);font-weight:400;line-height:1.14;letter-spacing:-.01em}
.lead{font-size:var(--t-lead);line-height:1.62;font-weight:300;color:var(--ink-2);max-width:60ch}
.body p+p{margin-top:1.15em}
.body{color:var(--ink-2);max-width:66ch}
.it{font-family:var(--serif);font-style:italic;font-weight:300}

.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font-size:var(--t-micro);
  letter-spacing:.28em;text-transform:uppercase;font-weight:400;color:var(--ink-3)}
.eyebrow::before{content:"";width:clamp(22px,3vw,46px);height:1px;background:var(--sand);flex:none}
.eyebrow.no-rule::before{display:none}
.num{font-family:var(--serif);font-size:var(--t-small);letter-spacing:.2em;color:var(--muted)}

.btn{--bg:var(--ink);--fg:var(--bone);position:relative;display:inline-flex;align-items:center;
  justify-content:center;gap:.7rem;padding:1.05em 2.2em;background:var(--bg);color:var(--fg);
  font-size:var(--t-small);letter-spacing:.18em;text-transform:uppercase;font-weight:400;
  border-radius:999px;overflow:hidden;isolation:isolate;transition:color .5s var(--e-out)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--aegean);
  transform:translateY(101%);transition:transform .55s var(--e-out)}
.btn:hover::after,.btn:focus-visible::after{transform:translateY(0)}
.btn:hover{color:#fff}
.btn--ghost{--bg:transparent;--fg:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn--ghost:hover{color:#fff}
.btn--light{--bg:var(--bone);--fg:var(--ink)}
.btn--outline-light{--bg:transparent;--fg:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.34)}

.tlink{display:inline-flex;align-items:center;gap:.65rem;position:relative;
  font-size:var(--t-small);letter-spacing:.16em;text-transform:uppercase;padding-block:.35rem}
.tlink::before{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--line)}
.tlink::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--e-out)}
.tlink:hover::after{transform:scaleX(1);transform-origin:left}
.tlink .arw{transition:transform .5s var(--e-out)}
.tlink:hover .arw{transform:translateX(5px)}

.media{position:relative;overflow:hidden;background:var(--bone-3)}
.media>img{width:100%;height:100%;object-fit:cover;display:block}
.r-32{aspect-ratio:3/2}.r-43{aspect-ratio:4/3}.r-11{aspect-ratio:1/1}
.r-34{aspect-ratio:3/4}.r-23{aspect-ratio:2/3}.r-169{aspect-ratio:16/9}
.zoomable>img{transition:transform 1.2s var(--e-out)}
a:hover .zoomable>img,.zoomable:hover>img{transform:scale(1.045)}

/* ---------- 4. SCROLL REVEAL ---------- */
[data-rv]{will-change:transform,opacity}
.js [data-rv="up"]{opacity:0;transform:translateY(34px);transition:opacity 1s var(--e-out),transform 1.1s var(--e-out)}
.js [data-rv="fade"]{opacity:0;transition:opacity 1.2s var(--e-out)}
.js [data-rv="clip"]{clip-path:none}
[data-rv].rv-in{opacity:1!important;transform:none!important;clip-path:inset(0 0 0 0)!important}
.rv-line{display:block;overflow:hidden}
.rv-line>span{display:block;transform:translateY(105%);transition:transform 1.05s var(--e-out)}
.rv-in .rv-line>span,.rv-line.rv-in>span{transform:translateY(0)}
[data-rv-d="1"]{transition-delay:.09s}[data-rv-d="2"]{transition-delay:.18s}
[data-rv-d="3"]{transition-delay:.27s}[data-rv-d="4"]{transition-delay:.36s}
[data-rv-d="5"]{transition-delay:.45s}[data-rv-d="6"]{transition-delay:.54s}
.rv-line:nth-child(2)>span{transition-delay:.08s}
.rv-line:nth-child(3)>span{transition-delay:.16s}
.rv-line:nth-child(4)>span{transition-delay:.24s}
.px{overflow:hidden}
.px>img{will-change:transform;transform:translate3d(0,var(--py,0),0) scale(1.16)}
@media (prefers-reduced-motion:reduce){
  [data-rv],[data-rv].rv-in{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .rv-line>span{transform:none!important;transition:none!important}
  .px>img{transform:none!important}
  .kb{animation:none!important}
}

/* ---------- 5. PRELOADER ---------- */
.pre{position:fixed;inset:0;z-index:9998;background:var(--ink);display:grid;place-items:center;transition:opacity .6s var(--e-out)}
.pre__inner{text-align:center;color:var(--bone)}
.pre__word{font-family:var(--serif);font-size:clamp(2.2rem,6vw,4.6rem);letter-spacing:.24em;font-weight:300;padding-left:.24em}
.pre__bar{margin:1.6rem auto 0;width:min(220px,46vw);height:1px;background:rgba(244,241,234,.2);overflow:hidden}
.pre__bar i{display:block;height:100%;width:100%;background:var(--sand);transform:scaleX(0);transform-origin:left;animation:pl 1.15s var(--e-io) forwards}
@keyframes pl{to{transform:scaleX(1)}}
.pre.is-done{opacity:0;pointer-events:none}

/* ---------- 6. HEADER ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:900;height:var(--hdr);display:flex;align-items:center;
  color:var(--bone);transition:background .5s var(--e-out),color .5s var(--e-out),box-shadow .5s var(--e-out),transform .55s var(--e-out)}
.hdr::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(10,13,14,.55),rgba(10,13,14,0));opacity:1;transition:opacity .5s var(--e-out)}
.hdr__in{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad-x);display:flex;align-items:center;gap:var(--gap)}
.hdr__brand{display:flex;align-items:baseline;gap:.55rem;font-family:var(--serif);font-size:1.32rem;letter-spacing:.3em;text-transform:uppercase;font-weight:400;padding-left:.3em}
.hdr__brand small{font-family:var(--sans);font-size:var(--t-micro);letter-spacing:.24em;opacity:.62;font-weight:300}
.hdr__nav{margin-left:auto;display:flex;align-items:center;gap:clamp(1.1rem,2.3vw,2.4rem)}
.hdr__nav a{position:relative;font-size:var(--t-small);letter-spacing:.15em;text-transform:uppercase;font-weight:300;padding-block:.5rem}
.hdr__nav a::after{content:"";position:absolute;left:0;right:0;bottom:.1rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--e-out)}
.hdr__nav a:hover::after,.hdr__nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.hdr__cta{margin-left:clamp(.6rem,1.6vw,1.4rem)}
.hdr__cta .btn{padding:.85em 1.7em}
.hdr.is-solid{background:var(--bone);color:var(--ink);box-shadow:0 1px 0 var(--line-soft)}
.hdr.is-solid::before{opacity:0}
.hdr.is-solid .btn--outline-light{--fg:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.hdr.is-hidden{transform:translateY(-104%)}
.hdr.is-ink{color:var(--ink)}
.hdr.is-ink::before{opacity:0}
.hdr.is-ink .btn--outline-light{--fg:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}

.burger{display:none;width:44px;height:44px;margin-left:.4rem;position:relative;flex:none}
.burger i{position:absolute;left:11px;width:22px;height:1px;background:currentColor;transition:transform .45s var(--e-out),opacity .3s}
.burger i:nth-child(1){top:19px}.burger i:nth-child(2){top:25px}
.is-open .burger i:nth-child(1){transform:translateY(3px) rotate(45deg)}
.is-open .burger i:nth-child(2){transform:translateY(-3px) rotate(-45deg)}

.drawer{position:fixed;inset:0;z-index:890;background:var(--ink);color:var(--bone);
  display:flex;flex-direction:column;justify-content:center;padding:var(--hdr) var(--pad-x) 3rem;
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--e-out);pointer-events:none}
.drawer.is-open{clip-path:inset(0 0 0 0);pointer-events:auto}
.drawer nav a{display:block;font-family:var(--serif);font-size:clamp(2rem,8vw,3.4rem);font-weight:300;line-height:1.28;opacity:0;transform:translateY(18px);transition:opacity .6s var(--e-out),transform .6s var(--e-out)}
.drawer.is-open nav a{opacity:1;transform:none}
.drawer.is-open nav a:nth-child(1){transition-delay:.16s}
.drawer.is-open nav a:nth-child(2){transition-delay:.22s}
.drawer.is-open nav a:nth-child(3){transition-delay:.28s}
.drawer.is-open nav a:nth-child(4){transition-delay:.34s}
.drawer.is-open nav a:nth-child(5){transition-delay:.40s}
.drawer.is-open nav a:nth-child(6){transition-delay:.46s}
.drawer__foot{margin-top:auto;padding-top:2.5rem;display:flex;flex-wrap:wrap;gap:1.4rem 2.4rem;font-size:var(--t-small);letter-spacing:.1em;color:rgba(244,241,234,.7)}
@media (max-width:1000px){.hdr__nav{display:none}.burger{display:block;margin-left:auto}.hdr__cta{display:none}}

/* ---------- 7. HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:var(--bone);overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img{width:100%;height:100%;object-fit:cover}
.kb{animation:kb 22s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.14) translate3d(-1.2%,-1%,0)}}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(10,13,14,.42) 0%,rgba(10,13,14,.05) 38%,rgba(10,13,14,.72) 100%)}
.hero__in{width:100%;max-width:var(--maxw);margin-inline:auto;padding:0 var(--pad-x) clamp(3rem,7vw,5.5rem)}
.hero__title{font-family:var(--serif);font-size:var(--t-hero);font-weight:300;line-height:.86;letter-spacing:-.03em}
.hero__title em{font-style:italic;color:var(--sand-l)}
.hero__meta{display:flex;flex-wrap:wrap;gap:.9rem 2.6rem;align-items:baseline;margin-top:clamp(1.6rem,3vw,2.6rem);font-size:var(--t-small);letter-spacing:.16em;text-transform:uppercase;color:rgba(244,241,234,.8)}
.hero__sub{max-width:44ch;margin-top:1.4rem;font-size:var(--t-lead);font-weight:300;color:rgba(244,241,234,.9)}
.hero__scroll{position:absolute;right:var(--pad-x);bottom:clamp(3rem,7vw,5.5rem);display:flex;flex-direction:column;align-items:center;gap:.9rem;font-size:var(--t-micro);letter-spacing:.24em;text-transform:uppercase;color:rgba(244,241,234,.72);writing-mode:vertical-rl}
.hero__scroll i{width:1px;height:64px;background:linear-gradient(to bottom,rgba(244,241,234,.6),transparent);position:relative;overflow:hidden}
.hero__scroll i::after{content:"";position:absolute;inset:0;background:var(--sand);animation:sl 2.4s var(--e-io) infinite}
@keyframes sl{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
@media (max-width:760px){.hero__scroll{display:none}}

.phero{position:relative;min-height:clamp(58vh,64vw,78vh);display:flex;align-items:flex-end;color:var(--bone);overflow:hidden;isolation:isolate}
.phero__bg{position:absolute;inset:0;z-index:-2}
.phero__bg img{width:100%;height:100%;object-fit:cover}
.phero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(10,13,14,.5),rgba(10,13,14,.12) 45%,rgba(10,13,14,.66))}
.phero__in{width:100%;max-width:var(--maxw);margin-inline:auto;padding:0 var(--pad-x) clamp(2.6rem,6vw,4.6rem)}
.phero .eyebrow{color:rgba(244,241,234,.78)}
.phero h1{font-family:var(--serif);font-size:var(--t-d1);font-weight:300;line-height:.98;letter-spacing:-.02em;margin-top:1rem}

.crumb{display:flex;flex-wrap:wrap;gap:.5rem;font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);padding-block:1.4rem}
.crumb li+li::before{content:"/";margin-right:.5rem;opacity:.45}
.crumb a:hover{color:var(--ink)}

/* ---------- 8. EDITORIAL ---------- */
.split{display:grid;gap:var(--gap) clamp(2rem,5vw,6rem);grid-template-columns:repeat(12,1fr);align-items:start}
.split>*{min-width:0}
.col-4{grid-column:span 4}.col-5{grid-column:span 5}.col-6{grid-column:span 6}
.col-7{grid-column:span 7}.col-8{grid-column:span 8}.col-12{grid-column:span 12}
.start-7{grid-column:7/13}.start-7-12{grid-column:7/12}.start-9{grid-column:9/13}
@media (max-width:900px){.col-4,.col-5,.col-6,.col-7,.col-8,.start-7,.start-7-12,.start-9{grid-column:span 12}}
.statement{font-family:var(--serif);font-size:clamp(1.7rem,3.35vw,3.15rem);font-weight:300;line-height:1.2;letter-spacing:-.012em;max-width:22ch}
.statement em{font-style:italic;color:var(--aegean)}
.figstack{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}
.figstack .a{grid-column:1/8}
.figstack .b{grid-column:8/13;align-self:end;margin-bottom:clamp(-6rem,-6vw,-2rem)}
@media (max-width:760px){.figstack .a{grid-column:1/11}.figstack .b{grid-column:6/13;margin-bottom:0;margin-top:-18%}}
figcaption{margin-top:.9rem;font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* ---------- 9. FACTS ---------- */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-soft);border-block:1px solid var(--line-soft)}
.facts li{background:var(--bone);padding:clamp(1.8rem,3.4vw,3.2rem) clamp(1rem,2vw,2rem)}
.facts b{display:block;font-family:var(--serif);font-size:clamp(2.4rem,4.6vw,4rem);font-weight:300;line-height:1;letter-spacing:-.02em}
.facts span{display:block;margin-top:.7rem;font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3)}
@media (max-width:760px){.facts{grid-template-columns:repeat(2,1fr)}}

/* ---------- 10. ROOM RAIL ---------- */
.rail{position:relative}
.rail__track{display:flex;gap:clamp(1rem,2.2vw,2rem);overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:var(--pad-x);padding-bottom:1.4rem;scroll-padding-inline:var(--pad-x);scrollbar-width:none;cursor:grab;overscroll-behavior-x:contain}
.rail__track::-webkit-scrollbar{display:none}
.rail__track.is-drag{cursor:grabbing;scroll-snap-type:none}
.rail__track.is-drag a{pointer-events:none}
.card{flex:0 0 clamp(272px,30vw,440px);scroll-snap-align:start;display:block}
.card__meta{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-top:1.1rem;padding-bottom:.9rem;border-bottom:1px solid var(--line-soft)}
.card__name{font-family:var(--serif);font-size:1.42rem;font-weight:400;letter-spacing:-.005em}
.card__tag{font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.card__desc{margin-top:.85rem;font-size:var(--t-small);color:var(--ink-3);line-height:1.65}
.rail__ctrl{display:flex;gap:.6rem;align-items:center}
.rbtn{width:48px;height:48px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;transition:background .4s var(--e-out),color .4s var(--e-out),box-shadow .4s}
.rbtn:hover{background:var(--ink);color:var(--bone);box-shadow:none}
.rbtn[disabled]{opacity:.3;pointer-events:none}
.rail__bar{height:1px;background:var(--line-soft);position:relative;margin-top:1.2rem}
.rail__bar i{position:absolute;left:0;top:0;height:1px;background:var(--ink);width:20%}

/* ---------- 11. AMENITIES ---------- */
.amen{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-soft)}
.amen li{background:var(--bone);padding:clamp(1.6rem,3vw,2.6rem);display:flex;flex-direction:column;gap:.6rem;min-height:clamp(130px,13vw,180px)}
.amen .num{margin-bottom:auto}
.amen h3{font-family:var(--serif);font-size:1.32rem;font-weight:400}
.amen p{font-size:var(--t-small);color:var(--ink-3);line-height:1.6}
@media (max-width:860px){.amen{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.amen{grid-template-columns:1fr}}

/* rezervasyon bolumu — sol sutun bilgi listesi */
.rez__facts{margin-top:2.6rem;border-top:1px solid rgba(244,241,234,.14);list-style:none}
.rez__facts li{display:grid;grid-template-columns:minmax(6.5rem,10rem) 1fr;gap:1.2rem;padding:1.05rem 0;border-bottom:1px solid rgba(244,241,234,.14)}
.rez__facts span{font-family:var(--sans);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,241,234,.5);padding-top:.18rem}
.rez__facts p{font-size:var(--t-small);line-height:1.65;color:rgba(244,241,234,.86)}
.rez__facts a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(244,241,234,.32)}
.rez__facts a:hover{border-bottom-color:rgba(244,241,234,.8)}
@media (max-width:520px){.rez__facts li{grid-template-columns:1fr;gap:.35rem}}

/* ---------- FIYAT ---------- */
.price{display:flex;align-items:baseline;flex-wrap:wrap;gap:.5rem;font-family:var(--sans);margin-top:.9rem}
.price strong{font-family:var(--serif);font-size:1.4rem;font-weight:400;letter-spacing:.01em}
.price s{color:var(--ink-3);font-size:.95rem;text-decoration-thickness:1px}
.price small{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.price__tag{font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;padding:.28em .7em;border:1px solid currentColor;border-radius:2em;color:var(--accent,#b98b5e)}
.price--card{margin-top:.55rem}
.price--card strong{font-size:1.15rem}
.price--room{margin-top:2rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.price--room strong{font-size:1.9rem}
.dark .price s,.dark .price small{color:rgba(244,241,234,.6)}

/* ---------- KUNYE / DAGILIM LISTELERI ---------- */
.keyfacts{list-style:none;margin-top:2.4rem;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line-soft);border:1px solid var(--line-soft)}
.keyfacts li{background:var(--bone);padding:1.15rem 1.2rem;display:flex;flex-direction:column;gap:.25rem}
.keyfacts b{font-family:var(--serif);font-size:1.5rem;font-weight:400;line-height:1}
.keyfacts span{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
.breakdown{list-style:none;margin-top:2.2rem;display:grid;gap:0}
.breakdown li{display:grid;grid-template-columns:3.2rem 1fr;align-items:baseline;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line-soft)}
.breakdown li:first-child{border-top:1px solid var(--line-soft)}
.breakdown b{font-family:var(--serif);font-size:1.25rem;font-weight:400}
.breakdown span{font-size:var(--t-small);color:var(--ink-2,var(--ink-3))}
.mini{margin-top:1.6rem;font-size:var(--t-small);line-height:1.7;color:var(--ink-3);max-width:44ch}
@media (max-width:520px){.keyfacts{grid-template-columns:1fr 1fr}}

/* ---------- 12. DARK ---------- */
.dark{background:var(--ink);color:var(--bone)}
.dark .lead,.dark .body{color:rgba(244,241,234,.78)}
.dark .eyebrow{color:rgba(244,241,234,.66)}
.dark .hr{background:rgba(244,241,234,.14)}
.dark .tlink::before{background:rgba(244,241,234,.24)}
.dark .tlink::after{background:var(--bone)}
.dark .btn--ghost{--fg:var(--bone);box-shadow:inset 0 0 0 1px rgba(244,241,234,.28)}
.dark .facts li{background:var(--ink)}
.dark .facts{background:rgba(244,241,234,.14);border-color:rgba(244,241,234,.14)}
.dark .facts span{color:rgba(244,241,234,.6)}
.dark .amen{background:rgba(244,241,234,.14)}
.dark .amen li{background:var(--ink)}
.dark .amen p{color:rgba(244,241,234,.7)}

/* ---------- 13. QUOTE ---------- */
.quote{max-width:26ch;font-family:var(--serif);font-size:clamp(1.5rem,2.8vw,2.55rem);font-weight:300;font-style:italic;line-height:1.3}
.quote__by{margin-top:1.6rem;font-family:var(--sans);font-style:normal;font-size:var(--t-micro);letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}

/* ---------- 14. GALLERY ---------- */
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}
.gal>*{grid-column:span 4;min-width:0}
.gal>.wide{grid-column:span 8}
.gal>.full{grid-column:span 12}
@media (max-width:760px){.gal>*,.gal>.wide{grid-column:span 6}.gal>.full{grid-column:span 12}}
.lb{position:fixed;inset:0;z-index:950;background:rgba(10,13,14,.96);display:none;place-items:center;padding:clamp(1rem,4vw,3rem)}
.lb.is-open{display:grid}
.lb img{max-width:min(1280px,92vw);max-height:86vh;width:auto;object-fit:contain}
.lb__x,.lb__p,.lb__n{position:absolute;color:var(--bone);width:52px;height:52px;display:grid;place-items:center;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(244,241,234,.24);transition:background .3s}
.lb__x:hover,.lb__p:hover,.lb__n:hover{background:rgba(244,241,234,.14)}
.lb__x{top:clamp(1rem,3vw,2rem);right:clamp(1rem,3vw,2rem)}
.lb__p{left:clamp(1rem,3vw,2rem);top:50%;transform:translateY(-50%)}
.lb__n{right:clamp(1rem,3vw,2rem);top:50%;transform:translateY(-50%)}
.lb__c{position:absolute;bottom:clamp(1rem,3vw,2rem);left:50%;transform:translateX(-50%);color:rgba(244,241,234,.7);font-size:var(--t-micro);letter-spacing:.22em}

/* ---------- 15. ROOM DETAIL ---------- */
.spec{display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(1.5rem,4vw,4rem)}
.spec div{display:flex;justify-content:space-between;gap:1rem;padding-block:.95rem;border-bottom:1px solid var(--line-soft)}
.spec dt{font-size:var(--t-small);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.spec dd{font-size:var(--t-body);text-align:right}
@media (max-width:700px){.spec{grid-template-columns:1fr}}
.chips{display:flex;flex-wrap:wrap;gap:.55rem}
.chips li{max-width:100%;font-size:var(--t-small);letter-spacing:.06em;padding:.5em 1.1em;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-2)}
.bookbox{position:sticky;top:calc(var(--hdr) + 1.6rem);background:var(--bone-2);padding:clamp(1.5rem,2.6vw,2.4rem)}
.bookbox h3{font-family:var(--serif);font-size:1.55rem;font-weight:400}
.bookbox .btn{width:100%;margin-top:1.4rem}
.bookbox ul{margin-top:1.3rem;display:grid;gap:.55rem;font-size:var(--t-small);color:var(--ink-3)}

/* ---------- 16. BOOKING BAR ---------- */
.bookbar{position:fixed;left:50%;bottom:clamp(1rem,2.4vw,2rem);transform:translate(-50%,180%);
  z-index:880;display:flex;align-items:center;gap:1.1rem;background:rgba(20,24,26,.94);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--bone);
  padding:.6rem .6rem .6rem 1.6rem;border-radius:999px;box-shadow:0 18px 50px rgba(10,13,14,.28);
  transition:transform .75s var(--e-out);max-width:calc(100vw - 2rem)}
.bookbar.is-in{transform:translate(-50%,0)}
.bookbar__txt{font-size:var(--t-small);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.bookbar__txt b{font-weight:400;color:var(--sand-l)}
.bookbar .btn{padding:.85em 1.6em;--bg:var(--bone);--fg:var(--ink)}
@media (max-width:640px){.bookbar{padding-left:1.1rem;gap:.7rem;width:calc(100% - 2rem);justify-content:space-between}
  .bookbar__txt{font-size:var(--t-micro);white-space:normal}}

/* ---------- 17. LOCATION ---------- */
.loclist{display:grid;gap:0}
.loclist div{display:flex;justify-content:space-between;gap:1.2rem;padding-block:1.05rem;border-bottom:1px solid var(--line-soft)}
.loclist dt{font-size:var(--t-body);color:var(--ink-2)}
.loclist dd{font-family:var(--serif);font-size:1.2rem;white-space:nowrap}
.dark .loclist div{border-color:rgba(244,241,234,.14)}
.dark .loclist dt{color:rgba(244,241,234,.75)}
.mapframe{width:100%;aspect-ratio:16/10;border:0;filter:grayscale(1) contrast(1.05);background:var(--bone-3)}
@media (max-width:760px){.mapframe{aspect-ratio:4/3}}

/* ---------- 18. FORM ---------- */
.form{display:grid;gap:1.4rem;grid-template-columns:repeat(2,1fr)}
.form>*{min-width:0}
.field{display:flex;flex-direction:column;gap:.5rem}
.field.full{grid-column:span 2}
.field label{font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{font:inherit;width:100%;max-width:100%;min-width:0;font-size:var(--t-body);color:var(--ink);
  background:transparent;border:0;border-bottom:1px solid var(--line);padding:.75rem 0;border-radius:0;
  transition:border-color .4s var(--e-out)}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-bottom-color:var(--ink)}
@media (max-width:640px){.form{grid-template-columns:1fr}.field.full{grid-column:span 1}}

/* ---------- 19. FOOTER ---------- */
.ftr{background:var(--ink);color:var(--bone);padding-top:clamp(4rem,8vw,7rem)}
.ftr a:hover{color:var(--sand-l)}
.ftr__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:clamp(2rem,4vw,4rem)}
.ftr__brand{font-family:var(--serif);font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:300;letter-spacing:.18em;text-transform:uppercase;line-height:1.15}
.ftr h4{font-size:var(--t-micro);letter-spacing:.24em;text-transform:uppercase;color:rgba(244,241,234,.55);font-weight:400;margin-bottom:1.15rem}
.ftr li+li{margin-top:.6rem}
.ftr li,.ftr p{font-size:var(--t-small);color:rgba(244,241,234,.82);line-height:1.75}
.ftr__bot{margin-top:clamp(3rem,6vw,5rem);border-top:1px solid rgba(244,241,234,.14);padding-block:1.6rem;display:flex;flex-wrap:wrap;gap:.7rem 2rem;justify-content:space-between;font-size:var(--t-micro);letter-spacing:.14em;color:rgba(244,241,234,.5);text-transform:uppercase}
@media (max-width:900px){.ftr__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.ftr__grid{grid-template-columns:1fr}}

/* ---------- 20. MISC ---------- */
.marq{overflow:hidden;border-block:1px solid var(--line-soft);padding-block:clamp(1rem,1.8vw,1.6rem)}
.marq__in{display:flex;width:max-content;animation:mq 40s linear infinite}
.marq span{font-family:var(--serif);font-size:clamp(1.1rem,1.9vw,1.7rem);font-weight:300;color:var(--ink-3);white-space:nowrap;display:flex;align-items:center;gap:3.5rem;padding-right:3.5rem}
.marq span::after{content:"◦";color:var(--sand)}
@keyframes mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marq__in{animation:none}}
.note{font-size:var(--t-small);color:var(--muted);letter-spacing:.02em}
.tag{display:inline-block;font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--aegean);padding:.4em .9em;background:rgba(60,95,115,.09);border-radius:999px}

/* overflow guards */
.wrap,.split,.gal,.amen,.facts{max-width:100%}
.bookbar{max-width:calc(100% - 2rem)}
.spec dd{overflow-wrap:anywhere}

/* gallery-embedded cards */
.gal .card{flex:none;width:100%}
@media (max-width:560px){
  .gal>*,.gal>.wide{grid-column:span 12}
  .card__meta{flex-direction:column;align-items:flex-start;gap:.25rem}
  .card__tag{white-space:normal}
}

/* ============================================================
   v2 — cinematic layer
   ============================================================ */

/* scroll progress */
.prog{position:fixed;top:0;left:0;right:0;height:2px;z-index:940;background:transparent;pointer-events:none}
.prog i{display:block;height:100%;width:100%;background:var(--sand);transform:scaleX(0);transform-origin:left;transition:transform .12s linear}

/* hero slideshow */
.hero__slides{position:absolute;inset:0}
.hero__slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.6s var(--e-out)}
.hero__slides img.is-on{opacity:1}
.hero__dots{position:absolute;left:var(--pad-x);bottom:clamp(1.4rem,2.6vw,2.2rem);display:flex;gap:.55rem;z-index:2}
.hero__dots button{width:34px;height:2px;background:rgba(244,241,234,.32);position:relative;overflow:hidden;border-radius:2px}
.hero__dots button i{position:absolute;inset:0;background:var(--bone);transform:scaleX(0);transform-origin:left}
.hero__dots button[aria-current="true"] i{animation:dot 6s linear forwards}
@keyframes dot{to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.hero__dots button[aria-current="true"] i{animation:none;transform:scaleX(1)}}

/* vertical reservation tab (desktop) */
.sidebook{position:fixed;right:0;top:50%;transform:translate(100%,-50%);z-index:870;
  writing-mode:vertical-rl;background:var(--ink);color:var(--bone);
  padding:1.5rem .95rem;font-size:var(--t-micro);letter-spacing:.26em;text-transform:uppercase;
  border-radius:6px 0 0 6px;transition:transform .6s var(--e-out),background .4s}
.sidebook.is-in{transform:translate(0,-50%)}
.sidebook:hover{background:var(--aegean)}
@media (max-width:1100px){.sidebook{display:none}}

/* room gallery: stage + thumbs */
.gstage{position:relative;width:100%;background:var(--bone-3);aspect-ratio:16/10;max-height:78vh;overflow:hidden;cursor:zoom-in}
@media (max-width:700px){.gstage{aspect-ratio:4/3}}
.gstage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s var(--e-out)}
.gstage img.is-on{opacity:1}
.gnav{position:absolute;inset:auto 0 0 0;display:flex;justify-content:space-between;align-items:flex-end;padding:clamp(.8rem,1.6vw,1.4rem);pointer-events:none}
.gnav button{pointer-events:auto;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:rgba(20,24,26,.55);color:var(--bone);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .3s}
.gnav button:hover{background:var(--ink)}
.gcount{pointer-events:none;color:var(--bone);text-shadow:0 1px 8px rgba(10,13,14,.7);font-size:var(--t-micro);letter-spacing:.22em;align-self:flex-end;padding-bottom:1rem}
.gthumbs{display:flex;gap:.55rem;overflow-x:auto;margin-top:.7rem;scrollbar-width:none;padding-bottom:.3rem}
.gthumbs::-webkit-scrollbar{display:none}
.gthumbs button{flex:0 0 clamp(72px,9vw,112px);aspect-ratio:4/3;overflow:hidden;opacity:.42;transition:opacity .4s var(--e-out)}
.gthumbs button img{width:100%;height:100%;object-fit:cover}
.gthumbs button[aria-current="true"],.gthumbs button:hover{opacity:1}

/* photo strip */
.strip__track{display:flex;gap:clamp(.7rem,1.4vw,1.2rem);overflow-x:auto;padding-inline:var(--pad-x);scrollbar-width:none;scroll-snap-type:x proximity;scroll-padding-inline:var(--pad-x);cursor:grab}
.strip__track::-webkit-scrollbar{display:none}
.strip__track.is-drag{cursor:grabbing}
.strip__track figure{flex:0 0 clamp(230px,26vw,380px);scroll-snap-align:start;margin:0}
.strip__track figure:nth-child(odd){margin-top:clamp(1rem,3vw,3rem)}

/* magnetic-ish button press */
.btn:active{transform:scale(.98)}

/* section index number */
.sidx{font-family:var(--serif);font-size:var(--t-micro);letter-spacing:.24em;color:var(--muted)}

/* nicer focus ring on dark */
.dark :focus-visible,.hero :focus-visible,.phero :focus-visible{outline-color:var(--sand-l)}

@media (min-width:1101px){.bookbar{display:none}}

/* ============================================================
   v3 — bolder
   ============================================================ */

/* film grain */
.grain{position:fixed;inset:-120px;z-index:930;pointer-events:none;opacity:.05;
  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='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 7s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-6%,4%)}40%{transform:translate(4%,-6%)}60%{transform:translate(-4%,-4%)}80%{transform:translate(6%,6%)}100%{transform:translate(0,0)}}
@media (prefers-reduced-motion:reduce){.grain{animation:none;opacity:.035}}

/* page curtain transition */
.curtain{position:fixed;inset:0;z-index:960;background:var(--ink);transform:translateY(100%);pointer-events:none}
.curtain.is-up{transform:translateY(0);transition:transform .55s var(--e-io)}
.curtain.is-down{transform:translateY(-100%);transition:transform .6s var(--e-out)}

/* oversized outline heading */
.mega{font-family:var(--serif);font-weight:300;line-height:.84;letter-spacing:-.035em;
  font-size:clamp(3rem,13vw,13rem);margin:0}
.mega em{font-style:italic;color:var(--sand)}
.mega .out{-webkit-text-stroke:1px var(--line);color:transparent}
.dark .mega .out{-webkit-text-stroke:1px rgba(244,241,234,.35)}

/* pinned showcase */
.pin{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.pin__media{position:sticky;top:calc(var(--hdr) + 2rem);aspect-ratio:4/5;overflow:hidden;background:var(--bone-3)}
.pin__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);
  transition:opacity 1s var(--e-out),transform 1.6s var(--e-out)}
.pin__media img.is-on{opacity:1;transform:scale(1)}
.pin__list li{padding-block:clamp(1.5rem,3vw,2.8rem);border-bottom:1px solid var(--line-soft)}
.pin__list li:first-child{padding-top:0}
.pin__list h3{font-family:var(--serif);font-size:clamp(1.8rem,3.4vw,3rem);font-weight:300;line-height:1.05;
  color:var(--muted);transition:color .6s var(--e-out)}
.pin__list li.is-active h3{color:var(--ink)}
.pin__list p{margin-top:.8rem;font-size:var(--t-small);color:var(--ink-3);max-width:38ch}
.pin__list .tlink{margin-top:1.2rem}
@media (max-width:900px){
  .pin{grid-template-columns:1fr}
  .pin__media{position:relative;top:0;aspect-ratio:3/2;order:-1;margin-bottom:1.5rem}
  .pin__list li{padding-block:1.8rem}
}

/* partners / acenteler */
.agents{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--line-soft);border-block:1px solid var(--line-soft)}
.agents a{background:var(--bone);display:grid;place-items:center;padding:clamp(1.1rem,2.2vw,1.9rem) 1rem;
  color:var(--ink-3);transition:color .4s var(--e-out),background .4s var(--e-out)}
.agents a:hover{color:var(--ink);background:var(--bone-2)}
.agents img{width:clamp(96px,10vw,148px);height:auto;opacity:.85;transition:opacity .4s}
.agents a:hover img{opacity:1}
.dark .agents,.ftr .agents{background:rgba(244,241,234,.14);border-color:rgba(244,241,234,.14)}
.dark .agents a,.ftr .agents a{background:var(--ink);color:rgba(244,241,234,.72)}
.dark .agents a:hover,.ftr .agents a:hover{background:#1b2022;color:var(--bone)}
@media (max-width:900px){.agents{grid-template-columns:repeat(3,1fr)}}
@media (max-width:480px){.agents{grid-template-columns:repeat(2,1fr)}}

/* auth / panel */
.panel{background:var(--bone-2);padding:clamp(1.6rem,3vw,2.8rem)}
.panel h2{font-family:var(--serif);font-size:clamp(1.5rem,2.4vw,2.1rem);font-weight:400}
.msg{padding:.9rem 1.1rem;font-size:var(--t-small);border-left:2px solid var(--aegean);background:rgba(60,95,115,.08);margin-bottom:1.4rem}
.msg.err{border-color:#9b3f3f;background:rgba(155,63,63,.08)}
.msg.ok{border-color:#3f7d55;background:rgba(63,125,85,.08)}
.tbl{width:100%;border-collapse:collapse;font-size:var(--t-small)}
.tbl th,.tbl td{text-align:left;padding:.8rem .7rem;border-bottom:1px solid var(--line-soft);vertical-align:top}
.tbl th{font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:400;white-space:nowrap}
.tblwrap{overflow-x:auto}
.pill{display:inline-block;font-size:var(--t-micro);letter-spacing:.1em;text-transform:uppercase;padding:.3em .8em;border-radius:999px;background:var(--bone-3)}
.authnav{display:flex;gap:1.4rem;flex-wrap:wrap;font-size:var(--t-small)}

/* dark bölümlerde form ve acente düzeltmeleri */
.dark .field label{color:rgba(244,241,234,.6)}
.dark .field input,.dark .field select,.dark .field textarea{color:var(--bone);border-bottom-color:rgba(244,241,234,.26)}
.dark .field input:focus,.dark .field select:focus,.dark .field textarea:focus{border-bottom-color:var(--sand)}
.dark .field select option{color:var(--ink);background:var(--bone)}
.dark .field input::placeholder,.dark .field textarea::placeholder{color:rgba(244,241,234,.4)}
.dark .form .btn{--bg:var(--bone);--fg:var(--ink)}
.dark .note{color:rgba(244,241,234,.6)}
.dark .msg{background:rgba(244,241,234,.08);border-color:var(--sand)}
.dark input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1) opacity(.7)}
.dark .agents a,.ftr .agents a{background:#171b1d;color:rgba(244,241,234,.78)}
.dark .agents a:hover,.ftr .agents a:hover{background:#20262a;color:var(--bone)}
.dark .agents,.ftr .agents{background:rgba(244,241,234,.16);border-color:rgba(244,241,234,.16)}