@font-face{font-family:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/archivo-black-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/atkinson-hyperlegible-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/atkinson-hyperlegible-latin-700-normal.woff2) format('woff2')}
:root{--bg:#F4F0E8;--bg2:#FFFFFF;--fg:#111111;--ac:#FF5CAA;--on:#111111;--sh:#111111;--focus:#111111}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--fg);font-family:'Atkinson Hyperlegible',Arial,sans-serif;font-size:20px;line-height:1.6}
.w{max-width:1200px;margin:0 auto;padding:0 32px}
a{color:var(--fg);font-weight:700;text-underline-offset:.15em}
a:hover{background:var(--ac);color:var(--on);text-decoration:none}
a:focus-visible{outline:4px solid var(--focus);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--ac);color:var(--on);padding:12px 18px;z-index:10}
.skip:focus{left:8px}
nav{display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;align-items:center;padding:24px 0;border-bottom:4px solid var(--fg)}
.lg{font-family:'Archivo Black','Arial Black',Arial,sans-serif;font-size:24px;text-decoration:none;font-weight:400}
nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 28px}
nav a[aria-current="page"]{background:var(--ac);color:var(--on);text-decoration:none;padding:0 .3em}
h1,h2,h3{margin:0}
.hero{font-family:'Archivo Black','Arial Black',Arial,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(40px,8vw,104px);line-height:1.12;margin:0 0 32px;overflow-wrap:break-word;hyphens:manual}
.sl{font-size:clamp(30px,5vw,64px);max-width:11em}
.hl{background:var(--ac);color:var(--on);padding:0 .15em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
section{padding:72px 0;border-bottom:4px solid var(--fg)}
p{max-width:760px;margin:0 0 16px}
.g{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:32px;margin:40px 0}
.bx{border:4px solid var(--fg);padding:24px;background:var(--bg2);box-shadow:8px 8px 0 var(--sh)}
.bx h3{font-size:26px;margin:0 0 12px}
.bx p{margin:0}
.bx.ac{background:var(--ac);color:var(--on);box-shadow:8px 8px 0 var(--fg)}
.btn{display:inline-block;margin-top:24px;border:4px solid var(--fg);background:var(--ac);color:var(--on);padding:14px 22px;text-decoration:none}
.btn:hover{background:var(--fg);color:var(--on)}
.sm{font-size:16px}
.legal h1{font-family:'Archivo Black','Arial Black',Arial,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(36px,6vw,64px);line-height:1.1;margin:0 0 40px}
.legal h2{font-size:26px;margin:40px 0 12px}
.legal h3{font-size:22px;margin:28px 0 8px}
.legal ul{max-width:760px;margin:0 0 16px;padding-left:1.4em}
.legal{padding:56px 0 72px}
.mail{overflow-wrap:anywhere}
footer{padding:32px 0 48px;display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between}
footer nav{padding:0;border:0}
footer ul{list-style:none;margin:0;padding:0;display:flex;gap:8px 28px;flex-wrap:wrap}


/* VARIANTE B – Sticker & Punk. Only home-page slogan typography changes. */
.b-hero-title{max-width:1100px;font-size:clamp(40px,7.4vw,96px)}
.b-paper{display:inline-block;background:var(--ac);border:5px solid var(--fg);box-shadow:9px 9px 0 var(--fg);padding:.13em .18em;transform:rotate(-1.5deg);margin:20px 12px 12px 1px;max-width:calc(100% - 14px);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.b-head-panel{margin:0 0 32px;padding:38px 38px 45px;overflow:visible}
.b-smash-panel{background:var(--fg);color:var(--bg)}
.b-smash-title{margin:0;font-size:clamp(40px,7.8vw,106px);line-height:1.15;max-width:none}
.b-smash-hit{display:inline-block;background:var(--ac);color:var(--fg);padding:.04em .18em .1em;transform:rotate(-1.2deg);font-size:1.27em;box-shadow:6px 6px 0 var(--bg);line-height:1.12;margin-bottom:24px}
.b-smash-rest{display:inline-block;max-width:100%;font-size:.76em;overflow-wrap:normal;word-break:normal}
.b-stop-title{font-size:clamp(40px,7vw,94px);line-height:1.18;max-width:1060px}
.b-stop-label{display:inline-block;background:var(--fg);color:var(--bg);padding:.03em .19em .1em;transform:rotate(-1.2deg)}
.b-stop-pink{background:var(--ac);padding:0 .16em .08em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.b-euer-panel{background:var(--ac);padding:32px 36px 43px}
.b-euer-title{font-size:clamp(38px,6.7vw,90px);line-height:1.17;margin:0;max-width:1080px}
.b-euer-frame{display:block;background:var(--bg);border:6px solid var(--fg);box-shadow:10px 10px 0 var(--fg);padding:24px;transform:rotate(.6deg)}
.b-neuro-title{font-size:clamp(28px,7vw,94px);line-height:1.25;max-width:none;overflow:visible;padding:0 0 .17em}
.b-neuro-word{display:inline-block;line-height:1.25;white-space:nowrap;padding:0 .04em .17em 0;max-width:100%}
.b-neuro-pink{display:inline;line-height:1.3;background:var(--ac);padding:.02em .14em .13em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.b-end-panel{background:var(--fg);color:var(--bg)}
.b-end-title{font-size:clamp(40px,7vw,98px);line-height:1.18;margin:0}
.b-end-pink{color:var(--ac)}
@media(max-width:720px){
 .b-head-panel{padding:27px 17px 33px;margin-bottom:28px}
 .b-hero-title{font-size:clamp(36px,8vw,63px)}
 .b-paper{border-width:3px;box-shadow:5px 5px 0 var(--fg);margin-top:12px}
 .b-smash-title{font-size:clamp(30px,8vw,60px)}
 .b-smash-hit{font-size:1.23em;box-shadow:4px 4px var(--bg);margin-bottom:13px}
 .b-smash-rest{font-size:.76em}
 .b-euer-frame{border-width:4px;box-shadow:6px 6px var(--fg);padding:14px}
 .b-euer-title{font-size:clamp(29px,7vw,55px)}
 .b-stop-title{font-size:clamp(35px,8vw,65px)}
 .b-neuro-title{font-size:clamp(25px,7.15vw,60px);line-height:1.3}
 .b-end-title{font-size:clamp(36px,7.5vw,65px)}
}
@media(max-width:360px){
 .b-smash-title{font-size:27px}
 .b-neuro-title{font-size:24px}
 .b-euer-title{font-size:27px}
}

/* Sticker-Unterseite: sechs Motive im Seitenverhältnis 15 x 10, mit gut sichtbarer Webadresse. */
.sticker-lead{font-size:clamp(21px,2.4vw,28px);font-weight:700;max-width:920px}
.sticker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin:36px 0 54px}
.sticker-tile{min-width:0}
.sticker-art{aspect-ratio:3/2;min-width:0;border:5px solid #111;box-shadow:8px 8px 0 #111;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:6% 6% 11%;background:#F4F0E8;color:#111;isolation:isolate}
.sticker-center{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.12em;min-width:0}
.sticker-main,.sticker-secondary{display:block;font-family:'Archivo Black','Arial Black',Arial,sans-serif;font-weight:400;line-height:1.08;letter-spacing:-.025em;overflow-wrap:normal;word-break:normal}
.sticker-main{font-size:clamp(28px,4.3vw,66px)}
.sticker-secondary{font-size:clamp(20px,2.7vw,43px)}
.sticker-compact{font-size:clamp(24px,3.35vw,52px)}
.sticker-neuro{font-size:clamp(23px,3.1vw,48px);letter-spacing:-.035em;padding-bottom:.1em}
.sticker-url{position:absolute;left:5%;right:5%;bottom:4%;display:block;background:#111;color:#fff;font-family:'Atkinson Hyperlegible',Arial,sans-serif;font-weight:700;text-align:center;font-size:clamp(15px,1.65vw,25px);letter-spacing:.005em;line-height:1.3;padding:.18em .35em;white-space:nowrap}
.sticker-one{background:#FF5CAA}
.sticker-one .sticker-main{background:#111;color:#FF5CAA;display:inline-block;padding:.06em .15em;transform:rotate(-1deg);font-size:clamp(40px,6vw,88px)}
.sticker-two{background:#111;color:#F4F0E8}
.sticker-two .sticker-main{background:#FF5CAA;color:#111;padding:.03em .17em;transform:rotate(-1deg)}
.sticker-two .sticker-url{background:#FF5CAA;color:#111}
.sticker-three .sticker-main{background:#FF5CAA;padding:0 .09em}
.sticker-three .sticker-secondary{background:#111;color:#FF5CAA;padding:.08em .15em}
.sticker-four{background:#FF5CAA}
.sticker-four .sticker-main{background:#F4F0E8;border:4px solid #111;box-shadow:5px 5px #111;padding:.08em .14em}
.sticker-five .sticker-main{background:#FF5CAA;padding:.06em .15em;transform:rotate(-1deg)}
.sticker-six{background:#111;color:#fff}
.sticker-six .sticker-main{font-size:clamp(48px,7vw,106px)}
.sticker-six .sticker-secondary{color:#FF5CAA;font-size:clamp(35px,5vw,76px)}
.sticker-six .sticker-url{background:#FF5CAA;color:#111}
@media(max-width:800px){.sticker-grid{grid-template-columns:1fr;max-width:650px}.sticker-main{font-size:clamp(28px,9vw,67px)}.sticker-secondary{font-size:clamp(21px,6vw,48px)}.sticker-compact{font-size:clamp(24px,7vw,57px)}.sticker-neuro{font-size:clamp(21px,6.5vw,48px)}.sticker-one .sticker-main{font-size:clamp(38px,11vw,94px)}.sticker-six .sticker-main{font-size:clamp(43px,13vw,105px)}.sticker-six .sticker-secondary{font-size:clamp(32px,10vw,79px)}.sticker-url{font-size:clamp(14px,3.5vw,26px)}}
@media(max-width:390px){.sticker-art{border-width:3px}.sticker-url{font-size:12px}}
