@font-face{font-family:"Thmanyah";src:url("assets/fonts/thmanyah-sans-Light.otf") format("opentype");font-weight:300;font-style:normal;font-display:block}
@font-face{font-family:"Thmanyah";src:url("assets/fonts/thmanyah-sans-Regular.otf") format("opentype");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"Thmanyah";src:url("assets/fonts/thmanyah-sans-Medium.otf") format("opentype");font-weight:500 600;font-style:normal;font-display:block}
@font-face{font-family:"Thmanyah";src:url("assets/fonts/thmanyah-sans-Bold.otf") format("opentype");font-weight:700 800;font-style:normal;font-display:block}
@font-face{font-family:"Thmanyah";src:url("assets/fonts/thmanyah-sans-Black.otf") format("opentype");font-weight:900;font-style:normal;font-display:block}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0a0610;color:#fff;font-family:"Thmanyah","Cairo",sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}.noise{position:fixed;inset:0;pointer-events:none;z-index:99;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.nav{position:fixed;top:0;left:0;right:0;height:88px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;z-index:50;background:linear-gradient(to bottom,rgba(8,4,13,.92),rgba(8,4,13,.18));backdrop-filter:blur(10px)}.brand img{width:190px;display:block;filter:brightness(0) invert(1)}.nav nav{display:flex;gap:21px;font-size:12px}.nav nav a{opacity:.72}.nav nav a:hover{opacity:1}.nav-cta{border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:10px 18px;font-size:12px}.section{padding:110px 7vw}.hero{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:6vw;position:relative;isolation:isolate;overflow:hidden}.hero-bg{position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,rgba(7,3,11,.98) 0%,rgba(13,4,22,.9) 44%,rgba(36,2,102,.28) 100%),url("assets/purple-background.png") center/cover no-repeat}.hero:after{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 72% 35%,rgba(173,32,221,.16),transparent 30%)}.hero-copy{z-index:2}.eyebrow,.section-tag{font-size:13px;letter-spacing:.06em;color:#dfc5eb}.hero h1{font-size:clamp(58px,7vw,112px);line-height:.86;margin:24px 0 28px;letter-spacing:-.055em}.hero h1 span,.big-copy h2 span,.contact h2 span{color:#fff}.hero p{max-width:610px;color:#c9c1ce;line-height:1.9;font-size:15px}.actions{display:flex;gap:14px;margin-top:32px}.btn{padding:13px 23px;border-radius:999px;font-size:13px}.primary{background:#fff;color:#160721}.ghost{border:1px solid rgba(255,255,255,.2)}.hero-art{display:grid;place-items:center}.glass-card{width:min(520px,42vw);height:min(650px,70vh);border-radius:38px;position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.2);box-shadow:0 50px 120px rgba(0,0,0,.45),inset 0 1px rgba(255,255,255,.28);backdrop-filter:blur(15px)}.portrait{position:absolute;width:116%;height:116%;object-fit:contain;object-position:center bottom;left:-8%;bottom:-7%;filter:drop-shadow(0 28px 30px rgba(0,0,0,.38))}.mini-label{position:absolute;z-index:2;top:25px;left:28px;font-size:10px;letter-spacing:.25em;opacity:.65}.floating-pill{position:absolute;z-index:3;padding:9px 15px;border:1px solid rgba(255,255,255,.24);border-radius:999px;font-size:9px;letter-spacing:.15em;background:rgba(20,6,31,.36);backdrop-filter:blur(10px)}.p1{left:20px;top:22%}.p2{right:20px;bottom:15%}.ticker{overflow:hidden;border-block:1px solid rgba(255,255,255,.1);background:#240266;padding:17px 0}.ticker-track{width:max-content;display:flex;gap:38px;font-size:16px;animation:ticker 28s linear infinite}@keyframes ticker{to{transform:translateX(50%)}}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding-top:50px;padding-bottom:50px}.stats div{padding:30px 5vw;border-inline-start:1px solid rgba(255,255,255,.1);display:flex;align-items:center;gap:24px}.stats b{font-size:58px;font-weight:300}.stats span{color:#aaa0b3}.split{display:grid;grid-template-columns:.38fr 1.62fr;gap:8vw}.big-copy h2,.section-head h2,.contact h2{font-size:clamp(38px,5vw,76px);line-height:1.08;margin:15px 0 25px;letter-spacing:-.04em}.big-copy p{max-width:760px;line-height:2;color:#aaa0b3}.section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:45px}.section-head p{max-width:390px;color:#918797;line-height:1.8}.work-grid{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:400px 400px;gap:18px}.project{position:relative;overflow:hidden;border-radius:26px;background:#17101f;border:1px solid rgba(255,255,255,.08)}.project-large{grid-row:span 2}.project-bg{position:absolute;inset:0;transition:.6s}.project:hover .project-bg{transform:scale(1.04)}.bg-photo{background:linear-gradient(rgba(17,4,27,.18),rgba(17,4,27,.55)),url("assets/purple-background.png") center/cover}.g2{background:linear-gradient(145deg,#610d98,#160822 70%)}.g3{background:linear-gradient(135deg,#ad20dd -60%,#240266 52%,#09050f)}.project-info{position:absolute;bottom:0;left:0;right:0;padding:28px;background:linear-gradient(transparent,rgba(0,0,0,.75))}.project-info span{font-size:10px;letter-spacing:.14em;opacity:.65}.project-info h3{font-size:26px;margin:6px 0}.content-section{background:linear-gradient(180deg,transparent,rgba(36,2,102,.09),transparent)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.content-card{min-height:300px;border-radius:24px;padding:28px;background:linear-gradient(145deg,rgba(97,13,152,.14),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column}.content-card>span{font-size:11px;color:#d7a6e8}.content-card h3{font-size:27px;margin:55px 0 10px}.content-card p{color:#9f95a6;line-height:1.8}.content-card a{margin-top:auto;font-size:12px}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.video-card{aspect-ratio:16/9;border-radius:25px;padding:28px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,rgba(36,2,102,.6),rgba(10,6,16,.4)),url("assets/purple-background.png") center/cover;border:1px solid rgba(255,255,255,.1)}.play{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#240266}.video-card h3{font-size:24px;margin:7px 0}.tips{display:grid;grid-template-columns:1fr 1fr;gap:18px}.tip{padding:34px;border-top:1px solid rgba(255,255,255,.18)}.tip b{font-weight:400;color:#ad20dd}.tip h3{font-size:27px}.tip p{color:#9b919f;line-height:1.8}.contact{display:flex;align-items:end;justify-content:space-between;background:radial-gradient(circle at 20% 50%,rgba(97,13,152,.22),transparent 35%)}.contact p{color:#9d94a3}.socials{display:grid;min-width:280px}.socials a{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.13);transition:.25s}.socials a:hover{padding-right:10px}footer{padding:38px 7vw 50px;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;color:#8e8495;font-size:12px}footer img{width:175px;filter:brightness(0) invert(1)}.reveal{opacity:0;transform:translateY(25px);transition:opacity .8s ease,transform .8s ease}.reveal.show{opacity:1;transform:none}@media(max-width:900px){.nav nav{display:none}.brand img{width:155px}.hero{grid-template-columns:1fr;padding-top:125px}.hero h1{line-height:.92}.glass-card{width:min(88vw,480px);height:560px}.section{padding:82px 6vw}.stats{grid-template-columns:1fr}.split{grid-template-columns:1fr}.work-grid{grid-template-columns:1fr;grid-template-rows:480px 330px 330px}.project-large{grid-row:auto}.cards,.video-grid,.tips{grid-template-columns:1fr}.section-head,.contact{align-items:start;flex-direction:column}.socials{width:100%}footer{align-items:flex-start;flex-direction:column;gap:22px}}
/* v3 hero refinements */
.hero{grid-template-columns:1.18fr .82fr;gap:5vw}
.hero h1{font-weight:900;line-height:.78;letter-spacing:-.035em}
.hero p{font-weight:300}
.hero-art{overflow:visible}
.glass-card{width:min(430px,35vw);height:min(590px,66vh);overflow:visible;margin-top:38px}
.glass-card:before{content:"";position:absolute;inset:0;border-radius:38px;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(15px);z-index:-1}
.portrait{width:128%;height:128%;left:-14%;bottom:-7%;object-fit:contain;object-position:center bottom;z-index:1}
.experience-badge{position:absolute;z-index:4;left:-56px;top:22%;min-width:145px;padding:20px 18px;border-radius:22px;background:rgba(11,6,18,.88);border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 45px rgba(0,0,0,.28);backdrop-filter:blur(12px);text-align:center}
.experience-badge b{display:block;font-size:30px;line-height:1;font-weight:900}.experience-badge span{display:block;margin-top:8px;font-size:13px;color:#d8cedd}
.mini-label{z-index:5}.p2{z-index:5}
@media(max-width:900px){.hero{grid-template-columns:1fr}.glass-card{width:min(76vw,390px);height:520px}.experience-badge{left:-20px;top:22%}.hero h1{line-height:.82}}

/* v4 requested homepage corrections */
.hero h1{
  line-height:.94 !important;
  margin-top:18px;
  margin-bottom:30px;
}
.glass-card{
  width:min(430px,35vw);
  height:min(590px,66vh);
  overflow:visible;
}
.portrait{
  width:100% !important;
  height:auto !important;
  max-width:none;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  z-index:1;
}
.experience-badge{
  left:-1px !important;
  transform:translateX(-42%);
  top:23%;
}
.design-badge{
  position:absolute;
  z-index:5;
  right:-1px;
  transform:translateX(42%);
  top:62%;
  min-width:145px;
  padding:20px 18px;
  border-radius:22px;
  background:rgba(11,6,18,.88);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 18px 45px rgba(0,0,0,.28);
  backdrop-filter:blur(12px);
  text-align:center;
}
.design-badge b{
  display:block;
  font-size:30px;
  line-height:1;
  font-weight:900;
}
.design-badge span{
  display:block;
  margin-top:8px;
  font-size:13px;
  color:#d8cedd;
}
@media(max-width:900px){
  .hero h1{line-height:.98 !important}
  .experience-badge{left:0 !important;transform:translateX(-18%)}
  .design-badge{right:0;transform:translateX(18%)}
}
/* v4.2 — more headline breathing room + lower hero artwork */
.hero h1{line-height:1.08 !important;}
.hero-art{transform:translateY(72px);}
@media(max-width:900px){.hero h1{line-height:1.08 !important}.hero-art{transform:translateY(35px)}}

/* v4.3 — requested hero corrections */
.hero h1{line-height:1.12 !important;}
.hero-art{transform:translateY(105px) !important;overflow:visible !important;}
.glass-card{margin-top:0 !important;overflow:visible !important;}
.portrait{width:100% !important;height:auto !important;left:0 !important;right:0 !important;bottom:0 !important;object-fit:contain !important;object-position:center bottom !important;}
.experience-badge{top:25% !important;}
.design-badge{top:64% !important;}
@media(max-width:900px){.hero-art{transform:translateY(70px) !important}.hero h1{line-height:1.10 !important}}

/* v4.4 — requested extra spacing and stronger stats */
.hero h1{line-height:1.22 !important;}
.hero-art{transform:translateY(138px) !important;}
.stats b{font-size:68px !important;font-weight:900 !important;line-height:.9;}
.experience-badge b,.design-badge b{font-size:36px !important;font-weight:900 !important;}
@media(max-width:900px){.hero h1{line-height:1.18 !important}.hero-art{transform:translateY(92px) !important}.stats b{font-size:60px !important}}

/* v5 — approved content, welcome screen and fast counters */
html{scroll-padding-top:105px}
section[id]{scroll-margin-top:105px}
body.is-loading{overflow:hidden}
.welcome-screen{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,rgba(173,32,221,.24),transparent 34%),linear-gradient(145deg,#12031f 0%,#240266 56%,#09050f 100%);transition:opacity .55s ease,visibility .55s ease}
.welcome-screen:before{content:"";position:absolute;inset:0;background:url("assets/purple-background.png") center/cover no-repeat;opacity:.12;mix-blend-mode:screen}
.welcome-inner{position:relative;text-align:center;padding:30px;animation:welcomeIn .7s cubic-bezier(.2,.8,.2,1) both}
.welcome-logo{width:min(210px,52vw);filter:brightness(0) invert(1);opacity:.9;margin-bottom:34px}
.welcome-kicker{font-size:12px;letter-spacing:.08em;color:#d9c8e4;margin:0 0 10px}
.welcome-inner h1{font-size:clamp(48px,7vw,92px);line-height:1.15;margin:0;font-weight:900;letter-spacing:-.04em}
.welcome-inner span{display:block;margin-top:12px;color:#d9c8e4;font-size:16px}
.welcome-screen.hide{opacity:0;visibility:hidden;pointer-events:none}
@keyframes welcomeIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.counter{font-variant-numeric:tabular-nums}
.experience-badge b,.design-badge b,.stats b{font-weight:900 !important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.welcome-inner{animation:none}.welcome-screen{transition:none}.reveal{transition:none}}

/* v5.2 — smoother counters, testimonials, social icons */
.counter{font-variant-numeric:tabular-nums;will-change:contents}
.testimonials{background:linear-gradient(180deg,transparent,rgba(97,13,152,.09),transparent)}
.testimonial-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 16px;scrollbar-width:none}
.testimonial-track::-webkit-scrollbar{display:none}
.testimonial-card{flex:0 0 min(420px,86vw);scroll-snap-align:start;min-height:235px;padding:30px;border-radius:26px;background:linear-gradient(145deg,rgba(97,13,152,.16),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;justify-content:space-between}
.testimonial-card p{font-size:18px;line-height:1.9;color:#ddd5e1;margin:0 0 28px}
.testimonial-person{display:flex;align-items:center;gap:13px}.testimonial-avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);font-weight:900}.testimonial-person b{display:block}.testimonial-person span{display:block;color:#918797;font-size:12px;margin-top:3px}
.socials a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:58px}.social-name{display:flex;align-items:center;gap:12px}.social-icon{width:22px;height:22px;display:grid;place-items:center;flex:0 0 22px}.social-icon svg{width:100%;height:100%;display:block;fill:currentColor}.social-arrow{opacity:.55}
@media(max-width:900px){.testimonial-card{flex-basis:84vw}}


/* v5.3 — About portrait + approved selected-prompts note */
.about-section{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(360px,.72fr);gap:7vw;align-items:center;min-height:720px;overflow:hidden}
.about-section:before{content:"";position:absolute;width:520px;height:520px;left:-180px;bottom:-170px;border-radius:50%;background:rgba(97,13,152,.14);filter:blur(70px);pointer-events:none}
.about-copy{position:relative;z-index:2;max-width:760px}
.about-copy .section-tag{display:block;margin-bottom:12px}
.about-visual{position:relative;min-height:610px;display:flex;align-items:flex-end;justify-content:center;isolation:isolate}
.about-glow{position:absolute;z-index:-2;width:78%;aspect-ratio:1;bottom:10%;border-radius:50%;background:radial-gradient(circle,rgba(173,32,221,.32) 0%,rgba(97,13,152,.18) 38%,transparent 72%);filter:blur(18px)}
.about-ring{position:absolute;z-index:-1;width:76%;aspect-ratio:1;bottom:11%;border-radius:50%;border:1px solid rgba(173,32,221,.24);box-shadow:0 0 80px rgba(97,13,152,.13),inset 0 0 70px rgba(173,32,221,.05)}
.about-portrait{position:relative;z-index:2;width:min(100%,470px);max-height:650px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 28px 38px rgba(0,0,0,.45))}
.about-label{position:absolute;z-index:3;left:4%;bottom:12%;padding:9px 14px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(12,6,18,.55);backdrop-filter:blur(10px);font-size:9px;letter-spacing:.2em;color:#d9c8e4}
@media(max-width:900px){.about-section{grid-template-columns:1fr;gap:28px;min-height:auto}.about-visual{min-height:520px;order:2}.about-copy{order:1}.about-portrait{width:min(92vw,430px);max-height:540px}.about-ring{width:min(78vw,380px)}.about-glow{width:min(82vw,410px)}}

/* v5.4 — About portrait: new black-suit cutout with seamless crop treatment */
.about-visual{overflow:visible;min-height:620px;padding-bottom:0}
.about-portrait{
  width:min(100%,500px);
  max-height:690px;
  object-fit:contain;
  object-position:center bottom;
  transform:translateY(38px);
  filter:drop-shadow(0 30px 42px rgba(0,0,0,.5));
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 82%,rgba(0,0,0,.96) 88%,rgba(0,0,0,.5) 96%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 82%,rgba(0,0,0,.96) 88%,rgba(0,0,0,.5) 96%,transparent 100%);
}
.about-visual:after{content:"";position:absolute;z-index:1;left:8%;right:8%;bottom:-4px;height:120px;background:linear-gradient(to bottom,transparent,rgba(8,5,12,.35) 58%,rgba(8,5,12,.82));filter:blur(16px);pointer-events:none}
.about-label{z-index:4}
@media(max-width:900px){.about-visual{min-height:540px;overflow:hidden}.about-portrait{width:min(96vw,460px);max-height:590px;transform:translateY(30px)}}


/* v5.5 — About portrait framed depth treatment */
.about-visual{min-height:650px;overflow:visible;padding-bottom:0}
.about-visual::before{
  content:"";position:absolute;z-index:0;width:min(92%,480px);height:72%;bottom:0;
  border-radius:38px 38px 24px 24px;
  background:linear-gradient(145deg,rgba(97,13,152,.24),rgba(255,255,255,.045) 48%,rgba(36,2,102,.13));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px rgba(255,255,255,.18),0 34px 90px rgba(0,0,0,.34),0 0 65px rgba(97,13,152,.10);
  backdrop-filter:blur(10px);
}
.about-visual::after{
  content:"";position:absolute;z-index:3;width:min(92%,480px);height:22%;bottom:0;
  border-radius:0 0 24px 24px;
  background:linear-gradient(to bottom,transparent 0%,rgba(10,6,16,.10) 36%,rgba(10,6,16,.72) 100%);
  pointer-events:none;
}
.about-ring{z-index:-1;width:82%;bottom:7%;opacity:.75}
.about-glow{z-index:-2;width:88%;bottom:6%}
.about-portrait{
  z-index:2;width:min(100%,500px);max-height:700px;object-fit:contain;object-position:center bottom;
  transform:translateY(26px);filter:drop-shadow(0 30px 42px rgba(0,0,0,.48));
  -webkit-mask-image:none;mask-image:none;
}
.about-label{z-index:4;left:7%;bottom:9%}
.about-name{margin:-12px 0 20px;font-size:clamp(22px,2.2vw,34px);font-weight:500;color:#d9c8e4;letter-spacing:-.02em}
@media(max-width:900px){
  .about-visual{min-height:570px;overflow:visible}
  .about-visual::before,.about-visual::after{width:min(88vw,430px)}
  .about-portrait{width:min(94vw,455px);max-height:610px;transform:translateY(24px)}
  .about-name{margin-top:-8px}
}

/* v5.6 — align the portrait bottom exactly with the frame bottom */
.about-portrait{transform:translateY(0)}
@media(max-width:900px){.about-portrait{transform:translateY(0)}}

/* V5.7 — selected works + logo development */
.portfolio-grid{columns:4 250px;column-gap:16px}.portfolio-item{display:block;width:100%;margin:0 0 16px;padding:0;border:0;border-radius:20px;overflow:hidden;background:#160d1f;cursor:zoom-in;break-inside:avoid;box-shadow:0 16px 38px rgba(0,0,0,.22);position:relative}.portfolio-item:after{content:"عرض العمل ↗";position:absolute;inset:auto 14px 14px 14px;padding:10px 13px;border-radius:999px;background:rgba(10,6,16,.7);backdrop-filter:blur(12px);color:#fff;font-family:inherit;font-size:11px;opacity:0;transform:translateY(8px);transition:.3s}.portfolio-item img{display:block;width:100%;height:auto;transition:transform .5s ease,filter .5s ease}.portfolio-item:hover img{transform:scale(1.025);filter:brightness(.78)}.portfolio-item:hover:after{opacity:1;transform:none}.logo-development{padding-top:70px;background:radial-gradient(circle at 75% 50%,rgba(97,13,152,.12),transparent 34%)}.logo-placeholder{min-height:330px;border:1px solid rgba(255,255,255,.1);border-radius:30px;background:linear-gradient(135deg,rgba(97,13,152,.12),rgba(255,255,255,.025));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:28px;padding:45px}.logo-placeholder>div{min-height:180px;border-radius:22px;border:1px dashed rgba(255,255,255,.16);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#aaa0b3}.logo-placeholder span{font-size:10px;letter-spacing:.18em;color:#ad20dd}.logo-placeholder b{font-size:22px;color:#fff}.logo-placeholder i{font-style:normal;font-size:35px;color:#ad20dd}.logo-placeholder p{grid-column:1/-1;text-align:center;color:#817786;margin:0}.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(5,2,9,.94);display:none;align-items:center;justify-content:center;padding:35px;backdrop-filter:blur(12px)}.lightbox.open{display:flex}.lightbox img{max-width:min(94vw,1200px);max-height:90vh;object-fit:contain;border-radius:14px;box-shadow:0 30px 100px rgba(0,0,0,.55)}.lightbox button{position:absolute;top:24px;right:28px;width:46px;height:46px;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font-size:25px;cursor:pointer}@media(max-width:700px){.portfolio-grid{columns:2 150px;column-gap:10px}.portfolio-item{margin-bottom:10px;border-radius:14px}.logo-placeholder{grid-template-columns:1fr;padding:24px}.logo-placeholder i{transform:rotate(-90deg)}.logo-placeholder p{grid-column:auto}}
\n\n/* V5.8 — real logo development projects */
.logo-projects{display:grid;gap:28px}.logo-project{padding:28px;border:1px solid rgba(255,255,255,.1);border-radius:30px;background:linear-gradient(135deg,rgba(97,13,152,.13),rgba(255,255,255,.025));box-shadow:0 22px 60px rgba(0,0,0,.18)}.logo-project-title{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}.logo-project-title>span{flex:0 0 42px;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(173,32,221,.14);border:1px solid rgba(173,32,221,.28);color:#d99cf0;font-size:12px;font-weight:800}.logo-project-title h3{margin:0 0 5px;color:#fff;font-size:clamp(21px,2.2vw,30px)}.logo-project-title p{margin:0;color:#8f8496;font-size:14px}.logo-compare{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px}.logo-state{position:relative;text-align:center}.logo-state>span{position:absolute;z-index:2;top:14px;right:14px;padding:7px 12px;border-radius:999px;background:rgba(8,5,12,.72);border:1px solid rgba(255,255,255,.12);color:#d8d0dc;font-size:11px;backdrop-filter:blur(10px)}.logo-state.after>span{background:rgba(97,13,152,.7);color:#fff}.logo-image-wrap{height:320px;border-radius:23px;background:radial-gradient(circle at 50% 42%,rgba(173,32,221,.11),rgba(10,6,16,.6));border:1px solid rgba(255,255,255,.08);display:grid;place-items:center;padding:30px;overflow:hidden}.logo-image-wrap img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 26px rgba(0,0,0,.28))}.logo-state>b{display:block;margin-top:12px;color:#b9afbf;font-size:13px}.logo-state.after>b{color:#fff}.compare-arrow{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#610D98,#AD20DD);color:#fff;font-size:25px;box-shadow:0 12px 32px rgba(173,32,221,.25)}
@media(max-width:700px){.logo-project{padding:18px;border-radius:22px}.logo-project-title{margin-bottom:18px}.logo-compare{grid-template-columns:1fr;gap:12px}.compare-arrow{margin:auto;transform:rotate(-90deg);width:44px;height:44px}.logo-image-wrap{height:250px;padding:22px}}

/* V5.10 — balanced before/after logo presentation */
.logo-compare{align-items:stretch}
.logo-state{display:grid;grid-template-rows:360px auto;height:100%;align-items:start}
.logo-image-wrap{height:360px;min-height:360px;padding:38px 42px;overflow:visible;display:flex;align-items:center;justify-content:center}
.logo-image-wrap img{display:block;width:auto;height:auto;max-width:88%;max-height:88%;object-fit:contain;object-position:center center;margin:auto}
.logo-state>b{align-self:start}
@media(max-width:700px){.logo-state{grid-template-rows:270px auto}.logo-image-wrap{height:270px;min-height:270px;padding:30px}.logo-image-wrap img{max-width:86%;max-height:86%}}


/* V5.11 — content, resources, reviews and motion */
.resource-pack{display:grid;grid-template-columns:1.25fr .75fr;gap:28px;align-items:stretch;padding:26px;border:1px solid rgba(255,255,255,.1);border-radius:30px;background:linear-gradient(135deg,rgba(97,13,152,.14),rgba(255,255,255,.025))}.resource-preview{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;min-height:250px}.resource-preview img{width:100%;height:100%;min-height:210px;object-fit:contain;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07)}.resource-copy{display:flex;flex-direction:column;justify-content:center}.resource-count{color:#d7a6e8;font-size:12px}.resource-copy h3{font-size:32px;margin:14px 0 8px}.resource-copy p{color:#9f95a6;line-height:1.9}.download-btn{align-self:flex-start;margin-top:18px;padding:13px 20px;border-radius:999px;background:#fff;color:#240266;font-size:13px;font-weight:800}.video-grid{grid-template-columns:repeat(3,1fr)}.video-thumb{position:relative;overflow:hidden;background-image:linear-gradient(180deg,rgba(8,4,13,.15),rgba(8,4,13,.88)),var(--thumb);background-position:center;background-size:cover;transition:.35s}.video-thumb:hover{transform:translateY(-5px)}.video-card em{display:block;margin-top:8px;font-size:11px;color:#d7a6e8;font-style:normal}.review-layout{display:grid;grid-template-columns:minmax(300px,.7fr) minmax(0,1.3fr);gap:24px;align-items:start}.review-form{padding:28px;border-radius:26px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(145deg,rgba(97,13,152,.13),rgba(255,255,255,.025))}.review-form h3{font-size:28px;margin:0 0 22px}.review-form label,.review-form legend{font-size:12px;color:#bdb3c2}.review-form input,.review-form textarea{display:block;width:100%;margin:8px 0 17px;padding:14px 15px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;font:inherit;outline:none}.review-form textarea{min-height:115px;resize:vertical}.review-form input:focus,.review-form textarea:focus{border-color:rgba(173,32,221,.7)}.review-form fieldset{border:0;padding:0;margin:0 0 18px}.stars{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:5px;margin-top:8px}.stars input{position:absolute;opacity:0;pointer-events:none}.stars label{font-size:30px;color:#514756;cursor:pointer;line-height:1}.stars input:checked~label,.stars label:hover,.stars label:hover~label{color:#d7a6e8}.review-submit{border:0;border-radius:999px;padding:13px 22px;background:#fff;color:#240266;font:800 13px inherit;cursor:pointer}.review-thanks{min-height:22px;color:#d7a6e8;font-size:13px;margin:14px 0 0}.reviews-empty{padding:40px;border:1px dashed rgba(255,255,255,.14);border-radius:24px;color:#857a8b;text-align:center}.testimonial-card .rating{color:#d7a6e8;letter-spacing:3px;font-size:14px;margin-bottom:12px}.testimonial-track{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.counter{font-variant-numeric:tabular-nums;will-change:contents;transition:transform .18s ease}.counter.counting{animation:counterPulse .55s ease-in-out infinite alternate}@keyframes counterPulse{from{transform:translateY(1px);filter:brightness(.9)}to{transform:translateY(-2px);filter:brightness(1.18)}}
@media(max-width:900px){.resource-pack,.review-layout{grid-template-columns:1fr}.resource-preview{grid-template-columns:repeat(3,1fr)}.resource-preview img{min-height:150px}.video-grid{grid-template-columns:1fr}.testimonial-track{grid-template-columns:1fr}}
@media(max-width:560px){.resource-preview{grid-template-columns:repeat(2,1fr)}.resource-copy h3{font-size:26px}}

/* V5.12 — resource library */
.resource-packs{display:grid;gap:22px}.resource-pack{grid-template-columns:1.15fr .85fr}.resource-preview{overflow:hidden}.resource-preview img{min-width:0}.browse-pack,.pack-download-all{border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:999px;background:#fff;color:#240266;font:800 13px "Thmanyah",sans-serif;text-decoration:none}.browse-pack{align-self:flex-start;margin-top:18px}.pack-modal{position:fixed;inset:0;z-index:9999;background:rgba(5,2,9,.82);backdrop-filter:blur(12px);display:none;padding:28px;overflow:auto}.pack-modal.open{display:block}.pack-panel{position:relative;width:min(1180px,100%);margin:30px auto;padding:34px;border:1px solid rgba(255,255,255,.12);border-radius:30px;background:#0d0812;box-shadow:0 30px 100px rgba(0,0,0,.55)}.pack-close{position:absolute;top:18px;left:18px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#fff;font-size:25px;cursor:pointer}.pack-head{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:4px 56px 26px 0;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:26px}.pack-head span{color:#bda8c8;font-size:12px}.pack-head h3{font-size:clamp(26px,3vw,40px);margin:5px 0 0}.resource-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.resource-item{min-width:0}.resource-item-media{height:245px;position:relative;display:grid;place-items:center;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:rgba(255,255,255,.035);overflow:hidden}.resource-item-media img{display:block;width:100%;height:100%;object-fit:contain}.resource-item h4{margin:10px 4px 0;font-size:14px;color:#d8d0dc}.item-download{position:absolute;left:12px;bottom:12px;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#240266;font-size:20px;font-weight:900;box-shadow:0 8px 24px rgba(0,0,0,.28)}body.pack-open{overflow:hidden}
@media(max-width:900px){.resource-items{grid-template-columns:repeat(3,minmax(0,1fr))}.pack-head{align-items:flex-start;flex-direction:column}.resource-item-media{height:210px}}
@media(max-width:600px){.pack-modal{padding:10px}.pack-panel{padding:22px 14px;border-radius:22px}.pack-head{padding:50px 0 20px}.resource-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.resource-item-media{height:175px;padding:12px}.pack-download-all{width:100%}}

/* V5.13 — refined motion, brand pattern, larger social cards */
body{scroll-behavior:smooth}
.brand-pattern{position:relative;isolation:isolate;overflow:hidden}
.brand-pattern:before{content:"";position:absolute;width:min(34vw,420px);aspect-ratio:778.5/621.8;right:4vw;top:8%;z-index:-1;pointer-events:none;background:url("assets/logo-mark.svg") center/contain no-repeat;opacity:.045;transform:rotate(-8deg)}
.brand-pattern:after{content:"";position:absolute;width:min(24vw,290px);aspect-ratio:778.5/621.8;left:4vw;bottom:7%;z-index:-1;pointer-events:none;background:url("assets/logo-mark.svg") center/contain no-repeat;opacity:.026;transform:rotate(7deg)}
.reveal{transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),filter .9s ease;filter:blur(5px);transform:translateY(34px)}
.reveal.show{filter:none;transform:none}
.portfolio-item,.content-card,.video-card,.resource-pack,.tip,.testimonial-card{transition:transform .45s cubic-bezier(.2,.75,.2,1),border-color .35s ease,background .35s ease,box-shadow .45s ease}
@media (hover:hover) and (pointer:fine){.content-card:hover,.resource-pack:hover,.tip:hover,.testimonial-card:hover{transform:translateY(-6px);border-color:rgba(173,32,221,.28)}.portfolio-item:hover{transform:translateY(-4px)}}
.contact{display:grid;grid-template-columns:minmax(0,.75fr) minmax(520px,1.25fr);gap:60px;align-items:center}
.social-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;min-width:0;width:100%}
.social-cards a{min-height:112px;padding:20px 22px;border:1px solid rgba(255,255,255,.1);border-radius:22px;background:linear-gradient(145deg,rgba(97,13,152,.14),rgba(255,255,255,.025));overflow:hidden;position:relative}
.social-cards a:before{content:"";position:absolute;width:72px;height:72px;left:18px;bottom:14px;background:url("assets/logo-mark.svg") center/contain no-repeat;opacity:.05;transition:.4s}
.social-cards a:hover{padding-right:22px;transform:translateY(-4px);border-color:rgba(173,32,221,.34);background:linear-gradient(145deg,rgba(97,13,152,.25),rgba(255,255,255,.04))}
.social-cards a:hover:before{transform:rotate(12deg) scale(1.12);opacity:.065}
.social-cards .social-name{gap:15px;min-width:0}.social-cards .social-icon{width:46px;height:46px;flex:0 0 46px;padding:11px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09)}
.social-copy{display:flex;flex-direction:column;gap:4px}.social-copy b{font-size:17px}.social-copy small{font-size:11px;color:#998fa0}.social-cards .social-arrow{font-size:20px}
.review-delete{margin-top:14px;border:1px solid rgba(255,255,255,.12);background:transparent;color:#aaa0b3;border-radius:999px;padding:7px 11px;font:600 11px inherit;cursor:pointer;transition:.25s}.review-delete:hover{color:#fff;border-color:rgba(173,32,221,.45);background:rgba(173,32,221,.08)}
@media(max-width:900px){.contact{grid-template-columns:1fr;gap:30px}.social-cards{grid-template-columns:1fr 1fr}.brand-pattern:before{width:min(52vw,300px);right:5vw;top:5%}.brand-pattern:after{width:min(38vw,220px);left:5vw;bottom:4%}.prompt-development:after{width:min(45vw,250px);left:5%;bottom:5%}}
@media(max-width:560px){.social-cards{grid-template-columns:1fr}.social-cards a{min-height:94px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* V5.14 — launch polish + responsive hardening */
.welcome-inner span{font-size:clamp(19px,2.2vw,25px);font-weight:600;letter-spacing:.01em}
.prompt-development{position:relative;min-height:250px;padding:42px;border:1px solid rgba(255,255,255,.10);border-radius:30px;background:radial-gradient(circle at 12% 30%,rgba(173,32,221,.16),transparent 32%),linear-gradient(135deg,rgba(97,13,152,.13),rgba(255,255,255,.025));display:flex;align-items:center;gap:30px;overflow:hidden}
.prompt-development:after{content:"";position:absolute;width:min(30vw,340px);aspect-ratio:778.5/621.8;left:5%;bottom:8%;background:url("assets/logo-mark.svg") center/contain no-repeat;opacity:.035;transform:rotate(-7deg);pointer-events:none}
.prompt-development>img{width:118px;height:118px;object-fit:contain;opacity:.18;filter:drop-shadow(0 16px 34px rgba(173,32,221,.25));flex:0 0 auto}
.prompt-development>div{position:relative;z-index:1;max-width:650px}.prompt-development span{display:inline-flex;padding:8px 13px;border:1px solid rgba(173,32,221,.28);border-radius:999px;background:rgba(173,32,221,.08);color:#d9a6ed;font-size:12px;font-weight:800}.prompt-development h3{margin:16px 0 8px;font-size:clamp(25px,3vw,38px)}.prompt-development p{margin:0;color:#a89dae;line-height:1.9}
html,body{max-width:100%;overflow-x:hidden}img,svg,video{max-width:100%}.section{min-width:0}.hero-copy,.hero-art,.about-copy,.about-visual,.contact>*,.resource-pack>*{min-width:0}
@media(max-width:1024px){.nav{padding-left:24px;padding-right:24px}.section{padding-left:28px;padding-right:28px}.hero{gap:28px}.hero-copy h1{font-size:clamp(46px,7vw,78px)}.contact{grid-template-columns:1fr}.social-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.section{padding-left:18px;padding-right:18px}.prompt-development{padding:28px 22px;min-height:220px}.prompt-development>img{width:82px;height:82px}.resource-pack{grid-template-columns:1fr}.pack-panel{width:100%}.welcome-inner span{font-size:21px}}
@media(max-width:560px){.prompt-development{align-items:flex-start;gap:18px;flex-direction:column}.prompt-development>img{width:68px;height:68px}.section-head{gap:14px}.section-head p{max-width:100%}.hero-copy h1{font-size:clamp(42px,13vw,62px)}.actions{flex-wrap:wrap}.actions .btn{flex:1 1 145px}.social-cards{grid-template-columns:1fr}.logo-project-title{gap:11px}.resource-preview{min-width:0}}


/* V5.18 — final front-end cleanup */
.nav-actions{display:flex;align-items:center;gap:10px}.menu-toggle{display:none;width:44px;height:44px;border:1px solid rgba(255,255,255,.14);border-radius:50%;background:rgba(255,255,255,.05);padding:0;cursor:pointer;place-items:center}.menu-toggle span{position:absolute;width:18px;height:1.5px;background:#fff;border-radius:2px;transition:transform .3s ease,opacity .3s ease}.menu-toggle span:first-child{transform:translateY(-4px)}.menu-toggle span:last-child{transform:translateY(4px)}.menu-toggle[aria-expanded="true"] span:first-child{transform:rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{transform:rotate(-45deg)}
@media(max-width:900px){.nav{height:76px}.nav .brand img{width:145px}.menu-toggle{display:grid;position:relative}.nav nav{display:flex;position:absolute;top:76px;right:16px;left:16px;padding:14px;flex-direction:column;gap:0;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(13,8,18,.96);box-shadow:0 24px 70px rgba(0,0,0,.4);backdrop-filter:blur(18px);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.28s ease}.nav nav.open{opacity:1;visibility:visible;transform:none}.nav nav a{padding:13px 10px;border-bottom:1px solid rgba(255,255,255,.07);font-size:13px}.nav nav a:last-child{border-bottom:0}.hero{padding-top:110px}.hero-art{transform:none!important}.glass-card{max-width:100%}}
@media(max-width:560px){.nav{padding-left:14px!important;padding-right:14px!important}.nav .brand img{width:125px}.nav-cta{padding:9px 12px;font-size:11px}.section{padding-top:72px;padding-bottom:72px}.glass-card{width:min(90vw,390px);height:500px}.stats b{font-size:52px!important}.portfolio-grid{columns:2 140px}.pack-modal{overscroll-behavior:contain}}

/* V5.21 — restore approved filled brand pattern + mobile hero glass ending */
/* Approved pattern: solid/fill logo mark, never the stroke variant. */
.brand-pattern:before,
.brand-pattern:after,
.social-cards a:before,
.prompt-development:after{
  background-image:url("assets/logo-mark.svg") !important;
  background-size:contain !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
}

/* On phones the portrait card must finish directly into the next section.
   Keep the lower part of the portrait/background visually contained by the glass. */
@media(max-width:900px){
  .hero{
    padding-bottom:0 !important;
  }
  .hero-art{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }
  .glass-card{
    overflow:hidden !important;
    margin-bottom:0 !important;
    border-bottom-left-radius:38px !important;
    border-bottom-right-radius:38px !important;
  }
  .portrait{
    bottom:0 !important;
  }
  .ticker{
    position:relative;
    z-index:3;
    margin-top:0 !important;
  }
}
@media(max-width:560px){
  .hero{padding-bottom:0 !important;}
  .glass-card{border-bottom-left-radius:34px !important;border-bottom-right-radius:34px !important;}
}


/* V5.22 — approved visual/system refinements */
/* Filled M mark pattern: large, subtle and distributed across the site. */
/* V5.22 pattern override removed: exact legacy pattern restored below. */

/* Resource download controls — compact, strong arrow instead of thin text glyph. */
.download-icon{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:2.35;stroke-linecap:round;stroke-linejoin:round}
.pack-download-all{gap:10px;min-height:46px}.pack-download-all .download-icon{width:19px;height:19px}
.item-download{width:42px!important;height:42px!important}.item-download .download-icon{width:19px;height:19px}

/* Tips must remain visible even if CMS has no published rows. */
#tips{display:block!important;visibility:visible!important;min-height:420px}
#tips .tips{display:grid!important;visibility:visible!important}
#tips .tip{opacity:1!important;transform:none!important;visibility:visible!important}

/* Cleaner, optically consistent social cards/icons. */
.social-cards{justify-self:center;max-width:760px;margin-inline:auto}
.social-cards a{width:100%;min-height:108px;align-items:center!important}
.social-cards .social-icon{width:44px!important;height:44px!important;flex:0 0 44px!important;padding:10px!important;border-radius:13px!important;background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.1)!important;color:#fff}
.social-cards .social-icon svg{width:23px!important;height:23px!important;display:block;fill:currentColor}
.social-cards .social-arrow{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.055);font-size:16px;line-height:1}

/* Footer: English brand line + development credit on its own line. */
.site-footer{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px}
.site-footer .footer-copy{text-align:center;display:flex;flex-direction:column;gap:6px}
.site-footer .footer-copy strong{color:#fff;font-size:14px;letter-spacing:.16em}.site-footer .footer-copy span{color:#8e8495;font-size:12px}

/* Full-screen pack browser on mobile, with no previous page peeking through. */
@media(max-width:700px){
  .pack-modal{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;padding:0!important;background:#09050f!important;backdrop-filter:none!important;overflow-y:auto!important;overscroll-behavior:contain!important}
  .pack-panel{width:100%!important;min-height:100dvh!important;margin:0!important;padding:76px 16px 28px!important;border:0!important;border-radius:0!important;background:linear-gradient(180deg,#0d0812,#09050f)!important;box-shadow:none!important}
  .pack-close{position:fixed!important;top:16px!important;left:16px!important;z-index:4!important;background:#1b1122!important}
  .pack-head{padding:0 0 20px!important;margin-bottom:20px!important}
  body.pack-open{position:fixed;width:100%;overflow:hidden!important}
}

/* Real side drawer on mobile/tablet. */
.drawer-head{display:none}.menu-backdrop{display:none}
@media(max-width:900px){
  .nav nav{display:flex!important;position:fixed!important;top:0!important;right:0!important;left:auto!important;width:min(86vw,360px)!important;height:100dvh!important;padding:22px 18px!important;flex-direction:column!important;gap:2px!important;border:0!important;border-left:1px solid rgba(255,255,255,.12)!important;border-radius:0!important;background:rgba(10,6,16,.985)!important;box-shadow:-30px 0 80px rgba(0,0,0,.55)!important;backdrop-filter:blur(22px)!important;opacity:1!important;visibility:visible!important;transform:translateX(105%)!important;transition:transform .32s cubic-bezier(.2,.8,.2,1)!important;overflow-y:auto!important;z-index:102!important}
  .nav nav.open{transform:translateX(0)!important}
  .drawer-head{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 18px;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.09);font-weight:800}
  .drawer-close{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;font-size:24px;cursor:pointer}
  .nav nav a{padding:14px 10px!important;border-bottom:1px solid rgba(255,255,255,.065)!important;font-size:14px!important;opacity:.9!important}
  .nav nav .drawer-portfolio{margin-top:12px;border:1px solid rgba(173,32,221,.28)!important;border-radius:14px;background:rgba(97,13,152,.15);color:#ead7f1}
  .menu-backdrop{display:block;position:fixed;inset:0;z-index:49;background:rgba(0,0,0,.58);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.28s}
  .menu-backdrop.open{opacity:1;visibility:visible}
  body.menu-open{overflow:hidden}
}
@media(max-width:560px){
  .social-cards{width:min(100%,430px)!important;margin-inline:auto!important;padding-inline:0!important}
  .social-cards a{width:100%!important;min-height:92px!important;margin-inline:auto!important;padding:16px 18px!important}
  .site-footer{display:flex!important;align-items:center!important;text-align:center!important;flex-direction:column!important;gap:14px!important;padding-inline:18px!important}
  .site-footer .footer-copy{order:2}.site-footer>a{order:3}.site-footer>img{order:1}
}


/* CMS content is always readable; reveal is progressive enhancement only. */
#tips .tip,#tips .tip.reveal,#tips .tip.show{opacity:1!important;filter:none!important;transform:none!important;visibility:visible!important}
.portfolio-grid .portfolio-item,.portfolio-grid .portfolio-item.reveal,.portfolio-grid .portfolio-item.show{opacity:1!important;filter:none!important;transform:none!important;visibility:visible!important}
.dynamic-section{padding-top:90px;padding-bottom:90px}
.dynamic-section-body{max-width:850px;color:#aaa0b3;line-height:2;font-size:16px;white-space:pre-line}
.dynamic-section-media{margin-top:28px;border-radius:26px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.025)}
.dynamic-section-media img{display:block;width:100%;max-height:720px;object-fit:contain;margin:auto}
.dynamic-section-link{display:inline-flex;margin-top:24px;padding:12px 20px;border-radius:999px;background:#fff;color:#240266;font-weight:800;font-size:13px}


/* V5.25 — EXACT pattern rules copied from the user-supplied legacy reference. */
.brand-pattern{position:relative;isolation:isolate;overflow:hidden}
.brand-pattern:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:url("assets/logo-mark.svg");background-size:92px auto;background-repeat:repeat;opacity:.018;transform:rotate(-8deg) scale(1.08)}
.brand-pattern:after{content:"";position:absolute;width:430px;height:430px;left:-180px;top:10%;z-index:-1;pointer-events:none;background:url("assets/logo-mark.svg") center/contain no-repeat;opacity:.035;filter:blur(.2px)}
@media(max-width:900px){.brand-pattern:before{background-size:72px auto}}


/* V5.27 — CMS-safe visual variables. Defaults preserve approved V5.26 appearance. */
:root{--cms-primary:#240266;--cms-accent:#AD20DD;--cms-pattern-image:url("assets/logo-mark.svg");--cms-pattern-size:92px;--cms-pattern-mobile-size:72px;--cms-pattern-opacity:.018;--cms-pattern-rotation:-8deg;--cms-pattern-large-size:430px;--cms-pattern-large-opacity:.035;--cms-hero-mobile-title:40px}
.brand-pattern:before{background-image:var(--cms-pattern-image)!important;background-size:var(--cms-pattern-size) auto!important;opacity:var(--cms-pattern-opacity)!important;transform:rotate(var(--cms-pattern-rotation)) scale(1.08)!important}
.brand-pattern:after{background-image:var(--cms-pattern-image)!important;width:var(--cms-pattern-large-size)!important;height:var(--cms-pattern-large-size)!important;opacity:var(--cms-pattern-large-opacity)!important}
@media(max-width:900px){.brand-pattern:before{background-size:var(--cms-pattern-mobile-size) auto!important}}
@media(max-width:560px){.hero-copy h1{font-size:var(--cms-hero-mobile-title)!important}}

/* V5.28 — MUAADH signature atmosphere: deep cinematic field + icon-only identity pattern. */
:root{
  --cms-bg-base:#08050d;--cms-bg-deep:#100719;--cms-bg-glow:#610D98;
  --cms-bg-glow-opacity:.20;--cms-bg-noise-opacity:.022;
  --cms-pattern-gap:34px;--cms-pattern-mobile-gap:26px;
}
body{position:relative;background:
  radial-gradient(ellipse 70% 48% at 12% 16%,color-mix(in srgb,var(--cms-bg-glow) calc(var(--cms-bg-glow-opacity)*100%),transparent),transparent 70%),
  radial-gradient(ellipse 62% 42% at 92% 47%,rgba(173,32,221,.10),transparent 72%),
  radial-gradient(ellipse 58% 40% at 18% 82%,rgba(97,13,152,.12),transparent 72%),
  linear-gradient(155deg,var(--cms-bg-base) 0%,var(--cms-bg-deep) 48%,#07040b 100%);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;z-index:-20;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.018),transparent 28%,rgba(173,32,221,.025) 55%,transparent 78%)}
.noise{opacity:var(--cms-bg-noise-opacity)!important;mix-blend-mode:soft-light}
.hero-bg{background:linear-gradient(90deg,rgba(7,3,11,.94) 0%,rgba(13,4,22,.78) 44%,rgba(36,2,102,.20) 100%),url("assets/purple-background.png") center/cover no-repeat;opacity:.86}
.content-section,.testimonials{background:linear-gradient(180deg,rgba(255,255,255,.008),rgba(36,2,102,.055) 48%,rgba(255,255,255,.006))}

/* Pattern uses the icon mark only. Two scales create editorial depth without visual noise. */
.brand-pattern:before{inset:-9%!important;background-image:var(--cms-pattern-image)!important;background-repeat:repeat!important;background-size:var(--cms-pattern-size) auto!important;background-position:center!important;opacity:var(--cms-pattern-opacity)!important;transform:rotate(var(--cms-pattern-rotation)) scale(1.12)!important;filter:none!important;mask-image:linear-gradient(115deg,transparent 0%,#000 16%,#000 78%,transparent 100%);-webkit-mask-image:linear-gradient(115deg,transparent 0%,#000 16%,#000 78%,transparent 100%)}
.brand-pattern:after{background-image:var(--cms-pattern-image)!important;background-repeat:no-repeat!important;background-position:center!important;background-size:contain!important;width:var(--cms-pattern-large-size)!important;height:var(--cms-pattern-large-size)!important;left:-8%!important;top:auto!important;bottom:-18%!important;opacity:var(--cms-pattern-large-opacity)!important;transform:rotate(calc(var(--cms-pattern-rotation) * -.55));filter:drop-shadow(0 0 54px rgba(173,32,221,.10))!important}
@media(max-width:900px){body{background-attachment:scroll}.brand-pattern:before{background-size:var(--cms-pattern-mobile-size) auto!important;inset:-7%!important;opacity:calc(var(--cms-pattern-opacity) * .78)!important}.brand-pattern:after{left:-18%!important;bottom:-10%!important;opacity:calc(var(--cms-pattern-large-opacity) * .72)!important}}
@media(max-width:560px){.hero-copy h1{font-size:var(--cms-hero-mobile-title)!important}.brand-pattern:before{mask-image:linear-gradient(120deg,transparent,#000 20%,#000 72%,transparent);-webkit-mask-image:linear-gradient(120deg,transparent,#000 20%,#000 72%,transparent)}}


/* V5.29 — user-managed pattern layers only. */
.brand-pattern:before,.brand-pattern:after{content:none!important;display:none!important;background:none!important}
.cms-pattern-host{position:relative!important;isolation:isolate}
.cms-pattern-layer{position:absolute;left:var(--px);top:var(--py);width:var(--pw);height:auto;transform:translate(-50%,-50%) rotate(var(--pr));opacity:var(--po);pointer-events:none;user-select:none;z-index:-1;object-fit:contain;max-width:none}
@media(max-width:900px){.cms-pattern-layer{width:var(--pmw)}}


/* V5.30 — first-frame stability: never show fallback copy/font before CMS + fonts are ready. */
body.is-loading > :not(.welcome-screen){visibility:hidden}
body.is-loading .welcome-inner{opacity:0;animation:none}
body.site-ready > :not(.welcome-screen){visibility:visible}
body.site-ready .welcome-inner{opacity:1;animation:welcomeIn .7s cubic-bezier(.2,.8,.2,1) both}
@media(max-width:900px){.hero h1{font-size:var(--cms-hero-mobile-title,40px) !important}}
/* V5.31 — independent creative layers */
.social-cards a:before{content:none!important;display:none!important}
.cms-pattern-host{isolation:isolate!important}.cms-pattern-layer{z-index:var(--pz,0)!important}.cms-pattern-back{z-index:calc(-20 + var(--pz,0))!important}.cms-pattern-middle{z-index:calc(2 + var(--pz,0))!important}.cms-pattern-front{z-index:calc(40 + var(--pz,0))!important;pointer-events:none!important}.cms-pattern-layer.hide-desktop{display:none!important}@media(max-width:900px){.cms-pattern-layer.hide-desktop{display:block!important}.cms-pattern-layer.hide-mobile{display:none!important}}
.cms-free-host{position:relative!important}.cms-glass-item{position:absolute;left:var(--gx);top:var(--gy);width:var(--gs);height:auto;transform:translate(-50%,-50%) rotate(var(--gr));opacity:var(--go);pointer-events:none;z-index:5;object-fit:contain;max-width:none}.social-icon img{width:100%;height:100%;object-fit:contain;display:block}
.activity-toast{position:fixed;right:22px;bottom:22px;z-index:10000;max-width:min(360px,calc(100vw - 28px));padding:14px 18px;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:rgba(18,10,25,.82);backdrop-filter:blur(18px);box-shadow:0 18px 60px rgba(0,0,0,.32);font-size:13px;opacity:0;transform:translateY(16px);pointer-events:none;transition:.3s ease}.activity-toast.show{opacity:1;transform:none}@media(max-width:560px){.activity-toast{right:14px;left:14px;bottom:14px;text-align:center}}
/* V5.32 — real live presence indicator */
.online-presence{position:fixed;left:18px;bottom:18px;z-index:2147483000;padding:9px 13px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(15,8,24,.68);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font-size:12px;color:rgba(255,255,255,.82);pointer-events:none;box-shadow:0 12px 35px rgba(0,0,0,.22)}
.online-presence[hidden]{display:none!important}@media(max-width:700px){.online-presence{left:10px;bottom:10px;font-size:11px;padding:7px 10px}}
/* V5.33 — reference-inspired reviews, social art and closing section */
.social-icon{width:68px!important;height:68px!important;padding:4px!important;background:linear-gradient(145deg,#ffffff10,#ad20dd10)!important;overflow:visible!important}.social-icon img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 24px #ad20dd35)}
.testimonial-track{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px!important;overflow:visible!important}.testimonial-card,.testimonial{min-width:0!important;width:auto!important;border:1px solid #ffffff22;border-radius:28px;padding:28px;background:linear-gradient(145deg,#ffffff08,#ffffff03);position:relative}.testimonial-card p,.testimonial p{font-size:20px;line-height:1.9;min-height:110px}.review-head{display:flex;align-items:center;gap:12px;margin-bottom:18px}.review-avatar{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#ad20dd;color:white;font-weight:700}.review-avatar img{width:100%;height:100%;object-fit:cover}.review-meta{display:flex;flex-direction:column}.review-category{display:inline-flex;width:max-content;padding:5px 10px;border-radius:999px;background:#ad20dd22;color:#e7c5f4;font-size:12px}.review-stars{letter-spacing:2px;color:#fff;margin-inline-start:auto}.show-all-reviews{display:block;margin:24px auto 0;background:transparent;border:1px solid #ffffff26}.footer-cta{margin:50px auto 18px;width:min(1420px,calc(100% - 48px));padding:38px 44px;border-radius:34px;background:linear-gradient(135deg,#610d98,#ad20dd);display:flex;align-items:center;justify-content:space-between;gap:30px}.footer-cta h2{font-size:clamp(30px,4vw,58px);margin:8px 0}.footer-cta p{margin:0;color:#f3ddff}.footer-cta a{background:#09060f;color:#fff;padding:17px 22px;border-radius:16px;text-decoration:none;white-space:nowrap}.site-footer{width:min(1420px,calc(100% - 48px));margin:0 auto 28px!important;border:1px solid #ffffff18;border-radius:34px!important;padding:38px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:30px!important;align-items:start!important}.footer-brand img{width:190px}.footer-brand p{color:#a99fb2}.footer-links{display:flex;flex-wrap:wrap;gap:18px;justify-content:flex-start}.footer-links a{color:#c8c0cf;text-decoration:none}.footer-bottom{grid-column:1/-1;border-top:1px solid #ffffff12;padding-top:22px;display:flex;align-items:center;justify-content:space-between}.footer-bottom>a{color:#fff;text-decoration:none}
@media(max-width:760px){.testimonial-track{grid-template-columns:1fr}.testimonial-card p,.testimonial p{font-size:17px;min-height:0}.footer-cta{width:calc(100% - 28px);padding:28px 22px;align-items:stretch;flex-direction:column}.site-footer{width:calc(100% - 28px);padding:26px!important;grid-template-columns:1fr!important}.footer-bottom{grid-column:auto;align-items:flex-start;gap:18px;flex-direction:column}.social-icon{width:58px!important;height:58px!important}}
.video-card{overflow:hidden}.video-main-link{min-height:300px;display:flex;align-items:flex-end;padding:24px;color:#fff;text-decoration:none}.video-metrics{display:flex;gap:12px;flex-wrap:wrap;padding:14px 18px;border-top:1px solid #ffffff15;color:#c8bdcf;font-size:13px}.video-rate{display:flex;gap:4px;padding:0 18px 18px}.video-rate button{background:transparent;padding:3px;color:#fff;font-size:17px}.video-rate button:hover{color:#dca8ff}

/* V5.34 — real video metrics + half-star ratings */
.metric-rating{display:inline-flex!important;align-items:center;gap:2px}.metric-star{display:inline-block;background:linear-gradient(90deg,#fff var(--fill),#514756 var(--fill));-webkit-background-clip:text;background-clip:text;color:transparent;font-size:16px}.metric-rating small{margin-inline-start:5px}.video-rate{align-items:center}.video-rate button{font-size:22px;line-height:1;position:relative}.video-rate output{font-size:12px;color:#bdb3c2;margin-inline-start:8px}.half-rating{position:relative;padding-top:8px}.half-rating input[type=range]{width:180px;margin:0 0 8px;accent-color:#ad20dd}.half-rating output{display:inline-block;margin-inline-start:10px;color:#fff;font-weight:700}.half-rating-stars{letter-spacing:7px;font-size:25px;color:#d7a6e8;line-height:1}.half-rating small{display:block;margin-top:8px;color:#8f8496}.review-stars{display:flex;align-items:center;gap:2px}.review-stars small{margin-inline-start:6px;color:#bdb3c2;font-size:11px}@media(max-width:700px){.video-metrics{gap:8px}.metric-rating{width:100%}}

/* V5.35 — video cards: keep thumbnail and metadata in separate visible areas */
.video-grid .video-card{
  aspect-ratio:auto!important;
  min-height:0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  overflow:hidden!important;
  background:rgba(13,7,19,.82)!important;
  border:1px solid rgba(255,255,255,.12)!important;
}
.video-grid .video-main-link{
  position:relative;
  min-height:0!important;
  aspect-ratio:16/9;
  flex:0 0 auto;
  display:flex!important;
  flex-direction:column;
  justify-content:space-between;
  align-items:flex-start!important;
  padding:22px!important;
  background-image:linear-gradient(180deg,rgba(8,4,13,.08),rgba(8,4,13,.82)),var(--thumb);
  background-position:center;
  background-size:cover;
}
.video-grid .video-main-link>div{width:100%}
.video-grid .video-main-link h3{margin:7px 0 0;line-height:1.25}
.video-grid .video-metrics{
  flex:0 0 auto;
  min-height:54px;
  padding:14px 18px!important;
  background:rgba(10,6,16,.96);
  border-top:1px solid rgba(255,255,255,.09)!important;
}
.video-grid .video-rate{
  flex:0 0 auto;
  min-height:48px;
  padding:0 18px 16px!important;
  background:rgba(10,6,16,.96);
}
@media(max-width:900px){
 .video-grid .video-main-link{aspect-ratio:16/9;padding:18px!important}
 .video-grid .video-metrics{font-size:12px}
}
/* V5.36 — direct half-star review picker + official YouTube metrics */
.review-rating-picker{padding-top:10px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.review-rating-buttons{display:flex;direction:ltr;gap:5px}.review-rating-star{appearance:none;border:0;background:transparent;padding:0 1px;cursor:pointer;font:inherit;font-size:31px;line-height:1;background-image:linear-gradient(90deg,#d7a6e8 var(--fill,100%),#514756 var(--fill,100%));-webkit-background-clip:text;background-clip:text;color:transparent}.review-rating-star:focus-visible{outline:2px solid #ad20dd;outline-offset:4px;border-radius:5px}.review-rating-picker output{font-weight:800;color:#fff;min-width:44px}.youtube-metrics .yt-loading{opacity:.7}.video-metrics.youtube-metrics{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}.video-metrics.youtube-metrics span{white-space:nowrap}

/* V5.37 — mobile-safe half-star touch targets */
.review-rating-star{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
@media(max-width:700px){.review-rating-buttons{gap:2px}.review-rating-star{min-width:48px;min-height:48px;padding:6px 5px;font-size:34px;display:inline-grid;place-items:center}.review-rating-picker{gap:10px}}

/* V5.38 — mobile review form interaction hardening */
#testimonials .review-layout,#testimonials .review-form{position:relative;z-index:3}
#reviewForm,#reviewForm label,#reviewForm fieldset,#reviewForm input,#reviewForm textarea,#reviewForm select,#reviewForm button{pointer-events:auto}
#reviewForm input,#reviewForm textarea,#reviewForm select,#reviewForm button{-webkit-tap-highlight-color:transparent}
#reviewForm input,#reviewForm textarea,#reviewForm select{touch-action:manipulation;font-size:16px}
#reviewForm select{display:block;width:100%;margin:8px 0 17px;padding:14px 15px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:#18101f;color:#fff;font-family:inherit;min-height:48px}
#reviewForm input[type=file]{min-height:52px}
.review-rating-star{touch-action:manipulation;user-select:none;-webkit-user-select:none}
@media(max-width:700px){#reviewForm{isolation:isolate}.review-form{padding:22px 18px}.review-rating-buttons{width:100%;justify-content:flex-start}.review-rating-star{min-width:46px;min-height:50px}.review-submit{min-height:48px;width:100%}}

/* V5.39 — mobile touch hardening: decorative/inactive full-screen layers must never intercept taps. */
@media (hover:none) and (pointer:coarse), (max-width:900px){
  .noise,.hero-bg,.cms-pattern-layer,.cms-glass-item,.online-presence,.activity-toast{pointer-events:none!important}
  .menu-backdrop{pointer-events:none!important}
  .menu-backdrop.open{pointer-events:auto!important}
  #mainNav{pointer-events:none!important}
  #mainNav.open{pointer-events:auto!important}
  .welcome-screen.hide{pointer-events:none!important}
  a,button,input,textarea,select,label,[role="button"],.portfolio-item,.browse-pack,.pack-close,.item-download,.review-rating-star{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
}
.pack-modal:not(.open){pointer-events:none!important}.pack-modal.open{pointer-events:auto!important}

/* V5.40 — owner-only review action */
.delete-own-review{margin-top:14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:rgba(255,255,255,.78);border-radius:999px;padding:8px 13px;font:inherit;font-size:.82rem;cursor:pointer;transition:.2s ease}
.delete-own-review:hover{background:rgba(255,255,255,.11);color:#fff}
.delete-own-review:disabled{opacity:.5;cursor:wait}
@media (max-width:760px){.delete-own-review{min-height:42px;padding:9px 15px}}
/* V5.41 — flexible visual content, search and detail experience */
.dynamic-section{position:relative}.dynamic-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.content-card{overflow:hidden;padding:0!important}.content-card-media{position:relative;display:block;width:100%;aspect-ratio:16/10;border:0;padding:0;background:#130d1d;cursor:pointer}.content-card-media img{width:100%;height:100%;object-fit:cover;display:block}.trend-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(173,32,221,.18);border:1px solid rgba(173,32,221,.35);font-size:12px}.content-card-media .trend-badge{position:absolute;top:12px;right:12px;background:rgba(20,9,31,.82);backdrop-filter:blur(10px)}.content-card-copy{padding:18px}.content-card-copy h3{margin:8px 0}.content-card-copy p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.content-tags{display:flex;flex-wrap:wrap;gap:7px}.content-tags span{font-size:12px;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}.content-card-actions,.content-detail-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}.content-card-actions button,.content-detail-actions button,.show-all-content{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;border-radius:12px;padding:10px 13px;cursor:pointer}.favorite-content{font-size:20px!important;line-height:1}.favorite-content.active{color:#d86cff}.show-all-content{display:block;margin:24px auto 0}.content-detail-modal,.content-explorer{position:fixed;inset:0;z-index:10050;background:rgba(5,3,9,.82);backdrop-filter:blur(12px);display:none;padding:24px;overflow:auto}.content-detail-modal.open,.content-explorer.open{display:block}.content-detail-panel,.content-explorer-panel{position:relative;width:min(980px,100%);margin:20px auto;background:#100b17;border:1px solid rgba(255,255,255,.1);border-radius:28px;padding:28px}.content-detail-close,.content-explorer-close{position:sticky;top:0;z-index:3;float:left;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:#1c1328;color:#fff;font-size:24px;cursor:pointer}.content-detail-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center;clear:both}.content-detail-hero>img{width:100%;max-height:520px;object-fit:cover;border-radius:22px}.content-detail-hero h2{font-size:clamp(32px,5vw,64px);margin:10px 0}.content-prose{font-size:18px;line-height:2;margin:30px 0}.content-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:26px 0}.content-gallery.stack{grid-template-columns:1fr}.content-gallery.slider{display:flex;overflow:auto;scroll-snap-type:x mandatory}.content-gallery.slider figure{min-width:min(78vw,650px);scroll-snap-align:start}.content-gallery figure,.before-after figure,.content-blocks figure{margin:0}.content-gallery img,.before-after img,.content-blocks img{width:100%;border-radius:18px;display:block}.content-gallery figcaption,.before-after figcaption,.content-blocks figcaption{font-size:13px;opacity:.7;padding-top:7px}.before-after{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0}.content-info,.content-blocks{margin:28px 0}.content-blocks p{line-height:1.9}.content-video-link{display:inline-flex;margin:10px 0;color:#d86cff}.content-search-fab{position:fixed;left:22px;bottom:22px;z-index:9000;width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.15);background:rgba(36,2,102,.86);backdrop-filter:blur(12px);color:#fff;font-size:28px;cursor:pointer;box-shadow:0 12px 40px rgba(0,0,0,.28)}.content-explorer-head{clear:both;padding-top:8px}.content-explorer-head h2{font-size:38px;margin:6px 0 16px}.content-explorer-head input{width:100%;padding:15px 17px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:#181020;color:#fff;font:inherit}.content-search-results{display:grid;gap:9px;margin-top:16px}.content-search-results button{text-align:right;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:#fff;padding:14px;border-radius:14px;cursor:pointer}.content-search-results button b,.content-search-results button span{display:block}.content-search-results button span{opacity:.65;font-size:13px;margin-top:4px}.modal-open{overflow:hidden}
@media(max-width:800px){.dynamic-items{grid-template-columns:1fr}.content-detail-modal,.content-explorer{padding:0}.content-detail-panel,.content-explorer-panel{min-height:100%;margin:0;border-radius:0;padding:18px}.content-detail-hero{grid-template-columns:1fr}.content-detail-hero h2{font-size:36px}.content-gallery,.before-after{grid-template-columns:1fr}.content-search-fab{left:14px;bottom:14px;width:50px;height:50px}.content-card-actions button,.content-detail-actions button,.show-all-content{min-height:44px;touch-action:manipulation}.content-detail-close,.content-explorer-close{touch-action:manipulation}}


/* V5.42 — conservative final mobile interaction + video thumbnail repair */
.video-grid .video-main-link{background:#130d1d!important;overflow:hidden;isolation:isolate}
.video-thumb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:0}
.video-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,4,13,.06),rgba(8,4,13,.84));pointer-events:none}
.video-grid .video-main-link .play,.video-grid .video-main-link .video-copy{position:relative;z-index:2}
.lightbox:not(.open),.content-detail-modal:not(.open),.content-explorer:not(.open),.pack-modal:not(.open){pointer-events:none!important}
.lightbox.open,.content-detail-modal.open,.content-explorer.open,.pack-modal.open{pointer-events:auto!important}
@media(max-width:900px){
  a,button,[role="button"],input,select,textarea,.portfolio-item,.browse-pack,.item-download,.open-content,.favorite-content,.show-all-content{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .cms-pattern-layer,.cms-glass-item,.noise,.hero-bg,.brand-pattern:before,.brand-pattern:after{pointer-events:none!important}
  .section,.resource-pack,.portfolio-item,.video-card,.dynamic-section,.content-card{pointer-events:auto}
  .video-grid .video-main-link{min-height:210px!important}
}
/* V5.43 — official YouTube API diagnostics and thumbnail layering */
.video-thumb-img{opacity:1!important;visibility:visible!important;pointer-events:none!important}
.video-metrics .yt-error{opacity:.72}

/* V5.44 — verified Cloudflare YouTube rendering + review rating interaction */
.video-grid .video-card{height:auto!important;overflow:visible!important}
.video-grid .video-main-link{position:relative!important;overflow:hidden!important;min-height:240px!important;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important}
.video-grid .video-thumb-img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;z-index:0!important;display:block!important}
.video-grid .video-shade{z-index:1!important}.video-grid .play,.video-grid .video-copy{z-index:2!important}
.video-grid .youtube-metrics{display:flex!important;position:relative!important;z-index:3!important;min-height:58px!important;visibility:visible!important;opacity:1!important}
.review-rating-buttons{position:relative;z-index:5;pointer-events:auto!important}
.review-rating-star{pointer-events:auto!important;cursor:pointer!important;position:relative;z-index:6}
@media(max-width:900px){.video-grid .video-card{overflow:hidden!important}.video-grid .video-main-link{min-height:210px!important}.review-rating-star{min-width:48px!important;min-height:48px!important}}

/* V5.46 — video card clipping + mobile swipe carousel */
.video-grid .video-card{
  border-radius:28px!important;
  overflow:hidden!important;
  isolation:isolate;
}
.video-grid .video-main-link{
  overflow:hidden!important;
  border-radius:27px 27px 0 0!important;
  clip-path:inset(0 round 27px 27px 0 0);
}
.video-grid .video-thumb-img,
.video-grid .video-shade{
  border-radius:27px 27px 0 0!important;
}
.video-grid .video-thumb-img{
  transform:scale(1.002);
}
@media(max-width:900px){
  #videos{overflow:hidden}
  #videos .video-grid{
    display:flex!important;
    grid-template-columns:none!important;
    gap:14px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:6vw;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x pan-y;
    padding:2px 6vw 16px!important;
    margin-inline:-6vw!important;
    scrollbar-width:none;
  }
  #videos .video-grid::-webkit-scrollbar{display:none}
  #videos .video-card{
    flex:0 0 86vw!important;
    width:86vw!important;
    max-width:520px!important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  #videos .video-main-link{min-height:0!important;aspect-ratio:16/9!important}
}
@media(max-width:560px){
  #videos .video-card{flex-basis:88vw!important;width:88vw!important}
}