/* tora-anana.com — 道場・硬派2カラム（左本文／右師範カード）
   フォントペア#1: Zen Kaku Gothic New(本文) / Shippori Mincho 700(見出し)
   配色: FX #2 (D228)  bg #FBFEFF / surface #EFF7FB / text #1C282E / muted #69787F
         border #7C929D / accent #004F69 / link #007FA6 / visited #035B44
   content max-width 1120px。影ゼロ・角丸ゼロ・罫線主体。 */
:root{
  --bg:#FBFEFF;--surface:#EFF7FB;--text:#1C282E;--muted:#69787F;--border:#7C929D;
  --accent:#004F69;--link:#007FA6;--visited:#035B44;--rule:#D3DFE5;--warn:#8A3B12;
  --sans:"Zen Kaku Gothic New",sans-serif;--serif:"Shippori Mincho",serif;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#090F12;--surface:#121B1F;--text:#E0EAEE;--muted:#9AABB2;--border:#566870;--accent:#2384A7;--link:#5FB3D1;--visited:#7FC9AE;--rule:#26343A;--warn:#E0A27E}
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);font-size:17px;line-height:1.9;color:var(--text);background:var(--bg);font-feature-settings:"palt"}
a{color:var(--link);text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:1px}
a:visited{color:var(--visited)}
a:hover{color:var(--accent)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:700;letter-spacing:.01em}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}

/* ---- masthead：題字＋横ナビ。上に太い1本、下に細い1本の罫線 ---- */
.mast{border-top:6px solid var(--accent);border-bottom:1px solid var(--border);background:var(--bg)}
.mast__in{max-width:1120px;margin:0 auto;padding:18px 24px 14px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.brand{display:block;text-decoration:none;color:var(--text)}
.brand__t{font-family:var(--serif);font-size:30px;line-height:1.1;letter-spacing:.06em}
.brand__t b{color:var(--accent);font-weight:700}
.brand__s{display:block;font-size:12px;color:var(--muted);letter-spacing:.18em;margin-top:6px}
.gnav{display:flex;gap:0;font-size:14px}
.gnav a{text-decoration:none;color:var(--text);padding:8px 14px;border-left:1px solid var(--rule)}
.gnav a:first-child{border-left:0}
.gnav a[aria-current]{color:var(--accent);font-weight:700}
.notice{max-width:1120px;margin:0 auto;padding:6px 24px;font-size:12.5px;color:var(--muted);border-bottom:1px solid var(--rule)}

/* ---- hero：トップだけ。画像＋帯。記事は画像を本文幅で置く ---- */
.hero{position:relative;max-width:1120px;margin:22px auto 0;padding:0 24px}
.hero__img{aspect-ratio:16/9;width:100%;object-fit:cover;border:1px solid var(--border)}
.hero__band{background:var(--accent);color:#fff;padding:22px 28px;border:1px solid var(--accent)}
.hero__k{font-size:12px;letter-spacing:.2em;opacity:.85}
.hero__h1{font-size:34px;line-height:1.35;margin:8px 0 10px;color:#fff}
.hero__lead{font-size:15.5px;line-height:1.8;opacity:.95;max-width:56em}
@media (max-width:780px){.hero__h1{font-size:24px}.hero__band{padding:16px 18px}}

/* ---- 2カラム：左本文 / 右師範カード ---- */
.cols{max-width:1120px;margin:0 auto;padding:28px 24px 48px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:44px;align-items:start}
@media (max-width:900px){.cols{grid-template-columns:minmax(0,1fr);gap:32px}}
.side{position:sticky;top:16px}
@media (max-width:900px){.side{position:static}}

/* ---- セクション見出し：小ラベル＋見出し（上罫線） ---- */
.sec{border-top:2px solid var(--text);padding-top:10px;margin:36px 0 14px}
.sec:first-child{margin-top:0}
.sec__k{font-size:12px;letter-spacing:.2em;color:var(--accent);display:block}
.sec__h{font-size:22px;line-height:1.4;margin-top:2px}

/* ---- カテゴリ導線 ---- */
.catfilter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.catfilter button{font:inherit;font-size:13.5px;padding:6px 12px;border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;min-height:36px}
.catfilter button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.catfilter .n{font-size:11.5px;margin-left:4px;opacity:.8}

/* ---- 記事カード：画像上・縦積み・罫線のみ ---- */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 24px}
@media (max-width:640px){.grid{grid-template-columns:minmax(0,1fr)}}
.card{border:1px solid var(--border);background:var(--bg)}
.card[hidden]{display:none}
.card img{aspect-ratio:16/9;width:100%;object-fit:cover;border-bottom:1px solid var(--border)}
.card__b{padding:12px 14px 14px}
.card__c{font-size:12px;letter-spacing:.12em;color:var(--accent)}
.card__t{font-size:17px;line-height:1.5;margin:4px 0 6px}
.card__t a{color:var(--text);text-decoration:none}
.card__t a:hover{color:var(--accent);text-decoration:underline}
.card__d{font-size:12.5px;color:var(--muted)}
.card__x{font-size:14px;line-height:1.7;margin-top:6px;color:var(--text)}
.empty{padding:20px;border:1px dashed var(--border);color:var(--muted);font-size:14px}

/* ---- 師範カード（右） ---- */
.shihan{border:1px solid var(--border);background:var(--surface);padding:18px 18px 16px}
.shihan__k{font-size:11.5px;letter-spacing:.2em;color:var(--accent)}
.shihan__n{font-family:var(--serif);font-size:26px;line-height:1.2;margin:4px 0 2px}
.shihan__r{font-size:13px;color:var(--muted)}
.shihan__p{font-size:14px;line-height:1.8;margin-top:10px}
.shihan__p a{color:var(--link)}
.sidebox{border-top:2px solid var(--text);margin-top:26px;padding-top:10px}
.sidebox__h{font-size:12px;letter-spacing:.2em;color:var(--accent);margin-bottom:8px}
.okite{list-style:none;counter-reset:o}
.okite li{counter-increment:o;font-size:14px;line-height:1.7;padding:8px 0 8px 2.2em;position:relative;border-bottom:1px solid var(--rule)}
.okite li::before{content:counter(o,decimal-leading-zero);position:absolute;left:0;top:9px;font-family:var(--serif);font-size:15px;color:var(--accent)}
.sidelist{list-style:none}
.sidelist li{font-size:14px;line-height:1.6;padding:7px 0;border-bottom:1px solid var(--rule)}
.sidelist a{color:var(--text);text-decoration:none}
.sidelist a:hover{color:var(--accent);text-decoration:underline}
.sidelist .n{color:var(--muted);font-size:12.5px;margin-left:6px}

/* ---- 記事本文 ---- */
.bc{font-size:13px;color:var(--muted);margin-bottom:10px}
.bc a{color:var(--muted)}
.kicker{font-size:12px;letter-spacing:.2em;color:var(--accent)}
.ttl{font-size:30px;line-height:1.45;margin:6px 0 12px}
@media (max-width:780px){.ttl{font-size:23px}}
.lead{font-size:16.5px;line-height:1.85;color:var(--text);border-left:3px solid var(--accent);padding-left:14px;margin:0 0 14px}
.meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--muted);margin-bottom:16px}
.eyecatch{border:1px solid var(--border);margin:0 0 22px}
.eyecatch img{aspect-ratio:16/9;width:100%;object-fit:cover}
.pr-note{font-size:15px;color:var(--text);background:var(--surface);border:1px solid var(--rule);padding:8px 12px;margin:0 0 22px}
.body>p{margin:0 0 1.2em}
.body h2{font-size:23px;line-height:1.45;margin:2.2em 0 .8em;padding-bottom:.35em;border-bottom:2px solid var(--accent)}
.body h3{font-size:18.5px;line-height:1.5;margin:1.8em 0 .6em;padding-left:.6em;border-left:4px solid var(--accent)}
.body ul,.body ol{margin:0 0 1.3em 1.6em}
.body li{margin:.35em 0}
.body strong{color:var(--accent)}
.body table{width:100%;border-collapse:collapse;font-size:15px;margin:0 0 1.4em;display:block;overflow-x:auto}
.body th,.body td{border:1px solid var(--border);padding:8px 10px;text-align:left;vertical-align:top}
.body th{background:var(--surface);font-weight:700}
.box{border:1px solid var(--border);background:var(--surface);padding:14px 16px;margin:0 0 1.4em;font-size:15.5px;line-height:1.8}
.box--warn{border-color:var(--warn);color:var(--text)}
.box--warn b{color:var(--warn)}
.calc{font-family:var(--sans);border:1px solid var(--border);border-left:5px solid var(--accent);padding:12px 16px;margin:0 0 1.4em;font-size:15.5px;line-height:1.9;background:var(--bg)}
.hl{color:var(--accent);font-weight:700}
.faq{border-top:1px solid var(--rule);padding-top:8px;margin:0 0 1.4em}
.faq dt{font-weight:700;margin-top:.8em}
.faq dd{margin:.3em 0 .6em 1em}
.rel{border:1px solid var(--border);padding:12px 16px;margin:1.6em 0;background:var(--surface)}
.rel a{color:var(--link)}
.src{font-size:14px;color:var(--text);border-top:1px solid var(--rule);padding-top:10px;margin-top:2em}
.src ul{margin-left:1.4em}
.src li{margin:.3em 0;word-break:break-all}
.sign{display:flex;gap:16px;align-items:flex-start;border:1px solid var(--border);padding:16px 18px;margin:2.2em 0 0;background:var(--surface)}
.sign__n{font-family:var(--serif);font-size:20px}
.sign__s{font-size:13px;color:var(--muted)}
.sign__p{font-size:14px;line-height:1.75;margin-top:6px}
.risk{font-size:13.5px;line-height:1.75;color:var(--text);border-top:1px solid var(--rule);padding-top:12px;margin-top:28px}
.disc{font-size:13.5px;line-height:1.75;color:var(--muted);margin-top:10px}

/* ---- ロット計算機（純JS・目安） ---- */
.tc{border:1px solid var(--border);background:var(--surface);padding:18px 20px 16px;margin-top:6px}
.tc__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px}
@media (max-width:560px){.tc__g{grid-template-columns:minmax(0,1fr)}}
.tc label{display:block;font-size:13px;color:var(--muted)}
.tc input,.tc select{font:inherit;font-size:16px;width:100%;padding:7px 10px;border:1px solid var(--border);background:var(--bg);color:var(--text);min-height:40px}
.tc__btn{margin-top:14px;font:inherit;font-size:15px;font-weight:700;padding:10px 22px;background:var(--accent);color:#fff;border:1px solid var(--accent);cursor:pointer;min-height:44px}
.tc__btn:hover{background:var(--text);border-color:var(--text)}
.tc__err{color:var(--warn);font-size:14px;margin-top:10px}
.tc__out{margin-top:16px;border-top:1px solid var(--border);padding-top:10px}
.tc__r{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--rule);font-size:15px}
.tc__r dd{font-family:var(--serif);font-size:18px;color:var(--accent);text-align:right}
.tc__note{font-size:13px;color:var(--muted);line-height:1.7;margin-top:12px}
.tc__eq{font-size:13.5px;color:var(--text);line-height:1.8}
details.tc__how{margin-top:10px;font-size:14px}
details.tc__how summary{cursor:pointer;color:var(--link)}

/* ---- 固定ページ（about/privacy/contact） ---- */
.page h1{font-size:28px;line-height:1.4;margin:0 0 12px}
.page h2{font-size:20px;margin:2em 0 .7em;padding-bottom:.3em;border-bottom:2px solid var(--accent)}
.page p{margin:0 0 1.1em}
.page ul,.page ol{margin:0 0 1.2em 1.6em}
.page table{width:100%;border-collapse:collapse;margin:0 0 1.4em;font-size:15.5px}
.page th,.page td{border:1px solid var(--border);padding:9px 12px;text-align:left;vertical-align:top}
.page th{background:var(--surface);width:9em;white-space:nowrap}
.page .date{font-size:13.5px;color:var(--muted)}
.cform label{display:block;font-weight:700;margin:18px 0 6px}
.cform .req{font-size:12px;color:#fff;background:var(--warn);padding:1px 6px;margin-left:6px;font-weight:400}
.cform input[type=text],.cform input[type=email],.cform textarea{font:inherit;width:100%;padding:9px 11px;border:1px solid var(--border);background:var(--bg);color:var(--text)}
.cform textarea{min-height:200px}
.cform .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cform .agree-line{margin:18px 0 10px}
.cform button{font:inherit;font-size:16px;font-weight:700;padding:12px 28px;background:var(--accent);color:#fff;border:1px solid var(--accent);cursor:pointer;min-height:48px}
.cform button:hover{background:var(--text);border-color:var(--text)}
.done{border:1px solid var(--border);background:var(--surface);padding:18px}

/* ---- フッター ---- */
.foot{border-top:3px solid var(--text);margin-top:20px}
.foot__in{max-width:1120px;margin:0 auto;padding:22px 24px 34px;font-size:13.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}
.foot a{color:var(--text)}
