@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap');:root{--ink:#213f38;--muted:#63756e;--green:#27685a;--red:#bd574f;--cream:#fbf7ee;--line:#e5e5d9}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Be Vietnam Pro','DM Sans',sans-serif;line-height:1.65}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.top{background:#fff;border-bottom:1px solid var(--line);padding:16px max(24px,calc((100vw - 1150px)/2));display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}.brand{font-weight:800;letter-spacing:-.4px}.brand small{display:block;color:var(--muted);font-weight:500;font-size:11px}.nav{display:flex;gap:16px;font-size:13px;flex-wrap:wrap}.nav a:hover{color:var(--red)}main{max-width:1150px;margin:auto;padding:0 22px 70px}.hero{padding:68px 0 52px;display:grid;grid-template-columns:1.3fr .7fr;align-items:center;gap:28px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--red)}h1{font-size:clamp(40px,6vw,72px);line-height:1.12;letter-spacing:-3px;margin:18px 0}h2{font-size:clamp(25px,3vw,36px);letter-spacing:-1px;margin:5px 0 14px}.lead{font-size:16px;color:var(--muted);max-width:650px}.poster{background:#e4eee5;border:1px solid #cdded4;border-radius:28px;min-height:270px;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden}.poster:before{content:'ă â ê ô ơ ư đ';position:absolute;font-size:54px;letter-spacing:15px;opacity:.11;transform:rotate(-24deg);white-space:nowrap}.poster strong{font-size:75px;color:#b44f49;position:relative}.poster small{display:block;letter-spacing:4px;color:#27685a}.buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.btn{border:1px solid var(--green);background:var(--green);color:white;padding:12px 19px;border-radius:11px;font-weight:700;font-size:13px}.btn.alt{background:#fff;color:var(--green)}.section{margin-top:42px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:15px;flex-wrap:wrap}.muted{color:var(--muted);font-size:13px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:24px}.card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:22px;display:flex;flex-direction:column;min-height:224px;transition:transform .15s,box-shadow .15s}.card:hover{transform:translateY(-3px);box-shadow:0 12px 28px #244d3615}.num{font-size:12px;font-weight:800;color:var(--red)}.card h3{font-size:17px;line-height:1.4;margin:17px 0 8px}.card p{font-size:12px;color:var(--muted);margin:0}.card .go{margin-top:auto;padding-top:20px;font-size:12px;font-weight:800;color:var(--green)}.panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:25px;margin-top:20px}.lesson-header{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.note{background:#f4f7f0;border-radius:14px;padding:18px}.note strong{display:block;margin-bottom:9px}.word{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);gap:8px}.word:last-child{border:0}.word small{color:var(--muted)}.speak{border:1px solid var(--line);background:white;border-radius:9px;padding:5px 11px}.choice{display:block;width:100%;text-align:left;background:white;border:1px solid var(--line);border-radius:10px;padding:11px;margin:8px 0}.choice.selected{border-color:var(--green);background:#edf5f0}.filter{width:100%;padding:13px;border:1px solid var(--line);border-radius:11px;background:white}.toolbar{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.toolbar>*{flex:1;min-width:190px}.proverb{min-height:245px}.proverb h3{font-size:17px}.pill{font-size:11px;font-weight:700;color:#a44c46;background:#fae9e4;padding:5px 10px;border-radius:20px;align-self:start}.explain{background:#fff;border:1px solid var(--line);padding:22px;border-radius:18px;margin-top:15px}.hidden{display:none!important}footer{border-top:1px solid var(--line);padding:22px;text-align:center;color:var(--muted);font-size:12px}@media(max-width:900px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr}.poster{min-height:190px}}@media(max-width:520px){.cards,.two{grid-template-columns:1fr}.hero{padding:38px 0 18px}h1{letter-spacing:-1.5px}.card{min-height:170px}}