/* ==========================================================================
   Shortcode Styles — Featured Stories Slider
   ========================================================================== */

/* ── Outer section ── */
.fss-section {
    background : #ffffff;
}

.fss-wrapper {
    position : relative;
}

/* ── Slider reset ── */
.fss-slider { outline: none; }

/* Slick flex chain: makes image column stretch to match content column height */
.fss-slider .slick-track {
    display        : flex !important;
    align-items    : stretch !important;
}
.fss-slider .slick-slide {
    height         : auto !important;
    float          : none !important;
    display        : flex !important;
    flex-direction : column !important;
}
.fss-slider .slick-slide > div {
    flex           : 1 1 auto;
    display        : flex;
    flex-direction : column;
}
.fss-slide {
    flex           : 1 1 auto;
}

/* ── Each slide: two-column grid ── */
.fss-slide {
    display               : grid !important;
    grid-template-columns : 1fr 1fr;
    gap                   : 30px;
    align-items           : stretch;
    outline               : none;
}

/* ─────────────────────────────────────────
   IMAGE COLUMN
───────────────────────────────────────── */
.fss-image-col {
    position : relative;
    height   : 100%;
}

.fss-image-wrap {
    position      : relative;
    overflow      : hidden;
    border-radius : 4px;
    height        : 100%;
}

.fss-image-wrap img {
    width        : 100%;
    height       : 100%;
    object-fit   : cover;
    display      : block;
    border-radius: 4px;
}


/* ─────────────────────────────────────────
   DOTS CONTAINER — below slider, left half
───────────────────────────────────────── */
.fss-dots {
    width       : 50%;
    padding-top : 18px;
}

.fss-dots .slick-dots {
    position        : relative !important;
    bottom          : auto;
    left            : auto;
    width           : 100%;
    display         : flex !important;
    align-items     : center;
    justify-content : center;
    gap             : 8px;
    margin          : 0;
    padding         : 0;
    list-style      : none;
}

.fss-dots .slick-dots li {
    display : block;
    margin  : 0;
    padding : 0;
    width   : auto;
    height  : auto;
}

.fss-dots .slick-dots li button {
    display       : block;
    width         : 40px;
    height        : 3px;
    background    : #cccccc;
    border        : none;
    border-radius : 2px;
    padding       : 0;
    cursor        : pointer;
    font-size     : 0;
    line-height   : 0;
    transition    : background 250ms ease, width 250ms ease;
}

/* Hide the default slick dot character */
.fss-dots .slick-dots li button:before {
    display : none;
}

.fss-dots .slick-dots li.slick-active button {
    background : #555555;
    width      : 52px;
}

/* ─────────────────────────────────────────
   CONTENT COLUMN
───────────────────────────────────────── */
.fss-content-col { padding: 0; }

/* "FEATURED STORY" label */
.fss-label {
    font-family    : "Poppins", sans-serif;
    font-size      : 20px;
    font-weight    : 600;
    line-height    : 22px;
    letter-spacing : 1px;
    text-transform : uppercase;
    color          : #39af4a;
    display        : block;
    margin-bottom  : 16px;
}

/* Story title */
.fss-title {
    font-family   : "Cormorant Garamond", serif;
    font-size     : 48px;
    font-weight   : 300;
    line-height   : 53px;
    color         : #000000;
    margin        : 0 0 20px;
}

/* Orange divider line */
.fss-divider {
    width         : 70px;
    height        : 3px;
    background    : #ed9732;
    margin-bottom : 24px;
    border        : none;
}

/* Story excerpt / description */
.fss-excerpt {
    font-family   : "Poppins", sans-serif;
    font-size     : 16px;
    font-weight   : 300;
    line-height   : 1.7;
    color         : #140000;
    margin-bottom : 24px;
}

/* Story quote */
.fss-quote {
    font-family : "Cormorant Garamond", serif;
    font-size   : 24px;
    font-weight : 400;
    font-style  : italic;
    color       : #000000;
    margin      : 0 0 10px;
    padding     : 0;
    border      : none;
    background  : transparent;
}

.fss-quote::before {
    content : '\201C';
    color   : #39af4a;
}

.fss-quote::after {
    content : '\201D';
    color   : #39af4a;
}

/* Read Full Story link */
.fss-read-more {
    font-family     : "Poppins", sans-serif;
    font-size       : 14px;
    font-weight     : 600;
    line-height     : 17px;
    color           : #ed9732;
    text-decoration : none;
    display         : inline-flex;
    align-items     : center;
    gap             : 6px;
    transition      : color 200ms ease;
}

.fss-read-more:hover,
.fss-read-more:focus {
    color           : #d4831f;
    text-decoration : none;
}

/* ─────────────────────────────────────────
   RESPONSIVE
───────────────────────────────────────── */

/* Laptop tight (991-1024px): still 2-col, just tighten gap + font */
@media (min-width: 991px) and (max-width: 1024px) {
    .fss-slide { gap: 24px; }
    .fss-title { font-size: 40px; line-height: 46px; }
}

/* Tablet (768-990px): switch to single-column, dots centered */
@media (min-width: 768px) and (max-width: 990px) {
    .fss-slide {
        grid-template-columns : 1fr;
        gap                   : 28px;
    }
    .fss-image-col,
    .fss-image-wrap         { height: auto; }
    .fss-image-wrap img     { height: 380px; }
    .fss-title              { font-size: 36px; line-height: 42px; }
    .fss-dots               { width: 100%; padding-top: 20px; }
    .fss-dots .slick-dots   { justify-content: center; }
}

/* Mobile (<=767px) */
@media (max-width: 767px) {
    .fss-slide {
        grid-template-columns : 1fr;
        gap                   : 28px;
    }
    .fss-image-col,
    .fss-image-wrap         { height: auto; }
    .fss-image-wrap img     { height: 280px; }
    .fss-title              { font-size: 32px; line-height: 38px; }
    .fss-dots               { width: 100%; padding-top: 24px; }
    .fss-dots .slick-dots   { justify-content: center; }
}

@media (max-width: 480px) {
    .fss-title { font-size: 28px; line-height: 34px; }
    .fss-label { font-size: 16px; }
    .fss-quote { font-size: 20px; }
}

/* ==========================================================================
   Home Podcast Listing  [home-podcast-listing]
   ========================================================================== */

.hpl-grid {
    display               : grid;
    grid-template-columns : repeat(3, 1fr);
    gap                   : 24px;
}

/* ── Card shell ── */
.hpl-card {
    border-radius : 12px;
    overflow      : hidden;
    position      : relative;
    border        : 2px solid transparent;
    transition    : border-color 300ms ease, box-shadow 300ms ease;
}

.hpl-card:hover {
    border-color : #ed9732;
    box-shadow   : 0 8px 32px rgba(0, 0, 0, 0.22);
}

/* Suppress any stray <img> injected inside the card by WP hooks / Elementor */
.hpl-card-inner > img,
.hpl-card-body  > img {
    display : none !important;
}

/* ── Card inner — square bg image (div, not <a>) ── */
.hpl-card-inner {
    display            : block;
    aspect-ratio       : 1 / 1;
    background-size    : cover;
    background-position-y: 20%;
    background-position-x: center;
    background-repeat  : no-repeat;
    background-color   : #1a1a1a;
    position           : relative;
    overflow           : hidden;
    filter             : grayscale(100%);
    transition         : filter 300ms ease;
}

.hpl-card:hover .hpl-card-inner {
    filter : grayscale(0%);
}

/* ── Stretched link — invisible, covers the entire card ── */
.hpl-card-link {
    position        : absolute;
    inset           : 0;
    z-index         : 1;
    text-decoration : none;
}

/* ── Gradient overlay + two-column bottom bar ── */
/* z-index: 2 keeps this above the stretched .hpl-card-link (z-index: 1) */
.hpl-card-body {
    position       : absolute;
    bottom         : 0;
    left           : 0;
    right          : 0;
    z-index        : 2;
    padding        : 40px 18px 18px;
    background     : linear-gradient(
        to top,
        rgba(0, 0, 0, 0.90) 0%,
        rgba(0, 0, 0, 0.60) 55%,
        rgba(0, 0, 0, 0)    100%
    );
    display        : block;
}

/* ── Left: title + excerpt ── */
.hpl-card-content {
    min-width: 0;
    margin-bottom: 10px;
}

/* ── Title ── */
.hpl-title {
    font-family : "Poppins", sans-serif;
    font-size   : 14px;
    font-weight : 500;
    line-height : 17px;
    color       : #ffffff;
    margin      : 0 0 5px;
}

/* ── Excerpt — 2-line clamp ── */
.hpl-excerpt {
    font-family        : "Poppins", sans-serif;
    font-size          : 10px;
    font-weight        : 300;
    line-height        : 16px;
    color              : #ffffff;
    margin             : 0;
    display            : -webkit-box;
    -webkit-line-clamp : 2;
    line-clamp         : 2;
    -webkit-box-orient : vertical;
    overflow           : hidden;
}

/* ── Right: Listen On stacked column ── */
.hpl-listen-on {
    display        : flex;
    flex-direction : row;
    align-items    : center;
    gap            : 6px;
    float: right;
    clear: both;
}

.hpl-listen-label {
    font-family    : "Poppins", sans-serif;
    font-size      : 10px;
    font-weight    : 300;
    line-height    : 11px;
    letter-spacing : 1px;
    color          : #ffffff;
    white-space    : nowrap;
}

.hpl-platform-icons {
    display    : flex;
    align-items: center;
    gap        : 8px;
}

.hpl-platform-link {
    color          : rgba(255, 255, 255, 0.85);
    font-size      : 20px;
    line-height    : 1;
    display        : inline-flex;
    align-items    : center;
    text-decoration: none;
    transition     : color 200ms ease, transform 200ms ease;
}

.hpl-platform-link:hover,
.hpl-platform-link:focus {
    color          : #ed9732;
    transform      : scale(1.15);
    text-decoration: none;
}

/* ── Responsive ── */
/* Tablet (768-1023px): 2 columns; lone last card centered */
@media (min-width: 768px) and (max-width: 1023px) {
    .hpl-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }

    /*
     * When the last card is at an odd grid position it is alone in its row.
     * Span both columns and shrink to one-column width so it appears centered.
     * gap=20px → one column = calc(50% - 10px)
     *
     * 1 card  → position 1 (odd) → centered       ✓
     * 2 cards → position 2 (even) → normal pair    ✓
     * 3 cards → position 3 (odd) → centered        ✓
     * 4 cards → position 4 (even) → normal pair    ✓
     */
    .hpl-card:last-child:nth-child(odd) {
        grid-column  : 1 / -1;
        justify-self : center;
        width        : calc(50% - 10px);
    }
}

/* Mobile (<768px): 1 column */
@media (max-width: 767px) {
    .hpl-grid  { grid-template-columns: 1fr; gap: 16px; }
    .hpl-title { font-size: 16px; }
}

/* ==========================================================================
   Indianness 100 Listing  [home-indianness-100-listing]
   ========================================================================== */

.i100-grid {
    display        : flex;
    flex-direction : column;
    gap            : 24px;
}

/* Row default: wide-left (3fr) / narrow-right (2fr) */
.i100-row {
    display               : grid;
    grid-template-columns : 3fr 2fr;
    gap                   : 24px;
}

/* Row alt: narrow-left (2fr) / wide-right (3fr) */
.i100-row--alt {
    grid-template-columns : 2fr 3fr;
}

/* ── Card shell ── */
.i100-card {
    border-radius : 12px;
    overflow      : hidden;
    border        : 2px solid transparent;
    transition    : border-color 300ms ease, box-shadow 300ms ease;
}

.i100-card:hover {
    border-color : #ed9732;
    box-shadow   : 0 8px 32px rgba(0, 0, 0, 0.25);
}

/* ── Card inner — full-cover bg image ── */
.i100-inner {
    display             : block;
    height              : 340px;
    background-size     : cover;
    background-position : center top;
    background-repeat   : no-repeat;
    background-color    : #1a1a1a;
    position            : relative;
    overflow            : hidden;
    transition          : transform 400ms ease;
}

/* Subtle zoom on hover, clipped by card's overflow:hidden */
.i100-card:hover .i100-inner {
    transform : scale(1.04);
}

/* ── Stretched link — covers full card, z-index below body ── */
.i100-link {
    position        : absolute;
    inset           : 0;
    z-index         : 1;
    text-decoration : none;
}

/* ── Gradient overlay + two-column bottom bar ── */
.i100-body {
    position        : absolute;
    bottom          : 0;
    left            : 0;
    right           : 0;
    z-index         : 2;
    padding         : 60px 20px 20px;
    background      : linear-gradient(
        to top,
        rgba(0, 0, 0, 0.88) 0%,
        rgba(0, 0, 0, 0.55) 55%,
        rgba(0, 0, 0, 0)    100%
    );
    display         : flex;
    align-items     : flex-end;
    justify-content : space-between;
    gap             : 16px;
}

/* ── Left: title + excerpt ── */
.i100-content {
    flex      : 1;
    min-width : 0;
}

.i100-title {
    font-family : "Poppins", sans-serif;
    font-size   : 14px;
    font-weight : 500;
    line-height : 17px;
    color       : #ffffff;
    margin      : 0 0 6px;
}

.i100-excerpt {
    font-family        : "Poppins", sans-serif;
    font-size          : 10px;
    font-weight        : 300;
    line-height        : 16px;
    color              : #ffffff;
    margin             : 0;
    display            : -webkit-box;
    -webkit-line-clamp : 2;
    line-clamp         : 2;
    -webkit-box-orient : vertical;
    overflow           : hidden;
}

/* ── Right: Indianness 100 badge logo ── */
.i100-logo {
    flex-shrink : 0;
    height      : auto !important;
    width       : 50px;
    object-fit  : contain;
    display     : block;
}

/* ── Responsive ── */
@media (max-width: 1023px) {
    .i100-row,
    .i100-row--alt { grid-template-columns: 1fr 1fr; }
    .i100-inner    { height: 280px; }
    .i100-title    { font-size: 16px; }
}

@media (max-width: 767px) {
    .i100-row,
    .i100-row--alt { grid-template-columns: 1fr; }
    .i100-inner    { height: 240px; }
    .i100-title    { font-size: 15px; }
    .i100-logo     { height: 48px; }
}

/* ==========================================================================
   Community Voice List  [community-voice-list]
   ========================================================================== */

.cvl-wrapper {
    display               : grid;
    grid-template-columns : 5fr 12fr;
    gap                   : 32px;
    align-items           : stretch;   /* both columns equal height */
}

/* ── Left: thumbnail stack fills full column height ── */
.cvl-thumbs {
    display        : flex;
    flex-direction : column;
    gap            : 16px;
    height         : 100%;
}

/*
 * Thumbnails share the column height via flex-grow.
 * Inactive = flex-grow:1 (smaller), active = flex-grow:2 (taller).
 * Transition on flex-grow animates the size change smoothly.
 */
.cvl-thumb {
    flex-grow     : 1;
    flex-shrink   : 1;
    flex-basis    : 0;
    min-height    : 0;        /* allow shrinking below content size */
    padding       : 0;
    margin        : 0;
    background    : none;
    border        : 2px solid transparent;
    border-radius : 8px;
    overflow      : hidden;
    cursor        : pointer;
    transition    : flex-grow 350ms ease, border-color 300ms ease;
}

.cvl-thumb img {
    display          : block;
    width            : 100%;
    height           : 100%;
    object-fit       : cover;
    object-position  : 50% 25%;
    filter           : grayscale(100%);
    transition       : filter 300ms ease;
}

.cvl-thumb--active {
    flex-grow    : 2;         /* active thumbnail is 2× taller than inactive */
    border-color : #ed9732;
}

.cvl-thumb--active img {
    filter : grayscale(0%);
}

/* ── Right: quote panel ── */
.cvl-panel {
    background-color : #faf5f0;
    border-radius    : 8px;
    padding          : 40px 48px 120px;
    display          : flex;
    flex-direction   : column;
    position         : relative;
}

.cvl-open-quote {
    display       : block;
    width         : 64px;
    height        : auto;
    margin-bottom : 28px;
    filter        : brightness(0) invert(1) brightness(0.83) sepia(0.08);
}

.cvl-close-quote {
    display  : block;
    position : absolute;
    bottom   : 40px;
    right    : 48px;
    width    : 64px;
    height   : auto;
    filter   : brightness(0) invert(1) brightness(0.83) sepia(0.08);
}

/* ── Slides — hidden by default, active slides fade in ── */
.cvl-slide {
    display : none;
}

.cvl-slide--active {
    display        : flex;
    flex-direction : column;
    flex           : 1;
    animation      : cvlFadeIn 350ms ease forwards;
}

@keyframes cvlFadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0);    }
}

/* ── Quote text ── */
.cvl-text {
    font-family : "Cormorant Garamond", serif;
    font-size   : 48px;
    line-height : 58px;
    color       : #000000;
    font-weight : 300;
    font-style  : italic;
    margin      : 0 0 28px;
    flex        : 1;
}

.cvl-text p { margin: 0; }

/* ── Author block — absolute so it aligns with closing quote ── */
.cvl-author {
    position: absolute;
    bottom: -80px;
    left: 0;
    right: 0;
}

.cvl-name {
    font-family : "Poppins", sans-serif;
    font-size   : 28px;
    line-height : 34px;
    font-weight : 600;
    color       : #ed9732;
    margin      : 0 0 4px;
}

.cvl-name-link {
    color           : inherit;
    text-decoration : none;
}

.cvl-name-link:hover {
    text-decoration : none;
}

.cvl-designation {
    font-family : "Poppins", sans-serif;
    font-size   : 14px;
    line-height : 17px;
    font-weight : 400;
    color       : #000000;
    margin      : 0;
}

/* ── Responsive ── */
@media (max-width: 1023px) {
    .cvl-wrapper     { grid-template-columns: 1fr 2fr; gap: 24px; }
    .cvl-text        { font-size: 36px; line-height: 44px; }
    .cvl-name        { font-size: 22px; line-height: 28px; }
    .cvl-panel       { padding: 28px 32px 100px; }
    .cvl-close-quote { bottom: 28px; right: 32px; width: 52px; }
    .cvl-author      { bottom: -75px; left: 0; right: 0; }
}

@media (max-width: 767px) {
    .cvl-wrapper       { grid-template-columns: 1fr; }
    .cvl-thumbs        { flex-direction: row; height: auto; }
    .cvl-thumb         { flex-grow: 1; flex-basis: 0; }
    .cvl-thumb--active { flex-grow: 1; }
    .cvl-thumb img     { height: 120px !important; object-position: center; }
    .cvl-text          { font-size: 26px; line-height: 34px; }
    .cvl-name          { font-size: 18px; line-height: 24px; }
    .cvl-panel         { padding: 24px 20px 90px; }
    .cvl-open-quote    { width: 40px; }
    .cvl-close-quote   { width: 40px; bottom: 20px; right: 20px; }
    .cvl-author        { bottom: -75px; left: 0; right: 0; }
}


/* ==========================================================================
   Breadcrumb shortcode [breadcrumb]
   ========================================================================== */

.ind-breadcrumb {
    display     : flex;
    align-items : center;
    gap         : 16px;
}

.ind-breadcrumb__home,
.ind-breadcrumb__current {
    font-family    : 'Poppins', sans-serif;
    font-size      : 20px;
    letter-spacing : 1px;
    line-height    : 22px;
    text-transform : uppercase;
    color          : #f7831d;
    font-weight    : 600;
    text-decoration: none;
    display        : inline-block;
}

.ind-breadcrumb__home:hover {
    text-decoration : underline;
    color           : #f7831d;
}

.ind-breadcrumb__sep {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border: none;
    padding: 2px 8px;
    font-size: 40px;
    line-height: 18px;
    color: #ffffff;
}

/* ==========================================================================
   Essence of Indianness  [essence-of-indianness]
   ========================================================================== */

/* Outer wrapper stacks rows vertically */
.eoi-grid {
    display        : flex;
    flex-direction : column;
    gap            : 24px;
}

/* Each row is its own 3-column grid */
.eoi-row {
    display               : grid;
    grid-template-columns : repeat(3, 1fr);
    gap                   : 24px;
}

/*
 * Orphan rows (1 or 2 cards): use the same column width as in the full
 * 3-column row — calc(33.333% - 16px) = (100% - 2×24px) / 3 — so cards
 * stay identical in size, then justify-content centres them.
 */
.eoi-row--2 {
    grid-template-columns : repeat(2, calc(33.333% - 16px));
    justify-content       : center;
}

.eoi-row--1 {
    grid-template-columns : calc(33.333% - 16px);
    justify-content       : center;
}

.eoi-card {
    background-color : #214731;
    border-radius    : 10px;
    padding          : 32px;
}

.eoi-number {
    display      : block;
    opacity      : 0.278;
    font-family  : 'Poppins', sans-serif;
    font-size    : 30px;
    font-weight  : 300;
    color        : #ffffff;
    line-height  : 1;
    margin-bottom: 16px;
}

.eoi-title {
    font-family  : 'Cormorant Garamond', serif;
    font-size    : 30px;
    line-height  : 36px;
    color        : #ffffff;
    font-weight  : 300;
    margin       : 0 0 16px;
}

.eoi-divider {
    width            : 80px;
    height           : 2px;
    background-color : #ed9732;
    border-radius    : 8px;
    margin-bottom    : 20px;
    border           : none;
}

.eoi-content {
    font-family : 'Poppins', sans-serif;
    font-size   : 16px;
    color       : #ffffff;
    font-weight : 300;
    line-height : 1.6;
    margin      : 0;
}

.eoi-content p { margin: 0; }

/* ── Responsive ── */
@media (max-width: 1023px) {
    .eoi-row,
    .eoi-row--1,
    .eoi-row--2 { grid-template-columns: repeat(2, 1fr); justify-content: unset; }
}

@media (max-width: 767px) {
    .eoi-row,
    .eoi-row--1,
    .eoi-row--2 { grid-template-columns: 1fr; justify-content: unset; }
    .eoi-title  { font-size: 26px; }
}

/* ==========================================================================
   FAQ Listing  [faq-listing-shortcode]
   ========================================================================== */

/* ── Section wrapper ── */
.fls-section {
    padding : 80px 0;
}

/* ── Background / text colour variants ── */
.fls--light { background-color: #ffffff; color: #000000; }
.fls--dark  { background-color: #204731; color: #ffffff; }
.fls--cream { background-color: #faf5f0; color: #000000; }

/* Explicit overrides so theme h2/p rules can't win */
.fls--light .fls-cat-title,
.fls--cream .fls-cat-title { color: #000000; }
.fls--dark  .fls-cat-title { color: #ffffff; }

.fls--light .fls-question-text,
.fls--cream .fls-question-text { color: #000000; }
.fls--dark  .fls-question-text { color: #ffffff; }

.fls--light .fls-answer,
.fls--cream .fls-answer { color: #000000; }
.fls--dark  .fls-answer { color: #ffffff; }

/* ── Inner container ── */
.fls-inner {
    margin  : 0 auto;
    padding : 0 150px;
}

/* ── Category title ── */
.fls-cat-title {
    font-family : "Cormorant Garamond", serif;
    font-size   : 48px;
    line-height : 58px;
    font-weight : 300;
    text-align  : center;
    margin      : 0 0 40px;
}

/* ── Accordion wrapper ── */
.fls-accordion {
    display        : flex;
    flex-direction : column;
}

/* ── Single FAQ item ── */
.fls-item {
    border-top : 1px solid rgba(128, 128, 128, 0.25);
}

/* Remove top border from the very first item */
.fls-item:first-child {
    border-top : none;
}

.fls-item:last-child {
    border-bottom : 1px solid rgba(128, 128, 128, 0.25);
}

/* ── Question button ── */
.fls-accordion .fls-question {
    display         : flex;
    align-items     : center;
    justify-content : space-between;
    gap             : 24px;
    width           : 100%;
    padding         : 24px 0;
    background      : transparent;
    border          : none;
    border-radius   : 0;
    box-shadow      : none;
    outline         : none;
    cursor          : pointer;
    text-align      : left;
}

.fls-question-text {
    font-family : "Poppins", sans-serif;
    font-size   : 20px;
    font-weight : 600;
    line-height : 1.4;
}

/* ── Toggle icon (+/×) ── */
.fls-toggle {
    flex-shrink : 0;
    font-family : "Poppins", sans-serif;
    font-size   : 24px;
    font-weight : 400;
    line-height : 1;
    color       : #f7831d;
    user-select : none;
}

.fls-toggle::before {
    content : "+";
}

.fls-item--open .fls-toggle::before {
    content : "\00D7";
}

/* ── Answer / content — animated with max-height ── */
.fls-answer {
    max-height     : 0;
    overflow       : hidden;
    padding-bottom : 0;
    font-family    : "Poppins", sans-serif;
    font-size      : 18px;
    line-height    : 27px;
    font-weight    : 300;
    transition     : max-height 0.4s ease, padding-bottom 0.4s ease;
}

.fls-item--open .fls-answer {
    max-height     : 800px;
    padding-bottom : 24px;
}

.fls-answer p {
    margin : 0 0 16px;
}

.fls-answer p:last-child {
    margin-bottom : 0;
}

/* ── Responsive ── */
@media (max-width: 1200px) {
    .fls-inner { padding: 0 80px; }
}

@media (max-width: 767px) {
    .fls-section       { padding: 48px 0; }
    .fls-inner         { padding: 0 24px; }
    .fls-cat-title     { font-size: 32px; line-height: 40px; margin-bottom: 28px; }
    .fls-question-text { font-size: 17px; }
    .fls-answer        { font-size: 16px; line-height: 24px; }
}

@media (max-width: 480px) {
    .fls-cat-title         { font-size: 28px; line-height: 36px; }
    .fls-accordion .fls-question { padding: 18px 0; }
}

/* ==========================================================================
   Indianness Category List  [indianness-category-list]
   ========================================================================== */

/*
 * Flat CSS grid — no PHP row wrappers.
 * Orphan centering is handled entirely with nth-child selectors so it works
 * correctly at every breakpoint independently.
 */

/* ── Desktop: 3 columns ── */
.icl-grid {
    display               : grid;
    grid-template-columns : repeat(3, 1fr);
    gap                   : 24px;
}

/* Desktop: 1 orphan (count 1, 4, 7, 10 …) → center in column 2 */
.icl-grid > .icl-card:last-child:nth-child(3n + 1) {
    grid-column : 2;
}

.icl-card {
    display          : block;
    background-color : #214731;
    border-radius    : 10px;
    padding          : 32px;
    text-decoration  : none;
    transition       : box-shadow 300ms ease, transform 300ms ease;
}

.icl-card:hover {
    box-shadow      : 0 8px 32px rgba(0, 0, 0, 0.28);
    transform       : translateY(-3px);
    text-decoration : none;
}

/* Top row: icon+divider on left, number on right */
.icl-card-top {
    display         : flex;
    justify-content : space-between;
    align-items     : flex-start;
    margin-bottom   : 16px;
}

.icl-icon-wrap {
    display        : flex;
    flex-direction : column;
    gap            : 12px;
}

.icl-logo {
    height     : 52px;
    width      : auto;
    object-fit : contain;
    display    : block;
}

/* Orange border line below the icon */
.icl-divider {
    width         : 70px;
    height        : 0;
    border        : none;
    border-bottom : 2px solid #e8742c;
}

.icl-number {
    opacity     : 0.278;
    font-family : 'Poppins', sans-serif;
    font-size   : 30px;
    font-weight : 300;
    color       : #ffffff;
    line-height : 1;
    text-align  : right;
    flex-shrink : 0;
}

.icl-title {
    font-family : 'Cormorant Garamond', serif;
    font-size   : 30px;
    line-height : 36px;
    color       : #ffffff;
    font-weight : 300;
    margin      : 0;
}

/* ── Tablet: 2 columns (768px – 1023px) ── */
@media (min-width: 768px) and (max-width: 1023px) {
    .icl-grid {
        grid-template-columns : repeat(2, 1fr);
    }

    /* Reset desktop 1-orphan rule */
    .icl-grid > .icl-card:last-child:nth-child(3n + 1) {
        grid-column : auto;
    }

    /* Tablet: 1 orphan (count 1, 3, 5, 7 …) → span full row, center at 1-col width */
    .icl-grid > .icl-card:last-child:nth-child(odd) {
        grid-column  : 1 / -1;
        max-width    : calc(50% - 12px); /* = one column width in a 2-col/24px-gap grid */
        justify-self : center;
    }
}

/* ── Mobile: 1 column (≤ 767px) ── */
@media (max-width: 767px) {
    .icl-grid {
        grid-template-columns : 1fr;
    }

    /* Reset tablet centering */
    .icl-grid > .icl-card:last-child:nth-child(odd) {
        grid-column  : auto;
        max-width    : none;
        justify-self : auto;
    }

    .icl-title { font-size: 24px; }
}


/* ==========================================================================
   Current Edition Listing  [current-edition-listing]
   ========================================================================== */

.cel-section { width: 100%; }
.cel-wrapper  { position: relative; }

/* Slick equal-height flex chain (mirrors .fss-slider pattern) */
.cel-slider .slick-track       { display: flex !important; align-items: stretch !important; }
.cel-slider .slick-slide       { height: auto !important; float: none !important; display: flex !important; flex-direction: column !important; }
.cel-slider .slick-slide > div { flex: 1 1 auto; display: flex; flex-direction: column; }

/* Gutter: negative margin on slider + padding on each slide */
.cel-slider { margin: 0 -12px; }
.cel-slide  {
    padding        : 0 12px;
    display        : flex;
    flex-direction : column;
    flex           : 1 1 auto;
}

.cel-card {
    display        : flex;
    flex-direction : column;
    border-radius  : 12px;
    overflow       : hidden;
    text-decoration: none;
    height         : 100%;
    background     : #000000;
}

.cel-image-wrap {
    flex-shrink : 0;
    height      : 300px;
    overflow    : hidden;
    line-height : 0;
    font-size   : 0;
}

.cel-img {
    width      : 100% !important;
    height     : 100% !important;
    object-fit : cover;
    object-position: center top;
    display    : block;
    transition : transform 300ms ease;
}

.cel-card:hover .cel-img { transform: scale(1.04); }

.cel-body {
    position       : relative;
    background     : #000000;
    padding        : 20px 20px 40px;
    display        : flex;
    flex-direction : column;
    flex           : 1;
}

.cel-header {
    display         : flex;
    justify-content : space-between;
    align-items     : flex-start;
    gap             : 12px;
    margin-bottom   : 6px;
}

.cel-name {
    font-family : 'Poppins', sans-serif;
    font-size   : 20px;
    line-height : 24px;
    color       : #ed9732;
    font-weight : 600;
    margin      : 0;
}

.cel-badge {
    width       : 70px !important;
    max-width   : 70px !important;
    height      : auto !important;
    flex-shrink : 0;
    object-fit  : contain;
    display     : block;
}

.cel-subtitle {
    font-family : 'Poppins', sans-serif;
    font-size   : 14px;
    line-height : 17px;
    color       : #ffffff;
    font-weight : 300;
    margin      : 0 0 14px;
}

.cel-meta { margin: 0; display: flex; flex-direction: column; gap: 8px; }

.cel-meta-row {
    font-family : 'Poppins', sans-serif;
    font-size   : 14px;
    line-height : 20px;
    color       : #ffffff;
    font-weight : 600;
    margin      : 0;
}

.cel-arrow {
    position             : absolute;
    bottom               : 16px;
    right                : 16px;
    width                : 36px;
    height               : 36px;
    background-image     : url('../images/arrow_outward.png');
    background-repeat    : no-repeat;
    background-position  : center;
    background-size      : 20px 20px;
    border-radius        : 6px;
    font-size            : 0;
    color                : transparent;
    line-height          : 0;
    transition           : background-size 250ms ease, transform 250ms ease;
}

.cel-card:hover .cel-arrow {
    background-size : 26px 26px;
    transform       : scale(0.9);
}

/* Dots — same pill style as .fss-dots */
.cel-dots {
    display    : block;
    padding-top: 20px;
    text-align : center;
    overflow   : visible;
}

.cel-dots .slick-dots {
    position        : relative !important;
    bottom          : auto !important;
    display         : flex !important;
    list-style      : none !important;
    padding         : 0;
    margin          : 0 auto;
    justify-content : center;
    gap             : 8px;
    width           : auto;
}

.cel-dots .slick-dots li {
    display : inline-flex;
    margin  : 0;
    padding : 0;
    width   : auto;
    height  : auto;
}

.cel-dots .slick-dots li button {
    display       : block;
    width         : 40px;
    height        : 3px;
    background    : #cccccc;
    border        : none;
    border-radius : 2px;
    padding       : 0;
    font-size     : 0;
    cursor        : pointer;
    transition    : background 200ms ease, width 200ms ease;
}

.cel-dots .slick-dots li button::before { display: none !important; content: none !important; }

.cel-dots .slick-dots li.slick-active button {
    background : #214731;
    width      : 52px;
}

/* ── Responsive ── */
@media (min-width: 768px) and (max-width: 1023px) {
    .cel-image-wrap { height: 260px; }
}

@media (max-width: 767px) {
    .cel-image-wrap { height: 220px; }
    .cel-name       { font-size: 18px; }
}

/* ==========================================================================
   Podcast Featured Listing  [podcast-featured-listing]
   ========================================================================== */

.pfl-section { width: 100%; }
.pfl-wrapper { position: relative; }

.pfl-no-results {
    padding    : 40px 24px;
    text-align : center;
}
.pfl-no-results p {
    font-family : 'Poppins', sans-serif;
    font-size   : 16px;
    font-weight : 400;
    color       : rgba(255, 255, 255, 0.75);
    margin      : 0;
}

/* ── Slick row layout ───────────────────────────────────────────────────── */

/* Make cards in the same row equal height.
   NOTE: do NOT add flex: 1 to the children — Slick JS sets width: 50% on them
   which becomes the flex-basis (auto) for the 2-column layout. Adding flex: 1
   would set flex-basis: 0 and break the two-column rendering. */
.pfl-slider .slick-row {
    display       : flex;
    align-items   : stretch;
    margin-bottom : 28px;
}
.pfl-slider .slick-row:last-child { margin-bottom: 0; }

/* Slick's column wrapper — propagate height without overriding its width */
.pfl-slider .slick-row > div {
    display        : flex;
    flex-direction : column;
}

/* Column gutter — no negative margin (slick-list overflow:hidden clips it) */
.pfl-item {
    padding        : 0 12px;
    display        : flex;
    flex-direction : column;
    flex           : 1;
    margin-bottom  : 24px;
}

/* ── Card ───────────────────────────────────────────────────────────────── */
.pfl-card {
    display               : grid;
    grid-template-columns : 1fr 1fr;
    background            : #ffffff;
    border-radius         : 12px;
    overflow              : hidden;
    box-shadow            : 0 2px 12px rgba(0,0,0,0.08);
    transition            : box-shadow 250ms ease;
    flex                  : 1;
    height                : 400px;
}
.pfl-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,0.14); }

/* ── Left: image ────────────────────────────────────────────────────────── */
.pfl-image-wrap {
    overflow   : hidden;
    position   : relative;
    min-height : 300px;
}
.pfl-img {
    position        : absolute;
    top             : 0;
    left            : 0;
    width           : 100% !important;
    height          : 100% !important;
    object-fit      : cover;
    object-position : center top;
    display         : block;
    transition      : transform 300ms ease;
}
.pfl-card:hover .pfl-img { transform: scale(1.04); }

/* ── Right: content ─────────────────────────────────────────────────────── */
.pfl-content {
    padding        : 24px 28px;
    display        : flex;
    flex-direction : column;
}

.pfl-episode {
    font-family    : 'Poppins', sans-serif;
    font-size      : 14px;
    line-height    : 17px;
    color          : #39af4a;
    font-weight    : 500;
    margin         : 0 0 8px;
    text-transform : uppercase;
    letter-spacing : 0.5px;
}

.pfl-title {
    font-family        : 'Poppins', sans-serif;
    font-size          : 25px;
    line-height        : 30px;
    color              : #ed9732;
    font-weight        : 600;
    margin             : 0 0 15px;
    display            : -webkit-box;
    -webkit-line-clamp : 3;
    line-clamp         : 3;
    -webkit-box-orient : vertical;
    overflow           : hidden;
}

.pfl-subtitle {
    font-family : 'Poppins', sans-serif;
    font-size   : 14px;
    line-height : 20px;
    color       : #000000;
    font-weight : 300;
    margin      : 0;
}

.pfl-meta {
    display        : flex;
    flex-direction : column;
    gap            : 8px;
    margin-top     : 20px;
    margin-bottom  : 30px;
}

.pfl-meta-row {
    font-family : 'Poppins', sans-serif;
    font-size   : 14px;
    line-height : 17px;
    color       : #000000;
    font-weight : 600;
    margin      : 0;
}

/* Play button — full width, centered, pinned to bottom */
.pfl-play-btn {
    display         : flex;
    align-items     : center;
    justify-content : center;
    gap             : 14px;
    background      : #000000;
    border-radius   : 8px;
    padding         : 14px 20px;
    text-decoration : none;
    margin-top      : auto;
    width           : 100%;
    transition      : background 250ms ease;
}
.pfl-play-btn:hover { background: #222222; }

.pfl-play-icon {
    width      : 36px !important;
    height     : 36px !important;
    flex-shrink: 0;
    object-fit : contain;
    display    : block;
}

.pfl-play-btn span {
    font-family : 'Poppins', sans-serif;
    font-size   : 20px;
    line-height : 24px;
    color       : #ffffff;
    font-weight : 500;
}

/* ── Dots ───────────────────────────────────────────────────────────────── */
.pfl-dots {
    display    : block;
    padding-top: 28px;
    text-align : center;
    overflow   : visible;
}
.pfl-dots .slick-dots {
    position        : relative !important;
    bottom          : auto !important;
    display         : flex !important;
    list-style      : none !important;
    padding         : 0;
    margin          : 0 auto;
    justify-content : center;
    gap             : 8px;
    width           : auto;
}
.pfl-dots .slick-dots li {
    display : inline-flex;
    margin  : 0;
    padding : 0;
    width   : auto;
    height  : auto;
}
.pfl-dots .slick-dots li button {
    display       : block;
    width         : 40px;
    height        : 3px;
    background    : rgba(255, 255, 255, 0.35);
    border        : none;
    border-radius : 2px;
    padding       : 0;
    font-size     : 0;
    cursor        : pointer;
    transition    : background 200ms ease, width 200ms ease;
}
.pfl-dots .slick-dots li button::before { display: none !important; content: none !important; }
.pfl-dots .slick-dots li.slick-active button { background: #ffffff; width: 52px; }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1023px) {
    .pfl-card          { grid-template-columns: 1fr 1fr; min-height: 260px; }
    .pfl-image-wrap    { min-height: 240px; }
    .pfl-title         { font-size: 20px; line-height: 26px; }
    .pfl-play-btn span { font-size: 16px; }
}

@media (max-width: 767px) {
    .pfl-card          { grid-template-columns: 1fr; min-height: 0; }
    .pfl-image-wrap    { min-height: 240px; }
    .pfl-img           { position: relative; top: auto; left: auto; height: 240px !important; }
    .pfl-title         { font-size: 18px; line-height: 24px; }
    .pfl-play-btn span { font-size: 15px; }
}

/* ==========================================================================
   Article & Press Release Listing [article-press-release-listing]
   ========================================================================== */

/* ── Wrapper ── */
.aprl-wrapper {
    width: 100%;
}

.aprl-empty {
    font-family : "Poppins", sans-serif;
    font-size   : 16px;
    color       : #666666;
    text-align  : center;
    padding     : 40px 0;
    width       : 100%;
}

/* ── Tabs ── */
.aprl-tabs {
    display        : flex;
    border-bottom  : 1px solid rgba(0, 0, 0, 0.502);
    margin-bottom  : 48px;
}

.aprl-tab {
    flex           : 1;
    text-align     : center;
    padding        : 20px 40px;
    background     : transparent;
    border         : none;
    cursor         : pointer;
    position       : relative;
    font-family    : "Cormorant Garamond", serif;
    font-size      : 36px;
    line-height    : 1.2;
    font-weight    : 400;
    color          : #000000;
    transition     : color 200ms ease;
}

.aprl-tab--active {
    color : #000000;
}

.aprl-tab--active::after {
    content       : "";
    position      : absolute;
    bottom        : -2px;
    left          : 50%;
    width         : 50%;
    height        : 4px;
    background    : #f7831d;
    border-radius : 20px;
    transform     : translate(-50%, 0px);
}

/* ── Panels ── */
.aprl-panel {
    display : none;
}

.aprl-panel--active {
    display : block;
}

/* ── Grid ── */
.aprl-grid {
    display         : flex;
    flex-wrap       : wrap;
    justify-content : flex-start;
    gap             : 28px;
}

.aprl-grid--cols-2 .aprl-card {
    flex      : 0 0 calc(50% - 14px);
    max-width : calc(50% - 14px);
}

.aprl-grid--cols-3 .aprl-card {
    flex      : 0 0 calc(33.333% - 19px);
    max-width : calc(33.333% - 19px);
}

/* ── Card ── */
.aprl-card {
    display        : flex;
    flex-direction : column;
    margin-bottom  : 30px;
}

.aprl-card__image {
    width         : 100%;
    aspect-ratio  : 16 / 9;
    overflow      : hidden;
    border-radius : 12px;
    margin-bottom : 20px;
    flex-shrink   : 0;
}

.aprl-card__image img {
    width      : 100%;
    height     : 100%;
    object-fit : cover;
    display    : block;
    transition : transform 350ms ease;
}

.aprl-card:hover .aprl-card__image img {
    transform : scale(1.03);
}

.aprl-card__body {
    display        : flex;
    flex-direction : column;
    flex           : 1;
}

.aprl-card__title {
    margin      : 0 0 10px;
    padding     : 0;
    font-size   : 20px;
    font-weight : 600;
}

.aprl-card__title::after {
    display : none;
}

.aprl-card__title a {
    font-family     : "Poppins", sans-serif;
    font-size       : 20px;
    font-weight     : 600;
    color           : #000000;
    text-decoration : none;
    display         : block;
    line-height     : 1.4;
    transition      : color 200ms ease;
}

.aprl-card__title a:hover {
    color : #f7831d;
}

.aprl-card__divider {
    border-top   : 2px solid #214731;
    width        : 80px;
    margin       : 0 0 14px;
    flex-shrink  : 0;
}

.aprl-card__excerpt {
    font-family : "Poppins", sans-serif;
    font-size   : 18px;
    line-height : 27px;
    font-weight : 300;
    color       : #000000;
    margin      : 0 0 16px;
    flex        : 1;
}

.aprl-card__read-more {
    font-family     : "Poppins", sans-serif;
    font-size       : 12px;
    line-height     : 14px;
    font-weight     : 500;
    color           : #f7831d;
    text-decoration : none;
    display         : inline-flex;
    align-items     : center;
    gap             : 6px;
    margin-top      : auto;
    transition      : gap 200ms ease;
}

.aprl-card__read-more:hover {
    color : #e06d10;
    gap   : 10px;
}

/* ── Load More ── */
.aprl-load-more-wrap {
    text-align  : center;
    margin-top  : 48px;
    padding-top : 8px;
}

.aprl-load-more {
    display         : inline-flex;
    align-items     : center;
    gap             : 14px;
    background      : #f7831d;
    color           : #ffffff;
    font-family     : "Poppins", sans-serif;
    font-size       : 16px;
    font-weight     : 500;
    line-height     : 1;
    padding         : 16px 40px;
    border          : none;
    border-radius   : 8px;
    cursor          : pointer;
    transition      : background 250ms ease, transform 200ms ease, box-shadow 200ms ease;
}

.aprl-load-more::after {
    content   : "→";
    font-size : 18px;
}

.aprl-load-more:hover {
    background : #e06d10;
    transform  : translateY(-2px);
    box-shadow : 0 6px 20px rgba(247, 131, 29, 0.35);
}

.aprl-load-more:disabled {
    opacity    : 0.6;
    cursor     : not-allowed;
    transform  : none;
    box-shadow : none;
}

/* ── Responsive ─────────────────────────────────────────────────────────── */

/* Tablet: 768px – 1023px */
@media (max-width: 1023px) {
    .aprl-tab {
        font-size : 28px;
        padding   : 16px 24px;
    }

    /* 3-col drops to 2-col at tablet */
    .aprl-grid--cols-3 .aprl-card {
        flex      : 0 0 calc(50% - 14px);
        max-width : calc(50% - 14px);
    }
}

/* Mobile: ≤ 767px */
@media (max-width: 767px) {
    .aprl-tabs {
        margin-bottom : 32px;
    }

    .aprl-tab {
        font-size : 22px;
        padding   : 12px 16px;
    }

    .aprl-grid {
        gap : 24px;
    }

    /* All cards full width on mobile */
    .aprl-grid--cols-2 .aprl-card,
    .aprl-grid--cols-3 .aprl-card {
        flex      : 0 0 100%;
        max-width : 100%;
    }

    .aprl-load-more {
        width            : 100%;
        justify-content  : center;
    }
}

/* ================================================================
   ALL PODCAST LISTING WITH FILTER & PAGINATION  (.apfl-*)
   ================================================================ */

/* Filter bar */
.apfl-filter-bar {
    background    : #214731;
    padding       : 28px 40px;
    margin-bottom : 48px;
    border-radius : 8px;
}

.apfl-filter-bar__inner {
    display     : flex;
    align-items : center;
    gap         : 16px;
}

/* Search input */
.apfl-search {
    flex          : 1;
    height        : 52px;
    border        : none;
    border-radius : 6px;
    padding       : 0 20px;
    font          : 400 15px/1 "Poppins", sans-serif;
    color         : #444;
    background    : #f5ede0;
    outline       : none;
    box-shadow    : none;
}

.apfl-search::placeholder { color: #999; }

/* Category select */
.apfl-select-wrap {
    position : relative;
    flex     : 0 0 220px;
}

.apfl-category {
    width              : 100%;
    height             : 52px;
    border             : none;
    border-radius      : 6px;
    padding            : 0 40px 0 20px;
    font               : 400 15px/1 "Poppins", sans-serif;
    color              : #444;
    background         : #f5ede0;
    appearance         : none;
    -webkit-appearance : none;
    cursor             : pointer;
    outline            : none;
}

/* Chevron arrow on select */
.apfl-select-wrap::after {
    content          : "";
    position         : absolute;
    right            : 14px;
    top              : 50%;
    transform        : translateY(-50%);
    pointer-events   : none;
    width            : 12px;
    height           : 7px;
    background-color : #555;
    -webkit-mask     : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain;
    mask             : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Submit button */
.apfl-submit-btn {
    display        : inline-flex;
    align-items    : center;
    gap            : 10px;
    height         : 52px;
    padding        : 0 32px;
    border         : none;
    border-radius  : 5px;
    background     : #ed9732;
    color          : #fff;
    cursor         : pointer;
    font           : 500 16px/1 "Poppins", sans-serif;
    white-space    : nowrap;
    letter-spacing : 0.5px;
    transition     : transform 250ms ease, box-shadow 250ms ease;
}

.apfl-submit-btn__text::after {
    content          : "";
    display          : inline-block;
    width            : 40px;
    height           : 16px;
    margin-left      : 10px;
    background-color : currentColor;
    vertical-align   : middle;
    -webkit-mask     : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='1' y1='8' x2='42' y2='8'/%3E%3Cpolyline points='34 1 42 8 34 15'/%3E%3C/svg%3E") no-repeat center / contain;
    mask             : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='1' y1='8' x2='42' y2='8'/%3E%3Cpolyline points='34 1 42 8 34 15'/%3E%3C/svg%3E") no-repeat center / contain;
}

.apfl-submit-btn:hover {
    transform  : translateY(-3px);
    box-shadow : 0 8px 24px rgba(0, 0, 0, 0.22);
}

/* ── Card grid ── */
.apfl-grid {
    display               : grid;
    grid-template-columns : repeat(2, 1fr);
    gap                   : 32px;
    margin-bottom         : 40px;
    padding               : 0 40px;
    transition            : opacity 200ms ease;
}

.apfl-card {
    text-decoration : none;
    color           : inherit;
    display         : flex;
    flex-direction  : column;
}

.apfl-card__image {
    border-radius : 16px;
    overflow      : hidden;
    margin-bottom : 14px;
}

.apfl-card__image img {
    width        : 100%;
    height       : 260px;
    object-fit   : cover;
    object-position : center;
    display      : block;
    transition   : transform 300ms ease;
}

.apfl-card:hover .apfl-card__image img {
    transform : scale(1.04);
}

.apfl-card__image-placeholder {
    width      : 100%;
    height     : 260px;
    background : #d8d0c7;
    display    : block;
}

.apfl-card__date {
    font          : 500 14px/1 "Poppins", sans-serif;
    color         : #ed9732;
    margin-bottom : 8px;
    display       : block;
}

.apfl-card__title {
    font   : 600 18px/26px "Poppins", sans-serif;
    color  : #111;
    margin : 0;
}

/* No results message */
.apfl-no-results {
    grid-column : 1 / -1;
    padding     : 48px;
    text-align  : center;
    font        : 300 16px/24px "Poppins", sans-serif;
    color       : #747787;
}

/* ── Load More ── */
.apfl-load-more-wrap {
    text-align     : center;
    margin-top     : 8px;
    padding        : 0 40px 20px;
}

.apfl-load-more {
    display        : inline-flex;
    align-items    : center;
    gap            : 10px;
    height         : 52px;
    padding        : 0 36px;
    border         : none;
    border-radius  : 5px;
    background     : #ed9732;
    color          : #fff;
    cursor         : pointer;
    font           : 500 16px/1 "Poppins", sans-serif;
    white-space    : nowrap;
    letter-spacing : 0.5px;
    transition     : transform 250ms ease, box-shadow 250ms ease;
}

.apfl-load-more::after {
    content          : "";
    display          : inline-block;
    width            : 40px;
    height           : 16px;
    background-color : currentColor;
    vertical-align   : middle;
    -webkit-mask     : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='1' y1='8' x2='42' y2='8'/%3E%3Cpolyline points='34 1 42 8 34 15'/%3E%3C/svg%3E") no-repeat center / contain;
    mask             : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='1' y1='8' x2='42' y2='8'/%3E%3Cpolyline points='34 1 42 8 34 15'/%3E%3C/svg%3E") no-repeat center / contain;
}

.apfl-load-more:hover {
    transform  : translateY(-3px);
    box-shadow : 0 8px 24px rgba(0, 0, 0, 0.22);
}

/* ── Responsive ── */
@media (max-width: 1023px) {
    .apfl-filter-bar {
        padding : 24px 28px;
    }

    .apfl-grid {
        padding : 0 28px;
    }

    .apfl-load-more-wrap {
        padding : 0 28px 20px;
    }
}

@media (max-width: 767px) {
    .apfl-filter-bar {
        padding : 20px;
    }

    .apfl-filter-bar__inner {
        flex-direction : column;
        align-items    : stretch;
    }

    .apfl-select-wrap {
        flex : none;
    }

    .apfl-submit-btn {
        width           : 100%;
        justify-content : center;
    }

    .apfl-grid {
        grid-template-columns : 1fr;
        gap                   : 24px;
        padding               : 0 20px;
    }

    .apfl-load-more-wrap {
        padding : 0 20px 20px;
    }

    .apfl-card__image img,
    .apfl-card__image-placeholder {
        height : 220px;
    }

    .apfl-load-more {
        width           : 100%;
        justify-content : center;
    }
}


/* ================================================================
   OUR TEAM LISTING  (.otl-*)
   ================================================================ */

/* ── Backgrounds ── */
.otl-section--white { background : #ffffff; }
.otl-section--warm  { background : #faf5f0; }
.otl-section--green { background : #214731; }

/* ── Section padding ── */
.otl-section { padding : 100px; }

/* ── Two-column layout ── */
.otl-inner {
    display               : grid;
    grid-template-columns : 1fr 1fr;
    gap                   : 60px;
    align-items           : start;
}

/* Flip — image moves to right column */
.otl-section--flip .otl-image   { order : 2; }
.otl-section--flip .otl-content { order : 1; }

/* ── Image — fixed 500px, fills column ── */


.otl-image img {
    width            : 100%;
    height           : auto !important;
    object-fit       : cover;
    object-position  : center;
    border-radius    : 15px !important;
    display          : block;
}

.otl-image-placeholder {
    width         : 100%;
    height        : 100%;
    background    : #d8d0c7;
    border-radius : 15px;
}

/* ── Content column — same 500px height, clips overflow with fade ── */
.otl-content {
    display        : flex;
    flex-direction : column;
    height         : auto;
}

.otl-content-inner {
    min-height : 0;
    overflow   : hidden;
    position   : relative;
}

/* Gradient fade — colour matches each section bg */

/* Footer — Read More button sits outside the clipped area */
.otl-content-footer {
    flex       : 0 0 auto;
    padding-top: 20px;
}

/* ── Typography ── */
.otl-title {
    font   : 300 48px/58px "Cormorant Garamond", serif;
    color  : #000000;
    margin : 0 0 12px;
}

.otl-designation {
    font           : 500 12px/14px "Poppins", sans-serif;
    color          : #f7831d;
    margin         : 0 0 16px;
    text-transform : uppercase;
    letter-spacing : 0.5px;
}

hr:not([size]) {
    height : 10px !important;
}

.otl-divider {
    height     : 0 !important;
    border     : none;
    border-top : 2px solid #39af4a;
    width      : 80px;
    margin     : 0 0 28px;
    opacity    : 1;
}

.otl-description {
    font        : 300 16px/24px "Poppins", sans-serif;
    color       : #140000;
}

.otl-description.entry-content p {
    font-size   : 16px;
    line-height : 26px;
}

.otl-description p { margin : 0 0 16px; }

/* Dark-green section — invert text to white */
.otl-section--green .otl-title       { color : #ffffff; }
.otl-section--green .otl-description { color : #ffffff; }
.otl-section--green .otl-description.entry-content p { color : #ffffff; }

/* ── Read More button ── */
.otl-read-more {
    display     : inline-flex;
    align-items : center;
    gap         : 8px;
    padding     : 12px 28px;
    background  : #ed9732;
    color       : #fff;
    border      : none;
    border-radius : 5px;
    font        : 500 15px/1 "Poppins", sans-serif;
    cursor      : pointer;
    transition  : transform 250ms ease, box-shadow 250ms ease;
}
.otl-read-more:hover {
    transform  : translateY(-2px);
    box-shadow : 0 6px 20px rgba(0, 0, 0, 0.20);
}

/* ── Popup modal ── */
.otl-modal {
    display         : none;
    position        : fixed;
    inset           : 0;
    z-index         : 99999;
    align-items     : center;
    justify-content : center;
}
.otl-modal.is-open { display : flex; }

.otl-modal__overlay {
    position   : absolute;
    inset      : 0;
    background : rgba(0, 0, 0, 0.55);
}

.otl-modal__box {
    position   : relative;
    z-index    : 1;
    background : #ffffff;
    border-radius : 12px;
    max-width  : 720px;
    width      : calc(100% - 48px);
    max-height : 82vh;
    overflow-y : auto;
    padding    : 48px;
}

.otl-modal__close {
    position    : absolute;
    top         : 14px;
    right       : 18px;
    background  : none;
    border      : none;
    font-size   : 30px;
    line-height : 1;
    cursor      : pointer;
    color       : #333;
    padding     : 0;
}
.otl-modal__close:hover { color : #000; }

.otl-modal__body .otl-title {
    font   : 300 36px/44px "Cormorant Garamond", serif;
    color  : #000;
    margin : 0 0 10px;
}

.otl-modal__body .otl-designation {
    font           : 500 12px/14px "Poppins", sans-serif;
    color          : #f7831d;
    text-transform : uppercase;
    letter-spacing : 0.5px;
    margin         : 0 0 16px;
}

.otl-modal__body .otl-divider {
    width   : 80px;
    margin  : 0;
}

.otl-modal__body .otl-description {
    font  : 300 16px/24px "Poppins", sans-serif;
    color : #140000;
}

/* ── Responsive ── */
@media (max-width: 1023px) {
    .otl-section { padding : 80px; }
    .otl-inner   { gap    : 48px; }


    .otl-content         { height : 400px; }

    .otl-title { font-size : 40px; line-height : 50px; }

    .otl-modal__box { padding : 36px; }
}

@media (max-width: 767px) {
    .otl-section { padding : 20px; }

    .otl-inner {
        grid-template-columns : 1fr;
        gap                   : 28px;
    }

    /* Reset flip on mobile — always image top, content below */
    .otl-section--flip .otl-image,
    .otl-section--flip .otl-content { order : 0; }

    /* On mobile: content flows naturally — no fixed height, no clip */

    .otl-content { height : auto; }
    .otl-content-inner { overflow : visible; }

    .otl-title { font-size : 36px; line-height : 44px; }

    .otl-modal__box { padding : 28px 20px; width : calc(100% - 24px); }
    .otl-modal__body .otl-title { font-size : 28px; line-height : 36px; }
}


/* ================================================================
   INDIANNESS 100 — CATEGORY TAXONOMY PAGE  (.i100-tax-*)
   ================================================================ */

.i100-tax-page { padding: 0; }

/* ── Header ── */
.i100-tax-header {
    background  : #214731;
    padding     : 60px 40px;
    text-align  : center;
}

.i100-tax-header__inner { max-width: 800px; margin: 0 auto; }

.i100-tax-header__badge {
    width      : 80px;
    height     : auto;
    display    : block;
    margin     : 0 auto 20px;
    object-fit : contain;
}

.i100-tax-header__title {
    font        : 300 56px/64px "Cormorant Garamond", serif;
    color       : #ffffff;
    margin      : 0 0 16px;
}

.i100-tax-header__desc {
    font   : 300 16px/26px "Poppins", sans-serif;
    color  : rgba(255,255,255,0.8);
    margin : 0;
}

/* ── Grid wrap ── */
.i100-tax-wrap {
    max-width : 1280px;
    margin    : 0 auto;
    padding   : 60px 40px 80px;
}

/* ── 3-column card grid ── */
.i100-tax-grid {
    display               : grid;
    grid-template-columns : repeat(3, 1fr);
    gap                   : 28px;
    margin-bottom         : 48px;
}

/* card is already styled by .cel-card — just ensure it's a block-level grid child */
.i100-tax-card { display: flex; }

.i100-tax-none {
    grid-column : 1 / -1;
    text-align  : center;
    font        : 300 16px/24px "Poppins", sans-serif;
    color       : #747787;
    padding     : 60px 0;
}

/* ── Load More ── */
.i100-tax-load-wrap {
    text-align : center;
    margin-top : 8px;
}

.i100-tax-load-wrap .homepage-header-buttons {
    min-width : 200px;
}

/* ── Responsive ── */
@media (max-width: 1023px) {
    .i100-tax-header  { padding: 48px 28px; }
    .i100-tax-wrap    { padding: 48px 28px 60px; }
    .i100-tax-grid    { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .i100-tax-header__title { font-size: 44px; line-height: 52px; }
}

@media (max-width: 767px) {
    .i100-tax-header  { padding: 36px 20px; }
    .i100-tax-wrap    { padding: 32px 20px 48px; }
    .i100-tax-grid    { grid-template-columns: 1fr; gap: 20px; }
    .i100-tax-header__title { font-size: 36px; line-height: 44px; }
}


/* ================================================================
   STORY LISTINGS  (.sl-*)
   ================================================================ */

/* ── 2-column grid ── */
.sl-wrapper { width: 100%; }

.sl-grid {
    display               : grid;
    grid-template-columns : repeat(2, 1fr);
    gap                   : 32px;
    margin-bottom         : 48px;
}

/* ── Card ── */
.sl-card {
    display        : flex;
    flex-direction : column;
    text-decoration: none;
    color          : inherit;
}

.sl-card__image {
    border-radius : 16px;
    overflow      : hidden;
    margin-bottom : 16px;
    background    : #ece8e2;
}

.sl-card__image img {
    width      : 100%;
    height     : 100%;
    object-fit : cover;
    display    : block;
    transition : transform 300ms ease;
}

.sl-card:hover .sl-card__image img { transform: scale(1.04); }

.sl-card__image-placeholder {
    width      : 100%;
    height     : 100%;
    background : #ddd8d0;
}

.sl-card__title {
    font        : 600 20px/28px "Poppins", sans-serif;
    color       : #111111;
    margin      : 0;
    transition  : color 200ms ease;
}

.sl-card:hover .sl-card__title { color: #214731; }

/* ── Load More button — styled as head-section-btn ── */
.sl-load-more-wrap {
    text-align  : center;
    padding-top : 8px;
}

.sl-load-more.head-section-btn {
    display         : inline-flex;
    align-items     : center;
    gap             : 12px;
    padding         : 16px 36px;
    background      : #ed9732;
    color           : #ffffff;
    border          : none;
    border-radius   : 5px;
    font            : 500 16px/1 "Poppins", sans-serif;
    cursor          : pointer;
    white-space     : nowrap;
    text-decoration : none;
    transition      : transform 250ms ease, box-shadow 250ms ease, filter 250ms ease;
}

.sl-load-more.head-section-btn::after {
    content          : "";
    display          : inline-block;
    width            : 40px;
    height           : 16px;
    background-color : currentColor;
    flex-shrink      : 0;
    transition       : transform 250ms ease;
    -webkit-mask     : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='1' y1='8' x2='42' y2='8'/%3E%3Cpolyline points='34 1 42 8 34 15'/%3E%3C/svg%3E") no-repeat center / contain;
            mask     : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='1' y1='8' x2='42' y2='8'/%3E%3Cpolyline points='34 1 42 8 34 15'/%3E%3C/svg%3E") no-repeat center / contain;
}

.sl-load-more.head-section-btn:hover {
    transform  : translateY(-3px);
    box-shadow : 0 8px 24px rgba(0, 0, 0, 0.22);
    filter     : brightness(0.92);
}

.sl-load-more.head-section-btn:hover::after { transform: translateX(5px); }

.sl-load-more.head-section-btn:disabled {
    opacity : 0.65;
    cursor  : not-allowed;
    transform: none;
    box-shadow: none;
}

/* ── Responsive ── */
@media (max-width: 767px) {
    .sl-grid  { grid-template-columns: 1fr; gap: 24px; }
    .sl-load-more.head-section-btn { width: 100%; justify-content: center; }
}

/* ==========================================================================
   Homepage — Mobile overrides (≤767px)
   ========================================================================== */
@media (max-width: 767px) {

    .head-section-btn a {
        font-size: 18px !important;
    }

    .what-is-indianness-section-parent {
        height: 85vh !important;
    }

    div#home-our-podcast-guest {
        height: 85vh !important;
    }

    .hpl-title {
        line-height: 22px;
    }

    p.e-58c26c8-fd63f8a.e-paragraph-base {
        font-size: 32px;
        line-height: 42px;
    }

    .home-global-indian {
        font-size: 42px;
        line-height: 42px;
    }

    h2.e-b96fa53-288b05e.e-heading-base {
        font-size: 42px;
        line-height: 48px;
    }

    .elementor-element.elementor-element-95fb7c7.e-con.e-atomic-element.e-div-block-base.e-95fb7c7-6c013b7 {
        padding: 40px 20px;
    }

    h2.e-a268a0e-e7bab52.e-heading-base {
        font-size: 38px;
        line-height: 42px;
    }

    p.e-e18431e-ead6bd7.e-paragraph-base {
        width: 100%;
    }

    .home-indianness-stories {
        display: block !important;
    }

    .e-div-block-base.e-95fb7c7-6c013b7 .home-indianness-stories div {
        margin-bottom: 20px !important;
        width: 100% !important;
        height: 50vh !important;
        clip-path: none !important;
        border-radius: 20px !important;
    }

    .e-div-block-base.e-a73b4b6-c9f4613 {
        padding: 20px !important;
    }

    .e-div-block-base.e-0d462f4-094d4a4 {
        left: 0 !important;
    }

    .e-76029ef-62aa889 {
        padding: 20px !important;
    }

    h2.e-5983354-d993864.e-heading-base {
        font-size: 32px !important;
        line-height: 42px !important;
    }

    h2.e-5983354-d993864.e-heading-base, p.e-e3ff9ab-903b1fe.e-paragraph-base {
        font-size: 36px;
        line-height: 42px;
    }

    .e-236c17f-b6b392b div {
        width: 100% !important;
    }
}

/* Homepage — Tablet-mobile range overrides (550px–767px) */
@media (min-width: 550px) and (max-width: 767px) {

    .hpl-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .what-is-indianness-section-parent {
        height: 80vh !important;
    }

    .i100-row, .i100-row--alt {
        grid-template-columns: 3fr 2fr;
    }

    .home-indianness-stories {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
    }

    div#home-our-podcast-guest {
        height: 60vh !important;
    }
}

/* Homepage — narrow desktop overrides (1024px–1100px) */
@media (min-width: 1024px) and (max-width: 1100px) {

    .elementor .e-87ff0d4-4a37b66 {
        width: 80% !important;
    }
}

/* Homepage — medium desktop overrides (1024px–1200px) */
@media (min-width: 1024px) and (max-width: 1200px) {

    .elementor .e-8c6c62c-ba7f77f {
        padding-bottom: 0 !important;
    }

    span.elementor-button-content-wrapper span.elementor-button-text {
        font-size: 24px !important;
        line-height: 32px !important;
    }
}

/* Homepage — large desktop overrides (1200px–1300px) */
@media (min-width: 1200px) and (max-width: 1300px) {

    .elementor .e-e36a2e6-9b892e2 {
        padding-top: 40vh !important;
    }

    .elementor .e-8c6c62c-ba7f77f {
        padding-bottom: 0 !important;
    }
}

/* Homepage — large desktop overrides (1300px–1399px) */
@media (min-width: 1300px) and (max-width: 1399px) {

    .elementor .e-e36a2e6-9b892e2 {
        padding-top: 30vh !important;
    }

    .elementor .e-8c6c62c-ba7f77f {
        padding-bottom: 0 !important;
    }
}

/* Homepage — extra-large desktop overrides (1400px–1900px) */
@media (min-width: 1400px) and (max-width: 1900px) {

    .elementor .e-e36a2e6-9b892e2 {
        padding-top: 40vh !important;
    }
}

/* Homepage — ultra-wide desktop overrides (1920px+) */
@media (min-width: 1920px) {

    .elementor .e-e36a2e6-9b892e2 {
        padding-top: 10vh !important;
    }
}

/* Homepage — iPad portrait (768px × 1024px) */
@media (min-width: 760px) and (max-width: 820px) and (min-height: 900px) {

    .elementor .e-390bf72-bfe0aaf {
        height: 45vh !important;
    }

    .elementor .e-af27c97-cc801c6 {
        height: 70vh !important;
    }

    .elementor .e-e36a2e6-9b892e2 {
        padding-block-start: 10vh !important;
    }

    .elementor .e-29e3cb4-17c2768 {
        height: 70vh !important;
    }

    .elementor .what-is-indianness-section-parent {
        height: 55vh !important;
    }

    .elementor .e-a73b4b6-c9f4613 {
        height: 70vh !important;
    }

    .elementor .e-8804073-8e79289 {
        height: 100vh !important;
    }

    .elementor .e-52c735c-051f0f0 {
        height: 55vh !important;
    }

    .elementor .e-ef62970-d40a2b3 {
        padding: 0 !important;
    }

    .elementor .e-e6e4322-85800f3 {
        height: 50vh !important;
    }

    .elementor .e-2f7ed9b-db22134 {
        height: 50vh !important;
        min-height: 50vh !important;
    }

    .elementor .e-4bb45e9-f8c71ab {
        height: 50vh !important;
    }

    .elementor .e-a126040-07dc1e4 {
        height: 100vh !important;
    }

    .elementor .e-ca7bbb5-1535497 {
        height: 40vh !important;
    }
}

@media (min-width: 760px) and (max-width: 820px) and (min-height: 1024px) {
    .elementor .e-2f7ed9b-db22134 {
        height: 50vh !important;
        min-height: 50vh !important;
    }
}
