@charset "UTF-8";
/*
Theme Name: ChimeraProM
Theme URI: 
Author: 
Author URI: 
Description: 
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 5.7
Version: 1.0.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: ollie
Text Domain: chimeraprom
Tags: 
*/
@media screen and (max-width: 1039px) {
  .hide-grid-item-on-mobile {
    display: none;
  }
}

@media screen and (max-width: 400px) {
  .prom-mobile-menu .prom-links p {
    padding-block: 0.75rem;
  }
  .prom-mobile-menu .prom-links > .wp-block-group > p:first-of-type {
    display: none;
  }
}

.fcal_calendar_slot_wrap .calendar-container .calendar .day-name {
  font-size: clamp(0.5rem, 0.5rem + (1vw - 0.2rem) * 0.281, 1.165rem) !important;
}

.feature-header {
  position: relative;
  display: inline-block; /* allow wrapping and avoid forcing content width */
  width: auto;
  max-width: 100%; /* never exceed the container or viewport */
  box-sizing: border-box;
  margin-inline: auto; /* center within the wrapper */
  white-space: normal; /* allow wrapping on small screens */
  word-break: break-word;
  overflow-wrap: anywhere;
  font-size: clamp(1.2rem, 1.2rem + (1vw - 0.2rem) * 2.128, 2.75rem);
  /* Extend background to left edge of screen only */
  /* animate the whole header in from the left */
}
.feature-header::before {
  content: "";
  position: absolute;
  left: calc(-50vw + 50%);
  top: 0;
  bottom: 0;
  width: 50vw;
  max-width: 50vw;
  min-width: 0;
  background: inherit;
  border-radius: 0;
  z-index: -1; /* keep pseudo-element behind the header content */
  opacity: 1 !important;
  pointer-events: none;
  contain: paint; /* help avoid layout issues */
}

/* Prevent horizontal scroll from decorative pseudo-elements on small screens */
@media (max-width: 520px) {
  html, body {
    overflow-x: hidden;
  }
}
/* Restore desktop behaviour (keep animation positioning intact) */
@media (min-width: 768px) {
  .feature-header {
    display: block; /* restore block layout on larger screens */
    width: max-content; /* preserve shrink-to-fit on desktop */
    white-space: nowrap; /* keep header on one line if intended */
    max-width: none;
    box-sizing: content-box;
    will-change: transform; /* hint to the browser about the upcoming transform */
    transform: translateZ(0);
  }
  .feature-header::before {
    left: calc(-50vw + 50%);
    width: 50vw;
    max-width: none;
  }
}
/* Base container */
.section--dots {
  position: relative;
  overflow: hidden;
  z-index: 0;
}

/* Make sure the real content sits above the decorative pseudo-elements */
.section--dots > * {
  position: relative;
  z-index: 1;
}

/* Reset pseudo-elements */
.section--dots::before,
.section--dots::after {
  content: none;
  z-index: -1;
}

/* Shared styling for ALL dotted background elements */
.section--dots::before,
.section--dots::after {
  position: absolute;
  /* Dynamically scale to ~1/3 of viewport width */
  width: 36.3636363636vw;
  height: 36.3636363636vw;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

/* IMAGE 1 — dots only */
.dots-before-1::before,
.dots-after-1::after {
  background-image: url("/wp-content/themes/chimeraprom/img/dots-1.svg");
}

/* IMAGE 2 — dots + turquoise circle */
.dots-before-2::before,
.dots-after-2::after {
  background-image: url("/wp-content/themes/chimeraprom/img/dots-2.svg");
}

/* TOP-LEFT */
.dots-tl::before {
  content: "";
  top: var(--dots-top-offset, -10vw);
  left: var(--dots-side-offset, -10vw);
}

/* TOP-RIGHT */
.dots-tr::before {
  content: "";
  top: var(--dots-top-offset, -10vw);
  right: var(--dots-side-offset, -10vw);
}

/* BOTTOM-LEFT */
.dots-bl::after {
  content: "";
  bottom: var(--dots-bottom-offset, -10vw);
  left: var(--dots-side-offset, -10vw);
}

/* BOTTOM-RIGHT */
.dots-br::after {
  content: "";
  bottom: var(--dots-bottom-offset, -10vw);
  right: var(--dots-side-offset, -10vw);
}

/* Rotate image 2 when used top-left or top-right */
.dots-before-2.dots-tl::before, .dots-before-2.dots-tr::before {
  transform: rotate(175deg);
  transform-origin: center center;
}

/* WHITE DOTS */
/* Reset pseudo-elements */
.dots-white-tl::before,
.dots-white-br::after {
  content: none;
  z-index: -1;
}

/* DOTS WHITE — TOP LEFT*/
.dots-white-tl::before {
  content: "";
  position: absolute;
  top: -25vw;
  left: -25vw;
  width: 60vw;
  height: 60vw;
  background-image: url("/wp-content/themes/chimeraprom/img/dots-white.svg");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 0;
}

/* DOTS WHITE — BOTTOM RIGHT*/
.dots-white-br::after {
  content: "";
  position: absolute;
  bottom: -25vw;
  right: -25vw;
  width: 60vw;
  height: 60vw;
  background-image: url("/wp-content/themes/chimeraprom/img/dots-white.svg");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 0;
}

/* BACKGROUND LOGO
   Use on a section like: <section class="section--dots background-logo"> */
.background-logo::before,
.background-logo-dark::before {
  content: "";
  position: absolute;
  /* center vertically */
  top: 50%;
  transform: translateY(-50%);
  /* place slightly off-screen to the left by 10% of its own width
     (width is 50vw so 10% of that is 5vw) */
  left: -5vw;
  /* size and visual */
  width: 50vw;
  height: 50vw; /* keep a predictable box for the SVG; the SVG itself scales */
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  pointer-events: none;
  opacity: 0.75;
  z-index: -1; /* keep behind content */
}

.background-logo::before {
  background-image: url("/wp-content/themes/chimeraprom/img/promindset-logo-white.png");
}

.background-logo-dark::before {
  background-image: url("/wp-content/themes/chimeraprom/img/promindset-logo-dark.png");
}
