/* ─────────────────────────────────────────────────────────────────────────
   IELTSBeacon Content Components CSS
   Visual components used inside page content:
   - Stat cards, criteria cards, comparison cards
   - Info/warning boxes, mistake cards, path cards
   - Band comparison, process steps, FAQ accordion
───────────────────────────────────────────────────────────────────────── */

.ibw{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#374151}
.ibw h2{font-size:22px;font-weight:800;color:#0B2545;margin:36px 0 14px;line-height:1.3;padding-top:10px;border-top:0.5px solid #f0f4f8;letter-spacing:-0.3px}
.ibw h2:first-child{margin-top:0;border-top:none;padding-top:0}
.ibw h3{font-size:17px;font-weight:700;color:#0B2545;margin:22px 0 10px}
.ibw p{font-size:15px;line-height:1.75;margin-bottom:14px;color:#374151}
.ibw ul{margin:0 0 16px 20px}
.ibw ul li{font-size:15px;line-height:1.75;margin-bottom:6px;color:#374151}
.ibw strong{font-weight:700;color:#0B2545}
.ibw a{color:#1D9E75;text-decoration:underline;text-decoration-color:rgba(29,158,117,0.3)}
.ibw a:hover{text-decoration-color:#1D9E75}
.ibw-stat-grid{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:10px;margin:18px 0 24px;width:100%}
.ibw-stat{background:#f4f7f9;border-radius:10px;padding:16px;border-left:3px solid #1D9E75}
.ibw-stat.amber{border-left-color:#EF9F27}
.ibw-stat.blue{border-left-color:#378ADD}
.ibw-stat.purple{border-left-color:#7F77DD}
.ibw-stat-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#64748b;margin-bottom:6px}
.ibw-stat-value{font-size:20px;font-weight:800;color:#0B2545;margin-bottom:4px;line-height:1.2}
.ibw-stat-sub{font-size:11px;color:#94a3b8;line-height:1.4}
.ibw-crit-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px;margin:18px 0;width:100%}
.ibw-crit{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:16px;display:flex;gap:12px;align-items:flex-start}
.ibw-crit-icon{width:38px;height:38px;min-width:38px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff}
.ibw-crit-icon.c1{background:#1D9E75}
.ibw-crit-icon.c2{background:#378ADD}
.ibw-crit-icon.c3{background:#EF9F27}
.ibw-crit-icon.c4{background:#7F77DD}
.ibw-crit h4{font-size:14px;font-weight:700;color:#0B2545;margin:0 0 4px}
.ibw-crit p{font-size:13px;color:#64748b;line-height:1.55;margin:0 0 6px}
.ibw-crit-pct{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;border-radius:4px;display:inline-block}
.ibw-crit-pct.c1{background:#E1F5EE;color:#0F6E56}
.ibw-crit-pct.c2{background:#E6F1FB;color:#0C447C}
.ibw-crit-pct.c3{background:#FAEEDA;color:#633806}
.ibw-crit-pct.c4{background:#EEEDFE;color:#3C3489}
.ibw-info,.ibw-warn{display:flex;gap:14px;align-items:flex-start;border-radius:0 10px 10px 0;padding:16px 18px;margin:22px 0}
.ibw-info{background:#E1F5EE;border-left:3px solid #1D9E75}
.ibw-warn{background:#FAEEDA;border-left:3px solid #EF9F27}
.ibw-info-icon,.ibw-warn-icon{font-size:22px;flex-shrink:0;line-height:1}
.ibw-info-icon{color:#1D9E75}
.ibw-warn-icon{color:#EF9F27}
.ibw-info-title,.ibw-warn-title{font-size:13px;font-weight:700;margin-bottom:4px}
.ibw-info-title{color:#085041}
.ibw-warn-title{color:#633806}
.ibw-info p{font-size:13px;color:#0F6E56;line-height:1.6;margin:0}
.ibw-warn p{font-size:13px;color:#854F0B;line-height:1.6;margin:0}
.ibw-compare-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:14px;margin:18px 0;width:100%}
.ibw-compare{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:18px}
.ibw-compare-badge{display:inline-block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:3px 10px;border-radius:4px;margin-bottom:10px}
.ibw-compare-badge.acad{background:#E6F1FB;color:#0C447C}
.ibw-compare-badge.gen{background:#EAF3DE;color:#3B6D11}
.ibw-compare h4{font-size:15px;font-weight:700;color:#0B2545;margin-bottom:8px}
.ibw-compare p{font-size:13px;color:#64748b;line-height:1.6;margin-bottom:8px}
.ibw-compare ul{margin:8px 0 0 16px}
.ibw-compare ul li{font-size:12px;color:#374151;margin-bottom:4px;line-height:1.5}
.ibw-mistakes{display:flex;flex-direction:column;gap:12px;margin:18px 0}
.ibw-mistake{background:#fff;border:1px solid #e2e8f0;border-left:3px solid #E24B4A;border-radius:0 10px 10px 0;padding:16px 18px;display:flex;gap:14px}
.ibw-mistake-num{flex-shrink:0;width:28px;height:28px;background:#FCEBEB;color:#A32D2D;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800}
.ibw-mistake h4{font-size:14px;font-weight:700;color:#0B2545;margin:0 0 4px}
.ibw-mistake p{font-size:13px;color:#64748b;line-height:1.65;margin:0}
.ibw-band-compare{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:14px;margin:20px 0 14px;width:100%}
.ibw-band-card{border-radius:10px;padding:18px;border:1px solid}
.ibw-band-card.b5{background:#FCEBEB;border-color:#F09595}
.ibw-band-card.b7{background:#E1F5EE;border-color:#5DCAA5}
.ibw-band-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding-bottom:10px;border-bottom:0.5px solid rgba(0,0,0,0.08)}
.ibw-band-pill{font-size:11px;font-weight:800;padding:4px 12px;border-radius:20px;color:#fff;letter-spacing:.04em}
.b5 .ibw-band-pill{background:#A32D2D}
.b7 .ibw-band-pill{background:#0F6E56}
.ibw-band-arrow{font-size:14px;font-weight:700}
.b5 .ibw-band-arrow{color:#A32D2D}
.b7 .ibw-band-arrow{color:#0F6E56}
.ibw-band-quote{font-size:13px;line-height:1.75;font-style:italic;margin:0}
.b5 .ibw-band-quote{color:#791F1F}
.b7 .ibw-band-quote{color:#085041}
.ibw-upgrades{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:16px 20px;margin:14px 0 20px}
.ibw-upgrades-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#64748b;margin-bottom:10px}
.ibw-upgrade-item{display:flex;align-items:flex-start;gap:10px;padding:6px 0;font-size:13px;color:#374151;line-height:1.6}
.ibw-upgrade-check{flex-shrink:0;margin-top:2px;color:#1D9E75;font-weight:800;font-size:14px}
.ibw-path-grid{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:12px;margin:20px 0;width:100%}
.ibw-path{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px 16px;text-align:center;transition:border-color 0.2s,transform 0.15s;text-decoration:none !important;color:inherit;display:block;min-width:0}
.ibw-path:hover{border-color:#1D9E75;transform:translateY(-2px);text-decoration:none;color:inherit}
.ibw-path-tier{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.ibw-path.p1 .ibw-path-tier{color:#A32D2D}
.ibw-path.p2 .ibw-path-tier{color:#854F0B}
.ibw-path.p3 .ibw-path-tier{color:#0F6E56}
.ibw-path-range{font-size:26px;font-weight:800;color:#0B2545;margin-bottom:10px;line-height:1.1}
.ibw-path-desc{font-size:12px;color:#64748b;line-height:1.6;margin-bottom:14px}
.ibw-path-cta{font-size:12px;font-weight:700;color:#1D9E75}
.ibw-steps{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:10px;margin:20px 0;width:100%}
.ibw-step{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:16px}
.ibw-step-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;background:#0B2545;color:#fff;border-radius:50%;font-size:12px;font-weight:800;margin-bottom:10px}
.ibw-step h4{font-size:13px;font-weight:700;color:#0B2545;margin:0 0 4px}
.ibw-step p{font-size:12px;color:#64748b;line-height:1.5;margin:0}
.ibw-section-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px;margin:18px 0;width:100%}
.ibw-section-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:18px;text-decoration:none;color:inherit;display:block;transition:border-color 0.2s,transform 0.15s}
.ibw-section-card:hover{border-color:#1D9E75;transform:translateY(-2px);text-decoration:none;color:inherit}
.ibw-section-badge{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:2px 8px;border-radius:4px;background:#E1F5EE;color:#0F6E56;margin-bottom:8px}
.ibw-section-card h4{font-size:15px;font-weight:700;color:#0B2545;margin:0 0 6px}
.ibw-section-card p{font-size:13px;color:#64748b;line-height:1.55;margin:0 0 10px}
.ibw-section-link{font-size:12px;color:#1D9E75;font-weight:700}
.ibw-faq{margin:18px 0}
.ibw-faq-item{background:#fff;border:1px solid #e2e8f0;border-radius:10px;margin-bottom:10px;overflow:hidden}
.ibw-faq-q{padding:16px 18px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700;color:#0B2545;list-style:none;user-select:none}
.ibw-faq-q::-webkit-details-marker{display:none}
.ibw-faq-q:after{content:"+";font-size:20px;font-weight:400;color:#94a3b8;transition:transform 0.2s}
details[open] .ibw-faq-q:after{content:"−"}
.ibw-faq-a{padding:0 18px 16px;font-size:14px;color:#374151;line-height:1.75}
.ibw-faq-a p{margin:0;color:#374151;font-size:14px}

@media (max-width:768px){
    /* Stat grid: 4 cols → 2 cols */
    .ibw-stat-grid{grid-template-columns:repeat(2,1fr) !important;gap:8px !important}
    .ibw-stat{padding:12px 10px !important;min-width:0 !important}
    .ibw-stat-label{font-size:9px !important;letter-spacing:.04em !important}
    .ibw-stat-value{font-size:16px !important;line-height:1.2 !important;word-break:normal !important;overflow-wrap:normal !important;hyphens:none !important}
    .ibw-stat-sub{font-size:10px !important}

    /* Steps: 4 cols → 2 cols */
    .ibw-steps{grid-template-columns:repeat(2,1fr) !important;gap:8px !important}
    .ibw-step{padding:12px !important}
    .ibw-step h4{font-size:12px !important}
    .ibw-step p{font-size:11px !important}

    /* All 2-col grids → 1 col */
    .ibw-crit-grid,
    .ibw-compare-grid,
    .ibw-band-compare,
    .ibw-section-grid{grid-template-columns:1fr !important;gap:10px !important}

    /* Path grid: 3 cols → 1 col */
    .ibw-path-grid{grid-template-columns:1fr !important;gap:10px !important}
    .ibw-path{padding:16px !important;text-align:left !important}
    .ibw-path-tier{font-size:10px !important}
    .ibw-path-range{font-size:22px !important}

    /* Headings */
    .ibw h2{font-size:19px !important}
    .ibw h3{font-size:15px !important}
}

@media (max-width:480px){
    /* Stat grid stays 2 cols but tighter */
    .ibw-stat-grid{gap:6px !important}
    .ibw-stat{padding:10px 8px !important}
    .ibw-stat-value{font-size:15px !important}
    .ibw-stat-label{font-size:8px !important}

    /* Steps: 2 cols → 1 col on very small screens */
    .ibw-steps{grid-template-columns:1fr !important}
    .ibw-step{display:flex !important;flex-direction:row !important;gap:10px !important;align-items:flex-start !important;padding:12px !important}
    .ibw-step-num{flex-shrink:0 !important;margin-bottom:0 !important}
}