/* Kawelke marketing website — UI kit styles. Tokens come from ../../colors_and_type.css */
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:var(--font-body);color:var(--fg-1);background:var(--bg-1);}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
.container{max-width:var(--container);margin:0 auto;padding:0 24px;}
.uc{text-transform:uppercase;}

/* buttons */
.btn{font-family:var(--font-body);font-weight:800;font-size:15px;letter-spacing:.02em;text-transform:uppercase;
  padding:14px 26px;border-radius:var(--radius-md);border:2px solid transparent;cursor:pointer;
  display:inline-flex;align-items:center;gap:9px;transition:transform .14s ease, box-shadow .14s ease, background .14s ease;white-space:nowrap;}
.btn svg{width:19px;height:19px;}
.btn-primary{background:var(--signal-yellow);color:#0A0A0A;border-color:#0A0A0A;box-shadow:0 5px 0 0 var(--signal-yellow-d);}
.btn-primary:hover{background:var(--signal-yellow-d);}
.btn-primary:active{transform:translateY(5px);box-shadow:0 0 0 0 var(--signal-yellow-d);}
.btn-dark{background:#0A0A0A;color:var(--signal-yellow);}
.btn-dark:hover{background:var(--n-800);}
.btn-ghost{background:transparent;color:#0A0A0A;border-color:#0A0A0A;}
.btn-ghost:hover{background:#0A0A0A;color:#fff;}
.btn-ghost.on-dark{color:#fff;border-color:#fff;}
.btn-ghost.on-dark:hover{background:#fff;color:#0A0A0A;}

/* eyebrow */
.eyebrow{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--fg-2);}
.eyebrow.on-dark{color:var(--signal-yellow);}

/* section heading */
.dhead{font-family:var(--font-display);text-transform:uppercase;line-height:1.02;letter-spacing:-0.01em;
  font-size:clamp(2rem,4vw,3.25rem);margin:10px 0 0;}

/* hazard stripe */
.hazard{height:10px;background:repeating-linear-gradient(45deg,#0A0A0A 0 16px,#FFD500 16px 32px);}

/* live dot */
.livedot{width:9px;height:9px;border-radius:50%;background:var(--signal-yellow);display:inline-block;
  box-shadow:0 0 0 0 rgba(255,213,0,.7);animation:pulse 1.7s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,213,0,.6);}70%{box-shadow:0 0 0 9px rgba(255,213,0,0);}100%{box-shadow:0 0 0 0 rgba(255,213,0,0);}}

section{position:relative;}
.sec-pad{padding:84px 0;}
.bg-soft{background:var(--bg-2);}
.bg-dark{background:var(--ink-black);color:#fff;}

/* subpage banner */
.subhero{background:var(--ink-black);color:#fff;position:relative;overflow:hidden;padding:64px 0 56px;}
.subhero .hazard{position:absolute;top:0;left:0;right:0;}
.subhero h1{font-family:var(--font-display);text-transform:uppercase;letter-spacing:-.01em;line-height:1;
  font-size:clamp(2.4rem,5vw,4rem);margin:14px 0 0;}
.subhero p{color:var(--n-300);font-size:1.1rem;line-height:1.55;max-width:600px;margin:16px 0 0;}
.crumbs{font-size:13px;color:var(--n-400);}
.crumbs a{color:var(--signal-yellow);}

/* accordion */
.acc{border-top:1px solid var(--border-1);}
.acc-item{border-bottom:1px solid var(--border-1);}
.acc-q{width:100%;background:none;border:none;cursor:pointer;text-align:left;display:flex;
  align-items:center;justify-content:space-between;gap:16px;padding:20px 4px;font-family:var(--font-body);
  font-weight:700;font-size:17px;color:var(--fg-1);}
.acc-q .chev{flex:none;transition:transform .2s ease;color:var(--fg-2);}
.acc-q[aria-expanded="true"] .chev{transform:rotate(90deg);color:var(--fg-1);}
.acc-a{overflow:hidden;max-height:0;transition:max-height .3s ease;}
.acc-a .inner{padding:0 4px 22px;color:var(--fg-2);line-height:1.6;font-size:15.5px;max-width:780px;}

/* timeline (Über uns) — alternating photo + text */
.ms-list{display:grid;gap:64px;}
.ms-row{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
.ms-media{position:relative;border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:16/10;background:var(--n-100);}
.ms-media img{width:100%;height:100%;object-fit:cover;display:block;}
.ms-badge{position:absolute;left:0;bottom:0;background:var(--signal-yellow);color:#0A0A0A;
  font-family:var(--font-display);text-transform:uppercase;font-size:clamp(1.3rem,2vw,1.9rem);
  line-height:1;padding:10px 16px 8px;border-top-right-radius:var(--radius-md);}
.ms-tag{font-family:var(--font-body);font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--signal-yellow-d);}
.ms-h{font-family:var(--font-display);text-transform:uppercase;letter-spacing:-.01em;line-height:1.02;
  font-size:clamp(1.5rem,2.6vw,2.2rem);margin:8px 0 12px;color:var(--fg-1);}
.ms-p{font-size:16px;line-height:1.6;color:var(--fg-2);margin:0;}
@media (max-width:760px){
  .ms-list{gap:44px;}
  .ms-row,.ms-row.flip{grid-template-columns:1fr;gap:18px;}
  .ms-row.flip .ms-media{order:-1;}
}