/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jan 15 2026 | 19:50:57 */
/*custom animation classes :
	.pulse
	.shimmer
	.breathe
	.flash
	.slow-rotate
	.oscillate-rotate
*/

html {
  font-size: clamp(14px, 1rem, 18px);
  font-family:"Cairo"
}

html, body, section, div, li, a{  
transition-property: background-color;
transition-duration: 700ms;
}
div{
	transition-property: border-color, background-color, outline;
transition-duration: 700ms;
}


:where(.brxe-video) video {
    object-fit: contain !important;
}

/* prevents double-easing *//*
html, body {
  scroll-behavior: auto !important; 
}
*/
::selection {
  background: var(--main-color);
  color: #fff;
}

::-moz-selection {
    background: var(--main-color);
  color: #fff;
}

* {
  -webkit-tap-highlight-color: rgba(255, 105, 72, 0.2);
}

.glass{
    backdrop-filter: blur(5px) saturate(80%);
    -webkit-backdrop-filter: blur(5px) saturate(80%);
  
}
.glass::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--main-shade);
  opacity: 0.5;
  pointer-events: none;
   z-index: 0;
}

.glass > * {
  position: relative;
  z-index: 1;
}


.glass-rounded{
    backdrop-filter: blur(3px) saturate(80%);
    -webkit-backdrop-filter: blur(3px) saturate(80%);
  border-radius:100%;
}
.glass-rounded::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--main-shade);
  opacity: 0.25;
  pointer-events: none;
   z-index: -9999;
border-radius:100%;
}


.overlay::before{
    z-index: 1;
}

.text-highlight-1{
  color: var(--secondary-shade);
  font-weight:600;
  padding:8px;
  padding-bottom:0;
  border-radius:4px;
  background:var(--main-color);
  
}

.text-highlight-2{
  color: var(--main-color);
  font-weight:600;
  padding:8px;
  padding-bottom:0;

  
}

.text-highlight-3{
  color: var(--main-color);
  font-weight:900;
  padding:0.2rem;
  padding-bottom:0;

  
}

.overlay-radius-containers::before{
  border-radius:var(--border-radius-containers);
}


/*Custom Animations ----------------------------------------------------------*/

.pulse {


  animation: pulse-fade 1.5s infinite ease-in-out;
}

@keyframes pulse-fade {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}

.shimmer {
  position: relative;
  overflow: hidden;
}

.shimmer::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent 30%,
    rgba(255,255,255,0.2) 50%,
rgba(255,255,255,0.2) 55%,
    transparent 56%
  );
  transform: translateX(-100%);
  animation: shimmer-move 3s 0.5s infinite;
}

@keyframes shimmer-move {
  100% {
    transform: translateX(100%);
  }
}


.breathe {
  animation: breathe 2s ease-in-out infinite;
}

@keyframes breathe {
  0% { transform: scale(1); }
  50% { transform: scale(1.04); }
  100% { transform: scale(1); }
}

@keyframes flash-twice {
  0%   { opacity:100; }
  25%   { opacity:0; }
  50% { opacity:100; }
  75%   { opacity:0; }
  100% { opacity:100; }
}


.flash {
  animation: flash-twice 1.5s ease-in;
}

@keyframes slow-rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.slow-rotate {
  animation: slow-rotate 60s linear infinite;
  transform-origin: center center;
}

/*oscillating cw / ccw rotation */
@keyframes oscillate-rotate {
  from { transform: rotate(-20deg); }
  to   { transform: rotate(20deg); }
}

.oscillate-rotate {
  animation: oscillate-rotate 4s ease-in-out infinite alternate;
  transform-origin: center center;
}



.phase-1 { animation-delay: -2.3s; }
.phase-2 { animation-delay: -5.7s; }
.phase-3 { animation-delay: -9.1s; }


/*For SVG fixed in bg --------------------------------------------------------------------------*/

.fake-fixed-section {
  position: relative;
  overflow: hidden;        /* clips the SVG like a background */

}

.fake-fixed-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;             /* behind section content */
  /* JS will set transform here */
}

.fake-fixed-bg svg {
  width: 100%;
  height: 100%;
  display: block;
}



/*-- Tippy Tooltips style --------------------------------------------------------------------------*/


/* Base styles for all Tippy boxes */
.tippy-box[data-animation="custom-slide"] {
  opacity: 0;
 transform: translateY(12px) scale(0.95);
    transition: opacity 0.2s ease-out, transform 0.2s ease-out;
  background-color: var(--contrast);
	color:var(--secondary-shade);
  border-radius:var(--border-radius-containers);
  font-size:calc(var(--font-size-text)*0.9);
  padding:10px;
  font-family: "Cairo";
	z-index:2;
}

/* When visible */
.tippy-box[data-state="visible"][data-animation="custom-slide"] {
  opacity: 1;
  transform: translateY(0);  /* slide into place */
}

/* Optional arrow styling */
.tippy-box[data-animation="custom-slide"] .tippy-arrow {
  color: var(--contrast);
}