:root{--ink:#173d29;--green:#315b3c;--sage:#f0f6ed;--pink:#fcf1f0;--paper:#fffefa;--line:#dce3d9;--body:#36463d;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--body);font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:17px;line-height:1.7}a{color:inherit}img{max-width:100%;display:block}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{color:var(--ink);line-height:1.3}h2{font-size:34px;font-weight:750;margin-bottom:22px;letter-spacing:-.035em}h3{font-size:30px;font-weight:730;letter-spacing:-.025em}.wrap{width:min(1160px,calc(100% - 80px));margin-inline:auto}.section{padding-block:44px 12px}.section[id]{scroll-margin-top:100px}.header{border-bottom:1px solid var(--line);background:rgba(255,254,250,.98)}.header-inner{max-width:1360px;margin:auto;padding:19px 40px;display:flex;align-items:center;gap:30px}.brand{display:flex;flex-direction:column;text-decoration:none;flex-shrink:0;line-height:1.2;color:var(--ink)}.brand strong{font-size:24px;font-family:"Noto Serif SC","Songti SC",serif;font-weight:800}.brand span{font-size:16px;margin-top:4px}.header nav{display:flex;gap:9px;margin-left:auto;align-items:center}.header nav a,.languages a{padding:8px 12px;text-decoration:none;white-space:nowrap;font-size:14px;line-height:1.5;border-radius:9px}.header nav a:hover,.languages a:hover{background:#f1f4eb}.header a[aria-current]{background:#e9f0e3;color:var(--ink)}.languages{border-left:1px solid var(--line);padding-left:16px;display:flex;gap:2px}.languages a{padding:7px 9px}.hero{background:#fbfcf7;overflow:hidden}.hero-inner{max-width:1440px;margin:auto;display:grid;grid-template-columns:43% 57%;align-items:center;min-height:520px;position:relative}.hero-copy{position:relative;z-index:1;padding:50px 0 50px max(40px,calc((100vw - 1160px)/2));margin-right:-20px}.hero-brand{font-size:20px;color:var(--ink);margin-bottom:14px}h1{font-size:clamp(37px,4.2vw,58px);line-height:1.2;letter-spacing:-.035em;font-weight:800}.hero-local{font-size:25px;color:var(--ink);margin:9px 0 26px}.hero-tagline{font-size:22px;line-height:1.65;color:var(--ink);font-weight:600}.hero-sub{font-size:15px;margin:13px 0 27px}.hero-image{width:100%;height:540px;object-fit:cover;object-position:52% center;mix-blend-mode:multiply}.actions{display:flex;gap:13px;flex-wrap:wrap}.button{font:inherit;display:inline-flex;align-items:center;justify-content:center;gap:18px;font-size:16px;font-weight:650;padding:11px 21px;border:1px solid var(--green);border-radius:6px;text-decoration:none;line-height:1.5;cursor:pointer;transition:background .16s,color .16s}.primary{background:var(--green);color:white}.primary:hover{background:#21452b}.outline{background:transparent;color:var(--ink)}.outline:hover{background:#e6eddc}.button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #b86d76;outline-offset:5px}.intro-rows{display:grid;gap:20px}.intro-row{border-radius:12px;overflow:hidden;display:grid;grid-template-columns:1.04fr 1fr;align-items:center;gap:40px;padding:24px 24px 24px 34px;background:var(--sage)}.intro-row.teacher{background:var(--pink)}.intro-row>img{width:100%;height:auto;aspect-ratio:1.75;object-fit:cover;border-radius:8px}.intro-copy>p{margin:13px 0 21px;max-width:430px;line-height:1.85}.intro-details summary{list-style:none;width:fit-content}.intro-details summary::-webkit-details-marker{display:none}.intro-details[open] summary span{transform:rotate(90deg)}.intro-details>div{padding-top:18px;font-size:16px;line-height:1.9}.intro-details h4{font-size:20px;margin-bottom:8px}.course-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.course-card{display:grid;grid-template-columns:48% 52%;align-items:center;min-height:246px;background:var(--pink);border-radius:12px;text-decoration:none;overflow:hidden;padding:12px 20px 12px 0;transition:transform .2s}.course-card:hover{transform:translateY(-3px)}.course-card.advanced{background:var(--sage)}.course-card img{width:100%;height:224px;object-fit:contain}.course-card>div{height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:25px 0 22px 12px;min-width:0}.course-card h3{font-size:30px}.course-card span{font-size:16px;font-weight:650;color:var(--ink);text-decoration:underline;text-underline-offset:5px}.course-card b{font-size:23px;margin-left:9px;font-weight:400}.courses{padding-bottom:42px}.study{background:var(--green);color:#fffdf1}.study-inner{display:flex;align-items:center;gap:28px;padding-block:32px}.study svg{width:110px;height:100px;flex-shrink:0}.study h2{color:#fffdf1;margin-bottom:8px;font-size:36px}.study p{font-size:20px}.study .button{margin-left:auto;flex-shrink:0}.cream{background:#faf8e9;color:var(--ink);border-color:#faf8e9;padding:15px 27px}.cream:hover{background:#ebe8d5}.faq{padding-bottom:22px}.faq details{border-bottom:1px solid var(--line)}.faq details:first-of-type{border-top:1px solid var(--line)}.faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:16px 8px;font-size:18px}.faq summary::-webkit-details-marker{display:none}.faq summary span{font-size:24px;line-height:1}.faq details[open] summary span{transform:rotate(45deg)}.faq details p{padding:0 34px 20px 8px;max-width:940px;line-height:1.9}.faq details a{white-space:nowrap;color:var(--ink);font-weight:600}.contact{display:flex;align-items:center;justify-content:space-between;gap:28px;padding-block:26px 38px}.contact h2{font-size:26px;margin:0}.contact p{font-size:14px}.contact>div a{font-size:17px;overflow-wrap:anywhere;text-underline-offset:4px}.contact .button{flex-shrink:0}footer{border-top:1px solid var(--line);padding:20px 0 25px;text-align:center;font-size:13px;color:#637267}.skip-link{position:absolute;left:16px;top:-100px;background:white;padding:10px;z-index:10}.skip-link:focus{top:8px}
@media(min-width:1440px){.hero-copy{padding-left:140px}}@media(max-width:1100px){.header-inner{gap:16px;padding:18px 24px;flex-wrap:wrap}.brand{margin-right:auto}.header nav{order:3;width:100%;justify-content:center;margin:0}.languages{border:0;padding:0}.hero-copy{padding-left:32px}.hero-inner{grid-template-columns:46% 54%}.hero h1{font-size:40px}.hero-tagline{font-size:19px}.hero-local{font-size:22px}.wrap{width:calc(100% - 64px)}.intro-row{gap:24px;padding:24px}.study-inner{gap:20px;flex-wrap:wrap}.study .button{margin-left:auto}.study p{font-size:17px}.contact{flex-wrap:wrap}.course-card h3{font-size:26px}}
@media(max-width:700px){body{font-size:16px}.header-inner{padding:14px 20px 10px;gap:12px}.brand strong{font-size:21px}.brand span{font-size:13px}.languages a{padding:7px;font-size:13px}.header nav{justify-content:space-between;gap:0;overflow-x:auto}.header nav a{padding:8px;font-size:13px}.hero-inner{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:34px 24px 18px;margin:0;width:100%}.hero h1{font-size:38px}.hero-brand{font-size:17px;margin-bottom:10px}.hero-local{font-size:22px;margin-bottom:21px}.hero-tagline{font-size:19px}.hero-sub{font-size:14px;margin-bottom:23px}.hero-image{height:auto;aspect-ratio:1.5;width:100%;object-fit:contain}.actions{gap:10px}.button{font-size:14px;padding:10px 16px;gap:10px}.wrap{width:calc(100% - 40px)}h2{font-size:28px;margin-bottom:18px}h3{font-size:26px}.section{padding-top:30px}.intro-row{grid-template-columns:1fr;gap:20px;padding:24px}.intro-copy>p{margin:10px 0 17px}.intro-row>img{aspect-ratio:1.65}.course-grid{grid-template-columns:1fr;gap:16px}.course-card{min-height:190px;grid-template-columns:44% 56%;padding-right:20px}.course-card img{height:185px}.course-card>div{padding:17px 0 17px 8px}.course-card h3{font-size:26px}.course-card span{font-size:14px}.courses{padding-bottom:30px}.study-inner{display:grid;grid-template-columns:66px 1fr;gap:15px;padding-block:26px}.study svg{width:66px;height:66px}.study h2{font-size:28px}.study p{font-size:16px}.study .button{grid-column:1/-1;margin:3px 0 0;width:100%}.faq summary{font-size:16px;padding:15px 0}.faq details p{padding-left:0;font-size:15px}.contact{display:grid;gap:18px;padding-top:24px;padding-bottom:28px}.contact h2{font-size:25px}.contact .button{justify-self:start}.contact>div a{font-size:16px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*{transition:none!important}}
/* Parent pages share the same five navigation destinations in every locale. */
.header nav .nav-enquiry{background:var(--green);color:#fff;border:1px solid var(--green)}
.header nav .nav-enquiry:hover{background:#23472e}
.header nav .nav-enquiry[aria-current]{background:#23472e;color:#fff;box-shadow:inset 0 -3px 0 #dfebd5}
@media(max-width:700px){.header nav{min-width:0;justify-content:flex-start;gap:3px}.header nav a{font-size:12px;padding:8px 7px}.header nav .nav-enquiry{margin-left:auto}}
/* Photography and the school's original character cards. */
.home-photo{position:relative;margin:0;min-width:0;overflow:hidden;border-radius:8px}
.home-photo img{width:100%;height:auto;aspect-ratio:1.5;object-fit:cover}
.home-photo figcaption{position:absolute;right:10px;bottom:10px;background:rgba(255,254,250,.93);padding:3px 8px;border-radius:4px;font-size:10px;color:#526258}
.hero-inner{grid-template-columns:2fr 3fr;padding:32px 32px 32px 0;gap:24px}
.hero-copy{margin:0;padding-right:0;padding-left:40px}
.hero-photo{border-radius:12px}
.hero-photo .hero-image{height:auto;mix-blend-mode:normal;object-fit:cover;aspect-ratio:1.5}
.hero h1{font-size:clamp(34px,3.5vw,50px)}
.intro-row .home-photo img{aspect-ratio:1.75}
.course-card{padding:0;grid-template-columns:45% 55%;min-height:240px}
.course-card img{height:100%;min-height:240px;object-fit:cover}
.course-card>div{padding:24px}
.home-image-note{font-size:11px;color:#617066;text-align:right;margin-top:8px}
.character-feature{padding-block:44px}
.character-intro{display:flex;align-items:center;gap:40px;justify-content:space-between;margin-bottom:24px}
.character-intro>div{max-width:750px}
.character-kicker{color:#67775e;font-size:13px;letter-spacing:.08em;margin-bottom:5px}
.character-intro h2{margin-bottom:12px}
.character-intro h3{font-size:24px;margin-bottom:10px}
.character-intro .button{flex-shrink:0}
.character-story{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.character-story figure{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--sage)}
.character-story img{width:100%;aspect-ratio:16/9;height:auto;object-fit:contain;background:white}
.character-story figcaption{display:flex;align-items:center;gap:12px;padding:15px 18px;font-weight:600;color:var(--ink)}
.character-story figcaption span{font-size:13px;font-weight:400;color:#697660}
.character-footnote{margin-top:12px;font-size:12px;color:#68776d}
.header nav{min-width:0}
.header-inner{gap:18px}
.header nav{gap:3px}
.header nav a{padding-inline:9px}
@media(min-width:1440px){.hero-copy{padding-left:100px}}
@media(max-width:1240px){.header-inner{flex-wrap:wrap}.header nav{order:3;width:100%;margin:0;justify-content:center}.brand{margin-right:auto}.hero-inner{grid-template-columns:43fr 57fr;gap:16px;padding-right:28px}.hero-copy{padding:30px}.hero h1{font-size:36px}.hero-tagline{font-size:19px}}
@media(max-width:700px){.hero-inner{display:flex;padding:0;gap:0}.hero-copy{padding:30px 24px 24px}.hero-photo{margin:0 20px 20px}.hero h1{font-size:36px}.course-card{min-height:195px}.course-card img{min-height:195px;height:100%}.course-card>div{padding:22px 16px}.character-feature{padding-block:30px}.character-intro{display:block}.character-intro h3{font-size:22px}.character-intro .button{margin-top:20px}.character-story{grid-template-columns:1fr;gap:16px}.character-story figcaption{padding:12px 16px}.header nav{max-width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap}.header nav a{padding-inline:8px}.intro-row .home-photo img{aspect-ratio:1.5}}
@media(max-width:700px){.header nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;overflow:visible}.header nav a{text-align:center;white-space:normal;align-self:stretch;display:flex;justify-content:center;align-items:center}.header nav .nav-enquiry{margin-left:0}}
/* Confirmed circular crest sits to the left of the bilingual name. */
.header .brand{flex-direction:row;align-items:center;gap:12px}
.brand .brand-crest{width:64px;height:64px;flex:none;object-fit:contain}
.brand-text{display:flex;flex-direction:column}
.hero-visual{position:relative;min-width:0;padding-bottom:40px}
.hero-copy{align-self:start;padding-top:64px}
.hero-visual .hero-photo{margin:0}
.hero-card-tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.floating-card{display:block;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--paper);text-decoration:none;animation:card-discovery 12s ease-in-out infinite;animation-play-state:paused}
.floating-card img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.floating-card span{display:block;padding:7px 8px;font-size:12px;text-align:center;color:var(--ink);line-height:1.5}
.floating-card.card-1{animation-delay:-8s}
.floating-card.card-2{animation-delay:-4s}
.hero-visual.motion-active .floating-card{animation-play-state:running}
.hero-card-tray:hover .floating-card,.hero-card-tray:focus-within .floating-card{animation-play-state:paused}
.hero-visual .motion-toggle{position:absolute;right:0;bottom:0;padding:5px 9px;background:transparent;border:1px solid var(--line);border-radius:5px;color:var(--ink);font:inherit;font-size:11px;cursor:pointer}
.motion-toggle[hidden]{display:none}
.motion-toggle:focus-visible{outline:3px solid #b86d76;outline-offset:3px}
@keyframes card-discovery{0%,8%,34%,100%{transform:translateY(0);border-color:var(--line);box-shadow:none}12%,29%{transform:translateY(-4px);border-color:var(--green);box-shadow:0 4px 12px #315b3c15}}
.course-card{grid-template-columns:1fr;min-height:0}
.course-card img{width:100%;height:auto;min-height:0;aspect-ratio:1.5;object-fit:contain}
.course-card>div{height:auto;min-height:138px;gap:20px;padding:24px}
@media(max-width:1240px){.header-inner{padding-block:14px}.hero-inner{align-items:start}.hero-copy{padding-top:34px}}
@media(max-width:700px){.header .brand{gap:8px}.brand .brand-crest{width:46px;height:46px}.brand strong{font-size:19px}.brand span{font-size:12px}.header-inner{gap:12px}.hero-visual{width:100%;padding:0 20px 38px;margin-bottom:22px}.hero-card-tray{gap:7px;margin-top:12px}.floating-card span{font-size:10px;padding:6px 3px}.hero-visual .motion-toggle{right:20px}.course-card img{height:auto;min-height:0}.course-card>div{min-height:120px;padding:22px}}
@media(prefers-reduced-motion:reduce){.hero-visual .floating-card{animation:none!important;transform:none!important}}