/* GK One-Line Q&A page — added 2026-08-05, redesigned 2026-08-07 for a
   richer look (gradient hero, colored per-category accents, card-style
   rows with hover + copy-to-clipboard). UPDATED (2026-08-07): now backed
   by the real `questions` table with server-side pagination, so tabs
   are real links (not JS toggles) and there's a pagination bar. */
.qna-hero{position:relative;max-width:900px;margin:0 auto;padding:44px 20px 22px;text-align:center;overflow:hidden}
.qna-hero::before{content:'';position:absolute;top:-60px;left:50%;transform:translateX(-50%);width:520px;height:220px;background:radial-gradient(ellipse at center,rgba(79,70,229,.10) 0,rgba(16,185,129,.08) 45%,transparent 70%);pointer-events:none;z-index:-1}
.qna-hero .hero-badge{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--indigo-l,#eef2ff),var(--green-l,#f0fdf4));color:var(--indigo,#4f46e5);font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;padding:6px 16px;border-radius:20px;margin-bottom:14px;box-shadow:inset 0 0 0 1px rgba(79,70,229,.15)}
.qna-hero h1{font-family:var(--font-h,'Outfit',sans-serif);font-size:clamp(24px,4vw,36px);font-weight:800;color:#0f172a;margin-bottom:10px;letter-spacing:-.5px}
.qna-hero p{color:#475569;font-size:15px;max-width:640px;margin:0 auto;line-height:1.6}
.qna-wrap{max-width:920px;margin:0 auto;padding:10px 20px 60px}
.qna-search{position:relative;margin:22px 0 22px}
.qna-search input{width:100%;padding:14px 16px 14px 44px;border:1.5px solid #e2e8f0;border-radius:14px;font-size:14px;font-family:inherit;outline:none;transition:border-color .15s,box-shadow .15s}
.qna-search input:focus{border-color:#4f46e5;box-shadow:0 0 0 4px rgba(79,70,229,.09)}
.qna-search i{position:absolute;left:17px;top:50%;transform:translateY(-50%);color:#94a3b8;font-size:14px}
.qna-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.qna-tab{border:1.5px solid #e2e8f0;background:#fff;color:#475569;font-size:12.5px;font-weight:700;padding:8px 15px;border-radius:20px;cursor:pointer;transition:.15s}
.qna-tab:hover{border-color:#4f46e5;color:#4f46e5;transform:translateY(-1px)}
.qna-tab.active{background:linear-gradient(135deg,#4f46e5,#7c3aed);border-color:transparent;color:#fff;box-shadow:0 4px 12px rgba(79,70,229,.28)}
.qna-section{margin-bottom:34px}
.qna-section h2{font-size:15.5px;font-weight:800;color:#0f172a;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid #f1f5f9;display:flex;align-items:center;gap:10px}
.qna-section h2::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--sc,#4f46e5);flex-shrink:0}
.qna-section h2 .cnt{font-size:11px;font-weight:700;color:var(--sc,#4f46e5);background:var(--sc-l,#eef2ff);padding:3px 10px;border-radius:10px;margin-left:auto}
/* Rotate a small accent palette across categories so each subject reads
   as its own "card group" instead of every section looking identical. */
.qna-section:nth-of-type(6n+1){--sc:#4f46e5;--sc-l:#eef2ff}
.qna-section:nth-of-type(6n+2){--sc:#059669;--sc-l:#f0fdf4}
.qna-section:nth-of-type(6n+3){--sc:#d97706;--sc-l:#fffbeb}
.qna-section:nth-of-type(6n+4){--sc:#7c3aed;--sc-l:#f5f3ff}
.qna-section:nth-of-type(6n+5){--sc:#e11d48;--sc-l:#fff1f2}
.qna-section:nth-of-type(6n+6){--sc:#0891b2;--sc-l:#ecfeff}
.qna-row{display:flex;gap:12px;padding:13px 12px;margin-bottom:6px;border-radius:11px;border:1px solid transparent;align-items:flex-start;transition:background .15s,border-color .15s,transform .15s;cursor:pointer;position:relative}
.qna-row:hover{background:var(--sc-l,#f8fafc);border-color:rgba(0,0,0,.04);transform:translateX(2px)}
.qna-q{flex:1;font-size:13.5px;color:#1e293b;font-weight:600;line-height:1.55}
.qna-q i{color:var(--sc,#4f46e5);margin-right:7px;font-size:11px}
.qna-a{flex-shrink:0;max-width:44%;font-size:13px;font-weight:700;text-align:right;line-height:1.5;color:var(--sc,#059669);background:var(--sc-l,#f0fdf4);padding:4px 12px;border-radius:20px;white-space:normal}
.qna-copy-hint{position:absolute;right:10px;bottom:-2px;font-size:9.5px;font-weight:700;color:#94a3b8;opacity:0;transition:opacity .15s}
.qna-row:hover .qna-copy-hint{opacity:1}
.qna-empty{display:none;text-align:center;padding:40px 20px;color:#94a3b8;font-size:14px}
.qna-empty.show{display:block}
.qna-tab{text-decoration:none;display:inline-block}
.qna-pagination{margin-top:24px;display:flex;justify-content:center}
.qna-pagination .pagination{flex-wrap:wrap;gap:4px}
@media(max-width:640px){.qna-row{flex-direction:column;gap:6px}.qna-a{max-width:100%;text-align:left}.qna-section h2 .cnt{margin-left:0}}

/* Exam Preparation FAQ — accordion variant, added 2026-08-05 */
.faq-wrap{max-width:820px;margin:0 auto;padding:10px 20px 60px}
.faq-item{border:1px solid #e2e8f0;border-radius:12px;margin-bottom:10px;overflow:hidden;background:#fff}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;background:none;border:none;padding:15px 18px;font-size:14px;font-weight:700;color:#0f172a;cursor:pointer;font-family:inherit}
.faq-q i{flex-shrink:0;color:#94a3b8;transition:transform .2s}
.faq-item.open .faq-q i{transform:rotate(180deg);color:#4f46e5}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease}
.faq-a p{padding:0 18px 16px;font-size:13.5px;line-height:1.65;color:#475569;margin:0}
.faq-cross{max-width:820px;margin:0 auto;padding:0 20px 10px;text-align:center}
.faq-cross a{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#4f46e5;text-decoration:none;background:#eef2ff;padding:9px 16px;border-radius:20px}
.faq-cross a:hover{background:#e0e7ff}

/* Exam Guides hub + detail — added 2026-08-05 */
.eg-grid{max-width:980px;margin:0 auto;padding:10px 20px 60px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.eg-card{display:block;border:1px solid #e2e8f0;border-radius:14px;padding:20px;text-decoration:none;background:#fff;transition:.15s}
.eg-card:hover{border-color:#4f46e5;box-shadow:0 8px 24px rgba(79,70,229,.1);transform:translateY(-2px)}
.eg-card h3{font-size:17px;font-weight:800;color:#0f172a;margin-bottom:4px}
.eg-card .eg-full{font-size:11.5px;color:#94a3b8;font-weight:600;margin-bottom:10px;display:block}
.eg-card p{font-size:13px;color:#475569;line-height:1.55;margin-bottom:12px}
.eg-card .eg-cta{font-size:12.5px;font-weight:700;color:#4f46e5}
.eg-detail{max-width:820px;margin:0 auto;padding:10px 20px 60px}
.eg-detail-hero{max-width:900px;margin:0 auto;padding:36px 20px 6px;text-align:center}
.eg-crumb{font-size:12px;color:#94a3b8;text-align:center;padding-top:18px}
.eg-crumb a{color:#4f46e5;text-decoration:none;font-weight:600}
.eg-section{margin:26px 0}
.eg-section h2{font-size:17px;font-weight:800;color:#0f172a;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.eg-section p{font-size:13.5px;color:#475569;line-height:1.7}
.eg-list{list-style:none;margin:0;padding:0}
.eg-list li{position:relative;padding:8px 0 8px 22px;font-size:13.5px;color:#334155;line-height:1.6;border-bottom:1px solid #f1f5f9}
.eg-list li:last-child{border-bottom:none}
.eg-list li::before{content:"→";position:absolute;left:0;color:#4f46e5;font-weight:800}
.eg-table{width:100%;border-collapse:collapse;font-size:12.5px}
.eg-table th{background:#f8fafc;text-align:left;padding:10px 12px;font-weight:700;color:#334155;border-bottom:2px solid #e2e8f0}
.eg-table td{padding:10px 12px;border-bottom:1px solid #f1f5f9;color:#475569;vertical-align:top}
.eg-syl{border:1px solid #e2e8f0;border-radius:10px;padding:14px 16px;margin-bottom:10px}
.eg-syl strong{display:block;font-size:13px;color:#0f172a;margin-bottom:4px}
.eg-syl span{font-size:12.5px;color:#64748b;line-height:1.55}
.eg-note{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:12px 16px;font-size:12.5px;color:#92400e;margin:20px 0}
.eg-other{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.eg-other a{font-size:12.5px;font-weight:700;color:#4f46e5;background:#eef2ff;padding:8px 14px;border-radius:20px;text-decoration:none}
.eg-other a:hover{background:#e0e7ff}