/*
Theme Name: Hello Elementor Child - SKOLL
Template: hello-elementor
Version: 1.0.0
Description: SKOLL Relaunch Child-Theme, Designsystem Phase 4
*/

:root{
  /* Markenfarben, verbindlich */
  --skoll-rubin:#D61E5C;
  --skoll-orange:#E3731A;
  --skoll-blau:#363A8B;
  --skoll-gruen-dunkel:#1E763C;
  --skoll-gruen-hell:#409F39;
  --skoll-taupe:#635C4D;

  /* Abgeleitete Tonwerte */
  --rubin-dunkel:#A81647;
  --orange-text:#B85A0D;
  --blau-dunkel:#2A2D6E;
  --gruen-dunkel-tief:#175C2F;

  /* Neutrale Skala, aus Taupe entwickelt */
  --n-900:#2E2A24;
  --n-700:#4A443A;
  --n-600:#635C4D;
  --n-400:#9A9184;
  --n-300:#C7C0B4;
  --n-200:#E4DFD6;
  --n-100:#F1EEE8;
  --n-050:#F8F6F2;
  --weiss:#FFFFFF;

  /* Semantisch */
  --text:var(--n-900);
  --text-body:var(--n-600);
  --text-leise:var(--n-400);
  --primaer:var(--skoll-rubin);
  --primaer-hover:var(--rubin-dunkel);
  --flaeche:var(--n-050);
  --flaeche-2:var(--n-100);
  --linie:var(--n-200);
  --fokus:var(--skoll-rubin);
  --fehler:#B3261E;

  /* Typografie */
  --font-head:"Noto Serif",Georgia,"Times New Roman",serif;
  --font-body:"Archivo","Helvetica Neue",Arial,sans-serif;

  --t-display:clamp(2.5rem,7vw,4.5rem);
  --t-h1:clamp(2rem,5.5vw,3.5rem);
  --t-h2:clamp(1.625rem,4vw,2.5rem);
  --t-h3:clamp(1.375rem,2.6vw,1.75rem);
  --t-h4:1.25rem;
  --t-intro:1.25rem;
  --t-body:1.125rem;
  --t-small:1rem;
  --t-caption:0.875rem;
  --t-label:0.75rem;

  --lh-tight:1.15;
  --lh-head:1.25;
  --lh-body:1.65;

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;
  --sektion:clamp(48px,8vw,96px);

  --radius:4px;
  --radius-gross:8px;
  --breite-max:1200px;
  --breite-text:68ch;
}

@font-face{
  font-family:'Archivo';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('fonts/archivo-latin.woff2') format('woff2');
}
@font-face{
  font-family:'Noto Serif';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('fonts/noto-serif-600-latin.woff2') format('woff2');
}

body{
  font-family:var(--font-body);
  font-size:var(--t-body);
  line-height:var(--lh-body);
  color:var(--text-body);
  background:var(--weiss);
}
h1,h2,h3,h4{
  font-family:var(--font-head);
  font-weight:600;
  color:var(--text);
  line-height:var(--lh-head);
}
h1{font-size:var(--t-h1);line-height:var(--lh-tight);letter-spacing:-.015em}
h2{font-size:var(--t-h2);letter-spacing:-.01em}
h3{font-size:var(--t-h3)}
h4{font-size:var(--t-h4);font-family:var(--font-body);font-weight:700}
p{max-width:var(--breite-text);margin-left:auto;margin-right:auto;}

:where(a,button,input,select,summary):focus-visible{
  outline:3px solid var(--fokus) !important;
  outline-offset:2px;
  border-radius:2px;
}

.skip-link{position:absolute;left:-9999px;top:0;z-index:100000;background:#D61E5C;color:#fff;padding:12px 20px;font-weight:700;text-decoration:none;border-radius:0 0 4px 0;}
.skip-link:focus{left:0;}


/* Eigene Markierungsfarbe, damit Buttons/Nav beim Klicken nicht durch die System-Akzentfarbe unlesbar werden */
::selection{background:#D61E5C;color:#fff;}
::-moz-selection{background:#D61E5C;color:#fff;}

a, button, .elementor-button, .e-button-base, .elementor-nav-menu a, .elementor-nav-menu .elementor-item {
  -webkit-user-select:none;
  user-select:none;
}


/* ================= SKOLL Buttons, robust gegen Elementor-Defaults ================= */
.skoll-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:'Archivo',sans-serif;font-weight:600;font-size:16px;
  text-decoration:none !important;border-radius:4px;min-height:48px;
  padding:14px 24px;cursor:pointer;text-transform:none !important;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease,transform .1s ease;
  border-width:2px !important;border-style:solid !important;border-color:transparent;box-sizing:border-box;
}
.skoll-btn:active{transform:scale(0.98);}
.skoll-btn-full{width:100%;}

.skoll-btn-primary,.skoll-btn-primary:visited{background-color:#D61E5C !important;color:#fff !important;border-color:#D61E5C !important;}
.skoll-btn-primary:hover,.skoll-btn-primary:focus-visible{background-color:#A81647 !important;border-color:#A81647 !important;color:#fff !important;}

.skoll-btn-outline,.skoll-btn-outline:visited{background-color:transparent !important;color:#A81647 !important;border-color:#D61E5C !important;}
.skoll-btn-outline:hover,.skoll-btn-outline:focus-visible{background-color:#D61E5C !important;color:#fff !important;border-color:#D61E5C !important;}

.skoll-btn-text,.skoll-btn-text:visited{background:transparent !important;color:#A81647 !important;text-decoration:underline !important;padding:0 !important;min-height:auto !important;border:none !important;font-weight:600 !important;text-transform:none !important;display:inline-block !important;text-align:left !important;width:auto !important;}
.skoll-btn-text:hover,.skoll-btn-text:focus-visible{color:#D61E5C !important;}

.skoll-btn-text-spezial,.skoll-btn-text-spezial:visited{background:transparent !important;color:#B85A0D !important;text-decoration:underline !important;padding:0 !important;min-height:auto !important;border:none !important;font-weight:600 !important;text-transform:none !important;display:inline-block !important;text-align:left !important;width:auto !important;}
.skoll-btn-text-spezial:hover,.skoll-btn-text-spezial:focus-visible{color:#E3731A !important;}

.skoll-btn-text-digital,.skoll-btn-text-digital:visited{background:transparent !important;color:#363A8B !important;text-decoration:underline !important;padding:0 !important;min-height:auto !important;border:none !important;font-weight:600 !important;text-transform:none !important;display:inline-block !important;text-align:left !important;width:auto !important;}
.skoll-btn-text-digital:hover,.skoll-btn-text-digital:focus-visible{color:#2A2D6E !important;}

/* Login-Button im Header, gleiche robuste Logik */
#login-btn, #login-btn:visited{background-color:#D61E5C !important;color:#fff !important;}
#login-btn:hover, #login-btn:focus-visible{background-color:#A81647 !important;color:#fff !important;}

/* ================= Header-Politur ================= */
header.elementor-location-header{
  border-bottom:1px solid #E4DFD6;
}
.elementor-nav-menu .elementor-item{
  position:relative;
  letter-spacing:.01em;
}
.elementor-nav-menu .elementor-item::after{
  content:'';
  position:absolute;
  left:0;right:0;bottom:2px;
  height:2px;
  background:#D61E5C;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .18s ease;
}
.elementor-nav-menu .elementor-item:hover::after,
.elementor-nav-menu .elementor-item:focus-visible::after{
  transform:scaleX(1);
}

/* ================= Nav-Hover, hart gegen das Valentina-Template-Erbe abgesichert ================= */
.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus,
.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted{
  color:#A81647 !important;
}

/* ================= Testimonial-Karussell: Namenszeile immer auf gleicher Ebene ================= */
.elementor-widget-testimonial-carousel .swiper-wrapper{
  align-items:stretch;
}
.elementor-widget-testimonial-carousel .swiper-slide{
  height:auto;
  display:flex;
}
.elementor-testimonial{
  display:flex;
  flex-direction:column;
  width:100%;
}
.elementor-testimonial__content{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  flex:1;
}
.elementor-testimonial__cite{
  margin-top:16px;
}

/* ================= Brandbilder: Rahmen + sanfter Zoom-Effekt ================= */
.skoll-img-frame{
  position:relative;
  overflow:hidden;
  border-radius:8px;
  border:1px solid #E4DFD6;
}
.skoll-img-frame .e-con-inner,
.skoll-img-frame{
  isolation:isolate;
}
.skoll-img-frame img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s cubic-bezier(.16,.84,.44,1), filter .5s ease;
  will-change:transform;
}
.skoll-img-frame:hover img,
.skoll-img-frame:focus-within img{
  transform:scale(1.06);
}
@media (prefers-reduced-motion:reduce){
  .skoll-img-frame img{transition:none;}
  .skoll-img-frame:hover img{transform:none;}
}

/* ================= Programmlinien-Buttons SPEZIAL/digital, hart gegen den gruenen Hover-Default ================= */
.skoll-btn-spezial,.skoll-btn-spezial:visited{background-color:#B85A0D !important;color:#fff !important;border-color:#B85A0D !important;}
.skoll-btn-spezial:hover,.skoll-btn-spezial:focus-visible{background-color:#8F4508 !important;border-color:#8F4508 !important;color:#fff !important;}

.skoll-btn-digital,.skoll-btn-digital:visited{background-color:#363A8B !important;color:#fff !important;border-color:#363A8B !important;}
.skoll-btn-digital:hover,.skoll-btn-digital:focus-visible{background-color:#2A2D6E !important;border-color:#2A2D6E !important;color:#fff !important;}

/* ================= Einzelbeitrag: redaktionelle Typografie ================= */
.elementor-widget-theme-post-content .elementor-widget-container{font-family:'Archivo',sans-serif;line-height:1.75;}
.elementor-widget-theme-post-content .elementor-widget-container > p{margin-bottom:24px;}
.elementor-widget-theme-post-content .elementor-widget-container > p:first-of-type{font-size:1.25rem;color:#2E2A24;font-weight:500;}
.elementor-widget-theme-post-content .elementor-widget-container a{color:#A81647;text-decoration:underline;}
.elementor-widget-theme-post-content .elementor-widget-container a:hover{color:#D61E5C;}
.elementor-widget-theme-post-content .elementor-widget-container strong{color:#2E2A24;}

/* ================= Einzelbeitrag: Zwischenueberschriften mit Luft ================= */
.elementor-widget-theme-post-content .elementor-widget-container h2{font-family:'Noto Serif',serif;font-weight:600;font-size:26px;color:#2E2A24;margin-top:56px;margin-bottom:16px;line-height:1.3;}
.elementor-widget-theme-post-content .elementor-widget-container h3{font-family:'Noto Serif',serif;font-weight:600;font-size:21px;color:#2E2A24;margin-top:40px;margin-bottom:12px;line-height:1.3;}
.elementor-widget-theme-post-content .elementor-widget-container > *:first-child{margin-top:0;}

/* ================= Einzelbeitrag: H4 (Interview-Fragen) mit Luft ================= */
.elementor-widget-theme-post-content .elementor-widget-container h4{font-family:'Noto Serif',serif;font-weight:600;font-size:19px;color:#2E2A24;margin-top:36px;margin-bottom:10px;line-height:1.35;}
/* ================= Site-weite Linkfarbe in Text-Editor-Widgets ================= */
.elementor-widget-text-editor a:not(.elementor-button),
.elementor-widget-icon-list a:not(.elementor-button){color:#A81647;text-decoration:underline;}
.elementor-widget-text-editor a:not(.elementor-button):hover,
.elementor-widget-icon-list a:not(.elementor-button):hover{color:#D61E5C;}

/* ================= Login-Widget: besuchte Links nicht verblassen lassen ================= */
.elementor-login__logged-in-message a,
.elementor-login__logged-in-message a:visited{color:#A81647;}
.elementor-login__logged-in-message a:hover{color:#D61E5C;}

/* ================= Nested-Tabs: Inhalt in Markenschrift/-farbe statt Standard-Schwarz ================= */
.elementor-widget-n-tabs .elementor-widget-text-editor,
.elementor-widget-n-tabs .elementor-widget-text-editor p,
.elementor-widget-n-tabs .elementor-widget-text-editor li{font-family:'Archivo',sans-serif;color:#635C4D;line-height:1.65;}
.elementor-widget-n-tabs .elementor-widget-text-editor strong{color:#2E2A24;}
.elementor-widget-n-tabs .e-n-tab-title{padding:10px 20px;transition:background-color .2s,color .2s;}

/* ================= Nested-Tabs: Elementor-Bug-Fix aktive Tab-Textfarbe (Kern-CSS hat keine Regel fuer aria-selected=true) ================= */
.elementor-widget-n-tabs .e-n-tab-title[aria-selected='true'],
.elementor-widget-n-tabs .e-n-tab-title[aria-selected='true'] .e-n-tab-title-text{color:#FFFFFF;}

/* ================= Header-Logo: SVG-eigene Groesse ignorieren, an Container-Breite anpassen ================= */
.elementor-element-header-logo img,
.elementor-element-header-logo a{width:100%;height:auto;display:block;}

.elementor-element-header-logo img{width:100% !important;max-width:none !important;height:auto !important;}

/* Mobiles Menü: Dropdown muss ueber dem LOGIN-Button liegen, nicht darunter */
.elementor-element-7e905774{position:relative;z-index:9996 !important;}

/* Hero-Eyebrow/Intro auf Rechtsseiten linksbündig statt zentriert (globale p-Regel ausgehebelt) */
[data-id='imp-eyebrow'] p,[data-id='imp-hero-intro'] p,[data-id='ds-eyebrow'] p,[data-id='ds-hero-intro'] p,[data-id='barrierefreiheit-hero-eyebrow'] p,[data-id='barrierefreiheit-hero-intro'] p{margin-left:0 !important;margin-right:0 !important;max-width:none !important;}
body.page-id-1375 .elementor-widget-text-editor p{margin-left:0 !important;margin-right:0 !important;max-width:none !important;}
body.page-id-1054 .elementor-widget-text-editor p{margin-left:0 !important;margin-right:0 !important;max-width:none !important;}

.skoll-archiv-hinweis{color:#635C4D;font-size:0.92em;border-left:3px solid #E4DFD6;padding-left:14px;}
