/* PerlaMusic — musical programme, pearl, silver and blue. See BRAND_IDENTITY.md. */
:root {
  --paper:#f5f3ed; --ink:#092a43; --blue:#063b66; --red:var(--blue); --red-dark:#032947;
  --silver:#c4d0d6; --muted:#526571; --line:#bdcbd1; --soft:#e7ecec; --white:#fff; --whatsapp:#176b4b;
  --sans:'Source Sans 3','Segoe UI',sans-serif; --display:'Barlow Condensed','Arial Narrow',sans-serif;
  --max:1280px; --ease:cubic-bezier(.22,.61,.36,1);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body { margin:0; background:var(--paper); color:var(--ink); font:400 17px/1.65 var(--sans); -webkit-font-smoothing:antialiased; }
body:has(dialog[open]) { overflow:hidden; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button,summary { cursor:pointer; }
button { color:inherit; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.responsive-picture { display:block; min-width:0; }
.course-img .responsive-picture { height:100%; }
svg { display:inline-block; vertical-align:middle; flex-shrink:0; }
p { margin:0 0 1.2em; }
h1,h2,h3,h4 { margin:0; font-family:var(--display); font-weight:600; line-height:1.05; letter-spacing:.005em; }
h1 { font-size:clamp(60px,6.5vw,90px); } h2 { font-size:clamp(40px,4.3vw,58px); } h3 { font-size:30px; }
em { font:inherit; font-style:normal; color:var(--blue); }
::selection { background:var(--blue); color:white; }
:where(a,button,summary,input,select,textarea):focus-visible { outline:3px solid #3876a5; outline-offset:4px; }
.wrap { width:100%; max-width:var(--max); margin-inline:auto; padding-inline:48px; }
.icon { width:20px; height:20px; }
.muted { color:var(--muted); } .hidden { display:none!important; }
/* Explicit replacements for the former inline spacing attributes. */
.mt-25 { margin-top:25px!important; }
.mt-26 { margin-top:26px!important; }
.mt-0 { margin-top:0!important; }
.legal-note,.formnotice,.form-notice { color:var(--muted); font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.legal-note a,.formnotice a,.form-notice a { color:var(--blue); text-decoration:underline; text-underline-offset:3px; }
.eyebrow { display:flex; align-items:center; gap:12px; margin-bottom:18px; font-size:12px; font-weight:600; line-height:1.4; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); }
.eyebrow::before { content:''; width:25px; height:5px; border-block:1px solid currentColor; flex-shrink:0; }
.eyebrow.light { color:var(--silver); }
.section { padding-block:92px; }
.section-head { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:38px; }
.section-head h2 { max-width:650px; }
.section-head p { max-width:340px; color:var(--muted); font-size:16px; margin:0 0 3px; }
.rule { border-bottom:1px solid var(--line); }
.actions { display:flex; align-items:center; gap:25px; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:50px; padding:13px 22px; background:var(--blue); border:1px solid var(--blue); border-radius:3px; color:white; font:600 16px/1.25 var(--sans); transition:background .2s,border-color .2s,transform .2s var(--ease); }
.btn:hover { background:var(--red-dark); border-color:var(--red-dark); transform:translateY(-2px); }
.btn:active { transform:translateY(0); }
.btn .icon { transition:transform .2s var(--ease); } .btn:hover .icon { transform:translate(2px,-1px); }
.btn.small { min-height:46px; padding:11px 18px; font-size:15px; }
.btn.outline { background:transparent; border-color:var(--blue); color:var(--blue); }
.btn.outline:hover { background:var(--soft); }
.btn.dark { background:var(--ink); border-color:var(--ink); }
.btn.cream { background:var(--paper); color:var(--blue); border-color:var(--paper); }
.btn.cream:hover { background:white; }
.btn.whatsapp,.btn[data-message-whatsapp],.btn[data-result-whatsapp] { background:var(--whatsapp); border-color:var(--whatsapp); color:white; }
.btn.whatsapp:hover,.btn[data-message-whatsapp]:hover,.btn[data-result-whatsapp]:hover { background:#10573c; border-color:#10573c; }
.whatsapp-icon { width:23px; height:23px; flex-shrink:0; object-fit:contain; }
.text-link { display:inline-flex; align-items:center; gap:14px; padding-block:5px; border-bottom:1px solid currentColor; font-size:16px; font-weight:600; line-height:1.4; transition:color .18s; }
.text-link .icon { transition:transform .2s var(--ease); } .text-link:hover { color:var(--blue); } .text-link:hover .icon { transform:translate(2px,-2px); }
.skip-link { position:fixed; left:12px; top:-80px; background:var(--ink); color:white; padding:12px; z-index:100; } .skip-link:focus { top:10px; }

/* The authentic round mark leads the masthead. */
.top-note { background:var(--blue); color:white; padding:5px 16px; text-align:center; font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.top-note span { padding-inline:12px; color:var(--silver); } .mobile-top-note { display:none; }
.header { position:sticky; top:0; z-index:30; background:white; border-bottom:1px solid var(--line); }
.header-inner { height:94px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
.wordmark { display:inline-flex; align-items:center; gap:13px; line-height:1; flex-shrink:0; }
.official-logo { width:74px; height:74px; object-fit:contain; background:transparent; padding:0; border-radius:0; }
.wordmark-name { font:700 33px/1 var(--display); letter-spacing:.015em; color:var(--blue); }
.wordmark-name b { font-weight:700; }
.wordmark-sub { display:block; margin-top:7px; font:600 9px/1.3 var(--sans); letter-spacing:.13em; text-transform:uppercase; }
.desktop-nav { display:flex; align-items:center; gap:27px; }
.desktop-nav a { position:relative; padding-block:12px; font-size:15px; font-weight:600; }
.desktop-nav a::after { content:''; position:absolute; bottom:7px; left:0; width:100%; height:1px; background:var(--blue); transform:scaleX(0); transform-origin:left; transition:transform .18s; }
.desktop-nav a:hover::after,.desktop-nav a[aria-current]::after { transform:scaleX(1); }
.header-actions { display:flex; align-items:center; gap:10px; } .header-phone { display:none; }
.menu-trigger { display:none; width:44px; height:44px; padding:10px; border:1px solid var(--blue); background:white; border-radius:50%; color:var(--blue); }

/* Home: a musical poster, real photographs and useful directions. */
.hero { overflow:clip; padding:45px 0 48px; }
.hero-grid { display:grid; grid-template-columns:.88fr 1.12fr; gap:70px; align-items:center; }
.hero-copy { position:relative; z-index:1; padding-block:18px; }
.hero h1 { font-size:clamp(60px,6.2vw,84px); line-height:.98; text-transform:uppercase; font-weight:700; margin-bottom:25px; letter-spacing:-.01em; }
.hero h1 em { display:block; color:var(--blue); }
.hero-lead { font-size:19px; line-height:1.55; color:var(--muted); margin-bottom:25px; }
.hero-lead strong { color:var(--ink); font-weight:600; }
.home-course-shortcuts { display:flex; gap:11px; margin-bottom:12px; }
.home-course-shortcut { display:inline-flex; align-items:center; justify-content:space-between; gap:13px; padding:13px 17px; min-height:51px; background:var(--blue); color:white; border:1px solid var(--blue); border-radius:3px; font-size:16px; font-weight:600; transition:background .2s,transform .2s var(--ease); }
.home-course-shortcut + .home-course-shortcut { background:transparent; color:var(--blue); }
.home-course-shortcut:hover { transform:translateY(-2px); background:var(--red-dark); color:white; }
.home-course-shortcut > .icon { width:17px; height:17px; }
.hero-practical { display:grid; gap:0; margin-top:8px; }
.hero-practical a { display:inline-flex; width:fit-content; align-items:center; gap:10px; min-height:40px; font-size:15px; color:var(--muted); }
.hero-practical .icon { width:18px; height:18px; color:var(--blue); }
.hero-practical a:hover { color:var(--blue); text-decoration:underline; text-underline-offset:4px; }
.hero-art { position:relative; isolation:isolate; margin:30px 0; }
.hero-orbit { position:absolute; width:460px; aspect-ratio:1; border:39px solid var(--silver); border-right-color:transparent; border-radius:50%; left:56%; top:50%; transform:translate(-50%,-50%) rotate(-28deg); z-index:-1; opacity:.78; }
.hero-orbit::before { content:''; position:absolute; inset:-53px; border:1px solid #9db3c0; border-right-color:transparent; border-radius:50%; }
.hero-orbit::after { content:''; position:absolute; inset:12px; border:1px solid #9db3c0; border-radius:50%; }
.hero-photo-frame { margin:0; background:white; padding:10px; border:1px solid var(--blue); box-shadow:8px 8px 0 #063b6612; transform:rotate(-2deg); }
.hero-photo { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.hero-overlay { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:13px 3px 3px; font-size:11px; font-weight:600; color:var(--blue); line-height:1.4; letter-spacing:.06em; text-transform:uppercase; }
.hero-overlay .icon { width:25px; height:25px; }
.hero-photo-label { display:flex; justify-content:space-between; gap:20px; margin:26px 0 0; font:600 16px/1 var(--display); text-transform:uppercase; letter-spacing:.13em; color:var(--blue); }
.hero-photo-label::before { content:''; width:46px; height:1px; align-self:center; background:var(--blue); }
.hero-photo-label span { flex:1; }
.hero-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:34px; padding-top:19px; border-top:3px double var(--line); color:var(--muted); font-size:14px; }
.hero-bottom a { display:inline-flex; align-items:center; gap:10px; }
.manifesto { background:var(--blue); color:white; padding:24px 0; border-block:6px double #bccbd5; }
.manifesto .wrap { display:flex; align-items:center; justify-content:space-between; gap:25px; }
.manifesto p { margin:0; font:600 38px/1.15 var(--display); text-transform:uppercase; letter-spacing:.025em; }
.manifesto p em { color:white; } .manifesto .sparkle { width:34px; height:34px; }
.manifesto small { font-size:15px; color:#e0e8ed; }

/* Course panels borrow the proportions of printed programmes. */
.course-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.course-card { display:block; position:relative; border:1px solid var(--line); border-top:4px solid var(--blue); background:white; border-radius:2px; overflow:hidden; transition:border-color .2s,box-shadow .2s; }
.course-card:hover { border-color:var(--blue); box-shadow:5px 5px 0 #063b660d; }
.course-img { overflow:hidden; position:relative; }
.course-img img { width:100%; height:255px; object-fit:cover; transition:transform .6s var(--ease); }
.course-card:hover .course-img img { transform:scale(1.025); }
.course-tag { position:absolute; top:17px; left:17px; background:var(--paper); padding:5px 12px; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.12em; color:var(--blue); }
.course-body { padding:25px 28px 28px; }
.course-body-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:12px; }
.course-body-head h3 { font-size:40px; color:var(--blue); }
.course-body p { color:var(--muted); margin:0; font-size:16px; max-width:400px; }
.circle-arrow { width:40px; height:40px; flex-shrink:0; display:grid; place-items:center; border:1px solid var(--blue); border-radius:50%; color:var(--blue); transition:color .2s,background .2s; }
.course-card:hover .circle-arrow { color:white; background:var(--blue); }
.course-bottom { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:25px; padding-top:24px; border-top:1px solid var(--line); font-size:16px; color:var(--muted); }
.course-bottom button { flex-shrink:0; }
.activity-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin-top:28px; }
.activity-card { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:28px; border:1px solid var(--line); border-top:4px double var(--blue); background:var(--soft); }
.activity-card .eyebrow { margin-bottom:15px; font-size:10px; }
.activity-card h3 { font-size:34px; color:var(--blue); }
.activity-card p { color:var(--muted); margin:18px 0 20px; font-size:16px; }
.activity-card .text-link { margin-top:auto; }
.approach { background:var(--soft); border-block:1px solid var(--line); }
.approach-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:90px; align-items:center; }
.approach h2 { margin-bottom:24px; }
.approach-copy { color:var(--muted); max-width:550px; }
.approach-points { display:grid; grid-template-columns:1fr 1fr; gap:30px; margin:28px 0; }
.approach-points .point-no { display:block; font:600 32px/1 var(--display); color:var(--blue); margin-bottom:10px; }
.approach-points h3 { font-size:25px; margin-bottom:9px; }
.approach-points p { font-size:15px; color:var(--muted); margin:0; }
.school-photo { margin:0; padding:10px; background:white; border:1px solid var(--line); box-shadow:7px 7px 0 #063b6610; }
.school-photo img { width:100%; height:330px; object-fit:cover; }
.school-photo figcaption { padding:15px 10px 8px; }
.school-photo figcaption span { display:block; font:600 27px/1.2 var(--display); }
.school-photo figcaption small { font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.stage-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:65px; align-items:center; }
.stage-copy h2 { margin-bottom:23px; } .stage-copy > p { color:var(--muted); max-width:460px; }
.recordings { border-top:3px double var(--line); margin-top:30px; }
.recording-row { display:flex; align-items:center; gap:18px; padding:17px 0; border-bottom:1px solid var(--line); }
.recording-row[hidden] { display:none; }
.recording-play,.recording-external { width:46px; height:46px; display:grid; place-items:center; flex-shrink:0; color:var(--blue); }
.recording-play { border:1px solid var(--blue); background:transparent; border-radius:50%; transition:background .2s,color .2s; }
.recording-play:hover { background:var(--blue); color:white; } .recording-play .icon { width:17px; height:17px; }
.recording-name { flex:1; min-width:0; }
.recording-name strong { display:block; font-weight:600; font-size:17px; line-height:1.35; }
.recording-name span { display:block; font-size:14px; margin-top:3px; color:var(--muted); }
.recording-type { font-size:13px; color:var(--muted); } .stage-copy .recording-type { display:none; }
.listening-poster { position:relative; background:var(--blue); color:white; border:1px solid var(--blue); overflow:hidden; padding:9px; }
.listening-banner { display:none; }
.listening-poster-content { position:relative; border:1px solid #bdcbd57a; padding:32px; min-height:430px; overflow:hidden; }
.listening-poster h3 { position:relative; z-index:1; font-size:60px; text-transform:uppercase; max-width:320px; }
.listening-poster h3 em { color:var(--silver); }
.listening-poster .text-link { position:relative; z-index:1; color:white; margin-top:92px; }
.vinyl-small { position:absolute; width:250px; height:250px; right:-85px; bottom:40px; border-radius:50%; border:38px solid #8ca7b6; outline:1px solid #aac0cc; outline-offset:14px; display:grid; place-items:center; }
.vinyl-small span { display:grid; place-items:center; width:64px; height:64px; border:1px solid #aac0cc; border-radius:50%; }
.stage-poster { position:relative; display:flex; flex-direction:column; justify-content:space-between; min-height:460px; background:var(--blue); color:white; padding:32px; overflow:hidden; border:10px double var(--silver); }
.stage-poster::before { content:''; width:340px; height:340px; position:absolute; border:28px solid #c4d0d633; border-radius:50%; right:-120px; bottom:-35px; }
.poster-top,.poster-bottom { display:flex; align-items:center; justify-content:space-between; gap:15px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; position:relative; }
.poster-title { font:600 62px/.98 var(--display); text-transform:uppercase; position:relative; }
.poster-title em { color:var(--silver); } .poster-bars { display:none; }

/* Socials, answers and the closing invitation. */
.social-section { background:var(--soft); border-block:1px solid var(--line); }
.social-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.social-card { display:flex; align-items:flex-start; gap:16px; border-top:3px double var(--line); padding-top:24px; }
.social-card .social-icon { width:29px; height:29px; flex-shrink:0; margin-top:3px; }
.social-card h3 { font-size:30px; margin-bottom:7px; }
.social-card span { font-size:14px; color:var(--blue); }
.social-card p { font-size:15px; color:var(--muted); margin:12px 0 0; }
.social-card > .icon { margin-left:auto; width:17px; height:17px; }
.social-card:hover h3 { text-decoration:underline; text-underline-offset:5px; }
.faq-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; }
.faq-intro p { margin-top:25px; color:var(--muted); font-size:16px; }
.faq-list { border-top:3px double var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { list-style:none; position:relative; padding:22px 35px 22px 0; font-size:17px; font-weight:600; line-height:1.5; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:'+'; position:absolute; right:3px; top:17px; font-size:28px; font-weight:400; color:var(--blue); }
.faq-list details[open] summary::after { content:'−'; }
.faq-list details p { color:var(--muted); font-size:16px; padding-right:25px; }
.faq-list details p a { text-decoration:underline; text-underline-offset:3px; }
.contact-banner { position:relative; background:var(--blue); color:white; padding-block:60px; border-top:6px double var(--silver); overflow:hidden; }
.contact-banner::before { content:''; width:320px; height:320px; border:36px solid #c4d0d61a; border-radius:50%; position:absolute; right:15%; top:-70px; pointer-events:none; }
.contact-banner .wrap { position:relative; display:flex; align-items:center; justify-content:space-between; gap:40px; }
.contact-banner h2 { font-size:clamp(42px,4.7vw,64px); } .contact-banner em { color:var(--silver); }
.contact-banner p { color:#dae3e8; margin:20px 0 0; font-size:17px; } .contact-banner .btn { flex-shrink:0; }
.footer { padding:54px 0 25px; background:var(--ink); color:white; }
.footer-top { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:48px; padding-bottom:42px; }
.footer .wordmark-name { color:white; } .footer .official-logo { border-radius:0; padding:0; background:transparent; }
.footer .legal-note { color:var(--silver); }
.footer .legal-note a { color:white; }
.footer .wordmark-sub { color:var(--silver); }
.footer-brand p { margin-top:22px; font-size:15px; color:#bdccd5; }
.footer h3 { font-family:var(--sans); font-weight:600; font-size:12px; line-height:1.5; letter-spacing:.1em; text-transform:uppercase; color:#bdccd5; margin:9px 0 19px; }
.footer-links { display:flex; flex-direction:column; gap:12px; font-size:15px; }
.footer-links a:hover { text-decoration:underline; text-underline-offset:4px; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:22px; border-top:1px solid #547084; color:#bdccd5; font-size:12px; }
.footer-bottom-links { display:flex; flex-wrap:wrap; gap:10px 22px; font-size:13px; }
.footer-bottom-links a { display:inline-flex; align-items:center; min-height:44px; }
.mobile-cta { display:none; }

/* Dialogs retain native focus management and clear controls. */
.icon-btn { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; border:1px solid var(--blue); background:transparent; border-radius:50%; color:var(--blue); }
.menu-dialog { position:fixed; inset:0; margin:0; border:0; background:var(--paper); color:var(--ink); width:100%; max-width:100%; height:100dvh; max-height:100dvh; padding:24px; }
.dialog-top { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:30px; }
.menu-links { display:flex; flex-direction:column; font:600 38px/1.2 var(--display); }
.menu-links a { padding:15px 0; border-bottom:1px solid var(--line); }
.menu-dialog > .btn { margin-top:28px; } .menu-bottom { margin-top:28px; color:var(--muted); font-size:16px; }
.finder-dialog { padding:0; border:1px solid var(--blue); border-radius:3px; background:var(--paper); color:var(--ink); max-width:560px; width:calc(100% - 32px); max-height:calc(100dvh - 32px); overflow:auto; }
.finder-dialog::backdrop,.media-dialog::backdrop { background:#092a43c4; }
.finder-inner { padding:32px; }
.finder-top { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:23px; }
.finder-top .eyebrow { font-size:11px; margin:0; }
.progress-dots { display:flex; gap:5px; } .progress-dots span { width:30px; height:3px; background:var(--silver); } .progress-dots .active { background:var(--blue); }
.finder-dialog h2 { font-size:44px; margin-bottom:16px; } .finder-dialog h2:focus { outline:none; }
.finder-dialog p { font-size:16px; color:var(--muted); }
.choice-list { display:grid; gap:10px; margin-block:24px; }
.choice { width:100%; padding:15px 17px; border:1px solid var(--line); background:white; border-radius:2px; display:flex; align-items:center; gap:14px; font-size:16px; text-align:left; line-height:1.4; transition:border-color .2s,background .2s; }
.choice .icon { color:var(--blue); } .choice .arrow-right { margin-left:auto; }
.choice:hover { border-color:var(--blue); background:var(--soft); }
.finder-footer { display:flex; justify-content:space-between; align-items:center; margin-top:22px; color:var(--muted); font-size:13px; }
.back-btn { display:flex; align-items:center; gap:8px; min-height:44px; border:0; background:transparent; padding:8px 0; font-size:15px; }
.finder-result { margin-block:24px; padding:20px; border-block:3px double var(--line); }
.finder-result p { margin:0; } .finder-result b { color:var(--ink); }
.finder-result .eyebrow { font-size:11px; margin-bottom:12px; }
.finder-dialog .actions { gap:16px; } .finder-dialog .actions .btn { flex:1; }
.finder-note { font-size:13px!important; margin-top:20px!important; }
.media-dialog { width:calc(100% - 32px); max-width:900px; max-height:calc(100dvh - 32px); overflow:auto; padding:0; border:1px solid var(--blue); border-radius:3px; background:var(--paper); color:var(--ink); }
.media-top { padding:22px 25px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
.media-top h2 { font-size:32px; line-height:1.15; } .media-top .eyebrow { font-size:10px; margin-bottom:10px; }
.video-frame { position:relative; aspect-ratio:16/9; display:grid; place-items:center; background:var(--ink); color:var(--silver); }
.video-frame iframe { position:absolute; width:100%; height:100%; inset:0; border:0; } .video-frame p { font-size:15px; }
.media-bottom { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 25px; color:var(--muted); font-size:13px; }
.media-bottom .text-link { font-size:14px; flex-shrink:0; }

/* Brief, one-time motion. Useful information is never initially hidden by JS. */
.reveal { opacity:1; transform:none; }
.js .reveal { transition:opacity .55s var(--ease),transform .55s var(--ease); }
.js .reveal.waiting { opacity:0; transform:translateY(10px); }
@keyframes title-enter { from { transform:translateY(6px); opacity:.65; } to { transform:none; opacity:1; } }
@keyframes photo-enter { from { transform:rotate(-2deg) translateY(8px); opacity:.7; } to { transform:rotate(-2deg); opacity:1; } }
@media (prefers-reduced-motion:no-preference) {
  .hero h1 { animation:title-enter .5s var(--ease) both; }
  .hero-photo-frame { animation:photo-enter .65s var(--ease) both; }
  dialog[open] { animation:title-enter .22s var(--ease) both; }
}

@media (max-width:1100px) {
  .wrap { padding-inline:32px; } .header-inner { gap:20px; }
  .desktop-nav { gap:20px; } .desktop-nav a { font-size:14px; }
  .header-actions .btn { padding-inline:14px; font-size:14px; }
  .wordmark-name { font-size:29px; } .wordmark-sub { font-size:8px; } .official-logo { width:64px; height:64px; }
  .hero-grid { gap:45px; } .hero h1 { font-size:6.2vw; }
  .hero-orbit { width:370px; border-width:28px; } .hero-lead { font-size:17px; }
  .home-course-shortcut { font-size:15px; padding-inline:13px; gap:8px; }
  .approach-grid,.stage-grid,.faq-grid { gap:45px; }
  .listening-poster-content { padding:27px; } .listening-poster h3 { font-size:52px; } .footer-top { gap:35px; }
}
@media (max-width:940px) {
  .desktop-nav { display:none; } .menu-trigger { display:grid; place-items:center; } .header-actions { gap:18px; }
  .hero-grid { grid-template-columns:1fr 1fr; gap:30px; } .hero-orbit { width:300px; }
  .hero-photo-label { font-size:14px; } .hero-practical a { font-size:14px; }
  .home-course-shortcuts { gap:8px; } .home-course-shortcut { padding-inline:12px; } .home-course-shortcut .icon { display:none; }
  .manifesto p { font-size:33px; } .manifesto small { font-size:13px; }
  .social-grid { gap:20px; } .social-card { gap:10px; } .social-card h3 { font-size:26px; }
}
@media (max-width:700px) {
  html { scroll-padding-top:90px; scroll-padding-bottom:calc(90px + env(safe-area-inset-bottom)); }
  body { font-size:16px; } .wrap { padding-inline:22px; }
  h1 { font-size:clamp(46px,11.8vw,72px); line-height:1.04; }
  h2 { font-size:clamp(36px,9.2vw,48px); line-height:1.08; } h3 { font-size:28px; }
  .section { padding-block:54px; }
  .eyebrow { font-size:10px; letter-spacing:.12em; gap:10px; margin-bottom:15px; } .eyebrow::before { width:20px; }
  .section-head { display:block; margin-bottom:27px; }
  .section-head p { max-width:none; margin-top:19px; font-size:16px; }
  .btn { font-size:16px; min-height:48px; padding:13px 18px; } .btn.small { font-size:15px; min-height:46px; }
  .text-link { font-size:15px; }
  .top-note,.header-phone,.header-actions > .btn { display:none; }
  .header-inner { height:78px; gap:10px; padding-inline:18px; }
  .official-logo { width:62px; height:62px; } .wordmark { gap:10px; }
  .wordmark-name { font-size:28px; letter-spacing:.01em; }
  .wordmark-sub { display:block; font-size:7.5px; letter-spacing:.085em; margin-top:5px; } .header-actions { gap:0; }
  .hero { padding:20px 0 29px; } .hero-grid { display:grid; grid-template-columns:1fr; gap:19px; } .hero-copy { padding:0; }
  .hero .eyebrow { margin-bottom:10px; }
  .hero h1 { font-size:clamp(45px,12vw,72px); line-height:.98; margin-bottom:13px; }
  .hero-lead { font-size:16px; line-height:1.5; margin-bottom:17px; }
  .home-course-shortcuts { gap:10px; margin-bottom:3px; }
  .home-course-shortcut { flex:1; min-width:0; min-height:48px; font-size:16px; gap:10px; padding:12px 14px; }
  .home-course-shortcut .icon { display:block; width:16px; height:16px; }
  .hero-practical { margin:0; }
  .hero-practical a { min-height:44px; width:100%; font-size:14px; }
  .hero-practical a + a { display:none; } .hero-practical .icon { width:16px; height:16px; }
  .hero-art { margin:0; }
  .hero-orbit { width:260px; border-width:22px; left:73%; top:51%; opacity:.5; }
  .hero-orbit::before { inset:-33px; } .hero-orbit::after { inset:9px; }
  .hero-photo-frame { padding:6px; box-shadow:4px 4px 0 #063b6612; transform:none; }
  .hero-photo { aspect-ratio:16/9; height:auto; }
  .hero-overlay { padding:9px 3px 3px; font-size:8.5px; letter-spacing:.025em; gap:9px; }
  .hero-overlay .icon { width:18px; height:18px; }
  .hero-photo-label,.hero-bottom { display:none; }
  .manifesto { padding-block:18px; border-block-width:4px; }
  .manifesto .wrap { justify-content:center; gap:13px; }
  .manifesto p { font-size:clamp(24px,6.6vw,34px); letter-spacing:.01em; } .manifesto .sparkle { width:22px; height:22px; } .manifesto small { display:none; }
  .course-grid { grid-template-columns:1fr; gap:20px; }
  .activity-grid { grid-template-columns:1fr; gap:20px; margin-top:20px; }
  .activity-card { padding:23px; }
  .activity-card h3 { font-size:30px; }
  .activity-card p { font-size:15px; }
  .course-card { display:grid; grid-template-columns:105px minmax(0,1fr); border-top-width:1px; border-left:4px solid var(--blue); }
  .course-img img { height:100%; min-height:188px; } .course-tag { display:none; }
  .course-body { padding:20px 18px; } .course-body-head { margin-bottom:10px; gap:10px; }
  .course-body-head h3 { font-size:32px; line-height:1; } .course-body-head .circle-arrow { display:none; }
  .course-body p { font-size:15px; line-height:1.55; }
  .course-bottom { align-items:flex-start; flex-direction:column; gap:17px; margin-top:22px; padding-top:20px; font-size:15px; }
  .course-bottom .btn { min-height:46px; }
  .approach-grid,.stage-grid,.faq-grid { grid-template-columns:1fr; gap:35px; }
  .approach-grid > .school-photo { order:2; } .approach h2 { margin-bottom:22px; } .approach-copy { font-size:16px; }
  .approach-points { gap:22px; margin-block:24px; } .approach-points h3 { font-size:24px; }
  .approach-points p { font-size:14px; } .approach-points .point-no { font-size:29px; }
  .school-photo img { height:auto; aspect-ratio:16/10; } .school-photo figcaption span { font-size:26px; } .school-photo figcaption small { font-size:9px; }
  .stage-copy > p { font-size:16px; }
  .recordings { margin-top:24px; } .recording-row { gap:12px; padding-block:15px; }
  .recording-name strong { font-size:16px; } .recording-name span { font-size:13px; }
  .recording-play,.recording-external { width:44px; height:44px; } .recording-type { display:none; }
  .listening-poster-content { min-height:355px; padding:25px; } .listening-poster h3 { font-size:48px; }
  .listening-poster .text-link { margin-top:65px; }
  .vinyl-small { width:210px; height:210px; border-width:28px; right:-85px; bottom:20px; }
  .stage-poster { min-height:390px; padding:25px; } .poster-title { font-size:53px; } .poster-top,.poster-bottom { font-size:9px; }
  .social-grid { grid-template-columns:1fr; gap:25px; } .social-card { gap:18px; padding-top:22px; }
  .social-card h3 { font-size:29px; } .social-card span,.social-card p { font-size:14px; } .social-card p { margin-top:6px; }
  .faq-grid { gap:25px; } .faq-intro p { margin-top:18px; margin-bottom:0; }
  .faq-list summary { font-size:16px; padding-block:20px; } .faq-list details p { font-size:15px; padding-right:10px; }
  .contact-banner { padding-block:42px; } .contact-banner .wrap { display:block; }
  .contact-banner h2 { font-size:clamp(38px,10.3vw,49px); } .contact-banner p { font-size:16px; } .contact-banner .btn { margin-top:25px; }
  .footer { padding:40px 0 calc(105px + env(safe-area-inset-bottom)); }
  .footer-top { grid-template-columns:1fr 1fr; gap:30px 22px; padding-bottom:30px; } .footer-brand { grid-column:1/-1; }
  .footer-brand p { margin-top:18px; font-size:15px; } .footer h3 { font-size:10px; margin-bottom:15px; letter-spacing:.06em; }
  .footer-links { font-size:14px; gap:13px; } .footer-links .icon { width:15px; height:15px; }
  .footer-bottom { align-items:flex-start; flex-direction:column; gap:16px; font-size:11px; }
  .mobile-cta { position:fixed; inset:auto 0 0; z-index:25; display:flex; align-items:center; gap:10px; background:white; border-top:1px solid var(--line); padding:9px 16px calc(9px + env(safe-area-inset-bottom)); box-shadow:0 -3px 14px #092a4309; }
  .mobile-cta .btn { min-width:0; min-height:49px; padding:12px; font-size:16px; gap:9px; }
  .mobile-cta .btn:first-child { flex:.8; } .mobile-cta .btn:last-child { flex:1.2; }
  .mobile-cta .btn:hover { transform:none; }
  .mobile-cta .btn .icon { width:18px; height:18px; } .mobile-cta .whatsapp-icon { width:23px; height:23px; }
  .menu-dialog { padding:20px; } .menu-dialog .wordmark-sub { font-size:7px; } .menu-links { font-size:35px; }
  .finder-inner { padding:23px; } .finder-dialog h2 { font-size:38px; } .finder-dialog p { font-size:15px; }
  .finder-dialog .eyebrow { font-size:10px; }
  .finder-dialog .actions { align-items:stretch; flex-direction:column; } .finder-dialog .actions .text-link { align-self:center; }
  .choice { padding:14px; gap:11px; font-size:15px; }
  .media-dialog { width:calc(100% - 22px); } .media-top { padding:18px; gap:16px; } .media-top h2 { font-size:28px; }
  .media-bottom { display:block; padding:18px; } .media-bottom .text-link { margin-top:14px; }
  body:has(.message-form textarea:focus) .mobile-cta,body:has(.message-form select:focus) .mobile-cta { visibility:hidden; pointer-events:none; }
  @keyframes photo-enter { from { transform:translateY(7px); opacity:.7; } to { transform:none; opacity:1; } }
}
@media (max-width:360px) {
  .wrap { padding-inline:18px; } .header-inner { height:72px; padding-inline:15px; }
  .official-logo { width:55px; height:55px; } .wordmark { gap:8px; } .wordmark-name { font-size:26px; } .wordmark-sub { font-size:6.5px; }
  .hero { padding-top:18px; } .hero h1 { font-size:43px; margin-bottom:12px; }
  .hero-lead { font-size:15px; margin-bottom:14px; } .hero .eyebrow { font-size:9px; letter-spacing:.11em; } .hero-grid { gap:13px; }
  .home-course-shortcut { padding-inline:12px; font-size:15px; gap:7px; } .hero-practical a { font-size:13px; gap:8px; }
  .course-card { grid-template-columns:82px minmax(0,1fr); } .course-body { padding:18px 14px; }
  .course-body-head h3 { font-size:30px; } .course-body p { font-size:14px; } .course-img img { min-height:180px; }
  .listening-poster h3 { font-size:43px; } .listening-poster-content { padding:22px; }
  .mobile-cta { padding-inline:14px; } .mobile-cta .btn { font-size:15px; padding-inline:10px; }
  .menu-dialog .official-logo { width:48px; height:48px; } .menu-dialog .wordmark-name { font-size:24px; }
  .finder-inner { padding:20px; } .finder-dialog h2 { font-size:34px; } .finder-top .eyebrow { font-size:9px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
  .js .reveal.waiting { opacity:1; transform:none; }
}


/* Browser clipping preserves the original PNG pixels and removes its outer canvas. */
.brand-crop-defs { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
.official-logo { clip-path:url(#perlamusic-logo-cutout); }

/* PerlaMusic: a musical programme, a named teacher and an actual musical archive. */
.top-note,.eyebrow { display:none; }
.press-note .eyebrow,.finder-top .eyebrow,.finder-result .eyebrow { display:block; text-transform:none; letter-spacing:0; font-size:14px; }
.eyebrow::before { content:none; }
.section { padding-block:78px; }
h1,h2,h3 { letter-spacing:0; }
em { color:inherit; }
.btn { border-radius:2px; }
.btn:hover,.text-link:hover .icon { transform:none; }
.header-inner { height:94px; min-width:0; }
.desktop-nav { gap:21px; }
.desktop-nav a { font-size:14px; }
.identity-hero { background:var(--blue); color:white; padding:48px 0 0; }
.identity-hero .hero-grid { grid-template-columns:5fr 7fr; gap:52px; }
.hero-copy { padding:0; }
.identity-hero h1 { color:white; text-transform:uppercase; font-weight:700; font-size:clamp(62px,6.4vw,88px); line-height:.98; max-width:none; letter-spacing:-.01em; margin-bottom:24px; animation:none; }
.hero-location { color:var(--silver); font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.12em; margin-bottom:20px; }
.identity-hero .hero-lead { color:#e3edf4; font-size:20px; line-height:1.55; margin:0 0 18px; }
.identity-hero .hero-lead strong { color:white; font-weight:600; }
.hero-pathways { color:#c8d9e5; font-size:16px; line-height:1.65; margin-bottom:28px; }
.identity-hero .actions { align-items:flex-start; flex-direction:column; gap:20px; }
.hero-preparation { display:inline-flex; align-items:center; gap:13px; color:white; font-size:15px; min-height:34px; border-bottom:1px solid #99b7ca; }
.hero-preparation .icon { width:17px; }
.identity-photo { margin:0; min-width:0; border:1px solid #b2c8d5; padding:8px; background:#0d456c; }
.identity-photo .responsive-picture { width:100%; }
.identity-photo img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.identity-photo figcaption { display:flex; justify-content:space-between; gap:20px; padding:14px 5px 5px; font-size:12px; line-height:1.5; color:#cfdee8; }
.identity-photo figcaption strong { color:white; }
.hero-grounding { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:40px; padding:20px 0; border-top:1px solid #789cb5; font-size:14px; color:#d8e4ec; }
.hero-grounding > span { font-family:var(--display); font-size:24px; letter-spacing:.01em; color:white; }
.hero-grounding a { display:flex; align-items:center; gap:15px; }
.hero-grounding .icon { width:17px; }
.programme-section { padding-bottom:60px; }
.programme-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:30px; }
.programme-heading h2 { font-size:clamp(44px,4.6vw,60px); }
.programme-heading p { margin:0 0 2px; color:var(--muted); font-size:17px; line-height:1.6; }
.programme-layout { display:grid; grid-template-columns:2fr 1fr; }
.programme-panel { display:flex; min-width:0; padding:5px 34px 10px; background:var(--silver); }
.course-list.programme-list { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:repeat(4,minmax(0,1fr)); flex:1; width:100%; }
.course-entry { display:flex; flex-direction:row; justify-content:space-between; align-items:center; gap:28px; padding:21px 5px; border:0; border-bottom:1px solid #8da3b1; background:transparent; }
.course-entry:last-child { border-bottom:0; }
.course-entry h3 { font-size:clamp(42px,4.5vw,60px); line-height:1.05; margin:0; min-height:0; }
.course-entry .course-read { display:flex; align-items:center; gap:20px; padding:0; margin:0; font-size:13px; flex-shrink:0; }
.course-entry .course-read .icon { width:22px; height:22px; }
.course-entry:hover { color:var(--blue); background:#dae2e7; }
.course-entry:hover h3 { text-decoration:none; }
.programme-teacher { background:var(--ink); color:white; padding:34px; display:flex; flex-direction:column; align-items:flex-start; }
.programme-teacher img { width:88px; height:88px; object-fit:cover; margin-bottom:24px; }
.programme-teacher h2 { font-size:35px; margin-bottom:18px; }
.programme-teacher p { font-size:15px; line-height:1.6; color:#ccdae4; }
.programme-teacher .teacher-disciplines { color:white; font-family:var(--display); font-size:25px; line-height:1.25; margin-bottom:20px; }
.programme-teacher .text-link { margin-top:auto; color:white; font-size:14px; }
.study-directions { display:grid; grid-template-columns:.9fr 1fr 1fr 1.3fr; align-items:center; gap:20px; padding:25px 0 0; }
.study-directions p { margin:0; color:var(--muted); font-size:14px; }
.study-directions a { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:14px; font-weight:600; min-height:44px; border-bottom:1px solid var(--line); }
.study-directions .icon { width:17px; flex-shrink:0; }
.conservatory-section { background:var(--blue); color:white; }
.conservatory-layout { display:grid; grid-template-columns:1.05fr .95fr; gap:90px; align-items:center; }
.conservatory-layout h2 { font-size:clamp(48px,5.6vw,74px); line-height:1.04; max-width:16ch; margin-bottom:24px; }
.conservatory-intro { font-size:18px; color:#d3e0ea; line-height:1.65; max-width:37ch; }
.conservatory-layout .text-link { color:white; margin-top:8px; }
.admission-paths > p { color:#c7d7e4; font-size:16px; margin-bottom:25px; }
.admission-paths > a { position:relative; display:block; padding:21px 54px 25px 0; border-top:1px solid #87a6bb; }
.admission-paths span { display:block; font-size:14px; color:#d3e0ea; margin-bottom:8px; }
.admission-paths strong { display:block; font:600 47px/1 var(--display); }
.admission-paths .icon { position:absolute; right:4px; top:50%; width:25px; height:25px; }
.admission-paths > a:hover strong { color:var(--silver); }
.listening-layout { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:70px; }
.listening-image { margin:0 0 22px; padding:8px; background:white; border:1px solid var(--line); }
.listening-image img { width:100%; height:auto; aspect-ratio:16/11; object-fit:cover; }
.listening-image figcaption { font:600 34px/1.1 var(--display); padding:17px 12px 9px; }
.listening-layout h2 { font-size:47px; margin-bottom:24px; }
.listening-layout p { color:var(--muted); }
.listening-layout .recordings { margin-top:0; border-top:1px solid var(--line); }
.recording-type { display:none; }
.recording-note { margin-top:30px; }
.recording-note h3 { font-size:27px; margin-bottom:14px; }
.recording-note p,.recording-note a { font-size:15px; }
.recording-note a { text-decoration:underline; text-underline-offset:4px; }
.evidence-section { background:var(--soft); border-block:1px solid var(--line); }
.evidence-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:90px; }
.evidence-layout h2 { font-size:54px; max-width:16ch; margin-bottom:23px; }
.evidence-layout > div > p { max-width:36ch; color:var(--muted); }
.evidence-notes article { padding:20px 0; border-top:1px solid var(--line); }
.evidence-notes article:first-child { padding-top:0; border-top:0; }
.evidence-notes h3 { font-size:31px; margin-bottom:14px; }
.evidence-notes p { font-size:16px; color:var(--muted); }
.evidence-notes .evidence-source { font-size:13px; margin-bottom:9px; }
.faq-grid { gap:70px; }
.faq-intro h2 { font-size:42px; }
.faq-list { border-top:1px solid var(--line); }
.home-visit { background:var(--silver); }
.visit-layout { display:grid; grid-template-columns:1.3fr .7fr; gap:90px; }
.visit-layout h2 { font-size:50px; margin-bottom:24px; }
.visit-layout h3 { font-size:34px; margin-bottom:23px; }
.visit-layout p { max-width:47ch; color:#29485c; }
.visit-address { padding-left:36px; border-left:1px solid #8da3b1; }
.contact-banner { border-top:0; padding-block:44px; }
.contact-banner::before { content:none; }
.contact-banner h2 { font-size:44px; }
.contact-banner p { margin-top:13px; }
.page-hero { padding:24px 0 50px; border-bottom:1px solid var(--line); }
.page-hero h1 { max-width:22ch; font-size:clamp(49px,5.5vw,76px); }
.page-hero .lead { max-width:57ch; font-size:20px; }
.course-page-hero { background:var(--blue); color:white; }
.course-page-hero .breadcrumb,.course-page-hero .breadcrumb a { color:#c5d8e5; }
.course-page-hero h1 { font-size:clamp(68px,8vw,112px); }
.course-page-hero .lead { color:#d5e3ec; }
.course-page-hero .btn { background:var(--paper); color:var(--blue); border-color:var(--paper); }
.course-location { font-size:13px; color:#c6d9e5; }
.course-teacher-line { font-size:24px; margin:20px 0 12px; }
.course-notes-layout { display:grid; grid-template-columns:1.2fr .8fr; gap:90px; }
.course-notes-layout h2 { font-size:45px; margin-bottom:22px; }
.course-notes-layout h3 { font-size:31px; margin-bottom:18px; }
.course-notes-layout p { color:var(--muted); }
.course-notes-layout aside { border-left:1px solid var(--line); padding-left:35px; }
.course-extra { max-width:1184px; margin:0 auto; padding:42px 48px; border-top:1px solid var(--line); }
.course-extra h3 { font-size:33px; margin-bottom:15px; }
.course-extra p { color:var(--muted); }
.teaching-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; align-items:start; }
.teacher-profile img { width:150px; height:150px; object-fit:cover; margin-bottom:25px; }
.teacher-profile h2 { font-size:40px; margin-bottom:20px; }
.teacher-profile p,.teaching-layout p { color:var(--muted); }
.teaching-layout > div > h2 { margin-bottom:20px; }
.real-space { width:100%; height:auto; }
.project-list { display:grid; grid-template-columns:repeat(3,1fr); gap:35px; margin-top:32px; }
.project-line { padding-top:23px; border-top:1px solid var(--line); }
.project-line h3 { margin-bottom:18px; }
.project-line p { color:var(--muted); font-size:16px; }
.preparation-disciplines { font-size:20px; color:var(--muted); margin-top:25px; }
.admission-fields { display:grid; gap:12px; margin-block:16px; padding-top:16px; border-top:1px solid var(--line); }
.admission-fields[hidden] { display:none; }
.choice > .icon:first-child { display:none; }
.footer h3 { text-transform:none; letter-spacing:0; font-size:15px; }
.reveal,.js .reveal.waiting { opacity:1; transform:none; transition:none; }
@media (max-width:1250px) {
 .header-actions > .btn { display:none; }
 .identity-hero .hero-grid { gap:35px; }
 .identity-hero h1 { font-size:70px; }
 .conservatory-layout,.evidence-layout,.visit-layout { gap:55px; }
 .programme-teacher { padding:28px; }
 .programme-panel { padding-inline:28px; }
}
@media (max-width:940px) {
 .programme-layout { grid-template-columns:1.55fr 1fr; }
 .programme-teacher h2 { font-size:31px; }
 .course-entry h3 { font-size:47px; }
 .course-entry .course-read > span { display:none; }
 .study-directions { grid-template-columns:1fr 1fr 1fr; }
 .study-directions > p { grid-column:1/-1; }
 .identity-hero h1 { font-size:62px; }
 .identity-hero .hero-lead { font-size:18px; }
 .hero-pathways { font-size:15px; }
}
@media (max-width:700px) {
 .header-inner { height:78px; }
 .section { padding-block:46px; }
 .identity-hero { padding-top:28px; }
 .identity-hero .hero-grid { grid-template-columns:1fr; gap:28px; }
 .identity-hero h1 { font-size:clamp(48px,13vw,70px); margin-bottom:20px; }
 .hero-location { font-size:10px; margin-bottom:16px; }
 .identity-hero .hero-lead { font-size:18px; }
 .hero-pathways { margin-bottom:22px; }
 .identity-hero .actions { gap:13px; }
 .hero-preparation { font-size:14px; }
 .identity-photo { padding:5px; }
 .identity-photo img { aspect-ratio:16/9; }
 .identity-photo figcaption { padding:9px 5px 5px; font-size:11px; gap:13px; flex-wrap:wrap; }
 .hero-grounding { display:block; margin-top:27px; padding:18px 0; }
 .hero-grounding > span { display:block; font-size:22px; }
 .hero-grounding a { margin-top:12px; font-size:13px; }
 .programme-heading { display:block; margin-bottom:23px; }
 .programme-heading h2 { font-size:41px; }
 .programme-heading p { margin-top:17px; font-size:16px; }
 .programme-layout { grid-template-columns:1fr; }
 .programme-panel { padding:4px 22px; }
 .course-entry { min-height:90px; padding:20px 0; gap:18px; }
 .course-entry h3 { font-size:42px; }
 .course-entry .course-read .icon { width:21px; }
 .programme-teacher { padding:27px; }
 .programme-teacher img { width:70px; height:70px; margin-bottom:22px; }
 .programme-teacher h2 { font-size:36px; }
 .programme-teacher .teacher-disciplines { font-size:28px; }
 .programme-teacher p { font-size:16px; }
 .programme-teacher .text-link { margin-top:8px; }
 .study-directions { display:block; padding-top:22px; }
 .study-directions > p { margin-bottom:13px; }
 .study-directions a { min-height:52px; font-size:15px; }
 .conservatory-layout,.listening-layout,.evidence-layout,.visit-layout,.course-notes-layout,.teaching-layout { grid-template-columns:1fr; gap:35px; }
 .conservatory-layout h2 { font-size:49px; }
 .conservatory-intro { font-size:17px; }
 .admission-paths strong { font-size:42px; }
 .admission-paths > p { font-size:15px; }
 .listening-layout h2 { font-size:39px; }
 .listening-image img { aspect-ratio:16/10; }
 .listening-image figcaption { font-size:30px; }
 .evidence-layout h2 { font-size:43px; }
 .faq-intro h2 { font-size:37px; }
 .visit-layout h2 { font-size:43px; }
 .visit-layout .actions { flex-direction:column; align-items:stretch; }
 .visit-address { padding:28px 0 0; border-left:0; border-top:1px solid #8da3b1; }
 .page-hero h1 { font-size:clamp(44px,11vw,62px); }
 .course-page-hero h1 { font-size:clamp(64px,16vw,85px); }
 .page-hero .lead { font-size:18px; }
 .course-teacher-line { font-size:21px; }
 .course-notes-layout h2 { font-size:37px; }
 .course-notes-layout aside { padding:25px 0 0; border-left:0; border-top:1px solid var(--line); }
 .course-extra { padding:30px 22px; }
 .project-list { grid-template-columns:1fr; gap:25px; }
 .teacher-profile { display:grid; grid-template-columns:85px 1fr; gap:18px; }
 .teacher-profile img { width:85px; height:105px; margin:0; }
 .teacher-profile h2 { font-size:32px; margin-bottom:15px; }
 .teacher-profile p { font-size:15px; }
 .contact-banner h2 { font-size:37px; }
}

/* Band editorial feature and compact, touch-friendly phone composition. */
.identity-photo figcaption a { display:inline-flex; align-items:center; gap:10px; color:white; font-weight:600; }
.identity-photo figcaption a .icon { width:15px; height:15px; }
.project-navigation { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.project-navigation a { display:flex; align-items:center; min-height:46px; padding:10px 17px; border:1px solid var(--line); font-size:15px; font-weight:600; }
.project-navigation a:hover { background:var(--blue); border-color:var(--blue); color:white; }
.band-section { background:var(--ink); color:white; }
.band-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:32px; }
.band-label { font-size:13px; color:#c5d6e1; margin-bottom:12px; }
.band-heading h2 { font-size:clamp(52px,6vw,80px); line-height:1; }
.band-heading > p { margin:0 0 2px; font-size:19px; line-height:1.5; color:#d4e1e9; }
.band-photo { margin:0; }
.band-photo img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.band-photo figcaption { font-size:12px; color:#b9cfdd; margin-top:12px; }
.band-story { display:grid; grid-template-columns:1.2fr .8fr; gap:70px; margin-top:32px; }
.band-story p { color:#d2e0e9; font-size:17px; line-height:1.65; }
.band-story .band-lead { color:white; font-size:23px; line-height:1.55; }
.band-story .btn { margin-top:8px; }
.band-sources { display:flex; align-items:center; flex-wrap:wrap; gap:8px 25px; border-top:1px solid #536f81; padding-top:20px; margin-top:28px; font-size:13px; }
.band-sources > span { color:#b9cfdd; }
.band-sources a { display:inline-flex; align-items:center; min-height:44px; color:white; text-decoration:underline; text-underline-offset:4px; }
@media (max-width:700px) {
 html { scroll-padding-top:88px; }
 .header-inner { height:72px; padding-inline:18px; }
 .official-logo { width:56px; height:56px; }
 .wordmark { gap:9px; }
 .wordmark-name { font-size:26px; }
 .wordmark-sub { font-size:7px; margin-top:5px; letter-spacing:.08em; }
 .menu-trigger { width:44px; height:44px; }
 .identity-hero { padding-top:23px; }
 .identity-hero .hero-grid { gap:22px; }
 .identity-hero h1 { font-size:clamp(43px,11.8vw,57px); margin-bottom:17px; }
 .hero-location { margin-bottom:13px; }
 .identity-hero .hero-lead { font-size:17px; line-height:1.5; margin-bottom:14px; }
 .hero-pathways { font-size:15px; line-height:1.5; margin-bottom:20px; }
 .identity-hero .actions { gap:8px; align-items:stretch; }
 .identity-hero .actions .btn { width:100%; min-height:48px; }
 .hero-preparation { min-height:44px; justify-content:space-between; border-bottom:0; font-size:14px; }
 .identity-photo figcaption { gap:4px 12px; }
 .identity-photo figcaption a { min-height:44px; width:100%; justify-content:space-between; }
 .identity-photo figcaption > span { display:none; }
 .hero-grounding { margin-top:20px; padding:14px 0; }
 .hero-grounding > span { display:none; }
 .hero-grounding a { margin:0; min-height:32px; justify-content:space-between; }
 .section { padding-block:38px; }
 .programme-heading { margin-bottom:20px; }
 .programme-heading h2 { font-size:37px; }
 .programme-heading p { margin-top:13px; font-size:15px; }
 .programme-panel { padding-inline:20px; }
 .course-entry { min-height:78px; padding:16px 0; gap:16px; }
 .course-entry h3 { font-size:39px; }
 .programme-teacher { display:grid; grid-template-columns:72px minmax(0,1fr); gap:9px 17px; padding:23px 22px; align-items:start; }
 .programme-teacher img { grid-column:1; grid-row:1/3; width:72px; height:82px; margin:0; }
 .programme-teacher h2 { grid-column:2; font-size:30px; margin:0; line-height:1.08; }
 .programme-teacher .teacher-disciplines { grid-column:2; font-size:21px; line-height:1.25; margin:0; }
 .programme-teacher > p:not(.teacher-disciplines) { grid-column:1/-1; font-size:15px; line-height:1.6; margin:13px 0 0; }
 .programme-teacher .text-link { grid-column:1/-1; margin-top:6px; justify-self:start; min-height:44px; }
 .study-directions { padding-top:19px; }
 .study-directions a { min-height:50px; }
 .conservatory-layout { gap:24px; }
 .conservatory-layout h2 { font-size:44px; margin-bottom:18px; }
 .conservatory-intro { font-size:16px; }
 .admission-paths > p { margin-bottom:18px; }
 .admission-paths > a { padding:19px 42px 22px 0; }
 .admission-paths strong { font-size:38px; }
 body .preparation-hero h1,body .projects-hero h1 { font-size:43px; line-height:1.06; }
 .preparation-disciplines { font-size:17px; line-height:1.6; }
 .recording-row { gap:10px; }
 .recording-name strong { font-size:16px; }
 .recording-external { width:34px; }
 .listening-layout,.evidence-layout,.visit-layout { gap:27px; }
 .listening-layout h2,.evidence-layout h2,.visit-layout h2 { font-size:38px; }
 .contact-layout .message-box { order:-1; padding:23px 19px; }
 .contact-layout { gap:30px; }
 .contact-details > h2 { font-size:34px; }
 .contact-main .location-art { display:none; }
 .location-box { margin-top:28px; }
 .location-copy { padding:24px 20px; }
 .location-copy h2 { font-size:35px; }
 .message-box h2 { font-size:35px; }
 .message-box > p,.message-form .form-hint { line-height:1.6; }
 .message-box .form-notice { font-size:13px; }
 .message-form label { line-height:1.45; }
 .message-form select,.message-form textarea { width:100%; min-width:0; font-size:16px; }
 .message-form .btn { min-height:48px; }
 .mobile-cta { gap:9px; padding:8px 14px calc(8px + env(safe-area-inset-bottom)); }
 .mobile-cta .btn { min-height:46px; font-size:15px; padding:11px 12px; }
 .footer-top { grid-template-columns:1fr; gap:25px; }
 .footer-links { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:4px 20px; }
 .footer-links a { min-height:44px; display:flex; align-items:center; line-height:1.5; }
 .footer-top > div:nth-child(2) .footer-links a:first-child { grid-column:1/-1; }
 .footer h3 { font-size:14px; margin-bottom:12px; }
 .project-navigation { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9px; margin-top:22px; }
 .project-navigation a { justify-content:center; text-align:center; font-size:14px; padding:10px; min-height:46px; }
 .project-navigation a:last-child { grid-column:1/-1; }
 .band-heading { display:block; margin-bottom:23px; }
 .band-label { font-size:12px; margin-bottom:13px; }
 .band-heading h2 { font-size:48px; }
 .band-heading > p { margin-top:17px; font-size:17px; }
 .band-story { grid-template-columns:1fr; gap:18px; margin-top:25px; }
 .band-story .band-lead { font-size:20px; line-height:1.55; margin-bottom:0; }
 .band-story p { font-size:16px; }
 .band-story .btn { width:100%; white-space:normal; text-align:center; }
 .band-sources { align-items:stretch; flex-direction:column; gap:0; margin-top:24px; padding-top:17px; }
 .band-sources > span { margin-bottom:5px; }
 .band-sources a { min-height:46px; }
}
@media (max-width:360px) {
 .wrap { padding-inline:18px; }
 .identity-hero h1 { font-size:42px; }
 .programme-heading h2 { font-size:35px; }
 .course-entry h3 { font-size:36px; }
 .programme-panel { padding-inline:18px; }
 .programme-teacher { padding-inline:19px; grid-template-columns:65px minmax(0,1fr); gap:9px 14px; }
 .programme-teacher img { width:65px; height:78px; }
 .programme-teacher h2 { font-size:28px; }
 .programme-teacher .teacher-disciplines { font-size:20px; }
 .conservatory-layout h2 { font-size:41px; }
 .band-heading h2 { font-size:44px; }
 .footer-links { font-size:13px; gap:4px 16px; }
}

/* School-first opening and direct contact, October 2026 revision. */
.identity-hero { padding-top:54px; }
.identity-hero .hero-grid { grid-template-columns:1fr 1fr; gap:56px; }
.identity-hero h1 { font-size:clamp(60px,5.6vw,80px); max-width:none; text-transform:none; line-height:1; margin-bottom:25px; }
.identity-hero h1 span { display:block; color:var(--silver); }
.identity-hero .hero-location { font-size:11px; line-height:1.6; letter-spacing:.1em; margin-bottom:22px; }
.identity-hero .hero-lead { font-size:21px; line-height:1.5; max-width:42ch; }
.identity-hero .hero-pathways { max-width:34ch; font-size:17px; line-height:1.6; margin-bottom:27px; }
.identity-hero .actions { flex-direction:row; gap:12px; align-items:center; }
.identity-hero .btn.hero-secondary { background:transparent; color:white; border-color:#a0bacb; }
.identity-hero .btn.hero-secondary:hover { background:#174c72; border-color:white; }
.identity-hero .hero-preparation { margin-top:18px; min-height:44px; font-size:14px; color:#e3edf4; border-bottom:0; }
.identity-hero .hero-preparation:hover { text-decoration:underline; text-underline-offset:5px; }
.identity-photo { padding:0; background:transparent; border-color:#789cb5; }
.identity-photo .school-hero-photo { aspect-ratio:4/3; object-fit:cover; }
.identity-photo figcaption { padding:14px 18px; gap:12px; align-items:center; font-size:13px; }
.identity-photo figcaption a { display:inline-flex; align-items:center; gap:12px; min-height:44px; color:white; }
.hero-grounding { margin-top:42px; padding-block:17px; }
.hero-grounding > span { font-size:22px; }
.course-entry > div { min-width:0; }
.course-entry .course-entry-intro { margin:9px 0 0; max-width:41ch; font-size:15px; line-height:1.5; color:#29485c; }
.course-entry .course-read { font-size:12px; gap:13px; }
.listening-image figcaption a { display:flex; justify-content:space-between; align-items:center; gap:15px; }
.listening-image figcaption .icon { width:24px; height:24px; }
.teacher-profile { scroll-margin-top:120px; }
.teacher-profile .text-link { font-size:15px; }
.teacher-contact { margin-top:20px; }
.section-kicker { color:var(--blue); font-size:12px; line-height:1.5; letter-spacing:.1em; text-transform:uppercase; font-weight:600; margin-bottom:18px; }

@media (min-width:701px) and (max-width:1100px) {
 .identity-hero .hero-grid { gap:32px; }
 .identity-hero h1 { font-size:62px; }
 .identity-hero .hero-lead { font-size:18px; }
 .identity-hero .actions { align-items:flex-start; flex-direction:column; }
 .identity-photo figcaption { display:block; padding:10px 14px; }
 .identity-photo figcaption a { min-height:36px; }
 .course-entry .course-entry-intro { font-size:14px; }
}
@media (max-width:700px) {
 .identity-hero { padding-top:27px; }
 .identity-hero .hero-grid { grid-template-columns:minmax(0,1fr); gap:27px; }
 .identity-hero h1 { font-size:clamp(46px,12.5vw,68px); max-width:none; margin-bottom:19px; }
 .identity-hero .hero-location { font-size:10px; margin-bottom:15px; letter-spacing:.055em; }
 .identity-hero .hero-lead { font-size:18px; margin-bottom:15px; }
 .identity-hero .hero-pathways { font-size:16px; margin-bottom:22px; }
 .identity-hero .actions { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
 .identity-hero .actions .btn { width:100%; min-height:49px; }
 .identity-hero .hero-preparation { font-size:14px; margin-top:10px; line-height:1.45; justify-content:space-between; width:100%; }
 .identity-photo .school-hero-photo { aspect-ratio:16/9; }
 .identity-photo figcaption { padding:7px 13px; font-size:12px; }
 .identity-photo figcaption > span { display:block; }
 .identity-photo figcaption a { width:auto; min-height:44px; font-size:12px; }
 .identity-photo figcaption .icon { width:16px; }
 .hero-grounding { margin-top:25px; padding-block:12px; }
 .hero-grounding a { font-size:13px; }
 .course-entry { min-height:110px; }
 .course-entry .course-entry-intro { font-size:14px; line-height:1.45; margin-top:7px; max-width:31ch; }
 .course-entry h3 { font-size:38px; }
 .teacher-profile { scroll-margin-top:92px; }
 .section-kicker { font-size:11px; margin-bottom:13px; }
}

/* Home sequence requested from the Cloudflare reference: introduction,
   courses, association, listening, social channels, questions and contacts. */
.reference-home .top-note { display:block; padding:6px 18px; font-size:10px; letter-spacing:.12em; }
.reference-hero { background:var(--paper); color:var(--ink); padding:45px 0 30px; }
.reference-hero .hero-grid { grid-template-columns:.88fr 1.12fr; gap:70px; }
.reference-hero .hero-copy { padding-block:14px; }
.reference-hero h1 { color:var(--ink); font-size:clamp(60px,6.1vw,84px); line-height:.98; max-width:11ch; margin-bottom:27px; animation:none; }
.reference-hero h1 em { color:var(--blue); }
.reference-hero .hero-lead { max-width:38ch; color:var(--muted); font-size:20px; line-height:1.55; margin-bottom:17px; }
.reference-hero .hero-lead strong { color:var(--ink); }
.reference-pathways { max-width:40ch; color:var(--muted); font-size:17px; line-height:1.6; margin-bottom:26px; }
.reference-hero .actions { gap:16px 23px; }
.reference-hero .actions .text-link { font-size:15px; min-height:44px; }
.reference-hero .hero-practical { margin-top:14px; }
.reference-hero .hero-art { margin:20px 0; }
.reference-hero .hero-photo-frame { animation:none; }
.reference-hero .hero-overlay a { display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; min-height:35px; }
.reference-hero .hero-bottom { gap:25px; margin-top:29px; padding-top:16px; }
.reference-hero .hero-bottom a { min-height:44px; font-size:14px; }
.reference-home .section-head h2 { max-width:16ch; }
.reference-course-panel .programme-list { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:none; gap:0; }
.reference-course-panel .course-entry { padding:28px 32px; background:var(--silver); gap:20px; min-height:158px; border:1px solid #a2b5bf; }
.reference-course-panel .course-entry h3 { font-size:43px; }
.reference-course-panel .course-entry .course-entry-intro { font-size:16px; }
.reference-course-panel .course-read > span { display:none; }
.reference-course-panel .course-entry:hover { background:#d9e2e6; }
.reference-home .activity-card { background:transparent; padding:27px 28px; }
.reference-home .activity-card h3 { font-size:32px; }
.reference-home .activity-card p { margin:17px 0 20px; }
.reference-home .activity-card .section-kicker { margin:0 0 15px; color:var(--blue); }
.home-association .approach-grid { gap:74px; }
.home-association h2 { font-size:54px; }
.home-teacher { display:grid; grid-template-columns:80px minmax(0,1fr); gap:23px; align-items:center; margin:28px 0 22px; }
.home-teacher img { width:80px; height:88px; object-fit:cover; }
.home-teacher h3 { font-size:31px; margin-bottom:8px; }
.home-teacher p { margin:0; font-size:16px; color:var(--muted); line-height:1.6; }
.teacher-story-intro { color:var(--muted); font-size:16px; }
.home-listening .stage-grid { grid-template-columns:1.1fr .9fr; gap:70px; align-items:center; }
.home-listening h2 { max-width:14ch; }
.channel-feature { background:var(--blue); color:white; border:1px solid var(--blue); }
.channel-banner { display:block; width:100%; height:95px; object-fit:cover; border-bottom:1px solid #6b8da7; }
.channel-feature-body { padding:31px 34px 34px; }
.channel-heading { display:flex; align-items:center; gap:17px; margin-bottom:24px; }
.channel-icon { display:grid; place-items:center; background:white; width:60px; height:60px; flex-shrink:0; }
.channel-icon img { width:35px; height:35px; object-fit:contain; }
.channel-heading p { margin:0; font-size:14px; color:#d4e1e9; line-height:1.6; }
.channel-heading strong { color:white; font-size:17px; }
.channel-feature h3 { font-size:49px; max-width:11ch; line-height:1.06; margin-bottom:21px; }
.channel-feature-body > p { max-width:35ch; color:#e0e9ef; font-size:17px; line-height:1.65; }
.channel-feature .text-link { color:white; min-height:44px; margin-top:8px; }
.social-section .eyebrow { display:block; text-transform:uppercase; letter-spacing:.1em; font-size:11px; margin-bottom:18px; }
.social-section .section-head { align-items:center; }
.social-card { min-height:180px; }
.social-card .social-icon { width:34px; height:34px; }
.social-card h3 { font-size:33px; }

.teacher-history { background:var(--soft); border-block:1px solid var(--line); scroll-margin-top:110px; }
.history-layout { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:80px; align-items:start; }
.history-intro h2 { font-size:54px; max-width:13ch; margin-bottom:25px; }
.history-intro > p:not(.section-kicker) { color:var(--muted); font-size:17px; line-height:1.75; }
.history-list { list-style:none; padding:0; margin:0; }
.history-list > li { display:grid; grid-template-columns:65px minmax(0,1fr); gap:22px; padding:25px 0; border-top:1px solid #aabcc6; }
.history-list > li:first-child { padding-top:0; border-top:0; }
.history-list > li:last-child { padding-bottom:0; }
.history-year { color:var(--blue); font:600 34px/1.15 var(--display); }
.history-list h3 { font-size:29px; line-height:1.15; margin-bottom:14px; }
.history-list p { font-size:16px; color:var(--muted); line-height:1.75; margin-bottom:13px; }
.history-list .text-link { font-size:13px; min-height:44px; line-height:1.5; gap:10px; }
.history-list .text-link .icon { width:16px; height:16px; }

@media (min-width:701px) and (max-width:1100px) {
 .reference-hero .hero-grid { gap:34px; }
 .reference-hero h1 { font-size:65px; }
 .reference-hero .hero-lead { font-size:18px; }
 .reference-hero .hero-orbit { width:330px; }
 .reference-hero .hero-bottom { flex-wrap:wrap; gap:12px 30px; }
 .reference-course-panel .course-entry { padding:24px; }
 .reference-course-panel .course-entry h3 { font-size:38px; }
 .home-association .approach-grid,.home-listening .stage-grid { gap:35px; }
 .channel-feature-body { padding:25px; }
 .history-layout { gap:40px; grid-template-columns:.7fr 1.3fr; }
 .history-intro h2 { font-size:46px; }
}
@media (max-width:700px) {
 .reference-home .top-note { font-size:8px; letter-spacing:.035em; line-height:1.6; padding:5px 14px; }
 .reference-hero { padding:26px 0 24px; }
 .reference-hero .hero-grid { grid-template-columns:minmax(0,1fr); gap:25px; }
 .reference-hero .hero-copy { padding:0; }
 .reference-hero .section-kicker { font-size:10px; margin-bottom:15px; }
 .reference-hero h1 { font-size:clamp(46px,12.5vw,65px); max-width:none; margin-bottom:20px; }
 .reference-hero .hero-lead { font-size:18px; line-height:1.5; margin-bottom:14px; }
 .reference-pathways { font-size:16px; margin-bottom:21px; }
 .reference-hero .actions { gap:10px; align-items:stretch; flex-direction:column; }
 .reference-hero .actions .btn { width:100%; }
 .reference-hero .actions .text-link { align-self:flex-start; min-height:44px; }
 .reference-hero .hero-practical { margin-top:10px; }
 .reference-hero .hero-art { margin:0; }
 .reference-hero .hero-photo-frame { transform:none; }
 .reference-hero .hero-overlay { font-size:9px; }
 .reference-hero .hero-bottom { display:grid; grid-template-columns:minmax(0,1fr); gap:3px; margin-top:24px; padding-top:15px; }
 .reference-hero .hero-bottom a { justify-content:space-between; font-size:14px; }
 .reference-home .section-head { display:block; margin-bottom:25px; }
 .reference-home .section-head h2 { font-size:40px; max-width:15ch; }
 .reference-home .section-head p { margin-top:17px; font-size:16px; }
 .reference-course-panel .programme-list { grid-template-columns:minmax(0,1fr); }
 .reference-course-panel .course-entry { min-height:125px; padding:22px; }
 .reference-course-panel .course-entry h3 { font-size:38px; }
 .reference-course-panel .course-entry .course-entry-intro { font-size:15px; }
 .reference-home .activity-card { padding:23px; }
 .reference-home .activity-card h3 { font-size:30px; }
 .reference-home .activity-card .section-kicker { margin-top:0; font-size:10px; }
 .home-association .approach-grid,.home-listening .stage-grid { grid-template-columns:minmax(0,1fr); gap:32px; }
 .home-association h2 { font-size:40px; }
 .home-association .school-photo { order:0; }
 .home-teacher { grid-template-columns:68px minmax(0,1fr); gap:18px; margin-block:24px 20px; }
 .home-teacher img { width:68px; height:80px; }
 .home-teacher h3 { font-size:29px; }
 .home-teacher p { font-size:15px; }
 .channel-feature-body { padding:25px; }
 .channel-banner { height:76px; }
 .channel-feature h3 { font-size:43px; max-width:none; }
 .channel-feature-body > p { font-size:16px; }
 .channel-heading { margin-bottom:22px; }
 .social-card { min-height:0; padding:22px 0; }
 .social-card h3 { font-size:31px; }
 .teacher-history { scroll-margin-top:90px; }
 .history-layout { grid-template-columns:minmax(0,1fr); gap:33px; }
 .history-intro h2 { font-size:42px; max-width:15ch; margin-bottom:22px; }
 .history-intro > p:not(.section-kicker) { font-size:16px; }
 .history-list > li { grid-template-columns:50px minmax(0,1fr); gap:17px; padding:24px 0; }
 .history-year { font-size:29px; }
 .history-list h3 { font-size:27px; }
 .history-list p { font-size:15px; }
 .history-list .text-link { font-size:12px; }
}

/* Official YouTube photography: full frames and discreet source links. */
.home-teacher { display:block; padding-left:22px; border-left:3px solid var(--blue); }
.home-association .school-photo img { height:auto; aspect-ratio:16/9; }
.teacher-profile { display:block; }
.programme-teacher { display:flex; }
.channel-photo { display:block; }
.channel-photo img,.performance-photo img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.performance-photo { display:block; }

/* Biography: a readable long-form profile with a chapter index. */
.teacher-biography { background:var(--silver); scroll-margin-top:110px; }
.biography-heading { max-width:850px; margin-bottom:58px; }
.biography-heading h2 { font-size:clamp(42px,5vw,64px); line-height:1.05; margin-bottom:24px; }
.biography-lead { font-size:22px; line-height:1.65; color:var(--muted); margin:0; }
.biography-layout { display:grid; grid-template-columns:minmax(210px,.7fr) minmax(0,1.6fr); gap:85px; align-items:start; }
.biography-index { position:sticky; top:120px; }
.biography-dates { margin:24px 0 28px; }
.biography-dates > div { display:grid; grid-template-columns:74px 1fr; gap:14px; padding:15px 0; border-top:1px solid #aabcc6; align-items:center; }
.biography-dates dt { color:var(--blue); font:600 37px/1 var(--display); }
.biography-dates dd { margin:0; color:var(--muted); font-size:15px; line-height:1.4; }
.biography-index nav { display:grid; }
.biography-index nav a { display:flex; justify-content:space-between; align-items:center; gap:15px; min-height:44px; padding:9px 0; font-size:14px; color:var(--blue); }
.biography-index nav .icon { width:16px; height:16px; flex-shrink:0; }
.biography-chapter { padding-bottom:38px; margin-bottom:38px; border-bottom:1px solid #aabcc6; scroll-margin-top:120px; }
.biography-chapter .section-kicker { margin-bottom:14px; }
.biography-chapter h3 { font-size:36px; line-height:1.15; margin-bottom:20px; max-width:28ch; }
.biography-chapter > p:not(.section-kicker) { color:var(--muted); font-size:18px; line-height:1.8; margin-bottom:17px; }
.biography-chapter > p:last-child { margin-bottom:0; }
.biography-references { border:1px solid #aabcc6; padding:0 25px; }
.biography-references summary { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:23px 0; cursor:pointer; font-size:18px; font-weight:600; list-style:none; }
.biography-references summary::-webkit-details-marker { display:none; }
.biography-references summary > span { font-size:25px; font-weight:400; }
.biography-references[open] summary > span { transform:rotate(45deg); }
.biography-references .history-list { padding:10px 0 25px; }
.biography-actions { margin-top:30px; }
@media(max-width:900px) {
 .biography-layout { grid-template-columns:minmax(0,1fr); gap:42px; }
 .biography-index { position:static; }
 .biography-index nav { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:28px; }
 .biography-dates { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
}
@media(max-width:700px) {
 .teacher-biography { scroll-margin-top:88px; }
 .biography-heading { margin-bottom:30px; }
 .biography-heading h2 { font-size:42px; }
 .biography-lead { font-size:18px; line-height:1.7; }
 .biography-dates { gap:18px; margin-block:15px 20px; }
 .biography-dates > div { display:block; }
 .biography-dates dt { font-size:34px; margin-bottom:10px; }
 .biography-dates dd { font-size:14px; }
 .biography-index nav { grid-template-columns:minmax(0,1fr); }
 .biography-index nav a { font-size:15px; }
 .biography-chapter { scroll-margin-top:92px; margin-bottom:29px; padding-bottom:29px; }
 .biography-chapter h3 { font-size:31px; }
 .biography-chapter > p:not(.section-kicker) { font-size:16px; line-height:1.8; }
 .biography-references { padding:0 17px; }
 .biography-references summary { font-size:16px; }
}
/* Artist galleries: full video frames, stable captions and accessible controls. */
.artist-gallery{min-width:0;background:#fff;color:var(--ink);border:1px solid var(--line);overflow:hidden}
.artist-slide{margin:0}
.artist-slide[hidden],.artist-controls[hidden]{display:none}
.artist-slide>a{display:block;color:inherit;text-decoration:none}
.artist-slide img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:var(--ink)}
.artist-slide figcaption{padding:19px 22px;min-height:95px}
.artist-slide figcaption strong{display:block;font-family:var(--display);font-size:27px;line-height:1.1}
.artist-slide figcaption span{display:block;margin-top:7px;font-size:15px;line-height:1.4}
.artist-slide figcaption svg{display:inline-block;width:14px;height:14px;vertical-align:middle;margin-left:4px}
.artist-gallery--photos{position:relative;aspect-ratio:16/9;background:var(--ink);border:0;isolation:isolate}
.artist-gallery--photos .artist-slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;pointer-events:none;animation:none;z-index:0}
.artist-gallery--photos .artist-slide.is-active{opacity:1;pointer-events:auto;z-index:1}
.artist-gallery--photos .artist-slide>a,.artist-gallery--photos .artist-slide img{height:100%}
.artist-gallery--photos a:focus-visible{outline:3px solid var(--silver);outline-offset:-3px}
.artist-gallery.is-animated{display:grid}
.artist-gallery.is-animated .artist-slide{grid-area:1/1;position:relative;inset:auto;min-width:0;opacity:0;visibility:hidden;pointer-events:none;z-index:0;animation:none;transition:opacity 1s cubic-bezier(.22,.61,.36,1),visibility 0s 1s}
.artist-gallery.is-animated .artist-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;z-index:1;transition-delay:0s}
.artist-gallery.is-animated .artist-slide>a{height:100%;overflow:hidden}
.artist-gallery.is-animated .responsive-picture{display:block;overflow:hidden}
.artist-gallery.is-animated .artist-slide.is-active img{animation:perla-frame-drift 5s linear both}
.artist-gallery.is-animated .artist-slide figcaption{position:relative;background:#fff}
@keyframes perla-frame-drift{from{transform:scale(1.045) translate3d(.5%,0,0)}to{transform:scale(1.005) translate3d(-.15%,0,0)}}
@media(prefers-reduced-motion:reduce){.artist-gallery.is-animated .artist-slide{transition:none}.artist-gallery.is-animated .artist-slide.is-active img{animation:none}}
@media(prefers-reduced-motion:reduce){.artist-gallery--photos .artist-slide{transition:none}}
.artist-controls{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding:9px 14px}
.artist-controls button{min-width:44px;min-height:44px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:600 15px var(--sans);cursor:pointer;display:grid;place-items:center}
.artist-controls button:hover{background:var(--silver)}
.artist-controls button:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.artist-controls svg{width:18px;height:18px}
.artist-counter{min-width:43px;text-align:center;font-size:14px;font-variant-numeric:tabular-nums}
.artist-controls .artist-pause{margin-left:auto;min-width:85px;padding:0 14px}
.channel-feature .artist-gallery{border:0}
.home-association .home-teacher{display:flex;align-items:center;gap:18px}
.teacher-thumb{flex:0 0 80px}
.teacher-thumb img{display:block;width:80px;height:80px;object-fit:cover;border-radius:50%}
.maestro-hero{padding-bottom:70px}
.maestro-intro{display:grid;grid-template-columns:1.45fr 1fr;gap:80px;align-items:center;margin-top:36px}
.maestro-hero h1{font-size:clamp(64px,7vw,100px);line-height:1;margin-bottom:24px}
.maestro-lead{font-family:var(--display);font-size:clamp(30px,3vw,42px);line-height:1.15;max-width:650px;margin:0 0 24px}
.maestro-summary{max-width:620px;font-size:19px;line-height:1.65;margin-bottom:25px}
.maestro-portrait{margin:0;max-width:380px;justify-self:end;background:white;padding:12px;border:1px solid var(--line)}
.maestro-portrait img{display:block;width:100%;height:auto;aspect-ratio:1}
.maestro-portrait figcaption{padding:20px 12px 12px;font:600 26px var(--display)}
.maestro-portrait figcaption span{display:block;font:400 15px/1.5 var(--sans);margin-top:4px}
.maestro-today{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.maestro-today p{font-size:19px;line-height:1.65}
.association-portrait{width:130px;height:130px;object-fit:cover;margin-bottom:20px}
.biography-redirect{padding-bottom:30px}
@media(max-width:900px){.maestro-intro{gap:32px;grid-template-columns:1.2fr 1fr}.maestro-hero h1{font-size:68px}}
@media(max-width:650px){.maestro-intro,.maestro-today{grid-template-columns:1fr;gap:32px}.maestro-portrait{justify-self:start;width:min(100%,340px)}.maestro-hero h1{font-size:62px}.maestro-hero{padding-bottom:45px}.artist-slide figcaption{padding:17px;min-height:98px}.artist-slide figcaption span{font-size:14px}.home-association .home-teacher{padding-left:14px;gap:14px}.teacher-thumb{flex-basis:65px}.teacher-thumb img{width:65px;height:65px}}
@media(prefers-reduced-motion:reduce){.artist-slide{animation:none}}
.life-history{background:var(--paper)}
.life-editorial{max-width:760px;font-size:15px;line-height:1.6;color:var(--muted);margin-top:22px}
.life-layout{display:grid;grid-template-columns:235px minmax(0,1fr);gap:64px;align-items:start;margin-top:58px}
.life-index{position:sticky;top:120px;border-top:2px solid var(--ink);padding-top:22px}
.life-index>a{display:flex;gap:12px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px;line-height:1.4;color:var(--ink);text-decoration:none}
.life-index>a>span{font:600 23px var(--display);min-width:43px}
.life-index>a:hover{text-decoration:underline;text-underline-offset:4px}
.life-timeline{list-style:none;margin:0;padding:0}
.life-milestone{position:relative;display:grid;grid-template-columns:128px minmax(0,1fr);gap:35px;padding:0 0 52px;scroll-margin-top:125px}
.life-milestone:before{content:"";position:absolute;left:142px;top:16px;bottom:-16px;width:1px;background:var(--line)}
.life-milestone:last-child:before{bottom:52px}
.life-milestone:after{content:"";position:absolute;left:136px;top:16px;width:13px;height:13px;background:var(--blue);border:3px solid var(--paper);border-radius:50%;box-shadow:0 0 0 1px var(--blue)}
.life-date>time,.life-date>span:first-child{display:block;font:600 52px/1 var(--display);letter-spacing:-1px}
.life-detail{display:block;font-size:13px;line-height:1.5;margin-top:10px;max-width:115px;color:var(--muted)}
.life-story{background:#fff;border:1px solid var(--line);padding:30px 32px}
.life-story h3{font:600 32px/1.1 var(--display);margin:0 0 20px}
.life-story p{font-size:17px;line-height:1.7;margin:0 0 15px}
.life-sources{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:22px;padding-top:17px;border-top:1px solid var(--line)}
.life-sources .text-link,.life-sources>span{font-size:13px;line-height:1.5}
.life-sources>span{color:var(--muted)}
.life-background{margin-top:30px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.life-background>summary{cursor:pointer;font:600 28px/1.2 var(--display)}
.life-background-content{max-width:790px;margin:35px auto 0}
@media(max-width:1000px){.life-layout{grid-template-columns:1fr;gap:35px}.life-index{position:static;display:flex;flex-wrap:wrap;gap:5px 20px}.life-index>.section-kicker{flex-basis:100%;margin-bottom:5px}.life-index>a{padding:7px 0;flex:0 1 auto}.life-index>a>span{font-size:21px}}
@media(max-width:650px){.life-layout{margin-top:32px}.life-index>a{font-size:12px;gap:6px}.life-index>a>span{min-width:36px}.life-milestone{display:block;padding:0 0 34px 25px;scroll-margin-top:95px}.life-milestone:before{left:5px;top:12px;bottom:-12px}.life-milestone:after{left:-1px;top:12px}.life-milestone:last-child:before{bottom:34px}.life-date{display:flex;gap:15px;align-items:center;margin-bottom:16px}.life-date>time,.life-date>span:first-child{font-size:44px}.life-detail{max-width:none;font-size:13px;margin:0}.life-story{padding:23px 20px}.life-story h3{font-size:28px}.life-story p{font-size:16px}.life-background>summary{font-size:25px}}
.video-catalog-section{background:var(--paper);scroll-margin-top:90px}
.catalog-heading{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end;margin-bottom:35px}
.catalog-heading p{font-size:18px;line-height:1.6}
.catalog-heading .section-kicker{font-size:12px}
.catalog-heading h2{margin:0}
.catalog-tools{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px;background:#fff;border:1px solid var(--line);padding:24px}
.catalog-tools label{display:block;font-size:14px;font-weight:600;margin-bottom:9px}
.catalog-tools input,.catalog-tools select{display:block;width:100%;min-width:0;min-height:48px;padding:10px 12px;border:1px solid var(--line);border-radius:0;color:var(--ink);background:var(--paper);font:400 16px var(--sans)}
.catalog-status{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:20px 0;font-size:15px}
.catalog-status p{margin:0}
.catalog-status button{color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink);font:600 15px var(--sans);padding:10px 0;cursor:pointer}
.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;list-style:none;padding:0;margin:0}
.catalog-card{min-width:0;background:#fff;border:1px solid var(--line);transition:box-shadow .2s ease}
.catalog-card>a{height:100%;display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.catalog-card:hover{box-shadow:0 5px 20px #092a4315}
.catalog-card a:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.catalog-picture{position:relative;aspect-ratio:16/9;background:var(--ink);overflow:hidden}
.catalog-picture img{width:100%;height:100%;object-fit:contain;display:block}
.catalog-duration{position:absolute;right:8px;bottom:8px;background:#092a43e8;color:#fff;padding:2px 6px;font-size:12px;font-variant-numeric:tabular-nums}
.catalog-placeholder{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#fff;font-size:14px}
.catalog-placeholder svg{width:38px;height:38px}
.catalog-card-copy{display:flex;flex-direction:column;flex:1;padding:22px}
.catalog-category{font-size:11px;text-transform:uppercase;letter-spacing:.08em;line-height:1.4;margin:0 0 12px;color:var(--muted)}
.catalog-card h3{font:600 25px/1.2 var(--display);margin:0 0 22px;overflow-wrap:anywhere}
.catalog-watch{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;margin-top:auto}
.catalog-watch svg{width:17px;height:17px}
.catalog-pagination{display:flex;justify-content:center;margin-top:35px}
.catalog-note{font-size:14px;color:var(--muted);line-height:1.6;margin-top:30px;max-width:760px}
.catalog-empty{border:1px solid var(--line);background:white;padding:30px;font-size:18px}
.catalog-card[hidden],.catalog-tools[hidden],.catalog-empty[hidden],.catalog-status [hidden],.catalog-pagination [hidden]{display:none}
@media(max-width:1000px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-tools{grid-template-columns:1fr 1fr}.catalog-search{grid-column:1/-1}.catalog-heading{gap:25px}}
@media(max-width:650px){.catalog-heading,.catalog-grid,.catalog-tools{grid-template-columns:1fr}.catalog-heading{gap:16px}.catalog-search{grid-column:auto}.catalog-tools{padding:20px;gap:18px}.catalog-grid{gap:22px}.catalog-card-copy{padding:20px}.catalog-status{align-items:baseline;font-size:14px}.catalog-status button{white-space:nowrap}.catalog-heading p{font-size:17px}}
/* A single enrollment journey, shared across the home and course pages. */
.journey-heading{max-width:780px;margin-bottom:35px}
.journey-heading h2{margin-bottom:20px}
.journey-heading>p:last-child{font-size:19px;line-height:1.65;color:var(--muted);max-width:650px}
.journey-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;margin-top:28px}
.featured-courses{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.featured-course{display:flex;flex-direction:column;padding:34px;background:white;border:1px solid var(--line);color:var(--ink)}
.featured-course:hover{border-color:var(--blue);box-shadow:0 6px 22px #092a4310}
.featured-course-icon{display:grid;place-items:center;width:54px;height:54px;border:1px solid var(--line);border-radius:50%;margin-bottom:24px}
.featured-course-icon svg{width:25px;height:25px}
.featured-course h3{font-size:42px;margin-bottom:18px}
.featured-course>p{font-size:18px;line-height:1.65;max-width:440px;color:var(--muted)}
.featured-course-link{display:flex;align-items:center;justify-content:space-between;font-weight:600;margin-top:auto;padding-top:15px;border-top:1px solid var(--line)}
.other-paths{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin-top:35px;padding-top:30px;border-top:1px solid var(--line)}
.other-paths h3{font-size:28px;margin-bottom:12px}
.other-paths p{font-size:16px;color:var(--muted);margin-bottom:0}
.other-paths nav{display:flex;flex-direction:column}
.other-paths a{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 0;min-height:44px;border-bottom:1px solid var(--line);font-weight:600}
.home-mentor{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr);gap:90px;align-items:center}
.home-mentor h2{margin-bottom:25px;max-width:600px}
.home-mentor p{max-width:650px;font-size:19px;line-height:1.7}
.home-mentor-photo{max-width:330px;margin:0;justify-self:end;background:white;padding:10px;border:1px solid var(--line)}
.home-mentor-photo img{width:100%;height:auto;aspect-ratio:1}
.home-mentor-photo figcaption{padding:18px 10px 10px;font:600 27px/1.2 var(--display)}
.home-mentor-photo figcaption span{display:block;font:400 15px/1.5 var(--sans);margin-top:6px}
.enrollment-section{background:var(--paper);border-block:1px solid var(--line)}
.enrollment-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;list-style:none;margin:0;padding:0}
.enrollment-steps li{border-top:2px solid var(--blue);padding-top:23px}
.enrollment-steps li>span{font:600 34px/1 var(--display);color:var(--blue)}
.enrollment-steps h3{font-size:30px;margin:17px 0 13px}
.enrollment-steps p{font-size:17px;line-height:1.65;color:var(--muted)}
.course-learning-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr);gap:75px}
.course-learning h2{margin-bottom:24px}
.course-learning p{font-size:18px;line-height:1.7}
.learning-points{margin:25px 0;padding-left:22px}
.learning-points li{padding:12px 0;font-size:18px;line-height:1.65;border-bottom:1px solid var(--line)}
.course-learning .learning-note{font-size:15px;color:var(--muted)}
.starting-points{padding:30px;background:var(--soft);align-self:start}
.starting-points h3{margin-bottom:22px}
.starting-points>div{border-top:1px solid var(--line);padding-top:18px;margin-top:18px}
.starting-points h4{font-size:25px;margin-bottom:10px}
.starting-points p{font-size:16px;margin-bottom:0}
.starting-points>.text-link{margin-top:23px;font-size:15px}
.course-teacher-section{background:var(--soft)}
.course-teacher-story{display:grid;grid-template-columns:150px minmax(0,720px);gap:35px;align-items:center}
.course-teacher-story>img{width:150px;height:150px;object-fit:cover;border-radius:50%;border:7px solid white}
.course-teacher-story h2{margin-bottom:19px}
.course-teacher-story p{font-size:18px;line-height:1.65}
.course-next{background:var(--blue);color:white}
.course-next h2{margin-bottom:20px}
.course-next p{font-size:19px;max-width:680px}
.course-next .btn{background:white;color:var(--blue);border-color:white}
.course-next .text-link{color:white}
.reference-hero .actions{gap:12px;align-items:stretch}
.reference-hero .hero-bottom{justify-content:flex-start}
.home-page .social-section{padding-block:45px;background:white;border-top:1px solid var(--line)}
.home-page .social-section .section-head{margin-bottom:24px}
.home-page .social-section h2{font-size:34px}
.home-page .social-card{padding:20px}
@media(max-width:1000px){.home-mentor{gap:45px}.course-learning-grid{gap:35px}.enrollment-steps{gap:24px}}
@media(max-width:700px){.featured-courses,.other-paths,.home-mentor,.enrollment-steps,.course-learning-grid{grid-template-columns:minmax(0,1fr)}.journey-heading{margin-bottom:26px}.journey-heading>p:last-child{font-size:17px}.featured-courses{gap:18px}.featured-course{padding:25px}.featured-course-icon{margin-bottom:18px}.featured-course h3{font-size:35px}.featured-course>p{font-size:17px}.other-paths{gap:19px;margin-top:28px;padding-top:25px}.home-mentor{gap:28px}.home-mentor h2{font-size:40px}.home-mentor p{font-size:17px}.home-mentor-photo{width:250px;justify-self:start}.journey-actions{gap:14px;margin-top:24px}.journey-actions>.btn{width:100%;white-space:normal}.enrollment-steps{gap:18px}.enrollment-steps li{position:relative;padding:20px 0 0 48px}.enrollment-steps li>span{position:absolute;left:0;top:22px;font-size:28px}.enrollment-steps h3{margin:0 0 12px;font-size:28px}.enrollment-steps p{font-size:16px;margin-bottom:0}.course-learning p,.learning-points li{font-size:17px}.starting-points{padding:24px}.course-teacher-story{grid-template-columns:80px minmax(0,1fr);gap:20px;align-items:start}.course-teacher-story>img{width:80px;height:80px;border-width:4px}.course-teacher-story h2{font-size:32px}.course-teacher-story p{font-size:16px}.course-teacher-story .section-kicker{font-size:10px}.course-next h2{font-size:37px}.course-next p{font-size:17px}.home-page .social-section{padding-block:34px}.reference-hero h1{font-size:clamp(42px,12vw,62px);max-width:12ch}.reference-hero .hero-bottom{display:flex;flex-wrap:wrap;gap:4px 20px}.reference-hero .hero-bottom a{font-size:13px;min-height:44px}.home-listening .stage-grid{gap:28px}.home-listening .stage-copy p{font-size:17px}}