/* Fujiko — Mount Fuji guiding company
   Type is the niche decision here: Shippori Mincho B1 is an actual Japanese
   mincho face, Zen Kaku Gothic New an actual Japanese gothic. Latin set on a
   Japanese family sits differently from a western serif and that difference is
   the whole point. Accent is shu-iro (vermilion, shrine gates and seal ink),
   used once or twice a screen and never as a glow. */

:root{
  --ink:#111519;
  --ink2:#414A52;
  --ink3:#7B858D;
  --paper:#ffffff;
  --wash:#F2F2F1;          /* neutral stone. any yellow in here reads as cream */
  --indigo:#1B2A4A;
  --shu:#B23A2C;
  --line:#E0DFDB;
  --disp:"Shippori Mincho B1",Georgia,serif;
  --ui:"Zen Kaku Gothic New","Helvetica Neue",Arial,sans-serif;
  --pad:clamp(20px,5vw,80px);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--ui);font-size:17px;line-height:1.75;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit}

/* ---------- shared bits ---------- */

.wrap{max-width:1400px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}

.seal{
  display:inline-flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:50%;
  border:1.5px solid var(--shu);color:var(--shu);
  font-family:var(--disp);font-size:19px;line-height:1;letter-spacing:0;
  flex:none;
}

.label{
  display:flex;align-items:center;gap:18px;margin-bottom:clamp(34px,4vw,58px);
}
.label b{font-family:var(--disp);font-weight:500;font-size:20px;letter-spacing:.14em;color:var(--ink)}
.label i{
  font-style:normal;font-size:12px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--ink3);border-left:1px solid var(--line);padding-left:18px;
}

h1,h2,h3{font-family:var(--disp);font-weight:500;margin:0;letter-spacing:-.005em}

.vert{
  writing-mode:vertical-rl;font-family:var(--disp);
  letter-spacing:.34em;font-size:13px;
}

/* ---------- masthead ---------- */

.top{
  position:absolute;top:0;left:0;right:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  padding:30px var(--pad);color:#fff;
  text-shadow:0 1px 12px rgba(10,14,20,.5);
}
.top.dark{color:var(--ink);position:relative;border-bottom:1px solid var(--line);text-shadow:none}
.mark{font-family:var(--disp);font-size:19px;letter-spacing:.3em;text-decoration:none}
.nav{display:flex;gap:34px;font-size:13px;letter-spacing:.11em;text-transform:uppercase}
.nav a{text-decoration:none;opacity:.95;padding-bottom:2px}
.nav a:hover{opacity:1;box-shadow:inset 0 -1px 0 currentColor}
@media(max-width:820px){.nav{display:none}}

/* ---------- hero ---------- */

.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;background:var(--indigo)}
.hero .shot{position:absolute;inset:-8% 0;width:100%;height:116%;object-fit:cover;will-change:transform}
.hero:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,14,20,.30) 0%,rgba(10,14,20,0) 16%,rgba(10,14,20,.10) 52%,rgba(10,14,20,.80) 100%);
}
.hero .said{
  position:absolute;z-index:10;left:var(--pad);right:var(--pad);bottom:clamp(48px,7vh,86px);
  color:#fff;
}
.hero h1{
  font-size:clamp(38px,6.4vw,92px);line-height:1.04;max-width:16ch;
  text-wrap:balance;
}
.hero p{
  margin:26px 0 0;max-width:44ch;font-size:clamp(16px,1.35vw,19px);
  line-height:1.7;color:rgba(255,255,255,.85);
}
.eyebrow{
  font-size:12px;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(255,255,255,.72);margin:0 0 22px;display:flex;align-items:center;gap:14px;
}
.eyebrow:before{content:"";width:46px;height:1px;background:var(--shu)}
.hero .vert{
  position:absolute;z-index:10;right:var(--pad);top:110px;font-size:15px;
  color:rgba(255,255,255,.92);text-shadow:0 1px 14px rgba(10,14,20,.55);
}
@media(max-width:820px){.hero .vert{display:none}}

/* ---------- the hold: one long editorial screen, no price ---------- */

.hold{padding:clamp(90px,12vw,170px) 0}
.hold-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(40px,6vw,92px);align-items:start}
.hold blockquote{
  margin:0;font-family:var(--disp);font-size:clamp(22px,2.5vw,34px);line-height:1.58;
  letter-spacing:-.01em;
}
.hold blockquote em{font-style:normal;color:var(--shu)}
.hold .foot{
  display:flex;gap:22px;align-items:flex-start;margin-top:clamp(38px,4vw,54px);
  padding-top:30px;border-top:1px solid var(--line);max-width:56ch;
}
.hold .foot p{margin:0;color:var(--ink2);font-size:16px}
.hold figure{margin:0}
.hold figure img{width:100%;height:clamp(380px,52vw,620px);object-fit:cover}
.hold figcaption{
  margin-top:14px;font-size:13px;color:var(--ink3);letter-spacing:.02em;
}
@media(max-width:900px){.hold-grid{grid-template-columns:1fr}}

/* ---------- the mountain year ---------- */

.year{background:var(--wash);padding:clamp(90px,12vw,150px) 0}
.year-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center}
.year-stage{position:relative;aspect-ratio:4/5;background:var(--indigo);overflow:hidden}
.year-stage img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .7s ease;
}
.year-stage img.on{opacity:1}
.months{display:flex;gap:0;border-top:1px solid var(--line);margin-bottom:38px}
.months button{
  flex:1;appearance:none;background:none;border:0;border-top:2px solid transparent;
  margin-top:-1px;padding:18px 4px 0;cursor:pointer;text-align:left;
  font-family:var(--disp);font-size:15px;letter-spacing:.1em;color:var(--ink3);
  transition:color .25s,border-color .25s;
}
.months button:hover{color:var(--ink)}
.months button[aria-selected="true"]{color:var(--ink);border-top-color:var(--shu)}
.year h2{font-size:clamp(28px,3.4vw,46px);line-height:1.22;max-width:15ch;min-height:2.5em}
.year .say{margin:22px 0 0;color:var(--ink2);max-width:42ch;min-height:6.2em}
.year .go{
  display:inline-flex;align-items:center;gap:12px;margin-top:30px;
  font-size:13px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  color:var(--ink);border-bottom:1px solid var(--shu);padding-bottom:7px;
}
.year .go span{color:var(--shu)}
@media(max-width:900px){
  .year-in{grid-template-columns:1fr}
  .year-stage{aspect-ratio:3/2;order:-1}
  .year h2,.year .say{min-height:0}
  .months button{font-size:13px;letter-spacing:.04em}
}

/* ---------- two journeys: first time a price appears ---------- */

.trips{padding:clamp(90px,12vw,160px) 0}
.trip{
  display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(30px,4.5vw,70px);
  align-items:center;text-decoration:none;
}
.trip + .trip{margin-top:clamp(70px,9vw,130px)}
.trip:nth-child(odd) .shotwrap{order:2}
.shotwrap{overflow:hidden;background:var(--wash)}
.shotwrap img{width:100%;height:clamp(320px,44vw,540px);object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.trip:hover .shotwrap img{transform:scale(1.035)}
.trip h3{font-size:clamp(27px,3.2vw,42px);line-height:1.2;max-width:14ch}
.trip .sub{margin:20px 0 0;color:var(--ink2);max-width:40ch}
.tmeta{
  display:flex;align-items:baseline;gap:26px;margin-top:32px;
  padding-top:24px;border-top:1px solid var(--line);
}
.price{font-family:var(--disp);font-size:26px;color:var(--ink)}
.per{font-size:13px;color:var(--ink3);letter-spacing:.04em}
.trip .arrow{margin-left:auto;color:var(--shu);font-size:22px;line-height:1}
@media(max-width:900px){
  .trip,.trip:nth-child(odd) .shotwrap{grid-template-columns:1fr;order:0}
  .trip .body{order:2}
}

/* ---------- footer ---------- */

.foot-band{background:var(--indigo);color:#fff;padding:clamp(64px,8vw,104px) 0 44px}
.foot-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;align-items:flex-end}
.foot-band h2{font-size:clamp(26px,3.4vw,44px);max-width:16ch;line-height:1.24}
.foot-band .cta{
  display:inline-block;padding:17px 34px;border:1px solid rgba(255,255,255,.4);
  text-decoration:none;font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  transition:background .3s,color .3s,border-color .3s;
}
.foot-band .cta:hover{background:#fff;color:var(--indigo);border-color:#fff}
.foot-rule{height:1px;background:rgba(255,255,255,.18);margin:clamp(48px,6vw,76px) 0 26px}
.foot-fine{
  display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.6);
}

/* ---------- ascent page ---------- */

.page-head{padding:clamp(56px,7vw,92px) 0 clamp(40px,5vw,64px)}
.page-head h1{font-size:clamp(36px,5.4vw,74px);line-height:1.08;max-width:15ch}
.page-head .lede{margin:26px 0 0;max-width:52ch;font-size:clamp(17px,1.4vw,20px);color:var(--ink2)}
.head-meta{
  display:flex;flex-wrap:wrap;gap:10px 30px;margin:30px 0 0;padding-top:22px;
  border-top:1px solid var(--line);font-size:14px;color:var(--ink3);max-width:52ch;
}
.head-meta b{font-family:var(--disp);font-weight:500;color:var(--ink)}
.band{width:100%;height:clamp(420px,46vw,600px);object-fit:cover}

/* the planner — the mechanic that makes this page sell */
.plan{padding:clamp(80px,10vw,140px) 0}
.plan-in{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(36px,5vw,76px);align-items:start}
.plan-shot{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--indigo)}
@media(max-width:900px){.plan-shot{aspect-ratio:4/3;margin-bottom:34px}}
.mgrid{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}
.mgrid button{
  appearance:none;background:none;cursor:pointer;
  border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:30px 8px;font-family:var(--disp);font-size:16px;letter-spacing:.08em;
  color:var(--ink3);position:relative;transition:background .2s,color .2s;
}
.mgrid button:hover{background:var(--wash);color:var(--ink)}
.mgrid button[aria-selected="true"]{background:var(--ink);color:#fff}
.mgrid button i{display:none}
.mgrid button.open{background:#FAEFED;color:var(--shu)}
.mgrid button.open:hover{background:#F6E4E1}
.mkey{display:flex;align-items:center;gap:11px;margin-top:20px;font-size:13px;color:var(--ink3)}
.mkey s{width:26px;height:14px;background:#FAEFED;border:1px solid #EBD6D2;display:block}

.card{border-top:2px solid var(--ink);padding:clamp(28px,3vw,40px) 0 0;margin-top:clamp(30px,3.6vw,44px)}
.status{
  display:inline-flex;align-items:center;gap:11px;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--shu);margin-bottom:24px;
}
.status:before{content:"";width:26px;height:1px;background:var(--shu)}
.status.shut{color:var(--ink3)}
.status.shut:before{background:var(--ink3)}
.card h3{font-size:clamp(24px,2.7vw,34px);line-height:1.26;max-width:19ch}
.card .say{margin:20px 0 0;color:var(--ink2);max-width:46ch}
.rows{margin:32px 0 0;border-top:1px solid var(--line)}
.rows div{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line)}
.rows dt{color:var(--ink3);font-size:14px;margin:0}
.rows dd{margin:0;text-align:right;font-size:15px}
.rows dd b{font-family:var(--disp);font-weight:500}
.book{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  margin-top:32px;padding:20px 26px;background:var(--ink);color:#fff;
  width:100%;border:0;font-family:var(--ui);font-size:14px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;transition:background .3s;
}
.book:hover{background:var(--indigo)}
.book:disabled{background:var(--wash);color:var(--ink3);cursor:not-allowed}
.book span{font-size:19px;line-height:1}
.book em{font-style:normal}
.said-back{
  margin-top:16px;font-size:14px;color:var(--shu);min-height:1.5em;
}
@media(max-width:900px){.plan-in{grid-template-columns:1fr}}

/* two days */
.days{background:var(--wash);padding:clamp(80px,10vw,140px) 0}
.day{display:grid;grid-template-columns:170px 1fr 1fr;gap:clamp(26px,3.6vw,58px);align-items:start}
.day + .day{margin-top:clamp(54px,7vw,96px);padding-top:clamp(54px,7vw,96px);border-top:1px solid var(--line)}
.day .n{font-family:var(--disp);font-size:15px;letter-spacing:.2em;color:var(--shu);padding-top:8px}
.day h3{font-size:clamp(23px,2.5vw,32px);line-height:1.26}
.day p{margin:18px 0 0;color:var(--ink2)}
.day img{width:100%;height:clamp(240px,30vw,360px);object-fit:cover}
@media(max-width:900px){.day{grid-template-columns:1fr}.day .n{padding-top:0}}

.incl{padding:clamp(80px,10vw,140px) 0}
.incl-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4vw,70px)}
.incl h3{font-size:20px;margin-bottom:22px}
.incl .rows dd{max-width:26ch}
@media(max-width:820px){.incl-in{grid-template-columns:1fr}}

/* motion, kept small on purpose */
.rise{opacity:0;transform:translateY(26px)}


/* ---------- route profile + what it covers ---------- */

.route{padding:clamp(80px,10vw,140px) 0}
.route-in{display:grid;grid-template-columns:1.32fr .68fr;gap:clamp(36px,5vw,80px);align-items:end}
.route h2{font-size:clamp(26px,3vw,40px);line-height:1.22;max-width:22ch;text-wrap:balance}
.route svg{width:100%;height:auto;display:block;margin-top:clamp(30px,4vw,48px)}
.route .legend{display:flex;gap:28px;margin-top:22px;font-size:13px;color:var(--ink3)}
.route .legend span{display:flex;align-items:center;gap:9px}
.route .legend s{width:22px;height:2px;display:block;text-decoration:none}
.covers{border-top:1px solid var(--line);margin-top:34px}
.covers p{margin:0;padding:17px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--ink2)}
.covers p b{font-family:var(--disp);font-weight:500;color:var(--ink);margin-right:10px}
@media(max-width:900px){.route-in{grid-template-columns:1fr}}

.people{padding:0 0 clamp(80px,10vw,140px)}
.people-in{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(34px,5vw,76px);align-items:center}
.people img{width:100%;height:clamp(340px,42vw,540px);object-fit:cover}
.people h2{font-size:clamp(24px,2.8vw,36px);line-height:1.3;max-width:18ch}
.people p{margin:22px 0 0;color:var(--ink2);max-width:40ch}
.people .cap{margin-top:16px;font-size:13px;color:var(--ink3)}
@media(max-width:900px){.people-in{grid-template-columns:1fr}}