/* =========================
   FILE: style.css
========================= */

/*
Theme Name: Master Theme
Author: Venture Solutions
Version: 3.0
*/

/* ==========================================================================
   TABLE OF CONTENTS
   ==========================================================================
   1.  Root Variables
   2.  Reset & Base
   3.  Layout — Section & Row Containers
   4.  Responsive Hide Utilities
   5.  Full Width Image
   6.  Tables (TablePress)
   7.  Banner / Hero
   8.  Breadcrumbs
   9.  Contact Page
  10.  Gravity Forms
  11.  Section Themes — Light & Dark
        11a. Typography (h2, h3, h4, text-area, lists, links)
        11b. Accordions
        11c. Link Buttons
        11d. Profile Cards (main)
        11e. Profile Cards (side)
        11f. Related Cards (main)
        11g. Related Cards (side)
  12.  Grid Wrappers
        12a. Profile Wrappers
        12b. Related Wrappers
        12c. Links Containers
  13.  Gallery
  14.  Scroll Animations
  15.  Blog Single
  16.  Faculty & Staff
   ========================================================================== */


/* ==========================================================================
   1. ROOT VARIABLES
   ========================================================================== */
:root {

  /* ── School Brand Palette ─────────────────────────────────────────────── */
  --color-red:          #cc3631;   /* Primary red — CTA, accents, headings  */
  --color-red-dark:     #a82b28;   /* Hover/emphasis on red                  */
  --color-navy:         #1F3A89;   /* Dark blue — banner, footer, dark text  */
  --color-navy-dark:    #162d6e;   /* Deeper navy for hover states           */
  --color-blue:         #2D8ADE;   /* Mid blue — links, highlights           */
  --color-blue-dark:    #1e6cb5;   /* Deeper blue for hover states           */
  --color-bg-light:     #EDF4FB;   /* Very light blue — section backgrounds  */
  --color-yellow:       #FFD57D;   /* Warm yellow — accent / h2 highlights   */
  --color-white:        #ffffff;
  --color-text-dark:    #111827;
  --color-dark: #1a1a2e;
  --color-cream: #F5F5EC;

  /* ── Legacy aliases (kept so existing selectors still resolve) ────────── */
  --color-primary:          var(--color-navy);
  --color-primary-alt:      var(--color-blue);
  --color-accent:           var(--color-red);
  --color-accent-dark:      var(--color-red-dark);
  --color-success:          #4caf6b;
  --color-brand-dark:       var(--color-navy);
  --color-brand-navy:       var(--color-navy);
  --color-brand-navy-alt:   var(--color-navy);
  --color-brand-hover:      var(--color-navy-dark);
  --color-link-blue:        var(--color-blue);
  --color-highlight-yellow: var(--color-yellow);
  --color-overlay-dark:     rgba(17, 24, 39, 0.65);
  --color-overlay-blue:     rgba(31, 58, 137, 0.72);
  --color-overlay-white:    rgba(255, 255, 255, 0.55);

  /* ── Section Backgrounds ──────────────────────────────────────────────── */
  --bg-light:               #ffffff;
  --bg-dark:                var(--color-navy);
  --bg-breadcrumb:          var(--color-navy);
  --bg-form-input:          #f0f4f8;
  --bg-card-dark:           #162d6e;
  --bg-card-dark-alt:       #1a3378;
  --bg-card-hover-dark:     #1e3d94;

  /* ── Greyscale ────────────────────────────────────────────────────────── */
  --grey-900: #1e1e1e;
  --grey-800: #2b2b2b;
  --grey-700: #444444;
  --grey-600: #666666;
  --grey-500: #888888;
  --grey-400: #aaaaaa;
  --grey-300: #cccccc;
  --grey-200: #e0e0e0;
  --grey-100: #f4f4f4;
  --grey-50:  #fafafa;

  /* ── Semantic Text ────────────────────────────────────────────────────── */
  --text-body-light:        #1a2340;
  --text-body-dark:         #eaf1fb;
  --text-secondary-light:   #3d4f6e;
  --text-secondary-dark:    #b8cce4;
  --text-muted-dark:        #8aaace;

  /* ── Typography ───────────────────────────────────────────────────────── */
  --font-primary:   'Inter', sans-serif;
  --font-heading:   'Poppins', sans-serif;

  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  --leading-loose:    1.7;
  --leading-standard: 1.5;
  --leading-fine:     1.3;
  --leading-flat:     1.1;
  --leading-tight:    1;

  /* ── Fluid Type Scale (reduced from original) ─────────────────────────── */
  --step--2: clamp(0.70rem, 0.68rem + 0.1vw,  0.78rem);
  --step--1: clamp(0.83rem, 0.80rem + 0.1vw,  0.90rem);
  --step-0:  clamp(0.95rem, 0.90rem + 0.15vw, 1.05rem);   /* Base body    */
  --step-1:  clamp(1.10rem, 1.00rem + 0.3vw,  1.30rem);   /* Sub-heading  */
  --step-2: clamp(2rem, 1rem + 2vw, 3.5rem);  /* H2           */
  --step-3:  clamp(1.65rem, 1.30rem + 1.0vw,  2.40rem);   /* H1 / Banner  */
  --step-4:  clamp(2.00rem, 1.60rem + 1.3vw,  3.20rem);   /* Hero / hero  */

  /* ── Spacing ──────────────────────────────────────────────────────────── */
  --space-xs:   6px;
  --space-s:    10px;
  --space-m:    14px;
  --space-l:    20px;
  --space-xl:   28px;
  --space-2xl:  40px;
  --space-3xl:  72px;

  /* ── Max Content Widths ───────────────────────────────────────────────── */
  --measure-xs: 35ch;
  --measure-s:  45ch;
  --measure-m:  60ch;
  --measure-l:  75ch;
  --measure-xl: 90ch;
  --row-max:    1080px;
  --row-wide:   1280px;
  --row-xwide:  1300px;
  --row-xxwide: 1400px;
  --row-width:  82%;

  /* ── Border Radius ────────────────────────────────────────────────────── */
  --radius-s:      4px;
  --radius-m:      8px;
  --radius-l:      12px;
  --radius-xl:     16px;
  --radius-pill:   999px;
  --radius-circle: 50%;

  /* ── Shadows ──────────────────────────────────────────────────────────── */
  --shadow-xs:      0 1px 3px rgba(31, 58, 137, 0.06);
  --shadow-s:       0 2px 6px rgba(31, 58, 137, 0.08);
  --shadow-m:       0 4px 16px rgba(31, 58, 137, 0.12);
  --shadow-l:       0 8px 28px rgba(31, 58, 137, 0.16);
  --shadow-xl:      0 12px 40px rgba(31, 58, 137, 0.20);
  --shadow-dark-s:  0 2px 8px  rgba(0, 0, 0, 0.40);
  --shadow-dark-m:  0 4px 16px rgba(0, 0, 0, 0.45);
  --shadow-dark-l:  0 8px 28px rgba(0, 0, 0, 0.55);
  --shadow-dark-xl: 0 12px 40px rgba(0, 0, 0, 0.60);

  /* ── Transitions ──────────────────────────────────────────────────────── */
  --transition-fast:  0.18s ease;
  --transition-base:  0.24s ease;
  --transition-slow:  0.32s ease;
  --transition-xslow: 0.5s ease;

  /* ── Grid Gaps ────────────────────────────────────────────────────────── */
  --gap-s:   8px;
  --gap-m:   14px;
  --gap-l:   20px;
  --gap-xl:  28px;
  --gap-2xl: 48px;

  /* ── Buttons ──────────────────────────────────────────────────────────── */
  --btn-padding:    0.75rem 1.75rem;
  --btn-font-size:  1rem;
  --btn-radius:     var(--radius-m);
  --btn-bg:         var(--color-red);
  --btn-color:      var(--color-white);
  --btn-hover-bg:   var(--color-red-dark);

  /* ── Profile Image Heights ────────────────────────────────────────────── */
  --profile-img-height:         190px;
  --profile-img-height-mobile:  165px;
  --profile-img-height-small:   145px;
  --profile-side-img-size:      64px;
  --profile-side-img-mobile:    56px;

  /* ── Section / Banner Padding ─────────────────────────────────────────── */
  --section-padding:          var(--space-3xl);
  --banner-padding-desktop:   180px;
  --banner-padding-tablet:    130px;
  --banner-padding-mobile:    90px;
  --banner-padding-small:     60px;

  /* ── WYSIWYG / Prose Content Rhythm ──────────────────────────────────── */
  /* These control the document-like spacing for editor-entered content.    */
  --prose-line-height:        1.80;          /* Comfortable reading rhythm  */
  --prose-para-gap:           1.20em;        /* Space below each <p>        */
  --prose-heading-gap-above:  1.60em;        /* Breathing room before h2–h4 */
  --prose-heading-gap-below:  0.50em;        /* Tight link between head/body*/
  --prose-list-gap-outer:     1.10em;        /* Space above/below ul / ol   */
  --prose-list-item-gap:      0.55em;        /* Space between list items    */
  --prose-list-indent:        1.60rem;       /* Left indent for bullets/nums*/
  --prose-nested-indent:      1.30rem;       /* Indent for nested lists     */
  --prose-blockquote-padding: 1rem 1.5rem;
  --prose-hr-gap:             2rem;
}


/* ==========================================================================
   2. RESET & BASE
   ========================================================================== */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
  line-height: var(--leading-fine);
}

body {
  font-family: 'Inter', sans-serif;
  background: var(--color-cream) !important;
  color: var(--text-body-light);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

p, span, li, label, input, textarea, select, button, a, td, th {
  font-family: 'Inter', sans-serif;
}


/* ==========================================================================
   2a. WYSIWYG PROSE — DOCUMENT-LIKE CONTENT RHYTHM
   --------------------------------------------------------------------------
   All editor-entered content lives inside .text-area, .single-post__content,
   .staff-profile__bio, and .entry-content. These rules give those areas the
   same comfortable reading rhythm as a well-formatted Word document:
   generous paragraph gaps, breathing room around headings, and clear list
   presentation. Rules here are intentionally lower-specificity so the
   section-theme overrides in §11a can still win where needed.
   ========================================================================== */
.row_structure_duel-side_bar .column_1-duel-side-bar, .row_structure_duel-side_bar .column_2-duel-side-bar, .row_structure_duel-side_bar .column_3-duel-side-bar {
	background: white;
	padding: 2em;
	border-radius: 20px;
}

.section_container_dark .row_structure_duel-side_bar .column_1-duel-side-bar, .section_container_dark .row_structure_duel-side_bar .column_2-duel-side-bar, .section_container_dark .row_structure_duel-side_bar .column_3-duel-side-bar {
	background: #293c5f;
	padding: 2em;
	border-radius: 20px;
}

.column_2-side-bar, .column_1-side-bar {
	padding: 2em;
	background: white;
	border-radius: 20px;
}

.breadcrumb_container {
	max-width: 1600px;
    margin: auto;
	margin-top: 10px;
    border-radius: 40px;
}

.section_container_dark .row_structure_side_bar .column_1-side-bar, .section_container_dark .row_structure_side_bar .column_2-side-bar {
	background: #191a2d !important;
}

.section_container_dark .row_structure {
	background: #191a2d !important;
}
/* ── Shared prose wrapper — applies to both light and dark contexts ──────── */
.text-area,
.single-post__content,
.staff-profile__bio,
.staff-profile__extra-content,
.entry-content,
.accordion-text {
  font-size: var(--step-0);
  line-height: var(--prose-line-height);
  color: var(--text-body-light);   /* Overridden per dark context below */
  -webkit-font-smoothing: antialiased;
}

/* ── Paragraph spacing ───────────────────────────────────────────────────── */
.text-area p,
.single-post__content p,
.staff-profile__bio p,
.staff-profile__extra-content p,
.entry-content p,
.accordion-text p {
  margin-bottom: var(--prose-para-gap);
  line-height: var(--prose-line-height);
}

.text-area p:last-child,
.single-post__content p:last-child,
.staff-profile__bio p:last-child,
.staff-profile__extra-content p:last-child,
.entry-content p:last-child,
.accordion-text p:last-child {
  margin-bottom: 0;
}

/* ── Headings inside prose ───────────────────────────────────────────────── */
.text-area h2,
.text-area h3,
.text-area h4,
.text-area h5,
.text-area h6,
.single-post__content h2,
.single-post__content h3,
.single-post__content h4,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
  margin-top: var(--prose-heading-gap-above);
  margin-bottom: var(--prose-heading-gap-below);
  line-height: var(--leading-fine);
}

/* First heading inside a prose block needs no extra top margin */
.text-area > h2:first-child,
.text-area > h3:first-child,
.single-post__content > h2:first-child,
.single-post__content > h3:first-child,
.entry-content > h2:first-child,
.entry-content > h3:first-child {
  margin-top: 0;
}

/* ── Unordered lists ─────────────────────────────────────────────────────── */
.text-area ul,
.single-post__content ul,
.staff-profile__bio ul,
.entry-content ul,
.accordion-text ul {
  margin-top: var(--prose-list-gap-outer);
  margin-bottom: var(--prose-list-gap-outer);
  padding-left: var(--prose-list-indent);
  list-style-type: disc;
}

.text-area ul li,
.single-post__content ul li,
.staff-profile__bio ul li,
.entry-content ul li,
.accordion-text ul li {
  margin-bottom: var(--prose-list-item-gap);
  line-height: var(--prose-line-height);
  padding-left: 0.25rem;
}

.text-area ul li::marker,
.single-post__content ul li::marker,
.entry-content ul li::marker {
  color: var(--color-red);    /* Red bullet markers — school brand accent */
  font-size: 1.1em;
}

/* ── Ordered lists ───────────────────────────────────────────────────────── */
.text-area ol,
.single-post__content ol,
.staff-profile__bio ol,
.entry-content ol,
.accordion-text ol {
  margin-top: var(--prose-list-gap-outer);
  margin-bottom: var(--prose-list-gap-outer);
  padding-left: var(--prose-list-indent);
  list-style-type: decimal;
}

.text-area ol li,
.single-post__content ol li,
.staff-profile__bio ol li,
.entry-content ol li,
.accordion-text ol li {
  margin-bottom: var(--prose-list-item-gap);
  line-height: var(--prose-line-height);
  padding-left: 0.25rem;
}

.text-area ol li::marker,
.single-post__content ol li::marker,
.entry-content ol li::marker {
  color: var(--color-navy);
  font-weight: var(--weight-bold);
}

/* ── Nested lists ────────────────────────────────────────────────────────── */
.text-area ul ul,
.text-area ul ol,
.text-area ol ul,
.text-area ol ol,
.single-post__content ul ul,
.single-post__content ul ol,
.single-post__content ol ul,
.single-post__content ol ol,
.entry-content ul ul,
.entry-content ol ol {
  margin-top: 0.45rem;
  margin-bottom: 0.45rem;
  padding-left: var(--prose-nested-indent);
  list-style-type: circle;
}

.text-area ol ul,
.single-post__content ol ul,
.entry-content ol ul {
  list-style-type: circle;
}

.text-area ul ul li::marker,
.single-post__content ul ul li::marker {
  color: var(--color-blue);  /* Nested bullets use mid-blue */
}

/* ── Horizontal rules ────────────────────────────────────────────────────── */
.text-area hr,
.single-post__content hr,
.entry-content hr {
  border: none;
  border-top: 1px solid var(--grey-200);
  margin: var(--prose-hr-gap) 0;
}

/* ── Strong / em ─────────────────────────────────────────────────────────── */
.text-area strong,
.single-post__content strong,
.entry-content strong {
  font-weight: var(--weight-bold);
  color: var(--color-red);
}

.text-area em,
.single-post__content em,
.entry-content em {
  font-style: italic;
  color: var(--text-secondary-light);
}

/* ── Dark section prose overrides ────────────────────────────────────────── */
.section_container_dark .text-area,
.section_container_dark .accordion-text {
  color: var(--text-body-dark);
}

.section_container_dark .text-area p,
.section_container_dark .accordion-text p {
  color: var(--text-body-dark);
}

.section_container_dark .text-area ul li::marker,
.section_container_dark .accordion-text ul li::marker {
  color: var(--color-yellow);   /* Yellow bullet markers in dark sections */
}

.section_container_dark .text-area ol li::marker,
.section_container_dark .accordion-text ol li::marker {
  color: var(--color-yellow);
}

.section_container_dark .text-area ul ul li::marker {
  color: rgba(255, 213, 125, 0.70);
}

.section_container_dark .text-area strong {
  color: var(--color-white);
}

.section_container_dark .text-area em {
  color: var(--text-secondary-dark);
}

.section_container_dark .text-area hr {
  border-top-color: rgba(255, 255, 255, 0.12);
}

/* ── Nested lists (globally) ─────────────────────────────────────────────── */
ul ul, ol ol, ul ol, ol ul {
  margin-top: 0.45rem;
  margin-bottom: 0.40rem;
}


/* ==========================================================================
   3. LAYOUT — SECTION & ROW CONTAINERS
   ========================================================================== */

.section_container {
  padding-top: var(--section-padding);
  padding-bottom: var(--section-padding);
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  position: relative;
}

.row_structure {
  width: var(--row-width);
  max-width: var(--row-max);
  margin: auto;
  z-index: 2;
  position: relative;
  background: white;
	padding: 2em;
	border-radius: 20px;
	box-shadow: var(--shadow-md);
}

/* Sidebar Layout (main + 28% sidebar) */
.row_structure_side_bar {
  display: grid;
  grid-template-columns: 3fr 28%;
  grid-gap: var(--gap-xl);
  width: var(--row-width);
  margin: auto;
  max-width: var(--row-xwide);
  z-index: 2;
  position: relative;
}

@media only screen and (max-width: 980px) {
  .row_structure_side_bar { grid-template-columns: 100%; }
}

/* Dual Sidebar Layout (22% | content | 22%) */
.row_structure_duel-side_bar {
  display: grid;
  grid-template-columns: 22% 1fr 22%;
  grid-gap: var(--gap-xl);
  width: var(--row-width);
  margin: auto;
  max-width: var(--row-xxwide);
  z-index: 2;
  position: relative;
}

@media only screen and (max-width: 980px) {
  .row_structure_duel-side_bar { grid-template-columns: 100%; }
  .column_1-duel-side-bar { order: 2; }
  .column_2-duel-side-bar { order: 1; }
  .column_3-duel-side-bar { order: 3; }
}

/* Side Image Layout (50/50) */
.row_structure_side-img {
  display: grid;
  grid-gap: var(--gap-2xl);
  grid-template-columns: 1fr 1fr;
  z-index: 2;
  width: var(--row-width);
  margin: auto;
  max-width: var(--row-wide);
  position: relative;
}

@media only screen and (max-width: 980px) {
  .row_structure_side-img { grid-template-columns: 1fr; }
}

.column_1-side-img { margin: auto; }

.column_2-side-img img {
  width: 100%;
  border-radius: var(--radius-xl);
}

@media only screen and (max-width: 980px) {
  .column_2-side-img { display: none; }
}
.full_width-img {
	margin: auto;
	text-align: center;
	background: var(--color-cream);
}
/* Utilities */
.full_width-img img {
  width: 100%;
  max-width: 1600px;
  height: 500px;
  object-fit: cover;
  object-position: center;
  margin-bottom: 0px;
  margin-top: 20px;
  border-radius: 20px;
  box-shadow: var(--shadow-s);
}

@media only screen and (max-width: 980px) {
	.full_width-img img {
	  height: 300px;
	 
	}
}

.verification-svg_container {
  text-align: center !important;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}

.margin_bottom { margin-bottom: var(--space-m); }

.side-video-wrapper {
  height: 100%;
  min-height: 250px;
}

.side-video-wrapper iframe {
  border-radius: var(--radius-l);
  overflow: hidden;
  box-shadow: var(--shadow-l);
  display: block;
  border: 0;
  height: 100%;
  width: 100%;
}


/* ==========================================================================
   4. RESPONSIVE HIDE UTILITIES
   ========================================================================== */

@media (max-width: 1024px) {
  .hide-on-tablet-mobile,
  .hide-left-on-tablet-mobile,
  .hide-right-on-tablet-mobile {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: all 0.4s ease;
  }
}


/* ==========================================================================
   5. TABLES (TABLEPRESS)
   ========================================================================== */

.tablepress colgroup col { width: 100% !important; }

.tablepress {
  border-collapse: collapse;
  margin-top: var(--space-m);
  margin-bottom: var(--space-l);
  font-size: 0.88em;
  font-family: 'Inter', sans-serif;
  border-radius: var(--radius-m) var(--radius-m) 0 0;
  overflow: hidden;
  box-shadow: var(--shadow-m);
}

.tablepress thead tr {
  background-color: var(--color-navy);
  color: var(--color-white);
  text-align: left;
  font-weight: var(--weight-bold);
  font-family: 'Poppins', sans-serif;
}

.tablepress th,
.tablepress td {
  padding: 11px 15px;
  font-family: 'Inter', sans-serif;
}

.tablepress tbody tr {
  border-bottom: 1px solid var(--grey-200);
}

.tablepress tbody tr:nth-of-type(even) {
  background-color: var(--color-bg-light);
}

.tablepress tbody tr:last-of-type {
  border-bottom: 2px solid var(--color-navy);
}

.tablepress tbody tr.active-row {
  font-weight: var(--weight-bold);
  color: var(--color-blue);
}

.tablepress > :where(thead, tfoot) > * > th {
  background-color: var(--color-navy) !important;
  color: var(--color-white) !important;
}

td.column-1 { font-weight: var(--weight-bold); }

.st-head-row.st-head-row-main {
  font-size: 1.4em;
  padding-top: 10px;
}

/* Responsive Stack Table */
.table-responsive-stack tr {
  display: flex;
  flex-direction: row;
}

.table-responsive-stack td,
.table-responsive-stack th {
  display: block;
  flex: 1 1 auto;
}

.table-responsive-stack .table-responsive-stack-thead {
  font-weight: var(--weight-bold);
}

@media screen and (max-width: 768px) {
  .table-responsive-stack tr {
    flex-direction: column;
    border-bottom: 3px solid var(--grey-200);
    display: block;
    margin-top: 10px;
  }
  .table-responsive-stack tr:first-child { margin-top: 0; }
  .table-responsive-stack td { float: left\9; width: auto; }
  .table-responsive-stack .table-responsive-stack-thead { display: grid !important; }
}

span.table-responsive-stack-thead {
  color: var(--color-navy);
  font-size: 13px;
  font-weight: 800 !important;
  font-family: 'Inter', sans-serif;
}

.gfield--type-repeater_end { padding: 0px !important; }


/* ==========================================================================
   6. BANNER / HERO
   ========================================================================== */

.banner-container {
  position: relative;
  background-size: cover;
  background-position: center;
  padding-top: var(--banner-padding-desktop);
  padding-bottom: var(--banner-padding-desktop);
}

@media (max-width: 1024px) {
  .banner-container {
    padding-top: var(--banner-padding-tablet);
    padding-bottom: var(--banner-padding-tablet);
  }
}

@media (max-width: 768px) {
  .banner-container {
    padding-top: var(--banner-padding-mobile);
    padding-bottom: var(--banner-padding-mobile);
  }
}

@media (max-width: 480px) {
  .banner-container {
    padding-top: var(--banner-padding-small);
    padding-bottom: var(--banner-padding-small);
  }
}

/* Navy-to-red gradient overlay (school brand) */
.banner-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(150deg, #1F3A89 0%, #2D8ADE 55%, #cc3631 100%);
  opacity: 0.88;
  z-index: 1;
}

/* When a background image is present, keep it legible */
.banner-container[style*="background-image"]::before {
  background: linear-gradient(150deg,
    rgba(31, 58, 137, 0.85) 0%,
    rgba(45, 138, 222, 0.75) 55%,
    rgba(203, 54, 50, 0.80) 100%);
  opacity: 1;
}

.banner-container div {
  z-index: 2;
  position: relative;
}

/* Reduced from 80px to a fluid, proportionate size */
.banner-container div h1 {
  color: var(--color-white);
  font-size: var(--step-4);
  font-weight: var(--weight-extrabold);
  font-family: 'Poppins', sans-serif;
  text-transform: uppercase;
  line-height: 1.05;
  letter-spacing: -0.01em;
}

.banner-container div h4 {
  color: rgba(255, 255, 255, 0.90);
  font-size: var(--step--1);
  line-height: 1.6em;
  width: 55%;
  font-family: 'Inter', sans-serif;
  margin-top: 12px;
}

@media (max-width: 1024px) {
  .banner-container div h1 { font-size: clamp(1.6rem, 4vw, 2.4rem); }
  .banner-container div h4 { font-size: 0.88rem; width: 70%; }
}

@media (max-width: 768px) {
  .banner-container div h1 { font-size: clamp(1.4rem, 5vw, 2rem); }
  .banner-container div h4 { font-size: 0.82rem; width: 88%; }
}

@media (max-width: 480px) {
  .banner-container div h1 { font-size: 1.4rem; }
  .banner-container div h4 { font-size: 0.78rem; width: 100%; }
}


/* ==========================================================================
   7. BREADCRUMBS
   ========================================================================== */

.breadcrumb_container {
  padding: 12px 0;
  background: var(--color-red);
}

.breadcrumb_row {
  width: var(--row-width);
  max-width: var(--row-max);
  margin: auto;
}

.breadcrumbs {
  font-size: 12px;
  font-family: 'Inter', sans-serif;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  background: rgba(255, 255, 255, 0.10);
  backdrop-filter: blur(8px);
  border-radius: var(--radius-pill);
  border: 1px solid rgba(255, 255, 255, 0.14);
  line-height: 1;
  word-spacing: 2px;
}

.breadcrumbs a {
  color: rgba(255, 255, 255, 0.88);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: opacity var(--transition-fast);
}

.breadcrumbs a:hover {
  opacity: 0.7;
}

.breadcrumbs a:first-of-type::before {
  content: "";
  width: 13px;
  height: 13px;
  display: inline-block;
  background: currentColor;
  mask: url('data:image/svg+xml;utf8,<svg fill="black" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3z"/></svg>') no-repeat center;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg fill="black" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3z"/></svg>') no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
}

.breadcrumbs > :last-child {
  background: rgba(203, 54, 50, 0.75);
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  color: var(--color-white);
  font-weight: var(--weight-semibold);
}

@media (max-width: 768px) {
  .breadcrumb_row { overflow-x: auto; }
  .breadcrumbs {
    font-size: 11px;
    padding: 7px 10px;
    border-radius: var(--radius-l);
    flex-wrap: nowrap;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .breadcrumbs::-webkit-scrollbar { display: none; }
  .breadcrumbs > :last-child { padding: 3px 8px; font-size: 11px; }
}


/* ==========================================================================
   8. CONTACT PAGE
   ========================================================================== */

.contact-page_row {
  width: var(--row-width);
  max-width: var(--row-max);
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2xl);
  align-items: start;
}

@media (max-width: 980px) {
  .contact-page_row { grid-template-columns: 1fr; }
}

.contact-card {
  background: var(--color-white);
  padding: 28px;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-m);
  border: 1px solid rgba(31, 58, 137, 0.10);
}

.contact-card h2 {
  font-size: clamp(1.5rem, 3vw, 2rem) !important;
  font-family: 'Poppins', sans-serif !important;
  color: var(--color-navy) !important;
  margin-bottom: 8px;
}

.contact-card h4 {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--color-red) !important;
  margin-bottom: 10px;
  font-weight: var(--weight-bold);
}

.contact-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-top: 16px;
}

.contact-item .icon {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-m);
  background: rgba(31, 58, 137, 0.10);
  color: var(--color-navy);
  flex-shrink: 0;
}

.contact-item label {
  font-size: 11px;
  color: var(--text-secondary-light);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: block;
  margin-bottom: 5px;
}

.contact-item h3 {
  font-size: 14px;
  color: var(--color-navy);
  margin: 0;
}

.info-text {
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-body-light);
}

.info-text p { margin-bottom: 1.1em; }


/* ==========================================================================
   9. GRAVITY FORMS
   ========================================================================== */

.gform_wrapper.gravity-theme input,
.gform_wrapper.gravity-theme textarea,
.gform_wrapper.gravity-theme select {
  font-size: 14px;
  font-family: 'Inter', sans-serif;
  padding: 11px 13px;
  background: var(--bg-form-input);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-m);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.gform_wrapper.gravity-theme input:focus,
.gform_wrapper.gravity-theme textarea:focus,
.gform_wrapper.gravity-theme select:focus {
  box-shadow: 0 0 0 2px rgba(45, 138, 222, 0.30);
  border-color: var(--color-blue);
  outline: none;
}

h2.gform_title { display: none !important; }

.gform_wrapper.gravity-theme .gform_footer button {
  width: 100%;
  padding: 0.85rem 2rem;
  font-size: 1rem;
  font-family: 'Poppins', sans-serif;
  font-weight: var(--weight-bold);
  background: var(--color-red);
  color: var(--color-white);
  border: none;
  border-radius: var(--btn-radius);
  cursor: pointer;
  transition: background var(--transition-base), transform var(--transition-base);
}

.gform_wrapper.gravity-theme .gform_footer button:hover {
  transform: translateY(-2px);
  background: var(--color-red-dark);
}


/* ==========================================================================
   10. SECTION THEMES — BACKGROUNDS & IMAGE OVERLAYS
   ========================================================================== */

.section_container_light {
  background-color: var(--color-cream) !important;
}

.section_container_light-img::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: var(--color-overlay-white);
  z-index: 1;
}

.section_container_dark {
  background-color: var(--color-navy) !important;
}

.section_container_dark-img::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: linear-gradient(150deg,
    rgba(31, 58, 137, 0.82) 0%,
    rgba(45, 138, 222, 0.70) 55%,
    rgba(31, 58, 137, 0.88) 100%);
  z-index: 1;
}


/* ==========================================================================
   11a. SECTION THEMES — TYPOGRAPHY
   ========================================================================== */

/* ── Light: H3 ────────────────────────────────────────────────────────────── */
.section_container_light h3 {
  color: var(--color-red);
  font-size: 13px;
  font-weight: var(--weight-bold);
  letter-spacing: 1.8px;
  font-family: 'Inter', sans-serif !important;
  text-transform: uppercase;
}

.section_container_light .row_structure_side-img div h3 {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 14px;
  background: rgba(31, 58, 137, 0.08);
  border: 1px solid rgba(31, 58, 137, 0.18);
  border-radius: var(--radius-pill);
  color: var(--color-navy);
  font-size: 13px;
  font-weight: var(--weight-semibold);
  font-family: 'Poppins', sans-serif !important;
  margin-bottom: 10px;
}

/* ── Light: H2 ────────────────────────────────────────────────────────────── */
.section_container_light h2 {
  color: #191a2d !important;
  font-size: var(--step-2) !important;
  font-weight: var(--weight-extrabold) !important;
  padding: 0 !important;
  font-family: 'Poppins', sans-serif !important;
  padding-bottom: var(--space-s) !important;
  letter-spacing: -0.01em;
}

.section_container_light h2 span {
  color: #cc3631 !important;
}

/* ── Light: H4 ────────────────────────────────────────────────────────────── */
.section_container_light h4 {
  color: var(--color-red);
  font-size: 1.3rem;
  font-weight: 800;
  font-family: 'Poppins', sans-serif !important;
  text-transform: uppercase;
  margin-bottom: 5px;
}

/* ── Light: Body Text ─────────────────────────────────────────────────────── */
.section_container_light .text-area {
  color: var(--text-body-light);
  font-size: var(--step--1);
  line-height: var(--leading-loose);
  font-weight: var(--weight-medium);
  font-family: 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ── Light: Lists ─────────────────────────────────────────────────────────── */
.section_container_light ul {
  margin-bottom: 10px;
  margin-top: 10px;
  padding: 0;
  padding-left: 1.4rem;
  list-style-type: disc;
}

.section_container_light ul li {
  margin-bottom: 0.45rem;
  font-size: var(--step--1);
  line-height: var(--leading-loose);
  font-weight: var(--weight-medium);
  font-family: 'Inter', sans-serif;
  color: var(--text-body-light);
}

.section_container_light ol {
  margin-bottom: 10px;
  margin-top: 10px;
  list-style-type: decimal;
  padding: 0;
  padding-left: 1.4rem;
}

.section_container_light ol li {
  margin-bottom: 0.45rem;
  font-size: var(--step--1);
  line-height: var(--leading-loose);
  font-weight: var(--weight-medium);
  font-family: 'Inter', sans-serif;
  color: var(--text-body-light);
}

/* ── Light: Links ─────────────────────────────────────────────────────────── */
.section_container_light .text-area a {
  color: var(--color-blue);
  text-decoration: none !important;
  transition: color var(--transition-base);
}

.section_container_light .text-area a:hover {
  color: var(--color-navy);
}

.section_container_light a {
  text-decoration: none !important;
  transition: color var(--transition-base), opacity var(--transition-base);
}

/* ── Dark: H3 ─────────────────────────────────────────────────────────────── */
.section_container_dark h3 {
  color: var(--color-yellow);
  font-size: 13px;
  font-weight: var(--weight-bold);
  letter-spacing: 1.8px;
  font-family: 'Inter', sans-serif !important;
  text-transform: uppercase;
}

.section_container_dark .row_structure_side-img div h3 {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 14px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--radius-pill);
  color: var(--color-white);
  font-size: 13px;
  font-weight: var(--weight-semibold);
  font-family: 'Poppins', sans-serif !important;
  margin-bottom: 10px;
}

/* ── Dark: H2 ─────────────────────────────────────────────────────────────── */
.section_container_dark h2 {
  color: var(--color-white) !important;
  font-size: var(--step-2) !important;
  font-weight: var(--weight-extrabold) !important;
  padding: 0 !important;
  font-family: 'Poppins', sans-serif !important;
  padding-bottom: var(--space-s) !important;
  letter-spacing: -0.01em;
}

.section_container_dark h2 span {
  color: #ffd57d !important;
}

/* ── Dark: H4 ─────────────────────────────────────────────────────────────── */
.section_container_dark h4 {
  color: var(--color-yellow);
   font-size: 1.3rem;
  font-weight: 800;
  font-family: 'Poppins', sans-serif !important;
  text-transform: uppercase;
  margin-bottom: 5px;
}

/* ── Dark: Body Text ──────────────────────────────────────────────────────── */
.section_container_dark .text-area {
  color: var(--text-body-dark);
  font-size: var(--step--1);
  line-height: var(--leading-loose);
  font-weight: var(--weight-medium);
  font-family: 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ── Dark: Lists ──────────────────────────────────────────────────────────── */
.section_container_dark ul {
  margin-bottom: 10px;
  margin-top: 10px;
  padding: 0;
  padding-left: 1.4rem;
  list-style-type: disc;
}

.section_container_dark ul li {
  margin-bottom: 0.45rem;
  font-size: var(--step--1);
  line-height: var(--leading-loose);
  font-weight: var(--weight-medium);
  font-family: 'Inter', sans-serif;
  color: var(--text-body-dark);
}

.section_container_dark ol {
  margin-bottom: 10px;
  margin-top: 10px;
  list-style-type: decimal;
  padding: 0;
  padding-left: 1.4rem;
}

.section_container_dark ol li {
  margin-bottom: 0.45rem;
  font-size: var(--step--1);
  line-height: var(--leading-loose);
  font-weight: var(--weight-medium);
  font-family: 'Inter', sans-serif;
  color: var(--text-body-dark);
}

/* ── Dark: Links ──────────────────────────────────────────────────────────── */
.section_container_dark .text-area a {
  color: var(--color-yellow);
  text-decoration: none !important;
  transition: color var(--transition-base);
}

.section_container_dark .text-area a:hover {
  color: var(--color-white);
}

.section_container_dark a {
  text-decoration: none !important;
  transition: color var(--transition-base), opacity var(--transition-base);
}


/* ==========================================================================
   11b. SECTION THEMES — ACCORDIONS
   ========================================================================== */

/* ── Light Accordion ──────────────────────────────────────────────────────── */
.section_container_light button.accordion {
  width: 100%;
  font-family: 'Poppins', sans-serif;
  background-color: var(--color-bg-light);
  border: none;
  border-left: 3px solid transparent;
  outline: none;
  text-align: left;
  padding: 14px 18px;
  font-size: 15px;
  font-weight: var(--weight-semibold);
  color: var(--text-body-light);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color var(--transition-fast),
              color var(--transition-fast),
              border-color var(--transition-fast);
  border-radius: var(--radius-m);
  margin-bottom: 4px;
}

.section_container_light .accordion-item:first-child button.accordion {
  border-top: none;
}

.section_container_light button.accordion:after {
  font-family: "fontawesome";
  content: "\f0d7";
  font-size: 16px;
  color: var(--color-navy);
  float: right;
  transition: transform var(--transition-base);
  flex-shrink: 0;
}

.section_container_light button.accordion.is-open:after {
  content: "\f0d8";
  color: var(--color-red);
}

.section_container_light button.accordion:hover,
.section_container_light button.accordion.is-open {
  background-color: var(--color-white);
  color: var(--color-navy);
  border-left-color: var(--color-red);
  box-shadow: var(--shadow-s);
}

.section_container_light .accordion-content {
  background-color: var(--color-white);
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.22s ease-in-out;
  border-radius: 0 0 var(--radius-m) var(--radius-m);
  border-left: 3px solid var(--color-red);
  margin-bottom: 4px;
}

.section_container_light .accordion-text {
  padding: var(--space-l) var(--space-l) var(--space-l) var(--space-xl);
  color: var(--text-secondary-light);
  font-size: var(--step--1);
  line-height: var(--leading-loose);
}

/* Sidebar accordion overrides */
.column_2-side-bar button.accordion,
.column_1-duel-side-bar button.accordion,
.column_3-duel-side-bar button.accordion {
  padding: 10px 12px !important;
  font-size: 13px !important;
  font-weight: var(--weight-semibold) !important;
}

/* ── Dark Accordion ───────────────────────────────────────────────────────── */
.section_container_dark button.accordion {
  width: 100%;
  font-family: 'Poppins', sans-serif;
  background-color: rgba(255, 255, 255, 0.06);
  border: none;
  border-left: 3px solid transparent;
  outline: none;
  text-align: left;
  padding: 14px 18px;
  font-size: 15px;
  font-weight: var(--weight-semibold);
  color: var(--text-body-dark);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color var(--transition-fast),
              color var(--transition-fast),
              border-color var(--transition-fast);
  border-radius: var(--radius-m);
  margin-bottom: 4px;
}

.section_container_dark .accordion-item:first-child button.accordion {
  border-top: none;
}

.section_container_dark button.accordion:after {
  font-family: "fontawesome";
  content: "\f0d7";
  font-size: 16px;
  color: var(--color-yellow);
  float: right;
  transition: transform var(--transition-base);
  flex-shrink: 0;
}

.section_container_dark button.accordion.is-open:after {
  content: "\f0d8";
  color: var(--color-yellow);
}

.section_container_dark button.accordion:hover,
.section_container_dark button.accordion.is-open {
  background-color: rgba(255, 255, 255, 0.10);
  color: var(--color-white);
  border-left-color: var(--color-yellow);
}

.section_container_dark .accordion-content {
  background-color: rgba(255, 255, 255, 0.04);
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.22s ease-in-out;
  border-radius: 0 0 var(--radius-m) var(--radius-m);
  border-left: 3px solid var(--color-yellow);
  margin-bottom: 4px;
}

.section_container_dark .accordion-text {
  padding: var(--space-l) var(--space-l) var(--space-l) var(--space-xl);
  color: var(--text-secondary-dark);
  font-size: var(--step--1);
  line-height: var(--leading-loose);
}


/* ==========================================================================
   11c. SECTION THEMES — LINK BUTTONS
   ========================================================================== */

/* Shared base */
.section_container_light .links_container a,
.section_container_dark .links_container a {
  background: var(--color-red);
  color: var(--color-white);
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--btn-padding);
  border-radius: var(--btn-radius);
  transition: all var(--transition-slow);
  font-weight: var(--weight-semibold);
  font-family: 'Poppins', sans-serif;
  text-align: center;
  text-decoration: none;
  font-size: var(--btn-font-size);
  position: relative;
  overflow: hidden;
  border: none;
  box-shadow: 0 4px 12px rgba(203, 54, 50, 0.30);
  cursor: pointer;
  margin-bottom: 5px;
}

.section_container_light .links_container a::after,
.section_container_dark .links_container a::after {
  content: '→';
  margin-left: var(--space-xs);
  font-size: 1rem;
  transition: transform var(--transition-slow);
}

/* Light hover */
.section_container_light .links_container a:hover {
  background: var(--color-navy);
  color: var(--color-white);
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(31, 58, 137, 0.35);
}

.section_container_light .links_container a:hover::after {
  transform: translateX(5px);
}

/* Dark hover */
.section_container_dark .links_container a:hover {
  background: var(--color-yellow);
  color: var(--color-navy);
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(255, 213, 125, 0.35);
}

.section_container_dark .links_container a:hover::after {
  transform: translateX(5px);
}


/* ==========================================================================
   11d. SECTION THEMES — PROFILE CARDS (MAIN)
   ========================================================================== */

/* ── Light Profile Cards ──────────────────────────────────────────────────── */
.section_container_light .profile_wrapper a {
  background: var(--bg-light);
  border-radius: var(--radius-xl);
  overflow: hidden;
  display: block;
  box-shadow: var(--shadow-m);
  position: relative;
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
  border: 1px solid rgba(31, 58, 137, 0.08);
}

.section_container_light .profile_wrapper a::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: calc(var(--radius-xl) + 2px);
  padding: 2px;
  background: linear-gradient(135deg, var(--color-navy), var(--color-blue));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity var(--transition-slow);
  z-index: 0;
  pointer-events: none;
}

.section_container_light .profile_wrapper a:hover::before { opacity: 1; }

.section_container_light .profile_wrapper a:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-l);
}

.section_container_light .profile_wrapper a img {
  height: var(--profile-img-height);
  width: 100%;
  object-fit: cover;
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  transition: transform 0.4s ease;
}

.section_container_light .profile_wrapper a:hover img { transform: scale(1.05); }

.section_container_light .profile_content {
  padding: 18px 20px;
  text-align: center;
}

.section_container_light .title {
  font-size: 17px;
  color: var(--color-navy);
  font-weight: var(--weight-bold);
  font-family: 'Poppins', sans-serif !important;
  margin-bottom: 5px;
}

.section_container_light .position {
  color: var(--text-secondary-light);
  letter-spacing: 0.3px;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px;
  margin-bottom: 12px;
}

.section_container_light .view_profile {
  font-weight: var(--weight-semibold);
  font-size: 12px;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-navy);
  display: inline-block;
  padding: 6px 14px;
  border: 1.5px solid var(--color-navy);
  border-radius: var(--radius-pill);
  transition: all var(--transition-slow);
  background: transparent;
}

.section_container_light .view_profile:hover {
  background: var(--color-red);
  color: var(--color-white);
  border-color: var(--color-red);
  box-shadow: 0 4px 12px rgba(203, 54, 50, 0.30);
}

@media (max-width: 1024px) {
  .section_container_light .profile_wrapper a img { height: var(--profile-img-height); }
  .section_container_light .title    { font-size: 15px; }
  .section_container_light .position { font-size: 11px; }
}

@media (max-width: 768px) {
  .section_container_light .profile_wrapper a img { height: var(--profile-img-height-mobile); }
  .section_container_light .title    { font-size: 14px; }
}

@media (max-width: 480px) {
  .section_container_light .profile_wrapper a img { height: var(--profile-img-height-small); }
  .section_container_light .title    { font-size: 13px; }
}

/* ── Dark Profile Cards ───────────────────────────────────────────────────── */
.section_container_dark .profile_wrapper a {
  background: var(--bg-card-dark);
  border-radius: var(--radius-xl);
  overflow: hidden;
  display: block;
  box-shadow: var(--shadow-dark-m);
  position: relative;
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
}

.section_container_dark .profile_wrapper a::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: calc(var(--radius-xl) + 2px);
  padding: 2px;
  background: linear-gradient(135deg, var(--color-blue), var(--color-yellow));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity var(--transition-slow);
  z-index: 0;
  pointer-events: none;
}

.section_container_dark .profile_wrapper a:hover::before { opacity: 1; }

.section_container_dark .profile_wrapper a:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-dark-xl);
}

.section_container_dark .profile_wrapper a img {
  height: var(--profile-img-height);
  width: 100%;
  object-fit: cover;
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  transition: transform 0.4s ease;
}

.section_container_dark .profile_wrapper a:hover img { transform: scale(1.05); }

.section_container_dark .profile_content {
  padding: 18px 20px;
  text-align: center;
}

.section_container_dark .title {
  font-size: 17px;
  color: var(--color-white);
  font-weight: var(--weight-bold);
  font-family: 'Poppins', sans-serif !important;
  margin-bottom: 5px;
}

.section_container_dark .position {
  color: var(--text-secondary-dark);
  letter-spacing: 0.3px;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px;
  margin-bottom: 12px;
}

.section_container_dark .view_profile {
  font-weight: var(--weight-semibold);
  font-size: 12px;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-yellow);
  display: inline-block;
  padding: 6px 14px;
  border: 1.5px solid var(--color-yellow);
  border-radius: var(--radius-pill);
  transition: all var(--transition-slow);
  background: transparent;
}

.section_container_dark .view_profile:hover {
  background: var(--color-yellow);
  color: var(--color-navy);
  border-color: var(--color-yellow);
  box-shadow: 0 4px 12px rgba(255, 213, 125, 0.30);
}

@media (max-width: 1024px) {
  .section_container_dark .profile_wrapper a img { height: var(--profile-img-height); }
  .section_container_dark .title    { font-size: 15px; }
  .section_container_dark .position { font-size: 11px; }
}

@media (max-width: 768px) {
  .section_container_dark .profile_wrapper a img { height: var(--profile-img-height-mobile); }
  .section_container_dark .title { font-size: 14px; }
}

@media (max-width: 480px) {
  .section_container_dark .profile_wrapper a img { height: var(--profile-img-height-small); }
  .section_container_dark .title { font-size: 13px; }
}


/* ==========================================================================
   11e. SECTION THEMES — PROFILE CARDS (SIDE)
   ========================================================================== */

/* ── Light Profile Side ───────────────────────────────────────────────────── */
.section_container_light .profile_wrapper-side a {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  margin-bottom: 10px;
  background: var(--bg-light);
  padding: 10px 14px;
  border-radius: var(--radius-l);
  box-shadow: var(--shadow-s);
  border: 1px solid rgba(31, 58, 137, 0.08);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
  text-decoration: none;
}

.section_container_light .profile_wrapper-side a:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-m);
  border-color: rgba(31, 58, 137, 0.18);
}

.section_container_light .profile_wrapper-side a img {
  width: var(--profile-side-img-size);
  height: var(--profile-side-img-size);
  object-fit: cover;
  border-radius: var(--radius-circle);
  flex-shrink: 0;
  transition: transform var(--transition-slow);
  box-shadow: 0 0 0 2.5px var(--color-navy), 0 0 0 5px rgba(31, 58, 137, 0.15);
}

.section_container_light .profile_wrapper-side a:hover img { transform: scale(1.07); }

.section_container_light .profile_content-side {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.section_container_light .title-side {
  color: var(--color-navy);
  font-family: 'Poppins', sans-serif;
  font-weight: var(--weight-bold);
  font-size: 16px;
  margin-bottom: 2px;
}

.section_container_light .position-side {
  color: var(--text-secondary-light);
  font-family: 'Inter', sans-serif !important;
  font-size: 12px;
  margin-bottom: 4px;
}

.section_container_light .view_profile-side {
  font-weight: var(--weight-semibold);
  font-size: 11px;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-navy);
  display: inline-block;
  margin-top: 3px;
  padding: 3px 10px;
  border: 1px solid var(--color-navy);
  border-radius: var(--radius-pill);
  transition: all var(--transition-slow);
}

.section_container_light .view_profile-side:hover {
  background: var(--color-red);
  color: var(--color-white);
  border-color: var(--color-red);
}

@media (max-width: 1024px) {
  .section_container_light .title-side        { font-size: 14px; }
  .section_container_light .position-side     { font-size: 11px; }
}

@media (max-width: 768px) {
  .section_container_light .profile_wrapper-side a { padding: 8px 10px; gap: 9px; }
  .section_container_light .profile_wrapper-side a img {
    width: var(--profile-side-img-mobile);
    height: var(--profile-side-img-mobile);
  }
  .section_container_light .title-side { font-size: 13px; }
}

@media (max-width: 480px) {
  .section_container_light .profile_wrapper-side a { flex-direction: column; text-align: center; }
  .section_container_light .profile_wrapper-side a img { margin-bottom: var(--space-xs); }
}

/* ── Dark Profile Side ────────────────────────────────────────────────────── */
.section_container_dark .profile_wrapper-side a {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  margin-bottom: 10px;
  background: var(--bg-card-dark);
  padding: 10px 14px;
  border-radius: var(--radius-l);
  box-shadow: var(--shadow-dark-s);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
  text-decoration: none;
}

.section_container_dark .profile_wrapper-side a:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-dark-l);
}

.section_container_dark .profile_wrapper-side a img {
  width: var(--profile-side-img-size);
  height: var(--profile-side-img-size);
  object-fit: cover;
  border-radius: var(--radius-circle);
  flex-shrink: 0;
  transition: transform var(--transition-slow);
  box-shadow: 0 0 0 2.5px var(--color-yellow), 0 0 0 5px rgba(255, 213, 125, 0.20);
}

.section_container_dark .profile_wrapper-side a:hover img { transform: scale(1.07); }

.section_container_dark .profile_content-side {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.section_container_dark .title-side {
  color: var(--color-white);
  font-family: 'Poppins', sans-serif;
  font-weight: var(--weight-bold);
  font-size: 16px;
  margin-bottom: 2px;
}

.section_container_dark .position-side {
  color: var(--text-muted-dark);
  font-family: 'Inter', sans-serif !important;
  font-size: 12px;
  margin-bottom: 4px;
}

.section_container_dark .view_profile-side {
  font-weight: var(--weight-semibold);
  font-size: 11px;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-yellow);
  display: inline-block;
  margin-top: 3px;
  padding: 3px 10px;
  border: 1px solid var(--color-yellow);
  border-radius: var(--radius-pill);
  transition: all var(--transition-slow);
}

.section_container_dark .view_profile-side:hover {
  background: var(--color-yellow);
  color: var(--color-navy);
  border-color: var(--color-yellow);
}

@media (max-width: 1024px) {
  .section_container_dark .title-side    { font-size: 14px; }
  .section_container_dark .position-side { font-size: 11px; }
}

@media (max-width: 768px) {
  .section_container_dark .profile_wrapper-side a { padding: 8px 10px; gap: 9px; }
  .section_container_dark .profile_wrapper-side a img {
    width: var(--profile-side-img-mobile);
    height: var(--profile-side-img-mobile);
  }
  .section_container_dark .title-side { font-size: 13px; }
}

@media (max-width: 480px) {
  .section_container_dark .profile_wrapper-side a { flex-direction: column; text-align: center; }
  .section_container_dark .profile_wrapper-side a img { margin-bottom: var(--space-xs); }
}


/* ==========================================================================
   11f. SECTION THEMES — RELATED CARDS (MAIN)
   ========================================================================== */

/* ── Light ────────────────────────────────────────────────────────────────── */
.section_container_light .related_wrapper a {
  display: flex;
  flex-direction: column;
  background: var(--bg-light);
  border-radius: var(--radius-xl);
  overflow: hidden;
  text-decoration: none;
  box-shadow: var(--shadow-s);
  border: 1px solid rgba(31, 58, 137, 0.08);
  transition: transform var(--transition-base), box-shadow var(--transition-base);
  position: relative;
}

.section_container_light .related_wrapper a::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: calc(var(--radius-xl) + 2px);
  padding: 2px;
  background: linear-gradient(135deg, var(--color-navy), var(--color-blue));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity var(--transition-slow);
  z-index: 0;
  pointer-events: none;
}

.section_container_light .related_wrapper a:hover::before { opacity: 1; }

.section_container_light .related_wrapper a:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-l);
}

.section_container_light .related_wrapper a img {
  height: 210px;
  width: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}

.section_container_light .related_wrapper a:hover img { transform: scale(1.04); }

.section_container_light .related_content {
  padding: var(--space-l);
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.section_container_light .related_title {
  font-size: 0.95rem;
  color: var(--color-navy);
  font-weight: var(--weight-bold);
  font-family: 'Poppins', sans-serif !important;
  margin-bottom: var(--space-xs);
  line-height: var(--leading-fine);
  transition: color var(--transition-base);
}

.section_container_light .related_wrapper a:hover .related_title {
  color: var(--color-blue);
}

.section_container_light .related_read-more {
  margin-top: auto;
  font-weight: var(--weight-semibold);
  font-size: 0.82rem;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-red);
  display: inline-block;
  transition: color var(--transition-base);
}

.section_container_light .related_read-more:hover { color: var(--color-navy); }

/* ── Dark ─────────────────────────────────────────────────────────────────── */
.section_container_dark .related_wrapper a {
  display: flex;
  flex-direction: column;
  background: var(--bg-card-dark-alt);
  border-radius: var(--radius-xl);
  overflow: hidden;
  text-decoration: none;
  box-shadow: var(--shadow-dark-s);
  transition: transform var(--transition-base), box-shadow var(--transition-base);
  position: relative;
}

.section_container_dark .related_wrapper a::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: calc(var(--radius-xl) + 2px);
  padding: 2px;
  background: linear-gradient(135deg, var(--color-blue), var(--color-yellow));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity var(--transition-slow);
  z-index: 0;
  pointer-events: none;
}

.section_container_dark .related_wrapper a:hover::before { opacity: 1; }

.section_container_dark .related_wrapper a:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-dark-l);
}

.section_container_dark .related_wrapper a img {
  height: 210px;
  width: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}

.section_container_dark .related_wrapper a:hover img { transform: scale(1.04); }

.section_container_dark .related_content {
  padding: var(--space-l);
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.section_container_dark .related_title {
  font-size: 0.95rem;
  color: var(--color-white);
  font-weight: var(--weight-bold);
  font-family: 'Poppins', sans-serif !important;
  margin-bottom: var(--space-xs);
  line-height: var(--leading-fine);
  transition: color var(--transition-base);
}

.section_container_dark .related_wrapper a:hover .related_title {
  color: var(--color-yellow);
}

.section_container_dark .related_read-more {
  margin-top: auto;
  font-weight: var(--weight-semibold);
  font-size: 0.82rem;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-yellow);
  display: inline-block;
  transition: color var(--transition-base);
}

.section_container_dark .related_read-more:hover { color: var(--color-white); }


/* ==========================================================================
   11g. SECTION THEMES — RELATED CARDS (SIDE)
   ========================================================================== */

/* ── Light ────────────────────────────────────────────────────────────────── */
.section_container_light .related_wrapper-side a {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  margin-bottom: 12px;
  padding: 10px;
  border-radius: var(--radius-l);
  background: var(--bg-light);
  text-decoration: none;
  box-shadow: var(--shadow-xs);
  border: 1px solid rgba(31, 58, 137, 0.08);
  transition: background-color var(--transition-base),
              box-shadow var(--transition-base),
              transform var(--transition-fast);
}

.section_container_light .related_wrapper-side a:hover {
  background: var(--color-bg-light);
  box-shadow: var(--shadow-m);
  transform: translateY(-2px);
}

.section_container_light .related_wrapper-side a img {
  width: 68px;
  height: 68px;
  border-radius: var(--radius-circle);
  object-fit: cover;
  transition: transform var(--transition-slow);
  box-shadow: 0 0 0 2px var(--color-navy);
}

.section_container_light .related_wrapper-side a:hover img { transform: scale(1.07); }

.section_container_light h4.related_title-side {
  font-size: 0.88rem;
  color: var(--color-navy);
  font-weight: var(--weight-bold);
  font-family: 'Poppins', sans-serif !important;
  margin: 0;
  line-height: var(--leading-fine);
  transition: color var(--transition-base);
}

.section_container_light .related_wrapper-side a:hover h4.related_title-side {
  color: var(--color-blue);
}

.section_container_light p.related_read-more-side {
  font-weight: var(--weight-semibold);
  font-size: 0.78rem;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-red);
  margin: 4px 0 0 0;
  transition: color var(--transition-base);
}

.section_container_light .related_wrapper-side a:hover p.related_read-more-side {
  color: var(--color-navy);
}

@media (max-width: 480px) {
  .section_container_light .related_wrapper-side a {
    flex-direction: column;
    align-items: flex-start;
  }
  .section_container_light .related_wrapper-side a img {
    width: 100%;
    height: auto;
    max-height: 180px;
    border-radius: var(--radius-l);
  }
}

/* ── Dark ─────────────────────────────────────────────────────────────────── */
.section_container_dark .related_wrapper-side a {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  margin-bottom: 12px;
  padding: 10px;
  border-radius: var(--radius-l);
  background: var(--bg-card-dark-alt);
  text-decoration: none;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
  transition: background-color var(--transition-base),
              box-shadow var(--transition-base),
              transform var(--transition-fast);
}

.section_container_dark .related_wrapper-side a:hover {
  background: var(--bg-card-hover-dark);
  box-shadow: 0 6px 18px rgba(45, 138, 222, 0.28);
  transform: translateY(-2px);
}

.section_container_dark .related_wrapper-side a img {
  width: 68px;
  height: 68px;
  border-radius: var(--radius-circle);
  object-fit: cover;
  transition: transform var(--transition-slow);
  box-shadow: 0 0 0 2px var(--color-yellow);
}

.section_container_dark .related_wrapper-side a:hover img { transform: scale(1.07); }

.section_container_dark h4.related_title-side {
  font-size: 0.88rem;
  color: var(--color-white);
  font-weight: var(--weight-bold);
  font-family: 'Poppins', sans-serif !important;
  margin: 0;
  line-height: var(--leading-fine);
  transition: color var(--transition-base);
}

.section_container_dark .related_wrapper-side a:hover h4.related_title-side {
  color: var(--color-yellow);
}

.section_container_dark p.related_read-more-side {
  font-weight: var(--weight-semibold);
  font-size: 0.78rem;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-yellow);
  margin: 4px 0 0 0;
  transition: color var(--transition-base);
}

.section_container_dark .related_wrapper-side a:hover p.related_read-more-side {
  color: var(--color-white);
}

@media (max-width: 480px) {
  .section_container_dark .related_wrapper-side a {
    flex-direction: column;
    align-items: flex-start;
  }
  .section_container_dark .related_wrapper-side a img {
    width: 100%;
    height: auto;
    max-height: 180px;
    border-radius: var(--radius-l);
  }
}


/* ==========================================================================
   12a. GRID WRAPPERS — PROFILE
   ========================================================================== */

.profile_wrapper-main {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: var(--gap-m);
  margin-bottom: var(--gap-m);
}

@media only screen and (max-width: 980px) {
  .profile_wrapper-main { grid-template-columns: repeat(2, 1fr); }
}

@media only screen and (max-width: 480px) {
  .profile_wrapper-main { grid-template-columns: 1fr; }
}

.profile_wrapper-center {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: var(--gap-m);
  margin-bottom: var(--gap-m);
}

@media only screen and (max-width: 980px) {
  .profile_wrapper-center { grid-template-columns: repeat(2, 1fr); }
}

@media only screen and (max-width: 480px) {
  .profile_wrapper-center { grid-template-columns: 1fr; }
}

.profile_wrapper-main-side-img {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: var(--gap-m);
  margin-bottom: var(--gap-m);
}

@media only screen and (max-width: 980px) {
  .profile_wrapper-main-side-img { grid-template-columns: repeat(2, 1fr); }
}

@media only screen and (max-width: 480px) {
  .profile_wrapper-main-side-img { grid-template-columns: 1fr; }
}


/* ==========================================================================
   12b. GRID WRAPPERS — RELATED
   ========================================================================== */

.related_wrapper-main {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--gap-l);
  margin-bottom: var(--gap-l);
}

.related_wrapper-center {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--gap-l);
  margin-bottom: var(--gap-l);
}

.related_wrapper-main-side-img {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--gap-l);
  margin-bottom: var(--gap-l);
}

@media (min-width: 1400px) {
  .related_wrapper-main           { grid-template-columns: repeat(4, 1fr); }
  .related_wrapper-center         { grid-template-columns: repeat(3, 1fr); }
  .related_wrapper-main-side-img  { grid-template-columns: repeat(3, 1fr); }
}


/* ==========================================================================
   12c. GRID WRAPPERS — LINKS CONTAINERS
   ========================================================================== */

.links_container-main,
.links_container_center,
.links_container-main-side-img {
  display: inline-block;
}

.links_container_side {
  display: grid;
  gap: var(--gap-m);
  margin-bottom: var(--gap-m);
}

.links_container-main           { grid-template-columns: repeat(4, 1fr); }
.links_container_center,
.links_container-main-side-img  { grid-template-columns: repeat(3, 1fr); }
.links_container_side           { grid-template-columns: 1fr; }

@media (max-width: 980px) {
  .links_container-main,
  .links_container_center,
  .links_container-main-side-img { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .links_container-main,
  .links_container_center,
  .links_container-main-side-img { grid-template-columns: 1fr; }
}


/* ==========================================================================
   13. GALLERY
   ========================================================================== */

.image-container-gallery {
  display: flex;
  justify-content: center;
  align-items: center;
}

.book-gallery {
  display: flex;
  justify-content: center;
  align-items: center;
}

.book-gallery img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.shelf {
  width: 12%;
  height: 55vh;
  transition: all var(--transition-xslow);
  display: flex;
  justify-content: center;
  align-items: center;
}

.large-width {
  width: 100%;
  object-fit: fill;
  transition: all var(--transition-xslow);
}

.small-width {
  width: 10%;
  transition: all var(--transition-xslow);
}

@media only screen and (max-width: 600px) {
  .image-container-gallery  { display: block; }
  .book-gallery             { height: auto; display: block; }
  .shelf                    { width: 100%; height: 3vh; }
  .large-width              { width: 100%; height: 271px; object-fit: fill; transition: all var(--transition-xslow); }
}

/* Slick Dots */
.slick-dots li button:before {
  font-family: 'slick';
  font-size: 14px !important;
  line-height: 20px;
  position: absolute;
  top: 0; left: 0;
  width: 20px; height: 20px;
  content: '•';
  text-align: center;
  opacity: .25;
  color: var(--color-navy);
  -webkit-font-smoothing: antialiased;
}

/* Gallery Grid: Centre (4-col) */
.gallery-page-container-center ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: var(--gap-m);
  list-style-type: none;
  padding: 0;
}

@media only screen and (max-width: 980px) {
  .gallery-page-container-center ul { grid-template-columns: repeat(3, 1fr); }
}

.gallery-page-container-center ul li a img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-m);
  transition: transform var(--transition-slow);
}

.gallery-page-container-center ul li img:hover { transform: scale(1.04); }

/* Gallery Grid: Right (3-col) */
.gallery-page-container-right ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: var(--gap-s);
  list-style-type: none;
  padding: 0;
}

.gallery-page-container-right ul li img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-m);
  transition: transform var(--transition-slow);
}

.gallery-page-container-right ul li img:hover { transform: scale(1.04); }

.gallery-page-container-right ul li a img { width: 100%; }

/* Gallery Carousel */
.gallery-page-container-right-carousel {
  max-width: 100%;
  overflow: hidden;
  margin: 0 auto;
}

.gallery-page-container-right-carousel ul {
  display: flex;
  justify-content: center;
  gap: var(--gap-m);
  list-style: none;
  padding: 0;
  margin: 0;
}

.gallery-page-container-right-carousel ul li {
  box-sizing: border-box;
  position: relative;
}

.gallery-page-container-right-carousel ul li a img,
.gallery-page-container-right-carousel ul li img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-m);
  transition: transform var(--transition-slow);
}

.gallery-page-container-right-carousel ul li img:hover { transform: scale(1.04); }

.gallery-page-container-right-carousel .slick-slide {
  margin-left: 5px;
  margin-right: 5px;
}

/* Masonry Gallery */
.gallery-page-container ul {
  column-count: 4;
  column-gap: var(--gap-m);
  list-style: none;
  padding: 0;
}

@media only screen and (max-width: 980px) {
  .gallery-page-container ul { column-count: 3; }
}

.gallery-page-container ul li {
  break-inside: avoid;
  margin-bottom: var(--gap-m);
}

.gallery-page-container ul li a img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-m);
  transition: transform var(--transition-slow);
}

.gallery-page-container ul li img:hover { transform: scale(1.04); }


/* ==========================================================================
   14. SCROLL ANIMATIONS
   ========================================================================== */

.fade-slide-right {
  opacity: 0;
  transform: translateX(100%);
  transition: transform 1s ease-out, opacity 1s ease-out;
}

.fade-slide-right.visible {
  opacity: 1;
  transform: translateX(0);
}

.fade-slide-left {
  opacity: 0;
  transform: translateX(-100%);
  transition: transform 1s ease-out, opacity 1s ease-out;
}

.fade-slide-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.fade-in {
  opacity: 0;
  transition: opacity 1s ease-in;
}

.fade-in.visible { opacity: 1; }


/* ==========================================================================
   15. BLOG SINGLE — SHARED UTILITIES
   ========================================================================== */

.single-post__cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.single-post__cat-tag {
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  font-size: 11px;
  font-family: 'Inter', sans-serif;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none;
  backdrop-filter: blur(6px);
  transition: background var(--transition-fast), border-color var(--transition-fast);
}

.single-post__cat-tag:hover {
  background: rgba(203, 54, 50, 0.70);
  border-color: rgba(203, 54, 50, 0.80);
}

.single-post__byline {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  opacity: 0.85;
}

.single-post__date {
  margin-top: 10px;
  opacity: 0.88;
  font-size: 14px;
  color: white;
  font-weight: var(--weight-bold);
}

/* Layout */
.single-post__layout { align-items: start; }

.single-post__article { margin-bottom: 44px; }

.single-post__content {
  font-size: var(--step-0);
  line-height: var(--leading-loose);
  color: var(--text-body-light);
  background: var(--color-white);
  border-radius: var(--radius-xl);
  padding: var(--space-xl);
  box-shadow: var(--shadow-m);
  border: 1px solid rgba(31, 58, 137, 0.08);
}

.single-post__content img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-m);
  margin: var(--space-l) 0;
}

.single-post__content blockquote {
  border-left: 4px solid var(--color-red);
  margin: var(--space-xl) 0;
  padding: var(--space-l) var(--space-xl);
  background: rgba(203, 54, 50, 0.05);
  border-radius: 0 var(--radius-m) var(--radius-m) 0;
  font-style: italic;
  color: var(--text-secondary-light);
}

/* Gallery section */
.single-post__gallery-section {
  margin-bottom: 44px;
  background: var(--color-white);
  border-radius: var(--radius-xl);
  padding: var(--space-xl);
  box-shadow: var(--shadow-m);
  border: 1px solid rgba(31, 58, 137, 0.08);
}

.single-post__gallery-heading {
  font-family: 'Poppins', sans-serif !important;
  font-size: var(--step-2) !important;
  color: var(--color-navy) !important;
  text-transform: uppercase !important;
  line-height: 1.1 !important;
  margin: 0 0 var(--space-l) !important;
  padding: 0 !important;
}

.single-post__gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--gap-m);
}

.single-post__gallery-item {
  position: relative;
  display: block;
  border-radius: var(--radius-l);
  overflow: hidden;
  box-shadow: var(--shadow-s);
  aspect-ratio: 4 / 3;
  background: var(--grey-200);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
}

.single-post__gallery-item img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.single-post__gallery-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-l);
}

.single-post__gallery-item:hover img { transform: scale(1.06); }

.single-post__gallery-overlay {
  position: absolute;
  inset: 0;
  background: rgba(31, 58, 137, 0.50);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity var(--transition-slow);
  color: #fff;
}

.single-post__gallery-item:hover .single-post__gallery-overlay { opacity: 1; }

.single-post__gallery-section .gallery ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  list-style: none;
  padding: 0;
}

.single-post__gallery-section .gallery ul li img {
  width: 100%;
  height: 155px;
  object-fit: cover;
  border-radius: var(--radius-m);
}

@media (max-width: 600px) {
  .single-post__gallery-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 360px) {
  .single-post__gallery-grid { grid-template-columns: 1fr; }
}

/* Post links / resources */
.single-post__links-section {
  margin-bottom: 44px;
  padding: var(--space-xl);
  background: var(--color-bg-light);
  border-radius: var(--radius-xl);
  border: 1px solid rgba(31, 58, 137, 0.12);
}

.single-post__links-heading { margin-bottom: var(--space-l) !important; }

.single-post__links-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.single-post__link-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 11px 18px;
  border-radius: var(--radius-l);
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: var(--weight-semibold);
  text-decoration: none !important;
  transition: transform var(--transition-slow),
              box-shadow var(--transition-slow),
              background var(--transition-slow);
  cursor: pointer;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.single-post__link-btn--file {
  background: var(--color-navy);
  color: #fff;
  box-shadow: var(--shadow-m);
}

.single-post__link-btn--file:hover {
  background: var(--color-red);
  transform: translateY(-2px);
  box-shadow: var(--shadow-l);
  color: #fff;
}

.single-post__link-btn--url {
  background: transparent;
  color: var(--color-navy);
  border: 1.5px solid var(--color-navy);
}

.single-post__link-btn--url:hover {
  background: var(--color-navy);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: var(--shadow-m);
}

.single-post__link-icon { display: flex; align-items: center; flex-shrink: 0; }
.single-post__link-label { flex: 1; overflow: hidden; text-overflow: ellipsis; }

.single-post__link-badge {
  display: inline-block;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: var(--weight-bold);
  letter-spacing: 0.5px;
  border-radius: 4px;
  background: rgba(255,255,255,0.22);
  color: #fff;
  flex-shrink: 0;
}

.single-post__link-arrow {
  margin-left: auto;
  font-size: 15px;
  flex-shrink: 0;
  transition: transform var(--transition-slow);
}

.single-post__link-btn--url:hover .single-post__link-arrow {
  transform: translateX(4px) translateY(-4px);
}

/* Tags */
.single-post__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 38px;
}

.single-post__tag {
  display: inline-block;
  padding: 4px 13px;
  border-radius: var(--radius-pill);
  background: rgba(31, 58, 137, 0.07);
  border: 1px solid rgba(31, 58, 137, 0.18);
  color: var(--color-navy);
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: var(--weight-medium);
  text-decoration: none !important;
  transition: background var(--transition-fast), color var(--transition-fast);
}

.single-post__tag:hover {
  background: var(--color-red);
  color: #fff;
  border-color: transparent;
}

/* Author card */
.single-post__author-card {
  display: flex;
  align-items: flex-start;
  gap: var(--space-l);
  padding: var(--space-xl);
  background: var(--color-bg-light);
  border-radius: var(--radius-xl);
  border: 1px solid rgba(31, 58, 137, 0.12);
  margin-bottom: 38px;
  box-shadow: var(--shadow-xs);
}

.single-post__author-avatar {
  width: 68px !important;
  height: 68px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  flex-shrink: 0;
  box-shadow: 0 0 0 3px var(--color-navy), 0 0 0 5px rgba(31, 58, 137, 0.15);
}

.single-post__author-info { flex: 1; }

.single-post__author-label {
  font-size: 10px;
  font-family: 'Inter', sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text-secondary-light);
  margin-bottom: 4px;
}

.single-post__author-name {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  color: var(--color-navy);
  margin-bottom: 5px;
  font-weight: var(--weight-bold);
}

.single-post__author-bio {
  font-size: 13px;
  font-family: 'Inter', sans-serif;
  color: var(--text-secondary-light);
  line-height: var(--leading-loose);
}

@media (max-width: 480px) {
  .single-post__author-card { flex-direction: column; align-items: center; text-align: center; }
}

/* Post navigation */
.single-post__nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap-l);
  margin-top: 8px;
}

.single-post__nav-link {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: var(--space-l);
  border-radius: var(--radius-xl);
  background: var(--color-white);
  border: 1px solid rgba(31, 58, 137, 0.12);
  text-decoration: none !important;
  transition: transform var(--transition-slow),
              box-shadow var(--transition-slow),
              border-color var(--transition-slow);
  min-width: 0;
}

.single-post__nav-link--next { text-align: right; }

.single-post__nav-link:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-m);
  border-color: var(--color-navy);
}

.single-post__nav-dir {
  font-size: 10px;
  font-family: 'Inter', sans-serif;
  font-weight: var(--weight-bold);
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--color-red);
}

.single-post__nav-title {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: var(--weight-semibold);
  color: var(--text-body-light);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 600px) {
  .single-post__nav { grid-template-columns: 1fr; }
  .single-post__nav-link--next { text-align: left; }
}

/* Sidebar */
.single-post__sidebar-inner {
  position: sticky;
  top: 28px;
  display: flex;
  flex-direction: column;
  gap: var(--gap-xl);
}

.single-post__sidebar-widget {
  background: var(--color-white);
  border-radius: var(--radius-xl);
  padding: var(--space-xl);
  box-shadow: var(--shadow-m);
  border: 1px solid rgba(31, 58, 137, 0.08);
}

.single-post__sidebar-title {
  font-family: 'Poppins', sans-serif !important;
  font-size: 14px !important;
  color: var(--color-navy) !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  margin-bottom: var(--space-l) !important;
  padding-bottom: var(--space-s) !important;
  border-bottom: 2px solid rgba(31, 58, 137, 0.12) !important;
}

/* Sidebar post cards */
.sidebar-post-card {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 11px 0;
  border-bottom: 1px solid var(--grey-200);
  text-decoration: none !important;
  transition: opacity var(--transition-fast);
}

.sidebar-post-card:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.sidebar-post-card:hover { opacity: 0.78; }

.sidebar-post-card__thumb {
  width: 64px;
  height: 52px;
  flex-shrink: 0;
  border-radius: var(--radius-m);
  overflow: hidden;
  background: var(--grey-200);
}

.sidebar-post-card__thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.28s ease;
}

.sidebar-post-card:hover .sidebar-post-card__thumb img { transform: scale(1.07); }

.sidebar-post-card__body { flex: 1; min-width: 0; }

.sidebar-post-card__date {
  font-size: 11px;
  font-family: 'Inter', sans-serif;
  color: var(--text-secondary-light);
  margin-bottom: 3px;
}

/* Legacy aliases for sidebar date / read */
.sidebar-date {
  font-size: 11px;
  opacity: 0.72;
  margin-bottom: 4px;
  display: block;
  color: var(--text-secondary-light);
}

span.sidebar-read {
  margin-top: 5px;
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: var(--weight-bold);
  color: var(--color-navy);
}

.sidebar-post-content { color: var(--color-navy); }

.sidebar-post-card__title {
  font-family: 'Poppins', sans-serif !important;
  font-size: 13px !important;
  color: var(--color-navy) !important;
  line-height: 1.3 !important;
  margin-bottom: 4px !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar-post-card__cta {
  font-size: 11px;
  font-family: 'Inter', sans-serif;
  font-weight: var(--weight-semibold);
  color: var(--color-red);
  transition: letter-spacing 0.2s ease;
}

.sidebar-post-card:hover .sidebar-post-card__cta { letter-spacing: 0.5px; }

.single-post__no-posts {
  font-size: 13px;
  color: var(--text-secondary-light);
  font-family: 'Inter', sans-serif;
}

/* Sidebar category list */
.single-post__sidebar-cats {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.single-post__sidebar-cats li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  border-radius: var(--radius-m);
  font-size: 13px;
  font-family: 'Inter', sans-serif;
  font-weight: var(--weight-medium);
  color: var(--text-body-light);
  text-decoration: none !important;
  transition: background var(--transition-fast), color var(--transition-fast);
}

.single-post__sidebar-cats li a:hover {
  background: rgba(31, 58, 137, 0.07);
  color: var(--color-navy);
}

.single-post__sidebar-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 21px;
  height: 21px;
  padding: 0 5px;
  border-radius: var(--radius-pill);
  background: rgba(31, 58, 137, 0.10);
  color: var(--color-navy);
  font-size: 10px;
  font-weight: var(--weight-bold);
}

@media (max-width: 980px) {
  .single-post__sidebar-inner { position: static; }
}

/* Sidebar legacy thumb */
.sidebar-post-thumb img {
  width: 58px;
  height: 58px;
  object-fit: cover;
  border-radius: var(--radius-m);
}

.sidebar-post-content strong {
  display: block;
  font-size: 13px;
}


/* ==========================================================================
   16. FACULTY & STAFF
   ========================================================================== */

.staff-profile__layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap-2xl);
  align-items: start;
  width: var(--row-width);
  max-width: var(--row-wide);
  margin: auto;
}

@media (max-width: 980px) {
  .staff-profile__layout { grid-template-columns: 1fr; }
}

/* Sidebar */
.staff-profile__sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--gap-xl);
  position: sticky;
  top: 28px;
}

@media (max-width: 980px) {
  .staff-profile__sidebar { position: static; }
}

/* Photo */
.staff-profile__photo-wrap {
  position: relative;
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-l);
  background: var(--grey-200);
  aspect-ratio: 3 / 4;
}

.staff-profile__photo {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  border-radius: var(--radius-xl);
  transition: transform 0.42s ease;
}

.staff-profile__photo-wrap:hover .staff-profile__photo { transform: scale(1.03); }

.staff-profile__photo-placeholder {
  width: 100%; height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(31, 58, 137, 0.12), rgba(45, 138, 222, 0.08));
  color: var(--color-navy);
  border-radius: var(--radius-xl);
  aspect-ratio: 3 / 4;
}

.staff-profile__position-badge {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 14px 16px;
  background: linear-gradient(0deg, rgba(31, 58, 137, 0.88) 0%, transparent 100%);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.3px;
  text-align: center;
}

/* Contact card */
.staff-profile__contact-card {
  background: var(--color-white);
  border-radius: var(--radius-xl);
  padding: var(--space-xl);
  box-shadow: var(--shadow-m);
  border: 1px solid rgba(31, 58, 137, 0.10);
}

.staff-profile__contact-heading {
  font-family: 'Poppins', sans-serif !important;
  font-size: 13px !important;
  color: var(--color-navy) !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  margin-bottom: var(--space-l) !important;
  padding-bottom: var(--space-s) !important;
  border-bottom: 2px solid rgba(31, 58, 137, 0.12) !important;
}

.staff-profile__contact-row {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 9px 0;
  border-bottom: 1px solid var(--grey-100);
}

.staff-profile__contact-row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.staff-profile__contact-icon {
  width: 30px; height: 30px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-m);
  background: rgba(31, 58, 137, 0.08);
  color: var(--color-navy);
  margin-top: 2px;
}

.staff-profile__contact-label {
  font-size: 10px !important;
  font-family: 'Inter', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  color: var(--text-secondary-light) !important;
  margin-bottom: 2px !important;
}

.staff-profile__contact-value {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: var(--weight-medium);
  color: var(--text-body-light);
  text-decoration: none !important;
  word-break: break-all;
  transition: color var(--transition-fast);
}

.staff-profile__contact-value:hover { color: var(--color-navy); }

/* Team / department tags */
.staff-profile__team-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 2px;
}

.staff-profile__team-tag {
  display: inline-block;
  padding: 3px 11px;
  border-radius: var(--radius-pill);
  background: rgba(31, 58, 137, 0.08);
  border: 1px solid rgba(31, 58, 137, 0.18);
  color: var(--color-navy);
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: var(--weight-semibold);
  text-decoration: none !important;
  transition: background var(--transition-fast), color var(--transition-fast);
}

.staff-profile__team-tag:hover {
  background: var(--color-navy);
  color: #fff;
  border-color: transparent;
}

/* Back link */
.staff-profile__back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: var(--weight-semibold);
  color: var(--color-navy);
  text-decoration: none !important;
  padding: 7px 0;
  transition: gap var(--transition-fast), color var(--transition-fast);
}

.staff-profile__back-link:hover {
  color: var(--color-red);
  gap: 3px;
}

/* Main content */
.staff-profile__main {
  display: flex;
  flex-direction: column;
  gap: var(--gap-xl);
}

.staff-profile__name-strip {
  gap: 12px;
  padding-bottom: var(--space-l);
  border-bottom: 2px solid rgba(31, 58, 137, 0.10);
}

.staff-profile__name {
  font-family: 'Poppins', sans-serif !important;
  font-size: clamp(1.6rem, 3.5vw, 2.6rem) !important;
  color: var(--color-navy) !important;
  text-transform: uppercase !important;
  line-height: 1.1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.staff-profile__role-chip {
  display: inline-block;
  padding: 5px 16px;
  border-radius: var(--radius-pill);
  background: linear-gradient(135deg, var(--color-navy), var(--color-blue));
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.3px;
  white-space: nowrap;
  box-shadow: var(--shadow-m);
  margin-top: 12px;
}

/* Biography */
.staff-profile__bio-wrap {
  background: var(--color-white);
  border-radius: var(--radius-xl);
  padding: var(--space-xl) var(--space-2xl);
  box-shadow: var(--shadow-s);
  border: 1px solid rgba(31, 58, 137, 0.08);
}

.staff-profile__section-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: var(--weight-bold) !important;
  text-transform: uppercase !important;
  letter-spacing: 1.2px !important;
  color: var(--color-navy) !important;
  margin-bottom: var(--space-l) !important;
  padding: 5px 13px !important;
  background: rgba(31, 58, 137, 0.07) !important;
  border: 1px solid rgba(31, 58, 137, 0.14) !important;
  border-radius: var(--radius-pill) !important;
}

.staff-profile__section-icon {
  display: flex;
  align-items: center;
}

.staff-profile__bio {
  font-size: var(--step-0);
  line-height: var(--leading-loose);
  color: var(--text-body-light);
}

.staff-profile__bio p { margin-bottom: 1.1em; }
.staff-profile__bio p:last-child { margin-bottom: 0; }
.staff-profile__bio img { max-width: 100%; height: auto; border-radius: var(--radius-m); }

.staff-profile__extra-content {
  font-size: var(--step-0);
  line-height: var(--leading-loose);
  color: var(--text-body-light);
}

/* Info chips */
.staff-profile__info-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.staff-profile__info-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 15px;
  border-radius: var(--radius-pill);
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: var(--weight-semibold);
  text-decoration: none !important;
  transition: transform var(--transition-slow),
              box-shadow var(--transition-slow),
              background var(--transition-slow);
}

.staff-profile__info-chip--email {
  background: rgba(31, 58, 137, 0.08);
  border: 1.5px solid rgba(31, 58, 137, 0.22);
  color: var(--color-navy);
}

.staff-profile__info-chip--email:hover {
  background: var(--color-navy);
  color: #fff;
  border-color: transparent;
  transform: translateY(-2px);
  box-shadow: var(--shadow-m);
}

.staff-profile__info-chip--phone {
  background: rgba(203, 54, 50, 0.07);
  border: 1.5px solid rgba(203, 54, 50, 0.20);
  color: var(--color-red);
}

.staff-profile__info-chip--phone:hover {
  background: var(--color-red);
  color: #fff;
  border-color: transparent;
  transform: translateY(-2px);
  box-shadow: var(--shadow-m);
}

/* Responsive */
@media (max-width: 980px) {
  .staff-profile__photo-wrap {
    max-width: 320px;
    margin: 0 auto;
  }
  .staff-profile__name-strip {
    justify-content: center;
    text-align: center;
  }
  .staff-profile__name {
    text-align: center !important;
    width: 100%;
  }
}

@media (max-width: 600px) {
  .staff-profile__bio-wrap { padding: var(--space-l); }
  .staff-profile__info-strip { flex-direction: column; }
  .staff-profile__info-chip { width: 100%; justify-content: center; }
}

/* Related staff list */
.staff-related-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.staff-related-list li {
  padding: 9px 0;
  border-bottom: 1px solid var(--grey-100);
}

.staff-related-list li a {
  text-decoration: none;
  font-weight: var(--weight-semibold);
  color: var(--color-navy);
  transition: color var(--transition-fast);
  font-size: 14px;
}

.staff-related-list li a:hover { color: var(--color-red); }


/* ==========================================================================
   CATEGORY GRID
   ========================================================================== */

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

@media (max-width: 900px) { .category-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .category-grid { grid-template-columns: 1fr; } }

.category-card {
  background: var(--color-white);
  border-radius: var(--radius-xl);
  overflow: hidden;
  text-decoration: none;
  box-shadow: var(--shadow-m);
  border: 1px solid rgba(31, 58, 137, 0.08);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
}

.category-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-l);
}

.category-card__image img {
  width: 100%;
  height: 175px;
  object-fit: cover;
}

.category-card__content { padding: 15px; }

.category-card__content h3 {
  margin: 0 0 6px;
  color: var(--color-navy);
  font-size: var(--step-0);
  font-weight: var(--weight-bold);
}


/* ==========================================================================
   NEWSLETTERS
   ========================================================================== */

.newsletters-main-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 18px;
  background: var(--color-white);
  border-radius: var(--radius-xl);
  padding: var(--space-xl);
  box-shadow: var(--shadow-m);
  border: 1px solid rgba(31, 58, 137, 0.08);
}

@media only screen and (max-width: 450px) {
  .newsletters-main-container { grid-template-columns: 1fr; }
}

.newsletters-main-container a {
  border-radius: var(--btn-radius);
  padding: 0.80rem 1.5rem;
  font-family: 'Poppins', sans-serif;
  font-size: 0.95rem;
  font-weight: var(--weight-bold);
  box-shadow: 0 4px 12px rgba(203, 54, 50, 0.25);
  cursor: pointer;
  transition: all var(--transition-base);
  background: var(--color-red);
  color: white !important;
  border: none;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.newsletters-main-container a:hover {
  background: var(--color-navy);
  color: white !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(31, 58, 137, 0.30);
}

/* Download buttons (legacy) */
.download-btn {
  display: block;
  padding: 11px 14px;
  background: var(--color-blue);
  color: #fff;
  text-align: center;
  border-radius: var(--radius-m);
  font-weight: var(--weight-bold);
  text-decoration: none;
  transition: background var(--transition-base);
}

.download-btn:hover { background: var(--color-navy); }

.download-btn--external { background: var(--color-navy); }
.download-btn--external:hover { background: var(--color-red); }


/* ==========================================================================
   MISC OVERRIDES
   ========================================================================== */

img.attachment-full.size-full.wp-post-image {
  width: 100%;
  height: auto;
}

section.tribe-common-l-container.tribe-events-l-container {
  padding: 0px !important;
}