
/* =========================================================
   DIEGO ROSSI — EDITORIAL STUDIO REDESIGN
   Visual direction: editorial / photographic / music studio
   ========================================================= */

:root{
  --ed-ink:#141414;
  --ed-ink-soft:#242424;
  --ed-paper:#f2eee6;
  --ed-paper-2:#e9e1d4;
  --ed-copper:#c55c36;
  --ed-copper-dark:#9e4528;
  --ed-violet:#5b52ff;
  --ed-white:#fffdf9;
  --ed-muted:#6c675f;
  --ed-line:rgba(20,20,20,.18);
  --ed-max:1320px;
}

html{background:var(--ed-ink)}
body{
  background:var(--ed-paper);
  color:var(--ed-ink);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.container{width:min(calc(100% - 56px),var(--ed-max))}
h1,h2,h3{
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:-.055em;
}
h2{font-size:clamp(39px,5vw,72px);line-height:.96}
h3{letter-spacing:-.035em}
p{letter-spacing:-.01em}
.eyebrow{
  color:var(--ed-copper)!important;
  font-size:11px;
  letter-spacing:.22em;
  font-weight:850;
}
.lead{color:var(--ed-muted)}

/* HEADER — black studio strip, not the previous light navigation */
.site-header{
  background:rgba(20,20,20,.97);
  border:0;
  color:#fff;
  backdrop-filter:blur(16px);
}
.nav-wrap{height:74px}
.brand{gap:12px;color:#fff}
.brand-mark{
  width:46px;height:46px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.28);
  background:#000;
}
.brand strong{font-size:14px;letter-spacing:.01em}
.brand small{color:#aaa49a;font-size:10px;letter-spacing:.2em}
.main-nav{gap:24px;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.main-nav>a:not(.btn){color:#d6d1c8}
.main-nav>a:not(.btn):hover{color:#fff}
.main-nav>a.active:after{
  bottom:1px;height:1px;background:var(--ed-copper)
}
.menu-toggle span{background:#fff}
.btn{
  min-height:47px;
  border-radius:2px;
  padding:0 20px;
  background:var(--ed-ink);
  border:1px solid var(--ed-ink);
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:12px;
  font-weight:800;
}
.btn:after{content:" ↗";margin-left:9px}
.btn:hover{background:var(--ed-copper);border-color:var(--ed-copper);color:#fff;transform:none}
.site-header .btn{background:var(--ed-copper);border-color:var(--ed-copper);color:#fff}
.site-header .btn:hover{background:#fff;border-color:#fff;color:var(--ed-ink)}
.btn-ghost,.btn-ghost-light{
  background:transparent;
  color:var(--ed-ink);
  border-color:var(--ed-ink);
}
.btn-ghost:hover,.btn-ghost-light:hover{background:var(--ed-ink);color:#fff}

/* HOME — completely new editorial composition */
.home-editorial{overflow:hidden}
.editorial-hero{
  min-height:calc(100vh - 74px);
  background:var(--ed-paper);
  border-bottom:1px solid var(--ed-line);
}
.editorial-hero-grid{
  width:min(100%,1600px);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(420px,.78fr) 1.22fr;
  min-height:calc(100vh - 74px);
}
.editorial-hero-copy{
  padding:clamp(54px,7vw,108px) clamp(34px,5vw,86px) 56px max(28px,calc((100vw - var(--ed-max))/2));
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
  z-index:2;
}
.editorial-number{
  display:flex;align-items:center;gap:13px;
  font-size:11px;letter-spacing:.23em;text-transform:uppercase;font-weight:900;
  margin-bottom:34px;
}
.editorial-number:before{
  content:"";
  display:block;
  width:56px;height:2px;background:var(--ed-copper);
}
.editorial-hero h1{
  color:var(--ed-ink);
  font-size:clamp(60px,8vw,122px);
  line-height:.82;
  letter-spacing:-.078em;
  margin:0 0 34px;
  max-width:820px;
}
.editorial-hero h1 span{
  display:block;
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-weight:400;
  letter-spacing:-.06em;
  color:var(--ed-copper);
}
.editorial-hero .intro{
  max-width:610px;
  font-size:clamp(17px,1.5vw,21px);
  color:#4d4943;
  line-height:1.52;
}
.editorial-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.editorial-hero-proof{
  margin-top:52px;
  border-top:1px solid var(--ed-line);
  display:grid;
  grid-template-columns:repeat(3,1fr);
  max-width:690px;
}
.editorial-hero-proof div{padding:18px 18px 0 0}
.editorial-hero-proof div+div{padding-left:18px;border-left:1px solid var(--ed-line)}
.editorial-hero-proof strong{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.07em}
.editorial-hero-proof span{display:block;font-size:12px;color:var(--ed-muted);margin-top:4px}
.editorial-hero-image{
  margin:0;
  position:relative;
  min-height:620px;
  overflow:hidden;
  background:#291e17;
  border-bottom-left-radius:110px;
}
.editorial-hero-image img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:52% center;
}
.editorial-hero-image:after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(20,20,20,.12),transparent 35%);
  pointer-events:none;
}
.photo-label{
  position:absolute;
  z-index:2;
  right:26px;bottom:26px;
  background:rgba(20,20,20,.92);
  color:#fff;
  padding:14px 17px;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.13em;
  display:grid;
  gap:3px;
}
.photo-label b{color:#f7c4ab}

/* Intro ribbon */
.home-ribbon{
  background:var(--ed-ink);
  color:#fff;
  overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.home-ribbon-track{
  display:flex;gap:28px;
  white-space:nowrap;
  padding:16px 0;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:700;
}
.home-ribbon-track span:after{content:"◆";color:var(--ed-copper);margin-left:28px;font-size:9px}

/* Courses are a ledger/list, not cards */
.course-ledger{padding:110px 0 90px;background:var(--ed-white)}
.ledger-head{
  display:grid;
  grid-template-columns:.55fr 1.45fr;
  gap:70px;
  align-items:end;
  margin-bottom:55px;
}
.ledger-head h2{margin:0;max-width:850px}
.ledger-head p{margin:0;color:var(--ed-muted);max-width:420px}
.course-list{border-top:2px solid var(--ed-ink)}
.course-row{
  display:grid;
  grid-template-columns:86px minmax(240px,.72fr) 1fr 46px;
  gap:28px;
  align-items:center;
  padding:28px 8px;
  border-bottom:1px solid var(--ed-line);
  transition:padding .2s ease,background .2s ease;
}
.course-row:hover{padding-left:22px;background:var(--ed-paper)}
.course-row .n{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  color:var(--ed-copper);
  font-size:30px;
}
.course-row h3{font-size:clamp(28px,3vw,45px);margin:0}
.course-row p{margin:0;color:var(--ed-muted);font-size:15px;max-width:640px}
.course-row .arrow{
  width:40px;height:40px;border:1px solid var(--ed-ink);
  display:grid;place-items:center;font-size:18px;
}

/* Experience statement — off-grid editorial block */
.experience-editorial{
  background:var(--ed-copper);
  color:#fff;
  padding:100px 0;
}
.experience-layout{
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:90px;
  align-items:start;
}
.experience-kicker{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:clamp(32px,4vw,58px);
  line-height:1.05;
  max-width:900px;
  margin:0;
}
.experience-copy{
  border-left:1px solid rgba(255,255,255,.45);
  padding-left:34px;
}
.experience-copy p{margin-top:0;color:#fff4ef;font-size:17px}
.avatar-seal{
  margin-top:28px;
  display:flex;align-items:center;gap:15px;
  font-size:11px;text-transform:uppercase;letter-spacing:.12em;
}
.avatar-seal img{
  width:72px;height:72px;border-radius:50%;object-fit:cover;
  border:2px solid #fff;
}

/* Method — horizontal numbered columns */
.method-editorial{padding:110px 0;background:var(--ed-paper)}
.method-top{
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:80px;
  margin-bottom:60px;
}
.method-top p:not(.eyebrow){color:var(--ed-muted);font-size:18px;max-width:480px}
.method-track{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--ed-ink);
  border-bottom:1px solid var(--ed-ink);
}
.method-item{
  min-height:275px;
  padding:26px 26px 30px 0;
}
.method-item+.method-item{border-left:1px solid var(--ed-line);padding-left:26px}
.method-item .n{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:38px;
  color:var(--ed-copper);
  display:block;
  margin-bottom:48px;
}
.method-item h3{font-size:25px}
.method-item p{color:var(--ed-muted);font-size:14px}

/* Areas — giant typographic links */
.area-editorial{padding:92px 0;background:var(--ed-ink);color:#fff}
.area-editorial h2{max-width:850px}
.area-links{margin-top:50px;border-top:1px solid rgba(255,255,255,.25)}
.area-links a{
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.25);
  padding:20px 0;
  font-size:clamp(30px,4.5vw,64px);
  letter-spacing:-.055em;
  line-height:1;
}
.area-links a small{
  font-size:10px;text-transform:uppercase;letter-spacing:.16em;color:#b8b3ab
}
.area-links a:hover{color:#f3a884}

/* Audience, no card grid */
.audience-editorial{padding:110px 0;background:var(--ed-white)}
.audience-head{max-width:880px;margin-bottom:48px}
.audience-bands{display:grid;border-top:2px solid var(--ed-ink)}
.audience-band{
  display:grid;
  grid-template-columns:.45fr 1fr;
  border-bottom:1px solid var(--ed-line);
  padding:28px 0;
}
.audience-band h3{font-size:clamp(33px,4vw,58px);margin:0}
.audience-band p{margin:0;align-self:center;max-width:700px;color:var(--ed-muted)}

/* Final CTA */
.final-editorial-cta{
  background:var(--ed-paper-2);
  padding:100px 0;
  border-top:1px solid var(--ed-line);
}
.final-cta-grid{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  gap:80px;
  align-items:end;
}
.final-editorial-cta h2{font-size:clamp(48px,7vw,100px);max-width:950px}
.final-editorial-cta .side{
  border-left:1px solid var(--ed-line);
  padding-left:30px;
}
.final-editorial-cta .side p{color:var(--ed-muted)}

/* ---------- GLOBAL INTERNAL PAGE REDESIGN ---------- */
.breadcrumbs{
  width:min(calc(100% - 56px),var(--ed-max));
  color:#8b857d;
  margin-top:24px;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:10px;
}
.course-hero{
  background:var(--ed-paper);
  color:var(--ed-ink);
  padding:54px 0 72px;
  border-bottom:1px solid var(--ed-line);
  position:relative;
}
.course-hero:before{
  content:"";
  width:92px;height:5px;background:var(--ed-copper);
  position:absolute;left:max(28px,calc((100vw - var(--ed-max))/2));top:28px;
}
.course-hero h1{
  font-size:clamp(58px,8vw,116px);
  line-height:.86;
  max-width:1120px;
}
.course-hero .lead{color:var(--ed-muted);font-size:clamp(18px,2vw,23px)}
.course-meta{border-top:1px solid var(--ed-line);margin-top:34px;padding-top:18px}
.course-meta span{
  border:0;border-radius:0;padding:0 20px 0 0;
  color:var(--ed-muted);
  text-transform:uppercase;letter-spacing:.1em;font-size:10px
}
.section{padding:92px 0}
.section:nth-of-type(even):not(.dark):not(.cta-band){background:var(--ed-white)}
.section-header{max-width:950px}
.section-header p:not(.eyebrow){color:var(--ed-muted)}
.split{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:100px}
.card{
  border:0;border-top:1px solid var(--ed-ink);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  padding:24px 18px 28px 0;
}
.card p{color:var(--ed-muted)}
.grid-3,.grid-4,.grid-2{gap:28px}
.dark{
  background:var(--ed-ink);
  color:#fff;
}
.dark .card{
  background:transparent;
  border-color:rgba(255,255,255,.36);
}
.dark .card p{color:#bbb5ad}
.dark .lead{color:#c9c3bb}
.feature-list{border-top:1px solid currentColor;gap:0}
.feature-list li{
  padding:16px 0 16px 32px;
  border-bottom:1px solid rgba(128,128,128,.3)
}
.feature-list li:before{content:"→";color:var(--ed-copper)}
.steps{border-top:1px solid var(--ed-ink);gap:0}
.step{
  grid-template-columns:72px 1fr;
  padding:22px 0;
  border-bottom:1px solid var(--ed-line)
}
.step:before{
  width:45px;height:45px;border-radius:0;
  background:var(--ed-copper);color:#fff;
}
.note,.callout{
  border:0;border-left:5px solid var(--ed-copper);
  border-radius:0;background:var(--ed-white)
}
.tag{border-radius:0;background:transparent;border-color:var(--ed-line)}
.location-list{grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--ed-ink)}
.location-list a{
  border:0;border-bottom:1px solid var(--ed-line);
  border-radius:0;background:transparent;
  padding:20px 0;font-size:22px
}
.location-list a:nth-child(odd){padding-right:28px}
.location-list a:nth-child(even){padding-left:28px;border-left:1px solid var(--ed-line)}
.cta-band{
  background:var(--ed-copper);
  color:#fff;
  padding:82px 0
}
.cta-band .eyebrow{color:#3a160b!important}
.cta-grid h2{font-size:clamp(40px,5vw,74px)}
.cta-grid p:not(.eyebrow){color:#fff0e8}
.cta-band .btn{background:#fff;border-color:#fff;color:var(--ed-ink)}
.cta-band .btn:hover{background:var(--ed-ink);border-color:var(--ed-ink);color:#fff}
.cta-band .btn-ghost-light{background:transparent;border-color:#fff;color:#fff}
.cta-band .btn-ghost-light:hover{background:#fff;color:var(--ed-ink)}
.faq{gap:0;border-top:2px solid var(--ed-ink)}
.faq details{
  background:transparent;
  border:0;border-bottom:1px solid var(--ed-line);
  border-radius:0;padding:0
}
.faq summary{font-size:18px}
.contact-grid{grid-template-columns:.7fr 1.3fr;gap:70px}
.contact-panel{
  background:var(--ed-copper);border-radius:0;
  top:96px;color:#fff
}
.contact-panel p{color:#fff1ea}
.form-card{
  border-radius:0;border:1px solid var(--ed-ink);
  background:var(--ed-white);
  box-shadow:12px 12px 0 var(--ed-ink)
}
.field input,.field select,.field textarea{border-radius:0;background:transparent}
.blog-grid{gap:34px}
.article-card{border-top:1px solid var(--ed-ink);padding-top:18px}
.mini-visual{border-radius:0}
.profile-photo{
  border-radius:0;
  box-shadow:18px 18px 0 var(--ed-copper);
  border:0
}
.profile-photo figcaption{background:var(--ed-ink)}
.quote,.quote-small{font-style:italic}
.content-narrow{max-width:900px}

/* Footer becomes a graphic closing panel */
.site-footer{
  background:#0d0d0d;
  padding:76px 0 28px;
  border-top:8px solid var(--ed-copper)
}
.footer-grid{
  grid-template-columns:1.4fr .75fr .75fr .75fr;
  gap:54px;
}
.footer-title{color:#f2a182}
.site-footer a{color:#bcb6ad}
.site-footer a:hover{color:#fff}
.footer-bottom{color:#777169}
.wa-float{
  background:var(--ed-copper);
  color:#fff;
  border:2px solid var(--ed-white);
  border-radius:4px;
  width:54px;height:54px
}

/* Mobile */
@media(max-width:1050px){
  .main-nav{
    top:74px;
    background:var(--ed-ink);
    border-color:rgba(255,255,255,.15);
    border-radius:0;
    box-shadow:0 30px 60px rgba(0,0,0,.25)
  }
  .main-nav>a:not(.btn){color:#fff}
  .editorial-hero-grid{grid-template-columns:1fr}
  .editorial-hero-copy{
    padding:70px max(28px,5vw) 50px;
    order:2
  }
  .editorial-hero-image{
    min-height:58vh;
    border-bottom-left-radius:64px;
    order:1
  }
  .ledger-head,.experience-layout,.method-top,.final-cta-grid{grid-template-columns:1fr;gap:34px}
  .course-row{grid-template-columns:64px .7fr 1fr 40px}
  .method-track{grid-template-columns:1fr 1fr}
  .method-item:nth-child(3){border-left:0;border-top:1px solid var(--ed-line);padding-left:0}
  .method-item:nth-child(4){border-top:1px solid var(--ed-line)}
  .split,.contact-grid,.cta-grid{grid-template-columns:1fr;gap:48px}
  .footer-grid{grid-template-columns:1.2fr 1fr 1fr}
}
@media(max-width:680px){
  .container{width:min(calc(100% - 30px),var(--ed-max))}
  .editorial-hero h1{font-size:clamp(58px,20vw,88px)}
  .editorial-hero-image{min-height:48vh;border-bottom-left-radius:40px}
  .editorial-hero-proof{grid-template-columns:1fr}
  .editorial-hero-proof div{padding:13px 0;border-top:1px solid var(--ed-line)}
  .editorial-hero-proof div+div{padding-left:0;border-left:0}
  .course-ledger,.method-editorial,.audience-editorial{padding:76px 0}
  .course-row{
    grid-template-columns:48px 1fr 34px;
    gap:14px;padding:22px 0
  }
  .course-row p{grid-column:2/4}
  .method-track{grid-template-columns:1fr}
  .method-item,.method-item+.method-item{
    border-left:0;border-top:1px solid var(--ed-line);
    padding:22px 0;min-height:auto
  }
  .method-item .n{margin-bottom:18px}
  .audience-band{grid-template-columns:1fr;gap:12px}
  .area-links a{align-items:flex-end}
  .area-links a small{max-width:90px;text-align:right}
  .location-list{grid-template-columns:1fr}
  .location-list a:nth-child(even){padding-left:0;border-left:0}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-grid>div:first-child{grid-column:1/-1}
  .course-hero h1{font-size:clamp(52px,17vw,78px)}
  .form-card{box-shadow:7px 7px 0 var(--ed-ink)}
}


/* =========================================================
   PHOTOGRAPHIC STORIES
   ========================================================= */
.photo-story-section{background:var(--ed-white)}
.photo-story-head{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:70px;
  align-items:end;
  margin-bottom:46px;
}
.photo-story-head h2{margin-bottom:0}
.photo-story-head>p{margin:0;color:var(--ed-muted);font-size:17px;line-height:1.6}

.exam-photo-layout{
  display:grid;
  grid-template-columns:1.45fr .72fr;
  gap:18px;
  align-items:stretch;
}
.exam-photo-layout figure{margin:0;overflow:hidden;background:#ddd}
.exam-feature img{
  display:block;width:100%;height:100%;
  min-height:650px;object-fit:cover;object-position:center;
}
.exam-stack{display:grid;grid-template-rows:1fr 1fr;gap:18px}
.exam-stack figure{min-height:316px}
.exam-stack img{
  display:block;width:100%;height:100%;
  object-fit:cover;object-position:center 34%;
}
.photo-story-caption{
  border-top:1px solid var(--ed-line);
  margin:20px 0 0;padding-top:14px;
  color:var(--ed-muted);font-size:12px;text-transform:uppercase;letter-spacing:.12em;
}

/* Home live photo essay */
.home-live-story{
  background:#171717;
  color:#fff;
  padding:105px 0;
}
.home-live-head{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:70px;
  align-items:end;
  margin-bottom:46px;
}
.home-live-head h2{margin:0;max-width:870px}
.home-live-head p:last-child{color:#aaa49b;margin:0;font-size:17px;line-height:1.6}
.home-live-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  grid-template-rows:290px 290px;
  gap:16px;
}
.home-live-grid figure{margin:0;overflow:hidden;background:#080808}
.home-live-grid .home-live-main{grid-row:1/3}
.home-live-grid img{
  width:100%;height:100%;display:block;object-fit:cover;
  filter:saturate(.92) contrast(1.03);
  transition:transform .5s ease,filter .5s ease;
}
.home-live-grid figure:hover img{transform:scale(1.018);filter:saturate(1.06) contrast(1.03)}
.home-live-main img{object-position:center 35%}

/* About: editorial masonry */
.live-biography{background:var(--ed-paper-2)!important}
.live-biography-head{
  max-width:940px;
  margin-bottom:48px;
}
.live-biography-head>p:last-child{
  max-width:720px;color:var(--ed-muted);font-size:17px
}
.biography-mosaic{
  display:grid;
  grid-template-columns:1.2fr .75fr .75fr;
  grid-template-rows:330px 330px;
  gap:16px;
}
.biography-mosaic figure{margin:0;overflow:hidden;background:#111}
.biography-mosaic img{width:100%;height:100%;display:block;object-fit:cover}
.bio-wide{grid-column:1/3}
.bio-wide img{object-position:center 45%}
.bio-tall{grid-column:3;grid-row:1/3}
.bio-tall img{object-position:center 34%}
.biography-mosaic figure:nth-child(3){grid-column:1}
.biography-mosaic figure:nth-child(4){grid-column:2}

/* Keyboard page photo sequence */
.keyboard-live-proof{background:#111!important;color:#fff}
.keyboard-live-proof .photo-story-head>p{color:#b9b3aa}
.keyboard-live-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr .75fr;
  grid-template-rows:300px 300px;
  gap:15px;
}
.keyboard-live-grid figure{margin:0;overflow:hidden;background:#050505}
.keyboard-live-grid img{width:100%;height:100%;display:block;object-fit:cover}
.keyboard-live-grid .keys-wide{grid-column:1/3}
.keyboard-live-grid .keys-wide img{object-position:center 42%}
.keyboard-live-grid figure:nth-child(2){grid-column:3;grid-row:1/3}
.keyboard-live-grid figure:nth-child(2) img{object-position:center 40%}
.keyboard-live-grid figure:nth-child(3){grid-column:1}
.keyboard-live-grid figure:nth-child(4){grid-column:2}

/* Small motion detail without requiring JS */
@media(hover:hover){
  .exam-photo-layout img,.biography-mosaic img,.keyboard-live-grid img{
    transition:transform .45s ease
  }
  .exam-photo-layout figure:hover img,.biography-mosaic figure:hover img,.keyboard-live-grid figure:hover img{
    transform:scale(1.018)
  }
}

@media(max-width:900px){
  .photo-story-head,.home-live-head{grid-template-columns:1fr;gap:20px}
  .exam-photo-layout{grid-template-columns:1fr}
  .exam-feature img{min-height:auto;aspect-ratio:4/3}
  .exam-stack{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .exam-stack figure{min-height:0}
  .exam-stack img{aspect-ratio:3/4}
  .home-live-grid{grid-template-columns:1fr 1fr;grid-template-rows:420px 270px}
  .home-live-grid .home-live-main{grid-column:1/3;grid-row:1}
  .biography-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:320px 320px 360px}
  .bio-wide{grid-column:1/3}
  .bio-tall{grid-column:1;grid-row:2/4}
  .biography-mosaic figure:nth-child(3){grid-column:2;grid-row:2}
  .biography-mosaic figure:nth-child(4){grid-column:2;grid-row:3}
  .keyboard-live-grid{grid-template-columns:1fr 1fr;grid-template-rows:330px 300px 300px}
  .keyboard-live-grid .keys-wide{grid-column:1/3}
  .keyboard-live-grid figure:nth-child(2){grid-column:1;grid-row:2/4}
  .keyboard-live-grid figure:nth-child(3){grid-column:2;grid-row:2}
  .keyboard-live-grid figure:nth-child(4){grid-column:2;grid-row:3}
}
@media(max-width:600px){
  .home-live-story{padding:74px 0}
  .exam-stack{gap:10px}
  .home-live-grid,.biography-mosaic,.keyboard-live-grid{
    display:grid;grid-template-columns:1fr;grid-template-rows:auto;gap:10px
  }
  .home-live-grid .home-live-main,
  .bio-wide,.bio-tall,
  .biography-mosaic figure:nth-child(3),
  .biography-mosaic figure:nth-child(4),
  .keyboard-live-grid .keys-wide,
  .keyboard-live-grid figure:nth-child(2),
  .keyboard-live-grid figure:nth-child(3),
  .keyboard-live-grid figure:nth-child(4){
    grid-column:auto;grid-row:auto
  }
  .home-live-grid img,.biography-mosaic img,.keyboard-live-grid img{
    aspect-ratio:4/3
  }
  .biography-mosaic .bio-tall img{aspect-ratio:3/4}
}


/* =========================================================
   BRAND LOGO — increased presence
   ========================================================= */
.site-header .nav-wrap{height:88px}
.site-header .brand{gap:15px}
.site-header .brand-mark{
  width:62px;
  height:62px;
  flex:0 0 62px;
  border:2px solid rgba(197,92,54,.82);
  box-shadow:
    0 0 0 4px rgba(255,255,255,.055),
    0 8px 24px rgba(0,0,0,.28);
}
.site-header .brand strong{
  font-size:16px;
  letter-spacing:.015em;
}
.site-header .brand small{
  font-size:10.5px;
  letter-spacing:.2em;
  margin-top:5px;
}
.site-footer .brand-mark{
  width:64px;
  height:64px;
  flex:0 0 64px;
  border:2px solid rgba(197,92,54,.72);
}
.site-footer .brand{
  gap:15px;
}
.site-footer .brand strong{
  font-size:16px;
}
@media(max-width:1050px){
  .main-nav{top:88px}
}
@media(max-width:680px){
  .site-header .nav-wrap{height:78px}
  .site-header .brand{gap:10px}
  .site-header .brand-mark{
    width:52px;
    height:52px;
    flex-basis:52px;
  }
  .site-header .brand strong{font-size:14px}
  .site-header .brand small{font-size:9px}
  .main-nav{top:78px}
}


/* =========================================================
   CHILDREN / BEGINNERS — 6+
   ========================================================= */
.kids-intro{
  background:var(--ed-paper-2);
  border-top:1px solid var(--ed-line);
  border-bottom:1px solid var(--ed-line);
  padding:78px 0;
}
.kids-intro-grid{
  display:grid;
  grid-template-columns:.62fr 1.38fr;
  gap:70px;
  align-items:center;
}
.kids-age{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  font-family:Georgia,"Times New Roman",serif;
  color:var(--ed-copper);
  line-height:.72;
  user-select:none;
}
.kids-age span{
  font-size:clamp(150px,20vw,300px);
  letter-spacing:-.09em;
}
.kids-age sup{
  font-family:Inter,ui-sans-serif,sans-serif;
  font-size:clamp(36px,5vw,72px);
  font-weight:700;
  margin:8px 0 0 8px;
}
.kids-copy{max-width:720px}
.kids-copy h2{
  margin:0 0 22px;
  font-size:clamp(42px,5.5vw,78px);
}
.kids-copy>p:not(.eyebrow){
  color:var(--ed-muted);
  font-size:18px;
  line-height:1.55;
  max-width:650px;
}
.kids-points{
  display:flex;
  flex-wrap:wrap;
  gap:0;
  margin:28px 0 22px;
  border-top:1px solid var(--ed-line);
  border-bottom:1px solid var(--ed-line);
}
.kids-points span{
  padding:13px 22px 13px 0;
  margin-right:22px;
  font-size:11px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.kids-points span+span{
  border-left:1px solid var(--ed-line);
  padding-left:22px;
}
.kids-course-note{
  padding:34px 0;
  background:var(--ed-copper);
  color:#fff;
}
.kids-course-note-inner{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:34px;
  align-items:center;
}
.kids-course-age{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:88px;
  line-height:.8;
  color:#fff;
  letter-spacing:-.06em;
}
.kids-course-note h2{
  font-size:clamp(30px,4vw,48px);
  margin:0 0 7px;
  color:#fff;
}
.kids-course-note p:not(.eyebrow){
  margin:0;
  color:#fff2eb;
}
.kids-course-note .eyebrow{
  color:#3a160b!important;
}
@media(max-width:800px){
  .kids-intro-grid{grid-template-columns:1fr;gap:20px}
  .kids-age{justify-content:flex-start}
  .kids-age span{font-size:150px}
  .kids-course-note-inner{grid-template-columns:105px 1fr;gap:22px}
  .kids-course-age{font-size:68px}
}
@media(max-width:540px){
  .kids-intro{padding:60px 0}
  .kids-points{display:grid}
  .kids-points span{margin:0;padding:10px 0}
  .kids-points span+span{border-left:0;border-top:1px solid var(--ed-line);padding-left:0}
  .kids-course-note-inner{grid-template-columns:1fr}
}


/* Online professional studio */
.online-studio-section{
  background:var(--ed-ink)!important;
  color:#fff;
}
.online-studio-section .section-header p:not(.eyebrow){
  color:#bbb5ad;
}
.online-studio-section .card{
  border-color:rgba(255,255,255,.28);
}
.online-studio-section .card p{
  color:#bbb5ad;
}


/* Music software skills */
.software-skills{background:var(--ed-paper-2)!important;padding:62px 0}
.software-skills-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:end}
.software-skills h2{margin:0;font-size:clamp(36px,4.7vw,62px)}
.software-skills-grid>div:last-child>p{margin:0;color:var(--ed-muted);font-size:16px;line-height:1.55;max-width:670px}
.software-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.software-tags span{border:1px solid currentColor;padding:8px 12px;font-size:10px;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.software-skills-dark{background:#1b1b1b!important;color:#fff}
.software-skills-dark .software-skills-grid>div:last-child>p{color:#bbb5ad}
@media(max-width:760px){.software-skills-grid{grid-template-columns:1fr;gap:20px}}


/* =========================================================
   WHERE I TEACH — institutions + private lessons
   ========================================================= */
.teaching-locations{
  padding:100px 0;
  background:var(--ed-ink);
  color:#fff;
}
.teaching-locations-head{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:70px;
  align-items:end;
  margin-bottom:48px;
}
.teaching-locations-head h2{
  margin:0;
  max-width:900px;
}
.teaching-locations-head>p{
  margin:0;
  color:#aaa49b;
  font-size:17px;
  line-height:1.55;
  max-width:520px;
}
.teaching-places{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.28);
  border-bottom:1px solid rgba(255,255,255,.28);
}
.teaching-place{
  min-height:380px;
  padding:28px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.teaching-place+.teaching-place{
  border-left:1px solid rgba(255,255,255,.22);
}
.teaching-place h3{
  margin:7px 0 12px;
  font-size:clamp(28px,3vw,42px);
  line-height:1;
  color:#fff;
}
.teaching-place p{
  color:#bbb5ad;
}
.place-number{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:66px;
  color:var(--ed-copper);
}
.place-type{
  margin:0;
  color:#f0a183!important;
  font-size:10px!important;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.16em;
}
.school-logo-wrap{
  min-height:150px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  margin-bottom:26px;
}
.school-logo-wrap img{
  display:block;
  max-width:100%;
  max-height:150px;
  object-fit:contain;
  background:#fff;
}
.school-logo-wide img{
  width:100%;
  max-width:340px;
  padding:12px 16px;
}
.school-logo-square img{
  width:150px;
  height:150px;
  object-fit:contain;
}
.teaching-online{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  padding:21px 0 0;
  margin-top:8px;
  font-size:16px;
  color:#fff;
}
.teaching-online strong{color:#f2a182}

/* institution callout on local pages */
.institution-band{
  padding:44px 0;
  background:var(--ed-paper-2);
  border-bottom:1px solid var(--ed-line);
}
.institution-band-grid{
  display:grid;
  grid-template-columns:260px 1fr;
  gap:55px;
  align-items:center;
}
.institution-logo{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:160px;
  background:#fff;
  padding:18px;
}
.institution-logo img{
  max-width:100%;
  max-height:160px;
  object-fit:contain;
}
.institution-band h2{
  margin:0 0 12px;
  font-size:clamp(34px,4.5vw,60px);
}
.institution-band p:not(.eyebrow){
  margin:0;
  max-width:760px;
  color:var(--ed-muted);
  font-size:16px;
}

@media(max-width:960px){
  .teaching-locations-head{grid-template-columns:1fr;gap:22px}
  .teaching-places{grid-template-columns:1fr}
  .teaching-place{min-height:auto;padding:30px 0}
  .teaching-place+.teaching-place{border-left:0;border-top:1px solid rgba(255,255,255,.22)}
  .school-logo-wrap{min-height:auto}
  .institution-band-grid{grid-template-columns:200px 1fr;gap:32px}
}
@media(max-width:620px){
  .teaching-locations{padding:74px 0}
  .teaching-place{padding:26px 0}
  .place-number{font-size:50px;margin-bottom:34px}
  .school-logo-wrap{justify-content:flex-start}
  .institution-band-grid{grid-template-columns:1fr;gap:22px}
  .institution-logo{justify-content:flex-start;min-height:auto}
  .institution-logo img{max-height:130px}
}


/* WhatsApp official-style mark */
.wa-inline-icon{
  width:19px;
  height:19px;
  flex:0 0 19px;
  display:inline-block;
  vertical-align:-4px;
  margin-right:8px;
  border-radius:50%;
}
.wa-float{
  width:58px;
  height:58px;
  padding:0;
  border-radius:50%;
  background:#25D366!important;
  border:3px solid #fff!important;
  display:grid;
  place-items:center;
  overflow:hidden;
  box-shadow:0 12px 30px rgba(0,0,0,.28);
}
.wa-float img{
  width:100%;
  height:100%;
  display:block;
}


/* Contact phone + school links */
.phone-link{
  font-size:20px;
  font-weight:800;
  letter-spacing:.02em;
}
.school-logo-wrap > a,
.institution-logo > a{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
}
.school-logo-wrap > a img,
.institution-logo > a img{
  transition:transform .2s ease, opacity .2s ease;
}
.school-logo-wrap > a:hover img,
.institution-logo > a:hover img{
  transform:scale(1.02);
  opacity:.92;
}
.teaching-place h3 a{
  color:inherit;
  text-decoration:none;
}
.teaching-place h3 a:hover{
  color:#f2a182;
}

.dr-cookie{position:fixed;z-index:9999;left:16px;right:16px;bottom:16px;background:#171717;color:#fff;border:1px solid #c55c36;padding:18px;box-shadow:0 14px 40px rgba(0,0,0,.28);display:flex;gap:24px;align-items:center;justify-content:space-between}.dr-cookie[hidden]{display:none}.dr-cookie p{margin:5px 0 0}.dr-cookie-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.dr-cookie button,.dr-cookie a{font:inherit;border:1px solid #fff;background:transparent;color:#fff;padding:9px 12px;text-decoration:none;cursor:pointer}#dr-yes{background:#fff;color:#171717}@media(max-width:720px){.dr-cookie{display:block}.dr-cookie[hidden]{display:none}.dr-cookie-actions{margin-top:12px}}
