/* NDSS ACADEMY PROGRAM TYPES (Er Dk 2026-11-08): "Courses" menu, home section and program pages on ndssacademy.com.
   templates website/_ndss_mega.html, _ndss_programs.html, _ndss_hero.html, ndss_program.html, ndss_program_category.html */
.np-wrap { max-width: 1200px; margin: 0 auto; }
.np-sec { padding: 64px var(--gutter); background: #fff; }
.np-kick { display: inline-block; font-size: 12.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #e83035; margin-bottom: 10px; }
.np-h2 { font-size: clamp(26px, 3vw, 36px); line-height: 1.15; letter-spacing: -.02em; margin: 0; }
.np-lead { font-size: 17px; line-height: 1.65; color: var(--ink-soft); margin: 12px 0 0; max-width: 640px; }
.np-pts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 30px; }
.np-pt { position: relative; display: flex; gap: 16px; align-items: flex-start; padding: 22px 20px; border: 1px solid #e1e6f5; border-radius: 18px;
  background: #fff; text-decoration: none; color: inherit; transition: transform .15s, box-shadow .15s; overflow: hidden; }
.np-pt:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(30, 44, 110, .12); border-color: transparent; }
.np-pt::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--c); }
.np-ic { flex: 0 0 54px; height: 54px; border-radius: 15px; display: grid; place-items: center; color: #fff; background: var(--c); }
.np-ic svg, .ndm-top i svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.np-ic svg { width: 26px; height: 26px; }
.np-pt h3 { margin: 0 0 4px; font-size: 18px; } .np-pt p { margin: 0; font-size: 14px; color: var(--ink-mute); line-height: 1.5; }
.np-n { display: inline-block; margin-top: 10px; font-size: 12.5px; font-weight: 700; color: var(--c); background: #f4f5fa; padding: 4px 10px; border-radius: 999px; }
@supports (background: color-mix(in srgb, red 10%, white)) { .np-n { background: color-mix(in srgb, var(--c) 10%, #fff); } }

.np-hero { padding: 46px var(--gutter) 40px; background: linear-gradient(120deg, var(--c) 0%, #2e3f8f 100%); color: #fff; }
.np-hero h1 { color: #fff; margin: 6px 0 10px; font-size: clamp(30px, 4vw, 46px); letter-spacing: -.02em; }
.np-hero p { margin: 0; max-width: 680px; color: rgba(255, 255, 255, .88); font-size: 17px; line-height: 1.6; }
.np-crumb { font-size: 13px; color: rgba(255, 255, 255, .8); } .np-crumb a { color: #fff; text-decoration: none; }
.np-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.np-chips a { font-size: 13px; font-weight: 600; color: #fff; text-decoration: none; padding: 7px 13px; border-radius: 999px;
  background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .25); }
.np-chips a.on { background: #fff; color: #1f2c6b; }
.np-cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.np-cat { display: block; padding: 20px 18px; border: 1px solid #e1e6f5; border-radius: 16px; background: #fff; text-decoration: none; color: inherit; transition: .15s; }
.np-cat:hover { border-color: var(--c); box-shadow: 0 10px 26px rgba(30, 44, 110, .10); }
.np-cat h3 { margin: 0 0 6px; font-size: 17px; } .np-cat .m { font-size: 13px; color: var(--ink-mute); }
.np-cat .tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.np-cat .tags span { font-size: 11.5px; font-weight: 600; padding: 3px 8px; border-radius: 999px; background: #f1f3fa; color: #2e3f8f; }
.np-cat .go { display: inline-block; margin-top: 12px; font-size: 13.5px; font-weight: 700; color: var(--c); }
.np-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 22px; border-bottom: 1px solid #e6e9f2; }
.np-tab { background: none; border: 0; padding: 12px 18px; font: inherit; font-weight: 700; font-size: 15px; color: #6b7080; cursor: pointer;
  border-bottom: 3px solid transparent; margin-bottom: -1px; }
.np-tab small { font-weight: 500; color: #999; } .np-tab.on { color: #1f2c6b; border-color: var(--c); }
.np-courses { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; } .np-courses[hidden] { display: none; }
.np-course { display: flex; flex-direction: column; padding: 20px 18px; border: 1px solid #e1e6f5; border-radius: 16px; background: #fff; }
.np-course h3 { margin: 0; font-size: 17px; } .np-course .dur { font-size: 12.5px; font-weight: 700; color: #2e3f8f; margin-top: 6px; }
.np-course .subs { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; }
.np-course .subs span, .np-course .subs a { font-size: 12px; padding: 4px 9px; border-radius: 8px; background: #f6f7fb; border: 1px solid #eceff6; color: inherit; text-decoration: none; }
.np-course .subs a:hover { border-color: var(--c); color: var(--c); }
.np-course h3 a { color: inherit; text-decoration: none; } .np-course h3 a:hover { color: var(--c); }
.np-course .syl-link { display: inline-block; margin-top: 12px; font-size: 13.5px; font-weight: 700; color: var(--c); text-decoration: none; }
.np-course .about { font-size: 13.5px; color: var(--ink-mute); line-height: 1.5; margin: 10px 0 0; }
.np-course .fee { margin-top: auto; padding-top: 14px; font-size: 13px; color: #6b7080; }
.np-course .acts { display: flex; gap: 8px; margin-top: 10px; } .np-course .acts .btn { flex: 1; justify-content: center; padding: 10px 12px; font-size: 14px; }

/* the "Courses" menu (a menu group of base_site.html with a wide panel) */
/* 2026-11-09 (Er Dk: "cursor menu ki taraf le jaate hi menu chala jata hai"): the panel hangs right under the menu bar
   (absolute to .site-nav, so it also sits right when the page is scrolled); an invisible bridge under "Courses" reaches
   the panel, and the menu stays open 0.4 s after the mouse leaves (class "stay", _ndss_mega.html) */
@media (min-width: 901px) {
  .site-nav .nd.ndm { position: static; }
  .site-nav .ndm .nd-btn { position: relative; }
  .site-nav .ndm .nd-btn::after { content: ""; position: absolute; left: -14px; right: -14px; top: 100%; height: 40px; }
  .site-nav .ndm .ndm-menu { position: absolute; left: 50%; transform: translateX(-50%); top: 100%; margin-top: 0; width: min(1080px, 94vw);
    grid-template-columns: repeat(3, 1fr); gap: 4px 22px; padding: 20px 22px; border-radius: 0 0 16px 16px; z-index: 70; }
  .site-nav .ndm .ndm-menu::before { top: -10px; height: 10px; }
  .nd.ndm.on .ndm-menu, .nd.ndm.stay .ndm-menu { display: grid; }
}
@media (hover: hover) and (min-width: 901px) { .nd.ndm:hover .ndm-menu, .nd.ndm:focus-within .ndm-menu { display: grid; } }
.ndm-col { padding: 6px 4px 10px; }
.site-nav .links .ndm-menu a.ndm-top { display: flex; gap: 10px; align-items: center; padding: 4px 0; }
.ndm-top i { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 9px; display: grid; place-items: center; background: var(--c); color: #fff; }
.ndm-top i svg { width: 16px; height: 16px; } .ndm-top b { font-size: 15px; }
.ndm-col ul { list-style: none; margin: 6px 0 0 40px; padding: 0; display: flex; flex-wrap: wrap; gap: 2px 12px; }
.site-nav .links .ndm-col li a { display: inline; padding: 2px 0; font-size: 13px; color: #555c70; border: 0; }
.site-nav .links .ndm-col li a:hover { color: var(--c); background: none; } .ndm-col li a.more { font-weight: 700; }

@media (max-width: 1000px) { .np-pts, .np-courses { grid-template-columns: repeat(2, 1fr); } .np-cats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) {
  .ndm-col ul { margin-left: 40px; } .site-nav .links .ndm-col li a { padding: 4px 0; }
}
@media (max-width: 600px) { .np-pts, .np-courses, .np-cats { grid-template-columns: 1fr; } .np-sec { padding: 44px var(--gutter); } }

/* ---------------------------------------------------------------- course / subject pages (2026-11-09): ndss_course.html, ndss_subject.html */
.nc-hero { padding-bottom: 34px; }
.nc-facts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.nc-facts span { display: flex; flex-direction: column; padding: 10px 16px; border-radius: 12px; background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .22); font-size: 12.5px; color: rgba(255, 255, 255, .85); }
.nc-facts b { font-size: 17px; color: #fff; }
.nc-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.nc-white { background: #fff; color: #1f2c6b; border: 0; } .nc-white:hover { background: #f1f3fa; color: #1f2c6b; }
.nc-ghost { background: transparent; color: #fff; border: 1.5px solid rgba(255, 255, 255, .55); } .nc-ghost:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.nc-tabs { position: sticky; top: 0; z-index: 30; background: #fff; border-bottom: 1px solid #e6e9f2; padding: 0 var(--gutter); }
.nc-tabs .np-wrap { display: flex; gap: 6px; overflow-x: auto; }
.nc-tabs a { padding: 14px 14px; font-weight: 600; font-size: 14.5px; color: #555c70; text-decoration: none; white-space: nowrap; border-bottom: 3px solid transparent; }
.nc-tabs a:hover { color: var(--c); border-color: var(--c); }
.nc-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; padding: 34px var(--gutter) 70px; }
.nc-sec { padding: 8px 0 30px; scroll-margin-top: 70px; }
.nc-sec h2 { font-size: 24px; margin: 0 0 14px; } .nc-sec h2 small { font-size: 15px; font-weight: 500; color: #8a8fa3; }
.nc-line { margin: -6px 0 14px; color: var(--ink-mute); font-size: 14px; }
.nc-road { list-style: none; margin: 0; padding: 0; position: relative; }
.nc-road::before { content: ""; position: absolute; left: 17px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(var(--c), #2e3f8f); opacity: .35; }
.nc-road li { position: relative; display: flex; gap: 16px; padding: 0 0 20px; }
.nc-dot { flex: 0 0 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; color: #fff; background: var(--c);
  box-shadow: 0 0 0 4px #fff; position: relative; z-index: 1; }
.nc-road li:last-child .nc-dot { background: #0f8b6f; }
.nc-road b { display: block; font-size: 16px; } .nc-road i { display: block; font-style: normal; font-size: 13px; color: #8a8fa3; margin-top: 1px; }
.nc-road p { margin: 4px 0 0; font-size: 14.5px; color: var(--ink-soft); line-height: 1.55; }
.nc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.nc-chips span { font-size: 12.5px; padding: 4px 10px; border-radius: 999px; background: #f1f3fa; color: #2e3f8f; }
.nc-sublink { font-size: 12.5px; font-weight: 700; color: var(--c); text-decoration: none; margin-left: auto; }
.nc-tests { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.nc-test { padding: 14px 16px; border: 1px solid #e1e6f5; border-radius: 12px; background: #fff; } .nc-test b { display: block; font-size: 14.5px; }
.nc-test span { font-size: 13px; color: var(--ink-mute); }
.nc-note { font-size: 13px; color: var(--ink-mute); margin: 10px 0 0; }
.nc-lists { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; }
.nc-lists h3 { font-size: 15px; margin: 0 0 8px; } .nc-lists ul { margin: 0; padding-left: 18px; font-size: 14px; line-height: 1.6; color: var(--ink-soft); }
.nc-cert { margin-top: 20px; padding: 16px 18px; border-radius: 14px; background: #f0faf6; border: 1px solid #cfeee2; display: flex; flex-direction: column; gap: 4px; }
.nc-cert span { font-size: 14px; color: var(--ink-soft); } .nc-cert a { font-weight: 700; color: #0f8b6f; text-decoration: none; }
.nc-faq { border: 1px solid #e6e9f2; border-radius: 12px; background: #fff; margin-bottom: 8px; }
.nc-faq summary { cursor: pointer; padding: 13px 16px; font-weight: 600; } .nc-faq p { margin: 0; padding: 0 16px 14px; color: var(--ink-soft); font-size: 14.5px; line-height: 1.6; }
.nc-side { position: relative; }
.nc-card { position: sticky; top: 70px; display: flex; flex-direction: column; gap: 10px; padding: 20px; border: 1px solid #e1e6f5; border-radius: 16px; background: #fff;
  box-shadow: 0 10px 26px rgba(30, 44, 110, .08); margin-bottom: 16px; }
.nc-card > b { font-size: 17px; } .nc-card > small { color: var(--ink-mute); margin-top: -6px; }
.nc-card ul { margin: 0; padding-left: 18px; font-size: 14px; } .nc-card ul a { color: inherit; } .nc-card ul a:hover { color: var(--c); }
.nc-fee { font-size: 13px; color: #6b7080; } .nc-card .btn { justify-content: center; }
.nc-others { position: static; } .nc-others a { font-size: 14px; color: var(--ink); text-decoration: none; padding: 6px 0; border-bottom: 1px solid #f0f2f7; }
.nc-others a small { color: #8a8fa3; } .nc-others a:hover { color: var(--c); } .nc-others a.more { border: 0; font-weight: 700; color: var(--c); }
@media (max-width: 960px) { .nc-body { grid-template-columns: 1fr; } .nc-card { position: static; } .nc-tests { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .nc-facts span { flex: 1 1 40%; } .nc-cta .btn { flex: 1 1 100%; } .nc-sec h2 { font-size: 21px; } }

/* category page groups (2026-11-09): complete courses, then subject-wise cards */
.np-group[hidden] { display: none; }
.np-gh { font-size: 17px; margin: 26px 0 12px; } .np-gh:first-child { margin-top: 0; } .np-gh small { font-weight: 500; color: #8a8fa3; font-size: 13.5px; }
.np-subjects { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.np-sub { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border: 1px solid #e1e6f5; border-radius: 12px; background: #fff;
  text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; }
.np-sub:hover { border-color: var(--c); box-shadow: 0 8px 20px rgba(30, 44, 110, .08); }
.np-sub b { font-size: 14.5px; line-height: 1.35; } .np-sub .dur { font-size: 12px; font-weight: 700; color: #2e3f8f; }
.np-sub .in { font-size: 12px; color: #6b7080; } .np-sub .go { font-size: 12.5px; font-weight: 700; color: var(--c); margin-top: auto; }

/* NDSS syllabus PDF pop-up (2026-11-09) -- the same pop-up as an online batch on caddtc.com (ob-site.css) */
.obs-vid-x { flex: none; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #f1f5f9; color: #0f172a; font-size: 16px; cursor: pointer; }
dialog.obs-sgate { width: min(440px, 94vw); border: 0; border-radius: 16px; padding: 0; box-shadow: 0 30px 80px rgba(2, 6, 23, .4); }
dialog.obs-sgate::backdrop { background: rgba(2, 6, 23, .6); }
.obs-sgate form { display: grid; gap: 12px; padding: 20px 22px 22px; }
.obs-sgate-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.obs-sgate-top h3 { margin: 0; font-size: 19px; }
.obs-sgate-sub { margin: -4px 0 2px; font-size: 13.5px; color: #64748b; line-height: 1.5; }
.obs-sgate label { display: grid; gap: 5px; font-size: 13px; font-weight: 600; color: #334155; }
.obs-sgate input { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 10px; font: inherit; font-weight: 400; }
.obs-sgate input:focus { outline: 2px solid #1e3a8a; outline-offset: 0; border-color: #1e3a8a; }
.obs-sgate-row { display: flex; gap: 8px; } .obs-sgate-row .btn { flex: none; }
.obs-sgate-msg { margin: 0; min-height: 18px; font-size: 13px; color: #475569; } .obs-sgate-msg.ok { color: #15803d; } .obs-sgate-msg.bad { color: #b91c1c; }
.obs-sgate-note { font-size: 12.5px; color: #64748b; text-align: center; }
.nc-syl-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
