.brand-intro{display:none}
html.intro-pending{overflow:hidden}
.intro-pending .brand-intro{display:grid;place-items:center;position:fixed;inset:0;z-index:1000;min-height:100dvh;overflow:auto;background:radial-gradient(ellipse at 50% 40%,#32603c 0%,#173f30 45%,#0b281e 100%);color:#fff6d9;isolation:isolate;animation:intro-safety 11.5s forwards}
.intro-grain{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#f5d48426 1px,transparent 1px);background-size:26px 26px;mask-image:linear-gradient(transparent,#0008,transparent);z-index:-1}
.intro-content{width:min(90%,680px);text-align:center;padding:50px 0 28px}
.intro-kicker{font-family:var(--sans);font-size:11px;letter-spacing:4px;color:#e7ca88;margin:0 0 22px;animation:intro-enter .7s both}
.intro-product{position:relative;width:220px;height:min(37dvh,320px);min-height:190px;margin:0 auto 25px;animation:intro-bottle 1.1s cubic-bezier(.2,.7,.2,1) both}
.intro-product img{width:100%;height:100%;object-fit:cover;object-position:center 65%;border-radius:100px 100px 12px 12px;border:1px solid #e6c87899;box-shadow:0 18px 55px #0005;position:relative}
.intro-orbit{position:absolute;inset:-12px;border:1px solid #e5bc5860;border-radius:115px 115px 20px 20px;transform:rotate(-6deg);animation:intro-orbit 3.5s ease-in-out both}
.intro-product-caption{position:absolute;bottom:0;left:0;right:0;background:#123a2bf0;border-radius:0 0 12px 12px;padding:8px;font-size:7px;letter-spacing:2px;color:#f1d58a}
.intro-drop{position:absolute;right:-23px;top:39%;width:35px;height:44px;background:linear-gradient(140deg,#fff4a2,#efbf37 45%,#a76a10);border-radius:70% 30% 65% 35%;transform:rotate(-45deg);box-shadow:inset 4px 3px 8px #ffffb577,0 6px 18px #0003;animation:intro-drop 2.5s ease-in-out infinite}
.intro-content h2[lang=hi]{font-family:'Noto Serif Devanagari','Nirmala UI',Mangal,serif;font-size:clamp(27px,4.6vw,44px);line-height:1.65;font-weight:600;letter-spacing:0;margin:0;color:#f5d483;animation:intro-enter .8s .15s both}
.intro-tagline[lang=hi]{font-family:'Noto Sans Devanagari','Nirmala UI',Mangal,sans-serif;font-size:15px;color:#f1ebd8;line-height:1.8;margin:5px 0 20px;animation:intro-enter .8s .3s both}
.intro-progress{height:2px;width:130px;margin:0 auto 14px;background:#e0c98b30;overflow:hidden}
.intro-progress span{display:block;width:100%;height:100%;background:#f1ce79;transform-origin:left;animation:intro-progress 10s linear both}
.intro-welcome[lang=hi]{font-family:'Noto Sans Devanagari','Nirmala UI',Mangal,sans-serif;color:#c4d0b7;font-size:11px;line-height:1.8;margin:0;animation:intro-enter .8s .4s both}
.intro-skip{position:absolute;top:23px;right:26px;border:1px solid #d3be7c66;border-radius:30px;padding:9px 16px;background:#ffffff08;color:#f5e9c6;font-family:'Noto Sans Devanagari',var(--sans);font-size:11px;z-index:2}
.intro-skip span{margin-left:12px}.intro-skip:hover{background:#ffffff15}.intro-skip:focus-visible{outline:3px solid #e9c571;outline-offset:4px}
@keyframes intro-enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes intro-bottle{from{opacity:0;transform:translateY(25px) scale(.93)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes intro-orbit{from{transform:rotate(-12deg);opacity:0}to{transform:rotate(-6deg);opacity:1}}
@keyframes intro-drop{0%,100%{transform:translateY(-5px) rotate(-45deg)}50%{transform:translateY(7px) rotate(-45deg)}}
@keyframes intro-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes intro-safety{0%,90%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden;pointer-events:none}}
@media(max-width:600px){.intro-content{padding-top:65px}.intro-kicker{font-size:9px;letter-spacing:2.5px}.intro-product{width:190px;height:31dvh;min-height:200px}.intro-tagline[lang=hi]{font-size:13px}.intro-skip{top:16px;right:16px;font-size:10px}.intro-content h2[lang=hi]{font-size:29px}}
@media(max-height:620px){.intro-content{padding-top:55px;padding-bottom:20px}.intro-kicker{margin-bottom:14px}.intro-product{min-height:120px;height:28dvh;width:140px;margin-bottom:15px}.intro-content h2[lang=hi]{font-size:26px}.intro-tagline[lang=hi]{margin-bottom:12px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.intro-pending .brand-intro{animation:none}.intro-content *{animation:none!important}.intro-progress span{transform:scaleX(1)}}
