/* =====================================================================
   THEME · TRAVEL & DOCUMENTARY FILM
   Immersive dark-mode. Edge-to-edge sliders + fluid motion.
   Scoped under body.theme-travel.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,300;12..96,400;12..96,500;12..96,700&family=Spectral:ital,wght@0,300;0,400;1,300;1,400&display=swap');

body.theme-travel {
  --night: #0a0c0f;
  --night-2: #11151a;
  --mist: #e7ecf0;
  --mute: #8b97a3;
  --line: rgba(231,236,240,0.12);
  --amber: #e8a33d;     /* warm Nairobi-light accent */
  --teal: #4fb6a8;

  background: var(--night);
  color: var(--mist);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
}
body.theme-travel h1, body.theme-travel h2,
body.theme-travel h3, body.theme-travel h4 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 500; letter-spacing: -0.02em; line-height: 1.04;
}
body.theme-travel .eyebrow {
  color: var(--amber); letter-spacing: .34em; font-weight: 500; font-size: .68rem; text-transform: uppercase;
}
body.theme-travel ::selection { background: var(--amber); color: var(--night); }

/* Header sits over dark imagery — keep it transparent + light until scrolled */
body.theme-travel .site-header { background: linear-gradient(180deg, rgba(10,12,15,0.65), transparent); border: 0; }
body.theme-travel .site-header.scrolled { background: rgba(10,12,15,0.9); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
body.theme-travel .nav__link { color: var(--mist); }
body.theme-travel .nav__link:hover, body.theme-travel .nav__link[aria-current="page"] { color: var(--amber); }
body.theme-travel .logo__name { color: var(--mist); }
body.theme-travel .logo__sub { color: var(--mute); }
body.theme-travel .logo__mark { border-color: var(--amber); color: var(--amber); }
body.theme-travel .burger span { background: var(--mist); }

/* Buttons */
.tr-btn { display:inline-flex; align-items:center; gap:.6rem; padding:.95rem 1.9rem; border-radius:4px; font-weight:500; font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; transition: transform .4s var(--ease), background .4s, color .4s, border-color .4s; }
.tr-btn--amber { background: var(--amber); color: var(--night); }
.tr-btn--amber:hover { transform: translateY(-3px); background: #f4b450; }
.tr-btn--ghost { border:1px solid var(--line); color: var(--mist); }
.tr-btn--ghost:hover { border-color: var(--amber); color: var(--amber); transform: translateY(-3px); }
.tr-btn .arrow { transition: transform .35s var(--ease); }
.tr-btn:hover .arrow { transform: translateX(5px); }

/* EDGE-TO-EDGE SLIDER */
.tr-slider { position: relative; height: 100svh; min-height: 640px; overflow: hidden; }
.tr-slider__track { display:flex; height:100%; transition: transform 1.1s cubic-bezier(.76,0,.24,1); will-change: transform; }
.tr-slide { position: relative; min-width: 100%; height: 100%; }
.tr-slide .media { position:absolute; inset:0; }
.tr-slide::after { content:""; position:absolute; inset:0; background: linear-gradient(90deg, rgba(10,12,15,0.82) 0%, rgba(10,12,15,0.35) 45%, rgba(10,12,15,0.15) 100%); }
.tr-slide__cap { position:absolute; left:0; bottom:0; z-index:2; padding: clamp(2rem,6vw,5rem); max-width: 760px; }
.tr-slide__cap .eyebrow { animation: trRise .9s var(--ease) both; }
.tr-slide__cap h2 { font-size: clamp(2.4rem,7vw,6rem); margin:.6rem 0 1rem; animation: trRise .9s .08s var(--ease) both; }
.tr-slide__cap p { color: var(--mute); max-width: 50ch; font-size: clamp(1rem,1.4vw,1.15rem); animation: trRise .9s .16s var(--ease) both; }
@keyframes trRise { from { opacity:0; transform: translateY(26px); } to { opacity:1; transform: none; } }

.tr-slider__nav { position:absolute; z-index:3; bottom: clamp(2rem,6vw,5rem); right: clamp(2rem,6vw,5rem); display:flex; gap:.6rem; }
.tr-arrow { width:54px; height:54px; border:1px solid var(--line); background: rgba(10,12,15,0.4); color: var(--mist); border-radius:50%; display:grid; place-items:center; cursor:pointer; transition: background .3s, border-color .3s, transform .3s; backdrop-filter: blur(6px); }
.tr-arrow:hover { background: var(--amber); color: var(--night); border-color: var(--amber); transform: scale(1.06); }
.tr-slider__dots { position:absolute; z-index:3; left: clamp(2rem,6vw,5rem); bottom: clamp(2rem,6vw,5rem); display:flex; gap:.5rem; }
.tr-dot { width:30px; height:3px; background: rgba(231,236,240,0.25); cursor:pointer; transition: background .3s; }
.tr-dot.active { background: var(--amber); }

/* Sections on dark */
body.theme-travel .section { position: relative; }
.tr-head { max-width: 760px; }
.tr-head h2 { font-size: clamp(2.2rem,5.5vw,4.4rem); }
.tr-head h2 .amber { color: var(--amber); }
.tr-head p { margin-top: 1rem; color: var(--mute); max-width: 56ch; }
.tr-rule { width:46px; height:2px; background: var(--amber); margin-bottom: 1.6rem; }

/* Project Stories — staggered immersive rows */
.tr-stories { display:grid; gap: clamp(3rem,7vw,6rem); margin-top: 3rem; }
.tr-project { display:grid; grid-template-columns: 1.25fr 1fr; gap: clamp(1.5rem,4vw,3.5rem); align-items:center; }
.tr-project:nth-child(even) { grid-template-columns: 1fr 1.25fr; }
.tr-project:nth-child(even) .tr-project__media { order: 2; }
@media (max-width: 820px){ .tr-project, .tr-project:nth-child(even){ grid-template-columns:1fr; } .tr-project:nth-child(even) .tr-project__media{ order:0; } }
.tr-project__media .media { aspect-ratio: 5/4; border-radius: 6px; }
.tr-project:hover .media { transform: scale(1.02); }
.tr-project__media .media { transition: transform 1.2s var(--ease); }
.tr-project__no { font-family:'Spectral',serif; font-style:italic; color: var(--amber); font-size: 1.1rem; }
.tr-project h3 { font-size: clamp(1.8rem,3.5vw,3rem); margin:.4rem 0 1rem; }
.tr-project p { color: var(--mute); }
.tr-project__meta { display:flex; gap:1.4rem; flex-wrap:wrap; margin-top:1.4rem; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color: var(--mute); }
.tr-project__meta b { color: var(--mist); font-weight:500; }
.tr-project__link { margin-top:1.6rem; display:inline-flex; align-items:center; gap:.5rem; color: var(--amber); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; }
.tr-project__link .arrow { transition: transform .3s var(--ease); }
.tr-project__link:hover .arrow { transform: translateX(5px); }

/* Blog / Field notes */
.tr-blog { background: var(--night-2); }
.tr-posts { display:grid; grid-template-columns: repeat(3,1fr); gap:1.6rem; margin-top:2.6rem; }
@media (max-width: 900px){ .tr-posts { grid-template-columns:1fr; max-width:480px; margin-inline:auto;} }
.tr-post { background: var(--night); border:1px solid var(--line); border-radius:8px; overflow:hidden; transition: transform .45s var(--ease), border-color .45s; display:flex; flex-direction:column; }
.tr-post:hover { transform: translateY(-6px); border-color: rgba(232,163,61,0.4); }
.tr-post .media { aspect-ratio: 3/2; }
.tr-post__body { padding: 1.6rem 1.5rem 1.8rem; flex:1; display:flex; flex-direction:column; }
.tr-post__tag { font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color: var(--amber); }
.tr-post h4 { font-size: 1.3rem; margin:.6rem 0 .7rem; }
.tr-post p { color: var(--mute); font-size:.92rem; flex:1; }
.tr-post__date { margin-top:1.2rem; font-family:'Spectral',serif; font-style:italic; color: var(--mute); font-size:.85rem; }

/* Newsletter */
.tr-news { position:relative; overflow:hidden; background: linear-gradient(135deg, #14181d, #0a0c0f); border:1px solid var(--line); border-radius: 12px; padding: clamp(2.4rem,6vw,4.5rem); text-align:center; }
.tr-news::before { content:""; position:absolute; top:-40%; right:-10%; width:420px; height:420px; background: radial-gradient(circle, rgba(232,163,61,0.18), transparent 70%); pointer-events:none; }
.tr-news h2 { font-size: clamp(2rem,5vw,3.6rem); position:relative; }
.tr-news p { color: var(--mute); max-width: 48ch; margin: 1rem auto 0; position:relative; }
.tr-news form { position:relative; margin-top: 2rem; display:flex; gap:.7rem; max-width: 520px; margin-inline:auto; flex-wrap:wrap; }
.tr-news input { flex:1; min-width: 220px; background: rgba(231,236,240,0.05); border:1px solid var(--line); color: var(--mist); padding: .95rem 1.1rem; border-radius:4px; font-family:inherit; font-size:1rem; }
.tr-news input:focus { outline:none; border-color: var(--amber); }
.tr-news .form__ok { margin-top:1.2rem; }
body.theme-travel .form__ok { background: rgba(232,163,61,0.12); border-left-color: var(--amber); color: var(--mist); }

/* Footer on travel */
body.theme-travel .footer { background: #07090b; border-top: 1px solid var(--line); }
body.theme-travel .footer__col h5 { color: var(--amber); }
body.theme-travel .footer__col a, body.theme-travel .footer__brand p, body.theme-travel .footer__bottom { color: var(--mute); }
body.theme-travel .footer__col a:hover, body.theme-travel .footer__bottom a:hover { color: var(--amber); }
body.theme-travel .footer .logo__mark { border-color: var(--amber); color: var(--amber); }
body.theme-travel .footer .logo__name { color: var(--mist); }