:root{--blue:#02BFE3;--deep:#02BFE3;--navy:#062F3D;--orange:#E96D6F;--peach:#E96D6F;--blush:#FFFFFF;--sky:#02BFE3;--cream:#FFFFFF;--ink:#062F3D;--muted:#344F5C;--line:#D0E6EC;--white:#fff;--shadow:0 24px 70px rgba(16,60,76,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--cream);line-height:1.65}a{color:inherit}.wrap{width:min(1160px,calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{text-decoration:none;font-weight:950;letter-spacing:.08em;color:var(--deep);white-space:nowrap}.brand i{font-style:normal;color:var(--orange)}.nav-links{display:flex;gap:6px;align-items:center}.nav-links a{text-decoration:none;font-weight:800;padding:10px 13px;border-radius:999px;font-size:.9rem}.nav-links a:hover,.nav-links a.active{background:#E8F9FC;color:var(--blue)}.hero{background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.3),transparent 30%),linear-gradient(145deg,#486fbe,var(--blue) 55%,#7aa0e6);color:#fff;padding:92px 0 86px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:70px}.eyebrow,.kicker{font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;font-weight:950;color:var(--orange)}h1,h2{letter-spacing:-.045em;line-height:1.05;margin:15px 0 22px}h1{font-size:clamp(3rem,6vw,5.6rem)}h2{font-size:clamp(2.2rem,4vw,4rem)}h3{line-height:1.3}.lead{font-size:1.16rem;color:#eef3ff;max-width:650px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 24px;border:0;border-radius:15px;background:var(--orange);color:white;text-decoration:none;font-weight:900;cursor:pointer;box-shadow:0 14px 30px rgba(132,58,37,.24)}.btn.secondary{background:white;color:var(--blue);box-shadow:none}.hero-photo{position:relative}.hero-photo img{width:100%;height:570px;object-fit:cover;object-position:top;border-radius:220px 220px 30px 30px;border:12px solid rgba(255,255,255,.15);box-shadow:var(--shadow)}.tag{position:absolute;left:-32px;bottom:45px;padding:15px 18px;border-radius:18px;background:var(--navy);font-weight:850;box-shadow:var(--shadow)}section{padding:95px 0}.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}.panel{background:white;border:1px solid var(--line);border-radius:28px;padding:34px;box-shadow:var(--shadow)}.quote{font-size:clamp(1.45rem,3vw,2.2rem);font-weight:850;line-height:1.4;border-left:6px solid var(--orange);padding-left:25px;color:var(--deep)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}.card{background:white;border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:0 12px 34px rgba(38,68,126,.08);display:flex;flex-direction:column}.card .num{color:var(--orange);font-weight:950}.card p{color:var(--muted)}.card .btn{margin-top:auto;align-self:flex-start}.blue-section{background:var(--navy);color:white}.blue-section .section-copy{color:#becbe5}.course-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:42px}.course{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);border-radius:26px;padding:30px}.course p{color:#c9d5eb}.course small{color:var(--orange);font-weight:900;text-transform:uppercase;letter-spacing:.12em}.footer{background:#07142f;color:#aebbd2;padding:28px 0;text-align:center}.page-hero{padding:72px 0;background:linear-gradient(135deg,var(--blue),#789de3);color:white}.page-hero h1{font-size:clamp(2.7rem,5vw,4.8rem)}.game-wrap{padding:62px 0 100px}.game{max-width:820px;margin:auto;background:white;border-radius:30px;padding:38px;box-shadow:var(--shadow)}.progress{height:10px;border-radius:99px;background:#e7edf8;overflow:hidden;margin:20px 0 30px}.progress span{display:block;height:100%;background:var(--orange);transition:.3s}.answers{display:grid;gap:12px}.answer{width:100%;text-align:left;border:1px solid #cfdaf0;background:#fff;color:var(--ink);border-radius:15px;padding:16px 18px;font:inherit;font-weight:750;cursor:pointer}.answer:hover{border-color:var(--blue);background:#E8F9FC}.answer.correct{background:#e6f7ed;border-color:#56a978}.answer.wrong{background:#fff0ec;border-color:var(--orange)}.game-meta{display:flex;justify-content:space-between;color:var(--muted);font-weight:800}.result{text-align:center;padding:20px 0}.result strong{font-size:4rem;color:var(--blue);display:block}.hidden{display:none}.crumbs{font-size:.9rem;margin-bottom:15px;color:#e4ebfb}.portrait-small{width:100%;height:520px;object-fit:cover;object-position:top;border-radius:30px;box-shadow:var(--shadow)}
@media(max-width:850px){.nav{min-height:68px}.nav-links{max-width:65vw;overflow-x:auto}.nav-links a{white-space:nowrap;font-size:.8rem;padding:8px 9px}.hero-grid,.split{grid-template-columns:1fr}.hero{padding-top:64px}.hero-photo{max-width:520px}.hero-photo img{height:480px}.cards{grid-template-columns:1fr}.course-grid{grid-template-columns:1fr}.tag{left:8px}section{padding:70px 0}}
@media(max-width:520px){.wrap{width:min(100% - 28px,1160px)}.brand{font-size:.78rem}.nav-links{max-width:58vw}.hero-photo img{height:420px}.game{padding:25px 18px}.panel{padding:26px}.course{padding:25px}}

/* Palette 2026: teal blue dominant, coral and peach accents */
.nav-links a:hover,.nav-links a.active{background:#E8F9FC;color:var(--blue)}
.hero{background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.28),transparent 30%),linear-gradient(145deg,#237F92,var(--blue) 55%,var(--sky))}
.lead{color:#EAF9FB}.footer{background:#0A303E;color:#B9DCE2}.page-hero{background:linear-gradient(135deg,var(--blue),var(--sky))}
.game-stage{background:#E8F9FC!important}.answer:hover{background:#E8F9FC}.progress{background:#DDEFF2}

/* Trang chủ: ảnh chân dung và block test */
.hero-photo img{object-position:center 68%}.tag{left:50%!important;bottom:20px;transform:translateX(-50%);width:max-content;padding:0;background:transparent;color:#fff;font-family:"Segoe Script","Brush Script MT",cursive;font-size:1.3rem;font-weight:500;letter-spacing:.02em;text-shadow:0 2px 10px rgba(8,43,53,.7);box-shadow:none}
.test-callout{background:linear-gradient(135deg,#E8F9FC,#FFFFFF)}.test-callout-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:58px;align-items:center}.test-callout-copy h2{margin-bottom:18px}.test-callout-copy p{max-width:620px;color:var(--muted);font-size:1.05rem;margin-bottom:26px}.test-levels{display:grid;gap:15px}.test-levels a{display:grid;grid-template-columns:62px 1fr 28px;gap:18px;align-items:center;padding:20px 22px;background:#fff;border:1px solid var(--line);border-radius:20px;text-decoration:none;box-shadow:0 14px 38px rgba(16,60,76,.1);transition:.2s ease}.test-levels a:hover{transform:translateY(-3px);border-color:var(--sky);box-shadow:0 18px 44px rgba(16,60,76,.16)}.test-levels a>span{width:56px;height:56px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(145deg,var(--blue),var(--sky));color:#fff;font-weight:950}.test-levels strong{display:block;font-size:1.05rem;color:var(--deep)}.test-levels small{display:block;color:var(--muted);margin-top:3px}.test-levels b{color:var(--orange);font-size:1.35rem}
@media(max-width:850px){.test-callout-grid{grid-template-columns:1fr;gap:32px}.tag{left:50%!important;bottom:18px}.hero-photo img{object-position:center 68%}}

/* Hồ sơ thương hiệu và chứng nhận */
.about-story{background:#fff}.about-intro{display:grid;grid-template-columns:.78fr 1.22fr;gap:64px;align-items:start}.about-portrait{position:sticky;top:28px}.about-portrait>img{width:100%;height:620px;object-fit:cover;object-position:center;border-radius:32px;box-shadow:var(--shadow)}.about-logo{position:absolute;right:-20px;bottom:-20px;width:116px;height:116px;padding:12px;border-radius:50%;background:#fff;box-shadow:0 16px 42px rgba(16,60,76,.2)}.about-logo img{width:100%;height:100%;object-fit:contain;border-radius:50%}.about-copy h2{font-size:clamp(2.15rem,4vw,3.7rem)}.about-copy p{color:var(--muted);font-size:1.02rem}.contact-link{display:inline-flex;align-items:center;gap:8px;margin-top:8px;padding:11px 16px;border-radius:999px;background:#E8F9FC;color:var(--deep);font-weight:900;text-decoration:none}.credentials{margin-top:78px;padding:38px;border:1px solid var(--line);border-radius:30px;background:linear-gradient(145deg,#F2FAFB,#FFFFFF);box-shadow:0 18px 50px rgba(16,60,76,.08)}.credentials-heading{display:flex;align-items:end;justify-content:space-between;gap:24px}.credentials-heading h2{font-size:clamp(2rem,3.5vw,3.35rem);margin-bottom:0}.credential-list{margin:34px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 22px}.credential-list li{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border-radius:15px;background:#fff;color:#38545D;font-weight:750;border:1px solid #D0E6EC}.credential-list span{color:var(--orange);font-weight:950}.credential-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}.credential-gallery figure{margin:0;background:#fff;padding:8px;border-radius:18px;box-shadow:0 12px 28px rgba(16,60,76,.1)}.credential-gallery img{width:100%;height:210px;display:block;object-fit:cover;border-radius:12px}.credential-gallery figcaption{padding:9px 6px 4px;color:var(--deep);font-weight:850;font-size:.87rem}.footer a{color:inherit;font-weight:850}
@media(max-width:900px){.about-intro{grid-template-columns:1fr}.about-portrait{position:relative;top:auto;max-width:560px}.about-portrait>img{height:560px}.credential-list{grid-template-columns:1fr}.credentials-heading{display:block}.credential-gallery{grid-template-columns:1fr 1fr}.credential-gallery figure:last-child{grid-column:1/-1}}
@media(max-width:560px){.about-portrait>img{height:460px}.about-logo{width:92px;height:92px;right:8px}.credentials{padding:25px 18px}.credential-gallery{grid-template-columns:1fr}.credential-gallery figure:last-child{grid-column:auto}.credential-gallery img{height:220px}}

/* Trang riêng Về Thủy Kathy */
.about-page{background:#fff}.about-page .about-story{padding-top:72px}.about-page .about-copy h1{font-size:clamp(2.4rem,5vw,4.6rem);margin-top:15px}.about-page .about-portrait>img{object-position:center 48%}.about-page .credentials{margin-bottom:20px}
.gallery-heading{margin-top:42px;padding-top:34px;border-top:1px solid #D0E6EC}.gallery-heading h3{margin:8px 0 0;color:var(--deep);font-size:clamp(1.45rem,2.7vw,2.15rem)}.workshop-heading{margin-top:52px}.workshop-gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}.workshop-gallery figure{margin:0;background:#fff;padding:9px;border-radius:20px;box-shadow:0 12px 28px rgba(16,60,76,.1)}.workshop-gallery img{width:100%;height:430px;display:block;object-fit:cover;border-radius:14px}.workshop-gallery .workshop-wide{grid-column:1/-1}.workshop-gallery .workshop-wide img{height:520px}.workshop-gallery figcaption{padding:10px 7px 5px;color:var(--deep);font-weight:850;font-size:.92rem}
@media(max-width:850px){.about-page .about-story{padding-top:92px}.about-page .about-copy h1{font-size:clamp(2.25rem,9vw,3.5rem)}}
@media(max-width:700px){.workshop-gallery{grid-template-columns:1fr}.workshop-gallery .workshop-wide{grid-column:auto}.workshop-gallery img,.workshop-gallery .workshop-wide img{height:auto;max-height:560px}.gallery-heading{margin-top:34px}.workshop-heading{margin-top:44px}}
/* Compact spacing — preserve content while showing more on each screen */
.nav{min-height:70px;gap:20px}.nav-links a{padding:9px 12px}.hero{padding:68px 0 64px}.hero-grid{gap:48px}section{padding:66px 0}.split{gap:48px}.panel{padding:26px}.cards{gap:18px;margin-top:28px}.card{padding:22px}.course-grid{gap:18px;margin-top:28px}.course{padding:24px}.page-hero{padding:52px 0}.game-wrap{padding:42px 0 64px}.game{padding:30px}
@media(max-width:850px){.nav{min-height:64px}.hero{padding-top:52px}section{padding:52px 0}}