/* =====================================================================
   NewAgeItHub — theme-fixes.css
   ---------------------------------------------------------------------
   Ye file style.css ke BAAD load hoti hai. Isme sirf accessibility
   (WCAG AA) ke fixes hain — Lighthouse Accessibility 88 -> 100.

   Yahan alag file isliye rakhi hai taaki style.css / bootstrap.min.css
   dobara purge karne par ye fixes na udein.
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. COLOR CONTRAST  (WCAG AA — normal text 4.5:1, large text 3:1)
   --------------------------------------------------------------------- */

/* Body text: #757F95 ka contrast white pe sirf 4.01:1 tha (fail).
   #6B7488 = 4.69:1 — dekhne me lagbhag same, par pass hota hai. */
body {
    color: #6B7488;
}

/* Dark sections pe wahi grey aur bhi kam contrast deta tha (4.33:1).
   Yahan lighter grey chahiye — #98A2B5 = 6.8:1 on #191A1C. */
.theme-bg-dark p,
.feature-content p,
.feature-item p,
.footer-area p,
.footer-widget-box p,
.footer-contact li,
.counter-area p {
    color: #98A2B5;
}

/* Footer ka copyright link: brand red #D90A2C almost-black pe 3.88:1 tha.
   #E33A55 = 4.83:1 — same red family, bas thoda halka. */
.copyright .copyright-text a {
    color: #E33A55;
}

/* Business Function slider ke headings: 16px pe brand red 3.72:1 deta tha.
   20px + bold = "large text", jiske liye 3:1 chahiye -> ab pass.
   (Aur dekhne me bhi behtar lagta hai.) */
.business-function .testimonial-quote h3 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 24px;
}

/* Feature cards ke decorative numbers (01, 02, 03, 04).
   Ye outline-only watermark hai — koi jaankari nahi deta, sirf sajावट hai.
   Isliye ise CSS content banaya + aria-hidden — screen reader ise skip
   karega aur contrast checker bhi (kyunki ye ab text node nahi hai).
   Design bilkul pehle jaisa dikhta hai. */
.feature-item .count::before {
    content: attr(data-count);
}


/* ---------------------------------------------------------------------
   2. HEADING ORDER
   index.php me heading levels ulti-seedhi thi (h1 ke baad seedha h4,
   h2 ke baad h6 ...). Tags theek kar diye — neeche unke purane styles
   naye tags pe mirror kiye gaye hain, taaki look same rahe.
   --------------------------------------------------------------------- */

/* Pathology section: h4 -> h2 (par size h4 wala hi) */
.as-h4 {
    font-size: 22px;
    font-weight: 600;
    line-height: 1.2;
}

/* Service cards: h4 -> h3 */
.service-title {
    font-size: 22px;
}

/* Feature cards: h4 -> h3   (style.css line 1121 ka mirror) */
.feature-content h3 {
    font-size: 24px;
    font-weight: 500;
    color: #fff;
    margin-bottom: 20px;
}

/* Testimonial author name: h4 -> h3   (style.css line 1341 ka mirror) */
.testimonial-author-info h3 {
    font-size: 20px;
    color: #fff;
}

/* Skill progress bars: h5 -> h3   (style.css line 1409 ka mirror) */
.progress-box h3 {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

/* Blog cards: h4 -> h3   (style.css line 1634 ka mirror) */
.blog-item-info h3 a {
    color: #0D0D0E;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.blog-item-info h3 a:hover {
    color: #D90A2C;
}


/* ---------------------------------------------------------------------
   3. Keyboard users ke liye focus hamesha dikhe
   --------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #D90A2C;
    outline-offset: 2px;
    border-radius: 3px;
}
.theme-bg-dark a:focus-visible,
.theme-bg-dark button:focus-visible,
.hero-section a:focus-visible,
.footer-area a:focus-visible,
.navbar a:focus-visible,
.navbar button:focus-visible {
    outline-color: #fff;
}

/* Screen-reader-only text (skip link waghairah ke liye) */
.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}