/* Top utility bar injected into #navbar-placeholder */
#navbar-placeholder {
  position: relative;              /* keep your existing top black bg */
  z-index: 10000;
  background: #000;                /* ensure black background stays */
}

/* Layout: brand left, links right */
#navbar-placeholder .navbar-custom {
  max-width: 1280px;               /* match your site container width */
  margin: 0 auto;
  height: 40px;                    /* reduced height */
  padding: 0 16px;                 /* tighter vertical padding */
  display: flex;
  align-items: center;             /* vertical centering */
  justify-content: space-between;  /* left / right alignment */
  gap: 16px;
}

/* Left brand link */
#navbar-placeholder .navbar-custom > a {
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  font-size: 15px;
  line-height: 40px;               /* keep centered */
}

/* Right-side links row */
#navbar-placeholder .navbar-custom > div {
  display: flex;
  align-items: center;
  gap: 20px;                       /* spacing between links */
}

/* Links styling + hover */
#navbar-placeholder .navbar-custom a {
  color: #d6d6d6;
  text-decoration: none;
  transition: color .2s ease;
  font-size: 14px;
  line-height: 40px;               /* keep vertically centered */
}

#navbar-placeholder .navbar-custom a:hover {
  color: #ffffff;
}
.header-default .logo a img {
    max-height: 100px !important;
}

/* ========================= */
/* Mobile Responsive Styles  */
/* ========================= */
@media (max-width: 768px) {
  #navbar-placeholder .navbar-custom {
    flex-wrap: wrap;            /* allow wrapping */
    height: auto;               /* flexible height */
    padding: 8px 12px;
  }

  #navbar-placeholder .navbar-custom > a {
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 6px;
  }

  #navbar-placeholder .navbar-custom > div {
    width: 100%;                /* take full width */
    justify-content: flex-start;/* align links left under brand */
    flex-wrap: wrap;            /* allow multiple rows */
    gap: 12px;
  }

  #navbar-placeholder .navbar-custom a {
    font-size: 14px;
    line-height: 1.4;
  }
}

/* (Optional) Super small screens */
@media (max-width: 480px) {
  #navbar-placeholder .navbar-custom > div {
    flex-direction: column;     /* stack links vertically */
    align-items: flex-start;
    gap: 6px;
  }
}







/* 1) Make the whole slider section full-bleed (ignore parent container width) */
.rainbow-testimonial-area {
  width: 100vw;                               /* span viewport */
  margin-left: calc(50% - 50vw);              /* pull to left edge */
  margin-right: calc(50% - 50vw);             /* pull to right edge */
  position: relative;
}

/* 2) Remove Slick’s gutters completely */
.rainbow-testimonial-area .slick-list,
.rainbow-testimonial-area .slick-track,
.rainbow-testimonial-area .slick-slide {
  padding: 0 !important;
  margin: 0 !important;
}

/* 3) Ensure each slide image fully covers the viewport (no tiling) */
.rainbow-testimonial-area .single-rainbow-slider {
  min-height: 100vh;                          /* full screen height */
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

/* If you use two background layers (image + overlay), apply to both layers */
.rainbow-testimonial-area .single-rainbow-slider.bg-overlay {
  background-position: center center, center center;
  background-repeat: no-repeat, no-repeat;
  background-size: cover, cover;
}



/* 1) Expand the grid column to full width (kills the 8/12 + offset cap) */
.post-page-banner .col-lg-8.offset-lg-2,
.blog-details-content .col-lg-8.offset-lg-2 {
  margin-left: 0 !important;
  flex: 0 0 100% !important;
  max-width: 100% !important;
}

/* 2) Center inner content and cap it at 1024px */
.post-page-banner .content,
.blog-details-content .content {
  max-width: 1200px;
  margin: 0 auto;       /* horizontally center */
}

/* 3) Remove Bootstrap’s container side padding in these sections
      so the visual width is exactly 1024px (no extra 15px gutters) */
.post-page-banner .container,
.blog-details-content .container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 4) Map image: center it and keep natural width up to 1024px */
.post-page-banner .big-map { text-align: center; }

.post-page-banner .big-map img {
  display: block;
  width: 1024px;        /* natural width */
  max-width: 100%;      /* responsive on small screens */
  height: auto;         /* keep aspect ratio */
  margin: 0 auto;       /* center */
}

/* 5) Optional: keep buttons aligned with the same 1024px column */
.post-page-banner .hd-maps,
.post-page-banner .button-group {
  max-width: 1024px;
  margin: 12px auto 0;
}

/* 6) Small screens: full-width fluid image/content */
@media (max-width: 1060px) {
  .post-page-banner .content,
  .blog-details-content .content,
  .post-page-banner .hd-maps,
  .post-page-banner .button-group {
    padding: 0 16px;    /* small breathing room on phones */
  }
}




/* Gradient colored links inside blog content */
.blog-details-content .content a {
  color: inherit; /* fallback if gradient not supported */
  font-weight: 500;
  text-decoration: underline;
  text-decoration-thickness: 1px;

  background: linear-gradient(
    95deg,
    var(--color-primary) 15%,
    var(--color-tertiary) 45%,
    var(--color-pink) 75%,
    var(--color-secondary) 100%
  );
  background-size: 200% 100%;
  background-clip: text;
  -webkit-background-clip: text;     /* Safari/Chrome */
  -webkit-text-fill-color: transparent;
  transition: background-position 0.3s ease;
}

/* Animate gradient on hover */
.blog-details-content .content a:hover {
  background-position: 100% 0;
  text-decoration-thickness: 2px;
}






/* ===========================
   LOGIN MODAL — light, clean
   Scope: .login-modal-unique
   =========================== */

/* Center & width */
.login-modal-unique .modal-dialog{
  max-width: 480px;
  width: 100%;
  margin: .75rem auto;
  min-height: calc(100% - 1.5rem);
  display: flex;
  align-items: center;
}
@media (max-width: 480px){
  .login-modal-unique .modal-dialog{ max-width: 92vw; }
}

/* Card */
.login-modal-unique .modal-content{
  background: #ffffff;
  color: #1f2937; /* neutral-800 */
  border: 1px solid #e5e7eb; /* neutral-200 */
  border-radius: 20px;
  box-shadow: 0 20px 70px rgba(0,0,0,.25);
  overflow: hidden;
}

/* Header */
.login-modal-unique .modal-header{
  border: 0;
  padding: 20px 24px 0;
}
.login-modal-unique .modal-title{
  margin: 0;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: .2px;
  color: #111827; /* neutral-900 */
}

/* Close button */
.login-modal-unique .close{
  width: 34px; height: 34px;
  border-radius: 50%;
  background: #f3f4f6;
  color: #374151;
  opacity: 1;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid #e5e7eb;
  text-shadow: none;
  transition: background .2s ease, color .2s ease;
}
.login-modal-unique .close span{ line-height: 1; font-size: 20px; }
.login-modal-unique .close:hover{ background:#e5e7eb; color:#111827; }

/* Body */
.login-modal-unique .modal-body{ padding: 26px 24px 32px; }

/* Form layout (handles whatever HTML you load) */
.login-modal-unique .login-container,
.login-modal-unique .login-form-container form{
  display: grid;
  gap: 18px;
}

/* Labels */
.login-modal-unique label{
  display:block;
  font-size: 14px;
  font-weight: 500;
  color: #6b7280; /* neutral-500 */
  margin-bottom: 6px;
}

/* Inputs */
.login-modal-unique input[type="text"],
.login-modal-unique input[type="email"],
.login-modal-unique input[type="password"]{
  width: 100%;
  padding: 14px 16px;
  background: #f9fafb;              /* light fill */
  border: 1px solid #e5e7eb;        /* light border */
  border-radius: 12px;
  font-size: 15px;
  color: #111827;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.login-modal-unique input::placeholder{ color:#9ca3af; }
.login-modal-unique input:focus{
  background:#ffffff;
  border-color:#3b82f6;             /* brand-ish blue focus */
  box-shadow: 0 0 0 3px rgba(59,130,246,.18);
}

/* Submit button — gradient brand */
.login-modal-unique button[type="submit"],
.login-modal-unique input[type="submit"]{
  width: 100%;
  border-radius: 999px;
  border: 0;
  padding: 16px 20px;       /* taller */
  font-size: 17px;          /* larger text */
  font-weight: 700;
  color: #fff;
  background: linear-gradient(
    95deg,
    var(--color-primary) 15%,
    var(--color-tertiary) 45%,
    var(--color-pink) 75%,
    var(--color-secondary) 100%
  ) 95%/200% 100%;
  transition: background-position .3s ease, transform .05s ease, box-shadow .15s ease;
  box-shadow: 0 8px 20px rgba(59,130,246,.20);
}
.login-modal-unique button[type="submit"]:hover,
.login-modal-unique input[type="submit"]:hover{ background-position: 0% 0%; }
.login-modal-unique button[type="submit"]:active,
.login-modal-unique input[type="submit"]:active{ transform: translateY(1px); }

/* Secondary actions (links) */
.login-modal-unique .modal-body a{
  color: #2563eb;                  /* blue-600 */
  text-decoration: none;
  font-weight: 600;
}
.login-modal-unique .modal-body a:hover{ text-decoration: underline; }

/* Optional Google button (if present) */
.login-modal-unique .btn-google{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  border-radius: 999px;
  border: 1px solid #e5e7eb;
  background: #ffffff;
  color: #111827;
  padding: 14px 18px;         /* bigger for consistency */
  font-size: 15px;
  font-weight: 700;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.login-modal-unique .btn-google:hover{
  background:#f9fafb;
  border-color:#d1d5db;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.login-modal-unique .btn-google img,
.login-modal-unique .btn-google svg{ width: 18px; height: 18px; }

/* Radio/checkbox when you swap to download options */
.login-modal-unique .form-check{
  display: flex; align-items: center; gap: 10px;
}
.login-modal-unique .form-check-input{
  width: 18px; height: 18px; margin-top: 0;
  accent-color: #3b82f6;
}

/* Keep remote headings from bringing weird sizes */
.login-modal-unique .login-form-container h1,
.login-modal-unique .login-form-container h2,
.login-modal-unique .login-form-container h3,
.login-modal-unique .login-form-container h4,
.login-modal-unique .login-form-container h5,
.login-modal-unique .login-form-container h6{
  font: inherit;
  margin: 0 0 .5rem;
  color:#111827;
}
/* Make sure the close button sits above and is clickable */
/* Put this modal above any theme layers */
.login-modal-unique.modal { z-index: 200000; }
.modal-backdrop.show     { z-index: 199999; }

/* Make sure nothing overlays the header */
.login-modal-unique .modal-content { position: relative; }
.login-modal-unique .modal-header  { position: relative; z-index: 2; }

/* Ensure the close button is on top and clickable */
.login-modal-unique .modal-header .close{
  position: absolute;
  top: 14px; right: 14px;
  z-index: 3;
  pointer-events: auto;
  cursor: pointer;
}




/* inside the login modal only */
.login-modal-unique .form-check-label { pointer-events: auto; }
.login-modal-unique .form-check-input { position: relative; z-index: 1; }




/* ===========================
   Download options (scoped to this modal)
   =========================== */
.login-modal-unique #downloadOptionsForm{
  display:grid;
  gap:14px;
}

/* Card-like rows for each option */
.login-modal-unique #downloadOptionsForm .form-check{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  cursor:pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .02s ease;
}
.login-modal-unique #downloadOptionsForm .form-check:hover{
  border-color:#d1d5db;
  box-shadow:0 4px 18px rgba(0,0,0,.06);
}

/* Selected state (modern browsers) */
.login-modal-unique #downloadOptionsForm .form-check:has(.form-check-input:checked){
  border-color:#6366f1;
  box-shadow:0 6px 24px rgba(99,102,241,.18);
}

/* Radios / checkbox look */
.login-modal-unique #downloadOptionsForm .form-check-input{
  width:20px; height:20px;
  margin-top:2px;
  flex:0 0 auto;
  accent-color:#6366f1; /* modern */
}
.login-modal-unique #downloadOptionsForm .form-check-label{
  font-size:16px;
  line-height:1.45;
  color:#1f2937;
  font-weight:600;
}

/* Terms block gets a softer style */
.login-modal-unique #downloadOptionsForm .form-check:has(input[type="checkbox"]){
  background:#f9fafb;
  border-style:dashed;
}
.login-modal-unique #downloadOptionsForm .form-check:has(input[type="checkbox"]) .form-check-label{
  font-weight:500;
  color:#374151;
}
.login-modal-unique #downloadOptionsForm .form-check:has(input[type="checkbox"]) strong{
  font-weight:800;
}

/* Price line */
.login-modal-unique #downloadOptionsForm #totalCost{
  font-weight:800;
  color:#059669;
}
.login-modal-unique #downloadOptionsForm p:has(#totalCost){
  margin:8px 0 0;
  text-align:center;
  font-size:26px;
}

/* Make modal body scroll and keep CTA sticky inside */
.login-modal-unique .modal-content{
  display:flex;
  flex-direction:column;
}
.login-modal-unique .modal-body{
  max-height:calc(100vh - 220px);
  overflow:auto;
  padding-bottom:96px; /* room for sticky CTA */
}

/* CTA button full-width, sticky, and pretty */
.login-modal-unique #proceedToPayment{
  position:sticky;
  bottom:0;
  width:100%;
  margin-top:14px;
  padding:16px 18px;
  border-radius:12px;
  font-size:18px;
  font-weight:800;
  box-shadow:0 10px 30px rgba(99,102,241,.25);
  /* keep your brand gradient */
  background: linear-gradient(
    95deg,
    var(--color-primary) 15%,
    var(--color-tertiary) 45%,
    var(--color-pink) 75%,
    var(--color-secondary) 100%
  ) 95%/200% 100%;
  border:0;
}
.login-modal-unique #proceedToPayment:hover{
  background-position:0% 0%;
}

/* Small polish for the modal header close button so it matches */
.login-modal-unique .modal-header .close{
  width:34px;height:34px;border-radius:50%;
  background:#eef2ff;border:1px solid #e5e7eb;color:#374151;
  display:inline-flex;align-items:center;justify-content:center;
  opacity:1;text-shadow:none;
}
.login-modal-unique .modal-header .close:hover{ background:#e0e7ff; color:#111827; }

/* Fallbacks for browsers without :has() — still look good */
@supports not(selector(:has(*))){
  .login-modal-unique #downloadOptionsForm .form-check-input:checked + .form-check-label{
    color:#111827;
    text-shadow:0 0 0 currentColor; /* force subpixel AA without visual change */
  }
}


#loginModalUnique .modal-dialog {
  max-width: 900px !important;   /* wider desktop modal */
  width: 90%;                    /* use 90% of viewport */
  margin: 1.75rem auto;           /* centered with space above/below */
}

#loginModalUnique .modal-body {
  padding: 24px 32px;
  max-height: 75vh;
  overflow-y: auto;
}



#loginModalUnique .download-options {
  display: flex;
  flex-direction: column;
  gap: 12px;
}



#loginModalUnique .option-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 14px 18px;
  cursor: pointer;
  transition: all .2s ease;
}

#loginModalUnique .option-card:hover {
  border-color: #3b82f6;
  background: #f9fafb;
}

#loginModalUnique .option-card input[type="radio"] {
  margin-right: 12px;
}

#loginModalUnique .option-card.active {
  border-color: #3b82f6;
  background: #eef6ff;
  box-shadow: 0 0 0 2px rgba(59,130,246,.2);
}


/* Wider, but shorter overall */
#loginModalUnique .modal-dialog{ max-width: 720px; }
#loginModalUnique .modal-body{
  padding: 20px 28px;
  max-height: 70vh;         /* keeps modal short */
  overflow: auto;           /* body scrolls instead */
}

/* Title spacing */
#loginModalUnique .modal-title{ margin-bottom: 8px; }

/* Options as compact cards */
#loginModalUnique .form-check {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 14px 18px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: all 0.2s ease;
  background: #fff;
}

#loginModalUnique .form-check + .form-check{ margin-top: 10px; }

#loginModalUnique .form-check:hover {
  background: #f9fafb;
  border-color: #cbd5e1;
}

#loginModalUnique .form-check.active {
  border-color: #3b82f6;
  background: #f0f9ff;
}

/* Make radios/checkboxes tidy */
#loginModalUnique .form-check-input{ width:18px;height:18px; margin:0 2px 0 0; }

/* Turn the AGREEMENT (4th .form-check) into a compact scroll box */
#loginModalUnique .form-check.terms-box {
  border-style: dashed;
  background: #fafafa;
  font-size: 14px;
  line-height: 1.4;
}

/* Total + CTA */
#loginModalUnique .total-line {
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  margin: 16px 0;
  color: #059669;
}

/* Sticky CTA so user doesn’t scroll back down */
#loginModalUnique .pay-cta{
  position: sticky; bottom: 8px;
  padding-top: 8px; background: linear-gradient(180deg, transparent, #ffffff 60%);
}
#loginModalUnique #proceedToPayment {
  width: 100%;
  padding: 14px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  border: none;
  background: linear-gradient(95deg, #2563eb, #9333ea, #ec4899);
}
#loginModalUnique #proceedToPayment:disabled{ opacity:.55; cursor:not-allowed; }


/* ===========================
   Payment confirmation (scoped)
   =========================== */
.login-modal-unique .payment-confirmation{
  position: relative;
  padding: 28px 24px;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  background:
    radial-gradient(1200px 300px at 10% -20%, rgba(59,130,246,.06), transparent 60%),
    radial-gradient(1200px 300px at 110% -20%, rgba(236,72,153,.06), transparent 60%),
    #ffffff;
  box-shadow: 0 18px 60px rgba(0,0,0,.10);
  text-align: center;
}

.login-modal-unique .payment-confirmation .pc-confetti{
  pointer-events: none;
  position: absolute; inset: 0;
  background-image:
    radial-gradient(3px 3px at 20% 25%, rgba(99,102,241,.25) 50%, transparent 52%),
    radial-gradient(3px 3px at 78% 18%, rgba(16,185,129,.23) 50%, transparent 52%),
    radial-gradient(3px 3px at 30% 80%, rgba(59,130,246,.22) 50%, transparent 52%),
    radial-gradient(3px 3px at 70% 70%, rgba(236,72,153,.22) 50%, transparent 52%);
  opacity: .6;
}

.login-modal-unique .payment-confirmation .pc-icon{
  --pc-accent: #10b981;
  width: 64px; height: 64px;
  margin: 4px auto 12px;
  color: var(--pc-accent);
  display: grid; place-items: center;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(16,185,129,.15), rgba(16,185,129,.08), transparent);
}

.login-modal-unique .payment-confirmation .pc-title{
  margin: 6px 0 6px;
  font-size: 22px;
  font-weight: 800;
  color: #0f172a;
}

.login-modal-unique .payment-confirmation .pc-sub{
  margin: 0 0 18px;
  font-size: 15px;
  color: #475569;
}

.login-modal-unique .payment-confirmation .pc-actions{
  margin: 10px 0;
}

.login-modal-unique .payment-confirmation .pc-btn-primary{
  appearance: none;
  border: 0;
  border-radius: 12px;
  padding: 14px 16px;
  font-size: 16px;
  font-weight: 800;
  color: #fff;
  cursor: pointer;
  background: linear-gradient(
    95deg,
    var(--color-primary) 15%,
    var(--color-tertiary) 45%,
    var(--color-pink) 75%,
    var(--color-secondary) 100%
  ) 95%/200% 100%;
  box-shadow: 0 10px 28px rgba(59,130,246,.22);
  transition: background-position .25s ease, transform .05s ease, box-shadow .15s ease;
}
.login-modal-unique .payment-confirmation .pc-btn-primary:hover{
  background-position: 0% 0%;
}
.login-modal-unique .payment-confirmation .pc-btn-primary:active{
  transform: translateY(1px);
}

.login-modal-unique .payment-confirmation .pc-note{
  margin: 10px 0 0;
  font-size: 13px;
  color: #64748b;
}



.header-ad {
    display: block;
    justify-content: center;
    align-items: center;
    max-width: 1200px;
    /*min-height: 280px;*/
    margin: 20px auto;
    text-align: center;
    padding-top:100px;
    height: 280px;
    
}


@media (max-width: 768px) {
    .header-ad {
        display: block !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100% !important;
        /*min-height: 400px !important;*/
        margin: 0px auto !important;
        text-align: center !important;
        height: 520px;
    }
    .container {
        padding-right: 0px !important;
        padding-left: 0px !important;
    }
    .rainbow-section-gapTop {
        padding-top: 0px !important;
    }

}

/* Base sidebar ad styles */
.ad-sidebar {
  width: 160px;
  height: 600px;             /* standard skyscraper height */
  position: fixed;           /* fix it relative to viewport */
  top: 50%;                  /* move to vertical center */
  transform: translateY(-50%); /* center perfectly */
  z-index: 1000;
}

/* Left ad pinned to the left */
.ad-sidebar.left-ad {
  left: 10px; /* spacing from left edge */
}

/* Right ad pinned to the right */
.ad-sidebar.right-ad {
  right: 10px; /* spacing from right edge */
}

/* Hide left + right vertical ads on mobile */
@media (max-width: 767px) {
  .ad-sidebar.left-ad,
  .ad-sidebar.right-ad {
    display: none !important;
  }
}



/* Clean appearance */
.ad-sidebar,
.ad-container,
.ad-slot {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}


/* Bootstrap mobile breakpoint: apply ONLY on small screens */
@media (max-width: 575.98px) {
  /* kill decorative blobs that create the oval */
  #loginModalUnique .modal-header::before,
  #loginModalUnique .modal-header::after,
  #loginModalUnique .modal-content::before,
  #loginModalUnique .modal-content::after,
  .login-modal-unique::before,
  .login-modal-unique::after {
    content: none !important;
    display: none !important;
  }

  /* leave room for the close button */
  #loginModalUnique .modal-header {
    position: relative;
    padding: 14px 56px 10px 16px; /* extra right padding for the X */
  }

  /* force a clean, circular close button on top */
  #loginModalUnique .modal-header .close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #eef2ff;
    border: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    color: #374151;
    opacity: 1;
    text-shadow: none;
    z-index: 3;
    pointer-events: auto;
    -webkit-appearance: none;
  }

  #loginModalUnique .modal-header .close span {
    display: block;
    line-height: 1;
  }
}

/* Feather icon font: fast + non-blocking */
@font-face{
  font-family: "Feather";
  src: url("https://www.burningcompass.com/assets/fonts/Feather.woff2") format("woff2"),
       url("https://www.burningcompass.com/assets/fonts/Feather.ttf?sdxovp") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}




/* Never style AdSense containers */
ins.adsbygoogle {
  background: transparent !important;
  text-decoration: none !important;
  border: 0 !important;
}

/* If your CSS globally styles <ins>, neutralize it */
/* (or remove the global rule from your CSS files) */
ins { background: transparent; text-decoration: none; }


/* Apply width of 1200px only to HD pages */
.hd-page .post-page-banner .big-map img {
  width: 1200px;       /* instead of 1024 */
  max-width: 100%;
  height: auto;
}
.hd-page .post-page-banner .hd-maps,
.hd-page .post-page-banner .button-group {
  max-width: 1200px;   /* match HD map width */
}
.hd-page .post-page-banner .content,
.hd-page .blog-details-content .content {
  max-width: 1200px;   /* content column too */
}

/* Left-align buttons on desktop for all HD maps (image or PDF) */
.button-group.hd-maps {
  display: flex;
  justify-content: flex-start;   /* make them align left */
  align-items: flex-start;
  gap: 10px;                     /* optional: spacing between buttons */
}

/* ===== Interlinking grid (scoped) ===== */
.bc-interlinks{
  max-width: 1200px;
  margin: 36px auto 0;
  padding: 0 16px;
}

/* Headings */
.bc-interlinks .footer-heading{
  margin: 26px 0 14px;
  font-weight: 800;
  font-size: 22px;
  line-height: 1.25;
  /* subtle top accent line that looks nice in light/dark */
  padding-top: 14px;
  border-top: 2px solid rgba(125, 211, 252, .25);
}

/* Lists as a clean 3-column grid */
.bc-interlinks ol{
  /* restart numbering per section */
  counter-reset: item;
  margin: 0 0 8px;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 28px;      /* space between columns */
  row-gap: 8px;          /* space between rows */
}

/* Each row: number + link */
.bc-interlinks li{
  list-style: none;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  min-width: 0;          /* prevents overflow with long titles */
}

/* Decimal numbers (1., 2., 3…) */
.bc-interlinks li::before{
  counter-increment: item;
  content: counter(item) ".";
  flex: 0 0 auto;
  font-weight: 700;
  opacity: .8;
  /* soft cyan that works in dark/light themes */
  color: #7dd3fc;
}

/* Link appearance */
.bc-interlinks a{
  display: inline-block;
  text-decoration: none;            /* kill global underlines that look like rules */
  border-bottom: 1px dashed transparent;
  transition: color .15s ease, border-color .15s ease;
  line-height: 1.45;
  word-break: break-word;           /* safety for very long names */
}
.bc-interlinks a:hover{
  border-color: currentColor;
  text-decoration: none;
}

/* Responsive: 2 cols on tablets, 1 col on phones */
@media (max-width: 992px){
  .bc-interlinks ol{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px){
  .bc-interlinks ol{ grid-template-columns: 1fr; }
}




/* ===== CONTENT HEADINGS (light theme = gradient text) ===== */
.rainbow-blog-details-area .content h2:not(.footer-heading),
.rainbow-blog-details-area .content h3:not(.footer-heading),
.rainbow-blog-details-area .content h4:not(.footer-heading),
.rainbow-blog-details-area .content h5:not(.footer-heading),
.rainbow-blog-details-area .content h6:not(.footer-heading){
  font-family:'Inter','Segoe UI',Roboto,system-ui,sans-serif !important;
  font-weight:700 !important;
  line-height:1.3 !important;
  margin-top:2rem !important;
  margin-bottom:.8rem !important;
  letter-spacing:-.2px !important;

  /* gradient text (light) */
  background: linear-gradient(
    95deg,
    var(--color-primary) 15%,
    var(--color-tertiary) 45%,
    var(--color-pink) 75%,
    var(--color-secondary, #FB5343) 100%
  ) 98% / 200% 100%;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}

/* Size hierarchy (H2 ≈ 2×, H3 ≈ 1.3× of your previous) */
.rainbow-blog-details-area .content h2:not(.footer-heading){
  font-size: clamp(2.4rem, 5vw + 1rem, 3.8rem) !important; /* ~double */
  display:flex !important; align-items:center; gap:.6rem;
}
.rainbow-blog-details-area .content h3:not(.footer-heading){
  font-size: clamp(1.6rem, 3.2vw + .5rem, 1.9rem) !important; /* ~1.3× */
}
.rainbow-blog-details-area .content h4:not(.footer-heading){ font-size:1.22rem !important; }
.rainbow-blog-details-area .content h5:not(.footer-heading){
  font-size:1.05rem !important; text-transform:uppercase; letter-spacing:.5px;
}
.rainbow-blog-details-area .content h6:not(.footer-heading){
  font-size:.92rem !important; text-transform:uppercase; letter-spacing:.6px; font-weight:600 !important;
}

/* H2: gradient vertical line BEFORE text */
.rainbow-blog-details-area .content h2:not(.footer-heading)::before{
  content:""; display:inline-block; width:4px; height:1.2em; border-radius:2px;
  background: linear-gradient(
    95deg,
    var(--color-primary) 15%,
    var(--color-tertiary) 45%,
    var(--color-pink) 75%,
    var(--color-secondary, #FB5343) 100%
  );
}

/* H3: gradient underline */
.rainbow-blog-details-area .content h3:not(.footer-heading){ position:relative; padding-bottom:.25rem; }
.rainbow-blog-details-area .content h3:not(.footer-heading)::after{
  content:""; position:absolute; left:0; bottom:-2px; width:56px; height:2px; border-radius:2px;
  background: linear-gradient(
    95deg,
    var(--color-primary) 15%,
    var(--color-tertiary) 45%,
    var(--color-pink) 75%,
    var(--color-secondary, #FB5343) 100%
  );
}

/* Remove extra <br> after headings in content */
.rainbow-blog-details-area .content h2 + br,
.rainbow-blog-details-area .content h3 + br,
.rainbow-blog-details-area .content h4 + br,
.rainbow-blog-details-area .content h5 + br,
.rainbow-blog-details-area .content h6 + br,
.rainbow-blog-details-area .content h2 + br + br,
.rainbow-blog-details-area .content h3 + br + br,
.rainbow-blog-details-area .content h4 + br + br,
.rainbow-blog-details-area .content h5 + br + br,
.rainbow-blog-details-area .content h6 + br + br{ display:none !important; }

/* ===== DARK THEME OVERRIDE: make headings white (no gradient) ===== */
body.dark .rainbow-blog-details-area .content h2:not(.footer-heading),
body.dark .rainbow-blog-details-area .content h3:not(.footer-heading),
body.dark .rainbow-blog-details-area .content h4:not(.footer-heading),
body.dark .rainbow-blog-details-area .content h5:not(.footer-heading),
body.dark .rainbow-blog-details-area .content h6:not(.footer-heading),
[data-theme="dark"] .rainbow-blog-details-area .content h2:not(.footer-heading),
[data-theme="dark"] .rainbow-blog-details-area .content h3:not(.footer-heading),
[data-theme="dark"] .rainbow-blog-details-area .content h4:not(.footer-heading),
[data-theme="dark"] .rainbow-blog-details-area .content h5:not(.footer-heading),
[data-theme="dark"] .rainbow-blog-details-area .content h6:not(.footer-heading),
.theme-dark .rainbow-blog-details-area .content h2:not(.footer-heading),
.theme-dark .rainbow-blog-details-area .content h3:not(.footer-heading),
.theme-dark .rainbow-blog-details-area .content h4:not(.footer-heading),
.theme-dark .rainbow-blog-details-area .content h5:not(.footer-heading),
.theme-dark .rainbow-blog-details-area .content h6:not(.footer-heading){
  background:none !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* In dark theme, make the H2 bar and H3 underline white */
body.dark .rainbow-blog-details-area .content h2:not(.footer-heading)::before,
[data-theme="dark"] .rainbow-blog-details-area .content h2:not(.footer-heading)::before,
.theme-dark .rainbow-blog-details-area .content h2:not(.footer-heading)::before,
body.dark .rainbow-blog-details-area .content h3:not(.footer-heading)::after,
[data-theme="dark"] .rainbow-blog-details-area .content h3:not(.footer-heading)::after,
.theme-dark .rainbow-blog-details-area .content h3:not(.footer-heading)::after{
  background:#fff !important;
}

/* Mobile size softeners */
@media (max-width:768px){
  .rainbow-blog-details-area .content h2:not(.footer-heading){ font-size: clamp(2rem, 6vw + .8rem, 3rem) !important; }
  .rainbow-blog-details-area .content h3:not(.footer-heading){ font-size: clamp(1.35rem, 3.8vw + .4rem, 1.7rem) !important; }
}


/* ================== TABLE (Light + Dark inverted) ================== */
/* Bold headers + mid-size sort icons (theme colors preserved) */
.rainbow-blog-details-area .content .tableizer-table thead th{
  font-weight:700 !important;
  position:relative;
  padding-right:2.5rem;                  /* space for 21×27 icon */
  white-space:nowrap;
}

/* neutral (double chevron) */
.rainbow-blog-details-area .content .tableizer-table thead th::after{
  content:"";
  position:absolute; right:0.75rem; top:50%; transform:translateY(-50%);
  width:21px;                            /* half of 42 */
  height:27px;                           /* half of 54 */
  opacity:.8;
  background-color: currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
          mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
  pointer-events:none;
}

/* ascending ↑ */
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="ascending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-asc::after{
  height:27px;
  -webkit-mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain;
          mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain;
}

/* descending ↓ */
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="descending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-desc::after{
  height:27px;
  -webkit-mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain;
          mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain;
}

/* Center table headers and the sort icon; keep theme colors/borders intact */
.rainbow-blog-details-area .content .tableizer-table thead th{
  text-align: center !important;
  cursor: pointer;
  white-space: nowrap;
  /* remove extra right padding that was for the old right-aligned icon */
  padding-right: 1rem !important;
}

/* Make the icon inline (after the text) and centered vertically */
.rainbow-blog-details-area .content .tableizer-table thead th::after{
  /* override previous absolute placement */
  position: static !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;

  display: inline-block !important;
  vertical-align: middle;
  margin-left: .4rem;              /* small gap from text */

  width: 21px;                     /* your agreed size */
  height: 27px;
  opacity: .8;
  background-color: currentColor;  /* use theme's text color */
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
  pointer-events: none;
}

/* Keep the centered inline icon when sorted */
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="ascending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-asc::after{
  height: 27px !important;
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
}

.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="descending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-desc::after{
  height: 27px !important;
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
}

/* Make sure hover doesn't underline (you asked earlier to avoid it) */
.rainbow-blog-details-area .content .tableizer-table thead th:hover{
  text-decoration: none !important;
}

/* Put header text and sort icon on the same line (both themes) */
.rainbow-blog-details-area .content .tableizer-table thead th{
  display: flex;                       /* horizontal layout */
  justify-content: center;             /* center as a unit */
  align-items: center;                 /* vertical middle */
  gap: .4rem;                          /* space between text & icon */
  white-space: nowrap;                 /* prevent wrapping */
  cursor: pointer;                     /* still clickable */
}

/* Keep the inline icon next to the text */
.rainbow-blog-details-area .content .tableizer-table thead th::after{
  position: static !important;         /* no absolute positioning */
  display: inline-block !important;
  margin: 0;                           /* gap is handled by flex */
  width: 21px;                         /* your chosen size */
  height: 27px;
  opacity: .8;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
  pointer-events: none;
}

/* Keep the right icon when sorted */
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="ascending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-asc::after{
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
}
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="descending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-desc::after{
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
}


/* ---- FIX: keep headers as real table cells, center text + icon ---- */
.rainbow-blog-details-area .content .tableizer-table thead th{
  display: table-cell !important;      /* undo flex */
  text-align: center !important;       /* center label */
  vertical-align: middle !important;   /* center vertically */
  white-space: nowrap;
  cursor: pointer;
  padding-right: 1rem !important;      /* no extra right pad */
}

/* Icon inline BESIDE the text (not below) */
.rainbow-blog-details-area .content .tableizer-table thead th::after{
  position: static !important;         /* no absolute */
  display: inline-block !important;
  vertical-align: middle;
  margin-left: .4rem;

  width: 21px;                         /* your chosen size */
  height: 27px;
  opacity: .8;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
  pointer-events: none;
}

/* Keep correct arrow when sorted */
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="ascending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-asc::after{
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
}
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="descending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-desc::after{
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
}


/* Keep real table cells, center, and show hand */
.rainbow-blog-details-area .content .tableizer-table thead th{
  display: table-cell !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap;
  cursor: pointer;
  padding-right: 1rem !important;   /* minimal extra space */
}

/* Key fix: if the theme wraps text in a block element, force it inline */
.rainbow-blog-details-area .content .tableizer-table thead th > *{
  display: inline !important;
  vertical-align: middle !important;
}

/* Icon inline BESIDE the text */
.rainbow-blog-details-area .content .tableizer-table thead th::after{
  position: static !important;         /* inline with text */
  display: inline-block !important;
  vertical-align: middle;
  margin-left: .4rem;

  width: 21px;                         /* your agreed size */
  height: 27px;
  opacity: .8;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7l-4 4h8zM12 17l4-4H8z'/></svg>") no-repeat center/contain;
  pointer-events: none;
}

/* Correct arrow when sorted */
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="ascending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-asc::after{
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 14l5-5 5 5H7z'/></svg>") no-repeat center/contain !important;
}
.rainbow-blog-details-area .content .tableizer-table thead th[aria-sort="descending"]::after,
.rainbow-blog-details-area .content .tableizer-table thead th.sort-desc::after{
  -webkit-mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
          mask: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5H7z'/></svg>") no-repeat center/contain !important;
}

/* --- LIGHT THEME ONLY: show subtle gridlines using the text color --- */
body:not(.dark) .rainbow-blog-details-area .content .tableizer-table,
[data-theme="light"] .rainbow-blog-details-area .content .tableizer-table,
.theme-light .rainbow-blog-details-area .content .tableizer-table{
  border-collapse: collapse !important;
  /* outer border */
  border: 1px solid rgba(17,24,39,.12) !important;                         /* fallback */
  border-color: color-mix(in srgb, currentColor 18%, transparent) !important;
}

body:not(.dark) .rainbow-blog-details-area .content .tableizer-table thead th,
[data-theme="light"] .rainbow-blog-details-area .content .tableizer-table thead th,
.theme-light .rainbow-blog-details-area .content .tableizer-table thead th{
  /* header bottom + vertical dividers */
  border-bottom: 1px solid rgba(17,24,39,.12) !important;
  border-right: 1px solid rgba(17,24,39,.10) !important;
  border-color: color-mix(in srgb, currentColor 18%, transparent) !important;
}

body:not(.dark) .rainbow-blog-details-area .content .tableizer-table tbody td,
[data-theme="light"] .rainbow-blog-details-area .content .tableizer-table tbody td,
.theme-light .rainbow-blog-details-area .content .tableizer-table tbody td{
  border-top: 1px solid rgba(17,24,39,.08) !important;
  border-right: 1px solid rgba(17,24,39,.08) !important;
  border-color: color-mix(in srgb, currentColor 14%, transparent) !important;
}

/* no extra line on the far right */
body:not(.dark) .rainbow-blog-details-area .content .tableizer-table thead th:last-child,
[data-theme="light"] .rainbow-blog-details-area .content .tableizer-table thead th:last-child,
.theme-light .rainbow-blog-details-area .content .tableizer-table thead th:last-child,
body:not(.dark) .rainbow-blog-details-area .content .tableizer-table tbody td:last-child,
[data-theme="light"] .rainbow-blog-details-area .content .tableizer-table tbody td:last-child,
.theme-light .rainbow-blog-details-area .content .tableizer-table tbody td:last-child{
  border-right: none !important;
}


/* Make the TABLE itself the horizontal scroller (no wrapper needed) */
.rainbow-blog-details-area .content .tableizer-table{
  /* let it scroll sideways only when wider than the container */
  display: block;                 /* enables overflow on the element */
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;  /* smooth on iOS */
  overscroll-behavior-x: contain;     /* don't propagate to the page */

  /* sizing: fill at least 100%, but grow to fit all columns */
  min-width: 100%;
  max-width: 100%;
  width: max-content;                 /* expands if columns need more room */
  /* keep all your existing borders/typography rules intact */
}

/* Optional: nicer horizontal scrollbar (doesn't affect dark/light colors) */
.rainbow-blog-details-area .content .tableizer-table::-webkit-scrollbar{
  height: 10px;
}
.rainbow-blog-details-area .content .tableizer-table::-webkit-scrollbar-thumb{
  background: color-mix(in srgb, currentColor 25%, transparent);
  border-radius: 8px;
}
.rainbow-blog-details-area .content .tableizer-table::-webkit-scrollbar-track{
  background: transparent;
}

/* H1 font stack */
.page-title h1,
.rainbow-blog-details-area .content h1,
h1{
  font-family: 'Linux Libertine', 'Georgia', 'Times', 'Source Serif 4', serif !important;
}




/* H1 size/weight (keep as you set earlier) */
.page-title h1,
.rainbow-blog-details-area .content h1{
  font-family: 'Linux Libertine', 'Georgia', 'Times', 'Source Serif 4', serif !important;
  font-weight: 500 !important;
  font-size: clamp(3.5rem, 2.2vw + 2.6rem, 5rem) !important;
  line-height: 1.15;
  margin-bottom: 0.6rem;
}

/* Ultra-thin underline that follows the text color */
.page-title h1::after,
.rainbow-blog-details-area .content h1::after{
  content: "";
  display: block;
  width: min(100%, 1200px);
  height: 1px;
  margin: 8px auto 18px;
  background: currentColor !important; /* uses the H1's color */
  opacity: .25;                        /* visible in light */
  border-radius: 999px;
}

/* Make it brighter in dark theme */
body.dark .page-title h1::after,
[data-theme="dark"] .page-title h1::after,
.theme-dark .page-title h1::after,
body.dark .rainbow-blog-details-area .content h1::after,
[data-theme="dark"] .rainbow-blog-details-area .content h1::after,
.theme-dark .rainbow-blog-details-area .content h1::after{
  background: currentColor !important;
  opacity: .45 !important;             /* bump visibility on dark bg */
}


/* --- Mobile fix ONLY for pages with <body class="no-ads"> --- */
@media (max-width: 767px) {
  body.no-ads .rainbow-blog-details-area .post-page-banner {
    padding-top: 150px !important; /* fixed spacing for no-ads pages */
  }

  body.no-ads .rainbow-blog-details-area .post-page-banner .page-title h1 {
    margin: 0;
    line-height: 1.2;
    font-size: clamp(22px, 6.2vw, 30px);
    word-wrap: break-word;
    overflow-wrap: anywhere;
  }

  body.no-ads .rainbow-blog-details-area .post-page-banner .content {
    padding-left: 12px;
    padding-right: 12px;
  }
}


/* Mobile footer padding + gutter fix */
@media (max-width: 767px) {
  /* Give the footer containers safe side padding (handles iPhone notch too) */
  .rainbow-footer .footer-top .container,
  .rainbow-footer .copyright-area .container {
    padding-left: calc(16px + env(safe-area-inset-left, 0px)) !important;
    padding-right: calc(16px + env(safe-area-inset-right, 0px)) !important;
  }

  /* Neutralize negative Bootstrap row margins inside footer */
  .rainbow-footer .footer-top .row,
  .rainbow-footer .copyright-area .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Ensure each column has some inner breathing room */
  .rainbow-footer .footer-top [class^="col-"],
  .rainbow-footer .footer-top [class*=" col-"],
  .rainbow-footer .copyright-area [class^="col-"],
  .rainbow-footer .copyright-area [class*=" col-"] {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Small readability tweaks */
  .rainbow-footer .rainbow-footer-widget .title {
    margin-bottom: 10px;
    letter-spacing: .3px;
  }
  .rainbow-footer .footer-link li a {
    display: inline-block;
    padding: 6px 0;
  }
}

/* Extra space between links and copyright on mobile */
@media (max-width: 767px) {
  /* Add vertical gap inside the copyright row */
  .rainbow-footer .copyright-area .row {
    row-gap: 12px;              /* modern way to space stacked items */
  }

  /* Or, force a margin above the copyright text */
  .rainbow-footer .copyright-area .copyright-text {
    display: block;             /* ensure margin applies */
    margin-top: 12px;           /* <-- adjust (8–16px) to taste */
  }

  /* Keep everything centered neatly */
  .rainbow-footer .copyright-area .copyright-left,
  .rainbow-footer .copyright-area .copyright-right {
    text-align: center !important;
  }

  /* Make the link list wrap nicely and keep even spacing */
  .rainbow-footer .copyright-area .ft-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;             /* row-gap / column-gap */
    justify-content: center;
    padding: 0;
    margin: 0;
    list-style: none;
  }
}
/* Below-map adx ad wrapper */
.below-map-ad{
  display:block;
  text-align:center;
  margin:16px auto 24px;
  max-width:970px;
  padding:8px 0;
  overflow:visible;         /* don't crop the iframe */
  position:relative;
  z-index:3;
  min-height:250px;         /* reserve for 970x250 so it never looks cut */
}

/* the GPT div inside */
.below-map-ad > div{ display:inline-block; line-height:0; }

/* if the banner section above has rounded corners/overflow, keep ad visible */
.post-page-banner + .below-map-ad{ overflow:visible; }

/* TEMP while testing: unclip likely ancestors (remove later if not needed) */
.rainbow-section-gapTop, .post-page-banner{ overflow:visible !important; }
