/* ============ Kemerburgaz — stil ============ */
:root{
  --bg:#0e1a13;
  --bg-2:#13231a;
  --cream:#f3eee4;
  --cream-2:#e6dfd0;
  --ink:#141a16;
  --mute:#9aa79e;
  --gold:#c3a673;
  --line:rgba(243,238,228,.14);
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gutter:clamp(16px,5vw,80px);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{
  background:var(--bg);color:var(--cream);
  font-family:var(--sans);font-weight:300;font-size:clamp(15px,1.05vw,17px);line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip;
}
body.menu-open,html.lenis.lenis-stopped{overflow:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-.01em}
h2{font-size:clamp(34px,4.6vw,68px)}
h3{font-size:clamp(26px,2.6vw,38px);margin-bottom:.5em}
.eyebrow{
  font-family:var(--sans);font-size:11px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--gold);font-weight:500;margin-bottom:18px;
}
.lead{font-size:clamp(16px,1.25vw,20px);line-height:1.6;color:var(--cream-2);max-width:48ch}
figure{margin:0}
figure img{width:100%;aspect-ratio:16/9;object-fit:cover}

/* ---------- butonlar ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 28px;border-radius:999px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:500;border:1px solid transparent;transition:transform .5s var(--ease),background .4s,color .4s,border-color .4s;
  cursor:pointer;font-family:var(--sans);
}
.btn:hover{transform:translateY(-2px)}
.btn--light{background:var(--cream);color:var(--ink)}
.btn--light:hover{background:#fff}
.btn--ghost{border-color:rgba(243,238,228,.5);color:var(--cream)}
.btn--ghost:hover{border-color:var(--cream);background:rgba(243,238,228,.08)}
.btn--dark{background:var(--ink);color:var(--cream)}
.btn--dark:hover{background:#000}

/* ---------- loader ---------- */
.loader{
  position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:22px;transition:opacity .8s var(--ease),visibility .8s;
}
.loader.is-done{opacity:0;visibility:hidden}
.loader__mark{font-family:var(--sans);letter-spacing:.42em;font-size:13px;font-weight:500;color:var(--cream);padding-left:.42em}
.loader__bar{width:160px;height:1px;background:var(--line);overflow:hidden}
.loader__bar span{display:block;height:100%;width:0;background:var(--gold);transition:width .3s}

/* ---------- nav ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;height:84px;padding:0 var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:30px;
  transition:background .5s,backdrop-filter .5s,height .5s;
}
.nav.is-solid{background:rgba(14,26,19,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);height:68px;border-bottom:1px solid var(--line)}
.nav__logo{font-family:var(--sans);font-weight:600;letter-spacing:.36em;font-size:13px;padding-left:.36em}
.nav__links{display:flex;gap:30px}
.nav__links a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;opacity:.8;position:relative;padding:6px 0;transition:opacity .3s}
.nav__links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.nav__links a:hover{opacity:1}
.nav__links a:hover::after{transform:scaleX(1)}
.nav__cta{font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:11px 20px;border:1px solid rgba(243,238,228,.4);border-radius:999px;transition:background .4s,border-color .4s}
.nav__cta:hover{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.nav__burger{display:none;width:44px;height:44px;background:none;border:0;cursor:pointer;position:relative}
.nav__burger span{position:absolute;left:10px;right:10px;height:1.5px;background:var(--cream);transition:transform .4s var(--ease),top .4s var(--ease)}
.nav__burger span:first-child{top:17px}
.nav__burger span:last-child{top:26px}
.nav__burger.is-open span:first-child{top:21px;transform:rotate(45deg)}
.nav__burger.is-open span:last-child{top:21px;transform:rotate(-45deg)}

.mobile-menu{
  position:fixed;inset:0;z-index:45;background:var(--bg);display:flex;flex-direction:column;justify-content:center;justify-content:safe center;
  padding:90px var(--gutter) 30px;gap:8px;opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s;overflow-y:auto;
}
@media (min-width:1101px){.mobile-menu{display:none}}
.mobile-menu.is-open{opacity:1;visibility:visible}
.mobile-menu a{font-family:var(--serif);font-size:40px;padding:8px 0;border-bottom:1px solid var(--line)}
.mobile-menu__cta{font-family:var(--sans)!important;font-size:13px!important;letter-spacing:.2em;text-transform:uppercase;border:0!important;margin-top:20px;color:var(--gold)}

/* ---------- açılış: kaydırmalı sahne dizisi ---------- */
.hs{position:relative;height:1000vh}
.hs__pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#07100b}
.hs__canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hs__fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.hs__shade{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(to top,rgba(7,16,11,.72) 0%,rgba(7,16,11,.18) 38%,rgba(7,16,11,0) 70%),
  linear-gradient(to right,rgba(7,16,11,.42),transparent 48%)}
.hs__canvas{image-rendering:auto}
.hs__chapters{position:absolute;inset:0}
.hs__ch{
  position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(90px,16vh,170px);max-width:640px;
  opacity:0;transform:translateY(26px);pointer-events:none;
  transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.hs__ch.is-active{opacity:1;transform:none;pointer-events:auto}
.hs__ch h1{font-size:clamp(42px,6.6vw,104px);font-weight:300;line-height:.98;margin-bottom:28px}
.hs__ch h2{margin-bottom:18px}
.hs__ch p:last-child{color:var(--cream-2);max-width:46ch;font-size:clamp(15px,1.15vw,18px)}
.hs__actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.hs__ch--brand{left:0;right:0;bottom:auto;top:50%;transform:translateY(-50%) translateY(26px);max-width:none;text-align:center}
.hs__ch--brand.is-active{transform:translateY(-50%)}
.hs__wordmark{font-family:var(--serif);font-weight:300;font-size:clamp(56px,11vw,180px);line-height:1;letter-spacing:.02em}
.hs__ch--brand .hs__tag{font-family:var(--serif);font-style:italic;font-size:clamp(18px,2vw,30px);color:var(--cream-2);margin:10px auto 0;max-width:none}
.hs__dist{list-style:none;display:flex;gap:36px;flex-wrap:wrap;margin-top:8px}
.hs__dist li{display:flex;flex-direction:column;gap:4px;border-left:1px solid var(--line);padding-left:16px}
.hs__dist strong{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,42px);line-height:1}
.hs__dist span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.hs__hint{position:absolute;left:var(--gutter);bottom:30px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);display:flex;align-items:center;gap:12px;transition:opacity .5s}
.hs__hint span{display:block;width:40px;height:1px;background:var(--mute);position:relative;overflow:hidden}
.hs__hint span::after{content:"";position:absolute;inset:0;background:var(--cream);transform:translateX(-100%);animation:scrollhint 2.2s var(--ease) infinite}
.hs.is-scrolled .hs__hint{opacity:0}
@keyframes scrollhint{0%{transform:translateX(-100%)}60%{transform:translateX(100%)}100%{transform:translateX(100%)}}
.hs__progress{position:absolute;right:var(--gutter);bottom:30px;display:flex;align-items:center;gap:14px}
.hs__step{font-family:var(--serif);font-size:16px;letter-spacing:.1em;color:var(--cream-2);min-width:62px;text-align:right}
.hs__bar{width:clamp(90px,12vw,180px);height:1px;background:var(--line)}
.hs__bar span{display:block;height:100%;width:0;background:var(--gold)}

/* ---------- konum ---------- */
.konum{position:relative;min-height:100vh;display:grid;grid-template-columns:1fr;overflow:hidden}
.konum__map{position:absolute;inset:0}
.konum__map img{width:100%;height:120%;object-fit:cover;will-change:transform}
.konum__map::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(14,26,19,.92) 0%,rgba(14,26,19,.7) 40%,rgba(14,26,19,.15) 100%)}
.konum__panel{position:relative;z-index:2;padding:clamp(100px,14vh,180px) var(--gutter);max-width:640px}
.konum__panel h2{margin-bottom:22px}
.distances{list-style:none;margin-top:40px;border-top:1px solid var(--line)}
.distances li{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.distances li span{font-size:14px;letter-spacing:.06em;color:var(--cream-2)}
.distances li strong{font-family:var(--serif);font-size:24px;font-weight:400;white-space:nowrap}

/* ---------- konsept ---------- */
.section-head{padding:clamp(100px,14vh,180px) var(--gutter) clamp(50px,7vh,90px);max-width:900px}
.section-head--center{margin:0 auto;text-align:center}
.konsept{background:var(--bg-2)}
.row{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,90px);align-items:center;padding:clamp(30px,5vh,70px) var(--gutter)}
.row--rev .row__media{order:2}
.row__media{overflow:hidden;border-radius:4px}
.row__media img{transform:scale(1.06);will-change:transform}
.row__text{max-width:520px}
.row__text p{color:var(--cream-2);margin-bottom:1em}
.num{display:block;font-family:var(--serif);color:var(--gold);font-size:20px;letter-spacing:.1em;margin-bottom:10px}

/* ---------- kulüp ---------- */
.kulup{padding:clamp(100px,14vh,180px) var(--gutter)}
.kulup__intro{max-width:760px;margin-bottom:clamp(40px,6vh,80px)}
.kulup__intro h2{margin-bottom:22px}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.chips li{font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:10px 16px;border:1px solid var(--line);border-radius:999px;color:var(--cream-2)}
.gallery{display:grid;grid-template-columns:repeat(10,1fr);grid-auto-rows:minmax(160px,auto);gap:14px}
.gallery__item{overflow:hidden;border-radius:4px}
.gallery__item img{height:100%;aspect-ratio:auto;transform:scale(1.06);transition:transform 1.2s var(--ease)}
.gallery__item:hover img{transform:scale(1)}
.g1{grid-column:1/7;grid-row:1/3}.g2{grid-column:7/11}.g3{grid-column:7/11}
.g4{grid-column:1/5;grid-row:3/5}.g5{grid-column:5/8;grid-row:3/5}.g6{grid-column:8/11;grid-row:3/5}
.kulup__note{max-width:720px;margin:clamp(40px,6vh,80px) auto 0;font-family:var(--serif);font-size:clamp(20px,1.8vw,26px);line-height:1.4;text-align:center;color:var(--cream-2)}

/* ---------- rekreasyon ---------- */
.bleed{position:relative;height:120vh;min-height:640px;overflow:hidden;display:flex;align-items:center}
.bleed img{position:absolute;inset:0;width:100%;height:130%;object-fit:cover;top:-15%;will-change:transform}
.bleed::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(14,26,19,.85),rgba(14,26,19,.2) 60%,transparent)}
.bleed__text{position:relative;z-index:2;padding:0 var(--gutter);max-width:620px}
.bleed__text h2{margin-bottom:20px}
.bleed__text p:last-child{color:var(--cream-2);max-width:48ch}
.rek__duo{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px var(--gutter) clamp(100px,14vh,180px)}
.rek__duo figure{overflow:hidden;border-radius:4px}
.rek__duo figcaption{font-family:var(--serif);font-size:20px;padding:16px 0 0;color:var(--cream-2)}

/* ---------- konut ---------- */
.konut{background:var(--bg-2);padding-bottom:clamp(100px,14vh,180px)}
.konut__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:0 var(--gutter)}
.konut__big{grid-column:1/3}
.konut__big img{height:100%;aspect-ratio:auto;min-height:0}
.konut__grid figure{overflow:hidden;border-radius:4px}
.konut__facts{display:flex;flex-direction:column;justify-content:space-between;gap:14px}
.konut__facts div{flex:1;border:1px solid var(--line);border-radius:4px;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px}
.konut__facts strong{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.8vw,44px);line-height:1}
.konut__facts span{font-size:13px;color:var(--mute);letter-spacing:.04em}

/* ---------- park (yatay) ---------- */
.park{position:relative}
.park__pin{height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:clamp(24px,4vh,48px);padding:90px 0 40px}
.park__head{padding:0 var(--gutter);max-width:900px}
.park__track{display:flex;gap:18px;padding:0 var(--gutter);width:max-content;will-change:transform}
.park__track figure{width:clamp(300px,52vw,760px);flex:none;overflow:hidden;border-radius:4px}
.park__track figcaption{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);padding-top:12px}

/* ---------- yaşam ---------- */
.yasam{padding:0 var(--gutter) clamp(100px,14vh,180px)}
.yasam__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.yasam__grid figure{overflow:hidden;border-radius:4px}
.yasam__grid img{aspect-ratio:4/3;transform:scale(1.06);transition:transform 1.2s var(--ease)}
.yasam__grid figure:hover img{transform:scale(1)}

/* ---------- iletişim ---------- */
.iletisim{display:grid;grid-template-columns:1fr 1fr;background:var(--cream);color:var(--ink)}
.iletisim__media{position:relative;overflow:hidden;min-height:420px}
.iletisim__media img{position:absolute;inset:0;width:100%;height:120%;object-fit:cover;top:-10%;will-change:transform}
.iletisim__panel{padding:clamp(70px,10vh,140px) var(--gutter)}
.iletisim__panel .eyebrow{color:#7a6238}
.iletisim__panel h2{margin-bottom:18px}
.iletisim__panel .lead{color:#4e564f;margin-bottom:36px}
.form{display:flex;flex-direction:column;gap:18px;max-width:520px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form label{display:flex;flex-direction:column;gap:6px}
.form label span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#525a54}
.form input,.form textarea{
  font:inherit;font-size:16px;padding:12px 0;border:0;border-bottom:1px solid rgba(20,26,22,.3);background:transparent;color:var(--ink);
  border-radius:0;outline:none;transition:border-color .3s;
}
.form input:focus,.form textarea:focus{border-bottom-color:var(--ink)}
.form input:focus-visible,.form textarea:focus-visible{box-shadow:0 2px 0 0 var(--ink)}
.form .check input.is-invalid{outline:2px solid #b3261e;outline-offset:2px}
.form .check input:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.form input.is-invalid,.form textarea.is-invalid{border-bottom-color:#b3261e}
.form textarea{resize:vertical;min-height:70px}
.form .check{flex-direction:row;align-items:flex-start;gap:12px;font-size:13px;color:#4e564f;line-height:1.5}
.form .check input{width:16px;height:16px;margin-top:3px;accent-color:var(--ink)}
.form .check span{font-size:13px;letter-spacing:0;text-transform:none;color:#3f463f}
.form button{align-self:flex-start;margin-top:8px}
.form__msg{font-size:14px;min-height:1.4em;color:#2d5a3a}
.form__msg.is-error{color:#b3261e}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}

/* ---------- footer ---------- */
.footer{padding:clamp(60px,8vh,100px) var(--gutter) 30px;border-top:1px solid var(--line)}
.footer__top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;padding-bottom:40px;border-bottom:1px solid var(--line)}
.footer__brand{font-family:var(--sans);font-weight:600;letter-spacing:.42em;font-size:clamp(22px,4vw,48px)}
.footer__tag{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--cream-2)}
.footer__bottom{display:flex;flex-wrap:wrap;gap:12px 30px;padding-top:22px;font-size:12px;color:var(--mute);letter-spacing:.04em}

/* ---------- genel görünürlük animasyonu ---------- */
.fade-up{opacity:0;transform:translateY(30px)}
.fade-up.in{opacity:1;transform:none;transition:opacity 1s var(--ease),transform 1s var(--ease)}

/* ---------- animasyonsuz mod: reduced-motion, GSAP yok veya canvas yok (html.no-anim) ---------- */
.no-anim .hs{height:auto}
.no-anim .hs__pin{position:relative}
.no-anim .hs__canvas,.no-anim .hs__progress,.no-anim .hs__hint{display:none}
.no-anim .hs__fallback{display:block}
.no-anim .hs__ch{opacity:0;pointer-events:none}
.no-anim .hs__ch--title{opacity:1;transform:none;pointer-events:auto}
.no-anim .fade-up{opacity:1;transform:none}
.no-anim .row__media img{transform:none}
.no-anim .park__pin{height:auto;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.no-anim .park__track figure{scroll-snap-align:start}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .nav__links{display:none}
  .nav__burger{display:block}
  .nav__cta{display:none}
}
@media (max-width:900px){
  .row,.row--rev{grid-template-columns:1fr}
  .row--rev .row__media{order:0}
  .konut__grid{grid-template-columns:1fr 1fr}
  .konut__big,.konut__facts{grid-column:1/3}
  .konut__facts{flex-direction:row}
  .konut__facts div{padding:16px}
  .iletisim{grid-template-columns:1fr}
  .iletisim__media{min-height:46vw}
}
@media (max-width:760px){
  .hs{height:800vh}
  .hs__ch{bottom:110px}
  .hs__ch h1{font-size:clamp(38px,11vw,60px)}
  .hs__dist{gap:18px}
  .hs__step{display:none}
  .gallery{grid-template-columns:1fr 1fr;grid-auto-rows:auto}
  .gallery__item{grid-column:auto!important;grid-row:auto!important}
  .g1,.g4{grid-column:1/3!important}
  .gallery__item img{aspect-ratio:16/10}
  .rek__duo,.yasam__grid{grid-template-columns:1fr}
  .konut__grid{grid-template-columns:1fr}
  .konut__big,.konut__facts{grid-column:auto}
  .konut__facts{flex-direction:column}
  .form__row{grid-template-columns:1fr}
  .bleed{height:90vh;min-height:520px}
  .park__pin{padding-top:100px}
  .park__track figure{width:78vw}
}
@media (prefers-reduced-motion:reduce){
  .hs__hint span::after{animation:none}
}
