/* ===================================================================
   NEET UG PAGE — dedicated design system
   Distinct from the homepage: editorial dark hero, comparison table,
   vertical timeline, ticket-style college list, accordion FAQ.
   Reuses only brand tokens (colors/fonts) + .btn/.wrap/.section-title
   from styles.css for site-wide consistency.
=================================================================== */

.nu-breadcrumb{
  padding-top:18px; font-size:.82rem; color:var(--ink-soft);
}
.nu-breadcrumb a{color:var(--ink-soft);}
.nu-breadcrumb span{color:var(--sky); font-weight:700;}

/* ---------- HERO : full-bleed editorial navy panel ---------- */
.nu-hero{
  background:linear-gradient(160deg, var(--navy-deep) 0%, #0A3B5E 55%, #082F4B 100%);
  color:#EAF4FB;
  padding:56px 0 0;
  position:relative;
  overflow:hidden;
}
.nu-hero::after{
  content:"";
  position:absolute; right:-120px; top:-160px;
  width:480px; height:480px; border-radius:50%;
  background:radial-gradient(circle, rgba(232,164,0,.16), transparent 70%);
}
.nu-hero-inner{max-width:760px;}
.nu-hero-kicker{
  font-family:'Manrope', sans-serif; font-weight:700; font-size:.82rem;
  color:var(--gold-light); letter-spacing:.01em; margin-bottom:18px;
  display:flex; align-items:center; gap:10px;
}
.nu-hero-kicker::before{content:"N U G"; font-family:'Cinzel',serif; font-size:.72rem; border:1px solid rgba(255,255,255,.35); padding:3px 8px; border-radius:4px; letter-spacing:.14em;}
.nu-hero h1{
  color:#fff; font-size:clamp(2.1rem, 4.2vw, 3.35rem); margin-bottom:22px; max-width:14ch;
}
.nu-hero-lead{
  font-size:1.08rem; color:#CFE4F3; max-width:56ch; line-height:1.7; margin-bottom:34px;
}
.nu-hero-actions{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:60px;}
.nu-hero-actions .btn-outline{border-color:rgba(255,255,255,.55); color:#fff;}
.nu-hero-actions .btn-outline:hover{background:rgba(255,255,255,.08);}

/* Rank bar — overlaps hero/next section boundary */
.nu-rankbar{
  background:#fff; border-radius:18px; box-shadow:0 30px 60px rgba(6,30,49,.35);
  padding:26px 28px; display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr auto;
  gap:18px; align-items:end; position:relative; z-index:5;
  margin-top:-64px; margin-bottom:40px;
}
.nu-rankbar-field label{
  display:block; font-size:.72rem; font-weight:700; color:var(--ink-soft);
  text-transform:none; margin-bottom:7px;
}
.nu-rankbar-field input, .nu-rankbar-field select{
  width:100%; padding:12px 13px; border-radius:9px; border:1.5px solid var(--line);
  font-family:inherit; font-size:.92rem; color:var(--ink); background:var(--cream);
}
.nu-rankbar-field input:focus, .nu-rankbar-field select:focus{outline:2px solid var(--sky); outline-offset:1px;}
.nu-rankbar button{
  background:var(--gold); color:#3A2600; border:none; border-radius:9px;
  padding:13px 22px; font-weight:800; font-size:.92rem; white-space:nowrap; cursor:pointer;
  transition:transform .15s ease;
}
.nu-rankbar button:hover{transform:translateY(-2px);}
.nu-rankbar-result{
  grid-column:1/-1; margin-top:4px; padding:13px 16px; border-radius:9px;
  background:var(--sky-light); color:var(--navy-deep); font-size:.88rem; display:none;
}
.nu-rankbar-result.show{display:block;}

/* ---------- STAT STRIP : thin ticker, not cards ---------- */
.nu-stat-strip{
  background:var(--cream); padding:8px 0 46px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:28px;
}
.nu-stat{
  flex:1; min-width:150px; text-align:left; padding-left:20px; border-left:3px solid var(--gold);
}
.nu-stat b{
  display:block; font-family:'Cinzel', serif; font-size:1.9rem; color:var(--navy-deep); line-height:1;
}
.nu-stat span{font-size:.84rem; color:var(--ink-soft);}

/* ---------- ESSENTIALS : single-column accordion ---------- */
.nu-essentials{max-width:820px; margin:0 auto;}
.nu-acc-item{border-bottom:1px solid var(--line);}
.nu-acc-item summary{
  list-style:none; cursor:pointer; padding:22px 4px; display:flex; align-items:baseline; gap:18px;
  font-family:'Cinzel', serif; font-size:1.08rem; color:var(--navy-deep);
}
.nu-acc-item summary::-webkit-details-marker{display:none;}
.nu-acc-item summary .nu-acc-idx{font-family:'Manrope',sans-serif; font-weight:800; font-size:.82rem; color:var(--gold); flex:none; width:28px;}
.nu-acc-item summary::after{content:"+"; margin-left:auto; color:var(--sky); font-size:1.3rem; font-family:'Manrope',sans-serif;}
.nu-acc-item[open] summary::after{content:"–";}
.nu-acc-body{padding:0 4px 24px 46px; color:var(--ink-soft); font-size:.95rem; max-width:64ch;}
.nu-acc-body a{color:var(--sky); font-weight:700;}

/* ---------- QUOTA COMPARISON TABLE ---------- */
.nu-quota-wrap{background:var(--navy-deep); padding:80px 0;}
.nu-quota-head{max-width:640px; margin-bottom:44px;}
.nu-quota-head .section-title{color:#fff;}
.nu-quota-head p{color:#BFDCEE;}
.nu-quota-table{width:100%; border-collapse:collapse; background:rgba(255,255,255,.03); border-radius:14px; overflow:hidden;}
.nu-quota-table th{
  text-align:left; font-family:'Manrope',sans-serif; font-weight:700; font-size:.78rem;
  color:var(--gold-light); padding:16px 20px; border-bottom:1px solid rgba(255,255,255,.15);
}
.nu-quota-table td{
  padding:20px; border-bottom:1px solid rgba(255,255,255,.08); color:#DCEBF5; font-size:.9rem; vertical-align:top;
}
.nu-quota-table tr:last-child td{border-bottom:none;}
.nu-quota-table td:first-child, .nu-quota-table th:first-child{color:#fff; font-weight:700; font-family:'Cinzel',serif; white-space:nowrap;}
.nu-quota-table tr:hover td{background:rgba(255,255,255,.035);}

/* ---------- TIMELINE : vertical stepper ---------- */
.nu-timeline{max-width:760px; margin:0 auto; position:relative; padding-left:38px;}
.nu-timeline::before{content:""; position:absolute; left:9px; top:8px; bottom:8px; width:2px; background:var(--line);}
.nu-tl-step{position:relative; padding-bottom:44px;}
.nu-tl-step:last-child{padding-bottom:0;}
.nu-tl-dot{
  position:absolute; left:-38px; top:2px; width:20px; height:20px; border-radius:50%;
  background:var(--paper); border:3px solid var(--sky); z-index:2;
}
.nu-tl-step.is-last .nu-tl-dot{border-color:var(--gold); background:var(--gold);}
.nu-tl-step h4{margin-bottom:6px; font-size:1.1rem;}
.nu-tl-step p{color:var(--ink-soft); margin:0; max-width:58ch;}
.nu-tl-step .nu-tl-tag{
  display:inline-block; font-size:.72rem; font-weight:700; color:var(--sky);
  background:var(--sky-light); padding:3px 10px; border-radius:20px; margin-bottom:8px;
}

/* ---------- COLLEGES : compact ticket list ---------- */
.nu-colleges-wrap{background:var(--paper);}
.nu-ticket-row{display:flex; gap:16px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x proximity;}
.nu-ticket-row::-webkit-scrollbar{height:5px;}
.nu-ticket-row::-webkit-scrollbar-thumb{background:var(--line); border-radius:10px;}
.nu-ticket{
  flex:0 0 300px; scroll-snap-align:start; display:flex; gap:14px; align-items:center;
  border:1.5px solid var(--line); border-radius:14px; padding:14px; background:var(--cream);
  transition:border-color .15s ease;
}
.nu-ticket:hover{border-color:var(--sky);}
.nu-ticket img{width:74px; height:74px; border-radius:10px; object-fit:cover; flex:none; background:var(--sky-light);}
.nu-ticket-body h4{font-size:.98rem; margin-bottom:3px;}
.nu-ticket-body .cloc{font-size:.78rem; color:var(--ink-soft); margin-bottom:4px;}
.nu-ticket-body a{font-size:.78rem; font-weight:700; color:var(--sky);}

/* ---------- BUDGET CALCULATOR : plain centered card ---------- */
.nu-budget-wrap{background:var(--gold-soft); padding:80px 0;}
.nu-budget-card{
  max-width:600px; margin:0 auto; background:var(--paper); border-radius:20px;
  padding:40px 36px; text-align:center; box-shadow:var(--shadow-card);
}
.nu-budget-card h2{margin-bottom:10px;}
.nu-budget-card p{color:var(--ink-soft); margin-bottom:26px;}
.nu-budget-form{display:grid; gap:14px; text-align:left;}
.nu-budget-form label{font-size:.78rem; font-weight:700; color:var(--ink-soft); margin-bottom:5px; display:block;}
.nu-budget-form input, .nu-budget-form select{
  width:100%; padding:12px 13px; border-radius:9px; border:1.5px solid var(--line);
  font-family:inherit; font-size:.92rem; background:var(--cream);
}
.nu-budget-form button{margin-top:6px;}
.nu-budget-result{margin-top:16px; padding:14px 16px; border-radius:10px; background:var(--sky-light); color:var(--navy-deep); font-size:.88rem; display:none; text-align:left;}
.nu-budget-result.show{display:block;}

/* ---------- FAQ : single-column numbered accordion ---------- */
.nu-faq-wrap{max-width:820px; margin:0 auto;}
.nu-faq-item{display:flex; gap:20px; border-bottom:1px solid var(--line); padding:22px 0;}
.nu-faq-num{font-family:'Cinzel',serif; font-size:1.3rem; color:var(--line); flex:none; width:40px;}
.nu-faq-item[open] .nu-faq-num{color:var(--gold);}
.nu-faq-body{flex:1;}
.nu-faq-body summary{list-style:none; cursor:pointer; font-family:'Cinzel',serif; font-size:1.02rem; color:var(--navy-deep); display:flex; justify-content:space-between; gap:14px;}
.nu-faq-body summary::-webkit-details-marker{display:none;}
.nu-faq-body summary::after{content:"+"; color:var(--sky); font-family:'Manrope',sans-serif; font-size:1.2rem; flex:none;}
.nu-faq-body[open] summary::after{content:"–";}
.nu-faq-body p{color:var(--ink-soft); margin-top:12px; max-width:66ch;}

/* ---------- FINAL CTA : full-bleed banner ---------- */
.nu-cta{
  background:linear-gradient(120deg, var(--navy-deep), #0A3B5E);
  padding:70px 0; text-align:center; color:#fff;
}
.nu-cta h2{color:#fff; margin-bottom:14px;}
.nu-cta p{color:#CFE4F3; max-width:52ch; margin:0 auto 30px;}
.nu-cta-actions{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.nu-cta-actions .btn-outline{border-color:rgba(255,255,255,.55); color:#fff;}

/* =================== RESPONSIVE =================== */
@media (max-width:980px){
  .nu-rankbar{grid-template-columns:1fr 1fr; margin-top:-40px;}
  .nu-rankbar button{grid-column:1/-1;}
  .nu-quota-table{display:block; overflow-x:auto; white-space:nowrap;}
}
@media (max-width:640px){
  .nu-hero{padding-top:36px; padding-bottom:30px;}
  .nu-hero-actions{margin-bottom:0;}
  .nu-rankbar{grid-template-columns:1fr; padding:20px; margin-top:0; margin-bottom:30px; border-radius:14px;}
  .nu-stat-strip{gap:22px 16px;}
  .nu-stat{min-width:42%; padding-left:14px; border-left-width:2px;}
  .nu-stat b{font-size:1.5rem;}
  .nu-timeline{padding-left:30px;}
  .nu-tl-dot{left:-30px; width:16px; height:16px;}
  .nu-ticket{flex-basis:250px;}
  .nu-budget-card{padding:28px 20px;}
  .nu-faq-item{gap:12px;}
  .nu-faq-num{width:26px; font-size:1.05rem;}
}
