/* Created: 2026-09-21 | Task: Namaste mobile landing redesign | Purpose: Responsive poster layout with undistorted product screenshots. */
:root{color-scheme:dark;font-family:"Nirmala UI","Noto Sans Devanagari",Arial,sans-serif;background:#090303;color:#fff4cd;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
html,body{margin:0;min-width:280px}
body{background:radial-gradient(ellipse at center,#3b0e14 0,#090303 75%)}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button{font:inherit}
.poster{width:min(100%,480px);margin:0 auto;position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 64%,#541019 0,transparent 45%),#100303;box-shadow:0 0 90px #000b}
.poster::after{position:absolute;inset:50% 0 10%;z-index:-1;content:"";background-image:radial-gradient(#d3813130 .8px,transparent 1px);background-size:5px 5px;mask-image:linear-gradient(transparent,#000,transparent)}
.hero{position:relative;aspect-ratio:1 / 1.08;overflow:hidden}
.hero-art{position:absolute;inset:0;width:100%;height:auto}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0002,transparent 20%,transparent 62%,#17040499 84%,#140304 100%);pointer-events:none}
.top-brand{position:absolute;z-index:1;top:6.2%;left:5%;display:flex;align-items:center;gap:6px;font-family:Georgia,serif;font-size:clamp(10px,2.8vw,13px);font-weight:700;letter-spacing:.15em;color:#ffe29c;text-shadow:0 2px 6px #000}
.brand-rule{width:12px;height:1px;background:#e4bc65}
.top-icon{position:absolute;z-index:2;right:4%;top:4%;width:18%;height:auto;border-radius:21%;border:1px solid #ffdc70;box-shadow:0 0 12px #ffe07038,0 6px 15px #0008}
.hero-title{position:absolute;z-index:2;bottom:1%;width:100%;text-align:center}
h1{margin:0;font-family:Arial,Helvetica,sans-serif;font-style:italic;font-size:clamp(44px,17.4vw,83px);font-weight:950;line-height:1.1;letter-spacing:-.06em;color:#ffce31;background:linear-gradient(#fff4a7 12%,#ffc83e 40%,#f49b00 63%,#ffcf51 82%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 3px 0 #a42305) drop-shadow(0 6px 0 #5c1106) drop-shadow(0 7px 10px #0009);padding:0 12px 7px}
.hero-title p{margin:5px 0 0;color:#ffdda1;font-size:clamp(11px,3.3vw,15px);letter-spacing:.04em;text-shadow:0 2px 4px #000}
.primary-action{display:flex;justify-content:center;padding:8px 0 12px}
.download{display:flex;align-items:center;justify-content:center;background:url("assets/button-frame.svg?v=3") center/100% 100% no-repeat;color:#fff0b6;font-weight:800;text-shadow:0 2px 2px #720009;transition:filter .15s,transform .15s}
.download-large{width:72%;aspect-ratio:330 / 74;font-size:clamp(17px,5.1vw,24px);filter:drop-shadow(0 4px 9px #0009)}
.download:active{transform:scale(.97);filter:brightness(1.12)}
.download:focus-visible,button:focus-visible{outline:2px solid #fff5aa;outline-offset:4px}
.game-section{padding:6px 4.4% 4px}
.preview-frame{position:relative;padding:4px;border:1px solid #c99635;background:linear-gradient(145deg,#65421a,#100403 30%,#321708);box-shadow:0 0 0 2px #100303,0 0 0 3px #825d2699,0 7px 25px #0008}
.preview-frame img{width:100%;height:auto;aspect-ratio:20 / 9;object-fit:contain;background:#130404}
.corner{position:absolute;width:11px;height:11px;border-color:#ffe29b;border-style:solid;pointer-events:none}
.tl{top:-3px;left:-3px;border-width:2px 0 0 2px}
.tr{top:-3px;right:-3px;border-width:2px 2px 0 0}
.bl{bottom:-3px;left:-3px;border-width:0 0 2px 2px}
.br{bottom:-3px;right:-3px;border-width:0 2px 2px 0}
.preview-tabs{display:flex;align-items:center;justify-content:center;gap:13px;min-height:37px}
.preview-tab{padding:7px 10px;border:0;border-bottom:1px solid transparent;background:transparent;color:#b6a194;cursor:pointer;font-size:12px;min-height:32px}
.preview-tab.is-active{color:#ffdf8d;border-bottom-color:#d5a84e}
.tab-divider{color:#866229;font-size:7px}
.download-bar{display:flex;align-items:center;gap:9px;margin-top:0;padding:10px 3.5%;border-top:1px solid #b88a3655;background:linear-gradient(90deg,#290608,#120203 68%);box-shadow:0 -3px 15px #0005}
.download-bar>img{width:13%;height:auto;flex-shrink:0;border-radius:20%;border:1px solid #ddab50}
.bar-copy{flex:1;min-width:0}
.bar-copy strong{display:block;font-family:Arial,sans-serif;font-size:clamp(11px,3.4vw,16px);line-height:1.2}
.bar-copy>span{display:block;font-size:clamp(10px,3vw,13px);margin-top:5px;color:#dfb760}
.download-small{width:36%;flex-shrink:0;min-height:44px;aspect-ratio:330 / 90;font-size:clamp(12px,3.3vw,16px)}
.fine-print{margin:0;padding:5px 0 max(6px,env(safe-area-inset-bottom));font-size:9px;line-height:1.3;color:#a58679;text-align:center;background:#130303}
@media(min-width:600px){body{padding:20px 0}.poster{border:1px solid #78512155}.hero-title p{font-size:15px}.download-large{font-size:24px}}
@media(prefers-reduced-motion:reduce){.download{transition:none}}