/* =====================================================================
   ROOTS & BEATS  |  Erasmus+ Youth Exchange, Monemvasia 2026
   Design system + page styles
   ===================================================================== */

/* ---------- 1. TOKENS ---------- */
:root{
  /* surfaces */
  --sand:        #F8F3EA;
  --sand-2:      #F1E9DA;
  --stone:       #E6DACA;
  --paper:       #FFFDF8;

  /* ink */
  --ink:         #221C17;
  --ink-2:       #4A4038;
  --ink-3:       #7A6E63;

  /* accents */
  --terracotta:  #B4522C;
  --terracotta-d:#8F3F20;
  --terracotta-s:#F3E2D8;
  --sea:         #17475C;
  --sea-deep:    #123544;
  --sea-soft:    #DDE7EA;
  --olive:       #5E6B4B;

  /* lines */
  --line:        rgba(34,28,23,.14);
  --line-soft:   rgba(34,28,23,.08);
  --line-light:  rgba(248,243,234,.22);

  /* type */
  --sans: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --serif: 'Fraunces', 'Iowan Old Style', Georgia, 'Times New Roman', serif;

  /* layout */
  --shell: 1180px;
  --gutter: clamp(20px, 5vw, 56px);
  --sec-y: clamp(76px, 9vw, 136px);
  --radius: 4px;

  /* motion */
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- 2. RESET / BASE ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:84px; }
body{
  margin:0;
  background:var(--sand);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(16px,1.02vw,17.5px);
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.nav-open{ overflow:hidden; }
[hidden]{ display:none !important; }
img,svg{ max-width:100%; display:block; }
h1,h2,h3,h4,p,figure,dl,dd{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
::selection{ background:var(--terracotta); color:var(--sand); }

:focus-visible{ outline:2px solid var(--terracotta); outline-offset:3px; border-radius:2px; }
.section-why :focus-visible,.section-contact :focus-visible,.hero :focus-visible{ outline-color:#E7B79E; }

.skip-link{
  position:absolute; left:-999px; top:0; z-index:200;
  background:var(--ink); color:var(--sand); padding:12px 18px; font-size:.9rem;
}
.skip-link:focus{ left:12px; top:12px; }

/* ---------- 3. LAYOUT ---------- */
.shell{ width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:var(--gutter); }
.shell-narrow{ max-width:860px; }
.section{ padding-block:var(--sec-y); position:relative; }

.section-head{ max-width:760px; margin-inline:auto; text-align:center; margin-bottom:clamp(44px,5vw,72px); }
.section-head-left{ margin-inline:0; text-align:left; }

/* ---------- 4. TYPOGRAPHY ---------- */
.eyebrow{
  font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--terracotta); margin-bottom:20px;
}
.eyebrow span{ opacity:.5; margin-inline:.25em; }
.eyebrow-light{ color:#E0A183; }

.h2{
  font-family:var(--serif);
  font-size:clamp(1.95rem,5.6vw,3.9rem);
  font-weight:500; line-height:1.03; letter-spacing:-.025em;
  font-variation-settings:'opsz' 100;
}
.h3{
  font-family:var(--serif);
  font-size:clamp(1.5rem,2.7vw,2.2rem);
  font-weight:500; line-height:1.15; letter-spacing:-.02em;
}
.lead{
  margin-top:20px; font-size:clamp(1.02rem,1.4vw,1.2rem); line-height:1.6;
  color:var(--ink-2); max-width:62ch; margin-inline:auto;
}
.section-head-left .lead{ margin-inline:0; }
.editorial-line{
  margin-top:18px; font-family:var(--serif); font-style:italic; font-weight:400;
  font-size:clamp(1.15rem,2vw,1.5rem); color:var(--terracotta); line-height:1.3;
}
.prose p{ margin-top:1.05em; color:var(--ink-2); max-width:60ch; }
.prose p:first-child{ margin-top:0; }
.h3 + .prose,.section-head + .prose{ margin-top:20px; }
.prose strong{ color:var(--ink); font-weight:600; }
.micro-note{ margin-top:16px; font-size:.87rem; color:var(--ink-3); line-height:1.55; }
.ph-text{
  font-family:var(--sans); font-size:.82rem; letter-spacing:.02em;
  color:var(--terracotta-d); background:var(--terracotta-s);
  border:1px dashed rgba(180,82,44,.4); border-radius:3px;
  padding:5px 10px; display:inline-block;
}
.ph-inline{ margin-top:14px; }

/* ---------- 5. BUTTONS ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:52px; padding:0 26px; border-radius:2px;
  font-size:.94rem; font-weight:600; letter-spacing:.01em;
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease);
}
.btn-primary{ background:var(--terracotta); color:#FFF6EF; }
.btn-primary:hover{ background:var(--terracotta-d); }
.btn-ghost{ border:1px solid rgba(255,255,255,.5); color:#fff; }
.btn-ghost:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.btn-ghost-dark{ border:1px solid var(--line-light); color:var(--sand); }
.btn-ghost-dark:hover{ background:rgba(248,243,234,.1); border-color:rgba(248,243,234,.5); }
.btn-small{ min-height:44px; padding:0 18px; font-size:.87rem; }
.btn-block{ width:100%; }
.btn:active{ transform:translateY(1px); }

/* ---------- 6. IMAGE PLACEHOLDER SYSTEM ---------- */
.media{
  position:relative; overflow:hidden; background:var(--stone);
  background-image:
    radial-gradient(90% 70% at 26% 14%, rgba(255,255,255,.5) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(to bottom, #DCD3C2 0%, #D3C8B4 58%, #C9BCA4 58.5%, #BFB199 100%),
    linear-gradient(120deg, rgba(180,82,44,.07), rgba(23,71,92,.09));
}
.media::before{
  content:'';
  position:absolute; inset:0;
  background-image:
    linear-gradient(to bottom, transparent 61%, rgba(34,28,23,.055) 61%, rgba(34,28,23,.055) 61.4%, transparent 61.4%),
    repeating-linear-gradient(115deg, rgba(34,28,23,.028) 0 1px, transparent 1px 22px);
  opacity:1; transition:opacity .4s;
}
.media::after{
  content:attr(data-ph);
  position:absolute; left:14px; bottom:14px; right:14px;
  font-size:.66rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-2); background:rgba(255,253,248,.82);
  border:1px solid rgba(34,28,23,.14); border-radius:2px;
  padding:7px 10px; backdrop-filter:blur(2px);
  transition:opacity .4s;
}
.media img{ width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .6s var(--ease); }
.media.is-filled img{ opacity:1; }
.media.is-filled::before,.media.is-filled::after{ opacity:0; pointer-events:none; }
.media-wide{ aspect-ratio:16/10; }
.media-portrait{ aspect-ratio:4/5; }
.media-square{ aspect-ratio:1/1; }

/* ---------- 7. MOTIF (roots -> waveform) ---------- */
.hero-motif{ color:rgba(255,255,255,.75); margin:26px 0 6px; max-width:420px; }
.hero-motif svg{ width:100%; height:38px; }
.divider{ color:var(--line); margin-block:clamp(52px,7vw,88px); }
.divider svg{ width:100%; height:22px; }
.draw{ stroke-dasharray:1400; stroke-dashoffset:1400; transition:stroke-dashoffset 2.6s var(--ease) .15s; }
.draw.d2{ transition-duration:1.6s; }
.is-in .draw{ stroke-dashoffset:0; }

/* ---------- 8. HEADER / NAV ---------- */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:100;
  transition:background .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; height:74px; }
.site-header.is-top{ background:transparent; color:#fff; }
.site-header.is-scrolled{
  background:rgba(248,243,234,.92); backdrop-filter:blur(10px);
  color:var(--ink); border-bottom-color:var(--line-soft);
}

.brand{ display:flex; align-items:center; gap:11px; font-weight:600; letter-spacing:-.01em; flex:none; }
.brand-mark{ width:34px; display:block; opacity:.95; }
.brand-mark svg{ width:34px; height:20px; }
.brand-text{ font-family:var(--serif); font-size:1.15rem; font-weight:500; letter-spacing:-.02em; white-space:nowrap; }
.brand-text em{ font-style:italic; color:var(--terracotta); margin-inline:.06em; }
.site-header.is-top .brand-text em{ color:#E7B79E; }

.nav-desktop{ display:none; align-items:center; gap:clamp(18px,2.2vw,32px); }
.nav-desktop a{
  font-size:.9rem; font-weight:500; position:relative; padding-block:6px;
  white-space:nowrap; transition:opacity .25s;
}
@media (max-width:1219px){ .nav-desktop a{ font-size:.83rem; } }
.nav-desktop a:not(.nav-cta)::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .35s var(--ease);
}
.nav-desktop a:not(.nav-cta):hover::after,
.nav-desktop a.is-active::after{ transform:scaleX(1); }
.nav-desktop a.is-active{ color:var(--terracotta); }
.site-header.is-top .nav-desktop a.is-active{ color:#F2C9B3; }
.nav-cta{
  border:1px solid currentColor; border-radius:2px; padding:9px 16px !important; white-space:nowrap;
  font-weight:600 !important; transition:background .3s var(--ease), color .3s var(--ease);
}
.site-header.is-scrolled .nav-cta{ background:var(--terracotta); border-color:var(--terracotta); color:#FFF6EF; }
.site-header.is-scrolled .nav-cta:hover{ background:var(--terracotta-d); border-color:var(--terracotta-d); }
.site-header.is-top .nav-cta:hover{ background:rgba(255,255,255,.16); }

.burger{ width:46px; height:46px; margin-right:-10px; margin-left:6px; display:grid; place-content:center; gap:6px; }
.burger span{ display:block; width:22px; height:1.5px; background:currentColor; transition:transform .35s var(--ease), opacity .25s; }
.burger[aria-expanded="true"] span:first-child{ transform:translateY(3.75px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.75px) rotate(-45deg); }

.nav-mobile{
  position:fixed; inset:74px 0 0 0; background:var(--sand);
  padding:28px var(--gutter) 40px; overflow-y:auto;
  display:flex; flex-direction:column; justify-content:space-between; gap:32px;
  animation:panelIn .35s var(--ease);
}
@keyframes panelIn{ from{ opacity:0; transform:translateY(-8px);} to{ opacity:1; transform:none;} }
.nav-mobile nav{ display:flex; flex-direction:column; }
.nav-mobile nav a{
  display:flex; align-items:baseline; gap:16px;
  font-family:var(--serif); font-size:1.6rem; font-weight:500; letter-spacing:-.02em;
  padding:15px 0; border-bottom:1px solid var(--line-soft); color:var(--ink);
}
.nav-mobile nav a span{
  font-family:var(--sans); font-size:.7rem; font-weight:600; letter-spacing:.14em;
  color:var(--terracotta); min-width:22px;
}

/* ---------- 8b. LANGUAGE SWITCHER ---------- */
.lang{ position:relative; margin-left:auto; }
@media (min-width:1150px){ .lang{ margin-left:0; } }
.lang-btn{
  display:flex; align-items:center; gap:7px; padding:8px 11px;
  font-size:.82rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid currentColor; border-radius:2px; color:inherit; opacity:.9;
  transition:opacity .25s, background .25s;
}
.lang-btn:hover{ opacity:1; }
.lang-btn svg{ transition:transform .3s var(--ease); }
.lang-btn[aria-expanded="true"] svg{ transform:rotate(180deg); }
.site-header.is-scrolled .lang-btn{ border-color:var(--line); }
.lang-menu{
  position:absolute; right:0; top:calc(100% + 9px); z-index:5;
  min-width:168px; background:var(--paper); border:1px solid var(--line-soft);
  box-shadow:0 12px 30px rgba(34,28,23,.14); border-radius:2px; overflow:hidden;
  animation:panelIn .22s var(--ease);
}
.lang-menu li + li{ border-top:1px solid var(--line-soft); }
.lang-menu button{
  display:block; width:100%; text-align:left; padding:12px 16px;
  font-size:.94rem; color:var(--ink); transition:background .2s, color .2s;
}
.lang-menu button:hover{ background:var(--sand-2); }
.lang-menu button[aria-current="true"]{ color:var(--terracotta); font-weight:600; background:var(--sand); }

/* ---------- 9. HERO ---------- */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  padding-block:120px clamp(48px,7vw,84px); color:#fff; overflow:hidden;
}
.hero-media{ position:absolute; inset:0; background-color:#7E7461; }
.hero-media::after{ left:auto; right:18px; bottom:auto; top:96px; max-width:260px; }
@media (max-width:679px){
  .hero-media::after{ right:14px; left:auto; top:auto; bottom:14px; max-width:200px; font-size:.6rem; }
}
.hero-veil{
  position:absolute; inset:0;
  background:
    linear-gradient(to top, rgba(20,15,11,.92) 0%, rgba(20,15,11,.7) 38%, rgba(20,15,11,.42) 68%, rgba(20,15,11,.55) 100%),
    linear-gradient(to right, rgba(20,15,11,.72) 0%, rgba(20,15,11,.3) 48%, rgba(20,15,11,.05) 78%),
    linear-gradient(to right, rgba(90,40,20,.2), rgba(18,53,68,.16));
}
.hero-inner{ position:relative; z-index:2; }
.hero-title{
  font-family:var(--serif); font-weight:500;
  font-size:clamp(3.4rem,13vw,8.8rem); line-height:.88; letter-spacing:-.045em;
  font-variation-settings:'opsz' 144;
}
.hero-title em{ font-style:italic; font-weight:400; color:#F0C3AC; margin-inline:.09em; }
.hero-tagline{
  margin-top:20px; font-size:clamp(1.08rem,2vw,1.45rem); font-weight:400;
  color:rgba(255,255,255,.9); max-width:34ch; line-height:1.4;
}
.hero-facts{
  display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:14px;
  font-size:.92rem; color:rgba(255,255,255,.82);
}
.hero-facts li{ display:flex; align-items:center; gap:8px; }
.hero-facts span{ opacity:.5; }
.hero-facts li + li{ padding-left:26px; border-left:1px solid rgba(255,255,255,.2); }
@media (max-width:679px){
  .hero-facts{ flex-direction:column; gap:6px; }
  .hero-facts li + li{ padding-left:0; border-left:0; }
}

.hero-phases{
  display:grid; grid-template-columns:1fr; gap:0; margin-top:34px;
  border-top:1px solid rgba(255,255,255,.22);
}
.phase{
  display:flex; align-items:baseline; gap:14px; padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.phase-date{
  font-size:.78rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:#F0C3AC; min-width:96px;
}
.phase-label{ font-size:1rem; color:rgba(255,255,255,.92); }
.phase-main .phase-label{ font-weight:600; }

.hero-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.hero-actions .btn{ flex:1 1 auto; min-width:200px; }

/* ---------- 10. PROJECT AT A GLANCE ---------- */
.section-glance{ background:var(--sand); }
.glance-grid{
  display:grid; grid-template-columns:1fr; gap:0;
  border-top:1px solid var(--line);
}
.glance-item{ padding:18px 0; border-bottom:1px solid var(--line-soft); }
.glance-item dt{
  font-size:.7rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-3); margin-bottom:5px;
}
.glance-item dd{ font-size:1.12rem; font-weight:500; color:var(--ink); }
.glance-item .dot{ color:var(--terracotta); margin-inline:.15em; }

.glance-stats{
  display:grid; grid-template-columns:repeat(2,1fr); gap:1px;
  margin-top:clamp(40px,5vw,64px); background:var(--line-soft);
  border:1px solid var(--line-soft);
}
.stat{ background:var(--sand); padding:26px 20px; text-align:center; }
.stat-num{
  display:block; font-family:var(--serif); font-weight:500;
  font-size:clamp(2.6rem,6vw,4.2rem); line-height:1; letter-spacing:-.04em; color:var(--terracotta);
}
.stat-cap{
  display:block; margin-top:10px; font-size:.76rem; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3);
}
.glance-strapline{
  margin-top:clamp(38px,4vw,56px); text-align:center;
  font-family:var(--serif); font-style:italic; font-size:clamp(1.05rem,2.1vw,1.55rem);
  color:var(--ink-2); line-height:1.4;
}
.glance-strapline span{ color:var(--terracotta); }

/* ---------- 11. WELCOME ---------- */
.section-welcome{ background:var(--sand); padding-top:0; }
.welcome-grid{ display:grid; grid-template-columns:1fr; gap:clamp(32px,4vw,56px); align-items:center; }
.welcome-figure{ order:-1; }
.host-grid{ display:grid; grid-template-columns:1fr; gap:clamp(32px,4vw,56px); align-items:center; }
.host-motto{
  margin-top:26px; padding-top:20px; border-top:1px solid var(--line);
  font-family:var(--serif); font-style:italic; font-size:clamp(1.05rem,1.8vw,1.35rem); color:var(--terracotta);
}

/* ---------- 12. TEAM ---------- */
.section-team{ background:var(--sand-2); }
.team-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.team-card{
  background:var(--sand-2); padding:clamp(24px,3vw,34px);
  display:flex; flex-direction:column; gap:14px;
  transition:background .35s var(--ease);
}
.team-card:hover{ background:var(--paper); }
.team-top{ display:flex; align-items:center; gap:12px; }
.flag{ width:27px; height:18px; display:block; border-radius:2px; overflow:hidden; box-shadow:0 0 0 1px rgba(34,28,23,.12); flex:none; }
.flag svg{ width:100%; height:100%; }
.team-country{ font-size:.76rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-3); }
.team-org{ font-family:var(--serif); font-size:1.55rem; font-weight:500; letter-spacing:-.02em; line-height:1.1; }
.team-list{ display:flex; flex-direction:column; gap:6px; margin-top:auto; }
.team-list li{ font-size:.95rem; color:var(--ink-2); }
.team-list span{ font-weight:700; color:var(--terracotta); margin-right:6px; }
.logo-slot{ height:64px; width:100%; max-width:176px; margin-top:8px; background:none; border:1px dashed var(--line); }
.logo-slot::before{ display:none; }
.logo-slot::after{
  inset:0; left:0; right:0; bottom:0; display:grid; place-content:center;
  font-size:.6rem; background:none; border:0; color:var(--ink-3); backdrop-filter:none;
}
.logo-slot img{ object-fit:contain; object-position:left center; padding:2px 0; }
.logo-slot.is-filled{ border-color:transparent; }
.team-statement{
  margin-top:clamp(36px,4vw,56px); text-align:center;
  font-family:var(--serif); font-size:clamp(1.25rem,2.6vw,2rem); line-height:1.35; color:var(--ink);
}
.team-statement em{ font-style:italic; color:var(--terracotta); }

/* ---------- 13. WHY ---------- */
.section-why{ background:var(--sea-deep); color:var(--sand); }
.section-why .h2{ color:#FDF8EF; }
.why-statement{
  margin-top:22px; font-family:var(--serif); font-size:clamp(1.3rem,3vw,2.1rem);
  line-height:1.28; color:rgba(248,243,234,.78);
}
.why-statement em{ font-style:italic; color:#F0C3AC; }
.reasons{ display:grid; grid-template-columns:1fr; gap:0; border-top:1px solid var(--line-light); }
.reason{ padding:26px 0; border-bottom:1px solid rgba(248,243,234,.12); position:relative; }
.reason-num{
  font-size:.72rem; font-weight:700; letter-spacing:.18em; color:#E0A183;
  display:block; margin-bottom:10px;
}
.reason h3{ font-family:var(--serif); font-size:clamp(1.3rem,2.2vw,1.7rem); font-weight:500; letter-spacing:-.02em; }
.reason p{ margin-top:10px; color:rgba(248,243,234,.72); max-width:58ch; }

.mission{
  margin-top:clamp(48px,6vw,80px); padding:clamp(28px,4vw,48px);
  border:1px solid var(--line-light); border-left:2px solid var(--terracotta);
  background:rgba(248,243,234,.035);
}
.mission-text{
  font-family:var(--serif); font-size:clamp(1.3rem,2.8vw,2.05rem); line-height:1.3;
  letter-spacing:-.02em; color:#FDF8EF; max-width:24ch; max-width:30ch;
}
.aims{ display:grid; grid-template-columns:1fr; gap:0; margin-top:clamp(40px,5vw,64px); }
.aim{ padding:22px 0; border-bottom:1px solid rgba(248,243,234,.12); }
.aim h4{
  font-size:.8rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:#F0C3AC; margin-bottom:8px;
}
.aim p{ color:rgba(248,243,234,.75); max-width:44ch; }

/* ---------- 14. EXPERIENCE ---------- */
.section-experience{ background:var(--sand); }
.exp-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.exp{ background:var(--sand); display:flex; flex-direction:column; transition:background .35s var(--ease); }
.exp:hover{ background:var(--paper); }
.exp-body{ padding:clamp(24px,3vw,36px); }
.exp-num{
  font-size:.72rem; font-weight:700; letter-spacing:.18em; color:var(--terracotta);
  display:block; margin-bottom:12px;
}
.exp h3{ font-family:var(--serif); font-size:clamp(1.25rem,2.1vw,1.6rem); font-weight:500; letter-spacing:-.02em; line-height:1.15; }
.exp h3 .sep{ color:var(--terracotta); }
.exp p{ margin-top:12px; color:var(--ink-2); font-size:.97rem; max-width:52ch; }
.exp-accent{ background:var(--terracotta-s); }
.exp-accent:hover{ background:#F7E9E0; }
.exp-quiet{ background:var(--sand-2); }
.exp-map{
  display:grid; place-items:center; overflow:hidden;
  background:var(--terracotta-s); min-height:300px; padding:clamp(14px,2.4vw,26px);
}
.exp-map img{ max-width:100%; max-height:100%; width:auto; height:auto; }
.exp-note{ margin-top:26px; font-size:.88rem; color:var(--ink-3); text-align:center; }

/* ---------- 15. ACCOMMODATION ---------- */
.section-stay{ background:var(--sand-2); }
.stay-block{ display:grid; grid-template-columns:1fr; gap:clamp(24px,3vw,44px); margin-bottom:clamp(48px,6vw,80px); }
.stay-media{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.stay-media .media-wide{ grid-column:1/-1; }
.stay-index{
  font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--terracotta); display:block; margin-bottom:12px; white-space:nowrap;
}
.stay-note{
  padding:24px 0; border-block:1px solid var(--line); text-align:center;
  font-size:clamp(1rem,1.6vw,1.15rem); color:var(--ink-2); max-width:60ch; margin-inline:auto;
}
.food{ margin-top:clamp(48px,6vw,80px); display:grid; grid-template-columns:1fr; gap:clamp(26px,3vw,48px); align-items:center; }
.food-copy .h3{ margin-bottom:16px; }
.food-copy p{ color:var(--ink-2); }
.tick-list{ display:flex; flex-direction:column; gap:9px; margin-top:20px; }
.tick-list li{ position:relative; padding-left:24px; font-size:.96rem; color:var(--ink-2); }
.tick-list li::before{
  content:''; position:absolute; left:0; top:.62em; width:11px; height:1.5px; background:var(--terracotta);
}

/* ---------- 16. TRAVEL ---------- */
.section-travel{ background:var(--sand); }
.route{
  display:grid; grid-template-columns:1fr; gap:0;
  margin-bottom:clamp(40px,5vw,64px); position:relative;
}
.route-step{ position:relative; padding:0 0 26px 30px; }
.route-step::before{
  content:''; position:absolute; left:5px; top:8px; bottom:-8px; width:1px; background:var(--line);
}
.route-step:last-child::before{ display:none; }
.route-dot{
  position:absolute; left:0; top:6px; width:11px; height:11px; border-radius:50%;
  border:1.5px solid var(--terracotta); background:var(--sand);
}
.route-step:last-child .route-dot{ background:var(--terracotta); }
.route-step h3{ font-size:1.05rem; font-weight:600; letter-spacing:-.01em; }
.route-step p{ font-size:.9rem; color:var(--ink-3); margin-top:3px; }

.trip-grid{ display:grid; grid-template-columns:1fr; gap:16px; }
.trip{ background:var(--paper); border:1px solid var(--line-soft); padding:clamp(26px,3.4vw,40px); }
.trip-arrival{ border-top:3px solid var(--terracotta); }
.trip-departure{ border-top:3px solid var(--sea); }
.trip-kicker{
  font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-3);
}
.trip-date{
  font-family:var(--serif); font-size:clamp(1.6rem,3vw,2.2rem); font-weight:500;
  letter-spacing:-.025em; margin-top:6px;
}
.trip-lead{ margin-top:20px; font-size:.95rem; color:var(--ink-2); max-width:44ch; }
.big-time{
  font-family:var(--serif); font-weight:600; letter-spacing:-.04em; line-height:1;
  font-size:clamp(3.6rem,10vw,5.6rem); color:var(--terracotta); margin:8px 0 4px;
}
.trip-departure .big-time{ color:var(--sea); }
.trip-body{ margin-top:14px; font-size:.95rem; color:var(--ink-2); }
.trip-facts{ margin-top:22px; border-top:1px solid var(--line-soft); }
.trip-facts > div{ padding:13px 0; border-bottom:1px solid var(--line-soft); }
.trip-facts dt{
  font-size:.7rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); margin-bottom:5px;
}
.strong-time{ font-size:1.35rem; font-weight:700; letter-spacing:-.01em; color:var(--ink); }
.trip-departure .strong-time{ color:var(--sea); }

.reimb{ margin-top:clamp(56px,7vw,96px); }
.sub-head{ margin-bottom:clamp(28px,3vw,40px); max-width:62ch; }
.sub-head p{ margin-top:14px; color:var(--ink-2); font-size:.97rem; }
.reimb-grid{ border-top:1px solid var(--line); }
.reimb-row{
  display:grid; grid-template-columns:1fr auto; grid-template-areas:"country amount" "tag amount";
  gap:6px 16px; align-items:center; padding:20px 0; border-bottom:1px solid var(--line-soft);
}
.reimb-country{ grid-area:country; display:flex; align-items:center; gap:11px; font-size:1.08rem; font-weight:600; }
.tag{
  grid-area:tag; justify-self:start;
  font-size:.68rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  padding:4px 9px; border:1px solid var(--line); color:var(--ink-3); border-radius:2px;
}
.tag-green{ color:var(--olive); border-color:rgba(94,107,75,.4); background:rgba(94,107,75,.07); }
.reimb-amount{
  grid-area:amount; text-align:right;
  font-family:var(--serif); font-size:clamp(1.9rem,4vw,2.6rem); font-weight:500;
  letter-spacing:-.03em; line-height:1;
}
.reimb-amount span{
  display:block; font-family:var(--sans); font-size:.68rem; font-weight:600;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); margin-top:6px;
}

.reimb-note{
  margin-top:clamp(30px,3.5vw,44px); padding:clamp(24px,3vw,34px);
  background:var(--paper); border:1px solid var(--line-soft); border-left:3px solid var(--sea);
}
.reimb-note-top{ display:flex; align-items:center; gap:9px; margin-bottom:14px; }
.reimb-note-label{
  font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--sea); margin-left:5px;
}
.reimb-note-title{
  font-family:var(--serif); font-size:clamp(1.25rem,2.3vw,1.7rem); font-weight:500;
  letter-spacing:-.02em; line-height:1.2; max-width:26ch;
}
.calc{
  display:flex; flex-wrap:wrap; align-items:center; gap:14px 20px;
  margin:24px 0 20px; padding:20px 0; border-block:1px solid var(--line-soft);
}
.calc-item{ flex:1 1 180px; min-width:150px; }
.calc-num{
  display:block; font-family:var(--serif); font-size:clamp(1.8rem,3.4vw,2.5rem);
  font-weight:500; letter-spacing:-.03em; line-height:1; color:var(--ink);
}
.calc-cap{ display:block; margin-top:8px; font-size:.84rem; color:var(--ink-3); line-height:1.45; }
.calc-op{ font-size:1.3rem; color:var(--terracotta); font-weight:600; flex:0 0 auto; align-self:flex-start; padding-top:6px; }
.calc-total .calc-num{ color:var(--sea); }
.reimb-note-body{ font-size:.96rem; color:var(--ink-2); max-width:62ch; }
@media (max-width:599px){
  .calc{ flex-direction:column; align-items:flex-start; gap:10px; }
  .calc-item{ flex:0 0 auto; }
  .calc-op{ padding-top:0; line-height:1; }
}

.docs{ display:grid; grid-template-columns:1fr; gap:clamp(24px,3vw,40px); margin-top:clamp(36px,4vw,56px); }
.docs h4{ font-size:.8rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-3); }
.callout{
  background:var(--sea-deep); color:var(--sand); padding:clamp(24px,3vw,34px);
  border-left:3px solid var(--terracotta); align-self:start;
}
.callout-title{
  font-family:var(--serif); font-size:clamp(1.35rem,2.6vw,1.85rem); font-weight:500;
  letter-spacing:-.02em; line-height:1.15; color:#FDF8EF; margin-bottom:12px;
}
.callout p{ color:rgba(248,243,234,.78); font-size:.95rem; }

.extra{
  margin-top:clamp(48px,6vw,80px); padding:clamp(26px,3.4vw,40px);
  background:var(--sand-2); border:1px solid var(--line-soft);
}
.extra p{ margin-top:14px; color:var(--ink-2); max-width:62ch; }
.warn-list{ margin-top:22px; display:flex; flex-direction:column; gap:12px; }
.warn-list li{ position:relative; padding-left:26px; color:var(--ink-2); font-size:.96rem; }
.warn-list li::before{
  content:''; position:absolute; left:0; top:.5em; width:9px; height:9px;
  border:1.5px solid var(--terracotta); border-radius:50%;
}
.warn-list strong{ color:var(--terracotta-d); font-weight:700; }

/* ---------- 17. PACKING ---------- */
.section-pack{ background:var(--sand-2); }
.pack-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.pack-col{ background:var(--sand-2); padding:clamp(24px,3vw,34px); }
.pack-col h3{
  font-size:.8rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--terracotta); margin-bottom:18px;
}
.pack-col-accent{ background:var(--paper); }
.pack-intro{ font-size:.94rem; color:var(--ink-2); margin-bottom:16px; }
.check-list{ display:flex; flex-direction:column; gap:11px; }
.check-list li{ position:relative; padding-left:28px; font-size:1rem; color:var(--ink); }
.check-list li::before{
  content:''; position:absolute; left:0; top:.28em; width:15px; height:15px;
  border:1.5px solid var(--line); border-radius:2px; background:var(--paper);
}
.check-list li::after{
  content:''; position:absolute; left:4px; top:.55em; width:7px; height:3.5px;
  border-left:1.5px solid var(--terracotta); border-bottom:1.5px solid var(--terracotta);
  transform:rotate(-45deg); opacity:.35;
}

/* ---------- 18. FAQ ---------- */
.section-faq{ background:var(--sand); }
.faq{ border-top:1px solid var(--line); }
.faq-item{ border-bottom:1px solid var(--line-soft); }
.faq-q{
  width:100%; display:flex; align-items:flex-start; justify-content:space-between; gap:20px;
  padding:22px 0; text-align:left; font-size:1.06rem; font-weight:600; letter-spacing:-.01em;
  transition:color .25s;
}
.faq-q:hover{ color:var(--terracotta); }
.faq-q i{ position:relative; width:15px; height:15px; flex:none; margin-top:6px; }
.faq-q i::before,.faq-q i::after{
  content:''; position:absolute; left:0; top:7px; width:15px; height:1.5px; background:var(--terracotta);
  transition:transform .35s var(--ease);
}
.faq-q i::after{ transform:rotate(90deg); }
.faq-q[aria-expanded="true"] i::after{ transform:rotate(0deg); }
.faq-a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s var(--ease); }
.faq-item.is-open .faq-a{ grid-template-rows:1fr; }
.faq-a > div{ overflow:hidden; }
.faq-a p{ padding-bottom:24px; color:var(--ink-2); max-width:66ch; font-size:.99rem; }

/* ---------- 19. CONTACT ---------- */
.section-contact{ background:var(--ink); color:var(--sand); }
.section-contact .h2{ color:#FDF8EF; }
.section-contact .lead{ color:rgba(248,243,234,.72); }
.contact-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:rgba(248,243,234,.13); border:1px solid rgba(248,243,234,.13); }
.contact-card{ background:var(--ink); padding:clamp(24px,3vw,34px); transition:background .35s var(--ease); display:flex; flex-direction:column; }
.contact-card:hover{ background:#2C251F; }
.contact-top{ display:flex; align-items:center; gap:11px; margin-bottom:12px; }
.contact-country{ font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:rgba(248,243,234,.55); }
.contact-org{ font-family:var(--serif); font-size:1.5rem; font-weight:500; letter-spacing:-.02em; color:#FDF8EF; }
.contact-mail{
  display:block; margin-top:10px; font-size:.92rem; color:#E0A183; overflow-wrap:anywhere; line-height:1.45;
  text-decoration:underline; text-decoration-color:rgba(224,161,131,.35); text-underline-offset:4px;
  transition:text-decoration-color .3s;
}
.contact-mail:hover{ text-decoration-color:#E0A183; }
.contact-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:auto; padding-top:20px; }

/* ---------- 19b. APPLY NOW (scoped: everything starts with .ap- ) ---------- */
.section-apply{ background:var(--sand); }
.section-apply .ap-facts{
  margin-top:18px; display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
  font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3);
}
.section-apply .ap-facts span[aria-hidden]{ color:var(--terracotta); }
.ap-note{ margin-top:14px; font-size:.92rem; color:var(--ink-3); }

.ap-shell{
  background:var(--paper); border:1px solid var(--line-soft);
  padding:clamp(22px,3.4vw,44px);
}

/* progress */
.ap-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:clamp(26px,3.5vw,38px); }
.ap-step{
  display:flex; flex-direction:column; gap:5px; padding-top:12px;
  border-top:2px solid var(--line-soft); color:var(--ink-3);
  transition:color .3s var(--ease), border-color .3s var(--ease);
}
.ap-step-num{ font-size:.68rem; font-weight:700; letter-spacing:.16em; }
.ap-step-name{ font-size:.8rem; font-weight:600; line-height:1.3; }
.ap-step.is-done{ color:var(--ink-2); border-top-color:var(--terracotta); }
.ap-step.is-current{ color:var(--terracotta); border-top-color:var(--terracotta); }
@media (max-width:599px){
  .ap-steps{ gap:6px; }
  .ap-step-name{ display:none; font-size:.74rem; }
  .ap-step.is-current .ap-step-name{ display:block; }
  .ap-step.is-current{ grid-column:span 1; }
}

/* panels */
.ap-panel{ border:0; margin:0; padding:0; min-inline-size:0; }
.ap-panel[hidden]{ display:none; }
.ap-panel-h{
  font-family:var(--serif); font-size:clamp(1.35rem,2.6vw,1.9rem); font-weight:500;
  letter-spacing:-.02em; padding:0; color:var(--ink);
}
.ap-panel-sub{ margin-top:8px; color:var(--ink-2); font-size:.97rem; max-width:56ch; }
.ap-panel > .ap-field,.ap-panel > .ap-row{ margin-top:clamp(22px,2.8vw,30px); }

/* fields */
.ap-field{ display:flex; flex-direction:column; }
.ap-row{ display:grid; grid-template-columns:1fr; gap:clamp(22px,2.8vw,30px); }
.ap-label{ font-size:.93rem; font-weight:600; color:var(--ink); line-height:1.45; }
.ap-label .req{ color:var(--terracotta); }
.ap-label .opt{
  color:var(--ink-3); font-weight:500; font-size:.72rem; letter-spacing:.12em;
  text-transform:uppercase; margin-left:6px;
}
.ap-help{ margin-top:5px; font-size:.85rem; color:var(--ink-3); }
.ap-hint{ margin-top:6px; font-size:.84rem; color:var(--ink-3); line-height:1.5; }
.ap-field > .ap-hint + textarea,
.ap-field > .ap-label + input,
.ap-field > .ap-label + textarea,
.ap-field > .ap-hint + input{ margin-top:9px; }

.ap-form input[type=text],
.ap-form input[type=email],
.ap-form input[type=tel],
.ap-form input[type=date],
.ap-form textarea{
  width:100%; font:inherit; font-size:1rem; color:var(--ink); background:var(--sand);
  border:1px solid var(--line); border-radius:2px; padding:13px 14px; min-height:52px;
  -webkit-appearance:none; appearance:none;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
}
.ap-form textarea{ resize:vertical; line-height:1.55; min-height:auto; }
.ap-form input:focus,.ap-form textarea:focus{
  outline:none; background:var(--paper);
  border-color:var(--terracotta); box-shadow:0 0 0 3px rgba(180,82,44,.13);
}
.ap-form ::placeholder{ color:#A99B8C; }
.ap-form .is-invalid{ border-color:#9B3325; background:#FCF3F0; }
.ap-count{ margin-top:7px; font-size:.78rem; color:var(--ink-3); }
.ap-count b{ font-weight:600; color:var(--ink-2); }
.ap-err{ display:none; margin-top:8px; font-size:.83rem; color:#9B3325; }
.ap-err.is-on{ display:block; }
.ap-err::before{ content:"! "; font-weight:700; }

/* country tiles */
.ap-cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:12px; }
.ap-card{ position:relative; cursor:pointer; }
.ap-card input{ position:absolute; opacity:0; width:1px; height:1px; }
.ap-card-in{
  display:flex; align-items:center; gap:11px; padding:15px 14px;
  border:1px solid var(--line); border-radius:2px; background:var(--sand);
  transition:border-color .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease);
}
.ap-card-name{ font-size:.95rem; font-weight:600; color:var(--ink); }
.ap-card:hover .ap-card-in{ border-color:var(--ink-3); }
.ap-card input:checked + .ap-card-in{
  border-color:var(--terracotta); background:var(--terracotta-s);
  box-shadow:inset 3px 0 0 var(--terracotta);
}
.ap-card input:focus-visible + .ap-card-in{ outline:2px solid var(--terracotta); outline-offset:2px; }

/* radio pills */
.ap-pills{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.ap-pill{ position:relative; cursor:pointer; }
.ap-pill input{ position:absolute; opacity:0; width:1px; height:1px; }
.ap-pill span{
  display:block; padding:11px 16px; font-size:.9rem; color:var(--ink-2);
  border:1px solid var(--line); border-radius:2px; background:var(--sand);
  transition:border-color .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
}
.ap-pill:hover span{ border-color:var(--ink-3); }
.ap-pill input:checked + span{ border-color:var(--terracotta); background:var(--terracotta-s); color:var(--ink); font-weight:600; }
.ap-pill input:focus-visible + span{ outline:2px solid var(--terracotta); outline-offset:2px; }

/* fewer opportunities */
.ap-opts{ margin-top:14px; }
.ap-opt{ position:relative; display:block; cursor:pointer; }
.ap-opt + .ap-opt{ margin-top:8px; }
.ap-opt input{ position:absolute; opacity:0; width:1px; height:1px; }
.ap-opt-in{
  display:grid; grid-template-columns:auto 1fr; column-gap:13px; row-gap:5px;
  padding:15px 16px; border:1px solid var(--line-soft); border-radius:2px; background:var(--sand);
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.ap-opt-in::before{
  content:""; grid-row:1 / span 2; width:19px; height:19px; margin-top:2px;
  border:1.5px solid var(--ink-3); border-radius:2px; background:var(--paper);
  transition:border-color .2s, background .2s;
}
.ap-opt-title{ font-size:.96rem; font-weight:600; color:var(--ink); }
.ap-opt-desc{ font-size:.86rem; color:var(--ink-3); line-height:1.5; }
.ap-opt:hover .ap-opt-in{ border-color:var(--line); }
.ap-opt input:checked + .ap-opt-in{ border-color:var(--terracotta); background:var(--terracotta-s); }
.ap-opt input:checked + .ap-opt-in::before{
  border-color:var(--terracotta); background:var(--terracotta);
  background-image:linear-gradient(45deg,transparent 42%,#fff 42%,#fff 52%,transparent 52%),
                   linear-gradient(-45deg,transparent 42%,#fff 42%,#fff 52%,transparent 52%);
  background-size:11px 11px,11px 11px; background-position:2px 4px,3px -1px; background-repeat:no-repeat;
}
.ap-opt input:focus-visible + .ap-opt-in{ outline:2px solid var(--terracotta); outline-offset:2px; }
.ap-opt-none{ margin-top:14px; }
.ap-opt-none .ap-opt-in{ background:var(--stone); }

/* privacy */
.ap-privacy{ margin-top:clamp(24px,3vw,32px); border:1px solid var(--line-soft); border-left:3px solid var(--sea); background:var(--sand); }
.ap-privacy-btn{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 18px; text-align:left; font-size:.88rem; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase; color:var(--sea);
}
.ap-privacy-btn i{ position:relative; width:13px; height:13px; flex:none; }
.ap-privacy-btn i::before,.ap-privacy-btn i::after{
  content:""; position:absolute; left:0; top:6px; width:13px; height:1.5px; background:var(--sea);
  transition:transform .3s var(--ease);
}
.ap-privacy-btn i::after{ transform:rotate(90deg); }
.ap-privacy-btn[aria-expanded="true"] i::after{ transform:rotate(0); }
.ap-privacy-body{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s var(--ease); }
.ap-privacy.is-open .ap-privacy-body{ grid-template-rows:1fr; }
.ap-privacy-inner{ overflow:hidden; }
.ap-privacy.is-open .ap-privacy-inner{ padding:0 18px 20px; }
.ap-privacy-inner h4{ font-size:.95rem; font-weight:700; color:var(--ink); margin-bottom:10px; }
.ap-privacy-inner p{ font-size:.88rem; color:var(--ink-2); line-height:1.65; margin-top:10px; }
.ap-privacy-inner p:first-child{ margin-top:0; }
.ap-privacy-inner a{ color:var(--terracotta); text-decoration:underline; text-underline-offset:3px; }

/* consent */
.ap-consent{
  display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:start;
  margin-top:18px; padding:16px; background:var(--sand); border:1px solid var(--line-soft); border-radius:2px;
  font-size:.9rem; line-height:1.6; color:var(--ink-2); cursor:pointer;
}
.ap-consent input{ width:20px; height:20px; margin:2px 0 0; accent-color:var(--terracotta); cursor:pointer; }
.ap-consent:has(input:checked){ border-color:var(--terracotta); background:#FFF9F4; }

/* honeypot */
.ap-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* actions */
.ap-actions{
  display:flex; flex-wrap:wrap; gap:12px; align-items:center;
  margin-top:clamp(26px,3.4vw,36px); padding-top:clamp(22px,2.6vw,28px); border-top:1px solid var(--line-soft);
}
.ap-actions .btn{ min-width:170px; flex:1 1 auto; }
@media (min-width:600px){ .ap-actions .btn{ flex:0 0 auto; } .ap-actions #apNext,.ap-actions .ap-submit{ margin-left:auto; } }
.btn-outline{ border:1px solid var(--line); color:var(--ink-2); }
.btn-outline:hover{ border-color:var(--ink); color:var(--ink); }
.ap-submit{ position:relative; }
.ap-spin{ display:none; width:15px; height:15px; border:2px solid rgba(255,255,255,.4); border-top-color:#fff; border-radius:50%; }
.ap-submit.is-busy .ap-spin{ display:block; animation:apSpin .7s linear infinite; }
@keyframes apSpin{ to{ transform:rotate(360deg); } }
.ap-status{ margin-top:16px; font-size:.9rem; color:var(--ink-2); }
.ap-status.is-error{ color:#9B3325; }
.ap-status:empty{ display:none; }

/* success */
.ap-done{ background:var(--sea-deep); color:var(--sand); padding:clamp(28px,4vw,48px); border-left:3px solid var(--terracotta); }
.ap-done-kicker{ font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:#E0A183; }
.ap-done-h{ margin-top:12px; font-family:var(--serif); font-size:clamp(1.5rem,3vw,2.15rem); font-weight:500; letter-spacing:-.02em; line-height:1.15; color:#FDF8EF; }
.ap-done-body{ margin-top:14px; color:rgba(248,243,234,.78); max-width:56ch; }
.ap-id{ margin:clamp(24px,3vw,32px) 0 12px; padding:20px 22px; border:1px solid rgba(248,243,234,.22); display:inline-block; }
.ap-id-label{ display:block; font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:rgba(248,243,234,.6); }
.ap-id-value{ display:block; margin-top:8px; font-family:var(--serif); font-size:clamp(2rem,4.5vw,2.8rem); font-weight:600; letter-spacing:.02em; color:#F0C3AC; }
.ap-done-keep{ font-size:.86rem; color:rgba(248,243,234,.6); margin-bottom:24px; }

@media (min-width:600px){
  .ap-row{ grid-template-columns:1fr 1fr; }
  .ap-cards{ grid-template-columns:repeat(4,1fr); }
}

/* ---------- 20. FOOTER ---------- */
.site-footer{ background:#191410; color:rgba(248,243,234,.72); padding-top:clamp(48px,6vw,72px); }
.footer-inner{ display:grid; grid-template-columns:1fr; gap:32px; padding-bottom:clamp(36px,4vw,52px); }
.footer-title{ font-family:var(--serif); font-size:1.7rem; font-weight:500; letter-spacing:-.025em; color:#FDF8EF; }
.footer-title em{ font-style:italic; color:#E0A183; margin-inline:.08em; }
.footer-sub{ font-size:.8rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; margin-top:8px; color:rgba(248,243,234,.5); }
.footer-meta p{ font-size:.95rem; line-height:1.85; }
.footer-logos{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  padding-bottom:clamp(30px,4vw,44px);
}
.footer-logos img{
  height:56px; width:auto; background:#FBF7F0; padding:9px 13px; border-radius:2px;
}
.footer-bottom{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px;
  padding-block:20px; border-top:1px solid rgba(248,243,234,.12); font-size:.82rem; color:rgba(248,243,234,.5);
}
.to-top{ transition:color .3s; }
.to-top:hover{ color:#E0A183; }

/* ---------- 21. REVEAL ---------- */
[data-reveal]{ opacity:0; transform:translateY(18px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
[data-reveal].is-in{ opacity:1; transform:none; }

/* ---------- 22. BREAKPOINTS ---------- */
@media (min-width:600px){
  .field-row{ grid-template-columns:1fr 1fr; }
  .glance-grid{ grid-template-columns:1fr 1fr; column-gap:40px; }
  .glance-item{ padding:20px 0; }
  .glance-stats{ grid-template-columns:repeat(4,1fr); }
  .team-grid{ grid-template-columns:1fr 1fr; }
  .pack-grid{ grid-template-columns:1fr 1fr; }
  .hero-phases{ grid-template-columns:repeat(3,1fr); border-bottom:1px solid rgba(255,255,255,.14); }
  .phase{ flex-direction:column; gap:6px; padding:18px 22px 18px 0; border-bottom:0; }
  .phase + .phase{ border-left:1px solid rgba(255,255,255,.16); padding-left:22px; }
  .hero-actions .btn{ flex:0 0 auto; }
  .contact-grid{ grid-template-columns:1fr 1fr; }
  .route{ grid-template-columns:repeat(4,1fr); gap:20px; }
  .route-step{ padding:22px 12px 0 0; }
  .route-step::before{ left:0; top:5px; bottom:auto; width:100%; height:1px; }
  .route-dot{ top:0; left:0; }
  .trip-grid{ grid-template-columns:1fr 1fr; }
  .docs{ grid-template-columns:1.2fr 1fr; }
  .footer-inner{ grid-template-columns:1fr 1fr; }
}
@media (min-width:900px){
  html{ scroll-padding-top:90px; }
  .header-inner{ height:86px; }
  .header-inner{ gap:16px; }
  .nav-mobile{ top:86px; }

  .hero{ align-items:center; padding-top:140px; }
  .hero-inner{ max-width:1180px; }
  .hero-facts{ margin-top:20px; }

  .glance-grid{ grid-template-columns:repeat(4,1fr); column-gap:32px; }
  .glance-item{ padding:22px 0; }
  .glance-wide{ grid-column:span 1; }

  .welcome-grid{ grid-template-columns:1.05fr .95fr; gap:clamp(48px,6vw,90px); }
  .welcome-figure{ order:0; }
  .host-grid{ grid-template-columns:.95fr 1.05fr; gap:clamp(48px,6vw,90px); }
  .host-figure{ order:-1; }

  .team-grid{ grid-template-columns:repeat(4,1fr); }
  .reasons{ grid-template-columns:1fr 1fr; column-gap:clamp(40px,5vw,80px); }
  .reason{ padding:30px 0; }
  .aims{ grid-template-columns:repeat(5,1fr); column-gap:26px; border-top:1px solid rgba(248,243,234,.12); }
  .aim{ padding:26px 0 0; border-bottom:0; }

  .exp-grid{ grid-template-columns:repeat(3,1fr); }
  .exp-feature{ grid-column:span 3; display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
  .exp-feature .media{ height:100%; aspect-ratio:auto; min-height:320px; }
  .exp-feature .exp-body{ align-self:center; padding:clamp(32px,4vw,56px); }
  .exp-feature .exp h3{ font-size:2rem; }
  .exp-feature:nth-of-type(2) figure{ order:2; }
  .exp-half{ grid-column:span 1; }
  .exp-quiet{ grid-column:span 3; }
  .exp-quiet .exp-body{ display:flex; align-items:baseline; gap:28px; flex-wrap:wrap; }
  .exp-quiet .exp-num{ margin-bottom:0; }
  .exp-quiet p{ flex:1 1 340px; margin-top:0; }

  .stay-block{ display:block; }
  .stay-info{ display:flex; align-items:baseline; gap:22px; margin-bottom:22px; padding-bottom:16px; border-bottom:1px solid var(--line); }
  .stay-index{ margin-bottom:0; }
  .stay-media{ grid-template-columns:1.7fr 1fr 1fr; }
  .stay-media .media{ aspect-ratio:auto; height:clamp(240px,25vw,360px); }
  .stay-media .media-wide{ grid-column:auto; }
  .food{ grid-template-columns:1fr 1fr; }
  .food .media{ order:2; }

  .reimb-row{
    grid-template-columns:1.1fr .9fr auto; grid-template-areas:"country tag amount";
    padding:24px 0;
  }
  .tag{ justify-self:start; }
  .pack-grid{ grid-template-columns:repeat(3,1fr); }
  .pack-col-accent{ grid-row:span 2; }
  .contact-grid{ grid-template-columns:repeat(4,1fr); }
  .footer-inner{ grid-template-columns:1.2fr 1fr; align-items:start; }
}
@media (min-width:1150px){
  .nav-desktop{ display:flex; gap:clamp(13px,1.5vw,24px); }
  .burger{ display:none; }
  .nav-mobile{ display:none !important; }
}
@media (min-width:1100px){
  .stay-media{ gap:14px; }
  .exp-feature .exp h3{ font-size:2.15rem; }
}

/* ---------- 23. MOTION / PRINT ---------- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
  [data-reveal]{ opacity:1; transform:none; }
  .draw{ stroke-dashoffset:0; }
}
@media print{
  .site-header,.hero-actions,.to-top{ display:none; }
  body{ background:#fff; }
  .section{ padding-block:24px; break-inside:avoid; }
  .faq-a{ grid-template-rows:1fr !important; }
}

/* =====================================================================
   24. MOBILE DESIGN PASS  (phones only, <= 599px)
   Everything below is scoped to small screens. Desktop and tablet
   layouts above 600px are untouched.
   ===================================================================== */
@media (max-width:599px){

  /* ---- rhythm ---- */
  :root{ --gutter:22px; --sec-y:62px; }
  html{ scroll-padding-top:74px; }
  .section-head{ margin-bottom:30px; }
  .eyebrow{ font-size:.66rem; letter-spacing:.18em; margin-bottom:13px; }
  .h2{ font-size:2.1rem; line-height:1.04; letter-spacing:-.032em; }
  .h3{ font-size:1.45rem; }
  .lead{ font-size:.98rem; line-height:1.58; margin-top:14px; }
  .editorial-line{ font-size:1.12rem; margin-top:14px; }
  .prose p{ font-size:.98rem; line-height:1.62; }
  .micro-note{ font-size:.85rem; }
  .divider{ margin-block:38px; }
  .btn{ min-height:50px; }

  /* full-bleed helper for image-led blocks */
  .welcome-figure,.host-figure,.food .media{
    margin-inline:calc(-1 * var(--gutter));
    border-radius:0;
  }

  /* ---- 01 hero ---- */
  .hero{ padding-block:100px 24px; }
  .hero-media img{ object-position:50% 38%; }
  .hero-title{ font-size:clamp(3.1rem,15.5vw,4.4rem); line-height:.9; letter-spacing:-.04em; }
  .hero-tagline{ margin-top:14px; font-size:1.05rem; line-height:1.35; max-width:24ch; }
  .hero-motif{ max-width:62%; margin:16px 0 2px; }
  .hero-motif svg{ height:30px; }
  .hero-facts{ margin-top:14px; font-size:.85rem; gap:5px; }
  .hero-phases{
    display:grid; grid-template-columns:repeat(3,1fr); margin-top:20px;
    border-top:1px solid rgba(255,255,255,.24); border-bottom:1px solid rgba(255,255,255,.16);
  }
  .phase{ flex-direction:column; align-items:flex-start; gap:3px; padding:11px 8px 12px 0; border-bottom:0; }
  .phase + .phase{ border-left:1px solid rgba(255,255,255,.16); padding-left:12px; }
  .phase-date{ min-width:0; font-size:.62rem; letter-spacing:.1em; }
  .phase-label{ font-size:.82rem; line-height:1.2; }
  .hero-actions{ margin-top:22px; gap:10px; }
  .hero-actions .btn{ width:100%; min-width:0; }

  /* ---- 02 project at a glance ---- */
  .glance-grid{ grid-template-columns:1fr 1fr; column-gap:18px; border-top:1px solid var(--line); }
  .glance-item{ padding:14px 0; }
  .glance-item dt{ font-size:.6rem; letter-spacing:.14em; margin-bottom:3px; }
  .glance-item dd{ font-size:1rem; }
  .glance-wide{ grid-column:1 / -1; }
  .glance-stats{ margin-top:32px; }
  .stat{ padding:20px 10px; }
  .stat-num{ font-size:2.5rem; }
  .stat-cap{ margin-top:7px; font-size:.63rem; letter-spacing:.1em; }
  .glance-strapline{ margin-top:30px; font-size:1.02rem; }

  /* ---- 03 welcome ---- */
  .welcome-figure{ aspect-ratio:4/3; }
  .welcome-grid,.host-grid{ gap:26px; }
  .host-figure{ aspect-ratio:4/3; }
  .host-motto{ margin-top:22px; padding-top:18px; font-size:1.05rem; }

  /* ---- 04 the people ---- */
  .team-grid{ grid-template-columns:1fr 1fr; }
  .team-card{ padding:18px 15px; gap:11px; }
  .team-country{ font-size:.63rem; letter-spacing:.12em; }
  .team-top{ gap:8px; }
  .flag{ width:22px; height:15px; }
  .team-org{ font-size:1.1rem; line-height:1.15; }
  .team-list{ gap:4px; }
  .team-list li{ font-size:.84rem; }
  .logo-slot{ height:40px; max-width:100%; margin-top:4px; }
  .team-statement{ margin-top:30px; font-size:1.2rem; line-height:1.4; }

  /* ---- 05 why ---- */
  .why-statement{ font-size:1.3rem; margin-top:18px; }
  .reason{ padding:22px 0; }
  .reason-num{ margin-bottom:7px; }
  .reason h3{ font-size:1.26rem; }
  .reason p{ font-size:.95rem; margin-top:8px; }
  .mission{ margin-top:38px; padding:24px 20px; }
  .mission-text{ font-size:1.35rem; line-height:1.28; }
  .aims{ margin-top:34px; }
  .aim{ padding:18px 0; }
  .aim h4{ font-size:.72rem; margin-bottom:6px; }
  .aim p{ font-size:.94rem; }

  /* ---- 06 what will we do ---- */
  .exp-body{ padding:20px 18px; }
  .exp-num{ margin-bottom:9px; }
  .exp h3{ font-size:1.22rem; }
  .exp p{ font-size:.93rem; margin-top:9px; }
  .exp-feature .media{ aspect-ratio:4/3; }
  .exp-feature .media img{ object-position:50% 42%; }
  .exp-map{ min-height:auto; padding:10px; }
  .exp-note{ margin-top:20px; font-size:.85rem; }

  /* ---- 07 accommodation: swipeable photo strip ---- */
  .stay-block{ margin-bottom:44px; gap:16px; }
  .stay-info{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
  .stay-index{ margin-bottom:0; }
  .stay-info .h3{ font-size:1.3rem; }
  .stay-media{
    display:grid; grid-auto-flow:column; grid-auto-columns:84%; gap:10px;
    overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory;
    margin-inline:calc(-1 * var(--gutter)); padding-inline:var(--gutter);
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
  }
  .stay-media::-webkit-scrollbar{ display:none; }
  .stay-media .media{ aspect-ratio:4/3; scroll-snap-align:center; }
  .stay-media .media-wide{ grid-column:auto; }
  .stay-note{ padding:20px 0; font-size:.98rem; }
  .food{ margin-top:44px; gap:22px; }
  .food .media{ aspect-ratio:4/3; }
  .tick-list{ margin-top:16px; gap:8px; }

  /* ---- 08 travel ---- */
  .route{ margin-bottom:34px; }
  .route-step{ padding-bottom:22px; }
  .route-step h3{ font-size:1rem; }
  .trip{ padding:24px 20px; }
  .trip-date{ font-size:1.55rem; }
  .trip-lead{ margin-top:16px; font-size:.93rem; }
  .big-time{ font-size:3.6rem; }
  .trip-body{ font-size:.92rem; }
  .strong-time{ font-size:1.2rem; }
  .reimb{ margin-top:48px; }
  .reimb-row{ padding:16px 0; }
  .reimb-country{ font-size:1rem; }
  .reimb-amount{ font-size:1.9rem; }
  .reimb-amount span{ font-size:.6rem; margin-top:4px; }
  .tag{ font-size:.62rem; padding:3px 7px; }
  .callout{ padding:22px 18px; }
  .callout-title{ font-size:1.3rem; }
  .docs h4{ font-size:.74rem; }
  .extra{ padding:24px 20px; margin-top:42px; }
  .warn-list li{ font-size:.93rem; }
  .reimb-note{ padding:22px 18px; }
  .reimb-note-title{ font-size:1.22rem; }
  .calc{ margin:20px 0 16px; padding:16px 0; }
  .calc-num{ font-size:1.85rem; }
  .calc-cap{ font-size:.8rem; }

  /* ---- 09 before you pack ---- */
  .pack-col{ padding:20px 18px; }
  .pack-col h3{ font-size:.74rem; margin-bottom:14px; }
  .check-list{ gap:9px; }
  .check-list li{ font-size:.95rem; padding-left:26px; }
  .pack-intro{ font-size:.9rem; }

  /* ---- 11 faq ---- */
  .faq-q{ padding:17px 0; font-size:1rem; min-height:56px; align-items:center; }
  .faq-q i{ margin-top:0; }
  .faq-a p{ font-size:.95rem; padding-bottom:20px; }

  /* ---- 12 contact ---- */
  .contact-card{ padding:20px 18px; }
  .contact-org{ font-size:1.2rem; }
  .contact-mail{ font-size:.88rem; margin-top:8px; }
  .contact-actions{ gap:8px; padding-top:16px; }
  .contact-actions .btn{ flex:1 1 auto; min-height:46px; }

  /* ---- footer ---- */
  .site-footer{ padding-top:44px; }
  .footer-inner{ gap:24px; padding-bottom:26px; }
  .footer-title{ font-size:1.45rem; }
  .footer-sub{ font-size:.7rem; margin-top:6px; }
  .footer-meta p{ font-size:.92rem; line-height:1.75; }
  .footer-logos{ gap:10px; padding-bottom:26px; }
  .footer-logos img{ height:44px; padding:7px 10px; }
  .footer-bottom{ font-size:.78rem; padding-block:16px; }
}

/* very narrow phones */
@media (max-width:344px){
  .team-grid{ grid-template-columns:1fr; }
  .glance-grid{ grid-template-columns:1fr; }
  .hero-title{ font-size:2.9rem; }
}

/* =====================================================================
   25. APPLY: MOBILE ONBOARDING  +  26. STICKY APPLY BAR (mobile only)
   ===================================================================== */
.ap-stepline{ display:none; }
.apply-bar{ display:none; }

@media (max-width:599px){
  /* --- compact stepper: "Step 2 of 4" + dots, instead of the 4-column list --- */
  .ap-steps{ display:none; }
  .ap-stepline{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding-bottom:16px; margin-bottom:20px; border-bottom:1px solid var(--line-soft);
  }
  .ap-stepline-text{
    font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--terracotta);
  }
  .ap-dots{ display:flex; gap:6px; }
  .ap-dots i{
    width:7px; height:7px; border-radius:50%; background:var(--line);
    transition:background .3s var(--ease), transform .3s var(--ease);
  }
  .ap-dots i.is-on{ background:var(--terracotta); transform:scale(1.25); }
  .ap-dots i.is-past{ background:rgba(180,82,44,.45); }

  /* --- the form itself --- */
  .section-apply .ap-facts{ font-size:.7rem; gap:8px; }
  .ap-note{ font-size:.88rem; }
  .ap-shell{ padding:20px 17px; }
  .ap-panel-h{ font-size:1.4rem; }
  .ap-panel-sub{ font-size:.93rem; margin-top:7px; }
  .ap-panel > .ap-field,.ap-panel > .ap-row{ margin-top:22px; }
  .ap-label{ font-size:.92rem; }
  .ap-help,.ap-hint{ font-size:.85rem; }
  .ap-form input[type=text],.ap-form input[type=email],.ap-form input[type=tel],
  .ap-form input[type=date],.ap-form textarea{ font-size:16px; min-height:54px; padding:14px; }
  .ap-form textarea{ min-height:auto; }
  #apMotivation{ min-height:150px; }
  #apDance{ min-height:120px; }
  .ap-card-in{ padding:14px 12px; }
  .ap-card-name{ font-size:.92rem; }
  .ap-pills{ display:grid; grid-template-columns:1fr; gap:8px; }
  .ap-pill span{ padding:14px 16px; font-size:.94rem; }
  .ap-opt-in{ padding:14px; column-gap:11px; }
  .ap-opt-title{ font-size:.94rem; }
  .ap-opt-desc{ font-size:.85rem; line-height:1.55; }
  .ap-privacy-btn{ padding:15px 16px; font-size:.8rem; }
  .ap-privacy.is-open .ap-privacy-inner{ padding:0 16px 18px; }
  .ap-privacy-inner p{ font-size:.86rem; }
  .ap-consent{ padding:15px; font-size:.89rem; }
  .ap-actions{ flex-direction:column-reverse; gap:10px; margin-top:26px; padding-top:22px; }
  .ap-actions .btn{ width:100%; min-width:0; }
  .ap-status{ font-size:.88rem; }
  .ap-done{ padding:26px 20px; }
  .ap-done-h{ font-size:1.5rem; }
  .ap-done-body{ font-size:.95rem; }

  /* --- sticky apply bar --- */
  .apply-bar{
    display:block; position:fixed; left:0; right:0; bottom:0; z-index:90;
    background:rgba(248,243,234,.94); backdrop-filter:blur(10px);
    border-top:1px solid var(--line-soft);
    padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
    transform:translateY(120%); opacity:0; pointer-events:none;
    transition:transform .35s var(--ease), opacity .3s var(--ease);
  }
  .apply-bar.is-on{ transform:none; opacity:1; pointer-events:auto; }
  .apply-bar-in{ display:flex; align-items:center; gap:14px; }
  .apply-bar-meta{
    flex:1 1 auto; min-width:0; font-size:.68rem; font-weight:600; letter-spacing:.1em;
    text-transform:uppercase; color:var(--ink-2); line-height:1.35;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  .apply-bar-btn{ flex:0 0 auto; min-height:46px; padding:0 20px; font-size:.88rem; white-space:nowrap; }
  body.bar-on{ padding-bottom:74px; }
}
@media (max-width:599px) and (prefers-reduced-motion:reduce){
  .apply-bar{ transition:none; }
}

/* small phones: keep the header inside 320px in every language */
@media (max-width:359px){
  :root{ --gutter:16px; }
  .header-inner{ gap:8px; }
  .brand{ gap:8px; }
  .brand-mark,.brand-mark svg{ width:26px; }
  .brand-text{ font-size:1rem; }
  .lang-btn{ padding:7px 8px; gap:5px; font-size:.72rem; }
  .burger{ width:40px; margin-left:0; margin-right:-6px; }
  .apply-bar-meta{ font-size:.62rem; }
  .apply-bar-btn{ padding:0 15px; font-size:.82rem; }
  .hero-facts{ font-size:.8rem; }
  .phase-label{ font-size:.75rem; }
}