/*
Theme Name: Jabber Sisters and Band
Author: Jabber Sisters
Description: Eigen huisstijl met illustraties van Hester. Bewerkbare pagina’s, foto’s en muziek via de WordPress-blokeditor.
Version: 2.7.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: jabber-sisters
License: Proprietary
*/
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#ffdf00;color:#121212;font-family:Arial,sans-serif;font-size:18px;line-height:1.55}a{color:inherit}button{font:inherit}header{background:#fffdf5;border-bottom:5px solid;position:relative;z-index:2}.nav{max-width:1260px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:18px 28px;gap:25px}.brand{text-decoration:none;line-height:.94;font-weight:1000;letter-spacing:-2px;font-size:32px;text-transform:uppercase;transform:rotate(-3deg)}.brand span{display:block}.brand .red{color:#ee242e;text-shadow:2px 2px #121212}.brand .blue{color:#0077bd;text-shadow:2px 2px #121212}.brand small{font-size:17px;letter-spacing:0;display:block;margin-top:8px}nav{display:flex;gap:24px;align-items:center}nav a{text-decoration:none;font-weight:800;font-size:16px;border-bottom:3px solid transparent}nav a[aria-current=page],nav a:hover{border-color:#ee242e}.menu{display:none;border:3px solid;background:#ffdf00;padding:6px 14px;font-weight:bold}.wrap{max-width:1260px;margin:auto;padding:65px 28px}.eyebrow{text-transform:uppercase;font-weight:900;letter-spacing:2px;font-size:15px}h1,h2,h3{font-weight:1000;text-transform:uppercase;line-height:1.04;letter-spacing:-2px;margin:18px 0}h1{font-size:clamp(48px,7.4vw,104px)}h2{font-size:clamp(32px,4vw,52px)}h3{font-size:28px;letter-spacing:-1px}p{max-width:650px}.hero{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:40px;min-height:640px}.hero h1 em{font-style:normal;color:#ee242e;text-shadow:3px 3px #111}.hero p{font-size:22px}.panel{border:5px solid;background:#fffdf5;box-shadow:9px 9px #111}.portrait{transform:rotate(3deg);padding:12px;background:#007dc6;position:relative}.portrait img{display:block;width:100%;aspect-ratio:1.22;object-fit:cover;object-position:center}.bubble{position:absolute;right:0;top:-40px;border:4px solid;border-radius:50%;background:white;padding:20px 28px;font-size:24px;font-weight:900;line-height:1.1;text-align:center;transform:rotate(-7deg)}.tag{background:#fffdf5;border:4px solid;padding:12px 16px;font-weight:900;text-align:center;margin-top:12px;text-transform:uppercase}.btn{display:inline-block;padding:13px 22px;border:3px solid;background:#ee242e;color:white;box-shadow:5px 5px #111;text-decoration:none;font-weight:900;text-transform:uppercase;font-size:16px;margin:12px 12px 8px 0;cursor:pointer}.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px #111}.btn.yellow{background:#ffdf00;color:#111}.btn.white{background:#fffdf5;color:#111}.strip{background:#121212;color:#fff;padding:15px;text-align:center;font-size:clamp(16px,2vw,23px);font-weight:900;text-transform:uppercase;letter-spacing:2px}.blue-zone{background:#008dcd;background-image:radial-gradient(#006eaa 1.8px,transparent 1.8px);background-size:11px 11px;border-top:5px solid;border-bottom:5px solid}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.card{padding:28px;display:flex;flex-direction:column;align-items:start}.card p{flex:1}.card:nth-child(2){transform:rotate(-2deg)}.card:nth-child(3){transform:rotate(2deg)}.number{font-size:60px;line-height:1;font-weight:1000;color:#ee242e}.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.split img{width:100%;border:5px solid}.red-zone{background:#ee242e;background-image:radial-gradient(#cd1720 1.8px,transparent 1.8px);background-size:11px 11px}.paper{background:#fffdf5;border:5px solid;border-radius:45px;padding:40px;box-shadow:8px 8px #111}.intro{max-width:850px}.gallery{display:grid;grid-template-columns:1.2fr 1fr;gap:35px;margin:45px 0}.photo{background:white;border:4px solid;padding:13px;box-shadow:8px 8px #111;cursor:zoom-in;transform:rotate(-2deg);width:100%;text-align:left}.photo:nth-child(2){transform:rotate(3deg)}.photo img{width:100%;height:300px;object-fit:cover;display:block}.photo span{display:block;font-weight:800;margin-top:15px}.note{font-size:16px}footer{background:#111;color:white}.footer{padding:40px 28px;max-width:1260px;margin:auto;display:flex;justify-content:space-between;gap:30px}.footer strong{font-size:23px}.footer a{font-size:16px}.footer p{margin:6px 0;font-size:16px}dialog{border:5px solid;padding:15px;max-width:90vw;background:#fffdf5}dialog::backdrop{background:#000c}dialog img{display:block;max-width:80vw;max-height:72vh}dialog button{background:#ffdf00;border:3px solid;font-weight:bold;margin-top:12px;cursor:pointer;padding:6px 15px}:focus-visible{outline:4px solid #12aa67;outline-offset:5px}.contact{overflow-wrap:anywhere} @media(max-width:800px){.nav{flex-wrap:wrap;padding:18px 20px}.menu{display:block}nav{display:none;flex-basis:100%;flex-wrap:wrap;gap:20px}nav.open{display:flex}.wrap{padding:45px 22px}.hero,.split,.gallery{grid-template-columns:1fr}.hero{gap:55px;min-height:0}.hero h1{font-size:64px}.portrait{margin:0 12px 10px}.cards{grid-template-columns:1fr;gap:30px}.card:nth-child(n){transform:none}.paper{padding:25px;border-radius:30px}.footer{flex-direction:column}.photo img{height:auto;max-height:380px}.bubble{font-size:20px;top:-30px}.hero p{font-size:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}} .tracks{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:35px}.tracks audio{width:100%;margin:15px 0}.bio-photo{width:100%;aspect-ratio:1;object-fit:cover;border:3px solid}.band{margin-top:40px}@media(max-width:800px){.tracks{grid-template-columns:1fr}}
/* Hester's original illustrated identity */
.brand{display:flex;align-items:center;gap:15px;transform:none;letter-spacing:-1px}.brand-art{width:105px;height:85px;object-fit:contain}.brand-text{transform:rotate(-3deg);font-size:27px}.brand small{font-size:15px}.hero{position:relative;gap:20px}.portrait.panel{border:0;box-shadow:none;background:transparent;transform:none;padding:30px 0 0}.portrait>img:not(.floating-note){width:100%;height:auto;aspect-ratio:auto;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(7px 8px 0 #111)}.portrait .tag{background:#fffdf5;transform:rotate(-3deg);position:relative;z-index:2;margin:0 30px;font-size:16px}.portrait .bubble{background:transparent url('assets/house-style/speech-bubble.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;width:220px;height:160px;display:flex;align-items:center;justify-content:center;top:-35px;right:0;z-index:3;padding:20px 24px 40px;font-size:22px;transform:rotate(6deg)}.floating-note{position:absolute;object-fit:contain}.note-one{width:65px;height:65px;top:60px;left:0;transform:rotate(-15deg)}.note-two{width:75px;height:80px;bottom:80px;right:-15px;z-index:4;transform:rotate(15deg)}.card-art{height:100px;max-width:150px;object-fit:contain;align-self:center;margin:0 auto 14px}.card:nth-child(2) .card-art{height:100px;width:130px}.cards .card{border-radius:7px}.card h3{letter-spacing:-.7px}.art-feature{display:flex;justify-content:center;align-items:center}.art-feature img{width:min(100%,440px);height:360px;object-fit:contain;border:0;filter:drop-shadow(5px 5px 0 #1113)}.paper{border-radius:15px;position:relative}.music-intro{display:flex;gap:60px;align-items:center}.music-art{width:190px;height:360px;object-fit:contain;order:2;transform:rotate(10deg);margin-left:auto}.contact-layout{display:grid;grid-template-columns:220px 1fr;gap:45px;align-items:center}.contact-art{width:100%;transform:rotate(-8deg)}.band-guitar{float:right;width:250px;max-width:40%;margin:15px}.footer-art{width:90px;height:115px;object-fit:contain}.footer{align-items:center;justify-content:initial}.footer>div:last-child{margin-left:auto}.footer .art-credit{font-size:14px;color:#eee}.gallery .photo img{object-fit:contain;background:#fffdf5}.blue-zone{background-color:#159fda}.red-zone{background-color:#eb202b}.hero:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;background-image:radial-gradient(#ecb500 1.8px,transparent 1.8px);background-size:11px 11px;mask-image:linear-gradient(to left,black,transparent 65%)}
@media(max-width:1000px){.nav{gap:15px}nav{gap:15px}.brand-art{width:80px;height:70px}.brand-text{font-size:23px}.music-art{width:150px}.contact-layout{grid-template-columns:140px 1fr;gap:25px}}@media(max-width:800px){.hero h1{font-size:clamp(44px,10.5vw,68px)}.hero{gap:50px}.portrait.panel{margin:0;padding-top:35px}.portrait .bubble{right:5px;top:-35px;width:195px;height:145px;font-size:20px}.portrait .tag{margin:0 10px}.note-two{right:0;width:50px}.note-one{width:45px;left:0}.music-intro{gap:20px}.music-art{width:90px;height:170px;margin:0}.music-intro h1{font-size:clamp(34px,7vw,60px)}.music-intro .intro{min-width:0}.contact-layout{grid-template-columns:1fr}.contact-art{width:145px;margin:auto}.art-feature img{height:260px}.footer{align-items:start}.footer-art{height:80px;width:75px}.footer>div:last-child{margin-left:0}.band-guitar{width:160px}.brand-art{width:75px;height:65px}.brand-text{font-size:23px}.brand small{font-size:14px}.card-art{height:90px}.hero .eyebrow{font-size:14px;letter-spacing:1px}}
.portrait .floating-note{aspect-ratio:auto;border:0;filter:none}.portrait .note-one{width:65px;height:65px}.portrait .note-two{width:75px;height:80px}@media(max-width:800px){.portrait .note-one{width:45px;height:45px}.portrait .note-two{width:50px;height:55px}}
/* Native WordPress editor blocks */
.wp-block-group{box-sizing:border-box}.wp-block-group.wrap{margin-left:auto;margin-right:auto}.wp-block-group p{margin-top:1em;margin-bottom:1em}.wp-block-image{margin:0}.wp-block-image img{height:auto;max-width:100%}.wp-block-heading{margin-top:18px;margin-bottom:18px}.wp-block-buttons{gap:14px;margin-top:18px}.wp-block-button__link{border:3px solid #121212;border-radius:0!important;background:#ee242e;color:white;box-shadow:5px 5px #111;text-decoration:none;font-weight:900;text-transform:uppercase;font-size:16px;padding:13px 22px}.wp-block-button.white .wp-block-button__link{background:#fffdf5;color:#111}.wp-block-button.yellow .wp-block-button__link{background:#ffdf00;color:#111}.wp-block-button__link:hover{transform:translate(-2px,-2px)}.portrait>figure{position:relative;z-index:1}.portrait>figure img{width:100%;filter:drop-shadow(7px 8px 0 #111);display:block}.portrait>figure.floating-note{position:absolute;z-index:3}.portrait>figure.floating-note img{filter:none;object-fit:contain;width:100%;height:100%}.wp-block-image.card-art{height:100px;max-width:150px;align-self:center}.card-art img{height:100%;width:auto;object-fit:contain}.art-feature figure{width:100%}.art-feature img{display:block;margin:auto}.music-intro>figure.music-art{order:2;flex-shrink:0}.music-art img{height:100%;width:100%;object-fit:contain}.contact-art img{width:100%}.wp-block-image.bio-photo{border:0;aspect-ratio:auto}.bio-photo img{width:100%;aspect-ratio:1;object-fit:cover;border:3px solid #111}.gallery figure.photo{padding:13px;transform:rotate(-2deg);cursor:zoom-in}.gallery figure.photo:nth-child(even){transform:rotate(3deg)}.gallery figure.photo img{width:100%;height:300px;object-fit:contain}.gallery figcaption{font-size:18px;font-weight:800;color:#111}.wp-block-audio{width:100%;margin:15px 0}.wp-block-audio audio{width:100%}.wp-block-image.band-guitar img{width:100%}.page-body:empty{min-height:200px}.js-menu{font:inherit}.empty-page{padding:50px 28px}.musician-card{padding:28px}.musician-card h3{font-size:28px}.wp-block-group.card p{flex:1}@media(max-width:800px){.gallery figure.photo img{height:auto;max-height:400px}.music-intro>figure.music-art{width:90px;height:170px}.wp-block-group.hero{gap:50px}}
.menu-links{display:flex;gap:24px;list-style:none;padding:0;margin:0}.menu-links .current-menu-item>a{border-color:#ee242e}.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{clip:auto;width:auto;height:auto;position:fixed;top:10px;left:10px;padding:12px;background:white;z-index:100000}.wp-block-group.hero{max-width:1260px}.wp-block-group .wrap{width:100%}body.admin-bar header{margin-top:0}.wp-block-group.card>.wp-block-buttons{margin-top:auto}p.bubble{margin:0}.wp-block-image.photo{max-width:100%}@media(max-width:800px){.menu-links{flex-wrap:wrap;gap:20px}nav.open{display:block}.music-intro{display:grid;grid-template-columns:1fr 90px}.music-intro>.intro{grid-column:1;grid-row:1}.music-intro>.music-art{grid-column:2;grid-row:1}}

/* Beheerbare huisstijl */
:root{--jabber-yellow:#ffdf00;--jabber-red:#ee242e;--jabber-blue:#159fda}body{background:var(--jabber-yellow)}.blue-zone{background-color:var(--jabber-blue)}.red-zone{background-color:var(--jabber-red)}.brand-new{width:245px;max-width:42vw;height:auto;max-height:125px;object-fit:contain;display:block}.brand{transform:none}.portrait .bubble{top:-100px;right:-15px;font-size:17px;line-height:1.12;transform:rotate(6deg)}.hero{padding-top:105px}.band-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.event-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.event-gallery figure.photo img{height:230px;object-fit:cover}.footer>div:nth-child(2):empty{display:none}@media(max-width:800px){.brand-new{width:185px;max-width:60vw}.hero{padding-top:80px}.portrait .bubble{top:-75px;right:0;font-size:15px}.band-cards,.event-gallery{grid-template-columns:1fr}}

/* Header: keep illustrated shoe/microphone alongside Hester lettering */
header .brand{display:flex;align-items:center;gap:14px;transform:none;flex-shrink:0}header .brand-art{width:105px;height:95px;object-fit:contain;flex-shrink:0}header .brand-new{width:210px;max-width:32vw;max-height:110px;object-fit:contain}@media(max-width:800px){header .brand{gap:7px}header .brand-art{width:65px;height:65px}header .brand-new{width:150px;max-width:45vw}}

/* 2.1: Alleen gerichte correcties; bestaande kleurblokken en typografie behouden. */
header .brand-art{width:105px;height:95px;object-fit:contain}header .brand-new{width:210px;max-width:32vw;object-fit:contain}
.event-gallery figure.photo img{object-fit:contain!important;background:#fffdf5}
@media(max-width:800px){header .brand-art{width:65px;height:65px}header .brand-new{width:150px;max-width:45vw}}

/* Version 2.2: illustrated interior pages; homepage preserved */
body:not(.home) .page-body{background-image:radial-gradient(#e7b900 2px,transparent 2px);background-size:22px 22px;background-position:8px 8px}
body:not(.home) .page-body>.wrap:nth-child(even){background:#fff9e7;border-top:6px solid #111;border-bottom:6px solid #111;max-width:none;padding-left:max(28px,calc((100vw - 1204px)/2));padding-right:max(28px,calc((100vw - 1204px)/2))}
body:not(.home) .page-body>.wrap:nth-child(3n){background-color:#b8e7d0}
body:not(.home) .page-body>.wrap:nth-child(4n){background-color:#ffd8dc}
body:not(.home) .page-body>.wrap:first-child{position:relative}
body:not(.home) .page-body>.wrap:first-child:after{content:"";position:absolute;right:3%;top:35px;width:115px;height:115px;background:url('assets/house-style/note-red.png') center/contain no-repeat;pointer-events:none;transform:rotate(16deg)}
body:not(.home) .page-body>.wrap:first-child>h1{padding-right:125px}
body:not(.home) .page-body .panel{background:#fffdf5}
body:not(.home) .page-body .event-gallery{gap:24px}
body:not(.home) .page-body .event-gallery .photo img{object-fit:contain;background:#fffdf5}
body:not(.home) .page-body .media-music{max-width:none;background:#159fda;background-image:radial-gradient(#fff7 2px,transparent 2px);background-size:23px 23px;border-top:6px solid #111}
.media-music>.tracks{max-width:1204px;margin-left:auto;margin-right:auto}.track-card{padding:24px;transform:rotate(-1deg)}.track-card:nth-child(even){transform:rotate(1deg)}.track-card h3{font-size:22px}
body:not(.home) .page-body .band-members{position:relative}.band-members:before{content:"";display:block;float:right;width:155px;height:150px;background:url('assets/house-style/guitar.png') center/contain no-repeat;transform:rotate(12deg)}
body:not(.home) .page-body .contact-layout:before{content:"";position:absolute;right:3%;width:110px;height:110px;background:url('assets/house-style/double-green.png') center/contain no-repeat;pointer-events:none}
@media(max-width:800px){body:not(.home) .page-body>.wrap:first-child:after{width:60px;height:60px;right:5px;top:10px}body:not(.home) .page-body>.wrap:first-child>h1{padding-right:40px}.band-members:before{width:85px;height:90px}}

/* 2.3: blue singers, red musicians, original illustrated music notes */
body .page-body .sisters-zone,body:not(.home) .page-body>.wrap.sisters-zone{max-width:none;background-color:var(--jabber-blue);background-image:radial-gradient(#006aa355 2px,transparent 2px);background-size:21px 21px;border-top:6px solid #111;border-bottom:6px solid #111;padding-left:max(28px,calc((100vw - 1204px)/2));padding-right:max(28px,calc((100vw - 1204px)/2));position:relative;isolation:isolate}
body .page-body .gentlemen-zone,body:not(.home) .page-body .band-members.gentlemen-zone{max-width:none;background-color:var(--jabber-red);background-image:radial-gradient(#ad0d2555 2px,transparent 2px);background-size:21px 21px;border-top:6px solid #111;border-bottom:6px solid #111;padding-left:max(28px,calc((100vw - 1204px)/2));padding-right:max(28px,calc((100vw - 1204px)/2));position:relative;isolation:isolate}
.sisters-zone>*,.gentlemen-zone>*{position:relative;z-index:1}
.sisters-zone:before,.gentlemen-zone:after,.media-music:before,.media-music:after{content:"";position:absolute;pointer-events:none;background-position:center;background-size:contain;background-repeat:no-repeat;z-index:0}
.sisters-zone:before{width:110px;height:110px;right:3%;top:10px;background-image:url('assets/house-style/double-yellow.png');transform:rotate(-18deg)}
.gentlemen-zone:after{width:115px;height:115px;left:1%;bottom:8px;background-image:url('assets/house-style/note-yellow.png');transform:rotate(19deg)}
.media-music{position:relative;isolation:isolate}.media-music:before{width:115px;height:115px;right:5%;top:10px;background-image:url('assets/house-style/double-red.png');transform:rotate(16deg)}.media-music:after{width:100px;height:100px;left:2%;bottom:10px;background-image:url('assets/house-style/note-green.png');transform:rotate(-17deg)}
body:not(.home) .page-body>.wrap:first-child:before{content:"";position:absolute;left:2%;bottom:12px;width:85px;height:85px;background:url('assets/house-style/double-green.png') center/contain no-repeat;pointer-events:none;transform:rotate(-15deg)}
body:not(.home) .page-body .contact-layout:after{content:"";position:absolute;right:15%;bottom:2%;width:100px;height:100px;background:url('assets/house-style/note-blue.png') center/contain no-repeat;pointer-events:none;transform:rotate(20deg)}
@media(max-width:800px){.sisters-zone:before,.gentlemen-zone:after,.media-music:before,.media-music:after{width:58px;height:58px;opacity:.8}.sisters-zone:before{right:2%;top:8px}.gentlemen-zone:after{left:1%;bottom:5px}}

/* News cards */
.jabber-news-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:1.5rem;margin:2rem 0}.jabber-news-card{padding:1.5rem}.jabber-news-card img{max-width:100%;height:auto;display:block}.jabber-news-card a{color:inherit}.jabber-news-date{font-size:.85rem;font-weight:700}

/* 2.5: Keep decorative notes away from readable content.
   Older absolute pseudo-elements had no reserved space and covered text. */
body:not(.home) .page-body>.wrap:first-child::before,
body:not(.home) .page-body>.wrap:first-child::after,
body:not(.home) .page-body .contact-layout::before,
body:not(.home) .page-body .contact-layout::after,
.sisters-zone::before,.gentlemen-zone::after,
.media-music::before,.media-music::after{content:none!important;display:none!important}
/* Use unobtrusive, non-overlapping decorative notes in the section borders. */
body:not(.home) .page-body .sisters-zone,
body:not(.home) .page-body .gentlemen-zone,
body:not(.home) .page-body .media-music{border-image:none}
/* Guard against overflow caused by large headings and nested grid children. */
.page-body,.page-body .wrap,.page-body .intro{min-width:0}
.page-body h1,.page-body h2,.page-body h3,.page-body p{overflow-wrap:break-word}