/* Shared mobile layout for the public exam guide. Desktop styles stay in exam-reference.css. */
@media (max-width:760px) {
  .exam-reference { --ref-line:#e5e7f1; }
  .exam-reference .wrap,.exam-reference .exam-layout.exam-content { width:calc(100% - 32px); }
  .exam-reference .exam-main { overflow-wrap:break-word; word-break:normal; }
  .exam-reference .exam-main>section.panel { padding:24px 0; margin:0; }
  .exam-reference .exam-main h2 { font-size:22px; line-height:1.35; letter-spacing:-.4px; margin-bottom:22px; }
  .exam-reference .exam-main h2:after { height:3px; width:32px; bottom:-8px; }
  .exam-reference .exam-main p,.exam-reference .exam-main .intro { font-size:15px; line-height:1.65; }
  .exam-reference .exam-hero { padding:22px 0 44px; background:linear-gradient(145deg,#f7f7ff,#f0f6ff); }
  .exam-reference .exam-hero .breadcrumb { font-size:12px; line-height:1.6; margin-bottom:20px; }
  .exam-reference .red-pill { font-size:12px; padding:7px 12px; border-width:1px; }
  .exam-reference .exam-hero h1 { font-size:clamp(28px,7vw,36px); line-height:1.22; letter-spacing:-.7px; margin:16px 0 10px; }
  .exam-reference .exam-hero .hero-grid>div>p { font-size:15px; line-height:1.65; }
  .exam-reference .exam-hero .actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:20px; }
  .exam-reference .exam-hero .actions a { min-width:0; width:100%; padding:12px 6px; font-size:clamp(10px,3vw,13px); line-height:1.4; min-height:46px; gap:5px; white-space:nowrap; letter-spacing:-.2px; grid-column:auto; justify-content:center; }
  .exam-reference .exam-hero-art.reference-art-clean { max-width:360px; }
  .exam-reference .reference-metrics { padding:16px 8px; gap:16px 0; margin-top:-24px; border:1px solid var(--ref-line); border-radius:16px; box-shadow:0 6px 20px #2b2b8108; }
  .exam-reference .reference-metric { gap:10px; padding:0 10px; min-width:0; align-items:center; }
  .exam-reference .reference-metric>div { min-width:0; }
  .exam-reference .reference-metric strong { font-size:16px; line-height:1.35; }
  .exam-reference .reference-metric div>span { font-size:12px; line-height:1.4; }
  .exam-reference .reference-icon { width:36px; height:36px; min-width:36px; flex-basis:36px; border-radius:11px; }
  .exam-reference .reference-icon svg { width:21px; height:21px; }
  .exam-reference .exam-tabs { box-shadow:0 4px 12px #2b2b8106; }
  .exam-reference .exam-tabs .wrap { gap:22px; scrollbar-width:none; }
  .exam-reference .exam-tabs .wrap::-webkit-scrollbar { display:none; }
  .exam-reference .exam-tabs a { font-size:13px; padding:15px 0 12px; border-bottom-width:3px; }
  .exam-reference .exam-facts { gap:10px; }
  .exam-reference .exam-overview .exam-fact { padding:16px 14px; gap:10px; border-radius:12px; }
  .exam-reference .exam-overview .exam-fact>span { font-size:12px; padding-right:22px; }
  .exam-reference .exam-overview .exam-fact strong { font-size:14px; line-height:1.5; }
  .exam-reference .exam-overview .exam-fact>svg { width:18px; height:18px; top:16px; right:12px; }
  .exam-reference .reference-eligibility,.exam-reference .reference-fees,.exam-reference .reference-ending { gap:16px; padding:20px 0; }
  .exam-reference .reference-eligibility>section,.exam-reference .reference-fees>section,.exam-reference .reference-ending>section { padding:20px 18px; border-radius:16px; box-shadow:0 4px 16px #2b2b8105; }
  .exam-reference .reference-eligibility h2,.exam-reference .reference-fees h2,.exam-reference #documents h2 { font-size:20px; margin-bottom:12px; }
  .exam-reference #eligibility li { font-size:15px; gap:12px; padding:14px 0; }
  .exam-reference #eligibility li svg { width:22px; height:22px; padding:10px; margin:0; }
  .exam-reference .exam-note { gap:10px; }
  .exam-reference .exam-note p { font-size:13px; }
  .exam-reference .exam-training-facts { padding:6px 16px 16px; gap:0; border:1px solid var(--ref-line); border-radius:16px; }
  .exam-reference .exam-training-facts .exam-fact { padding:16px 0 16px 56px; border-bottom:1px solid var(--ref-line); }
  .exam-reference .exam-training-facts .exam-fact svg { top:17px; width:22px; height:22px; padding:10px; }
  .exam-reference .exam-training-facts .exam-fact>span { font-size:12px; }
  .exam-reference .exam-training-facts .exam-fact strong { font-size:15px; }
  .exam-reference .exam-training-facts>a { margin-top:16px; width:100%; }
  .exam-reference .journey { gap:0; margin:0; }
  .exam-reference .journey li { align-items:flex-start; gap:14px; padding:16px 0; border-bottom:1px solid var(--ref-line); }
  .exam-reference .journey li:last-child { border:0; }
  .exam-reference .journey li>span { flex:0 0 40px; min-width:40px; height:40px; font-size:17px; border-radius:12px; white-space:nowrap; }
  .exam-reference .exam-main .journey h3 { font-size:16px; }
  .exam-reference .reference-pattern-body { gap:14px; }
  .exam-reference .exam-pattern-grid { grid-template-columns:1fr; padding:4px 16px; border:1px solid var(--ref-line); border-radius:16px; }
  .exam-reference .exam-pattern-item { flex-direction:row; align-items:center; gap:12px; padding:14px 0; }
  .exam-reference .exam-pattern-item:last-child { border-bottom:0; }
  .exam-reference .exam-pattern-icon { width:40px; height:40px; min-width:40px; flex:0 0 40px; border-radius:12px; }
  .exam-reference .exam-pattern-icon svg { width:23px; height:23px; }
  .exam-reference .exam-pattern-item small { font-size:12px; }
  .exam-reference .exam-pattern-item strong { font-size:15px; margin-top:3px; }
  .exam-reference .reference-score { display:grid; grid-template-columns:100px minmax(0,1fr); gap:4px 18px; align-items:center; text-align:left; padding:18px; border-radius:16px; }
  .exam-reference .reference-score-ring { grid-column:1; grid-row:1 / 3; width:100px; }
  .exam-reference .reference-score h3 { grid-column:2; margin:0; align-self:end; font-size:18px; }
  .exam-reference .reference-score p { grid-column:2; margin:0; align-self:start; font-size:13px; }
  .exam-reference .reference-score-ring strong { font-size:24px; }
  .exam-reference #syllabus { padding:20px 16px; margin:20px 0; border-radius:16px; }
  .exam-reference #syllabus h2 { font-size:20px; gap:10px; flex-wrap:wrap; }
  .exam-reference #syllabus h2>svg { width:24px; height:24px; }
  .exam-reference .reference-count { font-size:11px; padding:6px 9px; }
  .exam-reference .exam-syllabus { padding:0; margin:0; }
  .exam-reference .exam-syllabus li { display:flex; align-items:flex-start; gap:12px; padding:14px 0; font-size:14px; line-height:1.65; background:transparent; }
  .exam-reference .exam-syllabus li:nth-child(3n) { background:transparent; }
  .exam-reference .reference-chapter { display:grid; place-items:center; flex:0 0 34px; min-width:34px; height:34px; padding:0; white-space:nowrap; border-radius:9px; font-size:13px; font-weight:700; }
  .exam-reference .reference-syllabus-footer { padding:16px 0 0; gap:12px; font-size:13px; }
  .exam-reference .reference-syllabus-footer button { background:#2b2b81; min-height:46px; border-radius:10px; }
  .exam-reference .exam-fee-row { gap:10px; padding:16px 0; }
  .exam-reference .reference-fee-number { flex:0 0 32px; height:32px; padding:0; display:grid; place-items:center; font-size:12px; }
  .exam-reference .exam-fee-row>span:nth-child(2) { font-size:14px; line-height:1.5; min-width:0; }
  .exam-reference .exam-fee-row strong { font-size:20px; white-space:nowrap; }
  .exam-reference .exam-schedules h3 { font-size:16px; gap:8px; }
  .exam-reference .exam-schedules .exam-fact { padding:10px 14px; gap:5px; }
  .exam-reference .exam-schedules .exam-fact>span { font-size:12px; }
  .exam-reference .exam-schedules .exam-fact strong { font-size:14px; }
  .exam-reference .exam-official-links a { display:grid; grid-template-columns:42px minmax(0,1fr); padding:18px; gap:12px; border-radius:14px; }
  .exam-reference .exam-link-icon { width:42px; height:42px; }
  .exam-reference .exam-link-icon svg { width:24px; height:24px; }
  .exam-reference .exam-official-links strong { font-size:16px; line-height:1.45; }
  .exam-reference .reference-portal-button { grid-column:1/-1; margin:4px 0 0; justify-content:center; min-height:44px; padding:10px 14px; background:#2b2b81; }
  .exam-reference .exam-video { grid-template-columns:1fr; gap:10px; padding:12px; border-radius:14px; }
  .exam-reference .exam-video-image { grid-row:auto; width:100%; aspect-ratio:16/9; }
  .exam-reference .exam-video strong { font-size:16px; padding:2px 4px 0; }
  .exam-reference .exam-video>span { font-size:13px; padding:0 4px 4px; }
  .exam-reference .exam-study .study-banner { display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding:22px 18px; border-radius:16px; }
  .exam-reference .exam-study .study-banner>.reference-study-art-clean { flex:0 0 auto; width:140px; min-width:0; max-width:100%; align-self:center; }
  .exam-reference .exam-study .study-banner>div:not(.reference-study-art-clean) { flex:none; min-width:0; width:100%; text-align:left; }
  .exam-reference .exam-study .study-banner h2 { font-size:21px; margin-bottom:10px; }
  .exam-reference .exam-study .study-banner h2:after { display:none; }
  .exam-reference .exam-study .study-banner>a { width:100%; margin:0; }
  .exam-reference .help-banner { padding:20px 18px; border-radius:16px; gap:14px; }
  .exam-reference .btn { min-height:46px; border-radius:10px; }
}
@media (max-width:360px) {
  .exam-reference .reference-metric { gap:8px; padding:0 6px; }
  .exam-reference .reference-metric strong { font-size:14px; }
  .exam-reference .reference-metric div>span { font-size:11px; }

  .exam-reference .exam-overview .exam-facts { grid-template-columns:1fr; }
}

@media (max-width:760px) {
 .exam-reference .exam-hero .actions a svg { width:16px; height:16px; flex:0 0 16px; }
 .exam-reference #fees .exam-fee-row { grid-template-columns:30px minmax(0,1fr) auto; gap:10px; padding:15px 12px; border-radius:12px; margin-bottom:10px; }
 .exam-reference #fees .reference-fee-number { width:30px; height:30px; font-size:12px; }
 .exam-reference #fees .exam-fee-row>span:nth-child(2) { font-size:14px; line-height:1.45; }
 .exam-reference #fees .exam-fee-row strong { font-size:20px; }
 .exam-reference #fees .exam-fee-row small { font-size:12px; }
}
@media (max-width:360px) {
 .exam-reference #fees .exam-fee-row { gap:8px; padding:14px 10px; grid-template-columns:26px minmax(0,1fr) auto; }
 .exam-reference #fees .reference-fee-number { width:26px; height:26px; font-size:11px; }
 .exam-reference #fees .exam-fee-row>span:nth-child(2) { font-size:13px; }
 .exam-reference #fees .exam-fee-row strong { font-size:18px; }
}

@media(max-width:760px) {
 .exam-reference .exam-tabs .wrap { justify-content:flex-start; gap:4px; }
 .exam-reference .exam-tabs a { min-height:54px; padding:14px 12px 11px; gap:7px; font-size:13px; }
 .exam-reference .exam-tabs a .exam-vector-icon { width:19px; height:19px; }
}
