/* ── Nautical Experiences r2 (2026-10-13) — views/nautical-exp-hub.ejs · views/nautical-exp-detay.ejs (.nx-) ──
   Karakter "Iskandil": denizcinin derinlik olcen ipi. Akdeniz tas evleri, koy, sakin ve editoryal bir dil.
   - Hero gorseli deniz yukselir gibi alttan dolar; kenarinda ince bir su yuzeyi isigi tirmanir (gorsel ustunde yazi yok).
   - Etiketler kucuk bir dalga isaretiyle acilir; asagi ok = ipe asili, inen cekul.
   - 10 deneyim alti sirada ritimli (tek · cift · tek-ayna · uclu · tek · cift-yatay); genis ekranda solda olcekli ip ve
     kaydirdikca inen cekul o an okunan deneyimin numarasini tasir (numaralar CSS sayacindan; metin bloklarinda sayi yok).
   - Tek koyu an: Private Occasions (gece denizi). Detayda What to Expect maddeleri su cizgisinden sarkan olcumler.
   Hareket: .nx-bekle kalkinca belirme (public/js/nautical-exp.js). prefers-reduced-motion'da hepsi durur. */

.nx, .nx-hero, .nx-lb, .nx-kirinti {
  --nx-zemin: #faf8f5; --nx-kum: #f2eee6; --nx-murekkep: #24211c; --nx-yazi: #3a352d; --nx-soluk: #6f675b;
  --nx-altin: #9a7a45; --nx-altin-acik: #d9c39c; --nx-cizgi: rgba(36,33,28,.13); --nx-deniz: #5c7672; --nx-gece: #131b1a;
  --nx-nav: 68px; --nx-egri: cubic-bezier(.2,.75,.2,1); --nx-perde: cubic-bezier(.65,0,.25,1);
  --nx-dalga: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='8' viewBox='0 0 28 8'%3E%3Cpath d='M0 4c3.5 0 3.5-3 7-3s3.5 3 7 3 3.5-3 7-3 3.5 3 7 3' fill='none' stroke='%239a7a45' stroke-width='1.1'/%3E%3C/svg%3E");
  --nx-dalga-acik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='8' viewBox='0 0 28 8'%3E%3Cpath d='M0 4c3.5 0 3.5-3 7-3s3.5 3 7 3 3.5-3 7-3 3.5 3 7 3' fill='none' stroke='%23d9c39c' stroke-width='1.1'/%3E%3C/svg%3E");
}
.nx { background: var(--nx-zemin); color: var(--nx-yazi); overflow-x: clip; }
.nx-ic { padding-left: max(24px, calc((100vw - 1180px) / 2)); padding-right: max(24px, calc((100vw - 1180px) / 2)); }
.nx p { font-family: var(--serif); font-size: 18.5px; line-height: 1.72; color: var(--nx-yazi); margin: 0 0 18px; }
.nx img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.nx [data-nx-bolum], .nx [data-capa] { scroll-margin-top: calc(var(--nx-nav) + 56px); }
.nx [data-nx-bolum]:focus, .nx [data-capa]:focus { outline: none; }
.nx a:focus-visible, .nx button:focus-visible { outline: 2px solid var(--nx-altin); outline-offset: 4px; }

/* etiket · baslik · baglanti · dugme */
.nx-etiket { display: flex; align-items: center; gap: 14px; font-family: var(--sans); font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--nx-altin); margin-bottom: 18px; line-height: 1.5; }
.nx-etiket::before { content: ""; flex: none; width: 28px; height: 8px; background: var(--nx-dalga) left center / 28px 8px no-repeat;
  clip-path: inset(0 0 0 0); transition: clip-path 1.2s var(--nx-egri) .15s; }
.nx-bekle .nx-etiket::before, .nx-etiket.nx-bekle::before { clip-path: inset(0 100% 0 0); }
.nx-etiket-orta { justify-content: center; }
.nx-baslik { margin: 0 0 26px; font-family: var(--serif); font-weight: 400; font-size: clamp(34px, 3.7vw, 54px); line-height: 1.07;
  letter-spacing: -.01em; color: var(--nx-murekkep); text-wrap: balance; }
.nx-baslik em, .nx-acilis-baslik em { font-style: italic; color: var(--nx-altin); }
.nx-link { display: inline-block; position: relative; font-family: var(--sans); font-size: 11px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--nx-murekkep); text-decoration: none; padding-bottom: 7px; }
.nx-link::after { content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 34px; background: var(--nx-altin); transition: width .5s var(--nx-egri); }
.nx-link:hover::after, .nx-link:focus-visible::after { width: 100%; }
.nx-link span { display: inline-block; transition: transform .3s; }
.nx-link:hover span { transform: translateX(4px); }
.nx-link-geri:hover span { transform: translateX(-4px); }
.nx-kap { display: contents; } /* her baglanti kendi metin blogu (TM) — duzeni etkilemez */
.nx-dugmeler { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 36px; margin-top: 10px; }
.nx-dugmeler-orta { justify-content: center; }
.nx-dugme { display: inline-block; padding: 16px 34px; background: var(--nx-murekkep); color: #faf8f5; text-decoration: none; border-radius: 2px;
  font-family: var(--sans); font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; text-align: center; transition: background .3s, color .3s; }
.nx-dugme:hover { background: var(--nx-altin); color: #faf8f5; }
.nx-dugme--acik { background: transparent; color: #f3ead9; box-shadow: inset 0 0 0 1px rgba(217,195,156,.55); }
.nx-dugme--acik:hover { background: var(--nx-altin-acik); color: var(--nx-gece); }

/* belirme */
.nx-gor { transition: opacity 1.1s var(--nx-egri), transform 1.1s var(--nx-egri); transition-delay: calc(var(--i, 0) * .12s); }
.nx-gor.nx-bekle { opacity: 0; transform: translateY(28px); }

/* ── kirinti (sayfa zemini) ── */
.nx-kirinti .breadcrumb { background: var(--nx-zemin); border-bottom: 0; }
.nx-kirinti .breadcrumb-inner { max-width: none; padding: 22px max(24px, calc((100vw - 1180px) / 2)) 0; }
.nx-kirinti .breadcrumb-item, .nx-kirinti .breadcrumb-item a, .nx-kirinti .breadcrumb-sep { color: var(--nx-soluk); }
.nx-kirinti .breadcrumb-item a:hover, .nx-kirinti .breadcrumb-item span[aria-current="page"] { color: var(--nx-altin); }

/* ══ 1. hero — deniz alttan dolar ══ */
.nx-hero { position: relative; height: clamp(360px, 64vh, 700px); overflow: hidden; background: #0f1716; }
.nx-hero-gorsel { position: absolute; inset: 0; clip-path: inset(100% 0 0 0); animation: nxDol 2.4s var(--nx-perde) .15s forwards; }
.nx-hero-gorsel img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; scale: 1.1; translate: 0 4%;
  animation: nxDolImg 3.6s var(--nx-egri) .15s forwards; }
/* su yuzeyi: dolan kenarla birlikte tirmanan ince isik */
.nx-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; pointer-events: none; opacity: 0;
  background: linear-gradient(90deg, rgba(217,195,156,0), rgba(255,246,228,.85) 30%, rgba(217,195,156,.9) 70%, rgba(217,195,156,0));
  box-shadow: 0 0 18px 2px rgba(255,236,200,.35); animation: nxYuzey 2.4s var(--nx-perde) .15s forwards; }
@keyframes nxDol { to { clip-path: inset(0 0 0 0); } }
@keyframes nxDolImg { to { scale: 1; translate: 0 0; } }
@keyframes nxYuzey { 0% { bottom: 0; opacity: 0; } 12% { opacity: 1; } 80% { opacity: .8; } 100% { bottom: 100%; opacity: 0; } }
.nx-hero--detay { height: clamp(330px, 56vh, 620px); }

/* ══ acilis (baslik gorselin altinda) ══ */
.nx-acilis { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 26px 72px; align-items: end;
  padding-top: clamp(26px, 4vh, 44px); padding-bottom: clamp(76px, 12vh, 120px); }
.nx-acilis > * { animation: nxYuksel 1.2s var(--nx-egri) both; }
.nx-acilis > :nth-child(2) { animation-delay: .22s; }
@keyframes nxYuksel { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
.nx-acilis-baslik { margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(44px, 5.2vw, 80px); line-height: 1; letter-spacing: -.02em;
  color: var(--nx-murekkep); text-wrap: balance; }
.nx-acilis-sag { display: flex; align-items: flex-end; gap: 30px; }
.nx .nx-acilis-alt { margin: 0; max-width: 470px; font-size: 17.5px; line-height: 1.68; color: var(--nx-soluk); }

/* asagi ok = iskandil: ipe asili cekul yavasca iner */
.nx-iskandil { position: relative; flex: none; display: block; width: 28px; height: 84px; }
.nx-iskandil span { position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: var(--nx-cizgi); }
.nx-iskandil span::before { content: ""; position: absolute; left: 0; top: 0; width: 1px; height: 0; background: var(--nx-altin);
  animation: nxIp 3s var(--nx-perde) infinite; }
.nx-iskandil::after { content: ""; position: absolute; left: 50%; top: 0; width: 7px; height: 7px; margin-left: -3.5px; border: 1px solid var(--nx-altin);
  background: var(--nx-zemin); transform: rotate(45deg); animation: nxCekul 3s var(--nx-perde) infinite; }
.nx-iskandil:hover span::before, .nx-iskandil:hover::after { animation-duration: 1.8s; }
@keyframes nxIp { 0% { height: 0; opacity: 1; } 70% { height: calc(100% - 8px); opacity: 1; } 100% { height: calc(100% - 8px); opacity: 0; } }
@keyframes nxCekul { 0% { top: 0; opacity: 0; } 10% { opacity: 1; } 70% { top: calc(100% - 8px); opacity: 1; } 100% { top: calc(100% - 8px); opacity: 0; } }

/* ══ 2. felsefe — kum zemin ══ */
.nx-felsefe { background: var(--nx-kum); padding: clamp(84px, 13vh, 130px) 0; }
.nx-felsefe-izgara { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 32px 84px; align-items: start; }
.nx-felsefe-bas .nx-baslik { margin: 0; }
.nx-felsefe-metin { --i: 1; padding-top: 6px; }
.nx .nx-felsefe-metin p:first-child { font-size: clamp(21px, 1.8vw, 25px); line-height: 1.55; color: var(--nx-murekkep); margin-bottom: 24px; }
.nx .nx-felsefe-metin p { color: var(--nx-soluk); }
.nx .nx-felsefe-metin p:last-child { margin-bottom: 0; }

/* bolum basligi: solda etiket + baslik, sagda giris (alt hizali) */
.nx-bolum-bas { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 24px 64px; align-items: end; margin-bottom: clamp(56px, 9vh, 90px); }
.nx-bolum-bas .nx-baslik { margin: 0; }
.nx .nx-bolum-giris { margin: 0; max-width: 500px; font-size: 18px; color: var(--nx-soluk); }

/* ══ 3. deneyimler — ritimli siralar ══ */
.nx-deneyimler { padding-top: clamp(96px, 15vh, 150px); padding-bottom: clamp(100px, 15vh, 150px); }
.nx-akis { position: relative; counter-reset: nx-no; }
.nx-sira { display: grid; gap: 44px; margin-bottom: clamp(80px, 12vh, 124px); }
.nx-sira:last-child { margin-bottom: 0; }
.nx-kart { counter-increment: nx-no; position: relative; display: flex; flex-direction: column; min-width: 0; }
.nx-kart-gorsel { position: relative; display: block; overflow: hidden; border-radius: 2px; background: #e7e1d6; aspect-ratio: 4 / 5; }
.nx-kart-gorsel img { transition: transform 1.8s var(--nx-egri); }
.nx-kart:hover .nx-kart-gorsel img, .nx-diger-kart:hover .nx-kart-gorsel img { transform: scale(1.05); }
/* gorsel acilisi: alttan dolar (hero'nun kucuk yankisi) */
.nx-kart .nx-kart-gorsel { clip-path: inset(0 0 0 0); transition: clip-path 1.5s var(--nx-perde) calc(var(--i, 0) * .14s); }
.nx-kart.nx-bekle .nx-kart-gorsel { clip-path: inset(100% 0 0 0); }
.nx-kart-metin { padding-top: 26px; max-width: 520px; }
.nx-kart-no { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; font-family: var(--serif); font-size: 15px; letter-spacing: .08em; color: var(--nx-altin); }
.nx-kart-no::before { content: counter(nx-no, decimal-leading-zero); }
.nx-kart-no::after { content: ""; width: 26px; height: 1px; background: var(--nx-altin); opacity: .7; }
.nx-kart-baslik { margin: 0 0 12px; font-family: var(--serif); font-weight: 400; font-size: clamp(26px, 2.2vw, 32px); line-height: 1.12; color: var(--nx-murekkep); text-wrap: balance; }
.nx-kart .nx-kart-metin p { font-size: 17px; line-height: 1.66; color: var(--nx-soluk); margin-bottom: 20px; }

/* tek: buyuk gorsel + yaninda metin */
.nx-sira--tek, .nx-sira--tek-ayna { grid-template-columns: 1fr; }
.nx-sira--tek .nx-kart, .nx-sira--tek-ayna .nx-kart { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr); gap: 0 clamp(40px, 5.4vw, 80px); align-items: center; }
.nx-sira--tek .nx-kart-gorsel { aspect-ratio: 3 / 2; }
.nx-sira--tek-ayna .nx-kart { grid-template-columns: minmax(0, 1fr) minmax(0, 1.42fr); }
.nx-sira--tek-ayna .nx-kart-gorsel { order: 2; aspect-ratio: 16 / 11; }
.nx-sira--tek .nx-kart-metin, .nx-sira--tek-ayna .nx-kart-metin { padding-top: 0; }
.nx-sira--tek .nx-kart-baslik, .nx-sira--tek-ayna .nx-kart-baslik { font-size: clamp(30px, 2.8vw, 40px); }
.nx-sira--tek .nx-kart-metin p, .nx-sira--tek-ayna .nx-kart-metin p { font-size: 18px; }
/* cift: iki dikey, ikincisi asagi kayik */
.nx-sira--cift { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 clamp(40px, 6vw, 96px); padding: 0 clamp(0px, 3vw, 48px); }
.nx-sira--cift .nx-kart:nth-child(2) { margin-top: clamp(70px, 11vh, 130px); --i: 1; }
/* uclu: kucuk ve sik; ortadaki asagida */
.nx-sira--uclu { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(28px, 3.2vw, 48px); }
.nx-sira--uclu .nx-kart-gorsel { aspect-ratio: 3 / 4; }
.nx-sira--uclu .nx-kart:nth-child(2) { margin-top: clamp(48px, 8vh, 90px); --i: 1; }
.nx-sira--uclu .nx-kart:nth-child(3) { --i: 2; }
.nx-sira--uclu .nx-kart-baslik { font-size: clamp(24px, 1.9vw, 28px); }
.nx-sira--uclu .nx-kart-metin p { font-size: 16.5px; }
/* cift-yatay: genis + dar, yatay kadraj */
.nx-sira--cift-yatay { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 0 clamp(40px, 5vw, 80px); align-items: start; }
.nx-sira--cift-yatay .nx-kart-gorsel { aspect-ratio: 4 / 3; }
.nx-sira--cift-yatay .nx-kart:nth-child(2) { margin-top: clamp(90px, 14vh, 170px); --i: 1; }
.nx-sira--cift-yatay .nx-kart:nth-child(2) .nx-kart-gorsel { aspect-ratio: 1 / 1; }

/* iskandil ipi (genis ekran): solda olcekli ip, kaydirdikca inen cekul */
.nx-ip { display: none; }
@media (min-width: 1101px) {
  .nx-akis { padding-left: 76px; }
  .nx-ip { display: block; position: absolute; left: 0; top: 0; bottom: 0; width: 44px; clip-path: inset(-20px -200px 0 0); }
  .nx-ip::before { content: ""; position: absolute; left: 4px; top: 0; bottom: 0; width: 1px; background: var(--nx-cizgi); }
  .nx-ip::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 9px; opacity: .55;
    background: repeating-linear-gradient(to bottom, var(--nx-deniz) 0 1px, transparent 1px 36px); }
  .nx-cekul { position: sticky; top: 55vh; display: block; height: 0; z-index: 1; }
  .nx-cekul::before { content: ""; position: absolute; left: 4px; bottom: 6px; width: 1px; height: 55vh; background: linear-gradient(to top, var(--nx-altin), rgba(154,122,69,0)); }
  .nx-cekul::after { content: ""; position: absolute; left: 0; top: -6px; width: 9px; height: 9px; border: 1px solid var(--nx-altin); background: var(--nx-zemin);
    transform: rotate(45deg); box-sizing: border-box; }
  .nx-cekul-no { position: absolute; left: 20px; top: -11px; font-family: var(--serif); font-size: 15px; letter-spacing: .08em; color: var(--nx-altin);
    white-space: nowrap; transition: opacity .4s; }
  .nx-cekul-no:empty { opacity: 0; }
  .nx-akis .nx-kart-no { visibility: hidden; height: 0; margin: 0; } /* numara ipte okunur */
  .nx-akis .nx-kart.is-okunan .nx-kart-baslik { color: var(--nx-murekkep); }
}

/* ══ 4. private occasions — gece denizi ══ */
.nx-ozel { position: relative; background: radial-gradient(90% 70% at 18% 0%, #1f2c2a 0%, var(--nx-gece) 72%); color: #efe7d8;
  padding: clamp(96px, 14vh, 140px) 0; }
.nx-ozel .nx-etiket { color: var(--nx-altin-acik); }
.nx-ozel .nx-etiket::before { background-image: var(--nx-dalga-acik); }
.nx-ozel .nx-baslik { color: #f5eedd; }
.nx-ozel .nx-baslik em { color: var(--nx-altin-acik); }
.nx-ozel p { color: rgba(239,231,216,.76); max-width: 520px; }
.nx-ozel a:focus-visible { outline-color: var(--nx-altin-acik); }
.nx-ozel-govde { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 48px clamp(48px, 6vw, 96px); align-items: center; }
.nx-ozel-kolaj { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; grid-template-rows: 1fr 1fr; gap: 16px; height: clamp(440px, 64vh, 620px);
  text-decoration: none; --i: 1; }
.nx-ozel-kare { position: relative; overflow: hidden; border-radius: 2px; background: #1b2423; box-shadow: 0 40px 70px -44px rgba(0,0,0,.9); }
.nx-ozel-kare img { transition: transform 1.8s var(--nx-egri); }
.nx-ozel-kolaj:hover .nx-ozel-kare img { transform: scale(1.04); }
.nx-ozel-kare--0 { grid-row: 1 / 3; }
.nx-ozel-kare--2 { margin-left: -14%; margin-top: 10%; }
.nx-ozel-kolaj--1 { grid-template-columns: 1fr; }
.nx-ozel-kolaj--2 .nx-ozel-kare--1 { grid-row: 1 / 3; }
/* kolajin uzerinde ince su yuzeyi cizgisi */
.nx-ozel-kolaj::after { content: ""; position: absolute; left: -24px; right: 28%; top: 50%; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, rgba(217,195,156,0), rgba(217,195,156,.55), rgba(217,195,156,0)); }

/* ══ 5. kapanis ══ */
.nx-kapanis { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .82fr); gap: 48px clamp(48px, 7vw, 110px); align-items: center;
  padding-top: clamp(100px, 15vh, 150px); padding-bottom: clamp(100px, 15vh, 150px); }
.nx-kapanis-metin p { color: var(--nx-soluk); max-width: 480px; margin-bottom: 30px; }
.nx-kapanis-gorsel { --i: 1; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 2px; background: #e7e1d6; max-height: 640px; justify-self: end; width: 100%; }
.nx-kapanis-gorsel img { transition: transform 1.8s var(--nx-egri); }
.nx-kapanis-gorsel:hover img { transform: scale(1.04); }
.nx-dalga-buyuk { display: block; width: 56px; height: 12px; margin-bottom: 28px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='12' viewBox='0 0 56 12'%3E%3Cpath d='M0 6c4.7 0 4.7-5 9.3-5s4.7 5 9.4 5 4.6-5 9.3-5 4.7 5 9.3 5 4.7-5 9.4-5 4.6 5 9.3 5' fill='none' stroke='%239a7a45' stroke-width='1.2'/%3E%3C/svg%3E") center / contain no-repeat; }

/* ══ DETAY ══ */
/* 3. the experience — tek buyuk paragraf, soldan iple baglanir */
.nx-deneyim { padding-top: 0; padding-bottom: clamp(80px, 12vh, 120px); }
.nx-deneyim-izgara { display: grid; grid-template-columns: minmax(0, .42fr) minmax(0, 1fr); gap: 20px 72px; align-items: start;
  padding-top: clamp(48px, 7vh, 70px); border-top: 1px solid var(--nx-cizgi); }
.nx-deneyim-izgara .nx-etiket { margin: 10px 0 0; }
.nx .nx-deneyim-metin { margin: 0; max-width: 760px; font-size: clamp(23px, 2.15vw, 31px); line-height: 1.5; color: var(--nx-murekkep); text-wrap: pretty; }

/* 4. what to expect — su cizgisinden sarkan olcumler */
.nx-beklenti { padding-bottom: clamp(90px, 14vh, 140px); }
.nx-olcum { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 0 28px;
  position: relative; }
.nx-olcum--1 { --n: 1; } .nx-olcum--2 { --n: 2; } .nx-olcum--3 { --n: 3; } .nx-olcum--4 { --n: 4; } .nx-olcum--5 { --n: 5; } .nx-olcum--6 { --n: 3; }
/* su cizgisi: ustte ince bir dalga seridi */
.nx-olcum::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 8px; opacity: .8;
  background: var(--nx-dalga) left center / 28px 8px repeat-x; }
.nx-olcum li { position: relative; padding-top: calc(var(--d, 56px) + 26px); font-family: var(--serif); font-size: clamp(20px, 1.7vw, 24px); line-height: 1.25;
  color: var(--nx-murekkep); text-wrap: balance; }
.nx-olcum li:nth-child(4n+1) { --d: 54px; } .nx-olcum li:nth-child(4n+2) { --d: 92px; }
.nx-olcum li:nth-child(4n+3) { --d: 34px; } .nx-olcum li:nth-child(4n+4) { --d: 74px; }
.nx-olcum--6 li:nth-child(n+4) { margin-top: 30px; }
/* ip + cekul */
.nx-olcum li::before { content: ""; position: absolute; left: 4px; top: 8px; width: 1px; height: var(--d); background: var(--nx-deniz); opacity: .6;
  transform-origin: top; transform: scaleY(1); transition: transform 1.3s var(--nx-perde); }
.nx-olcum li::after { content: ""; position: absolute; left: 0; top: calc(var(--d) + 4px); width: 9px; height: 9px; box-sizing: border-box;
  border: 1px solid var(--nx-altin); background: var(--nx-zemin); transform: rotate(45deg); transition: top 1.3s var(--nx-perde), opacity .6s; }
.nx-olcum.nx-bekle li::before { transform: scaleY(0); }
.nx-olcum.nx-bekle li::after { top: 4px; opacity: 0; }
.nx-olcum li:nth-child(2)::before, .nx-olcum li:nth-child(2)::after { transition-delay: .12s; }
.nx-olcum li:nth-child(3)::before, .nx-olcum li:nth-child(3)::after { transition-delay: .24s; }
.nx-olcum li:nth-child(4)::before, .nx-olcum li:nth-child(4)::after { transition-delay: .36s; }
.nx-olcum li:nth-child(5)::before, .nx-olcum li:nth-child(5)::after { transition-delay: .48s; }
.nx-olcum.nx-gor.nx-bekle { transform: none; }

/* 5. galeri — mozaik + lightbox */
.nx-galeri { padding-bottom: clamp(96px, 14vh, 140px); }
.nx-galeri .nx-etiket { margin-bottom: 28px; }
.nx-mozaik { display: grid; gap: 14px; grid-auto-rows: clamp(180px, 21vw, 300px); }
.nx-kare { position: relative; display: block; padding: 0; margin: 0; border: 0; border-radius: 2px; overflow: hidden; background: #e7e1d6; cursor: zoom-in;
  min-width: 0; min-height: 0; }
.nx-kare img { transition: transform 1.8s var(--nx-egri), opacity .5s; }
.nx-kare:hover img { transform: scale(1.05); }
.nx-kare::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(255,255,255,0); transition: box-shadow .6s; pointer-events: none; }
.nx-kare:hover::after { box-shadow: inset 0 0 0 1px rgba(255,255,255,.5), inset 0 -60px 60px -60px rgba(15,23,22,.35); }
.nx-kare:nth-child(2) { --i: 1; } .nx-kare:nth-child(3) { --i: 2; } .nx-kare:nth-child(4) { --i: 3; } .nx-kare:nth-child(5) { --i: 4; } .nx-kare:nth-child(6) { --i: 5; }
.nx-mozaik--n1 { grid-template-columns: 1fr; grid-auto-rows: clamp(300px, 48vw, 640px); }
.nx-mozaik--n2 { grid-template-columns: 1.45fr 1fr; grid-auto-rows: clamp(300px, 36vw, 540px); }
.nx-mozaik--n3 { grid-template-columns: 1.45fr 1fr; }
.nx-mozaik--n3 .nx-kare:first-child { grid-row: span 2; }
.nx-mozaik--n4 { grid-template-columns: 1.6fr 1fr 1fr; }
.nx-mozaik--n4 .nx-kare:first-child { grid-row: span 2; }
.nx-mozaik--n4 .nx-kare:nth-child(2) { grid-column: span 2; }
.nx-mozaik--n5 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.nx-mozaik--n5 .nx-kare:first-child { grid-column: span 2; grid-row: span 2; }
.nx-mozaik--n6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nx-mozaik--n6 .nx-kare:first-child { grid-column: span 2; grid-row: span 2; }

/* lightbox (DOM'u JS kurar) */
.nx-lb { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center; background: rgba(12,17,16,.94);
  opacity: 0; visibility: hidden; transition: opacity .35s, visibility 0s linear .35s; }
.nx-lb.is-acik { opacity: 1; visibility: visible; transition: opacity .35s; }
.nx-lb-gorsel { max-width: min(92vw, 1500px); max-height: 84vh; width: auto; height: auto; object-fit: contain; border-radius: 2px; box-shadow: 0 40px 90px -30px rgba(0,0,0,.8);
  transition: opacity .3s; }
.nx-lb-gorsel.is-yukleniyor { opacity: 0; }
.nx-lb button { position: absolute; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; padding: 0; border: 1px solid rgba(217,195,156,.35);
  border-radius: 50%; background: rgba(19,27,26,.55); color: #efe7d8; cursor: pointer; font: 300 22px/1 var(--sans, sans-serif); transition: background .3s, border-color .3s; }
.nx-lb button:hover { background: rgba(154,122,69,.5); border-color: var(--nx-altin-acik); }
.nx-lb button:focus-visible { outline: 2px solid var(--nx-altin-acik); outline-offset: 3px; }
.nx-lb-kapat { top: 22px; right: 22px; }
.nx-lb-onceki { left: 22px; top: 50%; margin-top: -26px; }
.nx-lb-sonraki { right: 22px; top: 50%; margin-top: -26px; }
.nx-lb-sayac { position: absolute; left: 0; right: 0; bottom: 22px; text-align: center; font-family: var(--serif); font-size: 15px; letter-spacing: .1em; color: var(--nx-altin-acik); }
.nx-lb--tek .nx-lb-onceki, .nx-lb--tek .nx-lb-sonraki, .nx-lb--tek .nx-lb-sayac { display: none; }
html.nx-lb-kilit { overflow: hidden; }

/* 6. cagri — kum bant */
.nx-cagri { background: var(--nx-kum); padding: clamp(80px, 12vh, 116px) 0; text-align: center; }
.nx-cagri-ic { display: flex; flex-direction: column; align-items: center; }
.nx-cagri .nx-dalga-buyuk { margin: 0 auto 26px; }
.nx-cagri .nx-etiket { margin-bottom: 26px; }
.nx-cagri .nx-etiket::before { display: none; }

/* 7. diger deneyimler */
.nx-diger { padding-top: clamp(84px, 13vh, 120px); padding-bottom: clamp(96px, 14vh, 140px); }
.nx-diger-bas { display: flex; align-items: baseline; justify-content: space-between; gap: 18px 40px; flex-wrap: wrap; margin-bottom: 38px;
  padding-bottom: 22px; border-bottom: 1px solid var(--nx-cizgi); }
.nx-diger-bas .nx-etiket { margin: 0; }
.nx-diger-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.nx-diger-kart { display: flex; flex-direction: column; align-items: flex-start; }
.nx-diger-kart:nth-child(2) { --i: 1; } .nx-diger-kart:nth-child(3) { --i: 2; }
.nx-diger-kart .nx-kart-gorsel { width: 100%; aspect-ratio: 4 / 3; margin-bottom: 22px; }
.nx-diger-kart .nx-kart-baslik { font-size: clamp(23px, 1.8vw, 27px); margin-bottom: 14px; }

/* ══ duyarli ══ */
@media (max-width: 1100px) {
  .nx-sira--cift { padding: 0; }
}
@media (max-width: 900px) {
  .nx, .nx-hero, .nx-lb, .nx-kirinti { --nx-nav: 57px; }
  .nx-ic { padding-left: 20px; padding-right: 20px; }
  .nx p { font-size: 17.5px; }
  .nx-kirinti .breadcrumb-inner { padding: 16px 20px 0; }
  .nx-hero { height: clamp(300px, 52vh, 460px); }
  .nx-hero--detay { height: clamp(280px, 46vh, 420px); }
  .nx-acilis { grid-template-columns: 1fr; gap: 22px; padding-bottom: 72px; }
  .nx-acilis-baslik { font-size: clamp(38px, 10.5vw, 56px); }
  .nx-acilis-sag { gap: 22px; }
  .nx-iskandil { height: 66px; }
  .nx-felsefe { padding: 72px 0; }
  .nx-felsefe-izgara, .nx-bolum-bas { grid-template-columns: 1fr; gap: 22px; }
  .nx-bolum-bas { margin-bottom: 48px; }
  .nx-deneyimler { padding-top: 80px; padding-bottom: 88px; }
  .nx-sira { gap: 56px; margin-bottom: 56px; }
  .nx-sira--tek .nx-kart, .nx-sira--tek-ayna .nx-kart { grid-template-columns: 1fr; }
  .nx-sira--tek-ayna .nx-kart-gorsel { order: 0; }
  .nx-sira--tek .nx-kart-metin, .nx-sira--tek-ayna .nx-kart-metin { padding-top: 24px; }
  .nx-sira--cift, .nx-sira--uclu, .nx-sira--cift-yatay { grid-template-columns: 1fr; gap: 56px; }
  .nx-sira--cift .nx-kart:nth-child(2), .nx-sira--uclu .nx-kart:nth-child(2), .nx-sira--cift-yatay .nx-kart:nth-child(2) { margin-top: 0; }
  .nx-kart-gorsel, .nx-sira--uclu .nx-kart-gorsel, .nx-sira--cift-yatay .nx-kart:nth-child(2) .nx-kart-gorsel { aspect-ratio: 4 / 3; }
  .nx-kart .nx-kart-gorsel { transition-delay: 0s; }
  .nx-kart { --i: 0 !important; }
  .nx-ozel { padding: 80px 0; }
  .nx-ozel-govde { grid-template-columns: 1fr; }
  .nx-ozel-kolaj { height: auto; aspect-ratio: 1 / 1.05; gap: 10px; }
  .nx-ozel-kolaj::after { display: none; }
  .nx-ozel-kare--2 { margin-left: 0; margin-top: 0; }
  .nx-kapanis { grid-template-columns: 1fr; padding-top: 84px; padding-bottom: 88px; }
  .nx-kapanis-gorsel { aspect-ratio: 4 / 3; justify-self: stretch; }
  .nx-deneyim-izgara { grid-template-columns: 1fr; gap: 16px; }
  .nx-deneyim-izgara .nx-etiket { margin: 0; }
  .nx-olcum, .nx-olcum--4, .nx-olcum--5, .nx-olcum--6 { --n: 2; gap: 0 22px; }
  .nx-olcum li:nth-child(n+3) { margin-top: 26px; }
  .nx-olcum li:nth-child(4n+1), .nx-olcum li:nth-child(4n+3) { --d: 34px; }
  .nx-olcum li:nth-child(4n+2), .nx-olcum li:nth-child(4n+4) { --d: 62px; }
  .nx-olcum li:nth-child(n+3)::before { top: -18px; height: calc(var(--d) + 26px); }
  .nx-mozaik, .nx-mozaik--n3, .nx-mozaik--n4, .nx-mozaik--n5, .nx-mozaik--n6 { grid-template-columns: 1fr 1fr; grid-auto-rows: 44vw; gap: 10px; }
  .nx-mozaik--n2 { grid-template-columns: 1fr; grid-auto-rows: 62vw; }
  .nx-mozaik--n1 { grid-auto-rows: 66vw; }
  .nx-mozaik .nx-kare:first-child { grid-column: 1 / -1; grid-row: auto; }
  .nx-mozaik--n4 .nx-kare:nth-child(2) { grid-column: auto; }
  .nx-mozaik--n4 .nx-kare:last-child:nth-child(4), .nx-mozaik--n6 .nx-kare:last-child:nth-child(6) { grid-column: 1 / -1; }
  .nx-diger-izgara { grid-template-columns: 1fr; gap: 44px; }
  .nx-lb button { width: 44px; height: 44px; font-size: 19px; }
  .nx-lb-onceki { left: 10px; } .nx-lb-sonraki { right: 10px; } .nx-lb-kapat { top: 12px; right: 12px; }
}
@media (max-width: 420px) {
  .nx-dugme { padding: 15px 24px; letter-spacing: .2em; }
  .nx-olcum, .nx-olcum--4, .nx-olcum--5, .nx-olcum--6 { gap: 0 14px; }
  .nx-olcum li { font-size: 19px; }
}

@media (prefers-reduced-motion: reduce) {
  .nx-hero-gorsel, .nx-hero-gorsel img, .nx-hero::after, .nx-acilis > *, .nx-iskandil span::before, .nx-iskandil::after { animation: none !important; }
  .nx-hero-gorsel { clip-path: none; }
  .nx-hero-gorsel img { scale: 1; translate: none; }
  .nx-hero::after { display: none; }
  .nx-iskandil span::before { height: calc(100% - 8px); }
  .nx-iskandil::after { top: calc(100% - 8px); }
  .nx *, .nx *::before, .nx *::after { transition: none !important; }
  .nx-gor.nx-bekle { opacity: 1; transform: none; }
  .nx-kart.nx-bekle .nx-kart-gorsel { clip-path: none; }
  .nx-olcum.nx-bekle li::before { transform: none; }
  .nx-olcum.nx-bekle li::after { top: calc(var(--d) + 4px); opacity: 1; }
  .nx-bekle .nx-etiket::before, .nx-etiket.nx-bekle::before { clip-path: none; }
  .nx-lb, .nx-lb-gorsel { transition: none; }
}

/* koyu Private Occasions bandinda gorunur "Learn More" (ana oturum, 2026-10-13) */
.nx-ozel .nx-link--koyu { color: #efe7d8; align-self: center; }
.nx-ozel .nx-link--koyu::after { background: var(--nx-altin-acik); }