:root{--museum-bg:#F8F7F3;--museum-text:#1A1A1A;--museum-meta:#757575;--accent:#111}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--museum-bg)}
body{font-family:Inter,Arial,sans-serif;color:var(--museum-text)}
.hero-shell{--scroll-progress:0;--masthead-opacity:1;--activity-opacity:0;--result-opacity:0;position:relative;height:340svh;isolation:isolate;background:var(--museum-bg)}
.sticky-stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate;background:var(--museum-bg)}
.paper-texture{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:20;opacity:.018;mix-blend-mode:multiply}
.fireworks-canvas{position:absolute;inset:0;z-index:4;width:100%;height:100%;pointer-events:none}
.hero-copy{position:relative;z-index:6;width:min(1152px,calc(100% - 48px));margin:0 auto;padding-top:clamp(62px,12vh,128px);text-align:center;opacity:var(--masthead-opacity);pointer-events:none}
h1{margin:0;font-family:Anton,Impact,sans-serif;font-size:clamp(2rem,7vw,6rem);font-weight:400;line-height:1.05;letter-spacing:.005em;text-transform:uppercase;white-space:nowrap}
.scroll-cue{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:20px}
.scroll-cue span{width:1px;height:40px;background:#9ca3af}.scroll-cue p{margin:0;font-size:10px;font-weight:500;line-height:1;letter-spacing:.3em;text-transform:uppercase;color:var(--museum-meta)}
.museum-card{position:absolute;z-index:7;left:clamp(6%,12vw,15%);top:55%;width:285px;max-width:24vw;padding:16px 20px;transform:translateY(-50%);border:1px solid var(--accent);border-radius:4px;background:rgba(248,247,243,.94);opacity:var(--masthead-opacity);backdrop-filter:blur(4px)}
.museum-card p,.museum-card h2{margin:0}.card-kicker{margin-bottom:12px!important;font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#55524f}.museum-card h2{font-size:18px;font-weight:700;line-height:1.25}.card-year{margin-top:12px!important;font-size:14px;font-weight:500;color:#9d9a96}
.product-stage{--prism-depth:clamp(110px,15vw,178px);position:absolute;z-index:6;left:50%;top:52%;bottom:auto;width:min(43vw,500px);aspect-ratio:1/1;transform:translate(-50%,-50%);perspective:1400px;animation:stage-in 1.25s cubic-bezier(.16,.88,.24,1) both}
.product-carousel{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(0);transform-origin:50% 55%;will-change:transform}
.product-panel{position:absolute;inset:2%;width:96%;aspect-ratio:1/1;padding:0;overflow:visible;border:0;border-radius:0;background:transparent;transform-style:preserve-3d;backface-visibility:hidden;filter:none}
.product-panel img{display:block;width:100%;height:100%;border-radius:0;object-fit:contain;filter:saturate(1.03) contrast(1.01)}
.panel-flower,.panel-blink{opacity:var(--side-opacity,0)}.panel-flower img{transform:scale(1.08);clip-path:polygon(13.2% 19.9%,13.5% 18.6%,15% 18.2%,84% 18.2%,85.5% 18.6%,86.4% 20%,86.9% 80.4%,86.5% 82.4%,84.5% 82.6%,15.2% 82.8%,13.4% 82.4%,13.1% 80.8%)}.panel-blink img{transform:scale(1.02)}
.panel-primary{transform:rotateY(0) translateZ(var(--prism-depth))}.panel-flower{transform:rotateY(120deg) translateZ(var(--prism-depth))}.panel-blink{transform:rotateY(240deg) translateZ(var(--prism-depth))}
.product-shadow{position:absolute;width:86%;height:12%;left:4%;bottom:-4%;background:rgba(26,26,26,.2);filter:blur(22px);border-radius:50%;transform:rotate(-2deg)}
.fuse{position:absolute;z-index:10;right:-6%;bottom:10%;width:22%;overflow:visible;pointer-events:none}.fuse-shadow,.fuse-cord{fill:none;stroke-linecap:round;stroke-linejoin:round}.fuse-shadow{stroke:rgba(26,26,26,.16);stroke-width:7;transform:translateY(2px);filter:blur(1.5px)}.fuse-cord{stroke:#3f4534;stroke-width:4;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}
.exhibit-caption{position:absolute;z-index:9;top:50%;width:min(360px,28vw);pointer-events:none}.caption-activity{left:clamp(28px,6vw,96px);opacity:var(--activity-opacity);transform:translateY(calc(-50% + var(--activity-shift,24px)))}.caption-result{right:clamp(28px,6vw,96px);text-align:right;opacity:var(--result-opacity);transform:translateY(calc(-50% + var(--result-shift,24px)))}.exhibit-caption p,.exhibit-caption h2{margin:0}.caption-kicker{margin-bottom:16px!important;font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase}.exhibit-caption h2{margin-bottom:22px!important;font-family:Anton,Impact,sans-serif;font-size:clamp(2.2rem,4vw,4rem);font-weight:400;line-height:1.38;text-transform:uppercase}.exhibit-caption h2 span{color:#888}.caption-copy{font-size:clamp(.92rem,1.25vw,1.08rem);font-weight:300;line-height:1.72}.caption-activity .caption-copy{padding-left:22px;border-left:1px solid #111}.caption-result .caption-copy{padding-right:22px;border-right:1px solid #111;text-align:left}.caption-result .fact-value{display:block;margin-top:12px;color:#c52b22;font-size:.72em;line-height:1.32}
.phase-label{position:absolute;z-index:8;left:50%;bottom:18px;margin:0;transform:translateX(-50%);font-size:9px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--museum-meta)}
@keyframes stage-in{from{opacity:0;transform:translate(-50%,calc(-50% + 70px)) scale(.82)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:767px){.hero-copy{width:calc(100% - 32px);padding-top:56px}h1{font-size:clamp(2rem,11vw,3.5rem)}.scroll-cue{margin-top:18px}.museum-card{left:20px;top:36%;width:240px;max-width:calc(100% - 40px);padding:13px 15px}.museum-card h2{font-size:15px}.card-kicker{font-size:10px}.product-stage{top:51%;bottom:auto;width:min(76vw,390px)}.product-panel{padding:0}.exhibit-caption{top:auto;right:16px;bottom:58px;left:16px;width:auto;padding:16px 18px;border-radius:10px;background:rgba(248,247,243,.86);backdrop-filter:blur(5px)}.caption-activity,.caption-result{transform:translateY(var(--activity-shift,18px));text-align:left}.caption-result{transform:translateY(var(--result-shift,18px))}.exhibit-caption h2{margin-bottom:14px!important;font-size:2rem;line-height:1.34}.caption-result .fact-value{line-height:1.3}.caption-copy{font-size:.9rem;line-height:1.55}.phase-label{bottom:18px;width:100%;text-align:center}}
@media(max-height:690px) and (min-width:768px){.hero-copy{padding-top:34px}h1{font-size:52px}.scroll-cue span{height:28px}.museum-card{top:57%}.product-stage{top:54%;bottom:auto;width:420px}}
@media(prefers-reduced-motion:reduce){.product-stage{animation:none}.product-carousel{transform:rotateY(0)!important}.charts-ready .bar,.charts-ready .bar-value{transition:none!important}}

.article{background:#f8f7f3}.story-section{padding:clamp(76px,10vw,140px) 24px;border-top:1px solid #d8d4cc}.story-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,680px);gap:clamp(40px,8vw,120px);width:min(1180px,100%);margin:0 auto}.section-index{font-family:Anton,Impact,sans-serif;font-size:clamp(5rem,14vw,11rem);line-height:.82;color:#e3dfd6}.section-copy h2{margin:0 0 28px;font-family:Anton,Impact,sans-serif;font-size:clamp(2.2rem,5vw,4.7rem);font-weight:400;line-height:1.02;text-transform:uppercase}.section-copy p{margin:0 0 1.2em;font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.8}.lead-section{padding-top:clamp(96px,13vw,176px)}.article-title{width:min(1050px,100%);margin:0 auto 64px;font-family:Anton,Impact,sans-serif;font-size:clamp(3rem,7.5vw,7.2rem);font-weight:400;line-height:.98;text-transform:uppercase}.intro-copy{width:min(760px,100%);margin:0 auto}.intro-copy p{font-size:clamp(1.05rem,1.65vw,1.35rem);line-height:1.75}.data-block{width:min(1180px,calc(100% - 48px));margin:80px auto 0;padding:clamp(24px,4vw,52px);border:1px solid #cfcac1;border-radius:14px;background:#fff}.chart-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:36px}.chart-head h3{margin:0;font-family:Anton,Impact,sans-serif;font-size:clamp(2rem,4vw,4rem);font-weight:400;text-transform:uppercase}.tabs{display:flex;gap:4px;padding:4px;border-radius:999px;background:#efede8}.tab{appearance:none;border:0;border-radius:999px;padding:10px 17px;background:transparent;color:#666;font:600 11px/1 Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}.tab[aria-selected="true"]{background:#171717;color:#fff}.chart-panel{display:none}.chart-panel.is-active{display:block}.bars{display:grid;grid-template-columns:repeat(6,1fr);align-items:end;gap:clamp(10px,2.5vw,34px);height:320px;padding-top:28px;border-bottom:1px solid #bbb}.bar-item{display:flex;height:100%;flex-direction:column;justify-content:end;align-items:center;gap:10px;text-align:center}.bar-value{font-size:12px;font-weight:700}.bar{width:min(64px,72%);height:calc(var(--v)*1%);min-height:4px;border-radius:6px 6px 0 0;background:linear-gradient(180deg,#e43b2f,#a91616)}.bar-year{padding-top:2px;font-size:11px;color:#6b6863}.line-chart{width:100%;height:auto;overflow:visible}.line-chart .grid{stroke:#ddd8cf;stroke-width:1}.line-chart .trend{fill:none;stroke:#7146c7;stroke-width:4}.line-chart .dot{fill:#fff;stroke:#7146c7;stroke-width:4}.line-chart text{font:12px Inter,sans-serif;fill:#57534e}.chart-note{margin:22px 0 0;font-size:12px;color:#77736d}.timeline{position:relative;width:min(980px,calc(100% - 48px));margin:70px auto 0}.timeline:before{content:"";position:absolute;left:120px;top:12px;bottom:12px;width:1px;background:#beb8ae}.milestone{position:relative;display:grid;grid-template-columns:90px 1fr;gap:60px;padding:0 0 64px}.milestone:last-child{padding-bottom:0}.milestone:before{content:"";position:absolute;left:114px;top:9px;width:13px;height:13px;border:3px solid #f8f7f3;border-radius:50%;background:#d42b22;box-shadow:0 0 0 1px #d42b22}.milestone time{font-family:Anton,Impact,sans-serif;font-size:26px;line-height:1}.milestone h3{margin:0 0 10px;font-size:clamp(1.25rem,2vw,1.75rem)}.milestone p{margin:0;font-size:1rem;line-height:1.7;color:#4d4a46}.story-footer{padding:80px 24px;text-align:center;border-top:1px solid #d8d4cc}.story-footer p{margin:0;font:400 clamp(2rem,6vw,5rem)/1 Anton,Impact,sans-serif;text-transform:uppercase}
/* Editorial museum layout, đồng bộ với mẫu docnhatvonhi */
.article{position:relative;z-index:30;box-shadow:0 -20px 40px rgba(244,247,248,1)}
.story-section{padding:96px 24px;border-top:0}
.story-section+.story-section{padding-top:42px}
.story-grid{display:block;width:min(672px,100%);margin:0 auto}
.section-index{margin:0 0 12px 1px;font-family:Inter,Arial,sans-serif;font-size:11px;font-weight:500;line-height:1;letter-spacing:.2em;color:#757575}
.section-copy h2{margin:0 0 32px;padding-left:24px;border-left:1px solid #111;color:#c52b22;font-family:Anton,Impact,sans-serif;font-size:clamp(1.75rem,3vw,2.6rem);font-weight:400;line-height:1.4;letter-spacing:-.01em;text-transform:uppercase}
.section-copy p{margin:0 0 1.4em;font-size:clamp(1rem,1.35vw,1.125rem);font-weight:300;line-height:1.75}
.lead-section{padding-top:120px}
.article-title{width:min(1760px,calc(100% - 64px));margin:0 auto 56px;font-size:clamp(2rem,2.8vw,3.25rem);line-height:1.32;text-align:center}.article-title span{display:block}
.intro-copy{width:min(672px,100%)}
.intro-copy:before{content:'DOANH NGHIỆP “ĐỘC NHẤT VÔ NHỊ”';display:block;margin-bottom:24px;font-size:11px;font-weight:500;letter-spacing:.2em;text-align:center;color:#757575}
.intro-copy p,.section-copy p,.milestone p{font-size:clamp(1rem,1.35vw,1.125rem);font-weight:300;line-height:1.75;text-align:justify;text-justify:inter-word}
.data-block{width:min(760px,calc(100% - 48px));margin:64px auto 0;padding:32px;border-color:#e0e0dc;border-radius:10px}
.chart-head h3{font-size:clamp(1.3rem,1.8vw,1.75rem);line-height:1.2;letter-spacing:.015em}
.charts-ready .bar{transform:scaleY(0);transform-origin:center bottom}.charts-ready .bar-value{opacity:0;transform:translateY(8px)}#revenue-chart.animate-bars .bar{transform:scaleY(1);transition:transform .9s cubic-bezier(.2,.75,.25,1)}#revenue-chart.animate-bars .bar-value{opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease}.bar-item:nth-child(1) .bar,.bar-item:nth-child(1) .bar-value{transition-delay:.04s!important}.bar-item:nth-child(2) .bar,.bar-item:nth-child(2) .bar-value{transition-delay:.14s!important}.bar-item:nth-child(3) .bar,.bar-item:nth-child(3) .bar-value{transition-delay:.24s!important}.bar-item:nth-child(4) .bar,.bar-item:nth-child(4) .bar-value{transition-delay:.34s!important}.bar-item:nth-child(5) .bar,.bar-item:nth-child(5) .bar-value{transition-delay:.44s!important}.bar-item:nth-child(6) .bar,.bar-item:nth-child(6) .bar-value{transition-delay:.54s!important}.line-chart .trend{stroke-linecap:round;stroke-linejoin:round}.line-chart .point-label{font-size:20px;font-weight:700;fill:#262626}.charts-ready #profit-chart .trend,.charts-ready #profit-chart .dot,.charts-ready #profit-chart .point-label{opacity:0}
.timeline{width:min(672px,calc(100% - 48px));margin-top:56px}
.story-footer{padding:90px 24px}.story-footer p{font:400 15px/1.5 Inter,Arial,sans-serif;letter-spacing:.02em;text-transform:none}
.story-footer .source-credit{margin-top:8px;font-size:13px;color:#757575}.source-credit a{color:inherit;text-decoration:underline;text-underline-offset:3px}.source-credit a:hover{color:#1a1a1a}
@media(min-width:761px){.article-title span{white-space:nowrap}}
@media(max-width:760px){.story-grid{display:block}.section-copy h2{padding-left:18px;font-size:1.65rem}.article-title{width:100%;margin-bottom:42px;font-size:clamp(1.9rem,9vw,2.7rem);line-height:1.3}.chart-head{align-items:flex-start;flex-direction:column}.data-block{width:calc(100% - 28px);padding:20px 14px}.bars{height:250px;gap:6px}.bar-value{font-size:9px}.bar-year{font-size:10px}.timeline{width:calc(100% - 32px)}.timeline:before{left:25px}.milestone{grid-template-columns:50px 1fr;gap:24px;padding-bottom:46px}.milestone:before{left:19px}.milestone time{font-size:20px}.story-section{padding:72px 18px}.story-section+.story-section{padding-top:28px}}