/* =========================================================
   未来の1日 — Phase 1 LP
   Editorial / premium / calm. No AI-SaaS gradients.
   ========================================================= */

:root{
  --paper:      #FAF7F2;
  --paper-warm: #F4EFE7;
  --ink:        #201D19;
  --ink-2:      #4C453C;
  --muted:      #8B8378;
  --line:       #E3DACD;
  --line-soft:  #EDE6DA;
  --clay:       #96654E;

  --serif: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "Noto Serif JP", "Times New Roman", serif;
  --sans:  "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, "Noto Sans JP", -apple-system, sans-serif;
  --mono:  "Helvetica Neue", Helvetica, Arial, sans-serif;

  --wrap:      1200px;
  --wrap-wide: 1320px;
  --pad:       48px;
  --sec:       132px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.9;
  font-feature-settings:"palt" 1;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,p,dl,dd,ol{ margin:0; }
ol{ padding:0; list-style:none; }

.wrap{
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--pad);
}
.wrap--wide{ max-width:var(--wrap-wide); }

/* ---------- header ---------- */

.site-header{
  padding-block:34px;
}
.site-header__inner{
  display:flex;
  align-items:center;
}
.wordmark{
  font-family:var(--serif);
  font-size:20px;
  letter-spacing:.16em;
  color:var(--ink);
  text-decoration:none;
}
.wordmark--sm{ font-size:17px; letter-spacing:.18em; color:var(--ink-2); }

/* リンクの当たり判定だけを広げる。
   padding で判定を広げ、同じ量の負のマージンで戻すため、
   文字の位置・ヘッダーの高さは変わらない。見た目は不変。 */
a.wordmark{
  display:inline-block;
  padding:12px 16px;
  margin:-12px -16px;
  -webkit-tap-highlight-color:transparent;  /* 判定拡大でタップ時の灰色矩形が大きく出ないように */
}

/* ホームへ戻る導線。
   矢印は装飾なので HTML 側で aria-hidden にし、読み上げは「未来の1日」だけにする。
   下線は hover / focus のときだけ出す。通常時の見え方はこれまでと同じ。 */
.wordmark__arrow{
  display:inline-block;
  margin-right:.45em;
  font-family:var(--sans);
  font-size:.72em;
  line-height:1;
  color:var(--muted);
  vertical-align:.08em;
  transition:transform .18s ease, color .18s ease;
}
a.wordmark:hover .wordmark__arrow,
a.wordmark:focus-visible .wordmark__arrow{
  color:var(--ink-2);
  transform:translateX(-3px);
}
a.wordmark:hover .wordmark__label,
a.wordmark:focus-visible .wordmark__label{
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.26em;
}
a.wordmark:focus-visible{
  outline:1px solid var(--ink-2);
  outline-offset:1px;
  border-radius:2px;
}

@media (prefers-reduced-motion: reduce){
  .wordmark__arrow{ transition:none; }
  a.wordmark:hover .wordmark__arrow,
  a.wordmark:focus-visible .wordmark__arrow{ transform:none; }
}

/* ---------- shared type ---------- */

.sec-title{
  font-family:var(--serif);
  font-weight:400;
  font-size:34px;
  line-height:1.5;
  letter-spacing:.06em;
}
.sec-lead{
  margin-top:16px;
  color:var(--ink-2);
  font-size:15.5px;
  letter-spacing:.03em;
}
.sec-head{ margin-bottom:52px; }

.note{
  margin-top:40px;
  color:var(--muted);
  font-size:13px;
  letter-spacing:.04em;
}

/* ---------- CTA ---------- */

.cta{
  display:inline-block;
  appearance:none;
  border:0;
  border-radius:4px;
  background:var(--ink);
  color:#F7F3EC;
  font-family:var(--sans);
  font-size:16.5px;
  letter-spacing:.1em;
  line-height:1;
  padding:23px 52px;
  cursor:pointer;
  text-decoration:none;
  text-align:center;
  transition:background .22s ease, transform .22s ease;
}
.cta:hover{ background:#37312A; transform:translateY(-1px); }
.cta:active{ transform:translateY(0); }
.cta:focus-visible{ outline:2px solid var(--clay); outline-offset:3px; }

/* ---------- placeholder blocks (D-26) ---------- */

.ph{
  position:relative;
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:
    repeating-linear-gradient(
      -45deg,
      rgba(150,101,78,.045) 0 1px,
      transparent 1px 11px
    ),
    var(--paper-warm);
  border:1px dashed var(--line);
  border-radius:2px;
  overflow:hidden;
}
/* 画像が入った枠。枠の寸法・比率・角丸は据え置き、破線と地色だけ外す */
.ph.is-filled{
  border-color:transparent;
  background:var(--paper-warm);
}
.ph img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.ph__tag{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--clay);
  border:1px solid rgba(150,101,78,.35);
  border-radius:2px;
  padding:4px 9px;
  white-space:nowrap;
}
.ph__meta{
  font-size:11.5px;
  line-height:1.75;
  letter-spacing:.06em;
  color:var(--muted);
  text-align:center;
  padding-inline:10px;
}

.ph--r34{ aspect-ratio:3/4; }
.ph--r43{ aspect-ratio:4/3; }
.ph--r11{ aspect-ratio:1/1; }
.ph--r45{ aspect-ratio:4/5; }
.ph--phone{ aspect-ratio:9/19.5; border-radius:20px; }

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

.hero{ padding-block:56px 84px; }

.hero__inner{
  display:grid;
  grid-template-columns:660px 1fr;
  gap:64px;
  align-items:center;
}

.hero__title{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(26px, 3.5vw, 50px);
  line-height:1.44;
  letter-spacing:.035em;
}
.hero__title .line{ display:block; }

.hero__sub{
  margin-top:34px;
  font-size:17px;
  line-height:2.15;
  letter-spacing:.05em;
  color:var(--ink-2);
}

.hero__action{ margin-top:46px; }

/* hero collage: fragments of different futures (not one symbolic person).
   flex ratios chosen so the右 stack's total height matches the 3:4 main frame. */
.hero__visual{
  display:flex;
  gap:20px;
  align-items:flex-start;
}
.hero__ph--main{ flex:1.774 1 0; aspect-ratio:3/4; }
.hero__col{
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.hero__ph--sub1{ aspect-ratio:1/1; }
.hero__ph--sub2{ aspect-ratio:4/5; }

/* ---------- 6 scenes ---------- */

.scenes{ padding-block:var(--sec); }
.scenes--second{ padding-top:0; }
.scenes--second .sec-head{ padding-top:var(--sec); border-top:1px solid var(--line-soft); }

.day{
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  gap:18px;
}

.scene{ display:flex; flex-direction:column; }

/* one continuous hairline across the whole day, with a tick per scene */
.scene__time{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.16em;
  color:var(--ink-2);
  padding-top:14px;
  padding-bottom:12px;
  margin-bottom:16px;
  position:relative;
}
.scene__time::after{
  content:"";
  position:absolute;
  top:0; left:0;
  width:calc(100% + 18px); height:1px;
  background:var(--line);
}
.scene:last-child .scene__time::after{ width:100%; }
.scene__time::before{
  content:"";
  position:absolute;
  z-index:1;
  top:0; left:0;
  width:24px; height:1px;
  background:var(--clay);
}

.scene__cap{
  margin-top:16px;
  font-size:13px;
  line-height:1.85;
  letter-spacing:.04em;
  color:var(--ink-2);
}
.scene__cap.is-placeholder{
  color:var(--muted);
  border-left:2px solid var(--line);
  padding-left:10px;
}

/* ---------- CTA band ---------- */

.cta-band{
  padding-block:104px;
  text-align:center;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.cta-band__lead{
  font-family:var(--serif);
  font-size:26px;
  line-height:1.7;
  letter-spacing:.08em;
  margin-bottom:40px;
}

/* ---------- output ---------- */

.output{ padding-block:var(--sec); }

.output__inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:88px;
  align-items:center;
}

.output__visual{
  position:relative;
  padding-bottom:36px;
  padding-right:44px;
}
.output__ph--board{ width:100%; }
.output__ph--phone{
  position:absolute;
  right:0;
  bottom:0;
  width:31%;
  background:
    repeating-linear-gradient(-45deg, rgba(150,101,78,.045) 0 1px, transparent 1px 11px),
    var(--paper);
  border-style:solid;
  border-color:var(--line);
  box-shadow:0 14px 36px rgba(60,44,30,.09);
}

.deliv{ margin-top:44px; border-top:1px solid var(--line-soft); }
.deliv__row{
  padding:22px 0;
  border-bottom:1px solid var(--line-soft);
}
.deliv dt{
  font-family:var(--serif);
  font-size:18px;
  letter-spacing:.07em;
}
.deliv dd{
  margin:6px 0 0;
  color:var(--ink-2);
  font-size:14.5px;
  letter-spacing:.03em;
}

/* ---------- price ---------- */

.price{
  padding-block:var(--sec);
  background:var(--paper-warm);
}
.price__inner .sec-lead{ max-width:720px; }

.price__amount{
  margin-top:36px;
  font-family:var(--serif);
  line-height:1;
  letter-spacing:.02em;
}
.price__num{ font-size:66px; }
.price__yen{ font-size:26px; margin-left:6px; }
.price__tax{ font-size:16px; margin-left:10px; color:var(--ink-2); letter-spacing:.06em; }

.price__note{
  margin-top:18px;
  color:var(--ink-2);
  font-size:15px;
  letter-spacing:.04em;
}

.terms{ margin-top:52px; border-top:1px solid var(--line); max-width:820px; }
.terms__row{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:24px;
  padding:22px 0;
  border-bottom:1px solid var(--line);
}
.terms dt{
  font-size:14px;
  letter-spacing:.1em;
  color:var(--muted);
  padding-top:2px;
}
.terms dd{
  margin:0;
  font-size:15px;
  line-height:1.95;
  letter-spacing:.03em;
  color:var(--ink-2);
}

/* ---------- faq ---------- */

.faq{ padding-block:var(--sec); }
.qa{
  max-width:800px;
  padding:32px 0;
  border-bottom:1px solid var(--line-soft);
}
.qa:first-of-type{ margin-top:44px; border-top:1px solid var(--line-soft); }

.qa__q{
  font-family:var(--serif);
  font-weight:400;
  font-size:18.5px;
  line-height:1.7;
  letter-spacing:.06em;
}
.qa__a{
  margin-top:12px;
  color:var(--ink-2);
  font-size:15px;
  line-height:2.05;
  letter-spacing:.03em;
}

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

.site-footer{
  padding-block:56px 72px;
  border-top:1px solid var(--line-soft);
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width:1280px){
  :root{ --pad:40px; --sec:104px; }
  .hero__inner{ grid-template-columns:1.15fr 1fr; gap:52px; }
}

@media (max-width:960px){
  :root{ --sec:88px; }

  .hero{ padding-block:32px 84px; }
  .hero__inner{ grid-template-columns:1fr; gap:56px; }
  .hero__visual{ max-width:520px; }

  .output__inner{ grid-template-columns:1fr; gap:56px; }
  .output__visual{ max-width:460px; }

  .day{ grid-template-columns:repeat(3, 1fr); gap:24px 18px; }
  .scene:nth-child(3n) .scene__time::after{ width:100%; }
}

@media (max-width:640px){
  :root{ --pad:20px; --sec:72px; }

  body{ font-size:15px; }

  .site-header{ padding-block:24px; }
  .wordmark{ font-size:18px; }

  .hero{ padding-block:20px 64px; }
  .hero__inner{ gap:44px; }
  .hero__title{ line-height:1.5; letter-spacing:.03em; }
  .hero__sub{ margin-top:26px; font-size:15.5px; line-height:2.05; }
  .hero__action{ margin-top:34px; }
  .cta{ display:block; width:100%; padding:22px 24px; font-size:16px; }

  .hero__visual{ gap:12px; }
  .ph__meta{ font-size:10.5px; }
  .ph__tag{ font-size:9px; padding:3px 7px; }

  .sec-title{ font-size:25px; }
  .sec-lead{ margin-top:12px; font-size:14.5px; }
  .sec-head{ margin-bottom:36px; }

  /* day flows downward on mobile — no hidden content, time axis kept */
  .day{
    display:block;
    border-left:1px solid var(--line);
    margin-left:6px;
    padding-left:26px;
  }
  .scene{ position:relative; padding-bottom:38px; }
  .scene:last-child{ padding-bottom:0; }
  .scene__time{
    border-top:0;
    padding-top:0;
    padding-bottom:0;
    margin-bottom:12px;
    font-size:11.5px;
  }
  .scene__time::after{ width:100%; }
  .scene__time::before{
    left:-27px;
    top:8px;
    width:15px;
  }
  .scene .ph{ max-width:280px; }
  .scene__cap{ margin-top:12px; font-size:12.5px; }

  .scenes--second .sec-head{ padding-top:var(--sec); }

  .cta-band{ padding-block:72px; }
  .cta-band__lead{ font-size:20px; margin-bottom:30px; }

  .output__visual{ padding-right:30px; padding-bottom:24px; }
  .output__ph--phone{ width:34%; }
  .deliv{ margin-top:32px; }
  .deliv dt{ font-size:16.5px; }
  .deliv dd{ font-size:13.5px; }

  .price__num{ font-size:50px; }
  .price__yen{ font-size:22px; }
  .terms{ margin-top:38px; }
  .terms__row{ grid-template-columns:1fr; gap:6px; padding:20px 0; }
  .terms dt{ font-size:12.5px; }
  .terms dd{ font-size:14px; }

  .qa{ padding:26px 0; }
  .qa__q{ font-size:17px; }
  .qa__a{ font-size:14px; line-height:2; }

  .note{ margin-top:32px; font-size:12px; }

  .site-footer{ padding-block:44px 56px; }
}

/* ---------- 販売準備中の状態表示（ボタンではない） ---------- */
.pending{
  display:inline-block;
  padding:16px 0;
  border-bottom:1px solid var(--line);
  color:var(--ink-2);
  font-size:15.5px;
  letter-spacing:.1em;
}

/* ---------- フッターのリンク ---------- */
.site-footer__links{
  margin-top:18px;
  display:flex;
  flex-wrap:wrap;
  gap:0 28px;
}
.site-footer__links a{
  display:inline-block;
  padding:10px 0;
  color:var(--muted);
  font-size:13.5px;
  letter-spacing:.06em;
  text-decoration:none;
  transition:color .18s ease;
}
.site-footer__links a:hover{ color:var(--ink); }

/* 2026-09-06 LP review. Scoped to the landing page; shared form styles stay intact. */
.lp-page .site-header__inner{justify-content:space-between;gap:20px;}
.lp-page .site-nav{display:flex;gap:24px;font-size:13px;}
.lp-page .site-nav a,.lp-page .text-link{color:var(--ink-2);text-underline-offset:5px;}
.lp-page .site-nav a{padding-block:12px;text-decoration:none;}
.lp-page .site-nav a:hover{text-decoration:underline;}
.lp-page .hero{padding-block:32px 64px;}
.lp-page .hero__inner{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;}
.lp-page .hero__title{font-size:clamp(26px,3.1vw,44px);}
.lp-page .hero__sub{margin-top:24px;font-size:16px;}
.lp-page .hero__action{margin-top:28px;}
.lp-page .offer{font-size:13px;color:var(--ink-2);margin-bottom:14px;}
.lp-page .offer strong{font-weight:600;font-size:17px;color:var(--ink);}
.lp-page .action-note{font-size:13px;line-height:1.8;color:var(--ink-2);margin-top:14px;}
.lp-page .text-link{display:inline-block;font-size:13px;padding-block:12px;}
.lp-page .hero__visual{gap:14px;}
.lp-page .hero__col{gap:14px;}
.lp-page .hero__ph--sub1 img{object-position:center 35%;}
.lp-page .scenes{padding-block:80px;}
.lp-page .scenes--second{padding-top:0;}
.lp-page .scenes--second .sec-head{padding-top:64px;}
.lp-page .sec-head{margin-bottom:20px;}
.lp-page .sample-note{font-size:13px;line-height:1.9;color:var(--ink-2);margin-bottom:28px;max-width:720px;}
.lp-page .day{gap:22px;}
.lp-page .scene__cap{font-size:14px;color:var(--ink-2);letter-spacing:0;}
.lp-page .scene__open{display:block;position:relative;color:var(--ink);text-decoration:none;}
.lp-page .scene__zoom{position:absolute;bottom:8px;right:8px;background:var(--paper);padding:2px 8px;border-radius:2px;font-size:11px;line-height:1.8;}
.lp-page .scene__open:hover .scene__zoom{background:var(--ink);color:var(--paper);}
.lp-page a:focus-visible{outline:2px solid var(--clay);outline-offset:4px;}
.lp-page .cta-band{padding-block:64px;}
.lp-page .cta-band__lead{margin-bottom:20px;}
.lp-page .cta-band__package{font-size:15px;line-height:2;margin-bottom:26px;color:var(--ink-2);}
.lp-page .cta-band__package strong{font-size:20px;color:var(--ink);font-weight:500;}
.lp-page .output__process{margin-top:18px;color:var(--ink-2);font-size:14px;}
.lp-page .note,.lp-page .terms dt,.lp-page .site-footer__links a{color:#686055;}
.lp-page section[id]{scroll-margin-top:24px;}

/* Native dialog preserves Escape, focus trapping and keyboard access. */
.scene-dialog{border:0;padding:20px;background:var(--paper);color:var(--ink);width:min(760px,calc(100% - 24px));max-height:calc(100dvh - 24px);border-radius:6px;}
.scene-dialog::backdrop{background:rgba(25,22,18,.78);}
.scene-dialog__bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.scene-dialog__bar p{font-size:13px;line-height:1.6;}
.scene-dialog button{flex-shrink:0;white-space:nowrap;font:inherit;font-size:14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:3px;min-height:44px;min-width:64px;padding:8px 12px;cursor:pointer;}
.scene-dialog button:focus-visible{outline:2px solid var(--clay);outline-offset:2px;}
.scene-dialog__image{display:block;max-width:100%;max-height:calc(100dvh - 190px);width:auto;height:auto;margin:auto;}
.scene-dialog__caption{font-size:14px;line-height:1.8;text-align:center;margin-top:12px;}
html:has(.scene-dialog[open]){overflow:hidden;}
@media(max-width:1100px) and (min-width:641px){
 .lp-page .day{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 20px;}
}
@media(max-width:960px){
 .lp-page .hero__inner{grid-template-columns:1fr;gap:32px;}
 .lp-page .hero__visual{max-width:560px;width:100%;}
}
@media(max-width:640px){
 .lp-page .site-header{padding-block:14px;}
 .lp-page .site-nav{gap:14px;font-size:11px;}
 .lp-page .wordmark{font-size:16px;letter-spacing:.1em;}
 .lp-page .hero{padding-block:18px 24px;}
 .lp-page .hero__title{font-size:clamp(23px,6.5vw,28px);}
 .lp-page .hero__sub{font-size:14px;margin-top:20px;line-height:1.9;letter-spacing:0;}
 .lp-page .hero__action{margin-top:22px;}
 .lp-page .offer{font-size:11px;}
 .lp-page .offer strong{font-size:16px;}
 .lp-page .action-note{font-size:12px;}
 .lp-page .hero__inner{gap:20px;}
 .lp-page .hero__visual{gap:10px;max-width:310px;margin-inline:auto;}
 .lp-page .hero__col{gap:10px;}
 .lp-page .scenes{padding-block:48px;}
 .lp-page .scenes--second{padding-top:0;}
 .lp-page .scenes--second .sec-head{padding-top:40px;}
 .lp-page .sample-note{font-size:12px;margin-bottom:24px;}
 .lp-page .day{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px;border:0;margin:0;padding:0;}
 .lp-page .scene{padding-bottom:0;}
 .lp-page .scene__time{font-size:12px;padding-top:10px;margin-bottom:10px;}
 .lp-page .scene__time::before{left:0;top:0;width:18px;}
 .lp-page .scene__time::after{width:100%;}
 .lp-page .scene .ph{max-width:none;}
 .lp-page .scene__cap{font-size:13px;line-height:1.8;margin-top:10px;}
 .lp-page .scene__zoom{bottom:5px;right:5px;font-size:10px;padding:2px 6px;}
 .lp-page .cta-band{padding-block:44px;}
 .lp-page .cta-band__package{font-size:13px;}
 .lp-page .cta-band__package strong{font-size:18px;}
 .lp-page .output,.lp-page .price,.lp-page .faq{padding-block:56px;}
}

.lp-page .hero__package{font-size:13px;color:var(--ink-2);margin-bottom:8px;line-height:1.8;}

/* D-53: explain the personal use and how a wish becomes a scene. */
.lp-page .hero__detail{margin-top:14px;font-size:14px;line-height:1.95;color:var(--ink-2);}
.lp-page .sample-wish{border-left:2px solid var(--clay);padding:2px 0 2px 20px;margin:28px 0;color:var(--ink-2);font-size:15px;line-height:1.9;}
.lp-page .sample-wish__label{font-size:12px;letter-spacing:.07em;color:var(--clay);margin-bottom:7px;}
.lp-page .sample-wish__note{font-size:12px;color:#686055;margin-top:10px;}
.lp-page .price__value{max-width:760px;font-size:14px;line-height:1.9;color:var(--ink-2);margin-top:14px;}
.lp-page .visualize-use{padding-block:76px;border-block:1px solid var(--line-soft);}
.lp-page .visualize-use__steps{list-style:none;margin:34px 0 12px;padding:0;max-width:820px;}
.lp-page .visualize-use__steps li{display:grid;grid-template-columns:40px 1fr;gap:18px;padding:24px 0;border-top:1px solid var(--line-soft);}
.lp-page .visualize-use__steps li>span{font-family:var(--mono);color:var(--clay);font-size:13px;padding-top:3px;}
.lp-page .visualize-use__steps h3{font-family:var(--serif);font-size:21px;font-weight:400;margin-bottom:10px;}
.lp-page .visualize-use__steps p{font-size:15px;color:var(--ink-2);line-height:1.95;}
.guide{max-width:820px;margin:0 auto;padding:60px 32px 100px;}
.guide__head h1{font-family:var(--serif);font-size:clamp(27px,3.2vw,40px);line-height:1.7;font-weight:400;letter-spacing:.025em;margin:18px 0 26px;text-wrap:balance;}
.guide a:not(.cta){color:var(--ink-2);text-underline-offset:4px;}
.guide p{font-size:16px;line-height:2.1;color:var(--ink-2);margin:18px 0;}
.guide .guide__byline{font-size:12px;color:#686055;margin-top:24px;}
.guide__contents{display:flex;flex-wrap:wrap;gap:8px 24px;padding:22px 0;border-block:1px solid var(--line-soft);margin:36px 0;font-size:13px;}
.guide section{margin-top:58px;scroll-margin-top:24px;}
.guide h2{font-family:var(--serif);font-size:25px;font-weight:400;line-height:1.75;margin-bottom:20px;}
.guide__example{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:28px;margin:28px 0;}
.guide__example img{display:block;max-width:100%;height:auto;}
.guide__example figcaption{font-size:14px;color:var(--ink-2);line-height:2;}
.guide__prompts,.guide__formats{margin:28px 0;}
.guide__prompts>div,.guide__formats>div{border-top:1px solid var(--line-soft);padding:20px 0;}
.guide dt{font-size:15px;font-weight:600;margin-bottom:8px;}
.guide dd{font-size:15px;line-height:2;color:var(--ink-2);margin:0;}
.guide__service{margin-top:64px;padding:32px;background:#f0ece4;}
.guide .guide__service .sample-eyebrow{font-size:12px;color:var(--clay);}
.guide .guide__small{font-size:12px;line-height:1.9;}
.guide .cta{margin-top:14px;max-width:100%;white-space:normal;text-align:center;}
@media(max-width:640px){
 .lp-page .visualize-use{padding-block:48px;}
 .lp-page .visualize-use__steps li{grid-template-columns:28px 1fr;gap:12px;padding-block:20px;}
 .lp-page .visualize-use__steps h3{font-size:19px;}
 .lp-page .visualize-use__steps p{font-size:14px;}
 .guide{padding:32px 24px 64px;}
 .guide__head h1{font-size:27px;}
 .guide p{font-size:15px;line-height:2;}
 .guide section{margin-top:42px;}
 .guide h2{font-size:22px;}
 .guide__example{grid-template-columns:1fr;gap:14px;max-width:330px;}
 .guide__example figcaption{font-size:12px;}
 .guide__service{padding:24px 20px;}
 .guide .cta{font-size:13px;padding-inline:16px;}
}
@media(max-width:640px){
 .lp-page .hero__detail{font-size:13px;line-height:1.9;margin-top:12px;}
 .lp-page .sample-wish{font-size:14px;padding-left:14px;margin-block:22px;}
 .lp-page .sample-wish__label,.lp-page .sample-wish__note{font-size:11px;}
 .lp-page .price__value{font-size:13px;}
}

/* D-65: responsive picture wrappers retain each existing image frame. */
.lp-page picture{display:contents;}
.lp-page picture>source{display:none;}
.lp-page .skip-link{position:absolute;top:8px;left:12px;z-index:20;padding:10px 18px;background:var(--paper);color:var(--ink);transform:translateY(-150%);}
.lp-page .skip-link:focus{transform:translateY(0);}
.lp-page .site-nav a{min-height:44px;display:inline-flex;align-items:center;}
.lp-page .guide__contents a{min-height:44px;display:inline-flex;align-items:center;}
@media(max-width:640px){
 .lp-page .site-header__inner{flex-direction:column;align-items:flex-start;gap:4px;}
 .lp-page .site-nav{font-size:13px;gap:20px;flex-wrap:wrap;}
 .lp-page .site-nav a{padding-block:8px;}
}

/* D-51: let the complete scenes carry the story, including at desktop size. */
.lp-page .day{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 24px;}
.lp-page .scene:nth-child(3n) .scene__time::after{width:100%;}
.lp-page .sample-eyebrow{font-size:12px;letter-spacing:.13em;color:var(--clay);margin-bottom:12px;}
.lp-page .sec-lead{max-width:740px;}
.lp-page .hero__ph--sub1 img{object-position:center 65%;}
.lp-page .hero__visual{max-width:none;}
.lp-page .vision-preview{margin:0;aspect-ratio:4/5;background:#fffdfa;border:1px solid var(--line-soft);padding:7%;display:flex;flex-direction:column;justify-content:center;box-shadow:0 16px 40px rgba(60,44,30,.06);}
.lp-page .vision-preview figcaption{font-family:var(--serif);text-align:center;letter-spacing:.12em;font-size:22px;line-height:1.6;margin-bottom:20px;}
.lp-page .vision-preview figcaption span{display:block;font-family:var(--mono);font-size:8px;letter-spacing:.25em;margin-top:6px;}
.lp-page .vision-preview__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.lp-page .vision-preview__grid img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;}
.lp-page .vision-preview p{text-align:center;font-family:var(--serif);font-size:12px;letter-spacing:.06em;margin-top:22px;}
@media(max-width:640px){
 .lp-page .day{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px;}
 .lp-page .hero__visual{max-width:350px;}
 .lp-page .sample-eyebrow{font-size:11px;margin-bottom:8px;}
 .lp-page .vision-preview figcaption{font-size:18px;margin-bottom:14px;}
 .lp-page .vision-preview__grid{gap:5px;}
 .lp-page .vision-preview p{font-size:10px;margin-top:14px;}
}

/* D-66: a readable, static guide to selecting and arranging a future day. */
.lp-page .visualize-use__reading{font-size:15px;line-height:1.9;margin-top:22px;color:var(--ink-2);}
.lp-page .visualize-use__reading a{color:inherit;text-underline-offset:4px;}
.guide__breadcrumb{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;line-height:1.8;margin-bottom:30px;color:var(--ink-2);}
.guide__breadcrumb a{padding-block:10px;}
.guide__breadcrumb span{align-self:center;}
.guide__checklist{padding-left:1.5em;margin:24px 0;}
.guide__checklist li{padding-left:6px;margin:14px 0;font-size:16px;line-height:2;color:var(--ink-2);}
.guide__checklist strong{color:var(--ink);font-weight:600;}
.guide__board{background:#f0ece4;border:1px solid var(--line-soft);padding:24px;margin:28px 0;}
.guide .guide__board-title{font-family:var(--serif);text-align:center;font-size:21px;line-height:1.6;margin:0 0 22px;}
.guide__board-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 12px;}
.guide__board-grid figure{margin:0;min-width:0;}
.guide__board-grid img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;}
.guide__board-grid figcaption{font-size:12px;line-height:1.7;margin-top:8px;color:var(--ink-2);}
.guide .guide__editor-note{border-top:1px solid var(--line-soft);padding-top:28px;}
.guide .guide__editor-note h2{font-family:inherit;font-size:16px;font-weight:600;}
.guide .guide__editor-note p{font-size:13px;}
@media(max-width:640px){
 .guide__checklist li{font-size:15px;}
 .guide__board{padding:14px;}
 .guide .guide__board-title{font-size:17px;margin-bottom:16px;}
 .guide__board-grid{gap:14px 6px;}
 .guide__board-grid figcaption{font-size:11px;}
}

/* D-80: let visitors try one scene before reading the full examples. */
.lp-page .personal-guide{padding-block:64px;background:var(--paper-warm);border-block:1px solid var(--line-soft);}
.lp-page .personal-guide__intro{max-width:760px;margin:20px 0 32px;font-size:15px;line-height:1.95;color:var(--ink-2);}
.lp-page .personal-guide__body{display:grid;grid-template-columns:360px minmax(0,1fr);gap:48px;align-items:center;max-width:1040px;}
.lp-page .personal-guide__figure{margin:0;max-width:100%;}
.lp-page .personal-guide__figure img{display:block;width:100%;height:auto;}
.lp-page .personal-guide__figure figcaption{font-size:12px;line-height:1.8;margin-top:10px;color:var(--ink-2);}
.lp-page .personal-guide__steps{list-style:none;padding:0;margin:0;}
.lp-page .personal-guide__steps li{display:grid;grid-template-columns:26px 1fr;gap:14px;padding:20px 0;border-top:1px solid var(--line);}
.lp-page .personal-guide__steps li>span{font:12px var(--mono);color:var(--clay);padding-top:5px;}
.lp-page .personal-guide__steps h3{font-family:var(--serif);font-size:21px;line-height:1.7;font-weight:400;margin-bottom:8px;}
.lp-page .personal-guide__steps p{font-size:14px;line-height:1.95;color:var(--ink-2);}
.lp-page .personal-guide__cue{font-size:13px;line-height:1.9;padding-top:18px;border-top:1px solid var(--line);color:var(--ink-2);}
.lp-page .personal-guide__bridge{margin-top:32px;max-width:850px;font-size:15px;line-height:2;color:var(--ink-2);}
.lp-page .personal-guide__bridge strong{font-weight:500;color:var(--ink);font-size:18px;}
.lp-page .personal-guide__note{font-size:12px;line-height:1.8;color:var(--ink-2);margin-top:8px;}
.lp-page .answer-example{margin:30px 0;padding:24px 0;border-block:1px solid var(--line-soft);}
.lp-page .answer-example h3,.lp-page .price__work h3{font-family:var(--serif);font-size:21px;font-weight:400;line-height:1.75;margin-bottom:12px;}
.lp-page .answer-example__note{font-size:12px;line-height:1.8;color:var(--ink-2);max-width:760px;}
.lp-page .answer-example__rows{margin:22px 0;max-width:1000px;}
.lp-page .answer-example__rows>div{display:grid;grid-template-columns:1fr 1fr;gap:44px;padding:18px 0;border-top:1px solid var(--line-soft);font-size:14px;line-height:1.95;}
.lp-page .answer-example__rows dt{font-weight:500;}
.lp-page .answer-example__rows dt span{display:block;color:var(--clay);font-size:12px;font-weight:400;margin-bottom:5px;}
.lp-page .answer-example__rows dd{margin:0;color:var(--ink-2);}
.lp-page .answer-example__rows a{color:var(--ink);text-underline-offset:4px;display:inline-block;padding-bottom:6px;}
.lp-page .scene[id]{scroll-margin-top:24px;}
.lp-page .price__work{max-width:760px;margin-top:32px;}
.lp-page .price__work ol{list-style:none;padding:0;margin:18px 0;counter-reset:work;}
.lp-page .price__work li{position:relative;padding:20px 0 20px 38px;border-top:1px solid var(--line-soft);counter-increment:work;}
.lp-page .price__work li::before{content:counter(work,decimal-leading-zero);position:absolute;left:0;top:24px;font:12px var(--mono);color:var(--clay);}
.lp-page .price__work strong{font-size:15px;font-weight:500;line-height:1.9;}
.lp-page .price__work p{font-size:14px;line-height:1.95;color:var(--ink-2);margin-top:6px;}
@media(max-width:960px){
 .lp-page .personal-guide__body{grid-template-columns:300px minmax(0,1fr);gap:28px;}
}
@media(max-width:640px){
 .lp-page .personal-guide{padding-block:40px;}
 .lp-page .personal-guide__intro{font-size:14px;margin:18px 0 24px;}
 .lp-page .personal-guide__body{grid-template-columns:1fr;gap:24px;}
 .lp-page .personal-guide__figure{width:250px;margin-inline:auto;}
 .lp-page .personal-guide__steps li{padding-block:18px;gap:10px;grid-template-columns:23px 1fr;}
 .lp-page .personal-guide__steps h3{font-size:18px;}
 .lp-page .personal-guide__bridge{font-size:14px;margin-top:26px;}
 .lp-page .personal-guide__bridge strong{font-size:17px;}
 .lp-page .answer-example__rows>div{grid-template-columns:1fr;gap:10px;padding-block:20px;}
 .lp-page .answer-example__rows dd{border-left:2px solid var(--clay);padding-left:12px;}
 .lp-page .price__work p{font-size:13px;}
}
.lp-page .section-action{margin-top:36px;}
.lp-page .hero__question-link{display:block;margin-top:12px;font-size:13px;}
.lp-page .question-preview{padding-block:64px;border-top:1px solid var(--line-soft);}
.lp-page .question-preview>.wrap{max-width:900px;}
.lp-page .question-preview .sec-lead{max-width:700px;}
.question-preview__list{margin:28px 0 20px;}
.question-preview__list>div{padding:24px 0;border-top:1px solid var(--line-soft);}
.question-preview__list dt{font-size:17px;font-weight:500;line-height:1.9;margin-bottom:12px;}
.question-preview__list dd{margin:0;font-size:15px;line-height:2.1;color:var(--ink-2);}
.question-preview__optional{display:inline-block;font-size:11px;color:var(--ink-2);margin-left:8px;white-space:nowrap;}
.question-preview__note{font-size:13px;line-height:2;color:var(--ink-2);}
.guide .guide__quick-start{margin-top:30px;padding:28px;background:#f0ece4;}
.guide__quick-start ol{list-style:decimal;padding-left:1.4em;margin:20px 0;}
.guide__quick-start li{padding-left:4px;margin:14px 0;color:var(--ink-2);font-size:15px;line-height:1.9;}
.guide__quick-start strong{display:block;color:var(--ink);font-weight:500;}
@media(max-width:640px){
 .lp-page .question-preview{padding-block:44px;}
 .question-preview__list dt{font-size:16px;}
 .question-preview__list dd{font-size:14px;}
 .guide .guide__quick-start{padding:22px 20px;}
}
.lp-page .section-action .action-note{margin-top:14px;}
@media(max-width:640px){
 .lp-page .section-action .cta{width:100%;padding-inline:16px;white-space:normal;text-align:center;}
}

/* D-70: render the actual board file, including all six adopted scenes. */
.lp-page .vision-preview--image{padding:0;display:block;overflow:hidden;}
.lp-page .vision-preview--image a,.lp-page .vision-preview--image picture{display:block;}
.lp-page .vision-preview--image img{display:block;width:100%;height:auto;}

/* D-71: make the intended practice explicit before the main promise. */
.lp-page .hero__category{font-size:16px;line-height:1.8;letter-spacing:.05em;color:var(--clay);}
@media(max-width:640px){.lp-page .hero__category{font-size:14px;}}

/* D-81: personal photo comparison and the complete production path. */
.lp-page .photo-example,.lp-page .production-flow{padding-block:64px;border-top:1px solid var(--line-soft);}
.lp-page .photo-example__pair{display:grid;grid-template-columns:minmax(0,300px) 48px minmax(0,420px);gap:24px;align-items:center;margin:36px 0 24px;}
.lp-page .photo-example__pair figure{margin:0;min-width:0;}
.lp-page .photo-example__pair img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;}
.lp-page .photo-example__pair figcaption{font-size:13px;line-height:1.8;margin-top:12px;color:var(--ink-2);}
.lp-page .photo-example__pair figcaption span{display:block;color:var(--ink);font-size:15px;margin-bottom:4px;}
.lp-page .photo-example__arrow{font-size:30px;text-align:center;color:var(--clay);}
.lp-page .photo-example__note{font-size:12px;line-height:1.9;color:var(--ink-2);max-width:850px;margin-top:12px;}
.lp-page .photo-example__note a{color:inherit;text-underline-offset:4px;}
.lp-page .production-flow__steps{list-style:none;padding:0;margin:32px 0;max-width:850px;}
.lp-page .production-flow__steps li{display:grid;grid-template-columns:34px 1fr;gap:18px;border-top:1px solid var(--line-soft);padding:23px 0;}
.lp-page .production-flow__steps li>span{font:13px var(--mono);padding-top:5px;color:var(--clay);}
.lp-page .production-flow__steps h3{font:400 21px/1.7 var(--serif);margin-bottom:8px;}
.lp-page .production-flow__steps p{font-size:14px;line-height:1.95;color:var(--ink-2);}
.lp-page .question-preview__step{border-top:1px solid var(--line);padding:0;}
.lp-page .question-preview__step:first-of-type{margin-top:30px;}
.lp-page .question-preview__step summary{font-size:17px;line-height:1.9;padding:22px 0;cursor:pointer;}
.lp-page .question-preview__step summary span{font:12px var(--mono);color:var(--clay);margin:0 14px 0 4px;}
.lp-page .question-preview__step dl{padding:0 0 24px 32px;}
.lp-page .question-preview__step dl>div{border-top:1px solid var(--line-soft);padding-block:20px;}
.lp-page .question-preview__step dt{font-size:15px;font-weight:500;line-height:1.9;margin-bottom:12px;}
.lp-page .question-preview__step dd{margin:0;font-size:14px;line-height:1.9;color:var(--ink-2);}
.lp-page .question-preview__step ul{padding-left:1.4em;}
.lp-page .question-preview__step li{margin-bottom:5px;}
.lp-page .question-preview__badge{font-size:11px;font-weight:400;color:var(--clay);white-space:nowrap;}
.photo-picker{margin:32px 0;padding:26px;background:var(--paper-warm);border:1px solid var(--line);}
.photo-picker h2{font:400 24px/1.7 var(--serif);margin-bottom:16px;}
.photo-picker p{font-size:14px;line-height:1.9;margin:14px 0;color:var(--ink-2);}
.photo-picker a{color:inherit;text-underline-offset:4px;}
.photo-picker__choice,.photo-picker__consent{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.9;margin-top:20px;cursor:pointer;}
.photo-picker input[type=checkbox]{width:20px;height:20px;flex:none;margin-top:4px;accent-color:var(--ink);}
.photo-picker input[type=file]{font:inherit;font-size:14px;max-width:100%;display:block;padding-block:12px;}
.photo-picker__file-label{display:block;font-size:14px;font-weight:500;margin-top:20px;}
.photo-picker__preview{display:block;max-width:180px;max-height:240px;width:auto;height:auto;margin-top:18px;}
.photo-picker [hidden]{display:none;}
.photo-picker__status{font-weight:500;}
.photo-picker button{min-height:44px;}
@media(max-width:640px){
 .lp-page .photo-example,.lp-page .production-flow{padding-block:42px;}
 .lp-page .photo-example__pair{grid-template-columns:minmax(0,1fr) 18px minmax(0,1.25fr);gap:8px;margin-top:26px;align-items:start;}
 .lp-page .photo-example__pair figcaption{font-size:12px;}
 .lp-page .photo-example__pair figcaption span{font-size:13px;}
 .lp-page .photo-example__arrow{font-size:19px;padding-top:72px;}
 .lp-page .production-flow__steps li{grid-template-columns:25px 1fr;gap:12px;}
 .lp-page .production-flow__steps h3{font-size:19px;}
 .lp-page .question-preview__step summary{font-size:15px;}
 .lp-page .question-preview__step summary span{margin-right:8px;}
 .lp-page .question-preview__step dl{padding-left:12px;}
 .photo-picker{padding:22px 16px;}
 .photo-picker h2{font-size:21px;}
}

/* D-85 個別案内と日常の使い方 */
.practice-bridge{margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}.practice-bridge h3{font-size:17px;margin-bottom:10px}.practice-bridge p{font-size:15px;line-height:1.9}
