/* ================================================================
   テーマ別プログラム 一覧TOP（/program）専用CSS
   確定デザイン: program-hub-prototype.html v3（2026-09-13・FV「席」・窓モチーフ・ティール）を移植。
   共有シェル program.css の後に読む。program.css は1バイトも変更しない。
   接頭辞は hub-。色と書体は :root で program.css の --lp-* を上書きして変える（LPと同じ方式）。
   ---------------------------------------------------------------- */

/* ---- 1. デザイントークン ------------------------------------ */
:root {
    /* ハブ専用パレット（中立の器＋ブランドのティール一滴） */
    --hub-paper: #FBF9F5;
    --hub-band: #F3EFE8;
    --hub-white: #FFFFFF;
    --hub-ink: #3A3632;
    --hub-ink2: #7A716A;
    --hub-ink3: #A39A91;
    --hub-line: #E4DED4;
    --hub-line-soft: #EFEAE2;
    /* アクセント: ロゴのティール（#429084）由来。主CTAの塗り・リンクの下線・アイブロウ・見出し上のルール・
       ステップ番号の枠・FAQの「Q」にだけ使い、面では塗らない */
    --hub-teal: #3F7F75;
    --hub-teal-deep: #2F6560;
    --hub-teal-tint: #E3EFEC;
    --hub-teal-tint2: #F0F6F4;
    --hub-cta: var(--hub-teal);
    --hub-cta-hover: var(--hub-teal-deep);
    --hub-serif: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
    --hub-sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
    --hub-w: 1080px;

    /* program.css の変数体系へのマッピング */
    --lp-bg: var(--hub-paper);
    --lp-bg-deep: var(--hub-band);
    --lp-bg-warm: var(--hub-band);
    --lp-paper: var(--hub-white);
    --lp-ink: var(--hub-ink);
    --lp-ink-soft: var(--hub-ink2);
    --lp-line: var(--hub-line);
    --lp-font: var(--hub-sans);
    --lp-serif: var(--hub-serif);
    --lp-pink: var(--hub-cta);          /* 主CTAの塗り */
    --lp-pink-hover: var(--hub-cta-hover);
    --lp-pink-ink: var(--hub-white);    /* 主CTAの文字 */
    --lp-pink-soft: var(--hub-band);
    --lp-sage: var(--hub-teal);
    --lp-sage-deep: var(--hub-teal-deep);
    --lp-sage-soft: var(--hub-teal-tint);
    /* 各プログラムの橋渡し色（--acc / --acc-ink）は config/programs.php の accent / accent_ink を
       行の style 属性に出して渡す。ここでは定義しない */
}

/* ---- 2. ベース（program.css の body・見出しの指定を確定デザインに合わせる） ---- */
html { -webkit-text-size-adjust: 100%; }
.program-lp--index *::before,
.program-lp--index *::after { box-sizing: border-box; }
body.program-lp--index {
    font-size: 16px;
    line-height: 1.8;
    letter-spacing: 0;
    overflow-wrap: normal;
    font-feature-settings: "palt";
}
/* program.css の .program-lp h1〜h3（font-weight 600 / line-height 1.55・詳細度 0,1,1）を確定デザインの素の見出しに戻す。
   この指定は 0,1,1 なので、見出しの余白・行間・太さを個別に指定するクラスは h2.hub-h2 のように
   要素名付き（0,1,1・後読み）で書いて勝たせる */
.program-lp--index h1,
.program-lp--index h2,
.program-lp--index h3,
.program-lp--index h4 { margin: 0; font-weight: 500; line-height: inherit; }
/* sticky ヘッダーの下にアンカーの見出しが潜らないようにする（プロトタイプには無い。ヘッダー高 72px 分） */
.program-lp--index [id] { scroll-margin-top: 84px; }
.hub-inner { width: min(var(--hub-w), 100% - 48px); margin-inline: auto; }
.u-serif { font-family: var(--lp-serif); }
.hub-skip {
    position: absolute; left: -9999px; top: 0; z-index: 200;
    background: var(--hub-teal); color: var(--hub-white); padding: 10px 16px;
}
.hub-skip:focus { left: 8px; top: 8px; }

/* ---- 3. ボタン・リンク ----
   program.css の .program-lp a { color: inherit; text-decoration: none }（0,1,1）に負けないよう、
   a 要素付き（0,1,1・後読みで勝つ）と擬似クラス（0,2,1）で色と下線を明示する */
.hub-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .5em;
    min-height: 48px; padding: 0 28px; border-radius: 999px;
    font-weight: 700; font-size: 15px; line-height: 1.3; text-decoration: none;
    transition: background .2s, color .2s, border-color .2s;
}
a.hub-btn--primary,
a.hub-btn--primary:link,
a.hub-btn--primary:visited,
a.hub-btn--primary:focus,
a.hub-btn--primary:active { background: var(--lp-pink); color: var(--lp-pink-ink); border: 1px solid var(--lp-pink); text-decoration: none; }
a.hub-btn--primary:hover,
a.hub-btn--primary:focus-visible { background: var(--lp-pink-hover); border-color: var(--lp-pink-hover); color: var(--lp-pink-ink); }
a.hub-btn--ghost,
a.hub-btn--ghost:link,
a.hub-btn--ghost:visited { background: transparent; color: var(--lp-ink); border: 1px solid var(--lp-ink); text-decoration: none; }
a.hub-btn--ghost:hover,
a.hub-btn--ghost:focus-visible { background: var(--lp-ink); color: var(--lp-paper); }
a.hub-btn--sm { min-height: 40px; padding: 0 20px; font-size: 14px; }
a.hub-textlink,
a.hub-textlink:link,
a.hub-textlink:visited,
a.hub-textlink:focus,
a.hub-textlink:active {
    color: var(--lp-ink);
    text-decoration: underline;
    text-underline-offset: .25em;
    text-decoration-color: var(--hub-teal);
    text-decoration-thickness: 1px;
}
a.hub-textlink:hover,
a.hub-textlink:focus-visible { color: var(--hub-teal-deep); }

/* ---- 4. ヘッダー --------------------------------------------- */
.hub-header {
    position: sticky; top: 0; z-index: 20;
    background: rgba(251, 249, 245, .94);
    backdrop-filter: blur(6px);
    border-bottom: 1px solid var(--lp-line);
}
.hub-header__inner { display: flex; align-items: center; gap: 32px; min-height: 72px; }
.hub-brand { display: flex; flex-direction: column; gap: 2px; text-decoration: none; flex: none; }
.hub-brand img { width: 164px; height: auto; }
.hub-brand__tagline { font-size: 11px; letter-spacing: .06em; color: var(--lp-ink-soft); }
.hub-nav { display: flex; gap: 28px; margin-left: auto; font-size: 14px; }
.hub-nav a { text-decoration: none; color: var(--lp-ink-soft); }
.hub-nav a:hover { color: var(--lp-ink); }
.hub-header__cta { flex: none; }
@media (max-width: 900px) {
    .hub-nav { display: none; }
    .hub-header__inner { min-height: 60px; gap: 16px; }
    .hub-brand img { width: 140px; }
    .hub-header__cta { margin-left: auto; }
}

/* ---- 5. セクション共通 --------------------------------------- */
.hub-section { padding-block: 88px; }
.hub-section--band { background: var(--lp-bg-deep); }
.hub-section__head { margin-bottom: 40px; }
h2.hub-h2 { font-family: var(--lp-serif); font-size: 32px; line-height: 1.4; letter-spacing: .02em; }
.hub-lead { margin-top: 12px; color: var(--lp-ink-soft); font-size: 15px; }
.hub-eyebrow { font-size: 12px; letter-spacing: .14em; color: var(--hub-teal); margin-bottom: 12px; }
/* 見出し上の小さなルール */
.hub-orn { width: 28px; height: 2px; background: var(--hub-teal); margin-bottom: 18px; }
/* program.css の #faq（IDセレクタ・PC幅で padding 72px 0）に負けないようにする。
   ページ内アンカーは確定デザインどおり #faq を使うため、ここで余白を .hub-section と同じ値に戻す */
.program-lp--index #faq { padding-block: 88px; }
@media (max-width: 640px) {
    .hub-section,
    .program-lp--index #faq { padding-block: 56px; }
    h2.hub-h2 { font-size: 24px; }
}

/* ---- 6. 窓（ページ共通モチーフ） ----
   上辺が半円アーチ、下2角が16px。写真はすべてこの形で切り抜く（4:5の箱で上辺が半円になる） */
.hub-arch {
    position: relative; overflow: hidden;
    background: var(--lp-bg-deep);
    border-radius: 50% 50% 16px 16px / var(--arch-top, 40%) var(--arch-top, 40%) 16px 16px;
}
.hub-arch img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* FVだけ、12px外側に同じ形のティールの線を1本 */
.hub-arch--lined { overflow: visible; }
.hub-arch--lined::before {
    content: ""; position: absolute; inset: -12px;
    border: 1px solid var(--hub-teal); opacity: .4;
    border-radius: 50% 50% 24px 24px / var(--arch-top-outer, 40%) var(--arch-top-outer, 40%) 24px 24px;
    pointer-events: none;
}
/* 写真が矩形でも透過済みでも成立するよう、img 自身を窓形に切り抜き、少し拡大して透過の縁を隠す */
.hub-arch--lined > img { border-radius: inherit; transform: scale(1.05); }

/* ---- 7. FV ---------------------------------------------------- */
.hub-fv { padding-block: 56px 72px; overflow: hidden; }
.hub-fv__grid { display: grid; grid-template-columns: 1fr 440px; column-gap: 80px; align-items: center; }
.hub-fv__copy { font-family: var(--lp-serif); font-size: 40px; line-height: 1.5; letter-spacing: .02em; font-weight: 500; }
h1.hub-fv__h1 { margin-top: 22px; font-family: var(--lp-serif); font-size: 24px; line-height: 1.5; letter-spacing: .04em; font-weight: 500; }
.hub-fv__sub { margin-top: 12px; font-size: 16px; line-height: 1.8; color: var(--lp-ink-soft); max-width: 30em; }
.hub-fv__cta { margin-top: 32px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.hub-fv__cta .hub-btn { min-height: 54px; padding: 0 36px; font-size: 16px; }
.hub-fv__trust { margin-top: 18px; font-size: 13px; line-height: 1.8; color: var(--lp-ink-soft); max-width: 34em; }
.hub-fv__visual {
    --arch-top: 40%; --arch-top-outer: 40%;
    aspect-ratio: 4 / 5; width: 100%; justify-self: end;
    animation: hubFvIn 1s cubic-bezier(.2, .7, .2, 1) both;
}
@keyframes hubFvIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .hub-fv__visual { animation: none; } }
@media (max-width: 900px) {
    .hub-fv { padding-block: 36px 48px; }
    .hub-fv__grid { grid-template-columns: 1fr; row-gap: 32px; }
    .hub-fv__visual { order: -1; width: min(100%, 360px); justify-self: center; }
    .hub-fv__copy { font-size: 32px; }
}
@media (max-width: 640px) {
    .hub-fv__copy { font-size: 26px; line-height: 1.55; letter-spacing: 0; }
    h1.hub-fv__h1 { font-size: 19px; margin-top: 16px; }
    .hub-fv__sub { font-size: 15px; }
    .hub-fv__visual { width: min(100%, 300px); }
    .hub-fv__cta { margin-top: 24px; }
    .hub-fv__cta .hub-btn { width: 100%; }
}

/* ---- 8. 2画面目: 定義と事実（帯） ------------------------------ */
.hub-def { background: var(--lp-bg-deep); padding-block: 48px; border-top: 1px solid var(--lp-line); border-bottom: 1px solid var(--lp-line); }
.hub-def__text { max-width: 52em; font-size: 15px; line-height: 1.9; color: var(--lp-ink); }
.hub-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 24px 0 0; }
/* dt/dd のUAマージン（dd の左40px）を必ず0にする。「項目｜値」の横並びが崩れる原因になる */
.hub-facts dt,
.hub-facts dd { margin: 0; padding: 0; }
.hub-fact { background: var(--lp-paper); border: 1px solid var(--lp-line); border-radius: 10px; padding: 12px 16px; display: flex; gap: 12px; align-items: baseline; }
.hub-fact__k { flex: none; width: 5.5em; font-size: 12px; letter-spacing: .06em; color: var(--lp-ink-soft); }
.hub-fact__v { font-size: 14px; font-weight: 700; line-height: 1.5; }
.hub-def__alt { margin-top: 18px; font-size: 14px; }
@media (max-width: 1000px) { .hub-facts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
    .hub-def { padding-block: 32px; }
    .hub-def__text { font-size: 14px; }
    .hub-facts { grid-template-columns: 1fr; gap: 8px; }
    .hub-fact { padding: 10px 14px; }
    .hub-fact__v { font-size: 13px; }
}

/* ---- 9. プログラム一覧（カードではなく横罫で区切る行） ------------ */
.hub-group { margin-top: 48px; }
.hub-group:first-of-type { margin-top: 0; }
.hub-group__title {
    font-family: var(--lp-serif); font-size: 20px; letter-spacing: .04em;
    padding-bottom: 14px; border-bottom: 1px solid var(--lp-ink);
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px;
}
.hub-group__count { font-family: var(--lp-font); font-size: 12px; color: var(--lp-ink-soft); letter-spacing: .06em; }
.hub-row {
    display: grid;
    grid-template-columns: 168px 1fr 232px;
    grid-template-areas: "thumb head actions" "thumb body actions";
    column-gap: 36px; row-gap: 0;
    padding: 36px 0; border-bottom: 1px solid var(--lp-line);
}
.hub-row__thumb { grid-area: thumb; aspect-ratio: 4 / 5; --arch-top: 40%; align-self: start; }
.hub-row__head { grid-area: head; }
.hub-row__body { grid-area: body; }
.hub-row__actions { grid-area: actions; }
.hub-row__meta { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--lp-ink-soft); }
/* テーマチップ。色は行の style 属性（--acc / --acc-ink）から受け取る */
.hub-tag {
    display: inline-block; white-space: nowrap; padding: 3px 10px; border-radius: 4px;
    font-size: 12px; font-weight: 700; letter-spacing: .04em; line-height: 1.5;
    background: var(--acc); color: var(--acc-ink);
}
h4.hub-row__title { margin-top: 10px; font-family: var(--lp-serif); font-size: 24px; line-height: 1.45; letter-spacing: .01em; }
.hub-row__title a { text-decoration: none; color: var(--lp-ink); }
.hub-row__title a:hover { text-decoration: underline; text-underline-offset: .2em; }
.hub-row__for { margin-top: 8px; font-size: 15px; color: var(--lp-ink); }
.hub-row__spec { margin-top: 4px; font-size: 13px; color: var(--lp-ink-soft); }
.hub-price { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.hub-price__k { font-size: 14px; color: var(--lp-ink); }
.hub-price__v { font-size: 26px; font-weight: 700; line-height: 1.2; letter-spacing: .01em; }
.hub-price__tax { font-size: 13px; color: var(--lp-ink-soft); }
.hub-row__total { margin-top: 6px; font-size: 13px; line-height: 1.7; color: var(--lp-ink-soft); }
.hub-row__total b { font-weight: 500; color: var(--lp-ink); }
.hub-row__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding-top: 4px; }
.hub-row__actions .hub-btn { width: 100%; }
.hub-row__actions .hub-textlink { font-size: 14px; align-self: center; }
@media (max-width: 900px) {
    .hub-row {
        grid-template-columns: 104px 1fr;
        grid-template-areas: "thumb head" "body body" "actions actions";
        column-gap: 18px; row-gap: 16px; padding: 28px 0;
    }
    .hub-row__thumb { width: 104px; }
    .hub-row__head { align-self: center; }
    .hub-row__meta { flex-direction: column; align-items: flex-start; gap: 6px; }
    h4.hub-row__title { margin-top: 8px; font-size: 19px; }
    .hub-row__actions { flex-direction: row; align-items: center; gap: 20px; padding-top: 0; }
    .hub-row__actions .hub-btn { width: auto; }
}
@media (max-width: 640px) {
    h4.hub-row__title { font-size: 20px; }
    .hub-price__v { font-size: 24px; }
    .hub-row__actions { flex-direction: column; align-items: stretch; gap: 12px; }
    .hub-row__actions .hub-btn { width: 100%; }
}
.hub-list__note { margin-top: 28px; font-size: 13px; color: var(--lp-ink-soft); }

/* ---- 10. 比較表と自己選別 ------------------------------------- */
.hub-table { width: 100%; border-collapse: collapse; font-size: 15px; background: var(--lp-paper); border: 1px solid var(--lp-line); }
.hub-table th,
.hub-table td { padding: 14px 18px; border-bottom: 1px solid var(--lp-line); vertical-align: top; text-align: left; line-height: 1.7; }
.hub-table thead th { background: var(--lp-bg-deep); font-weight: 700; font-size: 14px; }
.hub-table tbody th { width: 20%; font-weight: 700; background: var(--lp-bg-deep); font-size: 14px; }
.hub-table td { width: 40%; }
.hub-table td:last-child { font-weight: 500; }
.hub-table tr:last-child th,
.hub-table tr:last-child td { border-bottom: 0; }
.hub-table__caption { caption-side: top; text-align: left; font-size: 13px; color: var(--lp-ink-soft); padding-bottom: 10px; }
.hub-table__note { margin-top: 14px; font-size: 13px; color: var(--lp-ink-soft); }
@media (max-width: 640px) {
    /* thead は視覚的に隠し、各セルの data-col（「通常」「プログラム」）を見出し代わりに出して縦積みにする */
    .hub-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .hub-table,
    .hub-table tbody,
    .hub-table tr,
    .hub-table th,
    .hub-table td,
    .hub-table caption { display: block; width: 100%; }
    .hub-table tr { border-bottom: 1px solid var(--lp-line); }
    /* PC用の width:20% に勝つよう詳細度を上げる */
    .program-lp--index .hub-table tbody th { width: 100%; border-bottom: 0; padding: 12px 16px 4px; }
    .program-lp--index .hub-table td {
        width: 100%; border-bottom: 0; padding: 6px 16px;
        display: grid; grid-template-columns: 5.5em 1fr; gap: 10px; font-size: 14px;
    }
    .hub-table td::before { content: attr(data-col); font-size: 12px; color: var(--lp-ink-soft); padding-top: 2px; }
    .program-lp--index .hub-table td:last-child { padding-bottom: 14px; }
}
.hub-choose { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 36px; }
.hub-choose__card { background: var(--lp-paper); border: 1px solid var(--lp-line); border-radius: 12px; padding: 28px 28px 24px; }
h3.hub-choose__title { font-size: 17px; font-weight: 700; }
.hub-choose__list { margin-top: 12px; font-size: 15px; }
.hub-choose__list li { padding-left: 1.2em; text-indent: -1.2em; line-height: 1.8; }
.hub-choose__list li::before { content: "・"; }
.hub-choose__link { margin-top: 14px; font-size: 14px; }
.hub-choose__note { margin-top: 12px; font-size: 12px; color: var(--lp-ink-soft); line-height: 1.7; }
@media (max-width: 760px) { .hub-choose { grid-template-columns: 1fr; } }

/* ---- 11. 料金と流れ ------------------------------------------- */
.hub-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.hub-step { background: var(--lp-paper); border: 1px solid var(--lp-line); border-radius: 12px; padding: 28px; }
.hub-step__no { font-size: 12px; letter-spacing: .16em; color: var(--hub-teal); }
h3.hub-step__title { margin-top: 6px; font-family: var(--lp-serif); font-size: 22px; }
.hub-step__price { margin-top: 8px; font-size: 17px; font-weight: 700; }
.hub-step__price small { display: block; font-weight: 400; font-size: 13px; color: var(--lp-ink-soft); }
.hub-step__desc { margin-top: 10px; font-size: 14px; color: var(--lp-ink-soft); }
.hub-flow { margin-top: 48px; }
h3.hub-flow__title { font-size: 18px; font-weight: 700; }
.hub-flow__list { margin-top: 16px; counter-reset: n; }
.hub-flow__list li { display: grid; grid-template-columns: 32px 1fr; gap: 14px; align-items: start; padding: 10px 0; font-size: 15px; }
.hub-flow__list li::before {
    counter-increment: n; content: counter(n);
    width: 32px; height: 32px; border-radius: 50%;
    background: var(--lp-paper); border: 1px solid var(--hub-teal);
    display: grid; place-items: center;
    font-size: 13px; font-weight: 700; color: var(--hub-teal-deep);
}
.hub-notes { margin-top: 24px; font-size: 13px; color: var(--lp-ink-soft); }
.hub-notes li { padding-left: 1.2em; text-indent: -1.2em; line-height: 1.8; }
.hub-notes li::before { content: "・"; }
@media (max-width: 760px) { .hub-steps { grid-template-columns: 1fr; } }

/* ---- 12. カウンセラー ----------------------------------------- */
.hub-counselors { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.hub-counselor { display: grid; grid-template-columns: 112px 1fr; gap: 24px; align-items: start; }
.hub-counselor__photo { aspect-ratio: 4 / 5; --arch-top: 40%; }
.hub-counselor__name { font-family: var(--lp-serif); font-size: 22px; }
.hub-counselor__role { font-size: 13px; color: var(--lp-ink-soft); }
.hub-counselor__list { margin-top: 12px; font-size: 14px; }
.hub-counselor__list li { padding-left: 1.2em; text-indent: -1.2em; line-height: 1.9; }
.hub-counselor__list li::before { content: "・"; }
.hub-counselor__profile { display: inline-block; margin-top: 12px; font-size: 14px; }
.hub-counselors__note { margin-top: 36px; font-size: 13px; color: var(--lp-ink-soft); }
@media (max-width: 760px) {
    .hub-counselors { grid-template-columns: 1fr; gap: 36px; }
    .hub-counselor { grid-template-columns: 88px 1fr; gap: 16px; }
}

/* ---- 13. ご利用にあたって ------------------------------------- */
.hub-terms { font-size: 15px; }
.hub-terms li { padding-left: 1.2em; text-indent: -1.2em; line-height: 1.9; padding-block: 2px; }
.hub-terms li::before { content: "・"; }

/* ---- 14. FAQ（畳まず常時表示） -------------------------------- */
.hub-faq { display: grid; gap: 28px; }
h3.hub-faq__q { display: grid; grid-template-columns: 28px 1fr; gap: 8px; font-size: 17px; font-weight: 700; line-height: 1.6; }
h3.hub-faq__q::before { content: "Q"; font-family: var(--lp-serif); font-weight: 500; color: var(--hub-teal); }
.hub-faq__a { margin-top: 8px; padding-left: 36px; font-size: 15px; color: var(--lp-ink); }
@media (max-width: 640px) { .hub-faq__a { padding-left: 0; } }

/* ---- 15. 本体へ戻る ------------------------------------------- */
.hub-return { text-align: center; padding-block: 96px; }
h2.hub-return__title { font-family: var(--lp-serif); font-size: 28px; line-height: 1.5; }
.hub-return__text { margin-top: 16px; max-width: 34em; margin-inline: auto; font-size: 15px; color: var(--lp-ink-soft); }
.hub-return__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; margin-top: 28px; font-size: 15px; }
@media (max-width: 640px) {
    .hub-return { padding-block: 64px; }
    h2.hub-return__title { font-size: 22px; }
}

/* ---- 16. フッター（LP共通の footer-nav パーシャルを hub- 接頭辞で受ける） ---- */
.hub-footer { border-top: 1px solid var(--lp-line); padding-block: 56px 32px; font-size: 13px; }
.hub-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; }
.hub-footer__brand b { display: block; font-size: 15px; margin-bottom: 10px; }
.hub-footer__brand b a { text-decoration: none; color: var(--lp-ink); }
.hub-footer__brand b a:hover { text-decoration: underline; }
.hub-footer__brand p { color: var(--lp-ink-soft); line-height: 1.9; }
.hub-footer__label { font-size: 12px; letter-spacing: .12em; color: var(--lp-ink-soft); margin-bottom: 12px; }
.hub-footer__col { display: flex; flex-direction: column; align-items: flex-start; }
.hub-footer__col a { line-height: 2.1; text-decoration: none; color: var(--lp-ink); }
.hub-footer__col a:hover { text-decoration: underline; }
.hub-footer__copy { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--lp-line); font-size: 12px; color: var(--lp-ink-soft); }
@media (max-width: 760px) { .hub-footer__grid { grid-template-columns: 1fr; gap: 28px; } }