/* ================================================================
   INSTANT UDYAM — UNIFIED CHROME (header, footer, mobile menu)
   Single source of truth — loaded on every page.
   Last unified: 2026-05-14
   ================================================================ */

/* ---------- GLOBAL OVERFLOW + LAYOUT-SHIFT GUARDS ---------- */
html {
  scrollbar-gutter: stable;
  -webkit-text-size-adjust: 100%;
}
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
body {
  margin: 0;
}

/* ---------- MOBILE READABILITY + OVERFLOW HARDENING ---------- */
/* Ensure all media respects its container — kills the #1 cause of mobile overflow */
img, video, iframe, svg, canvas, picture, embed, object {
  max-width: 100%;
  height: auto;
}
iframe { border: 0; }

/* Force long URLs / words / code to wrap on mobile instead of forcing scroll */
@media (max-width: 760px) {
  p, li, dd, dt, blockquote, figcaption,
  article, section, main, aside,
  h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
    word-wrap: break-word;
  }
  /* Strict break for explicitly long strings */
  code, kbd, samp, pre {
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: pre-wrap;
  }
  /* Code blocks scroll horizontally so they don't push the page */
  pre {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: pre;
  }
  pre code { white-space: pre; }
  /* Long links and inline URLs */
  a { overflow-wrap: anywhere; word-break: break-word; }
  /* Inline images shouldn't force horizontal scroll */
  img { max-width: 100%; height: auto; }

  /* Readable base type for blog/article content on phones */
  body { font-size: 16px; line-height: 1.65; }
  p { font-size: 16px; line-height: 1.7; }
  h1 { font-size: clamp(26px, 7vw, 34px); line-height: 1.2; }
  h2 { font-size: clamp(22px, 5.5vw, 28px); line-height: 1.25; }
  h3 { font-size: clamp(18px, 4.5vw, 22px); line-height: 1.3; }

  /* Larger touch targets for accessibility */
  button, .btn, input[type="submit"], input[type="button"] {
    min-height: 44px;
  }
}

/* ---------- TOP DISCLAIMER BAR ---------- */
.iu-nbar{background:linear-gradient(90deg,#3E2723 0%,#2D1810 100%);color:#FCD34D;padding:10px 16px;text-align:center;font-size:13px;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.5;position:relative;z-index:100;word-break:break-word}
.iu-nbar strong{color:#FDE68A;font-weight:700}
.iu-nbar a{color:#FCD34D;text-decoration:underline;font-weight:600}
.iu-nbar a:hover{color:#fff}

/* ---------- HEADER ---------- */
.iu-hdr{background:#111827;border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;z-index:90;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.iu-hdr-in{max-width:1200px;margin:0 auto;padding:16px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.iu-logo{font-family:'Plus Jakarta Sans','Poppins','Inter',sans-serif;font-weight:500;font-size:22px;color:#fff;text-decoration:none;letter-spacing:-0.025em;white-space:nowrap;flex-shrink:0;display:inline-flex;align-items:center;gap:10px;line-height:1}
.iu-logo-mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex-shrink:0;filter:drop-shadow(0 2px 6px rgba(249,115,22,.25))}
.iu-logo-mark img,.iu-logo-mark svg{width:100%;height:100%;display:block;object-fit:contain}
.iu-logo-text{font-family:inherit;font-weight:500;font-size:22px;color:#fff;line-height:1}
.iu-logo em,.iu-logo-text em{font-style:normal;font-weight:800;background:linear-gradient(135deg,#F97316 0%,#EA580C 45%,#D4AF37 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;letter-spacing:-0.03em}
@media(max-width:480px){.iu-logo{gap:8px;font-size:19px}.iu-logo-mark{width:30px;height:30px}.iu-logo-text{font-size:19.5px}}
.iu-f-brand .iu-logo-mark{width:38px;height:38px}
.iu-f-brand .iu-logo-text{font-size:23px}
.iu-nav{display:flex;align-items:center;gap:26px}
.iu-nav a{color:rgba(255,255,255,.82);text-decoration:none;font-size:14.5px;font-weight:500;transition:color .15s ease;white-space:nowrap}
.iu-nav a:hover{color:#F97316}
.iu-nav a.active{color:#F97316;font-weight:600}
.iu-hdr-cta{background:#F97316;color:#fff;padding:10px 18px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;transition:background .15s ease,transform .15s ease;flex-shrink:0}
.iu-hdr-cta:hover{background:#EA580C;transform:translateY(-1px)}
.iu-hamburger{display:none;width:38px;height:38px;background:transparent;border:0;cursor:pointer;padding:0;position:relative;flex-shrink:0;z-index:96}
.iu-hamburger span{display:block;width:22px;height:2px;background:#fff;margin:5px auto;transition:transform .3s ease,opacity .3s ease;border-radius:2px}
.iu-hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.iu-hamburger.active span:nth-child(2){opacity:0}
.iu-hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- MOBILE MENU (unified accordion) ---------- */
.iu-mob{
  display:none;
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  background:rgba(17,24,39,.98);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  z-index:95;
  padding:64px 22px 32px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
body.iu-mob-open .iu-mob{display:block}

.iu-mob-close{
  position:absolute;
  top:12px;
  right:12px;
  width:44px;height:44px;
  background:rgba(255,255,255,.08);
  border:0;
  color:#fff;
  font-size:26px;
  line-height:1;
  border-radius:50%;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  padding:0;
  transition:background .15s ease,color .15s ease;
  z-index:2;
}
.iu-mob-close:hover,.iu-mob-close:active{background:rgba(249,115,22,.25);color:#F97316}

/* Apply Now CTA — ALWAYS AT TOP OF MOBILE MENU */
.iu-mob a.iu-mob-cta{
  display:block;
  background:#F97316;
  color:#fff;
  text-align:center;
  padding:14px 20px;
  border-radius:10px;
  font-weight:700;
  font-size:15.5px;
  border:0;
  margin:0 0 18px;
  text-decoration:none;
  transition:background .15s ease;
}
.iu-mob a.iu-mob-cta:hover,.iu-mob a.iu-mob-cta:active{background:#EA580C;color:#fff}

/* Accordion sections */
.iu-mob-acc{
  border-bottom:1px solid rgba(255,255,255,.08);
  margin:0;
}
.iu-mob-acc summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#fff;
  font-family:'Poppins','Inter',sans-serif;
  font-size:16px;
  font-weight:700;
  padding:14px 4px;
  letter-spacing:-.2px;
  transition:color .15s ease;
  -webkit-tap-highlight-color:transparent;
}
.iu-mob-acc summary::-webkit-details-marker{display:none}
.iu-mob-acc summary::marker{content:""}
.iu-mob-acc summary:hover,.iu-mob-acc summary:active{color:#F97316}
.iu-mob-acc[open] summary{color:#F97316}
.iu-acc-arr{
  font-size:14px;
  color:rgba(255,255,255,.55);
  transition:transform .2s ease,color .15s ease;
  margin-left:8px;
  line-height:1;
}
.iu-mob-acc[open] .iu-acc-arr{transform:rotate(180deg);color:#F97316}
.iu-acc-body{padding:2px 0 10px}
.iu-acc-body a{
  display:block;
  color:rgba(255,255,255,.82);
  text-decoration:none;
  padding:11px 14px;
  font-size:15px;
  font-weight:500;
  border:0;
  border-radius:6px;
  min-height:44px;
  display:flex;
  align-items:center;
  transition:color .12s ease,background .12s ease;
}
.iu-acc-body a:hover,.iu-acc-body a:active{color:#F97316;background:rgba(249,115,22,.08)}
.iu-acc-body a.active{color:#F97316;background:rgba(249,115,22,.10);font-weight:600}

/* ---------- RESPONSIVE (mobile breakpoint) ---------- */
@media(max-width:900px){
  .iu-nav,.iu-hdr-cta{display:none}
  .iu-hamburger{display:block}
  body.iu-mob-open{
    overflow:hidden;
    position:fixed;
    left:0;right:0;
    width:100%;
  }
  /* When menu open, header/disclaimer fall behind menu */
  body.iu-mob-open .iu-hdr{z-index:50}
  body.iu-mob-open .iu-nbar{z-index:49}
}

/* ---------- FOOTER ---------- */
.iu-footer{background:#0A0F1C;color:rgba(255,255,255,.7);padding:48px 20px 24px;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:14px;line-height:1.6}
.iu-footer-in{max-width:1200px;margin:0 auto}
.iu-f-disc{background:rgba(251,191,36,0.06);border:1px solid rgba(251,191,36,0.18);border-radius:10px;padding:16px 20px;margin-bottom:36px;color:rgba(253,230,138,.92);font-size:13px;line-height:1.65}
.iu-f-disc strong{color:#FDE68A;font-weight:700}
.iu-f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:36px;margin-bottom:32px;align-items:start}
.iu-f-brand .iu-logo{display:inline-block;margin-bottom:14px;font-size:22px}
.iu-f-brand p{color:rgba(255,255,255,.65);font-size:13.5px;line-height:1.7;margin:0}
.iu-f-col h4,
.iu-f-col .iu-f-col-h{font-family:'Poppins','Inter','Noto Sans Devanagari',sans-serif;color:#fff;font-size:14px;font-weight:700;margin:0 0 14px;letter-spacing:0.3px;line-height:1.4}
.iu-f-col a{display:block;color:rgba(255,255,255,.65);text-decoration:none;padding:5px 0;font-size:13.5px;transition:color .15s ease;word-break:break-word;line-height:1.5}
.iu-f-col a:hover{color:#F97316}
.iu-f-bot{border-top:1px solid rgba(255,255,255,.08);padding-top:20px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;color:rgba(255,255,255,.5);font-size:12.5px}
@media(max-width:1080px){
  .iu-f-grid{grid-template-columns:1fr 1fr 1fr;gap:32px}
  .iu-f-brand{grid-column:1/-1;margin-bottom:8px}
}
@media(max-width:760px){
  .iu-f-grid{grid-template-columns:1fr 1fr;gap:28px}
  .iu-f-brand{grid-column:1/-1}
}
@media(max-width:480px){
  .iu-f-grid{grid-template-columns:1fr;gap:20px}
  .iu-f-bot{flex-direction:column;text-align:center}
}

/* ---------- RESPONSIVE TABLES (prevent horizontal overflow) ---------- */
/* Any wide table inside a .table-scroll wrapper scrolls horizontally on mobile */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent)}
.table-scroll table{margin:0;width:100%}
.table-scroll.no-fade{-webkit-mask-image:none;mask-image:none}
/* Bare tables (not yet wrapped) — make them scroll on mobile so they don't
   force the page to overflow. We use display:block + overflow-x:auto so the
   table scrolls INSIDE its own container if cells don't fit. NO nowrap —
   cells wrap naturally so content stays readable. */
@media(max-width:760px){
  article table,section table,main table,.post-body table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    max-width:100%;
    word-break:break-word;
    overflow-wrap:break-word;
  }
  article table.no-scroll,section table.no-scroll{display:table;word-break:normal}
  /* Cells need enough room so a "DIY (Government Portal)"-type header
     doesn't shrink to one letter per row. Tables that grow wider than the
     viewport scroll horizontally inside their own block. */
  article table td,article table th,
  section table td,section table th,
  main table td,main table th,
  .post-body table td,.post-body table th{
    min-width:140px;
    vertical-align:top;
  }
  /* First column (usually a label) can be a bit narrower */
  article table td:first-child,article table th:first-child,
  section table td:first-child,section table th:first-child,
  main table td:first-child,main table th:first-child,
  .post-body table td:first-child,.post-body table th:first-child{
    min-width:120px;
  }
}

/* ---------- KILL LEGACY STICKY BOTTOM BARS (clean UX site-wide) ---------- */
.mob-cta,
.iu-msticky,
.mobile-sticky-cta,
.desktop-sticky-cta{display:none !important}
body{padding-bottom:0 !important}
@media(max-width:760px){body{padding-bottom:0 !important}}

/* ---------- LEGACY FLAT MOBILE MENU SUPPORT ---------- */
/* If a page still has the old flat <a> structure inside .iu-mob, render it acceptably */
.iu-mob > a:not(.iu-mob-cta){
  display:block;
  color:#fff;
  text-decoration:none;
  padding:13px 4px;
  font-size:15.5px;
  font-weight:500;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.iu-mob > a:not(.iu-mob-cta):hover,
.iu-mob > a:not(.iu-mob-cta):active{color:#F97316}
.iu-mob-section{
  color:rgba(249,115,22,.85);
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:14px 0 6px;
  margin-top:6px;
  border-bottom:1px solid rgba(249,115,22,.18);
}

/* ---------- WHATSAPP FLOAT BUTTON (unified — works for both class names) ---------- */
/* Pages historically used two different classes (.wa-float on main pages,
   .whatsapp-float on blog posts). Both render the same here so the WhatsApp
   icon is consistent site-wide. Some pages still ship inline rules, so we
   use !important on the visual properties to win. */
.wa-float,
.whatsapp-float,
a.wa-float,
a.whatsapp-float{
  position:fixed !important;
  bottom:24px !important;
  right:20px !important;
  width:56px !important;
  height:56px !important;
  background:#25D366 !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
  font-size:28px !important;
  line-height:1 !important;
  text-decoration:none !important;
  box-shadow:0 8px 22px rgba(37,211,102,.4),0 4px 10px rgba(0,0,0,.2) !important;
  z-index:80 !important;
  transition:transform .2s ease, box-shadow .2s ease !important;
  padding:0 !important;
  border:0 !important;
  cursor:pointer;
  /* Pulse ring */
  isolation:isolate;
}
.wa-float:hover,
.whatsapp-float:hover,
a.wa-float:hover,
a.whatsapp-float:hover{
  transform:scale(1.06) !important;
  box-shadow:0 12px 28px rgba(37,211,102,.5),0 6px 14px rgba(0,0,0,.25) !important;
}
.wa-float::before,
.whatsapp-float::before{
  content:'';
  position:absolute;
  inset:-3px;
  border-radius:50%;
  background:#25D366;
  opacity:.35;
  z-index:-1;
  animation:iuWaPulse 2s infinite;
}
@keyframes iuWaPulse{
  0%{transform:scale(1);opacity:.35}
  100%{transform:scale(1.4);opacity:0}
}
/* SVG inside the WhatsApp button on blog posts */
.wa-float svg,
.whatsapp-float svg{
  width:28px;
  height:28px;
  fill:#fff;
  display:block;
}
/* Hide when mobile menu is open so it doesn't overlap close button */
body.iu-mob-open .wa-float,
body.iu-mob-open .whatsapp-float{display:none !important}

/* Smaller on tiny phones */
@media(max-width:380px){
  .wa-float,.whatsapp-float{
    width:52px !important;height:52px !important;
    bottom:18px !important;right:16px !important;
  }
  .wa-float svg,.whatsapp-float svg{width:26px;height:26px}
}

/* ---------- TINY ACCESSIBILITY HELPERS ---------- */
.iu-hamburger:focus-visible,
.iu-mob-close:focus-visible{
  outline:2px solid #F97316;
  outline-offset:2px;
}

/* ---------- LANGUAGE TOGGLE (EN / हिं) ----------
   Auto-injected by iu-chrome.js on every page.
   z-index 1010 keeps it above sticky header (90) and disclaimer (100).
   ------------------------------------------------ */
.iu-lang{
  position:fixed;
  top:13px;
  right:20px;
  z-index:1010;
  background:rgba(15,23,42,0.85);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.15);
  border-radius:24px;
  padding:4px;
  display:flex;
  gap:2px;
  font-size:12.5px;
  font-weight:600;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans Devanagari',sans-serif;
  box-shadow:0 4px 16px rgba(0,0,0,0.25);
}
.iu-lang a{
  padding:6px 13px;
  border-radius:20px;
  color:rgba(255,255,255,0.65);
  transition:all .15s ease;
  text-decoration:none;
  line-height:1;
  display:inline-block;
}
.iu-lang a.active{
  background:linear-gradient(135deg,#F97316 0%,#EA580C 100%);
  color:#fff;
  box-shadow:0 2px 8px rgba(249,115,22,0.4);
}
.iu-lang a:hover:not(.active){color:#fff}
.iu-lang a:focus-visible{outline:2px solid #F97316;outline-offset:2px}
body.iu-mob-open .iu-lang{display:none}
@media(max-width:980px){
  .iu-lang{top:9px;right:16px;font-size:11.5px}
  .iu-lang a{padding:5px 11px}
}
