/* ============================================
   1. CSS RESET
   ============================================ */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
}

a {
  color: inherit;
}

figure {
  margin: 0;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

input, button, textarea, select {
  font: inherit;
  color: inherit;
}

button {
  border: none;
  background: none;
  cursor: pointer;
}

a, button {
  transition: all 0.2s ease-in-out;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

[hidden] {
  display: none !important;
}

ol, ul {
  padding-left: 1.5rem;
}

/* ============================================
   2. CSS VARIABLES
   ============================================ */
:root {
  --color-black: #000000;
  --color-white: #ffffff;
  --color-light-blue: #DAF0FF;
  --color-dark-blue: #121C3A;
  --color-cream: #FFF9EA;
  --color-gray: #CACACA;
  --color-gray-2: #e6e6e6;
  --color-gray-3: #737373;
  --color-gray-4: #8f8f8f;
  --color-gray-5: #e1e1e1;
  --color-gray-6: #d2d2d2;
  --color-gray-7: #DADADA;
  --color-gray-light: #F4F4F4;
  --color-gray-dark: #262626;
  --color-black-1: #424242;  
  --color-pink: #FFDBDB;
  --color-blue: #4d597f;
  --color-base-light-semi: #e6d8d2;
  --color-base-light: #f5efec;
  --color-base-dark: #6c594f;
  --color-base: #947D74;
  --color-taupe: #BCAAA1;
  --color-map-north: #cbcaee;
  --color-map-latam: #cbe0aa;
  --color-map-africa: #bee7f5;
  --color-map-middle-east: #f7d8a6;
  --color-map-asia: #f2bdc1;
  --color-blue-strong: #004381;

  --Colors-Backgrounds-default: #F6F1EC;
  --Colors-Secondary-light: #C5CFED;
  --color-red: #C1272D;
  --color-red-dark: #A11217;
  --color-navy: #2B4288;
  --color-base-dark-ultra: #3F332E;
  --color-royal-blue: #4162C3;
  --color-blue-medium: #516EC8;
  --color-blue-soft: #778ED4;
  --color-blue-pale: #ECEFF9;
  --color-shadow-100: rgba(12, 12, 13, 0.05);
  --color-shadow-200: rgba(12, 12, 13, 0.1);
  --color-overlay: rgba(18, 28, 58, 0.6);
}

/* ============================================
   3. BASE STYLES
   ============================================ */
body {
  min-height: 100vh;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  /*background-color: var(--color-gray-light);*/
  background: var(--Colors-Backgrounds-default, #F6F1EC);
  color: var(--color-gray-dark);
  margin: 0;
  overflow-x: hidden;
  padding: 0;
}

/* ============================================
   5. UTILITY CLASSES
   ============================================ */
/* Background Colors */
.bg-transparent { background: transparent !important; }
.bg-white { background: var(--color-white) !important; }
.bg-cream { background: var(--color-cream) !important; }
.bg-gray-light { background: var(--color-gray-light) !important; }
.bg-gray { background: var(--color-gray) !important; }
.bg-gray-2 { background: var(--color-gray-2) !important; } 
.bg-gray-3 { background: var(--color-gray-3) !important; } 
.bg-gray-4 { background: var(--color-gray-4) !important; }
.bg-gray-5 { background: var(--color-gray-5) !important; } 
.bg-pink { background: var(--color-pink) !important; }
.bg-blue { background: var(--color-blue) !important; }
.bg-blue-light { background: var(--color-light-blue) !important; }
.bg-secondary-light { background: var(--Colors-Secondary-light) !important; }

/* Margin Top */
body .mt-10 { margin-top: 10px !important; }
body .mt-12 { margin-top: 12px !important; }
body .mt-14 { margin-top: 14px !important; }
body .mt-16 { margin-top: 16px !important; }
body .mt-18 { margin-top: 18px !important; }
body .mt-20 { margin-top: 20px !important; }
body .mt-22 { margin-top: 22px !important; }
body .mt-24 { margin-top: 24px !important; }

/* Margin Bottom */
body .mb-10 { margin-bottom: 10px !important; }
body .mb-12 { margin-bottom: 12px !important; }
body .mb-14 { margin-bottom: 14px !important; }
body .mb-16 { margin-bottom: 16px !important; }
body .mb-18 { margin-bottom: 18px !important; }
body .mb-20 { margin-bottom: 20px !important; }
body .mb-22 { margin-bottom: 22px !important; }

/* Padding Top */
body .pt-0 { padding-top: 0px !important; }
body .pt-10 { padding-top: 10px !important; }
body .pt-12 { padding-top: 12px !important; }
body .pt-14 { padding-top: 14px !important; }
body .pt-16 { padding-top: 16px !important; }
body .pt-18 { padding-top: 18px !important; }
body .pt-20 { padding-top: 20px !important; }
body .pt-22 { padding-top: 22px !important; }
body .pt-24 { padding-top: 24px !important; }

/* Padding Bottom */
body .pb-0 { padding-bottom: 0px !important; }
body .pb-10 { padding-bottom: 10px !important; }
body .pb-12 { padding-bottom: 12px !important; }
body .pb-14 { padding-bottom: 14px !important; }
body .pb-16 { padding-bottom: 16px !important; }
body .pb-18 { padding-bottom: 18px !important; }
body .pb-20 { padding-bottom: 20px !important; }
body .pb-22 { padding-bottom: 22px !important; }
body .pb-24 { padding-bottom: 24px !important; }
body .pb-50 { padding-bottom: 50px !important; }

/* Padding Left */
body .pl-0 { padding-left: 0px !important; }
body .pl-10 { padding-left: 10px !important; }
body .pl-12 { padding-left: 12px !important; }
body .pl-14 { padding-left: 14px !important; }
body .pl-16 { padding-left: 16px !important; }
body .pl-18 { padding-left: 18px !important; }
body .pl-20 { padding-left: 20px !important; }
body .pl-22 { padding-left: 22px !important; }
body .pl-24 { padding-left: 24px !important; }

/* Padding Right */
body .pr-0 { padding-right: 0px !important; }
body .pr-10 { padding-right: 10px !important; }
body .pr-12 { padding-right: 12px !important; }
body .pr-14 { padding-right: 14px !important; }
body .pr-16 { padding-right: 16px !important; }
body .pr-18 { padding-right: 18px !important; }
body .pr-20 { padding-right: 20px !important; }
body .pr-22 { padding-right: 22px !important; }
body .pr-24 { padding-right: 24px !important; }

/* All Padding */
body .p-16 { padding: 16px !important; }
body .p-24 { padding: 24px !important; }

/* Border Radius */
body .radius-8 { border-radius: 8px !important; }
body .radius-10 { border-radius: 10px !important; }
body .radius-16 { border-radius: 16px !important; }
body .radius-24 { border-radius: 24px !important; }
body .radius-32 { border-radius: 32px !important; }

.radius-8, .radius-10, .radius-16, .radius-24, .radius-32 {
  overflow: hidden;
}

/* Font Sizes */
.font-14 {
  font-size: 14px !important;
  line-height: 23px !important;
}
.font-16 { font-size: 16px !important; }
.font-17 { font-size: 17px !important; }
.font-18 { font-size: 18px !important; }
.font-22 { font-size: 22px !important; }
.font-24 { font-size: 24px !important; }
.font-26 { font-size: 26px !important; }

.font-14,
.font-16,
.font-17,
.font-18,
.font-22,
.font-24,
.font-26 {
  line-height: 1.7 !important;
}

/* Colors */
.color-white { color: var(--color-white) !important; }

/* Display Utilities */
.show-mobile-only { display: none !important; }
.text-center { text-align: center !important; }
.justify-center { justify-content: center !important; }
.h-full { height: 100%; }
.full-link {
  display: block;
  width: 100%;
  height: 100%;
}

/* ============================================
   6. BUTTONS
   ============================================ */
.btn {
  display: inline-block;
  text-decoration: none;
  padding: 10px 16px;
  border-radius: 8px;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  background: var(--color-black-1);
  border: 1px solid var(--color-black-1);
  color: var(--color-white);
}

.btn-primary {
  background: var(--color-gray-3) !important;
  border: 1px solid var(--color-gray-3);
}

.btn-dark {
  background: var(--color-black-1) !important;
  border: 1px solid var(--color-black-1);
}

.preview-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background-color: #737373;
  color: #ffffff;
  text-decoration: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  transition: background-color 0.2s ease;
}

.preview-btn:hover {
  background-color: #737373;
}

.preview-icon {
  width: 24px;
  height: 24px;
}

/* ============================================
   7. HEADER & NAVIGATION
   ============================================ */
section.logo-nav {
  padding: 28px 0;
}

section.logo-nav .row-grid {
  align-items: center;
  display: grid;
  grid-template-columns: 170px 1fr 250px;
}

section.logo-nav .row-grid-top{
  margin-bottom: 1.2rem;
}

nav.main-navigation ul.menu {
  align-items: center;
  display: flex;
  gap: 20px;
  justify-content: center;
  margin: 0;
  list-style: none;
  padding: 0;
}

nav.main-navigation ul.menu li {
  display: flex;
  font-size: 16px;
  font-weight: 500;
}

nav.main-navigation ul.menu ul.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 10px 15px;
    min-width: 200px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
    z-index: 1000;
}

nav.main-navigation ul.menu li.menu-item-has-children {
    position: relative;
}

nav.main-navigation ul.menu li.menu-item-has-children:hover > ul.sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

nav.main-navigation ul.menu ul.sub-menu li {
    display: block;
    width: 100%;
    padding: 6px;
}

nav.main-navigation ul.menu li.menu-item-has-children:after {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4gPHBhdGggZD0iTTguMTE5OTcgOS4yOTAwNkwxMiAxMy4xNzAxTDE1Ljg4IDkuMjkwMDZDMTYuMjcgOC45MDAwNiAxNi45IDguOTAwMDYgMTcuMjkgOS4yOTAwNkMxNy42OCA5LjY4MDA2IDE3LjY4IDEwLjMxMDEgMTcuMjkgMTAuNzAwMUwxMi43IDE1LjI5MDFDMTIuMzEgMTUuNjgwMSAxMS42OCAxNS42ODAxIDExLjI5IDE1LjI5MDFMNi42OTk5NyAxMC43MDAxQzYuMzA5OTcgMTAuMzEwMSA2LjMwOTk3IDkuNjgwMDYgNi42OTk5NyA5LjI5MDA2QzcuMDg5OTcgOC45MTAwNiA3LjcyOTk3IDguOTAwMDYgOC4xMTk5NyA5LjI5MDA2WiIgZmlsbD0iIzI2MjYyNiIvPiA8L3N2Zz4=);
  content: '';
  height: 24px;
  width: 24px;
  transform: rotate(0deg);
  transition: transform 0.3s ease;
}

body.home nav.main-navigation ul.menu li.menu-item-has-children:after {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4gPHBhdGggZD0iTTguMTE5OTcgOS4yOTAwNkwxMiAxMy4xNzAxTDE1Ljg4IDkuMjkwMDZDMTYuMjcgOC45MDAwNiAxNi45IDguOTAwMDYgMTcuMjkgOS4yOTAwNkMxNy42OCA5LjY4MDA2IDE3LjY4IDEwLjMxMDEgMTcuMjkgMTAuNzAwMUwxMi43IDE1LjI5MDFDMTIuMzEgMTUuNjgwMSAxMS42OCAxNS42ODAxIDExLjI5IDE1LjI5MDFMNi42OTk5NyAxMC43MDAxQzYuMzA5OTcgMTAuMzEwMSA2LjMwOTk3IDkuNjgwMDYgNi42OTk5NyA5LjI5MDA2QzcuMDg5OTcgOC45MTAwNiA3LjcyOTk3IDguOTAwMDYgOC4xMTk5NyA5LjI5MDA2WiIgZmlsbD0iI2ZmZmZmZiIvPiA8L3N2Zz4=);
  content: '';
  height: 24px;
  width: 24px;
  transform: rotate(0deg);
  transition: transform 0.3s ease;
}

nav.main-navigation ul.menu li.menu-item-has-children:hover:after {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
}

nav.main-navigation a {
  text-decoration: none;
}

.search-user {
  align-items: center;
  display: flex;
  justify-content: center;
}

form.search button,
form.search input,
form.search input:focus {
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  border: 0;
  margin: 0;
  padding: 0;
}

form.search input {
  font-size: 14px;
  padding-left: 5px!important;
}

body.home form.search input::placeholder,
body.category form.search input::placeholder,
body.tag form.search input::placeholder,
body.home form.search input,
body.category form.search input,
body.tag form.search input{
  color: white!important;
}

form.search button img {
  width: 35px;
}

form.search button:hover{
  background: transparent;
  opacity: 0.7;
}

form.search {
  background: white;
  border-radius: 40px;
  max-width: 155px;
  padding: 10px 10px;
}

body.home form.search,
body.category form.search,
body.tag form.search {
  background: transparent!important;
  border:1px solid white;
}

form.search.data {
  max-width: 100%;
  margin-left:auto;
  margin-right:auto;
}

form.search.data button{
  float:right
}
form.search.data input{
  width:93%;
}
form.search.data button img{
  width: 27px !important;
}

/* Hamburger Menu */
.hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  z-index: 1001;
  position: relative;
  transition: none;
}

.hamburger:hover {
  opacity: 0.7;
}

.hamburger svg {
  width: 28px;
  height: 28px;
  stroke: var(--color-gray-dark);
  display: block;
}

.hamburger-icon,
.close-icon {
  transition: opacity 0.2s ease-in-out;
}

.hamburger .close-icon {
  display: none;
  position: absolute;
  top: 8px;
  left: 8px;
}

.hamburger.active .hamburger-icon {
  display: none;
}

.hamburger.active .close-icon {
  display: block;
}

.mobile-menu-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 999;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mobile-menu-overlay.active {
  display: block;
  opacity: 1;
}

.hamburger-btn {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
}

.hamburger-btn svg {
  stroke: var(--color-gray-dark);
}
body.home .hamburger-btn svg {
  stroke: var(--color-white);
}

/* Mobile Off-Canvas Menu */
.mobile-menu-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  pointer-events: none;
}

.mobile-menu-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mobile-menu {
  position: absolute;
  top: 0;
  right: 0;
  width: 320px;
  max-width: 85%;
  height: 100%;
  background: var(--color-white);
  transform: translateX(100%);
  transition: transform 0.3s ease;
  overflow-y: auto;
  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
}

.mobile-menu-wrapper.active {
  pointer-events: auto;
}

.mobile-menu-wrapper.active .mobile-menu-overlay {
  opacity: 1;
}

.mobile-menu-wrapper.active .mobile-menu {
  transform: translateX(0);
}

.mobile-menu-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--color-gray-2);
}

.mobile-menu-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
}

.mobile-menu-close svg {
  stroke: var(--color-gray-dark);
}

.mobile-menu-nav {
  padding: 20px 0;
}

.mobile-menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-menu-list > li {
  border-bottom: 1px solid var(--color-gray-2);
}

.mobile-menu-list > li > a {
  display: block;
  padding: 16px 24px;
  color: var(--color-gray-dark);
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
}

.mobile-menu-list > li > a:hover {
  background: var(--color-gray-light);
}

.mobile-menu-list .has-submenu > a {
  position: relative;
  padding-right: 50px;
}

.mobile-menu-list .has-submenu > a::after {
  content: '+';
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  font-weight: 300;
  transition: transform 0.3s ease;
}

.mobile-menu-list .has-submenu.open > a::after {
  transform: translateY(-50%) rotate(45deg);
}

.mobile-submenu {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  background: var(--color-gray-light);
}

.mobile-menu-list .has-submenu.open .mobile-submenu {
  max-height: 500px;
}

.mobile-submenu li a {
  display: block;
  padding: 12px 24px 12px 40px;
  color: var(--color-gray-dark);
  text-decoration: none;
  font-size: 14px;
  font-weight: 400;
}

.mobile-submenu li a:hover {
  background: var(--color-white);
}

/* ================================================
   STYLE CUSTOM — container
   ================================================ */
.c-container,
.c-container-xxl,
.c-container-xl,
.c-container-lg,
.c-container-md,
.c-container-sm {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    max-width: 1310px;
    /* fluid side padding: 12px on mobile, growing to 24px on desktop */
    padding-right: clamp(0.75rem, 2vw, 1.5rem);
    padding-left: clamp(0.75rem, 2vw, 1.5rem);
    margin-right: auto;
    margin-left: auto;
}

/* sm — ≥576px */

/* md — ≥768px */

/* lg — ≥992px */

/* xl — ≥1200px */

/* xxl — ≥1400px */

/* ============================================
  TYPOGRAPHY
   ============================================ */
h1, h2, h3, h4, h5, h6, .h2 {
  color: var(--color-dark-blue);
  font-family: 'Cantata One', serif;
  font-weight: 400;
  line-height: 1.2;
  margin: 0;
  padding: 0;
}

h5, .h5, h6, .h6 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
}

.heavy-head {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.article-text h5,
.article-text h6 {
  font-family: 'Cantata One', serif;
  font-weight: 400;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  color: inherit;
  text-decoration: none;
}

h1, .h1, .main-headline { font-size: 40px; }
h2, .h2 { font-size: 26px !important; }
h3, .h3 { font-size: 21px !important; }
h4, .h4 { font-size: 18px !important; }
h5, .h5 { font-size: 16px !important; }
h6, .h6 { font-size: 13px !important; }

/* ============================================
   PAGE HEADLINE — single source of truth for
   the h1 title of every page. Never redefine
   font-size / line-height / letter-spacing of
   an h1 outside this block.
   ============================================ */
.page-headline h1 {
    font-family: 'Cantata One', serif;
    font-weight: 400;
    font-size: 40px;
    line-height: 1.2;
    letter-spacing: -0.03em;
    color: var(--color-dark-blue);
    margin: 0;
}

/* Centered title */
.page-headline--center {
    text-align: center;
}

/* Title over a dark hero */
.page-headline--light h1 {
    color: var(--color-white);
    position: relative;
}

/* Tablet */
@media (max-width: 1200px) {
    .page-headline h1 {
        font-size: 32px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .page-headline h1 {
        font-size: 28px;
    }
}

/* Reduced size — h2 scale. Declared after the media queries so it
   holds at every breakpoint. */
.page-headline--sm h1 {
    font-size: 26px;
}

.headline {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-top: 7px;
  padding-bottom: 30px;
}

.headline h2,
.wrap-headline h2 {
  color: var(--color-dark-blue);
  font-family: 'Montserrat', sans-serif;
  font-size: 26px !important;
  font-weight: 600;
  line-height: 34px;
}

/* ================================================
   VIDEO RATIO — 16/9 · 2/3
   ================================================ */
.ratio-16-9,
.ratio-2-3 {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.ratio-2-3 {
  aspect-ratio: 2 / 3;
}
.ratio-16-9 a,
.ratio-2-3 a {
  display: block;
  position: absolute;
  inset: 0;
}
.ratio-16-9 video,
.ratio-16-9 img,
.ratio-16-9 iframe,
.ratio-2-3 video,
.ratio-2-3 img,
.ratio-2-3 iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ================================================
   TOGGLE (solo prototipo)
   ================================================ */
.proto-toggle {
  display: flex;
  gap: 6px;
  justify-content: center;
  margin-bottom: 32px;
}
.proto-toggle button {
  background: #fff;
  border: 1px solid #BCAAA1;
  border-radius: 6px;
  cursor: pointer;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 500;
  padding: 6px 20px;
  transition: all 0.2s ease;
}
.proto-toggle button.active {
  background: #121C3A;
  border-color: #121C3A;
  color: #fff;
}

/* ================================================
   BUTTONS — base
   ================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #BCAAA1;
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.42px;
  color: #3F332E;
  background: transparent;
  white-space: nowrap;
  text-decoration: none;
  transition: all 0.5s;
}
.btn:active {
    text-decoration: none; 
}
.btn:hover, .btn:focus { 
    background:#516EC8;
    border: 1px solid #516EC8;
    color:white;
    text-decoration: none; 
}
.btn:active{ 
    background:#2B4288;
    border: 1px solid #2B4288;
    color:white;
    text-decoration: none; 
}
.btn svg { display: inline-block; vertical-align: middle; }
.btn svg path { transition: fill 0.5s; }
.btn:hover svg path, .btn:focus svg path{
    fill:white;
}
.btn-dark { background: #121C3A; color: #fff; border-color: #121C3A; }

/* ================================================
   BUTTONS — site-btn
   ================================================ */
.site-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border-radius: 8px;
  cursor: pointer;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.42px;
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.site-btn-outline {
  border: 1px solid #BCAAA1;
  color: #3F332E;
  padding: 8px 4px 8px 12px;
  background: transparent;
}
.site-btn-outline:hover { border-color: #947D74; }

/* ================================================
   POST CARD — base
   ================================================ */
.post-card {
  display: flex;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  padding: 8px;
  gap: 12px;
}

.post-card--video {
  background: transparent;
  padding: 0;
}

.post-thumb {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  flex-shrink: 0;
}
.post-thumb a {
  display: block;
  height: 100%;
}
.post-thumb img,
.post-thumb video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ============================================
   CARD IMAGE HOVER ZOOM
   Site-wide: the image grows while hovering the whole card
   ============================================ */
.post-thumb img,
.post-thumb video,
.card-image img,
.card-image video,
.bunny-poster,
.rp-card-thumb img,
.post-data-thumb img,
.ig-featured-thumb img,
.ig-card-thumb img,
.lv-card-thumb img,
.dt-card-image img,
.fa-card-photo img,
.fa-list-card-photo img,
.fa-hero-bg img,
.post-card-data-visual img,
.short-item img,
.short-item video {
    transition: transform 1.5s ease;
}

/* Needed so the scaled image stays clipped inside the wrapper */
.card-image {
    overflow: hidden;
}

.post-card:hover .post-thumb img,
.post-card:hover .post-thumb video,
.post-card-story:hover .post-thumb img,
.col-card:hover .post-thumb img,
.col-card:hover .post-thumb video,
.coverage-card:hover .post-thumb img,
.coverage-card:hover .post-thumb video,
.card:hover .card-image img,
.card:hover .card-image video,
.article-anchor-link:hover .card-image img,
.card-horizontal-data-hub:hover .card-image img,
.rp-card:hover .rp-card-thumb img,
.post-data:hover .post-data-thumb img,
.ig-featured:hover .ig-featured-thumb img,
.ig-card:hover .ig-card-thumb img,
.lv-card:hover .lv-card-thumb img,
.dt-card:hover .dt-card-image img,
.fa-card:hover .fa-card-photo img,
.fa-list-card:hover .fa-list-card-photo img,
.fa-hero:hover .fa-hero-bg img,
.story-featured:hover .post-thumb img,
.story-secondary:hover .post-thumb img,
.post-card-data:hover .post-card-data-visual img,
.short-item:hover img,
.short-item:hover video {
    transform: scale(1.08);
}

/* Card hover shadow — grid cards only. Cards living inside a horizontal
   scroller are left out: the track clips the shadow against its own edges.
   That rules out .rp-card, .col-card, .short-item and .dt-card entirely. */
.post-card,
.post-card-story,
.coverage-card,
.card,
.card-horizontal-data-hub,
.post-data,
.ig-featured,
.ig-card,
.lv-card,
.fa-card,
.fa-list-card,
.story-featured,
.story-secondary,
.post-card-data,
.article-anchor-link {
    transition: box-shadow 0.25s ease;
}

.post-card:hover,
.post-card-story:hover,
.coverage-card:hover,
.card:hover,
.card-horizontal-data-hub:hover,
.post-data:hover,
.ig-featured:hover,
.ig-card:hover,
.lv-card:hover,
.fa-card:hover,
.fa-list-card:hover,
.story-featured:hover,
.story-secondary:hover,
.post-card-data:hover,
.nl-card:hover,
.article-anchor-link:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

/* .card is used in both grids and carousels, so it is cancelled by context */
.hscroll-scroll .card:hover {
    box-shadow: none;
}

/* The video category hero is a layout block, not a grid card */
.vc-hero:hover {
    box-shadow: none;
}
.play-btn {
    content: '';
    position: absolute;
    width: 38px;
    height: 38px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiByeD0iMjQiIGZpbGw9IiM1MzUzNTMiIGZpbGwtb3BhY2l0eT0iMC43NSIvPgo8cGF0aCBkPSJNMjQgNEMxMi45NiA0IDQgMTIuOTYgNCAyNEM0IDM1LjA0IDEyLjk2IDQ0IDI0IDQ0QzM1LjA0IDQ0IDQ0IDM1LjA0IDQ0IDI0QzQ0IDEyLjk2IDM1LjA0IDQgMjQgNFpNMjAgMzFWMTdDMjAgMTYuMTggMjAuOTQgMTUuNyAyMS42IDE2LjJMMzAuOTQgMjMuMkMzMS40OCAyMy42IDMxLjQ4IDI0LjQgMzAuOTQgMjQuOEwyMS42IDMxLjhDMjAuOTQgMzIuMyAyMCAzMS44MiAyMCAzMVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 1;
    z-index: 10;
    bottom: 12px;
    right: 12px;
    transition: opacity 0.2s;
}
.play-btn.hidden {
    display: none;
}
/* The Bunny poster is injected by custom.js as a real <img>, so the site-wide
   hover zoom scales it. The <video> underneath sits at opacity 0 until play. */
.bunny-video-wrap {
    position: relative;
}
.bunny-poster {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.bunny-video-wrap:hover { cursor: pointer; }
.bunny-video-wrap:hover .play-btn { opacity: 0.7; }
.int-section--videos .card:hover .play-btn { opacity: 0.7; }
/* While the video plays the button turns into a plain pause icon (no circle)
   that only shows on hover, so it does not sit on top of the video. */
.play-btn.is-playing {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB4PSI1IiB5PSIzIiB3aWR0aD0iNSIgaGVpZ2h0PSIxOCIgcng9IjEuNSIgZmlsbD0id2hpdGUiLz48cmVjdCB4PSIxNCIgeT0iMyIgd2lkdGg9IjUiIGhlaWdodD0iMTgiIHJ4PSIxLjUiIGZpbGw9IndoaXRlIi8+PC9zdmc+);
    background-size: 24px 24px;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.5));
    opacity: 0;
}
.bunny-video-wrap:hover .play-btn.is-playing,
.int-section--videos .card:hover .play-btn.is-playing,
.video-viewer-media:hover .play-btn.is-playing { opacity: 0.7; }

.post-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.post-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 0;
  font-size: 13px;
}
.post-meta span {
  display: block;
}
.post-meta b,
.post-meta strong {
  font-weight: 600;
}
.post-avatar {
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
}
.post-meta-info {
  display: flex;
  flex-direction: column;
}
.post-author {
  font-size: 13px;
  color: #262626;
}
.post-role {
  font-size: 11px;
  font-weight: 600;
  font-style: italic;
  line-height: normal;
  color: #262626;
}
.post-meta--light .post-meta-info,
.post-meta--light .post-author,
.post-meta--light .post-role {
  color: white;
}
.post-title {
  font-family: 'Cantata One', serif;
  color: #121C3A;
  letter-spacing: -0.03em;
  line-height: 1.3;
}
.post-excerpt {
  font-size: 16px;
  color: #262626;
  line-height: 23px;
}

/* ================================================
   INT-SECTION — base compartida para todas las secciones
   ================================================ */
.int-section {
  max-width: 1312px;
  margin: 0 auto;
  width: 100%;
  padding-bottom: 60px;
}
section.int-section .hscroll-outer {
  border-radius: 16px;
  overflow: hidden;
}

/* ================================================
   MODULE VIDEOS — section
   ================================================ */

.section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 32px;
}
.section-header h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: 26px;
  font-weight: 600;
  color: #121C3A;
  line-height: 34px;
}

/* ================================================
   MODULE VIDEOS — vars + base
   ================================================ */
.int-section--videos {
  --vg-gap: 24px;
  --vg-radius: 16px;
  --vg-card-bg: #fff;
}
.int-section--videos .vg-card { cursor: pointer; }
.int-section--videos .card-link {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.int-section--videos .card-link:hover { text-decoration: none; color: inherit; }

.vl-heading {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-top: 1.25rem;
}

/* ================================================
   MODULE VIDEOS — version 1
   Layout: 2 columnas — left (main + featured) | right (grid 2x2)
   ================================================ */
.int-section--videos.version_1 .vg-body {
  display: flex;
  flex-direction: row;
  gap: var(--vg-gap);
  align-items: flex-start;
}
.int-section--videos.version_1 .vg-col-left {
  flex: 1 0 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--vg-gap);
}
.int-section--videos.version_1 .vg-col-right {
  flex: 1 0 0;
  min-width: 0;
}
.int-section--videos.version_1 .vg-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--vg-gap);
  align-content: flex-start;
}
.int-section--videos.version_1 .vg-grid .vg-card {
  flex: 1 0 calc(50% - 12px);
  min-width: 220px;
}
.int-section--videos.version_1 .vg-grid .post-thumb {
  aspect-ratio: 300 / 169;
}
.int-section--videos.version_1 .vg-main .card-title,
.int-section--videos.version_1 .vg-featured .card-title {
  font-size: 26px;
}
.int-section--videos.version_1 .vg-grid .card-title {
  font-size: 21px;
}

/* ================================================
   MODULE VIDEOS — version 2
   Layout: columna — main | featured | carousel
   ================================================ */
.int-section--videos.version_2 .vg-body {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
/* V2 main: vertical (imagen 100% arriba, body abajo) */
.int-section--videos.version_2 .vg-main .post-thumb {
  aspect-ratio: 16 / 9;
  width: 100%;
}
.int-section--videos.version_2 .vg-main .card-body {
  padding: 16px 24px;
}
.int-section--videos.version_2 .vg-main .card-title { font-size: 26px; }

/* V2 featured: horizontal 60/40 (imagen izq, body der) */
.int-section--videos.version_2 .vg-featured .card-link {
  flex-direction: row;
  align-items: stretch;
}
.int-section--videos.version_2 .vg-featured .card-image {
  flex: 0 0 60%;
  min-width: 0;
}
.int-section--videos.version_2 .vg-featured .card-body {
  flex: 0 0 40%;
  min-width: 0;
  padding: 16px 24px;
  justify-content: center;
}
.int-section--videos.version_2 .vg-featured .post-thumb {
  aspect-ratio: 689 / 388;
}
.int-section--videos.version_2 .vg-featured .card-title { font-size: 24px; }

/* Carousel (v2) — desktop: 4 columnas iguales, sin scroll */
.int-section--videos.version_2 .vg-carousel .hscroll-scroll {
  overflow-x: clip;
  scroll-snap-type: none;
  cursor: default;
}
.int-section--videos.version_2 .vg-carousel .hscroll-list {
  width: auto;
  gap: var(--vg-gap);
  padding-bottom: 24px;
}
.int-section--videos.version_2 .vg-carousel .vg-card {
  flex: 1 1 0;
  min-width: 0;
}
/* Desktop: only the first 4 cards */
.int-section--videos.version_2 .vg-carousel .vg-card:nth-child(n+5) {
  display: none;
}
.int-section--videos.version_2 .vg-carousel .post-thumb {
  aspect-ratio: 16 / 9;
}
.int-section--videos.version_2 .vg-carousel .card-title {
  font-size: 18px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.int-section--videos.version_2 .vg-carousel .card-text {
  display: -webkit-box;
  -webkit-line-clamp: 7;
  line-clamp: 7;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ================================================
   MODULE VIDEOS — card overrides
   ================================================ */
.int-section--videos .card {
  border: none;
  border-radius: 16px;
  overflow: hidden;
  padding: 8px;
  background: #fff;
}
.int-section--videos .post-thumb .card-img-top {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 12px;
}
.int-section--videos .card-body {
  padding: 8px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 auto;
}
.int-section--videos .card-title {
  font-family: 'Cantata One', serif;
  color: #121C3A;
  letter-spacing: -0.03em;
  line-height: 1.3;
  margin-bottom: 0;
}
.int-section--videos .card-title.h2 { font-size: 26px; }
.int-section--videos .card-title.h3 { font-size: 21px; }
.int-section--videos .card-text {
  font-size: 16px;
  font-weight: 400;
  color: #262626;
  line-height: 23px;
  margin-bottom: 0;
}

.btn svg { margin-left: 8px; }
.btn svg path { fill: #3F332E; }

/* ================================================
   BUTTONS — gravity forms submit
   ================================================ */
.gform_wrapper .gform_footer,
.gform_wrapper .gform_page_footer {
    display: flex;
    justify-content: flex-end;
}
.btn-submit {
    gap: 10px;
    border: 1px solid var(--color-navy);
    background: var(--color-navy);
    color: var(--color-white);
    font-size: 18px;
    padding: 0.75rem 1.25rem;
    margin-top: 0rem;
    letter-spacing: normal;
}
.btn-submit svg {
    width: 20px;
    height: 20px;
    margin-left: 0;
}
.btn-submit svg path,
.btn-submit:hover svg path,
.btn-submit:focus svg path {
    fill: currentColor;
}
.btn-submit:hover,
.btn-submit:focus,
.btn-submit:active {
    opacity: 0.7;
    outline: none;
    border: 1px solid var(--color-navy);
    background: var(--color-navy);
    color: var(--color-white);
}

/* ================================================
   FORMS — gravity forms fields
   ================================================ */
.gform_wrapper .gfield input[type="text"],
.gform_wrapper .gfield input[type="email"],
.gform_wrapper .gfield input[type="tel"],
.gform_wrapper .gfield input[type="url"],
.gform_wrapper .gfield input[type="number"],
.gform_wrapper .gfield input[type="password"],
.gform_wrapper .gfield input[type="date"],
.gform_wrapper .gfield textarea,
.gform_wrapper .gfield select {
    border: 1px solid var(--color-base-light-semi);
    border-radius: 8px;
    background: var(--color-white);
}
.gform_wrapper .gfield input:focus,
.gform_wrapper .gfield textarea:focus,
.gform_wrapper .gfield select:focus {
    outline: none;
    box-shadow: none;
    border-color: var(--color-navy);
}

/* ================================================
   FORMS — gravity forms select
   ================================================ */
.gform_wrapper .ginput_container_select {
    position: relative;
}
.gform_wrapper .ginput_container_select::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    width: 12px;
    height: 7px;
    transform: translateY(-50%);
    background-color: var(--color-gray-3);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 7'%3E%3Cpath d='M1.41.295 6 4.875 10.59.295 12 1.705l-6 6-6-6z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 7'%3E%3Cpath d='M1.41.295 6 4.875 10.59.295 12 1.705l-6 6-6-6z'/%3E%3C/svg%3E") no-repeat center / contain;
    pointer-events: none;
}
.gform_wrapper .ginput_container_select select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 3rem;
}

.position-relative {
    position: relative !important;
}
.w-100{
    width:100% !important;
}

/* ================================================
   MODULE VIDEOS — tablet 768px–1200px
   ================================================ */

/* ================================================
   MODULE VIDEOS — mobile ≤767px
   ================================================ */

/* ================================================
   MODULE VIDEOS — popup
   ================================================ */
.video-popup {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.video-popup.is-open { display: flex; }
.video-popup-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
  cursor: pointer;
}
.video-popup-inner {
  position: relative;
  width: 100%;
  max-width: 960px;
  background: #000;
  border-radius: 12px;
  overflow: hidden;
}
.video-popup-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  background: #fff;
}
.video-popup-title {
  margin: 0;
  font-family: 'Cantata One', serif;
  font-size: 16px;
  line-height: 1.3;
  color: #121C3A;
  flex: 1;
  min-width: 0;
}
.video-popup-video {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}
.video-popup-video video {
  width: 100%;
  height: 100%;
  display: block;
}
.video-popup-close {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s;
}
.video-popup-close svg { display: block; fill: none; }
.video-popup-close svg path { stroke: #666; fill: none; stroke-width: 2; stroke-linecap: round; }
.video-popup-close:hover { background: #f0f0f0; }
.video-popup-close:hover svg path { stroke: #000; }
body.video-popup-open { overflow: hidden; }

/* ============================================
   DATA TOOLS — V1 / V2
   ============================================ */

/* Outer container */
.dt-outer {
  border-radius: 24px;
  overflow: hidden;
  position: relative;
}

/* BG decoration (V2 desktop) */
.dt-bg-img {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 450px;
  height: 450px;
  pointer-events: none;
  z-index: 0;
}
.dt-bg-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: bottom right;
  transition: opacity 0.3s ease;
}

/* Intro column */
.dt-intro { position: relative; z-index: 1; }
.dt-intro-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Nav buttons — carousel (shared) */
.carousel-nav { display: flex; gap: 16px; align-items: center; }
.carousel-btn {
  align-items: center;
  background: transparent;
  border: 1px solid #947D74;
  border-radius: 32px;
  cursor: pointer;
  display: flex;
  height: 32px;
  justify-content: center;
  overflow:hidden;
  padding: 4px;
  transition: background 0.2s ease;
  width: 32px;
}
.carousel-btn:hover { background: #fff; overflow:hidden; border-radius: 16px; }
.carousel-btn svg { display: block; }
.carousel-btn svg path { 
    fill: none; 
    stroke: #6C594F; 
    stroke-width: 2; 
}
.carousel-btn:hover svg path { 
    stroke: #6C594F; 
}
.carousel-btn:focus,
.carousel-btn.is-active {
    border: 1px solid #6C594F;
    background: #6C594F;
}
.carousel-btn:focus svg path,
.carousel-btn.is-active svg path {
    stroke: #fff;
}
/* Slideshow pause button: shows pause while rotating, play once paused */
.carousel-pause .icon-play,
.carousel-pause.is-paused .icon-pause {
    display: none;
}
.carousel-pause.is-paused .icon-play {
    display: block;
}

/* Scroll + list */
.dt-scroll { position: relative; z-index: 1; }
.dt-list { display: flex; }

/* Card base */
.dt-card {
  background: #fff;
  border-radius: 16px;
  display: flex;
  overflow: hidden;
  flex-shrink: 0;
  text-decoration: none;
}
.dt-card:hover, .dt-card:focus { text-decoration: none; }
.dt-card-image { overflow: hidden; flex-shrink: 0; }
.dt-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dt-card-body { display: flex; flex-direction: column; gap: 4px; }
.dt-card-body h3 {
  font-family: 'Cantata One', serif;
  font-size: 21px !important;
  font-weight: 400;
  color: var(--color-dark-blue);
  letter-spacing: -0.63px;
  line-height: 1.3;
  text-decoration: none !important;
}
.dt-card-body p {
  font-size: 14px;
  font-weight: 400;
  color: var(--color-gray-dark);
  line-height: 20px;
  text-decoration: none !important;
}

/* CTA "See all" */
.dt-cta { display: flex; justify-content: center; align-items: center; }
.dt-cta-btn {
  align-items: center;
  background: transparent;
  border: 1px solid #BCAAA1;
  border-radius: 8px;
  color: #3F332E;
  display: inline-flex;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 500;
  gap: 12px;
  letter-spacing: -0.42px;
  line-height: 1.3;
  padding: 8px 10px 8px 12px;
  transition: background 0.2s ease;
  white-space: nowrap;
}
.dt-cta-btn:hover { background: rgba(188, 170, 161, 0.18); }
.dt-cta-btn, .dt-cta-btn:hover, .dt-cta-btn:focus { text-decoration: none; color: #3F332E; }
.dt-cta-btn img { width: 24px; height: 24px; }
.dt-cta-btn svg { width: 14px; height: 14px; fill: none; color: inherit; }
.dt-cta-btn svg path{ fill: #343434; }

/* ------------------------------------------
   VERSION 1 — horizontal carousel
   ------------------------------------------ */
/* The inline start padding lives on the outer container so the slider
   shares it and scrolled cards stay hidden behind it */
.version-1 .dt-outer {
    background: #e6d8d2;
    display: flex;
    flex-direction: column;
    padding: 1.5rem 0 3.75rem;
    position: relative;
}
.version-1 .dt-bg-img { display: none; }
.version-1 .dt-intro {
    display: flex;
    flex-direction: column;
    padding: 0 1.5rem 1rem;
    width: 100%;
    position: static;
}
.version-1 .dt-intro-top { width: 100%; justify-content: center; }
.version-1 .dt-intro-text {
    max-width: 660px;
    margin: 0 auto;
    text-align: center;
}
.version-1 .carousel-nav {
    display: flex;
    position: absolute;
    bottom: 24px;
    right: 24px;
}
.version-1 .dt-scroll {
  overflow-x: auto;
  overflow-y: clip;
  width: 100%;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.version-1 .dt-scroll::-webkit-scrollbar { display: none; }
.version-1 .dt-list {
  flex-direction: row;
  gap: 24px;
  padding: 0 0 1.25rem 1.5rem;
  width: 100%;
}

/* End-of-scroll stop on the right. It has to be a real flex item: a
   padding-inline-end or a margin on the last card gets dropped from
   scrollWidth once the children overflow the track.
   The negative start margin cancels the list gap. */
.version-1 .dt-list::after {
  content: '';
  flex: 0 0 1.5rem;
  margin-inline-start: -24px;
}

/* Desktop: 3 cards + 1/5 */
.version-1 .dt-card {
  flex-direction: column;
  width: calc((100% - 72px) / 3.2);
}
.version-1 .dt-card-image {
  aspect-ratio: 379 / 213;
  width: 100%;
  border-radius: 16px 16px 0 0;
}
.version-1 .dt-card-body { padding: 16px 16px 24px; gap: 12px; }
.version-1 .dt-card-body p {
  line-height: 23px;
  display: -webkit-box;
  -webkit-line-clamp: 9;
  line-clamp: 9;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.version-1 .dt-cta { display: none; }

/* ------------------------------------------
   VERSION 2 — vertical list + intro col
   ------------------------------------------ */
.version-2 .dt-outer {
  background: #F7D8A6;
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: flex-start;
  padding: 0 0 0 24px;
  min-height: 423px;
}
.version-2 .dt-bg-img { display: block; }
.version-2 .dt-intro {
  flex: 0 0 255px;
  width: 255px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 24px 0;
}
.version-2 .dt-intro-top { justify-content: flex-start; }
.version-2 .dt-intro h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: 26px !important;
  font-weight: 600;
  color: var(--color-dark-blue);
  text-transform: uppercase;
  line-height: 34px;
}
.dt-intro-text {
    display: -webkit-box;
    -webkit-line-clamp: 13;
    line-clamp: 13;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 14px !important;
    line-height: 23px !important;
    color: var(--color-gray-dark);
    font-weight: 400;
}
.dt-intro-text p {
    font-size: 14px !important;
    line-height: 23px !important;
    color: var(--color-gray-dark);
    font-weight: 400 !important;
}
.version-2 .carousel-nav { display: none; }
.version-2 .dt-scroll {
  flex: 0 0 621px;
  width: 621px;
  max-height: 423px;
  overflow-x: clip;
  overflow-y: auto;
}
.version-2 .dt-scroll::-webkit-scrollbar { width: 4px; }
.version-2 .dt-scroll::-webkit-scrollbar-thumb {
  background: rgba(63, 51, 46, 0.3);
  border-radius: 4px;
}
.version-2 .dt-list { flex-direction: column; gap: 4px; padding: 24px 0; }
.version-2 .dt-card {
  flex-direction: row;
  align-items: stretch;
  width: 600px;
  height: 99px;
  transition: width 0.25s ease, box-shadow 0.25s ease;
}
.version-2 .dt-card:hover { width: 616px; }
.version-2 .dt-card-image {
  aspect-ratio: 379 / 213;
  align-self: stretch;
  border-radius: 8px 0 0 8px;
}
.version-2 .dt-card-body {
  flex: 1;
  justify-content: center;
  padding: 4px 16px 4px 12px;
  min-width: 0;
}
.version-2 .dt-card-body p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.version-2 .dt-cta { padding: 8px 0; }

/* ================================================
   MODULE FEATURED ANALYSIS
   ================================================ */

/* Variante section */
.int-section--analysis {
  padding: 48px 24px;
}

/* ================================================
   MODULE RESEARCH COMMENTARY GLOBAL
   ================================================ */

.fa-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    background: #c5cfed;
    padding: 64px 48px;
}

.fa-bg {
    position: absolute;
    inset: 0;
    width: 75%;
    z-index: 0;
    overflow: hidden;
}

.fa-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(2px);
    transition: transform 2s ease;
}

.fa-wrapper:hover .fa-bg img {
    transform: scale(1.15);
}

.fa-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(31, 47, 97, 0.75);
}

.fa-left {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 320px;
}

.fa-left .wrap-headline h2 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 26px;
    line-height: 34px;
    color: white;
}

.fa-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fa-left h3 {
    font-family: 'Cantata One', serif;
    font-size: 40px!important;
    line-height: 48px;
    letter-spacing: -1.2px;
    color: white;
    font-weight: 400;
}

.fa-left h3 a {
    color: white;
}

.fa-right {
    position: relative;
    z-index: 1;
    background: white;
    border-radius: 8px;
    padding: 32px 48px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-end;
}

.fa-text {
    column-count: 2;
    column-gap: 24px;
    font-size: 14px;
    line-height: 23px;
    color: #262626;
    width: 100%;
}

.btn-analysis {
    background: #b8141a;
    border-color: #b8141a;
    color: white;
}

.btn-analysis:hover,
.btn-analysis:focus {
    background: #E83037;
    border-color: #E83037;
}

.btn-analysis:active{
    background: #730D10;
    border-color: #730D10;
}

/* ================================================
   MODULE FEATURED ANALYSIS (Hero)
   ================================================ */

/* Section */
.int-section--featured-analysis {
    padding-bottom: 60px;
    padding-top: 2rem;
}

/* Primary: intro + hero (left column) */
.fa-primary {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    gap: 25px;
    min-width: 0;
}

/* Intro: h1 + description */
.fa-intro {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fa-intro .h2 {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    line-height: 48px;
    color: #121c3a;
    font-weight: 400;
}

.fa-intro .text p {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.4;
    color: #262626;
}

/* Cluster: 2 columns */
.fa-cluster {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

/* ---- HERO CARD (post #1) ---- */
.fa-hero {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    background: #c5cfed;
    padding: 48px;
}

.fa-hero-bg {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 711px;
    height: 500px;
    min-width: 300px;
    overflow: hidden;
}

.fa-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(2px);
}

.fa-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 500px;
    background: rgba(31, 47, 97, 0.75);
}

.fa-hero-top {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
}

.fa-hero-top .badge-category {
    margin-bottom: 0;
    background: white;
    color: #262626;
    font-size: 14px;
    font-weight: 600;
    align-self: flex-start;
}

.fa-hero-top h2, .fa-hero-top h3 {
    font-family: 'Cantata One', serif;
    font-size: 40px;
    line-height: 1.3;
    letter-spacing: -1.2px;
    color: white;
    font-weight: 400;
    margin-bottom: 2rem;
}

.fa-hero-top h3 a {
    color: inherit;
    text-decoration: none;
}

/* Hero article (white box) */
.fa-hero-article {
    position: relative;
    z-index: 1;
    background: white;
    border-radius: 8px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fa-hero-article .text {
    padding: 40px 48px;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: #262626;
}

/* Hero meta */
.fa-hero-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px 8px 8px;
    order: 2;
}

.fa-hero-meta .post-author {
    font-size: 11px;
}

.fa-hero-meta .post-role {
    font-size: 11px;
}

/* Dates */
.fa-dates {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 5px;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    color: #262626;
}

.fa-date-label {
    font-weight: 600;
    font-style: italic;
}

.fa-date-value {
    font-weight: 400;
}

/* ---- OTHERS (posts #2-5) ---- */
.fa-others {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding-top: 66px;
}

/* Inline: 2 vertical cards side by side */
.fa-inline {
    display: flex;
    gap: 24px;
}

/* Stacked: horizontal cards */
.fa-stacked {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* ---- CARD VERTICAL ---- */
.fa-card--vertical {
    flex: 1 1 0;
    border-radius: 16px;
    overflow: hidden;
    background: #c5cfed;
}

.fa-card--vertical > a {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    height: 100%;
}

.fa-card--vertical .fa-card-photo {
    position: relative;
    height: 212px;
    overflow: hidden;
}

.fa-card--vertical .fa-card-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fa-card--vertical .fa-card-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(31, 47, 97, 0), rgba(31, 47, 97, 0.56));
}

.fa-card--vertical .fa-card-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 8px;
    background: white;
    border-radius: 8px;
    margin: -50px 8px 8px;
    flex: 1;
    position: relative;
    z-index: 1;
}

.fa-card--vertical h4,
.fa-card--vertical .h4 {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    line-height: 1.3;
    letter-spacing: -0.78px;
    color: #121c3a;
    font-weight: 400;
}

.fa-card--vertical h4 a,
.fa-card--vertical .h4 a {
    color: inherit;
    text-decoration: none;
}

.fa-card-excerpt {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: #262626;
}

/* ---- CARD HORIZONTAL ---- */
.fa-card--horizontal {
    border-radius: 16px;
    overflow: hidden;
    background: #c5cfed;
}

.fa-card--horizontal > a {
    display: flex;
    text-decoration: none;
    color: inherit;
    padding: 8px;
    position: relative;
}

.fa-card--horizontal .fa-card-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 4px 8px;
    background: white;
    border-radius: 8px;
    flex: 1;
    z-index: 1;
    margin-right: 195px;
}

.fa-card--horizontal h4 {
    font-family: 'Cantata One', serif;
    font-size: 21px;
    line-height: 1.3;
    letter-spacing: -0.63px;
    color: #121c3a;
    font-weight: 400;
}

.fa-card--horizontal h4 a {
    color: inherit;
    text-decoration: none;
}

.fa-card--horizontal .fa-card-photo {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 241px;
    height: 153px;
    overflow: hidden;
}

.fa-card--horizontal .fa-card-photo img {
    width: 100%;
    height: 110%;
    object-fit: cover;
    position: absolute;
    top: -5%;
}

.fa-card--horizontal .fa-card-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(to left, rgba(31, 47, 97, 0), rgba(31, 47, 97, 0.56));
}
.post-newsletter-analysis .c-container{
    padding-left: 0!important;
    padding-right: 0!important;
}

/* FEATURED ANALYSIS — TABLET (768 – 1200px) */

/* FEATURED ANALYSIS — MOBILE (≤ 767px) */

/* ================================================
   MODULE ANALYSIS LIST (Post grid)
   ================================================ */

.int-section--analysis-list {
    padding-top: 1.5rem;
    padding-bottom: 60px;
}

.analysis-filters .c-container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.analysis-filters .wrap-headline {
    text-align: center;
}

.analysis-filters .wrap-headline h2 {
    font-size: 21px !important;
    line-height: 29px;
    text-transform: uppercase;
}

.fa-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Card */
.fa-list-card {
    border-radius: 16px;
    overflow: hidden;
    background: #c5cfed;
}

.fa-list-card > a {
    display: flex;
    text-decoration: none;
    color: inherit;
    padding: 8px;
    position: relative;
    min-height: 160px;
}

.fa-list-card-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 4px 8px;
    background: white;
    border-radius: 8px;
    flex: 1;
    z-index: 1;
    margin-right: 250px;
}

.fa-list-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 8px;
}

.fa-list-card-top .badge-category {
    margin-bottom: 0;
    color: #262626;
    font-size: 17px;
    font-weight: 600;
    line-height: normal;
}

.fa-list-card h4,
.fa-list-card .h4 {
    font-family: 'Cantata One', serif;
    font-size: 21px;
    line-height: 1.3;
    letter-spacing: -0.63px;
    color: #121c3a;
    font-weight: 400;
}

.fa-list-card-excerpt {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: #262626;
}

/* Photo */
.fa-list-card-photo {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 300px;
    height: 200px;
    overflow: hidden;
}

.fa-list-card-photo img {
    width: 100%;
    height: 110%;
    object-fit: cover;
    position: absolute;
    top: -5%;
}

.fa-list-card-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(to left, rgba(31, 47, 97, 0), rgba(31, 47, 97, 0.56));
}

/* Newsletter dentro de la lista */
.fa-list .post-newsletter {
    padding: 48px 0;
}

/* ANALYSIS LIST — TABLET (768 – 1200px) */

/* ANALYSIS LIST — MOBILE (≤ 767px) */

/* ================================================
   MODULE REGIONS IN FOCUS
   ================================================ */

/* Variante section */
.int-section--regions {
  padding: 0 24px;
}

/* Header */
.int-section--regions .section-header {
  padding: 8px;
}

/* Body */
.region-body {
  display: flex;
  gap: 24px;
}

/* Featured card */
.region-featured {
  flex: 1;
  min-width: 0;
}

.region-featured .post-card,
.region-secondary .post-card {
  text-decoration: none;
  color: inherit;
}

.region-featured .post-card {
  display: flex;
  flex-direction: row;
  background: white;
  border-radius: 16px;
  padding: 8px;
  gap: 12px;
  height: 100%;
  overflow: hidden;
}

.region-featured .post-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 8px 16px;
  min-width: 0;
}

.region-featured .post-thumb {
  flex-shrink: 0;
  width: 300px;
  min-width: 300px;
  border-radius: 0 8px 8px 0;
  overflow: hidden;
}

.region-featured .post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.region-featured .post-content h3 {
  font-size: 26px !important;
  line-height: 34px;
  letter-spacing: -0.78px;
}

.region-featured .post-content p {
  font-size: 14px;
  line-height: 23px;
  color: #262626;
}

/* Secondary cards */
.region-secondary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  width: 524px;
  flex-shrink: 0;
  align-content: center;
}

.region-secondary .post-card {
  display: flex;
  flex-direction: column;
  background: white;
  border-radius: 16px;
  padding: 8px;
  gap: 4px;
  overflow: hidden;
  width: 250px;
  height: 100%;
}

.region-secondary .post-thumb {
  height: 130px;
  min-height: 130px;
  border-radius: 8px 8px 0 0;
  overflow: hidden;
}

.region-secondary .post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.region-secondary .post-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 8px;
  flex: 1;
  min-width: 0;
}

.region-secondary .post-meta {
  min-height: 43.5px;
}

.region-secondary .post-content h4 {
  font-size: 21px !important;
  line-height: 29px;
  letter-spacing: -0.63px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* TABLET (768 – 1200px) */

/* MOBILE (≤ 767px) */

/* ================================================
   HSCROLL — Horizontal scroll carousel (shared)
   ================================================ */

/* Outer */
.hscroll-outer {
  border-radius: 24px;
  padding: 0 0 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Variante: fondo secundario (columnists) */
.hscroll-outer--secondary {
  background: #c5cfed;
}

/* Header */
.hscroll-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
}

/* Scroll area */
.hscroll-scroll {
  overflow-x: auto;
  overflow-y: clip;
  width: 100%;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.hscroll-scroll::-webkit-scrollbar {
  display: none;
}

/* Drag to scroll — shared cursor states for every draggable list */
.hscroll-scroll,
.dt-scroll {
  cursor: grab;
}
.hscroll-scroll.is-dragging,
.dt-scroll.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  scroll-snap-type: none;
  user-select: none;
}
.hscroll-scroll.is-dragging a,
.hscroll-scroll.is-dragging img,
.dt-scroll.is-dragging a,
.dt-scroll.is-dragging img {
  cursor: grabbing;
}

.hscroll-list {
  display: flex;
  gap: 24px;
  padding: 0;
  width: max-content;
}

/* ================================================
   MODULE LATEST SHORTS — items
   ================================================ */

.int-section--latestshort {
  padding: 0;
}

/* White box wrapper — no side padding: the stops live on the list so they
   scroll away with the cards */
.int-section--latestshort .hscroll-outer {
    background: var(--color-white);
    padding: 1.5rem 0;
}

.int-section--latestshort .hscroll-header {
    padding: 0 1.5rem;
}

.int-section--latestshort .hscroll-list {
    padding-inline-start: 1.5rem;
    width: 100%;
}

/* End-of-scroll stop on the right. It has to be a real flex item: a
   padding-inline-end or a margin on the last card gets dropped from
   scrollWidth once the children overflow the track.
   The negative start margin cancels the list gap. */
.int-section--latestshort .hscroll-list::after {
    content: '';
    flex: 0 0 1.5rem;
    margin-inline-start: -24px;
}

/* Percentage width so a card is always partially cut — 4 cards + 1/5 */
.int-section--latestshort .short-item {
    width: calc((100% - 96px) / 4.2);
}

.short-item {
  position: relative;
  width: 260px;
  flex-shrink: 0;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 260 / 470;
}

.short-item video,
.short-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ================================================
   MODULE COLUMNISTS — items
   ================================================ */

.int-section--columnists {
  padding: 0 24px;
}

/* Variante columnists: la caja lavanda lleva padding interno
   (la .hscroll-outer compartida no lo trae, para no afectar videos/otros carruseles) */
.int-section--columnists .hscroll-outer {
  padding: 1.5rem 0;
}

.int-section--columnists .hscroll-header {
  padding: 0 1.5rem;
}

/* The left padding lives on the list, so it scrolls away with the cards and
   they reach the box edge instead of stopping at the outer padding */
.int-section--columnists .hscroll-list {
  width: 100%;
  padding-inline-start: 1.5rem;
}

/* End-of-scroll stop on the right. It has to be a real flex item: a
   padding-inline-end or a margin on the last card gets dropped from
   scrollWidth once the children overflow the track.
   The negative start margin cancels the list gap, so the stop is 1.5rem
   and not gap + 1.5rem. */
.int-section--columnists .hscroll-list::after {
  content: '';
  flex: 0 0 1.5rem;
  margin-inline-start: -24px;
}

/* Desktop: 4 cards + 1/5 */
.int-section--columnists .col-card {
  width: calc((100% - 96px) / 4.2);
}

.col-card {
  display: flex;
  flex-direction: column;
  background: white;
  border-radius: 16px;
  padding: 8px;
  gap: 4px;
  overflow: hidden;
  width: 270px;
  flex-shrink: 0;
  text-decoration: none;
  color: inherit;
}

.col-card .post-thumb {
  min-height: 130px;
  border-radius: 8px 8px 0 0;
  overflow: hidden;
}

.col-card .post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.col-card .post-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 8px;
}

.col-card .post-content h3 {
  font-size: 21px !important;
  line-height: 29px;
  letter-spacing: -0.63px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.col-card .post-content p {
  font-size: 14px;
  line-height: 23px;
  color: #262626;
  display: -webkit-box;
  -webkit-line-clamp: 7;
  line-clamp: 7;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Variante nav: border azul sobre fondo secondary */
.hscroll-outer--secondary .carousel-btn {
  border-color: rgba(50, 77, 159, 0.75);
}
.hscroll-outer--secondary .carousel-btn svg path {
  stroke: rgba(50, 77, 159, 0.75);
}

.hscroll-outer--secondary .carousel-btn:hover {
  border-color: #306B9E;
  background:white
}
.hscroll-outer--secondary .carousel-btn:hover svg path {
  stroke: #306B9E;
}

.hscroll-outer--secondary .carousel-btn:focus {
  background:#2B4288;
  border-color: #2B4288;
}
.hscroll-outer--secondary .carousel-btn:focus svg path {
  stroke: #fff;
}

/* ================================================
   HSCROLL — MOBILE (≤ 767px)
   ================================================ */

/* ================================================
   MODULE POST FEATURED SECONDARY — Mobile
   ================================================ */

/* ================================================
   MODULE CHINA CHATTER
   ================================================ */

.int-section--chatter {
  padding: 48px 24px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  min-height: 400px;
}

.int-section--chatter .c-container {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.int-section--chatter .testimonials-carousel {
  margin-top: 32px;
}

/* Quote list — gap override. Full width so the card percentages resolve */
.chatter-list {
  gap: 48px;
  width: 100%;
}

/* Quote card — desktop and tablet: 2 cards, no peek */
.chatter-quote {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: calc((100% - 48px) / 2);
  flex-shrink: 0;
}

.chatter-quote .post-avatar {
  width: 48px!important;
  height: 48px!important;
  border-radius: 50%;
  object-fit: cover;
}

/* Quote content: bar + text */
.chatter-content {
  display: flex;
  gap: 24px;
  align-items: center;
  padding-left: 8px;
}

.chatter-bar {
  width: 14px;
  flex-shrink: 0;
  align-self: stretch;
  background: white;
  border-radius: 32px;
}

.chatter-content p {
  font-family: 'Baskervville', serif;
  font-style: italic;
  font-size: 24px;
  line-height: 34px;
  color: #414141;
}

/* MOBILE (≤ 767px) */

/* ================================================
   CHINA TRADE TRACKER — ctt
   ================================================ */
.ctt-section { padding: 24px 0; }
.ctt-period { display: none; font-size: 14px; color: #718096; margin-bottom: 12px; }
.ctt-kpi-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 20px;
}
.ctt-kpi-card {
    background: #fff;
    border-radius: 16px;
    padding: 20px 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.ctt-kpi-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #7f7f7f;
    margin-bottom: 8px;
}
.ctt-kpi-value {
    font-size: 32px;
    font-weight: 700;
    color: #1c2634;
    margin-bottom: 13px;
}
.ctt-kpi-change {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    padding: 4px 14px;
    border-radius: 20px;
}
.ctt-kpi-change.positive {
    color: #60c562;
    background: #e7f6e8;
}
.ctt-kpi-change.negative {
    color: #e53e3e;
    background: rgba(229, 62, 62, 0.1);
}
.ctt-kpi-change .arrow-up::before { content: '▲ '; }
.ctt-kpi-change .arrow-down::before { content: '▼ '; }
.ctt-badge {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    padding: 4px 14px;
    border-radius: 20px;
}
.ctt-badge.surplus {
    color: #60c562;
    background: #e7f6e8;
}
.ctt-badge.deficit {
    color: #e53e3e;
    background: rgba(229, 62, 62, 0.1);
}
.ctt-charts-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.ctt-chart-card {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.ctt-chart-title {
    font-size: 16px;
    font-weight: 700;
    color: #1a202c;
    margin-bottom: 20px;
}
.ctt-bar-container { position: relative; min-height: 360px; }
.ctt-donut-container {
    position: relative;
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ctt-error { color: #e53e3e; padding: 20px; text-align: center; }
.ctt-module .section-header {
    margin-bottom: 15px;
}

/* CTT — Tablet 768–1200px */

/* CTT — Mobile ≤767px */

/* ================================================
   POST FEATURED & SECONDARY — overrides Bootstrap
   ================================================ */
.wrap-post-tertiary {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.card-transparent {
    background: transparent;
}
.post-featured.post-text {
    border-radius: 16px 16px 0 0;
    overflow: hidden;
}
.post-featured.post-text .post-meta {
    margin-bottom: 26px;
}
.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-top: 16px;
}

/* ================================================
   NEWSLETTER — section.newsletter
   ================================================ */

/* Desktop ≥ 1201px */
section.newsletter .wrap-form {
    display: flex;
    gap: 28px;
    align-items: center;
    padding: 16px;
    border-radius: 16px;
    background: #c5cfed;
}
section.newsletter .wrap-headline {
    flex-shrink: 0;
    width: 277px;
    padding-left: 20px;
}
section.newsletter .wrap-form h2 {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.78px;
    color: #262626;
    text-transform: initial;
    margin: 0;
}
section.newsletter .box-form {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 0;
}
section.newsletter .box-thumb {
    flex-shrink: 0;
    width: 347px;
    align-self: stretch;
}
section.newsletter .box-thumb img {
    border-radius:12px;
    height: 100%!important;
    width: 100%!important;
    object-fit: cover;
}
section.newsletter .gform_heading{
  display: none;
}

/* Gravity Forms inside .wrap-form */
.wrap-form .gravity-theme input[type=email] {
    background-color: #fff;
    border: 1px solid #778ed4;
    padding-left: 20px;
    padding-right: 20px;
}
.wrap-form .gfield_radio {
    display: flex;
    gap: 20px;
}
.wrap-form .gfield_radio label {
    color: #262626;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -0.54px;
    max-width: 100%;

}
.wrap-form .gfield_radio .gfield-choice-input {
    margin-left: 5px;
    margin-right: 10px;
    transform: scale(2);
}
.wrap-form .ginput_container_email input {
    border: 1px solid #778ed4;
    border-radius: 8px;
    background: #fff;
    height: 50px;
}
.wrap-form .ginput_container_email input::placeholder {
    color: #848484;
}
.wrap-form .gravity-theme #field_submit .btn-submit {
    border-radius: 8px;
    font-size: 14px;
    letter-spacing: -0.42px;
    justify-content: space-between;
    min-height: 50px;
    margin-top: 0;
    padding: 0.75rem;
    width: 100%;
}
.wrap-form .box-thumb img {
    border-radius: 8px;
    width: 100%;
    object-fit: cover;
}
.gform_wrapper.gravity-theme .gform_footer,
.gform_wrapper.gravity-theme .gform_page_footer {
    margin: 6px 0 0;
    padding: 0 !important;
}

form.search button.btn svg{
  height: 23px;
  width: 23px;
}

body.home form.search button.btn svg path,
body.archive.category form.search button.btn svg path,
body.archive.tag form.search button.btn svg path{
    fill: white;
}

/* Tablet 768–1200px */

/* Mobile ≤ 767px */

/* ================================================
   FOOTER
   ================================================ */
.footer-main {
    background: #a11217;
    padding: 48px 0px 24px;
}
.wrap-footer {
    display: flex;
    gap: 80px;
    align-items: flex-start;
}
.footer-logo {
    flex-shrink: 0;
    width: 182px;
}
.footer-logo img {
    width: 100%;
    height: auto;
}
.wrap-footer .connect,
.wrap-footer .content,
.wrap-footer .follow-us {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 200px;
    flex-shrink: 0;
}
.footer-main h2 {
    font-family: 'Cantata One', serif;
    font-size: 21px;
    font-weight: 400;
    color: #fff;
    margin: 0;
}
.footer-main li a {
    color: #fff;
    text-decoration: none;
}
.footer-main li a:hover {
    text-decoration: underline;
}
.footer-main ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.footer-main li a {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}
.copyright {
    padding: 12px 0 0;
}
.copyright p {
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: #fff;
    margin: 0;
}

/* Footer — Tablet 768–1200px */

/* Footer — Mobile ≤767px */

/* ================================================
   MODULE CATEGORY
   ================================================ */

/* Variante section */
.int-section--category {
    padding: 48px 24px;
}

/* Layout 2 columnas */
.cat-layout {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.cat-left {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 57%;
    flex-shrink: 0;
    position: relative;
    top: -270px;
    margin-bottom: -270px;
}

/* Hero figure image */
section.post-featured figure.hero img {
    border-radius: 16px;
}

@media(min-width: 992px){
    section.post-featured figure.hero img {
        max-height: 58vh;
        object-fit: cover;
        object-position: top;
    }
}

/* ================================================
   MARQUEE — Breaking News
   ================================================ */
section.post-featured div.wrap-marque {
    background: var(--Colors-Primary-main-75, rgba(184, 20, 26, 0.75));
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-left:80px solid #c84b4e;
    overflow: hidden;
    border-radius: 16px;
    margin-top: 12px;
}

section.post-featured div.marque {
    align-items: center;
    color: white;
    display: flex;
    gap: 15px;
    height: 60px;
    width: max-content;
    animation: scroll 60s linear infinite;
    will-change: transform;
}

@keyframes scroll {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
}

section.post-featured div.marque .item-marque {
    align-items: center;
    display: flex;
    font-size: 18px;
    font-weight: 300;
    gap: 10px;
}

section.post-featured div.marque .item-marque a {
    text-decoration: none;
}

section.post-featured div.item-marque:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMDAgMjAwIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCI+DQogIDxjaXJjbGUgY3g9IjEwMCIgY3k9IjEwMCIgcj0iNzAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZmZmZiIgc3Ryb2tlLXdpZHRoPSI1IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4NCjwvc3ZnPg==);
    background-size: 20px 20px;
    content: '';
    display: inline-block;
    height: 20px;
    width: 20px;
}

section.post-featured div.marque strong {
    font-weight: 600;
}

/* MARQUEE — Mobile (≤ 767px) */

/* Hero */
.cat-hero {
    border-radius: 16px 16px 0 0;
    margin-left: 20px;
    margin-right: 20px;
    overflow: hidden;
}

.cat-hero-content {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: linear-gradient(to bottom, rgba(255,255,255,0.7), #F6F1EC 36.9%);
    padding: 32px 48px 16px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Featured card title — not a page title, so it keeps its own rule.
   Values mirror .page-headline. !important is required because the
   .h3 base rule declares it. */
.cat-hero h1,
.cat-hero .h3 {
    font-size: 40px !important;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

.cat-hero .text p {
    font-size: 18px;
    line-height: 29px;
    color: #262626;
}

/* Inline cards */
.cat-inline {
    display: flex;
    gap: 24px;
}

.cat-inline .post-card {
    flex: 1;
    flex-direction: column;
    gap: 4px;
}

.cat-inline .post-thumb {
    height: 200px;
    min-height: 200px;
    border-radius: 8px 8px 0 0;
}

.cat-inline h2,
.cat-inline .h3 {
    font-size: 26px !important;
    line-height: 34px;
    letter-spacing: -0.78px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Right column */
.cat-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 20px;
}

/* Stacked cards 2x2 */
.cat-stacked {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.cat-stacked .post-card {
    flex-direction: column;
    gap: 4px;
}

.cat-stacked .post-thumb {
    height: 130px;
    min-height: 130px;
    border-radius: 8px 8px 0 0;
}

.cat-stacked h3 {
    font-size: 21px !important;
    line-height: 29px;
    letter-spacing: -0.63px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Category — version toggle v0 / v0-video */
.cat-stacked .play-btn { display: none; }

.default_cluster_video .cat-stacked {
    grid-template-rows: 1fr 1fr;
}

.default_cluster_video .cat-stacked .post-card:first-child {
    grid-row: 1 / -1;
}

.default_cluster_video .cat-stacked .post-card:first-child .post-thumb {
    flex: 1;
    height: auto;
    min-height: 200px;
    border-radius: 12px;
}

.default_cluster_video .cat-stacked .post-card:first-child .play-btn {
    display: flex;
}

.default_cluster_video .cat-stacked .post-card:nth-child(n+4) {
    display: none;
}

/* Hide cards 5-6 by default */
.cat-stacked .post-card:nth-child(n+5) {
    display: none;
}

/* Category — live blog block (hidden by default) */
.cat-live-blog {
    display: none;
    flex-direction: column;
    gap: 12px;
    background: #fff;
    border-radius: 16px;
    padding: 24px;
}

.live-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #e51920;
    border-radius: 999px;
    padding: 0 4px 0 8px;
    height: 21px;
    align-self: flex-start;
}

.live-badge span {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    color: #fff;
    text-align: center;
}

.live-badge-dot {
    width: 14px;
    height: 14px;
    background: #e51920;
    border: 3px solid #ff8a8d;
    border-radius: 50%;
}

.live-entries {
    display: flex;
    flex-direction: column;
    position: relative;
    padding-left: 6px;
}

.live-entries::before {
    content: '';
    position: absolute;
    left: 4px;
    top: 12px;
    bottom: 12px;
    width: 1px;
    border-left: 1px dashed #bcaaa1;
}

.live-entry {
    display: flex;
    gap: 4px;
    align-items: flex-start;
    padding: 8px 6px;
    position: relative;
}

.live-entry::before {
    content: '';
    width: 12px;
    height: 12px;
    background: #e51920;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
    position: relative;
    z-index: 1;
}

.live-entry-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-left: 12px;
    font-size: 14px;
    line-height: 20px;
}

.live-entry-time {
    font-weight: 700;
    color: #262626;
}

.live-entry-content a {
    letter-spacing: -0.42px;
}

/* Category — live_blog_v1 */
.live_blog_v1 .cat-live-blog {
    display: flex;
}

.live_blog_v1 .cat-stacked .post-card:nth-child(n+5) {
    display: flex;
}

/* Category — live_blog_v1_video (live blog + video card) */
.live_blog_v1_video .cat-live-blog {
    display: flex;
}

.live_blog_v1_video .cat-stacked {
    grid-template-rows: 1fr 1fr 1fr;
}

.live_blog_v1_video .cat-stacked .post-card:first-child {
    grid-row: 1 / 3;
}

.live_blog_v1_video .cat-stacked .post-card:first-child .post-thumb {
    flex: 1;
    height: auto;
    min-height: 200px;
    border-radius: 12px;
}

.live_blog_v1_video .cat-stacked .post-card:first-child .play-btn {
    display: flex;
}

.live_blog_v1_video .cat-stacked .post-card:nth-child(n+5) {
    display: flex;
}

.live_blog_v1_video .cat-stacked .post-card:nth-child(n+6) {
    display: none;
}

/* Category — live_blog_v2 / live_blog_v2_video shared */
.cat-live-blog-right {
    display: none;
    flex-direction: column;
    gap: 12px;
    background: #fff;
    border-radius: 16px;
    padding: 24px;
}

.cat-bottom {
    display: none;
    gap: 24px;
    width: 100%;
    flex-basis: 100%;
}

.cat-bottom .post-card {
    flex: 1;
    flex-direction: column;
    gap: 4px;
}

.cat-bottom .post-thumb {
    height: 180px;
    min-height: 180px;
    border-radius: 8px 8px 0 0;
}

.cat-right-row { display: contents; }
.cat-video-right {
    display: none;
    background: transparent;
    padding: 0;
}

/* Category — live_blog_v2 */
.live_blog_v2 .cat-live-blog { display: none; }
.live_blog_v2 .cat-live-blog-right { display: flex; }
.live_blog_v2 .cat-stacked { display: none; }
.live_blog_v2 .cat-layout { flex-wrap: wrap; }
.live_blog_v2 .cat-bottom { display: flex; }

/* Category — live_blog_v2_video */
.live_blog_v2_video .cat-live-blog { display: none; }
.live_blog_v2_video .cat-stacked { display: none; }
.live_blog_v2_video .cat-layout { flex-wrap: wrap; }
.live_blog_v2_video .cat-bottom { display: flex; }

.live_blog_v2_video .cat-right-row {
    display: flex;
    gap: 24px;
}

.live_blog_v2_video .cat-live-blog-right {
    display: flex;
    flex: 1;
}

.live_blog_v2_video .cat-video-right {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 0 0 280px;
}

.live_blog_v2_video .cat-video-right .post-thumb {
    flex: 1;
    height: auto;
    min-height: 200px;
    border-radius: 12px;
}

.live_blog_v2_video .cat-video-right .play-btn {
    display: flex;
}

/* ================================================
   VIDEO HERO — layout
   ================================================ */

/* Body grid */
.vh-body {
    display: grid;
    gap: 12px;
}

/* All cards in video-hero are vertical by default */
.int-section--video-hero .post-card {
    flex-direction: column;
}

/* ── Headings base ── */
.int-section--video-hero h2,
.int-section--video-hero h3,
.int-section--video-hero h4 {
    font-family: 'Cantata One', serif;
    color: #121C3A;
    line-height: 1.3;
}

/* ── Author base (Author S = default) ── */
.int-section--video-hero .post-avatar { width: 28px; height: 28px; }
.int-section--video-hero .post-role { font-size: 11px; }

/* ── Hero ── */
.vh-hero .post-thumb {
    aspect-ratio: 16 / 9;
}
.vh-hero .post-content {
    padding: 8px 8px;
}
.vh-hero h2 {
    font-size: 21px;
    letter-spacing: -0.63px;
}
.vh-hero .text p {
    font-size: 16px;
    line-height: 21px;
    color: #262626;
}

/* Mobile: hero uses Author M */
.vh-hero .post-avatar { width: 32px; height: 32px; }
.vh-hero .post-role { font-size: 13px; }

/* ── Medium cards ── */
.vh-medium {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.vh-medium .post-card {
    flex: 1;
}
.vh-medium .post-thumb {
    aspect-ratio: 280 / 200;
}
.vh-medium .post-content {
    padding: 8px;
}
.vh-medium h3 {
    font-size: 26px;
    letter-spacing: -0.78px;
}

/* ── Sidebar ── */
.vh-sidebar {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ── Horizontal cards ── */
.vh-card-h {
    flex-direction: row !important;
    align-items: stretch;
}
.vh-card-h .post-content {
    flex: 1;
    padding: 4px 8px;
    order: -1;
}
.vh-card-h .post-thumb {
    flex: 0 0 80px;
    aspect-ratio: auto;
    border-radius: 12px 8px 8px 12px;
}
.vh-card-h h4 {
    font-size: 15px;
    letter-spacing: -0.45px;
}

/* Horizontal cards: Author M on mobile/tablet */
.vh-card-h .post-avatar { width: 32px; height: 32px; }
.vh-card-h .post-role { font-size: 13px; }

/* ── Desktop-only card ── */
.vh-card-desktop {
    display: none;
}
.vh-card-desktop .post-thumb {
    aspect-ratio: 280 / 200;
}
.vh-card-desktop .post-content {
    padding: 8px;
}
.vh-card-desktop h3 {
    font-size: 26px;
    letter-spacing: -0.78px;
}

/* VIDEO HERO — Tablet (768 – 1200px) */

/* VIDEO HERO — Desktop (>= 1201px) */

/* ================================================
   VIDEOS LATEST — vl
   ================================================ */

/* ── Layout: sidebar + content ── */
.vl-layout {
    display: block;
}

/* ── Sidebar: anchor links ──
   Horizontal on every breakpoint. On tablet and mobile it scrolls and the
   last item fades out so it reads as "there are more categories". */
.vl-sidebar {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0;
    padding: 0.9375rem 1.5625rem;
    background-color: #F6F1EC;
    position: relative;
    z-index: 100;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    mask-image: linear-gradient(to right, #000 85%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, #000 85%, transparent 100%);
}

.vl-sidebar::-webkit-scrollbar {
    display: none;
}

/* Pinned state. `position: sticky` cannot be used here because the body
   has `overflow-x: hidden`, which cancels it, so the JS pins the bar and
   the spacer holds its place in the flow. */
.vl-sidebar.is-stuck {
    position: fixed;
    top: 0;
}

/* Faded out once the categories block is scrolled past. Opacity instead of
   display, so it fades back in on the way up. */
.vl-sidebar {
    transition: opacity 0.3s ease;
}
.vl-sidebar.is-hidden {
    opacity: 0;
    pointer-events: none;
}

/* Always in the flow with no height, so its position stays measurable.
   The JS only gives it a height while the bar is pinned. */
.vl-sidebar-spacer {
    display: block;
    height: 0;
}

/* ── Content wrapper ── */
.vl-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

/* ── Section block ── */
.vl-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ── Headings base ── */
.int-section--videos-latest h3 {
    font-family: 'Cantata One', serif;
    color: #121C3A;
    line-height: 1.3;
}

/* ── Author base (Author M = mobile default) ── */
.int-section--videos-latest .post-avatar { width: 32px; height: 32px; }
.int-section--videos-latest .post-role { font-size: 13px; }

/* ── Section header override ── */
.int-section--videos-latest .section-header {
    margin-bottom: 0;
    padding: 0 8px;
}

/* ── Grid: horizontal scroll on mobile ── */
.vl-grid {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding: 0 12px;
}
.vl-grid::-webkit-scrollbar { display: none; }

/* ── Card: vertical on mobile ── */
.vl-card {
    flex-direction: column;
    flex-shrink: 0;
    scroll-snap-align: start;
    width: 316px;
    min-width: 250px;
}
.vl-card .post-thumb {
    aspect-ratio: 300 / 169;
}
.vl-card .post-content {
    padding: 8px;
}
.vl-card h3 {
    font-size: 21px;
    letter-spacing: -0.63px;
}

/* ── Anchor links base ──
   Same padding, radius and size in every state: only the background colour
   changes, so the items never shift when another one becomes active. */
.vl-anchor,
.vl-anchor:visited,
.vl-anchor:hover,
.vl-anchor:focus {
    display: block;
    font-size: 16px;
    font-weight: 500;
    color: #121C3A;
    white-space: nowrap;
    text-decoration: none;
    flex-shrink: 0;
    padding: 0.25rem 1rem;
    border-radius: 12px;
    background-color: transparent;
    transition: background-color 0.2s ease;
}
.vl-anchor:hover { opacity: 0.7; }
.vl-anchor.vl-anchor--active {
    background-color: #fff;
}

/* VIDEOS LATEST — Tablet (768 – 1200px) */

/* VIDEOS LATEST — Desktop (>= 1201px) */

/* ================================================
   WRAP NEWSLETTER — override dentro de videos
   ================================================ */
.wrap-newsletter .c-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.wrap-newsletter .int-section {
    padding: 0 !important;
}
.wrap-newsletter section.newsletter .wrap-form {
    flex-direction: column;
}
.wrap-newsletter section.newsletter .wrap-headline {
    width: 100%;
    padding: 24px 24px 0;
}
.wrap-newsletter section.newsletter .box-form {
    padding: 0 24px 8px;
}
.wrap-newsletter section.newsletter .box-thumb {
    width: 100%;
}

/* ================================================
   VIDEO CATEGORY — vc (taxonomy-video-categories)
   ================================================ */

/* ── Headings base ── */
.int-section--video-cat h2,
.int-section--video-cat h3 {
    font-family: 'Cantata One', serif;
    color: #121C3A;
    line-height: 1.3;
}
.int-section--video-cat h2 a,
.int-section--video-cat h3 a {
    text-decoration: none;
    color: inherit;
}

/* ── Hero: video on top (mobile), text left + video right (tablet/desktop) ── */
.vc-hero {
    flex-direction: column;
}
.vc-hero .post-thumb {
    border-radius: 8px;
}
.vc-hero .post-content {
    padding: 0.5rem;
    gap: 12px;
}
.vc-hero h2 {
    font-size: 21px;
    letter-spacing: -0.63px;
}
.vc-hero .text p {
    font-size: 16px;
    line-height: 21px;
    color: #262626;
}
/* Mobile: Author M */
.vc-hero .post-avatar { width: 32px; height: 32px; }
.vc-hero .post-role { font-size: 13px; }
.vc-hero .cta {
    display: flex;
    justify-content: center;
}
.vc-hero .site-btn-primary {
    gap: 12px;
    font-size: 17px;
    letter-spacing: -0.51px;
}

/* ── Admin-only notice: category without a horizontal video for the hero ── */
.vc-admin-notice {
    padding: 1rem 1.25rem;
    border: 1px dashed var(--color-red);
    border-radius: 8px;
    background: var(--color-pink);
    color: var(--color-red-dark);
    font-size: 15px;
}

/* ── Grid: portrait cards (2/3), title only ── */
.vc-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}
.vc-grid-card {
    flex-direction: column;
    gap: 4px;
}
.vc-grid-card .post-thumb {
    border-radius: 0;
}
.vc-grid-card .post-content {
    padding: 0.5rem;
}
.vc-grid-card h3 {
    font-size: 19px;
    letter-spacing: -0.57px;
}

/* VIDEO CATEGORY — Tablet (768 – 1200px) */

/* VIDEO CATEGORY — Desktop (>= 1201px) */

/* CATEGORY — Tablet (768 – 1200px) */

/* CATEGORY — Mobile (≤ 767px) */

/* Posts list - card story */
.posts-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.post-card-story {
    display: flex;
    gap: 12px;
    background: #fff;
    border-radius: 16px;
    padding: 8px;
    overflow: hidden;
}

.post-card-story .post-content {
    flex: 1;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 8px 16px;
}

.post-card-story .post-thumb {
    width: 300px;
    min-width: 300px;
    border-radius: 0 8px 8px 0;
    overflow: hidden;
    position: relative;
}

.post-card-story .post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.post-card-story .post-content h3 a {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    line-height: 34px;
    letter-spacing: -0.78px;
    color: #121C3A;
    text-decoration: none;
}

.post-card-story .post-content .text p {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 23px;
    color: #262626;
}

/* ================================================
   STORY PAGE
   ================================================ */
.int-section--story-page {
    padding: 0 24px;
}

.story-layout {
    display: flex;
    gap: 24px;
}

/* Cards link reset */
.story-featured,
.story-secondary {
    text-decoration: none;
    color: inherit;
}

/* Featured card */
.story-featured {
    flex: 1;
}

.story-featured .post-content {
    flex: 1;
    padding: 8px 16px;
}

.story-featured .post-content h3 {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    line-height: 34px;
    letter-spacing: -0.78px;
    color: #121C3A;
}

.story-featured .post-content .text p {
    font-size: 14px;
    line-height: 23px;
}

.story-featured .post-thumb {
    flex: 0 0 45%;
    border-radius: 0 8px 8px 0;
    position: relative;
}

.story-featured .post-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Secondary grid */
.story-grid {
    flex: 0 0 40%;
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-content: center;
}

.story-secondary {
    flex: 0 0 calc(50% - 12px);
    flex-direction: column;
}

.story-secondary .post-thumb {
    min-height: 130px;
    border-radius: 8px 8px 0 0;
    position: relative;
}

.story-secondary .post-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.story-secondary .post-content {
    padding: 8px;
}

.story-secondary .post-content h3 {
    font-family: 'Cantata One', serif;
    font-size: 21px;
    letter-spacing: -0.63px;
    color: #121C3A;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Story page — Tablet */

/* Story page — Mobile */

/* ================================================
   POST LIST
   ================================================ */
.int-section--posts-list .posts-list{
    margin-left: auto;
    margin-right: auto;
    max-width: 912px;
}
.int-section--posts-list .section-header{
    max-width: 912px;
    margin-left: auto;
    margin-right: auto;
}

/* ================================================
   PAGINATION
   ================================================ */
.pagination-wrapper {
    display: flex;
    justify-content: center;
    max-width: 800px;
    margin: 0 auto;
    padding-top: 50px;
    padding-bottom: 50px;
}

.pagination-filter {
    margin-right: auto;
    margin-left: 0;
}

.pagination, .page-numbers {
    display: flex;
    align-items: center;
    gap: 12px;
    list-style: none;
}

.pagination-item,
.pagination-wrapper li {
    display: flex;
}

.pagination-link,
.pagination-button,
.pagination-wrapper li a.page-numbers,
.pagination-wrapper li a.prev,
.pagination-wrapper li a.next {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 4px;
    font-family: 'Montserrat', sans-serif;
    border: 1px solid #947D74;
    border-radius: 16px;
    color: #947D74;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.pagination-button,
.pagination-wrapper li a.prev,
.pagination-wrapper li a.next {
    gap: 8px;
    padding: 0 16px;
}

.pagination-link:hover,
.pagination-button:hover,
.pagination-wrapper li a.page-numbers:hover,
.pagination-wrapper li a.prev:hover,
.pagination-wrapper li a.next:hover {
    background: #ffffff;
    border-color: #6C594F;
    color: #6C594F;
}

.pagination-link.active,
.pagination-wrapper li span.page-numbers.current {
    background: #6C594F;
    color: #fff;
    border-color: #6C594F;
    border-radius: 16px;
    padding: 0 4px;
    min-width: 32px;
    height: 32px;
    justify-content: center;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.pagination-icon {
    width: 7px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination-wrapper li a.prev:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3IiBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgNyAxMiIgZmlsbD0ibm9uZSI+DQogIDxwYXRoIGQ9Ik02LjI5MjUgMC4yOTI1QzUuOTAyNSAtMC4wOTc1IDUuMjcyNSAtMC4wOTc1IDQuODgyNSAwLjI5MjVMMC4yOTI1IDQuODgyNUMtMC4wOTc1IDUuMjcyNSAtMC4wOTc1IDUuOTAyNSAwLjI5MjUgNi4yOTI1TDQuODgyNSAxMC44ODI1QzUuMjcyNSAxMS4yNzI1IDUuOTAyNSAxMS4yNzI1IDYuMjkyNSAxMC44ODI1QzYuNjgyNSAxMC40OTI1IDYuNjgyNSA5Ljg2MjUgNi4yOTI1IDkuNDcyNUwyLjQxMjUgNS41ODI1TDYuMjkyNSAxLjcwMjVDNi42NzI1IDEuMzEyNSA2LjY3MjUgMC42NzI1IDYuMjkyNSAwLjI5MjVaIiBmaWxsPSIjOTQ3RDc0Ii8+DQo8L3N2Zz4=);
    background-repeat: no-repeat;
    content: '';
    display: inline-block;
    height: 12px;
    width: 10px;
}

.pagination-wrapper li:hover a.prev:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3IiBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgNyAxMiIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTYuMjkyNSAwLjI5MjVDNS45MDI1IC0wLjA5NzUgNS4yNzI1IC0wLjA5NzUgNC44ODI1IDAuMjkyNUwwLjI5MjUgNC44ODI1Qy0wLjA5NzUgNS4yNzI1IC0wLjA5NzUgNS45MDI1IDAuMjkyNSA2LjI5MjVMNC44ODI1IDEwLjg4MjVDNS4yNzI1IDExLjI3MjUgNS45MDI1IDExLjI3MjUgNi4yOTI1IDEwLjg4MjVDNi42ODI1IDEwLjQ5MjUgNi42ODI1IDkuODYyNSA2LjI5MjUgOS40NzI1TDIuNDEyNSA1LjU4MjVMNi4yOTI1IDEuNzAyNUM2LjY3MjUgMS4zMTI1IDYuNjcyNSAwLjY3MjUgNi4yOTI1IDAuMjkyNVoiIGZpbGw9IiM2QzU5NEYiLz48L3N2Zz4=);
}

.pagination-wrapper li a.next:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3IiBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgNyAxMiIgZmlsbD0ibm9uZSI+DQogIDxwYXRoIGQ9Ik0wLjI5MjUgMC4yOTM3NjJDLTAuMDk3NSAwLjY4Mzc2MiAtMC4wOTc1IDEuMzEzNzYgMC4yOTI1IDEuNzAzNzZMNC4xNzI1IDUuNTgzNzZMMC4yOTI1IDkuNDYzNzZDLTAuMDk3NSA5Ljg1Mzc2IC0wLjA5NzUgMTAuNDgzOCAwLjI5MjUgMTAuODczOEMwLjY4MjUgMTEuMjYzOCAxLjMxMjUgMTEuMjYzOCAxLjcwMjUgMTAuODczOEw2LjI5MjUgNi4yODM3NkM2LjY4MjUgNS44OTM3NiA2LjY4MjUgNS4yNjM3NiA2LjI5MjUgNC44NzM3NkwxLjcwMjUgMC4yODM3NjJDMS4zMjI1IC0wLjA5NjIzNzkgMC42ODI1IC0wLjA5NjIzNzcgMC4yOTI1IDAuMjkzNzYyWiIgZmlsbD0iIzk0N0Q3NCIvPg0KPC9zdmc+);
    background-repeat: no-repeat;
    content: '';
    display: inline-block;
    height: 12px;
    width: 10px;
}

.pagination-wrapper li:hover a.next:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3IiBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgNyAxMiIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTAuMjkyNSAwLjI5Mzc2MkMtMC4wOTc1IDAuNjgzNzYyIC0wLjA5NzUgMS4zMTM3NiAwLjI5MjUgMS43MDM3Nkw0LjE3MjUgNS41ODM3NkwwLjI5MjUgOS40NjM3NkMtMC4wOTc1IDkuODUzNzYgLTAuMDk3NSAxMC40ODM4IDAuMjkyNSAxMC44NzM4QzAuNjgyNSAxMS4yNjM4IDEuMzEyNSAxMS4yNjM4IDEuNzAyNSAxMC44NzM4TDYuMjkyNSA2LjI4Mzc2QzYuNjgyNSA1Ljg5Mzc2IDYuNjgyNSA1LjI2Mzc2IDYuMjkyNSA0Ljg3Mzc2TDEuNzAyNSAwLjI4Mzc2MkMxLjMyMjUgLTAuMDk2MjM3OSAwLjY4MjUgLTAuMDk2MjM3NyAwLjI5MjUgMC4yOTM3NjJaIiBmaWxsPSIjNkM1OTRGIi8+PC9zdmc+);
}

/* ================================================
   SECTION PADDING
   ================================================ */
.padding-small {
    padding: 25px 0 !important;
}

.padding-medium {
    padding: 40px 0 !important;
}

.padding-large {
    padding: 80px 0;
}

/* Top only */
.padding-top-small {
    padding-top: 25px !important;
}

.padding-top-medium {
    padding-top: 40px !important;
}

.padding-top-large {
    padding-top: 80px !important;
}

/* Bottom only */
.padding-bottom-small {
    padding-bottom: 25px !important;
}

.padding-bottom-medium {
    padding-bottom: 40px !important;
}

.padding-bottom-large {
    padding-bottom: 80px !important;
}

/* Reset */
.padding-top-0 {
    padding-top: 0 !important;
}

.padding-bottom-0 {
    padding-bottom: 0 !important;
}

/* Section padding — Tablet */

/* Section padding — Mobile */

/* Pagination — Mobile */

/* Visibility utilities */
.hide-on-mobile { display: block; }
.hide-on-desktop { display: block; }
.hide-on-tablet { display: block; }

/* ============================================
   Data Tools Archive - Grid (post-data)
   ============================================ */
.post-data-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: stretch;
}

.post-data {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: opacity .2s ease;
}

.post-data:hover,
.post-data:focus {
    opacity: .85;
}

.post-data-thumb {
    position: relative;
    width: 100%;
    aspect-ratio: 379 / 224;
    overflow: hidden;
    background: #eef1f8;
}

.post-data-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.post-data-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px 16px;
}

.post-data-title {
    font-family: "Cantata One", serif;
    font-size: 21px;
    line-height: 1.3;
    letter-spacing: -0.03em;
    color: #121c3a;
    margin: 0;
}

.post-data-title a {
    text-decoration: none;
    color: inherit;
}

.post-data-text {
    color: #262626;
}

.post-data-text p {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    line-height: 23px;
    color: #262626;
    margin: 0;
}

/* Newsletter card (variante vertical dentro del grid)
   Replica el layout mobile de section.newsletter en todos los breakpoints */
.post-newsletter {
    display: flex;
    width: 100%;
    height: 100%;
}

.post-newsletter .int-section.newsletter {
    padding: 0 !important;
    margin: 0 !important;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.post-newsletter .c-container {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.post-newsletter .wrap-form {
    flex-direction: column !important;
    gap: 24px !important;
    padding: 16px !important;
    border-radius: 16px !important;
    background: #c5cfed !important;
    align-items: stretch !important;
    flex: 1 !important;
}

.post-newsletter .wrap-headline {
    width: 100% !important;
    padding: 8px 8px 0 !important;
    flex-shrink: 1 !important;
}

.post-newsletter .wrap-form h2 {
    font-size: 26px !important;
    letter-spacing: -0.78px !important;
}

.post-newsletter .box-form {
    flex: none !important;
    padding: 0 8px 8px !important;
}

.post-newsletter .gfield_radio {
    flex-direction: column !important;
    gap: 12px !important;
}

.post-newsletter .box-thumb {
    width: 100% !important;
    height: 100px !important;
    align-self: auto !important;
    flex-shrink: 0 !important;
    margin-top: auto !important;
    background: #778ed4;
    border-radius: 8px;
    overflow: hidden;
}

html body .post-newsletter .box-thumb img {
    height: 160px !important;
    width: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block;
    transform: translateY(-25px);
}

/* Forzar email + submit en filas separadas (Gravity Form usa grid two-thirds/third) */
.post-newsletter .gform_fields {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    grid-template-columns: 1fr !important;
}

.post-newsletter .gform_fields .gfield {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
}

.post-newsletter #field_submit {
    width: 100% !important;
    margin: 0 !important;
}
.post-newsletter .wrap-form{
    gap: 14px !important;
}

/* ============================================
   Data Tools Archive - Filters (dt-filters)
   ============================================ */
.dt-filters,
.dt-filters *,
.dt-filters *::before,
.dt-filters *::after {
    box-sizing: border-box;
}

.dt-filters {
    width: 100%;
    padding: 24px 0;
    overflow: hidden;
}

.dt-filters-form {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.dt-filters-top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
}

/* Tabs */
.dt-filters-tabs {
    display: flex;
    align-items: stretch;
    gap: 4px;
}

.dt-filters-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    background: #ffffff;
    border: none;
    border-radius: 8px 8px 0 0;
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    color: #262626;
    cursor: pointer;
    transition: opacity .2s ease;
}

.dt-filters-tab:hover {
    opacity: .85;
}

.dt-filters-tab.is-active {
    background: #e6d8d2;
}

.dt-filters-reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 24px;
    background: #ffffff;
    border: none;
    border-radius: 8px 8px 0 0;
    color: #6c594f;
    cursor: pointer;
    transition: opacity .2s ease;
}

.dt-filters-reset svg {
    display: block;
}

/* Search */
.dt-filters-search {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 500px;
    max-width: 100%;
    padding: 4px 4px 4px 10px;
    margin-bottom: 8px;
    background: #ffffff;
    border: 1px solid #e6d8d2;
    border-radius: 8px;
    margin-bottom: 7px !important;
}

.dt-filters-search-input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #262626;
    padding: 4px 0;
    line-height: 1.3;
}

.dt-filters-search-input::placeholder {
    color: #bcaaa1;
}

.dt-filters-search-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 999px;
    color: var(--color-base-dark-ultra);
    cursor: pointer;
    flex-shrink: 0;
    transition: opacity .2s ease;
}

.dt-filters-search-btn:hover {
    background: var(--color-base-dark);
    color: var(--color-white);
}

/* Panels */
.dt-filters-panels {
    background: #e6d8d2;
    border: 1px solid #e6d8d2;
    border-radius: 0 8px 8px 8px;
    padding: 16px 24px;
    width: 100%;
    min-height: 56px;
}

.dt-filters-panel {
    display: none;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 48px;
}

.dt-filters-panel.is-active {
    display: flex;
}

/* Checkbox item */
.dt-filters-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    position: relative;
}

.dt-filters-check input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.dt-filters-check-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: #ffffff;
    border: 1px solid #6c594f;
    border-radius: 6px;
    flex-shrink: 0;
    transition: border-color .15s ease, background-color .15s ease;
}

.dt-filters-check-box::after {
    content: "";
    width: 18px;
    height: 18px;
    background-color: #b8141a;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'><path d='M13 4L6.5 11L3 7.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    border-radius: 3px;
    opacity: 0;
    transform: scale(.6);
    transition: opacity .15s ease, transform .15s ease;
}

.dt-filters-check input[type="checkbox"]:checked + .dt-filters-check-box {
    border-color: #414141;
}

.dt-filters-check input[type="checkbox"]:checked + .dt-filters-check-box::after {
    opacity: 1;
    transform: scale(1);
}

.dt-filters-check input[type="checkbox"]:focus-visible + .dt-filters-check-box {
    outline: 2px solid #414141;
    outline-offset: 2px;
}

.dt-filters-check-label {
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #262626;
    line-height: 1.3;
}

/* ============================================
   Filters - dropdown layout (data + research archives)
   ============================================ */
.dt-filters--dropdown {
    overflow: visible;
}

.dt-filters--dropdown .dt-filters-top {
    align-items: center;
}

.dt-filters--dropdown .dt-filters-dds {
    display: flex;
    align-items: stretch;
    gap: 4px;
}

.dt-filters--dropdown .dt-filters-dd {
    position: relative;
    display: flex;
}

.dt-filters--dropdown .dt-filters-dd-trigger {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 0.75rem 1.25rem;
    background: var(--color-white);
    border: none;
    border-radius: 8px;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: var(--color-gray-dark);
    cursor: pointer;
    transition: opacity .2s ease;
}

.dt-filters--dropdown .dt-filters-dd-trigger:hover {
    opacity: .85;
}

.dt-filters--dropdown .dt-filters-dd.is-open .dt-filters-dd-trigger {
    background: var(--color-base-light-semi);
    border-radius: 8px 8px 0 0;
    opacity: 1;
}

.dt-filters--dropdown .dt-filters-dd-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform .2s ease;
}

.dt-filters--dropdown .dt-filters-dd.is-open .dt-filters-dd-chevron {
    transform: rotate(180deg);
}

.dt-filters--dropdown .dt-filters-dd-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 20;
    display: none;
    flex-direction: column;
    gap: 12px;
    min-width: 100%;
    padding: 0.75rem 0.625rem;
    background: var(--color-base-light-semi);
    border-radius: 0 8px 8px 8px;
    box-shadow: 0 8px 24px var(--color-shadow-200);
    white-space: nowrap;
}

.dt-filters--dropdown .dt-filters-dd.is-open .dt-filters-dd-menu {
    display: flex;
}

/* Search inside a dropdown (e.g. countries) */
.dt-filters--dropdown .dt-filters-dd-search {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 14rem;
    padding: 0.375rem 0.5rem 0.375rem 0.75rem;
    background: var(--color-white);
    border: 1px solid var(--color-base-light-semi);
    border-radius: 8px;
    color: var(--color-base-dark-ultra);
}

.dt-filters--dropdown .dt-filters-dd-search-input {
    flex: 1;
    min-width: 0;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-gray-dark);
}

.dt-filters--dropdown .dt-filters-dd-search-input::placeholder {
    color: var(--color-taupe);
}

.dt-filters--dropdown .dt-filters-dd-search svg {
    flex-shrink: 0;
}

/* Checkbox list inside a dropdown */
.dt-filters--dropdown .dt-filters-dd-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-height: 190px;
    padding: 0.25rem 1.125rem 0.25rem 0;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--color-taupe) transparent;
}

.dt-filters--dropdown .dt-filters-dd-list::-webkit-scrollbar {
    width: 6px;
}

.dt-filters--dropdown .dt-filters-dd-list::-webkit-scrollbar-thumb {
    background: var(--color-taupe);
    border-radius: 999px;
}

.dt-filters--dropdown .dt-filters-check[hidden] {
    display: none;
}

.dt-filters--dropdown .dt-filters-check-label {
    font-size: 14px;
}

.dt-filters--dropdown .dt-filters-reset {
    padding: 0.625rem 1.25rem;
    border-radius: 8px;
}

.dt-filters--dropdown .dt-filters-search {
    margin-bottom: 0 !important;
    padding-left: 1rem;
    border-radius: 999px;
}

/* ============================================
   Analysis Archive - AJAX results loading state
   ============================================ */
.an-results {
    --an-loading-bg: rgba(255, 255, 255, .6);
    --an-spinner-size: 48px;
    --an-spinner-thickness: 4px;
    --an-spinner-color: #b8141a;
    --an-spinner-track: #e6d8d2;

    position: relative;
    min-height: 200px;
}

.an-results.is-loading {
    pointer-events: none;
}

.an-results.is-loading::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--an-loading-bg);
    z-index: 5;
}

.an-results.is-loading::after {
    content: "";
    position: absolute;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    width: var(--an-spinner-size);
    height: var(--an-spinner-size);
    border: var(--an-spinner-thickness) solid var(--an-spinner-track);
    border-top-color: var(--an-spinner-color);
    border-radius: 50%;
    z-index: 6;
    animation: an-spin .8s linear infinite;
}

@keyframes an-spin {
    to { transform: translateX(-50%) rotate(360deg); }
}

/* Stagger fade + slide-in de los tiles al filtrar (AJAX) */
.an-tile-in {
    animation: an-tile-in .7s ease-out both;
}

@keyframes an-tile-in {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

.an-empty {
    padding: 40px 0;
    text-align: center;
}

/* ============================================
   Related Posts (rp-*)
   ============================================ */
.rp-section,
.rp-section *,
.rp-section *::before,
.rp-section *::after {
    box-sizing: border-box;
}

.rp-section {
    width: 100%;
    padding: 48px 0 68px;
}

.rp-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 32px;
    text-align: center;
}

.rp-heading h2 {
    font-family: "Montserrat", sans-serif;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.3;
    color: #121c3a;
    text-transform: uppercase;
    margin: 0;
}

/* Horizontal slider — 3 cards visible on desktop, scrolls to the right */
.rp-grid {
    display: flex;
    flex-wrap: nowrap;
    gap: 2%;
    align-items: stretch;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.rp-grid::-webkit-scrollbar {
    display: none;
}

.rp-card {
    /* 3 visible: (100% - 2 gaps of 2%) / 3 */
    flex: 0 0 32%;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
}

.rp-card-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    color: inherit;
}

div.analysis-single-page .rp-card-link {
    background: #C5CFED;
}

.rp-card-thumb {
    position: relative;
    width: 100%;
    aspect-ratio: 379 / 224;
    overflow: hidden;
    background: #eef1f8;
}

.rp-card-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.rp-card-body {
    background:white;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px 16px;
    flex: 1;
}

div.analysis-single-page .rp-card-body{
    border-radius: 8px;
    margin: -60px 10px 10px;
    z-index: 1;
}

.rp-card-flags {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
}

.rp-card-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #ffffff;
    border: 5px solid #ffffff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    flex-shrink: 0;
}

.rp-card-flag img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

/* Infographic variant — thumb altura fija y contenido centrado */
.rp-card--infographic .rp-card-thumb {
    aspect-ratio: auto;
    height: 256px;
}

.rp-card--infographic .rp-card-body {
    align-items: center;
    text-align: center;
    padding: 24px 8px;
}

.rp-card--infographic .rp-card-title,
.rp-card--infographic .rp-card-text p {
    text-align: center;
}

.rp-card--infographic .rp-card-text {
    padding: 0 24px;
}

.rp-card-title {
    font-family: "Cantata One", serif;
    font-size: 21px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.03em;
    color: #121c3a;
    margin: 0;
}

.rp-card-title a {
    text-decoration: none;
    color: inherit;
}

.rp-card-text {
    color: #262626;
}

.rp-card-text p {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
    color: #262626;
    margin: 0;
}

/* ============================================
   Infographics Archive (ig-*)
   ============================================ */
.ig-hero-section,
.ig-hero-section *,
.ig-featured-section,
.ig-featured-section *,
.ig-list-section,
.ig-list-section * {
    box-sizing: border-box;
}

.ig-hero-section {
    padding: 48px 0 24px;
}

.ig-hero-title {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Featured card — imagen izquierda, content derecha */
.ig-featured-section {
    padding: 24px 0 48px;
}

.ig-featured {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
}

.ig-featured-link {
    display: flex;
    gap: 24px;
    align-items: center;
    padding: 8px;
    text-decoration: none;
    color: inherit;
    transition: opacity .2s ease;
}

.ig-featured-link:hover,
.ig-featured-link:focus {
    opacity: .92;
}

.ig-featured-thumb {
    flex: 0 0 505px;
    width: 505px;
    height: 315px;
    border-radius: 8px;
    overflow: hidden;
    background: #eef1f8;
    position: relative;
}

.ig-featured-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ig-featured-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 16px;
    min-width: 0;
}

.ig-featured-flags {
    display: flex;
    gap: 8px;
    align-items: center;
}

.ig-featured-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 5px solid #ffffff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    background: #ffffff;
    flex-shrink: 0;
}

.ig-featured-flag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}

.ig-featured-title {
    font-family: "Cantata One", serif;
    font-size: 28px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.03em;
    color: #121c3a;
    margin: 0;
}

.ig-featured-text p {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
    color: #262626;
    margin: 0;
}

.ig-featured-cta {
    display: flex;
}

.ig-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    background: #2b4288;
    color: #ffffff;
    border-radius: 8px;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -0.03em;
    text-decoration: none;
    transition: opacity .2s ease;
}

.ig-featured-link:hover .ig-btn {
    opacity: .85;
}

/* List section */
.ig-list-section {
    padding: 24px 0 48px;
}

.ig-list {
    display: flex;
    flex-direction: column;
    gap: 48px;
    align-items: center;
}

/* Card horizontal — contenido izquierda, imagen derecha */
.ig-card {
    width: 100%;
    max-width: 860px;
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
}

.ig-card-link {
    display: flex;
    gap: 24px;
    align-items: center;
    padding: 8px;
    text-decoration: none;
    color: inherit;
    transition: opacity .2s ease;
}

.ig-card-link:hover,
.ig-card-link:focus {
    opacity: .92;
}

.ig-card-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    min-width: 0;
}

.ig-card-flags {
    display: flex;
    gap: 8px;
    align-items: center;
}

.ig-card-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    background: #ffffff;
    flex-shrink: 0;
}

.ig-card-flag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}

.ig-card-title {
    font-family: "Cantata One", serif;
    font-size: 21px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.03em;
    color: #121c3a;
    margin: 0;
}

.ig-card-text p {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
    color: #262626;
    margin: 0;
    padding-right: 48px;
}

.ig-card-thumb {
    flex: 0 0 439px;
    width: 439px;
    height: 264px;
    border-radius: 8px;
    overflow: hidden;
    background: #eef1f8;
    position: relative;
}

.ig-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Newsletter section — full width fuera del c-container */
.ig-newsletter-section {
    width: 100%;
    padding: 48px 24px;
}

.ig-newsletter-section .int-section.newsletter {
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 1140px;
}

/* ============================================
   Flashing menu item — red blinking dot
   ============================================ */
@keyframes blink {
    0%   { background-color: #fff; }
    100% { background-color: #b8141a; }
}

.flashing {
    display: inline-flex;
    align-items: center;
}
.flashing a{
    position: relative;
}
.flashing a:after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fff;
    animation: blink 1s linear infinite alternate;
    position: absolute;
    top:16px;
    right: 7px;
}

footer.footer-main .flashing a:after{
    right: -14px;
    top: 6px;
}

/* ============================================
   Single pages shared (sp-*)
   Se usa en todos los single*.php
   ============================================ */
.sp-main,
.sp-main *,
.sp-main *::before,
.sp-main *::after {
    box-sizing: border-box;
}

.sp-header {
    padding: 48px 0 24px;
}

.sp-header .c-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 720px;
}

.sp-content-section {
    padding: 24px 0 48px;
}

.sp-content-section .c-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
}

.sp-content {
    width: 100%;
    max-width: 672px;
}

.sp-content p {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
    color: #262626;
    margin: 0 0 16px;
}

.sp-content p:last-child {
    margin-bottom: 0;
}

.sp-content h2,
.sp-content h3 {
    font-family: "Cantata One", serif;
    color: #121c3a;
    margin: 24px 0 12px;
}

.sp-content h2 {
    font-size: 26px;
    line-height: 1.3;
}

.sp-content h3 {
    font-size: 21px;
    line-height: 1.3;
}

/* ================================================
   CONTENT — links
   ================================================ */
.article-content a,
.entry-content a,
.the-content a,
.sp-content a,
.live-entry-content a,
.font-17 a {
    color: var(--color-red-dark);
}

.sp-content a {
    text-decoration: underline;
}

.sp-visual {
    width: 100%;
    max-width: 1200px;
    border-radius: 16px;
    overflow: hidden;
    background: #eef1f8;
}

.sp-visual img {
    display: block;
    width: 100%;
    height: auto;
}

/* ============================================
   SINGLE VIDEO (single-videos.php)
   ============================================ */

/* ── Header: category + title + video ── */
.sp-header--video .c-container {
    max-width: 1008px;
    gap: 24px;
}
.sp-header-top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    max-width: 720px;
}
.badge-category--lg {
    font-size: 17px;
    margin-bottom: 0;
}
.sp-visual--video,
.sp-visual--video .post-thumb {
    border-radius: 12px;
}
/* Restores the ratio fill that .sp-visual img (height: auto) cancels */
.sp-visual--video img {
    height: 100%;
}
/* Vertical video: 9:16, centered, same height as the 16:9 layout */
.sp-visual--vertical {
    display: flex;
    justify-content: center;
    background: transparent;
}
.sp-visual--vertical .post-thumb {
    width: 31.640625%;
    aspect-ratio: 9 / 16;
}

/* ── Description ── */
.sp-content--video {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.sp-content--video .wrap-headline h2 {
    font-size: 24px !important;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}
.sp-content--video .article-meta {
    padding-bottom: 0;
}
.sp-content--video .meta-date {
    font-size: 13px;
}
.sp-content--video p {
    font-size: 17px;
    line-height: 31px;
    text-align: justify;
    margin: 0 0 1.9375rem;
}

/* ── Carousels: Latest videos (white) + The Debrief (secondary) ──
   Same edge criteria as the /videos sliders: the box has no side padding,
   the stops live on the list so they scroll away with the cards. */
.int-section--sv-carousel .hscroll-outer {
    padding: 1.5rem 0;
}
.int-section--sv-latest .hscroll-outer {
    background: var(--color-white);
}
.int-section--sv-carousel .hscroll-header {
    padding: 0 1.5rem;
}
.int-section--sv-carousel .wrap-headline h2 {
    text-transform: uppercase;
}
.int-section--sv-carousel .hscroll-list {
    width: 100%;
    padding-inline-start: 1.5rem;
    padding-inline-end: 0;
}
/* Right hand stop: a real flex item, the negative margin cancels the list gap */
.int-section--sv-carousel .hscroll-list::after {
    content: '';
    flex: 0 0 1.5rem;
    margin-inline-start: -24px;
}
.int-section--sv-carousel .hscroll-scroll {
    scroll-padding-inline: 1.5rem;
}

.sv-card {
    flex-direction: column;
    flex-shrink: 0;
}
.sv-card .post-content {
    padding: 0.5rem;
    gap: 12px;
}
.sv-card h3 {
    font-family: 'Cantata One', serif;
    color: #121C3A;
    line-height: 1.3;
}
.sv-card h3 a {
    text-decoration: none;
    color: inherit;
}

/* Latest videos: portrait cards, title 19px */
.int-section--sv-latest .sv-card {
    gap: 4px;
    width: calc((100% - 96px) / 4.6);
}
.int-section--sv-latest .post-thumb {
    border-radius: 0;
}
.int-section--sv-latest h3 {
    font-size: 19px;
    letter-spacing: -0.57px;
}

/* The Debrief: white 16/9 cards, title 21px */
.int-section--sv-debrief .sv-card {
    width: calc((100% - 72px) / 3.3);
}
.int-section--sv-debrief .post-thumb {
    border-radius: 8px 8px 0 0;
}
.int-section--sv-debrief h3 {
    font-size: 21px;
    letter-spacing: -0.63px;
}

/* ============================================
   Main Navigation (nav-*)
   ============================================ */
.nav-main,
.nav-main *,
.nav-main *::before,
.nav-main *::after,
.nav-search-modal *,
.nav-mobile-wrap * {
    box-sizing: border-box;
}

.nav-main {
    width: 100%;
    padding: 12px 48px 12px 24px;
    background: transparent;
}

/* Top row */
.nav-top .c-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    min-height: 50px;
}

.nav-logo {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    text-decoration: none;
}

.nav-logo img {
    display: block;
    height: 50px;
    width: auto;
}

.nav-logo .nav-logo-white {
    display: none;
}

.nav-logo .nav-logo-responsive {
    display: none;
}

/* Search trigger pill (like + not modal) */
.nav-search-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 276px;
    padding: 6px 6px 6px 16px;
    background: white;
    border: 1px solid #E6D8D2;
    border-radius: 999px;
    color: #262626;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 500;
    cursor: pointer;
    transition: opacity .2s ease;
}

.nav-search-trigger:hover {
    border: 1px solid #262626;
}

.nav-search-trigger-label {
    flex: 1;
    text-align: left;
    color: #BCAAA1;
}

.nav-search-trigger-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    flex-shrink: 0;
}

/* User */
.nav-user {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    color: #262626;
}

.nav-user-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

.nav-user-name {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 500;
}

/* Hamburger */
.nav-hamburger {
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: none;
    color: #262626;
    cursor: pointer;
}

/* Bottom row — menu */
.nav-bottom {
    display: flex;
    justify-content: center;
    margin-top: 4px;
}

.nav-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    list-style: none;
    gap:2px;
    margin: 0;
    padding: 0;
}

.nav-menu-item {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.nav-menu-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 41px;
    padding: 4px 12px 4px 12px;
    text-decoration: none;
    color: #262626;
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    transition: opacity .2s ease;
}

.nav-menu-link:hover,
.nav-menu-item.is-active .nav-menu-link {
    opacity: .75;
}

.nav-menu-item.flashing .nav-menu-link{
    padding:4px 20px 4px 12px;
}

.nav-menu-label {
    white-space: nowrap;
}

/* External link icon on nav menu items */
.nav-menu-item.icon-ext > .nav-menu-link::after {
    content: "";
    flex-shrink: 0;
    width: 0.95em;
    height: 0.95em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center / contain;
}

.nav-menu-caret {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 13px;
    height: 13px;
    flex-shrink: 0;
}

.nav-menu-caret svg {
    width: 100%;
    height: 100%;
}

.nav-menu-caret svg path {
    fill: currentColor;
    stroke: none;
}

.nav-menu-live {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #e11d48;
    box-shadow: 0 0 0 2px rgba(225, 29, 72, 0.2);
    margin-left: 4px;
    animation: nav-live-pulse 1.5s ease-in-out infinite;
}

@keyframes nav-live-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}

/* Submenu dropdown (desktop) */
.nav-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    padding: 8px 0;
    margin: 0;
    list-style: none;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
    z-index: 1000;
}

.nav-menu-item.has-dropdown:hover > .nav-submenu,
.nav-menu-item.has-dropdown:focus-within > .nav-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.nav-submenu .nav-menu-item {
    display: block;
    width: 100%;
}

.nav-submenu .nav-menu-link {
    display: flex;
    width: 100%;
    height: auto;
    padding: 14px 22px;
}

/* Separador antes del botón Advisor Services */
/*
.nav-menu-item.menu-other-cat::before {
    content: "";
    width: 1px;
    height: 20px;
    background: #E30613;
    margin: 0 14px;
}
*/

/* En variantes light (home/category/tag) el pipe va blanco */
/*
body.home .nav-menu-item.menu-other-cat::before,
body.category .nav-menu-item.menu-other-cat::before,
body.tag .nav-menu-item.menu-other-cat::before {
    background: #ffffff;
}*/

/* Reset de Bootstrap .btn cuando aparece dentro del menú */
/*
.nav-menu .nav-menu-item.btn {
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    font-weight: inherit;
    line-height: inherit;
    text-align: inherit;
}
*/

/* Botón Advisor Services */
.nav-menu-item.btn .nav-menu-link {
    background: rgb(43, 66, 136);
    color: #ffffff;
    border-radius: 999px;
    padding: 10px 18px;
    height: auto;
}

.nav-menu-item.btn .nav-menu-link:hover {
    background: rgb(33, 51, 105);
    opacity: 1;
}

/* Mantener color blanco del botón también en variantes light */
body.home .nav-menu-item.btn .nav-menu-link,
body.category .nav-menu-item.btn .nav-menu-link,
body.tag .nav-menu-item.btn .nav-menu-link {
    color: #ffffff;
}

/* LIGHT variant — home + category — nav encima del hero, texto blanco */
body.home .main-content,
body.category .main-content,
body.tag .main-content {
    position: relative;
}

body.home .nav-main,
body.category .nav-main,
body.tag .nav-main {
    position: relative;
    color: #262626;
}

/* Search modal */
.nav-search-modal {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: none;
}

.nav-search-modal.is-open {
    display: block;
}

.nav-search-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(18, 28, 58, 0.6);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.nav-search-modal-inner {
    position: relative;
    max-width: 720px;
    margin: 15vh auto 0;
    padding: 0 24px;
}

.nav-search-form {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 8px 8px 24px;
    background: #ffffff;
    border-radius: 999px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.nav-search-input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    color: #262626;
    padding: 12px 0;
    min-width: 0;
}

.nav-search-input::placeholder {
    color: #bcaaa1;
}

/* Hide native clear button of input[type=search] */
.nav-search-input::-webkit-search-cancel-button,
.nav-search-input::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}

.nav-search-submit,
.nav-search-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 50%;
    color: #262626;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color .2s ease;
}

.nav-search-submit:hover,
.nav-search-close:hover {
    background: rgba(0, 0, 0, 0.06);
}

.nav-search-submit svg {
    width: 28px;
    height: 28px;
}

.nav-search-submit svg path {
    fill: #262626;
}

/* Mobile off-canvas */
.nav-mobile-wrap {
    position: fixed;
    inset: 0;
    z-index: 9999;
    visibility: hidden;
    opacity: 0;
    transition: opacity .25s ease, visibility .25s ease;
}

.nav-mobile-wrap.is-open {
    visibility: visible;
    opacity: 1;
}

.nav-mobile-overlay {
    position: absolute;
    inset: 0;
    background: rgba(18, 28, 58, 0.6);
}

.nav-mobile {
    position: absolute;
    top: 0;
    right: 0;
    width: min(360px, 85vw);
    height: 100%;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .3s ease;
}

.nav-mobile-wrap.is-open .nav-mobile {
    transform: translateX(0);
}

.nav-mobile-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.nav-mobile-logo img {
    display: block;
    height: 36px;
    width: auto;
}

.nav-mobile-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    color: #262626;
    cursor: pointer;
}

.nav-mobile-menu-wrap {
    flex: 1;
    overflow-y: auto;
    padding: 16px 0;
}

.nav-mobile-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-mobile-menu a {
    display: flex;
    align-items: center;
    padding: 12px 24px;
    text-decoration: none;
    color: #262626;
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 500;
}

.nav-mobile-menu .mobile-submenu {
    list-style: none;
    margin: 0;
    padding: 0 0 0 16px;
    background: rgba(0, 0, 0, 0.03);
}

body.nav-no-scroll {
    overflow: hidden;
}

/* ── Video Custom Wide ────────────────────────────── */

.video-custom-wide {
    font-size: 14px;
    line-height: 23px;
    padding: 25px 0px;
}

.article-video {
    width: 100%;
    max-width: 1160px;
    margin: 0 auto;
}

.video-embed {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.video-custom-wide .bunny-video-wrap {
    border-radius: 12px;
}

.caption-video {
    max-width: 720px;
    margin: 0 auto;
    color: var(--color-gray-dark);
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: -0.42px;
    text-align: center;
    padding: 8px;
}

.article-video .bunny-video-wrap video{
    height: 61vh;
    width:100%;
}

/* The single-video hero keeps the original play button: centered and 48px.
   The pause state on hover still applies. */
.article-video > .bunny-video-wrap > .play-btn,
.sp-visual--video .play-btn {
    width: 48px;
    height: 48px;
    top: 50%;
    left: 50%;
    right: auto;
    bottom: auto;
    transform: translate(-50%, -50%);
}

/* ── Page / Search / Archive ──────────────────────── */

.section-headline--no-pb {
    padding-bottom: 0;
}

.section-headline .headline {
    text-align: center;
    display: flex;
    justify-content: center;
}

.section-article-content .article-content {
    font-size: 17px;
    line-height: 31px;
    padding-bottom: 1rem;
}

.head-title-wrap {
    text-transform: capitalize;
}

/* ── Search ── */

.int-section--search-results {
    padding-bottom: 0;
}

.search-grid {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-left: auto;
    margin-right: auto;
    max-width: 900px;
}

.search-card {
    flex-direction: row;
    align-items: stretch;
}

.search-card .post-content {
    flex: 1;
    min-width: 0;
    padding: 8px;
    gap: 12px;
}

.search-card .post-thumb {
    flex: 0 0 300px;
    border-radius: 8px;
}

.search-card .post-thumb img {
    border-radius: 8px;
}

.search-card h3 {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    color: #121C3A;
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 34px;
    margin: 0;
}

.search-card h3 a {
    text-decoration: none;
    color: inherit;
}

.search-card .text {
    font-size: 14px;
    line-height: 23px;
    color: #262626;
}

/* ── Search — Tablet 768–1200px ── */

/* ============================================
   ARTICLES
   ============================================ */

body.single .article-content p,
body.single .article-content h2,
body.single .article-content h3,
body.single .article-content h4,
body.single .article-content h5,
body.single .article-content h6,
body.single .article-content .wp-block-image,
body.single .article-content .wp-block-embed,
body.single .article-content .wp-block-video,
body.single .article-content .wp-block-gallery,
body.single .article-content .wp-block-quote,
body.single .article-content .wp-block-list,
body.single .article-content .wp-block-list-wrap,
body.single .article-content ul,
body.single .article-content ol,
body.single .article-content iframe,
body.wp-singular .wrap-newsletter,
body.page-narrow .article-content p,
body.page-narrow .article-content h2,
body.page-narrow .article-content h3,
body.page-narrow .article-content h4,
body.page-narrow .article-content h5,
body.page-narrow .article-content h6,
body.page-narrow .article-content .wp-block-image,
body.page-narrow .article-content .wp-block-embed,
body.page-narrow .article-content .wp-block-video,
body.page-narrow .article-content .wp-block-gallery,
body.page-narrow .article-content .wp-block-quote,
body.page-narrow .article-content .wp-block-list,
body.page-narrow .article-content .wp-block-list-wrap,
body.page-narrow .article-content ul,
body.page-narrow .article-content ol {
    max-width: 670px;
    margin-left: auto;
    margin-right: auto;
}

body.wp-singular .wrap-newsletter h2{
    padding-top: 0;
    padding-bottom: 0;
}

body.wp-singular .wrap-newsletter section.newsletter .wrap-form {
    display: flex;
    gap: 25px;
}

body.single .article-content .wp-block-image {
    max-width: 670px !important;
    margin: 2rem 25px;
}

body.single .article-content .wp-block-image.image-wide {
    max-width: 935px !important;
}

body.single .article-content .wp-block-image.image-wide img,
body.single .article-content .wp-block-image.image-full-wide img {
    width: 100%;
    height: auto;
    max-width: 100%;
}

body.single .article-content .wp-block-image.image-full-wide {
    max-width: 100% !important;
}

body.single .article-content iframe {
    display: block;
    position: relative;
    margin-top: 2rem;
    margin-bottom: 1.5rem;
}

body.page-narrow .article-content .wp-block-image {
    margin-top: 25px;
    margin-bottom: 25px;
}

.article-content .wp-block-image img {
    border-radius: 10px !important;
}

.wp-block-image .wp-element-caption {
    font-size: 12px;
    margin-top: 10px;
    margin-bottom: 2rem;
    margin-left: auto;
    margin-right: auto;
    max-width: 670px;
}

.wp-block-image.image-wide .wp-element-caption,
.wp-block-image.image-full-wide .wp-element-caption {
    max-width: 720px;
}

.article-content section.newsletter {
    margin-bottom: 2rem;
    margin-top: 2rem;
}

.article-hero {
    padding: 80px 0 140px;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    position: relative;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.article-hero::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    pointer-events: none;
}

.article-hero-content,
.article-text,
.article-img:not(.full-img),
.caption-img,
.article-newsletter {
    max-width: 720px;
    margin: 0 auto;
}

.article-img.full-img {
    width: 100%;
    max-width: 1264px;
    margin: 0 auto;
}

.article-newsletter .box-form {
    padding: 0 24px 0 24px;
}

.article-newsletter .inner-newsletter .box-headline {
    padding-top: 16px;
}

.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6 {
    padding-top: 24px;
    padding-bottom: 10px;
}

.article-content h2:has(+ p) {
    padding-bottom: 20px;
}

.article-anchor-link {
    width: 100%;
    max-width: 1160px;
    margin: 0 auto;
}

.article-anchor-link {
    padding-bottom: 40px;
}

.article-anchor-link .post-meta,
.card-horizontal-data-hub .post-meta {
    width: 46px;
    height: 46px;
    position: absolute;
    right: -38px;
    transform: translateY(-50%);
    top: 50%;
    border-width: 5px;
    border-style: solid;
    border-color: rgb(255, 219, 219);
    border-image: initial;
    background: rgb(128, 128, 128);
    border-radius: 50px;
}

.article-anchor-link .card-horizontal,
.card-horizontal-data-hub {
    display: flex;
    align-items: stretch;
    flex-direction: row;
    gap: 16px;
}

.article-anchor-link .card-body,
.card-horizontal-data-hub .card-body {
    position: relative;
    padding: 24px;
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.article-anchor-link .card-image,
.card-horizontal-data-hub .card-image {
    width: 50%;
    display: flex;
}

.article-anchor-link .card-image a,
.card-horizontal-data-hub .card-image a {
    width: 100%;
    display: flex;
}

.article-anchor-link .card-image img,
.card-horizontal-data-hub .card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-anchor-link .post-avatar,
.card-horizontal-data-hub .post-avatar {
    object-fit: cover;
    object-position: center center;
    width: 100% !important;
}

.article-anchor-link .card-horizontal .card-image img {
    height: 100% !important;
    object-fit: cover;
    object-position: center;
}

.article-anchor-link .card-title,
.card-horizontal-data-hub .card-title {
    margin-bottom: 0;
}

.article-anchor-link .card-excerpt,
.card-horizontal-data-hub .card-excerpt {
    padding-top: 24px;
}

.article-anchor-link .card-cta,
.card-horizontal-data-hub .card-cta {
    text-align: left;
    margin-top: 24px;
}

/* ── Featured Post (block) ── */

.featured-post-php {
    margin-top:2rem;
    margin-bottom: 3rem;
    padding: 0px;
}

.featured-post-php .card-horizontal {
    background: var(--color-white);
    border-radius: 12px;
    overflow: hidden;
}

.featured-post-php .card-excerpt {
    font-size: 14px;
    line-height: 23px;
}

.featured-post-php .card-body {
    padding: 0px 24px 24px;
    order: 1;
}

.featured-post-php .card-image {
    order: 2;
}

.article-img {
    width: 100%;
}

.article-img img {
    width: 100%;
    height: auto;
}

.caption-img {
    color: var(--color-gray-dark);
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.4;
    padding-top: 16px;
}

.article-text p {
    margin-bottom: 2rem;
}

.article-text p:last-child {
    margin-bottom: 0;
}

.article-newsletter .inner-newsletter {
    gap: 24px !important;
    grid-template-columns: 1fr !important;
}

.badge-category {
    display: inline-block;
    padding: 2px 8px;
    background: var(--color-white);
    color: var(--color-gray-dark);
    font-family: 'Montserrat', sans-serif;
    font-size: 10px;
    font-weight: 600;
    text-transform: capitalize;
    border-radius: 4px;
    margin-bottom: 28px;
    position: relative;
}

.article-category a {
    color: inherit !important;
    text-decoration: none !important;
}

.article-category a:hover {
    text-decoration: underline !important;
}

.meta-date br {
    display: none;
}

.article-title {
    color: var(--color-dark-blue);
}

.article-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 24px;
    flex-wrap: wrap;
    gap: 16px;
    width: 100%;
}

.article-type {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    padding-bottom: 80px;
}

.article-meta .post-meta {
    margin-bottom: 0;
}

.article-meta .post-meta img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
}

.article-meta .post-meta strong {
    display: inline-block;
    font-weight: 600;
    color: var(--color-gray-dark);
}

.meta-date {
    color: var(--color-gray-dark);
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    line-height: 17px;
}

.article-stats {
    display: flex;
    gap: 20px;
    align-items: center;
}

.meta-date b {
    font-style: italic;
    font-weight: 600;
}

.article-inner-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 24px 0;
    flex-wrap: wrap;
    max-width: 720px;
    margin: -50px auto 0px;
    border-radius: 16px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    position: relative;
    z-index: 2;
    /*background: linear-gradient(0deg, var(--color-gray-light) 0%, var(--color-white) 100%);*/
    background: var(--Colors-Backgrounds-default, #F6F1EC);
}

body.single-data .article-inner-content {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    margin: 60px auto 20px;
}

.content-main.data-single-page .article-inner-content {
    margin-top: 0;
}

/* Meta (arriba) blanco solido; el gradiente arranca donde empieza el box */
body.single-research .article-inner-content {
    background: linear-gradient(to bottom, #fff 0, #fff 88px, rgba(255, 255, 255, 0) 100%);
}

/* Key Takeaways movido con JS dentro del meta: ancho completo + fondo transparente
   para que se vea el gradiente del contenedor */
body.single-research .article-inner-content .wpsummary_box {
    flex: 0 0 100%;
    width: 100%;
    background: transparent;
}

.article-excerpt {
    padding: 24px;
    border: 1px solid black;
}

.title-excerpt {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.grid-video-featured img {
    height: auto !important;
}

.grid-video-featured {
    margin-top: 24px;
}

.video-description h2.heavy-head,
.video-description .article-meta {
    margin-bottom: 32px;
}

/* ============================================
   COVERAGE MAP
   ============================================ */

.int-section--coverage {
    /*background: var(--color-gray-light, #f4f4f4);*/
    background: transparent;
}

/* News down / News up toggle */
.coverage-toggle {
    display: flex;
    gap: 0.25rem;
}

.coverage-toggle-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem;
    background: var(--color-blue-strong);
    color: var(--color-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    line-height: 20px;
}

.coverage-toggle-btn svg {
    display: none;
}

.coverage-toggle-btn.is-active {
    background: var(--color-black);
}

.coverage-toggle-btn.is-active svg {
    display: block;
}

.coverage-toggle-btn:hover,
.coverage-toggle-btn:focus-visible {
    opacity: 0.7;
}

/* Layout: sidebar + (map + posts) */
.coverage-layout {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.coverage-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.int-section--coverage.is-news-up .coverage-posts {
    order: -1;
}

/* Left: sidebar countries */
.coverage-sidebar {
    width: 200px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Country search: list height is capped (desktop: max-height, tablet: map height via JS), the list scrolls */
.coverage-search {
    position: relative;
    flex-shrink: 0;
}

.coverage-search-input {
    width: 100%;
    padding: 0.5rem 2.5rem 0.5rem 1rem;
    background: var(--color-white);
    border: 1px solid var(--color-base-light-semi);
    border-radius: 999px;
    color: var(--color-gray-dark);
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 24px;
    outline: none;
    transition: border-color 0.2s;
}

.coverage-search-input::placeholder {
    color: var(--color-taupe);
}

.coverage-search-input:focus {
    border-color: var(--color-gray-dark);
}

/* Hide native clear button of input[type=search] */
.coverage-search-input::-webkit-search-cancel-button,
.coverage-search-input::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}

.coverage-search svg {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    color: var(--color-base-dark-ultra);
    pointer-events: none;
}

.coverage-list {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--color-taupe) transparent;
}

.coverage-list::-webkit-scrollbar {
    width: 4px;
}

.coverage-list::-webkit-scrollbar-thumb {
    background: var(--color-taupe);
    border-radius: 999px;
}

.coverage-region[hidden],
.coverage-country[hidden] {
    display: none;
}

.coverage-no-results {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 24px;
    color: var(--color-base-dark);
}

.coverage-region h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 24px;
    color: #000;
    margin-bottom: 6px;
}

.coverage-countries {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.coverage-country {
    display: grid;
    align-items: flex-start;
    gap: 6px;
    grid-template-columns: 26px minmax(0, 1fr);
    text-decoration: none;
    color: #000;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    padding: 2px 4px;
    border-radius: 999px;
    transition: background 0.2s;
    z-index: 1;
}

.coverage-country:hover,
.coverage-country.is-active {
    background: #fff;
}

.coverage-flag img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

/* Map */
.coverage-map {
    position: relative;
    min-width: 0;
}

.coverage-map svg {
    width: 100%;
    height: auto;
}

/* SVG country styles */
path.country {
    stroke: #5A5A5A;
    stroke-width: 0.5;
    transition: fill 0.2s ease, opacity 0.2s ease;
    cursor: default;
}

path.country.has-posts:hover {
    filter: brightness(0.85);
}

path.country.has-posts {
    cursor: pointer;
}

path.country.has-posts--north {
    fill: var(--color-map-north);
}

path.country.has-posts--latam {
    fill: var(--color-map-latam);
}

path.country.has-posts--africa {
    fill: var(--color-map-africa);
}

path.country.has-posts--middle-east {
    fill: var(--color-map-middle-east);
}

path.country.has-posts--asia {
    fill: var(--color-map-asia);
}

.map-live-dot {
    fill: #ffffff;
    pointer-events: none;
    animation: map-dot-blink 1.5s ease-in-out infinite;
}

@keyframes map-dot-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

/* Map inner (zoom container) */
.coverage-map-inner {
    overflow: hidden;
    cursor: grab;
}

.coverage-map-inner:active {
    cursor: grabbing;
}

.coverage-map-inner svg {
    transform-origin: 0 0;
    transition: transform 0.3s ease;
}

/* Zoom controls */
.coverage-zoom {
    position: absolute;
    bottom: 0px;
    right: 30px;
    display: flex;
    gap: 10px;
    background: #3d3d3d;
    border-radius: 8px;
    padding: 4px 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    z-index: 5;
}

.coverage-zoom-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
}

.coverage-zoom-btn:hover {
    opacity: 0.7;
}

/* Tooltip */
.tooltip-svg {
    color: #000;
    font-family: 'Cantata One', serif;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    position: fixed;
    display: none;
    padding: 4px 24px;
    border-radius: 8px;
    pointer-events: none;
    z-index: 1000;
    background: #fff;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.15);
}

/* Posts grid */
.coverage-posts {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    transition: opacity 0.15s ease, height 0.3s ease;
}

.coverage-posts.is-fading {
    opacity: 0;
}

/* Loading spinner over the current posts */
.coverage-spinner {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-dark-blue);
    z-index: 2;
}

.coverage-spinner svg {
    animation: coverage-spin 0.8s linear infinite;
}

@keyframes coverage-spin {
    to {
        transform: rotate(360deg);
    }
}

.coverage-loading,
.coverage-empty {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    color: var(--color-gray-dark, #666);
    padding: 24px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    grid-column: 1 / -1;
}

/* Card: content left, photo right */
.coverage-card {
    background: var(--color-white);
    border-radius: 16px;
    padding: 0.5rem;
    display: flex;
    gap: 12px;
    overflow: hidden;
}

.coverage-card .post-content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0.25rem 0.5rem;
}

.coverage-card .post-thumb {
    width: 80px;
    min-height: 130px;
    flex-shrink: 0;
    border-radius: 0 8px 8px 0;
    overflow: hidden;
}

.coverage-card .post-thumb a {
    display: block;
    height: 100%;
}

.coverage-card .post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.coverage-card h3 {
    font-family: 'Cantata One', serif;
    font-size: 19px;
    line-height: 23px;
    color: var(--color-dark-blue);
    letter-spacing: -0.57px;
}

.coverage-card h3 a {
    text-decoration: none;
    color: inherit;
}

/* Post meta inside coverage cards */
.coverage-card .post-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0.25rem 0;
}

.coverage-card .post-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.coverage-card .post-meta-info {
    display: flex;
    flex-direction: column;
}

.coverage-card .post-author {
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    color: #262626;
}

.coverage-card .post-role {
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 600;
    font-style: italic;
    color: #262626;
}

/* Tablet: 2 columns, card floats over map */

/* ============================================
   FILTER SECTION
   ============================================ */

body.home .filter-section,
body.category .filter-section,
body.tag .filter-section {
    display: block;
}

.filter-section-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 20px 25px;
    width: 100%;
    box-sizing: border-box;
}

.filter-section-wrap .filter-section {
    display: flex;
}

.filter-section-wrap .filter-row {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 0;
    margin: 0;
}

.filter-section-wrap .filter-row::-webkit-scrollbar {
    display: none;
}

/* Base filter item */
.filter-section-wrap .filter-item {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    min-height: 32px;
    box-sizing: border-box;
    border-radius: 999px;
    border: 1px solid var(--color-base-light-semi);
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
    transition: transform 0.3s ease;
    white-space: nowrap;
    scroll-snap-align: start;
    padding: 0;
    gap: 0;
    font-size: 0;
    line-height: normal;
    background: var(--color-white);
    backdrop-filter: none;
}

.filter-section-wrap .filter-regions .filter-item:hover {
    border:1px solid #6C594F;
}

/* --- Estilo color (regions) --- */
.filter-section-wrap .filter-regions .filter-color-dot {
    width: 28px;
    align-self: stretch;
    flex-shrink: 0;
    background: var(--filter-color);
}

.filter-section-wrap .filter-regions .filter-label {
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: var(--color-gray-dark);
    padding: 4px 16px 4px 8px;
    line-height: normal;
}

/* Regions active — light fill, darker border, both derived from --filter-color */
.filter-section-wrap .filter-regions .filter-item.active {
    background: color-mix(in srgb, var(--filter-color) 35%, var(--color-white));
    border-color: var(--filter-color);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.filter-section-wrap .filter-regions .filter-item.active .filter-color-dot {
    display: none;
}

.filter-section-wrap .filter-regions .filter-item.active .filter-label {
    color: var(--color-gray-dark);
    padding: 4px 16px;
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
}

/* --- Estilo outline (lenses) --- */
.filter-section-wrap .filter-lens .filter-item {
    padding: 0.25rem 1rem 0.25rem 0.3125rem;
    gap: 10px;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

/* Hover — applies to both default and selected */
.filter-section-wrap .filter-lens .filter-item:hover {
    background: var(--color-base-light);
    border-color: var(--color-base-dark);
}

.filter-section-wrap .filter-lens .filter-icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    position: relative;
    border-radius: 50%;
}

.filter-section-wrap .filter-lens .filter-icon img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
}

/* Empty circle — default and hover */
.filter-section-wrap .filter-lens .filter-icon:empty::before {
    content: '';
    display: block;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.6);
    box-sizing: border-box;
}

/* Selected — filled circle with white check */
.filter-section-wrap .filter-lens .filter-item.active .filter-icon:empty::before {
    border: 0;
    background-color: var(--color-base-dark);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='11' viewBox='0 0 13.9875 10.4792' fill='none'%3E%3Cpath d='M4.32708 8.49375L1.41042 5.57708C1.08542 5.25208 0.56875 5.25208 0.24375 5.57708C-0.08125 5.90208 -0.08125 6.41875 0.24375 6.74375L3.73542 10.2354C4.06042 10.5604 4.58542 10.5604 4.91042 10.2354L13.7437 1.41042C14.0687 1.08542 14.0687 0.56875 13.7437 0.24375C13.4187 -0.08125 12.9021 -0.08125 12.5771 0.24375L4.32708 8.49375Z' fill='white'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 11px;
}

.filter-section-wrap .filter-lens .filter-label {
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-gray-dark);
    line-height: normal;
}

/* Separator dot between the two filter groups */
.filter-section-wrap .filter-lens .filter-row::before {
    content: '';
    flex: 0 0 auto;
    align-self: center;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-taupe);
}

/* ================================================
   404 — Error page
   ================================================ */
body.error404 main.main-content {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* La seccion ocupa el alto restante entre header y footer */
.int-section--404 {
    flex: 1;
    display: flex;
    align-items: center;
    min-height: 70vh;
    padding-top: 80px;
    padding-bottom: 80px;
}

.int-section--404 .c-container {
    width: 100%;
}

.error-404 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    padding: 3rem 0;
}

.error-404 .text {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 480px;
    color: var(--color-dark-blue);
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    line-height: 1.5;
    text-align: center;
}

.error-404 .text p {
    margin: 0;
}

.error-404 .cta .site-btn-primary {
    padding: 0.875rem 1.75rem;
    font-size: 18px;
    border-radius: 8px;
}

/* ================================================
   SINGLE HERO (sp-hero)
   ================================================ */

/* La imagen de fondo vive dentro del c-container para
   que el ancho coincida con el hero del home */
.sp-hero.article-hero {
    padding: 0;
    background: none;
    display: block;
    text-align: left;
}

.sp-hero.article-hero::before {
    display: none;
}

.sp-hero-inner {
    position: relative;
    padding: 80px 0 140px;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    border-radius: 16px;
    overflow: hidden;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sp-hero-inner::before {
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    pointer-events: none;
}

.sp-hero-content {
    position: relative;
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
}

.sp-hero-content .badge-category {
    margin-bottom: 16px;
    background: white;
    color: #262626;
    font-size: 14px;
}

.sp-hero-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 12px 0;
}

/* Eyebrow */
.sp-hero-eyebrow {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 600;
    text-transform: uppercase;
    color: white;
    letter-spacing: 0.5px;
    margin-bottom: 4rem;
}

/* Variante Analysis — overlay azul */
.sp-hero--analysis .sp-hero-inner {
    align-items: flex-start;
    padding-top: 0;
}

.sp-hero--analysis .sp-hero-inner::before {
    background: rgba(31, 47, 97, 0.75);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.sp-hero--analysis .sp-hero-content {
    padding-top: 40px;
}

.sp-hero--analysis .sp-hero-content .badge-category {
    background: white;
    color: #262626;
}

.sp-hero--analysis .sp-hero-content h1{
    color: white;
}

/* SINGLE HERO — MOBILE (≤ 767px) */

/* ================================================
   SINGLE TEMPLATES (moved from style.css)
   ================================================ */

body.single .article-meta {
    margin-top: 0;
    padding-left: 35px;
    padding-right: 35px;
}

body.single-videos .article-meta {
    padding-left: 0px;
    padding-right: 0px;
}

body.single .article-content .wpsummary_box {
    border-radius: 0px;
    padding: 10px 20px 15px 25px;
    box-shadow: none;
    font-size: 14px;
    max-width: 670px;
    margin: 5px auto 34px;
    border: 1px solid black;
}

body.single-data .article-content .wpsummary_box{
    margin-top:5px!important;
}

body.single .article-content .wpsummary_box.design-classic li::after {
    display: none;
}

body.single .article-content .wpsummary_box.design-classic ul {
    list-style-type: disc;
    list-style-position: outside;
    padding-left: 15px;
    padding-bottom: 10px;
}

body.single .article-content .wpsummary_box.design-classic .wpsummarize_title {
    font-size: 14px;
    font-weight: bold;
    position: relative;
    padding-left: 2rem;
    padding-top: 15px;
}

body.single .article-content .wpsummary_box.design-classic .wpsummarize_title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23262626' d='M0 9.97761C0 9.54617 0.313038 9.25346 0.744508 9.25346C5.41926 9.25346 9.25351 5.41931 9.25351 0.744508C9.25351 0.291995 9.525 0 9.97773 0C10.4302 0 10.7017 0.291995 10.7017 0.744508C10.7017 5.41931 14.536 9.25346 19.2107 9.25346C19.6421 9.25346 19.9553 9.54617 19.9553 9.97761C19.9553 10.4091 19.6421 10.7018 19.2107 10.7018C14.536 10.7018 10.7017 14.5359 10.7017 19.2108C10.7017 19.6633 10.4302 19.9552 9.97773 19.9552C9.525 19.9552 9.25351 19.6633 9.25351 19.2108C9.25351 14.5359 5.41926 10.7018 0.744508 10.7018C0.313038 10.7018 0 10.4091 0 9.97761Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    content: "";
    display: inline-block;
    position: absolute;
    top: 15px;
    left: 0;
    height: 20px;
    width: 20px;
}

body.single .article-content .wpsummary_box.design-classic .wpsummarize_title::after {
    content: " by CGSP's AI Distiller";
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: #000000;
}

/* Single Infographic */
body.single-infographic .page-headline {
    margin-bottom: 1rem;
}

body.single-infographic .post-thumbnail img {
    width: 100%;
    height: auto;
    border-radius: 16px;
}

body.single-infographic .related-post .card-title,
body.single-infographic .related-post .card-title a {
    color: #121C3A;
    text-align: center;
}

body.single-infographic .related-post .card-title {
    text-align: center;
}

body.single-infographic .related-post .card-cta {
    margin-top: 10px !important;
    margin-bottom: 20px !important;
}

body.single-infographic .related-post .card-cta a {
    background-color: #121C3A;
}

/* Archive Data Tools — hero */
.post-type-archive-data .hero-section {
    margin-top: 60px;
    margin-bottom: 40px;
}
.post-type-archive-data .hero-section .hero-image {
    background-color: transparent;
    border-radius: 12px;
    overflow: hidden;
    max-width: 100%;
    width: 100%;
}
.post-type-archive-data .hero-section .hero {
    position: relative;
}
.post-type-archive-data .hero-section .hero-text {
    align-items: center;
    background-color: white;
    padding: 24px;
    position: absolute;
    max-width: 540px;
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.25);
    color: #121C3A;
    font-size: 26px;
    font-style: normal;
    font-weight: 600;
    line-height: 34px;
    top: -35px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}
.post-type-archive-data .hero-section .hero-text p {
    margin-bottom: 0;
}
.post-type-archive-data .hero-section .hero-image img.img-desktop {
    display: block;
}
.post-type-archive-data .hero-section .hero-image img.img-mobile {
    display: none;
}
section.hero-data-tools {
    padding: 0;
}
section.hero-data-tools .article-hero-content {
    border-radius: 16px;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    width: 100%;
}
section.hero-data-tools .article-hero-content img {
    border-radius: 0 !important;
    height: auto;
    width: 100%;
}
section.hero-data-tools .article-hero-content .btn-open-tool {
    background-color: #2B4288;
    border-radius: 8px;
    color: white;
    display: flex;
    gap: 10px;
    font-size: 18px;
    line-height: 1;
    padding: 21px 37px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-decoration: none;
}
section.hero-data-tools .article-hero-content .btn-open-tool:hover {
    background-color: #516ec8;
}
section.hero-data-tools .article-hero-content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    pointer-events: none;
}

/* Single Data Tools */
body.single-data .page-headline {
    margin-bottom: 2rem;
}

body.single-data .article-hero:before {
    display: none;
}

body.single-data {
    background-color: #F6F1EC;
}

body.single-data .article-meta {
    margin-top: 0px;
}

/* SINGLE TEMPLATES — MOBILE (≤ 767px) */

/* ================================================
   NEWSLETTERS — section
   ================================================ */
.int-section--newsletters .c-container {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

/* Intro */
.nl-intro {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: center;
    max-width: 720px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
.nl-intro .text p {
    font-size: 17px;
    line-height: 31px;
    color: var(--color-gray-dark);
}

/* Group — section heading + grid */
.nl-group {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.nl-group-header .wrap-headline h2 {
    font-family: 'Cantata One', serif;
    font-weight: 400;
    line-height: 34px;
    letter-spacing: -0.78px;
    color: var(--color-dark-blue);
}
.nl-group-header .text p {
    font-size: 17px;
    line-height: 31px;
    color: var(--color-gray-dark);
}
.nl-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: stretch;
}

/* Card */
.nl-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.75rem;
    background: var(--color-white);
    border: 1px solid transparent;
    border-radius: 16px;
    cursor: pointer;
    transition: box-shadow 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}
/* Whole card toggles the selection: same look on hover and when selected */
.nl-card:hover,
.nl-card:has(.nl-card-select input:checked) {
    background: var(--color-blue-pale);
    border-color: var(--color-blue-medium);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}
.nl-card:hover .nl-card-badge,
.nl-card:has(.nl-card-select input:checked) .nl-card-badge {
    background: var(--color-white);
}
.nl-card-body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: flex-start;
}
.nl-card-thumb {
    position: relative;
    width: 100%;
    border-radius: 4px;
    overflow: hidden;
}
.nl-card-thumb img {
    width: 100%;
    aspect-ratio: 311 / 110;
    object-fit: cover;
}
.nl-card-heading {
    display: flex;
    gap: 0.625rem;
    align-items: flex-start;
    width: 100%;
}
.nl-card-heading h3 {
    flex: 1 0 0;
    min-width: 0;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 22px;
    line-height: 29px;
    letter-spacing: -0.66px;
    color: var(--color-dark-blue);
}
.nl-card-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.125rem 0.5rem;
    background: var(--color-blue-pale);
    border-radius: 9999px;
}
.nl-card-badge span {
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    color: var(--color-gray-dark);
}
.nl-card-body .text p {
    font-size: 17px;
    line-height: 28px;
    color: var(--color-gray-dark);
}
.nl-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
}

/* Card — small avatar next to the title */
.nl-card-avatar {
    flex-shrink: 0;
    width: 28px;
    border-radius: 50%;
    overflow: hidden;
}
.nl-card-avatar img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

/* Card — large portrait over the thumbnail */
.nl-card-thumb--people {
    display: flex;
    align-items: center;
    justify-content: center;
}
.nl-card-portrait {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 84px;
    border-radius: 50%;
    overflow: hidden;
}
.nl-card-portrait img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

/* Preview button — fills in on hover and swaps the external-link icon for the
   arrow. Both icons use currentColor, so they turn white with the label. */
.btn-preview {
    gap: 0.75rem;
    padding: 0.5rem 0.75rem 0.5rem 0.75rem;
    border: 1px solid var(--color-blue-soft);
    font-size: 17px;
    letter-spacing: -0.51px;
    color: var(--color-base-dark-ultra);
}
.btn-preview:hover,
.btn-preview:focus,
.btn-preview:active {
    background: var(--color-blue-medium);
    border-color: var(--color-blue-medium);
    color: var(--color-white);
}
.btn-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}
.btn-icon svg {
    position: absolute;
    transition: opacity 0.2s ease;
}
.btn-icon-hover {
    opacity: 0;
}
.btn-preview:hover .btn-icon-default,
.btn-preview:focus .btn-icon-default {
    opacity: 0;
}
.btn-preview:hover .btn-icon-hover,
.btn-preview:focus .btn-icon-hover {
    opacity: 1;
}

/* Select checkbox — proxy of the Gravity Forms choice */
.nl-card-select {
    flex-shrink: 0;
}
.nl-card-select input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
.nl-card-select label {
    position: relative;
    display: block;
    width: 35px;
    height: 35px;
    border: 1px solid var(--color-base-light-semi);
    border-radius: 50%;
    background: var(--color-white);
    cursor: pointer;
    transition: border-color 0.2s ease;
}
.nl-card-select input:checked + label {
    border: 2px solid var(--color-navy);
}
.nl-card-select input:checked + label::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: var(--color-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 13l4 4L19 7' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 15px 15px no-repeat;
}
.nl-card-select input:focus-visible + label {
    outline: 2px solid var(--color-navy);
    outline-offset: 2px;
}

/* Subscribe — Gravity Forms */
.nl-subscribe {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.nl-subscribe .text p {
    font-weight: 500;
    font-size: 17px;
    line-height: 28px;
    color: var(--color-black);
}
.nl-subscribe .gform_wrapper.gravity-theme form,
.nl-subscribe .gform_wrapper form {
    display: grid;
    grid-template-columns: 1fr 142px;
    gap: 1.5rem;
    align-items: stretch;
}
.nl-subscribe .gform-body {
    min-width: 0;
}
.nl-subscribe .gfield--type-email {
    margin: 0;
}
.nl-subscribe .gform_fields {
    list-style: none;
}
/* The visible checkboxes live inside the cards, so the choice list stays hidden.
   Gravity Forms loads its own sheet after this one, hence the !important. */
.nl-subscribe .gform_wrapper .gfield--type-checkbox {
    display: none !important;
}
.nl-subscribe .gfield_label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}
.nl-subscribe .ginput_container_email input {
    width: 100%;
    height: 50px;
    padding: 0 1rem;
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    letter-spacing: -0.6px;
    line-height: 1.3;
    color: var(--color-gray-dark);
}
.nl-subscribe .ginput_container_email input::placeholder {
    color: var(--color-taupe);
}
/* The button fills its grid column and matches the height of the email field.
   The wrapper class is needed to beat the gravity-theme footer margin above. */
.nl-subscribe .gform_wrapper.gravity-theme .gform_footer,
.nl-subscribe .gform_footer {
    display: flex;
    align-items: stretch;
    padding: 0;
    margin: 0;
}
.nl-subscribe .gform_wrapper.gravity-theme .gform_footer .btn-submit,
.nl-subscribe .gform_footer .btn-submit {
    justify-content: center;
    width: 100%;
    height: 50px;
    padding: 0 1rem;
    margin: 0;
    font-size: 17px;
}
.site-btn-primary {
    background: #2B4288;
    color: #fff;
    padding: 8px 12px;
    border: none;
}
.site-btn-primary:hover {
    opacity: 0.7;
}





































































































/* ================================================
   NEWSLETTERS — Tablet (768–1200px)
   ================================================ */
@media (max-width: 1200px) {

    /* Horizontal scroll: 2 cards + 1/4 of the next one */
    .nl-grid {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }
    .nl-grid::-webkit-scrollbar {
        display: none;
    }
    .nl-card {
        flex: 0 0 calc((100% - 3rem) / 2.25);
        flex-shrink: 0;
        scroll-snap-align: start;
    }

}



































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

    .int-section--newsletters .c-container {
        gap: 3rem;
    }

    .nl-intro {
        gap: 1.5rem;
        align-items: stretch;
        text-align: left;
    }
    .nl-intro .text p,
    .nl-group-header .text p,
    .nl-subscribe .text p {
        font-size: 16px;
        line-height: 27px;
    }

    .nl-group-header .wrap-headline h2 {
        font-size: 21px;
        line-height: 26px;
        letter-spacing: -0.63px;
    }

    /* The scroll bleeds to both screen edges (cancels the container padding),
       so 1 card + a peek of the next one is visible. The left padding keeps
       the first card and the snap point aligned with the content. */
    .nl-grid {
        gap: 1rem;
        margin-right: calc(-1 * clamp(0.75rem, 2vw, 1.5rem));
        margin-left: calc(-1 * clamp(0.75rem, 2vw, 1.5rem));
        padding-left: clamp(0.75rem, 2vw, 1.5rem);
        scroll-padding-left: clamp(0.75rem, 2vw, 1.5rem);
    }
    /* End spacer: mirrors the left padding when the last card is reached.
       The negative margin cancels the flex gap before it. */
    .nl-grid::after {
        content: "";
        flex: 0 0 clamp(0.75rem, 2vw, 1.5rem);
        margin-left: -1rem;
    }
    .nl-card {
        flex: 0 0 calc((100% - 1rem) / 1.13);
    }

    .nl-subscribe .gform_wrapper.gravity-theme form,
    .nl-subscribe .gform_wrapper form {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* ================================================
   MODULE LATEST VIDEOS — single-video page
   ================================================ */
.int-section--latest-videos {
    --lv-gap-section: 32px;
    --lv-gap-grid: 24px;
    --lv-gap-card: 12px;
    --lv-gap-content: 12px;
    --lv-card-radius: 16px;
    --lv-card-padding: 8px;
    --lv-card-h: 154px;
    --lv-thumb-w: 117px;
    --lv-thumb-min-h: 130px;
    --lv-thumb-radius-outer: 12px;
    --lv-thumb-radius-inner: 8px;
    --lv-card-bg: #ffffff;
    --lv-title-size: 21px;
    --lv-title-color: #121C3A;
    --lv-title-tracking: -0.63px;
    --lv-title-clamp: 3;
}

.int-section--latest-videos .lv-header h2,
.int-section--latest-videos .hscroll-header h2 {
    text-transform: uppercase;
}

.int-section--latest-videos .lv-outer {
    display: flex;
    flex-direction: column;
    gap: var(--lv-gap-section);
}

.int-section--latest-videos .lv-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.int-section--latest-videos .lv-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--lv-gap-grid);
}

.int-section--latest-videos .lv-card {
    background: var(--lv-card-bg);
    border-radius: var(--lv-card-radius);
    padding: var(--lv-card-padding);
    height: var(--lv-card-h);
    overflow: hidden;
}

.int-section--latest-videos .lv-card .card-link {
    display: flex;
    align-items: stretch;
    gap: var(--lv-gap-card);
    text-decoration: none;
    color: inherit;
}

.int-section--latest-videos .lv-card-content {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--lv-gap-content);
    padding: 4px 8px;
}

.int-section--latest-videos .card-title {
    font-family: 'Cantata One', serif;
    font-size: var(--lv-title-size);
    line-height: 1.3;
    letter-spacing: var(--lv-title-tracking);
    color: var(--lv-title-color);
    display: -webkit-box;
    -webkit-line-clamp: var(--lv-title-clamp);
    line-clamp: var(--lv-title-clamp);
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0;
}

.int-section--latest-videos .lv-card-thumb {
    position: relative;
    flex-shrink: 0;
    width: var(--lv-thumb-w);
    min-height: var(--lv-thumb-min-h);
    border-radius: var(--lv-thumb-radius-outer) var(--lv-thumb-radius-inner) var(--lv-thumb-radius-inner) var(--lv-thumb-radius-outer);
    overflow: hidden;
}

.int-section--latest-videos .lv-card-thumb img {
    aspect-ratio: 9 / 12;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ==========================================================
   NEWSLETTER — banner mode (.newsletter.is-banner)
   ========================================================== */
.newsletter.is-banner {
    --banner-wrap-margin: 0;
    --banner-wrap-padding: 0;
    --banner-radius: 0;
    --banner-breakpoint: 992px;
}
.newsletter.is-banner .wrap-banner {
    margin: var(--banner-wrap-margin);
    padding: var(--banner-wrap-padding);
}
.newsletter.is-banner .banner-link {
    display: block;
    line-height: 0;
    border-radius: var(--banner-radius);
    overflow: hidden;
}
.newsletter.is-banner .banner-img {
    width: 100%;
    height: auto;
}
.newsletter.is-banner .banner-img-desktop {
    display: none;
}
.newsletter.is-banner .banner-img-mobile {
    display: block;
}

/* ================================================
   MODULE — Featured video (fade carousel)
   ================================================ */
.featured-video-fade .vg-featured {
    display: grid;
    grid-template-areas: "slide";
    position: relative;
    touch-action: pan-y;
    overscroll-behavior-x: contain;
}
/* Out of flow, so a hidden slide with a longer text does not stretch the
   block: only the active one below is measured. */
.featured-video-fade .vg-card.card {
    grid-area: slide;
    position: absolute;
    inset: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.8s ease, visibility 0.8s ease;
}
.featured-video-fade .vg-card.card.is-active {
    position: relative;
    inset: auto;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
/* Only the video (play), the title link and Read More are clickable, so the
   card itself drops the pointer set by `.int-section--videos .vg-card`. */
.featured-video-fade .vg-card {
    cursor: auto;
}
/* No zoom or play-btn override here: the hero inherits the site-wide hover
   (scale 1.08 in 1.5s, play-btn at 0.7), which already covers <video>. */
.featured-video-fade .card-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}
.featured-video-fade .card-title a:hover,
.featured-video-fade .card-title a:focus {
    color: var(--color-navy);
}
.featured-video-fade.int-section--videos.version_2 .vg-featured .card-link {
    flex-direction: row-reverse;
    align-items: center;
    gap: 32px;
}
/* The gap is taken off the video, so the text column keeps its width */
.featured-video-fade.int-section--videos.version_2 .vg-featured .card-image {
    flex: 0 0 calc(68% - 32px);
}
.featured-video-fade.int-section--videos.version_2 .vg-featured .card-body {
    flex: 0 0 32%;
    padding: 0.5rem 0;
}
.featured-video-fade .vg-featured .card-title {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.78px;
    color: var(--color-dark-blue);
}
.featured-video-fade .vg-featured .card-text p {
    font-size: 16px;
    line-height: 23px;
    color: var(--color-gray-dark);
}
/* Bigger than the 14px every other .site-btn uses */
.featured-video-fade .hero-read-more {
    font-size: 17px;
    margin-top:10px;
}
/* No side padding, so the arrows line up with the ones in Latest Videos */
.featured-video-fade .controls {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 0;
    margin-top: 15px;
}
.featured-video-fade .dots {
    grid-column: 2;
    justify-self: center;
    display: flex;
    align-items: center;
    gap: 16px;
}
.featured-video-fade .controls .carousel-nav {
    grid-column: 3;
    justify-self: end;
}
.featured-video-fade .dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #BCAAA1;
    opacity: 0.4;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.2s;
}
.featured-video-fade .dot.is-active {
    background: #947D74;
    opacity: 1;
}

/* ================================================
   MODULE — Latest videos (page-videos prototype)
   ================================================ */
.int-section--latest-videos .col-card { padding: 0; }
.int-section--latest-videos .col-card .post-thumb {
    aspect-ratio: 280 / 420;
    min-height: 0;
}

/* ================================================
   MODULE — The Debrief
   ================================================ */
.int-section--debrief .hscroll-header > div:first-child,
.hscroll-header .wrap-header-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.int-section--debrief .wrap-desc p,
.int-section--podcasts .wrap-desc p {
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;
    color: #000;
    text-transform: capitalize;
}
.int-section--debrief .col-card .post-thumb {
    aspect-ratio: 300 / 169;
    min-height: 0;
}

/* ================================================
   MODULE — Videos by Category (videos-latest carousel)
   ================================================ */
.int-section--videos-latest-carousel .section-header { padding: 0 0 0 35px; }
.int-section--videos-latest .hscroll-list { gap: 12px; }
.int-section--videos-latest .col-card {
    background: transparent;
    padding: 0;
    width: 220px;
}
.int-section--videos-latest .col-card .post-thumb {
    aspect-ratio: 9 / 14;
    border-radius: 12px;
    min-height: 0;
}

/* width 100%, not max-content: the cards are sized in percentages */
.int-section--videos-latest-carousel .hscroll-list {
    padding: 0;
    width: 100%;
}

.int-section--videos-latest-carousel .col-card .post-content h3 {
    font-size: 18px;
    line-height: 24px;
}

.dt-section .wrap-headline{
    margin-bottom: 10px;
}
.dt-section .dt-intro-text {
    margin-bottom: 20px;
}
.wp-block-paragraph{
    margin-bottom: 1rem;
}
.wpsummarize_toggle-btn { display:none !important;}

.cgsp-chat-fullpage .cgsp-chat-input-bar{
    background: transparent !important;
    border: none !important;
}

/* ================================================
   MODULE — Podcasts (reusa el card del module videos)
   ================================================ */
/* Carousel — reusa el patrón hscroll de columnists */
.int-section--podcasts {
    padding: 2.5rem 0rem;
}

/* No right padding: the last card is cut against the right edge */
.int-section--podcasts .hscroll-outer {
    padding: 1.5rem 0 1.5rem 1.5rem;
}

/* The header keeps its right spacing, the cards do not */
.int-section--podcasts .hscroll-header {
    padding-right: 1.5rem;
}

/* Percentage widths so a card is always partially cut */
.int-section--podcasts .hscroll-list {
    width: 100%;
    gap: 2%;
}

/* Desktop: 3 cards + 1/5 */
.int-section--podcasts .col-card {
    width: 29.3%;
}

body.page-id-58301 .headline .page-headline, /* advisors services */
body.page-id-59167 .headline .page-headline { /* about page */
    margin-bottom: 4rem;
}


























/* ================================================
   MEDIA QUERIES (consolidated)
   ================================================ */

/* container max-width steps removed — the container is now fluid up to 1310px */

@media (min-width: 768px) {

    .vh-body {
        gap: 24px;
    }
    .vh-medium {
        flex-direction: row;
        gap: 24px;
    }
    .vh-sidebar {
        flex-direction: row;
        gap: 24px;
    }
    .vh-card-h {
        flex: 1;
    }
    .vh-hero .post-content {
        padding: 8px 16px;
    }
    .vh-hero h2 {
        font-size: 26px;
        letter-spacing: -0.78px;
    }
    .vh-hero .text p {
        line-height: 23px;
    }
    /* Hero back to Author S on tablet */
    .vh-hero .post-avatar { width: 28px; height: 28px; }
    .vh-hero .post-role { font-size: 11px; }

    .padding-small.pt-lg-0 {
        padding-top: 0 !important;
    }

    .padding-large.pt-lg-0 {
        padding-top: 0 !important;
    }

    .padding-small.pb-lg-0 {
        padding-bottom: 0 !important;
    }

    .padding-large.pb-lg-0 {
        padding-bottom: 0 !important;
    }
/* end - min-width: 768px */
}





















@media (min-width: 992px) {

    .newsletter.is-banner .banner-img-desktop {
        display: block;
    }
    .newsletter.is-banner .banner-img-mobile {
        display: none;
    }
/* end - min-width: 992px */
}






















/* container max-width steps removed — the container is now fluid up to 1310px */









@media (min-width:768px) and (max-width: 1200px) {
    /* Tablet: 2 cards + 1/5 */
    .version-1 .dt-card {
        width: calc((100% - 48px) / 2.2);
    }

    /* Columnists: 3 cards + 1/5 */
    .int-section--columnists .col-card {
        width: calc((100% - 72px) / 3.2);
    }
}







@media (min-width: 1201px) {

    .vh-body {
        grid-template-columns: 3fr 2fr;
    }
    .vh-hero {
        grid-column: 1;
        grid-row: 1;
    }
    .vh-medium {
        grid-column: 1;
        grid-row: 2;
    }
    .vh-sidebar {
        grid-column: 2;
        grid-row: 1 / 3;
        flex-direction: column;
    }
    .vh-card-h {
        flex: 1;
    }
    .vh-card-h .post-thumb {
        flex: 0 0 117px;
    }
    .vh-card-h h4 {
        font-size: 21px;
        letter-spacing: -0.63px;
    }
    /* Desktop: horizontal cards back to Author S */
    .vh-card-h .post-avatar { width: 28px; height: 28px; }
    .vh-card-h .post-role { font-size: 11px; }
    /* Show desktop-only card */
    .vh-card-desktop {
        display: flex;
    }

    /* Desktop: every item fits, so no scroll and no fade */
    .vl-sidebar {
        flex-shrink: 0;
        align-self: flex-start;
        justify-content: center;
        overflow-x: visible;
        mask-image: none;
        -webkit-mask-image: none;
    }
    .vl-section {
        gap: 32px;
    }
    .int-section--videos-latest .section-header {
        padding: 0 8px;
    }
    .vl-grid {
        flex-wrap: wrap;
        overflow-x: visible;
        gap: 24px;
        padding: 0;
        scroll-snap-type: none;
    }
    .vl-card {
        flex-direction: row;
        flex-shrink: 1;
        flex: 0 0 calc(50% - 12px);
        width: auto;
        scroll-snap-align: unset;
        align-items: stretch;
    }
    .vl-card .post-content {
        flex: 1;
        padding: 4px 8px;
        order: -1;
    }
    .vl-card .post-thumb {
        flex: 0 0 117px;
        height: 130px;
        aspect-ratio: auto;
        border-radius: 12px 8px 8px 12px;
    }
    .vl-card h3 {
        font-size: 21px;
        letter-spacing: -0.63px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    /* Desktop: Author S */
    .int-section--videos-latest .post-avatar { width: 28px; height: 28px; }
    .int-section--videos-latest .post-role { font-size: 11px; }

    .vc-hero {
        flex-direction: row;
        align-items: center;
    }
    .vc-hero .post-thumb {
        flex: 0 0 66%;
    }
    .vc-hero .post-content {
        order: -1;
        flex: 1;
        padding: 0.5rem 1rem 0.5rem 0;
    }
    .vc-hero h2 {
        font-size: 26px;
        letter-spacing: -0.78px;
    }
    .vc-hero .text p {
        line-height: 31px;
    }
    .vc-hero .post-avatar { width: 28px; height: 28px; }
    .vc-hero .post-role { font-size: 11px; }
    .vc-hero .cta {
        justify-content: flex-start;
    }

    .vc-grid {
        grid-template-columns: repeat(5, 1fr);
        gap: 24px;
    }

    /* Single video: carousel cards show only the title on desktop */
    .sv-card .post-meta {
        display: none;
    }

    .hide-on-desktop { display: none; }

    /* Header — search alineado a la derecha junto al user */
    .nav-top .c-container {
        justify-content: flex-start;
    }
    .nav-search-trigger {
        margin-left: auto;
    }

    /* Header — hover + active fondo blanco (excepto home/category/tag) */
    .nav-menu-item:not(.btn) .nav-menu-link:hover,
    .nav-menu-item:not(.btn).is-active .nav-menu-link {
        background-color: #ffffff;
        border-radius: 8px;
        opacity: 1;
    }
    body.home .nav-menu-item:not(.btn) .nav-menu-link:hover,
    body.home .nav-menu-item:not(.btn).is-active .nav-menu-link,
    body.category .nav-menu-item:not(.btn) .nav-menu-link:hover,
    body.category .nav-menu-item:not(.btn).is-active .nav-menu-link,
    body.tag .nav-menu-item:not(.btn) .nav-menu-link:hover,
    body.tag .nav-menu-item:not(.btn).is-active .nav-menu-link {
        background-color: transparent;
        opacity: .75;
    }
/* end - min-width: 1201px */
}















/* container max-width steps removed — the container is now fluid up to 1310px */
























@media (min-width: 768px) and (max-width: 1200px) {

/* V1: body en columna */
  .int-section--videos.version_1 .vg-body { flex-direction: column; }
  .int-section--videos.version_1 .vg-col-left,
  .int-section--videos.version_1 .vg-col-right { flex: none; width: 100%; }

  /* V1: main/featured horizontal */
  .int-section--videos.version_1 .vg-main .card-link,
  .int-section--videos.version_1 .vg-featured .card-link {
    flex-direction: row;
    align-items: stretch;
  }
  .int-section--videos.version_1 .vg-main .card-image,
  .int-section--videos.version_1 .vg-featured .card-image { flex: 0 0 50%; }
  .int-section--videos.version_1 .vg-main .post-thumb,
  .int-section--videos.version_1 .vg-featured .post-thumb {
    aspect-ratio: unset;
    height: 100%;
    min-height: 220px;
  }
  .int-section--videos.version_1 .vg-main .card-body,
  .int-section--videos.version_1 .vg-featured .card-body { flex: 1; padding: 20px 24px; justify-content: center; }

  /* V2: tablet — only the first 3 cards, no scroll */
  .int-section--videos.version_2 .vg-carousel .vg-card:nth-child(n+4) {
    display: none;
  }

    /* Latest shorts — 3 cards + 1/5 */
    .int-section--latestshort .short-item {
        width: calc((100% - 72px) / 3.2);
    }

    /* Tablet: same horizontal bar as mobile, it just scrolls to the right */
    .vl-sidebar {
        flex-shrink: 0;
        align-self: flex-start;
    }
    .vl-section {
        gap: 32px;
    }
    .int-section--videos-latest .section-header {
        padding: 0 8px;
    }
    .vl-grid {
        flex-wrap: wrap;
        overflow-x: visible;
        gap: 24px;
        padding: 0;
        scroll-snap-type: none;
    }
    .vl-card {
        flex-direction: row;
        flex-shrink: 1;
        flex: 0 0 100%;
        width: auto;
        scroll-snap-align: unset;
        align-items: stretch;
    }
    .vl-card .post-content {
        flex: 1;
        padding: 4px 8px;
        order: -1;
    }
    .vl-card .post-thumb {
        flex: 0 0 80px;
        height: 130px;
        aspect-ratio: auto;
        border-radius: 12px 8px 8px 12px;
    }
    .vl-card h3 {
        font-size: 15px;
        letter-spacing: -0.45px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .vc-hero {
        flex-direction: row;
        align-items: center;
    }
    .vc-hero .post-thumb {
        flex: 0 0 66%;
    }
    .vc-hero .post-content {
        order: -1;
        flex: 1;
        padding: 0.5rem 1rem 0.5rem 0;
    }
    .vc-hero h2 {
        font-size: 26px;
        letter-spacing: -0.78px;
    }
    .vc-hero .text p {
        line-height: 23px;
    }
    .vc-hero .post-avatar { width: 28px; height: 28px; }
    .vc-hero .post-role { font-size: 11px; }
    .vc-hero .cta {
        justify-content: flex-start;
    }

    .vc-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    /* Single video carousels: 3 cards + 1/3 (latest), 2 + 1/3 (debrief) */
    .int-section--sv-latest .sv-card {
        width: calc((100% - 72px) / 3.3);
    }
    .int-section--sv-debrief .sv-card {
        width: calc((100% - 48px) / 2.3);
    }

    .hide-on-tablet { display: none; }

    .post-data-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .dt-filters-top {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    .dt-filters-search {
        order: -1;
        width: 100%;
        margin-bottom: 0;
        padding: 6px 8px 6px 16px;
    }

    .dt-filters-search-input {
        padding: 8px 0;
        font-size: 16px;
    }

    .dt-filters-search-btn {
        width: 36px;
        height: 36px;
    }

    .dt-filters-tabs {
        width: 100%;
    }

    .dt-filters-panel {
        gap: 12px 32px;
    }

    .dt-filters--dropdown .dt-filters-top {
        align-items: stretch;
    }

    .rp-grid {
        display: flex;
        flex-wrap: nowrap;
        gap: 2%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 4px 24px;
        margin: 0 -24px;
        scroll-snap-type: x mandatory;
    }

    .rp-grid::-webkit-scrollbar {
        display: none;
    }

    .rp-card {
        /* 2 + 1/5 visible: (100% - 2 gaps of 2%) / 2.2 */
        flex: 0 0 43.6364%;
        scroll-snap-align: start;
    }

    .ig-featured-link {
        gap: 16px;
    }

    .ig-featured-thumb {
        flex: 0 0 360px;
        width: 360px;
        height: 240px;
    }

    .ig-featured-title {
        font-size: 24px;
    }

    .ig-card-thumb {
        flex: 0 0 320px;
        width: 320px;
        height: 200px;
    }

    .ig-card-text p {
        padding-right: 16px;
    }

    .ig-list {
        gap: 32px;
    }

    .sp-header {
        padding: 32px 0 16px;
    }

    .sp-content-section .c-container {
        gap: 32px;
    }

    .search-card .post-thumb {
        flex: 0 0 240px;
    }

    .search-card h3 {
        font-size: 21px;
        line-height: 30px;
    }

    /* Coverage map — map full width on top, sidebar + posts below */
    .coverage-toggle {
        display: none;
    }

    .coverage-layout {
        display: grid;
        grid-template-columns: 200px minmax(0, 1fr);
        grid-template-areas:
            "map map"
            "sidebar posts";
        gap: 12px;
    }

    .coverage-main {
        display: contents;
    }

    .coverage-map {
        grid-area: map;
    }

    .coverage-sidebar {
        grid-area: sidebar;
    }

    .coverage-posts {
        grid-area: posts;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
/* MODULE — Featured video (tablet) */
.featured-video-fade.int-section--videos.version_2 .vg-featured .card-image { flex: 0 0 calc(60% - 32px); }
.featured-video-fade.int-section--videos.version_2 .vg-featured .card-body { flex: 0 0 40%; }

/* end - min-width: 768px / max-width: 1200px */
}

























/* REGIONS module — stacks earlier than the global tablet breakpoint.
   The row layout needs the 1310px .c-container: below 1400px the container
   drops to 1140px and the featured card is left with ~240px of text next to
   a 300px thumb. */
@media (max-width: 1399px) {

    .region-body {
        flex-direction: column;
    }

    .region-featured .post-card {
        height: auto;
    }

    .region-secondary {
        width: 100%;
        grid-template-columns: repeat(4, 1fr);
    }

    .region-secondary .post-card {
        width: auto;
    }

    .region-secondary .post-thumb {
        height: 200px;
        min-height: 200px;
    }

    .region-secondary .post-content h4 {
        font-size: 21px !important;
        line-height: 30px;
    }
/* end - max-width: 1399px */
}




















































@media (max-width: 1200px) {

    .filter-section-wrap {
        justify-content: flex-start;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .filter-section-wrap::-webkit-scrollbar {
        display: none;
    }

    .filter-section-wrap .filter-section {
        flex-shrink: 0;
    }

    .filter-section-wrap .filter-row {
        justify-content: flex-start;
        overflow: visible;
    }

    .fa-wrapper {
        grid-template-columns: 1fr 1fr;
    }

    .fa-right {
        padding: 32px 48px;
        gap: 24px;
    }

    .fa-text {
        column-count: 1;
    }

    .fa-intro .h2 {
        font-size: 26px;
        line-height: 48px;
    }

    .fa-primary {
        gap: 24px;
    }

    .fa-hero {
        padding: 32px;
        min-height: 659px;
    }

    .fa-hero-top h3 {
        font-size: 32px;
        letter-spacing: -0.96px;
    }

    .fa-hero-article .text {
        padding: 32px;
    }

    .fa-others {
        padding-top: 73px;
    }

    .fa-card--vertical .fa-card-photo {
        height: 160px;
    }

    .fa-card--vertical h4,
    .fa-card--vertical .h4 {
        font-size: 21px;
        letter-spacing: -0.63px;
    }

    .fa-card-excerpt {
        display: none;
    }

    .fa-list-card-body {
        margin-right: 200px;
    }

    .fa-list-card-photo {
        width: 250px;
    }

    .ctt-kpi-row {
        grid-template-columns: repeat(2, 1fr);
    }
    .ctt-charts-row {
        grid-template-columns: 1fr;
    }

    section.newsletter .wrap-form {
        flex-direction: column;
        gap: 24px;
    }
    section.newsletter .wrap-headline {
        width: 100%;
        padding: 8px 24px 0;
    }
    section.newsletter .wrap-form h2 {
        font-size: 21px;
        letter-spacing: -0.63px;
    }
    section.newsletter .box-form {
        padding: 0 24px 8px;
    }
    section.newsletter .box-thumb {
        width: 100%;
    }
    section.newsletter .box-thumb img {
      height: 250px!important;
  }

    .wrap-footer {
        gap: 80px;
    }

    .cat-layout {
        align-items: flex-start;
        gap:18px;
        margin-bottom: -150px;
    }

    .cat-left {
        margin-bottom: 1rem;
        top:-150px;
        width: 50%;
    }

    .cat-hero-content {
        padding: 24px 32px 16px;
    }

    .cat-hero h1 {
        font-size: 32px !important;
    }

    .cat-hero .text p {
        font-size: 16px;
        line-height: 26px;
    }

    .cat-inline .post-thumb {
        height: 180px;
        min-height: 180px;
    }

    .cat-inline h2,
    .cat-inline .h3 {
        font-size: 21px !important;
        line-height: 29px;
    }

    /* Stacked: horizontal layout */
    .cat-stacked {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .cat-inline {
        gap: 18px;
    }

    .cat-stacked .post-card {
        flex-direction: row-reverse;
        align-items: stretch;
    }

    .cat-stacked .post-thumb {
        width: 120px;
        min-width: 120px;
        height: auto;
        min-height: unset;
        aspect-ratio: 1;
        border-radius: 0 8px 8px 0;
    }

    .cat-stacked .post-content {
        flex: 1;
        min-width: 0;
        overflow: hidden;
    }

    .cat-stacked h3 {
        font-size: 18px !important;
        line-height: 25px;
    }

    /* v0-video tablet */
    .default_cluster_video .cat-stacked {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .default_cluster_video .cat-stacked .post-card:first-child {
        grid-row: auto;
        flex-direction: column;
    }

    .default_cluster_video .cat-stacked .post-card:first-child .post-thumb {
        width: 100%;
        min-width: unset;
        height: auto;
        min-height: 200px;
        aspect-ratio: unset;
        border-radius: 8px 8px 0 0;
    }

    /* live_blog_v1 tablet */
    .live_blog_v1 .cat-stacked .post-card:nth-child(n+5) {
        display: flex;
    }

    .live_blog_v1 .cat-stacked .post-card {
        flex-direction: row-reverse;
        align-items: stretch;
    }

    .live_blog_v1 .cat-stacked .post-thumb {
        width: 120px;
        min-width: 120px;
        height: auto;
        min-height: unset;
        aspect-ratio: 1;
        border-radius: 0 8px 8px 0;
    }

    /* live_blog_v1_video tablet */
    .live_blog_v1_video .cat-stacked {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .live_blog_v1_video .cat-stacked .post-card:first-child {
        grid-row: auto;
        flex-direction: column;
    }

    .live_blog_v1_video .cat-stacked .post-card:first-child .post-thumb {
        width: 100%;
        min-width: unset;
        height: auto;
        min-height: 200px;
        aspect-ratio: unset;
        border-radius: 8px 8px 0 0;
    }

    /* live_blog_v2 tablet */
    .live_blog_v2 .cat-bottom {
        flex-wrap: wrap;
    }

    .live_blog_v2 .cat-bottom .post-card {
        flex: 1 0 calc(33.333% - 16px);
    }

    /* live_blog_v2_video tablet */
    .live_blog_v2_video .cat-right-row {
        flex-direction: column;
    }

    .live_blog_v2_video .cat-video-right {
        flex: none;
    }

    .live_blog_v2_video .cat-bottom {
        flex-wrap: wrap;
    }

    .live_blog_v2_video .cat-bottom .post-card {
        flex: 1 0 calc(33.333% - 16px);
    }

    .story-layout {
        flex-direction: column;
    }

    .story-featured .post-thumb {
        flex: 0 0 45%;
    }

    .story-grid {
        flex: auto;
        flex-wrap: nowrap;
    }

    .story-secondary {
        flex: 1;
    }

    .story-secondary .post-thumb {
        min-height: 200px;
    }

    .story-secondary .post-content h3 {
        font-size: 21px;
        line-height: 30px;
        letter-spacing: -0.63px;
    }

    .story-secondary .post-avatar {
        width: 32px;
        height: 32px;
    }

    .story-secondary .post-role {
        font-size: 13px;
    }

    .nav-main {
        padding: 12px 16px;
    }

    .nav-hamburger {
        display: inline-flex;
    }

    .nav-bottom,
    .nav-user {
        display: none;
    }

    .nav-search-trigger {
        min-width: 0;
        flex: 1;
        max-width: 300px;
    }

    .nav-top {
        gap: 12px;
    }

    .int-section--404 {
        min-height: 60vh;
    }

    .int-section--newsletters .c-container {
        gap: 60px;
        padding-bottom: 0px;
    }

    /* No inline padding here: .dt-intro and .dt-list already carry their
       own 24px, so adding it on the outer made left and right differ */
    .version-1 .dt-outer {
        padding: 24px 0;
    }

    .version-1 .carousel-nav {
        display: none;
    }
/* end - max-width: 1200px */
}

@media (max-width: 991px) {

    /* DATA TOOLS V2 — mobile (igual a V1) */
  .version-2 .dt-outer {
    flex-direction: column;
    min-height: unset;
    padding: 24px 0;
    gap: 0;
  }
  .version-2 .dt-bg-img { display: none; }
  .version-2 .dt-intro {
    flex: none;
    width: 100%;
    flex-direction: column;
    gap: 0;
    padding: 0 24px 16px;
  }
  .version-2 .dt-intro-top { width: 100%; justify-content: space-between; }
  .version-2 .carousel-nav { display: flex; }
  .version-2 .dt-scroll {
    flex: none;
    width: 100%;
    max-height: none;
    overflow-x: auto;
    overflow-y: clip;
  }
  .version-2 .dt-scroll::-webkit-scrollbar { height: 4px; width: auto; }
  .version-2 .dt-scroll::-webkit-scrollbar-thumb {
    background: rgba(148, 125, 116, 0.3);
    border-radius: 4px;
  }
  .version-2 .dt-list {
    flex-direction: row;
    gap: 24px;
    padding: 0 24px 8px;
    width: max-content;
  }
  .version-2 .dt-card {
    flex-direction: column;
    width: clamp(260px, 80vw, 350px);
    height: auto;
    transition: box-shadow 0.25s ease;
  }
  .version-2 .dt-card:hover {
    width: clamp(260px, 80vw, 350px);
  }
  .version-2 .dt-card-image {
    aspect-ratio: 379 / 213;
    width: 100%;
    border-radius: 16px 16px 0 0;
    align-self: unset;
  }
  .version-2 .dt-card-body {
    flex: none;
    justify-content: flex-start;
    padding: 16px 16px 24px;
    gap: 12px;
    min-width: unset;
  }
  .version-2 .dt-card-body p {
    display: block;
    overflow: visible;
    line-height: 23px;
  }
  .version-2 .dt-cta { display: none; }
/* end - max-width: 991px */
}


@media(min-width: 481px) and (max-width: 991px) {
    .fa-list-card-body {
        width: 80%!important;
    }
}

@media(max-width: 480px){
    .fa-list-card-body {
        width: 75%!important;
    }
}






















@media (max-width: 767px) {

    /* Single video: vertical video takes the full width */
    .sp-visual--vertical .post-thumb {
        width: 100%;
    }

    /* Single video: description text */
    .sp-content--video p {
        font-size: 16px;
        line-height: 28px;
        margin-bottom: 1.75rem;
    }

    /* Single video carousels: 12px stops, 1 card + peek */
    .int-section--sv-carousel .hscroll-outer {
        padding: 0.75rem 0;
    }
    .int-section--sv-carousel .hscroll-header {
        padding: 0 0.75rem;
    }
    .int-section--sv-carousel .hscroll-list {
        padding-inline-start: 0.75rem;
    }
    .int-section--sv-carousel .hscroll-list::after {
        flex: 0 0 0.75rem;
        margin-inline-start: -12px;
    }
    .int-section--sv-carousel .hscroll-scroll {
        scroll-padding-inline: 0.75rem;
    }
    .int-section--sv-latest .sv-card {
        width: calc((100% - 12px) / 1.4);
    }
    .int-section--sv-debrief .sv-card {
        width: calc((100% - 12px) / 1.2);
    }

  .int-section--videos .section-header h2 { font-size: 21px; line-height: 30px; }
  .int-section--videos .card-title { font-size: 18px !important; }

  /* V1: una sola columna */
  .int-section--videos.version_1 .vg-body { flex-direction: column; }
  .int-section--videos.version_1 .vg-col-left,
  .int-section--videos.version_1 .vg-col-right { flex: none; width: 100%; }

  /* V1: main/featured stack vertical, thumb 16/9 */
  .int-section--videos.version_1 .vg-main .card-link,
  .int-section--videos.version_1 .vg-featured .card-link { flex-direction: column; }
  .int-section--videos.version_1 .vg-main .post-thumb,
  .int-section--videos.version_1 .vg-featured .post-thumb { aspect-ratio: 16 / 9; }

  .module-post_featured_secondary .c-container{
    display: flex;
    flex-direction: column-reverse;
    gap: 15px;
    padding-left: 0;
    padding-right: 0;
  }

  /* V1: grid → scroll horizontal, cards 250px */
  .int-section--videos.version_1 .vg-grid {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 12px;
  }
  .int-section--videos.version_1 .vg-grid::-webkit-scrollbar { display: none; }
  .int-section--videos.version_1 .vg-grid .vg-card {
    flex: 0 0 250px;
    width: 250px;
    min-width: 0;
  }
  .int-section--videos.version_1 .vg-grid .post-thumb { aspect-ratio: 16 / 9; }

  /* V2 featured: pasa a columna en mobile */
  .int-section--videos.version_2 .vg-featured .card-link { flex-direction: column; align-items: unset; }
  .int-section--videos.version_2 .vg-featured .card-image { flex: none; width: 100%; }
  .int-section--videos.version_2 .vg-featured .post-thumb {
    flex: none; width: 100%; min-width: 0; height: auto; aspect-ratio: 16 / 9;
  }
  .int-section--videos.version_2 .vg-featured .card-body { flex: none; min-width: 0; padding: 8px 16px 16px; }

  /* V2: mobile — horizontal scroll with all the cards, next one peeking ~1/3 */
  .int-section--videos.version_2 .vg-carousel .hscroll-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
  }
  /* 1 card + 1/7 */
  .int-section--videos.version_2 .vg-carousel .vg-card {
    flex: 0 0 calc((100% - 24px) / 1.05);
  }
  .int-section--videos.version_2 .vg-carousel .vg-card:nth-child(n+4) {
    display: block;
  }

  .video-popup { padding: 12px; }
  .video-popup-title { font-size: 16px; }
  .video-popup-header { padding: 12px 52px 12px 16px; }

    .module-research_commentary_global .int-section--analysis {
        padding: 24px 12px;
    }

    .fa-wrapper {
        grid-template-columns: 1fr;
        gap: 16px;
        border-radius: 16px;
        padding: 32px 24px;
    }

    .fa-bg {
        width: 100%;
        height: 60%;
    }

    .fa-left {
        min-height: auto;
        gap: 32px;
    }

    .fa-left .wrap-headline h2 {
        font-size: 21px!important;
        line-height: 30px;
    }

    .fa-left h3 {
        font-size: 22px !important;
        line-height: 29px;
        letter-spacing: normal;
    }

    .fa-right {
        padding: 24px;
        gap: 24px;
    }

    .fa-text {
        column-count: 1;
    }

    .int-section--featured-analysis {
        padding-bottom: 40px;
    }

    .fa-primary {
        gap: 12px;
    }

    .fa-intro {
        padding: 0 12px;
    }

    .fa-intro .h2 {
        font-size: 21px;
        line-height: 36px;
    }

    .fa-intro .text p {
        font-size: 19px;
    }

    .fa-cluster {
        flex-direction: column;
        gap: 12px;
    }

    .fa-hero {
        padding: 24px;
        min-height: auto;
        margin: 0 12px;
        gap: 16px;
    }

    .fa-hero-bg {
        height: 493px;
        width: 100%;
    }

    .fa-hero-overlay {
        height: 493px;
        width: 100%;
    }

    .fa-hero-top {
        gap: 32px;
        padding-bottom: 0;
    }

    .fa-hero-top h3 {
        font-size: 21px;
        line-height: 29px;
        letter-spacing: normal;
    }

    /* Meta: reposition above white box */
    .fa-hero-article {
        background: transparent;
        padding: 0;
    }

    .fa-hero-meta {
        order: -1;
        padding: 8px 0;
    }

    .fa-hero-meta .post-author,
    .fa-hero-meta .post-role {
        color: white;
    }

    .fa-hero-meta .fa-dates {
        color: white;
    }

    .fa-dates {
        flex-direction: column;
    }

    .fa-hero-article .text {
        background: white;
        border-radius: 8px;
        padding: 24px;
    }

    /* Others: single column */
    .fa-others {
        padding-top: 0;
        padding: 0 12px;
    }

    .fa-inline {
        flex-direction: column;
        gap: 24px;
    }

    .fa-card-excerpt {
        display: block;
    }

    .fa-card--vertical .fa-card-photo {
        height: 250px;
    }

    /* Horizontal cards */
    .fa-card--horizontal > a {
        align-items: center;
    }

    .fa-card--horizontal .fa-card-photo {
        width: 135px;
        height: 207px;
    }

    .fa-card--horizontal .fa-card-body {
        height: 100%;
        margin-right: 92px;
    }

    .int-section--analysis-list {
        padding-bottom: 40px;
    }

    .fa-list {
        gap: 12px;
        padding: 0 12px;
    }

    .analysis-filters .wrap-headline h2 {
        font-size: 18px !important;
        line-height: 25px;
    }

    .fa-list-card > a {
        min-height: auto;
    }

    .fa-list-card-body {
        margin-right: 0;
        flex: none;
        width: 73%;
    }

    .fa-list-card-photo {
        width: 120px;
        top: 0;
        bottom: 0;
        right: 0;
        height: auto;
        transform: none;
    }

    .fa-list-card-photo img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        top: 0;
    }

    .fa-list-card-excerpt {
        display: none;
    }

    .fa-list-card-top .badge-category {
        display: none;
    }

    .fa-list-card h4,
    .fa-list-card .h4 {
        font-size: 18px;
    }

    .fa-list .post-newsletter {
        padding: 24px 0;
    }

  .int-section--regions {
    padding: 0 12px;
  }

  .int-section--regions .section-header {
    margin-bottom: 12px;
  }

  .region-body {
    flex-direction: column;
    gap: 12px;
  }

  .region-featured .post-card {
    flex-direction: column-reverse;
    height: auto;
  }

  .region-featured .post-thumb {
    width: 100%;
    min-width: unset;
    height: 200px;
    border-radius: 8px 8px 0 0;
  }

  .region-featured .post-content h3 {
    font-size: 21px !important;
    line-height: 30px;
  }

  .region-featured .post-content p {
    font-size: 16px;
    line-height: 21px;
  }

  .region-secondary {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .region-secondary .post-card {
    flex-direction: row-reverse;
    gap: 12px;
  }

  .region-secondary .post-thumb {
    width: 100px;
    min-width: 80px;
    height: auto;
    min-height: 130px;
    border-radius: 0 8px 8px 0;
    flex-shrink: 0;
  }

  .region-secondary .post-content {
    flex: 1;
    padding: 4px 8px;
  }

  .region-secondary .post-content h4 {
    font-size: 18px !important;
    line-height: 25px;
    letter-spacing: -0.54px;
  }

  .int-section--latestshort,
  .int-section--columnists,
  .int-section--podcasts {
    padding: 0;
  }

  .hscroll-outer {
    border-radius: 0;
    padding: 12px 0;
    gap: 12px;
    overflow: visible;
  }

  .hscroll-header {
    padding: 0 12px;
  }

  .hscroll-outer .carousel-nav {
    display: none;
  }

  .hscroll-scroll {
    overflow-x: auto;
    overflow-y: clip;
    -webkit-overflow-scrolling: touch;
  }

  .hscroll-scroll::-webkit-scrollbar {
    display: none;
  }

  .hscroll-list {
    gap: 12px;
    padding: 0 12px;
  }

    /* Latest shorts — 1 card + 1/5 */
    .int-section--latestshort .short-item {
        width: calc((100% - 12px) / 1.2);
    }

  .col-card {
    width: 260px;
  }

  .int-section--columnists .hscroll-list {
    padding: 0;
  }

  /* Columnists: 1 card + 1/5 */
  .int-section--columnists .col-card {
    width: calc((100% - 12px) / 1.2);
  }

  .col-card .post-thumb {
    min-height: 200px;
  }

  section.int-section--columnists .hscroll-outer--secondary,
  section.int-section--podcasts .hscroll-outer--secondary {
    padding-left: 0.75rem;
    padding-right: 0;
  }
  section.int-section--columnists .hscroll-header,
  section.int-section--podcasts .hscroll-header{
    padding-left: 0;
  }

    .post-featured.post-image figure.hero {
        height: 80vh;
        overflow: hidden;
    }

    .post-featured.post-image figure.hero img {
        border-radius: 0;
        height: 100%;
        object-fit: cover;
    }

  .int-section--chatter {
    padding: 48px 0;
    gap: 12px;
  }

  /* Inline start padding on the container so the slider shares it
     and the cut card bleeds to the right edge */
  .int-section--chatter .c-container {
    padding-left: 20px;
    padding-right: 0;
  }

  .int-section--chatter .hscroll-header {
    padding: 0 20px 0 0;
  }

  .int-section--chatter .carousel-nav {
    display: none;
  }

  .int-section--chatter .hscroll-scroll {
    overflow-x: auto;
    overflow-y: clip;
    -webkit-overflow-scrolling: touch;
  }

  .int-section--chatter .hscroll-scroll::-webkit-scrollbar {
    display: none;
  }

  .chatter-list {
    gap: 20px;
    padding: 0;
  }

  /* Mobile: 1 card + a visible peek of the next one */
  .chatter-quote {
    width: calc((100% - 20px) / 1.25);
  }

  .chatter-content p {
    font-size: 19px;
    line-height: 30px;
  }

    .ctt-kpi-row {
        grid-template-columns: 1fr;
    }
    .ctt-kpi-value {
        font-size: 26px;
    }
    .ctt-charts-row {
        grid-template-columns: 1fr;
    }
    .ctt-bar-container {
        min-height: 300px;
    }
    .ctt-donut-container {
        min-height: 300px;
    }

    section.newsletter .wrap-form {
        gap: 24px;
    }
    section.newsletter .wrap-headline {
        padding: 8px 8px 0;
    }
    section.newsletter .wrap-form h2 {
        font-size: 26px;
        letter-spacing: -0.78px;
    }
    section.newsletter .box-form {
        padding: 0 8px 8px;
        width: 100%;
    }
    section.newsletter .gfield_radio {
        flex-direction: column;
        gap: 12px;
    }
    section.newsletter .box-thumb {
        min-height: 104px;
    }

    .footer-main {
        padding: 32px 0px 24px;
    }
    .wrap-footer {
        flex-direction: column;
        gap: 50px;
    }
    .copyright {
        padding-top: 48px;
    }

    section.post-featured div.marque .item-marque {
        font-size: 16px;
    }

    section.post-featured div.marque {
        height: 50px;
    }

    section.post-featured div.wrap-marque{
        border-radius: 0;
        top:-120px;
    }
    .int-section--category {
        padding: 24px 0px;
    }

    .cat-layout {
        flex-direction: column;
        align-items: stretch;
    }

    .cat-left {
        width: 100%;
        top: -100px;
        margin-bottom: -100px;
    }

    .cat-left {
        width: 100%;
        top: -100px;
        margin-bottom: -100px;
    }

    .cat-hero-content {
        padding: 24px 24px 16px;
    }

    .cat-hero h1 {
        font-size: 26px !important;
    }

    .cat-hero .text p {
        font-size: 14px;
        line-height: 23px;
    }

    .cat-inline {
        flex-direction: column;
    }

    .cat-inline .post-thumb {
        height: 180px;
        min-height: 180px;
    }

    .cat-inline h2,
    .cat-inline h2 {
        font-size: 21px !important;
        line-height: 29px;
    }

    /* Stacked: horizontal row-reverse (content left, img right) */
    .cat-stacked {
        grid-template-columns: 1fr;
    }

    .cat-stacked .post-card {
        flex-direction: column;
        align-items: stretch;
    }

    .cat-stacked .post-thumb {
        width: 100%;
        height: auto;
        min-height: unset;
        aspect-ratio: 1;
        border-radius: 8px 8px 0 0;
    }

    .cat-stacked .post-content {
        flex: 1;
    }

    .cat-stacked h3{
        margin-bottom: 5px;
    }

    /* v0-video mobile */
    .default_cluster_video .cat-stacked {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .default_cluster_video .cat-stacked .post-card:first-child {
        grid-row: auto;
    }

    .default_cluster_video .cat-stacked .post-card:first-child {
        flex-direction: column;
    }

    .default_cluster_video .cat-stacked .post-card:first-child .post-thumb {
        width: 100%;
        min-width: unset;
        height: auto;
        min-height: 180px;
        aspect-ratio: unset;
        border-radius: 8px 8px 0 0;
    }

    /* live_blog_v1 mobile */
    .live_blog_v1 .cat-stacked .post-card:nth-child(n+5) {
        display: flex;
    }

    /* live_blog_v1_video mobile */
    .live_blog_v1_video .cat-stacked {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .live_blog_v1_video .cat-stacked .post-card:first-child {
        grid-row: auto;
        flex-direction: column;
    }

    .live_blog_v1_video .cat-stacked .post-card:first-child .post-thumb {
        width: 100%;
        min-width: unset;
        height: auto;
        min-height: 180px;
        aspect-ratio: unset;
        border-radius: 8px 8px 0 0;
    }

    /* live_blog_v2 mobile */
    .live_blog_v2 .cat-bottom {
        flex-direction: column;
    }

    .live_blog_v2 .cat-bottom .post-thumb {
        height: 160px;
        min-height: 160px;
    }

    /* live_blog_v2_video mobile */
    .live_blog_v2_video .cat-right-row {
        flex-direction: column;
    }

    .live_blog_v2_video .cat-video-right {
        flex: none;
    }

    .live_blog_v2_video .cat-bottom {
        flex-direction: column;
    }

    .live_blog_v2_video .cat-bottom .post-thumb {
        height: 160px;
        min-height: 160px;
    }

    .live_blog_v2_video .cat-bottom .post-thumb {
        height: 160px;
        min-height: 160px;
    }

    .posts-list {
        flex-direction: row;
        overflow-x: auto;
        gap: 12px;
        padding: 0 12px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }

    .posts-list::-webkit-scrollbar {
        display: none;
    }

    .post-card-story {
        flex-direction: column;
        width: 300px;
        min-width: 300px;
        flex-shrink: 0;
        scroll-snap-align: start;
    }

    .post-card-story .post-thumb {
        order: -1;
        width: 100%;
        min-width: unset;
        min-height: 200px;
        height: 200px;
        border-radius: 8px 8px 0 0;
    }

    .post-card-story .post-content {
        min-width: unset;
        padding: 8px;
    }

    .post-card-story .post-content h3 a {
        font-size: 21px;
        line-height: 30px;
        letter-spacing: -0.63px;
    }

    .post-card-story .post-content .text p {
        font-size: 16px;
        line-height: 21px;
    }

    .int-section--story-page {
        padding: 0 12px;
    }

    .story-layout {
        gap: 12px;
    }

    .story-featured {
        flex-direction: column;
    }

    .story-featured .post-thumb {
        order: -1;
        flex: auto;
        min-height: 200px;
        border-radius: 8px 8px 0 0;
    }

    .story-featured .post-content {
        min-width: unset;
        padding: 8px;
    }

    .story-featured .post-content h3 {
        font-size: 21px;
        line-height: 30px;
        letter-spacing: -0.63px;
    }

    .story-featured .post-content .text p {
        font-size: 16px;
        line-height: 21px;
    }

    .story-featured .post-avatar {
        width: 32px;
        height: 32px;
    }

    .story-featured .post-role {
        font-size: 13px;
    }

    .story-grid {
        flex: auto;
        flex-direction: column;
        gap: 12px;
    }

    .story-secondary {
        flex-direction: row;
    }

    .story-secondary .post-thumb {
        order: 1;
        flex: 0 0 22%;
        min-height: 130px;
        border-radius: 0 8px 8px 0;
    }

    .story-secondary .post-content {
        flex: 1;
        padding: 4px 8px;
    }

    .story-secondary .post-content h3 {
        font-size: 18px;
        line-height: 25px;
        letter-spacing: -0.54px;
    }

    .padding-small {
        padding: 25px 0 !important;
    }

    .padding-medium {
        padding: 25px 0 !important;
    }

    .padding-large {
        padding: 40px 0;
    }

    .pagination-wrapper {
        max-width: fit-content;
        padding-right: 12px;
        padding-top: 50px;
    }

    .hide-on-mobile { display: none; }

    .post-data-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .post-data-title {
        font-size: 19px;
    }

    .post-newsletter .wrap-headline h2 {
        font-size: 22px;
    }

    .dt-filters-top {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    .dt-filters-search {
        order: -1;
        width: 100%;
        margin-bottom: 0;
        padding: 6px 8px 6px 16px;
    }

    .dt-filters-search-input {
        padding: 8px 0;
        font-size: 16px;
    }

    .dt-filters-search-btn {
        width: 36px;
        height: 36px;
    }

    .dt-filters-tabs {
        width: 100%;
        gap: 4px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
        /*
        mask-image: linear-gradient(to right, transparent 0%, #000 20px, #000 calc(100% - 20px), transparent 100%);
        -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 20px, #000 calc(100% - 20px), transparent 100%);
        */
        
    }

    .dt-filters-tabs::-webkit-scrollbar {
        display: none;
    }

    .dt-filters-tab,
    .dt-filters-reset {
        flex: 0 0 auto;
        padding: 12px 16px;
        white-space: nowrap;
    }

    .dt-filters-panels {
        padding: 12px 16px;
    }

    .dt-filters-panel {
        flex-direction: column;
        align-items: flex-start;
        gap: 25px;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .dt-filters--dropdown .dt-filters-dds {
        flex-wrap: wrap;
    }

    .dt-filters--dropdown .dt-filters-dd-trigger {
        padding: 0.75rem 1rem;
    }

    .dt-filters--dropdown .dt-filters-dd-menu {
        white-space: normal;
    }

    .rp-section {
        padding: 32px 0;
    }

    .rp-section .rp-heading h2 {
        font-size: 21px!important;
    }

    .rp-heading {
        margin-bottom: 16px;
    }

    .rp-heading h2 {
        font-size: 21px;
    }

    .rp-grid {
        display: flex;
        flex-wrap: nowrap;
        gap: 2%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 4px 12px;
        margin: 0 -15px 0 0;
        scroll-snap-type: x mandatory;
    }

    .rp-grid::-webkit-scrollbar {
        display: none;
    }

    .rp-card {
        /* 1 + 1/8 visible: (100% - 1 gap of 2%) / 1.125 */
        flex: 0 0 90%;
        scroll-snap-align: start;
    }

    .rp-card-body {
        padding: 16px 8px;
        text-align: center;
        align-items: center;
    }

    .rp-card-title {
        font-size: 18px;
        text-align: center;
    }

    .rp-card-text p {
        font-size: 16px;
        line-height: 21px;
        text-align: center;
    }

    .rp-card--infographic .rp-card-thumb {
        height: 227px;
    }

    .rp-card--infographic .rp-card-body {
        padding: 16px 8px;
    }

    .rp-card-flag {
        width: 46px;
        height: 46px;
    }

    .ig-hero-section {
        padding: 24px 0 12px;
    }

    .ig-featured-section {
        padding: 12px 0 24px;
    }

    .ig-featured-link {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .ig-featured-thumb {
        flex: none;
        width: 100%;
        height: 227px;
    }

    .ig-featured-body {
        padding: 8px 8px 16px;
        gap: 12px;
    }

    .ig-featured-title {
        font-size: 21px;
    }

    .ig-list-section {
        padding: 12px 0 24px;
    }

    .ig-list {
        gap: 24px;
    }

    .ig-card-link {
        flex-direction: column-reverse;
        align-items: stretch;
        gap: 12px;
    }

    .ig-card-thumb {
        flex: none;
        width: 100%;
        height: 227px;
    }

    .ig-card-body {
        padding: 8px 8px 16px;
        gap: 12px;
    }

    .ig-card-title {
        font-size: 18px;
    }

    .ig-card-text p {
        padding-right: 0;
        font-size: 16px;
        line-height: 21px;
    }

    .sp-header {
        padding: 24px 0 12px;
    }

    .sp-header .c-container {
        max-width: 100%;
    }

    .sp-content-section {
        padding: 12px 0 24px;
    }

    .sp-content-section .c-container {
        gap: 24px;
    }

    .sp-content p {
        font-size: 16px;
        line-height: 21px;
    }

    .sp-visual {
        border-radius: 8px;
    }

    .nav-main {
        padding: 12px;
    }

    .nav-logo .nav-logo-dark,
    .nav-logo .nav-logo-white,
    body.home .nav-logo .nav-logo-white,
    body.category .nav-logo .nav-logo-white,
    body.tag .nav-logo .nav-logo-white {
        display: none;
    }

    .nav-logo .nav-logo-responsive {
        display: block;
        height: 40px;
        width: auto;
    }

    .nav-search-trigger {
        min-width: 0;
        max-width: 180px;
        padding: 4px 4px 4px 12px;
        font-size: 17px;
    }

    .nav-search-trigger-icon {
        width: 28px;
        height: 28px;
    }

    .nav-search-modal-inner {
        margin-top: 10vh;
        padding: 0 16px;
    }

    .nav-search-input {
        font-size: 17px;
    }

    .article-video {
        padding-right: 12px;
        padding-left: 12px;
    }

    .video-custom-wide {
        padding: 16px 0;
    }

    .caption-video {
        padding-bottom: 0;
    }

    .int-section--coverage {
        display: none;
    }

    .search-card {
        flex-direction: column;
    }

    .search-card .post-thumb {
        flex: none;
        min-height: 200px;
        aspect-ratio: 16 / 9;
    }

    .search-card h3 {
        font-size: 21px;
        line-height: 30px;
        letter-spacing: -0.63px;
    }

    .featured-post-php .card-horizontal {
        flex-direction: column;
    }

    .featured-post-php article.card .card-image img{
        border-bottom-left-radius: 0!important;
        border-bottom-right-radius: 0!important;
    }

    .featured-post-php .card-image {
        width: 100%;
        order: initial;
    }

    .featured-post-php .card-body {
        width: 100%;
        text-align: center;
        order: initial;
    }

    .filter-section-wrap {
        padding: 0 0 0 12px;
        align-items: flex-start;
    }

    .int-section--404 {
        min-height: 50vh;
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .error-404 .text {
        font-size: 16px;
    }

    .sp-hero-meta .fa-dates {
        align-items: flex-end;
    }

    body.single-data .page-headline {
        margin-top: 1rem;
    }

    body.single-data .article-inner-content {
        margin: 40px auto 0;
        padding-left: 20px;
        padding-right: 20px;
    }

    body.single-data .article-content .wpsummary_box {
        display: none;
    }

    .post-type-archive-data .hero-section .hero-image img.img-desktop {
        display: none;
    }
    .post-type-archive-data .hero-section .hero-image img.img-mobile {
        display: block;
    }
    .post-type-archive-data .hero-section .hero-text {
        font-size: 21px;
        line-height: 34px;
        position: relative;
        top: inherit;
        margin-bottom: -40px;
        width: 93%;
    }
    .post-type-archive-data .hero-section {
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .int-section--newsletters .c-container {
        gap: 50px;
        padding-bottom: 0px;
    }
    .site-btn-primary {
        padding: 12px;
        font-size: 16px;
        letter-spacing: -0.48px;
        justify-content: space-between;
    }

    .int-section--latest-videos {
        --lv-gap-grid: 12px;
    }
    .int-section--latest-videos .lv-grid {
        grid-template-columns: 1fr;
    }
    /* MODULE — Featured video (mobile) */
    .featured-video-fade.int-section--videos.version_2 .vg-featured .card-link { flex-direction: column; gap: 0; }
    .featured-video-fade.int-section--videos.version_2 .vg-featured .card-image,
    .featured-video-fade.int-section--videos.version_2 .vg-featured .card-body { flex: none; width: 100%; }
    .featured-video-fade.int-section--videos.version_2 .vg-featured .card-image { padding: 0 12px; }
    .featured-video-fade.int-section--videos.version_2 .vg-featured .card-body { padding: 8px 12px 12px; }
    .featured-video-fade.int-section--videos.version_2 .vg-featured .card-body .cta {
        display: flex;
        justify-content: center;
        width: 100%;
    }
    .featured-video-fade.int-section--videos.version_2 .vg-featured .card-title {
        font-size: 21px !important;
        letter-spacing: -0.63px;
    }
    .featured-video-fade .post-avatar { width: 32px; height: 32px; }
    .featured-video-fade .post-role { font-size: 13px; }
    .featured-video-fade .controls { grid-template-columns: 1fr; padding: 0 12px; }
    .featured-video-fade .dots { grid-column: 1; }
    .featured-video-fade .controls .carousel-nav { display: none; }

    /* MODULE — The Debrief (mobile) */
    .int-section--debrief .wrap-desc p {
        font-size: 16px;
        line-height: 24px;
    }
    .cat-layout {
        margin-bottom: 0px;
    }
    .cat-hero {
        margin-left: 0;
        margin-right: 0;
    }

    section.ctt-module .section-header h2 {
        font-size: 21px!important;
    }
    section.ctt-module .ctt-section{
        padding:0;
    }
    /* Mobile: 1 card + 1/5 */
    .version-1 .dt-card {
        width: calc((100% - 24px) / 1.2);
    }
    .headline h2, .wrap-headline h2 {
        font-size: 21px !important;
    }
/* end - max-width: 767px */
}



/* ============================================
   ABOUT PAGE — sidebar left + content right
   ============================================ */
.about-layout {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 60px;
}

.about-sidebar {
    position: sticky;
    top: 100px;
    flex: 0 0 300px;
    margin-top:94px;
    margin-bottom: 30px;
    max-width: 300px;
}

.about-sidebar ul {
    display: flex;
    flex-direction: column;
    gap: 18px;
    list-style: disc;
    margin: 0;
    padding-left: 20px;
}

.about-sidebar li {
    color: var(--color-gray-dark);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}

.about-sidebar a {
    color: inherit;
    text-decoration: none;
}

.about-sidebar a:hover,
.about-sidebar a:focus {
    opacity: 0.7;
}

.about-sidebar .current-menu-item,
.about-sidebar .current_page_item {
    color: var(--color-red);
}

.about-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0px;
}


































/* max-width: 1200px */
@media (max-width: 1200px) {

    .about-layout {
        flex-direction: column;
        gap: 40px;
    }

    .about-sidebar {
        position: static;
        top: auto;
        flex: 1 1 auto;
        max-width: 100%;
    }

/* end - max-width: 1200px */
}


/* ============================================
   SINGLE ANALYSIS — TOP LINE / BOTTOM LINE
   ============================================ */
.sp-topline,
.sp-bottomline {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.5rem 1.7rem;
    border: 1px solid currentColor;
    background: transparent;
}

/* Marcas decorativas tipo regla, por dentro del borde derecho */
.sp-topline::after,
.sp-bottomline::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 12px;
    background-image: repeating-linear-gradient(
        to bottom,
        transparent 0,
        transparent 13px,
        currentColor 13px,
        currentColor 14px
    );
    pointer-events: none;
}

/* Top Line vive dentro del meta (flex row con wrap): ocupa la fila completa */
.sp-topline {
    flex: 0 0 100%;
    width: 100%;
    margin: 0 0 1.5rem;
}

.sp-bottomline {
    margin: 2rem 0;
}

.sp-topline-head h2,
.sp-bottomline-head h2 {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 20px!important;
    font-weight: 700;
    color: var(--color-dark-blue);
    padding:0!important;
}

.sp-topline .text,
.sp-bottomline .text {
    display: flex;
    flex-direction: column;
    font-size: 17px;
    line-height: 1.7;
    gap: 1rem;
}

.sp-topline .text p,
.sp-bottomline .text p {
    margin: 0;
}


/* ============================================
   SINGLE ANALYSIS — EXPERT COMMENT
   ============================================ */
.sp-layout {
    display: grid;
    grid-template-columns: 1fr minmax(0, 720px) 1fr;
    align-items: start;
}

.sp-layout-main {
    grid-column: 2;
}

/* Columna derecha sticky: los comentarios se apilan uno debajo del otro */
.sp-expert-comments {
    grid-column: 3;
    position: sticky;
    top: 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding-left: 1rem;
}

.sp-expert-comment {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 1rem 1rem 1.5rem;
    border-radius: 16px;
    background: var(--Colors-Secondary-light);
    box-shadow: 0 16px 16px var(--color-shadow-200), 0 4px 2px var(--color-shadow-100);
}

.sp-expert-comment-head {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 0.5rem 0;
}

.sp-expert-comment-head h2 {
    margin: 0;
    font-family: 'Cantata One', serif;
    font-size: 22px!important;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.66px;
    text-align: center;
    color: var(--color-dark-blue);
    padding:0;
}

/* Meta del experto: mismo markup que .post-meta, solo cambian colores y tamaño */
.post-meta--expert {
    width: 100%;
}

.post-meta--expert .post-author,
.post-meta--expert .post-role {
    color: var(--color-dark-blue);
}

.post-meta--expert .post-role {
    font-size: 13px;
}

.sp-expert-comment .text {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: 100%;
    font-family: 'Montserrat', sans-serif;
    font-size: 17px;
    font-style: italic;
    font-weight: 500;
    line-height: 1.5;
    color: var(--color-dark-blue);
}

.sp-expert-comment .text p {
    margin: 0;
}


/* Fechas apiladas (Published + Last update) — solo en el single de analysis */
.fa-dates--stacked {
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.fa-date {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 5px;
}

/* Research single: show the publish date only */
.fa-date--last-update {
    display: none;
}

.cgsp-chat-fullpage .cgsp-prompt-card{
    background:none;
    border:1px solid var(--color-black);
    padding:12px;
}

.cgsp-prompt-card-title{
    color:var(--color-gray-dark);
    font-size:17px;
    font-weight:bold;
}
.cgsp-prompt-card-desc {
    font-size: 17px;
    color: var(--color-gray-dark);
    line-height: 20px;
}
body.page-id-58855 .section-headline .headline{
    display: none;
}
.cgsp-chat-subtitle{
    color:var(--color-black);
    font-size:17px;
    line-height:28px;
    margin:40px 0 40px;
}
.cgsp-prompt-heading {
    font-size: 11px;
    color: var(--color-black);
    margin-bottom: 8px;
}
.cgsp-chat-welcome h1{
    font-weight:400;
}
.cgsp-quick-action-custom{
    align-items: center;
    display: flex;
    font-size: 17px;
    gap: 10px;
}
/* Hidden at the client's request: these quick actions don't work yet */
.cgsp-quick-actions {
    display: none;
    grid-template-columns: 1fr 1fr;
    max-width: 460px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 45px;
}
.cgsp-chat-input {
    flex: 1;
    padding: 12px 16px;
    border: 1px solid #BCAAA1;
    font-size: 13px;
    outline: none;
    background: var(--color-white);
    border-radius: 8px;
    color: var(--color-gray-dark);
}

/* Send button placed inside the input field */
.cgsp-chat-fullpage .cgsp-chat-input-bar {
    position: relative;
    padding: 0.75rem 0 1.25rem;
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
.cgsp-chat-fullpage .cgsp-chat-input {
    padding-right: 3rem;
}
.cgsp-chat-fullpage .cgsp-chat-send-btn {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    bottom: 1.25rem;
    width: auto;
    height: auto;
    padding: 0;
    background: none;
    border-radius: 0;
    color: var(--color-black);
}
.cgsp-chat-fullpage .cgsp-chat-send-btn:hover:not(:disabled) {
    background: none;
    opacity: 0.7;
}
.cgsp-chat-fullpage .cgsp-chat-send-btn svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

/* Disclaimer below the input */
.cgsp-chat-fullpage .cgsp-chat-disclaimer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-gray-dark);
    font-size: 13px;
}
.cgsp-chat-fullpage .cgsp-chat-disclaimer a {
    color: inherit;
    text-decoration: underline;
}
/* Box styling lives on the wrap, never on the ul/ol */
.wp-block-list {
    border-radius: 8px;
    border-bottom: 4px solid #E6D8D2;
    background: #FFF;

    margin-bottom: 1.7rem;

    padding-top: 23px;
    padding-bottom: 23px;
    padding-left: 35px;
    padding-right: 35px;

    max-width: 550px!important;
    margin-left: 0!important;
}



















/* Expert Comment: sin columna lateral, cae al final del articulo */
@media (max-width: 1200px) {

    .sp-layout {
        grid-template-columns: 1fr;
    }

    .sp-layout-main,
    .sp-expert-comments {
        grid-column: 1;
    }

    .sp-expert-comments {
        position: static;
        top: auto;
        padding-left: 0;
    }

    .int-section--podcasts .c-container {
        max-width: 100%;
    }

    .int-section--podcasts .c-container .hscroll-scroll {
        display: block;
        margin-right: -15px;
        width: auto;
    }

    body.research-template-default .post-card-data{
        display:none
    }

/* end - max-width: 1200px */
}


/* ============================================
   BLOCK — LIST (ul bulleted / ol numbered)
   ============================================ */
.sp-list {
    margin: 2rem 25px;
    padding: 1.5rem 2rem;
    border-radius: 8px;
    border-bottom: 4px solid var(--Colors-Secondary-light, #C5CFED);
    background: var(--color-white);
    max-width: 500px;
}

.sp-list-body {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.sp-list ul,
.sp-list ol {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sp-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 17px;
    line-height: 28px;
    color: var(--color-navy);
}

/* Bulleted variant: no separators, gap between items */
.sp-list ul {
    gap: 1rem;
}

.sp-list ul li::before {
    content: "";
    flex: 0 0 10px;
    aspect-ratio: 1 / 1;
    margin-top: 0.5rem;
    border-radius: 50%;
    background: var(--color-royal-blue);
}

/* Numbered variant: 1px separator between items */
.sp-list ol {
    counter-reset: sp-list-counter;
}

.sp-list ol li {
    padding: 0.75rem 0;
    border-top: 1px solid var(--color-blue-pale);
    counter-increment: sp-list-counter;
}

.sp-list ol li:first-child {
    border-top: 0;
    padding-top: 0;
}

.sp-list ol li:last-child {
    padding-bottom: 0;
}

.sp-list ol li::before {
    content: counter(sp-list-counter);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 31px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: var(--color-blue-pale);
    color: var(--color-royal-blue);
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
}

.sp-list p {
    margin: 0;
    font-size: 17px;
    line-height: 28px;
    color: var(--color-navy);
}


/* ============================================
   MEDIA — BLEED LEFT (300px bleed to the left)
   ============================================ */
.article-content .image-bleed-left {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    margin-left: calc((100% - 41.875rem) / 2 - 18.75rem) !important;
    margin-right: calc((100% - 41.875rem) / 2) !important;
}

.article-content .image-bleed-left img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto;
}

.article-content .image-bleed-left .wp-element-caption,
.article-content .image-bleed-left .caption-video {
    max-width: 100% !important;
    margin-left: 0;
    margin-right: 0;
    text-align: left;
}


/* ============================================
   EMBEDS — ASPECT RATIO RESPONSIVE
   ============================================ */
.article-content .wp-block-embed.is-type-video .wp-block-embed__wrapper,
.article-content .wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16 / 9;
}

.article-content .wp-block-embed.wp-embed-aspect-4-3 .wp-block-embed__wrapper {
    aspect-ratio: 4 / 3;
}

.article-content .wp-block-embed.wp-embed-aspect-9-16 .wp-block-embed__wrapper {
    aspect-ratio: 9 / 16;
}

.article-content .wp-block-embed.is-type-video .wp-block-embed__wrapper iframe,
.article-content .wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper iframe {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    border-radius: 10px;
}



































/* Bleed Left: on tablet and mobile it falls back to the content width */
@media (max-width: 1200px) {

    .article-content .image-bleed-left {
        width: auto !important;
        max-width: 41.875rem !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

/* end - max-width: 1200px */
}


/* ============================================
   BLOCK — CARD DATA / POST TYPE
   ============================================ */
.post-card-data {
    background: var(--color-white);
    border-radius: 16px;
    padding: 0rem;
    margin-left: 1.5625rem;
    margin-right: 1.5625rem;
    overflow: hidden;
}

.post-card-data a {
    display: flex;
    align-items: center;
    gap: 24px;
    text-decoration: none;
    color: inherit;
}

.post-card-data-visual {
    flex: 0 0 34%;
    aspect-ratio: 204 / 121;
    border-radius: 8px 0 0;
    overflow: hidden;
}

.post-card-data-visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-card-data-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    margin-right:20px;
    min-width: 0;
    text-align: left;
}

.post-card-data-content h3 {
    margin: 0 !important;
    font-family: 'Cantata One', serif;
    font-size: 22px !important;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.66px;
    color: var(--color-dark-blue);
    text-align: left !important;
    padding: 0!important;
}

.post-card-data-content .text p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 17px;
    line-height: 28px;
    color: var(--color-gray-dark);
}



































/* Expert Comment: on mobile it sits right below the Top Line */
@media (max-width: 767px) {

    .sp-expert-comments {
        margin-bottom: 1rem;
        margin-top: 1rem;
        order: -1;
    }

    .sp-hero.article-hero .c-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .sp-hero.article-hero .sp-hero-inner {
        border-radius: 0!important;
    }

    .sp-hero-meta {
        padding: 25px 0!important;
    }

    body.single .article-content .wp-block-image {
        max-width: 670px !important;
        margin: 2rem 0px;
    }
    .sp-list {
        margin: 2rem 0px;
    }

    .post-card-data {
        margin-left: 0;
        margin-right: 0;
    }

    /* Card Data: stacked, image on top */
    .post-card-data a {
        flex-direction: column;
        align-items: flex-start;
    }

    .post-card-data-visual {
        flex: 0 0 auto;
        width: 100%;
    }

    .sp-topline, 
    .sp-bottomline {
        padding: 1.3rem 1.2rem;
    }

    .sp-hero--analysis .sp-hero-content {
        padding-left: 1em;
        padding-right: 1rem;
    }

    /* Headings: each level takes the size of the next one down */
    .article-content h2 {
        font-size: 21px !important;
    }

    .article-content h3 {
        font-size: 18px !important;
    }

    .article-content h4 {
        font-size: 16px !important;
    }

    .article-content h5 {
        font-size: 13px !important;
    }

    /* Dates: only the publish date, stacked and right aligned */
    .fa-dates--stacked .fa-date {
        flex-direction: column;
        align-items: flex-end;
        gap: 0;
    }

/* end - max-width: 767px */
}



































/* Content blocks: aligned with the paragraphs on tablet and mobile */
@media (max-width: 1200px) {

    .sp-list,
    .post-card-data,
    .sp-bottomline,
    .sp-expert-comments {
        max-width: 41.875rem;
        margin-left: auto;
        margin-right: auto;
    }

    /* Expert Comment sits right below the Top Line */
    .sp-expert-comments {
        order: -1;
    }

    /* Card Data block is not shown on tablet or mobile */
    .post-card-data {
        display: none;
    }

/* end - max-width: 1200px */
}




/* ================================================
   ABOUT PAGE — reading width
   ================================================ */

body.page-about .section-headline .c-container,
body.page-about .section-article-content .c-container {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
body.page-live-blog iframe{
    margin-bottom:3rem!important;
}

.gform_wrapper.gravity-theme .gform_validation_errors>h2 {
    font-size: 13.2px !important;
    line-height: 20.0px;
}


































/* MODULE — Podcasts: 2 cards + 1/5 */
@media (min-width: 768px) and (max-width: 1200px) {

    .int-section--podcasts .col-card {
        width: 43.6%;
    }

/* end - min-width: 768px and max-width: 1200px */
}


































/* MODULE — Videos by Category: 5 cards + 1/7 on desktop.
   The gap stays at 12px, so it is discounted before dividing. */
@media (min-width: 1201px) {

    .int-section--videos-latest-carousel .col-card {
        width: calc((100% - 60px) / 5.1428);
    }

/* end - min-width: 1201px */
}




































































/* MODULE — Videos by Category: 4 cards + 1/7 on tablet */
@media (min-width: 768px) and (max-width: 1200px) {

    .int-section--videos-latest-carousel .col-card {
        width: calc((100% - 48px) / 4.1428);
    }

/* end - min-width: 768px and max-width: 1200px */
}




































































/* MODULE — Podcasts: 1 card + 1/9 */
@media (max-width: 767px) {

    .int-section--podcasts .col-card {
        width: 88.2%;
    }

/* end - max-width: 767px */
}


































/* MODULE — Videos by Category: 1 card + 1/8 on mobile */
@media (max-width: 767px) {

    .int-section--videos-latest-carousel .col-card {
        width: calc((100% - 12px) / 1.125);
    }

    /* Track bleeds to the screen edges */
    .int-section--videos-latest-carousel .hscroll-scroll {
        margin-inline: -0.75rem;
        scroll-padding-inline: 0.75rem;
        width: auto;
    }

    /* Left cue at the start of the scroll */
    .int-section--videos-latest-carousel .hscroll-list {
        padding-inline-start: 0.75rem;
    }

    /* Right cue at the end of the scroll (cancels the 12px gap) */
    .int-section--videos-latest-carousel .hscroll-list::after {
        content: '';
        flex: 0 0 0.75rem;
        margin-inline-start: -12px;
    }

/* end - max-width: 767px */
}




































/* ==========================================================
   THE DEBRIEF — HORIZONTAL SCROLL: EDGE PADDING
   The side padding lives on the scroll content (.hscroll-list),
   not on the wrapper, so it only shows at the ends of the track:
     - scrolled to the start -> padding left, cards bleed right
     - scrolled to the end   -> padding right, cards bleed left
     - while scrolling       -> edge to edge, no padding
   Percentage card widths keep the next card peeking.
   Only applied here: the coloured box gives the cue a visible edge to
   read against. The carousels with no background are left untouched.
   ========================================================== */

/* The coloured box releases its side padding so the track spans the whole box */
.page-videos .int-section--podcasts .hscroll-outer {
    padding-inline: 0;
}

/* The header keeps its own side spacing, the track does not */
.page-videos .int-section--podcasts .hscroll-header {
    padding-inline: 1.5rem;
}

/* Left hand cue. Only padding-inline-start: once the children overflow the
   track the browser drops any trailing padding from the scrollWidth. */
.page-videos .int-section--podcasts .hscroll-list {
    padding-inline-start: 1.5rem;
    padding-inline-end: 0;
}

/* Right hand cue: a real flex item at the end of the list. A trailing padding
   or margin gets dropped from the scrollWidth once the children overflow the
   track, a flex item does not. The negative start margin cancels the 2% gap
   that the flex layout adds before the spacer, so the cue stays at 1.5rem. */
.page-videos .int-section--podcasts .hscroll-list::after {
    content: '';
    flex: 0 0 1.5rem;
    align-self: stretch;
    margin-inline-start: -2%;
}

/* The snap lands the cards against the padding, not against the edge */
.page-videos .int-section--podcasts .hscroll-scroll {
    scroll-padding-inline: 1.5rem;
}




/* ==========================================================
   LATEST VIDEOS (/videos) — WHITE BOX + EDGE PADDING
   Same criteria as The Debrief above: the box has no side padding,
   the stops live on the scroll content so they scroll away with
   the cards (left cue at the start, right cue at the end).
   ========================================================== */

/* The white box releases its side padding so the track spans the whole box */
.page-videos .int-section--latest-videos .hscroll-outer {
    background: var(--color-white);
    padding: 1.5rem 0;
}

/* The header keeps its own side spacing, the track does not */
.page-videos .int-section--latest-videos .hscroll-header {
    padding: 0 1.5rem;
}

/* Left hand cue. Only padding-inline-start: once the children overflow the
   track the browser drops any trailing padding from the scrollWidth.
   Percentage widths on the cards keep the next one peeking. */
.page-videos .int-section--latest-videos .hscroll-list {
    padding-inline-start: 1.5rem;
    padding-inline-end: 0;
    width: 100%;
    gap: 2%;
}

/* Right hand cue: a real flex item at the end of the list. The negative
   start margin cancels the 2% list gap, so the cue stays at 1.5rem. */
.page-videos .int-section--latest-videos .hscroll-list::after {
    content: '';
    flex: 0 0 1.5rem;
    align-self: stretch;
    margin-inline-start: -2%;
}

/* The snap lands the cards against the padding, not against the edge */
.page-videos .int-section--latest-videos .hscroll-scroll {
    scroll-padding-inline: 1.5rem;
}

/* Desktop: 4 cards + 1/5 */
.page-videos .int-section--latest-videos .col-card {
    width: 21.8%;
}




/* MODULE — Latest Videos: 3 cards + 1/5 */
@media (min-width: 768px) and (max-width: 1200px) {

    .page-videos .int-section--latest-videos .col-card {
        width: 29.3%;
    }

/* end - min-width: 768px and max-width: 1200px */
}




/* MODULE — Latest Videos: 1 card + 1/5 */
@media (max-width: 767px) {

    /* Double gap on mobile */
    .page-videos .int-section--latest-videos .hscroll-list {
        gap: 4%;
    }

    /* Keeps the right hand cue at 1.5rem with the wider gap */
    .page-videos .int-section--latest-videos .hscroll-list::after {
        margin-inline-start: -4%;
    }

    /* (100% - 1 gap of 4%) / 1.2 */
    .page-videos .int-section--latest-videos .col-card {
        width: 80%;
    }

/* end - max-width: 767px */
}




































/* ==========================================================
   ANALYSIS SINGLE — RELATED POSTS: FULL WIDTH SLIDER
   Same end-of-track cues as The Debrief, on a full width
   container so the cards reach the screen edges.
   Tablet and mobile only: desktop keeps its 3 cards intact.
   ========================================================== */
@media (max-width: 1200px) {

    /* Full width, so the slider is not cut short by the container */
    .single-research .rp-section .c-container {
        max-width: 100%;
        padding-inline: 0;
    }

    /* Left cue. The negative margins that faked the bleed are no longer
       needed now that the container spans the whole width. */
    .single-research .rp-grid {
        padding-inline-end: 0;
        margin-inline: 0;
        /* Zero, so the snap lands each card flush against the edge. With a
           scroll-padding here the card stops short of the border and the
           previous one peeks through the gap that is left behind. */
        scroll-padding-inline: 0;
        /* No snap at all. Both mandatory and proximity re-snap once the layout
           settles, and with the snap point sitting on the edge that drags the
           first card flush against it and eats the opening padding. */
        scroll-snap-type: none;
    }

    .single-research .rp-card {
        scroll-snap-align: none;
    }

    /* Right cue: a real flex item. A trailing padding gets dropped from the
       scrollWidth once the cards overflow, a flex item does not. The negative
       start margin cancels the 2% gap the flex layout adds before it. */
    .single-research .rp-grid::after {
        content: '';
        flex: 0 0 1.5rem;
        align-self: stretch;
        margin-inline-start: -2%;
    }

    /* The heading is centred on the viewport, it keeps its own breathing room */
    .single-research .rp-heading {
        padding-inline: 1.5rem;
    }

/* end - max-width: 1200px */
}




































/* ANALYSIS SINGLE — RELATED POSTS: tablet shows 2 cards + 1/7 */
@media (min-width: 768px) and (max-width: 1200px) {

    .single-research .rp-grid {
        padding-inline-start: 1.5rem;
    }

    .single-research .rp-card {
        /* 2 + 1/7 visible: (100% - 2 gaps of 2%) / 2.1428 */
        flex: 0 0 44.8%;
    }

/* end - min-width: 768px and max-width: 1200px */
}




































/* ANALYSIS SINGLE — RELATED POSTS: mobile shows 1 card + 1/5 */
@media (max-width: 767px) {

    .single-research .rp-grid {
        padding-inline-start: 0.75rem;
    }

    .single-research .rp-grid::after {
        flex: 0 0 0.75rem;
    }

    .single-research .rp-card {
        /* 1 + 1/5 visible: (100% - 1 gap of 2%) / 1.2 */
        flex: 0 0 81.6667%;
    }

    section.int-section--featured-analysis .c-container,
    section.int-section--analysis-list .c-container,
    section.int-section--latestshort .c-container,
    section.int-section--latest-videos .c-container,
    section.int-section.newsletter .c-container,
    section.dt-section .c-container,
    section.int-section--columnists .c-container,
    section.int-section--podcasts .c-container {
        padding-left: 0;
        padding-right: 0;
    }
    
    section.newsletter .wrap-form,
    section.dt-section .dt-outer,
    section.int-section .hscroll-outer{
        border-radius: 0!important;
    }

    .post-newsletter,
    section.int-section--analysis-list .post-newsletter-analysis{
        margin-left: -12px;
        margin-right: -12px;
    }

    .version-1 .dt-intro-top{
        justify-content: flex-start;
    }
    .version-1 .dt-intro-text{
        text-align: left;
    }
    .post-newsletter{
        margin-bottom: 1rem;
        margin-top: 1rem;
        width: auto;
    }
    section.ig-newsletter-section{
        padding-left: 0;
        padding-right: 0;
    }

    .offer{
        border-radius: 0!important;
        padding: 1.5rem 12px!important;
        margin-left: -12px!important;
        margin-right: -12px!important;
    }

/* end - max-width: 767px */
}




































/* ==========================================================
   BLOCK — OFFER
   Headline plus a grid of cards, each one holding an icon,
   a title and a text. Two columns down to tablet, stacked
   on mobile.
   ========================================================== */
.offer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    padding: 1.5rem;
    background: var(--color-base-light-semi);
    border-radius: 24px;
    max-width: 1100px;
    margin: 3rem auto;
}

.offer .wrap-headline {
    width: 100%;
    max-width: 600px;
    text-align: center;
}

.offer .wrap-headline h2 {
    font-family: 'Cantata One', serif;
    font-size: 26px;
    line-height: 34px;
    color: var(--color-dark-blue);
    font-weight: normal;
    margin-top: 0;
    padding-top: 0;
}

.offer-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    width: 100%;
    max-width: 1100px;
}

.offer-card {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--color-white);
    border-radius: 16px;
}

.offer-card-icon {
    display: flex;
    flex-shrink: 0;
}

.offer-card-icon img {
    max-width: 100%;
    height: auto;
}

.offer-card-body {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.offer-card-body h3 {
    font-family: 'Cantata One', serif;
    font-size: 22px;
    line-height: 29px;
    letter-spacing: -0.66px;
    color: var(--color-dark-blue);
    margin-left:0!important;
    padding-top:0;
    padding-bottom:0;
}

.offer-card-body p {
    font-family: 'Montserrat', sans-serif;
    font-size: 17px;
    line-height: 31px;
    color: var(--color-gray-dark);
}

section.section-article-content {
    padding-bottom: 4rem;
}

/* ==========================================================
   BLOCK — NETWORK
   Grid of people (circular photo, name and position title)
   plus an optional CTA. 5 columns on desktop, 4 on tablet,
   2 on mobile.
   ========================================================== */
.network {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    /* Breaks out of the narrow content column, centered on it */
    width: min(900px, 100vw - 2rem);
    max-width: none;
    margin: 2rem 0 2rem calc(50% - min(450px, 50vw - 1rem));
}

/* Beats the 670px cap that .article-content applies to every ul */
.article-content section.network ul,
.network ul {
    max-width: none;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2rem 1.5rem;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

.network li {
    margin: 0;
    padding: 0;
}

.network li::before,
.network li::marker {
    content: none;
}

.network-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    text-align: center;
}

.network-card-photo {
    width: 100%;
    max-width: 120px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    overflow: hidden;
    background: var(--Colors-Secondary-light);
}

.network-card-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.network-card-info {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.network-card-name {
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-gray-dark);
}

.network-card-position {
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-style: italic;
    line-height: 1.3;
    color: var(--color-gray-dark);
}

/* .network scope beats the red color of .article-content links */
.btn-navy,
.network .btn-navy {
    gap: 10px;
    background: var(--color-navy);
    border-color: var(--color-navy);
    color: var(--color-white);
}

.btn-navy:hover,
.btn-navy:focus,
.btn-navy:active,
.network .btn-navy:hover,
.network .btn-navy:focus,
.network .btn-navy:active {
    background: var(--color-navy);
    border-color: var(--color-navy);
    color: var(--color-white);
    opacity: 0.7;
}

.btn-navy:hover svg path,
.btn-navy:focus svg path {
    fill: none;
}



































/* BLOCK — NETWORK: 4 columns on tablet */
@media (min-width: 768px) and (max-width: 1200px) {

    .network ul {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

/* end - min-width: 768px and max-width: 1200px */
}


































/* BLOCK — OFFER: stacked on mobile */
@media (max-width: 767px) {

    .offer-grid {
        grid-template-columns: minmax(0, 1fr);
    }
    .offer-card-body h3 {
        padding-top:0;
        padding-bottom: 0;
    }

    .offer-card {
        padding: 1.3rem 1rem;
    }

    .offer .wrap-headline h2{
        padding-bottom:0;
    }

    h1, .h1, .main-headline {
        font-size: 28px;
    }

    section.section-article-content {
        padding-bottom: 2rem;
    }

    .network ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

/* end - max-width: 767px */
}






































/* ================================================
   MODULE — Immersive video viewer
   Full-screen overlay opened from a video carousel.
   The feed scrolls freely so the title of each video
   is revealed while moving to the next one.
   ================================================ */
.video-viewer {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-behavior: smooth;
    background: var(--color-gray-dark);
}
.video-viewer::-webkit-scrollbar {
    display: none;
}
.video-viewer.is-open {
    display: block;
}
.video-viewer-close {
    position: fixed;
    top: 0.625rem;
    right: 0.625rem;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    aspect-ratio: 1;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-white);
    cursor: pointer;
}
.video-viewer-close:hover,
.video-viewer-close:focus-visible {
    opacity: 0.7;
}
.video-viewer-feed {
    display: flex;
    flex-direction: column;
    gap: 3.75rem;
    padding: 0.75rem 0.75rem 3.75rem;
}
.video-viewer-slide {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    max-width: min(500px, calc(78dvh * 0.6667));
    margin: 0 auto;
}
.video-viewer-media {
    position: relative;
    aspect-ratio: 280 / 420;
    width: 100%;
    overflow: hidden;
    background: var(--color-gray-dark);
}
.video-viewer-media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.video-viewer-title h3 {
    margin: 0;
    font-family: 'Baskervville', serif;
    font-size: 28px;
    font-weight: 400;
    line-height: 1.2;
    color: var(--color-white);
}
.video-viewer-nav {
    position: fixed;
    top: calc(0.75rem + 39dvh);
    left: calc(50% + min(500px, calc(78dvh * 0.6667)) / 2 + 1.5rem);
    transform: translateY(-50%);
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.video-viewer-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    aspect-ratio: 1;
    padding: 0;
    border: 1px solid var(--color-base);
    border-radius: 50%;
    background: transparent;
    color: var(--color-base);
    cursor: pointer;
    transition: background 0.2s ease;
}
.video-viewer-btn svg {
    display: block;
}
/* Same states as the carousel arrows (.carousel-btn) */
.video-viewer-btn:hover {
    background: var(--color-white);
}
.video-viewer-btn:focus,
.video-viewer-btn:active {
    border-color: var(--color-base-dark);
    background: var(--color-base-dark);
    color: var(--color-white);
}
body.viewer-open {
    overflow: hidden;
}



































@media (min-width: 768px) and (max-width: 1200px) {
    .video-viewer-slide {
        max-width: min(450px, calc(78dvh * 0.6667));
    }
    .video-viewer-nav {
        left: calc(50% + min(450px, calc(78dvh * 0.6667)) / 2 + 1.5rem);
    }
/* end - min-width: 768px and max-width: 1200px */
}



































@media (max-width: 767px) {
    .video-viewer-slide {
        max-width: calc(78dvh * 0.6667);
    }
    .video-viewer-title h3 {
        font-size: 24px;
    }
    .video-viewer-nav {
        display: none;
    }
/* end - max-width: 767px */
}




/* ================================================
   MODULE — Floating video mini player
   The /videos hero and the group_latest_podcast
   carousels (CGSP Insights, The Debrief) keep
   playing in a fixed corner box once the video
   leaves the view.
   ================================================ */
/* The player leaves the flow, so the slot holds its own height */
.featured-video-fade .card-image.has-floating-video {
    aspect-ratio: 16 / 9;
}
.int-section--podcasts .col-card.has-floating-video::before {
    content: '';
    display: block;
    aspect-ratio: 16 / 9;
}
.bunny-video-wrap.is-floating {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;
    z-index: 100001; /* Over the AI chat widget, which sits at 100000 */
    width: 400px;
    max-width: calc(100% - 3rem);
    border-radius: 8px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
}
/* No hover zoom in the mini player: the card is still its DOM ancestor,
   so the site-wide `.card:hover` / `.col-card:hover` zoom rules would fire. */
.post-thumb.bunny-video-wrap.is-floating video,
.post-thumb.bunny-video-wrap.is-floating img {
    transform: none;
}
.mini-player-close {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    z-index: 2;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    cursor: pointer;
    transition: opacity 0.2s ease;
}
.bunny-video-wrap.is-floating .mini-player-close {
    display: flex;
}
.mini-player-close:hover,
.mini-player-close:focus,
.mini-player-close:active {
    opacity: 0.7;
    color: #fff;
}




































@media (min-width: 768px) and (max-width: 1200px) {
    .bunny-video-wrap.is-floating {
        width: 320px;
    }
/* end - min-width: 768px and max-width: 1200px */
}




































@media (max-width: 767px) {
    .bunny-video-wrap.is-floating {
        right: 1rem;
        bottom: 1rem;
        width: 260px;
        max-width: calc(100% - 2rem);
    }
/* end - max-width: 767px */
}




/* ==========================================================
   BETA NOTICE — AI Advisor page (native <dialog>)
   ========================================================== */
.beta-notice {
    position: fixed;
    margin: auto;
    width: calc(100% - 2rem);
    max-width: 480px;
    padding: 2.5rem 2rem 2rem;
    border: 0;
    border-radius: 12px;
    background: var(--color-white);
    color: var(--color-dark-blue);
    box-shadow: 0 4px 20px var(--color-shadow-200);
}

.beta-notice::backdrop {
    background: var(--color-overlay);
}

.beta-notice-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    text-align: center;
}

.beta-notice-body .wrap-headline h2 {
    font-size: 20px !important;
    line-height: 1.3;
}

.beta-notice-body .text p {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.5;
}

.beta-notice-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border: 0;
    background: transparent;
    color: var(--color-dark-blue);
    cursor: pointer;
}

.beta-notice-close:hover,
.beta-notice-close:focus-visible {
    opacity: 0.7;
}

.btn-beta-notice,
.btn-beta-notice:hover,
.btn-beta-notice:focus {
    padding: 0.625rem 1.5rem;
    border-color: var(--color-red);
    background: var(--color-red);
    color: var(--color-white);
}

.btn-beta-notice:hover,
.btn-beta-notice:focus,
.btn-beta-notice:active {
    opacity: 0.7;
}


/* ==========================================================
   COMING SOON — standalone page (template-coming-soon.php)
   ========================================================== */
.int-section--coming-soon {
    max-width: none;
    min-height: 100vh;
    padding: 0;
    display: flex;
    background-color: var(--color-dark-blue);
    background-image: url('../img/wordl0.jpg');
    background-size: cover;
    background-position: right center;
    background-repeat: no-repeat;
    color: var(--color-white);
    font-family: 'Montserrat', sans-serif;
}

.int-section--coming-soon .c-container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding-top: 2rem;
    padding-bottom: 3rem;
}

/* Top bar: login link */
.coming-soon-login {
    align-self: flex-end;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
}

.coming-soon-login a {
    font-weight: 600;
    color: inherit;
    text-decoration: underline;
    transition: opacity 0.2s ease;
}

.coming-soon-login a:hover,
.coming-soon-login a:focus {
    opacity: 0.7;
    color: inherit;
}

/* Main block: logo, headline, text, CTA */
.coming-soon-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 2rem;
    padding-left: 8%;
    padding-bottom: 8vh;
}

.coming-soon-logo img {
    display: block;
    max-width: 100%;
    height: auto;
}

.coming-soon-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    padding-top: 4rem;
}

.page-headline--coming-soon h1 {
    font-size: 72px;
    line-height: 1.1;
    color: var(--color-white);
}

.coming-soon-content .text p {
    margin: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
}

.coming-soon-content .cta {
    padding-top: 1.75rem;
}

.btn-notify,
.btn-notify:hover,
.btn-notify:focus,
.btn-notify:active {
    border: 1px solid var(--color-red);
    border-radius: 50px;
    padding: 0.625rem 1rem;
    background: var(--color-red);
    color: var(--color-white);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    transition: opacity 0.2s ease;
}

.btn-notify:hover,
.btn-notify:focus,
.btn-notify:active {
    opacity: 0.7;
}

/* Coming Soon modals (native <dialog>): base + notify / login variants */
.cs-modal {
    position: fixed;
    margin: auto;
    width: calc(100% - 2rem);
    max-width: 480px;
    padding: 2.5rem 2rem 2rem;
    border: 0;
    border-radius: 12px;
    background: var(--color-white);
    color: var(--color-dark-blue);
    box-shadow: 0 4px 20px var(--color-shadow-200);
}

.cs-modal::backdrop {
    background: var(--color-overlay);
}

.cs-modal-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border: 0;
    background: transparent;
    color: var(--color-dark-blue);
    cursor: pointer;
}

.cs-modal-close:hover,
.cs-modal-close:focus-visible {
    opacity: 0.7;
}

.cs-modal-body {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.cs-modal-body .wrap-headline h2 {
    font-family: 'Cantata One', serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 1.3;
    margin: 0;
}

/* Doubled class to beat the Gravity Forms theme footer margin/padding */
.cs-modal--notify .gform_wrapper.gform_wrapper .gform_footer {
    justify-content: flex-start;
    margin: 1.5rem 0 0;
    padding: 0;
}

/* Login form (same look as the Gravity Forms fields) */
.login-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    font-family: 'Montserrat', sans-serif;
}

.login-field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.login-field label {
    font-size: 16px;
    font-weight: 600;
}

.login-field input {
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-base-light-semi);
    border-radius: 8px;
    background: var(--color-white);
    font-family: inherit;
    font-size: 16px;
    color: var(--color-dark-blue);
}

.login-field input:focus {
    outline: none;
    border-color: var(--color-navy);
}

.login-error {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-red);
}

.login-form .cta {
    padding-top: 0.5rem;
}

.login-form .btn-submit:disabled {
    opacity: 0.7;
    cursor: wait;
}

/* Hide the AI chat widget (cgsp-ai-chat plugin) on this page;
   !important because the plugin JS toggles inline display */
.page-template-template-coming-soon .cgsp-widget-trigger,
.page-template-template-coming-soon .cgsp-widget-collapsed,
.page-template-template-coming-soon .cgsp-widget-fullscreen {
    display: none !important;
}



































/* Coming Soon — tablet */
@media (max-width: 1200px) {

    .int-section--coming-soon {
        background-position: 70% center;
    }

    .coming-soon-body {
        padding-left: 4%;
    }

    .page-headline--coming-soon h1 {
        font-size: 56px;
    }

}



































/* Coming Soon — mobile */
@media (max-width: 767px) {

    .int-section--coming-soon {
        background-image: linear-gradient(var(--color-overlay), var(--color-overlay)), url('../img/wordl0.jpg');
        background-position: 75% center;
    }

    .coming-soon-login {
        align-self: flex-start;
    }

    .coming-soon-body {
        padding-left: 0;
        padding-bottom: 0;
    }

    .coming-soon-content {
        padding-top: 2rem;
    }

    .page-headline--coming-soon h1 {
        font-size: 44px;
    }

    .coming-soon-content .text p {
        font-size: 15px;
    }

}