/* =====================================================================
   NcBose HCS — About / Prescription Generation page (/readMoreInfo).
   Reuses landing.css sections and cards; page-only classes use `ab-`.
   ===================================================================== */

.ab-hero {
    padding: 64px 0 88px;
    background:
        radial-gradient(1100px 520px at 0% 0%, #DDFBF6 0%, rgba(221, 251, 246, 0) 60%),
        linear-gradient(180deg, #F4FBFA 0%, #FFFFFF 100%);
}
.ab-hero__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.ab-hero__title { margin-top: 20px; font-size: 52px; font-weight: 800; line-height: 1.06; letter-spacing: -0.035em; }
.ab-hero__title span { color: var(--nb-primary); }
.ab-hero__sub { margin-top: 22px; max-width: 620px; font-size: 17px; line-height: 1.65; color: var(--nb-text-muted); }
.ab-hero__ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }

.ab-panel { display: grid; gap: 4px; margin: 0; padding: 12px; list-style: none; border-radius: var(--nb-r-2xl); box-shadow: var(--nb-shadow-3); }
.ab-panel li { display: flex; gap: 16px; align-items: flex-start; padding: 18px; border-radius: var(--nb-r-lg); }
.ab-panel li + li { border-top: 1px solid var(--nb-canvas); }
.ab-panel h3 { font-family: var(--nb-font-body); font-size: 16px; font-weight: 600; letter-spacing: -0.01em; }
.ab-panel p { margin-top: 4px; font-size: 14.5px; line-height: 1.55; color: var(--nb-text-muted); }

.ab-why { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.ab-why__copy { padding: 36px; }
.ab-why__copy h2 { margin-top: 14px; font-size: 30px; font-weight: 700; }
.ab-why__copy p { margin-top: 16px; font-size: 16px; line-height: 1.75; color: var(--nb-text); }
.ab-how__title { margin-bottom: 20px; font-size: 26px; font-weight: 700; }

.ab-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 48px 0 0; padding: 0; list-style: none; }
.ab-cta-wrap { padding-top: 96px; }

@media (max-width: 991px) {
    .ab-hero__grid, .ab-why { grid-template-columns: minmax(0, 1fr); gap: 40px; }
    .ab-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .ab-hero { padding: 40px 0 64px; }
    .ab-hero__title { font-size: 36px; }
    .ab-hero__ctas .nb-btn { flex: 1 1 100%; }
    .ab-why__copy { padding: 24px 20px; }
    .ab-why__copy h2 { font-size: 24px; }
    .ab-benefits { grid-template-columns: minmax(0, 1fr); }
    .ab-cta-wrap { padding-top: 64px; }
}
