/* Special Seminar 2609 参加特典サイト 共通スタイル
   世界観: 明るいオフホワイト × 白パネル × すりガラスの縦カード（コラボ用に新規設計 2026-09-15）
   ロゴ・現在地アクセント = まとアイコンのピンク系グラデーション
   2026-09-19: 7本→20本・4カテゴリに改修。カードは写真サムネ＋ガラス質感オーバーレイに変更。
   guide/*/index.html（新作13本の詳細ページ）もこの共通CSSを読み込む。 */

/* ---- フォント: セザンヌ（FontWorks・ローカルにある環境だけ適用）→ 無ければ Zen Kaku Gothic New ---- */
@font-face{font-family:"CezanneLocal";font-weight:400;font-display:swap;
  src:local("FOT-Cezanne ProN M"),local("CezanneProN-M"),local("FOT-Cezanne Pro M"),local("CezannePro-M")}
@font-face{font-family:"CezanneLocal";font-weight:700;font-display:swap;
  src:local("FOT-Cezanne ProN B"),local("CezanneProN-B"),local("FOT-Cezanne Pro B"),local("CezannePro-B")}

:root{
  --bg:#F3F3F1;
  --panel:#FFFFFF;
  --ink:#2D2D2D;
  --ink-soft:#6E6E73;
  --hairline:rgba(0,0,0,.07);
  --surface:rgba(255,255,255,.72);
  --brand-grad:linear-gradient(135deg,#FFB35C 0%,#FF7A9E 100%);
  --brand-pink:#FF7A9E;
  --brand-orange:#FFB35C;
  --btn:#1E1E1E;
  --shadow-soft:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.08);
  --shadow-lift:0 2px 4px rgba(0,0,0,.05),0 22px 44px rgba(0,0,0,.14);
  --radius-card:22px;
  --font:"Lato","CezanneLocal","Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;
  /* カテゴリ4色（2026-09-19確定） */
  --cat-design:linear-gradient(135deg,#22c1dc 0%,#8b5cf6 100%);
  --cat-jitan:linear-gradient(135deg,#ff8a1f 0%,#ff5fa2 100%);
  --cat-shikumi:linear-gradient(135deg,#10b981 0%,#3b82f6 100%);
  --cat-teiban:linear-gradient(135deg,#ec4899 0%,#6d6bff 100%);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font);
  color:var(--ink);
  background:var(--bg);
  background-image:
    radial-gradient(900px 600px at 12% -10%,rgba(255,179,92,.10),transparent 60%),
    radial-gradient(900px 600px at 92% 10%,rgba(255,122,158,.10),transparent 60%);
  line-height:1.7;
  min-height:100vh;
  padding-inline:16px;
  padding-block:0 48px;
  overflow-x:hidden;
}
a{color:inherit}
img{max-width:100%;display:block}
::selection{background:rgba(255,122,158,.25)}
:focus-visible{outline:2px solid var(--brand-pink);outline-offset:3px;border-radius:6px}

/* ---- ヘッダー（sticky・ガラス） ---- */
.header{
  position:sticky;top:0;z-index:50;
  margin:12px auto 0;
  max-width:1280px;
  background:var(--surface);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),var(--shadow-soft);
  border-radius:20px;
  padding:12px 20px;
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap}
.brand .mark{width:34px;height:34px;flex:0 0 auto}
.brand .word{font-weight:400;font-size:17px;letter-spacing:.01em}
.brand .word small{display:block;font-size:10.5px;letter-spacing:.14em;color:var(--ink-soft);line-height:1.2;margin-top:1px;text-transform:uppercase}
.nav{
  margin-left:auto;
  display:flex;gap:4px;
  overflow-x:auto;scrollbar-width:none;
  max-width:100%;
}
.nav::-webkit-scrollbar{display:none}
.nav a{
  text-decoration:none;font-size:13px;font-weight:400;
  padding:7px 12px;border-radius:9999px;white-space:nowrap;
  color:var(--ink);position:relative;
}
.nav a::after{
  content:"";position:absolute;left:12px;right:12px;bottom:3px;height:2px;border-radius:2px;
  background:var(--brand-grad);opacity:0;transform:scaleX(.4);transition:opacity .25s,transform .25s;
}
.nav a:hover{background:rgba(0,0,0,.04)}
.nav a.on{color:var(--ink)}
.nav a.on::after{opacity:1;transform:scaleX(1)}

/* ---- ヒーロー ---- */
.hero{
  position:relative;
  max-width:1280px;margin:16px auto 0;
  background:var(--panel);
  border-radius:32px;
  box-shadow:var(--shadow-soft);
  padding:56px 32px 44px;
  text-align:center;
  overflow:hidden;
}
.hero .kicker{
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);font-weight:400;
}
.hero .title{
  font-family:"Lato",sans-serif;
  font-weight:300;
  font-size:clamp(52px,9vw,136px);
  line-height:.95;
  letter-spacing:-.02em;
  margin-top:12px;
  margin-bottom:.22em;   /* 本棚パネルとは重ねない */
  color:var(--ink);
  user-select:none;
}
.hero .lead{max-width:640px;margin:20px auto 0;color:var(--ink-soft);font-size:14.5px}

/* ---- 本棚（カテゴリごとに1段。表紙を棚板に立てて並べる） ---- */
.shelves{
  position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 40px;
  max-width:1180px;margin:0 auto;
  padding:30px 36px 40px;
  border-radius:28px;
  background:linear-gradient(180deg,#f8f5f0 0%,#f3eee7 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),inset 0 10px 28px rgba(120,96,64,.07);
  text-align:left;
}
.shelf{min-width:0}
.shelf-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 6px}
.shelf-head h2{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:500;letter-spacing:.04em;color:var(--ink)}
.shelf-head .dot{width:9px;height:9px;border-radius:50%;background:var(--cat,var(--brand-grad));flex:0 0 auto}
.shelf-head a{
  display:inline-flex;align-items:center;gap:5px;
  font-size:12.5px;color:var(--ink-soft);text-decoration:none;white-space:nowrap;
  padding:6px 4px;
}
.shelf-head a:hover{color:var(--ink)}
.shelf-head a svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.shelf-head a:hover svg{transform:translateX(3px)}
.books{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,2vw,22px);
  align-items:end;
  margin-top:16px;padding:0 20px;
}
.book{
  position:relative;display:block;
  aspect-ratio:4/5;
  border-radius:3px;
  overflow:hidden;
  background:#fff;
  transform-origin:50% 100%;
  box-shadow:0 1px 0 rgba(60,40,20,.28),5px -3px 14px rgba(70,50,25,.16),1px 0 0 rgba(0,0,0,.05);
  transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s;
}
.book:hover,.book:focus-visible{transform:translateY(-10px);box-shadow:0 1px 0 rgba(60,40,20,.2),8px 8px 22px rgba(70,50,25,.22)}
.book img{width:100%;height:100%;object-fit:cover;display:block}
.book::before{ /* 表紙のガラス光沢 */
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(125deg,rgba(255,255,255,.42) 0%,rgba(255,255,255,.12) 22%,rgba(255,255,255,0) 44%);
  mix-blend-mode:screen;
}
.book::after{ /* 背表紙側の影と縁 */
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(90deg,rgba(0,0,0,.16) 0%,rgba(255,255,255,.28) 2.5%,rgba(255,255,255,0) 7%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);
}
.plank{
  height:16px;border-radius:7px;
  background:linear-gradient(180deg,#fffdf9 0%,#f1eadf 55%,#e3d9ca 100%);
  box-shadow:0 12px 18px -9px rgba(90,68,36,.4),inset 0 1px 0 #fff;
}

.hero .cta{margin-top:36px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:0 30px;border-radius:9999px;
  background:var(--btn);color:#fff;text-decoration:none;
  font-size:14.5px;font-weight:400;letter-spacing:.04em;border:0;cursor:pointer;
  font-family:var(--font);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.18),0 8px 20px rgba(0,0,0,.16);
  transition:transform .2s,box-shadow .2s;
}
.btn:hover{transform:translateY(-1px);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.18),0 12px 26px rgba(0,0,0,.2)}
.btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn.line{background:#06C755}

/* ---- セクション共通 ---- */
.section{max-width:1280px;margin:0 auto;padding:96px 16px 0;text-align:center}
.section > .kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}
.section > h2{font-size:clamp(24px,3.2vw,34px);font-weight:700;line-height:1.35;margin-top:10px}
.section > .lead{max-width:600px;margin:16px auto 0;color:var(--ink-soft);font-size:14.5px}
.section .note{font-size:12px;color:var(--ink-soft);margin-top:12px}

/* 特典の詳細（縦積み・カテゴリ見出し4つ） */
.list{max-width:760px;margin:0 auto;display:grid;gap:28px}

.cat-heading{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  scroll-margin-top:132px;
  margin:0 0 4px;
  padding-top:4px;
}
.cat-heading:not(:first-of-type){margin-top:40px}
.cat-heading .bar{width:44px;height:4px;border-radius:2px;background:var(--cat,var(--brand-grad))}
.cat-heading h2{font-size:19px;font-weight:700;color:var(--ink);letter-spacing:.02em}

.benefit{
  scroll-margin-top:132px;
  background:var(--panel);border-radius:28px;box-shadow:var(--shadow-soft);
  padding:36px 32px 36px;text-align:center;
  display:flex;flex-direction:column;align-items:center;
}
.benefit .thumb{
  display:block;width:112px;height:auto;aspect-ratio:4/5;object-fit:cover;margin:0 auto;
  border-radius:16px;box-shadow:var(--shadow-soft);
  border:1px solid rgba(255,255,255,.6);
}
.benefit h2{font-size:21px;font-weight:700;margin-top:18px;line-height:1.4;display:flex;align-items:center;gap:9px}
.benefit h2::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--c,var(--brand-grad));flex:0 0 auto}
.benefit p{color:var(--ink-soft);font-size:14.5px;margin-top:12px;max-width:560px}
.benefit .tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px}
.benefit .tags span{font-size:12px;padding:5px 12px;border-radius:9999px;background:rgba(0,0,0,.045);color:var(--ink)}
.benefit .btn{margin-top:26px;background:var(--c,var(--btn))}
.benefit .caution{font-size:12px;color:var(--ink-soft);margin-top:14px;max-width:560px}

/* メルマガ（独立セクション・インライン登録フォーム） */
.mailmag{max-width:1280px;margin:120px auto 0;padding:0 16px}
.mailmag .box{
  background:var(--panel);border-radius:32px;box-shadow:var(--shadow-soft);
  padding:64px 32px;text-align:center;position:relative;overflow:hidden;
}
.mailmag .box::before{content:"";position:absolute;inset:auto -20% -60% -20%;height:70%;background:radial-gradient(50% 60% at 50% 100%,rgba(255,122,158,.16),transparent 70%);pointer-events:none}
.mailmag .kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}
.mailmag h2{font-size:clamp(26px,3.6vw,38px);font-weight:700;line-height:1.35;margin-top:12px}
.mailmag .sub{color:var(--ink-soft);font-size:14.5px;margin-top:14px}
.mailmag form{
  position:relative;
  display:flex;gap:10px;max-width:520px;margin:32px auto 0;
  background:#fff;border:1px solid var(--hairline);border-radius:9999px;padding:6px 6px 6px 20px;
  box-shadow:var(--shadow-soft);
}
.mailmag input[type=email]{
  flex:1 1 auto;min-width:0;border:0;outline:0;background:transparent;
  font-family:var(--font);font-size:15px;color:var(--ink);
}
.mailmag input[type=email]::placeholder{color:#9a9aa0}
.mailmag button{flex:0 0 auto;min-height:44px;padding:0 24px}
.mailmag .fine{font-size:12px;color:var(--ink-soft);margin-top:14px}

/* LINE（メルマガとは離した別セクション） */
.linebox{max-width:1280px;margin:64px auto 0;padding:0 16px;text-align:center}
.linebox .inner{background:var(--panel);border-radius:28px;box-shadow:var(--shadow-soft);padding:44px 32px}
.linebox h2{font-size:22px;font-weight:700;line-height:1.4}
.linebox p{color:var(--ink-soft);font-size:14.5px;margin-top:10px}
.linebox .btn{margin-top:22px}

/* フッター */
.footer{max-width:1280px;margin:72px auto 0;padding:0 24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ink-soft)}
.footer a{text-decoration:none}

/* ---- レスポンシブ（カード: 5列→4列→3列→2列。横スクロールなし） ---- */
@media (max-width:1100px){
  .shelves{gap:30px 28px;padding:26px 24px 34px}
  .books{padding:0 12px}
}
@media (max-width:860px){
  .shelves{grid-template-columns:1fr;max-width:620px}
}
@media (max-width:480px){
  .shelves{padding:22px 14px 28px;border-radius:22px}
  .books{gap:8px;padding:0 8px}
  .plank{height:13px}
}
@media (max-width:760px){
  body{padding-inline:12px}
  .header{padding:10px 14px;gap:8px;border-radius:18px}
  .brand .word{font-size:15px}
  .nav{margin-left:0;flex-basis:100%}
  .hero{padding:40px 20px 36px;border-radius:26px;margin-top:12px}
  .hero .title{font-size:clamp(52px,17vw,110px)}
  .section{padding-top:72px}
  .benefit{padding:32px 20px 28px;border-radius:22px;scroll-margin-top:154px}
  .cat-heading{scroll-margin-top:154px}
  .mailmag{margin-top:88px}
  .mailmag .box{padding:48px 20px}
  .mailmag h2{font-size:24px}
  .mailmag h2 br{display:none}
  .mailmag form{flex-direction:column;border-radius:22px;padding:10px}
  .mailmag input[type=email]{min-height:44px;padding:0 10px}
  .footer{justify-content:center;text-align:center}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .book{transition:none}
  .btn{transition:none}
}

/* =========================================================
   guide/*/index.html（新作13本の詳細ページ）共通スタイル
   2026-09-19 新規追加
   ========================================================= */

.guide-header{margin-bottom:0}

.guide-main{max-width:760px;margin:0 auto;padding-top:24px}

.guide-titlebar{
  position:sticky;top:74px;z-index:40;
  background:var(--surface);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),var(--shadow-soft);
  border-radius:20px;
  padding:16px 24px;
  margin:16px auto 0;
  text-align:center;
}
.guide-titlebar .kicker{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);
}
.guide-titlebar .kicker .dot{width:8px;height:8px;border-radius:50%;background:var(--cat,var(--brand-grad))}
.guide-titlebar h1{font-size:clamp(19px,2.6vw,24px);font-weight:700;margin-top:6px;line-height:1.4}

.guide-body-inner{margin-top:32px;text-align:center}

.guide-thumb{
  display:block;width:180px;height:auto;aspect-ratio:4/5;object-fit:cover;margin:0 auto 8px;
  border-radius:20px;box-shadow:var(--shadow-lift);border:1px solid rgba(255,255,255,.6);
}

.guide-meta{
  display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
  margin:20px 0 4px;
}
.guide-meta span{font-size:12px;padding:5px 12px;border-radius:9999px;background:rgba(0,0,0,.045);color:var(--ink)}

.g-block{
  background:var(--panel);border-radius:24px;box-shadow:var(--shadow-soft);
  padding:28px 28px 30px;margin-top:20px;
  text-align:left;
}
.g-block h2{font-size:18px;font-weight:700;text-align:center;margin-bottom:14px}
.g-block h3{font-size:15px;font-weight:700;margin:22px 0 10px;color:var(--ink)}
.g-block h3:first-of-type{margin-top:4px}
.g-block p{color:var(--ink);font-size:14.5px;margin-top:10px;line-height:1.85}
.g-block p:first-child{margin-top:0}
.g-block ul,.g-block ol{margin-top:10px;padding-left:1.35em}
.g-block li{color:var(--ink);font-size:14.5px;line-height:1.85;margin-top:4px}
.g-block strong{font-weight:700}
.g-block code:not(pre code){
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  background:rgba(0,0,0,.05);padding:.1em .4em;border-radius:6px;font-size:.92em;
}

mark.todo{
  background:transparent;color:inherit;
  text-decoration:underline;text-decoration-color:#F5C518;text-decoration-thickness:2px;
  text-underline-offset:3px;
  padding:0 .1em;
}

/* コードブロック（プロンプト）＋コピーボタン */
.codeblock{position:relative;margin-top:14px;border-radius:16px;overflow:hidden}
.codeblock pre{
  background:#1E1E1E;color:#F2F2F0;
  padding:20px 18px 18px;
  overflow-x:auto;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12.5px;line-height:1.75;
  white-space:pre-wrap;word-break:break-word;
  text-align:left;
}
.copy-btn{
  position:absolute;top:10px;right:10px;z-index:2;
  display:inline-flex;align-items:center;gap:6px;
  min-height:32px;padding:0 14px;border-radius:9999px;border:0;cursor:pointer;
  background:rgba(255,255,255,.14);color:#fff;
  font-family:var(--font);font-size:12px;letter-spacing:.02em;
  backdrop-filter:blur(6px);
  transition:background .2s,transform .2s;
}
.copy-btn:hover{background:rgba(255,255,255,.24)}
.copy-btn svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.copy-btn.copied{background:var(--brand-grad);color:#fff}

/* 表（横スクロール禁止・折り返し） */
.g-table-wrap{margin-top:14px;width:100%}
.g-block table{
  width:100%;border-collapse:collapse;table-layout:fixed;
  font-size:12.5px;
}
.g-block th,.g-block td{
  border:1px solid var(--hairline);
  padding:9px 10px;
  text-align:left;vertical-align:top;
  word-break:break-word;overflow-wrap:anywhere;
  color:var(--ink);
}
.g-block th{background:rgba(0,0,0,.035);font-weight:700}

/* ---- 1行ずつコピーできる文例リスト ---- */
.g-block ul.copylines{list-style:none;margin:18px 0 0;padding:0;text-align:left;display:grid;gap:10px}
.copylines li{
  display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"want btn" "text btn";
  column-gap:14px;row-gap:2px;align-items:center;
  padding:12px 14px 12px 16px;border-radius:14px;background:#fff;border:1px solid var(--hairline);
}
.copylines-want{grid-area:want;font-size:12px;color:var(--ink-soft)}
.copylines-text{grid-area:text;font-size:14.5px;line-height:1.7}
.copy-btn.inline{
  grid-area:btn;position:static;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-width:118px;min-height:36px;padding:0 14px;
  background:var(--btn);color:#fff;
}
.copy-btn.inline:hover{background:#000}
.copy-btn.inline.copied{background:var(--brand-grad)}
@media (max-width:520px){
  .copylines li{grid-template-columns:minmax(0,1fr);grid-template-areas:"want" "text" "btn";row-gap:6px}
  .copy-btn.inline{justify-self:start}
}

/* ---- ガイド内のツール紹介カード（```html-raw で下書きから出力） ---- */
.toolgroup{margin-top:28px;text-align:center}
.toolgroup-title{font-size:16px;font-weight:700;letter-spacing:.04em}
.toolcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:16px;align-items:stretch}
.toolcards.single{grid-template-columns:minmax(0,1fr);max-width:420px;margin-left:auto;margin-right:auto}
.toolcard{
  display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--hairline);border-radius:20px;
  padding:16px 18px 20px;text-align:left;
  box-shadow:var(--shadow-soft);
}
.toolcard-img{aspect-ratio:1200/628;border-radius:12px;overflow:hidden;background:#fff;border:1px solid var(--hairline)}
.toolcard-img img{width:100%;height:100%;object-fit:cover;display:block}
.toolcard-img.contain img{object-fit:contain}
.toolcard h4{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:700;margin-top:14px}
.toolcard-reco{font-size:11px;font-weight:700;color:#fff;background:var(--brand-grad);padding:3px 10px;border-radius:9999px;letter-spacing:.06em}
.toolcard-badge{display:inline-block;align-self:flex-start;margin-top:8px;font-size:12px;padding:4px 11px;border-radius:9999px;background:rgba(0,0,0,.045)}
.toolcard p{font-size:14px;line-height:1.85;margin-top:10px}
.toolcard-list{margin:10px 0 0;padding-left:1.2em;font-size:13.5px;line-height:1.8}
.toolcard-note{margin-top:14px;padding:12px 14px;border-radius:12px;background:rgba(0,0,0,.035);font-size:12px;line-height:1.8;color:var(--ink-soft)}
.toolcard-note b{display:block;font-size:12.5px;color:var(--ink);margin-bottom:4px}
.toolcard-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:16px}
.toolcard-btns .btn{min-height:42px;padding:0 20px;font-size:13.5px;flex:1 1 auto}
.btn.ghost{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--hairline)}
.btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--ink-soft)}
.toolnote{margin-top:16px;font-size:12px;color:var(--ink-soft);text-align:center}
@media (max-width:640px){
  .toolcards{grid-template-columns:minmax(0,1fr)}
}

.guide-back{max-width:760px;margin:36px auto 0;padding:0 8px;text-align:center}
.guide-back a{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13.5px;color:var(--ink-soft);text-decoration:none;
}
.guide-back a:hover{color:var(--ink)}
.guide-back svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

@media (max-width:760px){
  .guide-titlebar{top:66px;padding:13px 18px;border-radius:16px}
  .g-block{padding:22px 18px 24px;border-radius:18px}
  .guide-back{margin-top:28px}
}