@charset "utf-8";
/*
 * ╔══════════════════════════════════════════════════════════════╗
 *  evid-genesis-fix.css  |  evidyarthi.in
 *  Genesis Child Theme Conflict Shield  —  v1.0
 *
 *  PROBLEM
 *  ───────
 *  Your Genesis child theme (custom.css) uses broad global CSS
 *  selectors — h1, h2, h3, table, th, td, li, li:before, a:link,
 *  .entry-content li — that bleed into .evid-wp post content and
 *  break the design system components.
 *
 *  SOLUTION
 *  ────────
 *  This file undoes every conflict by re-scoping or overriding
 *  ONLY inside .evid-wp. It does NOT change any theme behaviour
 *  outside the wrapper.  Load it LAST — after both custom.css
 *  and evid-custom.css.
 *
 *  LOAD ORDER IN WordPress (functions.php)
 *  ───────────────────────────────────────
 *  wp_enqueue_style( 'genesis-child',    ... );   // automatic
 *  wp_enqueue_style( 'evid-custom',      ... );   // your design system
 *  wp_enqueue_style( 'evid-genesis-fix', get_stylesheet_directory_uri()
 *                    . '/evid-genesis-fix.css',
 *                    ['evid-custom'], '1.0' );    // THIS FILE — load last
 *
 *  Or via WordPress Customizer → Additional CSS (paste at the end).
 *
 *  CONFLICTS FIXED (8 rules from custom.css)
 *  ──────────────────────────────────────────
 *  1.  li:before / .entry-content li:before { content: none !important }
 *      → kills ev-list bullets, timeline dots, numbered circles
 *
 *  2.  .content h2 { color:white !important; background-image:radial-gradient;
 *                    box-shadow; text-shadow; text-transform:capitalize;
 *                    text-align:center; padding:10px 14px; border-radius:6px }
 *      → makes every ev-h2 a white-on-blue gradient banner
 *
 *  3.  h1 { font-family:"Raleway"; font-weight:300; font-size:40px; color:#080808 }
 *      → wrong font/weight on ev-h1 inside hero
 *
 *  4.  .entry-header h1::before / ::after  (blue decorative lines)
 *      → unwanted underline drawn under ev-h1
 *
 *  5.  table/th/td global styles  (Arial font, light-blue header, grey borders)
 *      → overwrites ev-table navy header, correct borders, warm stripes
 *
 *  6.  .content p a:link { font-weight:bold; color:#006EB6 !important }
 *      → forces bold blue on every link inside dark components
 *
 *  7.  .entry-content li { display:list-item; margin:0 0 0 1.5em; position:static }
 *      .entry-content li:before { content:none !important }
 *      .entry-content li:after  { content:none }
 *      → breaks ev-list flex layout, kills all decorative pseudo-elements
 *
 *  8.  .content h3 / .entry-content h3 { clear:both }
 *      .entry-content p { clear:both }
 *      → clear:both inside flex/grid containers breaks component layout
 * ╚══════════════════════════════════════════════════════════════╝
 */


/* ─────────────────────────────────────────────────────────────
   FIX 1  li:before / .entry-content li:before { content:none !important }
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     li:before { content: none; }
     .entry-content li:before { content: none !important; ... opacity: 0; }
     .entry-content li:after  { content: none; }
     .entry-content li:hover:before { opacity: 0; }

   WHY IT BREAKS:
   Every component that draws a decorative mark via ::before or ::after
   on a child element is silently erased — ev-list diamond bullets,
   timeline dots, numbered circles, section-head gold underline (::after
   on a div, but the broad rule still stacks with the cascade).

   FIX:
   Restore content for each affected component inside .evid-wp.
   Use !important to beat the !important source rule.
   ───────────────────────────────────────────────────────────── */

/* ev-list — diamond ◆ bullet */
.evid-wp .ev-list li::before {
    content:   '◆' !important;
    color:     var(--c-gold, #C8870A) !important;
    font-size: 10px !important;
    flex-shrink: 0 !important;
    margin-top: 6px !important;
    /* reset any bleed from .entry-content li:before */
    background:  none !important;
    position:    static !important;
    animation:   none !important;
    filter:      none !important;
    opacity:     1 !important;
    border:      none !important;
    padding:     0 !important;
    width:       auto !important;
    height:      auto !important;
    top:    auto !important;
    left:   auto !important;
    z-index: auto !important;
}

/* ev-list.list-numbered — auto-numbered circles */
.evid-wp .ev-list.list-numbered li::before {
    content:           counter(ev-li) !important;
    counter-increment: ev-li !important;
    background:        var(--c-navy, #1B3A6B) !important;
    color:             #fff !important;
    width:             20px !important;
    height:            20px !important;
    border-radius:     50% !important;
    font-size:         11px !important;
    font-weight:       700 !important;
    display:           inline-flex !important;
    align-items:       center !important;
    justify-content:   center !important;
    flex-shrink:       0 !important;
    margin-top:        2px !important;
    position:          static !important;
    animation:         none !important;
    filter:            none !important;
    opacity:           1 !important;
    padding:           0 !important;
}

/* ev-tl-item — timeline dots (these are divs, not li, but we guard anyway) */
.evid-wp .ev-tl-item::before {
    content:       '' !important;
    position:      absolute !important;
    left:          -28px !important;
    top:           50% !important;
    transform:     translateY(-50%) !important;
    width:         14px !important;
    height:        14px !important;
    border-radius: 50% !important;
    background:    var(--c-gold, #C8870A) !important;
    border:        3px solid var(--c-bg, #F9F5EE) !important;
    box-shadow:    0 0 0 2px var(--c-gold, #C8870A) !important;
    z-index:       1 !important;
    animation:     none !important;
    filter:        none !important;
    opacity:       1 !important;
    margin:        0 !important;
}
.evid-wp .ev-tl-item.tl-navy::before {
    background: var(--c-navy, #1B3A6B) !important;
    box-shadow: 0 0 0 2px var(--c-navy, #1B3A6B) !important;
}
.evid-wp .ev-tl-item.tl-green::before {
    background: var(--c-green, #1A5C35) !important;
    box-shadow: 0 0 0 2px var(--c-green, #1A5C35) !important;
}

/* ev-section-head — ensure positioned container + bottom border intact */
.evid-wp .ev-section-head {
    position:       relative !important;
    display:        flex !important;
    align-items:    center !important;
    gap:            14px !important;
    border-bottom:  2px solid var(--c-border, #DDD0B8) !important;
    padding-bottom: 14px !important;
    margin-bottom:  26px !important;
}

/* gold accent underline (::after on a div — not a li) */
.evid-wp .ev-section-head::after {
    content:    '' !important;
    display:    block !important;
    position:   absolute !important;
    bottom:     -2px !important;
    left:       0 !important;
    width:      52px !important;
    height:     2px !important;
    background: var(--c-gold, #C8870A) !important;
    animation:  none !important;
    filter:     none !important;
    opacity:    1 !important;
    z-index:    1 !important;
}

/* ev-ornament-line — decorative side rules */
.evid-wp .ev-ornament-line::before,
.evid-wp .ev-ornament-line::after {
    content:    '' !important;
    flex:       1 !important;
    height:     1px !important;
    background: var(--c-gold, #C8870A) !important;
    opacity:    .5 !important;
}

/* ev-list ::after — ensure the empty reset is never triggered */
.evid-wp .ev-list li::after {
    content: none !important;
    background: none !important;
}


/* ─────────────────────────────────────────────────────────────
   FIX 2  .content h2 — GLOBAL blue gradient banner removal
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     .content h2 {
       color: white !important;
       background-image: radial-gradient(circle farthest-corner
         at 22.4% 21.7%, rgba(4,189,228,1) 0%, rgba(2,83,185,1) 100.2%);
       box-shadow: 0 6px 10px rgba(0,0,0,0.4);
       text-transform: capitalize;
       text-align: center;
       text-shadow: 0 4px 3px rgba(0,0,0,0.4)…;
       padding: 10px 14px;
       border-radius: 6px;
       font-size: 1.6em;
     }

   WHY IT BREAKS:
   EVERY h2 on EVERY post — whether inside .evid-wp, .sec-head, or
   a plain ## markdown heading — gets a full-width cyan→blue gradient
   banner with white text. This is a global problem, not scoped to
   any wrapper, so the fix must also be global.

   SPECIFICITY NOTE:
   Both `.content h2` and any `.content h2` override have identical
   specificity (0,1,1). With !important ties, the rule that loads
   LAST wins. This file loads after custom.css, so declaring every
   property from that rule with !important here will win.

   THREE CASES handled below:
   ① Standalone h2 in post content  → plain dark text, no background
   ② h2 inside .sec-head container  → transparent, inherits white
   ③ h2 inside .evid-wp design system → design system typography
   ───────────────────────────────────────────────────────────── */

/* ────────────────────────────────────────────────────────────
   ①  GLOBAL RESET — ALL h2 inside .content / .entry-content
   ────────────────────────────────────────────────────────────
   This is the main fix. It strips every property set by
   custom.css's .content h2 rule from ALL h2 tags site-wide.
   Result: plain readable dark heading, no gradient, no glow. */
.content       h2,
.entry-content h2 {
    color:            #1B3A6B !important;  /* ← beats "color:white !important" */
    background-image: none !important;
    background-color: transparent !important;
    background:       transparent !important;
    box-shadow:       none !important;
    text-shadow:      none !important;
    text-transform:   none !important;     /* ← beats "capitalize"             */
    text-align:       left !important;     /* ← beats "center"                 */
    padding:          0 0 10px 0 !important; /* ← beats "10px 14px"            */
    border-radius:    0 !important;        /* ← beats "6px"                    */
    clear:            none !important;
    font-size:        1.5em !important;
    font-weight:      700 !important;
    line-height:      1.3 !important;
    margin:           0 0 10px 0 !important;
}


/* ────────────────────────────────────────────────────────────
   ②  .sec-head h2 — inside a coloured gradient header band
   ────────────────────────────────────────────────────────────
   Structure:
     <div class="sec-head" style="background:linear-gradient(…);">
       <div class="bhag">खण्ड 1</div>
       <h2>Section Title</h2>
     </div>

   The container paints its own gradient. The h2 must be
   fully transparent so ONLY the container's colour shows.
   color:inherit picks up the white set on .sec-head. */
.content       .sec-head h2,
.entry-content .sec-head h2,
               .sec-head h2 {
    color:            inherit !important;  /* inherit white from .sec-head     */
    background:       none !important;
    background-image: none !important;
    background-color: transparent !important;
    box-shadow:       none !important;
    text-shadow:      none !important;
    padding:          0 !important;
    margin:           0 !important;
    border-radius:    0 !important;
    text-transform:   none !important;
    text-align:       left !important;
    clear:            none !important;
    font-size:        18px !important;
    font-weight:      700 !important;
    line-height:      1.3 !important;
    display:          block !important;
}


/* ────────────────────────────────────────────────────────────
   ③  .evid-wp design system h2 classes
   ────────────────────────────────────────────────────────────
   These are the ev-h2 / ev-section-head h2 from evid-custom.css.
   They follow the design system typography token. */
.evid-wp .ev-h2,
.evid-wp .ev-section-head h2 {
    color:            #1B3A6B !important;
    background-image: none !important;
    background-color: transparent !important;
    background:       transparent !important;
    box-shadow:       none !important;
    text-shadow:      none !important;
    text-transform:   none !important;
    text-align:       left !important;
    padding:          0 !important;
    margin:           0 !important;
    border-radius:    0 !important;
    font-family:      'Tiro Devanagari Hindi', 'Noto Serif Devanagari', Georgia, serif !important;
    font-size:        clamp(20px, 3vw, 26px) !important;
    font-weight:      400 !important;
    line-height:      1.25 !important;
    clear:            none !important;
}


/* ─────────────────────────────────────────────────────────────
   FIX 3  h1 global — wrong font family / weight
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     h1 { font-family:"Raleway",sans-serif; font-weight:300;
           font-size:40px; color:#080808; }

   WHY IT BREAKS:
   ev-h1 inside the hero gets Raleway light-weight instead of
   the correct serif at clamp(28px–52px) in white.

   FIX:
   Re-apply the correct font stack and colour for ev-h1.
   ───────────────────────────────────────────────────────────── */

.evid-wp .ev-h1 {
    font-family: var(--f-serif, 'Tiro Devanagari Hindi', 'Noto Serif Devanagari', Georgia, serif) !important;
    font-weight: 400 !important;
    font-size:   clamp(28px, 5vw, 52px) !important;
    color:       #fff !important;
    line-height: 1.15 !important;
    margin:      0 0 10px !important;
    padding:     0 !important;
    transition:  none !important;
}

/* Gold accent span inside ev-h1 */
.evid-wp .ev-h1 .ev-accent {
    color:       var(--c-gold-lt, #E8A532) !important;
    font-family: inherit !important;
}


/* ─────────────────────────────────────────────────────────────
   FIX 4  .entry-header h1::before / ::after — decorative lines
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     .entry-header h1:before { width:55px; height:6px; content:"";
       position:absolute; bottom:-2px; left:48%; background:#0050bb; }
     .entry-header h1:after  { width:100%; height:1px; content:"";
       position:relative; margin-top:7px; background:#004fb8; }

   WHY IT BREAKS:
   When .evid-wp sits inside .entry-header (or its ancestor matches),
   a blue underline bar and horizontal rule appear under ev-h1.

   FIX:
   Remove both pseudo-elements from ev-h1.
   ───────────────────────────────────────────────────────────── */

.evid-wp .ev-h1::before,
.evid-wp .ev-h1::after {
    content:    none !important;
    display:    none !important;
    width:      0 !important;
    height:     0 !important;
    background: none !important;
}


/* ─────────────────────────────────────────────────────────────
   FIX 5  table / th / td global styles
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     table { font-family:arial; border-style:hidden;
             box-shadow:0 0 0 1px #b7b7b7; }
     th    { background-color:#e8f2ff; color:#003d8f;
             border:1px solid #c0d4ee; padding:8px 10px; }
     td    { border:1px solid #dddddd; padding:8px 10px; }
     tr:nth-child(even) td { background-color:#f7faff; }

   WHY IT BREAKS:
   ev-table should have a navy header, borderless cells with only a
   bottom-border separator, and warm gold-tinted even rows. The global
   rules replace all of this with Arial font, light-blue header, grey
   borders and cold-blue stripes.

   FIX:
   Restore every ev-table property to its designed values.
   ───────────────────────────────────────────────────────────── */

/* Table wrapper and element */
.evid-wp .ev-table {
    font-family:  var(--f-sans, 'Noto Sans Devanagari', sans-serif) !important;
    border-style: none !important;
    box-shadow:   none !important;
}

/* Header row */
.evid-wp .ev-table thead tr {
    background: var(--c-navy, #1B3A6B) !important;
}

/* Header cells */
.evid-wp .ev-table th {
    background-color: var(--c-navy, #1B3A6B) !important;
    color:            rgba(255,255,255,.9) !important;
    border:           none !important;
    padding:          12px 14px !important;
    font-family:      var(--f-sans, sans-serif) !important;
    font-size: 15px !important;
    font-weight:      600 !important;
    text-align:       left !important;
    white-space:      nowrap !important;
}

.evid-wp .ev-table th:first-child { border-radius: 10px 0 0 0 !important; }
.evid-wp .ev-table th:last-child  { border-radius: 0 10px 0 0 !important; }

/* Data cells — bottom border only, no side borders */
.evid-wp .ev-table td {
    border:        none !important;
    border-bottom: 1px solid var(--c-border-lt, #EDE4D0) !important;
    padding:       10px 14px !important;
    background:    #fff !important;
    color:         var(--c-ink-soft, #3A2C14) !important;
    font-size: 15.5px !important;
    font-family:   var(--f-sans, sans-serif) !important;
    vertical-align: top !important;
    text-align:    left !important;
}

/* Even-row stripe — warm instead of cold blue */
.evid-wp .ev-table tbody tr:nth-child(even) td {
    background-color: var(--c-bg, #F9F5EE) !important;
}

/* Hover row */
.evid-wp .ev-table tbody tr:hover td {
    background-color: var(--c-gold-tint, #FFF7E0) !important;
}

/* Strong text inside cells */
.evid-wp .ev-table td strong {
    color: var(--c-ink, #1C1208) !important;
}


/* ─────────────────────────────────────────────────────────────
   FIX 6  .content p a:link — forced bold blue on all links
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     .content p a:link { font-weight:bold; color:#006EB6 !important; }

   WHY IT BREAKS:
   Links inside ev- dark components (hero, TOC card, summary box,
   PYQ block, profile header) inherit bold weight and blue colour,
   which is illegible on dark navy or gradient backgrounds.

   FIX:
   Reset weight to normal inside .evid-wp.
   On dark-background components, explicitly set the correct colour.
   ───────────────────────────────────────────────────────────── */

/* General weight reset inside .evid-wp */
.evid-wp p a,
.evid-wp p a:link,
.evid-wp p a:visited {
    font-weight: normal !important;
}

/* Links on dark-background components — keep readable white / gold */
.evid-wp .ev-hero         a:link,
.evid-wp .ev-hero         a:visited,
.evid-wp .ev-toc-card     a:link,
.evid-wp .ev-toc-card     a:visited,
.evid-wp .ev-summary      a:link,
.evid-wp .ev-summary      a:visited,
.evid-wp .ev-pyq          a:link,
.evid-wp .ev-pyq          a:visited,
.evid-wp .ev-bpsc-box     a:link,
.evid-wp .ev-bpsc-box     a:visited,
.evid-wp .ev-vision       a:link,
.evid-wp .ev-vision       a:visited,
.evid-wp .ev-pull-quote   a:link,
.evid-wp .ev-pull-quote   a:visited,
.evid-wp .ev-ruler-head   a:link,
.evid-wp .ev-ruler-head   a:visited,
.evid-wp .ev-profile-head a:link,
.evid-wp .ev-profile-head a:visited,
.evid-wp .ev-acc-trigger  a:link,
.evid-wp .ev-acc-trigger  a:visited,
.evid-wp .ev-sidebar-card-head a:link,
.evid-wp .ev-sidebar-card-head a:visited {
    color:           rgba(255,255,255,.85) !important;
    font-weight:     normal !important;
    text-decoration: none !important;
}

/* TOC dark card links */
.evid-wp .ev-toc-item,
.evid-wp .ev-toc-item:link,
.evid-wp .ev-toc-item:visited {
    color:           rgba(255,255,255,.72) !important;
    font-weight:     500 !important;
    text-decoration: none !important;
}

/* Sticky TOC bar links */
.evid-wp .ev-toc-link,
.evid-wp .ev-toc-link:link,
.evid-wp .ev-toc-link:visited {
    color:           var(--c-gold-lt, #E8A532) !important;
    font-weight:     500 !important;
    text-decoration: none !important;
}

/* Gold-bordered TOC box links (light background — navy is correct) */
.evid-wp .ev-toc-box a:link,
.evid-wp .ev-toc-box a:visited {
    color:           var(--c-navy, #1B3A6B) !important;
    font-weight:     normal !important;
    text-decoration: none !important;
}


/* ─────────────────────────────────────────────────────────────
   FIX 7  .entry-content li — display, margin and pseudo-elements
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     .entry-content li {
       display: list-item;
       margin:  0 0 0 1.5em;
       position: static;
       z-index: auto;
       border-radius: 0;
     }
     .entry-content li:before { content: none !important; ... opacity: 0; }
     .entry-content li:after  { content: none; background: none; }
     .entry-content li:hover:before { opacity: 0; }
     .entry-content li:active { color: #222; }

   WHY IT BREAKS:
   ev-list items use display:flex + gap. Forcing display:list-item
   removes the flex layout entirely. The 1.5em left margin pushes
   items right, misaligning the bullet. The :before/:after resets
   (already covered in Fix 1) are repeated here for completeness.

   FIX:
   Restore flex display and zero margin for ev-list items.
   Restore :before / :after to the correct decorative values.
   ───────────────────────────────────────────────────────────── */

/* Restore flex layout — hardcoded color (no CSS variable) to guarantee visibility */
.evid-wp .ev-list li {
    display:       flex !important;
    margin:        0 !important;
    padding:       7px 0 !important;
    position:      relative !important;
    color:         #3A2C14 !important;
    background:    none !important;
    border-radius: 0 !important;
    cursor:        default !important;
    z-index:       auto !important;
    font-size:     15.5px !important;
    line-height:   1.8 !important;
    font-family:   'Noto Sans Devanagari', sans-serif !important;
}

/* strong inside list items — ensure dark, not white */
.evid-wp .ev-list li strong {
    color: #1B3A6B !important;
}

/* em inside list items */
.evid-wp .ev-list li em {
    color: #3A2C14 !important;
}

/* ── ACCORDION BODY — force white background + dark text ──────
   ev-acc-body background is var(--c-surface) but the minified
   combined CSS may override. Hardcode both bg and text color. */
.evid-wp .ev-acc-body {
    background:   #ffffff !important;
    color:        #3A2C14 !important;
}

/* Every direct child text element inside accordion body */
.evid-wp .ev-acc-body .ev-list li {
    color:      #3A2C14 !important;
    background: transparent !important;
}
.evid-wp .ev-acc-body .ev-list li strong {
    color: #1B3A6B !important;
}
.evid-wp .ev-acc-body .ev-list li em {
    color:       #3A2C14 !important;
    font-style:  italic !important;
}
.evid-wp .ev-acc-body .ev-p,
.evid-wp .ev-acc-body p {
    color:      #3A2C14 !important;
    background: transparent !important;
}
.evid-wp .ev-acc-body .ev-h3 {
    color:      #1B3A6B !important;
    background: none !important;
}
/* Also fix any tables that appear inside accordions */
.evid-wp .ev-acc-body .ev-table td {
    background: #ffffff !important;
    color:      #3A2C14 !important;
}
.evid-wp .ev-acc-body .ev-table tbody tr:nth-child(even) td {
    background: #F9F5EE !important;
}

/* Remove forced underline + weight override on list links */
.evid-wp .ev-list li a,
.evid-wp .ev-list li a:link {
    text-decoration: none !important;
    font-weight:     normal !important;
    color:           #1B3A6B !important;
}

/* Links on dark-bg list items stay white */
.evid-wp .ev-pyq  .ev-list li a:link,
.evid-wp .ev-summary .ev-list li a:link {
    color: rgba(255,255,255,.8) !important;
}

/* Dark-background components — list item text must be white */
.evid-wp .ev-pyq      .ev-list li,
.evid-wp .ev-summary  .ev-list li,
.evid-wp .ev-bpsc-box .ev-list li {
    color: rgba(255,255,255,.88) !important;
}
.evid-wp .ev-pyq      .ev-list li strong,
.evid-wp .ev-summary  .ev-list li strong,
.evid-wp .ev-bpsc-box .ev-list li strong {
    color: #fff !important;
}

/* Restore :after on li */
.evid-wp .ev-list li::after  { content: none !important; }

/* Hover and active states */
.evid-wp .ev-list li:hover::before { opacity: 1 !important; }
.evid-wp .ev-list li:active        { color: #3A2C14 !important; }
.evid-wp .ev-list li:active::after { background: none !important; }


/* ─────────────────────────────────────────────────────────────
   FIX 8  clear:both on h3 and p inside flex/grid containers
   ──────────────────────────────────────────────────────────────
   SOURCE IN custom.css:
     .content h3, .entry-content h3 { clear: both; font-size: 1.4em; }
     .entry-content p { clear: both; }

   WHY IT BREAKS:
   clear:both on .ev-h3 elements inside ev- flex or grid containers
   (ev-note, ev-card, ev-acc-body, etc.) forces them to drop below
   any preceding float, breaking the layout rhythm.
   Same issue for .ev-p paragraphs inside flex row containers.

   FIX:
   Set clear:none on ev-h3 and ev-p inside .evid-wp.
   ───────────────────────────────────────────────────────────── */

.evid-wp .ev-h3 {
    clear:            none !important;
    font-size:        16px !important;
    font-weight:      700 !important;
    color:            var(--c-navy, #1B3A6B) !important;
    /* Guard against h2 gradient rule bleeding onto ev-h3 */
    background-image: none !important;
    background-color: transparent !important;
    box-shadow:       none !important;
    text-shadow:      none !important;
    padding:          0 0 0 12px !important;
    margin:           20px 0 10px !important;
    border-left:      3px solid var(--c-gold, #C8870A) !important;
    border-radius:    0 !important;
    text-transform:   none !important;
    text-align:       left !important;
}

.evid-wp .ev-p {
    clear: none !important;
}

/* Specific flex container inner paragraphs */
.evid-wp .ev-note    .ev-p,
.evid-wp .ev-note-body p,
.evid-wp .ev-card-body .ev-p,
.evid-wp .ev-card-body p,
.evid-wp .ev-v-item  .ev-p,
.evid-wp .ev-ruler-body .ev-p,
.evid-wp .ev-profile-body .ev-p,
.evid-wp .ev-summary-item .ev-si-text,
.evid-wp .ev-acc-body .ev-p,
.evid-wp .ev-pyq-item,
.evid-wp .ev-bpsc-item,
.evid-wp .ev-qa-answer,
.evid-wp .ev-pull-quote .ev-pq-text,
.evid-wp .ev-conclusion p {
    clear: none !important;
}


/* ─────────────────────────────────────────────────────────────
   BONUS — Accordion trigger button
   ──────────────────────────────────────────────────────────────
   custom.css:
     .button, input[type=button], input[type=reset], input[type=submit]
     { background-color:#c7efff; border-color:skyblue; padding:18px; }

   The ev-acc-trigger is a <button> element. The global button rule
   overrides its background gradient with light blue.
   ───────────────────────────────────────────────────────────── */

.evid-wp .ev-acc-trigger {
    width:         100% !important;
    padding:       15px 20px !important;
    font-size:     15px !important;
    font-weight:   700 !important;
    color:         #fff !important;
    border:        none !important;
    border-radius: 0 !important;
    border-color:  transparent !important;
    box-shadow:    none !important;
}

/* Restore each colour variant */
.evid-wp .ev-acc-trigger          { background: linear-gradient(90deg, #1B3A6B, #2E4F90) !important; }
.evid-wp .ev-acc-trigger.acc-gold   { background: linear-gradient(90deg, #8B5C08, #C8870A) !important; }
.evid-wp .ev-acc-trigger.acc-green  { background: linear-gradient(90deg, #0D3D22, #1A5C35) !important; }
.evid-wp .ev-acc-trigger.acc-red    { background: linear-gradient(90deg, #5A1010, #8B1A1A) !important; }
.evid-wp .ev-acc-trigger.acc-orange { background: linear-gradient(90deg, #8B3408, #D4601A) !important; }
.evid-wp .ev-acc-trigger.acc-maroon { background: linear-gradient(90deg, #6B1A24, #8B1A2F) !important; }
.evid-wp .ev-acc-trigger.acc-teal   { background: linear-gradient(90deg, #073A3A, #0D6B6B) !important; }
.evid-wp .ev-acc-trigger:hover      { filter: brightness(1.1) !important; }

/* ─────────────────────────────────────────────────────────────
   BONUS — li::marker colour
   ──────────────────────────────────────────────────────────────
   custom.css:
     li::marker { color:#046ac1; font-weight:bold; }

   ev-list uses display:flex so ::marker is invisible, but a few
   components use regular <ul> internally. Reset to inherit.
   ───────────────────────────────────────────────────────────── */

.evid-wp li::marker {
    color:       inherit !important;
    font-weight: inherit !important;
}


/* ═══════════════════════════════════════════════════════════════
   FONT SIZE & READABILITY FIXES
   ─────────────────────────────────────────────────────────────
   The Genesis theme base font is smaller than the design system
   expects. These rules enforce readable sizes on all components.
   All colors use hardcoded hex — CSS variables are unreliable
   inside WordPress's multi-stylesheet cascade.
   ═══════════════════════════════════════════════════════════════ */

/* Body paragraph */
.evid-wp .ev-p {
    font-size:   16px !important;
    line-height: 1.9 !important;
    color:       #3A2C14 !important;
    font-family: 'Noto Sans Devanagari', sans-serif !important;
}

/* Lead paragraph */
.evid-wp .ev-lead {
    font-size:   17px !important;
    line-height: 2.0 !important;
    color:       #1C1208 !important;
}

/* Sub-heading */
.evid-wp .ev-h3 {
    font-size: 17px !important;
    color:     #1B3A6B !important;
}

/* Note body text */
.evid-wp .ev-note-body,
.evid-wp .ev-note-body p {
    font-size: 18.5px !important;
    line-height: 1.85 !important;
    color:       #3A2C14 !important;
}

/* Table cells */
.evid-wp .ev-table td {
    font-size: 15.5px !important;
}
.evid-wp .ev-table th {
    font-size: 15px !important;
}

/* Quick-revision table */
.evid-wp .ev-qr-key,
.evid-wp .ev-qr-val {
    font-size:   14px !important;
    color:       #3A2C14 !important;
    line-height: 1.7 !important;
}
.evid-wp .ev-qr-row.ev-qr-head .ev-qr-key,
.evid-wp .ev-qr-row.ev-qr-head .ev-qr-val {
    color: rgba(255,255,255,.9) !important;
}

/* Card body text */
.evid-wp .ev-card-body {
    font-size:   14.5px !important;
    color:       #6B5A3E !important;
    line-height: 1.75 !important;
}

/* Ruler card */
.evid-wp .ev-ruler-body {
    font-size:   14.5px !important;
    color:       #3A2C14 !important;
    line-height: 1.75 !important;
}

/* Timeline text */
.evid-wp .ev-tl-text {
    font-size:   15px !important;
    color:       #3A2C14 !important;
    line-height: 1.75 !important;
}
.evid-wp .ev-tl-year {
    font-size: 12px !important;
    color:     #C8870A !important;
}
.evid-wp .ev-tl-item.tl-navy  .ev-tl-year { color: #1B3A6B !important; }
.evid-wp .ev-tl-item.tl-green .ev-tl-year { color: #1A5C35 !important; }

/* Accordion trigger */
.evid-wp .ev-acc-trigger {
    font-size: 15.5px !important;
}

/* Accordion body text */
.evid-wp .ev-acc-body .ev-p,
.evid-wp .ev-acc-body p {
    font-size: 15.5px !important;
    color:     #3A2C14 !important;
}

/* PYQ item */
.evid-wp .ev-pyq-item {
    font-size:   15px !important;
    line-height: 1.8 !important;
}

/* Summary item text */
.evid-wp .ev-summary-item .ev-si-text {
    font-size: 13px !important;
}

/* Profile body */
.evid-wp .ev-profile-body .ev-p {
    font-size: 15.5px !important;
    color:     #3A2C14 !important;
}

/* Fact chip value */
.evid-wp .ev-fact-chip .ev-fc-value {
    font-size: 14.5px !important;
    color:     #1C1208 !important;
}

/* Reason card text */
.evid-wp .ev-reason-text {
    font-size:   14px !important;
    color:       #3A2C14 !important;
    line-height: 1.7 !important;
}
.evid-wp .ev-reason-title {
    font-size: 19.5px !important;
    color:     #8B1A1A !important;
}


/* ═══════════════════════════════════════════════════════════════
   MOBILE OVERFLOW FIX
   ─────────────────────────────────────────────────────────────
   ROOT CAUSE:
   Genesis child theme (custom.css) has:
     @media (min-width: 600px) { .content { width: 608px; } }

   This fixes .content at 608px even on phones (375–480px wide).
   The .evid-wp wrapper sits inside .content, so it inherits the
   608px width and causes horizontal scrolling on every phone.

   Additionally, .entry and .content have padding/margins that
   eat into the available width and push our content off-screen.

   FIX: At mobile widths, force .content and all ancestors to be
   fluid (width: 100%), remove fixed widths, and ensure our
   wrapper fills the screen properly.
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 782px) {

    /* ── Force Genesis .content to be fluid ───────────────────
       This directly overrides:
         @media (min-width: 600px) { .content { width: 608px; } }
       with !important to guarantee the win. */
    .content,
    .entry-content,
    .site-inner .content,
    .content-sidebar .content {
        width:     100% !important;
        max-width: 100% !important;
        min-width: 0   !important;
        float:     none !important;
        padding:   0 !important;
        margin:    0 !important;
    }

    /* ── Remove horizontal overflow from outer containers ─────*/
    .site-container,
    .site-inner,
    .wrap,
    .entry,
    .content-sidebar-wrap {
        max-width: 100% !important;
        overflow-x: hidden !important;
        padding-left:  0 !important;
        padding-right: 0 !important;
    }

    /* ── Ensure our wrapper fills 100% ────────────────────────*/
    .evid-wp {
        width:     100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    /* ── ev-wrap gets comfortable side padding ────────────────*/
    .evid-wp .ev-wrap {
        padding:   20px 14px 40px !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* ── Tables must scroll inside their wrapper ──────────────*/
    .evid-wp .ev-table-wrap {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        max-width: 100% !important;
    }
    .evid-wp .ev-table {
        min-width: 400px;  /* allow scroll for complex tables */
    }

    /* ── sec-head responsive padding ─────────────────────────*/
    .evid-wp .sec-head {
        padding: 11px 14px !important;
        gap: 8px !important;
        flex-wrap: wrap !important;
    }
    .content       .sec-head h2,
    .entry-content .sec-head h2,
                   .sec-head h2 {
        font-size: 15px !important;
    }
    .evid-wp .bhag {
        font-size: 9px !important;
        padding: 2px 8px !important;
    }

    /* ── All grids single column ──────────────────────────────*/
    .evid-wp .ev-grid,
    .evid-wp .ev-grid.cols-2,
    .evid-wp .ev-grid.cols-3,
    .evid-wp .ev-grid.cols-4 {
        grid-template-columns: 1fr !important;
    }

    /* ── Col layouts stack ────────────────────────────────────*/
    .evid-wp .ev-col2,
    .evid-wp .ev-col2-equal,
    .evid-wp .ev-col3 {
        grid-template-columns: 1fr !important;
    }

    /* ── Quick-revision table stacks ─────────────────────────*/
    .evid-wp .ev-qr-row {
        flex-direction: column !important;
    }
    .evid-wp .ev-qr-key,
    .evid-wp .ev-qr-val {
        width: 100% !important;
    }

    /* ── Accordion ────────────────────────────────────────────*/
    .evid-wp .ev-acc-trigger {
        font-size: 14px !important;
        padding: 12px 14px !important;
    }

    /* ── Font sizes ───────────────────────────────────────────*/
    .evid-wp .ev-p    { font-size: 15px  !important; }
    .evid-wp .ev-lead { font-size: 15.5px !important; }
    .evid-wp .ev-h3   { font-size: 15.5px !important; }

    /* ── Summary ──────────────────────────────────────────────*/
    .evid-wp .ev-summary-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    /* ── Quiz opts ────────────────────────────────────────────*/
    .evid-wp .ev-quiz-opts {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 420px) {
    .evid-wp .ev-wrap           { padding: 14px 10px 32px !important; }
    .evid-wp .ev-summary-grid   { grid-template-columns: 1fr !important; }
    .evid-wp .ev-table          { min-width: 300px; }
    .evid-wp .ev-table th,
    .evid-wp .ev-table td       { padding: 7px 8px !important; font-size: 15.5px !important; }
    .evid-wp .ev-note           { flex-direction: column !important; gap: 6px !important; }
    .evid-wp .ev-note-icon      { display: none !important; }
    .evid-wp .ev-mnemonic .ev-mn-key { font-size: 18px !important; letter-spacing: 2px !important; }
}