/* Reference-informed composition, kept separate for prototype review. */
:root{--bg:#0d1713;--gold:#c2ab7c}
@media(min-width:761px){.hero{height:734px}.hero-copy{padding-top:104px}.hero h1{font-size:clamp(64px,5.7vw,82px);letter-spacing:-3.3px;margin-top:22px;margin-bottom:26px}.hero-photo{inset:0;background-position:center}.hero-shade{background:linear-gradient(90deg,#0d1713d9 0%,#0d1713ad 28%,#0d171366 48%,#0d171300 75%),linear-gradient(0deg,#0d1713b3,transparent 30%)}.hero .button{padding:17px 23px}.hero-copy{padding-left:10%}}
.education{background:#111b16;color:var(--paper)}.education .section-label{color:var(--muted);border-color:var(--line)}.education em{color:var(--gold)}.education-intro p,.service-list p{color:var(--muted)}.service-list>a{border-color:var(--line);transition:color 150ms ease}.service-list .num{color:var(--gold)}.teachers{background:#15221b}.exams{background:var(--bg)}
@media(hover:hover) and (pointer:fine){.service-list>a:hover{padding-left:0;color:var(--gold)}}
dialog[open]{animation:mobile-in 200ms var(--ease) both}.keyboard dialog[open]{animation:none}
@keyframes mobile-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.hero-photo{inset:0;background-position:64% center}.hero-shade{background:linear-gradient(90deg,#0d1713e6,#0d1713a6 70%,#0d171366),linear-gradient(0deg,#0d1713 0%,transparent 45%)}.hero h1{font-size:55px;line-height:1.08}.hero-copy{padding-top:81px}.hero .intro{max-width:310px}.hero .intro br{display:initial}.hero-textlink{margin-top:12px}}
@media(max-width:360px){.hero h1{font-size:48px}.hero-copy{padding-top:70px}}
@media(prefers-reduced-motion:reduce){dialog[open]{animation:none}}
.hero-photo{background-image:url('english-landmarks-mix.webp')}

/* Readability and a warmer, lighter editorial rhythm. */
header{background:#f2efe6;color:#18261e;border-bottom-color:#243b3026}
.brand span{color:#4d5c50;font-size:10px}
.desktop{font-size:16px;gap:25px}
.desktop button{font-size:16px;min-height:48px}
.header-contact{font-size:15px;min-height:48px;border-color:#6e785c}
.desktop .plus{color:#65734f}
.education{background:#f2efe6;color:#18261e}
.education .section-label{color:#53604f;border-color:#243b3030}
.education em{color:#687456}
.education-intro p,.service-list p{color:#4b5c4e;font-size:15px}
.service-list>a{border-color:#243b3030}
.service-list .num{color:#65734f}
.teachers{background:#e5e8dd;color:#18261e}
.teachers .section-label{color:#53604f;border-color:#243b3030}
.teachers em{color:#687456}
.teachers .body-copy{color:#4b5c4e;font-size:15px}
.teacher-names article{border-color:#243b3030}
.teacher-names .eyebrow{color:#53604f;font-size:10px}
.teacher-note{color:#687456}
.teachers .text-link{border-color:#687456;font-size:14px}
.exams .body-copy,.translation p{font-size:15px}
.section-label{font-size:11px}
.mega-links a{min-height:64px}
.mega p{font-size:15px}
.mega .eyebrow{font-size:11px}
.hero-textlink{font-size:14px}
.button{font-size:14px}
.intro{font-size:16px}
.image-note{font-size:11px}
@media(max-width:1250px) and (min-width:761px){.brand span{display:none}.desktop{gap:18px}.desktop,.desktop button{font-size:15px}header{gap:24px}}
@media(hover:hover) and (pointer:fine){.desktop a:hover,.desktop button:hover{color:#53653c}.service-list>a:hover{color:#596c3d}}
@media(max-width:760px){#mobile-open{font-size:13px;color:#18261e}.hero-photo{background-position:68% center}.hero-shade{background:linear-gradient(90deg,#0d1713ed,#0d1713b3 70%,#0d171380),linear-gradient(0deg,#0d1713,transparent 55%)}.hero .intro{font-size:14px}.hero-textlink{font-size:13px}.hero .button{font-size:14px}.education-intro p,.service-list p,.teachers .body-copy,.exams .body-copy,.translation p{font-size:14px}.teacher-names .eyebrow{font-size:9px;line-height:1.9}.section-label{font-size:10px;letter-spacing:.8px}.section-label span:last-child{font-size:9px}.image-note{font-size:10px;line-height:1.6;max-width:290px}.hero-foot>.eyebrow{font-size:9px;max-width:280px}.hero-foot{gap:13px}.hero h1{font-size:53px}.hero-foot>a{top:6px}.dialog-head button{font-size:12px}.dialog-foot{font-size:12px}}
@media(max-width:360px){.hero h1{font-size:46px}.hero-foot>.eyebrow{font-size:8px}.image-note{max-width:230px}.section-label{gap:12px;font-size:9px}.section-label span:last-child{font-size:8px}}

/* Dedicated portrait art: contain preserves every landmark on mobile. */
@media(max-width:760px){
  .hero{height:900px;background:#0d1713}
  .hero-photo{inset:0;height:auto;background-image:url('english-landmarks-mobile.webp');background-size:cover;background-position:center bottom;background-repeat:no-repeat}
  .hero-shade{background:linear-gradient(180deg,#0d171326 0%,#0d171326 38%,#0d171300 60%,#0d171300 84%,#0d1713cc 100%)}
  .hero-copy{padding-top:44px}
  .hero h1{font-size:48px;line-height:1.06;margin-top:20px;margin-bottom:22px}
  .hero .intro{font-size:14px;line-height:1.75}
  .hero .button{margin-top:22px;padding:14px 20px}
  .hero-textlink{margin-top:3px;padding:14px 0}
  .hero-foot{bottom:16px}
}
@media(min-width:500px) and (max-width:760px){.hero-photo{height:auto}.hero-copy{padding-left:7%}.hero h1{font-size:54px}}
@media(max-width:360px){.hero{height:920px}.hero h1{font-size:44px}.hero-photo{height:auto;bottom:0}.hero .intro{font-size:13px}}