/* Ausschließlich Klassen dieses Plugins. Vor Aktivierung keine Veränderung am Enfold-Header. */
#top .gskl-logo,
#top .gskl-logo a,
.gskl-preview,
.gskl-preview a {
  display:flex;
  align-items:center;
  gap:9px;
  max-width:100%;
  color:inherit;
  text-decoration:none;
  overflow:visible;
}
.gskl-logo .gskl-copy{display:flex;flex-direction:column;min-width:0;line-height:1.12}
.gskl-logo .gskl-name{font-size:clamp(19px,2.2vw,30px);font-weight:400;white-space:nowrap}
.gskl-logo .gskl-subline{font-size:clamp(9px,1.1vw,13px);white-space:nowrap;opacity:.85}
.gskl-logo .gskl-icon{display:inline-block;flex:0 0 auto;width:43px;height:43px;background:var(--template-color,#628a31);
  mask:var(--gskl-icon-url) center/contain no-repeat;
  -webkit-mask:var(--gskl-icon-url) center/contain no-repeat}
.gskl-logo .gskl-icon--gold{background:linear-gradient(130deg,#97650a,#ffe5a0,#ae7b12)}
.gskl-logo .gskl-icon--silver{background:linear-gradient(130deg,#73777f,#fafafa,#888d98)}
.gskl-logo .gskl-icon--rosegold{background:linear-gradient(130deg,#aa6971,#f9d8c4,#b1777b)}
.gskl-logo .gskl-icon--copper{background:linear-gradient(130deg,#97552a,#f0ba85,#955123)}
#top .gskl-logo img.gskl-logo-img,.gskl-logo img.gskl-logo-img{display:block!important;width:auto!important;height:auto!important;max-width:260px!important;max-height:66px!important;object-fit:contain}
.gskl-preview{justify-content:center;padding:12px}
.gskl-preview a{flex-direction:column;justify-content:center}
.gskl-preview .gskl-copy{text-align:center;align-items:center}
.gskl-preview .gskl-name{font-size:clamp(24px,3vw,40px)}
.gskl-preview .gskl-subline{font-size:14px}
.gskl-preview .gskl-icon{width:72px;height:72px}
.gskl-preview img.gskl-logo-img{max-width:420px!important;max-height:220px!important}
#top .gskl-header{height:100%;align-items:center}
#top .gskl-header a{height:100%;align-items:center}
/* Bestehendes Child blendet bei manchen Designseiten den Logo-Container aus. Nur nach explizitem Opt-in korrigieren. */
body.gskl-header-active #header .av-logo-container{height:auto!important;min-height:62px}
@media(max-width:767px){
  #top .gskl-header{max-width:70vw}
  #top .gskl-header a{gap:5px}
  #top .gskl-header .gskl-icon{width:29px;height:29px}
  #top .gskl-header .gskl-name{font-size:17px}
  #top .gskl-header .gskl-subline{font-size:9px}
  .responsive #top .gskl-header img.gskl-logo-img{display:block!important;max-width:180px!important;max-height:42px!important}
}
/* Farbsteuerung unabhängig von Theme-Textfarben und Browser-Defaults. */
#top .gskl-logo .gskl-name,
.gskl-logo .gskl-name {
  color:var(--gskl-name-color, #205751)!important;
  -webkit-text-fill-color:var(--gskl-name-color, #205751)!important;
}
#top .gskl-logo .gskl-subline,
.gskl-logo .gskl-subline {
  color:var(--gskl-subline-color, #666666)!important;
  -webkit-text-fill-color:var(--gskl-subline-color, #666666)!important;
  opacity:1;
}
.gskl-logo .gskl-icon--design{background:var(--gskl-icon-color, #205751)!important}
.gskl-editor .gskl-setting-panel{padding:12px 16px;max-width:600px;border:1px solid #c3c4c7;background:white;margin:12px 0}
.gskl-editor .gskl-setting-panel input[type=color]{width:48px;height:33px;vertical-align:middle;margin-left:12px;padding:2px;cursor:pointer}
.gskl-editor .gskl-preview-box{max-width:600px;min-height:130px;display:flex;align-items:center;justify-content:center;border:1px solid #ccd0d4;background:#fff;padding:12px}
.gskl-editor .gskl-preview-box>div{width:100%}
.gskl-editor .gskl-preview-box .gskl-logo{margin:0}

/* 1.5: Nur bei bewusst aktivierten individuellen Größen. Standard bleibt wie 1.4. */
#top .gskl-logo.gskl-size-custom .gskl-icon,
.gskl-logo.gskl-size-custom .gskl-icon {width:var(--gskl-icon-size)!important;height:var(--gskl-icon-size)!important;}
#top .gskl-logo.gskl-size-custom .gskl-name,
.gskl-logo.gskl-size-custom .gskl-name {font-size:var(--gskl-name-size)!important;}
#top .gskl-logo.gskl-size-custom .gskl-subline,
.gskl-logo.gskl-size-custom .gskl-subline {font-size:var(--gskl-subline-size)!important;}
#top .gskl-logo.gskl-size-custom img.gskl-logo-img,
.gskl-logo.gskl-size-custom img.gskl-logo-img {
  max-width:min(100%, var(--gskl-image-width))!important;
  max-height:var(--gskl-image-height)!important;
  object-fit:contain!important;
}
@media(max-width:767px){
  #top .gskl-header.gskl-size-custom .gskl-icon {width:var(--gskl-mobile-icon-size)!important;height:var(--gskl-mobile-icon-size)!important;}
  #top .gskl-header.gskl-size-custom .gskl-name {font-size:var(--gskl-mobile-name-size)!important;}
  #top .gskl-header.gskl-size-custom .gskl-subline {font-size:var(--gskl-mobile-subline-size)!important;}
  .responsive #top .gskl-header.gskl-size-custom img.gskl-logo-img {max-width:var(--gskl-mobile-image-width)!important;max-height:var(--gskl-mobile-image-height)!important;}
}
.gskl-editor .gskl-size-row {display:grid;grid-template-columns:minmax(150px, 1fr) minmax(120px, 1.1fr) 64px;gap:10px;align-items:center}
.gskl-editor .gskl-size-row input[type=range] {width:100%}
.gskl-editor .gskl-size-row output {font-variant-numeric:tabular-nums;text-align:right}
@media(max-width:700px){.gskl-editor .gskl-size-row{grid-template-columns:1fr 60px}.gskl-editor .gskl-size-row label{grid-column:1/-1}}


/* 1.6: Sichere separate Logo-Zeile unterhalb des Enfold-Headers und vor dem Seiteninhalt. */
#top #main .gskl-brand-band {
  box-sizing:border-box;
  display:block;
  clear:both;
  position:relative;
  width:100%;
  max-width:100%;
  padding:14px 16px;
  margin:0;
  background:#fff;
  text-align:center;
  z-index:1;
}
#top #main .gskl-brand-band .gskl-preview {padding:0; margin:0 auto; max-width:100%; justify-content:center;}
#top #main .gskl-brand-band .gskl-preview a {height:auto; max-width:100%; flex-direction:column;}
#top #main .gskl-brand-band .gskl-copy {text-align:center; align-items:center;}
@media(max-width:767px) {
  #top #main .gskl-brand-band {padding:12px 10px;}
  #top #main .gskl-brand-band .gskl-preview:not(.gskl-size-custom) .gskl-name {font-size:clamp(20px,5.5vw,35px);white-space:normal;}
  #top #main .gskl-brand-band .gskl-preview:not(.gskl-size-custom) .gskl-icon {width:52px;height:52px;}
}


/* 1.7: Große Schriftgrößen (bis 120 px) ohne seitliches Überlaufen der Logo-Zeile.
   Betrifft nur explizit individuell eingestellte Logo-Größen. */
#top #main .gskl-brand-band .gskl-preview.gskl-size-custom .gskl-name,
.gskl-editor .gskl-preview-box .gskl-preview.gskl-size-custom .gskl-name {
  white-space:normal!important;
  overflow-wrap:anywhere;
  max-width:100%;
  line-height:1.08;
  text-align:center;
}
#top #main .gskl-brand-band .gskl-preview.gskl-size-custom .gskl-copy {max-width:100%;}
@media(max-width:767px){
  #top #main .gskl-brand-band .gskl-preview.gskl-size-custom .gskl-name {font-size:var(--gskl-mobile-name-size)!important;}
  #top #main .gskl-brand-band .gskl-preview.gskl-size-custom .gskl-subline {font-size:var(--gskl-mobile-subline-size)!important;white-space:normal;overflow-wrap:anywhere;}
  #top #main .gskl-brand-band .gskl-preview.gskl-size-custom .gskl-icon {width:var(--gskl-mobile-icon-size)!important;height:var(--gskl-mobile-icon-size)!important;}
  #top #main .gskl-brand-band .gskl-preview.gskl-size-custom img.gskl-logo-img {max-width:var(--gskl-mobile-image-width)!important;max-height:var(--gskl-mobile-image-height)!important;}
  .gskl-editor .gskl-preview-box .gskl-preview.gskl-size-custom .gskl-name {font-size:min(var(--gskl-name-size),36px)!important;}
}
