/* Colors and fonts taken from the original Wix site */
:root {
  --blue: #170df2;
  --blue-80: rgba(23, 13, 242, .8);
  --pink: #ffadff;
  --pink-light: #ffebff;
  --yellow: #f9ff06;
  --lavender: #afacfb;
  --grey: #bfbfbf;
  --sky: #3d9be9;
  --navy-link: #221f7b;
  --ink: #000;
  --ink-2: #404040;
  --white: #fff;
  --anton: Anton, Impact, "Arial Narrow Bold", sans-serif;
  --questrial: Questrial, "Helvetica Neue", Arial, sans-serif;
  --syne: Syne, "Helvetica Neue", Arial, sans-serif;
  --avenir: "Nunito Sans", Avenir, "Helvetica Neue", Arial, sans-serif;
  --helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --times: "Times New Roman", Times, serif;
  --gutter: max(16px, env(safe-area-inset-left, 0px));
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--white); color: var(--ink); font: 400 16px/1.6 var(--questrial); }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0 0 .4em; font-weight: 400; line-height: 1.15; }
p { margin: 0 0 1em; }
.small { font-size: 13px; }
.skip { position: absolute; left: -999px; top: 8px; background: #000; color: #fff; padding: 8px 14px; z-index: 50; }
.skip:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.wrap { max-width: 1000px; margin: 0 auto; padding-left: var(--gutter); padding-right: max(16px, env(safe-area-inset-right, 0px)); }

/* ---------- header ---------- */
.site-header { background: var(--white); position: relative; z-index: 20; }
.header-inner { max-width: 1180px; margin: 0 auto; min-height: 115px; display: flex; align-items: center; gap: 24px; padding: 0 var(--gutter); }
.logo img { width: 130px; height: auto; }
nav ul { list-style: none; display: flex; margin: 0; padding: 0; }
nav li + li { border-left: 1px solid #000; }
nav a { display: block; padding: 6px 12px; font: 400 15px/1.2 var(--anton); color: #000; text-decoration: none; }
nav a:hover { color: var(--blue); }
nav a[aria-current] { color: #7a7a7a; }
.lang-switch { margin-left: auto; display: flex; border-radius: 22px; box-shadow: 0 1px 6px rgba(0,0,0,.25); overflow: hidden; }
.lang-switch a { padding: 9px 13px; font: 13px var(--helvetica); text-decoration: none; color: #000; }
.lang-switch a[aria-current] { background: #000; color: #fff; }
.menu-toggle { display: none; margin-left: auto; background: none; border: 1px solid #000; font: 15px var(--anton); padding: 6px 14px; cursor: pointer; }
@media (max-width: 1000px) {
  .header-inner { flex-wrap: wrap; min-height: 80px; padding-block: 12px; }
  .menu-toggle { display: block; }
  .lang-switch { margin-left: 0; }
  nav { display: none; flex-basis: 100%; }
  nav.open { display: block; }
  nav ul { flex-direction: column; }
  nav li + li { border-left: 0; border-top: 1px solid #000; }
  nav a { padding: 12px 0; font-size: 18px; }
}

/* ---------- buttons ---------- */
.btn-blue { display: inline-block; background: var(--blue); color: #fff; text-decoration: none; font: 14px var(--avenir); padding: 10px 28px; border: 0; cursor: pointer; }
.btn-blue:hover { background: #4b43f5; }
.btn-blue.wide { display: block; width: 100%; text-align: center; }
.btn-black { display: inline-block; background: #000; color: #fff; font: 22px var(--syne); padding: 8px 32px; text-decoration: none; }
.btn-outline-white { display: inline-block; border: 1px solid #fff; color: #fff; text-decoration: none; padding: 8px 18px; font: 14px var(--avenir); }
.btn-outline-white:hover { background: rgba(255,255,255,.15); }
.btn-white-outline { display: inline-block; background: #fff; border: 1px solid var(--blue); color: var(--blue); padding: 8px 14px; font: 14px var(--avenir); text-decoration: none; }
.link-more { font: 600 15px Jost, var(--avenir); letter-spacing: 2.4px; color: var(--navy-link); text-decoration: none; }

/* ---------- home ---------- */
.hero-blue { background: var(--blue); color: #fff; padding: 30px 0 34px; }
.hero-blue h1 { font: 66px/1 var(--anton); letter-spacing: 3.3px; margin: 0 0 22px; }
.hero-blue .quote { text-align: right; margin: 26px 0 0; font: 20px/1.35 var(--anton); }
.hero-blue .quote em { display: block; }
.slideshow { position: relative; aspect-ratio: 954 / 393; background: #2f2e2e; overflow: hidden; }
.slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); opacity: 0; transition: opacity .8s; }
.slide.is-active { opacity: 1; }
.slide-nav { position: absolute; top: 50%; transform: translateY(-50%); background: none; border: 0; color: #fff; font: 44px/1 var(--helvetica); cursor: pointer; padding: 8px 14px; text-shadow: 0 1px 6px rgba(0,0,0,.5); }
.slide-nav.prev { left: 4px; } .slide-nav.next { right: 4px; }
.slide-count { position: absolute; right: 14px; bottom: 10px; color: #fff; font: 13px var(--helvetica); text-shadow: 0 1px 4px rgba(0,0,0,.6); }
@media (max-width: 700px) { .hero-blue h1 { font-size: 44px; } .slideshow { aspect-ratio: 4 / 3; } .slide { object-position: var(--pos-m, 50% 50%); } }

.pink-intro { background: var(--pink); padding: 60px 0; }
.pink-intro .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pink-intro .text { font: 300 15px/1.55 var(--avenir); }
.pink-intro .text .link-more { display: block; text-align: center; margin-top: 18px; }
.pink-intro blockquote { margin: 0; font: 46px/1.15 var(--anton); }
@media (max-width: 760px) { .pink-intro .grid { grid-template-columns: 1fr; } .pink-intro blockquote { font-size: 34px; } }

.yellow-feature { background: var(--yellow); text-align: center; padding: 70px 0; }
.yellow-feature h2 { font: 56px/1.05 var(--times); margin: 0; }
.yellow-feature .sub { font: 32px/1.3 var(--times); margin: 4px 0 26px; }
.yellow-feature p { font: 300 15px var(--avenir); margin: 0 0 6px; }
.yellow-feature .btn-blue { margin-top: 20px; }
@media (max-width: 600px) { .yellow-feature h2 { font-size: 40px; } .yellow-feature .sub { font-size: 24px; } }

.lavender-feature { background: var(--lavender); padding: 56px 0; }
.lavender-feature .grid { display: grid; grid-template-columns: 300px 1fr; gap: 56px; align-items: start; }
.lavender-feature h2 { font: 66px/1 var(--anton); margin: 18px 0 30px; }
.lavender-feature p { font: 15px/1.6 var(--questrial); }
.lavender-feature .read-more { font-weight: 700; color: #000; }
.dates { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 26px; font: 14px/1.5 var(--questrial); }
.dates strong { font: 700 15px var(--syne); display: block; }
/* (former Conversazione block) */
@media (max-width: 760px) { .lavender-feature .grid { grid-template-columns: 1fr; } .lavender-feature h2 { font-size: 46px; } }

.concert-band {
  padding: 80px 0 60px;
  background:
    radial-gradient(circle at 3.7% 6.9%, rgb(77, 96, 1) 0%, 11.55%, rgba(77, 96, 1, 0) 35%),
    radial-gradient(circle at 93% 9.6%, rgb(250, 170, 99) 0%, 17.5%, rgba(250, 170, 99, 0) 35%),
    radial-gradient(circle at 95.2% 90.5%, rgb(201, 198, 255) 0%, 34.1%, rgba(201, 198, 255, 0) 55%),
    radial-gradient(circle at 4.3% 93.3%, rgb(151, 180, 157) 0%, 29.9%, rgba(151, 180, 157, 0) 65%),
    radial-gradient(circle at 46.6% 11.5%, rgba(214, 222, 72, .99) 0%, 25%, rgba(214, 222, 72, 0) 50%),
    radial-gradient(circle at 51.1% 90%, rgb(147, 195, 255) 0%, 42%, rgba(147, 195, 255, 0) 70%),
    #fff;
}
.concert-band .grid { display: grid; grid-template-columns: 1fr 200px; gap: 40px; }
.concert-band h2 { font: 35px/1.1 var(--anton); }
.concert-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.concert-list li { font: 22px/1.25 var(--syne); color: var(--ink-2); }
.concert-list time { display: block; font-weight: 700; }
.concerts h3 { font: 26px var(--anton); color: var(--ink-2); margin: 34px 0 16px; }
.concert-list.past li { font-size: 18px; }
.no-upcoming { font: 22px var(--syne); color: var(--ink-2); }
.and-more { text-align: right; font: 22px var(--syne); color: var(--ink-2); margin-top: 24px; }
@media (max-width: 760px) { .concert-band .grid { grid-template-columns: 1fr; } .concert-band h2 { order: -1; } .concert-list li { font-size: 18px; } }

.insta { background: var(--blue-80); padding: 56px 0 50px; color: #fff; overflow: hidden; }
.insta-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-bottom: 30px; }
.insta h2 { font: 41px/1.1 var(--anton); margin: 0; }
.insta-profile { display: flex; align-items: center; gap: 12px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.35); border-radius: 40px; padding: 6px 6px 6px 6px; }
.insta-profile img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; border: 2px solid #ff7ab8; }
.insta-profile strong { display: block; font: 600 15px Poppins, sans-serif; }
.insta-profile span { font: 12px var(--avenir); opacity: .85; }
.btn-follow { background: #fff; color: var(--blue); font: 600 14px Poppins, sans-serif; padding: 9px 20px; border-radius: 30px; text-decoration: none; margin-left: 6px; }
.btn-follow:hover { background: var(--pink); color: #000; }
.shorts-wrap { position: relative; }
.shorts { --edge: max(16px, calc((100vw - 1000px) / 2 + 16px)); display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--edge); padding: 4px var(--edge) 18px; scrollbar-width: none; }
.shorts::-webkit-scrollbar { display: none; }
.short { position: relative; flex: 0 0 auto; width: clamp(180px, 22vw, 240px); aspect-ratio: 9 / 16; margin: 0; border-radius: 14px; overflow: hidden; background: #000; scroll-snap-align: start; box-shadow: 0 10px 28px -12px rgba(0,0,0,.55); }
.short video { width: 100%; height: 100%; object-fit: cover; display: block; }
.short:nth-child(5) video { object-fit: contain; }
.short-play { position: absolute; inset: 0; background: linear-gradient(transparent 60%, rgba(0,0,0,.45)); border: 0; cursor: pointer; padding: 0; }
.short.playing .short-play { opacity: 0; pointer-events: none; }
.short-ig { position: absolute; right: 10px; top: 10px; width: 22px; height: 22px; color: #fff; pointer-events: none; filter: drop-shadow(0 1px 3px rgba(0,0,0,.6)); }
.short-ig svg { width: 100%; height: 100%; }
.shorts-nav { position: absolute; top: calc(50% - 9px); transform: translateY(-50%); z-index: 2; width: 46px; height: 46px; border-radius: 50%; border: 0; background: #fff; color: var(--blue); font: 22px var(--helvetica); cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.3); }
.shorts-nav.prev { left: max(10px, calc((100vw - 1000px) / 2 - 56px)); }
.shorts-nav.next { right: max(10px, calc((100vw - 1000px) / 2 - 56px)); }
.insta-foot { display: flex; justify-content: center; flex-direction: column; align-items: center; gap: 18px; margin-top: 16px; }
.insta-sub { font: 26px var(--anton); align-self: flex-start; margin: 20px 0 0; }
.insta-foot behold-widget { width: 100%; }
@media (max-width: 600px) { .shorts-nav { display: none; } .insta h2 { font-size: 34px; } .insta-profile { width: 100%; } .btn-follow { margin-left: auto; } }

.video-band h2 { background: var(--grey); margin: 0; padding: 20px var(--gutter) 14px; font: 41px var(--anton); }
.video-band h2 span { display: block; max-width: 1000px; margin: 0 auto; }
.feature-video { position: relative; background: #000; }
.yt.big { aspect-ratio: 16 / 7; width: 100%; display: grid; place-items: center; border: 0; cursor: pointer; background: #000 center / cover no-repeat; position: relative; }
.yt.big::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.35); }
.play-label { position: relative; display: inline-flex; align-items: center; gap: 10px; color: #fff; font: 15px var(--avenir); text-decoration: underline; }
.play-ring { width: 30px; height: 30px; border: 1.5px solid #fff; border-radius: 50%; position: relative; }
.play-ring::after { content: ""; position: absolute; left: 10px; top: 7px; border-style: solid; border-width: 6px 0 6px 9px; border-color: transparent transparent transparent #fff; }
.feature-video .btn-outline-white { position: absolute; left: 50%; bottom: 7%; transform: translateX(-50%); }
.feature-video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; }
@media (max-width: 600px) { .yt.big { aspect-ratio: 16 / 10; } }

.contact { display: grid; grid-template-columns: 1fr 2fr; }
.contact-left { background: #000; color: #fff; text-align: center; padding: 60px 24px; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.contact-left h2 { font: 41px var(--anton); }
.contact-left .mail { font: 14px var(--avenir); word-break: break-all; }
.contact-right { background: var(--lavender); padding: 56px clamp(16px, 6vw, 80px); }
@media (max-width: 760px) { .contact { grid-template-columns: 1fr; } }

/* forms */
.form { display: grid; gap: 14px; max-width: 560px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form label { display: grid; gap: 4px; font: 13px var(--avenir); }
.form input, .form textarea { font: 15px var(--avenir); padding: 8px 10px; border: 1px solid #000; border-radius: 0; background: #fff; width: 100%; }
.form textarea { min-height: 90px; }
@media (max-width: 480px) { .form-row { grid-template-columns: 1fr; } }

/* socials */
.socials { display: flex; gap: 14px; margin-top: 10px; }
.socials a { width: 26px; height: 26px; display: grid; place-items: center; }
.socials svg { width: 26px; height: 26px; }
.socials.white a { color: #fff; }
.socials.color .s-instagram { color: #ff7ab8; } .socials.color .s-facebook { color: #fff; } .socials.color .s-youtube { color: #ff2a2a; }

/* footer */
.site-footer { background: #fff; text-align: center; padding: 50px 16px 60px; font: 14px var(--avenir); }
.site-footer a { text-decoration: none; }
.site-footer p { margin: 0 0 22px; }

/* ---------- biography ---------- */
.bio { display: grid; grid-template-columns: 1fr 1fr; }
.bio-photo img { position: sticky; top: 0; width: 100%; height: 100vh; object-fit: cover; }
.bio-text { background: var(--pink); padding: 56px clamp(16px, 4vw, 48px) 80px; font: 14px/1.5 var(--questrial); }
.bio-text h1 { font: 28px var(--questrial); margin-bottom: 26px; }
.bio-text p, .bio-text .downloads { max-width: 380px; }
.bio-text .downloads { margin-top: 36px; }
.downloads { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.downloads a { color: #000; }
@media (max-width: 760px) { .bio { grid-template-columns: 1fr; } .bio-photo img { position: static; height: 70vh; } }

/* ---------- music ---------- */
.music-page { background: linear-gradient(180deg, #e9dccd 0%, #cdb9a4 30%, #6d5444 70%, #3a2a22 100%); padding: 40px 0 80px; }
.videos { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 24px; max-width: 1180px; margin: 0 auto; padding: 0 var(--gutter); }
.video { margin: 0; text-align: center; min-width: 0; }
.yt { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; cursor: pointer; background: #000 center / cover no-repeat; position: relative; padding: 0; }
.video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; }
.play { position: absolute; left: 50%; top: 50%; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; border: 2px solid #fff; background: rgba(0,0,0,.25); }
.play::after { content: ""; position: absolute; left: 19px; top: 14px; border-style: solid; border-width: 11px 0 11px 16px; border-color: transparent transparent transparent #fff; }
.video figcaption { padding: 10px 6px 0; font: 14px var(--avenir); color: #111; }
.video figcaption strong { display: block; font-weight: 400; font-size: 15px; }
.video figcaption span { font-style: italic; font-size: 12px; }
.music-page .video:nth-child(n+3) figcaption { color: #f1e8de; }
@media (max-width: 760px) {
  .videos { grid-template-columns: 1fr; }
  .music-page { background: linear-gradient(180deg, #e9dccd 0%, #cdb9a4 100%); }
  .music-page .video figcaption, .music-page .video:nth-child(n+3) figcaption { color: #111; }
}

.player { max-width: 790px; margin: 60px auto 0; background: #fff; padding: 22px 26px 10px; font: 13px var(--avenir); }
.player-top { display: grid; grid-template-columns: 120px 70px 1fr; gap: 18px; align-items: center; }
.player-top img { width: 120px; height: 120px; object-fit: cover; }
.player-play { width: 56px; height: 56px; border-radius: 50%; border: 1.5px solid #000; background: #fff; cursor: pointer; position: relative; }
.player-play span { position: absolute; left: 21px; top: 17px; border-style: solid; border-width: 10px 0 10px 15px; border-color: transparent transparent transparent #000; }
.player-play.playing span { left: 18px; top: 18px; width: 18px; height: 18px; border: 0; border-left: 6px solid #000; border-right: 6px solid #000; }
.player-meta p { margin: 0 0 2px; }
.player-meta .artist, .player-meta .album { font-style: italic; font-family: var(--times); }
.player-meta .now { font-size: 16px; }
.progress { height: 3px; background: #ddd; margin-top: 14px; }
.progress span { display: block; height: 100%; width: 0; background: #000; }
.tracklist { list-style: none; padding: 0; margin: 18px 0 0; }
.tracklist li { border-top: 1px solid #eee; }
.track { width: 100%; display: grid; grid-template-columns: 30px 1fr auto; gap: 10px; background: none; border: 0; padding: 12px 0; font: inherit; text-align: left; cursor: pointer; color: #000; }
.track[disabled] { cursor: default; }
.track[disabled] .dur { color: #888; font-style: italic; }
.track.active { font-weight: 700; }
@media (max-width: 600px) { .player { margin-inline: 16px; } .player-top { grid-template-columns: 80px 60px 1fr; } .player-top img { width: 80px; height: 80px; } }

/* ---------- projects ---------- */
.projects-page { background: #0d6b35 center / cover no-repeat; padding: 60px var(--gutter); }
.tiles { max-width: 920px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.tile { position: relative; aspect-ratio: 1.12; border: 3px solid #fff; display: grid; place-items: center; text-decoration: none; overflow: hidden; }
.tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .35s; }
.tile span { position: relative; color: #fff; font: 600 15px Poppins, sans-serif; letter-spacing: .25em; text-transform: uppercase; text-shadow: 0 1px 8px rgba(0,0,0,.55); text-align: center; padding: 0 8px; }
.tile:hover img, .tile:focus-visible img { opacity: 1; }
@media (max-width: 640px) { .tiles { grid-template-columns: 1fr 1fr; } .tile span { font-size: 12px; letter-spacing: .15em; } }

/* ---------- live ---------- */
.live-page { background: linear-gradient(135deg, #b9895f 0%, #7a5236 50%, #c49a6c 100%); padding: 60px var(--gutter) 90px; }
.live-box { max-width: 600px; margin: 0 auto; position: relative; display: block; aspect-ratio: 16 / 9; background: #000 center / cover no-repeat; text-decoration: none; color: #fff; }
.live-box::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.25); }
.live-box .title { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; gap: 14px; font: 30px var(--helvetica); }
.live-box .play { position: relative; left: auto; top: auto; margin: 0 auto; }
.live-box .badge { position: absolute; left: 14px; top: 12px; font: 12px var(--helvetica); }
.live-info { max-width: 600px; margin: 26px auto 0; color: #fff; font: 15px var(--avenir); text-align: center; }

/* ---------- Da Capo ---------- */
.dc-hero { background: var(--pink-light); padding: 40px 0 30px; }
.dc-hero h1 { font: 76px/1 var(--anton); text-align: center; margin: 0; }
.dc-hero .addr { font: 22px var(--syne); margin: 6px 0 0 18%; }
.dc-hero .lessons { text-align: right; font: 40px/1.1 var(--anton); margin: 30px 8% 0 0; }
.dc-hero .lessons em { font: italic 40px var(--times); }
.dc-welcome { background: var(--lavender); padding: 50px 0 70px; }
.dc-welcome .grid { display: grid; grid-template-columns: 300px 1fr; gap: 60px; }
.dc-welcome .hoi { font: 38px var(--anton); margin-top: 60px; }
.dc-welcome .photo { position: relative; }
.dc-welcome .photo img { width: 100%; aspect-ratio: 1.2; object-fit: cover; }
.pill-yellow { position: absolute; left: 0; bottom: -14px; background: #fde23e; color: #000; font: 13px var(--syne); padding: 4px 14px; border-radius: 14px; text-decoration: none; }
.dc-welcome h2 { font: 29px var(--anton); margin: 0; }
.dc-welcome h3 { font: 20px var(--anton); margin: 0 0 24px; }
.dc-welcome p { font: 15px/1.7 var(--questrial); }
.dc-lessons { padding: 50px 0; }
.dc-lessons .box { background: rgba(255, 235, 255, .8); padding: 40px clamp(16px, 4vw, 48px); }
.dc-lessons h2 { font: 28px var(--anton); margin-bottom: 30px; }
.dc-lessons h3 { font: 22px var(--anton); margin: 18px 0 4px; }
.dc-lessons p { font: 18px/1.5 var(--questrial); }
.dc-promo { background: var(--pink); padding: 50px var(--gutter); }
.dc-promo .box { background: #fff; max-width: 440px; margin: 0 auto; text-align: center; padding: 34px 28px 40px; }
.dc-promo .hand { font: 500 27px/1.3 Caveat, cursive; }
.dc-promo .code { font: 22px/1.3 var(--anton); margin: 26px 0; }
.dc-why { position: relative; background: #e9d6e9 center / cover no-repeat; padding: 70px var(--gutter); }
.dc-why::before { content: ""; position: absolute; inset: 0; backdrop-filter: blur(6px); background: rgba(255,235,255,.3); }
.dc-why .box { position: relative; }
.dc-why .box { background: #fff; max-width: 480px; margin: 0 auto; padding: 36px 34px; text-align: center; }
.dc-why h2 { font: 32px var(--anton); }
.dc-why ul { list-style: none; padding: 0; margin: 0 0 26px; text-align: left; font: 15px/1.9 var(--questrial); }
.dc-contact { background: var(--lavender); padding: 40px 0 0; }
.dc-contact .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.dc-contact h2 { font: 56px var(--anton); }
.dc-contact .addr { display: flex; align-items: center; gap: 10px; font: 24px var(--anton); margin: 30px 0 20px; }
.dc-contact .addr svg { width: 26px; height: 26px; flex: none; }
.dc-contact h3 { font: 26px var(--anton); margin-top: 44px; }
.dc-contact .form .btn-blue { justify-self: end; width: auto; padding: 6px 40px; }
.map { width: 100%; height: 380px; border: 0; display: block; margin-top: 50px; }
@media (max-width: 760px) {
  .dc-hero h1 { font-size: 48px; } .dc-hero .addr { margin-left: 0; text-align: center; } .dc-hero .lessons { font-size: 28px; margin-right: 0; } .dc-hero .lessons em { font-size: 28px; }
  .dc-welcome .grid, .dc-contact .grid { grid-template-columns: 1fr; gap: 30px; } .dc-welcome .hoi { margin-top: 0; }
}

/* ---------- support ---------- */
.sp-hero { background: linear-gradient(100deg, var(--sky) 0%, #7d7cf4 100%); color: #fff; overflow: hidden; }
.sp-hero .grid { display: grid; grid-template-columns: 1.2fr 1fr; align-items: end; min-height: 404px; }
.sp-hero .copy { padding: 50px 0; align-self: center; }
.sp-hero h1 { font: 800 50px/1.08 Inter, var(--helvetica); margin: 0 0 18px; }
.sp-hero h1 .pink { color: var(--pink); }
.sp-hero h1 .amp { font: 48px var(--anton); color: #fff; }
.sp-hero p { font: 16px var(--helvetica); color: #fafafa; }
.sp-hero .chips { display: flex; gap: 26px; margin-top: 24px; flex-wrap: wrap; }
.chip { display: flex; align-items: center; gap: 10px; font: 600 14px Poppins, sans-serif; color: #e6e6e6; }
.chip i { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; font-style: normal; color: #fff; font-size: 18px; }
.chip.c1 i { background: #e45ce6; } .chip.c2 i { background: #b04ad1; }
.sp-hero .cut { align-self: end; max-height: 404px; width: auto; margin: 0 auto; }
.sp-why { background: var(--pink-light); padding: 46px 0; }
.sp-why .grid { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; align-items: center; }
.sp-why h2 { font: 36px/1.1 var(--anton); color: #282626; }
.sp-why .items { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 30px; }
.sp-why .item { display: grid; grid-template-columns: 38px 1fr; gap: 10px; font: 13px/1.4 var(--helvetica); }
.sp-why .item i { width: 34px; height: 34px; border-radius: 50%; background: var(--blue); }
.sp-why .item strong { display: block; font: 700 14px Arial, sans-serif; }
.sp-plans { background: var(--lavender); padding: 50px 0 70px; }
.sp-plans h2 { font: 61px var(--anton); text-align: center; margin-bottom: 34px; }
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; max-width: 1000px; margin: 0 auto; padding: 0 var(--gutter); }
.plan { background: #fff; text-align: center; display: flex; flex-direction: column; }
.plan-img { height: 160px; background: #000 center / cover; position: relative; }
.plan-img .bv { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 50%); background: var(--blue); color: #fff; font: 13px var(--questrial); padding: 2px 10px; }
.plan-body { padding: 26px 22px; font: 13px/1.5 var(--questrial); display: flex; flex-direction: column; gap: 10px; flex: 1; }
.plan h3 { font: 19px/1.3 var(--syne); margin: 0; }
.plan .price { font: 22px var(--syne); margin: 0; }
.plan .price b { font: 400 56px/1 var(--syne); display: block; }
.plan .valid { font-size: 12px; color: #555; }
.plan .btn-blue { margin-top: auto; font-family: var(--questrial); font-size: 15px; }
.plan ul { list-style: none; padding: 16px 22px 24px; margin: 0; border-top: 1px solid #ddd; font: 13px/1.6 var(--questrial); }
.plan li { padding: 6px 0; }
.plan li::before { content: "✓ "; }
@media (max-width: 860px) { .sp-hero .grid, .sp-why .grid, .plans { grid-template-columns: 1fr; } .sp-hero .cut { max-height: 320px; } .sp-hero h1 { font-size: 38px; } .sp-why .items { grid-template-columns: 1fr; } }

/* ---------- project pages (Wix project template) ---------- */
.pj-hero { height: 340px; background: var(--hero-bg, #000); overflow: hidden; }
.pj-hero img { height: 100%; width: 100%; max-width: 1180px; margin: 0 auto; object-fit: cover; }
.pj-card { position: relative; max-width: 980px; margin: -90px auto 0; background: #fff; padding: 22px clamp(16px, 9vw, 110px) 40px; font: 13px/1.5 var(--helvetica); }
.pj-card .back { font-size: 13px; color: #000; text-decoration: none; }
.pj-card h1 { font: 32px/1.2 var(--helvetica); margin: 14px 0 26px; }
.pj-card .lead { font: 18px/1.65 var(--helvetica); margin-bottom: 30px; }
.pj-card h2 { font: 20px var(--helvetica); margin: 26px 0 10px; }
.pj-card .downloads { margin-top: 24px; }
.pj-gallery { max-width: 1180px; margin: 30px auto 60px; padding: 0 var(--gutter); }
.pj-gallery h2 { font: 20px var(--helvetica); text-align: center; margin-bottom: 26px; }
.pj-gallery .row { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.pj-gallery img { height: 240px; width: auto; object-fit: cover; }
.pj-gallery .videos { padding: 0; margin-top: 30px; }
.credit { display: flex; align-items: center; gap: 14px; margin-top: 20px; font-size: 13px; flex-wrap: wrap; }
.credit img { width: 170px; }
@media (max-width: 700px) { .pj-hero { height: 220px; } .pj-card { margin-top: -40px; } .pj-gallery img { height: 160px !important; } }

/* blurred-background project pages (Valse Bleue, Circles, Stellar Trio) */
.pj-soft { padding: 40px var(--gutter) 80px; background: var(--soft-bg, linear-gradient(135deg, #8f7fd6, #c9b4f0)); }
.pj-soft .banner { max-width: 960px; margin: 0 auto; }
.pj-soft .banner img { width: 100%; max-height: 300px; object-fit: cover; }
.pj-soft .panel { max-width: 960px; margin: 22px auto 0; background: rgba(255,255,255,.62); border-radius: 18px; padding: 36px clamp(16px, 4vw, 48px); display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.pj-soft .panel > * { min-width: 0; }
.pj-soft .panel.solid { background: #fff; border-radius: 0; margin-top: -60px; position: relative; }
.pj-soft .back { font: 13px var(--helvetica); color: #000; text-decoration: none; display: inline-block; margin-bottom: 14px; }
.pj-soft h1 { font: 36px/1.15 var(--questrial); }
.pj-soft .q { font: italic 22px/1.35 var(--times); text-align: center; }
.pj-soft .q.bold { font-weight: 700; text-align: left; font-size: 18px; }
.pj-soft .body { font: 15px/1.6 var(--times); }
.pj-soft .body.sans { font-family: var(--questrial); }
.pj-soft .names { font: 16px/1.4 var(--questrial); margin-bottom: 24px; }
.pj-soft .caps { font: 34px/1.1 var(--helvetica); text-transform: uppercase; }
.pj-soft .caps small { display: block; font-size: 20px; }
@media (max-width: 760px) { .pj-soft .panel { grid-template-columns: 1fr; } .pj-soft .panel.solid { margin-top: -20px; } }

/* Identity programme note: blue page, white text */
.pj-blue { background: var(--blue); color: #fff; padding: 50px 0 80px; }
.pj-blue .back { color: #fff; font: 13px var(--helvetica); text-decoration: none; }
.pj-blue h1 { font: 44px var(--anton); margin: 18px 0 40px; }
.piece { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 50px; margin-bottom: 50px; }
.piece h2 { font: 700 15px/1.4 var(--helvetica); text-transform: uppercase; letter-spacing: .04em; margin: 0; }
.piece .mvts { font: 700 15px/1.6 var(--helvetica); margin: 0; }
.piece .body { grid-column: 1 / -1; font: 13px/1.6 var(--helvetica); }
@media (max-width: 700px) { .piece { grid-template-columns: 1fr; } }

/* simple pages (thanks, 404) */
.simple { background: var(--lavender); padding: 90px var(--gutter); text-align: center; }
.simple h1 { font: 56px var(--anton); }
.simple p { font: 18px var(--questrial); }
.simple .btn-blue { margin: 6px; }

/* Mozart antwortet (colours from the concert poster) */
.mozart-feature { background: #f5ebdd; padding: 60px 0; }
.mozart-feature .grid { display: grid; grid-template-columns: 340px 1fr; gap: 56px; align-items: center; }
.mozart-feature .poster img { box-shadow: 0 14px 34px -16px rgba(80, 40, 20, .45); }
.mozart-feature .kicker { font: 600 13px/1.4 Jost, var(--avenir); letter-spacing: .22em; text-transform: uppercase; margin: 6px 0 14px; }
.mozart-feature h2 { font: 700 64px/0.95 "Playfair Display", var(--times); color: #1d1a18; margin: 0 0 18px; }
.mozart-feature h2 span { display: block; color: #c0532f; }
.mozart-feature .artists { font: 600 20px/1.3 Jost, var(--avenir); letter-spacing: .14em; text-transform: uppercase; padding-bottom: 14px; border-bottom: 2px solid #c0532f; display: inline-block; margin-bottom: 20px; }
.mozart-feature p { font: 15px/1.6 var(--questrial); }
.mozart-feature .read-more { font-weight: 700; color: #000; }
.venues { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; }
.venue { border-radius: 0 60px 60px 0; padding: 20px 26px 22px; font: 13px/1.55 Jost, var(--avenir); letter-spacing: .06em; text-transform: uppercase; }
.venue strong { display: block; font: 700 34px/1.1 "Playfair Display", var(--times); letter-spacing: 0; text-transform: none; }
.venue b { display: block; font-weight: 600; font-size: 15px; margin: 4px 0 6px; }
.venue.basel { background: #c0532f; color: #fff; }
.venue.bern { background: #f3ab78; color: #1d1a18; }
.venue a { color: inherit; }
@media (max-width: 760px) { .mozart-feature .grid, .venues { grid-template-columns: 1fr; } .mozart-feature h2 { font-size: 46px; } .mozart-feature .poster { max-width: 340px; margin: 0 auto; } }