/* Art direction corrected against HÀNH TRÌNH.pdf. Keep semantic content live. */
:root{--gold:#d1ab6c;--red:#af3029;--header:10svh}
.header{height:var(--header);min-height:64px;max-height:90px;padding:0 1.2%;background:#07090d80;backdrop-filter:blur(3px);border-color:#b6a58633}
.brand{font-family:Georgia,'Times New Roman',serif;font-size:clamp(20px,1.7vw,28px);letter-spacing:-.035em;font-weight:700;color:#a63229;text-shadow:.5px .5px 0 #dfbd8b,-.5px -.5px 0 #dfbd8b;position:relative;padding-right:3.5vw;white-space:nowrap}
.brand:after{content:'';position:absolute;right:0;top:0;height:100%;width:1px;background:#d4bd8f25}
.brand span{font:500 clamp(8px,.75vw,12px)/1.1 'Be Vietnam Pro',sans-serif;letter-spacing:0;color:#d1ab6c;text-shadow:none;margin-top:2px}
.nav{margin-left:4.5vw;margin-right:auto;gap:2.8vw;font-size:clamp(9px,.85vw,12px);font-weight:500}
.nav a{color:#c9a363}.nav a:hover,.nav a[aria-current]{color:#f4d7a3}.nav a[aria-current]:after{background:#ab322a;bottom:-12px;width:100%}
.nav-cta{padding:0;border:0}.menu-toggle{margin-left:auto}
.story-stage{background:#080a0d}.story-bg{background:#080a0d!important}.opening-photo{opacity:1;object-position:center;filter:blur(1.2px) brightness(.9)}
.bg-code{display:none}.portrait{right:9%;bottom:0;width:85vw;height:82svh;max-width:none;object-fit:contain;object-position:right bottom;filter:none;mask-image:none;z-index:-2}
.portrait.hidden{opacity:0;transform:none}.stage-shade{background:linear-gradient(90deg,#030508a8 0%,#03050865 35%,transparent 68%),linear-gradient(0deg,#03050870,transparent 22%);z-index:-1}
.hero-emblem{position:absolute;left:12%;top:10.3%;width:24vw;height:auto;max-height:21svh;object-fit:contain;object-position:center;z-index:1;pointer-events:none}
.story-copy{left:12.8%;top:34.6%;width:29%;max-width:520px}
.story-copy h1.hero-title,.story-stage[data-scene="5"] .story-copy h1.hero-title{font-size:clamp(64px,6.3vw,120px);font-weight:800;letter-spacing:-.035em;line-height:.99;margin:0;text-wrap:nowrap;overflow:visible}
.hero-title span{display:block;width:max-content;transform:scaleX(1.1);transform-origin:left}.hero-title span:first-child{color:#cfaa68}.hero-title span:last-child{color:#ad2d27;-webkit-text-stroke:.6px #d1a261;text-shadow:0 2px 8px #0005;margin-top:.045em}
.story-quote{margin-top:22px;font-size:clamp(13px,1.28vw,21px);font-weight:600;line-height:1.25;color:#e9c58c;letter-spacing:.005em;max-width:26.5vw}
.startup-caption{display:flex;flex-direction:column;margin-top:36px;font-size:clamp(9px,1vw,15px);line-height:1.16;color:#d7b378}.startup-caption strong{font-weight:700}.startup-caption span{font-size:.9em;font-weight:400}
.story-project{margin-top:22px;gap:8px;flex-wrap:wrap}.story-project .eyebrow{font-size:8px;letter-spacing:.1em}.story-project .eyebrow:before{display:none}.story-project .project-title{font-size:9px;letter-spacing:.05em}.story-copy .location{font-size:9px;margin-top:7px}.story-copy .text-link{font-size:10px;margin-top:8px;padding:5px 0;gap:12px}
.story-stage[data-opening="true"] .story-project,.story-stage[data-opening="true"] .location,.story-stage[data-opening="true"] .story-case{display:none}
.hero-right-rule{position:absolute;right:2.55%;top:29%;height:45%;width:1px;background:#c4a36e}.hero-right-rule span{position:absolute;top:-38px;left:-7px;color:#d3ad72;font-size:23px}
.scene-counter{right:2.8%;bottom:12.4%;gap:8px;align-items:center}.scene-counter strong{font-size:clamp(45px,4.4vw,85px);color:#d2ad70;line-height:1;font-weight:400}.scene-counter .chapter-side-label{writing-mode:vertical-rl;font-size:clamp(11px,1.4vw,22px);line-height:1;font-weight:600;letter-spacing:.045em;padding:0;max-height:160px;overflow:hidden}
.scroll-instruction{left:50%;bottom:4.4%;transform:translateX(-50%);white-space:nowrap;justify-content:center;font-size:clamp(9px,1.08vw,16px);font-weight:700;letter-spacing:0;color:#d6b274}.scroll-instruction:before{display:none}
.hero-roles{position:absolute;right:4.6%;bottom:4.3%;color:#d7b780;font-size:clamp(8px,1vw,15px);font-weight:400;letter-spacing:.025em}
.chapter-rail{left:3.3%;right:auto;top:31%;gap:10px}.chapter-rail a{width:5px;height:5px;background:#cfccbc70}.chapter-rail a.active{height:18svh;max-height:170px;min-height:60px;width:5px;border-radius:5px;background:linear-gradient(#e0c48b 0 42%,#b13930 42% 100%)}
.draft-tag{left:auto;right:12px;bottom:8px;font-size:6px;border:0;background:#08090b55;opacity:.65;padding:2px 5px;letter-spacing:.03em}
.intro-control{left:50%;right:auto;bottom:9%;transform:translateX(-50%);font-size:9px;background:#050709aa;padding:7px 12px;border:1px solid #cba26b44}
.empty-chair{right:14%;width:30%;height:62%;bottom:4%}
.page-intro h1,.case-title-row h1{font-weight:600}.page-intro h1 em{color:#b84537}.footer{border-color:#cba26b33}
@media(min-aspect-ratio:19/10){.story-copy{top:33%;width:31%}.story-copy h1.hero-title,.story-stage[data-scene="5"] .story-copy h1.hero-title{font-size:11svh}.story-quote{font-size:2.25svh}.startup-caption{margin-top:4svh;font-size:1.9svh}.hero-emblem{height:21svh}.story-project{margin-top:14px}.portrait{right:11%;height:83svh}}
@media(max-width:1050px) and (min-width:768px){.nav{gap:2vw;margin-left:3vw;font-size:9px}.brand{font-size:25px;padding-right:2vw}.story-copy{width:33%;left:10.5%}.story-copy h1.hero-title,.story-stage[data-scene="5"] .story-copy h1.hero-title{font-size:6.8vw}.portrait{right:6%;height:80svh}.hero-emblem{left:9%;width:26vw}.hero-roles{font-size:8px}.startup-caption{margin-top:25px}}
@media(max-width:767px){:root{--header:72px}.header{height:72px;min-height:72px;padding:0 5%}.brand{font-size:25px;padding:0}.brand span{font-size:9px}.brand:after{display:none}.menu-toggle{display:block;color:#d1ad74}.nav{margin:0;gap:24px;top:72px;background:#080a0df8;padding:28px 7%;font-size:12px}.nav a[aria-current]:after{display:none}.hero-emblem{left:7%;top:10.6%;width:44vw;max-height:17svh}.story-copy{top:29%;left:8.2%;width:67%;max-width:380px}.story-copy h1.hero-title,.story-stage[data-scene="5"] .story-copy h1.hero-title{font-size:clamp(49px,14vw,76px);line-height:1.01;letter-spacing:-.045em}.story-quote{font-size:clamp(12px,3.55vw,17px);line-height:1.3;margin-top:17px;max-width:97%;text-shadow:0 2px 5px #000}.startup-caption{font-size:9px;margin-top:22px}.portrait{height:49svh;width:155vw;max-width:none;right:4%;bottom:0;opacity:1;object-fit:contain;object-position:right bottom}.opening-photo{object-position:58% center;opacity:1}.stage-shade{background:linear-gradient(180deg,#03050830 0%,#03050850 35%,transparent 70%,#03050855 100%),linear-gradient(90deg,#03050850,transparent 80%)}.hero-right-rule{display:none}.hero-roles{font-size:6px;right:6%;bottom:2.7%;max-width:50%;text-align:right}.scroll-instruction{left:7%;transform:none;bottom:3%;font-size:8px;justify-content:start;max-width:45%;white-space:normal}.chapter-rail{left:3%;top:30%;gap:7px}.chapter-rail a{width:3px;height:3px}.chapter-rail a.active{width:3px;height:12svh;min-height:45px}.scene-counter{right:4%;bottom:9%;gap:5px}.scene-counter strong{font-size:43px}.scene-counter .chapter-side-label{font-size:11px;max-height:100px}.intro-control{bottom:6%;font-size:7px;left:35%}.empty-chair{width:48%;right:13%;height:43%;bottom:3%}.story-project{margin-top:12px}.story-project .project-title{font-size:8px}.story-project .eyebrow{font-size:7px}.story-copy .location{font-size:8px;max-width:80%}.story-copy .text-link{font-size:9px;position:relative;z-index:5}.draft-tag{bottom:1px;right:4px;font-size:5px}.story-stage[data-opening="false"] .startup-caption{display:none}}
@media(max-width:767px) and (max-height:740px){.hero-emblem{top:11%;max-height:15svh}.story-copy{top:29%}.story-copy h1.hero-title,.story-stage[data-scene="5"] .story-copy h1.hero-title{font-size:12vw}.story-quote{font-size:3.1vw;margin-top:12px}.startup-caption{margin-top:15px}.portrait{height:47svh}}
@media(prefers-reduced-motion:reduce){.portrait{transform:none!important}.chapter-rail{display:none}.contact-portrait-wrap{transform:none!important}}

@media(prefers-reduced-motion:reduce){.story-stage[data-opening="true"] .story-project{display:flex}.story-stage[data-opening="true"] .location{display:block}.story-stage[data-opening="true"] .story-case{display:inline-flex}}
