@charset "utf-8";
/* =================================================================
   トップページの各場面
   ================================================================= */

/* ---------------------------------------------- HERO */
.hero{
  min-height:100svh; display:flex; flex-direction:column; justify-content:center;
  overflow:hidden; padding-inline:var(--pad); padding-top:calc(var(--topbar-h) + 20px);
}
.hero__sky{
  position:absolute; inset:-10% 0 0 0; z-index:-3;
  background:
    radial-gradient(120% 70% at 50% 108%, rgba(232,140,66,.55) 0%, rgba(232,140,66,0) 60%),
    linear-gradient(180deg, #e3d2bd 0%, #eee0cf 40%, #f2e6d8 100%);
}
.hero__sun{
  position:absolute; left:50%; bottom:-16vmin; z-index:-2;
  width:46vmin; height:46vmin; margin-left:-23vmin; border-radius:50%;
  background:radial-gradient(circle, rgba(255,216,150,.95) 0%, rgba(242,164,84,.5) 46%, rgba(242,164,84,0) 70%);
  animation:sunrise 6s var(--ease-out) .2s both;
}
/* translate はパララックス（JS）が使うので、登場の動きは transform で */
@keyframes sunrise{ from{ transform:translateY(22vmin); opacity:0; } to{ transform:none; opacity:1; } }
html.is-booting .hero__sun{ animation-delay:2.4s; }
.hero::after{
  content:""; position:absolute; inset:auto 0 0 0; height:34%; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(242,230,216,0) 0%, #f2e6d8 100%);
}

/* 遠くを渡る鳥。3羽、少しずつ違う速さで */
.hero__birds{ position:absolute; inset:18% 0 auto 0; height:30%; z-index:-1; pointer-events:none; }
.hero__birds i{
  position:absolute; left:-6%; width:14px; height:6px;
  border-top:1.3px solid rgba(60,42,30,.55); border-radius:50% 50% 0 0;
  animation:fly 26s linear infinite;
}
.hero__birds i::after{
  content:""; position:absolute; left:12px; top:-1.3px; width:14px; height:6px;
  border-top:1.3px solid rgba(60,42,30,.55); border-radius:50% 50% 0 0;
}
.hero__birds i:nth-child(1){ top:20%; animation-delay:-4s; }
.hero__birds i:nth-child(2){ top:34%; animation-duration:31s; animation-delay:-14s; transform:scale(.75); }
.hero__birds i:nth-child(3){ top:12%; animation-duration:36s; animation-delay:-22s; transform:scale(.6); }
@keyframes fly{
  0%{ translate:0 0; } 25%{ translate:30vw -14px; } 50%{ translate:60vw 6px; }
  75%{ translate:90vw -10px; } 100%{ translate:118vw 0; }
}

.hero__meta{
  position:absolute; bottom:clamp(28px,5vh,48px); display:flex; flex-direction:column; gap:2px;
  font-family:var(--sans); font-size:10px; letter-spacing:.3em; color:var(--muted);
  opacity:0; animation:fadeIn 1.2s var(--ease) 1.4s forwards;
}
html.is-booting .hero__meta{ animation-delay:3.4s; }
.hero__meta--l{ left:var(--pad); }
.hero__meta--r{ right:var(--pad); text-align:right; }

.hero__inner{ width:100%; max-width:var(--wrap); margin-inline:auto; text-align:center; }
.logo--hero{
  width:min(84vw, 470px);
  opacity:0; transform:scale(.94); filter:blur(10px);
  animation:logoIn 2s var(--ease-out) .25s forwards;
}
html.is-booting .logo--hero{ animation-delay:2.5s; }
@keyframes logoIn{ to{ opacity:1; transform:none; filter:none; } }
/* 登場後はアニメーションを外し、スクロール連動（JSの inline style）に明け渡す */
.logo--hero.is-settled{ animation:none; opacity:1; transform:none; filter:none; }
/* 注意：.hero__inner など、ロゴの祖先に opacity / transform / filter を付けないこと。
   multiply の合成が祖先の中に閉じ込められ、ロゴの白地が見えてしまう。 */
.hero__en{
  margin-top:clamp(22px,3.4vw,40px);
  font-family:var(--sans); font-size:clamp(11px,1.35vw,14px);
  letter-spacing:.36em; text-transform:uppercase; color:var(--accent);
}
.hero__scroll{
  position:absolute; left:50%; bottom:clamp(24px,4vh,40px); translate:-50% 0;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-family:var(--sans); font-size:9px; letter-spacing:.32em; color:var(--muted);
}
.hero__scroll i{
  display:block; width:1px; height:52px; background:currentColor; opacity:.5;
  transform-origin:top; animation:drip 2.4s var(--ease-io) infinite;
}
@keyframes drip{
  0%{ transform:scaleY(0); transform-origin:top; }
  45%{ transform:scaleY(1); transform-origin:top; }
  55%{ transform:scaleY(1); transform-origin:bottom; }
  100%{ transform:scaleY(0); transform-origin:bottom; }
}

/* ---------------------------------------------- はじめに */
.statement__grid{ display:grid; gap:clamp(18px,2.6vw,30px); }
.statement__en{
  font-family:var(--sans); font-size:clamp(12px,1.5vw,15px);
  letter-spacing:.32em; color:var(--muted); line-height:2.3;
}
.statement__ja{ font-size:clamp(34px,7vw,88px); letter-spacing:.08em; line-height:1.3; }
.statement__body{ font-size:clamp(17px,2.1vw,23px); line-height:2.2; }
.statement__note{
  font-size:14px; color:var(--muted); line-height:2.2; max-width:34em;
  padding-left:20px; border-left:1px solid var(--accent);
}
@media (min-width:1024px){
  .statement__grid{ grid-template-columns:5fr 7fr; column-gap:64px; align-items:start; }
  .statement__en{ grid-row:1 / span 2; padding-top:1.4em; }
  .statement__note{ grid-column:2; margin-top:24px; }
}

/* ---------------------------------------------- 朝の瞑想（象徴の一枚） */
.within{
  min-height:110svh; display:flex; align-items:flex-start; overflow:hidden;
  padding-top:clamp(110px,17vh,200px);
}
.within__scape{ position:absolute; inset:0; z-index:-1; }
.within__breath{
  position:absolute; left:50%; top:66%; width:min(66vmin,560px); aspect-ratio:1;
  translate:-50% -50%; border-radius:50%;
  background:radial-gradient(circle, rgba(255,204,140,.7) 0%, rgba(255,204,140,0) 66%);
  animation:breathe 8s ease-in-out infinite;
}
/* 呼吸に合わせて広がる波紋 */
.within__ring{
  position:absolute; left:50%; top:74%; width:120px; aspect-ratio:1; translate:-50% -50%;
  border:1px solid rgba(192,112,56,.35); border-radius:50%;
  animation:ripple 8s ease-out infinite;
}
.within__ring--2{ animation-delay:4s; }
@keyframes breathe{ 0%,100%{ transform:scale(.86); opacity:.55; } 50%{ transform:scale(1.08); opacity:1; } }
@keyframes ripple{ 0%{ transform:scale(.6); opacity:0; } 20%{ opacity:.9; } 100%{ transform:scale(5); opacity:0; } }
.within__ridge{
  position:absolute; left:-5%; right:-5%; bottom:-4%; height:34vh;
  background:linear-gradient(180deg, rgba(43,34,25,0) 0%, rgba(43,34,25,.14) 100%);
  clip-path:polygon(0 62%, 9% 54%, 17% 58%, 28% 44%, 37% 52%, 47% 36%, 58% 50%, 68% 41%, 79% 52%, 90% 46%, 100% 56%, 100% 100%, 0 100%);
  mask-image:linear-gradient(180deg, #000 0%, #000 60%, transparent 100%);
}
.within__figure{
  position:absolute; left:50%; bottom:7vh; margin-left:calc(clamp(84px,12vmin,140px) / -2);
  width:clamp(84px,12vmin,140px); height:clamp(106px,16vmin,180px); opacity:.84;
}
.within__figure::before{
  content:""; position:absolute; left:50%; top:0; translate:-50% 0;
  width:33%; aspect-ratio:1; border-radius:50%; background:rgba(38,27,18,.88);
  animation:nod 8s ease-in-out infinite;
}
.within__figure::after{
  content:""; position:absolute; left:0; bottom:0; width:100%; height:66%;
  background:rgba(38,27,18,.88);
  border-radius:48% 48% 26% 26% / 62% 62% 18% 18%;
  transform-origin:bottom; animation:chest 8s ease-in-out infinite;
}
@keyframes nod{ 0%,100%{ translate:-50% 2px; } 50%{ translate:-50% -2px; } }
@keyframes chest{ 0%,100%{ transform:scaleY(.985); } 50%{ transform:scaleY(1.02); } }

.within__copy{ position:relative; text-align:center; }
.within__copy .eyebrow{ justify-content:center; }
.within__copy .eyebrow::before{ display:none; }
.within__ja{ font-size:clamp(17px,2.2vw,26px); line-height:1.9; margin-top:clamp(22px,3.2vw,38px); color:var(--muted); }
/* 「吸って / 吐いて」が呼吸の周期で入れ替わる */
.within__breathe{
  position:relative; height:1.6em; margin-top:clamp(22px,3vw,34px);
  font-family:var(--hand); font-size:clamp(15px,1.7vw,18px); color:var(--accent);
}
.within__breathe span{ position:absolute; inset:0; animation:inhale 8s ease-in-out infinite; }
.within__breathe .within__out{ animation-name:exhale; }
@keyframes inhale{ 0%,8%{ opacity:0; } 18%,38%{ opacity:1; } 48%,100%{ opacity:0; } }
@keyframes exhale{ 0%,52%{ opacity:0; } 62%,86%{ opacity:1; } 96%,100%{ opacity:0; } }

/* ---------------------------------------------- 一日の呼吸 */
.rhythm .wrap{ position:relative; }
.dial{
  position:relative; width:min(62vw,260px); aspect-ratio:1; margin:0 auto clamp(40px,6vw,70px);
}
.dial__svg{ width:100%; height:100%; transform:rotate(-90deg); overflow:visible; }
.dial__track{ fill:none; stroke:var(--line); stroke-width:1; }
.dial__arc{
  fill:none; stroke:var(--accent); stroke-width:1.5; stroke-linecap:round;
  stroke-dasharray:100; stroke-dashoffset:calc(100 - var(--p, 0) * 100);
}
.dial__hand{
  position:absolute; left:50%; top:50%; width:1px; height:43%;
  background:var(--ink); transform-origin:top center;
  transform:rotate(calc(180deg + var(--p, 0) * 360deg));
}
.dial__hand::after{
  content:""; position:absolute; left:-5px; bottom:-5px; width:11px; height:11px; border-radius:50%;
  background:var(--accent);
}
.dial__label{
  position:absolute; font-family:var(--sans); font-size:10px; letter-spacing:.24em; color:var(--muted);
}
.dial__label--m{ top:-26px; left:50%; translate:-50% 0; }
.dial__label--d{ right:-14px; bottom:12%; translate:100% 0; }
.dial__label--n{ left:-14px; bottom:12%; translate:-100% 0; }
@media (min-width:1024px){
  .dial{ position:absolute; right:var(--pad); top:-30px; width:200px; margin:0; }
}

.cycle{ display:grid; gap:clamp(36px,5vw,0px); }
.cycle__item{ position:relative; padding-block:clamp(28px,3.4vw,44px); border-top:1px solid var(--line); }
.cycle__time{
  font-family:var(--sans); font-size:10px; letter-spacing:.28em; color:var(--muted);
  display:flex; align-items:baseline; gap:12px;
}
.cycle__time b{ font-weight:300; font-size:30px; letter-spacing:.02em; color:var(--ink); }
.cycle__item--morning .cycle__time b{ color:#c98a3c; }
.cycle__item--day .cycle__time b{ color:#b4552a; }
.cycle__item--night .cycle__time b{ color:#4b5a98; }
.cycle__head{
  font-family:var(--sans); font-size:clamp(22px,2.6vw,32px); letter-spacing:.08em;
  text-transform:uppercase; margin:14px 0 8px;
}
.cycle__ja{ font-size:17px; line-height:2; }
.cycle__list{ font-size:13px; color:var(--muted); margin-top:16px; line-height:2.1; }
@media (min-width:900px){
  .cycle{ grid-template-columns:repeat(3,1fr); column-gap:clamp(24px,3.4vw,48px); }
  /* 少しずつ下にずらし、時間の流れを斜めに見せる */
  .cycle__item:nth-child(2){ margin-top:72px; }
  .cycle__item:nth-child(3){ margin-top:144px; }
}
.rhythm__loop{
  margin-top:clamp(48px,7vw,96px);
  display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px;
  font-family:var(--sans); font-size:clamp(11px,1.3vw,13px); letter-spacing:.22em; color:var(--muted);
}
.rhythm__loop i{ display:block; width:clamp(18px,4vw,48px); height:1px; background:var(--accent); opacity:.6; }
.rhythm__loop b{ font-weight:400; color:var(--accent); }

/* ---------------------------------------------- 10日間 */
.days{ overflow:hidden; }
.days__track{ position:relative; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.days__line{ display:none; }
.days__swipe{ display:none; }

.day{ position:relative; }
.day__head{ position:relative; }
.day__ja{ font-size:15px; margin-top:16px; }
/* その日の気持ち。余白に、手書きで */
.day__mood{
  font-family:var(--hand); font-size:14px; color:var(--accent); margin-top:6px;
  transform:rotate(-2deg); transform-origin:left;
}
.day__mood::before{ content:"― "; opacity:.6; }

/* パスポートのスタンプ。画面に入った瞬間に「押される」 */
.stamp{
  position:relative; width:132px; aspect-ratio:1; border-radius:50%;
  display:grid; place-content:center; text-align:center;
  color:var(--accent); border:1.5px solid currentColor;
  transform:rotate(var(--rot,-8deg));
  opacity:0;
}
.stamp::before{
  content:""; position:absolute; inset:6px; border-radius:50%; border:1px dashed currentColor; opacity:.55;
}
.stamp__day{ font-family:var(--sans); font-size:9px; letter-spacing:.34em; }
.stamp__n{ font-family:var(--sans); font-size:44px; font-weight:400; line-height:1; letter-spacing:.02em; }
.stamp__t{ font-family:var(--sans); font-size:8px; letter-spacing:.2em; margin-top:6px; max-width:90px; line-height:1.4; }
.day.is-in .stamp{ animation:stamp .55s cubic-bezier(.3,1.6,.5,1) forwards; }
@keyframes stamp{
  0%{ opacity:0; transform:scale(1.9) rotate(calc(var(--rot,-8deg) - 14deg)); filter:blur(3px); }
  60%{ opacity:1; filter:none; }
  100%{ opacity:.92; transform:scale(1) rotate(var(--rot,-8deg)); }
}

.phase{ padding-block:clamp(20px,2.4vw,28px); border-top:1px solid var(--line); }
.phase:first-child{ border-top:0; padding-top:0; }
.phase__time{
  font-family:var(--sans); font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--muted);
  display:flex; align-items:center; gap:10px; margin-bottom:10px;
}
.phase__time::before{ content:""; width:18px; height:1px; background:currentColor; }
.phase--morning .phase__time{ color:#d7a35c; }
.phase--day .phase__time{ color:#d0784a; }
.phase__head{ font-family:var(--sans); font-size:16px; letter-spacing:.06em; }
.phase__lead{ font-size:15px; color:var(--muted); margin-top:6px; line-height:2; }
.phase__items{ display:flex; flex-wrap:wrap; gap:6px 8px; margin-top:12px; }
.phase__items li{
  font-size:12px; color:var(--muted); border:1px solid var(--line); border-radius:99px; padding:3px 12px;
}
.phase__note{ font-size:12px; color:var(--muted); line-height:2; margin-top:12px; padding-left:14px; border-left:1px solid var(--line); }

/* 夜：罫線のノートに、手書きで問いが書かれていく */
.journal{
  position:relative; margin-top:clamp(16px,2vw,24px);
  padding:22px 22px 24px 46px;
  background:
    linear-gradient(90deg, transparent 31px, rgba(224,120,90,.45) 31px, rgba(224,120,90,.45) 32px, transparent 32px),
    repeating-linear-gradient(180deg, transparent 0 33px, rgba(120,140,190,.28) 33px 34px),
    #f4eee2;
  /* 罫線を文字の行に合わせる（上の余白 22px ぶん下げる） */
  background-position:0 0, 0 22px;
  color:#2c2620; border-radius:2px;
  box-shadow:0 1px 0 rgba(0,0,0,.05), 0 22px 40px -26px rgba(0,0,0,.7);
  transform:rotate(-.6deg);
}
.journal__date{ font-family:var(--sans); font-size:9px; letter-spacing:.3em; color:#8a7c6c; line-height:34px; }
.journal__head{ font-family:var(--hand); font-size:15px; color:#9a6a3a; line-height:34px; }
.journal__q{
  font-family:var(--hand); font-size:clamp(17px,2vw,21px); line-height:34px; color:#2c2620;
  clip-path:inset(0 100% 0 0); transition:clip-path 2.4s steps(40, end) .5s;
}
.day.is-in .journal__q{ clip-path:inset(0 0 0 0); }
.journal--quiet{ background:#14182c; color:#e6dccc; box-shadow:0 0 60px -10px rgba(224,170,82,.25); }
.journal--quiet .journal__date{ color:#8f8aa6; }
.journal--quiet .journal__head{ color:var(--accent); }
.journal--quiet .journal__q{ color:var(--accent); }
.journal--quiet{
  background:
    radial-gradient(60% 80% at 80% 20%, rgba(224,170,82,.18), transparent 70%),
    #14182c;
}

/* ---------- スマホ：10日間は横にめくるカード */
@media (max-width:899px){
  .days__track{ padding-inline:0; }
  .daylist{
    display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory;
    padding:6px var(--pad) 28px; scrollbar-width:none; overscroll-behavior-x:contain;
  }
  .daylist::-webkit-scrollbar{ display:none; }
  .day{
    flex:0 0 86%; scroll-snap-align:center;
    background:var(--panel); border:1px solid var(--line); border-radius:4px;
    padding:24px 20px 26px;
  }
  .day__head{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:4px 18px; margin-bottom:22px; }
  .stamp{ width:96px; grid-row:span 3; }
  .stamp__n{ font-size:32px; }
  .stamp__t{ font-size:7px; max-width:70px; }
  .day__title{ font-family:var(--sans); font-size:12px; letter-spacing:.16em; }
  .day__ja{ margin-top:0; }
  .days__swipe{
    display:block; width:fit-content; margin-inline:auto;
    font-family:var(--hand); font-size:13px; color:var(--muted); margin-top:4px;
    animation:nudge 2.4s ease-in-out infinite;
  }
  @keyframes nudge{ 0%,100%{ transform:translateX(0); } 50%{ transform:translateX(8px); } }
  /* スマホは横並びなので、カードが中央に来たらスタンプを押す（JSが is-in を付ける） */
}

/* ---------- PC：縦の線が、日を追って下に伸びる */
@media (min-width:900px){
  .days__line{
    display:block; position:absolute; top:0; bottom:0; left:calc(var(--pad) + 66px); width:1px;
    background:var(--line);
  }
  .days__line span{
    display:block; width:100%; height:100%; background:var(--accent);
    transform-origin:top; transform:scaleY(var(--p, 0));
  }
  .day{
    display:grid; grid-template-columns:180px 1fr; gap:clamp(32px,5vw,80px);
    padding-block:clamp(52px,7vh,96px);
  }
  .day + .day{ border-top:1px solid var(--line); }
  .day__head{ position:sticky; top:calc(var(--topbar-h) + 40px); align-self:start; }
  .day__title{ font-family:var(--sans); font-size:13px; letter-spacing:.18em; margin-top:22px; }
  .day__phases{ display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(24px,3.4vw,48px); }
  .phase{ border-top:0; padding-top:0; }
  .journal{ grid-column:1 / -1; }
  /* 偶数日は、ノートの傾きを逆に */
  .day:nth-child(even) .journal{ transform:rotate(.5deg); }
}

/* ---------------------------------------------- DAY 11 */
.day11{
  min-height:100svh; display:flex; align-items:center; text-align:center; overflow:hidden;
}
.day11__road{ position:absolute; left:0; right:0; bottom:18vh; height:40px; }
.day11__line{
  position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--ink); opacity:.18;
  transform-origin:left; transform:scaleX(var(--p, 0));
}
.day11__walker{
  position:absolute; bottom:1px; left:calc(6% + var(--p, 0) * 80%);
  width:10px; height:30px;
}
/* 頭・胴・脚。歩くたびに脚が入れ替わる */
.day11__walker::before{
  content:""; position:absolute; left:2px; top:0; width:7px; height:7px; border-radius:50%; background:var(--ink);
}
.day11__walker::after{
  content:""; position:absolute; left:4px; top:7px; width:2px; height:12px; background:var(--ink);
}
.day11__walker i{
  position:absolute; left:4px; top:18px; width:2px; height:11px; background:var(--ink);
  transform-origin:top; animation:legA .7s ease-in-out infinite alternate;
}
.day11__walker i::after{
  content:""; position:absolute; left:0; top:0; width:2px; height:11px; background:var(--ink);
  transform-origin:top; animation:legB .7s ease-in-out infinite alternate;
}
@keyframes legA{ from{ transform:rotate(22deg); } to{ transform:rotate(-22deg); } }
@keyframes legB{ from{ transform:rotate(-44deg); } to{ transform:rotate(44deg); } }

.day11__inner{ position:relative; }
.day11__count{
  font-family:var(--sans); font-size:clamp(14px,2vw,20px); letter-spacing:.3em; color:var(--muted);
  margin-bottom:clamp(14px,2vw,24px);
}
.day11__strike{ position:relative; display:inline-block; }
.day11__strike::after{
  content:""; position:absolute; left:-6%; right:-6%; top:50%; height:1px; background:var(--accent);
  transform:scaleX(0); transform-origin:left; transition:transform 1s var(--ease-io) .2s;
}
.day11.is-in .day11__strike::after{ transform:none; }
.day11__num{
  font-family:var(--sans); font-size:clamp(64px,15vw,190px); font-weight:300;
  letter-spacing:.04em; line-height:1;
}
.day11__sub{
  font-family:var(--sans); font-size:clamp(13px,2.2vw,22px);
  letter-spacing:.46em; color:var(--accent); margin-top:clamp(14px,2vw,24px);
}
.day11__line1{ margin-top:clamp(36px,5vw,60px); font-size:clamp(17px,2.3vw,24px); color:var(--muted); }
.day11__line2{ margin-top:12px; font-size:clamp(19px,2.6vw,28px); font-weight:600; letter-spacing:.06em; }

/* ---------------------------------------------- フィールドワーク */
.field__split{ display:grid; gap:clamp(30px,5vw,60px); }
.field__lede{ font-size:clamp(16px,1.9vw,20px); line-height:2.2; }
.stance{ counter-reset:s; }
.stance li{
  display:grid; grid-template-columns:auto 1fr; align-items:baseline; gap:6px 20px;
  padding-block:18px; border-top:1px solid var(--line);
}
.stance li:last-child{ border-bottom:1px solid var(--line); }
.stance b{
  font-family:var(--sans); font-weight:400; font-size:clamp(18px,2.4vw,26px); letter-spacing:.12em;
  transition:color .4s, letter-spacing .6s var(--ease);
}
.stance li:hover b{ color:var(--accent); letter-spacing:.18em; }
.stance span{ font-size:14px; color:var(--muted); }
@media (min-width:1024px){
  .field__split{ grid-template-columns:5fr 6fr; align-items:start; }
}
.margin-note{
  margin-top:clamp(40px,6vw,72px); max-width:42em;
  font-size:13px; color:var(--muted); line-height:2.1;
  padding:20px 0 0 22px; border-top:1px solid var(--line); position:relative;
}
.margin-note::before{
  content:"※"; position:absolute; left:0; top:20px; color:var(--accent);
}
.margin-note__head{ font-family:var(--sans); font-size:10px; letter-spacing:.24em; color:var(--ink); margin-bottom:8px; }
@media (min-width:1024px){ .margin-note{ margin-left:auto; } }

/* ---------------------------------------------- Akshaya Patra */
.akshaya{ overflow:hidden; }
.akshaya__clock{
  position:absolute; right:-2vw; top:8vh; z-index:-1; pointer-events:none;
  font-family:var(--sans); font-weight:300; font-size:clamp(90px,22vw,320px); line-height:1;
  color:transparent; -webkit-text-stroke:1px rgba(224,170,82,.16);
}
.akshaya__before{ margin-top:clamp(40px,6vw,72px); }
.akshaya__tag{
  font-family:var(--sans); font-size:clamp(13px,2vw,18px); letter-spacing:.44em; color:var(--accent);
}
.steam{ position:relative; height:120px; margin-top:24px; }
.steam i{
  position:absolute; bottom:0; width:2px; height:80px; border-radius:2px;
  background:linear-gradient(180deg, rgba(232,226,215,0), rgba(232,226,215,.35), rgba(232,226,215,0));
  filter:blur(3px); animation:steam 5s ease-in infinite;
}
.steam i:nth-child(1){ left:8%; animation-delay:-1s; }
.steam i:nth-child(2){ left:14%; animation-delay:-2.6s; height:100px; }
.steam i:nth-child(3){ left:20%; animation-delay:-.3s; }
.steam i:nth-child(4){ left:26%; animation-delay:-3.8s; height:70px; }
.steam i:nth-child(5){ left:32%; animation-delay:-1.8s; }
@keyframes steam{
  0%{ transform:translate(0,40px) scaleY(.4); opacity:0; }
  30%{ opacity:1; }
  100%{ transform:translate(14px,-60px) scaleY(1.3) skewX(-12deg); opacity:0; }
}
.flow{ display:grid; gap:0; margin-top:clamp(20px,3vw,40px); counter-reset:f; }
.flow li{
  position:relative; display:grid; grid-template-columns:52px 1fr; gap:4px 18px;
  padding-block:22px; border-top:1px solid var(--line);
}
.flow__n{ font-family:var(--sans); font-size:11px; letter-spacing:.2em; color:var(--muted); grid-row:span 2; padding-top:6px; }
.flow b{ font-family:var(--sans); font-weight:400; font-size:clamp(18px,2.2vw,24px); letter-spacing:.14em; color:var(--accent); }
.flow p{ font-size:14px; color:var(--muted); line-height:2; }
@media (min-width:900px){
  .flow{ grid-template-columns:repeat(4,1fr); column-gap:28px; }
  .flow li{ grid-template-columns:1fr; border-top:0; padding-top:28px; }
  .flow li::before{
    content:""; position:absolute; left:0; right:0; top:0; height:1px; background:var(--accent);
    transform:scaleX(0); transform-origin:left; transition:transform 1.2s var(--ease-io);
    transition-delay:var(--d, 0ms);
  }
  .flow li.is-in::before{ transform:none; }
  .flow__n{ grid-row:auto; }
}
.akshaya__impact{
  margin-top:clamp(70px,11vw,150px);
  font-family:var(--sans); font-weight:300;
  font-size:clamp(34px,7vw,92px); line-height:1.06; text-transform:uppercase;
}
.akshaya__impact em{ color:var(--accent); }
/* 4つの言葉が、順に灯っていく */
.chain{
  margin-top:clamp(32px,5vw,56px);
  display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px;
  font-family:var(--sans); font-size:clamp(12px,1.5vw,15px); letter-spacing:.26em;
}
.chain span{ color:var(--muted); opacity:.35; transition:opacity .8s, color .8s; }
.chain i{ display:block; width:clamp(20px,5vw,64px); height:1px; background:var(--line); position:relative; overflow:hidden; }
.chain i::after{
  content:""; position:absolute; inset:0; background:var(--accent); transform:scaleX(0); transform-origin:left;
  transition:transform .7s var(--ease-io);
}
.chain.is-in span{ opacity:1; color:var(--ink); }
.chain.is-in span:nth-of-type(1){ transition-delay:.1s; }
.chain.is-in i:nth-of-type(1)::after{ transform:none; transition-delay:.5s; }
.chain.is-in span:nth-of-type(2){ transition-delay:.9s; }
.chain.is-in i:nth-of-type(2)::after{ transform:none; transition-delay:1.3s; }
.chain.is-in span:nth-of-type(3){ transition-delay:1.7s; }
.chain.is-in i:nth-of-type(3)::after{ transform:none; transition-delay:2.1s; }
.chain.is-in span:nth-of-type(4){ transition-delay:2.5s; color:var(--accent); }
.margin-note--dark{ border-color:var(--line); }

/* ---------------------------------------------- RURAL */
.rural{ overflow:hidden; padding-bottom:clamp(60px,8vw,110px); }
.rural__field{ position:absolute; inset:auto -10% -6% -10%; height:62%; z-index:-1; pointer-events:none; }
.rural__row{
  position:absolute; left:0; right:0; height:40%;
  background:repeating-linear-gradient(100deg, rgba(110,104,58,.0) 0 22px, rgba(110,104,58,.14) 22px 23px);
  border-radius:50% 50% 0 0 / 30% 30% 0 0;
}
.rural__row:nth-child(1){ bottom:46%; opacity:.45; transform:scaleY(.6); }
.rural__row:nth-child(2){ bottom:20%; opacity:.7; }
.rural__row:nth-child(3){ bottom:-6%; opacity:1; background-color:rgba(150,138,80,.12); }
.rural__inner{ position:relative; }
.marquee{
  margin-top:clamp(48px,7vw,90px); overflow:hidden; white-space:nowrap;
  border-block:1px solid var(--line); padding-block:18px;
  mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.marquee__track{
  display:inline-block; padding-left:100%;
  font-size:clamp(22px,3.6vw,44px); letter-spacing:.14em;
  animation:marquee 38s linear infinite;
}
@keyframes marquee{ to{ transform:translateX(-100%); } }

/* ---------------------------------------------- 文化・巡礼・自由時間 */
.cols{ display:grid; gap:clamp(26px,4vw,56px); margin-bottom:clamp(60px,9vw,120px); }
@media (min-width:760px){ .cols{ grid-template-columns:1fr 1fr; } }
.col__head{ font-size:15px; letter-spacing:.06em; padding-bottom:14px; border-bottom:1px solid var(--line); }
.col__list{ margin-top:16px; font-size:15px; color:var(--muted); line-height:2.2; }

.pilgrim{ position:relative; text-align:center; padding-block:clamp(50px,8vw,110px); }
.pilgrim .eyebrow{ justify-content:center; }
.pilgrim .eyebrow::before{ display:none; }
/* 灯明。ゆらぎは不規則に */
.pilgrim__lamp{ position:relative; width:40px; height:70px; margin:0 auto 26px; }
.pilgrim__lamp::before{
  content:""; position:absolute; left:50%; bottom:0; width:40px; height:12px; margin-left:-20px;
  border-radius:0 0 50% 50%; background:#a8642e;
}
.pilgrim__lamp span{
  position:absolute; left:50%; bottom:10px; width:14px; height:34px; margin-left:-7px;
  border-radius:50% 50% 45% 45% / 70% 70% 30% 30%;
  background:radial-gradient(ellipse at 50% 80%, #fff4d0 0%, #ffc461 40%, #f07a2a 75%, transparent 76%);
  box-shadow:0 0 30px 10px rgba(255,170,80,.28), 0 0 90px 40px rgba(255,150,70,.12);
  transform-origin:bottom center; animation:flicker 3.2s ease-in-out infinite;
}
@keyframes flicker{
  0%{ transform:scale(1,1) rotate(0); } 18%{ transform:scale(.94,1.06) rotate(-2deg); }
  33%{ transform:scale(1.04,.96) rotate(1deg); } 52%{ transform:scale(.97,1.08) rotate(-1deg); }
  71%{ transform:scale(1.02,.94) rotate(2deg); } 100%{ transform:scale(1,1) rotate(0); }
}
.pilgrim__en{ font-family:var(--sans); font-weight:300; font-size:clamp(30px,5.6vw,72px); letter-spacing:.06em; }
.pilgrim__ja{ margin-top:clamp(18px,2.6vw,30px); font-size:clamp(18px,2.4vw,26px); line-height:2; }
.pilgrim__note{ margin:24px auto 0; max-width:34em; font-size:13px; color:var(--muted); line-height:2; }

.freetime{ padding-block:clamp(50px,7vw,90px); border-top:1px solid var(--line); }
.freetime__lead{ font-size:clamp(17px,2.1vw,22px); line-height:2.1; }
.tags{ display:flex; flex-wrap:wrap; gap:9px 10px; margin-top:clamp(22px,3vw,34px); }
.tags li{
  font-family:var(--sans); font-size:12px; letter-spacing:.12em; color:var(--muted);
  border:1px solid var(--line); border-radius:99px; padding:6px 16px;
  transition:background-color .4s, color .4s, transform .4s var(--ease);
}
.tags li:hover{ background:var(--accent); color:#fff; transform:translateY(-2px); }
.flexible{
  position:relative; padding:clamp(24px,3vw,36px) clamp(22px,3vw,40px);
  font-size:13px; color:var(--muted); line-height:2.1;
  border:1px dashed var(--line); border-radius:3px;
}
.flexible__head{ font-family:var(--sans); font-size:10px; letter-spacing:.32em; color:var(--accent); margin-bottom:10px; }
.flexible b{ color:var(--ink); font-weight:400; }

/* ---------------------------------------------- 料金：足し算の式として */
.sum{ max-width:860px; }
.sum__row{
  position:relative; display:grid; grid-template-columns:1fr; gap:4px;
  padding-block:clamp(22px,3vw,34px); padding-left:clamp(36px,5vw,64px);
}
.sum__op{
  position:absolute; left:0; top:clamp(46px,5.4vw,62px);
  font-family:var(--sans); font-size:clamp(22px,3vw,34px); font-weight:300; color:var(--accent);
}
.sum__label{ font-family:var(--sans); font-size:10px; letter-spacing:.26em; color:var(--muted); }
.sum__label small{ font-size:inherit; letter-spacing:.1em; }
.sum__num{
  font-family:var(--sans); font-weight:300; font-size:clamp(40px,7vw,80px);
  line-height:1.15; letter-spacing:-.005em; font-variant-numeric:tabular-nums;
}
.sum__num small{ font-family:var(--serif); font-size:.32em; margin-right:.3em; vertical-align:.5em; }
.sum__num--total{ color:var(--accent); font-size:clamp(52px,10vw,124px); }
.sum__desc{ font-size:13px; color:var(--muted); line-height:2; max-width:36em; }
.sum__rule{
  height:1px; background:var(--ink); opacity:.4; margin-left:clamp(36px,5vw,64px);
  transform:scaleX(0); transform-origin:left; transition:transform 1.4s var(--ease-io);
}
.sum__rule.is-in{ transform:none; }
.options{ display:grid; gap:1px; background:var(--line); margin-top:clamp(40px,6vw,70px); border-block:1px solid var(--line); }
@media (min-width:760px){ .options{ grid-template-columns:1fr 1fr; } }
.option{ background:var(--bg); padding:clamp(24px,3vw,36px); transition:background-color 1.2s var(--ease); }
.option__name{ font-family:var(--sans); font-size:15px; letter-spacing:.08em; }
.option__price{ font-family:var(--sans); font-size:clamp(24px,3vw,32px); color:var(--accent); margin:10px 0 8px; }
.option__body{ font-size:13px; color:var(--muted); line-height:2; }

/* ---------------------------------------------- 応募への導線 */
.entry__grid{ display:grid; gap:clamp(36px,5vw,60px); }
.steps-list{ counter-reset:st; }
.steps-list li{
  position:relative; display:grid; grid-template-columns:56px 1fr; gap:4px 16px;
  padding-block:22px; border-top:1px solid var(--line);
}
.steps-list li:last-child{ border-bottom:1px solid var(--line); }
.steps-list span{
  grid-row:span 2; font-family:var(--sans); font-size:30px; font-weight:300; line-height:1; color:var(--accent);
}
.steps-list b{ font-weight:400; font-size:17px; letter-spacing:.06em; }
.steps-list p{ font-size:13px; color:var(--muted); line-height:2; }
.entry__cta{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; }
@media (min-width:1024px){
  .entry__grid{ grid-template-columns:5fr 6fr; column-gap:80px; }
  .entry__cta{ grid-column:2; }
}

/* ---------------------------------------------- 最終メッセージ */
.final{ min-height:100svh; display:flex; align-items:center; text-align:center; overflow:hidden; }
.final__sun{
  position:absolute; left:50%; top:50%; width:90vmin; aspect-ratio:1; translate:-50% -50%; z-index:-1;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,214,150,.45) 0%, rgba(255,214,150,0) 62%);
  transform:scale(calc(.6 + var(--p, 0) * .6));
}
.final__lines{ font-size:clamp(26px,4.6vw,52px); line-height:1.9; letter-spacing:.08em; }
.final__bridge{ margin-top:clamp(28px,4vw,48px); font-size:clamp(15px,1.8vw,19px); color:var(--muted); line-height:2.3; }
.final__cta{
  margin-top:clamp(56px,8vw,110px);
  font-family:var(--sans); font-weight:300;
  font-size:clamp(30px,6vw,76px); line-height:1.1; text-transform:uppercase;
}
.final__ja{ margin-top:clamp(18px,2.6vw,30px); font-size:clamp(15px,1.8vw,19px); color:var(--muted); }
.actions{ margin-top:clamp(36px,5vw,56px); display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.final__mail{ margin-top:clamp(22px,3vw,34px); font-family:var(--sans); font-size:13px; letter-spacing:.12em; }
.final__mail a{ border-bottom:1px solid var(--line); padding-bottom:3px; transition:color .4s, border-color .4s; }
.final__mail a:hover{ color:var(--accent); border-color:var(--accent); }

/* ---------------------------------------------- スマホでの微調整 */
@media (max-width:759px){
  .hero__meta{ display:none; }
  .within{ min-height:100svh; }
  .entry__cta .btn--ghost{ width:auto; }
  .actions{ flex-direction:column; }
  .akshaya__clock{ top:4vh; }
}