/* cta.css — ヘッダーサブコピー/CTA 装飾（Phase4/T2 元:store-header-subcopy.php）
   ※サブコピー文言は theme header.php の bloginfo('description') 由来。ここは装飾のみ。 */

        /* ============================================================
           a タグ自体を 2 段グリッドに。既存 store.css :1054 の inline-flex
           を specificity (body + .wn-header__brand) で上書き。
           ============================================================ */
        body .wn-header__brand .wn-brand,
        body .wn-header__brand .wn-brand--store {
            display: inline-grid;
            /* auto auto = ロゴ画像幅 + ワードマーク画像幅。1fr を使わないので
               sub の幅は logo + column-gap + wordmark の合計と一致する。 */
            grid-template-columns: auto auto;
            grid-template-rows: auto auto;
            grid-template-areas:
                "logo wordmark"
                "sub  sub";
            align-items: center;
            justify-items: start;
            column-gap: 4px;
            row-gap: 4px;
        }
        body .wn-header__brand .wn-brand--store .wn-brand__logo-img {
            grid-area: logo;
        }
        /* wm-stack を構造的にフラット化（中身の wordmark/sub が grid 直下扱いになる） */
        body .wn-header__brand .wn-brand--store .wn-brand__wm-stack {
            display: contents;
        }
        body .wn-header__brand .wn-brand--store .wn-brand__wordmark-img {
            grid-area: wordmark;
            justify-self: start;
        }
        /* キャッチコピー本体：赤・太字・全幅・既存 mute color を specificity で上書き */
        body .wn-header__brand .wn-brand--store .wn-brand__sub {
            grid-area: sub;
            display: block;
            font-size: clamp(11px, 1.4vw, 14px);
            font-weight: 700;
            color: #D43030;
            letter-spacing: .03em;
            line-height: 1.25;
            margin: 2px 0 0;
            white-space: nowrap;
        }
        /* ダークモード */
        html[data-theme="dark"] body .wn-header__brand .wn-brand--store .wn-brand__sub {
            color: #FF7878;
        }
        /* モバイル: 既存 store.css :1097 の display:none を打ち消し、可読幅で表示。
           specificity (body + .wn-header__brand + 子孫) で上書き。 */
        @media (max-width: 600px) {
            body .wn-header__brand .wn-brand--store .wn-brand__sub {
                display: block;
                font-size: 10.5px;
                white-space: normal;
                max-width: 240px;
            }
        }