/*
Theme Name: Sarkari Result Alert Info — V2
Theme URI: https://sarkariresultalertinfo.com/
Description: Modern redesign theme for Sarkari Result Alert Info — India's trusted government job portal. Royal-blue + orange UI with hero, important-updates card, colour-coded exam columns, trending strip and FAQ. Reuses the Exam/Job CPT and exam_type taxonomy, so all existing content works unchanged.
Author: Pooja Singh
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: sarkari-result-alert
*/

/* ============================================================
   0. DESIGN TOKENS
   ============================================================ */
:root {
	--navy-1: #0c2b78;
	--navy-2: #11357f;
	--navy-3: #1746a6;
	--royal:  #1c4fd6;   /* nav bar */
	--royal-d:#1740b8;
	--orange: #f7831e;
	--orange-2:#ff6a00;
	--ink:    #1f2a44;
	--muted:  #5b6b86;
	--line:   #e6ebf3;
	--bg:     #f4f6fb;
	--card:   #ffffff;
	--green:  #1f9d57;
	--purple: #7b2ff7;
	--red:    #e03b3b;
	--shadow: 0 6px 22px rgba(17, 40, 110, .08);
	--shadow-sm: 0 2px 10px rgba(17, 40, 110, .06);
	--radius: 14px;
	--radius-sm: 10px;
	--maxw: 1180px;
}

/* ============================================================
   1. BASE
   ============================================================ */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: "Segoe UI", Roboto, system-ui, -apple-system, Arial, sans-serif;
	color: var(--ink);
	background: var(--bg);
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}
a { color: var(--royal); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }
ul { margin: 0; padding: 0; list-style: none; }
.srp-container { max-width: var(--maxw); margin: 0 auto; padding: 0 16px; }
.srp-section { padding: 26px 0; }
.srp-new {
	display: inline-block;
	font-size: 9px; font-weight: 800; letter-spacing: .4px;
	color: #fff; background: var(--orange-2);
	padding: 2px 6px; border-radius: 4px; margin-left: 6px;
	vertical-align: middle; text-transform: uppercase;
}
.srp-new.red { background: var(--red); }

/* ============================================================
   2. TOP UTILITY BAR
   ============================================================ */
.srp-topbar {
	background: #01267f; /* matches the logo's blue so it sits seamlessly */
	color: #fff;
}
.srp-topbar-inner {
	display: flex; align-items: center; gap: 18px;
	padding: 12px 16px; max-width: var(--maxw); margin: 0 auto;
}
.srp-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.srp-brand:hover { text-decoration: none; }
.srp-brand-img { height: 54px; width: auto; display: block; }
@media (max-width: 600px) { .srp-brand-img { height: 42px; } }
.srp-brand-logo {
	width: 46px; height: 46px; flex: 0 0 46px;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 30%, #3f74ff, var(--royal));
	display: grid; place-items: center;
	font-size: 22px; box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.srp-brand-text b { display: block; color: #fff; font-size: 19px; font-weight: 800; line-height: 1.15; }
.srp-brand-text span { display: block; color: #bcd0ff; font-size: 11.5px; }
.srp-trustrow { display: flex; gap: 14px; margin-left: auto; }
.srp-trustrow .ti { text-align: center; min-width: 58px; }
.srp-trustrow .ti i { font-size: 17px; font-style: normal; display: block; }
.srp-trustrow .ti span { font-size: 9.5px; color: #cdddff; display: block; line-height: 1.2; margin-top: 2px; }
.srp-search { margin-left: 10px; }
.srp-search form { display: flex; background: #fff; border-radius: 30px; overflow: hidden; box-shadow: 0 4px 12px rgba(0,0,0,.18); }
.srp-search input {
	border: 0; outline: 0; padding: 10px 16px; font-size: 13px;
	width: 220px; color: var(--ink); background: transparent;
}
.srp-search button {
	border: 0; cursor: pointer; background: var(--orange);
	color: #fff; width: 44px; font-size: 15px;
}
.srp-search button:hover { background: var(--orange-2); }

/* ============================================================
   3. NAV BAR
   ============================================================ */
.srp-navwrap { background: var(--royal); position: sticky; top: 0; z-index: 40; box-shadow: 0 2px 8px rgba(12,30,90,.25); }
.srp-nav { display: flex; align-items: center; max-width: var(--maxw); margin: 0 auto; padding: 0 16px; }
.srp-nav ul.nav-links { display: flex; gap: 4px; }
.srp-nav ul.nav-links li a {
	display: block; color: #eaf0ff; font-size: 14px; font-weight: 600;
	padding: 14px 18px; border-radius: 0;
}
.srp-nav ul.nav-links li a:hover { background: var(--royal-d); color: #fff; text-decoration: none; }
.srp-nav ul.nav-links li.current-menu-item a,
.srp-nav ul.nav-links li a.active { background: var(--orange); color: #fff; }
.srp-social { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.srp-social .lbl { color: #cfe0ff; font-size: 12.5px; font-weight: 600; }
.srp-social a {
	width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
	font-size: 14px; color: #fff; text-decoration: none; transition: transform .15s;
}
.srp-social a:hover { transform: translateY(-2px); }
.srp-social a.tg { background: #2aabee; }
.srp-social a.wa { background: #25d366; }
.srp-social a.yt { background: #ff0000; }
.srp-social a.ig { background: linear-gradient(45deg,#f09433,#e6683c,#dc2743,#bc1888); }
.srp-social a.fb { background: #1877f2; }
.nav-toggle { display: none; background: none; border: 0; color: #fff; font-size: 22px; cursor: pointer; padding: 12px 14px; }

/* ============================================================
   4. HERO
   ============================================================ */
.srp-hero {
	/* Hero banner image: drop a wide photo at assets/img/hero.jpg and it shows
	   behind the navy overlay. If the file is absent, the navy gradient remains. */
	background-color: var(--navy-2);
	background-image:
		radial-gradient(900px 300px at 80% -10%, rgba(60,110,255,.30), transparent),
		linear-gradient(115deg, rgba(12,43,120,.86) 0%, rgba(15,40,110,.54) 45%, rgba(23,70,166,.44) 100%),
		url('assets/img/hero.jpg?v=2');
	background-size: cover, cover, cover;
	background-position: center, center, center 38%;
	background-repeat: no-repeat;
	color: #fff; position: relative; overflow: hidden;
}
.srp-hero-inner { display: grid; grid-template-columns: 1.15fr .85fr; gap: 30px; max-width: var(--maxw); margin: 0 auto; padding: 40px 16px 46px; align-items: start; }
.srp-badge {
	display: inline-flex; align-items: center; gap: 7px;
	background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25);
	color: #ffd9a8; font-size: 11.5px; font-weight: 700; letter-spacing: .5px;
	padding: 6px 13px; border-radius: 30px; text-transform: uppercase;
}
.srp-hero h1 { font-size: 42px; line-height: 1.1; margin: 16px 0 14px; font-weight: 800; text-shadow: 0 2px 14px rgba(6,16,50,.55); }
.srp-hero h1 em { color: var(--orange); font-style: normal; }
.srp-hero p.lede { color: #e7eefc; font-size: 15.5px; max-width: 520px; margin: 0 0 22px; text-shadow: 0 1px 10px rgba(6,16,50,.5); }
.srp-hero-pills { display: flex; flex-wrap: wrap; gap: 10px; }
.srp-hero-pills span {
	display: inline-flex; align-items: center; gap: 7px;
	background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.16);
	padding: 9px 14px; border-radius: 10px; font-size: 12.5px; color: #eaf0ff;
}
.srp-hero-pills span b { color: #fff; font-weight: 600; }

/* Important updates card */
.srp-updates {
	background: var(--card); color: var(--ink); border-radius: var(--radius);
	box-shadow: 0 14px 40px rgba(0,0,0,.28); overflow: hidden;
}
.srp-updates-head {
	display: flex; align-items: center; justify-content: space-between;
	background: linear-gradient(90deg,#1840a8,var(--royal)); color: #fff;
	padding: 13px 16px;
}
.srp-updates-head b { font-size: 15px; display: flex; align-items: center; gap: 8px; }
.srp-updates-head a { background: rgba(255,255,255,.2); color: #fff; font-size: 11px; padding: 4px 10px; border-radius: 20px; }
.srp-updates-head a:hover { background: rgba(255,255,255,.32); text-decoration: none; }
.srp-updates ul { padding: 6px 6px; }
.srp-updates li a {
	display: flex; align-items: center; gap: 10px;
	padding: 11px 12px; border-radius: 8px; color: var(--ink); font-size: 13.5px; font-weight: 500;
}
.srp-updates li a:hover { background: #eef3ff; text-decoration: none; }
.srp-updates li a .chev { color: var(--orange); font-weight: 800; }
.srp-updates li a .ttl { flex: 1; }
.srp-updates .cta {
	display: block; text-align: center; margin: 6px 10px 12px;
	background: var(--orange); color: #fff; font-weight: 700; font-size: 13.5px;
	padding: 12px; border-radius: 9px;
}
.srp-updates .cta:hover { background: var(--orange-2); text-decoration: none; }

/* ============================================================
   5. QUICK ACCESS CARDS
   ============================================================ */
.srp-quick { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin-top: -34px; position: relative; z-index: 5; }
.srp-qcard {
	background: var(--card); border-radius: var(--radius); padding: 18px 16px;
	box-shadow: var(--shadow); display: flex; align-items: center; gap: 13px;
	border: 1px solid var(--line); transition: transform .15s, box-shadow .15s;
}
.srp-qcard:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(17,40,110,.14); text-decoration: none; }
.srp-qcard .ic { width: 44px; height: 44px; border-radius: 11px; display: grid; place-items: center; color: #fff; font-size: 20px; flex: 0 0 44px; }
.srp-qcard b { display: block; color: var(--ink); font-size: 14.5px; }
.srp-qcard small { color: var(--muted); font-size: 11.5px; }
.ic.c-blue { background: #1c4fd6; }
.ic.c-green { background: var(--green); }
.ic.c-purple { background: var(--purple); }
.ic.c-orange { background: var(--orange); }
.ic.c-indigo { background: #3a40c4; }
/* Line-icon sizing (quick cards + column headings) */
.srp-qcard .ic svg { width: 23px; height: 23px; display: block; }
.srp-col-head svg { width: 18px; height: 18px; flex: 0 0 18px; }

/* ============================================================
   6. COLOUR-CODED EXAM COLUMNS
   ============================================================ */
.srp-cols { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; }
.srp-col { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow-sm); border: 1px solid var(--line); overflow: hidden; display: flex; flex-direction: column; }
.srp-col-head { color: #fff; font-weight: 700; font-size: 14.5px; padding: 12px 14px; display: flex; align-items: center; gap: 8px; }
.srp-col-body { padding: 8px 12px 12px; flex: 1; }
.srp-col-body ul li { border-bottom: 1px dashed var(--line); }
.srp-col-body ul li:last-child { border-bottom: 0; }
.srp-col-body ul li a {
	display: block; padding: 9px 0 9px 16px; position: relative;
	font-size: 13px; color: #334; line-height: 1.4;
}
.srp-col-body ul li a::before { content: "›"; position: absolute; left: 2px; top: 8px; color: var(--orange); font-weight: 800; }
.srp-col-body ul li a:hover { color: var(--royal); text-decoration: none; }
.srp-viewmore {
	display: block; text-align: center; margin: 4px 12px 12px;
	border: 1.5px solid var(--line); border-radius: 8px; padding: 9px;
	font-size: 12.5px; font-weight: 700; color: var(--royal);
}
.srp-viewmore:hover { background: #eef3ff; text-decoration: none; }
/* head colours */
.h-results { background: linear-gradient(90deg,#1840a8,#1c4fd6); }
.h-admit   { background: linear-gradient(90deg,#138a4b,#1fb463); }
.h-jobs    { background: linear-gradient(90deg,#1c4fd6,#3a74ff); }
.h-answer  { background: linear-gradient(90deg,#e35d12,#f7831e); }
.h-syllabus{ background: linear-gradient(90deg,#6a1fd1,#9b46ff); }

.srp-sectitle { text-align: center; font-size: 22px; font-weight: 800; color: var(--ink); margin: 6px 0 22px; }
.srp-sectitle-sm { font-size: 18px; }

/* ============================================================
   7. ABOUT + INFO ROWS
   ============================================================ */
.srp-panel { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow-sm); border: 1px solid var(--line); padding: 22px; display: flex; gap: 20px; align-items: flex-start; margin-bottom: 14px; }
.srp-panel .picon { width: 56px; height: 56px; border-radius: 13px; background: linear-gradient(135deg,#1840a8,#1c4fd6); color: #fff; display: grid; place-items: center; font-size: 26px; flex: 0 0 56px; }
.srp-panel h3 { margin: 0 0 6px; font-size: 17px; color: var(--royal); }
.srp-panel p { margin: 0; color: var(--muted); font-size: 13.5px; }
.srp-about-points { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 26px; margin-top: 4px; min-width: 280px; }
.srp-about-points div { font-size: 13px; color: #3a4a66; display: flex; align-items: center; gap: 8px; }
.srp-about-points div::before { content: "✔"; color: var(--green); font-weight: 800; }
.srp-panel .pcta {
	margin-left: auto; align-self: center; white-space: nowrap;
	background: #fff; border: 1.5px solid var(--orange); color: var(--orange);
	font-weight: 700; font-size: 13px; padding: 11px 18px; border-radius: 9px;
}
.srp-panel .pcta:hover { background: var(--orange); color: #fff; text-decoration: none; }

/* ============================================================
   8. TRENDING STRIP
   ============================================================ */
.srp-trending-head { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 16px; }
.srp-trending-head b { font-size: 18px; font-weight: 800; }
.srp-trending { display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; }
.srp-tcard {
	background: var(--card); border: 1px solid var(--line); border-radius: 12px;
	box-shadow: var(--shadow-sm); padding: 14px; display: flex; align-items: center; gap: 11px;
}
.srp-tcard .tic { width: 34px; height: 34px; border-radius: 9px; background: #fff4e8; color: var(--orange); display: grid; place-items: center; font-size: 16px; flex: 0 0 34px; }
.srp-tcard b { display: block; font-size: 13px; color: var(--ink); }
.srp-tcard small { font-size: 11px; color: var(--green); font-weight: 700; }

/* ============================================================
   9. FAQ
   ============================================================ */
.srp-faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.srp-faq-item { background: var(--card); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow-sm); overflow: hidden; height: fit-content; }
.srp-faq-q {
	width: 100%; text-align: left; background: none; border: 0; cursor: pointer;
	padding: 14px 16px; font-size: 13.5px; font-weight: 600; color: var(--ink);
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.srp-faq-q .ar { color: var(--royal); transition: transform .2s; font-size: 12px; }
.srp-faq-item.open .srp-faq-q .ar { transform: rotate(180deg); }
.srp-faq-a { max-height: 0; overflow: hidden; transition: max-height .25s ease; color: var(--muted); font-size: 13px; }
.srp-faq-item.open .srp-faq-a { max-height: 320px; }
.srp-faq-a div { padding: 0 16px 15px; }

/* ============================================================
   10. BOTTOM TRUST BAR
   ============================================================ */
.srp-trustbar { background: linear-gradient(120deg,var(--navy-1),var(--navy-3)); color: #fff; }
.srp-trustbar-inner { display: grid; grid-template-columns: repeat(5,1fr); gap: 16px; max-width: var(--maxw); margin: 0 auto; padding: 22px 16px; }
.srp-trustbar .tb { display: flex; align-items: center; gap: 11px; }
.srp-trustbar .tb i { font-size: 22px; font-style: normal; }
.srp-trustbar .tb b { display: block; font-size: 13.5px; }
.srp-trustbar .tb small { color: #c2d3ff; font-size: 11px; }

/* ============================================================
   11. FOOTER
   ============================================================ */
.srp-footer { background: #0b1f4d; color: #c7d2e8; }
.srp-footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 28px; max-width: var(--maxw); margin: 0 auto; padding: 40px 16px 26px; }
.srp-footer h4 { color: #fff; font-size: 15px; margin: 0 0 14px; }
.srp-footer .f-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.srp-footer .f-brand .lg { width: 40px; height: 40px; border-radius: 50%; background: radial-gradient(circle at 30% 30%,#3f74ff,var(--royal)); display: grid; place-items: center; font-size: 18px; }
.srp-footer .f-brand b { color: #fff; font-size: 16px; line-height: 1.2; }
.srp-footer p { font-size: 12.5px; line-height: 1.7; color: #aebbd6; }
.srp-footer ul li { margin-bottom: 9px; }
.srp-footer ul li a { color: #aebbd6; font-size: 13px; }
.srp-footer ul li a:hover { color: var(--orange); text-decoration: none; }
.srp-footer .f-contact { font-size: 12.5px; line-height: 1.9; }
.srp-footer .f-social { display: flex; gap: 9px; margin-top: 12px; }
.srp-footer .f-social a { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: #fff; font-size: 14px; }
.srp-footer .f-social a.fb { background: #1877f2; }
.srp-footer .f-social a.tg { background: #2aabee; }
.srp-footer .f-social a.wa { background: #25d366; }
.srp-footer .f-social a.yt { background: #ff0000; }
.srp-footer .f-social a.ig { background: linear-gradient(45deg,#f09433,#dc2743,#bc1888); }
.srp-footer-bottom { border-top: 1px solid rgba(255,255,255,.1); }
.srp-footer-bottom .inner { max-width: var(--maxw); margin: 0 auto; padding: 16px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 12px; color: #93a3c4; }

/* ============================================================
   12. SCROLL TOP + GENERIC CONTENT
   ============================================================ */
#scrollTopBtn {
	position: fixed; right: 20px; bottom: 20px; z-index: 60;
	width: 46px; height: 46px; border-radius: 50%; border: 0; cursor: pointer;
	background: var(--orange); color: #fff; font-size: 18px;
	box-shadow: 0 6px 18px rgba(0,0,0,.25); display: none;
}
#scrollTopBtn.show { display: block; }

/* Inner pages (single/archive/page) basic wrapper so they look at home in the new theme */
.srp-inner { max-width: var(--maxw); margin: 0 auto; padding: 28px 16px; }
.srp-inner .entry, .srp-card-page { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 26px; }
.srp-inner h1.page-header, .srp-inner .page-header { font-size: 26px; margin: 0 0 16px; color: var(--ink); }
.srp-status-badge { display: inline-block; font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 20px; }

/* ============================================================
   13. MODERN GLOW-UP — animations, glass, micro-interactions
   ============================================================ */

/* Animated gradient glow drifting across the hero */
.srp-hero::before {
	content: ""; position: absolute; inset: -40% -10% auto -10%; height: 140%;
	background:
		radial-gradient(420px 280px at 18% 20%, rgba(80,130,255,.35), transparent 60%),
		radial-gradient(360px 240px at 82% 30%, rgba(247,131,30,.22), transparent 60%);
	filter: blur(6px); opacity: .9; pointer-events: none;
	animation: srpDrift 14s ease-in-out infinite alternate;
}
.srp-hero-inner { position: relative; z-index: 1; }
@keyframes srpDrift {
	0%   { transform: translate3d(0,0,0) scale(1); }
	100% { transform: translate3d(3%,2%,0) scale(1.08); }
}

/* Soft sheen sweep over the Important Updates card */
.srp-updates { position: relative; }
.srp-updates::after {
	content: ""; position: absolute; top: 0; left: -60%; width: 50%; height: 100%;
	background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent);
	transform: skewX(-18deg); animation: srpSheen 6s ease-in-out 1.2s infinite; pointer-events: none;
}
@keyframes srpSheen { 0%,70% { left: -60%; } 100% { left: 120%; } }

/* Frosted-glass treatment for quick cards + trending cards */
.srp-qcard, .srp-tcard {
	background: rgba(255,255,255,.72);
	backdrop-filter: blur(10px) saturate(140%);
	-webkit-backdrop-filter: blur(10px) saturate(140%);
}

/* Animated gradient ring on hover for quick cards */
.srp-qcard { position: relative; z-index: 0; }
.srp-qcard::before {
	content: ""; position: absolute; inset: 0; border-radius: var(--radius); padding: 1.5px;
	background: linear-gradient(130deg, var(--royal), var(--orange), var(--purple));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	opacity: 0; transition: opacity .25s; z-index: -1;
}
.srp-qcard:hover::before { opacity: 1; }
.srp-qcard .ic { transition: transform .25s; }
.srp-qcard:hover .ic { transform: scale(1.08) rotate(-4deg); }

/* Column heads get a subtle shine; rows nudge on hover */
.srp-col { transition: transform .2s, box-shadow .2s; }
.srp-col:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(17,40,110,.14); }
.srp-col-body ul li a { transition: padding-left .15s, color .15s; }
.srp-col-body ul li a:hover { padding-left: 20px; }

/* Panels + trending lift slightly on hover */
.srp-panel { transition: transform .2s, box-shadow .2s; }
.srp-panel:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.srp-tcard { transition: transform .2s, box-shadow .2s; }
.srp-tcard:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(17,40,110,.14); }
.srp-tcard:hover .tic { animation: srpFlame .6s ease-in-out; }
@keyframes srpFlame { 0%,100% { transform: scale(1); } 50% { transform: scale(1.25) rotate(-8deg); } }

/* Pulsing live dot reused in nav + assistant */
@keyframes srpPulse { 0% { box-shadow: 0 0 0 0 rgba(31,157,87,.5); } 70% { box-shadow: 0 0 0 7px rgba(31,157,87,0); } 100% { box-shadow: 0 0 0 0 rgba(31,157,87,0); } }

/* Scroll-reveal: sections fade + rise into view */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1); will-change: opacity, transform; }
.reveal-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.reveal { opacity: 1; transform: none; transition: none; }
	.srp-hero::before, .srp-updates::after { animation: none; }
}

/* ============================================================
   14. AI JOB ASSISTANT WIDGET
   ============================================================ */
#sra-ai { position: fixed; right: 20px; bottom: 78px; z-index: 70; font-family: inherit; }
#sra-ai-fab {
	display: inline-flex; align-items: center; gap: 9px; cursor: pointer; border: 0;
	background: linear-gradient(120deg, var(--royal), #3a74ff); color: #fff;
	padding: 12px 18px 12px 14px; border-radius: 40px; font-size: 14px; font-weight: 700;
	box-shadow: 0 10px 26px rgba(28,79,214,.42); transition: transform .18s, box-shadow .18s;
}
#sra-ai-fab:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(28,79,214,.5); }
#sra-ai-fab .ico { font-size: 20px; animation: srpBob 3s ease-in-out infinite; }
@keyframes srpBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
#sra-ai.open #sra-ai-fab { display: none; }

#sra-ai-panel {
	position: absolute; right: 0; bottom: 0; width: 360px; max-width: calc(100vw - 32px);
	height: 520px; max-height: calc(100vh - 110px); display: none; flex-direction: column;
	background: rgba(255,255,255,.92); backdrop-filter: blur(14px) saturate(150%);
	-webkit-backdrop-filter: blur(14px) saturate(150%);
	border: 1px solid rgba(255,255,255,.6); border-radius: 18px; overflow: hidden;
	box-shadow: 0 24px 60px rgba(12,30,90,.34); animation: srpPop .22s cubic-bezier(.2,.8,.2,1);
}
#sra-ai.open #sra-ai-panel { display: flex; }
@keyframes srpPop { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: none; } }
.sra-ai-head {
	display: flex; align-items: center; justify-content: space-between;
	background: linear-gradient(120deg, var(--navy-1), var(--royal)); color: #fff; padding: 13px 15px;
}
.sra-ai-head .t { display: flex; align-items: center; gap: 9px; font-size: 14.5px; }
.sra-ai-head .dot { width: 9px; height: 9px; border-radius: 50%; background: #36e08a; animation: srpPulse 2s infinite; }
.sra-ai-close { background: rgba(255,255,255,.18); border: 0; color: #fff; width: 26px; height: 26px; border-radius: 50%; cursor: pointer; font-size: 12px; }
.sra-ai-close:hover { background: rgba(255,255,255,.3); }
.sra-ai-body { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; background: linear-gradient(180deg,#f3f6fd,#eef2fb); }
.sra-ai-msg { max-width: 85%; padding: 10px 13px; border-radius: 14px; font-size: 13px; line-height: 1.5; }
.sra-ai-msg.bot { align-self: flex-start; background: #fff; color: var(--ink); border: 1px solid var(--line); border-bottom-left-radius: 4px; box-shadow: var(--shadow-sm); }
.sra-ai-msg.user { align-self: flex-end; background: linear-gradient(120deg,var(--royal),#3a74ff); color: #fff; border-bottom-right-radius: 4px; }
.sra-ai-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.sra-ai-chip { background: #fff; border: 1px solid #cdd9f2; color: var(--royal); font-size: 11.5px; font-weight: 600; padding: 7px 11px; border-radius: 20px; cursor: pointer; transition: background .15s, color .15s; }
.sra-ai-chip:hover { background: var(--royal); color: #fff; border-color: var(--royal); }
.sra-ai-sources { display: flex; flex-direction: column; gap: 6px; align-self: flex-start; max-width: 92%; }
.sra-ai-source { background: #fff; border: 1px solid var(--line); border-left: 3px solid var(--orange); padding: 8px 11px; border-radius: 9px; font-size: 12px; color: var(--ink); box-shadow: var(--shadow-sm); }
.sra-ai-source:hover { background: #fff7ef; text-decoration: none; }
.sra-ai-source em { color: var(--green); font-style: normal; font-weight: 700; }
.sra-ai-typing span { display: inline-block; width: 6px; height: 6px; margin: 0 1px; border-radius: 50%; background: #9fb0d0; animation: srpDots 1.2s infinite; }
.sra-ai-typing span:nth-child(2) { animation-delay: .2s; }
.sra-ai-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes srpDots { 0%,60%,100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
.sra-ai-input { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--line); background: #fff; }
.sra-ai-input input { flex: 1; border: 1px solid var(--line); border-radius: 22px; padding: 10px 14px; font-size: 13px; outline: 0; }
.sra-ai-input input:focus { border-color: var(--royal); box-shadow: 0 0 0 3px rgba(28,79,214,.12); }
.sra-ai-input button { border: 0; cursor: pointer; width: 40px; border-radius: 50%; background: linear-gradient(120deg,var(--royal),#3a74ff); color: #fff; font-size: 15px; }
.sra-ai-input button:hover { filter: brightness(1.08); }
.sra-ai-foot { font-size: 10px; color: var(--muted); text-align: center; padding: 6px; background: #fff; }
@media (max-width: 480px) {
	#sra-ai { right: 14px; bottom: 70px; }
	#sra-ai-panel { height: 70vh; }
}

/* ============================================================
   15. RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
	.srp-hero h1 { font-size: 34px; }
	.srp-quick { grid-template-columns: repeat(3,1fr); }
	.srp-cols { grid-template-columns: repeat(3,1fr); }
	.srp-trending { grid-template-columns: repeat(3,1fr); }
	.srp-trustbar-inner { grid-template-columns: repeat(3,1fr); }
	.srp-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
	.srp-topbar-inner { flex-wrap: wrap; }
	.srp-trustrow { display: none; }
	.srp-search { margin-left: auto; }
	.srp-hero-inner { grid-template-columns: 1fr; }
	.srp-social .lbl { display: none; }
	.nav-toggle { display: block; margin-left: auto; }
	.srp-nav ul.nav-links {
		display: none; position: absolute; top: 100%; left: 0; right: 0;
		flex-direction: column; background: var(--royal-d); padding: 6px; z-index: 50;
	}
	.srp-nav ul.nav-links.open { display: flex; }
	.srp-nav { position: relative; }
	.srp-social { order: -1; }
}
@media (max-width: 640px) {
	.srp-hero h1 { font-size: 28px; }
	.srp-quick { grid-template-columns: 1fr 1fr; margin-top: 18px; }
	.srp-cols { grid-template-columns: 1fr; }
	.srp-trending { grid-template-columns: 1fr 1fr; }
	.srp-trustbar-inner { grid-template-columns: 1fr 1fr; }
	.srp-faq-grid { grid-template-columns: 1fr; }
	.srp-footer-grid { grid-template-columns: 1fr; }
	.srp-panel { flex-wrap: wrap; }
	.srp-panel .pcta { margin-left: 0; }
	.srp-about-points { grid-template-columns: 1fr; }
	.srp-search input { width: 150px; }
}

/* ============================================================
   INNER PAGES — single exam detail (.srp-exam-wrap) + category
   listing (.main-wrap). Scoped to those wrappers so the HOME
   page is never affected. Added 2026-06-28.
   ============================================================ */
.main-wrap { max-width:1100px; margin:18px auto; background:#fff; box-shadow:0 6px 22px rgba(12,30,90,.10); border-radius:12px; overflow:hidden; }
.main-wrap .page-header { text-align:center; font-size:1.55em; font-weight:800; margin:0; padding:22px 20px 12px; }
.main-wrap .entry-content { color:#555; margin:10px 20px; text-align:center; font-weight:500; font-size:.94em; line-height:1.65; }

/* Static page body (About, Terms, Privacy, Disclaimer — rendered via .desc-txt) */
.main-wrap .desc-txt { padding:8px 36px 36px; color:#3d4455; font-size:14.5px; line-height:1.8; }
.main-wrap .desc-txt > :first-child { margin-top:0; }
.main-wrap .desc-txt p { margin:0 0 15px; }
.main-wrap .desc-txt h2,
.main-wrap .desc-txt h3 { color:#0c2b78; font-size:17px; font-weight:800; margin:28px 0 12px; padding-left:11px; border-left:4px solid #f7831e; line-height:1.4; }
.main-wrap .desc-txt h2 { font-size:19px; }
.main-wrap .desc-txt ul,
.main-wrap .desc-txt ol { margin:0 0 16px; padding-left:26px; }
.main-wrap .desc-txt li { margin-bottom:8px; }
.main-wrap .desc-txt a { color:#0c2b78; font-weight:600; text-decoration:none; border-bottom:1px dotted #f7831e; }
.main-wrap .desc-txt a:hover { color:#f7831e; }
.main-wrap .desc-txt strong { color:#222b45; }
.main-wrap .desc-txt table { width:100%; border-collapse:collapse; font-size:13px; margin:0 0 16px; }
.main-wrap .desc-txt table th { background:#0c2b78; color:#fff; padding:9px 12px; text-align:left; }
.main-wrap .desc-txt table td { padding:8px 12px; border-bottom:1px solid #e0e0e0; }
@media (max-width:600px) {
	.main-wrap .desc-txt { padding:6px 18px 26px; font-size:14px; }
}

@keyframes sraFadeSlideIn { 0%{opacity:0;transform:translateY(18px);} 100%{opacity:1;transform:translateY(0);} }
.animated-section { opacity:0; animation: sraFadeSlideIn .55s ease forwards; }
.animated-delay-1 { animation-delay:.08s; }

.srp-exam-wrap { display:grid; grid-template-columns:1fr 300px; gap:24px; max-width:1200px; margin:0 auto; padding:18px 16px; }
.srp-exam-wrap .srp-breadcrumb { font-size:13px; color:#666; margin-bottom:12px; }
.srp-exam-wrap .srp-breadcrumb a { color:#0c2b78; text-decoration:none; }
.srp-exam-wrap .srp-breadcrumb span { margin:0 4px; }
.srp-exam-wrap .srp-hero { background:#0c2b78; border-radius:12px; padding:24px; color:#fff; margin-bottom:16px; }
.srp-exam-wrap .srp-hero h1 { font-size:23px; font-weight:800; line-height:1.3; margin:0 0 12px; color:#fff; }
.srp-exam-wrap .srp-tag-row { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.srp-exam-wrap .srp-tag { font-size:11px; padding:3px 10px; border-radius:20px; font-weight:600; background:rgba(255,255,255,.2); color:#fff; }
.srp-exam-wrap .srp-status-badge { display:inline-block; padding:4px 14px; border-radius:20px; font-size:12px; font-weight:700; margin-bottom:10px; }
.srp-exam-wrap .srp-type-ribbon { display:inline-block; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35); color:#fff; font-size:11px; font-weight:700; letter-spacing:.3px; padding:3px 12px; border-radius:20px; margin-bottom:10px; }
.srp-exam-wrap .srp-cta-btn { display:inline-block; background:#f7831e; color:#fff; padding:10px 24px; border-radius:8px; font-weight:700; font-size:14px; text-decoration:none; margin-top:10px; }
.srp-exam-wrap .srp-cta-btn:hover { background:#e65100; color:#fff; }
.srp-exam-wrap .srp-snapshot { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px; }
.srp-exam-wrap .srp-snap-card { background:#fff; border:1px solid #e6e6e6; border-radius:10px; padding:12px; text-align:center; }
.srp-exam-wrap .srp-snap-label { font-size:11px; color:#666; margin-bottom:4px; }
.srp-exam-wrap .srp-snap-value { font-size:15px; font-weight:800; color:#0c2b78; }
.srp-exam-wrap .srp-alert-box { background:#fff8e1; border-left:4px solid #f7831e; border-radius:0 8px 8px 0; padding:12px 16px; margin-bottom:16px; display:flex; gap:10px; align-items:flex-start; font-size:13px; }
.srp-exam-wrap .srp-section-title { font-size:18px; font-weight:800; color:#0c2b78; margin:22px 0 12px; padding-left:10px; border-left:4px solid #f7831e; }
.srp-exam-wrap .srp-content-box { background:#fff; border:1px solid #e6e6e6; border-radius:12px; padding:20px; margin-bottom:16px; }
.srp-exam-wrap .srp-tabs-nav { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; padding-bottom:14px; border-bottom:1px dashed #dcdfe8; }
.srp-exam-wrap .srp-tab-btn { padding:8px 16px; border:1.5px solid #e2e5ef; background:#f6f7fb; cursor:pointer; font-size:13px; font-weight:600; color:#444; border-radius:24px; transition:all .15s; display:inline-flex; align-items:center; gap:6px; }
.srp-exam-wrap .srp-tab-btn:hover { border-color:#0c2b78; color:#0c2b78; }
.srp-exam-wrap .srp-tab-btn.active { background:#0c2b78; border-color:#0c2b78; color:#fff; }
.srp-exam-wrap .srp-tab-ico { font-size:14px; line-height:1; }
.srp-exam-wrap .srp-tab-panel { display:none; }
.srp-exam-wrap .srp-tab-panel.active { display:block; }
.srp-exam-wrap .srp-table { width:100%; border-collapse:collapse; font-size:13px; }
.srp-exam-wrap .srp-table th { background:#0c2b78; color:#fff; padding:9px 12px; text-align:left; }
.srp-exam-wrap .srp-table td { padding:8px 12px; border-bottom:1px solid #e0e0e0; }
.srp-exam-wrap .srp-table tr:nth-child(even) td { background:#f5f7fc; }
.srp-exam-wrap .srp-links-table { width:100%; border-collapse:collapse; font-size:13px; }
.srp-exam-wrap .srp-links-table th { background:#c62828; color:#fff; padding:9px 12px; text-align:left; }
.srp-exam-wrap .srp-links-table td { padding:8px 12px; border-bottom:1px solid #e0e0e0; }
.srp-exam-wrap .srp-link-active { color:#1b5e20; font-weight:700; }
.srp-exam-wrap .srp-link-coming { color:#b71c1c; }
.srp-exam-wrap .srp-faq-item { background:#fff; border:1px solid #e6ebf3; border-radius:10px; box-shadow:0 2px 10px rgba(17,40,110,.06); margin-bottom:10px; overflow:hidden; }
.srp-exam-wrap .srp-faq-item:last-child { margin-bottom:0; }
.srp-exam-wrap .srp-faq-q { width:100%; background:none; border:none; text-align:left; padding:14px 16px; font-size:14px; font-weight:600; color:#0c2b78; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; transition:background .15s; }
.srp-exam-wrap .srp-faq-item.open .srp-faq-q { background:#f5f7ff; }
.srp-exam-wrap .srp-faq-a { display:none; padding:0 16px 14px; font-size:13px; line-height:1.7; color:#333; }
.srp-exam-wrap .srp-faq-item.open .srp-faq-a { display:block; }
.srp-exam-wrap .srp-faq-item.open .srp-faq-arrow { transform:rotate(180deg); }
.srp-exam-wrap .srp-faq-arrow { font-size:12px; transition:transform .2s; color:#8a93a6; flex-shrink:0; }
.srp-exam-wrap .srp-share-bar { display:flex; gap:8px; margin-top:18px; flex-wrap:wrap; }
.srp-exam-wrap .srp-share-btn { padding:8px 16px; border-radius:8px; font-size:13px; font-weight:600; text-decoration:none; color:#fff; cursor:pointer; border:none; }
.srp-exam-wrap .srp-share-wa { background:#25d366; } .srp-exam-wrap .srp-share-tg { background:#0088cc; }
.srp-exam-wrap .srp-share-tw { background:#1da1f2; } .srp-exam-wrap .srp-share-cp { background:#666; }
.srp-exam-wrap .srp-sidebar-box { background:#fff; border:1px solid #e6e6e6; border-radius:12px; padding:16px; margin-bottom:16px; }
.srp-exam-wrap .srp-sidebar-box h3 { font-size:14px; font-weight:800; color:#0c2b78; margin:0 0 12px; padding-bottom:8px; border-bottom:2px solid #f7831e; }
.srp-exam-wrap .srp-sidebar-row { display:flex; justify-content:space-between; font-size:12px; padding:6px 0; border-bottom:1px solid #f0f0f0; }
.srp-exam-wrap .srp-sidebar-row:last-child { border-bottom:none; }
.srp-exam-wrap .srp-sidebar-label { color:#666; }
.srp-exam-wrap .srp-sidebar-value { font-weight:600; color:#333; text-align:right; max-width:55%; }
.srp-exam-wrap .srp-countdown-wrap { background:#fff8e1; border:1px solid #ffe0b2; border-radius:10px; padding:16px; margin-bottom:16px; text-align:center; }
.srp-exam-wrap .srp-cd-title { color:#e65100; font-weight:700; font-size:14px; margin-bottom:12px; }
.srp-exam-wrap .srp-countdown { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; }
.srp-exam-wrap .srp-cd-box { background:#0c2b78; color:#fff; border-radius:8px; padding:10px 14px; min-width:64px; }
.srp-exam-wrap .srp-cd-num { display:block; font-size:22px; font-weight:800; line-height:1.1; }
.srp-exam-wrap .srp-cd-lbl { display:block; font-size:10px; letter-spacing:1px; opacity:.85; margin-top:4px; }
.srp-exam-wrap .srp-cd-note { font-size:12px; color:#777; margin-top:12px; }
.srp-exam-wrap .wp-content { font-size:14px; line-height:1.85; color:#333; }
.srp-exam-wrap .wp-content > *:first-child { margin-top:0; }
.srp-exam-wrap .wp-content h2, .srp-exam-wrap .wp-content h3 { font-size:16px; color:#0c2b78; margin:18px 0 10px; padding:4px 0 4px 12px; border-left:4px solid #f7831e; line-height:1.4; }
.srp-exam-wrap .wp-content p { margin:0 0 12px; }
.srp-exam-wrap .wp-content ul { list-style:none; margin:0 0 14px; padding:0; }
.srp-exam-wrap .wp-content ul li { position:relative; padding:7px 0 7px 28px; border-bottom:1px dashed #eee; }
.srp-exam-wrap .wp-content ul li:before { content:"\2714"; position:absolute; left:2px; top:7px; color:#2e7d32; font-weight:700; font-size:13px; }
.srp-exam-wrap .wp-content table { width:100%; border-collapse:collapse; margin:0 0 14px; font-size:13px; }
.srp-exam-wrap .wp-content th { background:#e8eaf6; color:#0c2b78; padding:9px 12px; text-align:left; border:1px solid #d6dbf5; }
.srp-exam-wrap .wp-content td { padding:9px 12px; border:1px solid #e8eaf6; }
.srp-exam-wrap .wp-content strong { color:#0c2b78; }
.srp-exam-wrap .wp-content a { color:#1565c0; font-weight:600; }

.main-wrap .srp-archive-list { list-style:none; margin:0; padding:14px 16px; }
.main-wrap .srp-archive-item { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:13px 15px; border:1px solid #e8eaf6; border-left:5px solid #0c2b78; border-radius:8px; margin-bottom:10px; background:#fff; transition:box-shadow .15s, transform .15s; }
.main-wrap .srp-archive-item:hover { box-shadow:0 6px 16px rgba(12,30,90,.10); transform:translateY(-2px); }
.main-wrap .srp-archive-item a { color:#0c2b78; font-weight:700; text-decoration:none; font-size:.98em; }
.main-wrap .srp-archive-item a:hover { color:#f7831e; }
.main-wrap .srp-archive-badge { font-size:11px; padding:3px 10px; border-radius:20px; font-weight:700; white-space:nowrap; }
.main-wrap .srp-pagination { text-align:center; padding:16px; }
.main-wrap .srp-pagination .page-numbers { display:inline-block; padding:6px 12px; margin:2px; border-radius:6px; background:#e8eaf6; color:#0c2b78; text-decoration:none; font-weight:600; }
.main-wrap .srp-pagination .page-numbers.current { background:#f7831e; color:#fff; }

@media (max-width:768px){
	.srp-exam-wrap { grid-template-columns:1fr; }
	.srp-exam-wrap .srp-snapshot { grid-template-columns:repeat(2,1fr); }
	.srp-exam-wrap .srp-hero h1 { font-size:19px; }
}