*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body {
    font-family: "Inter", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: #1a1a1a;
    background: #fff;
}
a { color: #111; text-decoration: none; }
a:hover { text-decoration: underline; }
.container{
  width:1170px;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 15px;
}
.utility-bar {
    background: #fff;
    padding: 7px 0 8px;
    font-size: .75rem;
    border-bottom: 1px solid #eee;
}
.utility-bar .left a,
.utility-bar .right a { color:#666; margin-right:14px;}
.utility-bar .left a i{ vertical-align:-1px; margin-right:4px; font-size:13px;}
.utility-bar .right { float: right; }
.utility-bar:after{content:"";display:table;clear:both;}
.site-header{
  text-align:center;
  padding: 18px 0 10px 0;
}
.site-header .logo img { max-height: 42px;}
.main-nav{
  margin-top:14px;
  border-top:1px solid #ececec;
  border-bottom: 1px solid #ECECEC;
}
.main-nav ul{
  list-style:none;
  margin:0; padding: 0;
  display:flex;
  justify-content:center;
  gap: 34px;
}
.main-nav li a{
    display:block;
    padding:14px 4px;
    font-size:13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color:#111;
}
.main-nav li a:hover{ color:#6c5ce7; text-decoration:none;}
.hero-wrap{ padding: 24px 0 40px;}
.hero-grid{
    display:grid;
    grid-template-columns: 280px 1fr 280px;
    gap: 20px;
}
.hero-side{
    background:#fafafa;
    padding: 14px;
    border-radius: 4px;
}
.hero-side .tabs{ display:flex; border-bottom:1px solid #e5e5e5; margin-bottom: 8px;}
.hero-side .tabs a{
   flex:1; text-align:center;
   padding: 8px 0;
   font-size:12px;
   text-transform: uppercase;
   color:#666;
}
.hero-side .tabs a.active{ color:#111; border-bottom: 2px solid #111;}
.hero-side ul{ list-style:none; padding:0; margin:0;}
.hero-side li{
   padding: 10px 0;
   border-bottom: 1px dashed #ececec;
   font-size:13px;
   line-height:1.35;
}
.hero-side li:last-child{ border-bottom:none;}
.hero-featured{
   position:relative;
   border-radius:6px;
   overflow:hidden;
}
.hero-featured img{ width:100%; display:block; object-fit:cover; height:340px;}
.hero-featured .caption{
    padding: 14px 4px 0;
}
.hero-featured h2{
    font-size: 24px;
    font-weight: 700;
    margin:0;
    color:#111;
    line-height:1.25;
}
.hero-featured .caption h2 a{ color:#111;}
.hero-rec{ }
.hero-rec h3{
   font-size:11px;
   letter-spacing:.08em;
   text-transform:uppercase;
   color:#666;
   margin: 0 0 10px;
}
.hero-rec .item{
   display:flex;
   gap:10px;
   margin-bottom: 12px;
}
.hero-rec .item img{ width:60px; height:60px; object-fit:cover; border-radius: 4px;}
.hero-rec .item p{ margin:0; font-size:12px; line-height:1.35;}
.btn{
  display:inline-block;
  background:#111;
  color:#fff !important;
  padding: 10px 18px;
  border-radius: 4px;
  font-size:13px;
  text-transform: uppercase;
  letter-spacing:.05em;
  border: none;
  cursor:pointer;
}
.btn:hover{ background:#000; text-decoration:none;}
.btn-outline{
  background:transparent;
  color:#111 !important;
  border:1px solid #111;
}
.band-events{
   background:#e7e3f7;
   padding: 50px 0 60px 0;
   margin-top: 38px;
}
.band-events h2{
   font-size: 1.75rem;
   margin:0 0 24px;
   font-weight:800;
}
.band-events .header-row{
   display:flex; justify-content: space-between; align-items:center;
   margin-bottom: 20px;
}
.events-row{
   display:grid;
   grid-template-columns: repeat(4, 1fr);
   gap:20px;
}
.event-card{
   background:#fff;
   border-radius:6px;
   overflow:hidden;
   display:flex; flex-direction:column;
}
.event-card .thumb{ position:relative;}
.event-card .thumb img{ width:100%; display:block;}
.event-card .tag{
   position:absolute; top:10px; right:10px;
   background:#6c5ce7;
   color:#fff;
   font-size:10px;
   text-transform:uppercase;
   padding:4px 8px;
   border-radius: 3px;
   letter-spacing:.05em;
}
.tag.dark{ background:#111;}
.event-card .body{ padding: 14px 14px 16px;}
.event-card h3{ font-size:15px; margin:0 0 8px; line-height:1.3;}
.event-card .meta{ font-size:12px; color:#6a6a6a;}
.event-card .meta span{ display:block; margin-bottom:3px;}
.event-card .meta i{ margin-right:5px; font-size:14px; vertical-align:-2px;}
.products-wrap{ padding: 58px 0 65px;}
.products-wrap h2{ font-size: 1.75rem; margin:0 0 6px; font-weight:800;}
.products-wrap .sub{ font-size:14px; color:#444; margin:0 0 30px;}
.products-grid{
   display:grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 22px;
}
.p-card{
   border:1px solid #e5e5e5;
   border-radius:6px;
   overflow:hidden;
   display:flex; flex-direction:column;
}
.p-card .thumb{ position:relative; }
.p-card .thumb img{ width:100%; display:block; height: 190px; object-fit:cover;}
.p-card .tag{
   position:absolute; top:10px; right:10px;
   background:#6c5ce7; color:#fff;
   font-size:10px; text-transform:uppercase;
   padding:4px 8px; border-radius:3px; letter-spacing:.05em;
}
.p-card .body{ padding:14px 16px 18px; flex:1; display:flex; flex-direction:column;}
.p-card h3{ font-size:15px; margin:0 0 6px; line-height:1.3; font-weight:700;}
.p-card .desc{ font-size: .8rem; color:#6a6a6a; margin:0 0 auto; line-height:1.45; padding-bottom:12px;}
.p-card .price-row{ display:flex; justify-content:space-between; align-items:center; margin-top:auto;}
.p-card .price{ font-size: 1.15rem; font-weight:800; color:#111;}
#about-bg{ background-image:url(../res/photo_laden-aussen_274.webp);}
.band-about{
   background-color:#1a1a1a;
   background-size:cover;
   background-position:center;
   position:relative;
   padding: 80px 0 85px;
   color:#fff;
}
.band-about:before{
   content:"";
   position:absolute; top:0; left:0; right:0; bottom:0;
   background:rgba(17,17,17,.72);
}
.band-about .container{ position:relative; z-index:1;}
.band-about h2{ font-size: 1.9rem; margin:0 0 16px; font-weight:800;}
.band-about p{ font-size: .95rem; line-height:1.65; color:#ccc; max-width:720px;}
.band-about p + p{ margin-top:14px;}
.team-wrap{ padding: 60px 0 55px;}
.team-wrap h2{ font-size: 1.75rem; margin:0 0 6px; font-weight:800;}
.team-wrap .sub{ font-size:14px; color:#444; margin:0 0 28px;}
.team-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.t-card{ text-align:center; border:1px solid #ececec; border-radius:6px; padding:30px 20px 28px;}
.t-card img{ width:90px; height:90px; border-radius:50%; object-fit:cover; margin-bottom:14px;}
.t-card h3{ font-size:16px; margin:0 0 2px; font-weight:700;}
.t-card .role{ font-size: .75rem; text-transform:uppercase; letter-spacing:.06em; color:#6c5ce7; margin:0 0 10px; display:block;}
.t-card p{ font-size: .83rem; color:#6a6a6a; margin:0; line-height:1.45;}
.band-vacancy{
   background:#c8e6d4;
   padding: 40px 0 42px;
}
.band-vacancy .inner{
   display:flex; align-items:center; justify-content:space-between; gap:30px;
}
.band-vacancy h3{ font-size: 1.125em; margin:0 0 4px;}
.band-vacancy p{ font-size: 13px; margin:0; color:#333;}
.journey{ padding: 58px 0 64px;}
.journey .header-row{ display:flex; justify-content: space-between; align-items:center; margin-bottom:22px;}
.journey .jrow{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 20px;}
.journey .jitem{
   border:1px solid #ececec;
   padding: 28px 20px 32px;
   border-radius: 4px;
   text-align:left;
}
.journey .jitem i{ font-size:2rem; color:#6c5ce7; display:block; margin-bottom:14px;}
.journey .jitem h3{ font-size:16px; margin:0 0 6px; font-weight:700;}
.journey .jitem p{ font-size: .8rem; color:#707070; margin:0; line-height:1.4;}
.band-cta{
   background:#ffe04c;
   padding: 28px 0 30px;
}
.band-cta .inner{
   display:flex; align-items:center; justify-content: space-between; gap:30px;
}
.band-cta h3{ font-size: 1.125em; margin:0 0 4px;}
.band-cta p{ font-size: 13px; margin: 0;}
.articles{ padding: 56px 0 62px;}
.articles .header-row{ display:flex; justify-content: space-between; align-items:center;}
.articles .grid{
   display:grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 22px;
   margin-top:25px;
}
.articles .card{ display:flex; gap:20px; border:1px solid #e5e5e5; border-radius:6px; overflow:hidden;}
.articles .card img{ width:260px; min-height:180px; object-fit:cover; display:block; flex-shrink:0; border-radius:0; margin:0;}
.articles .card .body{ padding:18px 20px 18px 0; display:flex; flex-direction:column; justify-content:center;}
.articles .card h3{ font-size:16px; margin:0 0 8px; line-height:1.3;}
.articles .card p{ font-size: .82rem; color:#6a6a6a; margin:0; line-height:1.5;}
.band-contact{
   background:#121212;
   color:#fff;
   padding: 68px 0 75px;
}
.band-contact h2{ font-size: 28px; margin:0 0 8px;}
.band-contact > .container > p{ color:#bbb; font-size: .85rem; margin: 0 0 28px;}
.contact-grid{
   display:grid;
   grid-template-columns: 1fr 1fr;
   gap: 40px;
}
.contact-grid .info{ color:#bbb; font-size:13px;}
.contact-grid .info h4{ color:#fff; font-size:14px; margin:0 0 14px;}
.contact-grid .info p{ margin:0 0 14px; line-height:1.6;}
.contact-grid .info a{ color:#ffe14d;}
.contact-grid .info a:hover{ color:#fff;}
.contact-grid .info i{ margin-right:6px; font-size:14px; vertical-align:-1px;}
.cform{ display:flex; flex-direction:column; gap:12px;}
.cform input,.cform textarea{
   width:100%; padding:11px 14px;
   background:#222; border:1px solid #444;
   color:#fff; font-size:14px; font-family:inherit;
   border-radius:4px; outline:none;
}
.cform input:focus,.cform textarea:focus{ border-color:#6c5ce7;}
.cform textarea{ resize:vertical; min-height:100px;}
.cform .btn{ align-self:flex-start; padding:12px 28px;}
.cform .err{ color:#e74c3c; font-size: .75rem; margin: -6px 0 0; display:none;}
.cform .field-wrap{ display:flex; flex-direction:column; gap:4px;}
.form-ok{
   display:none; position:fixed; top:0; left:0; right:0; bottom:0;
   background:rgba(0,0,0,.55); z-index:9999;
   align-items:center; justify-content:center;
}
.form-ok.show{ display:flex;}
.form-ok .popup{
   background:#fff; color:#111; padding:40px 48px;
   border-radius:6px; text-align:center; max-width:400px;
}
.form-ok .popup h3{ margin:0 0 8px; font-size:20px;}
.form-ok .popup p{ margin:0 0 18px; font-size:14px; color:#666;}
.site-footer{
   background:#111;
   color:#bbb;
   padding: 58px 0 18px;
   font-size: 13px;
}
.site-footer h5{ color:#fff; font-size: 14px; margin: 0 0 14px;}
.site-footer .cols{
   display:grid;
   grid-template-columns: 1.4fr repeat(3, 1fr) 1.4fr;
   gap: 28px;
}
.site-footer ul{ list-style:none; padding:0; margin:0;}
.site-footer li{ padding: 4px 0;}
.site-footer a{ color:#bbb;}
.site-footer a:hover{ color:#fff; text-decoration:underline;}
.site-footer .bottom{
   border-top: 1px solid #333;
   margin-top: 38px; padding-top: 16px;
   display:flex; justify-content:space-between; align-items:center;
   font-size: 12px;
}
.site-footer .brand p{ font-size: .75rem; color:#888; margin: 8px 0 0;}
.site-footer .footer-logo{ max-height:36px; margin-bottom:10px;}
.site-footer .newsletter h5{ margin-bottom:8px;}
.site-footer .newsletter p{ font-size: .75em; margin:0 0 10px;}
.site-footer .newsletter input[type=email]{
   width:100%; padding:9px 10px; border:1px solid #444; background:#222; color:#fff; font-size:13px; margin-bottom: 8px;
}
.ck-bar{
   position:fixed; bottom:0; left:0; right:0;
   background:#1a1a1a; color:#ccc;
   padding:18px 0; z-index:9998;
   font-size:13px; line-height:1.5;
   display:none;
}
.ck-bar.show{ display:block;}
.ck-bar .inner{
   display:flex; align-items:center; gap:18px; flex-wrap:wrap;
}
.ck-bar p{ margin:0; flex:1; min-width:280px;}
.ck-bar p a{ color:#ffe14d; text-decoration:underline;}
.ck-bar .btns{ display:flex; gap:8px; flex-shrink:0;}
.ck-bar .btn-ck{
   padding:8px 16px; border-radius:4px; border:none;
   font-size:12px; text-transform:uppercase; letter-spacing:.05em;
   cursor:pointer; font-family:inherit;
}
.ck-bar .btn-accept{ background:#ffe14d; color:#111;}
.ck-bar .btn-decline{ background:transparent; color:#bbb; border:1px solid #555;}
.ck-bar .btn-settings{ background:transparent; color:#bbb; border:1px solid #555;}
.ck-settings{
   display:none; background:#222; border-radius:4px;
   padding:16px 18px; margin-top:12px; width:100%;
}
.ck-settings.show{ display:block;}
.ck-settings label{ display:flex; align-items:center; gap:8px; font-size:12px; color:#bbb; margin-bottom:8px; cursor:pointer;}
.ck-settings input[type=checkbox]{ accent-color:#6c5ce7;}
.ck-settings .save-row{ margin-top:10px;}
.pg-title{
   padding: 48px 0 10px;
}
.pg-title h1{
   font-size: 1.75rem;
   font-weight: 800;
   margin: 0;
   line-height: 1.2;
}
.pg-body{
   padding: 20px 0 60px;
}
.pg-body h2{
   font-size: 1.15rem;
   font-weight: 700;
   margin: 32px 0 10px;
}
.pg-body h2:first-child{ margin-top:0;}
.pg-body p{
   font-size: .93rem;
   line-height: 1.7;
   color: #333;
   margin: 0 0 14px;
   max-width: 780px;
}
.pg-body ul{
   list-style: none;
   padding: 0; margin: 0 0 16px;
}
.pg-body li{
   font-size: .93rem;
   line-height: 1.7;
   color: #333;
   padding: 3px 0 3px 20px;
   position: relative;
}
.pg-body li:before{
   content:"\203A";
   position:absolute; left:0; top:2px;
   color:#6c5ce7; font-weight:700;
}
.pg-body a{ color:#6c5ce7;}
.pg-body a:hover{ color:#111;}
.pg-updated{ font-size: .75rem; color:#999; margin: 0 0 24px;}
.pg-section{
   border-bottom: 1px solid #ececec;
   padding: 40px 0 44px;
}
.pg-section:last-child{ border-bottom:none;}
.pg-section h2{
   font-size: 1.35rem;
   font-weight: 800;
   margin: 0 0 16px;
}
.pg-section p{
   font-size: .93rem;
   line-height: 1.7;
   color: #333;
   margin: 0 0 12px;
   max-width: 780px;
}
.pg-section .sub-head{
   font-size: .8rem;
   text-transform: uppercase;
   letter-spacing: .06em;
   color: #6c5ce7;
   margin: 0 0 6px;
}
.services-hero{
   padding: 42px 0 0;
}
.services-hero h1{
   font-size: 1.75rem;
   font-weight: 800;
   margin: 0 0 6px;
}
.services-hero .sub{ font-size:14px; color:#444; margin:0;}
.srv-section{
   padding: 48px 0 52px;
   border-bottom: 1px solid #eee;
}
.srv-section:last-of-type{ border-bottom:none;}
.srv-split{
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 35px;
   align-items: center;
}
.srv-split.flip .srv-txt{ order:2;}
.srv-split.flip .srv-img{ order:1;}
.srv-txt h2{
   font-size: 1.3rem;
   font-weight: 800;
   margin: 0 0 12px;
}
.srv-txt p{
   font-size: .93rem;
   line-height: 1.7;
   color: #333;
   margin: 0 0 10px;
   max-width: 520px;
}
.srv-txt .label{
   font-size: .75rem;
   text-transform: uppercase;
   letter-spacing: .06em;
   color: #6c5ce7;
   margin: 0 0 6px;
   display:block;
}
.srv-img img{
   width:100%;
   border-radius: 6px;
   display: block;
}
@media (max-width: 1024px){
   .hero-grid{ grid-template-columns: 1fr 1fr;}
   .hero-rec{ display:none;}
   .events-row, .journey .jrow{ grid-template-columns: repeat(3, 1fr);}
   .products-grid{ grid-template-columns: repeat(2,1fr);}
   .site-footer .cols{ grid-template-columns: repeat(3, 1fr);}
   .team-row{ grid-template-columns: repeat(3, 1fr);}
}
@media (max-width: 768px){
   .container{ width:100%; padding: 0 18px;}
   .main-nav ul{ flex-wrap:wrap; gap:14px;}
   .hero-grid{ grid-template-columns: 1fr;}
   .hero-side{ order:2;}
   .events-row, .journey .jrow{ grid-template-columns: 1fr 1fr;}
   .products-grid{ grid-template-columns: 1fr 1fr;}
   .team-row{ grid-template-columns: 1fr 1fr;}
   .articles .grid{ grid-template-columns: 1fr;}
   .articles .card{ flex-direction:column;}
   .articles .card img{ width:100%; min-height:160px;}
   .articles .card .body{ padding:14px 16px 16px;}
   .band-cta .inner, .band-vacancy .inner{ flex-direction:column; align-items:flex-start;}
   .contact-grid{ grid-template-columns: 1fr;}
   .site-footer .cols{ grid-template-columns: 1fr 1fr;}
   .srv-split, .srv-split.flip{ grid-template-columns:1fr;}
   .srv-split.flip .srv-txt{ order:1;}
   .srv-split.flip .srv-img{ order:2;}
}
@media (max-width: 480px){
   body{ font-size:14px;}
   .main-nav li a{ padding:10px 2px; font-size:12px;}
   .events-row, .journey .jrow, .site-footer .cols, .products-grid, .team-row, .articles .grid{ grid-template-columns: 1fr;}
   .band-events, .band-about, .band-contact, .articles, .journey, .products-wrap, .team-wrap{ padding: 40px 0;}
}