@font-face{font-family:"Playfair Display";font-style:normal;font-weight:500 600;font-display:swap;src:url(../fonts/playfair-var-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:500 600;font-display:swap;src:url(../fonts/playfair-var-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:500 600;font-display:swap;src:url(../fonts/playfair-var-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:500 600;font-display:swap;src:url(../fonts/playfair-var-italic-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/bevietnam-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/bevietnam-400-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/bevietnam-500-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/bevietnam-500-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
/* Georgia thiếu glyph chữ hai dấu (ồ, ấ…) nên vỡ dấu; font dự phòng trong lúc tải web font phải hỗ trợ đủ tiếng Việt. */
:root{--bg:#120b0e;--panel:#201317;--rose:#d94e68;--rose2:#f28a9c;--wine:#9f1d22;--cream:#f7eee8;--muted:#bba8ac;--line:#493038;--serif:"Playfair Display","Times New Roman",Times,serif;--sans:"Be Vietnam Pro",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--cream);font-family:var(--sans);line-height:1.5;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,select,input{font:inherit}
img,svg{max-width:100%}
svg{fill:currentColor}
[hidden]{display:none!important}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--rose2);outline-offset:3px}

.rose-icon{display:inline-block;width:25px;height:28px;flex-shrink:0;color:var(--rose)}
.topbar{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px clamp(20px,6vw,84px);border-bottom:1px solid #ffffff1b}
.brand{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
.brand picture{display:flex}
.brand-logo{display:block;width:134px;height:20px}
.nav{display:flex;gap:28px;font-size:13px;color:#e0cfd2}
.nav a:hover{color:var(--rose2)}

.eyebrow,.section-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.28em;color:var(--rose2);font-weight:500;margin:0}
h1,h2{font-family:var(--serif);font-weight:500;font-variant-numeric:lining-nums}
h1 em,h2 em{color:var(--rose2);font-weight:500}

.btn,.cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 22px;border-radius:999px;font-weight:500;font-size:13px;transition:transform .2s,background .2s;cursor:pointer;border:0}
.btn-primary,.cta{background:var(--rose);color:#fff;box-shadow:0 10px 35px #d94e6830}
.btn-primary:hover,.cta:hover{transform:translateY(-2px);background:#eb6079}
.btn-ghost{background:transparent;color:var(--cream);border:1px solid var(--line)}

.site-footer{padding:30px 20px 40px;text-align:center;color:#9e858c;font-size:11px;letter-spacing:.08em;border-top:1px solid var(--line)}
.site-footer p{margin:0}
.footer-rose{display:block;margin:0 auto 12px;width:50px;height:56px}
.disclaimer{max-width:780px;margin:12px auto 0!important;font-size:10px;color:#8e777e;letter-spacing:.02em}

.back-to-top{position:fixed;right:18px;bottom:18px;z-index:9;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;border:1px solid #70404c;background:#1b1115e6;color:var(--rose2);cursor:pointer;box-shadow:0 10px 30px #0008;backdrop-filter:blur(6px);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s,transform .25s,visibility .25s,background .2s,border-color .2s}
.back-to-top.is-visible{opacity:1;visibility:visible;transform:none}
.back-to-top:hover{border-color:var(--rose);background:#341a23}
.back-to-top svg{width:20px;height:20px;fill:currentColor}
.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--cream);color:#29131b;border-radius:999px;padding:12px 18px;font-size:13px;box-shadow:0 12px 36px #0007;transition:.25s;z-index:10;max-width:calc(100vw - 32px);text-align:center}
.i-rose{display:inline-block;width:1.2em;height:1.35em;vertical-align:-.3em;color:#e0313f;flex-shrink:0}
.toast.show{opacity:1;transform:translate(-50%,0)}

.music-notes{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;container-type:size}
.note{position:absolute;left:var(--x);bottom:calc(var(--s) * -2);width:var(--s);height:var(--s);opacity:0;animation:note-rise var(--d) linear var(--delay) infinite;will-change:transform,opacity}
.note svg{display:block;width:100%;height:100%;fill:var(--c);animation:note-sway calc(var(--d) / 4) ease-in-out var(--delay) infinite alternate}
@keyframes note-rise{0%{transform:translateY(0);opacity:0}12%{opacity:var(--o)}80%{opacity:var(--o)}100%{transform:translateY(calc(-100cqh - var(--s) * 3));opacity:0}}
@keyframes note-sway{from{transform:translateX(calc(var(--sway) * -1)) rotate(-12deg)}to{transform:translateX(var(--sway)) rotate(12deg)}}

.page-minimal{display:grid;place-items:center;padding:24px}
.error-page{text-align:center;max-width:480px}
.error-page h1{font-size:clamp(32px,6vw,48px);margin:12px 0}
.error-page p{color:var(--muted)}
.error-rose{width:64px;height:70px;margin-bottom:16px}

@media(max-width:520px){.topbar{padding:19px 16px}.brand picture{display:none}.nav{gap:14px;font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}