/* ============================================================
   NIGHTOVA v2 — villa.html sayfa katmanı
   ------------------------------------------------------------
   Paylaşılan tasarım sistemi style.css'ten gelir (token'lar,
   header/footer, .btn, .reveal, .trust...). Burada yalnızca bu
   sayfaya özgü bölümler var: detail-hero, spec bandı, sahne,
   galeri, içerik + rezervasyon kartı, lightbox.
   ============================================================ */

/* ---------- Nav: aktif sayfa işareti ---------- */
.site-nav a.active{color:var(--text);}
.site-nav a.active::after{right:0;}
.footer-col ul a[aria-current="page"]{color:var(--gold-2);}

/* ---------- Detail hero ---------- */
.hero--detail{min-height:min(88svh, 820px);}
.hero--detail .hero-inner{
  padding-bottom:clamp(3.2rem, 8vh, 5.2rem);
}
.hero--detail h1{
  font-size:clamp(2.6rem, 7vw, 4.7rem);
}
.hero--detail .hero-lead{max-width:56ch;}

/* Breadcrumb — sessiz, tipografik */
.crumbs{
  display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;
  margin-bottom:1.4rem;
  font-size:.62rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);
}
.crumbs a{
  display:inline-block;padding:.3rem 0;
  color:var(--text-2);
  transition:color .3s;
}
.crumbs a:hover{color:var(--gold-2);}
.crumbs .sep{color:var(--gold-dim);}
.crumbs .here{color:var(--gold);}

/* Villa nişanı — tek küçük fleuron, ışıltısız */
.villa-crest{
  font-size:1.3rem;line-height:1;
  color:var(--gold-2);
  opacity:.9;
  margin-bottom:1rem;
}

/* ---------- Spec bandı (5 kalem) ---------- */
.spec-band{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:1.5rem .8rem;
  max-width:1160px;margin:0 auto;
  padding:2rem var(--gutter);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.spec{position:relative;text-align:center;padding:.3rem .4rem;}
.spec .num{
  display:block;
  font-family:var(--serif);
  font-size:clamp(1.35rem, 3vw, 1.9rem);
  font-weight:500;letter-spacing:.02em;
  color:var(--gold-2);
}
.spec .label{
  display:block;margin-top:.45rem;
  font-size:.58rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);
}
.spec-band .spec:nth-child(5){grid-column:1 / -1;}
@media (min-width:820px){
  .spec-band{grid-template-columns:repeat(5,1fr);gap:0;padding:2.4rem var(--gutter);}
  .spec-band .spec:nth-child(5){grid-column:auto;}
  .spec + .spec::before{
    content:"";position:absolute;left:0;top:15%;bottom:15%;
    width:1px;background:var(--line);
  }
  html[dir="rtl"] .spec + .spec::before{left:auto;right:0;}
}

/* ---------- Sahne: havuz başında geceler ---------- */
.stage{
  position:relative;overflow:hidden;
  background:var(--bg-0);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.stage > img{
  width:100%;
  height:clamp(430px, 72vh, 640px);
  object-fit:cover;object-position:center 58%;
}
.stage-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top, rgba(7,8,12,.9) 0%, rgba(7,8,12,.42) 44%, rgba(7,8,12,.22) 100%);
}
.stage-caption{
  position:absolute;left:0;right:0;bottom:0;
  max-width:1160px;margin:0 auto;
  padding:0 var(--gutter) clamp(2.2rem, 5vw, 3.4rem);
}
.stage-caption h3{
  margin-top:.9rem;
  font-size:clamp(1.7rem, 4.2vw, 2.7rem);
  text-wrap:balance;
}
.stage-caption p{
  margin-top:.85rem;
  max-width:52ch;
  font-size:.92rem;font-weight:300;
  line-height:1.85;
  color:var(--text-2);
}

/* ---------- Galeri — doğal oranlı editöryel mozaik ---------- */
.gallery{
  columns:2;
  column-gap:clamp(.8rem, 2vw, 1.4rem);
}
@media (min-width:900px){ .gallery{columns:3;} }
.gallery .shot{
  display:block;width:100%;
  margin:0 0 clamp(.8rem, 2vw, 1.4rem);
  padding:0;
  break-inside:avoid;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  overflow:hidden;
  background:var(--bg-2);
  cursor:zoom-in;
  transition:border-color .35s, box-shadow .5s var(--ease);
}
.gallery .shot:hover{
  border-color:var(--gold-dim);
  box-shadow:var(--shadow-1);
}
.gallery .shot img{
  width:100%;height:auto;
  transition:transform 1.1s var(--ease);
}
.gallery .shot:hover img{transform:scale(1.03);}

/* ---------- İçerik + rezervasyon kartı ---------- */
.villa-detail-grid{
  display:grid;grid-template-columns:1fr;
  gap:clamp(2.6rem, 6vw, 4rem);
}
@media (min-width:960px){
  .villa-detail-grid{grid-template-columns:1.55fr .95fr;align-items:start;}
}

.detail-copy .block + .block{margin-top:clamp(2.4rem, 5vw, 3.2rem);}
.detail-copy h3{
  font-size:clamp(1.5rem, 3.2vw, 2rem);
  text-wrap:balance;
}
.detail-copy .rule--left{margin:1rem 0 0;}
.detail-copy p{
  margin-top:1.05rem;
  font-size:.95rem;font-weight:300;
  line-height:1.9;
  color:var(--text-2);
}
/* Zarif gömme baş harf — yalnız ilk paragraf */
.detail-copy .dropcap::first-letter{
  font-family:var(--serif);
  float:left;
  font-size:3em;line-height:.85;
  padding:.05em .16em 0 0;
  color:var(--gold-2);
}
html[dir="rtl"] .detail-copy .dropcap::first-letter{
  float:right;
  padding:.05em 0 0 .16em;
}

.amenities{list-style:none;margin-top:1.1rem;}
.amenities li{
  position:relative;
  padding:.6rem 0 .6rem 2rem;
  font-size:.92rem;font-weight:300;
  line-height:1.7;
  color:var(--text-2);
  border-bottom:1px solid var(--line);
}
.amenities li:last-child{border-bottom:none;}
.amenities li::before{
  content:"";position:absolute;left:0;top:1.35em;
  width:18px;height:1px;
  background:var(--gold);
}
html[dir="rtl"] .amenities li{padding:.6rem 2rem .6rem 0;}
html[dir="rtl"] .amenities li::before{left:auto;right:0;}

/* Rezervasyon kartı — mühürlü davetiye */
.book-card{
  position:relative;
  position:sticky;top:104px;
  background:linear-gradient(180deg, var(--bg-3), var(--bg-2));
  border:1px solid var(--gold-dim);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-1);
}
.book-card::after{
  content:"";position:absolute;inset:8px;z-index:2;
  border:1px solid var(--gold-faint);
  border-radius:calc(var(--radius) - 6px);
  pointer-events:none;
}
.book-card figure{
  aspect-ratio:3/2;overflow:hidden;
}
.book-card figure img{
  width:100%;height:100%;
  object-fit:cover;object-position:center 60%;
}
.book-body{
  padding:1.7rem 1.6rem 1.9rem;
  text-align:center;
}
.book-price{
  font-family:var(--serif);
  font-size:2.3rem;font-weight:500;
  color:var(--gold-2);
  letter-spacing:.01em;
}
.book-price small{
  font-family:var(--sans);
  font-size:.7rem;font-weight:500;
  letter-spacing:.08em;
  color:var(--muted);
}
.book-body h4{
  margin-top:.85rem;
  font-size:1.35rem;font-weight:500;
}
.book-body p{
  margin-top:.55rem;
  font-size:.88rem;font-weight:300;
  line-height:1.75;
  color:var(--text-2);
}
.book-body .btn{margin-top:1.35rem;width:100%;}

/* ---------- Diğer hizmetler ---------- */
.related-links{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:.8rem;
}
.related-links a{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;
  padding:.7rem 1.5rem;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:rgba(255,255,255,.03);
  font-size:.72rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--text-2);
  transition:border-color .3s, color .3s, transform .35s var(--ease);
}
.related-links a:hover{
  border-color:var(--gold-dim);
  color:var(--gold-2);
  transform:translateY(-2px);
}

/* ---------- Lightbox ---------- */
.lightbox{
  position:fixed;inset:0;z-index:200;
  display:flex;align-items:center;justify-content:center;
  padding:1.2rem;
  background:rgba(4,5,8,.93);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  cursor:zoom-out;
}
.lightbox[hidden]{display:none;}
.lightbox img{
  max-width:94vw;max-height:88vh;
  width:auto;height:auto;
  border:1px solid var(--line-strong);
  border-radius:var(--radius-sm);
  box-shadow:var(--shadow-2);
}