.hero-final{background:#080c0c}
.hero-final .hero-fire-video{object-position:center 67%;filter:brightness(.72) contrast(1.28) saturate(.68)}
.hero-final .hero-video-shade{z-index:1;background:linear-gradient(90deg,rgba(4,11,11,.25),rgba(4,11,11,.15)),linear-gradient(180deg,rgba(3,7,8,.08),transparent 48%,rgba(3,7,8,.3))}
.hero-steam-video{position:absolute;z-index:2;top:-8%;left:14%;width:74%;height:102%;object-fit:cover;object-position:center 53%;pointer-events:none;mix-blend-mode:screen;filter:grayscale(1) brightness(1.48) blur(5px);mask-image:linear-gradient(to bottom,transparent 3%,#000 22%,#000 53%,transparent 68%);opacity:.7}
.steam-layer-one{transform:scaleX(-1) translateX(-5%);animation:steam-drift-one 13s ease-in-out infinite alternate}
.steam-layer-two{left:26%;top:-17%;width:59%;opacity:.5;filter:grayscale(1) brightness(1.5) blur(9px);animation:steam-drift-two 16s ease-in-out infinite alternate}
@keyframes steam-drift-one{to{transform:scaleX(-1) translateX(5%) scale(1.07)}}
@keyframes steam-drift-two{to{transform:translateX(-8%) scale(1.06)}}
.frame-pair{position:absolute;z-index:4;inset:80px 5.5% 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(32px,3.7vw,56px);max-width:940px;margin:auto}
.story-frame{position:relative;height:clamp(340px,29vw,370px);padding:clamp(28px,2.8vw,38px);display:flex;flex-direction:column;justify-content:center;overflow:hidden;color:#fff5e6;border:2px solid transparent;border-radius:26px;background:transparent;box-shadow:0 25px 70px rgba(0,0,0,.35);backdrop-filter:none}
.story-frame:before{content:"";position:absolute;inset:11px;border:1px solid rgba(232,186,121,.44);border-radius:18px;pointer-events:none}
.story-frame:after{content:"";position:absolute;inset:0;border-radius:24px;padding:2px;background:linear-gradient(135deg,#f5cf99,#9d5231,#e8b780);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.frame-corner{display:none}
.frame-corner.tl{top:17px;left:17px;border-width:2px 0 0 2px}.frame-corner.tr{top:17px;right:17px;border-width:2px 2px 0 0}.frame-corner.bl{bottom:17px;left:17px;border-width:0 0 2px 2px}.frame-corner.br{bottom:17px;right:17px;border-width:0 2px 2px 0}
.frame-label{position:relative;z-index:1;display:block;color:#e7b877;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
.years-frame{text-align:center;align-items:center;animation:frame-from-left 1.25s cubic-bezier(.16,1,.3,1) both}
.years-mark{font-family:'Noto Serif KR',serif;font-size:clamp(130px,12vw,185px);font-weight:700;line-height:1;letter-spacing:-.11em;color:#f8e7c9;text-shadow:0 7px 28px rgba(0,0,0,.55),0 0 22px rgba(233,149,60,.25);margin:16px 0 12px}
.years-mark small{font-size:.29em;letter-spacing:-.05em;color:#eab679;margin-left:.12em}
.years-frame p{margin:0;color:#f3ddbd;font-size:clamp(16px,1.6vw,23px);font-weight:600;letter-spacing:-.03em}
.detail-frame{animation:frame-from-right 1.25s .45s cubic-bezier(.16,1,.3,1) both}
.detail-frame h1{position:relative;z-index:1;margin:16px 0 14px;font-size:clamp(33px,2.7vw,45px);line-height:1.3;letter-spacing:-.055em;color:#fff4df;text-shadow:0 3px 18px rgba(0,0,0,.62)}
.detail-frame p{position:relative;z-index:1;margin:0;color:#e9d7bd;font-size:clamp(17px,1.55vw,23px);line-height:1.6}
.detail-frame p strong{color:#f3bf78;font-weight:700}
.years-frame{background:rgba(30,11,5,.1);box-shadow:0 25px 70px rgba(0,0,0,.35),0 7px 24px rgba(166,79,40,.16)}
.years-frame:before{border:1px solid rgba(246,209,163,.6)}
.years-frame .frame-corner{border-color:#f2cf9e;filter:drop-shadow(0 0 6px rgba(223,131,58,.5))}
.years-frame:after{background:linear-gradient(135deg,#f5cf99 0%,#9d5231 42%,#e8b780 72%,#824126 100%)}
.detail-frame{background:rgba(3,22,20,.1);box-shadow:0 25px 70px rgba(0,0,0,.35),0 7px 24px rgba(73,154,136,.16)}
.detail-frame:before{border:1px solid rgba(218,239,223,.6)}
.detail-frame .frame-corner{border-color:#d4eadb;filter:drop-shadow(0 0 6px rgba(91,176,150,.42))}
.detail-frame:after{background:linear-gradient(135deg,#d9e9d7 0%,#5e9188 42%,#d0e4d5 72%,#386b62 100%)}
.detail-frame .frame-label{color:#b9d4c5}
.detail-frame p strong{color:#c9e0c5}
.hero-final .story-frame{border:0;border-radius:0;overflow:visible;background:rgba(5,9,9,.08);box-shadow:none}
.hero-final .story-frame:before,.hero-final .story-frame:after{display:none}
.ornate-border{position:absolute;z-index:2;inset:0;width:100%;height:100%;pointer-events:none;user-select:none}
@keyframes frame-from-left{0%{opacity:0;transform:translate3d(-160px,-28px,0) rotate(-4deg) scale(.92)}72%{opacity:1;transform:translate3d(9px,0,0) rotate(.5deg) scale(1.01)}100%{opacity:1;transform:none}}
@keyframes frame-from-right{0%{opacity:0;transform:translate3d(160px,36px,0) rotate(4deg) scale(.92)}72%{opacity:1;transform:translate3d(-9px,0,0) rotate(-.5deg) scale(1.01)}100%{opacity:1;transform:none}}
@media(max-width:900px){.frame-pair{inset:68px 4% 0;gap:18px}.story-frame{height:clamp(300px,40vw,350px);padding:30px 26px}.years-mark{font-size:clamp(105px,16vw,160px)}.detail-frame h1{font-size:clamp(27px,3.5vw,36px)}.detail-frame p{font-size:15px}}
@media(max-width:650px){.hero-final{min-height:max(780px,108svh)}.frame-pair{inset:125px 9% 60px;display:flex;flex-direction:column;justify-content:center;gap:18px}.story-frame{width:100%;height:260px;min-height:0;flex:none;padding:22px 30px}.frame-label{font-size:10px;letter-spacing:.13em}.years-mark{font-size:clamp(94px,27vw,150px);margin:8px 0}.years-frame p{font-size:15px}.detail-frame h1{font-size:clamp(29px,7vw,40px);margin:10px 0}.detail-frame p{font-size:14px}.frame-corner{width:18px;height:18px}.frame-corner.tl{top:15px;left:15px}.frame-corner.tr{top:15px;right:15px}.frame-corner.bl{bottom:15px;left:15px}.frame-corner.br{bottom:15px;right:15px}}
@media(prefers-reduced-motion:reduce){.years-frame,.detail-frame{animation:none}}

/* Quiet, cinematic opening: boiling footage stays visible around one central message. */
.hero-final{display:grid;place-items:center;isolation:isolate}
.hero-cinematic{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;text-align:center;width:min(92%,820px);padding:128px 18px 98px;color:#f9f6ee;text-shadow:0 4px 24px rgba(0,0,0,.7)}
.hero-cinematic-kicker{display:block;font-size:clamp(14px,1.1vw,18px);font-weight:600;letter-spacing:.18em;color:#eee9dc;animation:cinematic-down .9s .12s both}
.hero-cinematic-number{display:flex;align-items:center;justify-content:center;gap:24px;width:100%;margin:8px 0 7px;color:#e6bd75;font-family:'Noto Serif KR',serif;font-weight:700;font-size:clamp(132px,14vw,226px);line-height:1.02;letter-spacing:-.11em;animation:cinematic-number 1.25s .32s both}
.hero-cinematic-number:before,.hero-cinematic-number:after{content:"";flex:1;max-width:170px;height:1px;background:linear-gradient(90deg,transparent,rgba(227,190,125,.8));transform-origin:right;animation:cinematic-rule 1s .9s both}
.hero-cinematic-number:after{transform:rotate(180deg);transform-origin:left}
.hero-cinematic-number>span{white-space:nowrap;margin-right:.07em}
.hero-cinematic-number small{font-size:.25em;letter-spacing:0;margin-left:.04em;color:#f0d5a9}
.hero-cinematic h1{font-size:clamp(24px,2.45vw,37px);line-height:1.4;letter-spacing:-.055em;font-weight:600;margin:0;color:#fff;animation:cinematic-up 1s .85s both}
.hero-cinematic p{font-size:clamp(15px,1.32vw,20px);line-height:1.7;letter-spacing:.01em;color:#e7e4df;margin:6px 0 0;animation:cinematic-up 1s 1.05s both}
.hero-cinematic-floor{position:absolute;z-index:3;left:6%;right:6%;bottom:8%;height:1px;background:linear-gradient(90deg,transparent,rgba(233,219,191,.65) 16%,rgba(233,219,191,.65) 84%,transparent)}
@keyframes cinematic-down{from{opacity:0;transform:translateY(-44px);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes cinematic-number{from{opacity:0;transform:translateY(34px) scale(.8);filter:blur(14px)}to{opacity:1;transform:none;filter:none}}
@keyframes cinematic-up{from{opacity:0;transform:translateY(48px);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes cinematic-rule{from{opacity:0;scale:0 1}to{opacity:1;scale:1 1}}
@media(max-width:650px){.hero-cinematic{padding:135px 9px 80px}.hero-cinematic-kicker{font-size:12px;letter-spacing:.1em}.hero-cinematic-number{gap:12px;font-size:clamp(112px,31vw,170px);margin:17px 0}.hero-cinematic-number:before,.hero-cinematic-number:after{max-width:55px}.hero-cinematic h1{font-size:clamp(23px,6.5vw,31px);max-width:18em}.hero-cinematic p{font-size:15px}.hero-cinematic-floor{bottom:7%}}
@media(prefers-reduced-motion:reduce){.hero-cinematic-kicker,.hero-cinematic-number,.hero-cinematic-number:before,.hero-cinematic-number:after,.hero-cinematic h1,.hero-cinematic p{animation:none}}

/* Lower the pot to the bottom edge while the title sits in the rising steam. */
.hero-final .hero-fire-video{transform:translateY(clamp(140px,20svh,200px));-webkit-mask-image:linear-gradient(to bottom,transparent,#000 23%,#000);mask-image:linear-gradient(to bottom,transparent,#000 23%,#000)}
.hero-final .hero-cinematic{transform:translateY(clamp(-170px,-17svh,-115px))}
@media(max-width:650px){.hero-final .hero-fire-video{transform:translateY(15svh)}.hero-final .hero-cinematic{transform:translateY(-9svh)}}