/*
Theme Name: Zang en Zo Studio
Author: Zang en Zo
Description: Eigen licht thema voor Zang en Zo. Ontwerp met aparte inhoudspagina’s, zonder Divi-afhankelijkheid.
Version: 0.3.4
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: zangenzo-studio
*/
@font-face{font-family:Oswald;src:url(assets/oswald.ttf) format('truetype');font-weight:200 700;font-display:swap}
:root{--orange:#ff6900;--teal:#006d73;--ink:#111313;--cream:#eee9e2;--max:1280px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:var(--ink);color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.55}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #0096a1;outline-offset:5px}button{font:inherit}h1,h2,h3{font-family:Oswald,'Arial Narrow',sans-serif;line-height:1.12;margin:0 0 20px;text-transform:uppercase;font-weight:600}h2{font-size:30px}p{margin:0 0 18px}.button{display:inline-flex;align-items:center;justify-content:center;padding:14px 26px;border-radius:3px;color:#171717;background:var(--orange);font-size:14px;font-weight:700;min-height:48px;text-decoration:none}.button:hover{background:#ff832a;text-decoration:none}.button.dark{color:white;background:#141616}.skip{position:absolute;top:-100px;left:20px;z-index:999;background:white;color:black;padding:12px}.skip:focus{top:12px}.site-header{background:#111313}.header-inner{max-width:var(--max);margin:auto;display:flex;align-items:center;gap:28px;padding:16px 48px;min-height:104px}.brand{flex-shrink:0}.brand img{width:51px;height:70px;object-fit:contain;filter:brightness(0) invert(1)}#main-nav{margin-left:auto;display:flex;gap:24px;align-items:center}#main-nav a{font-size:12px;font-weight:600;white-space:nowrap}#main-nav a[aria-current="page"]{color:#ff9a52;text-decoration:underline;text-underline-offset:6px}.header-cta{font-size:12px;padding:12px 19px;white-space:nowrap}.menu-toggle{display:none}.hero{max-width:1600px;margin:auto;position:relative;min-height:455px;overflow:hidden;background:#101112}.hero-photo{position:absolute;right:0;top:0;height:100%;width:66%;object-fit:cover;object-position:50% 35%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#070909 5%,rgba(7,9,9,.94) 29%,rgba(7,9,9,.48) 49%,transparent 72%)}.hero-inner{position:relative;max-width:var(--max);padding:48px 58px 38px;margin:auto;z-index:1}.hero h1{font-size:68px;line-height:1.08;letter-spacing:-1px;margin-bottom:19px}.hero h1 span{color:var(--orange)}.hero p{font-size:19px;line-height:1.45;margin-bottom:24px}.hero-phone{display:block;margin-top:18px;font-size:13px;max-width:400px}.hero-phone span{color:#5ad877;margin-right:8px}.photo-credit{position:absolute;right:16px;bottom:8px;color:white;background:#1119;padding:2px 5px;font-size:10px}.offers{display:grid;grid-template-columns:repeat(3,1fr);max-width:1600px;margin:auto}.offer{position:relative;overflow:hidden;background:var(--orange);color:#121414;padding:33px max(28px,calc((100vw - 1164px)/2));padding-right:28px;min-height:219px}.offer:nth-child(3){padding-left:36px}.offer h2{color:#fff;font-size:32px;text-shadow:0 1px 1px #923700;margin-bottom:15px}.offer p{font-size:16px;line-height:1.4;margin-bottom:16px}.offer a{font-size:14px;font-weight:600;position:relative;z-index:2}.offer.teal{background:var(--teal);color:white;display:flex;gap:24px;padding:31px}.teal h2{margin-bottom:12px;text-shadow:none}.notes{position:absolute;right:15px;bottom:27px;font-size:92px;color:#fff9;transform:rotate(-18deg);letter-spacing:-20px;pointer-events:none}.clef{font-size:138px;line-height:1.1;color:#fff9;font-family:serif}.lesson{display:grid;grid-template-columns:43% 57%;max-width:var(--max);margin:auto;min-height:365px}.lesson-copy{padding:35px 35px 35px 58px}.lesson-copy h2{font-size:29px}.accent{color:#ff8a38}.checklist{list-style:none;padding:0;margin:17px 0 23px;font-size:14px;line-height:1.45}.checklist li{margin:9px 0;padding-left:29px;position:relative}.checklist li:before{content:'✓';position:absolute;left:0;background:var(--orange);color:#111;width:19px;height:19px;border-radius:2px;text-align:center;font-weight:bold}.lesson-photo{margin:0;position:relative;min-height:360px;overflow:hidden}.lesson-photo img{width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.lesson-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#0009,transparent 60%)}.lesson-photo figcaption{position:absolute;z-index:1;bottom:23px;left:28px;font-size:17px}.subtle-link{display:block;font-size:12px;color:#ccc;margin-top:12px}.reviews{background:var(--cream);color:#171919;display:grid;grid-template-columns:63% 37%;padding:18px 5.5%;gap:25px;max-width:1600px;margin:auto}.review-copy{position:relative;padding:9px 30px 13px 0}.review-copy h2{font-size:28px}.quote-mark{position:absolute;left:0;top:48px;color:#d35100;font-size:90px;font-weight:bold;line-height:1}blockquote{margin:0 0 12px 53px;max-width:530px;font-size:15px;font-style:italic}blockquote p{margin-bottom:7px}cite{font-size:13px;font-style:normal}.review-photo{min-height:190px;overflow:hidden}.review-photo img{height:100%;width:100%;object-fit:cover;filter:grayscale(1);max-height:235px}.more-reviews{margin-left:53px;font-size:13px;color:#984000}.more-reviews blockquote{color:#171919;margin:20px 0}.erica{max-width:var(--max);margin:auto;padding:34px 58px;display:grid;grid-template-columns:43% 57%;gap:25px;border-bottom:1px solid #ffffff17}.erica h2{font-size:27px;line-height:1.25}.eyebrow{font-size:10px;letter-spacing:1.8px;color:#ff994f;font-weight:700;margin-bottom:13px}.erica p:not(.eyebrow){font-size:14px;color:#dedbd7}.music-links{display:flex;gap:25px;color:#ff994f;font-size:13px;margin:14px 0}details{font-size:13px}summary{cursor:pointer;padding:5px 0}.location{max-width:var(--max);margin:auto;display:grid;grid-template-columns:26% 74%;padding:15px 42px 15px 58px;gap:22px}.location h2{font-size:24px;margin-bottom:12px}.location-copy{padding:10px 0}.location-copy p{font-size:13px;line-height:1.6;margin-bottom:13px}.location-copy .accent{font-size:15px;line-height:1.4}.location-address{color:#bebdb8;font-size:11px!important}.location-gallery{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:7px;min-height:265px}.location-gallery img{height:100%;width:100%;object-fit:cover;max-height:330px}.location-gallery .gate{object-position:30% center}.outline-button{display:inline-block;border:1px solid var(--orange);padding:5px 14px;border-radius:3px;font-size:14px}.closing{background:var(--orange);color:#111}.closing-inner{max-width:var(--max);margin:auto;display:flex;align-items:center;gap:25px;padding:20px 58px}.closing h2{color:#fff;font-size:24px;margin-bottom:6px;text-shadow:0 1px 1px #923700}.closing p{font-size:14px;margin:0}.closing .button{margin-left:auto;white-space:nowrap}.closing-phone{font-size:12px;min-width:130px}.calendar{font-size:45px;line-height:1}.footer-inner{max-width:var(--max);margin:auto;padding:28px 58px;display:flex;align-items:flex-start;justify-content:space-between;gap:28px}.footer-inner p{font-size:12px;line-height:1.8;color:#d4d4d1;margin:0}.content-page{background:var(--cream);color:#222;min-height:65vh;padding:55px max(25px,calc((100vw - 1000px)/2))}.content-page h1{font-size:48px;line-height:1.15}.content-page .eyebrow{color:#964000}.legacy-content{font-size:16px;line-height:1.65;overflow-wrap:anywhere}.legacy-content p{margin:16px 0}.legacy-content img{max-height:500px;width:auto;margin:18px 0}.legacy-content iframe,.legacy-content video{display:block;width:100%;max-width:800px;aspect-ratio:16/9;height:auto;border:0;margin:20px 0}.legacy-content a{color:inherit;text-decoration:underline}.legacy-content h2,.legacy-content h3{margin-top:35px}.legacy-content table{max-width:100%;border-collapse:collapse}.legacy-content td{padding:8px;border-bottom:1px solid #999}.legacy-content:after{content:'';display:table;clear:both}
@media(min-width:1600px){.offer{padding-left:70px}.reviews{padding-left:calc((1600px - 1164px)/2);padding-right:calc((1600px - 1164px)/2)}}
@media(max-width:1150px){.header-inner{padding:13px 30px;gap:18px}#main-nav{gap:17px}#main-nav a{font-size:11px}.hero-inner{padding-left:56px}.offer{padding-left:36px}.clef{font-size:110px}.offer.teal{gap:15px}.location{grid-template-columns:26% 1fr;padding-right:25px}.closing-inner{gap:20px}.calendar{display:none}.closing h2{font-size:21px}.closing-phone{min-width:112px}}
@media(max-width:900px){.header-inner{padding:13px 24px;min-height:86px;flex-wrap:wrap}.brand img{height:58px;width:43px}.menu-toggle{display:block;margin-left:auto;background:transparent;color:white;border:1px solid #777;border-radius:3px;padding:8px 12px}#main-nav{display:none;order:4;width:100%;margin:0;flex-wrap:wrap;padding:15px 0;gap:20px}#main-nav.open{display:flex}#main-nav a{font-size:14px}.header-cta{font-size:12px}.hero h1{font-size:60px}.hero-inner{padding-left:35px}.hero-photo{width:80%}.hero-shade{background:linear-gradient(90deg,#080a0a 1%,#080a0ae8 28%,#080a0a44 70%)}.offer{padding:27px 23px;min-height:210px}.offer h2{font-size:28px}.offer p{font-size:14px}.offer.teal{padding:27px 23px}.clef{display:none}.notes{font-size:64px;right:13px;bottom:15px}.lesson-copy{padding:30px}.lesson-copy h2{font-size:25px}.lesson{grid-template-columns:48% 52%}.reviews{grid-template-columns:60% 1fr;padding:20px 30px;gap:15px}.review-copy h2{font-size:23px}.erica{padding:30px;grid-template-columns:40% 1fr;gap:20px}.erica h2{font-size:23px}.location{padding:20px 30px;grid-template-columns:30% 1fr;gap:15px}.location-gallery{grid-template-columns:1fr 1fr}.location-gallery img:last-child{display:none}.closing-inner{padding:20px 30px;flex-wrap:wrap}.closing-phone{display:none}.footer-inner{padding:30px;flex-wrap:wrap}.footer-inner p{flex-basis:38%}}
@media(max-width:600px){.header-inner{padding:12px 20px;gap:14px}.header-cta{padding:10px 12px;min-height:42px;font-size:11px}.menu-toggle{font-size:12px}.hero{min-height:580px}.hero-photo{width:100%;height:340px;object-position:center top}.hero-shade{background:linear-gradient(0deg,#090b0b 5%,#090b0b 35%,#090b0b44 69%,transparent)}.hero-inner{padding:275px 25px 30px}.hero h1{font-size:53px;letter-spacing:-.5px;margin-bottom:14px}.hero p{font-size:16px}.hero-phone{font-size:12px}.photo-credit{top:8px;bottom:auto;font-size:8px}.offers{grid-template-columns:1fr}.offer,.offer:nth-child(3),.offer.teal{padding:26px 27px;min-height:175px}.offer.teal{display:flex;gap:24px}.clef{display:block;font-size:108px}.offer h2{font-size:29px}.offer p{margin-bottom:10px}.offer.teal h2 br{display:none}.notes{font-size:98px;right:38px;bottom:16px}.lesson{grid-template-columns:1fr}.lesson-copy{padding:32px 27px}.lesson-photo{min-height:260px}.reviews{grid-template-columns:1fr;padding:25px 27px;gap:10px}.review-copy{padding-right:0}.review-copy h2{font-size:27px}.review-photo{display:none}blockquote{margin-left:38px}.more-reviews{margin-left:38px}.quote-mark{top:52px;font-size:74px}.erica{grid-template-columns:1fr;padding:30px 27px;gap:0}.erica h2{font-size:28px}.location{grid-template-columns:1fr;padding:25px 27px;gap:15px}.location-gallery{min-height:225px}.location-gallery img{height:225px}.location-copy p{max-width:330px}.closing-inner{padding:25px 27px;gap:16px}.closing h2{font-size:26px}.closing .button{margin-left:0}.footer-inner{padding:30px 27px;gap:25px}.footer-inner .brand{flex-basis:100%}.footer-inner p{flex-basis:100%;font-size:13px}.content-page h1{font-size:36px}.content-page{padding:35px 24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Consistente uitlijning van de ontwerpstroken. */
.hero,.offers,.reviews{max-width:var(--max)}.hero-photo{object-position:center 15%}.hero-shade{background:linear-gradient(90deg,#080a0a 5%,#080a0aeb 30%,#080a0a60 52%,transparent 77%)}.offer{padding-left:45px}.reviews{padding-left:58px;padding-right:58px}.erica{grid-template-columns:40% minmax(0,1fr)}
@media(max-width:900px){.offer{padding-left:25px}.reviews{padding-left:30px;padding-right:30px}.erica{grid-template-columns:40% minmax(0,1fr)}}
@media(max-width:600px){.hero-shade{background:linear-gradient(0deg,#090b0b 5%,#090b0b 35%,#090b0b44 69%,transparent)}.offer,.reviews{padding-left:27px;padding-right:27px}.erica{grid-template-columns:1fr}}

/* Logo en vaste paginabreedte — 9 september 2026 */
.header-inner{padding:14px 58px;min-height:140px}
.site-header .brand img{width:83px;height:112px}
.content-page{max-width:var(--max);margin-inline:auto;padding:55px 58px}
@media(max-width:1100px){.header-inner{padding:14px 35px;flex-wrap:wrap;gap:18px;min-height:124px}.site-header .brand img{width:71px;height:96px}.menu-toggle{display:block;margin-left:auto;background:transparent;color:white;border:1px solid #777;border-radius:3px;padding:8px 12px}#main-nav{display:none;order:4;width:100%;margin:0;flex-wrap:wrap;padding:15px 0;gap:20px}#main-nav.open{display:flex}#main-nav a{font-size:14px}.content-page{padding:40px 35px}}
@media(max-width:600px){.header-inner{padding:12px 25px;gap:12px;min-height:106px}.site-header .brand img{width:61px;height:82px}.content-page{padding:35px 25px}}

/* Achterliggende pagina’s */
.content-page{padding:0}.subpage-heading{background:#111313;color:white;padding:45px 58px;border-bottom:5px solid var(--orange)}.subpage-heading .eyebrow{color:#ff994f}.subpage-heading h1{margin:0}.content-page .legacy-content{padding:40px 58px}.page-lead{font-size:23px;line-height:1.5;max-width:850px;margin:0 0 35px!important}.detail-section{margin-bottom:38px}.detail-section h2{font-size:29px}.detail-section p{max-width:850px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px}.detail-grid .detail-section{background:#fff8;padding:25px;border-top:3px solid #006d73}.detail-grid h2{margin-top:0}.text-link{font-weight:bold;text-decoration:underline;text-underline-offset:4px;display:inline-block;margin:10px 15px 10px 0}.fact-strip{display:flex;gap:35px;background:#006d73;color:white;padding:22px 28px;margin-bottom:35px}.fact-strip p{margin:0;flex:1}.fact-strip strong{font-family:Oswald,sans-serif;font-size:25px}.review-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.review-card{background:white;border-top:4px solid var(--orange);padding:28px;margin:0;max-width:none}.review-card cite{font-weight:bold;display:block;margin-top:18px}.faq-item{border-bottom:1px solid #ccc;padding:15px 0;font-size:16px}.faq-item summary{font-size:20px;font-weight:bold}.contact-large{font-family:Oswald,sans-serif;font-size:30px}.contact-gate{width:100%!important;max-height:480px!important;object-fit:cover;object-position:30% center}.erica-page{max-width:var(--max);margin:auto}.erica-video-hero{position:relative;height:560px;background:#080909;overflow:hidden}.erica-video-hero video{width:100%;height:100%;object-fit:cover}.video-shade{position:absolute;inset:0;background:linear-gradient(90deg,#080909e8,#08090955 55%,transparent);pointer-events:none}.video-heading{position:absolute;top:50%;left:58px;transform:translateY(-50%);max-width:650px}.video-heading h1{font-size:70px}.video-heading h1 span{color:#ff790b}.video-heading p{font-size:19px}.video-actions{display:flex;gap:14px;align-items:center}.video-actions button{cursor:pointer;border:0}.video-pause{padding:12px;background:#111b;color:white;border:1px solid #eee!important;border-radius:3px}.erica-story{padding:45px 58px;background:var(--cream);color:#222}.erica-story p{max-width:850px}.erica-story .detail-section:first-child p{line-height:1.8}.music-panel{background:#006d73;color:white;padding:30px;display:flex;gap:25px;justify-content:space-between;align-items:center;margin:25px 0}.music-panel h3{font-size:28px}.music-panel p{margin:0}.music-panel .eyebrow{color:white;margin-bottom:15px}.portrait-video{width:100%;max-width:850px;aspect-ratio:16/9;border:0}.erica-video-hero.watching .video-heading{display:none}.erica-video-hero.watching .video-shade{display:none}.erica-video-hero.watching video{object-fit:contain}.legacy-content a.button{text-decoration:none}
@media(max-width:1100px){.subpage-heading,.erica-story{padding:35px}.content-page .legacy-content{padding:35px}.video-heading{left:35px}.video-heading h1{font-size:60px}}
@media(max-width:600px){.subpage-heading,.erica-story{padding:30px 25px}.content-page .legacy-content{padding:30px 25px}.detail-grid,.review-grid{grid-template-columns:1fr}.page-lead{font-size:20px}.fact-strip,.music-panel{flex-direction:column;align-items:flex-start;gap:15px}.erica-video-hero{height:530px}.video-heading{left:25px;right:20px;top:auto;bottom:30px;transform:none}.video-heading h1{font-size:50px}.video-heading p{font-size:16px}.video-heading .eyebrow{font-size:11px}.video-shade{background:linear-gradient(0deg,#080909 4%,#08090999 60%,transparent)}.video-actions{flex-wrap:wrap}.video-actions .button{padding:12px 18px}}

/* Erica vrij in beeld; introductie links, video gespiegeld. */
@media(min-width:801px){.erica-video-hero .video-heading{left:58px;right:auto;width:45%;max-width:560px}.erica-video-hero .video-shade{background:linear-gradient(90deg,#080909ee 0%,#080909aa 28%,#08090922 60%,transparent 78%)}.video-heading h1{font-size:clamp(48px,5vw,70px)}}
@media(min-width:601px) and (max-width:800px){.video-heading{max-width:calc(100% - 70px)}}
/* Alleen achtergrondvideo, zonder bedieningsknoppen. */
.erica-video-hero .video-actions{display:none}

/* Afronding: leesbare tabellen, fotoarchief en toetsenbordbediening. */
.table-scroll{overflow-x:auto;margin:20px 0}.price-table{width:100%;font-size:16px;background:#fff8}.price-table caption{text-align:left;font-weight:bold;margin-bottom:12px}.price-table th,.price-table td{padding:15px;text-align:left;border-bottom:1px solid #bbb;vertical-align:top}.price-table thead{background:#006d73;color:white}.price-table small{display:block;font-size:12px}.price-table tbody th{font-weight:600}.wide-photo{margin:25px 0 40px}.wide-photo img{width:100%;max-height:380px;object-fit:cover}.wide-photo figcaption{font-size:13px}.archive-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.archive-gallery img{width:100%;height:220px;object-fit:contain;background:#ded8d0;margin:0}.business-address{border-top:1px solid #bbb;padding-top:25px}.youtube-player{background:#101616;color:white;max-width:850px;padding:35px;min-height:250px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.youtube-player:has(iframe){padding:0}.video-notice{font-size:13px;margin:16px 0 0}.offer:not(.teal) h2,.closing h2{color:#151616;text-shadow:none}.legacy-content :is(h2,h3){scroll-margin-top:25px}.legacy-content .archive-gallery img{margin:0}.footer-inner a{display:inline-block;min-height:28px}.content-page .legacy-content>section>img{display:inline-block;max-width:45%;vertical-align:top;margin-right:3%}.content-page .legacy-content a:not(.button):hover{color:#884000}.legacy-content .text-link{margin-bottom:16px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #099eae;box-shadow:0 0 0 6px #fff;outline-offset:2px}.music-panel{flex-wrap:wrap}.music-panel .button{flex-shrink:0}
@media(max-width:600px){.price-table{font-size:13px}.price-table th,.price-table td{padding:11px 8px}.price-table small{font-size:11px}.archive-gallery{grid-template-columns:1fr 1fr}.archive-gallery img{height:180px}.youtube-player{padding:25px}.content-page .legacy-content>section>img{max-width:100%;margin-right:0}.header-inner{gap:10px}.header-cta{padding:10px}.video-heading{max-width:calc(100% - 45px)}}


.erica-video-hero video{transform:scaleX(-1)}.location-gallery{grid-template-columns:1fr 1fr}.review-photo img{object-position:65% center;filter:none}@media(max-width:900px){.location-gallery img:last-child{display:block}}

/* Leesbaardere hoofdnavigatie. */
@media(min-width:1101px){#main-nav{gap:20px}#main-nav a{font-size:14px}.header-inner{gap:22px}}
@media(min-width:1101px) and (max-width:1190px){.header-inner{padding-left:35px;padding-right:35px}#main-nav{gap:16px}}
