/* 色はCSS変数から。--isa-theme / --isa-theme-rgb は PHP から供給 */
.isa-learn{
    --base-text:  #1f2937;
    --card-shadow: 0 6px 18px rgba(0,0,0,.08), 0 0 8px rgba(0,0,0,.04);
    background: transparent;
    color: var(--base-text);
    box-sizing: border-box;
}

.isa-learn__inner{
    max-width:1200px;
    margin:0 auto;
    margin-top: 45px;
}
.isa-learn__group { margin-bottom: 45px; }

/* 見出し（左の縦バー＋太字テキスト） */
.isa-learn__heading{ display:flex; align-items:center; gap:14px; margin:0 0 20px; }
.isa-learn__bar{ width:10px; height:46px; background: var(--isa-theme); display:inline-block; }
.isa-learn__heading-text{ font-weight:700; font-size:22px; letter-spacing:.01em; }

/* ボタン群（3列） */
.isa-learn__buttons{ display:flex; gap:25px; margin-left:25px; flex-wrap:wrap; }

/* ボタン（カード） */
.isa-learn__btn{
    position:relative; display:flex; align-items:center; justify-content:center;
    height:70px; flex:0 0 175px; text-decoration:none;
    background:#fff; color:var(--base-text);
    border:1px solid rgba(0,0,0,.06);
    box-shadow: var(--card-shadow);
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
}
.isa-learn__btn:hover,
.isa-learn__btn:focus-visible{
    background: var(--isa-theme); color:#fff; transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(var(--isa-theme-rgb), .28), 0 0 10px rgba(var(--isa-theme-rgb), .18);
}
.isa-learn__btn-label{ font-weight:600; font-size:12px; text-align:center; padding:0 10px; }

/* ===== 改行コントロール ===== */
.isa-br { display:inline; }                 /* ベース：表示 */
.isa-br--all { display:inline; }            /* [br] は常時表示 */
.isa-br--pc, .isa-br--sp { display:none; }  /* 専用はデフォ非表示 */

/* PCのみ改行（1025px以上） */
@media (min-width: 1025px) {
    .isa-br--pc { display:inline; }
}

/* レスポンシブ（1024px以下は2列グリッド） */
@media (max-width:1024px){
    .isa-br--sp { display:inline; }

    /* 見出しサイズ調整 */
    .isa-learn__heading-text{ font-size: clamp(18px, 4.5vw + 1px, 60px); }

    /* “汎用” <br> はSPで消す（isa-br*付きは残す） */
    .isa-learn__btn-label br:not(.isa-br) { display:none; }

    /* ラベルの可変サイズ */
    .isa-learn__btn-label { font-size: clamp(11px, 3.3vw, 35px);}

    /* レイアウトをGridへ */
    .isa-learn__buttons{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(18px, 4vw, 38px);
        margin-left: 0;
    }
    .isa-learn__btn{
        height: clamp(68px, 17vw, 170px);
        width: 100%;
        flex: initial;
    }
    .isa-learn__bar {
        width: clamp(7px, 3.5vw, 20px);
        height: clamp(34px, 7.5vw + 1px, 92px);
        background: var(--isa-theme);
        display: inline-block;
    }
}