/*
Theme Name: Mehra Multimedia
Theme URI: https://mehramultimedia.com/
Author: Mehra Multimedia
Author URI: https://mehramultimedia.com/
Description: Bold, fast creative-agency theme for Mehra Multimedia — A Creative Touch! Light/dark mode, customizer contact details, and a 3D scroll rocket hero, portfolio, pricing and testimonials when the Mehra Toolkit plugin is active (degrades gracefully without it).
Version: 1.2.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mehra-multimedia
Tags: one-column, custom-menu, custom-logo, featured-images, translation-ready, dark-mode, portfolio
*/
:root{--p:#3a0ca3;--p2:#240770;--y:#ffe500;--ink:#120a26;--bg:#faf8ff;--surface:#fff;--line:#e7e1f7;--accent:#3a0ca3;--chip:#ece5ff;--shadow:rgba(58,12,163,.4);--deep:#120a26;--r:18px;color-scheme:light}
html[data-theme=dark]{--ink:#efe9ff;--bg:#0d0720;--surface:#1a1035;--line:#2e2154;--accent:#c2a8ff;--chip:#2a1a52;--shadow:rgba(0,0,0,.6);--deep:#07030f;color-scheme:dark}
@media(prefers-color-scheme:dark){html:not([data-theme=light]){--ink:#efe9ff;--bg:#0d0720;--surface:#1a1035;--line:#2e2154;--accent:#c2a8ff;--chip:#2a1a52;--shadow:rgba(0,0,0,.6);--deep:#07030f;color-scheme:dark}}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}body{font:16px/1.6 Inter,system-ui,sans-serif;color:var(--ink);background:var(--bg)}
img{max-width:100%;display:block}a{color:inherit}h1,h2,h3,h4{font-family:"Space Grotesk",sans-serif;line-height:1.05}
.wrap{max-width:1180px;margin:auto;padding:0 22px}.sec{padding:96px 0}.wrap.sec{padding:96px 22px}
.kick{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:600;color:var(--accent);margin-bottom:12px}
h2{font-size:clamp(2rem,5vw,3.4rem);margin-bottom:18px}.sub{max-width:640px;opacity:.8;margin-bottom:40px}
.btn{display:inline-block;background:var(--y);color:#120a26;font-weight:700;padding:14px 26px;border-radius:99px;text-decoration:none;transition:transform .2s}.btn:hover{transform:translateY(-3px)}
.btn.ghost{background:transparent;color:#fff;border:2px solid #fff}.btn.ghost.dk{color:var(--accent);border-color:var(--accent)}.btn.sm{padding:9px 18px}.btn.big{font-size:1.1rem;padding:18px 32px}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.nav{position:sticky;top:0;z-index:9;display:flex;align-items:center;justify-content:space-between;padding:12px 22px;background:rgba(36,7,112,.92);backdrop-filter:blur(10px);color:#fff}
.brand{display:flex;gap:10px;align-items:center;text-decoration:none;font:700 1.2rem "Space Grotesk"}.brand img{border-radius:10px;background:#fff}.brand small{display:block;font:400 .7rem Inter;letter-spacing:.2em;text-transform:uppercase}
#menu{display:flex;gap:22px;align-items:center}#menu a{text-decoration:none;font-weight:600;font-size:.95rem}.burger{display:none;background:none;border:0;color:#fff;font-size:1.6rem}
.hero{background:radial-gradient(circle at 80% 10%,#7b2cff 0,transparent 45%),linear-gradient(135deg,var(--p2),var(--p));color:#fff;padding-top:110px;overflow:hidden}
.hero .kick{color:var(--y)}h1{font-size:clamp(2.8rem,8vw,6.2rem);max-width:950px;letter-spacing:-.02em}h1 em{color:var(--y);font-style:normal}
.lead{font-size:1.2rem;max-width:620px;margin-top:22px;opacity:.9}
.stats{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:70px 0 60px}.stats li{border-top:2px solid rgba(255,255,255,.3);padding-top:14px;font-size:.9rem;opacity:.9}.stats b{display:block;font:700 2.4rem "Space Grotesk";color:var(--y)}
.marquee{background:var(--y);color:var(--ink);font:700 1.4rem "Space Grotesk";white-space:nowrap;overflow:hidden;padding:14px 0;transform:rotate(-1.5deg);margin:0 -20px 30px}.marquee div{display:inline-block;animation:m 30s linear infinite}@keyframes m{to{transform:translateX(-50%)}}
.grid4{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--surface);border-radius:var(--r);padding:30px;border:1px solid var(--line);transition:.25s}.card:hover{transform:translateY(-6px);box-shadow:0 20px 40px -20px var(--shadow);border-color:var(--accent)}
.card i{font:700 .9rem "Space Grotesk";color:var(--accent);font-style:normal}.card h3{font-size:1.5rem;margin:14px 0 8px}.card p{opacity:.8}
.dark{background:var(--deep);color:#fff}.dark .kick{color:var(--y)}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:30px}.filters button{background:none;border:1.5px solid #fff4;color:#fff;padding:9px 20px;border-radius:99px;font-weight:600;cursor:pointer}.filters .on{background:var(--y);color:var(--ink);border-color:var(--y)}
.gallery{columns:4 240px;column-gap:16px}.w{break-inside:avoid;margin-bottom:16px;border-radius:14px;overflow:hidden;position:relative;background:#fff}.w[hidden]{display:none}
.w img{width:100%;transition:transform .4s}.w:hover img{transform:scale(1.05)}
.w figcaption{position:absolute;inset:auto 0 0;padding:28px 14px 12px;background:linear-gradient(transparent,#000c);font-weight:600;font-size:.9rem;display:flex;justify-content:space-between;opacity:0;transition:.3s}.w:hover figcaption{opacity:1}.w figcaption span,.site span{color:var(--y);font-size:.75rem}
.site{display:flex;flex-direction:column;justify-content:space-between;min-height:150px;padding:22px;background:linear-gradient(135deg,var(--p),#7b2cff);color:#fff;text-decoration:none}.site b{font:700 1.2rem "Space Grotesk";word-break:break-all}
.ph{font-size:1.3rem;margin:34px 0 16px}.price{grid-template-columns:repeat(4,1fr)}.grid3.price{grid-template-columns:repeat(3,1fr)}
.price h4{font-size:1.3rem}.price h4 small{display:block;font:400 .8rem Inter;opacity:.7}.amt{font:700 2rem "Space Grotesk";color:var(--accent);margin:10px 0 14px}.price ul{padding-left:18px;font-size:.92rem}
.price .hot{background:var(--p);color:#fff}.price .hot .amt{color:var(--y)}.note{margin-top:26px;opacity:.75;font-size:.92rem}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}.split img{border-radius:var(--r);aspect-ratio:1;object-fit:cover}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.tags span{background:var(--chip);color:var(--accent);padding:6px 14px;border-radius:99px;font-weight:600;font-size:.88rem}
.podcast{background:linear-gradient(135deg,#ff6a00,#ff2d7a);color:#fff}.podcast .kick{color:#fff}.podcast .split{grid-template-columns:.8fr 1.2fr}
.quotes blockquote{background:var(--surface);border-left:5px solid var(--y);border-radius:var(--r);padding:28px;font:500 1.3rem "Space Grotesk"}.quotes cite{display:block;margin-top:12px;font:400 .9rem Inter;opacity:.7}
.ph-note{background:#fff3b0;border:1px dashed #c9a400;color:#5a4500;padding:6px 10px;border-radius:8px;font-size:.8rem;display:inline-block;margin-top:16px}
.post{text-decoration:none;background:var(--surface);border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}.post img{aspect-ratio:16/10;object-fit:cover;width:100%}.post span{display:block;padding:16px 20px 0;font-size:.8rem;color:var(--accent);font-weight:600}.post h3{padding:6px 20px 22px;font-size:1.2rem}
.contact{background:var(--y);color:#120a26;text-align:center}.contact h2{font-size:clamp(2.4rem,7vw,5rem)}.contact .cta{justify-content:center}.contact .btn{background:var(--p);color:#fff}.contact .btn.ghost{background:transparent;color:var(--p);border-color:var(--p)}.info{margin-top:26px}
.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:30px 22px;font-size:.9rem}.foot nav{display:flex;gap:18px}
@media(max-width:860px){.burger{display:block}#menu{display:none;position:absolute;top:64px;left:0;right:0;flex-direction:column;background:var(--p2);padding:20px}#menu.open{display:flex}
.grid4,.grid3,.price,.grid3.price{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.split,.podcast .split{grid-template-columns:1fr;gap:30px}.sec,.wrap.sec{padding-top:64px;padding-bottom:64px}.hero{padding-top:60px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* 3D hero */
.hero{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end}
.hero .wrap,.marquee{position:relative;z-index:1}.hero .wrap{will-change:transform,opacity}
#hero3d{position:fixed;inset:0;width:100%;height:100vh;z-index:0;pointer-events:none;opacity:0;transition:opacity .6s}
html.webgl #hero3d{opacity:1}html.no-webgl #hero3d{display:none}
main>section:not(.hero),footer{position:relative;z-index:2}main>section.wrap:not(.hero),footer{background:var(--bg)}
@media(max-width:860px){.hero{justify-content:flex-start}.hero .wrap{padding-top:10px}.hero h1{text-shadow:0 4px 30px #24077099}}
main>section.wrap:not(.hero),footer.wrap{box-shadow:0 0 0 100vmax var(--bg);clip-path:inset(0 -100vmax)}
/* mobile: give the rocket its own stage below the copy, stats on a solid card */
@media(max-width:860px){.hero .stats{background:rgba(26,6,64,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:16px;padding:16px;margin:28px 0 30vh;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px}.hero .stats b{font-size:1.25rem}.hero .stats li{font-size:.62rem;line-height:1.3;padding-top:6px}.hero .stats li{border-top-color:rgba(255,255,255,.15)}}

/* theme toggle */
.theme-toggle{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#fff;width:40px;height:40px;border-radius:50%;cursor:pointer;display:inline-grid;place-items:center;font-size:1.1rem;flex:none}
.theme-toggle:hover{background:rgba(255,255,255,.22)}.theme-toggle:focus-visible,.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--y);outline-offset:3px}
.theme-toggle .moon{display:none}html[data-theme=dark] .theme-toggle .sun{display:none}html[data-theme=dark] .theme-toggle .moon{display:inline}
@media(prefers-color-scheme:dark){html:not([data-theme]) .theme-toggle .sun{display:none}html:not([data-theme]) .theme-toggle .moon{display:inline}}
.nav-right{display:flex;align-items:center;gap:14px}
body{transition:background-color .3s,color .3s}
/* ---- WordPress / theme extras ---- */
.price.cols-3,.grid3.price{grid-template-columns:repeat(3,1fr)}.price.cols-2{grid-template-columns:repeat(2,1fr)}
.mehra-pricing{display:block}.mehra-hero-wrap{display:contents}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed!important;top:8px;left:8px;width:auto;height:auto;clip:auto;z-index:99;background:var(--y);color:#120a26;padding:10px 16px;border-radius:8px}
#menu a[aria-current]{color:var(--y)}.w figure{margin:0}
.page-head{background:linear-gradient(135deg,var(--p2),var(--p));color:#fff;padding:90px 0 60px}.page-head .kick{color:var(--y)}.page-head h1{font-size:clamp(2.2rem,6vw,4rem)}.page-head .sub{opacity:.85;margin-top:12px}
.narrow{max-width:780px}.entry{font-size:1.08rem}.entry>*+*{margin-top:1.1em}.entry h2{font-size:1.9rem;margin-top:1.6em}.entry h3{font-size:1.4rem;margin-top:1.4em}.entry a{color:var(--accent)}.entry img{border-radius:12px;height:auto}.entry .hero-img{margin-bottom:28px}
.entry blockquote{border-left:4px solid var(--y);padding-left:18px;font-style:italic}.entry pre,.entry code{background:var(--surface);border-radius:6px;padding:2px 6px}
.alignwide{max-width:1180px;margin-left:auto;margin-right:auto}.alignfull{width:100vw;margin-left:calc(50% - 50vw)}.aligncenter{margin-left:auto;margin-right:auto}
.meta,.post-nav{margin-top:30px;font-size:.92rem;opacity:.85;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.post-nav a{color:var(--accent)}
.post-ph{display:block;aspect-ratio:16/10;background:linear-gradient(135deg,var(--p),#7b2cff)}
.pager .nav-links{display:flex;gap:8px;margin-top:30px}.pager .page-numbers{padding:8px 14px;border-radius:99px;border:1px solid var(--line);text-decoration:none}.pager .current{background:var(--p);color:#fff}
.comments{padding:40px 22px 80px}.comment-list{padding-left:20px}.comment-list li{margin:16px 0}.comments input:not([type=submit]):not([type=checkbox]),.comments textarea,.search-form input[type=search]{width:100%;padding:12px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit}
.comments input[type=submit],.search-form [type=submit]{background:var(--y);color:#120a26;border:0;padding:12px 22px;border-radius:99px;font-weight:700;cursor:pointer}
.search-form{display:flex;gap:10px;max-width:520px;margin-top:20px}.notfound .search-form input{background:#fff;color:#120a26}
.foot nav a{color:inherit}
@media(max-width:860px){.price.cols-2,.price.cols-3{grid-template-columns:1fr}}
@media(min-width:861px){.nav-right{order:3;margin-left:14px}.nav #menu{margin-left:auto}}
/* ---- v1.1: splash ---- */
.splash{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:radial-gradient(circle at 70% 25%,#7b2cff,#3a0ca3 50%,#120a26);color:#fff;overflow:hidden;cursor:pointer;animation:spOut .55s cubic-bezier(.7,0,.3,1) var(--splash,1500ms) forwards}
html[data-theme=dark] .splash{background:radial-gradient(circle at 70% 25%,#5b1fd6,#1d0a4a 50%,#07030f)}
.splash.out{animation:spOut .45s cubic-bezier(.7,0,.3,1) forwards}
.splash-skip .splash{display:none}
.sp-inner{text-align:center;position:relative;z-index:2}
.sp-inner img{border-radius:20px;background:#fff;padding:6px;animation:spPop .6s cubic-bezier(.2,1.6,.4,1) .1s both;box-shadow:0 10px 40px #ffd60a55}
.sp-name{font:700 clamp(1.6rem,6vw,3rem)/1 'Space Grotesk',sans-serif;letter-spacing:.12em;margin-top:18px}
.sp-name span{display:inline-block;animation:spUp .55s cubic-bezier(.2,.9,.3,1) both}.sp-name span+span{animation-delay:.12s;color:#ffd60a}.sp-name span:first-child{animation-delay:.25s}
.sp-tag{margin-top:10px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;font-size:.85rem;color:#ece5ff;animation:spFade .5s ease .55s both}
.sp-streak{position:absolute;left:-30%;top:78%;width:60%;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,#ffd60a);transform:rotate(-28deg);transform-origin:left;animation:spStreak .9s cubic-bezier(.5,0,.2,1) .05s both}
.sp-rocket{position:absolute;left:0;top:0;animation:spFly .9s cubic-bezier(.5,0,.2,1) .05s both;z-index:1}
@keyframes spOut{to{transform:translateY(-100%);border-radius:0 0 50% 50%;visibility:hidden}}
@keyframes spPop{from{transform:scale(.3) rotate(-12deg);opacity:0}}
@keyframes spUp{from{transform:translateY(40px);opacity:0}}
@keyframes spFade{from{opacity:0;letter-spacing:.8em}}
@keyframes spStreak{0%{transform:rotate(-28deg) scaleX(0);opacity:1}70%{opacity:1}100%{transform:rotate(-28deg) scaleX(2.2);opacity:0}}
@keyframes spFly{0%{transform:translate(-10vw,95vh) rotate(62deg)}100%{transform:translate(105vw,-10vh) rotate(62deg)}}
@media(prefers-reduced-motion:reduce){.splash{display:none}}
/* ---- v1.1: social icons ---- */
.social{list-style:none;display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:0}
.social a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--chip);color:var(--accent);position:relative;transition:transform .2s,background .2s,color .2s}
.social a:hover,.social a:focus-visible{transform:translateY(-3px);color:#fff}
.social .s-facebook:hover{background:#1877f2}.social .s-youtube:hover,.social .s-podcast-youtube:hover{background:#ff0000}.social .s-tiktok:hover{background:#000}.social .s-spotify:hover{background:#1db954}.social .s-whatsapp:hover{background:#25d366}
.social .pod-yt{position:absolute;right:-3px;bottom:-3px;width:16px;height:16px;border-radius:50%;background:#ff0000;color:#fff;font-size:8px;display:grid;place-items:center;line-height:1}
.social.big a{width:50px;height:50px}.social.big svg{width:24px;height:24px}
.social.on-yellow{justify-content:center;margin-top:24px}.social.on-yellow a{background:#120a26;color:#ffd60a}
.podcast .social a{background:#ffffff1f;color:#fff}.listen{margin-top:20px;font-weight:600;opacity:.85}.podcast .social{margin-top:10px}
.nav-social{gap:6px}.nav-social a{width:34px;height:34px;background:#ffffff1a;color:#fff}.nav-social svg{width:17px;height:17px}
.foot{flex-wrap:wrap}.foot-social a{width:36px;height:36px}
@media(max-width:1180px) and (min-width:861px){.nav-social{display:none}}
@media(max-width:860px){.nav-social{padding-top:10px}}
/* ---- v1.1: service images ---- */
.svc .card{padding:0;overflow:hidden;display:flex;flex-direction:column}.svc .card>*:not(img){margin-left:22px;margin-right:22px}.svc .card>p{margin-bottom:24px}.svc .card i{margin-top:18px}
.svc-img{width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;display:block;transition:transform .5s}.svc .card:hover .svc-img{transform:scale(1.04)}
/* ---- v1.1: YtRates ---- */
.yt-stats{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:0;margin:0 0 34px}.yt-stats li{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;font-size:.9rem}.yt-stats b{display:block;font-size:2rem;color:var(--accent)}
.yt-grid{grid-template-columns:repeat(3,1fr)}.yt-grid .card{position:relative;display:flex;flex-direction:column}.yt-grid .card ul{flex:1}.yt-grid .btn{margin-top:18px;text-align:center}
.yt-grid .amt small{font-size:.9rem;opacity:.75}.badge{position:absolute;top:-12px;right:18px;background:var(--y);color:#120a26;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:5px 12px;border-radius:99px}
.yt-grid .card.hot .btn{background:#fff}
.yt-cta{text-align:center;margin-top:40px}
@media(max-width:860px){.yt-stats{grid-template-columns:repeat(2,1fr)}.yt-grid{grid-template-columns:1fr}}
.on-page{justify-content:center;margin-top:20px}
.w[data-cat="web"] figcaption,.w[data-cat="website"] figcaption{opacity:1}

/* v1.2: never distort portfolio images */
.w img{width:100%;height:auto;max-width:100%;object-fit:contain;contain-intrinsic-size:none}
.w[data-cat="logo"],.w[data-cat="logos"]{background:#f4f2f9;padding:18px}
.w[data-cat="logo"] img,.w[data-cat="logos"] img{object-fit:contain;border-radius:8px;contain-intrinsic-size:none}
[data-theme="dark"] .w[data-cat="logo"],[data-theme="dark"] .w[data-cat="logos"]{background:#241a3d}
.w[data-cat="web"] figure,.w[data-cat="website"] figure{aspect-ratio:16/10;overflow:hidden}
.w[data-cat="web"] img,.w[data-cat="website"] img{height:100%;width:100%;object-fit:cover;object-position:top center}
.svc-img{height:auto}