/*
Theme Name: Mountain Descent
Theme URI: https://www.emircandumoglu.com/mountain
Author: Emircan Dumoğlu
Description: A cinematic mountain/adventure theme with scroll-driven animations.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mountain-descent
*/

*{margin:0;padding:0;box-sizing:border-box;}
html,body{width:100%;height:100%;overflow:hidden;}
body{
  background:#000;
  color:#efe7db;
  font-family:"Inter",sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;}
button{font:inherit;border:none;background:none;}

:root{
  --bg0:#020304;
  --bg1:#060a11;
  --bg2:#0c1725;
  --bg3:#17283a;
  --bg4:#1f342b;
  --text:#efe7db;
  --textDim:rgba(239,231,219,.60);
}

/* loader */
#loader{
  position:fixed;inset:0;z-index:500;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 40%,#0a101a 0%,#020304 58%);
  transition:opacity 1.2s ease,visibility 1.2s ease;
}
#loader.hidden{opacity:0;visibility:hidden;pointer-events:none;}
.loaderInner{text-align:center;}
.loaderEyebrow{
  margin-bottom:18px;
  font-size:10px;
  letter-spacing:.32em;
  text-transform:capitalize;
  color:rgba(239,231,219,.18);
}
.loaderWord{
  margin-bottom:24px;
  font-family:"Cormorant Garamond",serif;
  font-size:42px;
  font-weight:300;
  letter-spacing:.06em;
  text-transform:capitalize;
  color:rgba(239,231,219,.30);
}
.loaderLine{
  position:relative;
  width:180px;height:1px;
  background:rgba(239,231,219,.08);
  overflow:hidden;
}
.loaderFill{
  width:0%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(239,231,219,.78),transparent);
}
.loaderCount{
  margin-top:14px;
  font-size:10px;
  letter-spacing:.34em;
  color:rgba(239,231,219,.14);
}

/* scroll */
#scrollDriver{
  position:fixed;inset:0;z-index:499;
  overflow-y:auto;overflow-x:hidden;
  scrollbar-width:none;
  pointer-events:none;
}
#scrollDriver::-webkit-scrollbar{display:none;}
#scrollSpace{height:310vh;pointer-events:none;}

/* scene */
#sceneRoot{
  position:fixed;inset:0;
  z-index:20;
  overflow:hidden;
  pointer-events:none;
}

.sceneBg,
.sceneGlow,
.sceneVignette,
.sceneNoise,
#heroStage,
#heroImageWrap,
#heroImage,
.heroShade,
#darkSystem,
#heroCopy,
#scrollHint{
  pointer-events:none;
}

.sceneBg{
  position:absolute;inset:0;
  background:linear-gradient(to bottom,var(--bg0) 0%,var(--bg1) 12%,var(--bg2) 30%,var(--bg3) 52%,var(--bg4) 74%,#111912 86%,#090b09 100%);
  transform:scale(1.02);
}
.sceneGlow{
  position:absolute;inset:0;opacity:0;
  background:
    radial-gradient(ellipse at 50% 12%,rgba(130,150,185,.12) 0%,transparent 34%),
    radial-gradient(ellipse at 50% 66%,rgba(92,130,92,.08) 0%,transparent 30%);
}
.sceneVignette{
  position:absolute;inset:0;z-index:4;
  background:
    radial-gradient(circle at center,transparent 34%,rgba(0,0,0,.28) 100%),
    linear-gradient(to bottom,rgba(0,0,0,.42) 0%,transparent 14%,transparent 78%,rgba(0,0,0,.52) 100%);
}
.sceneNoise{
  position:absolute;inset:0;z-index:5;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px 180px;
}

/* hero */
#heroStage{position:absolute;inset:0;z-index:10;}
#heroImageWrap{position:absolute;inset:0;overflow:hidden;z-index:1;}
#heroImage{
  position:absolute;left:0;top:0;width:100%;height:235%;
  object-fit:cover;object-position:center top;
  transform:translate3d(0,0,0) scale(1.08);
  will-change:transform;
  filter:brightness(.82) saturate(.92) contrast(1.04);
}
.heroShade{
  position:absolute;inset:0;z-index:2;
  background:linear-gradient(to bottom,rgba(3,5,10,.32) 0%,rgba(3,5,10,.08) 18%,rgba(3,5,10,.02) 40%,rgba(3,5,10,.08) 72%,rgba(3,5,10,.40) 100%);
}

/* dark system */
#darkSystem{
  position:absolute;inset:0;z-index:8;
  overflow:hidden;
  transition:opacity .6s ease;
}
#darkSystem.revealed{opacity:0;}
.darkLayer{position:absolute;inset:0;will-change:transform,opacity,filter;}
.darkGlobal{background:rgba(0,0,0,.96);}
.darkLift{
  background:linear-gradient(to bottom,rgba(0,0,0,.98) 0%,rgba(0,0,0,.92) 22%,rgba(0,0,0,.76) 44%,rgba(0,0,0,.38) 66%,transparent 100%);
  filter:blur(24px);
}
.darkCenter{
  inset:-8%;
  background:radial-gradient(ellipse at 50% 44%,rgba(0,0,0,.78) 0%,rgba(0,0,0,.54) 26%,rgba(0,0,0,.22) 48%,transparent 72%);
  filter:blur(54px);
}
.darkTexture{
  inset:-8%;
  background:
    radial-gradient(ellipse at 24% 36%,rgba(255,255,255,.03) 0%,transparent 42%),
    radial-gradient(ellipse at 78% 42%,rgba(255,255,255,.02) 0%,transparent 36%),
    radial-gradient(ellipse at 52% 62%,rgba(255,255,255,.015) 0%,transparent 34%);
  mix-blend-mode:soft-light;opacity:.45;filter:blur(28px);
}
.darkResidual{
  inset:-4%;
  background:
    radial-gradient(ellipse at 50% 14%,rgba(0,0,0,.88) 0%,rgba(0,0,0,.60) 24%,rgba(0,0,0,.20) 44%,transparent 72%),
    linear-gradient(to bottom,rgba(0,0,0,.38) 0%,transparent 30%,transparent 72%,rgba(0,0,0,.18) 100%);
  filter:blur(30px);
}

/* hero copy */
#heroCopy{
  position:absolute;top:50%;left:50%;z-index:20;
  width:min(1040px,calc(100vw - 48px));
  transform:translate(-50%,-50%);
  text-align:center;opacity:0;
  will-change:transform,opacity,filter;
}
.heroEyebrow{
  margin-bottom:20px;
  font-size:11px;
  letter-spacing:.52em;
  text-transform:uppercase;
  color:rgba(239,231,219,.34);
}
#heroCopy h1{
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(54px,7vw,112px);
  font-weight:400;
  line-height:.94;
  letter-spacing:.01em;
  text-transform:capitalize;
  color:rgba(239,231,219,.96);
  text-shadow:0 10px 42px rgba(0,0,0,.46),0 0 80px rgba(0,0,0,.24);
}
#heroCopy p{
  width:min(560px,calc(100vw - 80px));
  margin:22px auto 0;
  font-size:clamp(13px,1.1vw,16px);
  font-weight:300;
  line-height:1.8;
  letter-spacing:.04em;
  text-transform:capitalize;
  color:var(--textDim);
}

/* scroll hint */
#scrollHint{
  position:absolute;bottom:34px;left:50%;z-index:22;
  transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:10px;
  opacity:0;
}
#scrollHint span{
  font-size:9px;
  letter-spacing:.42em;
  text-transform:capitalize;
  color:rgba(239,231,219,.46);
}
#scrollHint i{
  position:relative;
  display:block;width:1px;height:36px;
  background:linear-gradient(to bottom,rgba(239,231,219,.62),transparent);
  overflow:hidden;
}
#scrollHint i::after{
  content:"";
  position:absolute;top:-100%;left:0;width:100%;height:100%;
  background:rgba(239,231,219,.82);
  animation:hintFlow 2.2s ease-in-out infinite;
}
@keyframes hintFlow{
  0%{top:-100%;opacity:0;}
  24%{opacity:1;}
  100%{top:100%;opacity:0;}
}

/* gallery */
#galleryStage{
  position:absolute;left:0;right:0;bottom:0;height:74vh;z-index:38;
  opacity:0;transform:translate3d(0,52%,0);
  will-change:transform,opacity;
  pointer-events:none;
}
.galleryHead{
  position:absolute;left:50%;top:0;transform:translateX(-50%);
  text-align:center;z-index:8;pointer-events:none;
}
.galleryEyebrow{
  margin-bottom:6px;
  font-size:10px;
  letter-spacing:.40em;
  text-transform:uppercase;
  color:rgba(239,231,219,.28);
}
.galleryHead h2{
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(40px,4.8vw,78px);
  font-weight:400;
  line-height:1;
  text-transform:capitalize;
  color:rgba(239,231,219,.9);
}
#galleryViewport{
  position:absolute;left:0;right:0;bottom:0;height:64vh;
  overflow:hidden;
  pointer-events:auto;
  transition:filter .24s ease;
}
#galleryViewport.is-hovered{
  filter:drop-shadow(0 0 30px rgba(255,255,255,.06));
}
#galleryStack{
  position:absolute;
  left:50%;top:54%;
  width:100%;height:100%;
  transform:translate(-50%,-50%);
}
.galleryCard{
  position:absolute;
  left:50%;top:50%;
  width:min(38vw,620px);
  height:min(44vh,400px);
  margin-left:calc(min(38vw,620px) / -2);
  margin-top:calc(min(44vh,400px) / -2);
  transform-origin:center center;
  transition:
    transform .65s cubic-bezier(.22,1,.36,1),
    opacity .65s ease,
    filter .65s ease;
  pointer-events:auto;
  cursor:pointer;
}
.galleryCardInner{
  position:absolute;inset:0;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
  background:linear-gradient(160deg,rgba(28,36,48,.92),rgba(10,14,20,.96));
}
.galleryCardImage{
  position:absolute;inset:0;
  background-size:cover;
  background-position:center center;
  transform:scale(1.02);
}
.galleryCardInner::before{
  content:"";
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(135deg,rgba(255,255,255,.05) 0%,transparent 48%);
}
.galleryCardOverlay{
  display:none;
}
.galleryCardMeta{
  display:none;
}
.galleryCard:hover .galleryCardInner{
  border-color:rgba(255,255,255,.14);
}

/* modal */
#galleryModal{
  position:fixed;inset:0;z-index:600;
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .36s ease,visibility .36s ease;
}
#galleryModal.open{opacity:1;visibility:visible;pointer-events:auto;}
.modalBackdrop{
  position:absolute;inset:0;
  background:rgba(3,5,10,.58);
  backdrop-filter:blur(20px);
}
.modalInner{
  position:relative;z-index:2;
  display:flex;align-items:center;justify-content:center;
  width:min(94vw,1040px);
  height:min(88vh,900px);
}
.modalClose{
  position:absolute;top:10px;right:10px;
  width:48px;height:48px;border-radius:50%;
  background:rgba(255,255,255,.08);
  color:rgba(239,231,219,.92);
  font-size:28px;line-height:1;
  backdrop-filter:blur(8px);
  cursor:pointer;
}
.modalCard{
  position:relative;
  width:min(72vw,720px);
  height:min(76vh,760px);
  border-radius:28px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 40px 120px rgba(0,0,0,.62);
}
.modalImage{
  position:absolute;inset:0;
  background-size:cover;
  background-position:center center;
}
.modalShade{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.74) 0%,rgba(0,0,0,.20) 42%,transparent 62%);
}
.modalMeta{
  position:absolute;left:28px;right:28px;bottom:28px;z-index:4;
}
.modalMeta span{
  display:block;
  margin-bottom:6px;
  font-size:10px;
  letter-spacing:.36em;
  color:rgba(239,231,219,.42);
}
.modalMeta h3{
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(40px,4.4vw,56px);
  font-weight:400;
  line-height:1;
  text-transform:capitalize;
  color:rgba(239,231,219,.96);
}

/* responsive */
@media (max-width:1100px){
  #heroImage{height:245%;}
  .galleryCard{
    width:min(42vw,520px);
    margin-left:calc(min(42vw,520px) / -2);
  }
}
@media (max-width:780px){
  #heroCopy{width:calc(100vw - 34px);}
  #heroCopy h1{font-size:clamp(44px,12vw,74px);}
  #heroCopy p{width:calc(100vw - 48px);font-size:14px;}
  #galleryViewport{height:58vh;}
  #galleryStage{height:78vh;}
  #galleryStack{top:54%;}
  .galleryCard{
    width:min(72vw,460px);
    height:min(42vh,320px);
    margin-left:calc(min(72vw,460px) / -2);
    margin-top:calc(min(42vh,320px) / -2);
  }
  .galleryCardTitle{font-size:26px;}
  .modalCard{width:min(92vw,620px);height:min(70vh,580px);}
  /* hint: swipe gallery left/right */
  #galleryViewport::after{
    content:"swipe to browse";
    position:absolute;bottom:12px;left:50%;transform:translateX(-50%);
    font-size:9px;letter-spacing:.32em;text-transform:uppercase;
    color:rgba(239,231,219,.22);pointer-events:none;white-space:nowrap;
  }
}
@media (max-width:560px){
  .galleryHead h2{font-size:clamp(36px,11vw,52px);}
  .galleryCard{
    width:min(80vw,340px);
    height:min(44vw,260px);
    margin-left:calc(min(80vw,340px) / -2);
    margin-top:calc(min(44vw,260px) / -2);
  }
  .galleryCardMeta{left:18px;right:18px;bottom:16px;}
  .galleryCardTitle{font-size:20px;}
}
/* ═══════════════════════════════════════════════════
   EXTENDED SECTIONS — continuation after gallery
   ═══════════════════════════════════════════════════ */

/* scroll space extended */

/* ─── shared pointer-events for new sections ─── */
#personStage,
#expeditionsStage,
#numbersStage,
#notesStage,
#carryStage,
#siteFooter {
  pointer-events: none;
}
#siteFooter .footerForm,
#siteFooter .footerInput,
#siteFooter .footerBtn,
.expeditionRow,
.carryCol,
.footerLink {
  pointer-events: auto;
}

/* ══════════════════════
   Section 1 — Person
   ══════════════════════ */
#personStage {
  position: absolute;
  inset: 0;
  z-index: 32;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  will-change: transform, opacity, filter;
}

.personSilhouette {
  position: absolute;
  left: 5%;
  top: 0;
  bottom: 0;
  width: 44%;
  display: flex;
  align-items: center;
  pointer-events: none;
}
.personSilhouette img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  opacity: .30;
  filter: grayscale(1) contrast(.88);
  mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.6) 30%, rgba(0,0,0,.8) 60%, transparent 100%),
              linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.9) 12%, rgba(0,0,0,.9) 88%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.6) 30%, rgba(0,0,0,.8) 60%, transparent 100%),
                      linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.9) 12%, rgba(0,0,0,.9) 88%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}

.personContent {
  position: relative;
  z-index: 2;
  max-width: 640px;
  width: min(640px, calc(100vw - 64px));
  padding: 0 32px 0 0;
  margin-left: auto;
  margin-right: 10%;
  box-sizing: border-box;
}
.personQuote {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: clamp(22px, 2.4vw, 32px);
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: .01em;
  color: rgba(239,231,219,.88);
  margin-bottom: 28px;
}
.personName {
  font-family: "Inter", sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: rgba(239,231,219,.54);
  margin-bottom: 12px;
}
.personDescriptors {
  font-family: "Inter", sans-serif;
  font-size: 10px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(239,231,219,.38);
}
.personDescriptors span {
  margin: 0 6px;
  opacity: .5;
}

/* ══════════════════════
   Section 2 — Expeditions
   ══════════════════════ */
#expeditionsStage {
  position: absolute;
  inset: 0;
  z-index: 33;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  will-change: transform, opacity;
}
.expeditionsBg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  filter: blur(8px);
  transition: opacity .7s ease, filter .7s ease;
  z-index: 0;
}
.expeditionsInner {
  position: relative;
  z-index: 2;
  width: min(900px, calc(100vw - 64px));
}
.expeditionsEyebrow {
  font-size: 10px;
  letter-spacing: .40em;
  text-transform: uppercase;
  color: rgba(239,231,219,.28);
  margin-bottom: 10px;
}
.expeditionsTitle {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(36px, 4.4vw, 64px);
  font-weight: 400;
  letter-spacing: .01em;
  text-transform: capitalize;
  color: rgba(239,231,219,.90);
  margin-bottom: 6px;
}
.expeditionsSub {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 300;
  letter-spacing: .04em;
  color: rgba(239,231,219,.38);
  margin-bottom: 48px;
}
.expeditionsList {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.expeditionRow {
  display: grid;
  grid-template-columns: 1fr auto auto auto 1fr;
  align-items: baseline;
  gap: 16px 20px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
  cursor: default;
  opacity: 0;
  transform: translateY(22px);
  transition: border-color .3s ease;
  will-change: opacity, transform;
}
.expeditionRow:first-child {
  border-top: 1px solid rgba(255,255,255,.06);
}
.expeditionRow:hover {
  border-bottom-color: rgba(255,255,255,.14);
}
.expPlace {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 400;
  letter-spacing: .01em;
  color: rgba(239,231,219,.88);
}
.expSep {
  font-family: "Inter", sans-serif;
  font-size: 11px;
  letter-spacing: .12em;
  color: rgba(239,231,219,.22);
}
.expDate {
  font-family: "Inter", sans-serif;
  font-size: 11px;
  font-weight: 300;
  letter-spacing: .28em;
  color: rgba(239,231,219,.44);
}
.expNote {
  font-family: "Inter", sans-serif;
  font-style: italic;
  font-size: 13px;
  font-weight: 300;
  color: rgba(239,231,219,.52);
  letter-spacing: .02em;
  text-align: right;
}

/* ══════════════════════
   Section 3 — Numbers
   ══════════════════════ */
#numbersStage {
  position: absolute;
  inset: 0;
  z-index: 34;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  will-change: opacity, transform;
}
.numbersInner {
  position: relative;
  width: min(1100px, calc(100vw - 48px));
}
.numbersMtnSvg {
  position: absolute;
  bottom: -24px;
  left: 0;
  right: 0;
  width: 100%;
  height: auto;
  pointer-events: none;
}
.numbersGrid {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
}
.numberBlock {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 48px 32px;
  text-align: center;
}
.numberDivider {
  width: 1px;
  height: 90px;
  background: rgba(239,231,219,.08);
  flex-shrink: 0;
}
.numberVal {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(64px, 8vw, 120px);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.02em;
  color: rgba(239,231,219,.92);
}
.numberLabel {
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 300;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(239,231,219,.52);
  line-height: 1.7;
}

/* ══════════════════════
   Section 4 — Notes
   ══════════════════════ */
#notesStage {
  position: absolute;
  inset: 0;
  z-index: 35;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  will-change: opacity, transform;
}
.notesInner {
  width: min(1080px, calc(100vw - 48px));
}
.notesEyebrow {
  font-size: 10px;
  letter-spacing: .40em;
  text-transform: uppercase;
  color: rgba(239,231,219,.28);
  margin-bottom: 8px;
}
.notesTitle {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(28px, 3vw, 44px);
  font-weight: 400;
  letter-spacing: .01em;
  text-transform: capitalize;
  color: rgba(239,231,219,.90);
  margin-bottom: 4px;
}
.notesSub {
  font-size: 12px;
  font-weight: 300;
  letter-spacing: .04em;
  color: rgba(239,231,219,.38);
  margin-bottom: 24px;
}
.notesGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.noteCard {
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding: 22px 28px;
  opacity: 0;
  will-change: opacity, transform;
  transition: border-color .4s ease;
}
.noteCard:hover {
  border-color: rgba(255,255,255,.12);
}
.noteCard--left {
  transform: translateX(-42px);
}
.noteCard--right {
  transform: translateX(42px);
}
.noteTitle{
  font-family:"Inter",sans-serif;
  font-size:10px;
  font-weight:400;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:rgba(239,231,219,.34);
  margin-bottom:14px;
}
.noteText {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: clamp(15px, 1.4vw, 20px);
  font-weight: 300;
  line-height: 1.65;
  color: rgba(239,231,219,.82);
  margin-bottom: 14px;
}
.notePlace {
  font-family: "Inter", sans-serif;
  font-size: 10px;
  font-weight: 300;
  letter-spacing: .42em;
  text-transform: uppercase;
  color: rgba(239,231,219,.32);
}

/* ══════════════════════
   Section 5 — Carry
   ══════════════════════ */
#carryStage {
  position: absolute;
  inset: 0;
  z-index: 36;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  will-change: opacity, transform;
}
.carryInner {
  width: min(960px, calc(100vw - 48px));
}
.carryEyebrow {
  font-size: 10px;
  letter-spacing: .40em;
  text-transform: uppercase;
  color: rgba(239,231,219,.28);
  margin-bottom: 10px;
}
.carryTitle {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(34px, 4vw, 58px);
  font-weight: 400;
  letter-spacing: .01em;
  text-transform: capitalize;
  color: rgba(239,231,219,.90);
  margin-bottom: 6px;
}
.carrySub {
  font-size: 13px;
  font-weight: 300;
  letter-spacing: .04em;
  color: rgba(239,231,219,.38);
  margin-bottom: 48px;
}
.carryGrid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
}
.carryCol {
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 18px;
  padding: 32px 28px 36px;
  opacity: 0;
  will-change: opacity, transform;
  transition: border-color .4s ease;
  cursor: default;
}
.carryCol:hover {
  border-color: rgba(255,255,255,.14);
}
.carryColHead {
  font-family: "Inter", sans-serif;
  font-size: 10px;
  letter-spacing: .44em;
  text-transform: uppercase;
  color: rgba(239,231,219,.30);
  margin-bottom: 24px;
}
.carryList {
  list-style: none;
}
.carryList li {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 300;
  line-height: 2.2;
  letter-spacing: .03em;
  color: rgba(239,231,219,.68);
}
.carryList--never li {
  text-decoration: line-through;
  text-decoration-color: rgba(239,231,219,.28);
  opacity: .36;
}

/* ══════════════════════
   Footer (Next ile birleşik)
   ══════════════════════ */
#siteFooter {
  position: absolute;
  inset: 0;
  z-index: 37;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  will-change: opacity, transform;
}
.footerInner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-align: center;
  width: min(720px, calc(100vw - 64px));
}
.footerTagline {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(44px, 5.5vw, 84px);
  font-weight: 400;
  letter-spacing: .01em;
  color: rgba(239,231,219,.92);
  line-height: 1;
  margin-bottom: 16px;
}
.footerSub {
  font-family: "Inter", sans-serif;
  font-style: italic;
  font-size: 14px;
  font-weight: 300;
  letter-spacing: .04em;
  color: rgba(239,231,219,.42);
  margin-bottom: 44px;
}
.footerForm {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: 100%;
  margin-bottom: 48px;
}
.footerInput {
  width: 100%;
  max-width: 340px;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(239,231,219,.20);
  color: var(--text);
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 300;
  letter-spacing: .08em;
  padding: 10px 0;
  outline: none;
  text-align: center;
  transition: border-color .3s ease;
  pointer-events: auto;
}
.footerInput::placeholder {
  color: rgba(239,231,219,.26);
  letter-spacing: .08em;
}
.footerInput:focus {
  border-bottom-color: rgba(239,231,219,.50);
}
.footerBtn {
  font-family: "Inter", sans-serif;
  font-size: 10px;
  font-weight: 300;
  letter-spacing: .30em;
  text-transform: uppercase;
  color: rgba(239,231,219,.38);
  cursor: pointer;
  transition: color .3s ease;
  padding: 6px 0;
  pointer-events: auto;
}
.footerBtn:hover {
  color: rgba(239,231,219,.78);
}
.footerBtn:disabled {
  opacity: .45;
  cursor: default;
}
.footerNotifyMsg {
  margin: 10px 0 0;
  font-family: "Inter", sans-serif;
  font-size: 11px;
  font-weight: 300;
  letter-spacing: .06em;
  color: rgba(239,231,219,.55);
  min-height: 16px;
  transition: opacity .3s;
}
.footerNotifyMsg.is-error {
  color: rgba(255,160,130,.7);
}
.footerDivider {
  width: 40px;
  height: 1px;
  background: rgba(239,231,219,.12);
  margin-bottom: 28px;
}
.footerLinks {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
}
.footerLink {
  font-family: "Inter", sans-serif;
  font-size: 11px;
  font-weight: 300;
  letter-spacing: .38em;
  text-transform: uppercase;
  color: rgba(239,231,219,.36);
  text-decoration: none;
  transition: color .3s ease;
  pointer-events: auto;
}
.footerLink:hover {
  color: rgba(239,231,219,.72);
}
.footerLinkSep {
  color: rgba(239,231,219,.18);
  font-size: 12px;
}
.footerCredit {
  font-family: "Inter", sans-serif;
  font-size: 10px;
  font-weight: 300;
  letter-spacing: .22em;
  color: rgba(239,231,219,.12);
}

/* ── responsive ── */
@media (max-width: 820px) {
  /* Notes — 2 col korunuyor, küçük ekranda sığsın diye font ve padding küçüldü */
  .notesGrid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .noteCard--left, .noteCard--right { transform: none; }
  .noteCard { padding: 14px 16px; }
  .noteText { font-size: clamp(13px, 3.0vw, 16px); line-height: 1.52; margin-bottom: 10px; }
  .noteTitle { margin-bottom: 8px; }
  .notesSub { margin-bottom: 14px; }
  .notesTitle { font-size: clamp(20px, 3.8vw, 34px); }
  .notesInner { width: calc(100vw - 32px); }

  /* Carry — 3 col korunuyor, içerik sıkıştırıldı */
  .carryGrid { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
  .carryCol { padding: 14px 12px 18px; }
  .carrySub { margin-bottom: 16px; }
  .carryColHead { margin-bottom: 12px; font-size: 9px; letter-spacing: .36em; }
  .carryList li { font-size: 12px; line-height: 1.85; }
  .carryTitle { font-size: clamp(22px, 3.2vw, 40px); margin-bottom: 4px; }
  .carryInner { width: calc(100vw - 32px); }

  /* Expeditions */
  .expeditionRow { grid-template-columns: 1fr auto auto; gap: 10px 12px; padding: 14px 0; }
  .expeditionRow .expNote { display: none; }
  .expPlace { font-size: clamp(17px, 4vw, 22px); }

  /* Person — silhouette gizlenince içerik ortala */
  .personSilhouette { display: none; }
  .personContent {
    margin-left: auto;
    margin-right: auto;
    padding: 0 24px;
    text-align: center;
    max-width: min(560px, calc(100vw - 48px));
  }
}

@media (max-width: 560px) {
  /* Numbers — 2x2 grid */
  .numbersGrid { flex-wrap: wrap; gap: 0; }
  .numberDivider { display: none; }
  .numberBlock { flex: 0 0 50%; padding: 28px 12px; }
  .numberVal { font-size: clamp(48px, 13vw, 80px); }

  /* Gallery cards */
  .galleryCard {
    width: min(82vw, 340px);
    height: min(52vw, 260px);
    margin-left: calc(min(82vw, 340px) / -2);
    margin-top: calc(min(52vw, 260px) / -2);
  }

  /* Modal */
  .modalCard { width: 92vw; height: min(72vh, 500px); }
  .modalMeta h3 { font-size: clamp(28px, 8vw, 44px); }
  .modalClose { top: 6px; right: 6px; }

  /* Expeditions */
  .expeditionsSub { margin-bottom: 28px; }
  .expeditionRow { padding: 12px 0; gap: 8px 10px; }

  /* Notes — tek kolona geç */
  .notesGrid { grid-template-columns: 1fr; gap: 10px; }
  .noteCard { padding: 16px 18px; }
  .noteText { font-size: clamp(14px, 3.8vw, 17px); line-height: 1.6; }

  /* Carry — tek kolona geç */
  .carryGrid { grid-template-columns: 1fr; gap: 10px; }
  .carryCol { padding: 16px 18px 20px; }
  .carryList li { font-size: 13px; line-height: 2.0; }
  .carrySub { margin-bottom: 16px; }

  /* Footer */
  .footerTagline { font-size: clamp(36px, 10vw, 60px); }
  .footerLinks { gap: 10px; flex-wrap: wrap; justify-content: center; }
}

@media (max-width: 400px) {
  /* Very small screens */
  .numberBlock { flex: 0 0 50%; padding: 20px 8px; }
  .numberVal { font-size: 44px; }
  .personContent { padding: 0 16px; }
  .notesInner, .carryInner, .expeditionsInner { width: calc(100vw - 24px); }
  .noteCard { padding: 14px 14px; }
  .noteText { font-size: 13px; }
  .carryCol { padding: 14px 12px 16px; }
  .carryList li { font-size: 12px; line-height: 1.8; }
}
/* ═══════════════════════════════════════════════════
   STEPPED SCENES OVERRIDES
   ═══════════════════════════════════════════════════ */
#scrollSpace{height:310vh;}

#galleryStage.scene-controlled,
#personStage.scene-controlled,
#expeditionsStage.scene-controlled,
#numbersStage.scene-controlled,
#notesStage.scene-controlled,
#carryStage.scene-controlled,
#siteFooter.scene-controlled{
  transition:
    transform .78s cubic-bezier(.22,1,.36,1),
    opacity .58s ease,
    filter .58s ease,
    visibility 0s linear .78s;
  will-change:transform,opacity,filter;
}

#galleryStage.scene-controlled.is-active,
#personStage.scene-controlled.is-active,
#expeditionsStage.scene-controlled.is-active,
#numbersStage.scene-controlled.is-active,
#notesStage.scene-controlled.is-active,
#carryStage.scene-controlled.is-active,
#siteFooter.scene-controlled.is-active{
  visibility:visible;
  opacity:1;
  filter:blur(0);
  transform:translate3d(0,0,0);
  transition-delay:0s;
}

#galleryStage.scene-controlled.is-hidden-scene,
#personStage.scene-controlled.is-hidden-scene,
#expeditionsStage.scene-controlled.is-hidden-scene,
#numbersStage.scene-controlled.is-hidden-scene,
#notesStage.scene-controlled.is-hidden-scene,
#carryStage.scene-controlled.is-hidden-scene,
#siteFooter.scene-controlled.is-hidden-scene{
  /* visibility delay kaldırıldı — eski .78s delay ghosting'in kaynağıydı */
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  filter:blur(10px);
  transition:
    transform .78s cubic-bezier(.22,1,.36,1),
    opacity .58s ease,
    filter .58s ease,
    visibility 0s linear 0s;
}

#galleryStage.scene-controlled.is-enter-from-down,
#personStage.scene-controlled.is-enter-from-down,
#expeditionsStage.scene-controlled.is-enter-from-down,
#numbersStage.scene-controlled.is-enter-from-down,
#notesStage.scene-controlled.is-enter-from-down,
#carryStage.scene-controlled.is-enter-from-down,
#siteFooter.scene-controlled.is-enter-from-down{
  visibility:visible;
  opacity:0;
  pointer-events:none;
  filter:blur(10px);
  transform:translate3d(0,78px,0);
}

#galleryStage.scene-controlled.is-enter-from-up,
#personStage.scene-controlled.is-enter-from-up,
#expeditionsStage.scene-controlled.is-enter-from-up,
#numbersStage.scene-controlled.is-enter-from-up,
#notesStage.scene-controlled.is-enter-from-up,
#carryStage.scene-controlled.is-enter-from-up,
#siteFooter.scene-controlled.is-enter-from-up{
  visibility:visible;
  opacity:0;
  pointer-events:none;
  filter:blur(10px);
  transform:translate3d(0,-78px,0);
}

#galleryStage.scene-controlled.is-leaving-up,
#personStage.scene-controlled.is-leaving-up,
#expeditionsStage.scene-controlled.is-leaving-up,
#numbersStage.scene-controlled.is-leaving-up,
#notesStage.scene-controlled.is-leaving-up,
#carryStage.scene-controlled.is-leaving-up,
#siteFooter.scene-controlled.is-leaving-up{
  visibility:visible;
  opacity:0;
  pointer-events:none;
  filter:blur(8px);
  transform:translate3d(0,-92px,0);
}

#galleryStage.scene-controlled.is-leaving-down,
#personStage.scene-controlled.is-leaving-down,
#expeditionsStage.scene-controlled.is-leaving-down,
#numbersStage.scene-controlled.is-leaving-down,
#notesStage.scene-controlled.is-leaving-down,
#carryStage.scene-controlled.is-leaving-down,
#siteFooter.scene-controlled.is-leaving-down{
  visibility:visible;
  opacity:0;
  pointer-events:none;
  filter:blur(8px);
  transform:translate3d(0,92px,0);
}

#personStage,
#expeditionsStage,
#numbersStage,
#notesStage,
#carryStage,
#siteFooter{
  visibility:hidden;
  opacity:0;
  transform:translate3d(0,56px,0);
  filter:blur(10px);
}

.personSilhouette,
.personContent,
.expeditionsHead,
.expeditionRow,
.numbersInner,
.numberBlock,
.notesHead,
.noteCard,
.carryHead,
.carryCol,
.footerInner{
  transition:
    transform .72s cubic-bezier(.22,1,.36,1),
    opacity .52s ease;
}

.personSilhouette,
.personContent,
.expeditionsHead,
.numbersInner,
.notesHead,
.carryHead,
.footerInner{
  opacity:0;
  transform:translateY(20px);
}

#personStage.is-active .personSilhouette,
#personStage.is-active .personContent,
#expeditionsStage.is-active .expeditionsHead,
#numbersStage.is-active .numbersInner,
#notesStage.is-active .notesHead,
#carryStage.is-active .carryHead,
#siteFooter.is-active .footerInner{
  opacity:1;
  transform:translateY(0);
}

#expeditionsStage .expeditionRow,
#numbersStage .numberBlock,
#carryStage .carryCol{
  opacity:0;
  transform:translateY(24px);
}

#notesStage .noteCard--left{opacity:0;transform:translateX(-34px);}
#notesStage .noteCard--right{opacity:0;transform:translateX(34px);}

#expeditionsStage.is-active .expeditionRow,
#numbersStage.is-active .numberBlock,
#carryStage.is-active .carryCol,
#notesStage.is-active .noteCard{
  opacity:1;
  transform:translate(0,0);
}

#expeditionsStage.is-active .expeditionRow:nth-child(1){transition-delay:.08s;}
#expeditionsStage.is-active .expeditionRow:nth-child(2){transition-delay:.14s;}
#expeditionsStage.is-active .expeditionRow:nth-child(3){transition-delay:.20s;}
#expeditionsStage.is-active .expeditionRow:nth-child(4){transition-delay:.26s;}
#expeditionsStage.is-active .expeditionRow:nth-child(5){transition-delay:.32s;}

#numbersStage.is-active .numberBlock:nth-child(1){transition-delay:.08s;}
#numbersStage.is-active .numberBlock:nth-child(3){transition-delay:.14s;}
#numbersStage.is-active .numberBlock:nth-child(5){transition-delay:.20s;}
#numbersStage.is-active .numberBlock:nth-child(7){transition-delay:.26s;}

#notesStage.is-active .noteCard:nth-child(1){transition-delay:.08s;}
#notesStage.is-active .noteCard:nth-child(2){transition-delay:.16s;}
#notesStage.is-active .noteCard:nth-child(3){transition-delay:.24s;}
#notesStage.is-active .noteCard:nth-child(4){transition-delay:.32s;}

#carryStage.is-active .carryCol:nth-child(1){transition-delay:.08s;}
#carryStage.is-active .carryCol:nth-child(2){transition-delay:.16s;}
#carryStage.is-active .carryCol:nth-child(3){transition-delay:.24s;}

#galleryStage.scene-controlled{
  transition:
    transform .50s cubic-bezier(.4,0,1,1),
    opacity .36s ease,
    filter .0s linear,
    visibility 0s linear .50s;
}

/* Gallery çıkarken blur yok — temiz opacity+translate exit */
#galleryStage.scene-controlled.is-leaving-up,
#galleryStage.scene-controlled.is-leaving-down{
  filter:blur(0);
  opacity:0;
  transform:translate3d(0,-72px,0);
  transition:
    transform .50s cubic-bezier(.4,0,1,1),
    opacity .36s ease,
    filter 0s linear,
    visibility 0s linear .50s;
}

/* Person enter: daha az blur, daha yakın başlangıç — temiz handoff */
#personStage.scene-controlled.is-enter-from-up{
  transform:translate3d(0,28px,0);
  filter:blur(0px);
  opacity:0;
}

/* ── touch / swipe drag indicator for gallery ── */
#galleryViewport {
  touch-action: pan-y;
  cursor: grab;
}
#galleryViewport:active {
  cursor: grabbing;
}

/* ── mobile noteCard: disable horizontal enter animation to prevent overflow ── */
@media (max-width: 820px) {
  #notesStage .noteCard--left,
  #notesStage .noteCard--right {
    transform: translateY(24px);
    overflow: hidden;
  }
  #notesStage.is-active .noteCard--left,
  #notesStage.is-active .noteCard--right {
    transform: translate(0, 0);
  }
  /* personContent centering override */
  .personContent {
    padding: 0 24px;
    margin-right: auto;
    text-align: center;
    width: calc(100vw - 48px);
    max-width: 520px;
  }
}

/* ── very small screens: prevent horizontal overflow globally ── */
@media (max-width: 480px) {
  #sceneRoot {
    overflow: hidden;
  }
  .expeditionsInner,
  .notesInner,
  .carryInner,
  .numbersInner {
    width: calc(100vw - 32px);
    overflow: hidden;
  }
  .personQuote {
    font-size: clamp(18px, 5.5vw, 26px);
  }
  .expeditionsTitle {
    font-size: clamp(28px, 8vw, 42px);
  }
}