.elementor-kit-6{--e-global-color-primary:#E6E0D6;--e-global-color-secondary:#D0C2A6;--e-global-color-text:#E6E0D6;--e-global-color-accent:#B89A53;--e-global-color-7a2e25b:#0B0F14;--e-global-color-ecd6136:#3A3F45;--e-global-color-e858b4b:#0F0F14;--e-global-color-37ae62f:#131319;--e-global-typography-primary-font-family:"Bodoni Moda";--e-global-typography-primary-font-size:28px;--e-global-typography-primary-font-weight:300;--e-global-typography-primary-line-height:1.2em;--e-global-typography-primary-letter-spacing:1.5px;--e-global-typography-primary-word-spacing:3px;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-secondary-font-size:15px;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-line-height:1.7em;--e-global-typography-secondary-letter-spacing:0.3px;--e-global-typography-secondary-word-spacing:2px;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:14px;--e-global-typography-text-font-weight:300;--e-global-typography-text-line-height:1.7em;--e-global-typography-text-letter-spacing:0.2px;--e-global-typography-text-word-spacing:1px;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-size:14px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-line-height:1.7em;--e-global-typography-accent-letter-spacing:0.2px;background-color:var( --e-global-color-7a2e25b );color:var( --e-global-color-secondary );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );word-spacing:var( --e-global-typography-text-word-spacing );}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 a{color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-kit-6 h1{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );word-spacing:var( --e-global-typography-primary-word-spacing );}.elementor-kit-6 h2{color:var( --e-global-color-primary );font-family:"Bodoni Moda", Sans-serif;font-size:18px;font-weight:300;line-height:1em;letter-spacing:1.8px;word-spacing:3px;}.elementor-kit-6 h3{color:var( --e-global-color-text );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );word-spacing:var( --e-global-typography-secondary-word-spacing );}.elementor-kit-6 h4{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );word-spacing:var( --e-global-typography-secondary-word-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-6{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );word-spacing:var( --e-global-typography-text-word-spacing );}.elementor-kit-6 a{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-kit-6 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );word-spacing:var( --e-global-typography-primary-word-spacing );}.elementor-kit-6 h3{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );word-spacing:var( --e-global-typography-secondary-word-spacing );}.elementor-kit-6 h4{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );word-spacing:var( --e-global-typography-secondary-word-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );word-spacing:var( --e-global-typography-text-word-spacing );}.elementor-kit-6 a{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-kit-6 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );word-spacing:var( --e-global-typography-primary-word-spacing );}.elementor-kit-6 h2{line-height:1.5em;}.elementor-kit-6 h3{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );word-spacing:var( --e-global-typography-secondary-word-spacing );}.elementor-kit-6 h4{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );word-spacing:var( --e-global-typography-secondary-word-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS */@font-face {
    font-family: 'MundialHair';
    src: url('https://csp-renewal.com/wp-content/uploads/2026/05/MundialHair.woff2') format('woff2'),
         url('https://csp-renewal.com/wp-content/uploads/2026/05/MundialHair.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

.mundial {
    font-family: 'MundialHair', sans-serif !important;
    font-weight: 200;
}
/* ================================
   PROCEDURE MODAL SYSTEM
   ================================ */

.procedure-modal{
  position:fixed;
  inset:0;
  z-index:9999;

  display:block;

  opacity:0;
  visibility:hidden;
  pointer-events:none;

  transition:
    opacity 0.45s ease,
    visibility 0.45s ease;
}

.procedure-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.procedure-modal-backdrop{
  position:absolute;
  inset:0;
  z-index:1;

  background:rgba(11,15,20,0.78);

  backdrop-filter:blur(12px);

  opacity:0;

  transition:
    opacity 0.5s ease;
}

.procedure-modal.is-open .procedure-modal-backdrop{
  opacity:1;
}

.procedure-modal-panel{
  position:absolute;
  z-index:2;

  left:50%;
  top:80px;
  height:calc(100vh - 140px);

  width:min(92vw, 42rem);

  transform:translateX(-50%) scale(1);

  overflow-y:auto;
  overflow-x:hidden;

  padding:clamp(2rem, 4vw, 3.5rem);

  color:#E6E0D6;

  border:1px solid rgba(184,154,83,0.28);

  box-shadow:
    0 2rem 6rem rgba(0,0,0,0.72),
    0 0 0.8rem rgba(184,154,83,0.08);

  opacity:0;

  transition:
    opacity 0.55s ease,
    transform 0.55s cubic-bezier(.22,.61,.36,1),
    box-shadow 0.55s ease;

  isolation:isolate;

background-image:
  radial-gradient(
    circle at center,
    rgba(255,225,140,0.42) 0%,
    rgba(199,163,90,0.22) 10%,
    rgba(199,163,90,0.08) 18%,
    transparent 30%
  ),

  radial-gradient(
    circle at center,
    rgba(255,240,190,0.30) 0%,
    rgba(184,154,83,0.16) 12%,
    rgba(184,154,83,0.06) 20%,
    transparent 34%
  ),

  linear-gradient(
    rgba(10,12,16,0.52),
    rgba(10,12,16,0.58)
  ),

  url('https://csp-renewal.com/wp-content/uploads/2026/05/homepage-background.png');

background-size:
  46rem 46rem,
  52rem 52rem,
  cover,
  cover;

background-repeat:
  no-repeat,
  no-repeat,
  no-repeat,
  no-repeat;

background-position:
  8% 12%,
  86% 78%,
  center,
  center;

animation: modalBackgroundGlow 14s ease-in-out infinite alternate;

}

@keyframes modalBackgroundGlow {
  0% {
    background-position:
      -16rem -12rem,
      calc(100% + 8rem) calc(100% + 10rem),
      center,
      center;
  }

  50% {
    background-position:
      calc(100% - 18rem) 6rem,
      4rem calc(100% - 20rem),
      center,
      center;
  }

  100% {
    background-position:
      2rem calc(100% - 18rem),
      calc(100% - 16rem) -10rem,
      center,
      center;
  }
}

.procedure-modal-panel > *{
  position:relative;
  z-index:3;
}

.procedure-modal.is-open .procedure-modal-panel{
  opacity:1;

  transform:
    translateX(-50%)
    scale(1);
}

/* Close button */

.procedure-modal-close{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;

  position:absolute;
  top:1rem;
  right:1.2rem;
  z-index:20;

  width:2.5rem;
  height:2.5rem;

  display:flex;
  align-items:center;
  justify-content:center;

  color:#B89A53;
  font-size:1.8rem;
  line-height:1;

  cursor:pointer;
  opacity:0.7;

  transition:
    opacity 0.3s ease,
    transform 0.3s ease,
    text-shadow 0.3s ease;
}

.procedure-modal-panel::before,
.procedure-modal-panel::after{
  pointer-events:none;
}

.procedure-modal-close:hover{
  background:transparent !important;
  opacity:1;
  transform:scale(1.08);

  text-shadow:
    0 0 0.4rem rgba(184,154,83,0.5),
    0 0 1rem rgba(184,154,83,0.35);
}

/* Typography */

.procedure-kicker{
  margin:0 0 0.75rem;

  color:#B89A53;

  letter-spacing:0.18em;
  text-transform:uppercase;
  font-size:0.75rem;
}

.procedure-modal-panel h2{
  margin:0 0 1rem;

  color:#E6E0D6;

  font-family:"MundialHair", serif;
  font-size:clamp(1.5rem, 3.5vw, 2.8rem);
  font-weight:400;
  letter-spacing:0.04em;
  line-height:1;
}

.procedure-modal-panel p{
  color:#B8B2A8;

  font-size:0.9rem;
  line-height:1.5;
}

/* Key info row */

.procedure-key-info{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;

  margin:2rem 0;

  border-top:1px solid rgba(184,154,83,0.25);
  border-bottom:1px solid rgba(184,154,83,0.25);

  padding:1.25rem 0;

  color:#E6E0D6;
}

.procedure-key-info span{
  display:block;

  color:#B89A53;

  font-size:0.75rem;
  letter-spacing:0.12em;
  text-transform:uppercase;

  margin-bottom:0.35rem;
}

/* Price */

.procedure-price{
  margin:1.75rem 0 1.5rem;
  padding-top:1rem;

  border-top:1px solid rgba(184,154,83,0.18);

  color:#E6E0D6;

  font-size:1.15rem;
  letter-spacing:0.04em;
}

.procedure-price::before{
  content:"Price";
  display:block;

  color:#B89A53;

  font-size:0.75rem;
  letter-spacing:0.12em;
  text-transform:uppercase;

  margin-bottom:0.35rem;
}

/* Link */

.procedure-modal-link{
  display:inline-block;

  color:#B89A53;

  text-decoration:none;
  border-bottom:1px solid rgba(184,154,83,0.6);

  padding-bottom:0.15rem;

  transition:
    color 0.3s ease,
    border-color 0.3s ease,
    text-shadow 0.3s ease;
}

.procedure-modal-link:hover{
  color:#E6E0D6;
  border-color:#E6E0D6;

  text-shadow:
    0 0 0.4rem rgba(184,154,83,0.45);
}

/* Mobile */

@media(max-width:768px){

.procedure-key-info{
  display:flex;
  flex-direction:column;
  gap:1.1rem;
}

  .procedure-modal-panel{
    animation:none;
  }

}

@keyframes modalBackgroundGlowMobile {
  0% {
    background-position:
      -6rem -4rem,
      calc(100% + 4rem) calc(100% + 5rem),
      center,
      center;
  }

  50% {
    background-position:
      calc(100% - 10rem) 4rem,
      3rem calc(100% - 12rem),
      center,
      center;
  }

  100% {
    background-position:
      2rem calc(100% - 10rem),
      calc(100% - 8rem) -4rem,
      center,
      center;
  }
}/* End custom CSS */