/*
 Theme Name:   SAC CHILD
 Description:  SAC CHILD
 Author:       SAC+
 Template:     hello-elementor
 Version:      1.5
 Text Domain:  sac-child
*/

/* =========================================================
   GENERAL
   ========================================================= */

html { scroll-behavior: smooth; }

h1, h2, h3 { word-break: break-word; }

b, bold, strong { font-weight: 600 !important; }

/* Base typography (prevent Elementor mobile overrides) */
main { font-size: 16px; }

p,
.elementor-widget-text-editor p,
p.elementor-heading-title,
p.elementor-heading-title.elementor-size-default,
span.elementor-icon-list-text {
  font-size: 1rem !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
}

p,
.elementor-widget-text-editor p {
  margin: 0 0 1em;
}

/* Optional global text styling used in your project */
p,
li.elementor-icon-list-item {
  font-family: Montserrat;
  color: #020202;
}

/* =========================================================
   UTILITIES
   ========================================================= */

.font-weight-400 { font-weight: 400 !important; }
.font-weight-500 { font-weight: 500; }
.font-weight-700,
.font-weight-700 p { font-weight: 700 !important; }

.font-style-italic { font-style: italic; }

.font-size-24 { font-size: 24px !important; }
.font-size-20 { font-size: 20px !important; }
.font-size-18 { font-size: 18px !important; }
.font-size-16 { font-size: 16px !important; }

.line-height-30 { line-height: 30px; }

.text-align-center { text-align: center; }
.text-decoration-underline { text-decoration: underline !important; }
.text-transform-uppercase,
.text-transform-uppercase p { text-transform: uppercase; }

.color-fff { color: #fff !important; }
.color-fff a:hover { color: #3f7ccd !important; }

.color-3f7ccd { color: #3f7ccd !important; }
.sac-color-f9f9fb { color: #f9f9fb; }

.sac-border-radius-6px { border-radius: 6px !important; }

.padding-top-0 { padding-top: 0; }
.padding-top-20 { padding-top: 20px; }
.padding-bottom-20 { padding-bottom: 20px; }

.margin-top-0 { margin-top: 0 !important; }
.margin-top-10 { margin-top: 10px; }
.margin-top-20 { margin-top: 20px !important; }

.margin-bottom-0 { margin-bottom: 0 !important; }
.margin-bottom-0 p { margin-bottom: 0 !important; }

.margin-bottom-10 { margin-bottom: 10px !important; }
.margin-bottom-20 { margin-bottom: 20px !important; }

.margin-bottom-5 p { margin-bottom: 5px !important; }

.margin-right-20 { margin-right: 20px; }

.sac-disclaimer { font-size: 12px !important; }

/* =========================================================
   HIGHLIGHTS / BADGES
   ========================================================= */

.background-orange h4.elementor-image-box-title,
.background-orange h3.elementor-image-box-title {
  background: #f7e975;
  display: inline-block;
  padding: 0 8px;
}

.sac-background-yellow-price {
  background: #f7e975;
  color: #020202;
  font-weight: 500;
  padding: 6px 16px;
  display: inline-block;
  font-size: 24px;
}

.sac-s3 {
  background: #CAE1E8;
  color: #020202;
  font-weight: 500;
  padding: 6px 16px;
  border-radius: 999px;
  display: inline-block;
}

.sac-sbahn-s3 {
  background: #00894d;
  color: #fff;
  font-weight: 500;
  padding: 0 8px;
  border-radius: 999px;
  display: inline-block;
}

/* Inline highlight for H1 */
.sac-highlight h1 {
  display: inline !important;
  padding: 0 2px !important;
  background: linear-gradient(#ffeeab 0 0) 0 90% / 100% .25em no-repeat !important;
  -webkit-box-decoration-break: clone !important;
  box-decoration-break: clone !important;
}

/* Orange background highlight for text-editor p tags */
.sac-background-orange-highlight-p p {
  font-weight: 700 !important;
  font-size: 18px !important;
  text-transform: uppercase !important;
  background: #f7e975 !important;
  display: inline !important;
  padding: 0 1px !important;
}

/* =========================================================
   ELEMENTOR SPECIFICS
   ========================================================= */

/* Image box title if used as <p> */
p.elementor-image-box-title {
  font-weight: 700;
  font-size: 20px;
}

/* Icon box description */
p.elementor-icon-box-description {
  font-size: 16px !important;
}

/* Heading spacing tweak */
h3.elementor-heading-title { margin-bottom: 10px; }

/* Timeline tweaks */
.sac-timeline .elementor-shape-bottom { display: none !important; }
.sac-timeline .elementor-icon svg { margin-bottom: -5px !important; }

/* Konferenzraum */
.konferenz-weitere-vorteile li.elementor-icon-list-item.elementor-inline-item {
  padding-bottom: 10px;
}

/* =========================================================
   WPForms
   ========================================================= */

div#wpforms-6116,
div#wpforms-6137 {
  margin-top: 0 !important;
}

button#wpforms-submit-6116,
button#wpforms-submit-6137 {
  background-color: var(--e-global-color-dc840c7);
  font-weight: 700;
  text-decoration: none;
  fill: var(--e-global-color-text);
  color: var(--e-global-color-text);
  border-radius: 10px;
  padding: 20px 30px !important;
  height: auto !important;
}

button#wpforms-submit-6116:hover,
button#wpforms-submit-6137:hover {
  background-color: var(--e-global-color-text);
  color: var(--e-global-color-79a479c);
}

.wpforms-container a {
  color: #314761 !important;
  text-decoration: underline !important;
}

.wpforms-container a:hover { color: #FFBD59 !important; }

.wpforms-container .wpforms-field {
  padding: 0 0 24px 0 !important;
}

/* =========================================================
   HERO LAYOUT
   ========================================================= */

@media (min-width: 768px) {
  .sac-hero-split {
    display: flex;
    width: 100%;
    gap: 0;
  }

  .sac-hero-left {
    flex: 0 0 50%;
    max-width: 630px;
    margin-left: calc((100% - 1260px) / 2);
  }

  .sac-hero-right {
    flex: 0 0 50%;
    max-width: 50vw;
    padding: 0;
  }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 767px) {
  .sac-headline1 {
    font-size: clamp(1.8rem, 1.7077rem + 0.4103vw, 2rem) !important;
    line-height: 1.4 !important;
  }

  .sac-headline2 {
    font-size: clamp(1.6rem, 1.5308rem + 0.3077vw, 1.75rem) !important;
    line-height: 1.2 !important;
  }

  .sac-s3 { margin-bottom: 20px !important; }
}

.anmeldefaehige-firmenadresse {
  font-size: clamp(1.6rem, 1.5308rem + 0.3077vw, 1.75rem) !important;
  line-height: 1.2 !important;
  font-weight: 500 !important;
}

/* =========================================================
   SLIDER FIX (Elementor Carousel)
   ========================================================= */

.elementor-widget-n-carousel .swiper:not(.swiper-initialized) .swiper-slide {
  width: calc(33% / var(--e-n-carousel-swiper-slides-to-display, 1)) !important;
}

/*
  NOTE
  The following rule contained "selector ..." which is an Elementor Custom CSS placeholder
  It does not belong in a real stylesheet, so it has been removed
  If you need it, add it in Elementor's widget Custom CSS field, not here
*/

/* =========================================================
   PRODUCT / VERSION LABELS
   ========================================================= */

.sac-ver { color: #B9B9C3 !important; }
.sac-product { color: #FFBD59 !important; }

.sac-ver,
.sac-product {
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(2rem, 3vw + 1rem, 3rem) !important;
}

.sac-ver-small { color: #B9B9C3 !important; }
.sac-product-small { color: #FFBD59 !important; }

.sac-ver-small,
.sac-product-small {
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(1.125rem, 1.2vw + 0.9rem, 1.5rem) !important;
}

/* =========================================================
   CONTACT DETAILS
   ========================================================= */

.sac-kontakt-details a { text-decoration: underline; }
.sac-kontakt-details a:hover { color: #FFBD59; }

.sac-kontakt-details2 { text-decoration: underline !important; }
.sac-kontakt-details2:hover { color: #FFBD59 !important; }


/* =========================================================
   STICKY BUTTON
   ========================================================= */

.sac-sticky-cta circle {
  fill-opacity: 1!important;
  stroke: #ffffff;
  stroke-width: 20px;
}

.sac-sticky-cta:hover circle {
  fill: #FFBD59;
}