:root{
  --paper:#f6f2e9;--ink:#1c1b19;--red:#7A2E38;--grey:#8c877e;--line:#d7d0c4;
  --soft:#eee8dc;--sheet:#eee9df;--serif:"Cormorant Garamond",Georgia,serif;
  --sans:"DM Sans",Arial,sans-serif;--hand:"Caveat",cursive;--max:1240px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.58;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{width:min(calc(100% - 64px),var(--max));margin:auto}
.eyebrow{text-transform:uppercase;letter-spacing:.17em;font-size:.65rem;font-weight:600}
.red{color:var(--red)}
.reveal{opacity:0;transform:translateY(18px);transition:.75s ease}
.reveal.visible{opacity:1;transform:none}

/* Header — intentionally restrained; navigation effect retained */











/* HERO */
.hero-v3{min-height:calc(100vh - 104px);position:relative;display:flex;align-items:flex-end;background:
  linear-gradient(90deg,rgba(9,9,8,.78) 0%,rgba(9,9,8,.48) 37%,rgba(9,9,8,.12) 72%),
  linear-gradient(0deg,rgba(9,9,8,.45),transparent 48%),
  image-set(url("optimized/images-177927-1800.avif") type("image/avif"), url("optimized/images-177927-1800.webp") type("image/webp"), url("images/177927.jpg") type("image/jpeg")) center 47%/cover no-repeat;
  color:#f6f2e9;padding:90px 0 82px;
}
.hero-inner{width:100%}
.hero-copy{max-width:830px}
.hero-v3 .eyebrow{color:#e2d9ce}
.hero-v3 h1{font:500 clamp(4.5rem,8.7vw,9.3rem)/.78 var(--serif);letter-spacing:-.052em;margin:19px 0 30px;max-width:900px}
.hero-v3 h1 em{font-weight:400}
.hero-v3 p{font-size:1.05rem;max-width:610px;color:#eee8df;margin:0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:31px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:1px solid currentColor;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600}
.hero-actions .btn.primary{background:#f6f2e9;color:#1c1b19;border-color:#f6f2e9}
.hero-actions .btn.primary:hover{background:#e8dfd3}
.hero-actions .btn.secondary:hover{background:rgba(246,242,233,.1)}
.hero-caption{position:absolute;right:30px;bottom:24px;font-size:.58rem;letter-spacing:.11em;text-transform:uppercase;color:#d9d0c5}

/* METHOD */
.method-v3{padding:135px 0 145px}
.method-top{display:grid;grid-template-columns:.55fr 1.45fr;gap:70px;align-items:start}
.method-v3 h2,.lessons-v3 h2,.performance-intro h2,.studio-copy h2,.about-copy h2{
  font:500 clamp(3.7rem,6.6vw,7rem)/.82 var(--serif);letter-spacing:-.045em;margin:0
}
.method-statement{margin-top:80px;display:grid;grid-template-columns:1.1fr .9fr;gap:90px;align-items:start}
.method-statement .big{font:500 clamp(2.25rem,4vw,4rem)/.96 var(--serif);letter-spacing:-.027em;margin:0}
.method-body{max-width:620px;color:var(--text)}
.method-body p:first-child{margin-top:0}
.method-sequence{margin-top:42px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}
.method-step{padding:21px 14px;border-right:1px solid var(--line)}
.method-step:last-child{border-right:0}
.method-step span{display:block;color:var(--red);font:500 1.15rem var(--serif);margin-bottom:8px}
.method-step strong{font:500 1.35rem var(--serif)}
.text-link{display:inline-block;margin-top:26px;font-size:.69rem;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--red);padding-bottom:4px}

/* FELT RED PRINCIPLE */
.principle{background:var(--cta-bg,var(--red));color:#f6f2e9;padding:105px 0}
.principle-inner{display:grid;grid-template-columns:.52fr 1.48fr;gap:70px;align-items:end}
.principle h2{font:500 clamp(3.6rem,7vw,7.2rem)/.83 var(--serif);letter-spacing:-.048em;margin:0}
.principle p{max-width:520px;color:#eaded4;margin:0 0 8px}

/* LESSONS — deliberately not four identical cards */
.lessons-v3{padding:140px 0}
.lessons-head{display:grid;grid-template-columns:.58fr 1.42fr;gap:70px}
.lessons-lead{max-width:650px;color:var(--text);margin:33px 0 0 auto}
.pathways{margin-top:75px;display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:470px 410px;gap:18px}
.pathway{position:relative;overflow:hidden;border:1px solid var(--line);cursor:pointer}
.pathway-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease}
.pathway-photo:hover img{transform:scale(1.025)}
.pathway-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,9,.76),transparent 62%)}
.pathway-copy{position:absolute;z-index:2;left:28px;right:28px;bottom:25px;color:#f6f2e9}
.pathway-copy .tag,.pathway-text .tag{font-size:.59rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:10px}
.pathway-copy h3,.pathway-text h3{font:500 clamp(2.2rem,3.5vw,3.5rem)/.9 var(--serif);margin:0 0 10px}
.pathway-copy p{font-size:.8rem;max-width:470px;margin:0;color:#e8e0d6}
.pathway-text{padding:36px;display:flex;flex-direction:column;justify-content:space-between;background:var(--soft)}
.pathway-text.dark{background:var(--contrast-bg,#161513);color:var(--contrast-fg,#f6f2e9)}
.pathway-text.dark p{color:var(--contrast-muted,#c9c2b7)}
.pathway-text .tag{color:var(--red)}
.pathway-text.dark .tag{color:var(--red-soft,#d5aaa2)}
.pathway-text p{max-width:410px;color:var(--text)}
.pathway-arrow{font-size:.67rem;letter-spacing:.1em;text-transform:uppercase;margin-top:24px}
.pathway.returning{grid-column:2;grid-row:2}
.pathway.advanced{grid-column:1;grid-row:2}

/* PERFORMANCE EDITORIAL */
.performance-v3{background:var(--soft);border-block:1px solid var(--line);padding:135px 0}
.performance-intro{display:grid;grid-template-columns:.55fr 1.45fr;gap:70px}
.performance-intro p{max-width:620px;color:var(--text);margin:31px 0 0}
.performance-mosaic{margin-top:78px;display:grid;grid-template-columns:1.06fr .78fr .9fr;grid-template-rows:310px 310px;gap:13px}
.performance-mosaic figure{margin:0;overflow:hidden;position:relative;background:var(--sheet)}
.performance-mosaic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease}
.performance-mosaic figure:hover img{transform:scale(1.02)}
.performance-mosaic .programmes{grid-row:1/span 2}
.performance-mosaic .student{grid-column:2;grid-row:1/span 2}
.performance-mosaic figcaption{position:absolute;left:11px;bottom:10px;background:rgba(12,11,10,.75);color:#f6f2e9;padding:6px 8px;font-size:.56rem;letter-spacing:.09em;text-transform:uppercase}

/* FULL BLEED STAGE */
.stage-break{min-height:760px;display:flex;align-items:end;background:
 linear-gradient(180deg,rgba(8,8,7,.08) 24%,rgba(8,8,7,.78) 100%),
 image-set(url("optimized/images-0169-1800.avif") type("image/avif"), url("optimized/images-0169-1800.webp") type("image/webp"), url("images/0169.jpg") type("image/jpeg")) center center/cover no-repeat;color:#f6f2e9;padding:90px 0}
.stage-break h2{font:500 clamp(4.2rem,8vw,8.4rem)/.8 var(--serif);letter-spacing:-.05em;margin:0;max-width:950px}
.stage-break p{max-width:570px;color:#e8dfd5;margin:24px 0 0}

/* STUDIO */
.studio-v3{padding:145px 0}
.studio-v3-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;align-items:start}
.studio-copy{padding-top:30px}
.studio-copy p{max-width:520px;color:var(--text)}
.studio-images{position:relative;min-height:690px}
.studio-main{position:absolute;left:0;top:0;width:72%;height:585px;object-fit:cover;border:1px solid var(--line)}
.studio-exterior{position:absolute;right:0;bottom:0;width:48%;height:315px;object-fit:cover;border:8px solid var(--paper);box-shadow:0 15px 38px var(--shadow)}
.studio-detail{position:absolute;right:3%;top:25px;width:34%;height:220px;object-fit:cover;border:8px solid var(--paper);box-shadow:0 15px 38px var(--shadow)}

/* ABOUT */
.about-v3{background:var(--soft);border-block:1px solid var(--line);padding:135px 0}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:85px;align-items:center}
.about-portrait{margin:0}
.about-portrait img{display:block;width:100%;max-height:730px;object-fit:cover;border:1px solid var(--line)}
.about-copy p{max-width:590px;color:var(--text)}
.staff-mini{margin-top:43px;border-top:1px solid var(--line)}
.staff-row{display:flex;justify-content:space-between;gap:30px;padding:16px 0;border-bottom:1px solid var(--line)}
.staff-row strong{font:500 1.3rem var(--serif)}
.staff-row span{font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;color:var(--grey);text-align:right}

/* CTA */
.cta-v3{background:var(--cta-bg,var(--red));color:#f6f2e9;padding:125px 0}
.cta-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:60px;align-items:end}
.cta-v3 h2{font:500 clamp(4.4rem,9vw,9.5rem)/.78 var(--serif);letter-spacing:-.052em;margin:16px 0 24px}
.cta-v3 p{max-width:590px;color:#eaded4}
.cta-v3 .btn.primary{background:#f6f2e9;color:#7A2E38;border-color:#f6f2e9}
.cta-side{font:500 1.55rem var(--serif);max-width:300px;color:#eaded4}

/* FOOTER */
footer{padding:52px 0 30px}
.foot-top{display:flex;justify-content:space-between;gap:35px;border-bottom:1px solid var(--line);padding-bottom:48px;align-items:flex-start}
.foot-nav{display:flex;gap:20px;flex-wrap:wrap;font-size:.66rem}
.foot-bottom{display:flex;justify-content:space-between;padding-top:24px;color:var(--grey);font-size:.61rem}

/* Mobile */
@media(max-width:1000px){
  .method-top,.method-statement,.principle-inner,.lessons-head,.performance-intro,.studio-v3-grid,.about-grid,.cta-grid{grid-template-columns:1fr}
  .method-statement{gap:45px}.principle-inner{gap:35px}
  .pathways{grid-template-columns:1fr 1fr;grid-template-rows:440px 380px}
  .performance-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:330px 330px 280px}
  .performance-mosaic .programmes{grid-row:1/span 2}
  .performance-mosaic .student{grid-column:2;grid-row:1/span 2}
  .performance-mosaic figure:nth-child(3){grid-column:1}.performance-mosaic figure:nth-child(4){grid-column:2}
  .studio-images{margin-top:20px}
}
@media(max-width:700px){
  .wrap{width:calc(100% - 32px)}
  
  
  
  
  .hero-v3{min-height:78vh;padding:78px 0 58px;background-position:58% center}
  .hero-v3 h1{font-size:clamp(3.8rem,17vw,6rem)}
  .hero-caption{display:none}
  .method-v3,.lessons-v3,.performance-v3,.studio-v3,.about-v3,.cta-v3{padding:86px 0}
  .principle{padding:80px 0}
  .method-sequence{grid-template-columns:1fr}
  .method-step{border-right:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:44px 1fr;gap:15px}
  .pathways{grid-template-columns:1fr;grid-template-rows:auto}
  .pathway{min-height:390px}
  .pathway.returning,.pathway.advanced{grid-column:auto;grid-row:auto}
  .pathway-text{min-height:350px}
  .performance-mosaic{grid-template-columns:1fr;grid-template-rows:auto}
  .performance-mosaic .programmes,.performance-mosaic .student,.performance-mosaic figure:nth-child(3),.performance-mosaic figure:nth-child(4){grid-column:auto;grid-row:auto}
  .performance-mosaic figure{height:410px}
  .stage-break{min-height:650px;padding:72px 0;background-position:52% center}
  .studio-images{min-height:560px}
  .studio-main{width:83%;height:470px}
  .studio-exterior{width:58%;height:240px}
  .studio-detail{width:42%;height:175px}
  .staff-row{flex-direction:column;gap:4px}.staff-row span{text-align:left}
  .foot-top,.foot-bottom{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.reveal{transition:none}.pathway-photo img,.performance-mosaic img{transition:none}
}


/* =========================================================
   HOMEPAGE V3.1 — POLISH PASS
   Safer editorial leading, tighter vertical rhythm and a
   consistent hover language derived from the header nav.
   ========================================================= */

/* Prevent display-serif collisions at common desktop widths. */
.hero-v3 h1{line-height:.84}
.method-v3 h2,.lessons-v3 h2,.performance-intro h2,.studio-copy h2,.about-copy h2{line-height:.91}
.method-statement .big{line-height:1.01}
.principle h2{line-height:.92;max-width:1050px}
.pathway-copy h3,.pathway-text h3{line-height:.98}
.stage-break h2{line-height:.89}
.cta-v3 h2{line-height:.86}

/* Tighten the long-scroll rhythm without making the page dense. */
.method-v3{padding:112px 0 118px}
.method-statement{margin-top:58px}
.principle{padding:90px 0}
.lessons-v3{padding:116px 0}
.lessons-lead{margin-top:27px}
.pathways{margin-top:58px}
.performance-v3{padding:114px 0}
.performance-mosaic{margin-top:58px}
.stage-break{min-height:690px;padding:76px 0}
.studio-v3{padding:120px 0}
.studio-images{min-height:640px}
.studio-main{height:540px}
.studio-exterior{height:285px}
.studio-detail{height:205px}
.about-v3{padding:116px 0}
.cta-v3{padding:108px 0}

/* One interaction language: line for links, fill for buttons, scale for images. */
.text-link{position:relative;border-bottom:0;padding-bottom:6px}
.text-link::after,
.foot-nav a::after,
.pathway-arrow::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .32s ease;
}
.text-link::after{background:var(--red)}
.foot-nav a{position:relative;padding-bottom:5px}
.pathway-arrow{position:relative;width:max-content;padding-bottom:5px;transition:transform .32s ease}
.text-link:hover::after,.text-link:focus-visible::after,
.foot-nav a:hover::after,.foot-nav a:focus-visible::after,
.pathway:hover .pathway-arrow::after,.pathway:focus-visible .pathway-arrow::after{transform:scaleX(1)}
.pathway:hover .pathway-arrow,.pathway:focus-visible .pathway-arrow{transform:translateX(4px)}
.btn{transition:background-color .28s ease,color .28s ease,border-color .28s ease,transform .28s ease}
.btn:hover{transform:translateY(-1px)}
a:focus-visible,button:focus-visible,[role="link"]:focus-visible{outline:2px solid var(--red);outline-offset:4px}

/* Intermediate widths are where the original tight leading was most vulnerable. */
@media(max-width:1180px){
  .hero-v3 h1{line-height:.87;letter-spacing:-.045em}
  .method-v3 h2,.lessons-v3 h2,.performance-intro h2,.studio-copy h2,.about-copy h2{line-height:.94;letter-spacing:-.038em}
  .principle h2{line-height:.95;letter-spacing:-.04em}
  .stage-break h2{line-height:.92;letter-spacing:-.042em}
}
@media(max-width:1000px){
  .method-v3,.lessons-v3,.performance-v3,.studio-v3,.about-v3{padding:98px 0}
  .principle,.cta-v3{padding:86px 0}
  .method-statement{margin-top:44px}
  .pathways,.performance-mosaic{margin-top:48px}
  .stage-break{min-height:630px;padding:68px 0}
  .studio-images{min-height:600px}
}
@media(max-width:700px){
  .hero-v3 h1{line-height:.89;letter-spacing:-.04em}
  .method-v3 h2,.lessons-v3 h2,.performance-intro h2,.studio-copy h2,.about-copy h2{line-height:.97;letter-spacing:-.03em}
  .method-statement .big{line-height:1.04}
  .principle h2{line-height:.98;letter-spacing:-.03em}
  .pathway-copy h3,.pathway-text h3{line-height:1}
  .stage-break h2{line-height:.95;letter-spacing:-.035em}
  .cta-v3 h2{line-height:.9}
  .method-v3,.lessons-v3,.performance-v3,.studio-v3,.about-v3,.cta-v3{padding:78px 0}
  .principle{padding:72px 0}
  .pathways,.performance-mosaic{margin-top:42px}
  .stage-break{min-height:590px;padding:62px 0}
  .studio-images{min-height:540px}
  .studio-main{height:455px}
  .studio-exterior{height:225px}
  .studio-detail{height:168px}
}
@media(hover:none){
  .text-link::after,.foot-nav a::after,.pathway-arrow::after{transform:scaleX(1);opacity:.35}
  .btn:hover,.pathway:hover .pathway-arrow{transform:none}
}


/* =========================================================
   HOMEPAGE V3.2 — STRUCTURE + METHOD REFINEMENT
   ========================================================= */

/* The hero copy had been unintentionally losing the .wrap width because
   .hero-inner set width:100%. Restore the intended editorial inset. */
.hero-inner{
  width:min(calc(100% - 112px),var(--max));
  margin-inline:auto;
}
.hero-copy{max-width:780px}
.hero-v3 h1{max-width:820px}

/* Buttons now use the same outline → fill interaction as the header CTA. */
.hero-v3 .btn,
.cta-v3 .btn{
  background:transparent!important;
  color:#f6f2e9!important;
  border-color:#f6f2e9!important;
}
.hero-v3 .btn:hover,
.hero-v3 .btn:focus-visible{
  background:#f6f2e9!important;
  color:#1c1b19!important;
}
.cta-v3 .btn:hover,
.cta-v3 .btn:focus-visible{
  background:#f6f2e9!important;
  color:var(--cta-bg)!important;
}
.btn:hover{transform:none}

/* Method: one clear centre line, repeated across both rows. */
.method-v3{padding:106px 0 110px}
.method-top{
  grid-template-columns:1fr 1fr;
  gap:0;
  align-items:start;
  padding-bottom:46px;
  border-bottom:1px solid var(--line);
}
.method-top .eyebrow{padding-right:54px}
.method-top h2{
  padding-left:54px;
  border-left:1px solid var(--line);
  max-width:630px;
}
.method-statement{
  margin-top:0;
  grid-template-columns:1fr 1fr;
  gap:0;
  align-items:stretch;
}
.method-thesis{
  padding:50px 54px 0 0;
}
.method-body{
  padding:50px 0 0 54px;
  border-left:1px solid var(--line);
  max-width:none;
}
.method-statement .big{
  max-width:520px;
  line-height:1.03;
}
.method-body p{max-width:555px}
.method-sequence{margin-top:50px}

/* The red principle uses the same measured two-column proportion.
   Supporting copy sits in its own column, so it cannot collide with h2. */
.principle{padding:88px 0}
.principle-inner{
  grid-template-columns:1fr 1.15fr;
  gap:84px;
  align-items:start;
}
.principle-note{padding-top:8px}
.principle-note p{
  margin:48px 0 0;
  max-width:430px;
  color:#eaded4;
  font-size:.95rem;
}
.principle h2{
  line-height:.98;
  letter-spacing:-.04em;
  max-width:760px;
}

/* Keep the grid disciplined at laptop widths. */
@media(max-width:1180px){
  .hero-inner{width:min(calc(100% - 80px),var(--max))}
  .method-top .eyebrow{padding-right:38px}
  .method-top h2{padding-left:38px}
  .method-thesis{padding-right:38px}
  .method-body{padding-left:38px}
  .principle-inner{gap:56px}
}
@media(max-width:1000px){
  .method-top,.method-statement,.principle-inner{grid-template-columns:1fr}
  .method-top{padding-bottom:0;border-bottom:0}
  .method-top .eyebrow{padding:0 0 22px}
  .method-top h2{padding:0;border-left:0}
  .method-statement{margin-top:42px;border-top:1px solid var(--line)}
  .method-thesis{padding:40px 0 0}
  .method-body{padding:32px 0 0;border-left:0}
  .principle-note p{margin-top:28px}
  .principle-inner{gap:44px}
}
@media(max-width:700px){
  .hero-inner{width:calc(100% - 40px)}
  .hero-v3 h1{max-width:100%}
  .method-v3{padding:76px 0}
  .method-statement{margin-top:34px}
  .method-thesis{padding-top:32px}
  .principle{padding:70px 0}
  .principle-inner{gap:36px}
}


/* =========================================================
   HOMEPAGE V3.4 — METHOD COPY + COMPOSITION
   ========================================================= */

/* Remove the central divider and give the Method one clear left-hand axis. */
.method-v3{padding:106px 0 110px}
.method-top{
  display:block;
  padding-bottom:0;
  border-bottom:0;
}
.method-top .eyebrow{padding:0}
.method-top h2{
  padding:0;
  border-left:0;
  max-width:980px;
  margin-top:22px;
  line-height:.92;
}
.method-top h2 .red{color:var(--red)}

.method-statement{
  margin-top:64px;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:88px;
  align-items:start;
}
.method-thesis{padding:0}
.method-statement .big{
  max-width:520px;
  font-size:clamp(2.25rem,3.6vw,3.65rem);
  line-height:1.02;
}
.method-statement .big em{font-weight:400}
.method-body{
  padding:0;
  border-left:0;
  max-width:590px;
}
.method-body p{max-width:590px}
.method-body strong{color:var(--ink);font-weight:600}
.method-sequence{margin-top:54px}

/* The red section now concludes the Method rather than repeating its proposition. */
.principle{padding:92px 0 100px}
.principle-v34-head{
  display:grid;
  grid-template-columns:.34fr 1.66fr;
  gap:56px;
  align-items:start;
}
.principle-v34-copy{max-width:910px}
.principle-v34-copy h2{
  margin:0;
  max-width:900px;
  font:500 clamp(3.7rem,6.7vw,7rem)/.96 var(--serif);
  letter-spacing:-.043em;
}
.principle-v34-copy p{
  margin:28px 0 0;
  max-width:560px;
  color:#eaded4;
  font-size:1rem;
}
.principle-v34-photo{
  width:min(72%,900px);
  height:360px;
  margin:58px 0 0 auto;
  overflow:hidden;
}
.principle-v34-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 46%;
  display:block;
  filter:grayscale(100%);
  transition:transform .7s ease,filter .45s ease;
}
.principle-v34-photo:hover img{transform:scale(1.015);filter:grayscale(88%)}

@media(max-width:1180px){
  .method-top h2{max-width:880px}
  .method-statement{gap:62px}
  .principle-v34-head{grid-template-columns:.28fr 1.72fr;gap:42px}
  .principle-v34-photo{width:76%}
}

@media(max-width:1000px){
  .method-statement{grid-template-columns:1fr;gap:34px;margin-top:46px}
  .method-thesis,.method-body{max-width:680px}
  .method-statement .big{max-width:650px}
  .principle-v34-head{grid-template-columns:1fr;gap:26px}
  .principle-v34-copy{max-width:760px}
  .principle-v34-photo{width:88%;height:330px;margin-top:46px}
}

@media(max-width:700px){
  .method-v3{padding:76px 0}
  .method-top h2{margin-top:17px;line-height:.97}
  .method-statement{margin-top:38px}
  .method-statement .big{line-height:1.04}
  .method-sequence{margin-top:42px}
  .principle{padding:72px 0 78px}
  .principle-v34-copy h2{line-height:1}
  .principle-v34-copy p{margin-top:22px}
  .principle-v34-photo{
    width:100%;
    height:270px;
    margin-top:36px;
  }
}

@media(hover:none){
  .principle-v34-photo:hover img{transform:none;filter:grayscale(100%)}
}


/* =========================================================
   HOMEPAGE V3.6 — COMPACT PRINCIPLE + PROPORTION SYSTEM
   ========================================================= */

/* Working principle: no full velvet field. Felt red is now an accent only. */
.principle-note-v36{
  background:var(--paper);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:46px 0;
}
.principle-note-grid{
  display:grid;
  grid-template-columns:160px minmax(0,1fr) 310px;
  gap:38px;
  align-items:center;
  position:relative;
}
.principle-note-grid:before{
  content:"";
  position:absolute;
  left:198px;
  top:2px;
  bottom:2px;
  width:3px;
  background:var(--red);
}
.principle-note-label{align-self:start;padding-top:7px}
.principle-note-copy{padding-left:20px;max-width:650px}
.principle-note-copy h2{
  margin:0;
  max-width:620px;
  font:500 clamp(2.65rem,3.6vw,3.9rem)/1 var(--serif);
  letter-spacing:-.03em;
}
.principle-note-copy p{
  max-width:520px;
  margin:18px 0 0;
  color:var(--text);
  font-size:.93rem;
  line-height:1.62;
}
.principle-note-photo{
  margin:0;
  width:100%;
  height:215px;
  overflow:hidden;
  border:1px solid var(--line);
}
.principle-note-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 46%;
  filter:grayscale(100%);
  transition:transform .6s ease,filter .45s ease;
}
.principle-note-photo:hover img{transform:scale(1.015);filter:grayscale(88%)}

/* A shared grid for section introductions gives the homepage a visible geometry. */
.section-intro-v36{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  gap:38px;
  align-items:start;
}
.section-intro-v36>.eyebrow{padding-top:10px}
.section-intro-copy-v36{max-width:820px}
.section-intro-copy-v36 h2{
  margin:0;
  font:500 clamp(3.45rem,4.7vw,5.35rem)/.95 var(--serif);
  letter-spacing:-.038em;
}
.section-intro-copy-v36 p{
  max-width:620px;
  margin:20px 0 0;
  color:var(--text);
  font-size:.93rem;
  line-height:1.62;
}

/* 02 / Lessons */
.lessons-v3{padding:98px 0 108px}
.lessons-intro-v36{max-width:1030px}
.lessons-intro-v36 .section-intro-copy-v36{max-width:700px}
.lessons-intro-v36 h2{font-size:clamp(3.55rem,4.85vw,5.45rem)}
.pathways{margin-top:48px}

/* 03 / Performance */
.performance-v3{padding:100px 0 106px}
.performance-intro-v36{max-width:1170px}
.performance-intro-v36 .section-intro-copy-v36{max-width:930px}
.performance-intro-v36 h2{
  font-size:clamp(3.35rem,4.15vw,4.65rem);
  line-height:.98;
  white-space:nowrap;
}
.performance-intro-v36 p{max-width:690px}
.performance-mosaic{margin-top:48px}

@media(max-width:1180px){
  .principle-note-grid{grid-template-columns:140px minmax(0,1fr) 270px;gap:30px}
  .principle-note-grid:before{left:169px}
  .principle-note-photo{height:200px}
  .section-intro-v36{grid-template-columns:150px minmax(0,1fr);gap:32px}
  .performance-intro-v36 h2{font-size:clamp(3.15rem,4.45vw,4.25rem)}
}

@media(max-width:960px){
  .principle-note-grid{
    grid-template-columns:130px minmax(0,1fr);
    gap:28px;
  }
  .principle-note-grid:before{left:157px}
  .principle-note-photo{
    grid-column:2;
    width:min(100%,520px);
    height:220px;
    margin-top:5px;
  }
  .section-intro-v36{grid-template-columns:130px minmax(0,1fr);gap:28px}
  .performance-intro-v36 h2{white-space:normal}
}

@media(max-width:700px){
  .principle-note-v36{padding:42px 0}
  .principle-note-grid{
    grid-template-columns:1fr;
    gap:20px;
  }
  .principle-note-grid:before{
    left:0;right:auto;top:32px;bottom:auto;width:44px;height:3px;
  }
  .principle-note-label{padding:0 0 13px 0}
  .principle-note-copy{padding-left:0}
  .principle-note-copy h2{font-size:clamp(2.7rem,12vw,4rem);line-height:1}
  .principle-note-photo{grid-column:auto;width:100%;height:240px;margin-top:10px}
  .section-intro-v36{grid-template-columns:1fr;gap:17px}
  .section-intro-v36>.eyebrow{padding-top:0}
  .section-intro-copy-v36 h2{font-size:clamp(3.15rem,13vw,4.5rem);line-height:.98}
  .section-intro-copy-v36 p{margin-top:18px}
  .lessons-v3,.performance-v3{padding:80px 0}
  .pathways,.performance-mosaic{margin-top:40px}
}

@media(hover:none){
  .principle-note-photo:hover img{transform:none;filter:grayscale(100%)}
}


/* =========================================================
   HOMEPAGE V3.7 — WORKING PRINCIPLE COLOUR + IMAGE
   ========================================================= */

.principle-note-v36{
  background:var(--red);
  border-top:0;
  border-bottom:0;
  color:#f6f2e9;
}

.principle-note-grid:before{
  background:#d8b7b2;
}

.principle-note-label .eyebrow{
  color:#eaded4;
}

.principle-note-copy h2{
  color:#f6f2e9;
}

.principle-note-copy p{
  color:#eaded4;
}

.principle-note-photo{
  border-color:rgba(246,242,233,.32);
  box-shadow:0 12px 30px rgba(45,13,18,.16);
}

.principle-note-photo img{
  filter:none;
  object-position:center 52%;
}

.principle-note-photo:hover img{
  transform:scale(1.015);
  filter:none;
}

@media(hover:none){
  .principle-note-photo:hover img{
    transform:none;
    filter:none;
  }
}


/* =========================================================
   HOMEPAGE V3.8 — FIXED PIANO FELT RED
   ========================================================= */

.principle-note-v36,
html[data-theme="dark"] .principle-note-v36{
  background:#7A2E38 !important;
  color:#F6F2E9 !important;
}

.principle-note-grid:before,
html[data-theme="dark"] .principle-note-grid:before{
  background:#F6F2E9 !important;
}

.principle-note-label .eyebrow,
.principle-note-copy h2,
.principle-note-copy p,
html[data-theme="dark"] .principle-note-label .eyebrow,
html[data-theme="dark"] .principle-note-copy h2,
html[data-theme="dark"] .principle-note-copy p{
  color:#F6F2E9 !important;
}

.principle-note-photo,
html[data-theme="dark"] .principle-note-photo{
  border-color:#F6F2E9 !important;
}

.principle-note-photo img{
  object-position:center 47%;
}


/* V3.9.1 — locked copy + At the Piano image */
.stage-break .stage-emphasis{
  margin-top:26px;
  max-width:640px;
  font:500 clamp(1.65rem,2.35vw,2.35rem)/1.05 var(--serif);
  color:#f6f2e9;
}


/* V3.9.2 — corrected image placement + one-line performance statements */
.stage-break h2{
  max-width:none;
  white-space:nowrap;
  font-size:clamp(3.8rem,5.2vw,6.4rem);
  line-height:.92;
}
.stage-break .stage-emphasis{
  max-width:none;
  white-space:nowrap;
  font-size:clamp(1.45rem,1.9vw,2.05rem);
  line-height:1.08;
}
.performance-mosaic .student img{
  object-position:60% center;
}
.principle-note-photo img{
  object-position:center center;
}

@media(max-width:900px){
  .stage-break h2,
  .stage-break .stage-emphasis{
    white-space:normal;
  }
}


/* V3.9.3 — image swaps + performance heading */
.pathway-photo img[src*="growing-through-music-075"]{
  object-position:center 47%;
}
.principle-note-photo img[src="images/good-practice-annotated-score.jpg"]{
  object-position:center 50%;
}
.stage-break h2{
  max-width:none;
  white-space:nowrap;
  font-size:clamp(3.3rem,4.45vw,5.35rem);
  line-height:.94;
}
@media(max-width:980px){
  .stage-break h2{white-space:normal;}
}


/* Footer partnership badge — wording is embedded in the image, so no duplicate text */
.partner-badge{
  flex:0 0 auto;
  width:138px;
  margin:0 auto;
  align-self:flex-start;
}
.partner-badge img{
  display:block;
  width:100%;
  height:auto;
}
@media(max-width:700px){
  .partner-badge{
    width:126px;
    margin:4px 0 2px;
  }
}


/* V3.10.5 — final header composition: navigation left, identity centred, CTA right */




/* V3.10.6 — footer mirrors the header: navigation left, identity centred, contact right */
.foot-top{
  position:relative;
  display:grid!important;
  grid-template-columns:1fr auto 1fr;
  gap:38px;
  align-items:start!important;
  padding-bottom:34px!important;
}
.foot-nav{
  grid-column:1;
  justify-self:start;
  display:grid!important;
  grid-template-columns:repeat(2,max-content);
  gap:8px 24px!important;
  line-height:1.7;
}
.foot-nav a{position:relative;width:max-content}
.footer-logo{
  grid-column:2;
  justify-self:center;
  width:clamp(190px,17vw,248px)!important;
  min-width:190px;
}
.footer-contact{
  grid-column:3;
  justify-self:end;
  width:max-content;
  max-width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
  font-size:.68rem;
  line-height:1.55;
}
.footer-contact a{position:relative}
.footer-address{margin-bottom:8px}
.footer-contact a:hover{text-decoration:underline;text-underline-offset:4px}

.foot-partner{
  display:flex;
  justify-content:center;
  padding:25px 0 28px;
  border-bottom:1px solid var(--line);
}
.partner-badge{
  width:112px!important;
  margin:0!important;
  align-self:auto!important;
}
.partner-badge img{
  width:100%;
  height:auto;
  display:block;
  /* The supplied badge is one transparent image, including "In partnership with". */
  filter:brightness(0);
  opacity:.82;
  transition:filter .45s ease,opacity .45s ease;
}
html[data-theme="dark"] .partner-badge img{
  filter:brightness(0) invert(1);
  opacity:.86;
}
.foot-bottom{border-top:0!important}

@media(max-width:900px){
  .foot-top{
    grid-template-columns:1fr 1fr;
  }
  .footer-logo{
    grid-column:1 / -1;
    grid-row:1;
    justify-self:center;
  }
  .foot-nav{grid-column:1;grid-row:2}
  .footer-contact{grid-column:2;grid-row:2}
}
@media(max-width:700px){
  .foot-top{
    display:flex!important;
    flex-direction:column!important;
    gap:28px!important;
  }
  .footer-logo{order:1;width:190px!important;min-width:190px;align-self:flex-start}
  .foot-nav{order:2;grid-template-columns:repeat(2,max-content)!important}
  .footer-contact{order:3;justify-self:auto;width:100%}
  .foot-partner{justify-content:flex-start}
  .partner-badge{width:105px!important}
}


/* V4.1 — Lessons drop-down menu */














/* Mobile: show the pathways as an indented group inside the open menu. */


/* Allow anchor jumps to clear the header visually. */
#children-6-12,
#teenagers-13-18{
  scroll-margin-top:110px;
}


/* Homepage v6.13 — final navigation alignment */
.pathways.pathways-three{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:470px;gap:18px}
.pathways-three .pathway.returning,.pathways-three .pathway.advanced{grid-column:auto;grid-row:auto}
.pathways-three .pathway-text{min-height:470px}
.pathways-three .pathway-copy p{max-width:360px}
.section-jump{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s ease}
.section-jump:hover,.section-jump:focus-visible{border-bottom-color:currentColor}
.section-jump.light{color:#f6f2e9}
.staff-row strong a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s ease}
.staff-row strong a:hover,.staff-row strong a:focus-visible{border-bottom-color:var(--red)}
.cta-grid{grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);align-items:center;gap:72px}
.cta-faq{border-left:1px solid rgba(246,242,233,.32);padding-left:36px;min-width:0}
.cta-faq-head{display:flex;justify-content:space-between;align-items:end;gap:18px;padding-bottom:15px;border-bottom:1px solid rgba(246,242,233,.28)}
.cta-faq-head span{font:500 1.4rem var(--serif)}
.cta-faq-head a{font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:#eaded4;text-decoration:none;white-space:nowrap}
.cta-faq-scroll{max-height:245px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(246,242,233,.45) transparent}
.cta-faq-scroll a{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:center;padding:16px 2px;border-bottom:1px solid rgba(246,242,233,.19);color:#f6f2e9;text-decoration:none;font:500 1.08rem/1.15 var(--serif);transition:padding-left .2s ease,background .2s ease}
.cta-faq-scroll a span{font:500 .65rem var(--sans);letter-spacing:.08em;color:#d8b7b2}
.cta-faq-scroll a:hover,.cta-faq-scroll a:focus-visible{padding-left:8px;background:rgba(246,242,233,.05)}
@media(max-width:1000px){.pathways.pathways-three{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:430px}.pathways-three .pathway-text{min-height:430px}.cta-grid{grid-template-columns:1fr;gap:46px}.cta-faq{border-left:0;border-top:1px solid rgba(246,242,233,.3);padding:28px 0 0}.cta-faq-scroll{max-height:230px}}
@media(max-width:760px){.pathways.pathways-three{grid-template-columns:1fr;grid-template-rows:auto}.pathways-three .pathway{min-height:390px}.pathways-three .pathway-text{min-height:390px}.cta-faq-head{align-items:flex-start;flex-direction:column;gap:8px}.cta-faq-scroll{max-height:220px}}


/* ---- consolidated homepage block ---- */


.hero-prof-line{display:inline-block;white-space:nowrap}
.hero-prof-line span{color:var(--red)}
.performance-feature-link,.stage-performance-link{
  display:block;color:inherit;text-decoration:none;
}
.performance-feature-link{cursor:pointer}
.performance-feature-link .performance-mosaic img{
  transition:transform .55s ease,filter .55s ease;
}
.performance-feature-link:hover .performance-mosaic img{transform:scale(1.012)}
.performance-feature-link:hover .performance-intro-v36 .eyebrow,
.stage-performance-link:hover .eyebrow{color:var(--red)}
.stage-performance-link{cursor:pointer}
.stage-performance-link .wrap{transition:transform .35s ease}
.stage-performance-link:hover .wrap{transform:translateX(4px)}
@media(max-width:900px){
  .hero-prof-line{white-space:normal}
}


/* ---- consolidated homepage block ---- */


.hero-prof-line{display:inline-block;white-space:nowrap}
.learn-yourself-line,.about-one-line{white-space:nowrap}
.performance-combined .performance-link-heading span{
  position:relative;display:inline-block;
}
.performance-combined .performance-link-heading span::after{
  content:"";position:absolute;left:-1%;right:-2%;bottom:-.14em;height:.18em;
  background:var(--red);border-radius:50% 36% 48% 40%;
  transform:rotate(-1.2deg) skewX(-8deg);
  opacity:.9;
}
.performance-combined .performance-link-heading span::before{
  content:"";position:absolute;left:8%;right:14%;bottom:-.2em;height:.08em;
  background:var(--red);border-radius:50%;transform:rotate(.7deg);opacity:.45;
}
.performance-bridge{
  margin-top:56px;padding-top:40px;border-top:1px solid var(--line);
  max-width:900px;
}
.performance-bridge h3{
  font:500 clamp(2.4rem,4.4vw,4.8rem)/.95 var(--serif);
  letter-spacing:-.03em;margin:14px 0 22px;
}
.performance-bridge p{max-width:700px}
.cta-faq-scroll{overflow-y:auto}
.home-faq-item{border-bottom:1px solid rgba(246,242,233,.2)}
.home-faq-item button{
  width:100%;display:grid;grid-template-columns:34px 1fr 24px;gap:10px;
  align-items:start;text-align:left;background:none;border:0;color:inherit;
  padding:17px 0;cursor:pointer;font:inherit;
}
.home-faq-item button span{opacity:.6;font-size:.72rem;padding-top:.2rem}
.home-faq-item button strong{font-weight:500;line-height:1.25}
.home-faq-item button i{
  font-style:normal;font-size:1.2rem;line-height:1;
  transition:transform .25s ease;
}
.home-faq-item.open button i{transform:rotate(45deg)}
.home-faq-answer{
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .4s ease,opacity .25s ease,padding .4s ease;
  padding:0 34px;
}
.home-faq-item.open .home-faq-answer{
  max-height:260px;opacity:1;padding:0 34px 18px;
}
.home-faq-answer p{margin:0;font-size:.88rem;line-height:1.55;color:inherit;opacity:.88}
@media(max-width:900px){
  .hero-prof-line,.learn-yourself-line,.about-one-line{white-space:normal}
}


/* ---- consolidated homepage block ---- */


/* v6.17 homepage refinements */
.hero-v3 h1 .hero-prof-line{
  font-size:.765em;
  line-height:1.05;
  letter-spacing:-.025em;
  white-space:nowrap;
}
.hero-actions-three{display:flex;flex-wrap:wrap;gap:10px}
.performance-title-row{
  display:flex;align-items:flex-end;justify-content:space-between;gap:32px;
}
.performance-title-row h2{margin:0}
.performance-title-row .performance-btn{flex:0 0 auto;margin-bottom:.2rem}
.performance-btn,.performance-btn-bottom{text-decoration:none}
.performance-bridge .performance-btn-bottom{display:inline-flex;margin-top:28px}
.performance-combined .performance-link-heading span{
  position:relative;display:inline-block;
}
.performance-combined .performance-link-heading span::after{
  content:"";position:absolute;left:-1%;right:-2%;bottom:-.14em;height:.18em;
  background:var(--red);border-radius:50% 36% 48% 40%;
  transform:rotate(-1.2deg) skewX(-8deg);opacity:.9;
}
.performance-combined .performance-link-heading span::before{
  content:"";position:absolute;left:8%;right:14%;bottom:-.2em;height:.08em;
  background:var(--red);border-radius:50%;transform:rotate(.7deg);opacity:.45;
}
@media(max-width:900px){
  .hero-v3 h1 .hero-prof-line{font-size:.82em;white-space:normal}
  .performance-title-row{display:block}
  .performance-title-row .performance-btn{margin-top:28px}
}


/* ---- consolidated homepage block ---- */


.performance-link-heading a{color:inherit;text-decoration:none}
.performance-link-heading a:focus-visible{outline:2px solid var(--red);outline-offset:8px}


/* ---- consolidated homepage block ---- */


.performance-combined .performance-bridge{
  position:relative;
  max-width:none;
  margin-top:72px;
  padding:64px max(0px, calc((100vw - 1180px)/2)) 68px;
  color:var(--paper);
  border-top:0;
  z-index:0;
}
.performance-combined .performance-bridge::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:var(--red);
}
.performance-combined .performance-bridge .eyebrow,
.performance-combined .performance-bridge h3,
.performance-combined .performance-bridge p{color:inherit}
.performance-combined .performance-bridge p{max-width:760px}
.performance-combined .performance-bridge .performance-btn-bottom{
  border-color:rgba(246,242,233,.72);
  color:var(--paper);
}
.performance-combined .performance-bridge .performance-btn-bottom:hover{
  background:var(--paper);
  color:var(--red);
}
@media(max-width:1240px){
  .performance-combined .performance-bridge{padding-left:32px;padding-right:32px}
}
@media(max-width:700px){
  .performance-combined .performance-bridge{
    margin-top:52px;padding:48px 22px 52px;
  }
}


/* ---- consolidated homepage block ---- */


.cta-v3 .come-play-line{white-space:nowrap}
@media(max-width:600px){.cta-v3 .come-play-line{white-space:normal}}


/* ---- consolidated homepage block ---- */


/* v6.23 — match Performance bridge to the Come and play CTA red */
.performance-combined .performance-bridge::before{
  background:var(--cta-bg,var(--red)) !important;
}

/* 05 / About — use the central part of the photograph and let it fill the section */
.about-v3 .about-grid{
  grid-template-columns:1.15fr .85fr;
  gap:72px;
  align-items:stretch;
}
.about-v3 .about-portrait{
  margin:0;
  min-height:720px;
  overflow:hidden;
  border:1px solid var(--line);
}
.about-v3 .about-portrait img{
  width:100%;
  height:100%;
  min-height:720px;
  max-height:none;
  object-fit:cover;
  object-position:52% center;
  border:0;
}
.about-v3 .about-copy{
  align-self:center;
}
@media(max-width:1000px){
  .about-v3 .about-grid{grid-template-columns:1fr;gap:48px}
  .about-v3 .about-portrait{min-height:560px}
  .about-v3 .about-portrait img{
    min-height:560px;
    object-position:52% center;
  }
}
@media(max-width:700px){
  .about-v3 .about-portrait{min-height:430px}
  .about-v3 .about-portrait img{
    min-height:430px;
    object-position:51% center;
  }
}


/* ---- consolidated homepage block ---- */


/* v6.24 — Performance red panel typography, day + night */
.performance-combined .performance-bridge,
.performance-combined .performance-bridge .eyebrow,
.performance-combined .performance-bridge h3,
.performance-combined .performance-bridge p{
  color:#f6f2e9 !important;
}
.performance-combined .performance-bridge .performance-btn-bottom{
  color:#f6f2e9 !important;
  border-color:rgba(246,242,233,.72) !important;
}
.performance-combined .performance-bridge .performance-btn-bottom:hover{
  background:#f6f2e9 !important;
  color:var(--cta-bg,var(--red)) !important;
}


/* ---- consolidated homepage block ---- */


/* Header */


/* Hero */
.hero-v3 .hero-copy > p{max-width:690px}
.hero-actions-three{align-items:stretch}
@media (max-width:1100px) and (min-width:701px){
  .hero-actions-three .btn{flex:1 1 calc(50% - 6px);justify-content:center}
  .hero-actions-three .btn:nth-child(3){flex-basis:100%}
}
@media (max-width:700px){
  .hero-actions-three{display:grid;grid-template-columns:1fr;gap:9px}
  .hero-actions-three .btn{width:100%;justify-content:center;box-sizing:border-box}
  .hero-v3 .hero-copy > p{max-width:31rem;font-size:.96rem;line-height:1.55}
}

/* Method */
@media (max-width:1050px){
  .learn-yourself-line{white-space:normal!important}
}
@media (max-width:700px){
  .method-v3 .method-statement{gap:26px!important}
  .method-sequence{margin-top:42px!important}
  .method-step{padding:22px 12px!important}
  .method-step span{margin-bottom:8px!important}
}

/* Working principle — stack before it gets compressed */
@media (max-width:1100px){
  .principle-note-grid{grid-template-columns:1fr!important;gap:26px!important}
  .principle-note-photo{max-width:780px}
}
@media (max-width:700px){
  .principle-note-photo{aspect-ratio:4/3;overflow:hidden}
  .principle-note-photo img{width:100%;height:100%;object-fit:cover}
}

/* Lessons */
@media (min-width:951px){
  .pathways.pathways-three{grid-auto-rows:430px}
  .pathways-three .pathway{min-height:430px;height:430px}
  .pathways-three .advanced{display:flex;flex-direction:column;justify-content:flex-end;padding-top:70px}
}
.pathways-three .tag{white-space:normal;line-height:1.25}
@media (max-width:700px){
  .pathways-three .pathway-photo img{object-position:center center}
  .pathways-three .pathway-copy{padding-bottom:28px}
}

/* Performance */
.performance-link-heading a{
  display:inline-block;
  padding:.04em 0 .18em;
}
@media (max-width:1120px){
  .performance-title-row{display:block!important}
  .performance-title-row .performance-btn{margin-top:26px!important;margin-bottom:0!important}
}
.performance-combined .performance-btn-bottom{
  background:transparent!important;
  box-shadow:none!important;
  opacity:.92;
}
@media (max-width:700px){
  .performance-mosaic{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:175px 175px!important;
    gap:8px!important;
  }
  .performance-mosaic figure{
    grid-column:auto!important;
    grid-row:auto!important;
    min-height:0!important;
  }
  .performance-mosaic figure img{height:100%!important;object-fit:cover!important}
  .performance-combined .performance-bridge{
    margin-top:46px!important;
    padding-top:42px!important;
    padding-bottom:46px!important;
  }
}

/* Studio — simplify overlap earlier on tablet */
@media (max-width:900px){
  .studio-v3-grid{grid-template-columns:1fr!important;gap:40px!important}
  .studio-images{
    min-height:0!important;
    display:grid!important;
    grid-template-columns:1.35fr .65fr!important;
    grid-template-rows:170px 170px!important;
    gap:10px!important;
  }
  .studio-images .studio-main{
    position:static!important;width:100%!important;height:350px!important;
    grid-row:1 / span 2!important;object-fit:cover!important;
  }
  .studio-images .studio-detail,
  .studio-images .studio-exterior{
    position:static!important;width:100%!important;height:170px!important;
    border:0!important;object-fit:cover!important;
  }
}
@media (max-width:600px){
  .studio-images{grid-template-columns:1fr 1fr!important;grid-template-rows:auto!important}
  .studio-images .studio-main{
    grid-column:1 / -1!important;grid-row:auto!important;height:280px!important;
  }
  .studio-images .studio-detail,.studio-images .studio-exterior{height:150px!important}
}

/* About */
@media (min-width:1001px){
  .about-v3 .about-portrait{min-height:640px!important;height:640px!important}
  .about-v3 .about-portrait img{min-height:640px!important;height:640px!important;object-position:52% center!important}
}
@media (max-width:1000px){
  .about-v3 .about-portrait{min-height:520px!important;height:520px!important}
  .about-v3 .about-portrait img{min-height:520px!important;height:520px!important;object-position:54% center!important}
}
@media (max-width:700px){
  .about-v3 .about-portrait{min-height:420px!important;height:420px!important}
  .about-v3 .about-portrait img{min-height:420px!important;height:420px!important;object-position:56% center!important}
  .about-one-line{white-space:normal!important}
  .staff-row{display:block!important;padding:15px 0!important}
  .staff-row strong,.staff-row span{display:block!important;text-align:left!important}
  .staff-row span{margin-top:5px;line-height:1.35}
}

/* CTA / FAQ */
@media (max-width:700px){
  .cta-v3{padding-top:78px!important;padding-bottom:78px!important}
  .cta-faq-scroll{max-height:none!important;overflow:visible!important}
  .home-faq-item.open .home-faq-answer{max-height:800px!important}
  .cta-faq{padding-bottom:0}
}

/* Footer mobile touch targets */
@media (max-width:700px){
  .foot-nav{gap:4px 16px!important}
  .foot-nav a{display:inline-block;padding:7px 0}
}

/* Night-mode secondary text contrast */
html[data-theme="dark"] .about-copy p,
html[data-theme="dark"] .studio-copy p,
html[data-theme="dark"] .method-body p,
html[data-theme="dark"] .principle-note-copy p,
html[data-theme="dark"] .pathway p{
  color:var(--text)!important;
  opacity:1;
}
html[data-theme="dark"] .pathway-text.dark{
  box-shadow:inset 0 0 0 1px rgba(246,242,233,.12);
}

.lead-1{font:500 2.1rem/1 var(--serif);margin-top:34px}
.lead-2{font:500 2.15rem/1 var(--serif);margin-top:34px}