/*
Theme Name: Nao Cyber Tech
Theme URI: https://www.naocybertech.co.jp/
Author: ナオサイバーテック株式会社
Description: 重要インフラのサイバーセキュリティに取り組むナオサイバーテック株式会社のコーポレートテーマ。ロゴ緑 #3B7D23 を基準にした明るい配色と、単線結線図をモチーフにした構造で構成しています。
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: naocybertech
*/

/* ============================================================
   ナオサイバーテック株式会社 — 共通スタイル
   Design tokens: ロゴ緑 #3B7D23 を基準にした明るい配色
   ============================================================ */
:root{
  --brand:      #3B7D23;   /* ロゴ緑 */
  --brand-dk:   #2C6119;   /* 明るい地の上に置く文字用 */
  --brand-pale: #EEF4E9;   /* 帯に使う淡い緑 */
  --brand-edge: #D3E3C6;   /* 淡い緑の罫 */

  --bg:         #FCFDFB;
  --white:      #FFFFFF;
  --ink:        #1F2A22;
  --ink-60:     #63705E;
  --line:       #DDE4D6;

  --f-disp: "BIZ UDPMincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --f-body: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, monospace;

  --wrap: 1160px;
  --gutter: 24px;
  --rail: 72px;
  --sec-pad: clamp(68px,8.5vw,110px);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--f-body); font-size:16px; line-height:1.9;
  -webkit-font-smoothing:antialiased; letter-spacing:.02em;
}
img{max-width:100%; display:block}
a{color:inherit}

.wrap{max-width:var(--wrap); margin:0 auto; padding:0 var(--gutter)}
/* 本文カラムは、左に幹線ぶんの余白を確保した1カラム。
   ブロックエディタで組めるよう、グリッドの入れ子は使いません。 */
main .wrap{padding-left:calc(var(--gutter) + var(--rail))}
.skip{position:absolute; left:-9999px}
.skip:focus{left:24px; top:14px; z-index:99; background:var(--brand); color:#fff; padding:10px 18px}

.mono{font-family:var(--f-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase}
.eyebrow{font-family:var(--f-mono); font-size:.7rem; letter-spacing:.2em; color:var(--brand-dk); margin:0 0 18px}
.h2{font-family:var(--f-disp); font-weight:700; font-size:clamp(1.5rem,3vw,2.1rem); line-height:1.55; letter-spacing:.05em; margin:0 0 28px}
.lede{max-width:44em; margin:0; color:var(--ink-60)}

/* ============================================================
   ヘッダー
   ============================================================ */
.site-head{
  position:sticky; top:0; z-index:60;
  background:rgba(252,253,251,.9); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.head-in{display:flex; align-items:center; justify-content:space-between; height:68px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand img{height:30px; width:auto}
.brand b{font-family:var(--f-disp); font-weight:700; font-size:1.02rem; letter-spacing:.09em}
.nav{display:flex; align-items:center; gap:30px}
.nav a{text-decoration:none; font-size:.86rem; letter-spacing:.08em; padding:6px 0; border-bottom:1px solid transparent; transition:border-color .2s,color .2s}
.nav a:hover,.nav a:focus-visible{border-bottom-color:var(--brand); color:var(--brand-dk)}
.nav a[aria-current="page"]{border-bottom-color:var(--brand); color:var(--brand-dk)}
.nav .btn-contact{background:var(--brand); color:#fff; border:1px solid var(--brand); padding:9px 20px; font-size:.82rem; letter-spacing:.1em}
.nav .btn-contact:hover,.nav .btn-contact[aria-current="page"]{background:transparent; color:var(--brand-dk)}
.burger{display:none; background:none; border:1px solid var(--line); padding:9px 12px; cursor:pointer}
.burger span{display:block; width:18px; height:1px; background:var(--ink); margin:4px 0}

/* ============================================================
   幹線（単線結線図）
   ============================================================ */
.railzone{position:relative}
.railline{
  position:absolute; top:0; bottom:0; width:1px; background:var(--line);
  left:50%; margin-left:-520px; z-index:1; pointer-events:none;
}
.railline i{position:absolute; inset:0 auto 0 0; width:1px; height:0; background:var(--brand); display:block}
.sec,.gridpaper{position:relative}
/* 節のノード。マークアップは不要で、CSSが自動で打ちます。 */
.sec::before,.gridpaper::after{
  content:""; position:absolute; z-index:3;
  left:calc(50% - 524px); top:calc(var(--sec-pad) + 6px);
  width:9px; height:9px; border-radius:50%;
  background:var(--node-bg,var(--bg)); border:1px solid var(--brand);
}
.gridpaper::after{top:calc(var(--sec-pad) + 6px)}
.sec--cta::before{display:none}          /* 幹線はお問い合わせ帯の手前で終わる */
.sec--end::before{background:var(--brand)}  /* 終端のノード */

/* 縦書きのラベル。段落ブロックに raillabel クラスを付けるだけで幹線脇に出ます。 */
.raillabel{
  position:absolute; z-index:3; margin:0;
  left:calc(50% - 506px); top:calc(var(--sec-pad) + 34px);
  writing-mode:vertical-rl; font-family:var(--f-disp); font-size:.78rem;
  letter-spacing:.34em; color:var(--ink-60); white-space:nowrap;
}

/* ============================================================
   ヒーロー（トップ）／ページ見出し（下層）
   ============================================================ */
.gridpaper{position:relative; overflow:hidden; --node-bg:var(--bg)}
.gridpaper::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(59,125,35,.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(59,125,35,.05) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:linear-gradient(to bottom, #000 40%, transparent 100%);
  mask-image:linear-gradient(to bottom, #000 40%, transparent 100%);
}
.gridpaper .wrap{position:relative; z-index:2}

.hero-in{padding:clamp(64px,10vw,120px) 0 clamp(56px,8vw,92px)}
.hero-in h1{
  font-family:var(--f-disp); font-weight:700;
  font-size:clamp(2rem,5.2vw,3.85rem); line-height:1.45; letter-spacing:.055em;
  margin:0 0 34px; text-indent:-.05em;
}
.hero-in h1 em{font-style:normal; color:var(--brand)}
.hero-in > div > p{max-width:38em; color:var(--ink-60); margin:0 0 42px; font-size:1.02rem}
.cta{display:flex; flex-wrap:wrap; gap:14px}
.btn{display:inline-block; text-decoration:none; padding:15px 34px; font-size:.88rem; letter-spacing:.12em; border:1px solid; transition:.2s}
.btn-fill{background:var(--brand); border-color:var(--brand); color:#fff; font-weight:500}
.btn-fill:hover{background:var(--brand-dk); border-color:var(--brand-dk)}
.btn-ghost{border-color:var(--line); color:var(--ink); background:var(--white)}
.btn-ghost:hover{border-color:var(--brand); color:var(--brand-dk)}
.hero-meta{
  margin-top:56px; padding-top:22px; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:10px 34px; color:var(--ink-60);
}

.pagehead-in{padding:clamp(48px,6.5vw,84px) 0 clamp(38px,5vw,58px)}
.crumbs{font-family:var(--f-mono); font-size:.7rem; letter-spacing:.14em; color:var(--ink-60); margin:0 0 22px}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--brand-dk)}
.crumbs i{font-style:normal; margin:0 10px; color:var(--brand)}
.pagehead-in h1{font-family:var(--f-disp); font-weight:700; font-size:clamp(1.8rem,4vw,2.85rem); letter-spacing:.06em; line-height:1.45; margin:0 0 18px}
.pagehead-in .lede{font-size:.98rem}

/* ============================================================
   セクション
   ============================================================ */
.sec{padding:var(--sec-pad) 0}
.sec--sm{padding:clamp(52px,6vw,78px) 0}
.sec--tint{background:var(--brand-pale); --node-bg:var(--brand-pale)}

/* 分岐図 */
.diagram{width:100%; height:auto; margin:8px 0 34px; overflow:visible}
.diagram .d-line{fill:none; stroke:var(--line); stroke-width:1}
.diagram .d-bus{fill:none; stroke:var(--brand); stroke-width:2}
.diagram .d-hot{fill:none; stroke:var(--brand); stroke-width:1}
.diagram .d-sq{fill:var(--white); stroke:var(--brand); stroke-width:1}
.diagram .d-dot{fill:var(--brand)}
.diagram text{font-family:var(--f-mono); font-size:11px; letter-spacing:.16em; fill:var(--brand-dk)}

/* カード */
.pair{display:grid; grid-template-columns:1fr 1fr; gap:40px}
.card{border-top:2px solid var(--brand); padding-top:22px}
.card h3{font-family:var(--f-disp); font-weight:700; font-size:1.24rem; letter-spacing:.06em; margin:0 0 14px}
.card p{margin:0; color:var(--ink-60); font-size:.94rem}
.card ul{margin:16px 0 0; padding:0; list-style:none}
.card li{font-size:.86rem; color:var(--ink-60); padding-left:18px; position:relative; line-height:1.9}
.card li::before{content:""; position:absolute; left:0; top:.85em; width:8px; height:1px; background:var(--brand)}

/* 手順（進め方） */
.steps{margin:0; padding:0; list-style:none; border-top:1px solid var(--line)}
.steps li{display:grid; grid-template-columns:64px minmax(0,1fr); gap:24px; padding:24px 8px; border-bottom:1px solid var(--line)}
.steps .n{font-family:var(--f-mono); font-size:.78rem; color:var(--brand); padding-top:.2em}
.steps h4{font-family:var(--f-disp); font-weight:700; font-size:1.05rem; letter-spacing:.05em; margin:0 0 6px}
.steps p{margin:0; font-size:.9rem; color:var(--ink-60)}

/* タグ */
.fields{display:flex; flex-wrap:wrap; gap:10px; margin-top:52px; padding-top:28px; border-top:1px solid var(--line)}
.chip{font-family:var(--f-mono); font-size:.76rem; letter-spacing:.1em; border:1px solid var(--brand-edge); background:var(--white); padding:8px 16px; color:var(--ink-60)}
.chip strong{color:var(--brand-dk); font-weight:500}

/* 代表者 */
.profile{display:grid; grid-template-columns:264px minmax(0,1fr); gap:52px; align-items:start}
.portrait{
  /* 写真の見せ方はこの2つで調整します。
     --portrait-ratio … 枠の縦横比。4/3=横長、1/1=正方形、3/4=縦長、auto=写真のまま
     --portrait-focus … トリミングの中心。顔が上にあるなら Y を小さく（例 50% 25%） */
  --portrait-ratio:4/3;
  --portrait-focus:50% 35%;
  border:1px solid var(--brand-edge); background:var(--white); margin:0;
}
.portrait img{
  width:100%; aspect-ratio:var(--portrait-ratio);
  object-fit:cover; object-position:var(--portrait-focus);
}
/* 写真を切らずに全体を見せたいとき（縦横比は写真そのまま） */
.portrait--full img{aspect-ratio:auto; height:auto; object-fit:contain}
.portrait figcaption{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.14em; padding:10px 12px; border-top:1px solid var(--brand-edge); color:var(--ink-60)}
.profile h3{font-family:var(--f-disp); font-weight:700; font-size:1.6rem; letter-spacing:.08em; margin:0 0 6px}
.profile .role{font-family:var(--f-mono); font-size:.74rem; letter-spacing:.16em; color:var(--brand-dk); margin:0 0 26px}
.profile p{color:var(--ink-60); margin:0 0 18px; font-size:.96rem}
.orgs{margin:30px 0 0; padding:24px 0 0; border-top:1px solid var(--brand-edge); display:flex; flex-wrap:wrap; gap:8px}
.orgs span{font-family:var(--f-mono); font-size:.72rem; letter-spacing:.1em; color:var(--ink-60); border:1px solid var(--brand-edge); background:var(--white); padding:6px 12px}

/* 台帳テーブル */
.ledger{width:100%; border-collapse:collapse; font-size:.9rem; background:var(--white)}
.ledger th,.ledger td{text-align:left; padding:17px 14px; border-bottom:1px solid var(--line); vertical-align:top}
.ledger thead th{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.16em; color:var(--ink-60); font-weight:400; border-bottom:1px solid var(--brand); padding-bottom:10px}
.ledger tbody th{font-weight:500; width:34%}
.ledger td{font-family:var(--f-mono); font-size:.78rem; color:var(--ink-60); letter-spacing:.04em}
.ledger tbody tr:hover{background:var(--brand-pale)}
.badge{display:inline-block; width:8px; height:8px; background:var(--brand); margin-right:10px; transform:translateY(-1px)}

/* 証憑リンク */
.docs{margin:0; padding:0; list-style:none; border-top:1px solid var(--line)}
.docs a{display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 8px; border-bottom:1px solid var(--line); text-decoration:none; transition:.18s}
.docs a:hover{background:var(--white); padding-left:18px}
.docs .t{font-size:.95rem}
.docs .m{font-family:var(--f-mono); font-size:.7rem; letter-spacing:.12em; color:var(--brand-dk); white-space:nowrap}

/* ニュース */
.news{border-top:1px solid var(--line)}
.news a{display:grid; grid-template-columns:110px 92px minmax(0,1fr) 28px; gap:20px; align-items:baseline; padding:22px 8px; border-bottom:1px solid var(--line); text-decoration:none; transition:.18s}
.news a:hover{background:var(--white); padding-left:18px}
.news time{font-family:var(--f-mono); font-size:.78rem; color:var(--ink-60)}
.news .tag{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.1em; border:1px solid var(--brand-edge); padding:3px 8px; text-align:center; color:var(--brand-dk)}
.news .ttl{font-size:.96rem; line-height:1.7}
.news .arw{color:var(--brand); text-align:right}
.more{display:inline-block; margin-top:34px; font-family:var(--f-mono); font-size:.76rem; letter-spacing:.14em; text-decoration:none; color:var(--brand-dk); border-bottom:1px solid var(--brand); padding-bottom:4px}

/* ページャ */
.pager{display:flex; flex-wrap:wrap; gap:8px; margin-top:52px}
.pager a,.pager span{font-family:var(--f-mono); font-size:.78rem; min-width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center; padding:0 14px; border:1px solid var(--line); text-decoration:none; background:var(--white)}
.pager a:hover{border-color:var(--brand); color:var(--brand-dk)}
.pager .cur{background:var(--brand); border-color:var(--brand); color:#fff}

/* 記事本文 */
.post-meta{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; margin:0 0 22px}
.post-meta time{font-family:var(--f-mono); font-size:.78rem; color:var(--ink-60)}
.post-meta .tag{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.1em; border:1px solid var(--brand-edge); padding:3px 8px; color:var(--brand-dk)}
.prose{max-width:46em}
.prose > * + *{margin-top:1.6em}
.prose p{margin:0; line-height:2.05}
.prose h2{font-family:var(--f-disp); font-weight:700; font-size:1.4rem; letter-spacing:.05em; line-height:1.6; margin:2.6em 0 0; padding-top:1.3em; border-top:1px solid var(--line)}
.prose h3{font-family:var(--f-disp); font-weight:700; font-size:1.1rem; letter-spacing:.05em; margin:2.2em 0 0}
.prose ul,.prose ol{margin:0; padding-left:1.5em; color:var(--ink-60)}
.prose li{margin-top:.5em}
.prose a{color:var(--brand-dk); text-underline-offset:4px}
.prose blockquote{margin:0; padding:6px 0 6px 22px; border-left:2px solid var(--brand); color:var(--ink-60)}
.prose figure{margin:0}
.prose figure img{border:1px solid var(--line); width:100%}
.prose figcaption{font-family:var(--f-mono); font-size:.7rem; letter-spacing:.1em; color:var(--ink-60); margin-top:10px}
.prose code{font-family:var(--f-mono); font-size:.86em; background:var(--brand-pale); padding:2px 6px}
.prose hr{border:0; border-top:1px solid var(--line); margin:2.6em 0}
.prose table{width:100%; border-collapse:collapse; font-size:.9rem}
.prose th,.prose td{border:1px solid var(--line); padding:12px 14px; text-align:left}
.prose th{background:var(--brand-pale); font-weight:500}

/* 記事間ナビ */
.postnav{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:64px; padding-top:32px; border-top:1px solid var(--line)}
.postnav a{display:block; padding:20px; border:1px solid var(--line); background:var(--white); text-decoration:none; transition:.18s}
.postnav a:hover{border-color:var(--brand)}
.postnav .k{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.14em; color:var(--brand-dk); display:block; margin-bottom:8px}
.postnav .t{font-size:.92rem; line-height:1.7}
.postnav .next{text-align:right}

/* 定義リスト */
.facts{margin:0; border-top:1px solid var(--line)}
.facts .row{display:grid; grid-template-columns:190px minmax(0,1fr); gap:24px; padding:18px 8px; border-bottom:1px solid var(--line)}
.facts dt{font-family:var(--f-mono); font-size:.72rem; letter-spacing:.14em; color:var(--ink-60); padding-top:.35em}
.facts dd{margin:0; font-size:.95rem}

/* 注記ボックス */
.notice{background:var(--white); border:1px solid var(--brand-edge); padding:24px 26px; font-size:.9rem; color:var(--ink-60)}
.notice strong{color:var(--ink); font-weight:500}

/* お問い合わせ */
.sec--cta{background:var(--brand); color:#fff}
.sec--cta .eyebrow{color:#D9EBCB}
.sec--cta .h2{color:#fff}
.sec--cta .lede{color:#E2EFD9}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:end}
.contact-list{margin:0; padding:0; list-style:none}
.contact-list li{padding:18px 0; border-bottom:1px solid rgba(255,255,255,.3)}
.contact-list .k{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.16em; color:rgba(255,255,255,.75); display:block; margin-bottom:6px}
.contact-list a{color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.45)}
.contact-list a:hover{border-bottom-color:#fff}

/* 連絡先（明るい面バージョン） */
.channels{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.channel{border-top:2px solid var(--brand); background:var(--white); padding:26px 24px 28px}
.channel .k{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.16em; color:var(--brand-dk); display:block; margin-bottom:14px}
.channel .v{font-size:1rem; margin:0 0 10px; word-break:break-all}
.channel .v a{color:var(--ink); text-decoration:none; border-bottom:1px solid var(--brand-edge)}
.channel .v a:hover{border-bottom-color:var(--brand); color:var(--brand-dk)}
.channel .d{font-size:.84rem; color:var(--ink-60); margin:0}

/* アクセス */
.access{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:48px; align-items:start}
.access .map{border:1px solid var(--line); background:var(--white); aspect-ratio:16/10; display:flex; align-items:center; justify-content:center; font-family:var(--f-mono); font-size:.72rem; letter-spacing:.14em; color:var(--ink-60)}

/* フッター */
.site-foot{background:var(--white); border-top:1px solid var(--line); padding:52px 0 40px; color:var(--ink-60)}
.foot-in{display:flex; flex-wrap:wrap; gap:32px; justify-content:space-between; align-items:flex-start}
.foot-nav{display:flex; flex-wrap:wrap; gap:12px 28px; max-width:640px}
.foot-nav a{font-size:.82rem; text-decoration:none; color:var(--ink-60)}
.foot-nav a:hover{color:var(--brand-dk)}
.copy{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.12em; margin-top:40px; color:var(--ink-60)}

/* 演出 */
.rv{opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease}
.rv.in{opacity:1; transform:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--brand); outline-offset:3px}


/* 節（.sec）に入っていない単独ブロックも、本文カラムの幅と左余白に合わせる。
   パターンを使わず素のブロックを直接置いた場合の保険です。 */
.railzone > *:not(.sec):not(.gridpaper):not(.railline){
  max-width:var(--wrap); margin-inline:auto; margin-block:34px;
  padding-inline:var(--gutter);
  padding-left:calc(var(--gutter) + var(--rail));
}

/* ============================================================
   ブロックエディタ出力への対応
   固定ページの本文はブロックで組むため、WordPressが付ける
   wp-block-* クラスでも同じ見た目になるようにしています。
   ============================================================ */
main .wp-block-group.wrap{max-width:var(--wrap)}
.wp-block-columns.pair{display:grid; grid-template-columns:1fr 1fr; gap:40px}
.wp-block-columns.channels{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.wp-block-columns.profile{display:grid; grid-template-columns:264px minmax(0,1fr); gap:52px; align-items:start}
.wp-block-column.card,.wp-block-column.channel{flex-basis:auto}
.wp-block-image.portrait{margin:0}
.wp-block-table.ledger{margin:0}
.ledger table{width:100%; border-collapse:collapse; font-size:.9rem; background:var(--white)}
.wp-block-heading{scroll-margin-top:90px}
/* ブロック間の自動マージンは使わず、本テーマのCSSで余白を決める */
main .wrap > .wp-block-group,
main .wrap > p,
main .wrap > h2{margin-block-start:0}

/* ============================================================
   レスポンシブ
   ============================================================ */
@media (max-width:1160px){
  .railline{left:60px; margin-left:0}
  .sec::before,.gridpaper::after{left:55px}
  .raillabel{left:74px}
}
@media (max-width:1000px){
  .channels,.wp-block-columns.channels{grid-template-columns:1fr}
  .access{grid-template-columns:minmax(0,1fr); gap:32px}
}
@media (max-width:900px){
  .railline{display:none}
  .sec::before,.gridpaper::after,.raillabel{display:none}
  main .wrap{padding-left:var(--gutter)}
  .railzone > *:not(.sec):not(.gridpaper):not(.railline){padding-left:var(--gutter)}
  .profile,.wp-block-columns.profile{grid-template-columns:minmax(0,1fr); gap:32px}
  .portrait{max-width:280px}
  .contact-grid{grid-template-columns:minmax(0,1fr); gap:40px}
  .postnav{grid-template-columns:1fr}
  .postnav .next{text-align:left}
  .nav{
    position:fixed; inset:68px 0 auto; background:var(--bg); flex-direction:column;
    align-items:stretch; gap:0; padding:8px 24px 24px; border-bottom:1px solid var(--line); display:none;
  }
  .nav.open{display:flex}
  .nav a{padding:15px 0; border-bottom:1px solid var(--line)}
  .nav .btn-contact{margin-top:14px; text-align:center}
  .burger{display:block}
}
@media (max-width:720px){
  .pair,.wp-block-columns.pair{grid-template-columns:minmax(0,1fr); gap:34px}
  .diagram{display:none}
  .news a{grid-template-columns:1fr; gap:8px; padding:20px 4px}
  .news .tag{justify-self:start; padding:2px 8px}
  .news .arw{display:none}
  .facts .row{grid-template-columns:minmax(0,1fr); gap:4px}
  .steps li{grid-template-columns:minmax(0,1fr); gap:8px}
  .docs a{flex-direction:column; align-items:flex-start; gap:8px}
  .ledger thead{display:none}
  .ledger tbody th,.ledger td{display:block; width:auto; border-bottom:none; padding:4px 12px}
  .ledger tbody th{padding-top:16px}
  .ledger tbody td:last-child{padding-bottom:16px; border-bottom:1px solid var(--line)}
  .hero-in h1{letter-spacing:.03em}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1; transform:none; transition:none}
}

@media print{
  .site-head,.nav,.railline,.sec--cta,.burger{display:none !important}
  body{background:#fff; font-size:11pt}
  .rv{opacity:1; transform:none}
  a{text-decoration:none; color:#000}
}