/*
Theme Name: VON GRAMBUSCH
Theme URI: https://vongrambusch.band/
Author: VON GRAMBUSCH
Description: Eigenes Bandtheme aus dem freigegebenen Entwurf. Originalschriften und Originalgrafiken; WooCommerce und Noptin bleiben vorhanden.
Version: 1.3.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: von-grambusch
*/
@charset "UTF-8";
@font-face{font-family:"GHOUL";src:url("assets/fonts/Ghoul.otf") format("opentype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Bootzy TM";src:url("assets/fonts/Bootzy-TM.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Bootzy New TM";src:url("assets/fonts/Bootzy-New-TM.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
:root{
  --ink:#213847;
  --paper:#fbf8f6;
  --orange:#e56b28;
  --sky:#557fa7;
  --sky-light:#b3cbd7;
  --blue:#284d69;
  --line:#b8c1c3;
  --gutter:clamp(22px,5vw,88px);
  --grain:url("assets/paper-grain.svg");
  --torn:polygon(0 .7%,7% 0,14% .5%,23% .1%,31% .7%,40% 0,48% .4%,57% .1%,65% .7%,76% 0,85% .5%,94% .1%,99.7% .8%,100% 14%,99.6% 24%,100% 36%,99.7% 47%,100% 60%,99.6% 71%,100% 84%,99.5% 99.6%,89% 100%,79% 99.3%,68% 99.9%,57% 99.5%,45% 100%,35% 99.3%,25% 100%,16% 99.5%,6% 100%,.3% 99.3%,0 87%,.5% 73%,0 60%,.4% 47%,0 32%,.5% 18%);
  --label-edge:polygon(.5% 2%,15% 0,31% 2%,49% 0,62% 2%,81% 0,99.5% 2%,100% 30%,99.5% 65%,99.8% 99%,83% 98%,62% 100%,41% 98%,24% 100%,.5% 98%,0 69%,.4% 44%,0 18%);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--sky-light);color:var(--ink);font-family:"Bootzy TM",Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5;font-synthesis:none;font-variant-ligatures:contextual}
a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%;height:auto}
h1,h2,h3,p{margin:0}h1,h2,h3{font-family:"GHOUL",Impact,"Arial Narrow",Arial,sans-serif;font-weight:400;line-height:1.12}
a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid currentColor;outline-offset:6px}
.skip{position:fixed;left:20px;top:-100px;z-index:30;background:var(--paper);color:var(--ink);padding:12px}.skip:focus{top:15px}
.eyebrow{text-transform:uppercase;font-size:.875rem;letter-spacing:.12em;font-weight:800}
.header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:22px var(--gutter);background:var(--paper) var(--grain);box-shadow:0 2px 9px #21384714}
.brand{width:255px;flex-shrink:0}.brand img{filter:brightness(0) saturate(100%);opacity:.84}
.header nav{display:flex;align-items:center;gap:32px;font-weight:800;text-transform:uppercase;font-size:.9375rem;letter-spacing:.02em}
.header nav>a:not(.button):hover{color:var(--blue);text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--orange)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;padding:12px 24px;font-weight:800;text-transform:uppercase;line-height:1.5;border:1px solid transparent;transition:background .18s,transform .18s}
.button-accent{color:var(--ink);background:var(--orange) var(--grain);clip-path:var(--label-edge)}
.button:hover{transform:translateY(-2px)}.button-accent:hover{background-color:#f48749}.button span{font-size:1.2em}.menu-toggle{display:none}
.hero{position:relative;isolation:isolate;padding:30px var(--gutter) 86px;background:var(--grain),radial-gradient(ellipse at 87% 0,#acc4d1,transparent 49%),linear-gradient(120deg,var(--sky),#85a6bc);}
.photo-mount{position:relative;display:block;isolation:isolate;filter:drop-shadow(3px 7px 5px #21384728)}
.photo-surface{position:relative;display:block;overflow:hidden;padding:6px;background:var(--paper);clip-path:var(--torn)}
.photo-surface::before{content:"";position:absolute;inset:5px;z-index:1;background:var(--grain);opacity:.25;mix-blend-mode:soft-light;pointer-events:none}
.photo-surface::after{content:"";position:absolute;inset:0;z-index:2;background:url("assets/photo-wear.svg") center/100% 100%;pointer-events:none}
.hero-photo-mount{transform:rotate(-.65deg);margin:0 6px}
.hero-photo{width:100%;height:clamp(420px,39vw,610px);object-fit:cover;object-position:50% 56%;filter:saturate(.78) contrast(.94)}
.tape{position:absolute;z-index:4;display:block;width:132px;height:40px;pointer-events:none;background:var(--grain),linear-gradient(4deg,#e5dbc3ba,#eee7d2dc 45%,#d7ccb29c);box-shadow:0 1px 2px #21384721;clip-path:polygon(0 7%,3% 0,5% 5%,8% 0,10% 7%,13% 1%,16% 5%,18% 0,21% 4%,88% 0,91% 6%,94% 1%,96% 7%,99% 3%,98% 21%,100% 39%,98% 53%,100% 69%,98% 89%,100% 98%,95% 95%,91% 100%,86% 96%,11% 100%,7% 96%,4% 100%,1% 94%,2% 75%,0 62%,2% 46%,0 28%);opacity:.88}
.tape::after{content:"";position:absolute;inset:6px 3px;background:linear-gradient(177deg,transparent 52%,#fff5 54%,transparent 56%);border-top:1px solid #fff3}
.tape-left{top:4px;left:-30px;transform:rotate(-32deg)}.tape-right{bottom:5px;right:-30px;transform:rotate(-37deg)}
.hero .tape{width:154px;height:43px}.hero .tape-right{top:5px;bottom:auto;transform:rotate(29deg)}
.hero-copy{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:-116px;padding:0 22px;z-index:5}
.hero .eyebrow{display:table;background:var(--paper) var(--grain);padding:6px 15px;margin:0 0 7px 9px;font-size:.8125rem;clip-path:var(--label-edge)}
.hero h1{font-size:clamp(50px,6.4vw,98px);line-height:1.21;transform:rotate(-1.3deg)}
.title-strip{display:inline-block;padding:0 22px 7px;background:var(--orange) var(--grain);color:var(--paper);clip-path:var(--label-edge)}
.title-strip:last-child{background-color:var(--paper);color:var(--orange);margin-left:12px;transform:rotate(1deg)}
.tour-year{display:flex;flex-direction:column;align-items:center;background:var(--paper) var(--grain);padding:20px 28px 18px;transform:rotate(3deg);clip-path:var(--label-edge);margin-bottom:6px}
.tour-year>span{letter-spacing:.18em;font-weight:bold;font-size:.875rem}.tour-year strong{font-family:"GHOUL",Impact,"Arial Narrow",sans-serif;font-size:clamp(44px,4.2vw,64px);font-weight:400;line-height:1.15;color:var(--blue)}
.tour-year a{font-size:.875rem;margin-top:8px;border-bottom:1px solid var(--orange);padding-bottom:5px}
.tour-strip{position:relative;display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:-18px;padding:20px var(--gutter);background:var(--orange) var(--grain);color:var(--ink);font-size:.875rem;font-weight:800;letter-spacing:.02em;clip-path:var(--label-edge)}
.tour-strip a{border-bottom:1px solid currentColor}
.section{position:relative;padding:82px var(--gutter)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:38px}
.section h2{font-size:clamp(58px,7vw,100px);line-height:1.12}
.label-heading{display:table;background:var(--orange) var(--grain);color:var(--paper);padding:2px 22px 9px;clip-path:var(--label-edge);transform:rotate(-1.5deg)}
.section-heading>p{text-align:right;font-size:1.125rem;font-weight:700}.section-heading>p span{color:#536a78;font-weight:400}
.live-section{background:var(--paper) var(--grain);margin-top:-2px}
.dates{border-top:1px solid var(--line)}
.date-row{display:grid;grid-template-columns:140px 1fr auto;gap:26px;align-items:center;border-bottom:1px solid var(--line);padding:24px 0}
.date-row time{display:flex;flex-direction:column;gap:2px}.date-row time strong{font-size:1.8rem;letter-spacing:-.04em;line-height:1.1}.date-row time span{font-size:.875rem;color:#536a78}
.venue h3{font-size:clamp(23px,2.6vw,38px);color:var(--blue)}.venue p{color:#536a78;margin-top:4px}
.ticket{padding:12px 24px;background:var(--blue) var(--grain);color:var(--paper);display:flex;align-items:center;justify-content:space-between;gap:42px;font-weight:700;text-transform:uppercase;font-size:.875rem;clip-path:var(--label-edge);transition:background .18s,color .18s}
.ticket:hover{background-color:var(--orange);color:var(--ink)}
.music-section{background:var(--grain),radial-gradient(ellipse at 0 30%,#d0dade88,transparent 60%),linear-gradient(140deg,#9bb8ca,var(--sky-light));color:var(--ink)}
.music-section::before,.videos-section::before{content:"";position:absolute;left:0;right:0;top:-8px;height:18px;background:var(--paper);clip-path:polygon(0 0,100% 0,100% 63%,96% 42%,93% 66%,88% 34%,84% 58%,80% 38%,75% 75%,71% 40%,65% 62%,60% 28%,56% 58%,51% 35%,48% 70%,43% 40%,39% 65%,34% 31%,29% 57%,25% 40%,20% 76%,16% 40%,10% 57%,6% 31%,0 73%)}
.music-intro{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:62px}
.music-intro .eyebrow{width:100%;margin-bottom:0}.music-intro .label-heading{background-color:var(--paper);color:var(--blue)}
.text-link{display:inline-block;border-bottom:1px solid currentColor;padding-bottom:7px;font-weight:700;font-size:.9375rem}.text-link:hover{opacity:.72}
.single-feature{display:grid;grid-template-columns:minmax(250px,.86fr) 1.3fr;gap:clamp(38px,7vw,110px);align-items:center;padding-bottom:58px;border-bottom:1px solid #284d6966}
.single-cover{transform:rotate(-2deg);margin:6px 8px 10px}.single-cover img{width:100%;aspect-ratio:1;object-fit:cover}
.single-copy h3{font-size:clamp(40px,5.4vw,78px);line-height:1.13;margin:20px 0;overflow-wrap:anywhere}
.paper-label{display:table;background:var(--paper) var(--grain);padding:7px 14px;transform:rotate(-2deg);clip-path:var(--label-edge)}
.single-copy .single-artists{font-size:1.0625rem;margin-bottom:28px}.single-copy .button{font-size:.875rem}
.button-dark{background:var(--blue) var(--grain);color:var(--paper);clip-path:var(--label-edge)}.button-dark:hover{background-color:var(--ink)}
.releases-heading{margin:36px 0 34px}.releases-heading h3{font-size:34px}
.releases{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:790px}
.release-art{transform:rotate(1.3deg);margin:0 6px}.release:nth-child(2) .release-art{transform:rotate(-1.5deg)}
.release img{width:100%;aspect-ratio:1;object-fit:cover}.tape-top{top:-17px;left:calc(50% - 60px);transform:rotate(-5deg);width:120px;height:34px}
.release>div{display:flex;justify-content:space-between;gap:15px;margin-top:24px}.release h3{font-size:1.55rem;line-height:1.2}.release>div>span{font-size:1.375rem;line-height:1}.release p{margin-top:7px;font-size:.875rem}
.release:hover h3{text-decoration:underline;text-underline-offset:4px}
.videos-section{background:var(--paper) var(--grain)}.videos-section::before{top:-12px;transform:rotate(180deg)}
.videos-section h2{font-size:clamp(45px,5.6vw,80px)}
.video-link{display:flex;align-items:center;gap:28px;padding:28px 0;border-top:1px solid var(--line)}.video-link:last-child{border-bottom:1px solid var(--line)}
.play{display:flex;align-items:center;justify-content:center;border:1px solid var(--blue);width:64px;height:64px;border-radius:50%;flex-shrink:0;padding-left:3px;font-size:20px;color:var(--blue)}
.video-link p{font-size:.875rem;color:#536a78;letter-spacing:.035em;margin-bottom:9px}.video-link h3{font-size:clamp(22px,3vw,40px);line-height:1.15;color:var(--blue)}
.watch{font-size:.9375rem;margin-left:auto;white-space:nowrap}.video-link:hover .play{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.newsletter{display:flex;align-items:center;justify-content:space-between;gap:32px;background:var(--orange) var(--grain);padding-top:54px;padding-bottom:54px}
.newsletter h2{font-size:clamp(48px,5.6vw,80px);margin-top:12px;color:var(--paper)}
.footer{padding:65px var(--gutter) 24px;background:var(--blue) var(--grain);color:var(--paper)}
.footer-top{display:flex;justify-content:space-between;gap:35px;align-items:flex-start}.footer-brand{width:min(400px,45%)}.footer-brand img{filter:brightness(0) invert(1);opacity:.94}
.footer-top .eyebrow{color:var(--paper);margin-bottom:9px}.footer-top a:not(.footer-brand){font-weight:700;font-size:1.0625rem}.footer-top div>p:last-child{margin-top:6px;color:#d4e0e6;font-size:.875rem}
.footer-nav{display:flex;flex-wrap:wrap;gap:16px 30px;margin:40px 0;font-size:.9375rem}.footer-nav a:hover{text-decoration:underline;text-underline-offset:5px}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #d4e0e660;padding-top:22px;font-size:.8125rem;color:#d4e0e6}
@media(min-width:1700px){.section,.footer{padding-left:max(var(--gutter),calc((100vw - 1500px)/2));padding-right:max(var(--gutter),calc((100vw - 1500px)/2))}}
@media(max-width:1000px){.header nav{gap:20px}.brand{width:210px}.header{padding-top:19px;padding-bottom:19px;gap:24px}.tour-strip>span:nth-child(2){display:none}.watch{display:none}.hero-copy{padding:0 10px}.hero h1{font-size:6.4vw}.tour-year{padding:16px 20px}.single-feature{gap:42px}}
@media(max-width:720px){
  html{scroll-padding-top:96px}
  .header{flex-wrap:wrap;padding-top:20px;padding-bottom:20px;gap:0}.brand{width:210px;max-width:68%}
  .menu-toggle{display:flex;align-items:center;gap:10px;background:transparent;color:var(--ink);border:1px solid #536a78;padding:7px 10px;font-weight:700;font-size:.875rem}
  .header nav{display:none;width:100%;padding-top:24px;align-items:stretch;gap:0}.header nav.open{display:flex;flex-direction:column}.header nav a{padding:13px 5px;border-top:1px solid var(--line)}.header nav .button{margin-top:10px;padding:12px}
  .hero{padding:27px 18px 48px}.hero-photo-mount{margin:0 2px;transform:rotate(-1.2deg)}.hero-photo{height:330px;object-position:54% 54%}.photo-surface{padding:4px}
  .hero .tape{width:100px;height:31px}.hero .tape-left{left:-12px}.hero .tape-right{right:-12px}
  .hero-copy{margin-top:-35px;padding:0 7px;align-items:flex-end;gap:12px}.hero-copy>div:first-child{min-width:0}.hero .eyebrow{font-size:.6875rem;letter-spacing:.045em;padding:5px 9px;margin-left:0;white-space:nowrap}
  .hero h1{font-size:clamp(32px,7.5vw,53px);line-height:1.26}.title-strip{padding:0 11px 6px}.title-strip:last-child{margin-left:5px}
  .tour-year{padding:12px 11px;margin-bottom:4px;max-width:100px;flex-shrink:0}.tour-year strong{font-size:31px}.tour-year>span{font-size:.6875rem}.tour-year a{font-size:.75rem;text-align:center;line-height:1.3;max-width:75px}
  .tour-strip{padding-top:17px;padding-bottom:17px;font-size:.8125rem;gap:20px}
  .section{padding-top:56px;padding-bottom:56px}.section-heading{margin-bottom:28px;gap:16px}.section-heading>p{font-size:.875rem;max-width:51%}.section h2{font-size:clamp(46px,12vw,70px)}.label-heading{padding:3px 13px 8px}
  .date-row{grid-template-columns:66px minmax(0,1fr) auto;gap:12px;padding:23px 0}.date-row time strong{font-size:1.35rem}.date-row time span{font-size:.75rem}.venue h3{font-size:1.1rem;line-height:1.2;overflow-wrap:anywhere}.venue p{font-size:.875rem;line-height:1.4}.ticket{gap:6px;padding:10px 9px;font-size:.75rem}
  .music-intro{margin-bottom:42px;gap:16px}.music-intro .text-link{font-size:.8125rem}
  .single-feature{grid-template-columns:1fr;gap:32px;padding-bottom:36px}.single-cover{max-width:400px;margin:0 12px 0 8px}.single-copy h3{font-size:clamp(44px,11vw,72px)}.single-copy .single-artists{font-size:1rem}
  .tape-left{left:-20px}.tape-right{right:-20px}.single-cover .tape{width:116px;height:34px}
  .releases{gap:28px}.releases-heading h3{font-size:30px}.release h3{font-size:1.2rem}.release>div{margin-top:18px}.release p{font-size:.8125rem}.tape-top{width:88px;height:27px;left:calc(50% - 44px);top:-12px}
  .videos-section .section-heading{align-items:flex-start;flex-direction:column;gap:22px}.videos-section h2{font-size:clamp(40px,10vw,64px)}
  .video-link{gap:18px}.play{width:46px;height:46px;font-size:16px}.video-link p{font-size:.75rem;letter-spacing:0}.video-link h3{font-size:1.35rem}
  .newsletter{flex-direction:column;align-items:flex-start;gap:28px}.newsletter h2{font-size:clamp(44px,12vw,60px)}
  .footer{padding-top:48px}.footer-top{flex-direction:column;gap:32px}.footer-brand{width:290px;max-width:100%}.footer-nav{gap:16px 25px}.footer-bottom{flex-direction:column;gap:6px}
}
@media(max-width:390px){.hero h1{font-size:clamp(26px,7.8vw,32px)}.hero .eyebrow{font-size:.625rem}.tour-year{padding:10px 9px;max-width:83px}.tour-year strong{font-size:28px}.date-row{gap:9px;grid-template-columns:59px minmax(0,1fr) auto}.venue h3{font-size:1rem}.ticket{padding:10px 7px}.ticket span{display:none}.tour-strip{font-size:.75rem}.section-heading>p{font-size:.8125rem}.releases{grid-template-columns:1fr;gap:38px}.release-art{margin:0 12px}.releases .tape-top{width:120px;height:32px;left:calc(50% - 60px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Version 04: supplied photographic textures, original covers and new sections. */
.header{display:grid;grid-template-columns:minmax(175px,1fr) auto auto;gap:24px}
.header .brand{width:210px;justify-self:start}
.header nav{gap:20px;font-size:.875rem}
.header .button{padding:11px 16px;gap:14px;font-size:.8125rem;white-space:nowrap}
.header-newsletter{justify-self:start}.mobile-ticket{display:none}
.photo-surface{padding:0;clip-path:var(--torn);isolation:isolate;background:transparent;-webkit-mask:none;mask:none}
.photo-surface::before{inset:0;background:url("assets/textures/paper-22.webp") center/100% 100%;mix-blend-mode:soft-light;opacity:.055}
.photo-surface::after{inset:0;background:url("assets/textures/rips-folds-16.webp") center/100% 100%;mix-blend-mode:screen;opacity:.16}
.hero-photo{filter:saturate(.96)}
.tape,.hero .tape{background:url("assets/textures/masking-1.webp") center/contain no-repeat;box-shadow:none;clip-path:none;opacity:1;width:105px;height:150px}
.tape::after{display:none}
.tape-left,.hero .tape-left{top:-31px;left:1px;transform:rotate(54deg)}
.tape-right,.hero .tape-right{top:auto;bottom:-34px;right:-16px;transform:rotate(-10deg);background-image:url("assets/textures/masking-19.webp");width:125px;height:140px}
.single-cover,.release-art,.release:nth-child(2) .release-art{transform:none;filter:none;margin:0}
.clean-cover{display:block;isolation:auto;background:transparent}
.clean-cover::before,.clean-cover::after{display:none}
.clean-cover img{object-fit:contain;filter:none;clip-path:none;mask:none;box-shadow:none;transform:none;border:0;padding:0}
.single-copy h3{font-size:clamp(42px,5.1vw,72px)}
.single-copy .single-artists{margin-bottom:12px}
.release-date{font-size:1.2rem;margin-bottom:24px;color:var(--blue)}
.release-actions{display:flex;flex-wrap:wrap;gap:12px}
.listen-section{padding:36px 0;border-bottom:1px solid #284d6966}
.listen-heading{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:24px}
.listen-heading h3{font-size:30px;margin-top:8px}.listen-heading .eyebrow{font-size:.75rem}
.streaming-links{display:flex;gap:24px;flex-wrap:wrap;flex-shrink:0}
.spotify-shell{background:#fbf8f67a;padding:22px;min-height:145px;border:1px solid #284d6922}
.embed-intro{display:flex;align-items:center;gap:20px;min-height:98px}.embed-intro>div{flex:1}.embed-intro .button{font-size:.8125rem;flex-shrink:0;cursor:pointer}
.embed-note{font-size:.8125rem;opacity:.8;margin-top:6px}.player-symbol{font-size:23px;color:var(--blue);padding:10px;border:1px solid currentColor;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;flex-shrink:0}
.spotify-shell{position:relative}.spotify-mount{position:absolute;width:100%;inset:0;visibility:hidden;pointer-events:none}.spotify-shell.is-loaded .spotify-mount{position:static;visibility:visible;pointer-events:auto}
.spotify-shell.is-loaded{background:transparent;padding:0;border:0;min-height:352px}.spotify-shell iframe{width:100%;height:352px;border:0;border-radius:12px;display:block}.embed-intro button:disabled{opacity:.65;cursor:wait}
.previous-single{display:flex;gap:24px;align-items:center;margin-top:32px;padding:26px 0;border-bottom:1px solid #284d6966}
.previous-single img{width:105px;height:105px;object-fit:contain}.previous-single h3{font-size:26px;margin:8px 0}.previous-single .eyebrow,.previous-single p{font-size:.8125rem}.previous-single>a{margin-left:auto;white-space:nowrap}
.about-section{background:var(--paper) var(--grain)}
.about-layout{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:clamp(34px,6vw,85px);padding:15px 0}
.about-photo{transform:rotate(-2deg);margin:0 8px}.about-photo img{width:100%;height:auto}
.about-photo .tape-left{width:76px;height:110px;top:-23px}.about-photo .tape-right{width:102px;height:108px;bottom:-25px}
.about-copy h3{font-size:clamp(32px,4vw,54px);color:var(--blue);margin-bottom:24px}
.about-copy p{font-size:1.05rem;line-height:1.65;margin-bottom:18px}.about-copy .text-link{margin-top:10px}
.news-section{background:var(--grain),linear-gradient(120deg,#abc4d2,#c4d5de)}
.news-section .section-heading .eyebrow{margin-bottom:18px}.news-section .label-heading{font-size:clamp(46px,6.4vw,92px);background-color:var(--paper);color:var(--blue)}
.instagram-heading{display:flex;align-items:center;justify-content:space-between;gap:22px;margin:45px 0 26px}.instagram-heading h3{font-size:30px}.instagram-heading .text-link{font-size:.875rem}
.instagram-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.instagram-card{display:flex;flex-direction:column;background:var(--paper);border:1px solid #284d6920;min-width:0;transition:transform .2s}
.instagram-card>img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;background:#b2bbc0}
.instagram-card>span{display:flex;justify-content:space-between;gap:12px;padding:16px;font-size:.875rem;line-height:1.4}.instagram-card>span>span{margin-left:auto;flex-shrink:0}.instagram-card:hover{transform:translateY(-4px)}
.instagram-more{font-size:.875rem;margin-top:6px}
@media(max-width:1100px) and (min-width:981px){.header{gap:18px;padding-left:28px;padding-right:28px}.header nav{gap:15px}.header .brand{width:175px}.header .button{padding-left:13px;padding-right:13px}}
@media(max-width:980px){
  html{scroll-padding-top:158px}
  .header{grid-template-columns:minmax(0,1fr) auto;gap:15px 24px;padding-top:16px;padding-bottom:16px}
  .header .brand{grid-row:1;grid-column:1;justify-self:start;width:210px;max-width:100%}
  .menu-toggle{grid-row:1;grid-column:2;display:flex;align-items:center;gap:10px;background:transparent;color:var(--ink);border:1px solid #536a78;padding:7px 10px;font-size:.875rem}
  .header-newsletter{grid-row:2;grid-column:1}.mobile-ticket{grid-row:2;grid-column:2;display:inline-flex;justify-self:end}
  .header nav{grid-row:3;grid-column:1/-1;display:none;width:100%;padding-top:5px;align-items:stretch;gap:0}
  .header nav.open{display:flex;flex-direction:column}.header nav a{padding:13px 5px;border-top:1px solid var(--line)}.header nav .button{margin-top:10px;padding:12px}
  .embed-intro{flex-wrap:wrap}.embed-intro .button{margin-left:68px}
  .listen-heading{align-items:flex-start;flex-direction:column;gap:18px}
}
@media(max-width:720px){
  .hero .tape-left{width:68px;height:105px;left:12px;top:-17px}.hero .tape-right{width:87px;height:100px;right:0;bottom:-25px}
  .single-cover{max-width:460px;margin:0}.single-feature{gap:30px}.single-copy h3{font-size:clamp(42px,11vw,68px)}
  .releases .release-art{margin:0}.release-date{font-size:1.05rem}.release-actions .button{font-size:.8rem}
  .spotify-shell{padding:18px}.embed-intro{gap:16px}.embed-intro .button{margin-left:0;width:100%;white-space:normal}.player-symbol{width:40px;height:40px;font-size:18px}
  .previous-single{display:grid;grid-template-columns:82px minmax(0,1fr);gap:18px}.previous-single img{width:82px;height:82px}.previous-single h3{font-size:23px}.previous-single>a{grid-column:2;margin:0;justify-self:start;font-size:.8125rem}
  .about-layout{grid-template-columns:1fr;gap:44px}.about-photo{margin:6px 8px}.about-copy h3{font-size:40px}.about-copy p{font-size:1rem}.about-section h2{font-size:clamp(35px,9.5vw,60px)}
  .news-section .section-heading{align-items:flex-start;flex-direction:column;gap:24px}.news-section .label-heading{font-size:clamp(41px,11.5vw,65px)}
  .instagram-heading{align-items:flex-start;flex-direction:column;gap:10px;margin:32px 0 22px}.instagram-heading h3{font-size:28px}
  .instagram-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.instagram-card>span{padding:11px;font-size:.75rem}.instagram-card>span>span{display:none}
}

/* Version 05: taped, tilted cover mounts; the cover artwork remains untouched. */
.cover-mount{position:relative;isolation:isolate;filter:drop-shadow(2px 5px 4px #21384721)}
.single-cover.cover-mount{transform:rotate(-2deg);margin:10px 10px 14px}
.release-art.cover-mount{transform:rotate(1.7deg);margin:12px 8px 4px}
.release:nth-child(2) .release-art.cover-mount{transform:rotate(-2deg)}
.cover-mount .cover-tape{width:60px;height:118px;left:50%;right:auto;top:-59px;bottom:auto;transform:translateX(-50%) rotate(84deg);background-image:url("assets/textures/masking-1.webp")}
.single-cover .cover-tape{width:70px;height:136px;top:-68px;transform:translateX(-50%) rotate(96deg)}
.previous-cover{width:105px;flex-shrink:0;transform:rotate(3deg);margin:8px 0}
.previous-cover .cover-tape{width:25px;height:52px;top:-26px;transform:translateX(-50%) rotate(86deg)}
.about-layout{grid-template-columns:1fr 1.15fr;align-items:start;gap:clamp(34px,5vw,70px)}
.about-photo{margin-top:32px}
.about-copy p{font-size:1rem;line-height:1.7}
@media(max-width:720px){
  .single-cover.cover-mount{margin:10px 8px 14px}
  .single-cover .cover-tape{width:58px;height:112px;top:-56px}
  .release-art.cover-mount{margin:10px 7px 4px}
  .release-art .cover-tape{width:48px;height:98px;top:-49px}
  .previous-cover{width:82px}
  .about-layout{grid-template-columns:1fr;gap:44px}
  .about-photo{margin-top:6px}
  .about-photo .tape-left{left:12px}
  .about-photo .tape-right{right:0}
}

/* Version 06: gentle booklet folds without external image masks. */

.hero-socials{display:flex;align-items:center;justify-content:flex-end;gap:20px;margin:28px 22px -24px;color:var(--ink)}
.social-intro{font-size:.8125rem;text-transform:uppercase;letter-spacing:.08em}
.social-icons{display:flex;align-items:center;gap:10px}
.social-icons a{display:grid;place-items:center;width:44px;height:44px;border:1px solid #21384755;background:#fbf8f650;border-radius:50%;transition:background .18s,transform .18s}
.social-icons svg{width:21px;height:21px;fill:currentColor}
.social-icons a:hover{background:var(--orange);transform:translateY(-2px)}
.social-name{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:720px){.hero-socials{justify-content:flex-start;margin:28px 4px -17px;gap:16px}.social-icons{gap:8px}.social-intro{font-size:.7rem}.social-icons a{width:44px;height:44px}.social-icons svg{width:20px;height:20px}}
@media(max-width:360px){.hero-socials{gap:12px}.social-icons{gap:6px}.social-intro{max-width:38px}}

/* Three original album covers, and a visibly lowercase s in EPs. */
.releases{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1100px}
.release:nth-child(3) .release-art.cover-mount{transform:rotate(1.2deg)}
.releases-heading .lowercase-s{font-family:"Bootzy TM",Arial,sans-serif;font-size:.8em;text-transform:none}
@media(max-width:720px){.releases{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:390px){.releases{grid-template-columns:1fr}}

/* Additional social links at the bottom right of Aktuelles. */
.news-socials{display:flex;justify-content:flex-end;margin-top:32px}
.newsletter .eyebrow{max-width:650px;line-height:1.6}
@media(max-width:720px){.news-socials{margin-top:24px}.newsletter .eyebrow{max-width:340px}}

.spotify-disable{margin-top:18px;font-size:.8rem;cursor:pointer}.spotify-shell.is-loaded{min-height:0}.embed-note a{text-decoration:underline;text-underline-offset:3px}
.shop-payment-note{font-size:.85rem;color:#d4e0e6;margin-bottom:24px}

.embed-status{font-size:.8125rem;margin-top:8px;color:var(--blue)}.embed-status:empty{display:none}

/* Mobile music layout: keep all three clickable covers visible without scrolling sideways. */
.single-cover{display:block}
@media(max-width:720px){
  .listen-section{display:none}
  .releases{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:100%}
  .release{min-width:0;text-align:center}
  .release-art.cover-mount{display:block;margin:8px 3px 4px}
  .release-art .cover-tape{width:34px;height:72px;top:-36px}
  .release>div{justify-content:center;gap:0;margin-top:12px}
  .release h3{font-size:.78rem;line-height:1.2;overflow-wrap:anywhere}
  .release>div>span{display:none}
  .release p{font-size:.68rem;line-height:1.25;margin-top:4px}
}
@media(max-width:390px){
  .releases{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
  .release-art.cover-mount{margin-right:2px;margin-left:2px}
  .release h3{font-size:.72rem}
  .release p{font-size:.625rem}
}

/* A distinct tape treatment for every release; placements avoid artwork lettering. */
.single-cover.cover-mount .cover-tape--single{width:56px;height:124px;left:1px;top:-50px;transform:rotate(88deg);background-image:url("assets/textures/masking-1.webp")}
.release:nth-child(1) .cover-tape--licht{width:44px;height:104px;left:50%;top:-46px;transform:translateX(-50%) rotate(87deg);background-image:url("assets/textures/masking-17.webp")}
.release:nth-child(2) .cover-tape--kopf{width:90px;height:90px;left:auto;right:-21px;top:auto;bottom:-24px;transform:rotate(5deg);background-image:url("assets/textures/masking-15.webp")}
.release:nth-child(3) .cover-tape--idiome{width:43px;height:91px;left:auto;right:-22px;top:-30px;bottom:auto;transform:rotate(-8deg);background-image:url("assets/textures/masking-8.webp")}
@media(max-width:720px){
  .single-cover.cover-mount .cover-tape--single{width:30px;height:69px;left:2px;top:-29px;transform:rotate(88deg)}
  .release:nth-child(1) .cover-tape--licht{width:21px;height:50px;left:50%;top:-21px;transform:translateX(-50%) rotate(87deg)}
  .release:nth-child(2) .cover-tape--kopf{width:46px;height:46px;right:-9px;bottom:-14px;transform:rotate(5deg)}
  .release:nth-child(3) .cover-tape--idiome{width:20px;height:45px;left:auto;right:-10px;top:-14px;bottom:auto;transform:rotate(-8deg)}
}

/* Different corner tapes make each photo feel pinned to its paper backdrop. */
.about-photo .tape-about-top-right{width:76px;height:112px;top:-27px;right:-18px;left:auto;bottom:auto;transform:rotate(-38deg);background-image:url("assets/textures/masking-8.webp")}
.about-photo .tape-about-bottom-left{width:86px;height:114px;top:auto;right:auto;left:-20px;bottom:-29px;transform:scaleX(-1) rotate(90deg);background-image:url("assets/textures/masking-15.webp")}
.hero-photo-mount .photo-surface::before,.about-photo .photo-surface::before{opacity:.075}
.hero-photo-mount .photo-surface::after,.about-photo .photo-surface::after{opacity:.22}
@media(max-width:720px){
  /* Leave room for the rotated corner tape inside the phone viewport. */
  .about-photo{margin-inline:20px}
  .about-photo .tape-about-top-right{width:58px;height:84px;top:-22px;right:-11px}
  .about-photo .tape-about-bottom-left{width:64px;height:86px;left:-13px;bottom:-23px}
}