/* ============================================================================
   HALLEY Desert Camp — vitrin-02 · Astro-scrollytelling glamping
   Palet: kozmik mor + fosfor turkuaz (altın YOK). Font: Zodiak + Space Grotesk.
   ========================================================================== */

/* ---- fonts (self-host, GDPR temiz, CDN yok) ---- */
@font-face{
  font-family:'Zodiak';
  src:url('fonts/zodiak-400.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Zodiak';
  src:url('fonts/zodiak-700.woff2') format('woff2');
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Space Grotesk';
  src:url('fonts/space-grotesk-latin.woff2') format('woff2');
  font-weight:400 700; font-style:normal; font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
}
@font-face{
  font-family:'Space Grotesk';
  src:url('fonts/space-grotesk-latin-ext.woff2') format('woff2');
  font-weight:400 700; font-style:normal; font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+1E00-1EFF,U+2020,U+20A0-20AB,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---- tokens ---- */
:root{
  --bg:#0B0713;
  --panel:#140C22;
  --panel-2:#1B1030;
  --sand:#EDE4D3;
  --nebula:#7B5CFF;
  --nebula-lite:#9B84FF;
  --turq:#37E0C4;
  --turq-lite:#5FF0D6;
  --dust:#B9A6C9;
  --line:rgba(185,166,201,.16);
  --line-strong:rgba(185,166,201,.30);
  --display:'Zodiak',Georgia,'Times New Roman',serif;
  --body:'Space Grotesk',ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --wrap:1160px;
  --r:16px;
  --dawn:0; /* scroll ile 0..1, JS besler */
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--bg); color:var(--sand);
  font-family:var(--body); font-weight:400; line-height:1.6;
  font-size:clamp(15px,1vw + 12px,17px);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.05;margin:0;letter-spacing:-.01em}
p{margin:0 0 1rem}
a{color:var(--turq-lite);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:#fff}
img,svg,canvas,video{display:block;max-width:100%}
ul{margin:0;padding:0;list-style:none}

/* ---- accessibility helpers ---- */
.skip{position:absolute;left:-9999px;top:0;background:var(--turq);color:#06040c;
  padding:.6rem 1rem;border-radius:0 0 10px 0;z-index:200;font-weight:700}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--nebula-lite);outline-offset:3px;border-radius:6px}
.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}

/* ---- layout ---- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(20px,5vw,40px)}
section{position:relative}
.eyebrow{font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;color:var(--turq);
  font-weight:500;margin:0 0 1rem}
.lead{color:var(--dust);max-width:56ch}

/* ============================================================================
   NAV
   ========================================================================== */
.nav{position:fixed;inset:0 0 auto 0;z-index:100;display:flex;align-items:center;
  justify-content:space-between;gap:1rem;
  padding:.85rem clamp(20px,5vw,40px);
  background:linear-gradient(180deg,rgba(6,4,12,.82),rgba(6,4,12,0));
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:background .3s ease}
.nav.solid{background:rgba(9,6,17,.9);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.6rem;font-family:var(--display);
  font-weight:700;font-size:1.15rem;letter-spacing:.02em;color:var(--sand);text-decoration:none}
.brand .dot{width:11px;height:11px;border-radius:50%;
  background:radial-gradient(circle at 32% 30%,#fff,var(--turq) 42%,var(--nebula) 100%);
  box-shadow:0 0 12px rgba(55,224,196,.7)}
.nav-links{display:flex;align-items:center;gap:1.8rem}
.nav-links a{color:var(--dust);text-decoration:none;font-size:.9rem;letter-spacing:.02em}
.nav-links a:hover{color:var(--sand)}
.nav-cta{display:inline-flex;align-items:center;min-height:44px;padding:.5rem 1.15rem;
  border-radius:999px;border:1px solid var(--nebula);color:var(--sand)!important;font-weight:500}
.nav-cta:hover{background:var(--nebula);color:#0a0714!important}
.nav-toggle{display:none;position:relative;z-index:150;background:none;border:1px solid var(--line-strong);color:var(--sand);
  border-radius:10px;width:44px;height:44px;font-size:1.2rem;cursor:pointer}

/* ============================================================================
   HERO — imza anı: o gecenin gökyüzü haritası
   ========================================================================== */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;
  overflow:hidden;isolation:isolate;
  /* gece -> şafak: --dawn scroll ile artar */
  background:
    linear-gradient(180deg,
      rgba(11,7,19,calc(1 - var(--dawn)*.15)) 0%,
      rgba(24,13,40,calc(1 - var(--dawn)*.35)) 55%,
      rgba(11,7,19,1) 100%),
    linear-gradient(180deg,
      hsl(258 60% calc(6% + var(--dawn)*7%)) 0%,
      hsl(280 45% calc(9% + var(--dawn)*16%)) 60%,
      hsl(28 70% calc(6% + var(--dawn)*30%)) 100%);
}
/* CSS yıldız tabanı — JS/canvas olmasa da gökyüzü dolu görünür */
.hero::before{content:"";position:absolute;inset:0;z-index:-2;opacity:calc(1 - var(--dawn)*.9);
  background-image:
    radial-gradient(1.4px 1.4px at 12% 22%,rgba(237,228,211,.9),transparent),
    radial-gradient(1.2px 1.2px at 28% 12%,rgba(200,220,255,.8),transparent),
    radial-gradient(1.6px 1.6px at 42% 30%,#fff,transparent),
    radial-gradient(1.1px 1.1px at 63% 16%,rgba(185,166,201,.8),transparent),
    radial-gradient(1.3px 1.3px at 78% 26%,rgba(200,255,240,.8),transparent),
    radial-gradient(1.1px 1.1px at 88% 12%,rgba(237,228,211,.75),transparent),
    radial-gradient(1px 1px at 55% 42%,rgba(237,228,211,.6),transparent),
    radial-gradient(1.2px 1.2px at 8% 46%,rgba(200,220,255,.6),transparent),
    radial-gradient(1px 1px at 34% 52%,rgba(255,255,255,.5),transparent),
    radial-gradient(1.1px 1.1px at 72% 48%,rgba(185,166,201,.6),transparent);
  transition:opacity .2s linear}
#sky{position:absolute;inset:0;z-index:-1;width:100%;height:100%;
  opacity:calc(1 - var(--dawn)*.85);touch-action:pan-y}
.dunes{position:absolute;left:0;right:0;bottom:0;z-index:-1;width:100%;height:34vh;
  min-height:180px}
.dunes .d1{fill:#120a1a}
.dunes .d2{fill:#0a0510}
/* şafak ışığı ufuktan yükselir */
.horizon-glow{position:absolute;left:0;right:0;bottom:0;z-index:-1;height:46vh;
  background:radial-gradient(120% 80% at 50% 118%,
    rgba(255,185,120,calc(var(--dawn)*.55)),
    rgba(123,92,255,calc(var(--dawn)*.12)) 45%,transparent 70%);
  pointer-events:none}

.hero-inner{position:relative;z-index:2;width:100%;max-width:var(--wrap);
  margin-inline:auto;padding:0 clamp(20px,5vw,40px) clamp(48px,9vh,120px)}
.hero .kicker{display:inline-flex;align-items:center;gap:.55rem;
  font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--turq);
  border:1px solid var(--line-strong);border-radius:999px;padding:.42rem .9rem;margin-bottom:1.4rem}
.hero .kicker .pip{width:6px;height:6px;border-radius:50%;background:var(--turq);
  box-shadow:0 0 10px var(--turq)}
.hero h1{font-size:clamp(2.7rem,7.4vw,6rem);max-width:15ch;
  text-shadow:0 2px 40px rgba(6,4,12,.6)}
.hero h1 .em{color:transparent;background:linear-gradient(120deg,var(--turq-lite),var(--nebula-lite));
  -webkit-background-clip:text;background-clip:text}
.hero .sub{margin-top:1.3rem;max-width:44ch;color:var(--dust);font-size:1.05rem}

.sky-pick{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.9rem;align-items:flex-end}
.field-date{display:flex;flex-direction:column;gap:.4rem}
.field-date label{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.field-date input{font-family:var(--body);font-size:1rem;color:var(--sand);
  background:rgba(20,12,34,.72);border:1px solid var(--line-strong);border-radius:12px;
  padding:.7rem .9rem;min-height:48px;color-scheme:dark;min-width:190px}
.field-date input:hover{border-color:var(--nebula)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  font-family:var(--body);font-weight:700;font-size:1rem;letter-spacing:.01em;
  min-height:52px;padding:.85rem 1.5rem;border-radius:999px;cursor:pointer;
  border:1px solid transparent;text-decoration:none;transition:transform .18s ease,box-shadow .25s ease}
.btn-primary{color:#08040f;
  background:linear-gradient(110deg,var(--turq) 0%,var(--nebula-lite) 100%);
  box-shadow:0 8px 34px rgba(123,92,255,.36)}
.btn-primary:hover{transform:translateY(-2px);color:#08040f;
  box-shadow:0 12px 42px rgba(55,224,196,.42)}
.btn-ghost{color:var(--sand);border-color:var(--line-strong);background:rgba(20,12,34,.4)}
.btn-ghost:hover{border-color:var(--nebula);color:#fff}
.btn-arrow{transition:transform .2s ease}
.btn:hover .btn-arrow{transform:translateX(3px)}

.proof{margin-top:1.7rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.1rem;
  font-size:.9rem;color:var(--dust)}
.proof .stars{color:var(--turq);letter-spacing:.12em;font-weight:700}
.proof .sep{opacity:.4}
.proof b{color:var(--sand);font-weight:700}

/* moon widget — köşede o gecenin ay evresi */
.moon{position:absolute;top:clamp(84px,12vh,120px);right:clamp(20px,5vw,48px);z-index:2;
  width:132px;text-align:center}
.moon-disc{width:82px;height:82px;margin:0 auto .5rem;border-radius:50%;position:relative;
  background:#0e0a1a;overflow:hidden;
  box-shadow:0 0 0 1px var(--line-strong),0 0 40px rgba(123,92,255,.25)}
.moon-lit{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 38% 34%,#f6f1e6,#cfc7b6 72%,#b3ab9c)}
.moon-shadow{position:absolute;inset:-2px;border-radius:50%;background:#0b0713;
  transform:translateX(-60%)}
.moon-cap{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.moon-cap b{display:block;color:var(--turq);font-size:.82rem;letter-spacing:.08em;margin-top:.15rem}

/* drag ipucu */
.sky-hint{position:absolute;left:50%;bottom:clamp(14px,3vh,26px);transform:translateX(-50%);
  z-index:2;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dust);
  display:flex;align-items:center;gap:.5rem;opacity:calc(1 - var(--dawn)*2)}
.sky-hint .rot{display:inline-block;width:16px;height:16px;border:1px solid var(--dust);
  border-radius:50%;border-top-color:transparent;animation:spin 3.2s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ============================================================================
   Generic section shell
   ========================================================================== */
.band{padding:clamp(64px,11vh,140px) 0}
.band-head{max-width:60ch;margin-bottom:clamp(32px,5vh,60px)}
.band-head h2{font-size:clamp(2rem,4.4vw,3.3rem);margin-bottom:1rem}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line-strong),transparent)}

/* reveal-on-scroll */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

/* ---- night programme (timeline) ---- */
.prog{display:grid;gap:0}
.prog li{display:grid;grid-template-columns:96px 1fr;gap:clamp(1rem,3vw,2.4rem);
  padding:1.7rem 0;border-top:1px solid var(--line);position:relative}
.prog li:last-child{border-bottom:1px solid var(--line)}
.prog .t{font-variant-numeric:tabular-nums;font-weight:700;color:var(--turq);
  font-size:1.05rem;letter-spacing:.02em}
.prog h3{font-size:1.4rem;margin-bottom:.5rem}
.prog p{color:var(--dust);margin:0;max-width:52ch}
.prog .ph{grid-column:1/-1;display:none}

/* ---- tent types ---- */
.tents{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1.4rem}
.tent{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:linear-gradient(180deg,var(--panel),#0d0818);
  display:flex;flex-direction:column;transition:transform .25s ease,border-color .25s ease}
.tent:hover{transform:translateY(-4px);border-color:var(--nebula)}
/* CSS gradient placeholder — medyasız da tamamlanmış görünür */
.tent-fig{aspect-ratio:4/3;position:relative;overflow:hidden}
.tent-fig[data-ph]::after{content:attr(data-ph);position:absolute;left:12px;bottom:10px;
  font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(237,228,211,.55)}
.ph-a{background:
  radial-gradient(60% 90% at 50% 120%,rgba(55,224,196,.28),transparent 60%),
  radial-gradient(1px 1px at 30% 30%,#fff,transparent),
  radial-gradient(1px 1px at 70% 20%,#fff,transparent),
  radial-gradient(1.4px 1.4px at 50% 45%,#fff,transparent),
  linear-gradient(180deg,#1a1030,#0c0718)}
.ph-b{background:
  radial-gradient(70% 80% at 70% 120%,rgba(123,92,255,.34),transparent 60%),
  radial-gradient(1px 1px at 20% 24%,#fff,transparent),
  radial-gradient(1.3px 1.3px at 62% 34%,#fff,transparent),
  linear-gradient(180deg,#150c26,#0b0616)}
.ph-c{background:
  radial-gradient(80% 70% at 30% 120%,rgba(255,185,120,.24),transparent 55%),
  radial-gradient(1px 1px at 40% 22%,#fff,transparent),
  radial-gradient(1.2px 1.2px at 78% 30%,#fff,transparent),
  linear-gradient(180deg,#1c1226,#0c0716)}
.tent-fig .glyph{position:absolute;inset:0;display:grid;place-items:center;opacity:.9}
.tent-body{padding:1.3rem 1.35rem 1.5rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.tent-body h3{font-size:1.35rem}
.tent-body .cap{color:var(--dust);font-size:.92rem;margin:0}
.tent-meta{margin-top:auto;display:flex;align-items:baseline;justify-content:space-between;
  padding-top:1rem;border-top:1px solid var(--line);gap:1rem}
.tent-meta .price{font-family:var(--display);font-weight:700;color:var(--sand);font-size:1.5rem}
.tent-meta .price small{font-family:var(--body);font-weight:400;color:var(--dust);font-size:.72rem;
  letter-spacing:.04em}
.tent-meta .cnt{font-size:.82rem;color:var(--turq)}

/* ---- location & sky quality (Bortle) ---- */
.loc{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.bortle{border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;background:var(--panel)}
.bortle h3{font-size:1.15rem;margin-bottom:1.1rem}
.bortle-scale{height:20px;border-radius:999px;
  background:linear-gradient(90deg,#05040a,#0b0713 22%,#1a1030 44%,#3a2f66 64%,#7f7bb0 82%,#d9d6ea);
  position:relative;margin-bottom:.6rem}
.bortle-scale .marker{position:absolute;top:50%;left:16%;width:16px;height:16px;
  transform:translate(-50%,-50%);border-radius:50%;background:var(--turq);
  border:2px solid #06040c;box-shadow:0 0 0 3px rgba(55,224,196,.35),0 0 16px var(--turq)}
.bortle-ends{display:flex;justify-content:space-between;font-size:.72rem;color:var(--dust);
  letter-spacing:.06em}
.bortle .note{margin-top:1.1rem;color:var(--dust);font-size:.9rem}
.loc-facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:1.6rem}
.loc-facts div{background:var(--bg);padding:1.1rem 1.2rem}
.loc-facts dt{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.loc-facts dd{margin:.35rem 0 0;font-family:var(--display);font-weight:700;font-size:1.6rem;color:var(--turq)}

/* ---- ambience video band ---- */
.ambience{position:relative;min-height:52vh;display:grid;place-items:center;
  overflow:hidden;text-align:center;border-block:1px solid var(--line)}
.ambience video,.ambience .poster{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;z-index:-2}
.ambience::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(11,7,19,.62),rgba(11,7,19,.82))}
.ambience blockquote{margin:0;max-width:22ch;font-family:var(--display);font-weight:700;
  font-size:clamp(1.7rem,4vw,3rem);line-height:1.12;padding:2rem 1rem}
.ambience cite{display:block;margin-top:1rem;font-family:var(--body);font-style:normal;
  font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--turq)}

/* ---- testimonials ---- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.4rem}
.quote{border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;background:var(--panel);
  display:flex;flex-direction:column;gap:.9rem}
.quote .stars{color:var(--turq);letter-spacing:.14em;font-size:.9rem}
.quote p{color:var(--sand);margin:0;font-size:1.02rem}
.quote .who{margin-top:auto;color:var(--dust);font-size:.85rem}
.quote .who b{color:var(--sand);font-weight:700;display:block}

/* ---- FAQ ---- */
.faq{max-width:820px}
.faq details{border-top:1px solid var(--line);padding:.35rem 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:1.15rem .5rem 1.15rem 0;
  display:flex;justify-content:space-between;gap:1.5rem;align-items:center;
  font-family:var(--display);font-weight:700;font-size:1.15rem;color:var(--sand)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ico{flex:0 0 auto;width:26px;height:26px;position:relative;color:var(--turq)}
.faq summary .ico::before,.faq summary .ico::after{content:"";position:absolute;
  background:currentColor;top:50%;left:50%;transition:transform .25s ease}
.faq summary .ico::before{width:14px;height:2px;transform:translate(-50%,-50%)}
.faq summary .ico::after{width:2px;height:14px;transform:translate(-50%,-50%)}
.faq details[open] summary .ico::after{transform:translate(-50%,-50%) scaleY(0)}
.faq .ans{padding:0 .5rem 1.3rem 0;color:var(--dust);max-width:66ch}
.faq .ans p{margin:0}

/* ---- reservation ---- */
.reserve{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.reserve-copy h2{font-size:clamp(2rem,4.4vw,3.1rem);margin-bottom:1rem}
.trust{margin-top:1.6rem;display:grid;gap:.7rem}
.trust li{display:flex;gap:.7rem;align-items:flex-start;color:var(--dust);font-size:.94rem}
.trust li .tick{flex:0 0 auto;color:var(--turq);margin-top:.15rem}
form.book{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(1.4rem,3vw,2rem);display:grid;gap:1.1rem}
.book .row{display:grid;gap:1.1rem;grid-template-columns:1fr 1fr}
.book label{display:flex;flex-direction:column;gap:.4rem;font-size:.8rem;
  letter-spacing:.06em;color:var(--dust)}
.book label .req{color:var(--turq)}
.book input,.book select{font-family:var(--body);font-size:1rem;color:var(--sand);
  background:#0d0818;border:1px solid var(--line-strong);border-radius:12px;
  padding:.75rem .85rem;min-height:48px;color-scheme:dark;width:100%}
.book input:hover,.book select:hover{border-color:var(--nebula)}
.book input::placeholder{color:rgba(185,166,201,.5)}
.book .btn-primary{margin-top:.3rem}
.book .fineprint{font-size:.78rem;color:var(--dust);text-align:center;margin:0}
.book-done{display:none;background:rgba(55,224,196,.1);border:1px solid var(--turq);
  border-radius:12px;padding:1rem;color:var(--sand);font-size:.92rem}
.book-done.show{display:block}

/* ============================================================================
   FOOTER
   ========================================================================== */
.foot{border-top:1px solid var(--line);padding:clamp(48px,8vh,90px) 0 2.5rem;
  background:linear-gradient(180deg,#0b0713,#0d0819)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.4rem;margin-bottom:3rem}
.foot h4{font-size:1.3rem;margin-bottom:.8rem}
.foot p{color:var(--dust);max-width:34ch;font-size:.92rem}
.foot .col h5{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--turq);
  margin:0 0 1rem;font-family:var(--body);font-weight:500}
.foot .col a{display:block;color:var(--dust);text-decoration:none;padding:.28rem 0;font-size:.92rem}
.foot .col a:hover{color:var(--sand)}
.foot-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;
  padding-top:1.6rem;border-top:1px solid var(--line);color:var(--dust);font-size:.8rem}
.foot-base a{color:var(--dust)}

/* mobil yapışkan CTA */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;
  align-items:center;justify-content:space-between;gap:.8rem;
  padding:.7rem clamp(16px,5vw,20px) calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(9,6,17,.94);border-top:1px solid var(--line);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.mbar .from{font-size:.82rem;color:var(--dust)}
.mbar .from b{display:block;font-family:var(--display);color:var(--sand);font-size:1.2rem}
.mbar .btn{min-height:46px;padding:.6rem 1.2rem}

/* ============================================================================
   /rehber sayfası
   ========================================================================== */
.doc{max-width:760px;margin-inline:auto;padding:clamp(96px,14vh,150px) 0 6rem}
.doc h1{font-size:clamp(2.2rem,5.5vw,3.6rem);margin-bottom:1rem}
.doc h2{font-size:clamp(1.4rem,3vw,2rem);margin:2.6rem 0 1rem}
.doc p{color:var(--dust)}
.doc .lede{font-size:1.15rem;color:var(--sand);max-width:60ch}
.doc ul.bul{margin:0 0 1.4rem;display:grid;gap:.7rem}
.doc ul.bul li{display:flex;gap:.7rem;color:var(--dust)}
.doc ul.bul li .tick{color:var(--turq);flex:0 0 auto}
.doc .back{display:inline-flex;align-items:center;gap:.5rem;margin-top:2.5rem;
  color:var(--turq-lite);text-decoration:none;font-weight:500}
.doc .tag{display:inline-block;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--turq);border:1px solid var(--line-strong);border-radius:999px;padding:.4rem .9rem;
  margin-bottom:1.5rem}

/* ============================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:900px){
  .nav-links{position:fixed;inset:0 0 auto 0;top:0;flex-direction:column;gap:0;
    padding:5rem 1.5rem 2rem;background:rgba(9,6,17,.98);
    transform:translateY(-102%);transition:transform .35s ease;height:auto;
    border-bottom:1px solid var(--line)}
  .nav-links.open{transform:none}
  .nav-links a{width:100%;padding:1rem 0;border-bottom:1px solid var(--line);font-size:1.05rem;
    display:flex;align-items:center;min-height:52px}
  .nav-links .nav-cta{text-align:center;margin-top:1rem;justify-content:center;width:100%}
  .nav-toggle{display:grid;place-items:center}
  .brand{min-height:44px}
  .foot .col a{min-height:44px;display:flex;align-items:center;padding:.4rem 0}
  .foot-base{align-items:center}
  .foot-base a,.doc .back{display:inline-flex;align-items:center;min-height:44px;padding:.35rem 0}
  .loc,.reserve{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:1.8rem}
  .foot h4{grid-column:1/-1}
  .mbar{display:flex}
  body{padding-bottom:70px}
  .moon{width:104px;top:76px}
  .moon-disc{width:66px;height:66px}
}
@media (max-width:560px){
  .prog li{grid-template-columns:1fr;gap:.4rem}
  .prog .t{font-size:.95rem}
  .book .row{grid-template-columns:1fr}
  .loc-facts{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr}
  .hero h1{font-size:clamp(2.5rem,10vw,3.4rem)}
  .moon{position:static;margin:0 0 1.2rem;width:auto;display:flex;align-items:center;gap:.9rem;text-align:left}
  .moon-disc{margin:0}
  .hero{align-items:flex-end}
}

/* ============================================================================
   REDUCED MOTION — imza korunur (statik çizilir), hareket durur
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  .sky-hint .rot{animation:none}
}
