/* ============================================================
 * Hooponopono — Aman Edition
 * Front-end stylesheet. Tokens come from theme.json; this file
 * only adds front-end specifics that block patterns rely on.
 * ============================================================ */

/* ---- BudouX fallback ---------------------------------------- */
/* While the budoux web component loads, render content as the
   raw text (preserves layout, prevents a flash of unstyled). */
budoux-ja:not(:defined) {
    display: contents;
}

/* ---- Global text-flow rules (locked 2026-05-08) ------------- */
p, h1, h2, h3, h4, li {
    overflow-wrap: break-word;
    hanging-punctuation: allow-end;
}

/* The CF7 reCAPTCHA v3 badge is position:fixed at right:-186px, so it escapes
   `body{overflow-x:hidden}` and adds a phantom horizontal scrollbar on mobile
   (the page looked "broken"). Hide the cosmetic badge; the required Google
   attribution is shown inline in the form footer instead — 2026-06-15. */
.grecaptcha-badge {
    display: none !important;
}
.cf7-recaptcha-note {
    margin-top: 18px;
    font-size: 16px;
    line-height: 1.7;
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    text-align: center;
}
.cf7-recaptcha-note a {
    color: inherit;
    text-decoration: underline;
}

.nowrap {
    white-space: nowrap;
}
/* Mobile safety: a long .nowrap phrase must never overflow the viewport.
   keep-all keeps short CJK proper nouns (ウニヒピリ・KR 等) on one line, while
   embedded spaces + overflow-wrap give long descriptive phrases
   (例: セルフアイデンティティー スルー ホ・オポノポノ) an escape valve so they
   wrap instead of forcing a horizontal scroll bar — 2026-06-15. */
@media (max-width: 600px) {
    .nowrap {
        white-space: normal;
        word-break: keep-all;
        overflow-wrap: anywhere;
    }
}

/* ---- 2 sizes only: SECTION/PAGE title = 36, everything else = 22 --------
 * Genio's rule (refined 2026-06-09): "title size (36)" = SECTION & PAGE
 * headings only (h1, h2, .sec-title, page/article/teacher titles). Card &
 * list-ITEM titles (article/video post titles .r-title/.v-title = h4,
 * お知らせ .notice-title = h3, event .tev-t = h3, .next-card h4, .brief-body
 * h3) are BODY text → 22, NOT title size. (First pass wrongly forced all
 * h1–h4 to 36, blowing up item titles on the home.) Door numbers
 * (.door-num/.num) are decorative non-headings → untouched, keep their size.
 * .door-title (home はじめての方へ) is a SECTION heading despite being an
 * h3 → 36 (Genio 2026-06-11). */
h1, h2,
.article-title, .teacher-jp, .lineage-intro h1, .sj-feature-title,
.door-title {
    font-size: 36px !important;
}
/* Unified scale (Genio 2026-06-25): 見出し 36 / 本文 22 / 小 16 / ボタン 16.
 * Headings (only) shrink to 28 on mobile; 本文・小・ボタン stay equal on PC
 * & mobile. All former in-between sizes (14/15/18/20/26 …) collapsed to
 * 22 or 16. */
@media (max-width: 600px) {
    h1, h2,
    .article-title, .teacher-jp, .lineage-intro h1, .sj-feature-title,
    .door-title {
        font-size: 28px !important;
    }
}
/* WordPress core image captions = 小 (16), not body size. They were
 * unstyled and inherited body 22 → looked oversized on movie/article
 * pages (the block Genio flagged 2026-06-25). */
.wp-element-caption,
.wp-block-image figcaption,
figure.wp-block-image figcaption {
    font-size: 16px !important;
    line-height: 1.8;
    color: var(--navy-mute);
}
h3, h4,
.notice-title, .tev-t, .next-card h4, .brief-body h3 {
    font-size: 22px !important;
}
/* Tile-card scale — SAME on every page (Genio 2026-06-11: ページごとに
 * カードのフォントが違うのは変 → home tiles = /reading/ tiles = 17/13). */
.r-title, .v-title {
    font-size: 22px !important;
    line-height: 1.7;
    letter-spacing: .04em;
}
/* Hub-page tile captions centred (Genio 2026-06-15): on the KR / teacher /
   person hub pages the section titles are centred, so the tile titles under
   each thumbnail read better centred too. The big list pages (reading / genre
   / 一覧) keep their left-aligned editorial captions — they use rh-grid--sec
   without tp-grid. */
.tp-grid .r-title,
.tp-grid .v-title {
    text-align: center;
}
.r-tag, .v-tag {
    font-size: 16px;
    letter-spacing: .22em;
    margin-bottom: 0;
}

/* ---- Aman discipline: no rounded, no shadow, no gradient ---- *
 * theme.json already disables these at the settings level, but
 * we belt-and-braces in case a third-party block reintroduces
 * any of them at the block level. */
/* (2026-06-11) The old blanket `* { box-shadow: none !important }` is
 * retired — Genio asked for dimensional tile cards. Rounded corners and
 * gradients on CONTENT remain banned via theme.json; shadows are now an
 * intentional, card-only device (see TILE TEXTURE at the end of file). */

/* ---- Image saturation filter (tonal unity) ------------------ */
.r-img,
.v-img,
.ec-img,
.t-photo img,
.inst-photo img,
.kr-photo img {
    filter: saturate(0.92);
}

/* ---- CTA pattern (.door-cta, .inline-cta, etc.) ------------- *
 * Pattern locked in design-decisions.md 2026-05-08. Hover
 * spreads the letter-spacing so the line under the link feels
 * like an exhale.
 * 2026-06-21 (Genio): CTAは役割=ボタン → 全て 16px に統一（旧22pxは本文と
 * 同サイズで主張しすぎ）。これが CTA の唯一の既定サイズ。例外を作らない。 */
.door-cta,
.ec-cta,
.inline-cta,
.kr-deeper-cta,
.brief-cta {
    display: inline-block;
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-size: 16px;
    font-weight: var(--w-base);
    color: var(--wp--preset--color--navy);
    letter-spacing: 0.14em;
    text-decoration: none;
    border-bottom: 1px solid var(--wp--preset--color--navy);
    padding-bottom: 5px;
    transition: letter-spacing 0.4s ease;
}

.door-cta:hover,
.ec-cta:hover,
.inline-cta:hover,
.kr-deeper-cta:hover,
.brief-cta:hover {
    letter-spacing: 0.22em;
}

/* Home door CTA「読む →」felt too small next to the 22px door body (Genio
   2026-06-26). Bump just the home-door CTA to 18px; other CTAs stay 16px. */
.door-cta { font-size: 18px; }

/* CTA wrappers that should center their child link */
.event-card,
.notice-more,
.readings-more,
.videos-more,
.tev-more,
.door-cta-wrap,
.detail-link,
.next-card,
.kr-message-pointer,
.kr-personal-cta-inner,
.service-back {
    text-align: center;
}

/* ---- Section alternating bands (locked 2026-05-08) ---------- */
/* Implemented at the block level via white/beige background
   color presets. This file leaves the rule documented but does
   not enforce it — the editor / patterns enforce it. */

/* ============================================================
 * Theme.json overrides (CC13 / 2026-05-15 / QA gate Day 2 #9)
 * Block theme h2 defaults letter-spacing to 0.22em globally,
 * but preview .sec-title needs roomier tracking + smaller size
 * to read as a contemplative section eyebrow.
 * ============================================================ */
.foot-news-title,
h2.foot-news-title {
    font-size: 22px !important;
}
.sec-title,
h2.sec-title {
    letter-spacing: 0.4em;
    line-height: 1.8;
    font-weight: var(--w-base);
}

/* ============================================================
 * Reading / video card image fallback (QA Day 2 #3)
 * When a post has no featured image, the .r-thumb / .v-thumb
 * container collapses. Show a beige-deep block at the 16:9
 * ratio so the card still has its visual weight.
 * ============================================================ */
.r-thumb,
.v-thumb {
    position: relative;
    aspect-ratio: 16 / 9;
    background-color: var(--wp--preset--color--beige-deep, #c6d6e4);
    overflow: hidden;
}
.r-thumb img,
.v-thumb img,
.r-thumb .wp-block-post-featured-image,
.v-thumb .wp-block-post-featured-image,
.r-thumb .wp-block-post-featured-image img,
.v-thumb .wp-block-post-featured-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0;
    filter: saturate(0.92);
}

/* ============================================================
 * Video play-button overlay (QA Day 2 #4)
 * CSS-only — no template change needed. The same SVG circle +
 * triangle as preview, rendered as a 40px badge centered in
 * the thumbnail.
 * ============================================================ */
.v-thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 40px;
    height: 40px;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='19' fill='none' stroke='%23fafafa' stroke-width='1'/%3E%3Cpath d='M16,13 L28,20 L16,27 Z' fill='%23fafafa'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* ============================================================
 * BudouX explicit module loader fallback (QA Day 2 #10)
 * The wp_head hook already injects the module script; this
 * just hides any leftover `<budoux-ja>` tags before the
 * component is defined.
 * ============================================================ */
budoux-ja {
    display: inline;
}

/* ============================================================
 * Block-template grid rules (QA v2 R1, R2, R3)
 *
 * WordPress wp:query → wp:post-template renders as:
 *   <div class="wp-block-query .readings-grid">
 *     <ul class="reading reveal wp-block-post-template">
 *       <li class="wp-block-post post-XXX reading">…</li>
 *
 * The actual grid container is the *inner* <ul>, not the outer
 * <div>. WP also adds `is-layout-flow` which sets display:flow-root.
 * Target the inner post-template directly and override.
 * ============================================================ */
/* The OUTER wp:query div carries .readings-grid, which preview.css styles
 * as a 2-col grid — with the inner <ul> as a single grid item the cards
 * collapsed to half/quarter width (Genio screenshot 2026-06-11). When the
 * query markup is present, the outer div must be a plain block and the
 * inner ul owns the grid. */
.wp-block-query.readings-grid,
.wp-block-query.videos-grid {
    display: block !important;
}
.readings-grid .wp-block-post-template,
.readings-grid > ul.wp-block-post-template {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.videos-grid .wp-block-post-template,
.videos-grid > ul.wp-block-post-template {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 40px;
    list-style: none;
    padding: 0;
    margin: 0;
}
@media (min-width: 720px) {
    .readings-grid .wp-block-post-template,
    .readings-grid > ul.wp-block-post-template {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 40px;
        row-gap: 50px;
    }
    .videos-grid .wp-block-post-template,
    .videos-grid > ul.wp-block-post-template {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 40px;
        row-gap: 50px;
    }
}

/* Catalog tile card — identical to .rh-card on /reading/ (white box,
 * hairline border). Applies to every wp:query card grid site-wide. */
.readings-grid .wp-block-post,
.videos-grid .wp-block-post {
    background: #fff;
    border: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
    padding: 10px 10px 16px;
    transition: border-color .35s ease;
}
.readings-grid .wp-block-post:hover,
.videos-grid .wp-block-post:hover {
    border-color: var(--wp--preset--color--navy, #32442f);
}
.readings-grid .wp-block-post .r-thumb,
.videos-grid .wp-block-post .v-thumb {
    margin-bottom: 12px;
}

/* Each card <li> should not show list bullet, no margin. */
.readings-grid .wp-block-post,
.videos-grid .wp-block-post {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Events list (rebuilt 2026-05-25 to match preview/index.html).
 * front-page.html now renders:
 *   <section class="tev-sec">           ← beige band wraps EVERYTHING
 *     <div class="sec-head">…</div>
 *     <div class="wp-block-query tev-list">
 *       <ul class="wp-block-post-template">
 *         <li class="wp-block-post"><div class="tev-row">  ← grid row
 *             <div class="tev-date">…</div><h3 class="tev-t"><a>…</a></h3>
 * So: neutralise the WP list wrappers, then let preview.css .tev-* drive
 * (date = Noto Serif JP, row grid collapses to 1 col on mobile). */
.tev-list .wp-block-post-template,
.tev-list > ul.wp-block-post-template {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block;
}
.tev-list .wp-block-post {
    list-style: none;
    margin: 0;
    padding: 0;
}
/* Card C (Genio 2026-06-09): single centered column — tracked date over
 * title, hairline dividers. Belt-and-braces against wp-block-group flow
 * layout setting display on the same .tev-row element. */
.tev-list .tev-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    text-align: center;
    padding: 42px 0;
    border-top: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
}
.tev-list .tev-row:last-child,
.tev-list .wp-block-post:last-child .tev-row {
    border-bottom: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
}
@media (max-width: 768px) {
    .tev-list .tev-row {
        gap: 6px;
        padding: 26px 0;
    }
}
/* post-title renders as <h3 class="tev-t"><a>…</a></h3>; inherit the size and
 * colour from preview.css .tev-t and strip the default link styling. */
.tev-t a {
    color: inherit;
    text-decoration: none;
    font: inherit;
    letter-spacing: inherit;
}
.tev-t a:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* ---- Reading hub (/reading/, patterns/reading-hub.php) -------------- *
 * Sectioned like prod sith_reading: white/beige alternating bands, cards
 * have NO dates, and every CPT section paginates with page NUMBERS
 * (1 2 3 …) — Genio 2026-06-11. */
/* Catalog density (Genio 2026-06-11 「縦に長くて見づらい」: Aman 余白は
 * トップ/はじめての方へ専用。一覧ハブは既存HP寄りの密度に — smaller type,
 * tighter bands, 4-up rows. Revert = restore the 110px/22px values. */
.rh-sec {
    background: var(--wp--preset--color--white, #fff);
    padding: 56px 0 52px;
}
.rh-sec--beige {
    background: var(--wp--preset--color--beige, #e7f1f7);
}
.rh-sec .sec-head {
    margin-bottom: 36px;
}
.rh-sec .sec-title {
    font-size: 22px !important;
    letter-spacing: .22em;
}
/* subhead tier drops to 22 on mobile (was stuck at 26 site-wide on every list
   page — caught by scripts/font_ladder_audit.py, 2026-06-16). */
@media (max-width: 600px) {
    .rh-sec .sec-title,
    .sj-reg-form-inner h2 { font-size: 22px !important; }
}
.rh-sec .r-title {
    font-size: 22px !important;
    line-height: 1.7;
    letter-spacing: .04em;
}
/* Card BOX (Genio 2026-06-11: 区切りが分からない → hairline-bordered card
 * like prod, kept Aman-flat: white card, 1px hairline, inner padding). */
.rh-grid--sec {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 32px 22px;
}
.rh-card {
    display: block;
    text-decoration: none;
    color: inherit;
    background: #fff;
    border: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
    padding: 10px 10px 16px;
    transition: border-color .35s ease;
}
.rh-card:hover {
    border-color: var(--wp--preset--color--navy, #32442f);
}
.rh-card .r-thumb {
    margin-bottom: 12px;
}
/* teacher name under the title — dates stay hidden */
.r-teacher {
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .12em;
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    margin-top: 8px;
}
/* 最新よみもの: swipe slider on ALL viewports (5 cards, peek + bar-dots) */
.rh-grid--latest {
    display: flex;
    grid-template-columns: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 30px;
    padding-bottom: 14px;
    scrollbar-width: none;
}
.rh-grid--latest::-webkit-scrollbar {
    display: none;
}
.rh-grid--latest .rh-card {
    flex: 0 0 30%;
    scroll-snap-align: center;
}
.rh-dots {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 28px;
}
.rh-dot {
    width: 26px;
    height: 14px;
    padding: 6px 0;
    background: none;
    border: none;
    cursor: pointer;
    position: relative;
}
.rh-dot::after {
    content: "";
    display: block;
    height: 2px;
    background: var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
    transition: background .3s ease;
}
.rh-dot.on::after {
    background: var(--wp--preset--color--navy, #32442f);
}
.rh-pages {
    text-align: center;
    margin-top: 36px;
    display: flex;
    justify-content: center;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 8px 22px;
}
.rh-page {
    background: none;
    border: none;
    border-radius: 0;
    padding: 2px 2px 6px;
    cursor: pointer;
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .08em;
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    border-bottom: 1px solid transparent;
    transition: color .3s ease;
}
.rh-page:hover {
    color: var(--wp--preset--color--navy, #32442f);
}
.rh-page.on {
    color: var(--wp--preset--color--navy, #32442f);
    border-bottom-color: var(--wp--preset--color--navy, #32442f);
    cursor: default;
}
.rh-page-gap {
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    font-size: 16px;
}
/* ---- Fixed header on every page (Genio 2026-06-11) ----------------- *
 * preview.css makes .fh sticky, but block templates wrap it in
 * <header class="wp-block-template-part"> whose height equals the bar —
 * sticky can't escape its parent, so it never stuck. Stick the wrapper. */
header.wp-block-template-part {
    position: sticky;
    top: 0;
    z-index: 60;
}

/* ---- Header search overlay (虫眼鏡, Genio 2026-06-15) --------------- *
 * The .fh-search icon had no handler. Tapping it now opens this overlay
 * whose field submits to /?s= (WP search). JS toggle in functions.php. */
.fh-search-overlay {
    position: fixed;
    inset: 0;
    z-index: 70;
    display: none;
    align-items: flex-start;
    justify-content: center;
    background: rgba(50, 68, 47, .22);
}
.fh-search-overlay.open {
    display: flex;
}
.fh-search-form {
    margin-top: 14vh;
    width: min(560px, 88vw);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: #fff;
    border: 1px solid var(--wp--preset--color--hair, #c6d6e4);
}
.fh-search-form-ic {
    flex: 0 0 auto;
    color: var(--wp--preset--color--navy, #32442f);
}
.fh-search-input {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    outline: none;
    background: transparent;
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 22px;
    letter-spacing: .04em;
    color: var(--wp--preset--color--navy, #32442f);
}
.fh-search-close {
    flex: 0 0 auto;
    display: inline-flex;
    padding: 4px;
    border: 0;
    background: transparent;
    color: var(--wp--preset--color--navy, #32442f);
    cursor: pointer;
}

/* ---- Teachers list (/sith-teachers/, patterns/teachers-list.php) --- *
 * Ported from preview/teachers.html inline <style>, font-remapped to the
 * 22px discipline (no italic). Cards add conditional インタビュー/動画
 * links per teacher (Genio 2026-06-11) — no nested anchors, so the card
 * is a div wrapping a main link + a links row. */
.teachers-sec {
    background: var(--wp--preset--color--white, #fff);
    padding: 56px 0 90px;
}
.teachers-sec .sec-head {
    margin-bottom: 40px;
}
.teachers-sec .sec-title {
    font-size: 22px !important;
    letter-spacing: .22em;
}
.teachers-grid {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 60px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 60px 50px;
}
.t-card {
    text-align: center;
}
.t-card-main {
    display: block;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}
.t-photo {
    position: relative;
    aspect-ratio: 3/4;
    background: var(--wp--preset--color--beige, #e7f1f7);
    overflow: hidden;
    margin-bottom: 22px;
}
.t-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .8s ease;
    filter: saturate(.92);
}
.t-card:hover .t-photo img {
    transform: scale(1.04);
}
.t-photo .thumb-fallback {
    background: var(--wp--preset--color--beige-deep, #c6d6e4);
}
.t-photo .thumb-fallback::after {
    display: none;
}
.t-label {
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 22px;
    letter-spacing: .32em;
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    margin-bottom: 6px;
}
.t-en {
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 22px;
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    margin-bottom: 6px;
}
.t-jp .nowrap {
    white-space: normal; /* long names must wrap inside the fixed column */
}
.t-jp {
    font-size: 22px;
    letter-spacing: .1em;
    color: var(--wp--preset--color--navy, #32442f);
    line-height: 1.6;
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
}
/* simple JP-only pill buttons (square corners), side by side */
.t-links {
    margin-top: 12px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}
.t-link {
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .12em;
    color: var(--wp--preset--color--navy, #32442f);
    text-decoration: none;
    border: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
    padding: 6px 14px;
    transition: border-color .3s ease, background .3s ease;
}
.t-link:hover {
    border-color: var(--wp--preset--color--navy, #32442f);
    background: rgba(50, 68, 47, .04);
}
@media (max-width: 768px) {
    .teachers-sec {
        padding: 40px 0 80px;
    }
    .teachers-grid {
        grid-template-columns: 1fr 1fr;
        gap: 50px 24px;
        padding: 0 24px;
    }
    .t-links {
        gap: 8px;
    }
    .t-link {
        min-height: 30px;
    }
}

/* Mobile = the real audience (80%+, Genio 2026-06-11): mirror prod
 * sith_reading's phone layout — 最新よみもの swipes horizontally, every
 * other section shows a compact 2×2 card grid + numbered pagination. */
@media (max-width: 768px) {
    .rh-sec {
        padding: 44px 0 40px;
    }
    .rh-pages {
        margin-top: 28px;
        gap: 6px 14px;
    }
    /* 最新よみもの slider: one card + peek on phones */
    .rh-grid--latest {
        gap: 18px;
        padding: 0 24px 14px;
    }
    .rh-grid--latest .rh-card {
        flex: 0 0 76%;
    }
    /* per-CPT sections: 2 columns × 2 rows = the 4 posts per page */
    .rh-grid--sec {
        grid-template-columns: 1fr 1fr;
        gap: 26px 14px;
        padding: 0 20px;
    }
    .rh-grid--sec .r-thumb {
        margin-bottom: 12px;
    }
    .rh-grid--sec .r-title {
        line-height: 1.6;
        letter-spacing: .06em;
    }
    /* number buttons: comfortable touch targets */
    .rh-page {
        min-width: 44px;
        min-height: 44px;
    }
}


/* ============================================================
 * TILE TEXTURE (Genio 2026-06-11 「線で囲うだけはダサい→立体的に、
 * テクスチャー、肌色っぽく」). Warm washi-paper tile: skin-toned
 * gradient + fine grain dots + soft double shadow + hover lift.
 * Square corners stay (Aman discipline). Applies to every tile:
 * reading hub cards, home latest tiles, archive grids, teacher cards.
 * ============================================================ */
.rh-card,
.readings-grid .wp-block-post,
.videos-grid .wp-block-post,
.t-card,
.next-card,
.event-card {
    background-color: #faf5ec;
    background-image:
        radial-gradient(rgba(50, 68, 47, 0.05) 0.5px, transparent 0.6px),
        linear-gradient(155deg, #fefcf8 0%, #f8f2e8 70%, #f3ead9 100%);
    background-size: 4px 4px, 100% 100%;
    border: 1px solid rgba(118, 96, 68, 0.18);
    box-shadow:
        0 1px 2px rgba(50, 68, 47, 0.07),
        0 12px 26px -10px rgba(50, 68, 47, 0.18);
    transition: transform 0.45s ease, box-shadow 0.45s ease, border-color 0.35s ease;
}
.rh-card:hover,
.readings-grid .wp-block-post:hover,
.videos-grid .wp-block-post:hover,
.t-card:hover,
.next-card:hover,
.event-card:hover {
    transform: translateY(-4px);
    border-color: rgba(118, 96, 68, 0.34);
    box-shadow:
        0 2px 3px rgba(50, 68, 47, 0.08),
        0 20px 38px -12px rgba(50, 68, 47, 0.26);
}
.t-card {
    padding: 12px 12px 18px;
}
.t-card .t-photo {
    margin-bottom: 16px;
}
/* home latest grid: slightly tighter than the airy preview gaps */
.rh-home-grid {
    gap: 44px 50px;
}
@media (max-width: 768px) {
    .rh-home-grid {
        gap: 28px;
        padding: 0 24px;
    }
}


/* ============================================================
 * TEACHER ARCHIVE (/teachername/{slug}/ — per-teacher articles & videos)
 * ============================================================ */
.ta-head {
    text-align: center;
    padding: 56px 24px 40px;
    background: var(--wp--preset--color--white, #fff);
}
.ta-photo {
    width: 132px;
    margin: 0 auto 18px;
}
.ta-photo img {
    width: 132px;
    height: 165px;
    object-fit: cover;
    display: block;
    filter: saturate(.92);
    border: 1px solid rgba(118, 96, 68, 0.18);
    box-shadow: 0 8px 20px -8px rgba(50, 68, 47, 0.2);
}
/* who-kr-is: a calm landscape portrait of KR instead of the small portrait
   profile thumbnail used on the teacher hub pages (Genio 2026-06-15:
   mikography-62 cropped 3:2). Must sit AFTER .ta-photo img to win on equal
   specificity; border/shadow/saturate are inherited from the rule above. */
.ta-photo--landscape {
    width: 100%;
    max-width: 480px;
    margin: 0 auto 22px;
}
.ta-photo--landscape img {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
}
.ta-name {
    font-size: 22px !important;
    letter-spacing: .18em;
    color: var(--wp--preset--color--navy, #32442f);
    margin-bottom: 6px;
}
.ta-sub {
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .22em;
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    margin-bottom: 18px;
}
.ta-toggle .t-link.on {
    border-color: var(--wp--preset--color--navy, #32442f);
    background: rgba(50, 68, 47, .06);
    cursor: default;
}
.ta-list {
    padding-top: 48px;
}
/* numbered pagination (paginate_links output) — same look as .rh-page */
.ta-pages {
    margin-top: 36px;
}
.ta-pages ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 8px 18px;
}
.ta-pages .page-numbers {
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .08em;
    color: var(--wp--preset--color--navy-mute, #6b7d6c);
    text-decoration: none;
    padding: 6px 4px;
    border-bottom: 1px solid transparent;
}
.ta-pages a.page-numbers:hover {
    color: var(--wp--preset--color--navy, #32442f);
}
.ta-pages .page-numbers.current {
    color: var(--wp--preset--color--navy, #32442f);
    border-bottom-color: var(--wp--preset--color--navy, #32442f);
}


/* ============================================================
 * FOUNDER WORDS hero (home top — モーナの言葉, Genio 2026-06-18)
 * Sits above the weekly-word .hero. The quote is long, so prominence
 * comes from being first + full-bleed video + the eyebrow label, NOT
 * from a bigger font. Deeper scrim + wide line-height keep it legible.
 * height:auto lets the section grow on mobile rather than clip.
 * ============================================================ */
.hero--founder {
    height: auto;
    min-height: 100vh;
}
.hero--founder .hero-center {
    position: relative;
    inset: auto;
    min-height: 100vh;
    padding: 110px 24px;
    box-sizing: border-box;
}
/* label matches the "今週の一言" eyebrow size (.hero-week = 22px) per Genio 2026-06-18 */
.hero-founder-label {
    font-family: var(--ff-jp);
    font-weight: var(--w-base);
    font-size: 22px;
    letter-spacing: .14em;
    opacity: .82;
    margin-bottom: 30px;
}
/* body a touch smaller than the weekly quote so the attribution + scroll hint
   stay visible in one mobile viewport (Genio 2026-06-18) */
.founder-quote {
    max-width: 720px;
    font-size: 22px;
    line-height: 2.1;
    letter-spacing: .1em;
}
@media (max-width: 768px) {
    .hero--founder .hero-center { padding: 64px 18px; }
    /* keep the 22px label on one line (no mid-word wrap) on narrow screens */
    .hero-founder-label { font-size: 22px; letter-spacing: 0; margin-bottom: 18px; white-space: nowrap; }
    .founder-quote { font-size: 22px; line-height: 1.9; letter-spacing: .04em; }
    /* keep the attribution on one line under the long quote */
    .hero--founder .hero-quote-by { font-size: 16px; letter-spacing: .18em; margin-top: 22px; }
}


/* ============================================================
 * FAMOUS QUOTE block on the who-{morrnah,ihaleakala}-is pages
 * (Genio 2026-06-18). Calm beige band, centred serif, set right
 * after the bio header so it reads as the person's defining words.
 * ============================================================ */
.pp-quote-sec {
    background: var(--beige);
    padding: 110px 0 100px;
}
.pp-quote-inner {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 28px;
    text-align: center;
}
.pp-quote-eyebrow {
    font-family: var(--ff-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .3em;
    color: var(--navy-mute);
    margin-bottom: 32px;
}
.pp-quote {
    margin: 0;
    border: 0;
    padding: 0;
    text-align: left;
    font-family: var(--ff-jp);
    font-weight: var(--w-base);
    font-size: 22px;
    line-height: 2.35;
    letter-spacing: .1em;
    color: var(--navy);
}
.pp-quote-by {
    margin-top: 38px;
    font-family: var(--ff-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .24em;
    color: var(--navy-mute);
    text-align: center;
}
@media (max-width: 768px) {
    .pp-quote-sec { padding: 76px 0 68px; }
    .pp-quote-eyebrow { font-size: 16px; letter-spacing: .24em; margin-bottom: 24px; }
    .pp-quote { font-size: 22px; line-height: 2.1; letter-spacing: .06em; }
    .pp-quote-by { font-size: 16px; margin-top: 30px; }
}


/* ============================================================
 * STRAWBERRY JAM feature section (home + /event-overview/)
 * moved out of front-page.html inline style 2026-06-11.
 * ============================================================ */
.strawberry-jam-feature{background:var(--white);padding:120px 0 100px;border-top:1px solid var(--navy-thread)}
.strawberry-jam-feature-inner{max-width:720px;margin:0 auto;padding:0 24px}
.sj-feature-eyebrow{font-family:var(--ff-en);font-size:22px;letter-spacing:.26em;color:var(--navy-mute);text-align:center;margin-bottom:18px}
.sj-feature-title{font-size:36px;letter-spacing:.2em;line-height:1.6;color:var(--navy);font-family:var(--ff-jp);font-weight:var(--w-base);text-align:center;margin-bottom:36px}
.sj-feature-desc{font-size:22px;line-height:2.1;letter-spacing:.08em;color:var(--navy-soft);text-align:left;margin-bottom:18px}
.sj-feature-desc:last-of-type{margin-bottom:0}
.sj-feature-card{max-width:480px;margin:50px auto 0;text-align:center}
.sj-feature-card .ec-thumb{aspect-ratio:16/9;background:var(--beige-deep);overflow:hidden;margin-bottom:22px}
.sj-feature-card .ec-img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.sj-feature-card:hover .ec-img{transform:scale(1.04)}
.sj-feature-card{display:block;text-decoration:none;color:inherit;transition:transform .5s ease}
.sj-feature-card:hover{transform:translateY(-4px)}
.ec-meta{font-family:var(--ff-en);font-size:22px;letter-spacing:.14em;color:var(--navy-mute);margin-bottom:10px}
.sj-feature-card .ec-title{font-size:22px;letter-spacing:.12em;line-height:1.6;color:var(--navy);margin-bottom:18px;font-family:var(--ff-jp);font-weight:var(--w-base)}
.sj-archive-link{text-align:center;margin-top:34px}


/* ============================================================
 * TEACHER PROFILE (/teachers/{slug}/) — bio disclosure + session CTA
 * ============================================================ */
.tp-bio-details {
    max-width: 720px;
    margin: 26px auto 0;
    text-align: center;
}
.tp-bio-details summary {
    display: inline-block;
    cursor: pointer;
    list-style: none;
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 22px;
    letter-spacing: .14em;
    color: var(--wp--preset--color--navy, #32442f);
    border-bottom: 1px solid var(--wp--preset--color--navy, #32442f);
    padding-bottom: 5px;
    transition: letter-spacing .4s ease;
}
.tp-bio-details summary::-webkit-details-marker { display: none }
.tp-bio-details summary:hover { letter-spacing: .22em }
.tp-bio-details .tp-bio-close { display: none }
.tp-bio-details[open] .tp-bio-open { display: none }
.tp-bio-details[open] .tp-bio-close { display: inline }
.tp-bio {
    text-align: left;
    padding: 30px 24px 6px;
    font-size: 22px;
    line-height: 2.1;
    letter-spacing: .08em;
    color: var(--wp--preset--color--navy-soft, #536454);
}
.tp-bio p { margin-bottom: 22px }
.tp-bio img { display: none } /* 顔写真はヘッダーに既出 (Genio 2026-06-11) */
.tp-session { margin-top: 30px; text-align: center }


/* ============================================================
 * FILTERED LIST pages (/interviewlist/ /dougalist2/ /taikenlist/)
 * ============================================================ */
.fl-head {
    padding-bottom: 36px;
}
/* list/archive page TITLE is the page heading, not body text — bump from the
   .rh-sec subhead 22px up to the 見出し tier 36 (mobile 28). Kohei 2026-06-29:
   strawberry-jam-archive title read as body. Scoped to fl-head so section
   subheads in the reading hub stay 22. */
.fl-head .sec-title { font-size: 36px !important; }
@media (max-width: 600px) { .fl-head .sec-title { font-size: 28px !important; } }
/* optional one-paragraph intro under the list title (e.g. 書籍) — Genio 2026-06-15 */
.fl-intro {
    max-width: 680px;
    margin: 18px auto 0;
    padding: 0 24px;
    /* body intro = left-aligned per the 本文左寄せ rule (Genio 2026-06-26: list/archive
       intros like strawberry-jam-archive read as body, not a centered title). */
    text-align: left;
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 22px; line-height: 2.0; letter-spacing: .06em;
    color: var(--navy-soft);
}
/* Strawberry Jam archive: Vol.N title + アイリーンの要約 under each tile, no
   filter chips (Genio 2026-06-16). Summary is clamped so cards stay even on a
   3-up / 2-up grid; tap opens the individual video page. */
.rh-card--summary { display: flex; flex-direction: column; }
.rh-card--summary .v-title { margin-top: 14px; }
.v-summary {
    margin: 10px 0 2px;
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 16px; line-height: 1.9; letter-spacing: .03em;
    color: var(--navy-soft);
    text-align: left;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (max-width: 600px) {
    .v-summary { font-size: 16px; line-height: 1.85; -webkit-line-clamp: 4; }
}

/* Strawberry Jam archive — hero band + premium 2-up cards (Genio 2026-06-16:
   make it match/beat the existing page). Hero ships as a theme asset so the
   same URL works across staging + all language installs. */
.fl-hero { background: var(--white); }
.fl-hero-inner { max-width: 1040px; margin: 0 auto; padding: 44px 24px 0; }
.fl-hero-img {
    width: 100%; height: auto; display: block;
    aspect-ratio: 16 / 9; object-fit: cover;
    filter: saturate(.92);
    border: 1px solid var(--navy-thread);
}
.rh-grid--sec.fl-grid--sj {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 44px 36px;
    max-width: 1040px;
    margin-left: auto; margin-right: auto;
}
.fl-grid--sj .rh-card {
    padding: 18px 20px 26px;
    background: var(--white);
    transition: border-color .45s ease, transform .45s ease;
}
.fl-grid--sj .rh-card:hover {
    border-color: var(--navy);
    transform: translateY(-3px);
}
.fl-grid--sj .v-thumb { margin-bottom: 0; background: var(--beige-deep); }
/* hairline rule between the thumbnail and the Vol/title block */
.fl-grid--sj .v-title {
    font-size: 22px !important;
    margin-top: 0;
    padding-top: 20px;
    text-align: left;
    line-height: 1.6;
    border-top: 1px solid var(--navy-thread);
}
.fl-grid--sj .v-summary { font-size: 16px; -webkit-line-clamp: 4; margin-top: 14px; }
@media (max-width: 720px) {
    .rh-grid--sec.fl-grid--sj { grid-template-columns: 1fr; gap: 30px; }
}
@media (max-width: 600px) {
    .fl-hero-inner { padding: 22px 16px 0; }
    .fl-grid--sj .rh-card { padding: 14px 16px 22px; }
    .fl-grid--sj .v-title { font-size: 22px !important; padding-top: 16px; }
    .fl-grid--sj .v-summary { font-size: 16px; }
}

/* ============================================================= *
 * Strawberry Jam registration (single-strawberry-jam) — paid
 * per-event signup landing. Hero + editorial body (legacy pink
 * round buttons normalised to the new palette) + form at #form.
 * (Genio 2026-06-16: 🅑 application form, build clear & cool.)
 * ============================================================= */
.sj-reg-hero { background: var(--white); }
.sj-reg-hero-inner { max-width: 920px; margin: 0 auto; padding: 8px 24px 0; }
.sj-reg-hero-img {
    width: 100%; height: auto; display: block;
    aspect-ratio: 16 / 9; object-fit: cover; filter: saturate(.94);
}
.sj-reg { background: var(--white); padding: 40px 0 56px; }
/* Genio 2026-06-18: long WWA / SJ / seminar-fallback bodies were one centred
   wall of 22px text. Read them as a document — left-aligned body, centred
   section headings with clear separation + a short rule, tidy lists. */
.sj-reg-inner { max-width: 680px; margin: 0 auto; padding: 0 24px; text-align: left; }
.sj-reg-inner p {
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 22px; line-height: 2.05; letter-spacing: .04em;
    color: var(--navy-soft); margin: 0 0 18px; text-align: left;
}
.sj-reg-inner h2 {
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 22px; letter-spacing: .16em; line-height: 1.5;
    color: var(--navy); text-align: center;
    margin: 56px 0 22px; padding-bottom: 16px; position: relative;
}
.sj-reg-inner h2::after {
    content: ""; position: absolute; left: 50%; bottom: 0;
    width: 40px; height: 1px; background: var(--hair, #c6d6e4);
    transform: translateX(-50%);
}
.sj-reg-inner > h2:first-child { margin-top: 8px; }
.sj-reg-inner h3 {
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 22px; letter-spacing: .1em; color: var(--navy);
    text-align: center; margin: 36px 0 16px;
}
.sj-reg-inner ul, .sj-reg-inner ol { text-align: left; padding-left: 1.3em; margin: 0 0 18px; }
.sj-reg-inner li {
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 16px; line-height: 1.95; letter-spacing: .04em;
    color: var(--navy-soft); margin-bottom: 8px;
}
.sj-reg-inner a { color: var(--navy); }
/* top CTA jumping to the form, shown above the body (クラス同様 — Genio). */
.sj-reg-cta { background: var(--white); text-align: center; padding: 8px 0 0; }
.sj-reg-cta .tp-session-btn { padding: 13px 30px; }
/* normalise the legacy is-style-round / pink inline buttons to the Aman palette */
.sj-reg .wp-block-buttons {
    gap: 16px; margin-top: 36px;
    justify-content: center;
    flex-direction: column; align-items: center;
}
.sj-reg .wp-block-button { width: 100%; max-width: 340px; }
.sj-reg .wp-block-button__link {
    display: block; width: 100%;
    background-color: var(--navy) !important;
    color: #fff !important;
    border: 1px solid var(--navy) !important;
    border-radius: 0 !important;
    font-family: var(--ff-jp) !important;
    font-weight: var(--w-base) !important;
    font-size: 16px !important;
    letter-spacing: .16em;
    padding: 16px 34px !important;
    transition: background-color .35s ease, color .35s ease, letter-spacing .35s ease;
}
.sj-reg .wp-block-button:nth-child(n+2) .wp-block-button__link,
.sj-reg .wp-block-buttons:nth-of-type(n+2) .wp-block-button__link {
    background-color: transparent !important;
    color: var(--navy) !important;
}
.sj-reg .wp-block-button__link:hover {
    background-color: var(--navy-soft) !important;
    color: #fff !important;
    border-color: var(--navy-soft) !important;
    letter-spacing: .22em;
}
.sj-reg-form { background: var(--beige); padding: 72px 0 90px; scroll-margin-top: 80px; }
.sj-reg-form-inner { max-width: 680px; margin: 0 auto; padding: 0 24px; text-align: center; }
.sj-reg-form-inner h2 { font-size: 22px !important; letter-spacing: .18em; margin-bottom: 14px; }
.sj-reg-form-note {
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 16px; line-height: 1.95; letter-spacing: .04em;
    color: var(--navy-soft); margin-bottom: 36px; text-align: left;
}
/* the form itself sits on a hairline-framed white panel for a premium,
   contained feel against the beige section */
.sj-reg-form .contact-form-embed {
    background: var(--white);
    border: 1px solid var(--navy-thread);
    padding: 48px 44px;
    text-align: left;
}
/* SJ 登壇者（案A・固定セクション・beige 帯：intro(白)→登壇者(beige)→流れ(白)→form(beige)）*/
.sj-interp { color: var(--navy-soft); border-top: 1px solid var(--navy-thread); padding-top: 18px; margin-top: 22px; }
.sj-speakers { background: var(--beige); padding: 64px 0 72px; }
.sj-speakers-inner { max-width: 880px; margin: 0 auto; padding: 0 24px; }
.sj-speakers > .sj-speakers-inner > h2 {
    text-align: center; font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 22px; letter-spacing: .18em; color: var(--navy); margin: 0 0 44px;
}
.sj-speaker { display: grid; grid-template-columns: 200px 1fr; gap: 36px; align-items: start; }
.sj-speaker + .sj-speaker { margin-top: 52px; }
.sj-speaker-photo { aspect-ratio: 3/4; overflow: hidden; background: var(--beige-deep); filter: saturate(0.92) sepia(0.10); }
.sj-speaker-photo img { width: 100%; height: 100%; object-fit: cover; }
.sj-speaker-body h3 {
    font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 22px;
    letter-spacing: .08em; color: var(--navy); margin: 0 0 18px; text-align: left;
}
.sj-speaker-body p {
    font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px;
    line-height: 1.95; letter-spacing: .04em; color: var(--navy-soft);
    text-align: left; margin: 0 0 16px;
}
.sj-speaker-sign { color: var(--navy); letter-spacing: .12em; }
@media (max-width: 600px) {
    .sj-reg { padding: 28px 0 40px; }
    .sj-reg-inner p { font-size: 16px; }
    .sj-reg-inner h2 { font-size: 22px; margin-top: 44px; }
    .sj-reg-form { padding: 48px 0 64px; }
    .sj-reg-form .contact-form-embed { padding: 32px 22px; }
    .sj-speakers { padding: 44px 0 52px; }
    .sj-speakers > .sj-speakers-inner > h2 { font-size: 22px; margin-bottom: 32px; }
    .sj-speaker { grid-template-columns: 1fr; gap: 22px; }
    .sj-speaker-photo { max-width: 220px; margin: 0 auto; }
    .sj-speaker + .sj-speaker { margin-top: 40px; }
}

.fl-filter {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 24px;
    justify-content: center;
}
.fl-filter .t-link {
    cursor: pointer;
    background: none;
}
.fl-filter .t-link.on {
    border-color: var(--wp--preset--color--navy, #32442f);
    background: rgba(50, 68, 47, .06);
}
.fl-list {
    padding-top: 48px;
}
/* PC: chips visible, toggle hidden */
.fl-filter-toggle {
    display: none;
}
@media (max-width: 768px) {
    /* mobile: a single quiet disclosure button instead of the chip wall
       (Genio 2026-06-11 携帯でやばい) */
    .fl-filter-toggle {
        display: flex;
        align-items: baseline;
        gap: 10px;
        margin: 0 auto;
        max-width: calc(100% - 48px);
        width: 100%;
        justify-content: center;
        background: #fff;
        border: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
        padding: 14px 18px;
        font-family: var(--wp--preset--font-family--noto-serif-jp);
        font-weight: var(--w-base);
        
        letter-spacing: .14em;
        color: var(--wp--preset--color--navy, #32442f);
        cursor: pointer;
    }
    .fl-ft-label {
        color: var(--wp--preset--color--navy-mute, #6b7d6c);
    }
    .fl-ft-current {
        max-width: 11em;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .fl-ft-caret {
        transition: transform .3s ease;
    }
    .fl-filter-toggle.open .fl-ft-caret {
        transform: rotate(180deg);
    }
    .fl-filter {
        display: none;
    }
    .fl-filter.open {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        max-width: calc(100% - 48px);
        margin: 0 auto;
        border: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
        border-top: 0;
        background: #fff;
    }
    .fl-filter.open .t-link {
        border: 0;
        border-bottom: 1px solid var(--wp--preset--color--navy-thread, rgba(50, 68, 47, 0.12));
        padding: 13px 18px;
        text-align: left;
        
        background: none;
    }
    .fl-filter.open .t-link:last-child {
        border-bottom: 0;
    }
    .fl-filter.open .t-link.on {
        background: rgba(50, 68, 47, .05);
        border-left: 2px solid var(--wp--preset--color--navy, #32442f);
    }
}


/* compact filled session button (Genio 2026-06-11: CTA was too big) */
.tp-session { margin-top: 18px; text-align: center }
.tp-session-btn {
    display: inline-block;
    font-family: var(--wp--preset--font-family--noto-serif-jp);
    font-weight: var(--w-base);
    font-size: 16px;
    letter-spacing: .18em;
    color: #fdfcf8;
    background: var(--wp--preset--color--navy, #32442f);
    border: 1px solid var(--wp--preset--color--navy, #32442f);
    padding: 9px 22px;
    text-decoration: none;
    transition: background .3s ease, letter-spacing .3s ease;
}
.tp-session-btn:hover {
    background: #44583f;
    letter-spacing: .24em;
}
/* Stacked CTAs on who-kr-is, under the 個人セッション button.
   --seminar = KR講演会を申し込む — secondary (ghost), shown only while a seminar
   is published (Genio 2026-06-18). */
.tp-session-btn--seminar {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin: 14px auto 0;
    background: transparent;
    color: var(--wp--preset--color--navy, #32442f);
}
.tp-session-btn--seminar:hover {
    background: var(--wp--preset--color--navy, #32442f);
    color: #fdfcf8;
}
/* --service = 遠隔ボディーワーク / ランドクリーニング を申し込む — same green fill
   as 個人セッション (Genio 2026-06-26: 3つとも緑に), just stacked below it.
   Inherits background/color/hover from the base .tp-session-btn. */
.tp-session-btn--service {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin: 14px auto 0;
}
.tp-bio {
    max-width: 720px;
    margin: 26px auto 0;
}


/* Bio pull-quote: the source content highlights key messages with a
 * magenta <mark> (Genio 2026-06-11: ピンクは合わない). Re-dress them as a
 * centered statement between hairlines — same serif, wider tracking. */
.tp-bio mark,
.tp-bio .has-inline-color {
    background: none !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
    display: block;
    text-align: center;
    font-size: 22px;
    letter-spacing: .16em;
    line-height: 2;
    padding: 22px 8px;
    margin: 26px 0;
    border-top: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
    border-bottom: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
}


/* ============================================================
 * SINGLE ARTICLE polish (Genio 2026-06-11) — no dates, unified
 * type, visible content links, washi-dressed rec block.
 * ============================================================ */
/* content links must be VISIBLE (some were styled away by old content) */
.article-body p a:not([class]),
.article-body li a:not([class]) {
    color: var(--wp--preset--color--navy, #32442f) !important;
    text-decoration: none;
    border-bottom: 1px solid var(--wp--preset--color--navy, #32442f);
    padding-bottom: 2px;
    transition: opacity .3s ease;
}
.article-body p a:not([class]):hover,
.article-body li a:not([class]):hover {
    opacity: .7;
}
/* wp-block-cover 内のリストは inner-container が padding-left:0 のため marker が枠外に
   はみ出る。cover 内のリストだけインデントを与えて枠内に収める（Kohei 2026-06-29）。
   通常フローのリスト（class ページ等）は default のままにして余計な右シフトを防ぐ。 */
.article-body .wp-block-cover .wp-block-list,
.entry-content .wp-block-cover .wp-block-list {
    padding-left: 1.6em;
}

/* ===== 記事の装飾ツールキット（Genio/CCKK 2026-06-29・引き算ベース）=====
   新しい文字は増やさず、既存テキストを上品に見せる。新聞的な棒組みを脱する。 */
/* リード段落: 導入を少し大きく、ゆとりを持って */
.article-body p.is-lead, .entry-content p.is-lead {
    font-size: 25px !important; line-height: 2.15; letter-spacing: .06em;
    color: var(--navy); margin-bottom: 38px;
}
@media (max-width: 768px) { .article-body p.is-lead, .entry-content p.is-lead { font-size: 22px !important; } }
/* 傍点（圏点）= 日本語の軽い強調（斜体は日本語に効かないのでこちらが正解） */
.article-body .bouten, .entry-content .bouten {
    -webkit-text-emphasis: filled dot; text-emphasis: filled dot;
    -webkit-text-emphasis-color: var(--navy); text-emphasis-color: var(--navy);
    -webkit-text-emphasis-position: over right; text-emphasis-position: over right;
    font-style: normal;
}
/* 強い強調 = 明朝の太字（ゴシック切替なし・1段落1〜2語まで） */
.article-body strong, .entry-content strong { font-weight: 600; color: var(--navy); }
/* pull quote 見せ場（1記事1〜2個）: 上下の細い罫＋中央、引用符は出さない */
.article-body .wp-block-pullquote, .entry-content .wp-block-pullquote {
    border: 0; border-top: 1px solid var(--hair, #c6d6e4); border-bottom: 1px solid var(--hair, #c6d6e4);
    margin: 52px auto; padding: 40px 24px; max-width: 720px; text-align: center; background: none;
}
.article-body .wp-block-pullquote p, .entry-content .wp-block-pullquote p {
    font-size: 26px !important; line-height: 1.95; letter-spacing: .08em; color: var(--navy); margin: 0;
}
@media (max-width: 768px) { .article-body .wp-block-pullquote p, .entry-content .wp-block-pullquote p { font-size: 22px !important; } .article-body .wp-block-pullquote, .entry-content .wp-block-pullquote { padding: 32px 20px; margin: 40px auto; } }
/* インタビューの「回答ターン」差別化（Genio GO / CCKK ガードレール 2026-06-29）:
   旧来は回答段落を黄色背景にしていた（has-background クラスが残存）。インライン掃除で
   その色だけ消えてQ&Aが棒組み化したので、テーマ側で復活。淡いブランド地＋細い左罫の
   二段構えで、白地でも水色地でも"答えが静かに立つ"。ケバい黄色は不採用。
   ※ 1737 の `.article-body .has-background{…!important}`（旧バナー潰し）が !important で
     勝つため、回答地は !important で明示的に上書きする。 */
.single-interview .article-body p.has-background,
.single-interview .entry-content p.has-background {
    background-color: rgba(47, 93, 52, .07) !important;
    border-left: 2px solid rgba(47, 93, 52, .32);
    padding: 16px 22px;
    margin-block: 12px;
    border-radius: 2px;
}
/* 旧コンテンツに焼き付いた区切り線 <hr style="max-width:400px">：PC(コンテンツ672px)で
   中途半端に切れて見える（モバイル想定の固定値）。block style の意味に戻して正規化（Kohei
   2026-06-29「PCで途中で切れてる」）。is-style-default=本来の"短い中央オーナメント"／
   is-style-wide=全幅。インライン max-width に勝つため !important。 */
.article-body hr.wp-block-separator, .entry-content hr.wp-block-separator {
    border: 0 !important;
    border-top: 1px solid var(--navy-mute, rgba(47,93,52,.4)) !important;
    height: 0; opacity: 1 !important;
    margin: 44px auto !important;
}
.article-body hr.wp-block-separator.is-style-default, .entry-content hr.wp-block-separator.is-style-default,
.article-body hr.wp-block-separator:not(.is-style-wide):not(.is-style-dots),
.entry-content hr.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
    max-width: 72px !important; width: 72px;
}
.article-body hr.wp-block-separator.is-style-wide, .entry-content hr.wp-block-separator.is-style-wide {
    max-width: 100% !important; width: 100%;
}

/* 区切り（セクション間の静かなオーナメント・色でない"工夫"） */
.article-body .deco-divider, .entry-content .deco-divider {
    text-align: center; margin: 60px 0; color: var(--navy-mute, rgba(47,93,52,.55));
    letter-spacing: 1em; font-size: 13px; line-height: 1;
}
/* 内なる声（断片的な思考を静かに引く）— 中央・ゆとり・やや小さく、本文と差をつける */
.article-body .deco-voices, .entry-content .deco-voices {
    text-align: center; color: var(--navy-mute, rgba(47,93,52,.55));
    font-size: 20px !important; line-height: 2.5; letter-spacing: .12em;
    margin: 44px auto; max-width: 660px;
}
@media (max-width: 768px) { .article-body .deco-voices, .entry-content .deco-voices { font-size: 18px !important; } }
/* blockquote 引用: 斜体にしない・左に細い罫 */
.article-body blockquote.wp-block-quote, .entry-content blockquote.wp-block-quote {
    border-left: 2px solid var(--navy-mute, rgba(47,93,52,.55)); margin: 32px 0; padding: 6px 0 6px 28px;
    font-style: normal; color: var(--navy-soft);
}
/* legacy inline sizes/colors from the old builder: normalize to the scale */
.article-body p[style*="font-size"],
.article-body span[style*="font-size"]:not(.hpp-rec span) {
    font-size: 22px !important;
}
/* 旧サイトが本文に焼き付けた埋め込み <style>（.body p{font-size:17px} 等）も
   ラダー本文 22px へ正規化。PC で 17px・モバイルで 22px の不一致を解消（Kohei 2026-06-29）。
   プレーンな本文 <p>（class なし＝装飾でない段落）だけに限定し、pull quote /
   内なる声 / 注記 / question-box 等の意図的な装飾サイズには触れない。
   line-height / letter-spacing は記事の埋め込み指定をそのまま尊重する。 */
.article-body .body > p:not([class]),
.entry-content .body > p:not([class]) {
    font-size: 22px !important;
}
/* Interview「過去に行われた◯◯インタビューです」注記: 旧パイプラインが右寄せ
   ＋cyan-bluish-gray で出力していた。中央揃えに統一（Kohei 2026-06-29）。
   このクラス組合せはこの注記専用（インタビュー全CPTで他用途 0 件を確認）。
   about-* CPT は .entry-content で描画されるため両ラッパーを対象にする。 */
.article-body p.has-text-align-right.has-cyan-bluish-gray-color,
.entry-content p.has-text-align-right.has-cyan-bluish-gray-color { text-align: center; }

/* 記事ヒーロー: アイキャッチを 16:9 ボックスにフィルさせ、画像比が合わずに
   水色の背景帯が下に露出するのを防ぐ。+ ヒーロー下に 10px の余白（Kohei 2026-06-29）。 */
.article-hero .wp-block-post-featured-image { height: 100%; margin: 0; }
.article-hero .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.article-hero { margin-bottom: 10px !important; } /* WP flow-layout zeroes margin-block-end (0,1,1) → !important */

.article-body mark {
    background: none !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
    display: block;
    text-align: center;
    font-size: 22px;
    letter-spacing: .16em;
    line-height: 2;
    padding: 22px 8px;
    margin: 26px 0;
    border-top: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
    border-bottom: 1px solid var(--wp--preset--color--navy-hair, rgba(50, 68, 47, 0.22));
}

/* ---- クリーニングの旅をつづける (hpp-rec, inline-styled by the cache):
 * washi card + full-strength type. !important beats the inline styles. */
.article-body .hpp-rec {
    background-color: #faf5ec !important;
    background-image:
        radial-gradient(rgba(50, 68, 47, 0.05) 0.5px, transparent 0.6px),
        linear-gradient(155deg, #fefcf8 0%, #f8f2e8 70%, #f3ead9 100%) !important;
    background-size: 4px 4px, 100% 100% !important;
    border: 1px solid rgba(118, 96, 68, 0.18) !important;
    box-shadow:
        0 1px 2px rgba(50, 68, 47, 0.07),
        0 12px 26px -10px rgba(50, 68, 47, 0.18) !important;
    padding: 30px 26px !important;
    margin: 70px 0 40px !important;
}
.article-body .hpp-rec > p:first-child {
    font-size: 22px !important;
    letter-spacing: .2em !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
    text-align: center;
    margin-bottom: 26px !important;
}
.article-body .hpp-rec li {
    border-bottom: 1px solid rgba(50, 68, 47, 0.14) !important;
}
.article-body .hpp-rec span {
    color: var(--wp--preset--color--navy, #32442f) !important;
    font-size: 16px !important;
}
/* rec items rebuilt as ONE single-link card each (Genio 2026-06-12:
 * chip + underlined title competed; whole card = the only button) */
.article-body .hpp-rec li.hpp-rec-item {
    border-bottom: 0 !important;
    padding: 0 !important;
    margin: 0 0 12px !important;
}
.article-body .hpp-rec .hpp-rec-card {
    display: flex;
    gap: 16px;
    align-items: center;
    background: #fff;
    border: 1px solid rgba(50, 68, 47, 0.22);
    padding: 14px 16px;
    text-decoration: none;
    transition: background .3s ease, border-color .3s ease;
    /* カードは li(flex)内で内容幅に縮まず column 幅いっぱいに（Kohei 2026-06-29）。 */
    width: 100%;
    box-sizing: border-box;
}
.article-body .hpp-rec .hpp-rec-card:hover {
    border-color: var(--wp--preset--color--navy, #32442f);
    background: rgba(50, 68, 47, .04);
}
.article-body .hpp-rec .hpp-rec-thumb {
    flex: 0 0 104px;
}
.article-body .hpp-rec .hpp-rec-thumb img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
/* モバイルでは rec カード（関連記事/動画＋イベントCTA）を画像上・文章下の縦積みに。
   横並びだと画像と文章が窮屈になる（Kohei 2026-06-29）。 */
@media (max-width: 600px) {
    .article-body .hpp-rec .hpp-rec-card,
    .entry-content .hpp-rec .hpp-rec-card {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    .article-body .hpp-rec .hpp-rec-thumb,
    .entry-content .hpp-rec .hpp-rec-thumb {
        flex: none;
        width: 100%;
    }
    /* イベントCTAカード（rec の下）はインラインstyleの flex div（クラス無し）。
       こちらも画像上・文章下に縦積み（Kohei 2026-06-29）。!important で inline を上書き。 */
    .article-body .hpp-rec > div[style*="display:flex"],
    .entry-content .hpp-rec > div[style*="display:flex"] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 14px !important;
    }
    .article-body .hpp-rec > div[style*="display:flex"] > a[style*="100px"],
    .entry-content .hpp-rec > div[style*="display:flex"] > a[style*="100px"] {
        flex: none !important;
        width: 100% !important;
    }
}
.article-body .hpp-rec .hpp-rec-info {
    flex: 1;
    min-width: 0;
}
.article-body .hpp-rec .hpp-rec-label {
    display: block;
    font-size: 16px !important;
    letter-spacing: .12em;
    color: rgba(50, 68, 47, .62) !important;
    margin-bottom: 4px;
}
.article-body .hpp-rec .hpp-rec-title {
    display: block;
    font-size: 22px !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
    line-height: 1.6;
}
/* font ladder (locked 2026-06-11): 14 = labels/small buttons・small CTA,
 * 18 = tile titles, 22 = body/CTA, 26 = catalog headings, 36 = page/section
 * headings. Do NOT introduce other sizes. */
/* the teacher label is a CHIP BUTTON (Genio 2026-06-11: 下線だけでは
 * リンクと分からない) — same visual language as the teacher-page buttons */
.article-body .hpp-rec .hpp-rec-teacher,
.article-body .article-teacher-chips .hpp-rec-teacher {
    display: inline-block;
    color: var(--wp--preset--color--navy, #32442f) !important;
    text-decoration: none;
    background: #fff;
    border: 1px solid rgba(50, 68, 47, 0.3);
    padding: 3px 10px;
    margin-bottom: 4px;
    transition: background .3s ease, border-color .3s ease;
}
.article-body .hpp-rec .hpp-rec-teacher:hover,
.article-body .article-teacher-chips .hpp-rec-teacher:hover {
    border-color: var(--wp--preset--color--navy, #32442f);
    background: rgba(50, 68, 47, .05);
}
.article-body .hpp-rec a[data-pos] {
    color: var(--wp--preset--color--navy, #32442f) !important;
}
.article-body .hpp-rec li > div > a {
    font-size: 22px !important;
    line-height: 1.7 !important;
}


/* rec CTA box (次のクラスで、体感する): the cached HTML paints it palette
 * blue, which clashes inside the warm washi card — white + hairline. */
.article-body .hpp-rec > div[style*="background-color"] {
    background: #fff !important;
    border: 1px solid rgba(50, 68, 47, 0.16);
}
.article-body .hpp-rec > div[style*="background-color"] p {
    color: var(--wp--preset--color--navy, #32442f) !important;
}
.article-body .hpp-rec > div[style*="background-color"] p[style*="font-size:13px"] {
    font-size: 16px !important;
}
.article-body .hpp-rec > div[style*="background-color"] p[style*="font-size:17px"] {
    font-size: 22px !important;
}
.article-body .hpp-rec a[data-pos="class_cta"] {
    font-size: 16px !important;
}
/* 他のクラス・イベントを見る — was a faint 13px whisper */
.article-body .hpp-rec a[data-pos="event_overview"] {
    font-size: 16px !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
    border-bottom: 1px solid var(--wp--preset--color--navy, #32442f) !important;
}

/* legacy builder backgrounds in EXISTING article content (bright
 * "shopping blue" boxes etc.): force into the palette site-wide. */
.article-body .wp-block-post-content [style*="background"]:not(.hpp-rec):not(.hpp-rec *):not(mark) {
    background: var(--wp--preset--color--beige, #e7f1f7) !important;
    border-color: var(--wp--preset--color--beige-deep, #c6d6e4) !important;
}


/* Gutenberg preset colours inside EXISTING article content (vivid cyan
 * blue banners, pale cyan covers, …) — force into the palette
 * (Genio 2026-06-11 「ショッピングブルーは使ってない」). */
.article-body .has-background {
    background-color: var(--wp--preset--color--beige, #e7f1f7) !important;
}
.article-body .has-background.has-white-color {
    background-color: var(--wp--preset--color--navy, #32442f) !important;
}
/* cover の暗幕(ベージュ)を強めて、画像の上の文字(森緑)を確実に読めるようにする。
   旧 dimRatio 0.3-0.5 では花柄等の画像上で緑文字が埋もれる → 0.86 に上げて画像を
   ソフトな wash に muted（Kohei 2026-06-29「文字裏のBG画像がよみづらい」）。.entry-content
   配下の記事(interview/about-kr 等)にも効くよう両ラッパーを対象に。 */
.article-body .wp-block-cover__background,
.entry-content .wp-block-cover__background {
    background-color: var(--wp--preset--color--beige, #e7f1f7) !important;
    opacity: 0.86 !important;
}
.article-body .has-text-color:not(.has-white-color) {
    color: var(--wp--preset--color--navy, #32442f) !important;
}

/* PAIRING RULES (Genio 2026-06-12: 講演会ボタンが白文字×水色地で不可視):
 * whenever a legacy background is remapped to the light palette, the text
 * inside must come back to navy in the SAME stylesheet. White text is only
 * legitimate inside the navy box (.has-background.has-white-color). */
/* legacy Gutenberg buttons → site chip-button language (kills white-on-light
 * AND the rounded pill in one move) */
.article-body .wp-block-button__link {
    background: #fff !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
    border: 1px solid rgba(50, 68, 47, 0.3) !important;
    border-radius: 0 !important;
    text-decoration: none !important;
}
/* text inside inline-styled boxes whose bg was remapped to beige */
.article-body .wp-block-post-content [style*="background"]:not(.hpp-rec):not(.hpp-rec *):not(mark),
.article-body .wp-block-post-content [style*="background"]:not(.hpp-rec):not(.hpp-rec *):not(mark) :is(p, span, a, strong, em, li, h2, h3, h4) {
    color: var(--wp--preset--color--navy, #32442f) !important;
}
/* EXCEPTION: 旧「濃色地＋白文字」バナー見出し（#00b379 等 ＋ has-white-color）は
   bg を navy 箱に remap 済み。上の規則が中の文字(strong等)まで navy にして navy on navy で
   消えるため、navy 箱の中は白文字に固定して可読に戻す（Kohei 2026-06-29「見えない箇所」）。 */
.article-body .has-background.has-white-color,
.article-body .has-background.has-white-color :is(p, span, a, strong, em, li, h2, h3, h4, h5) {
    color: var(--wp--preset--color--white, #fff) !important;
}
/* white-preset text not sitting in the navy box */
.article-body .has-white-color:not(.has-background):not(.has-background.has-white-color *) {
    color: var(--wp--preset--color--navy, #32442f) !important;
}
/* inline white text not sitting in the navy box */
.article-body .wp-block-post-content :is([style*="color:#fff"], [style*="color: #fff"], [style*="color:#FFF"],
    [style*="color:#ffffff"], [style*="color: #ffffff"], [style*="color:#FFFFFF"], [style*="color: #FFFFFF"],
    [style*="color:white"], [style*="color: white"], [style*="color:rgb(255"], [style*="color: rgb(255"]):not(.hpp-rec *):not(.has-background.has-white-color *) {
    color: var(--wp--preset--color--navy, #32442f) !important;
}
/* cover blocks were remapped to beige — their overlay text follows */
.article-body .wp-block-cover .has-white-color,
.article-body .wp-block-cover p {
    color: var(--wp--preset--color--navy, #32442f) !important;
}
/* legacy magenta/purple accent text pasted inline in old content (the
 * Hawaiian prayer lines etc.: color:#98167f / #c71585 / #a0047f) → palette
 * green. Genio 2026-06-23 (i_am_the_i / peace_of_i looked half-baked). */
.article-body :is([style*="#98167f"], [style*="#98167F"], [style*="#c71585"],
    [style*="#C71585"], [style*="#a0047f"], [style*="#A0047F"]) {
    color: var(--wp--preset--color--navy, #32442f) !important;
}


/* ============================================================
 * MIGRATED ARTICLE NORMALIZATION (Genio 2026-06-23 review)
 * Imported posts carry two things the new theme never styled:
 *  (A) stray <style> blocks pasted into the body with BARE element
 *      selectors (e.g. h2{color:#c71585;border-left:4px double …}) —
 *      .article-body specificity (0,1,1) beats them (0,0,1);
 *  (B) the old theme's utility CLASSES (.bg_gray/.box01/.color06/
 *      .area*…) which have NO css here → colour-coded boxes collapse
 *      to a flat text wall.
 * Part B recreates the colour separation in the new water-blue /
 * green palette (Genio Q2 = 再現, fonts follow the new theme).
 * ============================================================ */

/* A) headings back to the palette: kills pasted pink colour + the
 *    double side-border + the shrunk size. White overlay headings
 *    (handled above) are excluded. */
.article-body :is(h1, h2, h3, h4, h5, h6):not(.has-white-color) {
    color: var(--wp--preset--color--navy, #32442f) !important;
    border-left: 0 !important;
    border-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* size off the locked ladder (26 sub-head / 22 body); no !important so
 *    intentional class-scoped headings can still win, but beats the
 *    pasted bare h2{font-size:22px} (0,0,1). */
/* In-article section headings must sit BELOW the page title (h1=36): the
 * global `h2{36 !important}` was forcing in-article h2 to 36 = same as the
 * title (looked like a second title — Genio 2026-06-25). !important here +
 * higher specificity (.article-body h2) beats the global. Page title stays
 * 36 (it's .article-title). Section headings = 22 (distinguished by weight/
 * letter-spacing), h6 small label = 16. */
.article-body h2 { font-size: 22px !important; line-height: 1.7; }
.article-body h3 { font-size: 22px !important; line-height: 1.8; }
.article-body h4 { font-size: 22px !important; line-height: 1.8; }
.article-body h5 { font-size: 22px !important; line-height: 1.8; }
.article-body h6 { font-size: 16px !important; line-height: 1.8; }
/* Section headings stand apart from body by WEIGHT, not size (Genio
 * 2026-06-25「記事内セクションだけBOLD」): same 22px as body but bold. h6
 * stays a quiet small label (--w-base). */
.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5 { font-weight: var(--w-bold) !important; }

/* B) old utility classes recreated in the palette. TWO tints only so
 *    the design stays within white / water-blue / green:
 *    calm box = light water-blue, emphasis box = deeper water-blue,
 *    strong banner = green. */
.article-body :is(.bg_gray, .bg_ghostwhite, .bg_snow, .bg-rightblue, .bg-rightblue2,
    .areablue, .areamintcream, .areasnow, .arealinen, .areaantiquewhite) {
    background-color: var(--wp--preset--color--beige, #e7f1f7) !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
}
.article-body :is(.bg-rightpink, .bg-rightpink2, .bkcolor01, .areapink,
    .areasnowwhite, .areapalegoldenrod-title) {
    background-color: var(--wp--preset--color--beige-deep, #c6d6e4) !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
}
.article-body .bg_deeppur {
    background-color: var(--wp--preset--color--navy, #32442f) !important;
    color: #fff !important;
}
.article-body .bg_deeppur :is(p, span, a, strong, em, li, h2, h3, h4) {
    color: #fff !important;
}
/* old purple emphasis text → green */
.article-body .color06 { color: var(--wp--preset--color--navy, #32442f) !important; }
/* padded section wraps (the boxes had built-in padding in the old css) */
.article-body .wrap05 { padding: 40px 30px 24px !important; }
.article-body :is(.areapink, .areablue, .arealinen, .areamintcream,
    .areasnow, .areaantiquewhite) { padding: 32px !important; }
.article-body :is(.areasnowwhite, .areapalegoldenrod-title) { padding: 16px !important; }
.article-body .areapalegoldenrod-title { text-align: center !important; }
.article-body .box01 { border-radius: 0 !important; }   /* squared corners, Aman */
.article-body .mgb30 { margin-bottom: 30px !important; }
.article-body .font18 { font-size: 22px !important; }   /* legacy size → body ladder */
/* legacy table → hairline grid in the palette */
.article-body .tbl01 {
    width: 100%; background: var(--wp--preset--color--beige-deep, #c6d6e4) !important;
    border-collapse: separate; border-spacing: 1px;
}
.article-body .tbl01 :is(td, th) { background: #fff; padding: 10px 12px; }
/* クラス/講演会ページの受講料テーブルを洗練（Genio 2026-06-29「装飾でかっこよく」）:
   中央寄せ・余白広め・見出し行は淡い地、価格は少し大きく立てる。文字は増やさない。 */
.single-class .article-body .tbl01,
.single-seminar .article-body .tbl01,
.single-class .class-prose .tbl01,
.single-seminar .class-prose .tbl01 {
    max-width: 560px; margin: 6px auto 0; background: transparent !important;
    border: 1px solid var(--hair, #c6d6e4); border-spacing: 0; border-collapse: collapse;
}
.single-class .tbl01 :is(td, th),
.single-seminar .tbl01 :is(td, th) {
    background: transparent !important; text-align: center;
    padding: 16px 14px; border-bottom: 1px solid var(--hair-light, #d4e2ee);
    font-size: 22px;
}
.single-class .tbl01 .bg-rightblue, .single-seminar .tbl01 .bg-rightblue {
    background: rgba(47, 93, 52, .07) !important; font-weight: 600; letter-spacing: .08em;
}
.single-class .tbl01 .bg-rightblue2, .single-seminar .tbl01 .bg-rightblue2 {
    background: rgba(47, 93, 52, .035) !important; color: var(--navy-mute); font-size: 16px;
}
/* shortcodes-ultimate spoiler title bar → water-blue */
.article-body .su-spoiler-title {
    background: var(--wp--preset--color--beige, #e7f1f7) !important;
    color: var(--wp--preset--color--navy, #32442f) !important;
}
/* KR handwriting note → beige note card in palette */
.article-body .krnote_wrap {
    background: var(--wp--preset--color--beige, #e7f1f7) !important;
    box-shadow: 2px 2px 10px 2px var(--wp--preset--color--beige-deep, #c6d6e4) !important;
    padding: 3em 2em; width: 95%; margin: 30px auto;
}


/* floated images in legacy content: cap on PC, unfloat on phones —
 * a 239px float inside a 342px box was stacking text one char per line
 * (Genio screenshot 2026-06-11). */
.article-body .alignleft,
.article-body .alignright {
    max-width: 45%;
}
@media (max-width: 768px) {
    /* Broadened 2026-06-25: these also break inside .entry-content (post types
       morrnah / notice / reading / interview use .entry-content, not .article-body),
       where an alignleft/right size-full|is-resized figure shrinks to a narrow
       portrait image and squeezes its long <figcaption> to a 1-char column. Make
       the figure full-width so the caption gets the full width. */
    .article-body .alignleft,
    .article-body .alignright,
    .entry-content .wp-block-image.alignleft,
    .entry-content .wp-block-image.alignright {
        float: none !important;
        display: block;
        margin: 0 auto 20px;
        max-width: 100% !important;
        width: 100% !important;
    }
    .article-body .wp-block-image img,
    .entry-content .wp-block-image.alignleft img,
    .entry-content .wp-block-image.alignright img { max-width: 100%; height: auto; }
    .article-body .wp-block-image figcaption,
    .entry-content .wp-block-image figcaption { display: block; width: 100% !important; }
}


/* article-top chip row (teacher + genre) — each chip is one tappable unit;
 * a long name moves its whole chip to the next line instead of splitting */
.article-teacher-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 36px;
}
.article-body .article-teacher-chips .hpp-rec-teacher {
    font-size: 16px;
    letter-spacing: .1em;
    padding: 9px 18px;
    margin-bottom: 0;
    max-width: 100%;
}

/* ============================================================
   #16 KR pages (kamaile-rafaelovich CPT) + izi/private-session
   Ported from preview inline <style> blocks, font sizes normalised
   to the locked ladder (14/18/22/26/36). v0.28.0
   ============================================================ */

/* ---- shared KR service pages (personal / business / absentee / land / message) ---- */
.service-hero { background: var(--white); padding: 24px 0 60px; text-align: center; }
.service-hero-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; }
.service-hero p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 20px; }
.service-body { padding: 100px 0; }
.service-body-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; }
.service-body h2 {
  font-size: 22px; letter-spacing: .18em; line-height: 1.7;
  color: var(--navy); margin-bottom: 24px; margin-top: 50px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
.service-body h2:first-child { margin-top: 0 }
/* クラス/講演会ページの装飾（Genio 2026-06-29「文字だらけ→もっとかっこよく」）:
   各セクション見出しの上に細い縦のアクセント線＋字間ゆとりで、文字だけの単調さを緩和。
   class/seminar の single にスコープ。 */
.single-class .service-body h2::before,
.single-seminar .service-body h2::before {
  content: "";
  display: block;
  width: 1px;
  height: 34px;
  margin: 0 auto 20px;
  background: linear-gradient(to bottom, transparent, var(--navy-mute, rgba(47,93,52,.55)), transparent);
}
.single-class .service-body h2,
.single-seminar .service-body h2 { letter-spacing: .22em; }
.service-body p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 20px; }
.service-body ul { list-style: none; padding: 0; margin: 20px 0; }
.service-body ul li {
  font-size: 22px; line-height: 2; letter-spacing: .08em;
  color: var(--navy-soft);
  padding-left: 24px; position: relative;
  margin-bottom: 10px;
}
.service-body ul li::before { content: '・'; position: absolute; left: 0; color: var(--navy-mute); }
.service-body blockquote {
  margin: 40px 0; padding: 30px 24px;
  border-left: 1px solid var(--navy-thread);
  font-style: italic; color: var(--navy);
  font-size: 22px; line-height: 2.2; letter-spacing: .08em;
}
.service-booking { background: var(--white); padding: 100px 0; text-align: center; }
.service-booking--beige { background: var(--beige); }
.service-booking-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; }

/* KR service-page action buttons (Genio 2026-06-15): refined replacement for
   the old green pills — solid primary (anchors to #booking) + ghost secondary.
   Aman discipline: no rounded corners, serif, letter-spaced. */
.kr-actions-sec { background: var(--white); padding: 6px 0 46px; }
.kr-actions {
  display: flex; flex-wrap: wrap; gap: 16px;
  justify-content: center; align-items: stretch;
  padding: 0 24px;
}
.kr-action {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 280px; padding: 17px 30px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
  /* 16px = the site button size (.tp-session-btn). 16px+ for tap legibility
     (Genio 2026-06-16; was 14). */
  font-size: 16px; letter-spacing: .16em; line-height: 1.5;
  text-align: center; text-decoration: none;
  transition: background .35s ease, color .35s ease, letter-spacing .35s ease, border-color .35s ease;
}
.kr-action--primary {
  background: var(--navy); color: #fdfcf8; border: 1px solid var(--navy);
}
.kr-action--primary:hover { background: #44583f; letter-spacing: .22em; }
.kr-action--ghost {
  background: transparent; color: var(--navy); border: 1px solid var(--navy-thread);
}
.kr-action--ghost:hover { border-color: var(--navy); letter-spacing: .22em; }
@media (max-width: 600px) {
  .kr-actions { flex-direction: column; }
  .kr-action { width: 100%; min-width: 0; }
}
.service-booking h2 {
  font-size: 22px; letter-spacing: .2em;
  color: var(--navy); margin-bottom: 24px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
.amelia-placeholder { text-align: center; padding: 80px 20px; border: 1px dashed var(--navy-thread); margin-top: 30px; }
.amelia-placeholder p { color: var(--navy-mute); font-size: 16px; line-height: 2; letter-spacing: .08em; }
.kr-booking-embed { margin-top: 30px; text-align: left; }
@media (max-width: 768px) {
  .service-hero { padding: 18px 0 40px }
  .service-body { padding: 70px 0 }
  .service-booking { padding: 70px 0 }
  .service-body h2 { }
}

/* ---- who-kr-is ---- */
.kr-portrait-band { background: var(--white); padding: 80px 0 100px; }
.kr-portrait-inner {
  max-width: 900px; margin: 0 auto; padding: 0 24px;
  display: grid; grid-template-columns: 320px 1fr;
  gap: 60px; align-items: start;
}
.kr-photo { aspect-ratio: 3/4; background: var(--beige-deep); overflow: hidden; filter: sepia(0.12); }
.kr-photo img { width: 100%; height: 100%; object-fit: cover }
.kr-meta-line {
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .22em;
  color: var(--navy-mute); margin-bottom: 20px;
}
.kr-name-en { font-family: var(--ff-en); font-style: italic; font-size: 22px; color: var(--navy-mute); margin-bottom: 10px; }
.kr-name-jp {
  font-size: 22px; letter-spacing: .14em; line-height: 1.5;
  color: var(--navy); margin-bottom: 32px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
.kr-name-aka { display: block; font-size: 16px; letter-spacing: .14em; color: var(--navy-mute); margin-top: 8px; }
.kr-bio p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 20px; }
.kr-history { background: var(--beige); padding: 100px 0; }
.kr-history-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; }
.kr-history h2 {
  font-size: 22px; letter-spacing: .2em; line-height: 1.6;
  color: var(--navy); margin-bottom: 40px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
  text-align: center;
}
.kr-history p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 22px; text-align: left; }
.kr-history p:last-child { margin-bottom: 0 }
.kr-history-signoff {
  margin-top: 50px; text-align: center;
  font-family: var(--ff-en); font-style: italic;
  font-size: 16px; letter-spacing: .14em; line-height: 1.9;
  color: var(--navy-mute);
}
.kr-pull-quote { background: var(--beige); padding: 100px 0; text-align: center; }
.kr-pull-quote p {
  max-width: 720px; margin: 0 auto; padding: 0 24px;
  font-family: var(--ff-jp); font-style: italic; font-weight: var(--w-base);
  font-size: 22px; line-height: 1.9; letter-spacing: .14em;
  color: var(--navy);
}
.kr-personal-cta { background: var(--white); padding: 120px 0; text-align: center; }
.kr-personal-cta-inner { max-width: 640px; margin: 0 auto; padding: 0 24px; }
.kr-personal-cta h2 {
  font-size: 22px; letter-spacing: .2em;
  color: var(--navy); margin-bottom: 22px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
.kr-personal-cta p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 36px; }
.kr-individual .lead-note {
  font-size: 16px; line-height: 2; letter-spacing: .08em;
  color: var(--navy-mute);
  border-left: 2px solid var(--navy-thread);
  padding-left: 16px; margin-top: 30px;
  font-style: italic;
}
.kr-service-feature { padding: 100px 0; }
.kr-service-feature-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; text-align: center; }
.kr-service-feature h2 {
  font-size: 22px; letter-spacing: .2em; line-height: 1.6;
  color: var(--navy); margin-bottom: 30px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
.kr-service-feature p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 30px; text-align: left; }
.kr-services-intro { background: var(--white); padding: 70px 0 30px; text-align: center; }
.kr-services-eyebrow {
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .32em; color: var(--navy-mute);
  margin-bottom: 14px;
}
.kr-services-title { font-family: var(--ff-en); font-style: italic; font-size: 22px; letter-spacing: .14em; color: var(--navy); line-height: 1.6; }
.kr-section-divider {
  display: flex; align-items: center; justify-content: center;
  gap: 22px; margin: 70px auto 0; max-width: 280px;
  color: var(--navy-mute);
}
.kr-section-divider::before,
.kr-section-divider::after { content: ''; flex: 1; height: 1px; background: var(--navy-thread); }
.kr-section-divider-mark { font-family: var(--ff-en); font-style: italic; font-size: 16px; letter-spacing: .32em; }
.kr-service-num { font-family: var(--ff-en); font-style: italic; font-size: 16px; letter-spacing: .32em; color: var(--navy-mute); margin-bottom: 14px; }
.kr-bio-links { display: flex; flex-wrap: wrap; gap: 16px 28px; margin-top: 24px; }
.kr-bio-link {
  display: inline-block;
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .14em;
  color: var(--navy);
  border-bottom: 1px solid var(--navy-thread);
  padding: 4px 0 4px;
  transition: letter-spacing .5s ease, border-color .4s ease;
}
.kr-bio-link:hover { border-color: var(--navy); letter-spacing: .22em; }
.kr-message-pointer { background: var(--white); padding: 80px 0; text-align: center; border-top: 1px solid var(--navy-thread); }
.kr-message-pointer-inner { max-width: 600px; margin: 0 auto; padding: 0 24px; }
.kr-message-pointer p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 24px; }
@media (max-width: 768px) {
  .kr-portrait-band { padding: 100px 0 60px }
  .kr-portrait-inner { grid-template-columns: 1fr; gap: 30px; padding: 0 30px }
  .kr-photo { max-width: 220px; margin: 0 auto }
  .kr-name-jp { }
  .kr-history { padding: 70px 0 }
  .kr-history h2 { }
  .kr-pull-quote { padding: 60px 0 }
  .kr-pull-quote p { }
  .kr-personal-cta { padding: 80px 0 }
  .kr-personal-cta h2 { }
  .kr-service-feature { padding: 70px 0 }
  .kr-service-feature h2 { }
  .kr-message-pointer { padding: 60px 0 }
  .kr-section-divider { margin: 50px auto; max-width: 200px; gap: 16px }
  .kr-bio-links { justify-content: center; gap: 14px 20px; margin-top: 22px }
}

/* ---- kr-movies ---- */
.kr-movies-intro { background: var(--white); padding: 70px 0 30px; text-align: center; }
.kr-movies-intro-inner { max-width: 640px; margin: 0 auto; padding: 0 24px; }
.kr-movies-intro p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); }
.kr-movies-grid-sec { background: var(--white); padding: 40px 0 140px; }
.kr-cross-nav-back {
  display: inline-block;
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .18em; color: var(--navy);
  border-bottom: 1px solid var(--navy-thread);
  padding-bottom: 5px;
  transition: letter-spacing .5s ease, border-color .4s ease;
}
.kr-cross-nav-back:hover { letter-spacing: .26em; border-color: var(--navy); }

/* "KR にできること" cross-nav heading + subtitle (Genio 2026-06-15). The
   title carried a 50px gap for the old eyebrow layout; tighten it now that a
   one-line subtitle sits between the heading and the links. */
.kr-cross-nav-title {
  margin-bottom: 14px;
}
.kr-cross-nav-sub {
  /* 15px was off the 36/22/18/14 ladder; 14 = the label size (Genio 2026-06-15). */
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .1em; line-height: 1.9;
  color: var(--navy-soft);
  text-align: center;
  margin-bottom: 46px;
}

/* Simplified KR cross-nav: clean centred text links, no photos
   (Genio 2026-06-15). */
.kr-cross-links {
  list-style: none;
  margin: 0 0 44px;
  padding: 0;
  text-align: center;
}
.kr-cross-links li { margin: 0; }
.kr-cross-links li + li { margin-top: 22px; }
.kr-cross-links a {
  display: inline-block;
  font-family: var(--ff-jp); font-weight: var(--w-base);
  /* cross-nav links — were 18 (mobile-body), looked undersized on PC. Body tier
     now: 22 desktop / 18 mobile via the global ladder (Genio 2026-06-16). */
  font-size: 22px; letter-spacing: .12em; line-height: 1.7;
  color: var(--navy);
  border-bottom: 1px solid var(--navy-thread);
  padding-bottom: 6px;
  transition: letter-spacing .5s ease, border-color .4s ease;
}
.kr-cross-links a:hover { letter-spacing: .2em; border-color: var(--navy); }
@media (max-width: 768px) {
  .kr-movies-intro { padding: 50px 0 20px }
  .kr-movies-grid-sec { padding: 30px 0 90px }
}

/* ---- izi/private-session ---- */
.sessions-intro { background: var(--white); padding: 100px 0; }
.sessions-intro-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; text-align: center; }
.sessions-intro p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 18px; }
.sessions-intro p:last-child { margin-bottom: 0 }
.instructors-grid-sec { background: var(--beige); padding: 120px 0; }
.instructors-grid-inner { max-width: 1100px; margin: 0 auto; padding: 0 60px; }
.instructors-grid { display: grid; grid-template-columns: 1fr; gap: 60px 50px; margin-top: 60px; }
@media (min-width: 720px) {
  .instructors-grid { grid-template-columns: repeat(2, 1fr); max-width: 880px; margin-left: auto; margin-right: auto; margin-top: 60px; }
}
.instructor-card { text-align: center; background: var(--white); padding: 36px 28px; border: 1px solid var(--navy-thread); }
.inst-photo {
  aspect-ratio: 3/4; background: var(--beige-deep);
  overflow: hidden; margin-bottom: 24px;
  filter: sepia(0.10);
  max-width: 220px; margin-left: auto; margin-right: auto;
}
.inst-photo img { width: 100%; height: 100%; object-fit: cover; }
.inst-en { font-family: var(--ff-en); font-style: italic; font-size: 16px; color: var(--navy-mute); margin-bottom: 8px; }
.inst-jp {
  /* instructor name — was 18 (mobile-body size), looked undersized on PC
     (Genio 2026-06-16: session pages too small). On the body/name tier now. */
  font-size: 22px; letter-spacing: .14em; color: var(--navy);
  line-height: 1.6; margin-bottom: 14px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
/* Long instructor names (e.g. クリスティーン・レイマカマエ・チュウ) are dictionary-
   nowrap'd, which overflows a narrow card. In this box let the name wrap at the
   ・ break points instead of spilling out (Kohei 2026-06-29). */
.inst-jp .nowrap { white-space: normal; }
.inst-msg { margin: 18px auto 14px; text-align: center; }
.inst-msg-toggle {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .14em;
  color: var(--navy-mute);
  padding: 10px 14px;
  border-bottom: 1px solid var(--navy-thread);
  transition: color .3s ease, border-color .3s ease;
  user-select: none;
}
.inst-msg-toggle::-webkit-details-marker { display: none; }
.inst-msg-toggle::marker { content: ''; }
.inst-msg-toggle:hover { color: var(--navy); border-color: var(--navy); }
.inst-msg-icon { display: inline-block; font-family: var(--ff-en); font-size: 16px; transition: transform .3s ease; }
.inst-msg[open] .inst-msg-icon { transform: rotate(180deg); }
.inst-msg-toggle-close { display: none; }
.inst-msg[open] .inst-msg-toggle-open { display: none; }
.inst-msg[open] .inst-msg-toggle-close { display: inline; }
.inst-msg-body {
  margin-top: 18px; padding: 18px 4px 6px;
  text-align: left;
  /* instructor message = body reading text; was 14 (clearly small on PC —
     Genio 2026-06-16). Body tier: 22 desktop / 18 mobile (ladder). */
  font-size: 22px; line-height: 2.0; letter-spacing: .04em;
  color: var(--navy-soft);
}
.inst-msg-body p { margin-bottom: 14px; }
.inst-msg-body p:last-child { margin-bottom: 0; }
.inst-msg-source {
  margin-top: 14px;
  font-family: var(--ff-en);
  font-size: 16px; letter-spacing: .14em;
  color: var(--navy-mute);
  text-align: center;
  font-style: normal;
}
.inst-profile-link {
  /* was 12px (off the 36/22/18/14 ladder, looked too small — Genio 2026-06-15) */
  display: inline-block; margin-top: 14px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .12em;
  color: var(--navy-mute);
  border-bottom: 1px solid var(--navy-thread);
  padding-bottom: 3px;
  transition: color .4s ease, border-color .4s ease;
}
.inst-profile-link:hover { color: var(--navy); border-color: var(--navy); }
.session-booking { background: var(--beige); padding: 100px 0; }
.session-booking-inner { max-width: 900px; margin: 0 auto; padding: 0 24px; }
.booking-intro { text-align: center; margin: 40px auto 20px; max-width: 600px; }
.booking-intro p { font-size: 22px; line-height: 2; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 12px; }
.booking-hint {
  text-align: center;
  margin: 0 auto 50px; max-width: 640px;
  font-size: 16px; line-height: 2; letter-spacing: .12em;
  color: var(--navy-mute);
  font-style: italic;
}
.amelia-embed { margin-top: 40px; }
.session-info { background: var(--white); padding: 100px 0; text-align: center; }
.session-info-inner { max-width: 600px; margin: 0 auto; padding: 0 24px; }
.session-info h3 {
  font-size: 22px; letter-spacing: .18em; line-height: 1.6;
  color: var(--navy); margin-bottom: 20px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
.session-notes { text-align: left; margin: 30px auto 40px; display: inline-block; }
.session-notes p { font-size: 22px; line-height: 2; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 8px; }
.session-contact { font-size: 16px; line-height: 2; letter-spacing: .08em; color: var(--navy-soft); margin-top: 20px; }
.session-contact a { color: var(--navy); border-bottom: 1px solid var(--navy-thread); }
@media (max-width: 768px) {
  .sessions-intro { padding: 70px 0 }
  .instructors-grid-sec { padding: 80px 0 }
  .instructors-grid-inner { padding: 0 20px }
  .instructors-grid { gap: 40px; }
  .instructor-card { padding: 28px 22px; }
  .session-booking { padding: 70px 0 }
  .session-info { padding: 70px 0 }
}

/* ============================================================
   #17 cleaning tools (home + 4 categories) + contact. v0.28.1
   ============================================================ */
.ct-intro { background: var(--white); padding: 16px 0 40px; }
.ct-intro-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; text-align: center; }
.ct-intro p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); text-align: left; }
.ct-quote { margin: 40px 0 0; padding: 30px 24px; border-left: 1px solid var(--navy-thread); font-style: italic; color: var(--navy); font-size: 22px; line-height: 2.1; letter-spacing: .08em; text-align: left; }
.ct-quote cite { display: block; margin-top: 14px; font-style: normal; font-size: 16px; letter-spacing: .14em; color: var(--navy-mute); }
.ct-cats { background: var(--beige); padding: 100px 0 120px; }
.ct-cats-inner { max-width: 980px; margin: 0 auto; padding: 0 24px; }
.ct-grid { display: grid; grid-template-columns: 1fr; gap: 40px; }
@media (min-width: 720px) { .ct-grid { grid-template-columns: repeat(2, 1fr); gap: 50px 40px; } }
.ct-card { display: block; background: var(--white); border: 1px solid var(--navy-thread); padding: 28px 28px 34px; text-align: center; transition: border-color .4s ease; }
.ct-card:hover { border-color: var(--navy); }
.ct-thumb { aspect-ratio: 16/10; overflow: hidden; background: var(--beige-deep); margin-bottom: 22px; }
.ct-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s ease; }
.ct-card:hover .ct-thumb img { transform: scale(1.03); }
.ct-name { font-family: var(--ff-en); font-style: italic; font-size: 22px; letter-spacing: .14em; color: var(--navy); }
.ct-name-jp { font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; letter-spacing: .22em; color: var(--navy-mute); margin: 6px 0 14px; }
.ct-desc { font-size: 16px; line-height: 2; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 18px; text-align: center; }
.ct-more { display: inline-block; font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; letter-spacing: .14em; color: var(--navy); border-bottom: 1px solid var(--navy-thread); padding-bottom: 4px; transition: letter-spacing .5s ease, border-color .4s ease; }
.ct-card:hover .ct-more { letter-spacing: .22em; border-color: var(--navy); }
.ct-products { background: var(--beige); padding: 90px 0 120px; }
.ct-products-inner { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
@media (max-width: 768px) {
  .ct-intro { padding: 14px 0 30px }
  .ct-cats { padding: 70px 0 90px }
  .ct-products { padding: 60px 0 90px }
}

/* Cleaning-tool HOME hero (Genio 2026-06-16): mirror the existing live page's
   structure — bilingual title「SITH Ho'oponopono / Cleaning Tool」, a short lead,
   and a 4-chip category filter that anchor-jumps to each section. New palette. */
.ct-hero { background: var(--white); padding: 0 0 56px; }
/* Hero lifestyle banner — faithful to the live page (shopmainimage.png). Wide
   landscape strip, hairline frame, muted saturation to sit in the Aman palette. */
.ct-hero-banner { max-width: 1180px; margin: 0 auto 48px; padding: 0 24px; }
.ct-hero-banner img {
  display: block; width: 100%; aspect-ratio: 16 / 6; object-fit: cover;
  border: 1px solid var(--navy-hair); filter: saturate(.92);
}
.ct-hero-inner { max-width: 980px; margin: 0 auto; padding: 0 24px; text-align: center; }
.ct-hero-title {
  font-family: var(--ff-en); font-weight: var(--w-base); font-style: italic;
  font-size: 36px; line-height: 1.3; letter-spacing: .06em; color: var(--navy);
  margin: 0;
}
.ct-hero-title-sub { display: inline-block; }
.ct-hero-lead {
  max-width: 720px; margin: 26px auto 0;
  font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft);
  text-align: left;
}
.ct-filter {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 14px;
  margin-top: 40px;
}
.ct-chip {
  display: inline-block;
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; letter-spacing: .14em;
  color: var(--navy); text-decoration: none;
  padding: 11px 26px; border: 1px solid var(--navy-hair); background: var(--white);
  transition: background .3s ease, color .3s ease, letter-spacing .3s ease;
}
.ct-chip:hover { background: var(--navy); color: #fdfcf8; letter-spacing: .2em; }
@media (max-width: 600px) {
  .ct-hero { padding: 4px 0 40px; }
  .ct-hero-title { font-size: 28px; }
  .ct-hero-lead { font-size: 22px; margin-top: 20px; }
  .ct-filter { gap: 10px; margin-top: 30px; }
  .ct-chip { font-size: 16px; padding: 9px 18px; }
}

/* Cleaning-tool HOME (Genio 2026-06-16): show real products+prices per category
   like the existing page, not bare category cards. Alternating white/beige
   sections, each with a heading + a 4-up product preview + a「全ての商品を見る」CTA.
   Reuses the .ct-products grid (neutralise its own section bg/padding here). */
.ct-cat-sec { padding: 64px 0 60px; }
.ct-cat-sec--white { background: var(--white); }
.ct-cat-sec--beige { background: var(--beige); }
.ct-cat-inner { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
/* Per-category lifestyle banner (zerowiseimage / ceeportimage / krgoodsimage /
   shopmainimage) — like the live page, a wide photo opens each category. */
.ct-cat-banner { margin: 0 0 40px; }
.ct-cat-banner img {
  display: block; width: 100%; aspect-ratio: 16 / 6; object-fit: cover;
  border: 1px solid var(--navy-hair); filter: saturate(.92);
}
.ct-cat-head { text-align: center; margin-bottom: 48px; }
.ct-cat-intro {
  max-width: 760px; margin: 22px auto 0;
  font-size: 22px; line-height: 2.05; letter-spacing: .06em; color: var(--navy-soft);
  text-align: left;
}
.ct-cat-title {
    display: inline-block;
    font-size: 22px !important; letter-spacing: .2em; color: var(--navy);
    font-family: var(--ff-jp); font-weight: var(--w-base);
    padding-bottom: 16px;
    border-bottom: 1px solid var(--navy-hair);
}
.ct-cat-jp { margin-top: 8px; font-size: 16px; letter-spacing: .18em; color: var(--navy-mute); }
.ct-cat-sec .ct-products { background: transparent; padding: 0; }
.ct-cat-more { text-align: center; margin-top: 44px; }
@media (max-width: 600px) {
  .ct-cat-sec { padding: 44px 0 44px; }
  .ct-cat-head { margin-bottom: 36px; }
  .ct-cat-title { font-size: 22px !important; padding-bottom: 12px; }
  .ct-cat-banner { margin-bottom: 28px; }
  .ct-cat-banner img { aspect-ratio: 16 / 9; }
  .ct-cat-intro { font-size: 16px; line-height: 1.95; margin-top: 16px; }
  .ct-hero-banner { margin-bottom: 30px; }
  .ct-hero-banner img { aspect-ratio: 16 / 9; }
}

/* WooCommerce product loop — washi tiles in the site palette */
/* existing live page shows 4 products per row (4 columns) per category; mirror that:
   mobile 2-up -> tablet 2-up -> desktop 4-up. */
/* The body carries .woocommerce, so WooCommerce's own `.woocommerce ul.products`
   (display:flex / float, with per-item widths) ties or beats a plain
   `.ct-products ul.products` selector and silently broke the row into 3+1.
   Win specificity + force the grid so all 4 tiles share one row. */
.ct-products ul.products,
.woocommerce .ct-products ul.products {
  list-style: none !important; margin: 0 !important; padding: 0 !important;
  display: grid !important; grid-template-columns: repeat(2, 1fr) !important;
  gap: 40px 20px !important; float: none !important;
}
@media (min-width: 720px) {
  .ct-products ul.products,
  .woocommerce .ct-products ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 50px 30px !important; }
}
@media (min-width: 1000px) {
  .ct-products ul.products,
  .woocommerce .ct-products ul.products { grid-template-columns: repeat(4, 1fr) !important; gap: 50px 28px !important; }
}
/* WooCommerce/theme clearfix injects `ul.products::before{content:" ";display:table}`.
   In a CSS grid that pseudo becomes a grid ITEM occupying cell 1 — it pushed the
   real tiles into tracks 2-4 and wrapped the 4th onto a new row (3+1 instead of 4).
   Remove the pseudo grid items so the 4 products share one row. */
.ct-products ul.products::before,
.ct-products ul.products::after,
.woocommerce .ct-products ul.products::before,
.woocommerce .ct-products ul.products::after { content: none !important; display: none !important; }
/* WooCommerce sets an inline width on each li.product (its float-layout default)
   that beat our rule and collapsed each tile to ~98px -> titles wrapped one
   character per line (Genio 2026-06-16 "壊れている"). Force the grid item to
   fill its track. */
.ct-products ul.products li.product {
  position: relative; display: flex; flex-direction: column;
  background: var(--white); border: 1px solid var(--navy-thread);
  padding: 22px 20px 26px; text-align: center;
  margin: 0 !important; width: auto !important; max-width: none !important; min-width: 0; float: none !important;
  transition: border-color .4s ease, transform .4s ease;
}
.ct-products ul.products li.product:hover { border-color: var(--navy-hair); transform: translateY(-3px); }
.ct-products ul.products li.product a { display: block; }
/* image + a hairline rule beneath it; natural ratio (no letterboxing). Imageless
   tiles (KR Goods / some Books) simply omit this block and stay shorter rather
   than collapsing — grid rows align by the tallest tile. */
.ct-products ul.products li.product img {
  width: 100%; height: auto;
  margin-bottom: 18px; padding-bottom: 18px;
  border-bottom: 1px solid var(--navy-thread);
}
.ct-products ul.products li.product .woocommerce-loop-product__title { font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 22px; line-height: 1.75; letter-spacing: .06em; color: var(--navy); }
.ct-products ul.products li.product .price { display: block; margin-top: 10px; font-family: var(--ff-en); font-size: 16px; letter-spacing: .1em; color: var(--navy-soft); }
.ct-products ul.products li.product .price del { opacity: .5; margin-right: 6px; }
/* show the add-to-cart so visitors can order in one tap (Genio: 簡単に注文) */
.ct-products ul.products li.product .button,
.ct-products ul.products li.product .add_to_cart_button {
  display: inline-block; margin-top: 14px;
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; letter-spacing: .12em;
  color: #fdfcf8; background: var(--navy); border: 1px solid var(--navy);
  padding: 9px 22px; text-decoration: none; border-radius: 0; cursor: pointer;
  transition: background .3s ease, letter-spacing .3s ease;
}
.ct-products ul.products li.product .button:hover,
.ct-products ul.products li.product .add_to_cart_button:hover { background: #44583f; letter-spacing: .18em; }
.ct-products ul.products li.product .added_to_cart { display: inline-block; margin-top: 8px; font-size: 16px; letter-spacing: .1em; color: var(--navy); border-bottom: 1px solid var(--navy-thread); text-decoration: none; }
.ct-products .woocommerce-result-count, .ct-products .woocommerce-ordering { display: none; }
.ct-products ul.products li.product .onsale { background: var(--navy); color: #fff; font-size: 16px; padding: 2px 10px; position: absolute; top: 0; left: 0; }
/* tighten the 2-up tiles on phones so long product names stay legible */
@media (max-width: 600px) {
  .ct-products ul.products { gap: 30px 14px; }
  .ct-products ul.products li.product { padding: 16px 12px 20px; }
  .ct-products ul.products li.product .woocommerce-loop-product__title { font-size: 16px; letter-spacing: .02em; line-height: 1.7; }
  .ct-products ul.products li.product .button,
  .ct-products ul.products li.product .add_to_cart_button { padding: 9px 16px; letter-spacing: .08em; }
}

/* contact */
/* Contact page-head is intentionally tighter than the global one: the page has
   no subtitle and a short intro, so the standard 140/80 + h1 24px margin left a
   big blank gap (Genio 2026-06-16). Scope the tightening to this page only. */
.page-head--contact { padding: 88px 0 20px; }
.page-head--contact h1 { margin-bottom: 0; }
@media (max-width: 600px) {
    .page-head--contact { padding: 60px 0 14px; }
}
.contact-intro { background: var(--white); padding: 8px 0 30px; }
.contact-intro-inner { max-width: 640px; margin: 0 auto; padding: 0 24px; text-align: center; }
.contact-intro p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); text-align: left; }
.contact-form-sec { background: var(--beige); padding: 90px 0 100px; }
.contact-form-inner { max-width: 640px; margin: 0 auto; padding: 0 24px; }
/* These are SUB-section headings (subhead tier 26/22), not page titles — the
   global `h1,h2 { 36px !important }` was wrongly inflating them to title size,
   so the お問い合わせ先 block looked huge on mobile (Genio 2026-06-16). Match
   specificity + !important to land them back on the ladder. */
.contact-form-inner h2, .contact-info h2 {
  font-size: 22px !important; letter-spacing: .2em; text-align: center;
  color: var(--navy); margin-bottom: 40px;
  font-family: var(--ff-jp); font-weight: var(--w-base);
}
.contact-form-embed .wpcf7 { font-family: var(--ff-jp); font-weight: var(--w-base); color: var(--navy-soft); }
.contact-form-embed .wpcf7 label { display: block; font-size: 16px; letter-spacing: .14em; color: var(--navy); margin-bottom: 6px; }
.contact-form-embed .wpcf7 p { margin-bottom: 26px; font-size: 16px; }
.contact-form-embed .wpcf7 input[type="text"],
.contact-form-embed .wpcf7 input[type="email"],
.contact-form-embed .wpcf7 input[type="tel"],
.contact-form-embed .wpcf7 textarea,
.contact-form-embed .wpcf7 select {
  width: 100%; background: var(--white); border: 1px solid var(--navy-thread);
  padding: 12px 14px; font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 22px; color: var(--navy); border-radius: 0; -webkit-appearance: none;
}
.contact-form-embed .wpcf7 input:focus, .contact-form-embed .wpcf7 textarea:focus { outline: none; border-color: var(--navy); }
.contact-form-embed .wpcf7 input[type="submit"] {
  display: block; width: auto; margin: 10px auto 0; cursor: pointer;
  background: var(--navy); color: #fff; border: 1px solid var(--navy);
  padding: 14px 60px; font-size: 16px; letter-spacing: .22em;
  transition: opacity .4s ease;
}
.contact-form-embed .wpcf7 input[type="submit"]:hover { opacity: .85; }
.contact-form-embed .wpcf7-not-valid-tip { color: #8a4a3a; font-size: 16px; margin-top: 6px; }
.contact-form-embed .wpcf7-response-output { border: 1px solid var(--navy-thread); padding: 14px; font-size: 16px; margin-top: 20px; }
.contact-info { background: var(--white); padding: 90px 0 120px; text-align: center; }
.contact-info-inner { max-width: 600px; margin: 0 auto; padding: 0 24px; }
.contact-info-body p { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 8px; }
.contact-info-body a { color: var(--navy); border-bottom: 1px solid var(--navy-thread); }
.contact-info-body p.contact-info-note { margin-top: 20px; font-size: 16px; color: var(--navy-mute); }
@media (max-width: 768px) {
  .contact-intro { padding: 4px 0 20px }
  .contact-form-sec { padding: 48px 0 70px }
  .contact-info { padding: 60px 0 90px }
  .contact-form-inner h2, .contact-info h2 { font-size: 22px !important; }
}

/* ============================================================
   2026-06-12 Genio feedback batch (v0.29.0)
   ============================================================ */
/* ① the old per-post custom-CSS plugin (wp-add-custom-css) injects
   `h2 { padding:0.2rem 1rem; border-left:4px double #c71585; ... }`
   on imported posts — the pink double line. Neutralise on ALL headings.
   The SAME plugin also injects the old logo-bar rule
   `h1 { height:52px; display:flex; align-items:center; font-size:22px }`
   on some posts (e.g. KR who-kr-is, post 2417): the flex left-aligned the
   .ta-name despite text-align:center. Force headings back to block flow so
   centring works on every page. (Genio 2026-06-15) */
h1, h2, h3, h4 {
    border: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: block !important;
    height: auto !important;
    align-items: normal !important;
}
/* ② italic is banned site-wide (Genio 2026-06-12 イタリック厳禁) */
body, body * { font-style: normal !important; }
/* ③ off-ladder leftover: rec-block heading 20 → 22 */
.article-body .hpp-rec > p:first-child { font-size: 22px !important; }
/* ④ kr-deeper (izi page) had no layout styles → text ran edge-to-edge on
   mobile. Proper section + the same solid session button as teacher pages. */
.kr-deeper { background: var(--white); padding: 100px 0; text-align: center; }
.kr-deeper-inner { max-width: 700px; margin: 0 auto; padding: 0 24px; }
.kr-deeper-eyebrow { font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; letter-spacing: .2em; color: var(--navy-mute); margin-bottom: 20px; text-align: center; }
.kr-deeper-title { font-size: 36px !important; letter-spacing: .18em; line-height: 1.7; color: var(--navy); margin-bottom: 30px; font-family: var(--ff-jp); font-weight: var(--w-base); }
.kr-deeper-desc { font-size: 22px; line-height: 2.1; letter-spacing: .08em; color: var(--navy-soft); margin-bottom: 36px; }
.kr-deeper-cta {
    display: inline-block;
    background: var(--navy);
    color: #fff !important;
    border: 1px solid var(--navy);
    padding: 14px 36px;
    font-family: var(--ff-jp); font-weight: var(--w-base);
    font-size: 16px; letter-spacing: .22em;   /* site button size (Genio 2026-06-16; was 14) */
    transition: background .4s ease, letter-spacing .4s ease;
}
.kr-deeper-cta:hover { background: #44583f; letter-spacing: .26em; }
@media (max-width: 768px) {
    .kr-deeper { padding: 70px 0 }
    .kr-deeper-desc br { display: none }
}

/* ============================================
   Forminator forms — site skin (Genio 2026-06-15)
   ============================================
   Used on KR 遠隔ボディーワーク (4984) / ランドクリーニング (4401) and the
   体験談投稿フォーム (4845). Forminator ships a default flat skin with rounded
   teal accents — here we repaint it in the site language: single family
   Noto Serif JP, 濃緑 (navy) accents, water-blue focus, square corners.
   Scoped to .forminator-custom-form; !important only where Forminator's own
   stylesheet would otherwise win. Stripe field internals are left untouched. */
.forminator-ui.forminator-custom-form,
.forminator-ui.forminator-custom-form * {
  font-family: var(--ff-jp) !important;
  font-weight: var(--w-base);
  border-radius: 0 !important;
}
.forminator-ui.forminator-custom-form {
  color: var(--navy-soft);
}
/* section headings inside the form */
.forminator-custom-form .forminator-field-section {
  margin-top: 14px;
}
.forminator-custom-form .forminator-section,
.forminator-custom-form .forminator-section-title {
  color: var(--navy) !important;
  font-size: 22px !important; letter-spacing: .12em; line-height: 1.6;
  padding-bottom: 12px; margin-bottom: 8px;
  border-bottom: 1px solid var(--navy-thread);
}
.forminator-custom-form .forminator-subtitle,
.forminator-custom-form .forminator-description {
  color: var(--navy-soft) !important;
  font-size: 16px; letter-spacing: .04em; line-height: 1.9;
}
/* field labels */
.forminator-custom-form .forminator-label {
  color: var(--navy) !important;
  font-size: 16px !important; letter-spacing: .08em; line-height: 1.7;
  margin-bottom: 8px;
}
.forminator-custom-form .forminator-required {
  color: var(--navy-mute) !important;
}
/* text / email / textarea / date / select inputs */
.forminator-custom-form .forminator-input,
.forminator-custom-form .forminator-textarea,
.forminator-custom-form .forminator-date-input,
.forminator-custom-form select.forminator-select,
.forminator-custom-form .forminator-select2 .select2-selection {
  background: var(--white) !important;
  color: var(--navy) !important;
  border: 1px solid var(--navy-thread) !important;
  font-size: 16px !important;            /* >=16 prevents iOS zoom */
  letter-spacing: .04em;
  padding: 13px 16px !important;
  box-shadow: none !important;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.forminator-custom-form .forminator-textarea { min-height: 150px; }
.forminator-custom-form .forminator-input:focus,
.forminator-custom-form .forminator-textarea:focus,
.forminator-custom-form .forminator-date-input:focus,
.forminator-custom-form select.forminator-select:focus {
  border-color: var(--navy) !important;
  box-shadow: 0 0 0 3px var(--beige) !important;   /* water-blue focus ring */
  outline: none !important;
}
.forminator-custom-form .forminator-input::placeholder,
.forminator-custom-form .forminator-textarea::placeholder {
  color: var(--navy-mute); opacity: .7;
}
/* radios + checkboxes */
.forminator-custom-form .forminator-radio,
.forminator-custom-form .forminator-checkbox { color: var(--navy-soft) !important; }
.forminator-custom-form input[type="radio"],
.forminator-custom-form input[type="checkbox"] { accent-color: var(--navy); }
.forminator-custom-form .forminator-radio-bullet,
.forminator-custom-form .forminator-checkbox-box {
  border-color: var(--navy-thread) !important;
}
.forminator-custom-form .forminator-radio-label,
.forminator-custom-form .forminator-checkbox-label {
  color: var(--navy-soft) !important;
  font-size: 16px !important; letter-spacing: .04em;
}
/* submit button — matches .kr-action--primary / .tp-session-btn */
.forminator-custom-form .forminator-button,
.forminator-custom-form .forminator-button-submit {
  background: var(--navy) !important;
  color: #fdfcf8 !important;
  border: 1px solid var(--navy) !important;
  font-size: 16px !important; letter-spacing: .18em !important;
  padding: 15px 38px !important;
  box-shadow: none !important;
  transition: background .35s ease, letter-spacing .35s ease !important;
}
.forminator-custom-form .forminator-button:hover,
.forminator-custom-form .forminator-button-submit:hover {
  background: #44583f !important; letter-spacing: .24em !important;
}
/* response / error messaging */
.forminator-custom-form .forminator-error-message,
.forminator-custom-form .forminator-response-message.forminator-error {
  color: #9a4a3a !important; font-size: 16px;
}

/* ============================================
   Contact Form 7 forms — site skin (Genio 2026-06-15)
   ============================================
   Used on class registration (CF7 5285, recovered onto single-class) and the
   お問い合わせ page. Mirrors the Forminator skin: single Noto Serif JP, 濃緑
   accents, square corners, water-blue focus. */
.wpcf7-form,
.wpcf7-form * { font-family: var(--ff-jp) !important; }
.wpcf7-form { color: var(--navy-soft); line-height: 2.0; }
.wpcf7-form p { margin: 0 0 18px; }
.wpcf7-form label {
  display: block;
  color: var(--navy); font-weight: var(--w-base);
  font-size: 16px !important; letter-spacing: .08em; line-height: 1.9;
}

/* ============================================
   Amelia booking widget — font enforcement (Genio 2026-06-17)
   ============================================
   Amelia renders a self-contained Vue app with its own stylesheet. Inputs
   already inherit the serif, but its buttons / labels / calendar can fall back
   to Amelia's sans. Force the site serif on the whole widget (family only —
   no size/layout overrides, so Amelia's internal layout stays intact). */
.amelia-app-booking,
.amelia-app-booking *,
#amelia-container,
#amelia-container *,
[class*="amelia-"] {
  font-family: var(--ff-jp) !important;
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="date"],
.wpcf7-form select,
.wpcf7-form textarea {
  width: 100%;
  background: var(--white) !important;
  color: var(--navy) !important;
  border: 1px solid var(--navy-thread) !important;
  border-radius: 0 !important;
  font-size: 16px !important;            /* >=16 prevents iOS zoom */
  letter-spacing: .04em;
  padding: 13px 16px !important;
  margin-top: 6px;
  box-shadow: none !important;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.wpcf7-form textarea { min-height: 150px; }
.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
  border-color: var(--navy) !important;
  box-shadow: 0 0 0 3px var(--beige) !important;   /* water-blue focus ring */
  outline: none !important;
}
.wpcf7-form input::placeholder,
.wpcf7-form textarea::placeholder { color: var(--navy-mute); opacity: .7; }
.wpcf7-list-item { margin: 6px 16px 6px 0; }
.wpcf7-form input[type="checkbox"],
.wpcf7-form input[type="radio"] { accent-color: var(--navy); margin-right: 6px; }
.wpcf7-form .wpcf7-submit {
  background: var(--navy) !important;
  color: #fdfcf8 !important;
  border: 1px solid var(--navy) !important;
  border-radius: 0 !important;
  font-size: 16px !important; letter-spacing: .18em !important;
  padding: 15px 38px !important;
  cursor: pointer;
  box-shadow: none !important;
  transition: background .35s ease, letter-spacing .35s ease;
}
.wpcf7-form .wpcf7-submit:hover { background: #44583f !important; letter-spacing: .24em !important; }
.wpcf7-not-valid-tip { color: #9a4a3a !important; font-size: 16px; }
.wpcf7-response-output {
  border-radius: 0 !important;
  font-size: 16px; letter-spacing: .04em;
  margin: 18px 0 0 !important;
}

/* ============================================
   Class single (single-class) — ACF-driven content (Genio/Kohei 2026-06-15)
   Redesign: 受付バッジ + 申込ボタン導線 + 講師カード + 申込の流れ。
   Sections reuse .service-body (white/水色 alternating).
   FONT UNIFY: force Noto Serif JP + a consistent size on ALL ACF content
   (tagDiv left random inline fonts behind). */
.class-prose, .class-prose *,
.class-person-bio, .class-person-bio *,
.class-facts li, .class-uketsuke, .class-lead {
  font-family: var(--ff-jp) !important;
  font-weight: var(--w-base);
}
.class-prose { font-size: 22px; line-height: 2.1; letter-spacing: .04em; color: var(--navy-soft); text-align: left; }
.class-prose p { margin: 0 0 16px; }
/* class-prose のリストは list-style:none（marker無し）なので左インデントは不要。
   フラットにして本文と左端を揃える（Kohei 2026-06-29）。 */
.class-prose ul, .class-prose ol { margin: 0 0 16px; padding-left: 0; }
.class-prose li { margin: 0 0 8px; }
.class-prose a { color: var(--navy); border-bottom: 1px solid var(--navy-thread); }
.class-prose a:hover { border-color: var(--navy); }
.class-prose img { max-width: 100%; height: auto; }
.class-prose strong { font-weight: var(--w-base); color: var(--navy); }

/* NORMALISE legacy tagDiv inline sizes inside the ACF body (Genio 2026-06-15:
   "タイトルと本文の大きさが逆転している箇所がいっぱい"). The old HTML carries
   random inline font-size on spans + small inline headings, so a heading often
   rendered SMALLER than body. Force body text to 22 and any in-prose heading to
   24 (always above body) — single ladder, no inversion. */
.class-prose p, .class-prose li, .class-prose span, .class-prose font,
.class-prose div, .class-prose td, .class-prose a,
.class-person-bio p, .class-person-bio li, .class-person-bio span, .class-person-bio font {
  font-size: 22px !important; line-height: 2.1 !important;
}
.class-prose h1, .class-prose h2, .class-prose h3, .class-prose h4, .class-prose h5, .class-prose h6,
.class-person-bio h1, .class-person-bio h2, .class-person-bio h3, .class-person-bio h4 {
  font-size: 22px !important; font-weight: var(--w-base) !important; color: var(--navy) !important;
  letter-spacing: .08em !important; line-height: 1.7 !important;
  margin: 36px 0 14px !important; text-align: left !important;
}
.class-prose h1:first-child, .class-prose h2:first-child, .class-prose h3:first-child { margin-top: 0 !important; }

/* 開催概要 + 申込ボタン */
.class-overview .service-body-inner { text-align: center; }
/* The class single has NO hero image (removed 2026-06-15), so the 36px title
   sat above a ~140px empty band on desktop (title margin-bottom 40 + section
   padding-top 100) — "PCで見ると変" (Genio 2026-06-16). Pull the first section
   flush to the title; both sit on the same white ground so it reads as one
   block. The white→水色 alternation resumes from the next section. */
.single-class .article-title { margin-bottom: 0 !important; }
.class-overview.service-body { padding-top: 48px; }
/* ご案内 topic titles — each topic (会場・アクセス / オンライン参加について /
   ご参加にあたって / キャンセル規定) is its OWN section title, like the live site.
   26 = section tier, ABOVE the 22 body (was 18 = inverted below body — Genio 2026-06-15). */
.class-segment { margin: 0 0 46px; }
.class-segment + .class-segment { margin-top: 46px; padding-top: 46px; border-top: 1px solid var(--navy-thread); }
.class-subhead {
  font-family: var(--ff-jp) !important; font-weight: var(--w-base);
  font-size: 22px !important; letter-spacing: .16em; line-height: 1.7;
  color: var(--navy); text-align: center; margin: 0 0 24px;
}
/* 開催概要 facts as a tidy 項目／内容 card — centred wrapping was ragged on
   mobile (Genio 2026-06-15). Bordered card, left-aligned rows w/ dividers. */
.class-facts {
  list-style: none; margin: 0 auto 22px; padding: 2px 36px; max-width: 600px;
  display: flex; flex-direction: column; gap: 0;
  background: var(--white); border: 1px solid var(--hair-light, #d4e2ee);
  text-align: left;
}
/* 日程/時間/会場の表は箱ごと中央寄せ（セル内テキストは左のまま）— Kohei 2026-06-29。
   親の text-align:center だけでは block の ul は寄らないので margin-inline:auto を明示。 */
.class-overview .class-facts { margin-left: auto !important; margin-right: auto !important; }
.class-facts li {
  display: flex; align-items: baseline; gap: 16px;
  font-size: 22px; letter-spacing: .04em; line-height: 1.7;
  text-align: left; padding: 15px 0 !important;   /* cancel .service-body ul li indent */
  border-bottom: 1px solid var(--navy-thread);
}
.class-facts li:last-child { border-bottom: none; }
.class-facts li::before { content: none !important; }   /* no ・ bullet on the meta list */
.fact-label {
  flex-shrink: 0; min-width: 3.4em; color: var(--navy); font-weight: var(--w-base);
  letter-spacing: .08em;
}
/* 日程/時間/会場のラベルを淡いブランド地のチップに（受講料テーブルと統一・Genio 2026-06-29） */
.single-class .fact-label, .single-seminar .fact-label {
  background: rgba(47, 93, 52, .07); border-radius: 2px;
  padding: 4px 14px; text-align: center; min-width: 4.4em;
}
/* facts は外枠（上・右・左）を外し、行の下罫線だけ残す（Kohei 2026-06-29） */
.single-class .class-facts, .single-seminar .class-facts {
  border: none; border-bottom: 1px solid var(--hair-light, #d4e2ee);
}
.single-class .class-facts li, .single-seminar .class-facts li { align-items: center; gap: 20px; }
.fact-value { color: var(--navy-soft); overflow-wrap: break-word; min-width: 0; }
.class-uketsuke {
  font-size: 16px; line-height: 1.9; letter-spacing: .03em;
  color: var(--navy-soft); text-align: left; max-width: 600px; margin: 18px auto 0;
}
.class-cta { text-align: center; margin-top: 34px; }

/* 講師カード */
.class-people { max-width: 720px; margin: 0 auto; }
.class-person {
  background: var(--white); padding: 34px 32px; margin-bottom: 22px;
  border: 1px solid var(--hair-light, #d4e2ee);
}
.class-person-name {
  font-size: 22px !important; font-weight: var(--w-base); letter-spacing: .12em; line-height: 1.6;
  color: var(--navy); text-align: center; margin: 0 0 20px;
}
.class-person-bio { font-size: 22px; line-height: 2.1; letter-spacing: .04em; color: var(--navy-soft); }
.class-person-bio img {
  max-width: 240px; height: auto; float: left;
  margin: 2px 24px 10px 0; border: 1px solid rgba(118,96,68,.18);
}
.class-person-bio p { margin: 0 0 14px; }
.class-person-link { clear: both; text-align: center; margin-top: 18px; padding-top: 8px; }
.class-profile-btn {
  display: inline-block;
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px;
  letter-spacing: .14em; color: var(--navy);
  border: 1px solid var(--navy-thread); padding: 10px 26px;
  text-decoration: none; transition: background .35s ease, letter-spacing .35s ease;
}
.class-profile-btn:hover { background: rgba(50,68,47,.05); letter-spacing: .2em; }

/* Paired CTA buttons (SJ: お申し込み + 過去の配信動画) — centred, stack on mobile.
   Ghost variant for the secondary action. PDF link rendered as a quiet button.
   参加費 box (seminar payment snippet) contained + centred. (Genio 2026-06-18) */
.class-cta--pair { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; align-items: center; }
.tp-session-btn--ghost { background: transparent; color: var(--navy, #32442f); }
.tp-session-btn--ghost:hover { background: var(--navy, #32442f); color: #fdfcf8; }
.pdf-btn {
  display: inline-block;
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px;
  letter-spacing: .12em; color: var(--navy);
  border: 1px solid var(--navy-thread); padding: 11px 28px;
  text-decoration: none; transition: background .35s ease, letter-spacing .35s ease;
}
.pdf-btn:hover { background: rgba(50,68,47,.05); letter-spacing: .18em; }
.sj-logo { display: block; margin: 0 auto 8px; width: 180px; height: auto; }
.seminar-fee { max-width: 560px; margin: 0 auto 28px; text-align: center; }
.seminar-fee .su-box { margin: 0 !important; }

/* 受講料・注意・ご案内ブロック */
.class-lead { font-size: 22px; line-height: 1.9; letter-spacing: .05em; color: var(--navy); text-align: center; margin: 0 0 24px; }
.class-note { color: var(--navy-soft); font-size: 16px !important; margin-top: 18px; }

/* マニュアル等の本物リスト（旧「・」＋改行の疑似リストを <ul.cls-list> へ整形。
   左端は本文と揃え＝ハンギングインデントで marker だけ左に出す。Kohei 2026-06-29）。 */
.class-prose ul.cls-list { list-style: none; margin: 16px 0 20px; padding-left: 0; }
.class-prose ul.cls-list li {
    position: relative; padding-left: 1.25em; text-indent: -1.25em;
    margin: 0 0 .5em; line-height: 1.95;
}
.class-prose ul.cls-list li::before { content: "・"; color: var(--navy-mute, rgba(47,93,52,.55)); }
/* ※注釈：一段引いて控えめに（注意書きとして本文と差をつける） */
.class-prose p.cls-annot {
    font-size: 16px !important; line-height: 1.9 !important;
    color: var(--navy-mute, rgba(47,93,52,.55)); margin-top: 16px; letter-spacing: .02em;
}
/* 対象者ラベル（新規受講生の皆様 / 再受講生の皆様）：静かな小見出し＝字間＋下罫で
   "誰向けの段落か"を一目で。文言は不変、見せ方だけ。 */
.class-prose p.cls-aud-label {
    font-size: 16px !important; line-height: 1.6 !important; letter-spacing: .14em;
    color: var(--navy); margin: 30px 0 10px; padding-bottom: 7px;
    border-bottom: 1px solid var(--hair-light, #d4e2ee);
}
.class-info-block + .class-info-block { margin-top: 26px; padding-top: 26px; border-top: 1px solid var(--navy-thread); }

/* お申し込みの流れ（番号付きステップ） */
.class-flow .service-body-inner { max-width: 720px; }
.flow-steps { list-style: none; margin: 0 auto 8px; padding: 0; max-width: 620px; }
.flow-steps li {
  display: flex; align-items: flex-start; gap: 18px;
  padding: 20px 0; border-bottom: 1px solid var(--navy-thread);
}
.flow-num {
  flex-shrink: 0; width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--navy); color: #fdfcf8;
  font-family: var(--ff-en); font-size: 22px; letter-spacing: 0;
}
.flow-text {
  font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 22px; line-height: 1.9; letter-spacing: .04em; color: var(--navy-soft);
  text-align: left;
}
.flow-text strong { font-weight: var(--w-base); color: var(--navy); }

@media (max-width: 600px) {
  /* mobile-first: the class page is read mostly on phones — tighten the type
     ladder so 22px body doesn't dominate the small screen (Genio 2026-06-15). */
  .class-person { padding: 26px 20px; }
  .class-person-bio img { float: none; display: block; margin: 0 auto 16px; max-width: 100%; }
  .flow-steps li { gap: 14px; }

  .class-subhead { font-size: 22px !important; letter-spacing: .12em; margin-bottom: 18px; }
  .class-person-name { font-size: 22px !important; }
  .class-facts li { font-size: 22px; }
  .class-prose, .class-lead,
  .class-prose p, .class-prose li, .class-prose span, .class-prose font,
  .class-prose div, .class-prose td, .class-prose a,
  .class-person-bio, .class-person-bio p, .class-person-bio li, .class-person-bio span {
    font-size: 22px !important; line-height: 2 !important;
  }
  .class-prose h1, .class-prose h2, .class-prose h3, .class-prose h4,
  .class-person-bio h1, .class-person-bio h2, .class-person-bio h3, .class-person-bio h4 {
    font-size: 22px !important; margin: 28px 0 12px !important;
  }
  .flow-text { font-size: 16px; }
  .flow-num { width: 32px; height: 32px; font-size: 16px; }
  .class-segment { margin: 0 0 36px; }
  .class-segment + .class-segment { margin-top: 36px; padding-top: 36px; }
}

/* ============================================
   Mobile title scale — phones (Genio 2026-06-15)
   ROOT CAUSE: the 36px TITLE tier (h1/h2/記事タイトル) and the申込文 had NO
   mobile rule anywhere, so on phones they stayed 36/22 while body shrank to
   18 — looking oversized next to the readable body. Scale the title tier
   36→28 and the booking intro 22→18 so the whole page is proportional.
   Placed last so it wins over the !important title rules regardless of source. */
@media (max-width: 600px) {
  h1, h2, h3,
  .article-title, .teacher-jp, .lineage-intro h1, .sj-feature-title,
  .door-title, .kr-deeper-title {
    /* theme.json gives headings 0.22em tracking — far too wide on a phone, it
       forced ugly mid-word breaks (2026年6月ヘルスク/ラス). Tighten on mobile. */
    letter-spacing: .06em !important;
  }
  h1, h2,
  .article-title, .teacher-jp, .lineage-intro h1, .sj-feature-title,
  .door-title, .kr-deeper-title {
    font-size: 28px !important;
    line-height: 1.5 !important;
  }
  /* headings back onto the mobile ladder (font_ladder_audit 2026-06-16):
     article/section titles = 28 (title tier, inherit rule above), person name
     + form/section subheads = 22. */
  .ta-name, .sj-reg-form-inner h2, .teachers-sec .sec-title { font-size: 22px !important; }
  .booking-intro p { font-size: 22px !important; line-height: 2 !important; }

  /* ── BODY tier 22 → 18, SUBHEAD tier 26 → 22 — unified across EVERY page
     (Genio 2026-06-16: 携帯は全ページ同じレスポンシブ・ラダーに一本化).
     Previously only the class page shrank its body on mobile; .article-body /
     .service-body stayed 22 on phones. Scoped to the shared content containers
     so nav / footer / tile captions keep their own intentional sizes. */
  .service-body p, .service-body ul li, .service-body ol li,
  .service-body .lead, .service-body blockquote,
  .article-body p, .article-body ul li, .article-body ol li,
  .article-body .lead,
  /* every other reading-body container site-wide (KR / sessions / contact /
     teacher・about bio / catalog text / list intro) so the 22→18 mobile body
     size is identical on every page. Hero quotes / decorative EN lines are
     feature text, intentionally left at their size. */
  .service-hero p, .lead,
  .kr-bio p, .kr-history p, .kr-personal-cta p, .kr-service-feature p,
  .kr-message-pointer p, .kr-movies-intro p, .kr-deeper-desc,
  .sessions-intro p, .contact-intro p, .ct-intro p, .ct-quote,
  .sj-feature-desc, .tp-bio, .tp-bio p, .fl-intro,
  /* home + about prose (front-page door descriptions, はじめての方へ系譜本文) */
  .door-desc, .band-body, .band-body p, .brief-body, .brief-body p,
  .intro-body p, .lineage-essay > p, .lineage-text p {
    font-size: 22px !important;
    line-height: 2 !important;
  }
  .service-body h3, .article-body h3, .class-subhead, .service-hero .lead {
    font-size: 22px !important;
  }
  /* cross-nav links + instructor message body follow the body tier on mobile */
  .kr-cross-links a, .inst-msg-body { font-size: 22px !important; }
}

/* ============================================================ *
 *  2026-06-16 Genio feedback: footer lang links, cleaning-tool
 *  density, WooCommerce cart restyle.
 * ============================================================ */

/* Footer language switcher is now real <a> links (was dead <button>s) — mirror
   the button styling so the switch works from the footer too. */
.foot-lang a {
  position: relative; font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 22px; letter-spacing: .14em;
  padding: 10px 18px; border: 1px solid var(--navy-hair); color: var(--navy);
  background: transparent; opacity: .85; text-decoration: none;
  transition: all .4s ease;
}
.foot-lang a.on { opacity: 1; background: var(--navy); color: var(--beige); border-color: var(--navy); }
.foot-lang a:hover { opacity: 1; border-color: var(--navy); }

/* Cleaning-tool product tiles: names looked too big in the narrow 2-up mobile
   grid (Genio) — drop the loop title to 16 on mobile so it stops wrapping into
   a tall stack; PC stays 18. */
@media (max-width: 600px) {
  .ct-products ul.products li.product .woocommerce-loop-product__title {
    font-size: 16px; line-height: 1.6;
  }
}

/* ============================================================ *
 *  WooCommerce CART  —  /cart/  (Aman restyle, Genio 2026-06-16)
 *  CLASSIC shortcode cart (NOT block cart):
 *    form.woocommerce-cart-form > table.shop_table.shop_table_responsive.cart
 *    .cart-collaterals > .cart_totals  +  .wc-proceed-to-checkout
 * ============================================================ */
.woocommerce-cart .article-body { max-width: 920px; margin: 0 auto; }
.woocommerce-cart .article-title { margin-top: 24px; }
.woocommerce-cart .woocommerce { font-family: var(--ff-jp); color: var(--navy); }
.woocommerce-cart .woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-cart table.shop_table.cart {
  width: 100%; border: 1px solid var(--navy-thread); border-collapse: collapse;
  border-radius: 0; margin: 0 0 40px;
}
.woocommerce-cart table.shop_table.cart thead th {
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; letter-spacing: .14em;
  color: var(--navy); background: var(--beige);
  border-bottom: 1px solid var(--navy-thread); padding: 14px 12px; text-align: left;
}
.woocommerce-cart table.shop_table.cart td {
  border-top: 1px solid var(--navy-thread); padding: 18px 12px;
  font-size: 16px; letter-spacing: .04em; vertical-align: middle; background: var(--white);
}
.woocommerce-cart table.shop_table.cart .product-thumbnail img {
  width: 72px; height: auto; border: 1px solid var(--navy-thread); border-radius: 0;
}
.woocommerce-cart table.shop_table.cart .product-name a {
  color: var(--navy); text-decoration: none; font-size: 16px; line-height: 1.7;
  border-bottom: 1px solid var(--navy-thread);
}
.woocommerce-cart table.shop_table.cart .product-name a:hover { letter-spacing: .04em; opacity: .7; }
.woocommerce-cart .woocommerce-Price-amount { font-family: var(--ff-en); letter-spacing: .06em; color: var(--navy-soft); }
.woocommerce-cart td.product-remove a.remove {
  color: var(--navy-soft) !important; background: transparent !important;
  font-size: 22px; line-height: 1; border-radius: 0; width: auto; height: auto;
}
.woocommerce-cart td.product-remove a.remove:hover { color: var(--navy) !important; }
.woocommerce-cart .quantity input.qty {
  width: 64px; padding: 8px 6px; text-align: center; font-family: var(--ff-en); font-size: 16px;
  color: var(--navy); background: var(--white);
  border: 1px solid var(--navy-thread); border-radius: 0;
}
.woocommerce-cart table.shop_table .actions { padding: 18px 12px; background: var(--beige); }
.woocommerce-cart .coupon label { display: none; }
.woocommerce-cart .coupon .input-text {
  padding: 10px 12px; font-size: 16px; color: var(--navy);
  border: 1px solid var(--navy-thread); border-radius: 0; background: var(--white);
  min-width: 0; max-width: 200px;
}
.woocommerce-cart .actions .button,
.woocommerce-cart .coupon .button,
.woocommerce-cart a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.button {
  display: inline-block; font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .12em; line-height: 1.4;
  color: #fdfcf8 !important; background: var(--navy) !important;
  border: 1px solid var(--navy) !important; border-radius: 0 !important;
  padding: 12px 26px; text-decoration: none; cursor: pointer;
  transition: background .3s ease, letter-spacing .3s ease;
}
.woocommerce-cart .actions .button:hover,
.woocommerce-cart .coupon .button:hover,
.woocommerce-cart a.checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.button:hover {
  background: #44583f !important; letter-spacing: .18em;
}
.woocommerce-cart .actions .button[name="update_cart"] {
  background: var(--white) !important; color: var(--navy) !important;
}
.woocommerce-cart .actions .button[name="update_cart"]:hover {
  background: var(--beige) !important; color: var(--navy) !important;
}
.woocommerce-cart .cart-collaterals { width: 100%; float: none; margin-top: 8px; }
.woocommerce-cart .cart_totals { width: 100%; max-width: 460px; margin-left: auto; }
.woocommerce-cart .cart_totals h2 {
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 22px; letter-spacing: .12em;
  color: var(--navy); text-align: center; margin: 0 0 18px;
}
.woocommerce-cart .cart_totals table {
  width: 100%; border: 1px solid var(--navy-thread); border-collapse: collapse; border-radius: 0;
}
.woocommerce-cart .cart_totals th,
.woocommerce-cart .cart_totals td {
  padding: 14px 16px; border-top: 1px solid var(--navy-thread);
  font-size: 16px; letter-spacing: .04em; background: var(--white); text-align: left;
}
.woocommerce-cart .cart_totals th {
  font-family: var(--ff-jp); font-weight: var(--w-base); color: var(--navy); width: 42%; background: var(--beige);
}
.woocommerce-cart .cart_totals tr:first-child th,
.woocommerce-cart .cart_totals tr:first-child td { border-top: 0; }
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
  font-size: 22px; color: var(--navy); border-top: 1px solid var(--navy);
}
.woocommerce-cart .cart_totals .order-total .woocommerce-Price-amount { color: var(--navy); }
.woocommerce-cart .woocommerce-shipping-destination { font-size: 16px; color: var(--navy-soft); letter-spacing: .04em; }
.woocommerce-cart .shipping-calculator-button {
  color: var(--navy); border-bottom: 1px solid var(--navy-thread); text-decoration: none; font-size: 16px;
}
.woocommerce-cart .shipping-calculator-form .input-text,
.woocommerce-cart .shipping-calculator-form select {
  width: 100%; padding: 10px 12px; font-size: 16px; color: var(--navy);
  border: 1px solid var(--navy-thread); border-radius: 0; background: var(--white);
}
.woocommerce-cart .wc-proceed-to-checkout { padding: 22px 0 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display: block; width: 100%; text-align: center; padding: 18px 24px; font-size: 16px;
}
@media (max-width: 600px) {
  .woocommerce-cart .article-body { max-width: 100%; }
  .woocommerce-cart table.shop_table.cart thead { display: none; }
  .woocommerce-cart table.shop_table.cart tr.cart_item {
    display: block; border: 1px solid var(--navy-thread); margin-bottom: 16px; background: var(--white);
  }
  .woocommerce-cart table.shop_table.cart tr.cart_item td {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    border-top: 0; border-bottom: 1px solid var(--navy-thread); padding: 12px 14px; text-align: right;
  }
  .woocommerce-cart table.shop_table.cart tr.cart_item td:last-child { border-bottom: 0; }
  .woocommerce-cart table.shop_table.cart tr.cart_item td::before {
    content: attr(data-title); font-family: var(--ff-jp); font-size: 16px; letter-spacing: .1em;
    color: var(--navy-soft); float: none; font-weight: var(--w-base); text-align: left;
  }
  .woocommerce-cart table.shop_table.cart td.product-remove { justify-content: flex-end; }
  .woocommerce-cart table.shop_table.cart td.product-remove::before { content: ""; }
  .woocommerce-cart table.shop_table.cart td.product-thumbnail { justify-content: center; }
  .woocommerce-cart table.shop_table.cart td.product-thumbnail::before { content: ""; }
  .woocommerce-cart table.shop_table.cart td.product-thumbnail img { width: 96px; }
  .woocommerce-cart table.shop_table .actions { display: block; text-align: center; }
  .woocommerce-cart .coupon { display: flex; gap: 8px; margin-bottom: 14px; }
  .woocommerce-cart .coupon .input-text { flex: 1; max-width: none; }
  .woocommerce-cart .actions .button[name="update_cart"] { width: 100%; }
  .woocommerce-cart .cart_totals { max-width: 100%; margin-left: 0; }
  .woocommerce-cart .cart_totals .order-total th,
  .woocommerce-cart .cart_totals .order-total td { font-size: 22px; }
}

/* ============================================================ *
 *  WooCommerce CHECKOUT  —  /checkout/  (Genio 2026-06-16)
 *  Mobile complaints: 国/都道府県の文字がめちゃくちゃ小さい.
 *  Mirror the cart styling: labels 14px, inputs/selects 16px square hairline,
 *  the select2 country/state dropdown 16px, order review table like cart totals,
 *  green 16px square place-order button. No overflow at 390.
 * ============================================================ */
.woocommerce-checkout .article-body { max-width: 920px; margin: 0 auto; }
.woocommerce-checkout .woocommerce { font-family: var(--ff-jp); color: var(--navy); }
.woocommerce-checkout .woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-checkout form.checkout { display: block; }
.woocommerce-checkout #customer_details { width: 100%; float: none; }
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 { width: 100%; float: none; padding: 0; }
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 22px !important;
  letter-spacing: .12em; color: var(--navy); text-align: center;
  margin: 0 0 26px; line-height: 1.5;
}
.woocommerce-checkout .form-row { margin: 0 0 22px; }
.woocommerce-checkout .form-row label,
.woocommerce-checkout label {
  display: block; font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px; letter-spacing: .12em; color: var(--navy); margin-bottom: 8px;
}
.woocommerce-checkout .required { color: var(--navy-soft); text-decoration: none; }
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select {
  width: 100%; max-width: 100%; box-sizing: border-box;
  background: var(--white); border: 1px solid var(--navy-thread); border-radius: 0;
  padding: 12px 14px; font-family: var(--ff-jp); font-weight: var(--w-base);
  font-size: 16px !important; line-height: 1.5; color: var(--navy);
  -webkit-appearance: none; appearance: none;
}
.woocommerce-checkout .form-row textarea { min-height: 110px; }
.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus { outline: none; border-color: var(--navy); }
/* select2 country / prefecture — the tiny text Genio flagged */
.woocommerce-checkout .select2-container { width: 100% !important; }
.woocommerce-checkout .select2-container .select2-selection--single {
  height: auto; min-height: 46px; background: var(--white);
  border: 1px solid var(--navy-thread); border-radius: 0; display: flex; align-items: center;
}
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; line-height: 1.5;
  color: var(--navy); padding: 12px 14px;
}
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow {
  height: 44px; right: 8px;
}
/* the open dropdown is appended to <body>, so scope by the select2 dropdown class */
.select2-dropdown,
.select2-container--default .select2-results__option {
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; color: var(--navy);
}
.select2-dropdown { border: 1px solid var(--navy-thread); border-radius: 0; }
.select2-container--default .select2-search--dropdown .select2-search__field {
  font-size: 16px; border: 1px solid var(--navy-thread); border-radius: 0; padding: 8px 10px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--beige); color: var(--navy);
}
/* order review table — styled like the cart totals */
.woocommerce-checkout #order_review { width: 100%; float: none; margin-top: 12px; }
.woocommerce-checkout table.shop_table {
  width: 100%; border: 1px solid var(--navy-thread); border-collapse: collapse; border-radius: 0; margin: 0 0 28px;
}
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
  padding: 14px 16px; border-top: 1px solid var(--navy-thread);
  font-size: 16px; letter-spacing: .04em; background: var(--white); text-align: left;
  font-family: var(--ff-jp); font-weight: var(--w-base); color: var(--navy);
}
.woocommerce-checkout table.shop_table thead th { background: var(--beige); font-size: 16px; letter-spacing: .12em; }
.woocommerce-checkout table.shop_table tfoot th,
.woocommerce-checkout table.shop_table tfoot td { background: var(--white); }
.woocommerce-checkout table.shop_table tfoot tr.order-total th,
.woocommerce-checkout table.shop_table tfoot tr.order-total td {
  font-size: 22px; color: var(--navy); border-top: 1px solid var(--navy);
}
.woocommerce-checkout .woocommerce-Price-amount { font-family: var(--ff-en); letter-spacing: .06em; color: var(--navy-soft); }
.woocommerce-checkout table.shop_table tfoot tr.order-total .woocommerce-Price-amount { color: var(--navy); }
.woocommerce-checkout #payment { background: var(--beige); border-radius: 0; }
.woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid var(--navy-thread); padding: 18px 16px;
}
.woocommerce-checkout #payment ul.payment_methods li { font-size: 16px; color: var(--navy); }
.woocommerce-checkout #payment div.payment_box { font-size: 16px; color: var(--navy-soft); background: var(--white); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--white); }
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { font-size: 16px; color: var(--navy-soft); padding: 14px 16px; }
/* place order button — green 16px square, full width on mobile */
.woocommerce-checkout #place_order,
.woocommerce-checkout #payment #place_order {
  display: block; width: 100%; margin: 8px 0 0;
  font-family: var(--ff-jp); font-weight: var(--w-base); font-size: 16px; letter-spacing: .14em; line-height: 1.4;
  color: #fdfcf8 !important; background: var(--navy) !important;
  border: 1px solid var(--navy) !important; border-radius: 0 !important;
  padding: 16px 26px; text-decoration: none; cursor: pointer;
  transition: background .3s ease, letter-spacing .3s ease;
}
.woocommerce-checkout #place_order:hover { background: #44583f !important; letter-spacing: .2em; }
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-info {
  font-size: 16px; color: var(--navy-soft); background: var(--beige);
  border-top: 2px solid var(--navy-hair); border-radius: 0;
}
.woocommerce-checkout .woocommerce-info a { color: var(--navy); border-bottom: 1px solid var(--navy-thread); text-decoration: none; }
@media (max-width: 600px) {
  .woocommerce-checkout .article-body { max-width: 100%; }
  .woocommerce-checkout h3, .woocommerce-checkout #order_review_heading { font-size: 22px !important; }
}

/* Stacked logo header (Kohey 2026-06-18, option C): the new logo is the wood
   mark + HO'OPONOPONO wordmark stacked vertically, so the header grows to fit
   it. The !important also stops WooCommerce's img reset (cart/checkout) from
   inflating the logo to its natural size (Genio 2026-06-16). */
.fh-inner { height: auto !important; padding-top: 8px !important; padding-bottom: 8px !important; }
.fh-brand-img { height: 70px !important; width: auto !important; max-width: none !important; }
/* Header icons +25% (Genio 2026-06-22): burger 22->27.5px, search 20->25px.
   現状が事実上標準の 24px より小さいという指摘を受けて。PC・携帯共通。 */
.fh-burger { width: 27.5px !important; height: 27.5px !important; }
.fh-search { width: 25px !important; height: 25px !important; }
/* anchor jumps (#booking / #form / #newsletter) must clear the header */
html { scroll-padding-top: 90px; }
@media (max-width: 768px) {
  .fh-brand-img { height: 54px !important; }
  .fh-inner { padding-top: 6px !important; padding-bottom: 6px !important; }
  html { scroll-padding-top: 70px; }
}

/* Product loop titles are <h2> and were getting caught by the global
   h1,h2{36/28!important} title rule -> product names rendered at 28px on mobile
   (Genio: 文字大きすぎる). Force them small with matching !important. */
.ct-products ul.products li.product .woocommerce-loop-product__title,
.ct-products ul.products li.product h2.woocommerce-loop-product__title {
  font-size: 16px !important; line-height: 1.55 !important; letter-spacing: .03em;
  font-weight: var(--w-base);
}
@media (max-width: 600px) {
  .ct-products ul.products li.product .woocommerce-loop-product__title {
    font-size: 16px !important;
  }
}

/* ---- Event-announcement popup (hooponopono/event-popup) ----------------- *
 * Compact bottom-anchored card (Genio 2026-06-17, ref jayshetty.me): slides up
 * from the bottom-right, NO dimming scrim, logo top-centre. S1 layout for one
 * event, D1 (date+title+arrow rows) for two. Hidden by default; hpp-popup.js
 * adds .is-open ~1.2s after load (7-day frequency cap).
 * Colour = 案4 ダーク青緑 (Genio 2026-06-18): dark teal panel #294a40 with
 * cream text #f4f1e9 (high contrast, stands out from the white page), cream
 * logo mark, cream-filled CTA with dark-teal text.                            */
.hpp-popup {
  position: fixed;
  right: 32px;
  bottom: 40px;
  left: auto;
  z-index: 9999;
  width: 320px; /* shrunk after logo removal — Kohey 2026-06-18 */
  max-width: calc(100vw - 32px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(48px);
  transition: opacity .42s ease, transform .5s cubic-bezier(.22, .61, .36, 1), visibility .42s ease;
}
.hpp-popup.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.hpp-popup-panel {
  position: relative;
  background: #294a40;
  border: 1px solid #294a40;
  padding: 26px 24px 24px; /* tighter after logo removal — Kohey 2026-06-18 */
  text-align: center;
  box-sizing: border-box;
  box-shadow: 0 18px 48px rgba(41, 74, 64, .28);
}
.hpp-popup-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: none;
  border: 0;
  padding: 6px;
  line-height: 1;
  font-size: 22px;
  color: #f4f1e9;
  cursor: pointer;
  font-family: var(--ff-jp, "Noto Serif JP", serif);
}
.hpp-popup-close:hover { opacity: .6; }
.hpp-popup-logo { display: none; } /* logo removed from popup — Kohey 2026-06-18 */

/* ----- S1: single event ----- */
.hpp-popup-meta {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .2em;
  color: rgba(244, 241, 233, .72);
  margin: 0 0 9px;
}
.hpp-popup-title {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 22px;
  line-height: 1.5;
  letter-spacing: .1em;
  color: #f4f1e9;
  margin: 0 0 14px;
}
.hpp-popup-body {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: .06em;
  color: rgba(244, 241, 233, .86);
  margin: 0 0 22px;
}
.hpp-popup-cta-wrap { text-align: center; }
.hpp-popup-cta {
  display: inline-block;
  background: #f4f1e9;
  color: #294a40;
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .14em;
  line-height: 1.4;
  text-decoration: none;
  padding: 14px 32px;
  transition: letter-spacing .3s ease, opacity .3s ease;
}
.hpp-popup-cta:hover {
  letter-spacing: .22em;
  opacity: .92;
}

/* ----- D1: two events (date + title + arrow rows) ----- */
.hpp-popup-dhead {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .16em;
  color: rgba(244, 241, 233, .72);
  margin: 0 0 18px;
}
.hpp-popup-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 2px;
  text-decoration: none;
  text-align: left;
  color: #f4f1e9;
  transition: opacity .3s ease;
}
.hpp-popup-row + .hpp-popup-row {
  border-top: 1px solid rgba(244, 241, 233, .22);
}
.hpp-popup-row:hover { opacity: .68; }
.hpp-row-date {
  display: block;
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .16em;
  color: rgba(244, 241, 233, .72);
  margin: 0 0 6px;
}
.hpp-row-ttl {
  display: block;
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 22px;
  letter-spacing: .08em;
  line-height: 1.45;
  color: #f4f1e9;
}
.hpp-row-arw {
  flex: none;
  font-size: 16px;
  color: #f4f1e9;
}

/* ----- Permanent newsletter sign-up (Kohey 2026-06-18) ----- *
 * Always at the foot of the popup. Same Noto Serif as the rest of the popup;
 * cream-on-teal to match 案4. Cream-filled 登録する button = the popup CTA.   */
.hpp-popup-news {
  margin-top: 0; /* remove the extra line of space between the last row and the divider — Genio 2026-06-18 */
  padding-top: 20px;
  border-top: 1px solid rgba(244, 241, 233, .22);
}
.hpp-popup-news-head {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .16em;
  color: rgba(244, 241, 233, .86);
  margin: 0 0 12px;
  text-align: center;
}
.hpp-popup-news-form { margin: 0; }
.hpp-popup-news-form input[type="email"] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .04em;
  padding: 11px 12px;
  margin: 0 0 10px;
  border: 1px solid rgba(244, 241, 233, .45);
  border-radius: 0;
  background: rgba(244, 241, 233, .06);
  color: #f4f1e9;
}
.hpp-popup-news-form input[type="email"]::placeholder { color: rgba(244, 241, 233, .5); }
.hpp-popup-news-form button {
  display: block;
  width: 100%;
  background: #f4f1e9;
  color: #294a40;
  border: 0;
  border-radius: 0;
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .14em;
  padding: 12px;
  cursor: pointer;
  transition: letter-spacing .3s ease, opacity .3s ease;
}
.hpp-popup-news-form button:hover { letter-spacing: .22em; opacity: .92; }
.hpp-popup-news-form button[disabled] { opacity: .55; cursor: default; }
.hpp-popup-news-thanks {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .08em;
  color: #f4f1e9;
  text-align: center;
  margin: 0;
}
/* inline-subscribe feedback line + polished ✓ confirmation (案B, Genio 2026-06-19).
 * The tick is drawn with CSS borders — glyph fonts render tofu in Noto Serif. */
.hpp-popup-news-msg {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  line-height: 1.85;
  letter-spacing: .08em;
  color: #f4f1e9;
  text-align: center;
  margin: 8px 0 0;
}
.hpp-popup-news.is-done { text-align: center; }
.hpp-popup-news-msg.is-ok { position: relative; padding-top: 56px; margin: 6px 0 2px; }
.hpp-popup-news-msg.is-ok::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 42px;
  height: 42px;
  border: 1px solid rgba(244, 241, 233, .55);
  border-radius: 50%;
}
.hpp-popup-news-msg.is-ok::after {
  content: "";
  position: absolute;
  top: 14px;
  left: 50%;
  width: 9px;
  height: 16px;
  margin-left: -5px;
  border: solid #f4f1e9;
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(42deg);
}

@media (max-width: 600px) {
  .hpp-popup {
    right: 16px;
    left: 16px;
    bottom: 22px;
    width: auto;
    max-width: none;
  }
  .hpp-popup-panel { padding: 24px 22px 24px; }
  .hpp-popup-title { font-size: 22px; }
}

/* ---- Seminar (講演会) long-form body: left-align prose, centred headings --- *
 * The shared .sj-reg skin centres everything (fine for the short WWA / SJ
 * registration copy), but a KR講演会 page is long-form reading, so body text
 * reads better left-aligned while headings stay centred (Genio 2026-06-18).   */
.single-seminar .sj-reg-inner { text-align: left; }
.single-seminar .sj-reg-inner h2,
.single-seminar .sj-reg-inner h3 { text-align: center; }
.single-seminar .sj-reg-inner h2 {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 22px;
  letter-spacing: .14em;
  color: var(--navy, #2f5d34);
  margin: 48px 0 18px;
}
.single-seminar .sj-reg-inner ul { padding-left: 1.3em; }
.single-seminar .sj-reg-inner li {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  line-height: 1.95;
  color: var(--navy-soft, #536454);
  margin-bottom: 6px;
}

/* ---- Strawberry Jam archived video — watch / purchase page ---------------- *
 * single-strawberry-jam-video.html. Title + the SVP paywall (Strawberry Videos
 * Simple by KOHEY: locked poster + passcode + ￥5,000 buy button + gated
 * player) + editorial intro. The plugin ships a generic blue/rounded skin; the
 * rules below re-dress every .svp-* control in the site palette — forest-green
 * square CTA, Noto Serif, no radius (Genio 2026-06-18).                        */
.sjv-watch { background: var(--white, #fafafa); padding: 8px 0 8px; }
.sjv-watch-inner { max-width: 720px; margin: 0 auto; padding: 0 24px; }

/* Locked poster + revealed player: square corners, no plugin rounding. */
.sjv-watch .svp-locked-box,
.sjv-watch .svp-player-frame { border-radius: 0 !important; }
.sjv-watch .svp-locked-overlay { background: rgba(50, 68, 47, .5); backdrop-filter: blur(2px); }
.sjv-watch .svp-locked-text {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .14em;
  color: #f4f1e9;
  border: 1px solid rgba(244, 241, 233, .55);
  border-radius: 0;
}

/* Checkout / passcode wrappers centred under the video. */
.sjv-watch .svp-checkout,
.sjv-watch .svp-passcode { margin-top: 22px; text-align: center; }

/* All SVP buttons -> the standard square forest-green CTA. */
.sjv-watch .svp-btn {
  display: inline-block;
  background: var(--navy, #2f5d34) !important;
  color: var(--white, #fafafa) !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-family: var(--ff-jp, "Noto Serif JP", serif) !important;
  font-weight: var(--w-base) !important;
  font-size: 16px !important;
  letter-spacing: .14em !important;
  line-height: 1.4 !important;
  padding: 14px 34px !important;
  cursor: pointer;
  transition: letter-spacing .3s ease, opacity .3s ease;
}
.sjv-watch .svp-btn:hover { letter-spacing: .22em !important; opacity: .92; }
.sjv-watch .svp-open-passcode {
  background: none !important;
  color: var(--navy, #2f5d34) !important;
  font-size: 16px !important;
  padding: 6px 4px !important;
  text-decoration: underline;
  text-underline-offset: 5px;
}
.sjv-watch .svp-note {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  letter-spacing: .08em;
  color: var(--navy-soft, #536454);
  margin-top: 12px;
}
.sjv-watch .svp-passcode-form {
  max-width: 360px;
  margin: 12px auto 0;
  text-align: left;
}
.sjv-watch .svp-passcode-form input[type="email"],
.sjv-watch .svp-passcode-form input[type="text"] {
  width: 100%;
  box-sizing: border-box;
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-size: 16px;
  padding: 10px 12px;
  border: 1px solid var(--hair, #c6d6e4);
  border-radius: 0;
  background: var(--white, #fafafa);
}
.sjv-watch .svp-passcode-form label {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  color: var(--navy-soft, #536454);
}
.sjv-watch .svp-already,
.sjv-watch .svp-notice {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  color: var(--navy, #2f5d34);
  background: var(--beige, #e7f1f7);
  border: 1px solid var(--hair, #c6d6e4);
  border-radius: 0;
  padding: 14px 18px;
}
.sjv-watch .svp-expiry {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-size: 16px;
  letter-spacing: .08em;
  color: var(--navy-soft, #536454);
  text-align: center;
  margin-top: 10px;
}

/* Editorial intro under the player (alternating beige section). */
.sjv-intro { background: var(--beige, #e7f1f7); padding: 56px 0 64px; }
.sjv-intro-inner { max-width: 680px; margin: 0 auto; padding: 0 24px; }
.sjv-intro-inner h2 {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-style: italic !important; /* 「Irene's note」をイタリックに。全体の body*{font-style:normal!important} を上書き（Kohei 2026-06-29） */
  font-size: 22px;
  letter-spacing: .04em; /* Latin italic はトラッキングを詰める（Kohei 2026-06-29） */
  color: var(--navy, #2f5d34);
  text-align: center;
  margin: 0 0 24px;
}
.sjv-intro-inner p {
  font-family: var(--ff-jp, "Noto Serif JP", serif);
  font-weight: var(--w-base);
  font-size: 16px;
  line-height: 2.05;
  letter-spacing: .04em;
  color: var(--navy-soft, #536454);
  margin: 0 0 18px;
  text-align: left;
}
.sjv-back-sec { background: var(--white, #fafafa); padding: 40px 0 64px; text-align: center; }
.sjv-back { margin: 0; }

@media (max-width: 600px) {
  .sjv-intro { padding: 40px 0 48px; }
  .sjv-intro-inner p { font-size: 16px; line-height: 1.95; }
  .single-seminar .sj-reg-inner h2 { font-size: 22px; }
}

/* Force the site serif onto ALL WooCommerce text on cart/checkout (default Woo
   uses the system sans on labels/inputs/select2/notices) so it matches the rest
   of the site (Genio 2026-06-16). Prices keep --ff-en. */
.woocommerce-cart .woocommerce,
.woocommerce-cart .woocommerce input,
.woocommerce-cart .woocommerce select,
.woocommerce-cart .woocommerce textarea,
.woocommerce-cart .woocommerce label,
.woocommerce-cart .woocommerce th,
.woocommerce-cart .woocommerce td,
.woocommerce-cart .woocommerce a,
.woocommerce-cart .select2-container,
.woocommerce-checkout .woocommerce,
.woocommerce-checkout .woocommerce input,
.woocommerce-checkout .woocommerce select,
.woocommerce-checkout .woocommerce textarea,
.woocommerce-checkout .woocommerce label,
.woocommerce-checkout .woocommerce th,
.woocommerce-checkout .woocommerce td,
.woocommerce-checkout .woocommerce a,
.woocommerce-checkout .select2-container,
.woocommerce-checkout .select2-results__option,
.woocommerce-checkout .select2-selection__rendered {
  font-family: var(--ff-jp) !important;
}
.woocommerce-cart .woocommerce-Price-amount,
.woocommerce-checkout .woocommerce-Price-amount { font-family: var(--ff-en) !important; }

/* defensive: never show a product short-description in the catalog tiles
   (Genio: 料金の下の要約不要) */
.ct-products ul.products li.product .woocommerce-product-details__short-description,
.ct-products ul.products li.product p:not(.price):not(.stock) { display: none !important; }

/* Single product: WooCommerce's default block template renders a post-excerpt
   "summary" under the price. Our products have no short_description, so WP
   auto-trims the long description into it → it duplicates the full 説明 tab
   below (Kohey 2026-06-25: 商品ページに説明が重複してる→片方削除). Hide the
   redundant summary; the canonical 説明 tab keeps the full text. */
.single-product .wp-block-post-excerpt { display: none; }


/* ====== 2026-06-19 Genio フォント統一（クリーニングツール二次ナビ + 3rd-party form fields） ====== */
/* 「← 一覧へ戻る」(.kr-cross-nav-back) を 16px に統一。
   ※ .door-cta 系は 2026-06-21 に既定 16px へ統一済（冒頭 CTA pattern）。 */
.kr-cross-nav-back { font-size: 16px; }
/* Mailchimp-for-WooCommerce が checkout に出すメルマガ購読フィールド: 13px -> 14px に統一 */
.woocommerce-checkout .mailchimp-newsletter,
.woocommerce-checkout .mailchimp-newsletter *,
.woocommerce-checkout #mailchimp_woocommerce_newsletter_field,
.woocommerce-checkout #mailchimp_woocommerce_newsletter_field label { font-size: 16px !important; }

/* ====== 2026-06-19 story 記事の「体験談を送る」CTA（rec 直上に JS 挿入） ======
 * 配置=「次に読む・観る」(div.hpp-rec) 直上（誤検出修正は single-story.html）。
 * サイズは .door-cta 既定 16px に従う（2026-06-21 CTA統一）。 */
.story-submit-cta-wrap { text-align: center; margin: 48px 0 8px; }

/* ============================================================
 * 本文の太さ調整 (Irene→Genio 2026-06-24): 本文 300 は細すぎ→ 550 採用。
 * フォント/雰囲気は維持。見出し・eyebrow・CTA の Light(300) は据え置き。
 * ヒーローの引用2つ(.hero-quote-jp/.founder-quote)は対象外(Genio指定)。
 * 500;600;700 を font loader に追加済(CJK は可変でなく離散ウェイト)。
 * ============================================================ */
main p:not(.hero-quote-jp), main li, main dd,
.service-body, .tp-bio, .pp-quote,
.lead, .intro-lead, .reading-body, .article-body {
  font-weight: var(--w-base) !important;
}

/* TRUE uniform weight (Genio 2026-06-25「全部450」): catch the two element
 * groups that escape the variable — form controls (UA default 400) and the
 * recommendation block (server-injected inline font-weight:300). */
input, textarea, select, button, optgroup {
  font-weight: var(--w-base) !important;
}
.hpp-rec, .hpp-rec * {
  font-weight: var(--w-base) !important;
}

/* ============================================================ *
 *  WooCommerce ORDER RECEIVED  —  /checkout/order-received/
 *  注文完了（サンクス）ページ Aman restyle (Genio 2026-06-25:
 *  「実際に購入したら汚い・全体的にきれいに」)
 *  Block-based confirmation (WooCommerce block theme):
 *    .wc-block-order-confirmation-status   — サンクス見出し
 *    .wc-block-order-confirmation-summary  — 注文番号/日付/合計/メール/支払方法
 *    .wc-block-order-confirmation-totals    — 明細テーブル
 *    .wc-block-order-confirmation-address-wrapper — 配送先/請求先 2カラム
 *    .wc-block-order-confirmation-additional-information — 銀行口座詳細(BACS)
 *  すべて body.woocommerce-order-received にスコープ（このページ限定）。
 * ============================================================ */
.woocommerce-order-received .article-body { max-width: 720px; margin: 0 auto; }
/* このページの post-title は空。空 h1 の余白を畳む */
.woocommerce-order-received .article-title:empty { display: none; }
/* alignwide ブロックを本文カラム幅に収める */
.woocommerce-order-received .article-body .alignwide {
  max-width: 100%; margin-left: auto; margin-right: auto;
}

/* サンクス見出し */
.woocommerce-order-received .wc-block-order-confirmation-status {
  text-align: center; margin: 8px 0 48px; padding-bottom: 36px;
  border-bottom: 1px solid var(--navy-thread);
}
.woocommerce-order-received .wc-block-order-confirmation-status h1 {
  font-family: var(--ff-jp); font-weight: var(--w-base) !important; color: var(--navy);
  font-size: 36px !important; letter-spacing: .08em; line-height: 1.5; margin: 0 0 14px;
}
.woocommerce-order-received .wc-block-order-confirmation-status p {
  font-size: 16px; color: var(--navy-soft); letter-spacing: .04em; line-height: 1.9; margin: 0;
}

/* 注文サマリー（注文番号 / 日付 / 合計 / メール / 支払方法） */
.woocommerce-order-received .wc-block-order-confirmation-summary { margin: 0 0 48px; }
.woocommerce-order-received .wc-block-order-confirmation-summary-list {
  list-style: none; margin: 0; padding: 0; border: 1px solid var(--navy-thread);
}
.woocommerce-order-received .wc-block-order-confirmation-summary-list-item {
  display: flex; justify-content: space-between; align-items: baseline; gap: 18px;
  padding: 14px 18px; border-top: 1px solid var(--navy-thread);
  font-size: 16px !important; letter-spacing: .04em; margin: 0;
}
.woocommerce-order-received .wc-block-order-confirmation-summary-list-item:first-child { border-top: 0; }
.woocommerce-order-received .wc-block-order-confirmation-summary-list-item__key,
.woocommerce-order-received .wc-block-order-confirmation-summary-list-item__value {
  font-size: 16px !important; font-weight: var(--w-base) !important;
}
.woocommerce-order-received .wc-block-order-confirmation-summary-list-item__key {
  font-family: var(--ff-jp); color: var(--navy); white-space: nowrap;
}
.woocommerce-order-received .wc-block-order-confirmation-summary-list-item__value {
  color: var(--navy-soft); text-align: right; overflow-wrap: anywhere;
}

/* セクション見出し（注文詳細 / 配送先 / 請求先 / 銀行口座詳細） */
.woocommerce-order-received .wc-block-order-confirmation-totals-wrapper > h2,
.woocommerce-order-received .wc-block-order-confirmation-shipping-wrapper > h2,
.woocommerce-order-received .wc-block-order-confirmation-billing-wrapper > h2,
.woocommerce-order-received .wc-block-order-confirmation-additional-information > h2,
.woocommerce-order-received .wc-block-order-confirmation-additional-information > h3 {
  font-family: var(--ff-jp); font-weight: var(--w-base); color: var(--navy);
  font-size: 22px; letter-spacing: .12em; text-align: center; margin: 0 0 18px;
}

/* 明細テーブル */
.woocommerce-order-received .wc-block-order-confirmation-totals { margin: 0 0 48px; }
.woocommerce-order-received .wc-block-order-confirmation-totals__table {
  width: 100%; border-collapse: collapse; border: 1px solid var(--navy-thread);
}
.woocommerce-order-received .wc-block-order-confirmation-totals__table th,
.woocommerce-order-received .wc-block-order-confirmation-totals__table td,
.woocommerce-order-received .wc-block-order-confirmation-totals__table th *,
.woocommerce-order-received .wc-block-order-confirmation-totals__table td * {
  font-size: 16px !important; font-weight: var(--w-base) !important;
}
.woocommerce-order-received .wc-block-order-confirmation-totals__table th,
.woocommerce-order-received .wc-block-order-confirmation-totals__table td {
  padding: 14px 16px; border-top: 1px solid var(--navy-thread);
  letter-spacing: .04em; text-align: left; vertical-align: top; line-height: 1.8;
}
.woocommerce-order-received .wc-block-order-confirmation-totals__table thead th {
  font-family: var(--ff-jp); color: var(--navy); background: var(--beige); border-top: 0;
}
.woocommerce-order-received .wc-block-order-confirmation-totals__total { text-align: right; white-space: nowrap; }
.woocommerce-order-received .wc-block-order-confirmation-totals__label {
  font-family: var(--ff-jp); color: var(--navy); background: var(--beige);
}
.woocommerce-order-received .wc-block-order-confirmation-totals__product a {
  color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--navy-thread);
}
.woocommerce-order-received .wc-block-order-confirmation-totals__product a:hover { opacity: .7; }
.woocommerce-order-received .wc-block-order-confirmation-totals__product .product-quantity {
  font-family: var(--ff-en); color: var(--navy-mute); font-weight: var(--w-base); letter-spacing: .06em; white-space: nowrap;
}
.woocommerce-order-received .wc-block-order-confirmation-totals .woocommerce-Price-amount {
  font-family: var(--ff-en); color: var(--navy-soft); letter-spacing: .06em;
}
/* 合計（最終行）を強調 — 本文 22px（ラダー内）。太字は使わずサイズと色で */
.woocommerce-order-received .wc-block-order-confirmation-totals__table tr:last-child th,
.woocommerce-order-received .wc-block-order-confirmation-totals__table tr:last-child td,
.woocommerce-order-received .wc-block-order-confirmation-totals__table tr:last-child th *,
.woocommerce-order-received .wc-block-order-confirmation-totals__table tr:last-child td * {
  font-size: 22px !important; color: var(--navy);
}
.woocommerce-order-received .wc-block-order-confirmation-totals__table tr:last-child th,
.woocommerce-order-received .wc-block-order-confirmation-totals__table tr:last-child td {
  border-top: 1px solid var(--navy);
}

/* 配送先 / 請求先 */
.woocommerce-order-received .wc-block-order-confirmation-address-wrapper {
  gap: 32px; margin: 0 0 48px; align-items: stretch;
}
.woocommerce-order-received .wc-block-order-confirmation-address-wrapper address {
  font-style: normal; font-size: 16px; line-height: 2; color: var(--navy-soft);
  letter-spacing: .04em; background: var(--beige); padding: 20px 22px; height: 100%;
}
.woocommerce-order-received .woocommerce-customer-details--phone {
  margin: 10px 0 0; font-size: 16px; color: var(--navy-soft); letter-spacing: .04em;
}

/* 銀行口座詳細（BACS） */
.woocommerce-order-received .wc-block-order-confirmation-additional-information { margin: 0 0 8px; }
.woocommerce-order-received .order_details.bankjp_details { list-style: none; margin: 0; padding: 0; }
.woocommerce-order-received .bankjp_details .account_info {
  background: var(--beige); padding: 18px 22px; margin: 0 0 14px;
  font-size: 16px; line-height: 2; letter-spacing: .04em; color: var(--navy-soft);
}
.woocommerce-order-received .bankjp_details .account_info:last-child { margin-bottom: 0; }
.woocommerce-order-received .bankjp_details .account_info strong {
  color: var(--navy); font-weight: var(--w-base);
}

@media (max-width: 600px) {
  .woocommerce-order-received .article-body { max-width: 100%; }
  .woocommerce-order-received .wc-block-order-confirmation-status h1 { font-size: 28px !important; letter-spacing: .04em; }
  .woocommerce-order-received .wc-block-order-confirmation-address-wrapper { flex-direction: column; gap: 16px; }
  .woocommerce-order-received .wc-block-order-confirmation-totals__table th,
  .woocommerce-order-received .wc-block-order-confirmation-totals__table td { padding: 12px 13px; }
}

/* ============================================================ *
 *  2026-06-25 バッチ（Kohei 5件のレイアウト/メタ + Genio 見出し統一4P）
 * ============================================================ */

/* 2. izi/private-session 講師カードの左右幅が不揃い。grid は repeat(2,1fr) だが
   カード内画像が min-width:auto で 1fr トラックを押し広げ 505/381px に膨張していた。
   → グリッド項目に min-width:0、画像に max-width で 1fr を均等化 (Kohei) */
.instructors-grid > .instructor-card { min-width: 0; }
.instructor-card img { max-width: 100%; }
/* keep the inst-photo cover behaviour (the line above used to force height:auto,
   which left a beige gap below the photo — Kohei 2026-06-25 mobile) */
.instructor-card .inst-photo img { height: 100% !important; }

/* 3. class 日程・会場の情報テーブル（ACFブロック）が prose 内で左寄せ。
   中央のタイトル/CTA に対しBOXだけ左にズレて見える → BOXをセンタリング
   （テキスト整列ではなくBOX位置／Kohei） */
.class-info-sec table { margin-left: auto; margin-right: auto; }
/* 注意書きの各トピック（会場・アクセス／オンライン参加／ご参加にあたって／キャンセル規定）を
   淡いカードに統一（受講料・facts と同じ調子・Genio 2026-06-29）。長文の壁が分節されて読みやすく。 */
.single-class .class-segment, .single-seminar .class-segment {
    max-width: 720px; margin: 0 auto 22px; padding: 30px 36px 26px;
    border: 1px solid var(--hair-light, #d4e2ee);
}
.single-class .class-segment:last-child, .single-seminar .class-segment:last-child { margin-bottom: 0; }
.single-class .class-segment .class-subhead, .single-seminar .class-segment .class-subhead {
    margin-top: 0; padding-bottom: 16px; border-bottom: 1px solid var(--hair-light, #d4e2ee);
}

/* 5. 商品ページ: SKU・カテゴリーは管理用情報なので表を非表示 (Kohei) */
.single-product .wp-block-woocommerce-product-meta { display: none; }

/* 6. class/health-class: 会場・アクセス／オンライン参加／ご参加にあたって／キャンセル規定
   の大セクション見出し(.class-subhead)が22で他(36)と不揃い → 36 に統一 (Genio B方針) */
.single-class .class-subhead { font-size: 36px !important; }
@media (max-width: 600px) { .single-class .class-subhead { font-size: 28px !important; } }

/* 7. izi: 「KR の個人セッション」(.kr-deeper-title) が h3 なのに36 → サブ見出しは22。
   ※ KR 各ページの .kr-deeper-title は大セクション扱いで36のまま保持するため izi 限定 */
.single-izi .kr-deeper-title { font-size: 22px !important; }

/* 8. event-overview: クラス名(.ec-title)が 18px・一部300 とラダー外 → 22px・450 に統一 (Genio) */
.page-id-3455 .ec-title { font-size: 22px !important; font-weight: var(--w-base) !important; }

/* 9. about-introduction: セクション見出しの太さが300/450混在（preview移植の page 内
   inline <style> `.intro-section-head-band h2{font-weight:300}` が残存）→ 450 に統一 (Genio) */
.page-id-15741 .intro-section-head-band h2 { font-weight: var(--w-base) !important; }

/* ===== FAQ (reading/faq) — Irene content rebuild 2026-06-26 ===== */
.faq-morrnah { margin: 0 auto 12px; max-width: 460px; }
.faq-quote {
  font-style: italic;
  font-weight: var(--w-bold, 700);
  font-size: 22px;
  line-height: 1.95;
  color: var(--navy);
  background: var(--beige);
  border: none;
  padding: 30px 40px;
  margin: 40px auto;
  max-width: 720px;
  text-align: center;
}
.faq-quote p { margin: 0; }
/* Q&A: question headings get a touch more space; answers left-aligned (global rule already left-aligns p) */
.article-body .faq-quote + p { margin-top: 28px; }
/* quote must be italic too (Irene: 太字＋イタリック) — a child rule was resetting it */
.faq-quote, .faq-quote p { font-style: italic !important; }
/* FAQ page: hide the featured-image thumbnail + the モーナ teacher-chip box
   (Genio 2026-06-26: 不要). Scoped to the FAQ post — staging id 3278; update the
   id (or switch to a slug-based body class) at prod cutover. */
body.postid-3278 .article-hero,
body.postid-3278 .article-teacher-chips { display: none !important; }

/* ===== FAQ Q&A boxes — clear question/answer separation (Genio 2026-06-26, live-style) ===== */
.article-body .faq-item { max-width: 760px; margin: 0 auto 16px; }
.article-body .faq-q {
  background: var(--navy); color: #fdfcf8;
  font-size: 22px; font-weight: var(--w-bold, 700); line-height: 1.7;
  letter-spacing: .03em; margin: 0; padding: 16px 26px 16px 58px;
  position: relative; text-align: left;
}
.article-body .faq-q::before {
  content: "Q"; position: absolute; left: 24px; top: 16px;
  font-style: italic; font-weight: 700; opacity: .6;
}
.article-body .faq-a {
  background: var(--beige); color: var(--navy);
  font-size: 22px !important; line-height: 1.95; margin: 0; padding: 18px 26px 20px 58px;
  position: relative; text-align: left;
}
.article-body .faq-a::before {
  content: "A"; position: absolute; left: 24px; top: 18px;
  font-style: italic; font-weight: 700; opacity: .42;
}
.article-body .faq-a a { color: var(--navy); text-decoration: underline; }
/* reference articles as cards (Genio: ボックス化) */
.faq-refs { display: grid; gap: 10px; margin: 12px 0 4px; }
.faq-ref-card {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  background: #fff; border: 1px solid var(--hair, #c6d6e4);
  padding: 15px 20px; color: var(--navy); text-decoration: none;
  font-size: 16px; line-height: 1.65; transition: background .3s ease, border-color .3s ease;
}
.faq-ref-card:hover { background: var(--beige); border-color: var(--navy); }
.faq-ref-arrow { flex-shrink: 0; opacity: .6; }
/* Q box text was overridden to green-on-green by the global heading color — force cream */
.article-body .faq-q, .article-body .faq-q::before { color: #fdfcf8 !important; }
/* beat the global .article-body :is(h..):not(.has-white-color) green rule (0,2,1) */
.article-body h3.faq-q, .article-body h3.faq-q::before { color: #fdfcf8 !important; }
/* Q/A letter badges removed (the italic "Q" read as "9" and overlapped the text on
   mobile) + questions centered (Genio 2026-06-26). Answers stay left = body rule. */
.article-body .faq-q::before, .article-body .faq-a::before { content: none !important; }
.article-body .faq-q { text-align: center !important; padding: 16px 26px !important; }
.article-body .faq-a { padding: 18px 26px 20px !important; }

/* ===== FAQ feature band on home — cinematic Morrnah + quote → FAQ (Genio 2026-06-26) ===== */
.faq-feature { position: relative; overflow: hidden; padding: 90px 24px; text-align: center; }
.faq-feature-bg { position: absolute; inset: 0; z-index: 0; }
.faq-feature-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 26%; }
.faq-feature-overlay { position: absolute; inset: 0; z-index: 1; background: rgba(47, 93, 52, .84); }
.faq-feature-inner { position: relative; z-index: 2; max-width: 760px; margin: 0 auto; }
.faq-feature-eyebrow { color: #fdfcf8; opacity: .82; letter-spacing: .34em; font-size: 16px; margin-bottom: 30px; }
.faq-feature-quote { color: #fdfcf8; font-style: italic; font-size: 28px; line-height: 2.0; letter-spacing: .04em; margin: 0 auto 30px; border: none; padding: 0; max-width: 680px; }
.faq-feature-quote p { margin: 0; }
.faq-feature-by { color: #fdfcf8; opacity: .78; font-size: 16px; letter-spacing: .1em; margin-bottom: 40px; }
.faq-feature-cta { display: inline-block; color: #fdfcf8; border: 1px solid rgba(253,252,248,.55); padding: 14px 34px; font-size: 16px; letter-spacing: .14em; text-decoration: none; transition: background .35s ease, color .35s ease, letter-spacing .35s ease; }
.faq-feature-cta:hover { background: #fdfcf8; color: var(--navy); letter-spacing: .2em; }
@media (min-width: 768px) {
  .faq-feature { padding: 130px 24px; }
  .faq-feature-quote { font-size: 36px; line-height: 1.9; }
}

/* faq-feature refinements (Genio 2026-06-26): title-size heading, hero-quote-sized
   (22px) quote, B&W (grayscale) photo + transparency instead of green, refined CTA */
.faq-feature-bg img { filter: grayscale(1) contrast(1.04); object-position: center 22%; }
.faq-feature-overlay { background: rgba(18, 22, 20, .5); }
.faq-feature-eyebrow { font-size: 28px; letter-spacing: .18em; line-height: 1.5; opacity: 1; margin-bottom: 34px; font-weight: var(--w-base); }
.faq-feature-quote { font-style: normal; font-size: 22px; letter-spacing: .14em; line-height: 2.1; max-width: 680px; }
.faq-feature-cta { border: none; padding: 0 2px 6px; font-size: 16px; letter-spacing: .16em; border-bottom: 1px solid rgba(253,252,248,.55); }
.faq-feature-cta:hover { background: transparent; color: #fdfcf8; letter-spacing: .26em; border-bottom-color: #fdfcf8; }
@media (min-width: 768px) {
  .faq-feature-eyebrow { font-size: 36px; letter-spacing: .22em; margin-bottom: 40px; }
  .faq-feature-quote { font-size: 22px; }
}

/* ===== リーディングスタディ 話ナビ (前の回 / 一覧 / 次の回) — Genio 2026-06-26 ===== */
.rs-nav { display: flex; flex-wrap: wrap; gap: 10px; max-width: 760px; margin: 52px auto 8px; }
.rs-nav-btn { display: flex; align-items: center; justify-content: center; text-align: center; padding: 15px 14px; font-size: 16px; letter-spacing: .06em; color: var(--navy); border: 1px solid var(--hair, #c6d6e4); text-decoration: none; transition: background .3s ease, border-color .3s ease; }
.rs-nav-btn:hover { background: var(--beige); border-color: var(--navy); }
.rs-nav-prev { order: 1; flex: 1 1 45%; }
.rs-nav-next { order: 2; flex: 1 1 45%; }
.rs-nav-list { order: 3; flex: 1 1 100%; background: var(--navy); color: #fdfcf8; border-color: var(--navy); }
.rs-nav-list:hover { background: #44583f; color: #fdfcf8; }
.rs-nav-empty { border: none; pointer-events: none; background: none; }
@media (min-width: 600px) {
  .rs-nav-prev, .rs-nav-next { flex: 1 1 0; }
  .rs-nav-list { order: 2; flex: 1.3 1 0; }
  .rs-nav-next { order: 3; }
}
/* リーディングスタディ シリーズ入口の2ボタンナビ（一覧 / 次へ） */
.rs-nav--entry .rs-nav-list { order: 1; flex: 1 1 45%; }
.rs-nav--entry .rs-nav-next { order: 2; flex: 1 1 45%; }