/* ============================================================
   ONKS Holdings 下層ページの共通スタイル（2026-09-29 作成）
   研修ページ kenshu.html（2026-09-29 刷新）の濃紺ヘッダー・冒頭の帯・
   紙色の本文・濃紺フッターを取り出したもの。新しいページ
   （/service/advisor/ など）はこのファイルを <link> で読む。
   ・冒頭の帯は濃紺の地。写真を敷くページは .has-photo（下の「冒頭の帯に写真を敷くページ」）
   ・kenshu.html・法的4ページ・index.html はそれぞれのインライン <style> のまま
     （このファイルには切り替えていない）
   ・色を変えるときは kenshu.html / index.html の :root と合わせる
   ============================================================ */

:root{
  --paper:#F5F1EA;
  --paper-2:#EEE7DB;
  --ink:#0E1B35;
  --ink-2:#152449;
  --ink-soft:#2A3557;
  --gold:#7F6337;
  --line:rgba(14,27,53,0.12);
  /* トップ（index.html）と同じ色・書体 */
  --c-ch1:#0E1B35;
  --c-paper:#F4F1EA;
  --c-text:#C9D1DB;
  --c-head:#F4F1EA;
  --c-rule:#3A4E6B;
  --c-dawn:#E6A77F;   /* 東雲色：見出し下の細線と相談ボタンだけ */
  --f-serif:"Shippori Mincho B1", "Noto Serif JP", serif;
  --f-gothic:"Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --f-latin:Georgia, "Times New Roman", serif;
  --gutter:16px;
  --wrap:min(1080px, calc(100% - var(--gutter) * 2));
}
@media (min-width:768px){ :root{ --gutter:40px; } }

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--c-ch1)}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--f-gothic);
  font-weight:400;
  line-height:1.85;
  font-feature-settings:"palt";
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--ink);color:var(--paper)}
img{max-width:100%;height:auto}
a{color:var(--ink-soft);text-decoration:none}
a:hover{color:var(--gold)}
/* フォーカスの枠：紙色の面は濃紺、濃紺の面（ヘッダー・冒頭の帯・フッター）は東雲色 */
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.hd :focus-visible, .pg-hero :focus-visible, .ft :focus-visible{outline-color:var(--c-dawn)}
main a{text-decoration:underline;text-underline-offset:.15em;text-decoration-thickness:1px}
main a.btn{text-decoration:none}
.nb{white-space:nowrap}

/* 語の途中で1〜3字だけが次の行に落ちるのを減らす（対応ブラウザのみ） */
h1,h2,h3,p,li,dt,dd,td,th,.callout,.page-meta{word-break:auto-phrase;text-wrap:pretty}
h2{text-wrap:balance}
.sec p,.sec li{line-break:strict}

/* ===== ボタン（トップと同じ） ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;
  padding:14px 28px;
  font-family:var(--f-gothic);
  font-weight:500;
  font-size:15.5px;
  line-height:1.5;
  letter-spacing:.06em;
  text-decoration:none;
  text-align:center;
  border:1px solid transparent;
  transition:background-color .25s ease, color .25s ease, border-color .25s ease;
}
.btn svg{width:20px;height:20px;flex:none}
.btn-dawn{background:var(--c-dawn);color:#0E1B35;border-color:var(--c-dawn)}
.btn-dawn:hover{background:#EDB995;border-color:#EDB995;color:#0E1B35}
/* 紙色の面の枠ボタン（トップの .on-paper .btn-line と同じ） */
.btn-line{border-color:#0E1B35;color:#0E1B35;background:transparent}
.btn-line:hover{background:rgba(14,27,53,.05);color:#0E1B35}

/* ===== ヘッダー（トップと同じ濃紺。固定はしない） ===== */
.hd{
  position:relative;z-index:100;
  padding:14px var(--gutter);
  padding-top:max(14px, env(safe-area-inset-top));
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;row-gap:8px;
  background:var(--c-ch1);
}
.hd-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--c-head)}
.hd-logo:hover{color:var(--c-head)}
.hd-logo img{width:26px;height:26px;border-radius:3px;filter:invert(1) brightness(1.4)}
.hd-logo span{font-family:var(--f-serif);font-size:17px;letter-spacing:.3em}
.hd-right{display:inline-flex;align-items:center;gap:14px}
.hd-back{font-size:13.5px;letter-spacing:.06em;color:var(--c-text);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--c-rule);padding:8px 0;white-space:nowrap}
.hd-back:hover{color:var(--c-head);text-decoration-color:var(--c-head)}
.hd-cta{min-height:40px;padding:8px 18px;font-size:14px;white-space:nowrap}
/* とても狭い画面（320px前後）では語の途中で折らず、右側を2段目へ回す */
@media (max-width:400px){
  .hd{gap:8px}
  .hd-logo{gap:8px}
  .hd-logo span{letter-spacing:.22em}
  .hd-right{gap:12px}
  .hd-back{font-size:13px;letter-spacing:.02em}
  .hd-cta{padding:8px 12px;font-size:13.5px;letter-spacing:.04em}
}

/* ===== 冒頭の帯（濃紺の地。写真を敷くページは下の .has-photo） ===== */
.pg-hero{
  background:var(--c-ch1);
  color:var(--c-head);
  border-top:1px solid var(--c-rule);
}
.pg-hero-inner{
  /* 本文（.container）と左端をそろえる */
  max-width:760px;margin:0 auto;
  padding:clamp(28px,5vw,44px) clamp(20px,5vw,32px) clamp(48px,7vw,80px);
}
/* パンくず（帯の上端） */
.crumbs{margin-bottom:clamp(36px,6vw,56px);font-size:12.5px;letter-spacing:.04em;line-height:1.8}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:0 .2em}
.crumbs li{color:var(--c-text)}
.crumbs li + li::before{content:"/";margin:0 .6em 0 .4em;color:var(--c-text)}
.crumbs a{color:var(--c-text);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--c-rule);display:inline-block;padding:6px 0}
.crumbs a:hover{color:var(--c-head);text-decoration-color:var(--c-head)}
.crumbs [aria-current="page"]{color:var(--c-head)}
.eyebrow{
  font-family:var(--f-latin);
  font-size:12.5px;
  letter-spacing:.25em;
  color:var(--c-head);
  text-transform:uppercase;
  margin-bottom:16px;
  font-weight:400;
}
.pg-hero h1{
  font-family:var(--f-serif);
  font-size:clamp(28px,4.6vw,44px);
  font-weight:500;
  color:var(--c-head);
  line-height:1.5;
  margin-bottom:26px;
  letter-spacing:.06em;
}
.pg-hero h1::after{content:"";display:block;width:48px;height:1px;margin-top:.55em;background:var(--c-dawn)}
.pg-hero h1 .h1-sub{display:block;font-size:.72em;font-weight:500;letter-spacing:.04em;line-height:1.5;margin-top:6px}
.lead{
  color:var(--c-head);
  font-size:15.5px;
  line-height:2;
  letter-spacing:.03em;
  max-width:40em;
}
@media (min-width:768px){ .lead{font-size:16.5px} }
/* --- 冒頭の帯に写真を敷くページ（2026-09-30 社長が ChatGPT で作成。人・文字の入らない風景）
   <div class="pg-hero has-photo"> の先頭に <div class="pg-hero-img" aria-hidden="true" style="--pg-photo:url('/assets/renewal/pages/<名前>.webp');--pg-photo-sp:url('/assets/renewal/pages/<名前>-sp.webp')"></div> を置く。
   幕の濃さは、文字の下の最も明るい画素でも 4.5:1 以上になるよう写真ごとに実測して決める（--pg-veil で上書きできる）。
   写真の指定は style 属性の変数で渡すので、CSP の style-src に 'unsafe-inline' が要る（締めるときはページごとの class 指定へ移す）。
   写真は <head> で media 付きの preload をしておく（768px 以上＝<名前>.webp／767px 以下＝<名前>-sp.webp。境界は下の @media とそろえる） */
.pg-hero.has-photo{position:relative;isolation:isolate;overflow:hidden}
.pg-hero-img{position:absolute;inset:0;z-index:-2;background-color:var(--c-ch1);background-image:var(--pg-photo);background-position:center;background-size:cover;background-repeat:no-repeat}
@media (max-width:767px){ .pg-hero-img{background-image:var(--pg-photo-sp,var(--pg-photo));background-position:72% 50%} }
.pg-hero.has-photo::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--pg-veil,linear-gradient(to right, rgba(14,27,53,.86) 0%, rgba(14,27,53,.78) 50%, rgba(14,27,53,.58) 100%))}
@media (max-width:1023px){ .pg-hero.has-photo::after{background:var(--pg-veil-sp,rgba(14,27,53,.76))} }
.pg-hero.has-photo .pg-hero-inner{padding-top:clamp(40px,7vw,80px)}

/* ===== 本文（紙色） ===== */
.container{
  max-width:760px;
  margin:0 auto;
  padding:clamp(48px,8vw,80px) clamp(20px,5vw,32px) clamp(80px,12vw,120px);
}
.sec{margin-bottom:48px}
.sec h2{
  font-family:var(--f-serif);
  font-size:clamp(19px,3.8vw,23px);
  font-weight:500;
  color:var(--ink);
  line-height:1.6;
  margin-bottom:16px;
  padding-left:14px;
  border-left:3px solid var(--gold);
  letter-spacing:.03em;
}
.sec h3{
  font-family:var(--f-gothic);
  font-size:16px;
  font-weight:500;
  color:var(--ink);
  line-height:1.8;
  margin:24px 0 8px;
}
.sec p{
  color:var(--ink-soft);
  font-size:15.5px;
  line-height:1.95;
  margin-bottom:12px;
}
.sec ol,.sec ul{
  margin:0 0 12px 1.6em;
  color:var(--ink-soft);
  font-size:15.5px;
  line-height:1.95;
}
.sec li{margin-bottom:6px}
.sec strong{color:var(--ink);font-weight:500}
.note{
  font-size:13.5px;
  color:var(--ink-soft);
  line-height:1.9;
  margin-top:10px;
}
.callout{
  background:var(--paper-2);
  border-left:3px solid var(--gold);
  padding:16px 18px;
  margin:16px 0;
  font-size:15px;
  line-height:1.95;
  color:var(--ink);
}
/* 料金の一文（金額を出すのは AI顧問だけ。ほかは特商法への案内） */
.price-note{
  margin:16px 0;
  padding:14px 0;
  border-top:1px dashed var(--line);
  border-bottom:1px dashed var(--line);
  font-size:15px;
  line-height:1.9;
  color:var(--ink);
}
.price-note .pn-label{font-weight:500;margin-right:.3em}

/* ===== 本文末の相談の入口 ===== */
.cta-block{
  margin-top:56px;
  padding:clamp(24px,5vw,36px) clamp(20px,4vw,32px);
  background:var(--paper-2);
  border-top:2px solid var(--c-dawn);
}
.cta-block h2{
  font-family:var(--f-serif);
  font-size:clamp(20px,4vw,26px);
  font-weight:500;
  color:var(--ink);
  line-height:1.6;
  letter-spacing:.04em;
  margin-bottom:12px;
}
.cta-block p{color:var(--ink-soft);font-size:15px;line-height:1.95;margin-bottom:8px}
/* 「東信（佐久・御代田・軽井沢・小諸）は、」の改行させない範囲は 320px 幅では枠より長い（5px はみ出す）。狭い画面だけ折り返してよいことにする（2026-09-30） */
@media (max-width:359px){ .cta-block .nb{white-space:normal} }
.cta-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.cta-btns .btn{padding-left:20px;padding-right:20px}
@media (max-width:560px){ .cta-btns .btn{flex:1 1 100%} }

/* ===== 注記（ページ末） ===== */
.page-meta{
  margin-top:48px;
  padding-top:24px;
  border-top:1px dashed var(--line);
  font-size:12.5px;
  color:var(--ink-soft);
  letter-spacing:.05em;
  line-height:1.9;
}

/* ===== フッター（トップと同じ中身・濃紺の地） ===== */
.ft{background:var(--c-ch1);color:var(--c-head);padding:48px 0 40px;font-size:16px;line-height:2;letter-spacing:.03em}
.ft .wrap{width:var(--wrap);margin:0 auto}
@media (min-width:768px){ .ft .wrap{padding-left:48px} }
.ft a{color:inherit}
.ft a:hover{color:var(--c-head)}
.ft-brand{display:flex;align-items:center;gap:12px;font-family:var(--f-serif);font-size:18px;letter-spacing:.14em}
.ft-brand img{width:34px;height:34px;filter:invert(1) brightness(1.4)}
.ft-info{margin-top:16px;font-size:14px;line-height:2}
.ft-info a{text-decoration:underline;text-underline-offset:4px}
.ft-group{margin-top:20px;font-size:13px}
.ft-group a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;margin-top:6px}
.ft-group a:hover span{text-decoration:underline;text-underline-offset:4px}
/* グループ会社のロゴは色を変えず、紙色の小さな台に載せる */
.ft-group img{height:22px;width:auto;box-sizing:content-box;padding:4px 6px;background:var(--c-paper);border-radius:2px}
.ft-links{display:flex;flex-wrap:wrap;gap:0 22px;margin-top:26px;padding-top:20px;border-top:1px solid var(--c-rule);font-size:13.5px}
.ft-links a{text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(244,241,234,.45);display:inline-block;padding:8px 0}
.ft-links a:hover{text-decoration-color:currentColor}
.ft-copy{margin-top:22px;font-size:12.5px;color:var(--c-text)}

/* ============================================================
   サブページの図と枠（2026-09-30）
   /service/*・/industry/*・/about/ で使う共通の部品。
   承認済みのコラム記事（col-fig・col-points・col-check）と同じ見た目。
   kenshu.html は自分のインライン <style> を持つので、ここは効かない。
   ・色は濃紺（--ink）・紙色（--paper / --paper-2）・区切り線 #D5D2CA。
     東雲色（--c-dawn）はポイントの枠の上の細線だけ（文字・矢印・印には使わない＝紙色の上では薄い）
   ・.sec の中でも外でも同じに見えるよう、.sec p／.sec ul／.sec li／.sec h3 と
     同じ詳細度で後に書くか、それより強い指定にしている（ページ側は class を付けるだけ）
   ・リストの部品は <ul>／<ol> に role="list" を付ける（印を消したリストも一覧と読み上げるため）
   ・番号・印・矢印はすべて CSS が描く（本文の文字に数字や記号を足さない）
   ・図の SVG は viewBox の幅 560・文字 24 以上を守る（幅 320px の画面で約 11px。広げる・小さくすると 11px を割る）
   ============================================================ */

/* --- .pg-fig：図の枠（インライン SVG ＋ 説明文 .pg-fig-cap）。枠の形はコラムの col-fig と同じで、SVG の幅の上限だけ違う
   SVG は幅いっぱい・高さは viewBox の比のまま。広い画面では 420px まで（図の文字が見出しより大きくならないように。
   col-fig は viewBox 640 を 560px までに収める。viewBox 560 の図を 560px まで広げると、文字がコラムの図より大きくなる） */
.pg-fig{margin:20px 0 24px;padding:16px 16px 12px;border:1px solid #D5D2CA;background:var(--paper)}
.pg-fig svg{display:block;width:100%;height:auto;font-family:inherit}
.pg-fig svg{max-width:420px;margin:0 auto}
.pg-fig .pg-fig-cap{margin:10px auto 0;max-width:420px;font-size:13px;line-height:1.75;letter-spacing:.02em;color:var(--ink-soft);word-break:auto-phrase;text-wrap:pretty;line-break:strict}
@media (max-width:560px){ .pg-fig{padding:12px 10px 10px} }

/* --- .pg-points：ポイントの枠（紙色2の地・上に東雲色の細線・濃紺の文字・小さな四角の印）。コラムの col-points と同じ
   見出し（.pg-points-t）は任意。既にある <h2>／<h3> を中に入れても同じ形になる */
.pg-points{margin:20px 0 28px;padding:18px 20px 16px;background:var(--paper-2);border-top:2px solid var(--c-dawn);color:var(--ink)}
.pg-points :is(h2,h3,.pg-points-t){margin:0 0 8px;padding:0;border:0;font-family:var(--f-serif);font-weight:500;font-size:16.5px;line-height:1.6;letter-spacing:.08em;color:var(--ink)}
.pg-points :is(ul,ol){list-style:none;margin:0;padding:0}
.pg-points li{position:relative;margin:0 0 4px;padding-left:1.15em;font-size:15px;line-height:1.85;color:var(--ink);line-break:strict}
.pg-points li:last-child{margin-bottom:0}
.pg-points li::before{content:"";position:absolute;left:.1em;top:.8em;width:6px;height:6px;background:var(--ink)}
.pg-points p{margin:0 0 6px;font-size:15px;line-height:1.85;color:var(--ink)}
.pg-points > :last-child{margin-bottom:0}

/* --- .pg-steps：手順の流れ（番号は CSS の counter・矢印も CSS）
   狭い画面は縦（番号は左・矢印は番号の下）。768px 以上で3つまでなら横並び（番号は上・矢印は右向き）。
   4つ以上は自動で縦（本文の幅が1行8字ほどになり、語の途中で折れるため）。:has に未対応のブラウザも縦。
   横並びの本文の幅は1行12字ほど。本文がおおむね40字を超える手順があるときは pg-steps-v を足して縦に固定する */
:is(ol,ul).pg-steps{list-style:none;margin:20px 0 28px;padding:0;counter-reset:pg-step;display:grid;grid-template-columns:minmax(0,1fr);row-gap:30px;font-size:14.5px;line-height:1.85;color:var(--ink-soft)}
.pg-steps > li{position:relative;margin:0;min-width:0;padding:14px 16px 15px 56px;background:var(--paper);border:1px solid #D5D2CA;border-top:2px solid var(--ink);counter-increment:pg-step}
.pg-steps > li::before{content:counter(pg-step);position:absolute;left:16px;top:14px;display:flex;align-items:center;justify-content:center;width:26px;height:26px;margin:0;background:var(--ink);color:var(--paper);font-family:var(--f-serif);font-size:14px;font-weight:500;line-height:1;letter-spacing:0}
/* 次の手順への矢印（縦のときは下向き・番号の真下で、カードの間のすき間の真ん中） */
.pg-steps > li:not(:last-child)::after{content:"";position:absolute;left:24px;bottom:-17px;width:10px;height:10px;margin:0;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg)}
.pg-steps :is(h3,h4,.pg-step-t){margin:0 0 4px;padding:0;border:0;font-family:var(--f-gothic);font-size:15.5px;font-weight:500;line-height:1.65;letter-spacing:.02em;color:var(--ink)}
.pg-steps p{margin:0 0 4px;font-size:14.5px;line-height:1.85;color:var(--ink-soft)}
.pg-steps > li > :last-child{margin-bottom:0}
@media (min-width:768px){
  :is(ol,ul).pg-steps:not(.pg-steps-v):not(:has(> li:nth-child(4))){grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);column-gap:30px}
  .pg-steps:not(.pg-steps-v):not(:has(> li:nth-child(4))) > li{padding:14px 16px 15px}
  .pg-steps:not(.pg-steps-v):not(:has(> li:nth-child(4))) > li::before{position:static;margin:0 0 8px}
  .pg-steps:not(.pg-steps-v):not(:has(> li:nth-child(4))) > li:not(:last-child)::after{left:auto;right:-17px;bottom:auto;top:50%;margin:-5px 0 0;transform:rotate(-45deg)}
}

/* --- .pg-cards：カードの格子（狭い画面は1列・600px 以上は2列・pg-cards-3 を足すと 768px 以上で3列）
   アイコン .pg-icon（32px）は任意。線は currentColor（濃紺）・塗りなしが既定。東雲色を差すときは path に fill="#E6A77F" */
:is(ul,ol,div).pg-cards{list-style:none;margin:20px 0 28px;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:14px;font-size:14.5px;line-height:1.85;color:var(--ink-soft)}
@media (min-width:600px){ :is(ul,ol,div).pg-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px} }
@media (min-width:768px){ :is(ul,ol,div).pg-cards.pg-cards-3{grid-template-columns:repeat(3,minmax(0,1fr))} }
.pg-cards > :is(li,div){margin:0;min-width:0;padding:16px 18px 17px;background:var(--paper);border:1px solid #D5D2CA;border-top:2px solid var(--ink)}
.pg-icon{display:block;width:32px;height:32px;margin:0 0 10px;color:var(--ink);fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
:is(.pg-card-t,.pg-step-t) > strong{font-weight:inherit}
.pg-cards :is(h3,h4,.pg-card-t){margin:0 0 6px;padding:0;border:0;font-family:var(--f-serif);font-size:17px;font-weight:500;line-height:1.6;letter-spacing:.05em;color:var(--ink)}
.pg-cards p{margin:0 0 6px;font-size:14.5px;line-height:1.85;color:var(--ink-soft)}
.pg-cards > :is(li,div) > :last-child{margin-bottom:0}

/* --- .pg-check：チェックリスト（枠つき・印は CSS で描く）。コラムの col-check と同じ */
:is(ul,ol).pg-check{list-style:none;margin:16px 0 20px;padding:14px 18px 14px 16px;border:1px solid #D5D2CA;background:var(--paper);font-size:15.5px;line-height:1.95;color:var(--ink)}
.pg-check > li{position:relative;margin:0 0 8px;padding-left:1.9em;color:var(--ink);word-break:normal}  /* 句で折ると語の途中で折れることがあるため普通の折り返し（col-check と同じ） */
.pg-check > li:last-child{margin-bottom:0}
.pg-check > li::before{content:"";position:absolute;left:0;top:.42em;width:1.1em;height:1.1em;border:1.5px solid var(--ink);background:var(--paper)}
.pg-check > li::after{content:"";position:absolute;left:.4em;top:.58em;width:.32em;height:.6em;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg)}

/* --- .pg-timeline：縦の時間の流れ（月・回ごと）。四角の印と縦線は CSS で描く
   .pg-tl-when（濃紺の小札）・.pg-tl-t（短い見出し）は任意。既にある文を包むだけ */
:is(ol,ul).pg-timeline{list-style:none;margin:20px 0 28px;padding:0;font-size:15.5px;line-height:1.95;color:var(--ink-soft)}
.pg-timeline > li{position:relative;margin:0;padding:0 0 24px 30px}
.pg-timeline > li:last-child{padding-bottom:0}
.pg-timeline > li::before{content:"";position:absolute;left:0;top:7px;width:12px;height:12px;border:2px solid var(--ink);background:var(--paper);z-index:1}
.pg-timeline > li:not(:last-child)::after{content:"";position:absolute;left:5px;top:19px;bottom:-7px;width:2px;background:#D5D2CA}
.pg-timeline .pg-tl-when{display:block;width:fit-content;margin:0 0 6px;padding:1px 9px;background:var(--ink);color:var(--paper);font-size:12.5px;font-weight:500;line-height:1.8;letter-spacing:.08em}
.pg-timeline :is(h3,h4,.pg-tl-t){margin:0 0 2px;padding:0;border:0;font-family:var(--f-gothic);font-size:16px;font-weight:500;line-height:1.65;letter-spacing:.02em;color:var(--ink)}
.pg-timeline p{margin:0 0 4px;font-size:15px;line-height:1.9;color:var(--ink-soft)}
.pg-timeline > li > :last-child{margin-bottom:0}