/* oniwa de night vol.2 · style
 * 土台: 第1回ライブ版（Hallmark · atmospheric · Letter · ロゴ配色）
 * vol.2: 当日写真を主役に。FV=写真の上にロゴ／手紙=写真に見出しを重ねる／
 *        小物はポラロイド風に切り取って浮かせる。書体・色・余白は第1回を継承。
 */

/* ─── base ───────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html,body{overflow-x:clip}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--color-paper);
  color:var(--color-ink);
  font-family:var(--font-body);
  font-size:var(--text-base);
  font-weight:var(--w-light);
  line-height:2;
  font-feature-settings:"palt";
  word-break:auto-phrase;
  line-break:strict;
  padding-inline:max(0px, env(safe-area-inset-left));
}
h1,h2,h3{
  font-family:var(--font-display);
  font-weight:var(--w-bold);
  line-height:1.55;
  letter-spacing:0.005em;
  text-wrap:pretty;
  min-width:0;
  margin:0;
}
p{margin:0}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px;border-radius:var(--radius-sm)}
.wrap{max-width:44rem;margin-inline:auto;padding-inline:var(--page-gutter)}
.wrap--wide{max-width:64rem}
.tnum{font-variant-numeric:tabular-nums}
.nb{white-space:nowrap}
::selection{background:var(--color-accent);color:var(--color-paper)}

/* 見出しまわり（第1回と同じ） */
.head{margin-bottom:var(--space-lg)}
.head h2{font-size:clamp(1.45rem, 6.4vw, var(--text-2xl));font-weight:var(--w-medium);line-height:1.5}
.head p{margin-top:var(--space-xs);font-size:var(--text-sm);color:var(--color-muted);line-height:1.9}
.eyebrow{
  display:inline-block;margin-bottom:var(--space-sm);
  font-size:var(--text-xs);font-weight:var(--w-regular);letter-spacing:0.18em;
  color:var(--color-accent);
}
section{position:relative}

/* ─── N5 · 浮かぶピル ────────────────────────────────── */
.nav-pill{
  position:fixed;top:var(--space-sm);left:50%;
  transform:translateX(-50%) translateY(-8px);
  display:inline-flex;align-items:center;gap:2px;
  margin:0;padding:6px 8px;list-style:none;
  background:color-mix(in oklch, var(--color-paper-2) 82%, transparent);
  backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
  border:var(--rule-hair) solid var(--color-rule);
  border-radius:999px;
  box-shadow:0 10px 28px -14px oklch(0% 0 0 / 0.7);
  z-index:20;opacity:0;visibility:hidden;
  transition:opacity var(--dur-mid) var(--ease-out),transform var(--dur-mid) var(--ease-out),visibility var(--dur-mid);
}
.nav-pill.is-shown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-pill a{
  display:block;white-space:nowrap;text-decoration:none;
  padding:6px 11px;border-radius:999px;
  font-size:var(--text-sm);font-weight:var(--w-regular);color:var(--color-muted);
  transition:color var(--dur-short) var(--ease-out),background var(--dur-short) var(--ease-out);
}
@media (hover:hover) and (pointer:fine){.nav-pill a:hover{color:var(--color-ink);background:var(--color-paper-3)}}
@media (pointer:coarse){.nav-pill a{padding-block:10px}}
@media (max-width:26rem){.nav-pill a{padding-inline:8px;font-size:var(--text-xs)}}

/* ─── FV · お庭の写真の上に、ロゴ ─────────────────────── */
.fv{
  position:relative;min-height:100svh;
  display:grid;align-content:center;justify-items:center;
  padding-block:var(--space-2xl) var(--space-xl);
  text-align:center;overflow:hidden;isolation:isolate;
}
.fv__bg{position:absolute;inset:0;z-index:-2}
.fv__bg img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;animation:fvfade var(--dur-fv) ease-in-out infinite;
  transform:scale(1.04);
}
.fv__bg img:nth-child(1){animation-delay:0s}
.fv__bg img:nth-child(2){animation-delay:6s}
.fv__bg img:nth-child(3){animation-delay:12s}
.fv__bg img:nth-child(4){animation-delay:18s}
.fv__bg img:nth-child(5){animation-delay:24s}
/* 5枚を6秒ずつ（30秒周期）。重なりでクロスフェード */
@keyframes fvfade{
  0%{opacity:0;transform:scale(1.06)}
  4%{opacity:1}
  20%{opacity:1}
  25%{opacity:0;transform:scale(1.0)}
  100%{opacity:0}
}
.fv::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--scrim)}
.fv__to{
  font-size:var(--text-sm);font-weight:var(--w-regular);
  letter-spacing:0.1em;line-height:1.9;color:var(--color-accent);
  margin-bottom:clamp(var(--space-md), 3vh, var(--space-xl));
  text-shadow:0 2px 14px oklch(0% 0 0 / 0.5);
}
.fv__logo{
  width:clamp(220px, 58vw, 380px);height:auto;
  margin-bottom:clamp(var(--space-md), 3.4vh, var(--space-xl));
  filter:drop-shadow(0 12px 30px oklch(0% 0 0 / 0.55));
}
.fv__vol{
  font-size:var(--text-xs);letter-spacing:0.3em;color:var(--color-muted);
  margin-bottom:var(--space-xs);
}
.fv__when{
  font-family:var(--font-display);font-weight:var(--w-medium);
  font-size:clamp(1.35rem, 5.8vw, 2.2rem);
  line-height:1.4;letter-spacing:0.02em;font-variant-numeric:tabular-nums;white-space:nowrap;
  text-shadow:0 2px 18px oklch(0% 0 0 / 0.5);
}
.fv__dow{margin-inline-start:0.1em;font-size:0.68em;font-weight:var(--w-regular);letter-spacing:0.06em;color:var(--color-accent-dim)}
.fv__time{margin-block:var(--space-xs) var(--space-xs);font-size:var(--text-sm);font-weight:var(--w-regular);letter-spacing:0.06em;color:var(--color-muted)}
.fv__where{font-size:var(--text-sm);font-weight:var(--w-light);line-height:1.9;color:var(--color-muted)}
.fv__who{
  display:inline-block;margin-top:var(--space-sm);
  padding:4px 14px;border:1px solid var(--color-accent-dim);border-radius:999px;
  font-size:var(--text-xs);letter-spacing:0.12em;color:var(--color-accent);
}
.fv .cta{margin-top:var(--space-lg)}
.fv__cue{display:block;width:1px;height:28px;margin-top:clamp(var(--space-lg), 4vh, var(--space-2xl));background:linear-gradient(var(--color-accent-dim), transparent)}

/* ─── 手紙 · 写真に見出しを重ねる ───────────────────────── */
.letter{padding-block:var(--space-3xl) var(--space-2xl)}
.letter__grid{
  display:grid;grid-template-columns:1fr;gap:var(--space-xl);align-items:center;
}
@media (min-width:52rem){
  .letter__grid{grid-template-columns:1.15fr 1fr;gap:var(--space-2xl)}
}
.letter__head{
  font-size:var(--text-display-s);font-weight:var(--w-medium);
  line-height:1.45;letter-spacing:-0.005em;
  margin-bottom:var(--space-xl);position:relative;z-index:1;
}
.letter__body{max-width:var(--measure)}
.letter__body p{margin-bottom:1.4em;line-height:2.05}
.letter__body p:last-of-type{margin-bottom:0}
.letter__lead{font-weight:var(--w-regular);color:var(--color-accent)}
.letter__yoroshiku{
  font-family:var(--font-display);font-weight:var(--w-medium);
  font-size:var(--text-lg);letter-spacing:0.12em;margin-top:var(--space-lg) !important;
}
.letter__to{font-size:var(--text-sm);color:var(--color-muted);letter-spacing:0.08em;margin-top:var(--space-md) !important}
/* 写真：縦長。角を大きく落として、左上に見出しが少し掛かる */
.letter__photo{
  position:relative;aspect-ratio:4/5;
  border-radius:var(--radius-photo);overflow:hidden;
  box-shadow:var(--photo-shadow);
}
.letter__photo img{width:100%;height:100%;object-fit:cover}
.letter__photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, transparent 55%, oklch(16% 0.022 216 / 0.55));
}
.letter__photo figcaption{
  position:absolute;left:var(--space-md);bottom:var(--space-sm);
  font-size:var(--text-xs);letter-spacing:0.16em;color:var(--color-muted);
}
@media (min-width:52rem){
  .letter__photo{margin-left:calc(var(--space-xl) * -1)}
}

/* ─── PV ─────────────────────────────────────────────── */
.garden{padding-block:var(--space-xl) var(--space-2xl)}
.reel{
  display:block;width:min(100%, 22rem);height:auto;aspect-ratio:9/16;
  margin-inline:auto;background:var(--color-paper-2);
  border-radius:var(--radius-photo);overflow:hidden;
  box-shadow:var(--photo-shadow);
}
.garden .eyebrow{display:block;text-align:center}

/* ─── 仕掛け ──────────────────────────────────────────── */
.shikake{padding-block:var(--space-2xl)}
.shikake__grid{
  display:grid;gap:var(--space-sm);
  grid-template-columns:1fr 1fr;grid-auto-rows:minmax(150px, 22vw);
  margin-top:var(--space-lg);
}
.shikake__card{
  position:relative;border-radius:var(--radius-photo);overflow:hidden;
  background:var(--color-paper-2);box-shadow:var(--photo-shadow);
}
.shikake__card--big{grid-column:1 / -1;grid-row:span 2}
.shikake__card img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.shikake__card:hover img{transform:scale(1.04)}}
.shikake__card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, transparent 40%, oklch(16% 0.022 216 / 0.85))}
.shikake__label{
  position:absolute;left:var(--space-md);bottom:var(--space-md);right:var(--space-md);z-index:1;
}
.shikake__label b{display:block;font-family:var(--font-display);font-weight:var(--w-medium);font-size:var(--text-lg);line-height:1.4}
.shikake__label span{display:block;font-size:var(--text-xs);color:var(--color-muted);letter-spacing:0.02em;line-height:1.7}
.shikake__card--secret img{filter:blur(6px) brightness(0.7);transform:scale(1.1)}
.shikake__card--secret .shikake__label{top:0;bottom:0;display:grid;place-content:center;text-align:center}
.shikake__card--secret b{color:var(--color-accent);letter-spacing:0.06em;font-size:var(--text-base)}
@media (min-width:52rem){
  .shikake__grid{grid-template-columns:1.6fr 1fr;grid-auto-rows:minmax(180px, 16vw)}
  .shikake__card--big{grid-column:1;grid-row:span 2}
}
.shikake__note{
  margin-top:var(--space-lg);font-size:var(--text-sm);line-height:2;color:var(--color-muted);
  max-width:var(--measure);
}
.shikake__note b{font-weight:var(--w-medium);color:var(--color-ink)}

/* ─── 第1回の記録 ──────────────────────────────────────── */
.record{padding-block:var(--space-2xl)}
.record__stats{
  display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--space-sm);
  margin-block:var(--space-lg);
}
@media (min-width:40rem){.record__stats{grid-template-columns:repeat(4, 1fr)}}
.stat{
  padding:var(--space-md) var(--space-sm);text-align:center;
  border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-card);
  background:color-mix(in oklch, var(--color-paper-2) 70%, transparent);
}
.stat__v{
  display:block;font-family:var(--font-display);font-weight:var(--w-medium);
  font-size:clamp(1.9rem, 5vw, 2.6rem);line-height:1.1;letter-spacing:-0.01em;
  color:var(--color-accent);font-variant-numeric:tabular-nums;
}
.stat__v small{font-size:0.45em;font-weight:var(--w-regular);letter-spacing:0.08em;margin-inline-start:2px}
.stat__l{display:block;margin-top:var(--space-xs);font-size:var(--text-xs);letter-spacing:0.14em;color:var(--color-muted)}
.record__text{max-width:var(--measure);line-height:2.05}
.record__text p + p{margin-top:0.8em}
/* ポラロイド風の写真帯。横にスワイプ */
.polas{
  display:flex;gap:var(--space-md);
  margin-top:var(--space-xl);padding:var(--space-md) var(--page-gutter) var(--space-lg);
  margin-inline:calc(var(--page-gutter) * -1);
  overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.polas::-webkit-scrollbar{display:none}
.pola{
  flex:0 0 auto;width:min(62vw, 210px);scroll-snap-align:center;
  padding:10px 10px 30px;background:oklch(96% 0.01 90);
  border-radius:4px;box-shadow:var(--photo-shadow);
  transform:rotate(var(--r, -2deg));
  transition:transform var(--dur-mid) var(--ease-out);
}
.pola:nth-child(2n){--r:1.6deg}
.pola:nth-child(3n){--r:-1deg}
.pola:nth-child(5n){--r:2.4deg}
@media (hover:hover) and (pointer:fine){.pola:hover{transform:rotate(0) translateY(-4px)}}
.pola img{aspect-ratio:4/5;width:100%;object-fit:cover;filter:saturate(0.95) contrast(1.02)}
@media (min-width:52rem){
  .polas{justify-content:flex-start;padding-inline:calc((100vw - 44rem) / 2 + var(--page-gutter));margin-inline:calc((100vw - 44rem) / -2 - var(--page-gutter));}
  .pola{width:190px}
}
.pola figcaption{
  margin-top:8px;font-size:var(--text-xs);letter-spacing:0.06em;
  color:oklch(35% 0.02 90);text-align:center;font-weight:var(--w-regular);
}

/* ─── 申込状況（第1回のカードをそのまま） ─────────────── */
.status{padding-block:var(--space-xl) var(--space-2xl)}
.status__card{
  padding:var(--space-lg) var(--space-md);
  border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-card);
  background:var(--color-paper-2);text-align:center;
}
.status__eyebrow{font-size:var(--text-xs);letter-spacing:0.18em;color:var(--color-accent);margin-bottom:var(--space-sm)}
.status__num{font-family:var(--font-display);font-weight:var(--w-medium);font-size:clamp(2.6rem, 12vw, 4rem);line-height:1;letter-spacing:-0.02em}
.status__num-sub{font-size:0.38em;font-weight:var(--w-regular);color:var(--color-muted);letter-spacing:0.04em}
.status__msg{margin-top:var(--space-sm);font-size:var(--text-base);color:var(--color-muted)}
.status__msg b{font-weight:var(--w-medium);color:var(--color-ink)}
.status__genders{display:flex;justify-content:center;gap:var(--space-lg);margin-top:var(--space-sm);font-size:var(--text-sm);color:var(--color-muted)}
.status__gender b{font-weight:var(--w-medium);color:var(--color-ink)}
.status__ages{margin-top:var(--space-lg);padding-top:var(--space-md);border-top:var(--rule-hair) solid var(--color-rule)}
.status__ages-label{font-size:var(--text-xs);letter-spacing:0.18em;color:var(--color-muted);margin-bottom:var(--space-sm)}
.ages{display:flex;justify-content:center;align-items:flex-end;gap:var(--space-sm);height:112px}
.ages__col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:48px;height:100%}
.ages__n{font-size:var(--text-xs);color:var(--color-muted);margin-bottom:4px}
.ages__bar{width:22px;min-height:3px;background:var(--color-accent-dim);border-radius:3px 3px 0 0;transition:height var(--dur-mid) var(--ease-out)}
.ages__r{margin-top:6px;font-size:var(--text-xs);color:var(--color-neutral);white-space:nowrap}

/* ─── イベント詳細 ─────────────────────────────────────── */
/* 写真（07792）の上に文字を載せる。暗幕を厚めにして、表の文字をそのまま読めるように */
.info{position:relative;isolation:isolate;overflow:hidden;padding-block:var(--space-3xl)}
.info__bg{position:absolute;inset:0;z-index:-2}
.info__bg img{width:100%;height:100%;object-fit:cover;object-position:62% 40%}
.info::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg, var(--color-paper) 0%, oklch(16% 0.022 216 / 0.72) 18%, oklch(16% 0.022 216 / 0.72) 82%, var(--color-paper) 100%)}
.info .spec th,.info .spec td{border-bottom-color:oklch(93% 0.01 210 / 0.18)}
.info .spec td{text-shadow:0 1px 10px oklch(0% 0 0 / 0.6)}
.info__grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);align-items:start}
@media (min-width:52rem){.info__grid{grid-template-columns:minmax(0, 36rem)}.info__bg img{object-position:70% 40%}}
.spec{width:100%;border-collapse:collapse;font-size:var(--text-base)}
.spec th,.spec td{padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule);text-align:left;vertical-align:top;line-height:1.9}
.spec th{width:5.5em;padding-inline-end:var(--space-sm);font-weight:var(--w-regular);color:var(--color-accent);font-size:var(--text-sm);letter-spacing:0.1em;white-space:nowrap}
.spec td{font-weight:var(--w-light)}
.spec td b{font-weight:var(--w-medium)}
.spec .sub{display:block;font-size:var(--text-sm);color:var(--color-muted)}

/* ─── 当日の流れ ──────────────────────────────────────── */
.flow{padding-block:var(--space-2xl)}
.flow__legend{display:flex;gap:var(--space-md);font-size:var(--text-xs);letter-spacing:0.1em;color:var(--color-muted);margin-bottom:var(--space-md)}
.flow__legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-inline-end:6px;vertical-align:middle}
.flow__legend .mv i{background:var(--color-accent)}
.flow__legend .st i{background:var(--color-neutral)}
.steps{list-style:none;margin:0;padding:0}
.steps li{
  display:grid;grid-template-columns:4.2em 1fr;gap:var(--space-sm);
  padding-block:var(--space-sm);border-top:var(--rule-hair) solid var(--color-rule);
}
.steps li:first-child{border-top:0}
.steps .time{
  font-variant-numeric:tabular-nums;font-size:var(--text-sm);font-weight:var(--w-regular);
  letter-spacing:0.04em;color:var(--color-neutral);padding-top:0.2em;
}
.steps li.mv .time{color:var(--color-accent)}
.steps h3{font-size:var(--text-base);font-weight:var(--w-medium);line-height:1.6}
.steps p{margin-top:2px;font-size:var(--text-sm);color:var(--color-muted);line-height:1.9}
.flow__note{
  margin-top:var(--space-lg);padding:var(--space-md);
  border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-card);
  font-size:var(--text-sm);line-height:2;color:var(--color-muted);
}
.flow__note b{display:block;margin-bottom:var(--space-2xs);font-weight:var(--w-medium);color:var(--color-ink)}

/* ─── 主催から ────────────────────────────────────────── */
.hosts{padding-block:var(--space-2xl)}
.hosts__grid{display:grid;grid-template-columns:1fr;gap:var(--space-lg);align-items:center}
@media (min-width:52rem){.hosts__grid{grid-template-columns:260px 1fr;gap:var(--space-2xl)}}
.hosts__photo{
  aspect-ratio:4/5;border-radius:var(--radius-photo);overflow:hidden;box-shadow:var(--photo-shadow);
  width:min(100%, 300px);
}
.hosts__photo img{width:100%;height:100%;object-fit:cover}
.hosts__text{max-width:var(--measure);line-height:2.05}
.hosts__text p + p{margin-top:0.8em}
.hosts__sign{margin-top:var(--space-md);font-size:var(--text-sm);color:var(--color-muted);letter-spacing:0.08em}

/* ─── 協賛 ───────────────────────────────────────────── */
.sponsor{padding-block:var(--space-2xl)}
.sponsor__list{
  list-style:none;margin:var(--space-md) 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:var(--space-xs) var(--space-md);
}
.sponsor__list li{font-size:var(--text-base);line-height:2}
.sponsor__list a{color:var(--color-ink);text-decoration-color:var(--color-rule);text-underline-offset:5px}
@media (hover:hover) and (pointer:fine){.sponsor__list a:hover{text-decoration-color:var(--color-accent)}}
.sponsor__list small{display:block;font-size:var(--text-xs);color:var(--color-neutral);letter-spacing:0.06em;line-height:1.4}
.sponsor__thanks{margin-top:var(--space-md);font-size:var(--text-sm);color:var(--color-muted);line-height:1.9}
.sponsor__ask{
  margin-top:var(--space-xl);padding:var(--space-md);
  border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-card);
  font-size:var(--text-sm);line-height:1.9;color:var(--color-muted);
}
.sponsor__ask b{display:block;font-weight:var(--w-medium);color:var(--color-ink);margin-bottom:var(--space-2xs)}
.sponsor__ask a{display:inline-block;margin-top:var(--space-xs);color:var(--color-accent);text-decoration-color:var(--color-rule);text-underline-offset:4px}

/* ─── アクセス ───────────────────────────────────────── */
.access{padding-block:var(--space-2xl)}
.access__addr{font-size:var(--text-base);line-height:1.9;margin-bottom:var(--space-md)}
.access__addr b{display:block;font-weight:var(--w-medium);font-size:var(--text-lg)}
.map{position:relative;width:100%;aspect-ratio:4/3;border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-card);overflow:hidden;background:var(--color-paper-2)}
.map iframe{display:block;width:100%;height:100%;border:0}
@media (min-width:40rem){.map{aspect-ratio:16/9}}
.access__link{display:inline-block;margin-top:var(--space-sm);font-size:var(--text-sm);color:var(--color-muted);white-space:nowrap;text-decoration-color:var(--color-rule);text-underline-offset:4px}
.access__car{margin-top:var(--space-md);font-size:var(--text-sm);color:var(--color-muted);line-height:1.9}

/* ─── 申込について ───────────────────────────────────── */
.apply{padding-block:var(--space-2xl)}
.apply__steps{list-style:none;margin:0;padding:0}
.apply__steps li{display:grid;grid-template-columns:2em 1fr;gap:var(--space-sm);padding-block:var(--space-sm);border-top:var(--rule-hair) solid var(--color-rule)}
.apply__steps li:first-child{border-top:0}
.stage{font-family:var(--font-display);font-weight:var(--w-medium);color:var(--color-accent);font-size:var(--text-lg);line-height:1.5}
.apply__steps h3{font-size:var(--text-base);font-weight:var(--w-medium);line-height:1.6}
.apply__steps p{margin-top:2px;font-size:var(--text-sm);color:var(--color-muted);line-height:1.9}
.apply__returning{
  margin-top:var(--space-lg);padding:var(--space-md);
  background:var(--color-paper-2);border-radius:var(--radius-card);
  font-size:var(--text-sm);line-height:1.9;color:var(--color-muted);
}
.apply__returning b{display:block;font-weight:var(--w-medium);color:var(--color-ink);margin-bottom:var(--space-2xs)}
.cta{
  display:block;width:100%;max-width:22rem;
  margin:var(--space-lg) auto 0;
  padding:16px 20px;min-height:52px;
  background:var(--color-accent);color:var(--color-paper);
  font-family:var(--font-display);font-size:var(--text-base);font-weight:var(--w-medium);letter-spacing:0.02em;
  text-align:center;text-decoration:none;white-space:nowrap;border-radius:999px;
  box-shadow:0 14px 30px -14px oklch(82% 0.094 85 / 0.6);
  transition:background var(--dur-short) var(--ease-out),transform var(--dur-short) var(--ease-out);
}
.cta[hidden]{display:none}
@media (hover:hover) and (pointer:fine){.cta:hover{background:var(--color-focus)}}
.cta:active{transform:translateY(1px)}
.cta--ghost{background:transparent;color:var(--color-accent);border:1px solid var(--color-accent-dim);box-shadow:none}
@media (hover:hover) and (pointer:fine){.cta--ghost:hover{background:var(--color-paper-3)}}
.apply__caution{
  margin-top:var(--space-xl);padding:var(--space-md);
  border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-card);
  font-size:var(--text-sm);line-height:1.9;color:var(--color-muted);
}
.apply__caution b{display:block;font-weight:var(--w-medium);color:var(--color-ink)}

/* ─── FAQ ────────────────────────────────────────────── */
.faq{padding-block:var(--space-2xl)}
.faq details{border-top:var(--rule-hair) solid var(--color-rule)}
.faq summary{display:flex;align-items:baseline;gap:var(--space-md);padding-block:var(--space-md);cursor:pointer;list-style:none;font-size:var(--text-base);font-weight:var(--w-medium);line-height:1.8}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:0 0 auto;margin-inline-start:auto;align-self:center;width:9px;height:9px;border-inline-end:1.5px solid var(--color-accent);border-block-end:1.5px solid var(--color-accent);transform:rotate(45deg) translateY(-2px);transition:transform var(--dur-short) var(--ease-out)}
.faq details[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.faq .answer{margin:0 0 var(--space-md);padding:var(--space-md);background:var(--color-paper-2);border-radius:var(--radius-card);font-size:var(--text-base);font-weight:var(--w-regular);color:var(--color-muted);line-height:1.95}

/* ─── 締め · p.s. の背景に手描きのサイン ──────────────── */
.foot{
  position:relative;margin-top:var(--space-2xl);isolation:isolate;overflow:hidden;
  padding-block:var(--space-3xl) calc(var(--space-xl) + env(safe-area-inset-bottom));
}
.foot__bg{position:absolute;inset:0;z-index:-2}
.foot__bg img{width:100%;height:100%;object-fit:cover;object-position:78% 50%;opacity:0.55}
@media (max-width:52rem){.foot__bg img{object-position:50% 50%}}
.foot::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg, var(--color-paper) 0%, oklch(16% 0.022 216 / 0.55) 40%, oklch(16% 0.022 216 / 0.9) 100%)}
.foot__ps{font-size:var(--text-sm);color:var(--color-accent);margin-bottom:var(--space-sm)}
.foot__line{font-family:var(--font-display);font-weight:var(--w-medium);font-size:clamp(1.5rem, 7.2vw, 2.75rem);line-height:1.5;letter-spacing:-0.01em}
.foot__after{margin-top:var(--space-md);font-size:var(--text-sm);color:var(--color-muted);line-height:1.9;max-width:var(--measure)}
.foot__meta{margin-top:var(--space-xl);padding-top:var(--space-md);border-top:var(--rule-hair) solid var(--color-rule);font-size:var(--text-sm);line-height:2;color:var(--color-neutral)}
.foot__meta b{font-weight:var(--w-regular);color:var(--color-muted);letter-spacing:0.04em}
.foot__meta a{color:var(--color-muted);text-decoration-color:var(--color-rule);text-underline-offset:4px}

/* ─── 携帯：下に申込バー（FVを抜けたら出る） ─────────── */
.bar{
  position:fixed;left:0;right:0;bottom:0;z-index:19;
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);
  padding:10px var(--page-gutter) calc(10px + env(safe-area-inset-bottom));
  background:color-mix(in oklch, var(--color-paper-2) 88%, transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:var(--rule-hair) solid var(--color-rule);
  transform:translateY(100%);transition:transform var(--dur-mid) var(--ease-out);
}
.bar.is-shown{transform:translateY(0)}
.bar__t{font-size:var(--text-xs);letter-spacing:0.08em;color:var(--color-muted);line-height:1.5}
.bar__t b{display:block;font-weight:var(--w-medium);color:var(--color-ink);font-size:var(--text-sm)}
.bar .cta{margin:0;width:auto;max-width:none;padding:10px 18px;min-height:40px;font-size:var(--text-sm)}
@media (min-width:52rem){.bar{display:none}}
body.has-bar{padding-bottom:72px}

/* ─── 狭い画面（〜384px）では、枠の中の文は枠を超えるときだけ折り返す ─── */
@media (max-width:24rem){
  .apply__caution .nb,.apply__returning .nb,.sponsor__ask .nb,.flow__note .nb,
  .faq .answer .nb,.shikake__note .nb,.status__card .nb{white-space:normal}
}

/* ─── reveal（静かに浮かぶ） ─────────────────────────── */
.rv{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.rv.is-in{opacity:1;transform:none}

/* ─── reduced motion ─────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important}
  .fv__bg img{animation:none;opacity:0}
  .fv__bg img:first-child{opacity:1}
  .rv{opacity:1;transform:none}
}
