:root{
  /* MENU-PAAN の主色ボルドー。 型は restopaan.com (2026-10-23 社長採用) と同じ */
  --primary:#9B1C31;       /* MENU-PAAN ボルドー */
  --primary-deep:#7A1527;
  --primary-soft:#A86A75;
  --navy:#9B1C31;
  --navy-deep:#5E1020;
  --bg:#FFFFFF;
  --card:#FAF5F6;
  --tint:#F5EEEF;          /* 画面スクショを置く淡い紺の地 (虎屋の菓子写真の地色に当たる) */
  --paper:#F4F3EF;         /* 同じく生成りの地。 一覧で交互に使う */
  --line:#E5E5E5;          /* app --borderSubtle */
  --ink:#111111;           /* 虎屋の文字色 #111 (app --text #1A1A1A とほぼ同じ) */
  --ink-mid:#4A4A4A;       /* app --textMute */
  --ink-soft:#707070;      /* app --textSoft */
}
/* 2026-10-23 社長「AI感が強い、虎屋のサイトを参考に」: 中央揃え・太いゴシックの見出し・
   枠と影のカード・アイコンの丸・矢印をやめ、 細い明朝の見出し + 左揃え + 広い余白 + 細い線に作り替えた。
   色 (紺) と文言・12言語・動きは変えていない。 */
*{margin:0;padding:0;box-sizing:border-box;}
html{background:#fff;scroll-behavior:smooth;scroll-padding-top:80px;}
body{
  font-family:var(--rp-sans);font-weight:400;
  background:#fff;color:var(--ink);font-size:15px;line-height:1.8;letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;padding-top:72px;
}
a{color:inherit;text-decoration:none;}
/* 改行 (2026-10-23 社長「全体的に改行に注意」): 「さ/らに」「意/訳」のような語の途中の折り返しを止める。
   日本語は BudouX (Google の文節区切り、 assets/budoux-ja-0.9.3.js) で文節の切れ目を入れ、 そこでだけ折る (Safari は auto-phrase 未対応)。
   韓国語は語の間に空白があるので keep-all が正しい。 */
p,li,h1,h2,h3{text-wrap:pretty;}
html[lang="ja"] body{word-break:auto-phrase;}   /* 文節の切れ目は assets/phrase-ja.js (BudouX) が入れる。 これは読み込み前の保険 */
html[lang="ko"] body{word-break:keep-all;overflow-wrap:anywhere;}
img{max-width:100%;height:auto;display:block;}

/* ---- Header ---- */
.hdr{
  position:fixed;top:0;left:0;right:0;z-index:1000;height:72px;
  display:flex;align-items:center;justify-content:space-between;gap:32px;
  padding:0 32px;background:rgba(255,255,255,.96);
}
.logo{display:inline-flex;align-items:center;gap:10px;flex:none;font-family:'Marcellus',var(--rp-serif);font-size:19px;letter-spacing:2px;color:var(--primary);line-height:1;white-space:nowrap;}
.logo .ic{width:28px;height:28px;flex:none;}
.logo .ic svg{width:28px;height:28px;}
.nav{display:flex;align-items:center;gap:28px;flex-wrap:nowrap;flex:none;}
/* 2026-07-31 社長報告「微妙な幅の時、LPが崩れる」: 項目は縮ませず折り返さず、
   収まらなくなった時点で目次ごと消す (下の .hdr-tight と @media)。 */
.nav a{font-family:var(--rp-serif);font-size:14px;letter-spacing:.06em;color:var(--ink);transition:color .15s;white-space:nowrap;flex:none;}
.nav a:hover{color:var(--primary-soft);}
.nav .login{color:var(--primary);}
.nav .nav-cta{
  display:inline-flex;align-items:center;height:36px;padding:0 18px;
  background:var(--primary);color:#fff;border-radius:999px;
  font-family:var(--rp-sans);font-size:12.5px;font-weight:500;letter-spacing:.06em;transition:background .15s;
}
.nav .nav-cta:hover{background:var(--primary-deep);color:#fff;}
.lang-wrap{position:relative;}
.lang-toggle{display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:6px 0;font-family:var(--rp-serif);font-size:14px;letter-spacing:.06em;color:var(--ink);cursor:pointer;transition:color .15s;flex:none;}
.lang-toggle:hover{color:var(--primary-soft);}
.lang-toggle .lt-ic{flex:none;}
.lang-toggle #langLabel{white-space:nowrap;}
.lang-menu{position:absolute;right:0;top:calc(100% + 10px);background:#fff;border:1px solid var(--line);padding:6px 0;min-width:180px;max-height:66vh;overflow:auto;z-index:1100;}
.lang-menu button{display:block;width:100%;text-align:left;background:none;border:none;padding:10px 18px;font:400 13.5px/1.3 var(--rp-sans);letter-spacing:.04em;color:var(--ink-mid);cursor:pointer;}
.lang-menu button:hover{background:var(--card);color:var(--primary);}
.lang-menu button[aria-current="true"]{color:var(--primary);background:var(--card);}
/* 言語提案バナー (2026-10-03): ルート=日本語を端末言語が ja 以外の人が見ているときだけ。 自動切替はしない。 */
.lang-banner{position:absolute;top:100%;left:0;right:0;display:flex;align-items:center;justify-content:center;min-height:36px;padding:6px 48px;box-sizing:border-box;background:var(--primary);color:#fff;font-size:13px;line-height:1.5;text-align:center;animation:langBannerIn .32s ease-out;}
@keyframes langBannerIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.lang-banner{animation:none;}}
.lang-banner a{color:#fff;letter-spacing:.02em;text-decoration:underline;text-decoration-color:rgba(255,255,255,.5);text-underline-offset:3px;min-width:0;text-wrap:balance;}
.lang-banner a:hover{text-decoration-color:#fff;}
.lang-banner-arrow{margin-left:6px;opacity:.7;}
.lang-banner-x{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:none;border-radius:50%;background:none;color:#fff;font-size:20px;line-height:1;cursor:pointer;opacity:.8;font-family:inherit;}
.lang-banner-x:hover{opacity:1;}
@media (max-width:480px){.lang-banner{font-size:12px;padding:6px 44px 6px 16px;}}
@media print{.lang-banner{display:none!important;}}
/* 公式 Instagram (2026-08-02 社長指示)。 言語切替の右端に置く線画アイコン。 */
.nav .ig{display:inline-flex;align-items:center;flex:none;color:var(--ink);transition:color .15s;}
.nav .ig svg{width:19px;height:19px;display:block;}
.nav .ig:hover{color:var(--primary-soft);}

/* 目次を隠した状態。 言語切替とロゴは残す。 JS (fitHeader) がヘッダーの実測幅で付け外しする
   (言語ごとに文言の長さが違うため px のブレークポイントだけでは賄えない)。 */
.hdr-tight .nav .nav-link,
.hdr-tight .nav .login{display:none;}
/* JS が無い時の下限 */
@media(max-width:900px){
  .nav .nav-link, .nav .login{display:none;}
}
/* スマホ: 申し込みボタンは小さく残す (2026-10-23 社長 OK)。 狭い所では言語名を畳んで地球の印だけに */
@media(max-width:640px){ .nav .nav-cta{height:32px;padding:0 13px;font-size:12px;letter-spacing:.02em;} }
@media(max-width:480px){ .lang-toggle #langLabel{display:none;} .logo{font-size:16px;letter-spacing:1.2px;} .logo .ic,.logo .ic svg{width:24px;height:24px;} .nav{gap:14px;} }
@media(max-width:640px){
  .hdr{padding:0 16px;height:56px;}
  body{padding-top:56px;}
  .nav{gap:18px;}
}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;border-radius:999px;
  height:44px;padding:0 28px;font-size:14px;font-weight:500;letter-spacing:.08em;
  cursor:pointer;transition:background .15s,color .15s,border-color .15s;border:1px solid transparent;font-family:inherit;white-space:nowrap;
}
.btn-primary{background:var(--primary);color:#fff;}
.btn-primary:hover{background:var(--primary-deep);}
.btn-line{background:#fff;color:var(--ink);border:2px solid #CCC;font-weight:700;}
.btn-line:hover{border-color:var(--primary);color:var(--primary);}

/* ---- Hero ---- 淡い紺の地に、 店主の画面とお客様の画面の2枚 (虎屋の菓子写真の置き方)。 */
.hero{background:var(--tint);overflow:hidden;}
.hero-in{max-width:1180px;margin:0 auto;padding:64px 32px 72px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:48px;align-items:center;}
.hero-content{min-width:0;}
.hero-title{
  font-family:var(--rp-serif);font-size:38px;font-weight:400;color:var(--ink);
  letter-spacing:.1em;line-height:1.6;margin:0 0 28px;
  word-break:keep-all;overflow-wrap:break-word;text-wrap:pretty;
}
.hero-lead{
  font-family:var(--rp-serif);font-size:16px;font-weight:400;color:var(--ink);
  letter-spacing:.08em;line-height:2;margin:0 0 6px;max-width:34em;
  word-break:keep-all;overflow-wrap:break-word;text-wrap:pretty;
}
.hero-sub{font-size:13.5px;color:var(--ink-mid);letter-spacing:.06em;line-height:1.9;margin:0 0 36px;
  word-break:keep-all;overflow-wrap:break-word;text-wrap:pretty;}
.hero-ctas{display:flex;gap:14px;align-items:center;flex-wrap:wrap;}
.final-ctas{display:flex;gap:14px;align-items:center;flex-wrap:wrap;}
/* 使い方動画 (2026-10-09)。 ボタンで開き LP の上で再生する */
.hero-howto{margin-top:28px;}
.hero-howto-btn{display:inline-flex;align-items:center;gap:12px;cursor:pointer;background:none;border:none;padding:0;
  font-family:var(--rp-serif);font-size:14px;letter-spacing:.08em;color:var(--ink);transition:color .15s;}
.hero-howto-btn:hover{color:var(--primary-soft);}
.hero-howto-btn .hh-play{width:36px;height:36px;border-radius:50%;border:1px solid currentColor;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.hero-howto-btn .hh-play svg{width:13px;height:13px;fill:currentColor;margin-left:2px;}
/* 姉妹アプリへの導線。 主 CTA と競合しない控えめな行 */
.hero-cross{margin-top:22px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;}
.hero-cross a{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:0 10px;color:var(--ink-mid);font-size:12px;transition:color .15s;}
.hero-cross a:hover{color:var(--primary);}
.hero-cross .x-brand{font-family:'Marcellus',serif;font-size:13px;letter-spacing:1.5px;color:var(--ink);white-space:nowrap;}
.hero-cross .x-tag{font-family:var(--rp-sans);letter-spacing:.04em;}
.hero-cross .arr{font-size:11px;}
@media(max-width:480px){.hero-cross .arr{display:none;}}
.hero-visual{position:relative;height:560px;min-width:0;}
/* 2026-10-23 社長「スクショが不思議な感じ」: 枠のない角丸だと画面の切れ端に見えるので、 黒い細い縁 (端末の縁) を付けてスマホの画面と分かるようにする。 */
/* 端末の縁と角は実物の比率で描く (2026-10-23 社長「輪郭が不自然」: 固定 px だと小さい所で縁が太く角が丸すぎた)。
   iPhone = 縁 高さの1.5%・角 6.8%、 iPad = 縁 2.8%・角 4.5%。 置き場の四角の中では cqh (四角の高さ) で比例させる。 */
.hero-visual img{position:absolute;width:auto;object-fit:cover;object-position:top;background:#1B1B1F;border:0 solid #1B1B1F;box-shadow:0 18px 40px rgba(64,15,24,.12);}
.hero-visual .hv-paper{right:0;top:0;height:420px;aspect-ratio:900/1273;border:0;background:#fff;box-shadow:0 12px 30px rgba(64,15,24,.10);}
.hero-visual .hv-ipad{left:0;top:50px;height:450px;aspect-ratio:3/4;border-width:13px;border-radius:20px;}
.hero-visual .hv-phone{right:10%;bottom:0;height:400px;aspect-ratio:640/1391;border-width:6px;border-radius:27px;}
/* 客席に置く案内カード (2026-10-23 社長「案内カードも置ける?」)。 iPad の左下の手前に立てる */
.hero-visual .hv-card{left:-6%;bottom:-6px;height:230px;aspect-ratio:700/990;border:0;background:#fff;box-shadow:0 14px 30px rgba(64,15,24,.16);z-index:2;}
.hero-visual .hv-phone{z-index:3;}
/* iPad の画面 (特長・使い方)。 端末の縁は iPhone と同じ黒、 角は iPad の丸み */
.pad{--h:88cqh;width:auto;height:var(--h);aspect-ratio:3/4;object-fit:cover;object-position:top;border:calc(var(--h) * .028) solid #1B1B1F;background:#1B1B1F;border-radius:calc(var(--h) * .045);box-shadow:0 14px 30px rgba(64,15,24,.10);}
.phone{--h:88cqh;width:auto;height:var(--h);aspect-ratio:640/1391;object-fit:cover;object-position:top;border:calc(var(--h) * .015) solid #1B1B1F;background:#1B1B1F;border-radius:calc(var(--h) * .068);box-shadow:0 10px 24px rgba(64,15,24,.08);}
.pad-tile{background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden;container-type:size;}
.step .pad-tile{aspect-ratio:1/1;margin-bottom:24px;}
.step .pad{--h:84cqh;}
@media(max-width:960px){
  .hero-in{grid-template-columns:1fr;padding:56px 24px 64px;gap:40px;}
  .hero-visual{height:440px;max-width:520px;width:100%;margin:0;}   /* 1列になったら文と同じく左に寄せる (2026-10-23 社長) */
  .hero-visual .hv-paper{height:330px;}
  .hero-visual .hv-ipad{top:40px;height:350px;border-width:10px;border-radius:16px;}
  .hero-visual .hv-phone{right:6%;height:320px;border-width:5px;border-radius:22px;}
  .hero-visual .hv-card{left:-2%;height:180px;}
}
@media(max-width:480px){
  .hero-in{padding:44px 16px 52px;}
  .hero-title{font-size:27px;letter-spacing:.06em;}
  .hero-lead{font-size:15px;}
  .hero-visual{height:360px;}
  .hero-visual .hv-paper{height:270px;}
  .hero-visual .hv-ipad{top:34px;height:290px;border-width:8px;border-radius:13px;}
  .hero-visual .hv-phone{right:4%;height:260px;border-width:4px;border-radius:18px;}
  .hero-visual .hv-card{left:0;bottom:-4px;height:150px;}
}
/* 使い方動画のモーダル */
.lp-video{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;transition:opacity .26s ease;}
.lp-video[hidden]{display:none;}
.lp-video.show{opacity:1;}
.lp-video-backdrop{position:absolute;inset:0;background:rgba(30,8,12,.84);}
.lp-video-box{position:relative;height:min(80vh,860px);aspect-ratio:9/16;max-width:100%;margin-bottom:64px;}
.lp-video-more{position:absolute;left:50%;top:calc(100% + 16px);transform:translateX(-50%);white-space:nowrap;padding:10px 24px;border-radius:999px;background:#fff;color:#9B1C31;font-size:14px;letter-spacing:.06em;text-decoration:none;}
.lp-video-more:hover{background:#eef1f7;}
.lp-video-box video{width:100%;height:100%;display:block;border-radius:16px;background:#000;}
.lp-video-x{position:absolute;top:-6px;right:-50px;width:40px;height:40px;border:none;border-radius:50%;background:rgba(255,255,255,.92);color:#333;font-size:24px;line-height:1;cursor:pointer;z-index:1;}
@media(max-width:640px){.lp-video-x{top:8px;right:8px;}}

/* App Store バッジと Android のウェブ版バッジ (2026-08-03)。 2つは .store-badges で束ねる =
   入り切らない幅では束ごと次の行へ落ち、 全ロケール・全幅で「ストア2つは必ず同じ行」が成立する。 */
.hero-ios{display:inline-flex;align-items:center;line-height:0;text-decoration:none;transition:opacity .15s;}
.hero-ios:hover{opacity:.85;}
.hero-ios img{display:block;height:44px;width:auto;}
.store-badges{display:inline-flex;align-items:center;gap:12px;flex-wrap:nowrap;max-width:100%;}
.store-badges .hero-ios{flex:0 0 auto;}   /* Apple 公式バッジは改変禁止ゆえ縮めない */
.store-badges .android-web-badge{flex:0 1 auto;min-width:0;}
.android-web-badge{display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 15px;box-sizing:border-box;
  border-radius:8px;background:#000;color:#fff;text-decoration:none;line-height:1;transition:opacity .15s;max-width:100%;letter-spacing:0;}
.android-web-badge:hover{opacity:.85;color:#fff;}
.android-web-badge .awb-ic{display:flex;align-items:center;flex:none;}
.android-web-badge .awb-ic svg{display:block;width:21px;height:21px;fill:#3DDC84;}
.android-web-badge .awb-tx{display:flex;flex-direction:column;gap:3px;text-align:left;min-width:0;}
.android-web-badge .awb-1{font-size:9.5px;letter-spacing:.02em;opacity:.9;white-space:nowrap;}
.android-web-badge .awb-2{font-size:15px;font-weight:600;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media(max-width:440px){
  .android-web-badge{gap:7px;padding:0 10px;}
  .android-web-badge .awb-ic svg{width:19px;height:19px;}
  .android-web-badge .awb-1{font-size:9px;}
  .android-web-badge .awb-2{font-size:13px;}
  .store-badges{gap:9px;}
}

/* ---- Sections ---- */
.wrap{max-width:1164px;margin:0 auto;padding:0 32px;}
.sec{padding:80px 0;}   /* 2026-10-23 社長「縦方向の余白が広い」: 120 → 80 */
.sec.alt{background:#fff;}
/* 2026-10-23 社長「境界線がわからない、薄くでいいので背景色を節ごとに」: 白と2つの淡い色を交互に。
   淡い紺 = テーマ色の紺を薄めたもの、 生成り = 一覧の四角と同じ紙の色。 印刷では全部白に戻る (下の @media print)。 */
/* 節の地色 (2026-10-23 社長「ページ全て、 境目を見直して」): 隣り合う節は必ず違う色にする。
   Hero 淡紺 / 紹介 白 / 特長 生成り / 使い方 白 / 実績 淡紺 / 料金 白 / お知らせ 生成り / 想い 白 / 申し込み 灰紺 / フッター 紺 */
#features,#news{background:#F7F6F2;}
#stats{background:#F3ECED;}
/* 実績の節: 一度中央揃えにしたが、 社長「左揃えでよろしく」(2026-10-23) で他の節と同じ左揃えに戻した */
#statsLead .ln{display:block;}
#pricing{background:#fff;}
.svc{background:#F8F3F4!important;border-color:#EBDFE1!important;}
.sec-title{
  font-family:var(--rp-serif);font-size:30px;font-weight:400;color:var(--ink);
  letter-spacing:.08em;line-height:1.5;margin:0 0 20px;
  word-break:keep-all;overflow-wrap:break-word;text-wrap:pretty;
}
.sec-lead{color:var(--ink);font-size:15px;line-height:1.9;max-width:40em;margin:0 0 36px;}
.eyebrow{font-family:'Marcellus',var(--rp-serif);font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--primary-soft);margin:0 0 18px;}
@media(max-width:640px){
  .wrap{padding:0 16px;}
  .sec{padding:56px 0;}
  .sec-title{font-size:25px;letter-spacing:.06em;}
  .sec-lead{margin-bottom:28px;}
}

/* founder — 左に文、 右に画面 (虎屋「おいしい和菓子を…」の段) */
#founder{padding:80px 0;}
.founder-grid{display:grid;grid-template-columns:minmax(0,440fr) minmax(0,600fr);gap:64px;align-items:center;}
.founder-title{font-family:var(--rp-serif);font-size:28px;font-weight:400;color:var(--ink);
  letter-spacing:.1em;line-height:1.7;margin:0 0 14px;
  word-break:keep-all;overflow-wrap:break-word;text-wrap:pretty;}
.founder-byline{font-size:13px;color:var(--ink-soft);letter-spacing:.08em;margin:0 0 36px;}
.founder-points{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.founder-points li{padding:14px 0;font-size:15px;line-height:1.8;color:var(--ink);border-bottom:1px solid var(--line);text-wrap:pretty;}
.founder-foot{font-family:var(--rp-serif);font-size:15px;color:var(--primary);line-height:2;letter-spacing:.08em;margin:32px 0 0;}
.shot-tile{background:var(--tint);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.shot-tile img{height:90%;width:auto;aspect-ratio:640/1391;object-fit:cover;object-position:top;border:6px solid #1B1B1F;background:#1B1B1F;border-radius:34px;box-shadow:0 14px 30px rgba(64,15,24,.08);}
@media(max-width:960px){
  #founder{padding:56px 0;}
  .founder-grid{grid-template-columns:1fr;gap:44px;}
  .founder-title{font-size:23px;letter-spacing:.06em;}
}

/* features — 枠のない2列。 項目の上に細い線 */
/* 2026-10-23 社長「広すぎて入ってこない」: 4項目は横4列に詰め、 5つ目 (店のタブレットで見せる) は iPad と並べる */
.feat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 36px;}
.feat{padding:22px 0 28px;border-top:1px solid var(--line);}
.feat.wide{grid-column:1 / -1;padding-top:28px;}
.feat.wide p{max-width:52em;}
.ways{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:28px;}
.way{aspect-ratio:1/1;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;container-type:size;}
.way .pad{--h:76cqh;}
.way .phone{--h:86cqh;}
/* 席に置く案内カード (2026-10-23 社長「別の画像として5枚つづりに」) */
.way img{flex:none;min-width:0;}
.way .card{height:74%;width:auto;aspect-ratio:700/990;box-shadow:0 8px 20px rgba(64,15,24,.14);}
.way .paper{height:84%;width:auto;box-shadow:0 10px 24px rgba(60,30,15,.14);}
@media(max-width:1000px){ .feat-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
.feat h3{font-family:var(--rp-serif);font-size:16px;font-weight:400;color:var(--ink);margin-bottom:12px;letter-spacing:.08em;line-height:1.7;}
.feat p{font-size:14.5px;color:var(--ink-mid);line-height:1.9;}
@media(max-width:640px){ .feat-grid{grid-template-columns:1fr;} .feat{padding:20px 0 24px;} .ways{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px;} .way:last-child{grid-column:1 / -1;aspect-ratio:2/1;} }

/* steps — 番号と文だけ。 アイコン・矢印・カードは使わない */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 48px;}
.step{padding-top:24px;border-top:1px solid var(--primary);}
.step-num{display:block;font-family:var(--rp-sans);font-size:13px;letter-spacing:.12em;color:var(--primary);margin-bottom:14px;}
.step h3{font-family:var(--rp-serif);font-size:18px;font-weight:400;letter-spacing:.1em;margin-bottom:10px;color:var(--ink);}
.step p{font-size:14.5px;color:var(--ink-mid);line-height:1.9;}
@media(max-width:720px){
  .steps{grid-template-columns:1fr;gap:28px;}
  .step{display:grid;grid-template-columns:132px 1fr;column-gap:18px;align-items:start;}
  .step .pad-tile{grid-row:1 / span 3;margin:0;}
}

/* pricing — 無料 (左) と買い切り (右)。 影と枠の箱は使わず、 上の線だけ */
/* 通貨は「料金」の見出しと同じ行の右端 (2026-10-23 社長「見出しの右に、 幅を増やさないで」) */
.price-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;}
.ccy{position:relative;flex:none;}
/* 通貨 (2026-10-23 社長「おしゃれに、 地球儀ではない」): ブラウザ標準の選択リストをやめ、 言語メニューと同じ作りの一覧に */
.ccy-btn{display:inline-flex;align-items:center;gap:10px;background:none;border:0;border-bottom:1px solid #BDBDBD;padding:4px 2px 6px;cursor:pointer;font-family:var(--rp-serif);font-size:15px;letter-spacing:.12em;color:var(--ink);transition:border-color .15s,color .15s;}
.ccy-btn:hover,.ccy-btn[aria-expanded="true"]{border-color:var(--primary);color:var(--primary);}
.ccy-btn svg{color:var(--ink-soft);transition:transform .2s var(--ease,ease);}
.ccy-btn[aria-expanded="true"] svg{transform:rotate(180deg);}
.ccy-btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px;}
.ccy-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:50;list-style:none;margin:0;padding:6px 0;min-width:168px;background:#fff;border:1px solid var(--line);box-shadow:0 14px 34px rgba(64,15,24,.10);}
.ccy-menu li{display:flex;justify-content:space-between;gap:20px;padding:8px 18px;cursor:pointer;font-family:var(--rp-serif);font-size:14px;letter-spacing:.1em;color:var(--ink-mid);}
.ccy-menu li .s{color:var(--ink-soft);letter-spacing:.02em;}
.ccy-menu li:hover,.ccy-menu li:focus{background:var(--card);color:var(--primary);outline:none;}
.ccy-menu li[aria-selected="true"]{color:var(--primary);}
.ccy-menu li[aria-selected="true"] .s{color:var(--primary);}
@media print{.ccy{display:none!important;}}
.price-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 64px;}
.price-card{padding-top:28px;border-top:1px solid var(--line);}
.price-card.free{border-top-color:var(--primary);}
.pc-tag{display:inline-block;font-size:12px;letter-spacing:.12em;color:var(--primary);border:1px solid var(--primary);border-radius:999px;padding:3px 14px;margin-bottom:22px;}
.pc-amount{font-family:var(--rp-serif);font-size:56px;font-weight:400;color:var(--primary);line-height:1;letter-spacing:.02em;}
.pc-name{font-family:var(--rp-serif);font-size:17px;font-weight:400;color:var(--ink);margin:20px 0 12px;letter-spacing:.08em;line-height:1.7;}
.price-card.paid .pc-name{margin-top:0;}
.pc-desc{font-size:14.5px;color:var(--ink-mid);line-height:1.9;}
.pc-fine{font-size:12px;color:var(--ink-soft);line-height:1.8;margin-top:12px;}
.pc-packs{margin:8px 0 20px;}
.pc-packs .pk{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);}
.pk-q{font-size:14px;color:var(--ink);}
.pk-p{font-family:var(--rp-serif);font-size:17px;color:var(--primary);letter-spacing:.04em;white-space:nowrap;}
@media(max-width:720px){ .price-grid{grid-template-columns:1fr;gap:56px;} .pc-amount{font-size:48px;} }

/* news / お知らせ (2026-08-04 新設)。 12言語で文長が大きく振れるため日付・タグと本文は縦積みにする。 */
.news-list{list-style:none;margin:0;padding:0;}
.news-item{padding:24px 0;border-top:1px solid var(--line);}
.news-item:last-child{border-bottom:1px solid var(--line);}
.news-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.news-date{font-family:var(--rp-sans);font-size:14px;letter-spacing:.04em;color:#777;}
.news-tag{display:inline-flex;align-items:center;height:20px;padding:0 9px;
  font-size:11px;letter-spacing:.08em;white-space:nowrap;}
/* 審査中 = 枠線のみ、 リリース = 紺の塗り、 メディア = 淡い紺の枠 (第三者にご紹介いただいた件) */
.news-tag.is-review{border:1px solid var(--navy);color:var(--navy);background:#fff;}
.news-tag.is-release{border:1px solid var(--navy);color:#fff;background:var(--navy);}
.news-tag.is-media{border:1px solid var(--primary-soft);color:var(--primary-soft);background:transparent;}
.news-body{margin-top:8px;font-size:15px;color:var(--ink);line-height:1.8;letter-spacing:.02em;}
.news-body strong{font-weight:500;}
.news-link{margin-top:8px;font-size:13px;}
.news-link a{color:var(--ink);font-weight:700;font-size:14px;}
.news-link a::before{content:'>';display:inline-block;margin-right:8px;font-weight:400;transform:scaleX(.6);}
.news-link a:hover{opacity:.75;}
.news-more{margin-top:32px;text-align:center;}
.news-more-btn{display:inline-flex;align-items:center;justify-content:center;min-width:285px;height:46px;padding:0 28px;border:2px solid #CCC;border-radius:999px;color:var(--ink);font-size:14px;font-weight:700;letter-spacing:.04em;transition:border-color .15s,color .15s;}
.news-more-btn:hover{border-color:var(--primary);color:var(--primary);}

/* ---- App Preview — 虎屋の商品一覧の形。 淡い地の正方形に画面、 下に小さい説明 ---- */
#preview{min-width:0;}
#preview .rp-head{display:flex;align-items:center;justify-content:space-between;gap:24px;}
#preview .rp-nav{display:flex;gap:8px;flex:none;}
#preview .rp-arrow{width:40px;height:40px;border-radius:50%;border:1px solid #CFCFCF;background:#fff;color:var(--ink);font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .15s,color .15s;font-family:inherit;}
#preview .rp-arrow:hover{border-color:var(--primary);color:var(--primary);}
#preview .rp-track{display:flex;gap:28px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  margin-top:20px;margin-right:min(-32px,calc((1100px - 100vw) / 2));padding:0 32px 8px 0;scrollbar-width:none;}
#preview .rp-track::-webkit-scrollbar{display:none;}
#preview .rp-card{scroll-snap-align:start;flex:0 0 auto;width:300px;}
#preview .rp-stage{position:relative;width:100%;aspect-ratio:1/2;container-type:size;background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden;}
#preview .rp-card:nth-child(even) .rp-stage{background:var(--paper);}
#preview .rp-phone{--h:90cqh;position:relative;z-index:1;height:var(--h);aspect-ratio:640/1391;border:calc(var(--h) * .015) solid #1B1B1F;background:#1B1B1F;border-radius:calc(var(--h) * .068);overflow:hidden;box-shadow:0 10px 24px rgba(64,15,24,.08);}
#preview .rp-phone img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;border-radius:calc(var(--h) * .053);}
#preview .rp-bg{position:absolute;z-index:0;width:50%;top:8%;left:4%;transform:rotate(-7deg);box-shadow:0 8px 18px rgba(60,30,15,.12);}
#preview .rp-bg-r{left:auto;right:4%;transform:rotate(7deg);}
#preview .rp-cap{margin-top:18px;}
#preview .rp-num{font-family:var(--rp-sans);font-size:12px;letter-spacing:.12em;color:var(--primary-soft);margin-bottom:6px;}
#preview .rp-title{font-family:var(--rp-sans);font-size:15px;line-height:1.7;color:var(--ink);letter-spacing:.06em;margin-bottom:8px;}
#preview .rp-sub{font-size:12.5px;line-height:1.9;color:var(--ink-mid);}
@media (hover:none){#preview .rp-nav{display:none;}}
@media (max-width:640px){
  #preview .rp-card{width:260px;}
  #preview .rp-track{gap:16px;margin-top:16px;margin-right:-16px;padding:0 16px 8px 0;}
}

/* ============ MISSION / 私たちの想い ============ 日本語版のみ表示 */
#mission{padding:80px 0;background:#fff;}
#mission .mi-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:64px;align-items:start;}
#mission .mi-title{font-family:var(--rp-serif);font-size:26px;font-weight:400;color:var(--ink);line-height:1.7;letter-spacing:.1em;}
#mission .mi-body{font-size:14.5px;line-height:2.3;color:var(--ink-mid);letter-spacing:.04em;}
#mission .mi-body + .mi-body{margin-top:28px;}
#mission .mi-strong{margin:36px 0 0;font-family:var(--rp-serif);font-size:19px;color:var(--primary);letter-spacing:.12em;}
html:not([lang="ja"]) #mission{display:none;}
@media(max-width:960px){
  #mission{padding:56px 0;}
  #mission .mi-grid{grid-template-columns:1fr;gap:28px;}
  #mission .mi-title{font-size:22px;}
  #mission .mi-body{font-size:14px;}
  #mission .mi-body br{display:none;}
}

/* final — 虎屋のメールマガジンの帯の形。 左に言葉、 右にボタン */
.final{background:#E9DCDE;padding:48px 0;}
.final-in{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.final-title{font-family:var(--rp-serif);font-size:22px;font-weight:400;color:var(--ink);letter-spacing:.1em;line-height:1.7;margin-bottom:10px;}
.final-sub{color:var(--ink-mid);font-size:13.5px;line-height:2;}

/* footer */
.ft{background:var(--primary-deep);color:#fff;padding:64px 32px 40px;}
.ft-in{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;gap:36px;justify-content:space-between;align-items:flex-start;}
.ft-brand{font-family:'Marcellus',serif;font-size:22px;letter-spacing:2px;color:#fff;}
.ft-brand .tag{display:block;font-family:var(--rp-serif);font-size:12.5px;letter-spacing:.08em;line-height:1.9;color:rgba(255,255,255,.75);margin-top:12px;}
.ft-ig{display:inline-flex;align-items:center;margin-top:16px;color:#fff;transition:color .15s;}
.ft-ig svg{width:20px;height:20px;display:block;}
.ft-ig:hover{opacity:.7;}
.ft-links{display:flex;flex-wrap:wrap;gap:10px 32px;font-family:var(--rp-serif);font-size:14px;letter-spacing:.06em;}
.ft-links a{color:#fff;transition:opacity .15s;}
.ft-links a:hover{opacity:.7;}
.ft-right{display:flex;flex-direction:column;align-items:flex-start;gap:14px;}
.ft-cross a{display:inline-block;color:#fff;border-bottom:2px solid #6B8CD6;padding-bottom:5px;white-space:nowrap;transition:border-color .15s;}
/* 2026-08-31 社長指摘「幅を詰めて」: 空けたいのはブランド名とタグラインの間だけなので margin で作る */
.ft-cross .x-tag{margin-left:7px;}
.ft-cross a:hover{opacity:.8;}
/* HOST-PAAN (2026-10-06): 同じ型を HOST の深緑 (#1F5A3E) で */
.ft-cross-host a{border-bottom-color:#2E7D57;}
@media(max-width:520px){.ft-cross a{white-space:normal;}.ft-cross .x-tag{display:inline-block;}}
.ft-cross .x-brand{font-family:'Marcellus',serif;font-size:15px;letter-spacing:1.5px;white-space:nowrap;}
.ft-cross .x-tag{font-family:var(--rp-sans);font-size:12px;letter-spacing:.02em;color:rgba(255,255,255,.75);}
.ft-copy{max-width:1100px;margin:48px auto 0;font-size:12px;color:rgba(255,255,255,.75);letter-spacing:.06em;}
/* 商標帰属 (フッター最下部)。 コピーライトより一段弱く */
.ft-tm{max-width:1100px;margin:8px auto 0;font-size:10px;line-height:1.7;color:rgba(255,255,255,.55);letter-spacing:.01em;}
@media(max-width:640px){.ft{padding:48px 16px 32px;}}

/* ---- 拡大表示 (assets/lightbox.js、 2026-10-23 社長「タップしたらポップアップで、 解説とともに美しく拡大」) ----
   淡い地に画像を大きく、 横 (スマホは下) に題と解説。 端末の縁と角は本文と同じ比率 (iPhone 1.5%/6.8%、 iPad 2.8%/4.5%)。 */
[data-lb]{cursor:zoom-in;transition:transform .25s ease,box-shadow .25s ease;}
[data-lb]:focus-visible{outline:2px solid var(--primary);outline-offset:4px;}
@media(hover:hover){ .way [data-lb]:hover, .pad-tile [data-lb]:hover{transform:translateY(-3px);} }
.lb{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .28s ease;}
.lb[hidden]{display:none;}
.lb.show{opacity:1;}
.lb-bg{position:absolute;inset:0;background:rgba(64,15,24,.38);}   /* 2026-10-23 社長「拡大しすぎ、 元のページが見えた方が良い」: 後ろのページが透けて見える */
.lb:focus{outline:none;}
.lb-fig{position:relative;display:flex;align-items:center;gap:48px;max-width:min(880px,calc(100vw - 160px));padding:40px 48px;margin:0;background:#fff;box-shadow:0 30px 80px rgba(64,15,24,.25);transform:translateY(10px) scale(.98);transition:transform .38s cubic-bezier(.2,.7,.3,1);}
.lb.show .lb-fig{transform:none;}
.lb-media{flex:none;display:flex;align-items:center;justify-content:center;}
.lb-media img{display:block;width:auto;object-fit:cover;object-position:top;box-shadow:0 12px 30px rgba(64,15,24,.14);}
.lb-phone img{--h:min(64vh,600px);height:var(--h);aspect-ratio:640/1391;border:calc(var(--h) * .015) solid #1B1B1F;background:#1B1B1F;border-radius:calc(var(--h) * .068);}
.lb-pad img{--h:min(62vh,580px);height:var(--h);aspect-ratio:3/4;border:calc(var(--h) * .028) solid #1B1B1F;background:#1B1B1F;border-radius:calc(var(--h) * .045);}
.lb-paper img,.lb-card img{height:min(62vh,580px);background:#fff;border:1px solid var(--line);}
.lb-cap{width:300px;flex:none;}
.lb-n{font-size:12px;letter-spacing:.14em;color:var(--primary-soft);margin-bottom:14px;}
.lb-t{font-family:var(--rp-serif);font-size:23px;font-weight:400;line-height:1.6;letter-spacing:.08em;color:var(--ink);margin-bottom:16px;}
.lb-s{font-size:15px;line-height:2;color:var(--ink-mid);}
.lb-x{position:absolute;top:20px;right:24px;width:44px;height:44px;border-radius:50%;border:1px solid #CFCFCF;background:#fff;color:var(--ink);font-size:24px;line-height:1;cursor:pointer;}
.lb-arr{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1px solid #CFCFCF;background:#fff;color:var(--ink);font-size:22px;line-height:1;cursor:pointer;transition:border-color .15s,color .15s;}
.lb-x:hover,.lb-arr:hover{border-color:var(--primary);color:var(--primary);}
.lb-prev{left:24px;} .lb-next{right:24px;}
@media(max-width:860px){
  .lb-fig{flex-direction:column;gap:16px;padding:24px 20px 76px;width:calc(100vw - 32px);max-width:none;max-height:calc(100% - 32px);overflow:auto;}
  .lb-phone img{--h:min(50vh,calc((100vw - 72px) * 2.17));}
  .lb-pad img{--h:min(46vh,calc((100vw - 72px) * 1.333));}
  .lb-paper img,.lb-card img{height:min(46vh,calc((100vw - 72px) * 1.41));}
  .lb-cap{width:auto;max-width:520px;}
  .lb-t{font-size:19px;margin-bottom:8px;}
  .lb-s{font-size:14px;line-height:1.9;}
  .lb-x{top:24px;right:24px;z-index:2;}
  .lb-arr{top:auto;bottom:28px;transform:none;width:44px;height:44px;z-index:2;}
  .lb-prev{left:auto;right:84px;} .lb-next{right:32px;}
}
@media(prefers-reduced-motion:reduce){ .lb,.lb-fig,[data-lb]{transition:none;} }
@media print{ .lb{display:none!important;} }

/* ==== 2026-10-23 細部と動きの手直し (エージェント3人の点検から、 文言を変えないものだけ) ==== */
:root{--ease:cubic-bezier(.25,.46,.45,.94);}   /* 虎屋の緩急 (ease-out-quad) */
/* 字の大きさは4段に絞る: 明朝 見出し 32 / 24、 項目 18、 ゴシック 本文 16 / 説明 14 / 注記 12 (虎屋の実測) */
body{font-size:16px;line-height:1.9;}
.hero-title{font-size:40px;line-height:1.55;}
.sec-title,.founder-title,#mission .mi-title{font-size:32px;line-height:1.5;}
.final-title,.lb-t{font-size:24px;line-height:1.5;}
.feat h3,.step h3,.pc-name{font-size:18px;line-height:1.5;}
.sec-lead,.founder-points li,.news-body,.hero-lead{font-size:16px;line-height:1.9;}
#preview .rp-title{font-size:16px;}
.feat p,.step p,.pc-desc,#preview .rp-sub,.hero-sub,.final-sub,#mission .mi-body{font-size:14px;line-height:1.9;}
#mission .mi-body{line-height:2;}
.pc-fine,.ft-copy{font-size:12px;}
@media(max-width:960px){ .sec-title,.founder-title,#mission .mi-title{font-size:25px;} }
@media(max-width:480px){ .hero-title{font-size:28px;} .final-title,.lb-t{font-size:20px;} }
/* 欧文・タイ文字などは字間を詰める (英語で語がばらけて見えた)。 和文・中文・韓文は今のまま */
html:not([lang="ja"]):not([lang^="zh"]):not([lang="ko"]) :is(.hero-title,.sec-title,.founder-title,.feat h3,.step h3,.pc-name,.hero-lead,.final-title,.ft-links,.lb-t,#mission .mi-title,.nav a,.lang-toggle){letter-spacing:.01em;}
.hero-title{text-wrap:balance;}
/* Android のバッジ: 2行目の字の下端が切れていた */
.android-web-badge .awb-2{line-height:1.25;padding-bottom:1px;}
.android-web-badge .awb-tx{gap:1px;}
/* Hero の文字の左端を他の節にそろえる (8px ずれていた) */
.hero-in{max-width:1164px;}
.hero-visual .hv-card{bottom:0;}
@media(max-width:960px){
  .hero-visual .hv-ipad{left:0;height:370px;}
  .hero-visual .hv-paper{right:4%;}
  .hero-visual .hv-card{left:0;}
}
@media(max-width:480px){ .hero-visual .hv-ipad{height:290px;} }
/* 紹介の段: 左の文の上端を右の四角の上端にそろえる */
.founder-grid{align-items:start;}
.founder-grid > div:first-child{padding-top:60px;}
@media(max-width:960px){ .founder-grid > div:first-child{padding-top:0;} }
/* 線は 1px の灰に統一 (紺の線のすぐ下に淡紺の四角が来て、 区切りが二重に見えていた) */
.step{border-top:0;padding-top:0;}
.price-card.free{border-top-color:var(--line);}
.ft-cross a{border-bottom-width:1px;}
/* 画像の四角: 見せ方の5つは淡紺の地、 中身の目の高さをそろえる。 使い方の四角は小ぶりに */
.way{background:var(--tint);}
.way .pad{--h:92cqh;} .way .phone{--h:94cqh;} .way .card,.way .paper{height:92%;}   /* 枠ぎりぎりまで (2026-10-23 社長) */
.steps{gap:0 40px;}
.step .pad-tile{max-width:300px;}
/* フッター (スマホ): 姉妹アプリの説明は次の行で字下げしない、 リンクは2列 */
@media(max-width:520px){
  .ft-cross .x-tag{display:block;margin:4px 0 0;}
  .ft-links{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;}
}
/* 動き: 浮かせる距離を縮め、 並んだ物は左から 0.08 秒ずつ遅らせて出す */
.anim-reveal{transform:translateY(10px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
:is(.feat-grid,.steps,.price-grid,.ways) > .anim-reveal:nth-child(2){transition-delay:.08s;}
:is(.feat-grid,.steps,.price-grid,.ways) > .anim-reveal:nth-child(3){transition-delay:.16s;}
:is(.feat-grid,.steps,.price-grid,.ways) > .anim-reveal:nth-child(4){transition-delay:.24s;}
/* 特長の細い線は、 出る時に左から引く */
.feat{border-top:0;position:relative;}
.feat::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease);}
.feat.revealed::before{transform:none;}
.no-js .feat::before{transform:none;}
/* Hero: 読み込み時に一度だけ、 紙 → iPad → 案内カード → iPhone の順に置く */
@keyframes hvIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.hero-visual img{animation:hvIn .8s var(--ease) both;}
.hero-visual .hv-ipad{animation-delay:.1s;} .hero-visual .hv-card{animation-delay:.2s;} .hero-visual .hv-phone{animation-delay:.3s;}
/* hover は額縁の中で少し寄る (虎屋の型)。 マウスの端末だけ */
.way [data-lb],.pad-tile [data-lb]{transition:transform .4s var(--ease),opacity .4s var(--ease);}
@media(hover:hover) and (pointer:fine){
  .way [data-lb]:hover,.pad-tile [data-lb]:hover,#preview .rp-stage:hover .rp-phone{transform:scale(1.03);opacity:.9;}
  #preview .rp-phone{transition:transform .4s var(--ease),opacity .4s var(--ease);}
}
/* App Preview の矢印は端に来たら薄く */
#preview .rp-arrow[aria-disabled="true"]{opacity:.3;cursor:default;}
/* 拡大表示の前後送りは、 一度消してから出す */
.lb-media img,.lb-cap{transition:opacity .2s ease;}
.lb.swap .lb-media img,.lb.swap .lb-cap{opacity:0;}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .anim-reveal,.feat::before,.hero-visual img,.way [data-lb],.pad-tile [data-lb],.lb-media img,.lb-cap{transition:none!important;animation:none!important;}
  .feat::before{transform:none;}
}
@media print{ .feat::before{transform:none!important;} .hero-visual img{animation:none!important;} }

/* 実績の数字 (料金の上) と、 メニュー登録の代行 (料金の下) */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px;margin:36px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.stat{padding:28px 0 24px;display:flex;flex-direction:column;justify-content:space-between;}   /* 見出しが2行になっても数字の下端はそろえる */
.stat dt{font-size:13px;color:var(--ink-mid);letter-spacing:.06em;margin-bottom:6px;}
.stat dd{font-family:var(--rp-serif);font-size:44px;line-height:1.2;color:var(--primary);letter-spacing:.02em;}
.svc{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:64px;padding:32px 36px;background:#fff;border:1px solid var(--line);}
.svc-t{font-family:var(--rp-serif);font-size:18px;font-weight:400;letter-spacing:.06em;margin-bottom:6px;}
.svc-s{font-size:14px;line-height:1.9;color:var(--ink-mid);max-width:44em;}
.svc .btn{flex:none;}
@media(max-width:720px){
  .stats{grid-template-columns:1fr 1fr 1fr;gap:0 12px;margin-top:24px;}
  .stat dd{font-size:28px;} .stat dt{font-size:11.5px;}
  .svc{flex-direction:column;align-items:flex-start;padding:24px 20px;margin-top:44px;}
}
@media print{
  .stats{margin:2mm 0 0!important;} .stat{padding:1.5mm 0!important;} .stat dd{font-size:16pt!important;} .stat dt{font-size:8pt!important;margin:0!important;}
  .svc{margin-top:5mm!important;padding:3mm 4mm!important;} .svc .btn{display:none!important;}
  .svc-s{font-size:9pt!important;}
}

.price-cta{margin-top:40px;}
@media print{.price-cta{display:none!important;}}

/* 線のボタン (お問い合わせ・もっと見る) は細い明朝 (2026-10-23 社長「フォントが微妙すぎる」) */
.btn-line,.news-more-btn{font-family:var(--rp-serif);font-weight:400;font-size:15px;letter-spacing:.14em;border:1px solid #BDBDBD;color:var(--ink);}
html:not([lang="ja"]):not([lang^="zh"]):not([lang="ko"]) :is(.btn-line,.news-more-btn){letter-spacing:.04em;}
#pricing .sec-lead{max-width:none;}

.stats-asof{margin-top:14px;font-size:12px;color:var(--ink-soft);letter-spacing:.06em;}
.stat dd{font-variant-numeric:tabular-nums;}
@media print{.stats-asof{margin-top:1mm!important;font-size:7.5pt!important;}}
/* MENU の LP: 「皆様からのお声」 の下の実績 (2026-10-23)。 地色は節 (#voices) のまま、 線だけ少し濃く */
#voices .lp-stats{margin-top:56px;}
#voices .stats{margin-top:0;gap:0 48px;border-color:#E3D3D6;}   /* 列はお声の3列 (gap 48px) にそろえる */
.stats-note{margin-top:8px;font-size:11.5px;line-height:1.9;color:var(--ink-soft);letter-spacing:.04em;max-width:60em;}
@media(max-width:720px){ #voices .lp-stats{margin-top:40px;} #voices .stats{gap:0 12px;} .stats-note{font-size:11px;} }
/* 2026-10-24 社長「リピート率の記載をやめて」: 数字は国・地域と品数の2つ → 2列 (ID で .stats の3列指定を幅に関係なく上書き) */
#lpStats .stats{grid-template-columns:repeat(2,minmax(0,1fr));}
/* 2026-10-24 第2回ネイティブチェック: de の料金カードの長い複合語 (Einmalkauf-Pakete 等) を行末で分けられるように */
:lang(de) .plan .pc-name,:lang(de) .pk-q{hyphens:auto;-webkit-hyphens:auto;}
@media print{ #voices .lp-stats{margin-top:4mm!important;} .stats-note{font-size:7pt!important;margin-top:1mm!important;} }

/* ハンバーガー: 目次が畳まれた時だけ (900px 以下、 または言語で幅が足りない .hdr-tight) */
.burger{display:none;flex:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;padding:0 7px;background:none;border:0;cursor:pointer;}
.burger{align-items:center;}
.burger span{display:block;width:20px;height:1.2px;background:var(--ink);transition:transform .25s var(--ease,ease),opacity .2s;}
.burger.open span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
.burger:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.hdr-tight .burger{display:inline-flex;}
@media(max-width:900px){ .burger{display:inline-flex;} }
.nav-panel{position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--line);box-shadow:0 18px 30px rgba(64,15,24,.08);padding:4px 32px 20px;}
.nav-panel a{display:block;padding:15px 0;border-bottom:1px solid var(--line);font-family:var(--rp-serif);font-size:16px;letter-spacing:.1em;color:var(--ink);}
.nav-panel a:last-child{border-bottom:0;color:var(--primary);}
.nav-panel a:hover{color:var(--primary-soft);}
@media(max-width:640px){ .nav-panel{padding:4px 16px 16px;} }
@media(max-width:480px){ .ig{display:none!important;} .hdr{gap:10px;} .burger{width:30px;padding:0 4px;} }
@media(max-width:640px){ .hdr{gap:16px;} }
@media(max-width:380px){ .logo{font-size:14px;letter-spacing:.8px;gap:7px;} .logo .ic,.logo .ic svg{width:22px;height:22px;} .nav .nav-cta{padding:0 10px;font-size:11px;} .nav{gap:10px;} .hdr{padding:0 12px;} }
@media print{ .burger,.nav-panel{display:none!important;} }

/* 使い方動画のボタン: 表紙の絵は社長「ここまでわかりやすくなくていい」で戻し、 字だけ上げた (2026-10-23) */
.hero-howto-btn{font-size:17px;gap:14px;}
.hero-howto-btn .hh-play{width:42px;height:42px;}
.hero-howto-btn .hh-play svg{width:15px;height:15px;}

.how-lead{margin-bottom:14px!important;}
.how-video{margin:0 0 44px;}
.how-video-btn{display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:0;cursor:pointer;font-family:var(--rp-serif);font-size:16px;letter-spacing:.08em;color:var(--primary);border-bottom:1px solid rgba(155,28,49,.35);padding-bottom:3px;transition:border-color .15s,opacity .15s;}
.how-video-btn:hover{border-color:var(--primary);}
.how-video-btn .hv-ic{width:24px;height:24px;border-radius:50%;border:1px solid currentColor;display:inline-flex;align-items:center;justify-content:center;}
.how-video-btn .hv-ic svg{width:9px;height:9px;fill:currentColor;margin-left:1px;}
.how-video-btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px;}
@media print{.how-video{display:none!important;}}

/* 古いブラウザ (iOS 15 以前の Safari など、 cqh を知らない) の逃げ道: 端末の縁は固定の太さ、 大きさは四角に対する % で描く */
@supports not (height:1cqh){
  .pad,.phone,#preview .rp-phone{height:86%;}
  .pad{border-width:7px;border-radius:14px;}
  .phone,#preview .rp-phone{border-width:5px;border-radius:24px;}
  #preview .rp-phone img{border-radius:19px;}
}

/* reveal */
.anim-reveal{opacity:0;transform:translateY(14px);transition:opacity .8s ease,transform .8s ease;}
.anim-reveal.revealed{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){ .anim-reveal{opacity:1;transform:none;transition:none;} }

/* ============================================================================
 * 印刷用 (2026-07-11 社長指示「アナログな役所が restopaan.com を印刷する日が来る」、
 * 2026-10-23 社長「印刷する時に綺麗に A4 で出せることも重要」)。
 * A4 縦・余白 12mm = 本文幅 約 700px なので、 画面用の狭い幅の段組み (@media max-width) が
 * そのまま効いてしまう。 印刷では段組みをここで固定し直す。 背景色は既定で刷られないため、
 * 紺地に白字の所 (フッター) は白地に濃い字へ戻す。 ボタン・動画・言語切替は紙に要らない。
 * ==========================================================================*/
@media print{
  @page{size:A4 portrait;margin:12mm 12mm 14mm;}
  *{animation:none!important;transition:none!important;box-shadow:none!important;text-shadow:none!important;}
  .anim-reveal{opacity:1!important;transform:none!important;}
  html,body{background:#fff!important;padding-top:0!important;font-size:10.5pt;}
  .nav, .hero-ctas, .hero-howto, .hero-cross, .btn, .rp-nav, .final, .news-more, .lp-video, .ft-ig, .ft-tm{display:none!important;}
  .wrap, .hero-in, .ft-in{max-width:none!important;padding-left:0!important;padding-right:0!important;}
  .hdr{position:static!important;height:auto!important;padding:0 0 3mm!important;border-bottom:1px solid var(--navy)!important;background:#fff!important;}

  /* ヒーロー: 左に言葉、 右に画面2枚 (小さく) */
  .hero{background:#fff!important;}
  .hero-in{display:grid!important;grid-template-columns:1fr 62mm!important;gap:8mm!important;padding:5mm 0 2mm!important;align-items:center!important;}
  .hero-title{font-size:20pt!important;margin-bottom:4mm!important;}
  .hero-lead{font-size:11pt!important;}
  .hero-sub{font-size:9.5pt!important;margin:0!important;}
  .hero-visual{height:50mm!important;max-width:none!important;margin:0!important;}
  .hero-visual .hv-paper{height:38mm!important;}
  .hero-visual .hv-ipad{top:5mm!important;height:40mm!important;border-width:1.1mm!important;border-radius:1.8mm!important;}
  .hero-visual .hv-phone{height:36mm!important;border-width:.55mm!important;border-radius:2.4mm!important;}
  .hero-visual .hv-card{height:20mm!important;left:-2mm!important;bottom:0!important;border:.2mm solid #ddd!important;}
  .pad-tile{background:#fff!important;}
  .ways{grid-template-columns:repeat(5,1fr)!important;gap:3mm!important;margin-top:3mm!important;}
  .way:last-child{grid-column:auto!important;}
  .way{aspect-ratio:auto!important;height:40mm;background:#fff!important;}
  .step .pad-tile{height:42mm;aspect-ratio:auto!important;margin-bottom:2mm!important;}

  /* 節: 余白を詰め、 見出しの直後で改ページしない */
  .sec, #founder, #mission{padding:6mm 0!important;background:#fff!important;}
  #features, #stats{break-before:page;padding-top:0!important;}
  #pricing{padding-top:5mm!important;}
  /* お知らせ (版の更新の告知) は紙には要らない (2026-10-23)。 4枚目を 実績・料金・代行・想い・フッター にする */
  #news{display:none!important;}
  #pricing .sec-lead{margin-bottom:3mm!important;}
  .pc-tag{margin-bottom:2mm!important;}
  .pc-amount{font-size:20pt!important;}
  .pc-name{margin:2mm 0 1mm!important;}
  .pc-packs{margin:0 0 2mm!important;}
  .pc-packs .pk{padding:1.2mm 0!important;}
  .svc{margin-top:4mm!important;}
  #mission{padding-top:5mm!important;padding-bottom:4mm!important;}
  #mission .mi-body{line-height:1.7!important;}
  .ft{padding-top:3mm!important;}
  .ft-in{gap:3mm 8mm!important;}
  .stats{margin-top:1mm!important;}
  #pricing{padding-top:3mm!important;padding-bottom:2mm!important;}
  #pricing .sec-title{font-size:13pt!important;}
  .pc-desc,.svc-s{line-height:1.55!important;}
  .svc-t{font-size:10.5pt!important;margin-bottom:1mm!important;}
  .ft-brand .tag{margin-top:1mm!important;}
  .ft-right{gap:2mm!important;}
  .ft-cross a{padding-bottom:1mm!important;}
  .ft-copy{margin-top:2mm!important;}
  #mission{padding-top:3mm!important;}
  .sec-lead{max-width:none!important;}
  #stats .sec-title{font-size:12pt!important;}
  #statsLead{font-size:9pt!important;margin-bottom:1mm!important;line-height:1.6!important;}
  #stats{padding-bottom:1mm!important;}
  #statsLead .ln{display:inline!important;}
  #stats .sec-title{margin-bottom:1mm!important;}
  #mission .mi-body + .mi-body{margin-top:1.5mm!important;}
  #news .news-list{margin-top:3mm!important;}
  .sec-title, .founder-title, #mission .mi-title{font-size:14pt!important;margin-bottom:2mm!important;break-after:avoid;}
  .sec-lead{font-size:10pt!important;margin-bottom:4mm!important;break-after:avoid;}
  .eyebrow{margin-bottom:2mm!important;}
  h1,h2,h3{break-after:avoid;}

  .founder-grid{grid-template-columns:1fr!important;gap:6mm!important;}
  .founder-byline{margin-bottom:3mm!important;}
  .founder-points{display:grid;grid-template-columns:1fr 1fr;column-gap:5mm;}
  .founder-points li{padding:1.6mm 0!important;font-size:9.5pt!important;}
  .founder-foot{margin-top:3mm!important;font-size:10pt!important;}
  .shot-tile{margin:0!important;aspect-ratio:auto!important;height:50mm;background:#fff!important;}
  .shot-tile img{height:46mm!important;border-radius:4mm!important;border-width:1mm!important;}

  .news-item{padding:2.2mm 0!important;break-inside:avoid;}
  .news-body{font-size:9pt!important;line-height:1.6!important;margin-top:1mm!important;}

  /* 画面の一覧: 横スクロール → 4列 x 2段 */
  #preview .rp-head{display:block!important;}
  #preview .rp-track{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:5mm 4mm!important;overflow:visible!important;padding:0!important;margin:3mm 0 0!important;}
  #preview .rp-card{width:auto!important;break-inside:avoid;}
  #preview .rp-track{gap:6mm 5mm!important;margin-top:3mm!important;margin-right:0!important;}
  #preview .rp-stage{background:#fff!important;aspect-ratio:auto!important;height:72mm;}
  #preview .rp-phone{--h:70mm;height:70mm!important;}
  #preview .rp-bg{display:none!important;}
  #preview .rp-cap{margin-top:2mm!important;}
  #preview .rp-num{font-size:7pt!important;margin-bottom:.5mm!important;}
  #preview .rp-title{font-size:9.5pt!important;margin-bottom:1mm!important;line-height:1.5!important;}
  #preview .rp-sub{font-size:8.5pt!important;line-height:1.55!important;}
  #preview .rp-title br, #preview .rp-sub br{display:none;}

  .feat-grid, .price-grid{grid-template-columns:1fr 1fr!important;gap:0 8mm!important;}
  .feat{padding:3mm 0 4mm!important;break-inside:avoid;}
  .feat.wide{grid-column:1 / -1!important;}
  .feat h3, .step h3, .pc-name{font-size:11pt!important;margin-bottom:1.5mm!important;}
  .feat p, .step p, .pc-desc{font-size:9.5pt!important;line-height:1.7!important;}
  .steps{grid-template-columns:repeat(3,1fr)!important;gap:0 6mm!important;}
  .step{padding-top:3mm!important;break-inside:avoid;}
  .price-card{padding-top:3mm!important;break-inside:avoid;}
  .pc-amount{font-size:26pt!important;}
  .pc-packs .pk{padding:1.8mm 0!important;}

  #mission .mi-grid{grid-template-columns:52mm 1fr!important;gap:8mm!important;}
  #mission .mi-body{font-size:9.5pt!important;line-height:1.9!important;}
  #mission .mi-body + .mi-body{margin-top:3mm!important;}
  #mission .mi-strong{margin-top:3mm!important;font-size:12pt!important;}
  #mission, .steps, .price-grid{break-inside:avoid;}
  #how{padding-top:10mm!important;}

  /* フッター: 紺地に白字 → 白地に濃い字 */
  .ft{background:#fff!important;color:var(--ink)!important;padding:5mm 0 0!important;border-top:1px solid var(--navy)!important;break-inside:avoid;}
  .ft-brand{color:var(--primary)!important;font-size:13pt!important;}
  .ft-brand .tag, .ft-copy, .ft-cross .x-tag{color:var(--ink-mid)!important;}
  .ft-links a, .ft-cross a{color:var(--ink)!important;}
  .ft-copy{margin-top:4mm!important;}
  img{print-color-adjust:exact;-webkit-print-color-adjust:exact;}
}

/* ==== MENU-PAAN 固有 (2026-10-23 restopaan.com と同じ型に作り替え) ==== */
/* ヘッダー: MENU のスクリプトは .lp-header に .tight (目次とログインを畳む) / .tight2 (さらに畳む) を付ける */
.lp-header.tight .nav .nav-link,.lp-header.tight .nav .login{display:none;}
.lp-header.tight .burger{display:inline-flex;}
.lp-header.tight2 .ig{display:none;}
/* 言語メニュー: MENU のスクリプトは #locale-menu に .show を付け外しし、 中身 (.lp-locale-item) を作る */
.lang-menu{display:none;}
.lang-menu.show{display:block;}
.lang-menu .lp-locale-item{display:block;width:100%;text-align:left;background:none;border:none;padding:10px 18px;font:400 13.5px/1.3 var(--rp-sans);letter-spacing:.04em;color:var(--ink-mid);cursor:pointer;}
.lang-menu .lp-locale-item:hover{background:var(--card);color:var(--primary);}
.lang-menu .lp-locale-item.active{color:var(--primary);background:var(--card);}
.lang-toggle .fl{display:inline-flex;}
.lang-toggle .fl svg{width:16px;height:16px;}
/* Hero: スペイン語の紙のメニュー (奥) + iPad の訳したメニュー + iPhone の注文画面 (手前) */
.hero-visual .hv-paper{right:0;top:0;height:430px;aspect-ratio:5/7;border:0;background:#fff;box-shadow:0 12px 30px rgba(64,15,24,.12);z-index:0;}
.hero-visual .hv-ipad{left:0;top:56px;height:440px;aspect-ratio:3/4;border-width:12px;border-radius:20px;z-index:1;}
.hero-visual .hv-phone{right:9%;bottom:0;height:400px;aspect-ratio:600/1304;border-width:6px;border-radius:27px;z-index:2;}
.hero-tagline{font-size:13px;letter-spacing:.08em;color:var(--ink-mid);margin:-24px 0 32px;}
.hero-tagline .brand{font-family:'Marcellus',var(--rp-serif);letter-spacing:.12em;color:var(--primary);}
.hero-punch{font-family:var(--rp-serif);font-size:15px;line-height:2;letter-spacing:.06em;color:var(--ink);margin:0 0 32px;}
@media(max-width:960px){ .hero-visual .hv-paper{height:340px;right:2%;} .hero-visual .hv-ipad{top:40px;height:350px;border-width:10px;border-radius:16px;} .hero-visual .hv-phone{right:6%;height:320px;border-width:5px;border-radius:22px;} }
@media(max-width:480px){ .hero-visual .hv-paper{height:270px;} .hero-visual .hv-ipad{top:34px;height:290px;border-width:8px;border-radius:13px;} .hero-visual .hv-phone{right:4%;height:260px;border-width:4px;border-radius:18px;} }
/* 紹介の段のフッター行 (105の国・地域 / 無料) */
.founder-foot span{display:block;}
/* 比較の表 */
.cmp{width:100%;border-collapse:collapse;}
.cmp th,.cmp td{border-bottom:1px solid var(--line);padding:16px 12px;font-weight:400;vertical-align:middle;}
.cmp thead th{border-bottom:1px solid var(--primary);padding-top:0;font-family:var(--rp-serif);font-size:14px;letter-spacing:.08em;color:var(--ink-mid);text-align:center;width:150px;}
.cmp thead th:first-child{width:auto;}
.cmp thead th.self{color:var(--primary);}
.cmp thead .brand{font-family:'Marcellus',var(--rp-serif);letter-spacing:.12em;}
.cmp tbody th{text-align:left;font-size:15px;line-height:1.8;color:var(--ink);padding-left:0;}
.cmp tbody th .hl{font-weight:500;color:var(--primary);}
.cmp td{text-align:center;}
.cmp td.self{background:rgba(155,28,49,.035);}
.cmp-mk{display:inline-flex;width:22px;height:22px;align-items:center;justify-content:center;}
.cmp-mk svg{width:20px;height:20px;}
.cmp-mk.yes{color:var(--primary);}
.cmp-mk.partial{color:var(--primary-soft);}
.cmp-mk.no{color:#C9C9C9;}
.cmp-note{margin-top:16px;font-size:12px;color:var(--ink-soft);line-height:1.8;}
@media(max-width:640px){ .cmp thead th{width:80px;font-size:12px;letter-spacing:0;} .cmp tbody th{font-size:13.5px;} .cmp th,.cmp td{padding:12px 6px;} .cmp tbody th{padding-left:0;} }
/* 皆様からのお声 */
.voices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 48px;}
.voice{border-top:1px solid var(--line);padding-top:28px;}
.voice .q{font-family:var(--rp-serif);font-size:15px;line-height:2.1;letter-spacing:.04em;color:var(--ink);}
.voice .q strong{font-weight:500;color:var(--primary);}
.voice .who{margin-top:20px;font-size:12.5px;color:var(--ink-soft);letter-spacing:.06em;line-height:1.8;}
@media(max-width:820px){ .voices{grid-template-columns:1fr;gap:36px;} }
/* 料金: 無料 / 買い切りパック / 旅行プラン の3列 */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 48px;}
.plan{padding-top:28px;border-top:1px solid var(--line);}
.plan .pc-name{margin:14px 0 10px;}
.plan .pc-amount{margin:6px 0 12px;}
.pc-sale{display:inline-block;font-size:11.5px;letter-spacing:.1em;color:#fff;background:var(--primary);padding:2px 10px;margin-left:8px;vertical-align:middle;}
.pc-sub{font-size:13px;color:var(--ink-mid);letter-spacing:.04em;margin-bottom:6px;}
.tiers .pk{flex-wrap:wrap;}
.tiers .pk-q{font-size:14.5px;}
.tiers .pk-s{width:100%;font-size:12px;color:var(--ink-soft);margin-top:2px;}
.pc-was{font-size:12.5px;color:var(--ink-soft);text-decoration:line-through;margin-right:8px;font-family:var(--rp-sans);}
.plans-notes{margin-top:28px;font-size:13px;color:var(--ink-mid);line-height:1.9;}
.plans-notes p + p{margin-top:4px;font-size:12px;color:var(--ink-soft);}
@media(max-width:820px){ .plans{grid-template-columns:1fr;gap:44px;} }
/* 創業の物語: 左に見出し、 右に本文 (想いの節と同じ型) */
#story{padding:80px 0;}
#story .mi-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:64px;align-items:start;}
#story .st-title{font-family:var(--rp-serif);font-size:32px;font-weight:400;line-height:1.6;letter-spacing:.08em;}
#story .st-body p{font-size:15px;line-height:2.15;color:var(--ink-mid);letter-spacing:.03em;}
#story .st-body p + p{margin-top:22px;}
#story .st-body hr{border:0;border-top:1px solid var(--line);margin:32px 0;}
#story .st-sig{margin-top:32px;font-family:var(--rp-serif);font-size:14px;letter-spacing:.06em;color:var(--ink);}
@media(max-width:960px){ #story{padding:56px 0;} #story .mi-grid{grid-template-columns:1fr;gap:24px;} #story .st-title{font-size:25px;} #story .st-body p{font-size:14px;} }
/* 公開前のお知らせ (今は出ない。 MP_APP_LIVE=false の時だけ) */
.lp-gate{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;transition:opacity .26s ease;}
.lp-gate[hidden]{display:none;}
.lp-gate.show{opacity:1;}
.lp-gate-backdrop{position:absolute;inset:0;background:rgba(30,8,12,.45);}
.lp-gate-card{position:relative;width:100%;max-width:440px;background:#fff;padding:40px 34px 32px;text-align:center;}
.lp-gate-x{position:absolute;top:12px;right:14px;width:34px;height:34px;border:none;background:none;font-size:24px;cursor:pointer;}
.lp-gate-mk{display:none;}
.lp-gate-title{font-family:var(--rp-serif);font-size:22px;font-weight:400;margin:0 0 14px;}
.lp-gate-body{color:var(--ink-mid);font-size:14.5px;line-height:2;margin:0 0 26px;}
@media print{
  .cmp th,.cmp td{padding:1.4mm 2mm!important;font-size:8.5pt!important;}
  .voices,.plans{grid-template-columns:repeat(3,1fr)!important;gap:0 6mm!important;}
  .voice .q{font-size:8.5pt!important;line-height:1.6!important;}
  #story .mi-grid{grid-template-columns:44mm 1fr!important;gap:6mm!important;}
  #story .st-body p{font-size:8.5pt!important;line-height:1.6!important;}
  #story .st-body p + p{margin-top:1.5mm!important;}
}
/* 書体 (restopaan.com は頭の <style> に持つ。 MENU は Google Fonts の Noto を使う) */
:root{--rp-serif:'Noto Serif JP','Hiragino Mincho ProN','Yu Mincho',serif;--rp-sans:'Noto Sans JP','Hiragino Kaku Gothic ProN','Yu Gothic',-apple-system,'Helvetica Neue',sans-serif;}
html[lang="zh-CN"],html[lang="zh-Hans"]{--rp-serif:'Songti SC','Noto Serif SC','Noto Serif JP',serif;--rp-sans:'PingFang SC','Noto Sans SC','Noto Sans JP',sans-serif;}
html[lang="zh-TW"],html[lang="zh-Hant"]{--rp-serif:'Songti TC','Noto Serif TC','Noto Serif JP',serif;--rp-sans:'PingFang TC','Noto Sans TC','Noto Sans JP',sans-serif;}
html[lang="ko"]{--rp-serif:'AppleMyungjo','Noto Serif KR','Noto Serif JP',serif;}
/* スマホ: 言語の名前を畳む (restopaan.com の #langLabel と同じ) */
@media(max-width:430px){ .lang-toggle #locale-name{display:none;} }
/* 節の地色: 比較 (白) とお声が続かないように */
#voices{background:#F3ECED;}
#compare{background:#fff;}


/* ==== 高さを詰める (2026-10-23 社長「高さを節約して。 スクロールがめんどくさい」) ==== */
.sec{padding:60px 0;}
#founder,#mission,#story{padding:60px 0;}
.hero-in{padding:52px 32px 60px;}
.sec-title{margin-bottom:14px;}
.sec-lead{margin-bottom:28px;}
.founder-byline{margin-bottom:22px;}
.founder-points li{padding:10px 0;}
.founder-foot{margin-top:20px;}
.feat{padding:18px 0 22px;}
.feat h3{margin-bottom:8px;}
.news-item{padding:18px 0;}
.news-more{margin-top:24px;}
.price-cta{margin-top:28px;}
.svc{margin-top:36px;padding:26px 30px;}
.stat{padding:20px 0 18px;}
.final{padding:44px 0;}
.ft{padding:48px 32px 32px;}
.pc-packs .pk{padding:11px 0;}
/* 料金の行: 回数・期間はプラン名の横に並べる (1行に収める) */
.tiers .pk{flex-wrap:nowrap;align-items:baseline;}
.tiers .pk-q{order:0;white-space:nowrap;}
.tiers .pk-s{order:1;width:auto;margin:0 auto 0 10px;}
.tiers .pk-p{order:2;white-space:nowrap;}
@media(max-width:640px){
  .sec,#founder,#mission,#story{padding:44px 0;}
  .hero-in{padding:32px 16px 40px;gap:28px;}
  .sec-lead{margin-bottom:22px;}
  .founder-grid{gap:32px;}
  .feat{padding:16px 0 18px;}
  .final{padding:36px 0;}
  .ft{padding:40px 16px 28px;}
}
@media(max-width:820px){
  .plans,.price-grid{gap:28px;}
  .plan,.price-card{padding-top:18px;}
  .plan .pc-name{margin:10px 0 6px;}
  .pc-tag{margin-bottom:10px;}
  .pc-amount{font-size:40px;}
}
/* 使い方動画への入口 (2026-10-23 社長「使い方動画を見る のボタンをいろいろなところに」) */
.vlink{margin-top:20px;}
.final-ctas .vlink,.price-cta .vlink{margin:0;}
@media print{ .vlink{display:none!important;} }
@media(max-width:640px){
  /* 見せ方の5つはスマホでも3列 (2段)、 App Preview の四角は少し低く */
  .ways{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;}
  .way:last-child{grid-column:auto!important;aspect-ratio:1/1!important;}
  #preview .rp-card{width:200px;}
  #preview .rp-stage{aspect-ratio:3/5;}
  .hero-visual{height:330px;}
}
@media print{
  .way{height:30mm!important;}
  .step .pad-tile{height:32mm!important;}
  #ways .sec-lead{margin-bottom:1mm!important;}
}

.how-video-btn{display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:0;cursor:pointer;font-family:var(--rp-serif);font-size:16px;letter-spacing:.08em;color:var(--primary);border-bottom:1px solid rgba(26,46,92,.35);padding-bottom:3px;transition:border-color .15s,opacity .15s;}
.how-video-btn:hover{border-color:var(--primary);}
.how-video-btn .hv-ic{width:24px;height:24px;border-radius:50%;border:1px solid currentColor;display:inline-flex;align-items:center;justify-content:center;}
.how-video-btn .hv-ic svg{width:9px;height:9px;fill:currentColor;margin-left:1px;}
.how-video-btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px;}
/* 特長に画面 (2026-10-23 社長「もっと画面のスクショを」): 各項目の上に iPad の画面 */
.feat .pad-tile{aspect-ratio:1/1;margin-bottom:16px;background:var(--tint);}
.feat .pad{--h:90cqh;}
/* お声に画面 */
.voice .v-shot{aspect-ratio:1/1;background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden;container-type:size;margin-bottom:18px;}
.voice .v-shot .phone{--h:88cqh;}
.voice .v-shot .pad{--h:84cqh;}
@media(max-width:820px){ .voice{display:grid;grid-template-columns:120px 1fr;column-gap:16px;padding-top:20px;} .voice .v-shot{grid-row:1 / span 2;margin:0;aspect-ratio:3/4;} }
@media(max-width:640px){ .feat{display:grid;grid-template-columns:120px 1fr;column-gap:16px;} .feat .pad-tile{grid-row:1 / span 2;margin:0;} }
@media print{ .feat .pad-tile,.voice .v-shot{height:28mm!important;aspect-ratio:auto!important;background:#fff!important;} }

/* 画面の四角は文の高さに伸ばさず正方形 (2026-10-23)。 地は節の地と反対の色 (色のある節では白) */
.step .pad-tile,.feat .pad-tile,.voice .v-shot{align-self:start;aspect-ratio:1/1;height:auto;}
#features .pad-tile,#voices .v-shot,#stats .pad-tile{background:#fff;}

/* 画面は App Preview くらい大きく (2026-10-23 社長「スクショのところは全部 preview くらい大きく。 文字よりも画像でアピール」)。
   四角を縦長 (3:4) にして端末を枠いっぱい近くまで。 スマホは画像を横幅いっぱいにして文の上へ */
.feat .pad-tile,.step .pad-tile,.voice .v-shot{aspect-ratio:3/4!important;max-width:none!important;}
.feat .pad,.step .pad,.voice .v-shot .pad{--h:94cqh!important;}
.voice .v-shot .phone{--h:94cqh!important;}
.way{aspect-ratio:3/4!important;}
.way .pad{--h:92cqh!important;} .way .phone{--h:94cqh!important;} .way .card,.way .paper{height:80%!important;}
@media(max-width:720px){
  .feat,.voice,.step{display:block!important;}
  .feat .pad-tile,.step .pad-tile,.voice .v-shot{aspect-ratio:1/1!important;width:100%!important;margin:0 0 16px!important;}
  .feat .pad,.step .pad,.voice .v-shot .pad{--h:92cqh!important;}
  .voice .v-shot .phone{--h:94cqh!important;}
  .ways{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .way:last-child{grid-column:1 / -1!important;aspect-ratio:3/2!important;}
}
@media print{ .feat .pad-tile,.step .pad-tile,.voice .v-shot,.way{aspect-ratio:auto!important;} }
@media(min-width:721px){
  #features .feat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0 48px!important;}
  #features .feat .pad-tile{aspect-ratio:4/3!important;}
  #features .feat .pad{--h:92cqh!important;}
}
@media print{ #features .feat-grid{grid-template-columns:repeat(4,1fr)!important;} }

/* ボタンは角の小さい四角 (2026-10-23 社長「ピルがダサい。 スクエア系で洗練」)。 App Store のバッジ (44px・角 8px) と同じ高さ・角、 幅も揃える */
.btn,.nav .nav-cta,.btn-line,.news-more-btn,.svc .btn{border-radius:6px!important;}
.hero-ctas .btn,.final-ctas .btn,.price-cta .btn{height:44px!important;min-width:172px;padding:0 22px!important;font-size:14px!important;font-weight:500!important;letter-spacing:.1em!important;}
.btn-primary{box-shadow:none;}
.btn-primary:hover{background:var(--primary-deep);}
.nav .nav-cta{height:34px!important;padding:0 16px!important;letter-spacing:.08em!important;}
.news-more-btn{min-width:200px!important;}
.btn-line,.news-more-btn{border-width:1px!important;}
@media(max-width:440px){ .hero-ctas .btn,.final-ctas .btn,.price-cta .btn{min-width:0;width:100%;} .nav .nav-cta{height:30px!important;padding:0 11px!important;} }

/* 画面の四角の地 (2026-10-23 社長「白は工夫がなくて美しくない」): 主色をごく淡くにじませた地。 どの節の上でも同じ */
:root{--tile-a:#F3E9EB;--tile-b:#E7D6DA;}
.pad-tile,.way,.voice .v-shot,#preview .rp-stage,#features .pad-tile,#voices .v-shot,#stats .pad-tile,#ways .way,.shot-tile{background:linear-gradient(160deg,var(--tile-a) 0%,var(--tile-b) 100%)!important;}
#preview .rp-card:nth-child(even) .rp-stage{background:linear-gradient(160deg,var(--tile-b) 0%,var(--tile-a) 100%)!important;}
#features .feat .pad-tile{aspect-ratio:5/4!important;}
#features .feat .phone{--h:94cqh!important;}
@media(max-width:720px){ #features .feat .pad-tile{aspect-ratio:1/1!important;} }
@media print{ .pad-tile,.way,.voice .v-shot,#preview .rp-stage{background:#fff!important;} }
/* スマホで節の見出しを止める (2026-10-23 社長)。 印と地色は sticky-head.js */
@media screen and (max-width:720px){
  .sticky-h{position:-webkit-sticky;position:sticky;top:var(--sticky-top,56px);z-index:20;padding-top:12px;padding-bottom:12px;margin-top:-12px;transition:box-shadow .2s;}
  .sticky-h.stuck{box-shadow:0 1px 0 rgba(0,0,0,.08);}
  .sticky-h::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:calc(var(--prog,0) * 100%);background:#9B1C31;opacity:0;transition:opacity .2s;pointer-events:none;}
  .sticky-h.stuck::after{opacity:.85;}
}

/* 最後の行に1〜2語だけ残さない (2026-10-23 社長「改行念の為確認して」)。 Safari 26・Chrome は対応、 他は無視されるだけ */
h1,h2,h3,p,li,th,td,figcaption,.rp-sub,.rp-title{text-wrap:pretty;}
p,li,figcaption,.rp-sub{hanging-punctuation:allow-end;}
.cmp tbody th,.ft a{text-wrap:balance;}   /* 表の行と足元のリンクは短いので2行の長さをそろえる */
.pk-s{white-space:nowrap;}

/* ---- 2026-10-23 動画 (hero のスマホ・APP PREVIEW の 1 枚目) と特長 5 ---- */
.hero-visual video{position:absolute;width:auto;object-fit:cover;object-position:top;background:#1B1B1F;border:0 solid #1B1B1F;box-shadow:0 18px 40px rgba(64,15,24,.12);animation:hvIn .8s var(--ease) .3s both;cursor:pointer;}
.hero-visual .hv-still,#preview .rp-still{display:none;}
#preview .rp-phone video{width:100%;height:100%;object-fit:cover;object-position:top;display:block;border-radius:calc(var(--h) * .053);background:#1B1B1F;cursor:pointer;}
@media(max-width:640px){ #preview .rp-phone video{border-radius:19px;} }
@media(prefers-reduced-motion:reduce){ .hero-visual video{animation:none;} }
@media print{ .hero-visual video,#preview .rp-phone video{display:none!important;} .hero-visual .hv-still,#preview .rp-still{display:block!important;} }
/* 特長 5 は行いっぱいに、 絵と文を左右に並べる (4 列でも 2 列でも余りを作らない) */
.feat-grid .feat-wide{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:36px;align-items:center;}
.feat-wide .pad-tile{aspect-ratio:16/10!important;margin-bottom:0!important;}
.feat-wide .paper{height:86%;width:auto;box-shadow:0 10px 24px rgba(60,30,15,.14);}
@media(max-width:640px){ .feat-grid .feat-wide{display:grid;grid-template-columns:120px 1fr;column-gap:16px;align-items:start;} .feat-wide .pad-tile{aspect-ratio:1/1!important;} }
@media print{ .feat-grid .feat-wide{display:block;} .feat-wide .pad-tile{height:28mm!important;aspect-ratio:auto!important;} }
#preview .rp-phone.lpv-paused::after{content:"";position:absolute;left:50%;top:50%;width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;background:rgba(255,255,255,.94) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%239B1C31'/%3E%3C/svg%3E") 55% 50%/26px no-repeat;box-shadow:0 6px 18px rgba(0,0,0,.18);pointer-events:none;z-index:2;}
#preview .rp-phone:has(video){cursor:pointer;}
@media print{ #preview .rp-phone.lpv-paused::after{display:none;} }
/* 特長 5 は絵なし・文だけ (社長「画像不要」)、 お声も画面なし (社長「お声と関係ないので」) */
.feat-grid .feat-wide{display:block!important;}
.feat-wide .feat-txt{max-width:46em;}
/* 特長 5 を目立たせる (2026-10-23 社長「ここ、目立たせて」): ボルドーの地に白い字、 見出しを大きく */
.feat-grid .feat-wide{margin-top:28px;padding:40px 44px 42px!important;background:#9B1C31;color:#fff;}
.feat-grid .feat-wide::before{display:none;}
.feat-wide h3{font-size:26px!important;line-height:1.5!important;color:#fff!important;margin-bottom:14px!important;letter-spacing:.08em;}
.feat-wide p{font-size:15.5px!important;line-height:2!important;color:rgba(255,255,255,.9)!important;}
@media(max-width:640px){ .feat-grid .feat-wide{margin-top:20px;padding:28px 22px 30px!important;} .feat-wide h3{font-size:21px!important;} .feat-wide p{font-size:14.5px!important;} }
@media print{ .feat-grid .feat-wide{background:#fff!important;color:#000!important;border:1px solid #9B1C31;padding:4mm 5mm!important;} .feat-wide h3,.feat-wide p{color:#000!important;} }

/* 2026-10-24 LP ネイティブチェック: スマホ幅 (360・390px) で横スクロールが出ていた所。 日本語の見た目は変えない。
   - 欧州語・インドネシア語: 料金の行の名前・期間が長く、 1 列の grid が中身の幅に押し広げられていた
     (1fr の最小幅 = 中身の最小幅)。 列を minmax(0,1fr) にして、 行の中で折り返せるようにする。
   - 中国語: 「創業者」の節の見出しが word-break:keep-all で 1 語扱いになり、 列ごと押し広げていた。 */
@media(max-width:820px){
  html:not([lang="ja"]) .plans{grid-template-columns:minmax(0,1fr);}
  html:not([lang="ja"]) .tiers .pk{flex-wrap:wrap;row-gap:2px;}
  html:not([lang="ja"]) .tiers .pk-q{white-space:normal;min-width:0;}
  html:not([lang="ja"]) .tiers .pk-p{margin-left:auto;}
  html:not([lang="ja"]) :is(.pc-name,.pc-sub,.pc-desc,.pk-q,.pk-s){overflow-wrap:anywhere;}
}
html[lang^="zh"] .founder-title{word-break:normal;}
/*   - fr: 料金の節の下の「お問い合わせ」ボタンの文言が長く、 1 行のままだと枠を越えていた。 */
@media(max-width:720px){
  html:not([lang="ja"]) .svc .btn{white-space:normal;height:auto;min-height:44px;padding:10px 22px;text-align:center;max-width:100%;box-sizing:border-box;}
}
/*   - fr・de: 見出しの帯の「無料で始める」 が長く、 畳んだ後 (.tight2) もハンバーガーが画面の右へ押し出されていた。
       畳んでも入らない時だけ、 ボタンの字を小さくして 2 行まで折り返す (日本語は畳まれないので変わらない)。 */
html:not([lang="ja"]) .lp-header.tight2 .nav .nav-cta{white-space:normal;height:auto!important;min-height:30px;max-width:124px;padding:4px 10px!important;line-height:1.2;text-align:center;letter-spacing:.01em!important;font-size:11px;}