/* The Vape Corner V6 - smoke-based visual treatment.
   Source texture adapted from customer's screenshot of their original website.
   The logo remains the exact official image; no changes applied. */
:root{--bg:#070b06;--max:1230px}
html{background:#0c1905}
body{
 background-color:#102507;
 background-image:linear-gradient(90deg,rgba(8,24,1,.12),rgba(4,12,2,.05) 52%,rgba(7,18,0,.12)),url("legacy-green-smoke.webp");
 background-size:cover;
 background-repeat:no-repeat;
 background-position:center center;
 background-attachment:fixed;
}
.site-frame{
 width:min(1230px,100%);
 min-height:100svh;
 margin:0 auto;
 isolation:isolate;
 background:#070b07;
 box-shadow:0 0 0 1px rgba(5,15,1,.9),0 0 64px 20px rgba(0,0,0,.5);
}
.site-frame .wrap{width:min(1120px,calc(100% - 88px))}
.site-frame .header{background:rgba(4,8,4,.96)}
.site-frame .hero{
 background-color:#090f07;
 background-image:
 linear-gradient(90deg,rgba(5,10,5,.87) 0%,rgba(7,12,6,.69) 29%,rgba(7,13,5,.37) 62%,rgba(5,10,4,.28) 100%),
 url('legacy-green-smoke.webp');
 background-size:cover,cover;
 background-position:center,center 47%;
 background-repeat:no-repeat;
}
/* Lose the synthetic glow; bring back actual swirling green smoke detail. */
.site-frame .hero:before{
 background:linear-gradient(90deg,rgba(2,8,2,.16) 0%,transparent 55%,rgba(1,7,1,.16) 100%);
}
.site-frame .hero:after{opacity:.36}
.site-frame .hero-noise{opacity:.05}
.site-frame .hero-planet{opacity:.14}
.site-frame .hero h1{text-shadow:0 3px 25px rgba(0,0,0,.35)}
.site-frame .hero-desc{color:#d3ddcf;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.site-frame .hero-inner{grid-template-columns:1.12fr .88fr;min-height:665px}
.site-frame .hero-left{padding-right:6px}
.site-frame .hero h1{font-size:clamp(53px,5.6vw,85px)}
.site-frame .hero-right{height:545px}
.site-frame .glass-plate{width:clamp(290px,30vw,423px);height:clamp(360px,34vw,440px)}
.site-frame .hero-bottom{background:rgba(2,7,2,.76)}
.site-frame .subhero{
 background-image:linear-gradient(90deg,rgba(6,12,5,.85),rgba(6,12,5,.45)),url('legacy-green-smoke.webp');
 background-size:cover,cover;
 background-position:center,center;
}
.site-frame .story-section{background:#0b100a}
.site-frame .footer{background:#080b08}
/* Enhance the smoke framing between sections with a genuine texture band. */
.site-frame .marquee{position:relative;z-index:3}
@media(min-width:1231px){.site-frame .hero h1{font-size:85px}}
@media(max-width:920px){
 .site-frame .wrap{width:calc(100% - 54px)}
 .site-frame .hero-inner{grid-template-columns:1fr;min-height:unset}
 .site-frame .hero h1{font-size:clamp(60px,9.5vw,94px)}
 .site-frame .hero-right{height:450px}
 .site-frame .glass-plate{width:clamp(290px,46vw,440px);height:360px}
 .site-frame .hero{background-position:center,58% 50%}
}
@media(max-width:560px){
 .site-frame .wrap{width:calc(100% - 36px)}
 .site-frame .hero h1{font-size:clamp(44px,10.6vw,66px)}
 .site-frame .hero-right{height:365px}
 .site-frame .glass-plate{width:min(76%,310px);height:310px}
 .site-frame .hero{background-image:linear-gradient(90deg,rgba(4,10,4,.8),rgba(6,13,6,.48)),url('legacy-green-smoke.webp');background-position:center,60% center}
}
@media(prefers-reduced-motion:reduce){body{background-attachment:scroll}}
