/* Sanjay Pratap — logo-led visual system */
:root{--red:#db2032;--ink:#151f28;--muted:#5e6974;--line:#e6e9ec;--soft:#fff6f7;--brand-shadow:0 14px 38px rgba(21,31,40,.06)}
body{font-family:Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;color:var(--ink)}
::selection{background:#db203225;color:#151f28}
h1,h2,h3{font-family:Roboto,Arial,sans-serif;text-wrap:balance}p{color:var(--muted)}
.header.refined-header{border-top:3px solid var(--red);background:rgba(255,255,255,.96);box-shadow:0 4px 24px #151f2805}
.refined-brand img{object-fit:contain}.refined-header .links{font-weight:500}
.hero{background:radial-gradient(ellipse at 87% 45%,#fbe9ec 0,transparent 55%),linear-gradient(135deg,#fff 30%,#fcfafb);padding-bottom:58px;position:relative}
.hero h1{font-weight:800;letter-spacing:-2px;line-height:1.09}.hero p{line-height:1.8;color:#56636e}.hero .eyebrow{letter-spacing:1.8px;font-size:12px}
.hero-device-glow{opacity:.55}.hero-device-composition{filter:drop-shadow(0 20px 22px #151f2809)}
.btn,.nav-demo,.nav-primary{border-radius:10px;box-shadow:0 5px 14px #db203216;transition:transform .22s,background .22s,box-shadow .22s}
.btn:hover{background:#bd1729;box-shadow:0 9px 22px #db203228;transform:translateY(-2px)}
.btn.outline{box-shadow:none;background:#fff;border-color:#dce1e5}.btn.outline:hover{background:#f7f8fa;color:var(--ink);border-color:#b9c1c8}
.compact-experience{background:#fff;border-bottom:1px solid var(--line)}
.experience-pill{background:#fff;color:var(--ink);border:1px solid #e3e6e9;border-radius:10px;box-shadow:0 3px 10px #151f2803;padding:12px 19px}
.experience-pill:hover{background:#fff6f7;color:var(--red);border-color:#eab5bd;box-shadow:none}.experience-pill-icon{color:var(--red)}
.section{padding-block:72px}.soft{background:#f7f8fa;border-color:#edf0f2}.school-benefits{background:#fff}
h2{font-weight:750;letter-spacing:-1px}.eyebrow{color:var(--red)}
.benefit-card,.module,.card{border:1px solid #e3e7eb;border-radius:18px;box-shadow:0 4px 15px #151f2803;background:#fff;transition:transform .25s,box-shadow .25s,border-color .25s}
.benefit-card:hover,.module:hover,.card:hover{transform:translateY(-5px);border-color:#e6aeb6;box-shadow:var(--brand-shadow)}
.benefit-card:before{background:var(--red);height:3px;left:26px;right:auto;width:42px;border-radius:0 0 3px 3px}
.benefit-card h3{line-height:1.3}.benefit-card .benefit-description{color:#5e6974}.benefit-category,.module-category{letter-spacing:1.25px}
.benefit-icon,.module-icon{background:#fff0f2!important;color:var(--red)!important;border:1px solid #f7dce1;border-radius:13px!important;position:relative;overflow:visible}
.module-num{color:#77828d!important;letter-spacing:1.2px}.module-explore,.benefit-link{font-weight:600}
.big-demo,.real-browser,.device-overview-card,.selfie-card,.enhanced-portal{box-shadow:var(--brand-shadow);border-color:#e3e7eb}
.tab,.device-switch button,.real-switch button{transition:background .2s,color .2s,box-shadow .2s}.tab.active{background:var(--ink)}
.step{padding:24px;border-left:2px solid #f3d8dc}.step b{background:#fff0f2;color:var(--red)}
.faq details{background:#fff;border:1px solid #e5e9ed;border-radius:12px;margin-bottom:12px;padding:22px 24px}.faq summary{line-height:1.5}.faq details[open]{border-color:#e2adb4;box-shadow:0 6px 18px #151f2804}
.contact-redesign{border-radius:22px;box-shadow:0 24px 60px #151f280b}.contact-info{background:var(--ink)!important}.contact-method{border-color:#ffffff24!important}.contact-method:hover{background:#ffffff0d!important}.contact-method-icon{background:#ffffff12!important;color:#fff!important}
.form input,.form select,.form textarea{border-radius:9px;transition:border-color .2s,box-shadow .2s}.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px #db203212}
.site-footer{border-top:3px solid var(--red)}
:where(a,button,summary):focus-visible{outline:3px solid #db2032;outline-offset:4px}
.brand-motion{transform-origin:center;animation:icon-breathe 4.5s ease-in-out infinite;animation-play-state:paused}.brand-motion.in-view{animation-play-state:running}
.brand-motion svg{display:block;width:25px;height:25px;overflow:visible;transform-origin:center}
.experience-pill-icon.brand-motion svg{width:19px;height:19px}.brand-motion[data-motion="sway"].in-view svg{animation:icon-sway 5s ease-in-out infinite}
.brand-motion[data-motion="draw"].in-view svg path{stroke-dasharray:80;stroke-dashoffset:0;animation:icon-draw 6s ease-in-out infinite}
.brand-motion[data-motion="pulse"].in-view svg{animation:icon-pulse 4s ease-in-out infinite}
@keyframes icon-breathe{0%,70%,100%{transform:translateY(0)}35%{transform:translateY(-3px)}}
@keyframes icon-sway{0%,65%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}40%{transform:rotate(6deg)}}
@keyframes icon-draw{0%,100%{stroke-dashoffset:0}12%{stroke-dashoffset:80}35%,90%{stroke-dashoffset:0}}
@keyframes icon-pulse{0%,65%,100%{transform:scale(1)}30%{transform:scale(1.09)}}
@media(min-width:1024px){.hero h1{font-size:clamp(44px,4.4vw,62px)}.hero-grid{gap:44px}.hero-grid>div:first-child{align-self:center}}
@media(max-width:767px){.section{padding-block:46px}.hero{padding-bottom:32px}.hero h1{font-size:40px;letter-spacing:-1.2px}.hero p{font-size:16px}.experience-pills{gap:8px}.experience-pill{padding:10px 13px}.faq details{padding:18px}.step{padding:16px}.benefit-card,.module{border-radius:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}