:root{--bg:#08080a;--panel:#171719;--gold:#ead5a4;--muted:#a9a9af;--line:#303034}
body{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","PingFang TC","Noto Sans TC","Microsoft JhengHei",Arial,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color:#f5f5f7}
header{background:#111113eb;border-bottom:1px solid #ffffff0d;backdrop-filter:blur(20px)}nav{padding:15px 28px;max-width:1280px}.brand{font-size:20px;font-weight:600;letter-spacing:.01em}.brand i{font-size:16px}.links{font-size:13px;gap:25px}.links .button{padding:8px 17px;font-size:12px}.button{border-radius:999px;font-weight:500;padding:13px 24px;transition:background .18s,color .18s}.button:hover{background:#f3e3bf}.button.secondary{border-color:#64646a}.button.secondary:hover{background:#ffffff12}.cart-trigger{background:transparent;border-color:#ffffff29;border-radius:999px;font-size:12px;font-weight:400;padding:8px 13px}.cart-trigger span{font-size:11px}
.hero{padding:0;min-height:720px;position:relative;isolation:isolate;background:#08080a;overflow:hidden}.hero-art{position:absolute;inset:0;z-index:-3}.hero-art img{position:absolute;right:0;top:0;width:max(76%,1080px);height:100%;object-fit:cover;object-position:center 18%;display:block}.hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#08080a 0%,#08080afa 19%,#08080aeb 30%,#08080a9e 43%,#08080a26 61%,transparent 76%),linear-gradient(0deg,#08080a 0%,#08080a77 9%,transparent 30%)}.hero-content{max-width:1280px;min-height:720px;display:flex;align-items:center;padding:68px 28px 74px}.hero-copy{width:52%;max-width:580px}.hero .eyebrow{font-size:13px;letter-spacing:.17em;font-weight:500;color:#dedee3;margin:0 0 24px}.hero h1{font-size:clamp(60px,5.8vw,88px);font-weight:400;line-height:1.12;letter-spacing:.015em;margin:0 0 33px}.hero .english-name{display:block;font-size:20px;line-height:1.3;font-weight:400;letter-spacing:.035em;color:#b7b7bf;margin-top:15px}.hero-course-title{font-size:clamp(28px,2.8vw,42px);font-weight:500;line-height:1.2;letter-spacing:-.015em;color:#eadbc0;margin:0 0 21px}.hero-credential{font-size:13px;line-height:1.8;color:#b9b7be;margin:0 0 23px}.hero .lead{font-size:18px;line-height:1.65;color:#e0dfe5;margin:0;max-width:450px;letter-spacing:.005em}.hero .actions{gap:23px;align-items:center;margin:30px 0 23px}.hero-more{color:#e5d4ad;font-size:15px;font-weight:400;white-space:nowrap}.hero-more span{font-size:22px;vertical-align:-1px;margin-left:4px}.hero-more:hover{text-decoration:underline}.hero .meta{font-size:12px;color:#b2b0b7;line-height:1.7;margin:0;letter-spacing:.025em}
.strip{background:#08080a;border-top:0;border-bottom:1px solid #ffffff12;padding:23px 0}.strip .wrap{font-size:12px;letter-spacing:.05em;color:#898990}.eyebrow{font-weight:500;letter-spacing:2px;font-size:11px}section{padding:96px 0}h2{font-size:clamp(29px,3.2vw,44px);line-height:1.35;font-weight:600;letter-spacing:-.025em}h3{font-size:21px;font-weight:600;letter-spacing:-.02em}.intro{font-size:16px;line-height:1.8}.card{background:#151517;border-color:#ffffff13;padding:30px;border-radius:20px}.card p,.advanced ul{line-height:1.8}.num{font-family:inherit;font-size:11px;letter-spacing:.1em}.course{background:#101012}.price-box{background:linear-gradient(140deg,#292620,#171719);border:1px solid #d4bb811f;border-radius:22px}.price{font-weight:600;letter-spacing:-.04em}.price small{letter-spacing:0}.tag{border-color:#ffffff26;color:#c9c9cf;font-size:12px}.teacher-photo{width:270px;height:330px;object-position:61% center;flex-shrink:0}.teacher{max-width:950px;gap:55px}.teacher-role{font-size:14px;color:#d1c2a3}.teacher h2 small{font-size:21px;font-weight:400}.contact{background:#121214;border-color:#ffffff14}.faq summary{font-size:17px;font-weight:500}.faq details{border-color:#ffffff19}.contact .fine a{text-decoration:underline;text-underline-offset:3px}dialog{background:#1c1c20;border-color:#51515b}footer{background:#08080a;color:#929299}.cart-total{font-weight:400}
@media(min-width:1600px){.hero,.hero-content{min-height:780px}.hero-art img{width:77%}.hero-shade{background:linear-gradient(90deg,#08080a 0%,#08080afa 19%,#08080ad9 31%,#08080a69 46%,transparent 68%),linear-gradient(0deg,#08080a,transparent 28%)}}
@media(max-width:1000px) and (min-width:761px){.hero-copy{width:58%}.hero-art img{right:-150px}.hero h1{font-size:64px}.hero-course-title{font-size:34px}.hero-shade{background:linear-gradient(90deg,#08080af5 0%,#08080add 33%,#08080a55 65%,transparent),linear-gradient(0deg,#08080a,transparent 28%)}}
@media(max-width:760px){nav{padding:13px 20px}.brand{font-size:17px}.links{gap:8px}.links>a.button{display:none}.hero{min-height:0}.hero-art{height:600px;bottom:auto}.hero-art img{width:100%;height:100%;object-fit:cover;object-position:60% top;right:0}.hero-shade{background:linear-gradient(0deg,#08080a 0%,#08080a 35%,#08080ae6 46%,#08080a70 57%,transparent 70%)}.hero-content{min-height:0;padding:440px 24px 48px;display:block}.hero-copy{width:100%;max-width:520px;margin:0 auto}.hero h1{font-size:56px;margin-bottom:26px}.hero .english-name{font-size:18px;margin-top:10px}.hero .eyebrow{font-size:11px;margin-bottom:17px}.hero-course-title{font-size:31px;margin-bottom:20px}.hero-credential{font-size:12px;margin-bottom:20px}.hero .lead{font-size:16px}.hero .actions{gap:20px;margin-top:25px}.hero .button{font-size:14px;padding:13px 20px}.hero-more{font-size:14px}.strip{padding:17px 0}.strip .wrap{font-size:10px;gap:10px}.strip .wrap span{width:45%}section{padding:62px 0}.teacher{gap:26px}.teacher-photo{width:100%;height:350px;object-position:61% center}.teacher{display:block}.teacher h2{margin-top:26px}.hero .meta{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}