/* ═══════════════════════════════════════════════════════════
   ILLUSION EDITOR – CINEMATIC CSS v2 (Interactive)
   =============================================================*/

/* ── Variables ──────────────────────────────────────────────── */
:root {
  --gold:         #c9a84c;
  --gold-light:   #e8c97a;
  --gold-dark:    #9c7a30;
  --purple:       #7c3aff;
  --purple-light: #a78bfa;
  --purple-glow:  rgba(124,58,255,.35);
  --neon-blue:    #3b82f6;
  --bg:           #060606;
  --bg-2:         #0c0b0b;
  --bg-3:         #111010;
  --bg-card:      rgba(16,14,18,.92);
  --surface:      rgba(255,255,255,.03);
  --border:       rgba(255,255,255,.07);
  --border-gold:  rgba(201,168,76,.22);
  --text-primary: #f5f0e8;
  --text-muted:   rgba(245,240,232,.55);
  --text-dim:     rgba(245,240,232,.28);

  --ff-display: 'Playfair Display',Georgia,serif;
  --ff-serif:   'Cormorant Garamond',Georgia,serif;
  --ff-sans:    'Inter',-apple-system,sans-serif;

  --ease-smooth: cubic-bezier(.25,.46,.45,.94);
  --ease-back:   cubic-bezier(.34,1.56,.64,1);
  --ease-expo:   cubic-bezier(.16,1,.3,1);

  --section-pad: clamp(5rem,10vw,9rem);
  --container:   1200px;
  --radius:      12px;
  --radius-lg:   20px;
}

/* ── Reset ──────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:80px;font-size:16px}
body{font-family:var(--ff-sans);background:var(--bg);color:var(--text-primary);overflow-x:hidden;cursor:none;line-height:1.7}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{cursor:none;border:none;background:none}
input,textarea,select{font-family:var(--ff-sans)}

/* ── Scroll Progress Bar ─────────────────────────────────────── */
#scroll-progress{
  position:fixed;top:0;left:0;
  height:2px;width:0%;
  background:linear-gradient(90deg,var(--gold-dark),var(--gold-light),var(--purple-light));
  z-index:10001;
  box-shadow:0 0 12px var(--gold);
  transition:width .1s linear;
}

/* ── Particle Canvas ─────────────────────────────────────────── */
#particle-canvas{
  position:fixed;inset:0;
  z-index:0;pointer-events:none;
  opacity:.6;
}

/* ── Custom Cursor ───────────────────────────────────────────── */
#cursor-glow{
  position:fixed;
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,168,76,.06) 0%,transparent 70%);
  transform:translate(-50%,-50%);
  pointer-events:none;z-index:9997;mix-blend-mode:screen;
  transition:opacity .3s;
}
#cursor-dot{
  position:fixed;
  width:12px;height:12px;border-radius:50%;
  background:var(--gold);
  transform:translate(-50%,-50%);
  pointer-events:none;z-index:10000;
  box-shadow:0 0 14px var(--gold),0 0 28px rgba(201,168,76,.4);
  transition:width .25s var(--ease-back),height .25s var(--ease-back),
             background .2s,border-radius .2s;
  display:flex;align-items:center;justify-content:center;
}
#cursor-text{
  font-size:.45rem;font-weight:700;letter-spacing:.1em;
  color:var(--bg);opacity:0;
  transition:opacity .2s;
  user-select:none;pointer-events:none;
  white-space:nowrap;
}
body.cursor-hover #cursor-dot{
  width:48px;height:48px;
  background:rgba(201,168,76,.15);
  border:1.5px solid var(--gold);
  box-shadow:0 0 30px rgba(201,168,76,.3);
}
body.cursor-play #cursor-dot{
  width:72px;height:72px;
  background:rgba(201,168,76,.9);
  box-shadow:0 0 40px rgba(201,168,76,.6);
}
body.cursor-play #cursor-text{opacity:1;}

/* ── Film Grain ──────────────────────────────────────────────── */
#film-grain{
  position:fixed;inset:-50%;width:200%;height:200%;
  pointer-events:none;z-index:9998;opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='512' height='512' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain .12s steps(1) infinite;
}
@keyframes grain{
  0%  {transform:translate(0,0)}  20% {transform:translate(-3%,2%)}
  40% {transform:translate(2%,-3%)} 60% {transform:translate(-2%,4%)}
  80% {transform:translate(3%,-1%)} 100%{transform:translate(0,0)}
}

/* ── Section Indicator (right side dots) ────────────────────── */
#section-indicator{
  position:fixed;right:1.5rem;top:50%;
  transform:translateY(-50%);
  z-index:900;
  display:flex;flex-direction:column;gap:.7rem;
}
.sec-dot{
  position:relative;
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.2);
  transition:all .3s ease;
  display:block;
}
.sec-dot::before{
  content:attr(data-label);
  position:absolute;right:calc(100% + 10px);top:50%;
  transform:translateY(-50%);
  font-size:.65rem;letter-spacing:.1em;
  color:var(--gold);white-space:nowrap;
  opacity:0;transition:opacity .3s;
  pointer-events:none;
}
.sec-dot:hover::before,.sec-dot.active::before{opacity:1;}
.sec-dot.active{
  background:var(--gold);
  border-color:var(--gold);
  box-shadow:0 0 10px rgba(201,168,76,.5);
  width:10px;height:10px;
}
.sec-dot:hover{background:var(--gold-light);}

/* ── Loading Screen ──────────────────────────────────────────── */
#loader{
  position:fixed;inset:0;background:#000;
  z-index:99999;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .8s ease,visibility .8s ease;
}
#loader.hide{opacity:0;visibility:hidden;pointer-events:none;}
.loader-inner{text-align:center;}

.film-reel{
  width:120px;height:120px;position:relative;
  margin:0 auto 2rem;
  border:2px solid rgba(201,168,76,.3);border-radius:50%;
  animation:reel-spin 1.2s linear infinite;
}
.film-reel::before{
  content:'';position:absolute;inset:8px;
  border:2px solid rgba(201,168,76,.12);border-radius:50%;
}
.reel-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;}
.reel-hub{
  width:28px;height:28px;background:var(--gold);border-radius:50%;
  box-shadow:0 0 30px rgba(201,168,76,.6);
}
.reel-spoke{
  position:absolute;width:2px;height:40px;
  background:linear-gradient(to bottom,var(--gold),transparent);
  border-radius:2px;
}
.reel-spoke:nth-child(1){transform:rotate(0deg) translateY(-20px);}
.reel-spoke:nth-child(2){transform:rotate(120deg) translateY(-20px);}
.reel-spoke:nth-child(3){transform:rotate(240deg) translateY(-20px);}
.reel-hole{position:absolute;width:18px;height:18px;border:1.5px solid var(--gold);border-radius:50%;opacity:.5;}
.reel-hole.top-left{top:10px;left:10px}
.reel-hole.top-right{top:10px;right:10px}
.reel-hole.bottom-left{bottom:10px;left:10px}
.reel-hole.bottom-right{bottom:10px;right:10px}
.film-strip{
  position:absolute;top:0;width:14px;height:120px;
  background:repeating-linear-gradient(to bottom,transparent,transparent 8px,rgba(201,168,76,.2) 8px,rgba(201,168,76,.2) 10px);
}
.film-strip.left-strip{left:-18px}
.film-strip.right-strip{right:-18px}
@keyframes reel-spin{to{transform:rotate(360deg)}}

.loader-brand{
  font-family:var(--ff-display);font-size:clamp(1.4rem,4vw,2rem);
  font-weight:700;letter-spacing:.3em;color:var(--gold);
  text-shadow:0 0 40px rgba(201,168,76,.5);margin-bottom:.3rem;
}
.loader-tagline{font-family:var(--ff-serif);font-size:.9rem;letter-spacing:.15em;color:var(--text-muted);margin-bottom:.5rem;}
.loader-percent{font-family:var(--ff-display);font-size:1.1rem;color:var(--gold);margin-bottom:1.2rem;opacity:.7;}
.loader-bar-wrap{width:220px;height:2px;background:rgba(255,255,255,.07);border-radius:99px;margin:0 auto;overflow:hidden;}
.loader-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--gold-dark),var(--gold-light));box-shadow:0 0 10px var(--gold);}

/* ── Navigation ──────────────────────────────────────────────── */
#navbar{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  padding:1.2rem clamp(1.5rem,5vw,3.5rem);
  display:flex;align-items:center;justify-content:space-between;
  transition:background .4s,backdrop-filter .4s,padding .4s,transform .4s;
}
#navbar.scrolled{
  background:rgba(6,6,6,.88);backdrop-filter:blur(20px);
  padding:.8rem clamp(1.5rem,5vw,3.5rem);
  border-bottom:1px solid var(--border-gold);
}
.nav-logo{display:flex;align-items:center;gap:.6rem;}
.logo-ie{
  width:36px;height:36px;border:1.5px solid var(--gold);border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-display);font-weight:700;font-size:.85rem;
  color:var(--gold);letter-spacing:.05em;
  background:rgba(201,168,76,.05);
  box-shadow:0 0 15px rgba(201,168,76,.15);
  transition:box-shadow .3s;
}
.nav-logo:hover .logo-ie{box-shadow:0 0 25px rgba(201,168,76,.4);}
.logo-text{font-family:var(--ff-serif);font-size:1.1rem;font-weight:600;letter-spacing:.05em;}
.nav-links{display:flex;align-items:center;gap:2.3rem;}
.nav-link{
  font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-muted);position:relative;transition:color .3s;
}
.nav-link::after{
  content:'';position:absolute;bottom:-3px;left:0;
  width:0;height:1px;background:var(--gold);transition:width .3s;
}
.nav-link:hover{color:var(--text-primary);}
.nav-link:hover::after{width:100%;}
.nav-link.nav-cta{
  color:var(--gold);border:1px solid var(--border-gold);
  padding:.5rem 1.2rem;border-radius:4px;
  background:rgba(201,168,76,.05);transition:all .3s;
}
.nav-link.nav-cta::after{display:none;}
.nav-link.nav-cta:hover{background:var(--gold);color:var(--bg);box-shadow:0 0 20px rgba(201,168,76,.4);}
.nav-toggle{display:none;flex-direction:column;gap:5px;padding:4px;}
.nav-toggle span{display:block;width:24px;height:1.5px;background:var(--text-primary);transition:all .3s;}

/* ── Music Toggle ────────────────────────────────────────────── */
#music-toggle{
  position:fixed;bottom:2rem;left:2rem;z-index:1000;
  width:44px;height:44px;border-radius:50%;
  background:rgba(16,14,18,.85);border:1px solid var(--border-gold);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);backdrop-filter:blur(10px);transition:all .3s;
}
#music-toggle svg{width:18px;height:18px;}
#music-toggle:hover{background:var(--gold);color:var(--bg);box-shadow:0 0 20px rgba(201,168,76,.4);}

/* ── Buttons ─────────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.9rem 2rem;border-radius:4px;
  font-size:.86rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  transition:all .35s var(--ease-smooth);
  position:relative;overflow:hidden;
}
.btn::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent);
  opacity:0;transition:opacity .35s;
}
.btn:hover::before{opacity:1;}
.btn svg{width:16px;height:16px;transition:transform .3s;}
.btn:hover svg{transform:translateX(3px);}
.btn-primary{
  background:linear-gradient(135deg,var(--gold-dark),var(--gold),var(--gold-light));
  color:var(--bg);box-shadow:0 4px 25px rgba(201,168,76,.3);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 40px rgba(201,168,76,.5);}
.btn-ghost{border:1px solid rgba(255,255,255,.2);color:var(--text-primary);background:rgba(255,255,255,.03);}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);background:rgba(201,168,76,.05);transform:translateY(-2px);}
.btn-full{width:100%;justify-content:center;}

/* ── Magnetic Button (JS-driven transform) ───────────────────── */
.magnetic-btn{transition:transform .4s var(--ease-back),box-shadow .3s;}

/* ── Section Shared ──────────────────────────────────────────── */
.section{padding:var(--section-pad) 0;position:relative;}
.container{max-width:var(--container);margin:0 auto;padding:0 clamp(1.5rem,5vw,3.5rem);}
.section-header{text-align:center;margin-bottom:clamp(3rem,6vw,5rem);}
.section-eyebrow{
  display:inline-flex;align-items:center;gap:.7rem;
  font-size:.72rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1rem;
}
.eyebrow-line,.section-eyebrow::before,.section-eyebrow::after{
  display:inline-block;width:30px;height:1px;background:var(--gold);opacity:.5;
}
.section-eyebrow::before{content:'';} .section-eyebrow::after{content:'';}
.eyebrow-line{width:40px;}
.section-title{
  font-family:var(--ff-display);font-size:clamp(2.2rem,5vw,3.8rem);
  font-weight:700;line-height:1.15;margin-bottom:1rem;
}
.section-title em{
  font-style:italic;
  background:linear-gradient(135deg,var(--gold-dark),var(--gold-light));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.section-desc{
  font-family:var(--ff-serif);font-size:clamp(1rem,2vw,1.2rem);
  color:var(--text-muted);max-width:580px;margin:0 auto;font-style:italic;
}
.section-noise{
  position:absolute;inset:0;opacity:.012;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── Reveal Animations ───────────────────────────────────────── */
.fade-up{opacity:0;transform:translateY(30px);}
.fade-up.visible{opacity:1;transform:translateY(0);transition:opacity .9s var(--ease-expo),transform .9s var(--ease-expo);}
.reveal-up{opacity:0;transform:translateY(50px);}
.reveal-up.visible{opacity:1;transform:translateY(0);transition:opacity .9s var(--ease-expo),transform .9s var(--ease-expo);}
.reveal-left{opacity:0;transform:translateX(-60px);}
.reveal-left.visible{opacity:1;transform:translateX(0);transition:opacity .9s var(--ease-expo),transform .9s var(--ease-expo);}
.reveal-right{opacity:0;transform:translateX(60px);}
.reveal-right.visible{opacity:1;transform:translateX(0);transition:opacity .9s var(--ease-expo),transform .9s var(--ease-expo);}
.delay-1{transition-delay:.1s!important} .delay-2{transition-delay:.25s!important}
.delay-3{transition-delay:.4s!important} .delay-4{transition-delay:.55s!important}
.delay-5{transition-delay:.7s!important} .delay-6{transition-delay:.85s!important}

/* ══════════════════════════════════ HERO ═════════════════════ */
.hero-section{
  position:relative;height:100dvh;min-height:600px;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.hero-video-bg{position:absolute;inset:0;z-index:0;}
.hero-bg-img{
  width:100%;height:100%;object-fit:cover;object-position:center 40%;
  transform:scale(1.05);will-change:transform;
  animation:ken-burns 20s ease-in-out infinite alternate;
}
@keyframes ken-burns{from{transform:scale(1.05) translate(0,0)}to{transform:scale(1.12) translate(-1%,.5%)}}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(6,6,6,.78) 0%,rgba(6,6,6,.5) 50%,rgba(6,6,6,.75) 100%);
}
.hero-vignette{
  position:absolute;inset:0;
  background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.92) 100%);
}
.lens-flare{position:absolute;border-radius:50%;pointer-events:none;filter:blur(25px);}
.flare-1{width:320px;height:320px;top:8%;right:12%;background:radial-gradient(circle,rgba(201,168,76,.14) 0%,transparent 70%);animation:flare-pulse 7s ease-in-out infinite;}
.flare-2{width:220px;height:220px;top:65%;left:8%;background:radial-gradient(circle,rgba(124,58,255,.12) 0%,transparent 70%);animation:flare-pulse 9s ease-in-out 2s infinite;}
.flare-3{width:180px;height:180px;top:30%;left:40%;background:radial-gradient(circle,rgba(59,130,246,.08) 0%,transparent 70%);animation:flare-pulse 11s ease-in-out 4s infinite;}
@keyframes flare-pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.25)}}

.hero-content{position:relative;z-index:1;text-align:center;padding:0 1.5rem;max-width:950px;}
.hero-eyebrow{
  font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1.2rem;
  display:flex;align-items:center;justify-content:center;gap:.8rem;
}
.eyebrow-line{display:inline-block;width:40px;height:1px;background:var(--gold);opacity:.5;}

.hero-title{
  font-family:var(--ff-display);
  font-size:clamp(3.5rem,10vw,7.5rem);
  font-weight:900;line-height:1;letter-spacing:-.02em;margin-bottom:1rem;
}
/* Glitch */
.glitch-text{
  position:relative;display:inline-block;
  background:linear-gradient(135deg,#fff 0%,var(--gold-light) 50%,#fff 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.glitch-text::before,.glitch-text::after{
  content:attr(data-text);position:absolute;inset:0;
  background:inherit;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.glitch-text::before{left:3px;clip-path:polygon(0 0,100% 0,100% 45%,0 45%);animation:glitch-b 5s infinite linear;}
.glitch-text::after{left:-3px;clip-path:polygon(0 55%,100% 55%,100% 100%,0 100%);animation:glitch-a 5s infinite linear;}
@keyframes glitch-b{0%,88%,92%,100%{transform:translate(0);opacity:0}90%{transform:translate(4px,-2px);opacity:.8}}
@keyframes glitch-a{0%,91%,96%,100%{transform:translate(0);opacity:0}93%{transform:translate(-4px,2px);opacity:.8}}

.hero-subtitle{
  font-family:var(--ff-serif);
  font-size:clamp(1.2rem,3vw,1.9rem);
  color:var(--text-primary);font-weight:300;letter-spacing:.03em;
  margin-bottom:.5rem;min-height:2.4rem;
}
.typewriter-cursor{
  display:inline-block;width:2px;height:1em;
  background:var(--gold);margin-left:2px;
  animation:blink .8s step-end infinite;vertical-align:-.05em;
}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

.hero-tagline{
  font-family:var(--ff-serif);font-size:clamp(.82rem,1.4vw,.98rem);
  color:var(--text-muted);letter-spacing:.12em;text-transform:uppercase;margin-bottom:2.5rem;
}
.hero-actions{display:flex;gap:1.2rem;justify-content:center;flex-wrap:wrap;margin-bottom:3.5rem;}
.hero-stats{display:flex;align-items:center;justify-content:center;gap:2.5rem;flex-wrap:wrap;}
.stat-item{text-align:center;}
.stat-num{font-family:var(--ff-display);font-size:clamp(1.8rem,4vw,2.8rem);font-weight:700;color:var(--gold);line-height:1;}
.stat-suffix{font-family:var(--ff-display);font-size:1.5rem;color:var(--gold-light);}
.stat-label{display:block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);margin-top:.2rem;}
.stat-divider{width:1px;height:40px;background:var(--border-gold);}

.hero-scroll-hint{
  position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  color:var(--text-dim);font-size:.62rem;letter-spacing:.25em;text-transform:uppercase;
}
.scroll-line{width:1px;height:50px;background:linear-gradient(to bottom,var(--gold),transparent);animation:scroll-pulse 2s ease-in-out infinite;}
@keyframes scroll-pulse{0%,100%{opacity:.4;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.2)}}

/* ══════════════════════════════ SHOWREEL ═════════════════════ */
.showreel-section{background:var(--bg-2);}

/* Featured Player */
.featured-video-player{
  position:relative;border-radius:var(--radius-lg);overflow:hidden;
  aspect-ratio:16/9;cursor:none;
  border:1px solid var(--border-gold);
  box-shadow:0 20px 80px rgba(0,0,0,.6),0 0 70px rgba(201,168,76,.07);
  margin-bottom:3rem;transition:box-shadow .4s;
}
.featured-video-player:hover{box-shadow:0 30px 100px rgba(0,0,0,.7),0 0 100px rgba(201,168,76,.14);}
.featured-thumb{width:100%;height:100%;object-fit:cover;transition:transform .7s ease;}
.featured-video-player:hover .featured-thumb{transform:scale(1.04);}
.video-overlay-gradient{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.65) 0%,transparent 55%);}

/* Film strip decoration on featured player */
.featured-film-strip{
  position:absolute;bottom:0;left:0;right:0;height:30px;
  display:flex;align-items:center;justify-content:center;gap:6px;
  background:rgba(0,0,0,.4);backdrop-filter:blur(4px);
  border-top:1px solid rgba(201,168,76,.15);
}
.fs-hole{
  width:16px;height:12px;border-radius:2px;
  border:1px solid rgba(201,168,76,.25);background:rgba(201,168,76,.04);
}

.play-btn-wrap{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-60%);
  display:flex;align-items:center;justify-content:center;
}
.play-ring{
  position:absolute;border-radius:50%;
  border:1.5px solid rgba(201,168,76,.3);
}
.play-ring.r1{width:90px;height:90px;animation:ring-expand 2s ease-out infinite;}
.play-ring.r2{width:90px;height:90px;animation:ring-expand 2s ease-out .7s infinite;}
@keyframes ring-expand{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.2);opacity:0}}
.play-btn{
  width:76px;height:76px;border-radius:50%;
  background:rgba(201,168,76,.92);
  display:flex;align-items:center;justify-content:center;
  color:var(--bg);box-shadow:0 0 40px rgba(201,168,76,.5);
  transition:transform .3s var(--ease-back),box-shadow .3s;
}
.featured-video-player:hover .play-btn{transform:scale(1.1);box-shadow:0 0 60px rgba(201,168,76,.7);}
.play-btn svg{width:28px;height:28px;margin-left:4px;}

.featured-label{
  position:absolute;top:1.5rem;left:1.5rem;right:1.5rem;
  display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
}
.featured-tag{
  font-size:.62rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--bg);background:var(--gold);padding:.25rem .8rem;border-radius:3px;
}
.featured-title{font-family:var(--ff-serif);font-size:1rem;color:var(--text-primary);font-weight:300;}
.featured-badge{
  margin-left:auto;
  display:flex;align-items:center;gap:.4rem;
  font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  padding:.3rem .7rem;border-radius:4px;
  border:1px solid var(--border-gold);
  background:rgba(0,0,0,.4);backdrop-filter:blur(8px);color:var(--gold);
}
.drive-badge{color:var(--gold);}

/* Horizontal Scroll Reel */
.reel-scroll-container{
  position:relative;
  margin:0 -1.5rem;
  padding:0 1.5rem;
}
.reel-scroll-track{
  display:flex;gap:1.5rem;
  overflow-x:auto;scroll-snap-type:x mandatory;
  padding:1rem 0 1.5rem;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  cursor:grab;
  user-select:none;
}
.reel-scroll-track::-webkit-scrollbar{display:none;}
.reel-scroll-track.grabbing{cursor:grabbing;}

.reel-card{
  flex:0 0 320px;border-radius:var(--radius);
  overflow:hidden;border:1px solid var(--border);
  background:var(--bg-card);
  scroll-snap-align:start;
  transition:border-color .4s,box-shadow .4s,transform .3s;
  cursor:none;
}
.reel-card:hover{border-color:var(--border-gold);box-shadow:0 15px 50px rgba(0,0,0,.5),0 0 30px rgba(201,168,76,.1);transform:translateY(-4px);}
.reel-card-img{position:relative;aspect-ratio:16/9;overflow:hidden;}
.reel-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease;}
.reel-card:hover .reel-card-img img{transform:scale(1.08);}
.reel-card-overlay{
  position:absolute;inset:0;background:rgba(0,0,0,.5);
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .3s;
}
.reel-card:hover .reel-card-overlay{opacity:1;}
.reel-play-icon{
  width:52px;height:52px;border-radius:50%;background:var(--gold);
  display:flex;align-items:center;justify-content:center;color:var(--bg);
  transform:scale(.7);transition:transform .35s var(--ease-back);
  box-shadow:0 0 25px rgba(201,168,76,.5);
}
.reel-card:hover .reel-play-icon{transform:scale(1);}
.reel-play-icon svg{width:20px;height:20px;margin-left:3px;}

.reel-source-tag{
  position:absolute;top:.7rem;right:.7rem;
  font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:.2rem .5rem;border-radius:3px;
  background:rgba(0,0,0,.65);backdrop-filter:blur(8px);
  color:var(--gold);border:1px solid var(--border-gold);
}

.reel-card-info{padding:1rem 1.2rem;display:flex;align-items:center;gap:.7rem;}
.reel-tag{font-size:.6rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;padding:.2rem .6rem;border-radius:3px;white-space:nowrap;}
.reel-tag.wedding{background:rgba(201,168,76,.15);color:var(--gold);border:1px solid var(--border-gold);}
.reel-tag.commercial{background:rgba(124,58,255,.15);color:var(--purple-light);border:1px solid rgba(124,58,255,.25);}
.reel-tag.model{background:rgba(59,130,246,.15);color:#93c5fd;border:1px solid rgba(59,130,246,.25);}
.reel-tag.event{background:rgba(16,185,129,.15);color:#6ee7b7;border:1px solid rgba(16,185,129,.25);}
.reel-card-info h3{font-family:var(--ff-serif);font-size:.88rem;font-weight:400;flex:1;color:var(--text-primary);}
.reel-dur{font-size:.7rem;color:var(--text-dim);white-space:nowrap;}

/* Arrow buttons for reel */
.reel-scroll-btn{
  position:absolute;top:50%;transform:translateY(-60%);
  width:42px;height:42px;border-radius:50%;z-index:10;
  background:rgba(8,8,8,.85);border:1px solid var(--border-gold);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);backdrop-filter:blur(10px);
  transition:all .3s;opacity:.7;
}
.reel-scroll-btn:hover{background:var(--gold);color:var(--bg);opacity:1;box-shadow:0 0 20px rgba(201,168,76,.4);}
.reel-scroll-btn svg{width:18px;height:18px;}
.reel-scroll-left{left:.5rem;}
.reel-scroll-right{right:.5rem;}

.reel-drag-hint{
  text-align:center;margin-top:.8rem;
  font-size:.68rem;letter-spacing:.15em;color:var(--text-dim);
}

/* ══════════════════════════════ SERVICES ═════════════════════ */
.services-section{background:var(--bg-3);}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;}
.service-card{
  position:relative;
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius-lg);overflow:hidden;
  transition:border-color .4s,transform .4s;
  transition-delay:var(--delay,0s);
  cursor:default;
}
.service-card:hover{border-color:var(--border-gold);transform:translateY(-8px);}
.service-card-inner{padding:2.2rem 1.8rem 2rem;position:relative;z-index:1;}
.service-glow{
  position:absolute;bottom:-80px;left:50%;transform:translateX(-50%);
  width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,168,76,.18) 0%,transparent 70%);
  opacity:0;transition:opacity .4s;pointer-events:none;filter:blur(20px);
}
.service-card:hover .service-glow{opacity:1;}

/* Animated border */
.service-border-anim{
  position:absolute;inset:0;border-radius:var(--radius-lg);
  background:linear-gradient(90deg,transparent,rgba(201,168,76,.15),transparent);
  background-size:200% 100%;opacity:0;
  transition:opacity .4s;
  animation:shimmer 2.5s linear infinite paused;
}
.service-card:hover .service-border-anim{opacity:1;animation-play-state:running;}
@keyframes shimmer{from{background-position:-200% 0}to{background-position:200% 0}}

.service-icon{width:55px;height:55px;margin-bottom:1.2rem;color:var(--gold);opacity:.85;}
.service-icon svg{width:100%;height:100%;}
.service-num{
  position:absolute;top:1.2rem;right:1.5rem;
  font-family:var(--ff-display);font-size:4rem;font-weight:900;
  color:rgba(255,255,255,.025);line-height:1;pointer-events:none;
}
.service-title{font-family:var(--ff-display);font-size:1.35rem;font-weight:700;margin-bottom:.9rem;}
.service-desc-text{font-family:var(--ff-serif);font-size:.92rem;color:var(--text-muted);line-height:1.7;margin-bottom:1.3rem;font-style:italic;}
.service-features{margin-bottom:1.5rem;display:flex;flex-direction:column;gap:.4rem;}
.service-features li{font-size:.78rem;color:var(--text-muted);display:flex;align-items:center;gap:.5rem;}
.service-features li::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--gold);flex-shrink:0;}
.service-link{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);
  transition:gap .3s;
}
.service-link svg{width:13px;height:13px;transition:transform .3s;}
.service-link:hover{gap:.8rem;}
.service-link:hover svg{transform:translateX(3px);}

/* ══════════════════════════════ ABOUT ════════════════════════ */
.about-section{background:var(--bg-2);}
.about-container{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,6vw,6rem);align-items:center;}
.about-image-col{position:relative;}
.about-img-frame{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-gold);box-shadow:0 20px 80px rgba(0,0,0,.5);}
.about-img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .6s;}
.about-img-frame:hover .about-img{transform:scale(1.03);}
.about-img-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 50%,rgba(0,0,0,.55) 100%);}
.about-img-border{position:absolute;inset:12px;border:1px solid rgba(201,168,76,.18);border-radius:8px;pointer-events:none;}

/* Animated corner brackets */
.about-img-corner{position:absolute;width:20px;height:20px;pointer-events:none;}
.about-img-corner.tl{top:6px;left:6px;border-top:2px solid var(--gold);border-left:2px solid var(--gold);}
.about-img-corner.tr{top:6px;right:6px;border-top:2px solid var(--gold);border-right:2px solid var(--gold);}
.about-img-corner.bl{bottom:6px;left:6px;border-bottom:2px solid var(--gold);border-left:2px solid var(--gold);}
.about-img-corner.br{bottom:6px;right:6px;border-bottom:2px solid var(--gold);border-right:2px solid var(--gold);}

.about-badge{
  position:absolute;bottom:-1.5rem;right:-1.5rem;
  background:linear-gradient(135deg,var(--bg-3),var(--bg-2));
  border:1px solid var(--border-gold);border-radius:var(--radius);
  padding:1.2rem 1.5rem;text-align:center;
  box-shadow:0 8px 30px rgba(0,0,0,.5),0 0 30px rgba(201,168,76,.12);
}
.badge-num{display:block;font-family:var(--ff-display);font-size:2.2rem;font-weight:900;color:var(--gold);line-height:1;}
.badge-text{font-size:.7rem;letter-spacing:.06em;color:var(--text-muted);line-height:1.4;}

.about-content-col .section-eyebrow,.about-content-col .section-title{text-align:left;}
.about-content-col .section-title::before,.about-content-col .section-title::after{display:none;}
.about-para{font-family:var(--ff-serif);font-size:1.03rem;color:var(--text-muted);line-height:1.8;margin-bottom:1rem;}
.about-para strong{color:var(--text-primary);font-weight:500;}

/* Skills */
.skills-wrap{margin:1.5rem 0;display:flex;flex-direction:column;gap:.9rem;}
.skill-row{display:flex;align-items:center;gap:.8rem;}
.skill-name{font-size:.74rem;font-weight:600;letter-spacing:.08em;color:var(--text-muted);width:120px;flex-shrink:0;}
.skill-bar{flex:1;height:3px;background:rgba(255,255,255,.05);border-radius:99px;overflow:hidden;}
.skill-fill{height:100%;width:0;background:linear-gradient(90deg,var(--gold-dark),var(--gold-light));border-radius:99px;transition:width 1.2s var(--ease-expo);box-shadow:0 0 8px rgba(201,168,76,.4);}
.skill-pct{font-size:.7rem;color:var(--gold);width:35px;text-align:right;}

/* Timeline */
.timeline{margin:2rem 0 0;position:relative;display:flex;flex-direction:column;}
.timeline::before{
  content:'';position:absolute;left:7px;top:10px;bottom:10px;
  width:1px;background:linear-gradient(to bottom,var(--gold),var(--purple),transparent);opacity:.3;
}
.timeline-item{display:flex;gap:1.5rem;padding:0 0 1.8rem;position:relative;}
.timeline-dot{
  flex-shrink:0;width:15px;height:15px;border-radius:50%;
  border:1.5px solid var(--gold);background:var(--bg-2);
  margin-top:.2rem;display:flex;align-items:center;justify-content:center;
}
.timeline-dot.gold{border-color:var(--gold);}
.timeline-dot.purple{border-color:var(--purple-light);}
.timeline-dot-inner{width:5px;height:5px;border-radius:50%;background:var(--gold);}
.timeline-dot.purple .timeline-dot-inner{background:var(--purple-light);}
.timeline-year{font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:.2rem;}
.timeline-title{font-family:var(--ff-display);font-size:1rem;font-weight:700;margin-bottom:.3rem;}
.timeline-desc{font-family:var(--ff-serif);font-size:.88rem;color:var(--text-muted);line-height:1.6;font-style:italic;}

/* ══════════════════════════════ PORTFOLIO ════════════════════ */
.portfolio-section{background:var(--bg-3);}
.portfolio-tabs{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin-bottom:3rem;position:relative;}
.portfolio-tabs::after{
  content:'';position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);
  width:100px;height:1px;background:var(--border-gold);
}

/* Wedding Sub-Tabs Modern Redesign */
.wedding-subtabs {
  display: flex; gap: 0.6rem; justify-content: center; flex-wrap: wrap;
  margin: 1.5rem auto 0; padding: 0.6rem; max-width: 900px;
  background: rgba(12, 12, 12, 0.4); backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.05); border-radius: 99px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.5), inset 0 0 20px rgba(201,168,76,0.02);
  animation: subtab-in 0.4s var(--ease-expo); position: relative; z-index: 5;
}
.wedding-subtabs[hidden] { display: none; }
@keyframes subtab-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }

@media (max-width: 768px) {
  .wedding-subtabs {
    justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto;
    border-radius: 12px; padding: 0.8rem; margin: 1rem auto;
    mask-image: linear-gradient(to right, black 85%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black 85%, transparent 100%);
  }
  .wedding-subtabs::-webkit-scrollbar { display: none; }
}

.subtab-btn {
  padding: 0.55rem 1.4rem; border-radius: 99px; font-size: 0.72rem;
  font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--text-dim); border: 1px solid transparent; background: transparent;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1); cursor: none;
  white-space: nowrap; display: flex; align-items: center; gap: 0.5rem;
}
.subtab-btn:hover {
  color: var(--text-primary); background: rgba(255,255,255,0.03);
  transform: translateY(-2px);
}
.subtab-btn.active {
  color: var(--bg); background: linear-gradient(135deg, var(--gold-dark), var(--gold-light));
  border-color: transparent; box-shadow: 0 8px 25px rgba(201,168,76,0.4);
  transform: translateY(-2px);
}

/* Sub-tab description strip */
.subtab-desc {
  display: table; margin: 1.2rem auto 2.5rem;
  font-family: var(--ff-serif); font-style: italic; font-size: 0.9rem;
  color: var(--gold); animation: subtab-in 0.4s ease;
  padding: 0.8rem 1.8rem; border-radius: 99px;
  background: rgba(201,168,76,0.06); border: 1px solid rgba(201,168,76,0.15);
  box-shadow: 0 0 25px rgba(201,168,76,0.08); text-align: center;
}
.subtab-desc[hidden] { display: none; }

/* Wedding type tag colors */
.pf-tag.w-highlight  {background:rgba(234,179,8,.18);  color:#fde047;border:1px solid rgba(234,179,8,.25);}
.pf-tag.w-destination{background:rgba(99,102,241,.18); color:#a5b4fc;border:1px solid rgba(99,102,241,.25);}
.pf-tag.w-prewedding {background:rgba(236,72,153,.18); color:#f9a8d4;border:1px solid rgba(236,72,153,.25);}
.pf-tag.w-teaser     {background:rgba(249,115,22,.18); color:#fdba74;border:1px solid rgba(249,115,22,.25);}
.pf-tag.w-engagement {background:rgba(52,211,153,.18); color:#6ee7b7;border:1px solid rgba(52,211,153,.25);}
.pf-tag.w-sangeet    {background:rgba(168,85,247,.18);  color:#c4b5fd;border:1px solid rgba(168,85,247,.25);}
.pf-tag.w-haldi      {background:rgba(234,179,8,.22);   color:#fde68a;border:1px solid rgba(234,179,8,.3);}
.tab-btn{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.6rem 1.4rem;border-radius:4px;
  font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-muted);border:1px solid var(--border);background:transparent;
  transition:all .3s;cursor:none;
}
.tab-btn:hover{color:var(--text-primary);border-color:var(--border-gold);}
.tab-btn.active{
  color:var(--bg);
  background:linear-gradient(135deg,var(--gold-dark),var(--gold-light));
  border-color:transparent;box-shadow:0 4px 20px rgba(201,168,76,.3);
}
.portfolio-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
  grid-auto-rows:280px;
  grid-auto-flow:dense;
  gap:1.2rem;
}
.portfolio-item{
  position:relative;border-radius:var(--radius-lg);overflow:hidden;
  cursor:none;border:1px solid var(--border);
  background:var(--bg-card);
  transition:border-color .4s,box-shadow .5s,transform .4s;
  will-change:transform, opacity;
}
.portfolio-item.wide{grid-column:span 2;}
.portfolio-item.tall{grid-row:span 2;}

.portfolio-item img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1.2s var(--ease-expo), filter 0.8s;
}
.portfolio-item:hover img{
  transform:scale(1.12);
  filter:brightness(1.15) contrast(1.1);
}
.portfolio-item:hover{
  border-color:var(--border-gold);
  box-shadow:0 30px 80px rgba(0,0,0,.8), 0 0 50px rgba(201,168,76,.12);
  z-index:10;
}

.portfolio-item-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.95) 0%, rgba(0,0,0,.2) 50%, transparent 100%);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:1.5rem;opacity:0;transition:opacity .5s;
}
.portfolio-item:hover .portfolio-item-overlay{opacity:1;}

.portfolio-item-info{
  flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:.4rem;
  transform:translateY(20px);transition:transform .5s var(--ease-expo);
}
.portfolio-item:hover .portfolio-item-info{transform:translateY(0);}

.pf-tag{
  font-size:.65rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  padding:.3rem .8rem;border-radius:4px;width:fit-content;backdrop-filter:blur(5px);
  background:rgba(5,4,5,.7);
}
.pf-tag.wedding{color:var(--gold);border:1px solid rgba(201,168,76,.3);}
.pf-tag.commercial{color:var(--purple-light);border:1px solid rgba(124,58,255,.3);}
.pf-tag.model{color:#93c5fd;border:1px solid rgba(59,130,246,.3);}
.pf-tag.event{color:#6ee7b7;border:1px solid rgba(16,185,129,.3);}

.portfolio-item-info h3{
  font-family:var(--ff-display);font-size:1.4rem;font-weight:700;
  color:#fff;margin-bottom:.2rem;
}
.portfolio-item-info p{font-size:.85rem;color:var(--text-muted);font-style:italic;font-family:var(--ff-serif);}

.pf-play-btn{
  position:absolute;right:1.5rem;bottom:1.5rem;
  width:48px;height:48px;border-radius:50%;background:rgba(201,168,76,.9);
  display:flex;align-items:center;justify-content:center;color:var(--bg);
  transform:scale(0);transition:transform .4s var(--ease-back);
  box-shadow:0 0 25px rgba(201,168,76,.4);
}
.pf-play-btn svg{width:18px;height:18px;margin-left:3px;}
.portfolio-item:hover .pf-play-btn{transform:scale(1);}
.portfolio-item.hidden{opacity:0;pointer-events:none;transform:scale(.94);}

/* ══════════════════════════════ TESTIMONIALS ═════════════════ */
.testimonials-section{background:var(--bg-2);}
.testimonials-track-wrap{overflow:hidden;margin-bottom:1.5rem;}
.testimonials-track{display:flex;gap:1.5rem;transition:transform .65s var(--ease-expo);}
.testimonial-card{
  min-width:calc(50% - .75rem);
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:2.5rem 2rem 2rem;
  position:relative;transition:border-color .3s;
}
.testimonial-card:hover{border-color:var(--border-gold);}
.quote-mark{
  position:absolute;top:.8rem;left:1.5rem;
  font-family:var(--ff-display);font-size:7rem;font-weight:900;
  color:var(--gold);opacity:.07;line-height:1;pointer-events:none;
}
.testimonial-text{
  font-family:var(--ff-serif);font-size:clamp(1rem,1.4vw,1.12rem);
  color:var(--text-primary);line-height:1.8;font-style:italic;
  margin-bottom:2rem;position:relative;z-index:1;
}
.testimonial-author{display:flex;align-items:center;gap:1rem;}
.author-avatar{
  width:44px;height:44px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--gold-dark),var(--purple));
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-display);font-weight:700;font-size:1.1rem;
}
.author-name{display:block;font-size:.86rem;font-weight:600;font-style:normal;}
.author-event{display:block;font-size:.72rem;color:var(--text-muted);margin-top:.1rem;}
.testimonial-stars{margin-left:auto;color:var(--gold);font-size:.85rem;letter-spacing:.1em;}

/* Progress bar */
.testi-progress-wrap{
  width:100%;height:2px;background:rgba(255,255,255,.05);
  border-radius:99px;overflow:hidden;margin-bottom:1.5rem;
}
.testi-progress-bar{
  height:100%;width:0%;
  background:linear-gradient(90deg,var(--gold-dark),var(--gold-light));
  box-shadow:0 0 8px var(--gold);
  transition:width .1s linear;
}

.testimonial-nav{display:flex;align-items:center;justify-content:center;gap:1.5rem;}
.testi-arrow{
  width:44px;height:44px;border-radius:50%;
  border:1px solid var(--border-gold);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);transition:all .3s;cursor:none;
}
.testi-arrow svg{width:18px;height:18px;}
.testi-arrow:hover{background:var(--gold);color:var(--bg);box-shadow:0 0 20px rgba(201,168,76,.3);}
.testi-dots{display:flex;gap:.5rem;align-items:center;}
.testi-dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--border);border:1px solid var(--border-gold);
  transition:all .3s;cursor:none;
}
.testi-dot.active{background:var(--gold);width:22px;border-radius:3px;box-shadow:0 0 8px rgba(201,168,76,.4);}

/* ══════════════════════════════ VIDEO MODAL ══════════════════ */
.video-modal{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;padding:1.5rem;
}
.video-modal[hidden]{display:none;}
.video-modal-backdrop{
  position:absolute;inset:0;
  background:rgba(0,0,0,.92);backdrop-filter:blur(10px);
}
.video-modal-content{
  position:relative;width:100%;max-width:920px;
  border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid var(--border-gold);
  box-shadow:0 0 100px rgba(201,168,76,.2);
  animation:modal-in .4s var(--ease-expo);
}
@keyframes modal-in{from{transform:scale(.88) translateY(20px);opacity:0}}
.modal-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:.9rem 1.2rem;
  background:rgba(8,8,8,.9);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border-gold);
}
.modal-title{font-family:var(--ff-serif);font-size:.95rem;color:var(--text-primary);font-weight:400;}
.modal-close{
  width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.06);border:1px solid var(--border);
  color:var(--text-primary);font-size:1.3rem;
  display:flex;align-items:center;justify-content:center;
  transition:all .3s;cursor:none;
}
.modal-close:hover{background:var(--gold);color:var(--bg);border-color:var(--gold);}
.video-iframe-wrap{aspect-ratio:16/9;background:#000;}
.video-iframe-wrap iframe{width:100%;height:100%;display:block;}
.modal-footer-bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:.7rem 1.2rem;
  background:rgba(8,8,8,.9);border-top:1px solid var(--border);
}
.modal-source-badge{
  font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  padding:.25rem .7rem;border-radius:3px;
  background:rgba(201,168,76,.1);color:var(--gold);border:1px solid var(--border-gold);
}
.modal-open-ext{
  display:flex;align-items:center;gap:.4rem;
  font-size:.72rem;font-weight:500;color:var(--text-muted);
  transition:color .2s;
}
.modal-open-ext svg{width:13px;height:13px;}
.modal-open-ext:hover{color:var(--gold);}

/* ══════════════════════════════ CONTACT ══════════════════════ */
.contact-section{position:relative;padding:var(--section-pad) 0;overflow:hidden;}
.contact-bg-img{position:absolute;inset:0;z-index:0;}
.contact-bg-img img{width:100%;height:100%;object-fit:cover;opacity:.1;}
.contact-bg-overlay{position:absolute;inset:0;background:linear-gradient(135deg,var(--bg) 40%,rgba(6,6,6,.85) 100%);}
.contact-container{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,6vw,6rem);align-items:start;}
.contact-desc{font-family:var(--ff-serif);font-size:1.03rem;color:var(--text-muted);line-height:1.8;font-style:italic;margin-bottom:2.5rem;}
.contact-links{display:flex;flex-direction:column;gap:.9rem;}
.contact-link-item{
  display:flex;align-items:center;gap:.85rem;padding:.85rem 1.1rem;
  border-radius:var(--radius);border:1px solid var(--border);
  background:var(--surface);font-size:.88rem;
  transition:all .3s;
}
.contact-link-item svg:first-child{width:22px;height:22px;flex-shrink:0;}
.contact-link-item span{flex:1;}
.link-arrow{width:16px;height:16px;margin-left:auto;opacity:0;transform:translateX(-5px);transition:all .3s;}
.contact-link-item:hover .link-arrow{opacity:1;transform:translateX(0);}
.contact-link-item:hover{transform:translateX(6px);}
.contact-link-item.whatsapp{color:#25d366;}
.contact-link-item.whatsapp:hover{border-color:#25d366;background:rgba(37,211,102,.08);}
.contact-link-item.instagram{color:#d62976;}
.contact-link-item.instagram:hover{border-color:#d62976;background:rgba(214,41,118,.08);}
.contact-link-item.youtube{color:#ff0000;}
.contact-link-item.youtube:hover{border-color:#ff0000;background:rgba(255,0,0,.08);}

.contact-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2.5rem;backdrop-filter:blur(10px);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.form-group{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.1rem;}
.form-group label{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);}
.form-group input,.form-group select,.form-group textarea{
  background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:6px;
  padding:.8rem 1rem;color:var(--text-primary);font-size:.88rem;outline:none;
  transition:border-color .3s,box-shadow .3s;-webkit-appearance:none;
}
.form-group select option{background:var(--bg-2);color:var(--text-primary);}
.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-dim);}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{
  border-color:var(--border-gold);box-shadow:0 0 0 3px rgba(201,168,76,.1);
}
.form-group input[type="date"]{color-scheme:dark;}
.form-group textarea{resize:vertical;min-height:110px;}
.form-success{display:flex;align-items:center;gap:.7rem;padding:1rem 1.2rem;border-radius:6px;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.3);color:#6ee7b7;font-size:.88rem;margin-top:1rem;}
.form-success svg{width:18px;height:18px;flex-shrink:0;}
.form-success[hidden]{display:none;}

/* ══════════════════════════════ FOOTER ═══════════════════════ */
.site-footer{background:#000;border-top:1px solid var(--border-gold);position:relative;overflow:hidden;}
.footer-grain{position:absolute;inset:0;opacity:.018;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23n)'/%3E%3C/svg%3E");}
.footer-container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:2rem;padding-top:3rem;padding-bottom:2.5rem;}
.footer-brand{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;}
.footer-brand-name{font-family:var(--ff-serif);font-size:1.1rem;}
.footer-tagline{width:100%;font-family:var(--ff-serif);font-size:.8rem;font-style:italic;color:var(--text-dim);margin-top:-.5rem;}
.footer-nav{display:flex;gap:1.8rem;flex-wrap:wrap;}
.footer-nav a{font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);transition:color .3s;}
.footer-nav a:hover{color:var(--gold);}
.footer-socials{display:flex;gap:.7rem;}
.footer-socials a{width:38px;height:38px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-muted);transition:all .3s;}
.footer-socials a svg{width:15px;height:15px;}
.footer-socials a:hover{border-color:var(--gold);color:var(--gold);background:rgba(201,168,76,.08);}
.footer-bottom{border-top:1px solid var(--border);padding:1.2rem clamp(1.5rem,5vw,3.5rem);display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;}
.footer-bottom p{font-size:.73rem;color:var(--text-dim);letter-spacing:.05em;}
.footer-crafted span{color:var(--gold);}

/* ══════════════════════════════ RESPONSIVE ═══════════════════ */
@media(max-width:1100px){.services-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:900px){
  body{cursor:auto;}
  #cursor-glow,#cursor-dot,#section-indicator{display:none;}
  button,.reel-card,.tab-btn,.subtab-btn,.testi-arrow,.modal-close,.reel-scroll-btn{cursor:pointer;}
  .nav-links{
    position:fixed;top:0;right:-100%;bottom:0;
    width:min(300px,85vw);background:rgba(6,6,6,.97);
    backdrop-filter:blur(20px);border-left:1px solid var(--border-gold);
    flex-direction:column;align-items:flex-start;padding:6rem 2rem 2rem;
    gap:0;transition:right .4s var(--ease-expo);
  }
  .nav-links.open{right:0;}
  .nav-links li{width:100%;}
  .nav-link{display:block;padding:.9rem 0;font-size:1rem;border-bottom:1px solid var(--border);}
  .nav-link.nav-cta{border:none;margin-top:1rem;text-align:center;}
  .nav-toggle{display:flex;z-index:1200;}
  .nav-toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px);}
  .nav-toggle.open span:nth-child(2){opacity:0;}
  .nav-toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px);}
  .about-container{grid-template-columns:1fr;gap:4rem;}
  .about-image-col{max-width:450px;margin:0 auto;}
  .contact-container{grid-template-columns:1fr;}
  .testimonial-card{min-width:calc(100%);}
  .testimonials-track{gap:0;}
  .reel-card{flex:0 0 280px;}
}
@media(max-width:700px){
  .portfolio-grid{grid-template-columns:1fr 1fr;grid-auto-rows:200px;}
  .portfolio-item.wide{grid-column:span 2;}
  .services-grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .hero-stats{gap:1.5rem;}
  .stat-divider{display:none;}
  .footer-container{flex-direction:column;gap:1.5rem;}
  .footer-bottom{flex-direction:column;text-align:center;}
}
@media(max-width:480px){
  .portfolio-grid{grid-template-columns:1fr;}
  .portfolio-item.wide{grid-column:span 1;}
  .contact-form{padding:1.5rem;}
  .about-badge{bottom:-1rem;right:-.5rem;padding:.9rem;}
  .badge-num{font-size:1.8rem;}
  .reel-card{flex:0 0 260px;}
  #music-toggle{bottom:1rem;left:1rem;}
}

::selection{background:rgba(201,168,76,.3);color:var(--text-primary);}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--gold-dark);border-radius:99px;}
::-webkit-scrollbar-thumb:hover{background:var(--gold);}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;}

/* ══════════════════ BEST WEDDING WORK SECTION ══════════════ */
.best-work-section{
  background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg-3) 50%,var(--bg-2) 100%);
  overflow:hidden;
}

/* Film strip side pillars */
.film-strip-left,.film-strip-right{
  position:absolute;top:0;bottom:0;width:28px;
  display:flex;flex-direction:column;
  align-items:center;justify-content:space-around;
  background:rgba(201,168,76,.03);
  border:1px solid rgba(201,168,76,.06);
  z-index:0;pointer-events:none;
  animation:film-march 4s linear infinite;
}
.film-strip-left{left:0;}
.film-strip-right{right:0;}
.film-hole{
  width:14px;height:9px;border-radius:2px;
  border:1px solid rgba(201,168,76,.2);
  background:rgba(201,168,76,.03);
}
@keyframes film-march{
  from{background-position:0 0;}
  to{background-position:0 100%;}
}

/* ─── Bento Masonry Layout ─── */
.bw-masonry{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:260px;
  gap:1.2rem;
  margin-bottom:2.5rem;
}
.bw-item{
  position:relative;border-radius:var(--radius-lg);overflow:hidden;
  cursor:none;border:1px solid var(--border);
  background:var(--bg-card);
  transition:transform .5s var(--ease-expo),box-shadow .5s,border-color .5s;
}
.bw-item:hover{
  transform:translateY(-6px) scale(1.008);
  box-shadow:0 30px 90px rgba(0,0,0,.8),0 0 50px rgba(201,168,76,.15);
  border-color:var(--border-gold);
}

/* Bento sizing */
.item-hero{grid-column:span 2;grid-row:span 2;}
.item-tall{grid-column:span 1;grid-row:span 2;}
.item-wide{grid-column:span 2;grid-row:span 1;}
.item-box{grid-column:span 1;grid-row:span 1;}

.bw-img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .9s var(--ease-expo);
}
.bw-item:hover .bw-img{transform:scale(1.08);}

.bw-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.2) 60%,transparent);
  padding:1.5rem;
  display:flex;flex-direction:column;justify-content:flex-end;
  opacity:0.9;transition:opacity .4s;
}
.bw-item:hover .bw-overlay{opacity:1;}

.bw-tag{
  display:inline-block;font-size:.65rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--bg);background:var(--gold);margin-bottom:.5rem;
  padding:.3rem .8rem;border-radius:4px;width:fit-content;
  box-shadow:0 0 20px rgba(201,168,76,.3);
}
.bw-overlay h3{
  font-family:var(--ff-display);font-size:clamp(1.2rem,2vw,1.8rem);font-weight:700;
  margin-bottom:.2rem;color:#fff;
}
.bw-overlay p{
  font-family:var(--ff-serif);font-size:.85rem;color:var(--text-muted);font-style:italic;
}

/* Circular Play Button */
.bw-play{
  position:absolute;right:1.5rem;bottom:1.5rem;
  width:44px;height:44px;border-radius:50%;
  background:rgba(201,168,76,.9);color:var(--bg);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 25px rgba(201,168,76,.5);
  transform:scale(0);transition:transform .4s var(--ease-back);
}
.bw-item:hover .bw-play{transform:scale(1);}
.bw-play svg{width:16px;height:16px;margin-left:2px;}

/* Re-apply Animated gold border */
.bw-glow-border{
  position:absolute;inset:-1px;border-radius:var(--radius-lg);
  background:transparent;border:1.5px solid transparent;background-clip:padding-box;
  transition:box-shadow .4s;pointer-events:none;
}
.bw-item:hover .bw-glow-border{
  box-shadow:inset 0 0 0 1.5px var(--gold),0 0 40px rgba(201,168,76,.2);
}

/* Responsive adjustments */
@media(max-width:900px){
  .bw-masonry{grid-template-columns:repeat(2,1fr);grid-auto-rows:220px;}
  .item-hero{grid-column:span 2;grid-row:span 2;}
  .item-tall{grid-column:span 1;grid-row:span 1;}
  .item-wide{grid-column:span 2;grid-row:span 1;}
}
@media(max-width:600px){
  .bw-masonry{grid-template-columns:1fr;grid-auto-rows:240px;}
  .bw-item{grid-column:span 1 !important;grid-row:span 1 !important;}
}

/* Footer CTA */
.bw-footer{text-align:center;margin-top:1rem;}
.btn-outline{
  border:1.5px solid var(--border-gold);color:var(--gold);
  background:transparent;
  padding:.9rem 2.2rem;font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  border-radius:4px;transition:all .35s;
  display:inline-flex;align-items:center;gap:.5rem;
}
.btn-outline:hover{
  background:linear-gradient(135deg,var(--gold-dark),var(--gold));
  color:var(--bg);border-color:transparent;
  box-shadow:0 8px 30px rgba(201,168,76,.4);
  transform:translateY(-2px);
}

/* ══════════════════ EXTRA MOTION ENHANCEMENTS ══════════════ */

/* Gradient animated border on portfolio items */
.portfolio-item::after{
  content:'';position:absolute;inset:0;border-radius:var(--radius);
  opacity:0;transition:opacity .4s;
  background:linear-gradient(180deg,transparent 60%,rgba(201,168,76,.15) 100%);
  pointer-events:none;
}
.portfolio-item:hover::after{opacity:1;}

/* Entrance stagger for bw-card and bw-hero */
.bw-hero-card,.bw-side-card{animation:card-float 6s ease-in-out infinite;}
.bw-hero-card{animation-delay:0s;}
.bw-side-card:first-child{animation-delay:1s;}
.bw-side-card:last-child{animation-delay:2s;}
.bw-card:nth-child(1){animation:card-float 6s ease-in-out 0.3s infinite;}
.bw-card:nth-child(2){animation:card-float 6s ease-in-out 1.2s infinite;}
.bw-card:nth-child(3){animation:card-float 6s ease-in-out 2.1s infinite;}
@keyframes card-float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-5px);}
}

/* Music toggle pulse rings when playing */
#music-toggle.playing{
  box-shadow:0 0 0 0 rgba(201,168,76,.5);
  animation:music-pulse 2s ease-out infinite;
}
@keyframes music-pulse{
  0%{box-shadow:0 0 0 0 rgba(201,168,76,.4);}
  70%{box-shadow:0 0 0 14px rgba(201,168,76,0);}
  100%{box-shadow:0 0 0 0 rgba(201,168,76,0);}
}

/* Section title animated underline draw */
.section-title::after{
  content:'';display:block;height:2px;width:0;
  background:linear-gradient(90deg,var(--gold-dark),var(--gold-light));
  border-radius:99px;margin:0.5rem auto 0;
  transition:width 1s var(--ease-expo);
}
.section-header.visible .section-title::after,.section-header .section-title::after{
  /* Triggered on visible */
  width:80px;
}

/* Shimmer effect on section eyebrow text */
.section-eyebrow{
  color: var(--gold);
  animation: eyebrow-text-shimmer 4s ease-in-out infinite;
}
@keyframes eyebrow-text-shimmer{
  0%, 100% { filter: brightness(1); text-shadow: none; }
  50% { filter: brightness(1.3); text-shadow: 0 0 10px rgba(201,168,76,.4); }
}
@keyframes text-shimmer{
  from{background-position:0% center;}
  to{background-position:200% center;}
}

/* Gold glow burst on play icon hover */
.pf-play-btn::after,.bw-play-btn::after{
  content:'';position:absolute;inset:-8px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,168,76,.4) 0%,transparent 70%);
  opacity:0;transition:opacity .3s;pointer-events:none;
}
.portfolio-item:hover .pf-play-btn::after,
.bw-hero-card:hover .bw-play-btn::after{opacity:1;}

/* ══════════════════ RESPONSIVE: Best Work ═══════════════════ */
@media(max-width:1024px){
  .bw-hero{grid-template-columns:1fr;grid-template-rows:auto auto;}
  .bw-hero-side{flex-direction:row;}
  .bw-side-card{aspect-ratio:4/3;}
}
@media(max-width:768px){
  .bw-row{grid-template-columns:1fr;}
  .bw-hero-side{flex-direction:column;}
  .film-strip-left,.film-strip-right{display:none;}
}
@media(max-width:480px){
  .bw-hero{gap:.8rem;}
  .bw-row{gap:.8rem;}
  .bw-hero-content{padding:1.2rem;}
  .bw-play-btn{width:48px;height:48px;}
}


/* ════════════════════════════════════════════════════════════════
   CREATIVE ENHANCEMENT PACK v3 – Illusion Editor
   ════════════════════════════════════════════════════════════════ */

/* ── Animated Global Blobs ───────────────────────────────────── */
.global-blobs{
  position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;
}
.gblob{
  position:absolute;border-radius:50%;
  filter:blur(100px);opacity:0;
  animation:blob-drift 18s ease-in-out infinite;
}
.gblob-1{
  width:700px;height:700px;
  background:radial-gradient(circle,rgba(201,168,76,.07) 0%,transparent 70%);
  top:-200px;left:-200px;animation-delay:0s;
}
.gblob-2{
  width:600px;height:600px;
  background:radial-gradient(circle,rgba(124,58,255,.06) 0%,transparent 70%);
  bottom:-150px;right:-150px;animation-delay:-6s;
}
.gblob-3{
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(59,130,246,.05) 0%,transparent 70%);
  top:40%;left:30%;animation-delay:-12s;
}
.gblob-4{
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(201,168,76,.05) 0%,transparent 70%);
  bottom:20%;left:-100px;animation-delay:-9s;
}
@keyframes blob-drift{
  0%{transform:translate(0,0) scale(1);opacity:0;}
  10%{opacity:1;}
  33%{transform:translate(60px,-40px) scale(1.1);}
  66%{transform:translate(-40px,60px) scale(.9);}
  90%{opacity:1;}
  100%{transform:translate(0,0) scale(1);opacity:0;}
}

/* ── Cursor Trail Dots ───────────────────────────────────────── */
.c-trail{
  position:fixed;pointer-events:none;z-index:9996;
  border-radius:50%;transform:translate(-50%,-50%);
  background:var(--gold);
  width:5px;height:5px;
  opacity:0;
  transition:left .12s linear,top .12s linear,opacity .4s;
}

/* ── Cinematic Marquee ───────────────────────────────────────── */
.marquee-section{
  position:relative;
  overflow:hidden;
  padding:.7rem 0;
  background:linear-gradient(90deg,
    var(--bg) 0%,
    rgba(201,168,76,.06) 30%,
    rgba(201,168,76,.06) 70%,
    var(--bg) 100%
  );
  border-top:1px solid rgba(201,168,76,.12);
  border-bottom:1px solid rgba(201,168,76,.12);
}
.marquee-section::before,.marquee-section::after{
  content:'';position:absolute;top:0;bottom:0;width:120px;z-index:2;
  pointer-events:none;
}
.marquee-section::before{left:0;background:linear-gradient(to right,var(--bg),transparent);}
.marquee-section::after{right:0;background:linear-gradient(to left,var(--bg),transparent);}
.marquee-track{overflow:hidden;white-space:nowrap;}
.marquee-inner{
  display:inline-flex;align-items:center;gap:2rem;
  animation:marquee-scroll 28s linear infinite;
  will-change:transform;
}
.marquee-inner:hover{animation-play-state:paused;}
.marquee-inner span{
  font-size:.64rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;
  color:var(--text-muted);white-space:nowrap;
  transition:color .3s;
}
.marquee-inner span:hover{color:var(--gold);}
.marquee-inner .mx{
  color:var(--gold);font-size:.8rem;opacity:.7;
}
@keyframes marquee-scroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* ── Hero: Scanlines + Vignette Enhancement ─────────────────── */
.hero-section::after{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:2;
  background:repeating-linear-gradient(
    to bottom,
    transparent,
    transparent 3px,
    rgba(0,0,0,.012) 3px,
    rgba(0,0,0,.012) 4px
  );
}
/* Letterbox bars (cinematic aspect) */
.hero-section::before{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:3;
  background:linear-gradient(to bottom,
    rgba(0,0,0,.55) 0%,
    transparent 10%,
    transparent 90%,
    rgba(0,0,0,.55) 100%
  );
}

/* ── Enhanced Section Dividers ───────────────────────────────── */
.section::before{
  content:'';display:block;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--border-gold),rgba(124,58,255,.2),var(--border-gold),transparent);
  opacity:.6;
  position:absolute;top:0;left:10%;right:10%;
}
/* Don't put it on hero */
.hero-section::before{background:none;display:none;}

/* ── Section Title: 3D Entrance (JS powered) ─────────────────── */
.char{
  display:inline-block;
  opacity:0;
  transform:translateY(1em) rotateX(-80deg);
  transform-origin:bottom center;
  transition:opacity .55s var(--ease-expo),transform .55s var(--ease-expo);
  will-change:transform,opacity;
}
.char.in{opacity:1;transform:translateY(0) rotateX(0);}
.word{display:inline-block;overflow:hidden;perspective:600px;}

/* ── Portfolio Grid: Enhanced 3D Hover ───────────────────────── */
.portfolio-item{
  transform-style:preserve-3d;
  transition:border-color .4s,transform .5s var(--ease-expo),box-shadow .4s,opacity .5s;
}
.portfolio-item:hover{
  box-shadow:0 30px 80px rgba(0,0,0,.7),
             0 0 50px rgba(201,168,76,.15),
             inset 0 0 30px rgba(201,168,76,.03);
  z-index:10;
}
/* Animated gold shimmer on all portfolio cards */
.portfolio-item::before{
  content:'';position:absolute;
  inset:0;border-radius:var(--radius);
  background:linear-gradient(125deg,
    transparent 0%,
    rgba(201,168,76,.035) 40%,
    rgba(255,255,255,.04) 50%,
    rgba(201,168,76,.035) 60%,
    transparent 100%
  );
  background-size:300% 300%;
  opacity:0;transition:opacity .4s;
  animation:card-shimmer 3s ease-in-out infinite paused;
  pointer-events:none;z-index:2;
}
.portfolio-item:hover::before{
  opacity:1;
  animation-play-state:running;
}
@keyframes card-shimmer{
  0%{background-position:200% 0%;}
  100%{background-position:-200% 0%;}
}

/* Portfolio items stagger entrance on tab switch */
.portfolio-item:not(.hidden){
  animation:grid-pop 0.5s var(--ease-back) both;
}
.portfolio-item:nth-child(2){animation-delay:.05s}
.portfolio-item:nth-child(3){animation-delay:.10s}
.portfolio-item:nth-child(4){animation-delay:.15s}
.portfolio-item:nth-child(5){animation-delay:.20s}
.portfolio-item:nth-child(6){animation-delay:.25s}
.portfolio-item:nth-child(7){animation-delay:.30s}
.portfolio-item:nth-child(8){animation-delay:.35s}
.portfolio-item:nth-child(9){animation-delay:.40s}
@keyframes grid-pop{
  from{opacity:0;transform:scale(.9) translateY(20px);}
  to{opacity:1;transform:scale(1) translateY(0);}
}

/* ── Service Cards: Extra Glow + 3D ──────────────────────────── */
.service-card{
  transition:border-color .4s,transform .5s var(--ease-expo),box-shadow .4s;
}
.service-card:hover{
  box-shadow:0 30px 80px rgba(0,0,0,.5),
             0 0 60px rgba(201,168,76,.12),
             inset 0 1px 0 rgba(201,168,76,.15);
}
.service-card::before{
  content:'';position:absolute;inset:0;
  border-radius:var(--radius-lg);
  background:linear-gradient(135deg,rgba(201,168,76,.04),transparent 50%,rgba(124,58,255,.04));
  opacity:0;transition:opacity .4s;pointer-events:none;
}
.service-card:hover::before{opacity:1;}

/* ── Testimonial Cards: Enhanced ────────────────────────────── */
.testimonial-card{
  transition:border-color .4s,transform .4s var(--ease-expo),box-shadow .4s;
}
.testimonial-card:hover{
  transform:translateY(-6px) scale(1.01);
  box-shadow:0 20px 60px rgba(0,0,0,.5),0 0 40px rgba(201,168,76,.1);
}

/* ── Animated Gradient Mesh for About section ────────────────── */
.about-section{
  position:relative;overflow:hidden;
}
.about-section::after{
  content:'';position:absolute;
  width:500px;height:500px;
  bottom:-200px;right:-100px;
  background:radial-gradient(circle,rgba(201,168,76,.06) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
  filter:blur(60px);
  animation:blob-drift 14s ease-in-out 2s infinite;
}

/* ── Loading Screen Enhancement ─────────────────────────────── */
#loader{
  background:radial-gradient(ellipse at center,#0a080a 0%,#000 100%);
}
.loader-inner::before{
  content:'ILLUSION EDITOR';
  position:absolute;
  font-family:var(--ff-display);
  font-size:clamp(6rem,18vw,14rem);
  font-weight:900;
  color:rgba(255,255,255,.012);
  letter-spacing:.2em;
  white-space:nowrap;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  pointer-events:none;
  user-select:none;
}

/* ── Scrollbar Redesign ──────────────────────────────────────── */
::-webkit-scrollbar{width:3px;}
::-webkit-scrollbar-thumb{
  background:linear-gradient(to bottom,var(--gold-dark),var(--purple));
}

/* ── Nav Logo: Animated Border ───────────────────────────────── */
.logo-ie{
  position:relative;overflow:hidden;
}
.logo-ie::before{
  content:'';position:absolute;inset:-1px;
  background:conic-gradient(var(--gold) 0deg,transparent 120deg,var(--gold-light) 240deg,var(--gold) 360deg);
  border-radius:inherit;
  animation:logo-spin 4s linear infinite;
  z-index:-1;
}
.logo-ie::after{
  content:'';position:absolute;inset:1.5px;
  background:var(--bg-card);border-radius:4px;z-index:-1;
}
@keyframes logo-spin{to{transform:rotate(360deg);}}

/* ── Scroll Indicator: Film perforations ─────────────────────── */
#section-indicator::before{
  content:'';position:absolute;left:50%;top:0;bottom:0;
  width:1px;transform:translateX(-50%);
  background:linear-gradient(to bottom,transparent,rgba(201,168,76,.2),transparent);
  z-index:-1;
}

/* ── Music Toggle: Enhanced ──────────────────────────────────── */
#music-toggle{
  backdrop-filter:blur(20px);
  background:rgba(5,4,5,.9);
  box-shadow:0 4px 30px rgba(0,0,0,.5),inset 0 0 20px rgba(201,168,76,.05);
  border-color:rgba(201,168,76,.3);
}
#music-toggle svg{
  transition:transform .3s var(--ease-back);
}
#music-toggle:hover svg{transform:scale(1.2) rotate(15deg);}

/* ── Hero Stats: Gold Glow Enhancement ──────────────────────── */
.stat-num{
  text-shadow:0 0 40px rgba(201,168,76,.4);
  position:relative;
}
.stat-num::after{
  content:attr(data-target)+'+';
  position:absolute;inset:0;
  background:linear-gradient(135deg,var(--gold-dark),var(--gold-light));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  filter:blur(8px);
  z-index:-1;
  opacity:.5;
  transform:translateY(2px);
}

/* ── "Best Wedding Work" section: Extra enhancements ──────────── */
.bw-hero-card{
  box-shadow:0 40px 100px rgba(0,0,0,.8),
             0 0 0 1px rgba(201,168,76,.15),
             0 0 80px rgba(201,168,76,.06);
}
/* Golden frame lines (4 corners) on the hero card */
.bw-hero-card::before,.bw-hero-card::after{
  content:'';position:absolute;pointer-events:none;z-index:4;
  transition:all .5s var(--ease-expo);
}
.bw-hero-card::before{
  top:12px;left:12px;
  width:40px;height:40px;
  border-top:2px solid var(--gold);
  border-left:2px solid var(--gold);
}
.bw-hero-card::after{
  bottom:12px;right:12px;
  width:40px;height:40px;
  border-bottom:2px solid var(--gold);
  border-right:2px solid var(--gold);
}
.bw-hero-card:hover::before{width:60px;height:60px;}
.bw-hero-card:hover::after{width:60px;height:60px;}

/* ── Contact Form: Glow Focus ────────────────────────────────── */
.form-input:focus,.form-textarea:focus{
  box-shadow:0 0 0 2px rgba(201,168,76,.2),
             0 0 30px rgba(201,168,76,.08);
}

/* ── Footer: Cinematic gradient border ───────────────────────── */
footer{
  position:relative;
}
footer::before{
  content:'';position:absolute;top:0;left:5%;right:5%;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),rgba(124,58,255,.4),var(--gold),transparent);
  opacity:.5;
}

/* ── Buttons: Enhanced Hover ─────────────────────────────────── */
.btn-primary{
  background:linear-gradient(135deg,var(--gold-dark) 0%,var(--gold) 50%,var(--gold-light) 100%);
  background-size:200% 100%;
  animation:btn-gradient-shift 4s ease infinite;
}
@keyframes btn-gradient-shift{
  0%,100%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
}
.btn-primary:hover{
  background-position:100% 50%;
  box-shadow:0 10px 50px rgba(201,168,76,.6),
             0 0 100px rgba(201,168,76,.2);
}

/* ── Section Header: Orbital Ring ───────────────────────────── */
.section-eyebrow{
  position:relative;
}
.section-eyebrow::before,.section-eyebrow::after{
  /* Override default line with animated fade */
  animation:eyebrow-pulse 3s ease-in-out infinite;
}
@keyframes eyebrow-pulse{
  0%,100%{opacity:.3;}
  50%{opacity:.8;}
}

/* ── Responsive Marquee ──────────────────────────────────────── */
@media(max-width:768px){
  .marquee-section{padding:.5rem 0;}
  .marquee-inner span{font-size:.58rem;letter-spacing:.2em;}
}

/* ── Fix: Hero section pseudo-element conflicts ──────────────── */
.hero-section{
  /* No divider pseudo-element */
}
/* Override the generic section::before divider line for hero */
.hero-section::before{
  content:none!important;
  display:none!important;
}
.hero-section::after{
  content:''!important;
  display:block!important;
}

/* Fix: BW hero card corners use ::before/::after so don't double with the section divider */
.best-work-section::before{
  content:'';display:block;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--border-gold),rgba(124,58,255,.2),var(--border-gold),transparent);
  opacity:.6;
  position:absolute;top:0;left:10%;right:10%;
  /* No reset needed – already in generic rule */
}

/* Fix: Remove generic section::before from sections that have special styling */
.portfolio-section::before,
.testimonials-section::before,
.contact-section::before {
  display:none;
}

/* ── Ensure global blobs don't overlap interactive elements ──── */
.global-blobs{
  z-index:0;
  mix-blend-mode:screen;
}

/* ── MEGA CTA ── */
.mega-cta-section {
  padding: 6rem 0 2rem;
  text-align: center;
  overflow: hidden;
  position: relative;
  background: var(--bg);
  border-top: 1px solid rgba(201,168,76,.1);
}
.mega-cta-link {
  display: inline-block;
  text-decoration: none;
  position: relative;
  cursor: none;
}
.mega-text-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}
.mega-text {
  font-family: var(--ff-display);
  font-size: clamp(5rem, 14vw, 16rem);
  font-weight: 900;
  line-height: 0.85;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(201,168,76,.35);
  text-transform: uppercase;
  transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  letter-spacing: -0.02em;
}
.mega-cta-link:hover .mega-text {
  color: var(--gold);
  -webkit-text-stroke: 1.5px transparent;
  transform: scale(1.03);
  text-shadow: 0 0 60px rgba(201,168,76,.5);
}


/* Image Logo Styles */
.nav-logo-img { height: 90px; width: auto; object-fit: contain; filter: drop-shadow(0 0 10px rgba(201,168,76,0.3)); transition: height 0.4s; }
#navbar.scrolled .nav-logo-img { height: 60px; }
.footer-logo-img { height: 120px; width: auto; margin-bottom: 2rem; object-fit: contain; filter: drop-shadow(0 0 20px rgba(201,168,76,0.4)); }

/* Loader Logo */
.loader-logo-img { width: 140px; height: auto; object-fit: contain; margin-bottom: 2rem; filter: drop-shadow(0 0 30px rgba(201,168,76,0.5)); animation: pulseLogo 3s infinite alternate ease-in-out; }
@keyframes pulseLogo { 0% { transform: scale(1) translateY(0); filter: drop-shadow(0 0 20px rgba(201,168,76,0.5)); } 100% { transform: scale(1.08) translateY(-5px); filter: drop-shadow(0 0 40px rgba(201,168,76,0.8)); } }

/* Floating Action Buttons */
.scroll-to-top { position: fixed; bottom: 30px; left: 30px; width: 50px; height: 50px; background: rgba(201,168,76,0.1); border: 1px solid var(--border-gold); backdrop-filter: blur(10px); border-radius: 50%; color: var(--gold); display: flex; align-items: center; justify-content: center; z-index: 999; opacity: 0; pointer-events: none; transition: 0.4s; cursor: pointer; }
.scroll-to-top.show { opacity: 1; pointer-events: auto; }
.scroll-to-top:hover { background: var(--gold); color: #000; transform: translateY(-5px); }
.scroll-to-top svg { width: 24px; height: 24px; }

.floating-cta { position: fixed; bottom: 30px; right: 30px; height: 50px; padding: 0 1.5rem; background: var(--gold); border-radius: 99px; display: flex; align-items: center; justify-content: center; color: #000; font-family: var(--ff-primary); font-weight: 700; font-size: 0.9rem; letter-spacing: 0.05em; text-decoration: none; z-index: 999; box-shadow: 0 10px 30px rgba(201,168,76,0.3); transition: 0.4s; }
.floating-cta:hover { transform: translateY(-5px) scale(1.05); box-shadow: 0 15px 40px rgba(201,168,76,0.6); }
.floating-cta .pulse-ring { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 2px solid var(--gold); border-radius: 99px; animation: ringPulse 2s infinite; pointer-events: none; }
@keyframes ringPulse { 0% { transform: scale(1); opacity: 0.8; } 100% { transform: scale(1.3, 1.5); opacity: 0; } }

/* Custom Text Selection Highlight */
::selection { background: var(--gold); color: #000; text-shadow: none; }
::-moz-selection { background: var(--gold); color: #000; text-shadow: none; }

/* ── About Photo Premium Shimmer Scan ─────────────────────────── */
.about-img-frame::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    transparent 0%,
    rgba(201,168,76,.06) 48%,
    rgba(201,168,76,.15) 50%,
    rgba(201,168,76,.06) 52%,
    transparent 100%
  );
  background-size: 300% 300%;
  animation: aboutScanLine 4s ease-in-out infinite;
  pointer-events: none;
  z-index: 2;
  border-radius: inherit;
}
@keyframes aboutScanLine {
  0%   { background-position: 150% 150%; opacity: 0; }
  20%  { opacity: 1; }
  80%  { opacity: 1; }
  100% { background-position: -50% -50%; opacity: 0; }
}

/* ── Image Load Fade Animation ────────────────────────────────── */
.about-img, .hero-bg-img {
  animation: imgFadeIn 1.2s var(--ease-expo) forwards;
}
@keyframes imgFadeIn {
  from { opacity: 0; transform: scale(1.04); }
  to   { opacity: 1; transform: scale(1); }
}

/* ── Active Nav Link Golden Glow ──────────────────────────────── */
.nav-link.active {
  color: var(--gold);
}
.nav-link.active::after {
  width: 100%;
  background: var(--gold);
}

/* ── Service Card Ambient Depth Pulse  ────────────────────────── */
.service-card::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(201,168,76,.12), transparent, rgba(201,168,76,.05));
  opacity: 0;
  transition: opacity .5s;
  pointer-events: none;
  z-index: 0;
}
.service-card:hover::before { opacity: 1; }

/* ── Portfolio Item Entrance Stagger Keyframe ─────────────────── */
@keyframes pf-enter {
  from { opacity: 0; transform: translateY(24px) scale(.97); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}
.portfolio-item:not(.hidden) {
  animation: pf-enter .55s var(--ease-expo) both;
}

/* ── Cropper Modal Overlay ────────────────────────────────────── */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.8);
  backdrop-filter: blur(12px);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn .25s ease;
}
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
.cropper-container { max-height: 90vh; overflow-y: auto; }
.btn-crop {
  flex-shrink: 0;
  padding: .7rem 1.2rem;
  font-size: .78rem;
  background: rgba(201,168,76,.12);
  border: 1px solid var(--border-gold);
  color: var(--gold);
  border-radius: 6px;
  font-weight: 600;
  letter-spacing: .06em;
  transition: all .3s;
  cursor: pointer;
  white-space: nowrap;
}
.btn-crop:hover {
  background: var(--gold);
  color: #000;
}

/* ── Reel Card 3D Tilt ────────────────────────────────────────── */
.reel-card {
  transition: border-color .4s, box-shadow .4s, transform .4s var(--ease-expo);
  transform-style: preserve-3d;
}

/* ── Testimonial Card Golden Left Bar ─────────────────────────── */
.testimonial-card {
  border-left: 2px solid var(--border-gold) !important;
  transition: border-left-color .3s;
}
.testimonial-card:hover {
  border-left-color: var(--gold) !important;
}

/* ── Floating CTA Pulse Bounce ────────────────────────────────── */
.floating-cta {
  animation: ctaBounce 3s ease-in-out infinite;
}
@keyframes ctaBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
.floating-cta:hover { animation: none; }

/* ── Image lazy load blur-up effect ──────────────────────────── */
img[loading="lazy"] {
  transition: opacity .6s ease, filter .6s ease;
  filter: blur(4px);
}
img[loading="lazy"].loaded,
img[loading="lazy"][src] {
  filter: blur(0);
}

/* ═══════════════════════════════ PROCESS SECTION ═════════════ */
.process-section { background: var(--bg-3); }

.process-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  position: relative;
}

.process-step {
  position: relative;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 2rem 1.6rem;
  transition: border-color .4s, transform .4s, box-shadow .4s;
  overflow: hidden;
}
.process-step::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(201,168,76,.04), transparent);
  opacity: 0;
  transition: opacity .4s;
}
.process-step:hover {
  border-color: var(--border-gold);
  transform: translateY(-6px);
  box-shadow: 0 20px 60px rgba(0,0,0,.4), 0 0 30px rgba(201,168,76,.08);
}
.process-step:hover::before { opacity: 1; }

.process-step-num {
  font-family: var(--ff-display);
  font-size: 4rem;
  font-weight: 900;
  color: rgba(201,168,76,.08);
  line-height: 1;
  position: absolute;
  top: 1rem;
  right: 1.2rem;
  pointer-events: none;
  transition: color .4s;
}
.process-step:hover .process-step-num {
  color: rgba(201,168,76,.14);
}

.process-step-icon {
  width: 48px;
  height: 48px;
  color: var(--gold);
  margin-bottom: 1.2rem;
  opacity: .85;
  transition: opacity .3s, transform .4s var(--ease-back);
}
.process-step:hover .process-step-icon {
  opacity: 1;
  transform: scale(1.1) rotate(-5deg);
}

.process-step-content h3 {
  font-family: var(--ff-display);
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: .6rem;
  color: var(--text-primary);
}
.process-step-content p {
  font-family: var(--ff-serif);
  font-size: .9rem;
  color: var(--text-muted);
  line-height: 1.7;
  font-style: italic;
}

.process-connector {
  display: none; /* used for future timeline layouts */
}

@media (max-width: 900px) {
  .process-steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .process-steps { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   ENHANCEMENT PACK — Availability, Tools, Floating Labels, Modal
   ═══════════════════════════════════════════════════════════════ */

/* ── Availability Badge ────────────────────────────────────────── */
.availability-badge {
  position: absolute;
  top: 2rem;
  right: clamp(1.5rem,5vw,3.5rem);
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .45rem 1rem;
  border-radius: 99px;
  background: rgba(6,6,6,.6);
  border: 1px solid rgba(74,222,128,.25);
  backdrop-filter: blur(12px);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #4ade80;
  z-index: 10;
  pointer-events: none;
}
.avail-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4ade80;
  box-shadow: 0 0 8px #4ade80;
  animation: availPulse 2s ease-in-out infinite;
}
@keyframes availPulse {
  0%,100% { box-shadow: 0 0 6px #4ade80; opacity:1; }
  50% { box-shadow: 0 0 18px #4ade80, 0 0 30px rgba(74,222,128,.3); opacity:.8; }
}

/* ── Tools Strip ───────────────────────────────────────────────── */
.tools-strip {
  background: rgba(6,6,6,.95);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 1.4rem 0;
  overflow: hidden;
  position: relative;
}
.tools-strip::before,
.tools-strip::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 120px;
  z-index: 10;
  pointer-events: none;
}
.tools-strip::before {
  left: 0;
  background: linear-gradient(to right, rgb(6,6,6), transparent);
}
.tools-strip::after {
  right: 0;
  background: linear-gradient(to left, rgb(6,6,6), transparent);
}
.tools-strip-inner {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 clamp(1.5rem,5vw,3.5rem);
  flex-wrap: wrap;
}
.tools-label {
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--text-dim);
  white-space: nowrap;
  flex-shrink: 0;
}
.tools-label::after {
  content: '';
  display: inline-block;
  width: 30px;
  height: 1px;
  background: var(--border);
  vertical-align: middle;
  margin-left: 1rem;
}
.tools-list {
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
}
.tool-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--text-muted);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .04em;
  transition: color .3s, transform .3s;
  cursor: default;
}
.tool-item svg {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  transition: transform .4s var(--ease-back);
}
.tool-item:hover {
  color: var(--gold);
  transform: translateY(-2px);
}
.tool-item:hover svg {
  transform: scale(1.15) rotate(-5deg);
}

/* ── Floating Label Contact Inputs ─────────────────────────────── */
.contact-form .form-group {
  position: relative;
}
.contact-form label {
  position: absolute;
  top: .85rem;
  left: 1rem;
  font-size: .8rem;
  color: var(--text-muted);
  pointer-events: none;
  transition: top .25s var(--ease-expo), font-size .25s, color .25s;
  background: transparent;
}
.contact-form input,
.contact-form select,
.contact-form textarea {
  padding-top: 1.5rem !important;
  padding-bottom: .4rem !important;
  padding-left: 1rem !important;
}
.contact-form input:focus ~ label,
.contact-form input:not(:placeholder-shown) ~ label,
.contact-form select:focus ~ label,
.contact-form textarea:focus ~ label,
.contact-form textarea:not(:placeholder-shown) ~ label {
  top: .3rem;
  font-size: .62rem;
  color: var(--gold);
  letter-spacing: .1em;
  text-transform: uppercase;
}
/* Override conflicting existing label style for contact form */
.contact-form label {
  display: block !important;
  margin-bottom: 0 !important;
}

/* ── Video Modal Cinematic Slide-Up Entrance ───────────────────── */
.video-modal {
  animation: none;
}
.video-modal:not([hidden]) .video-modal-content {
  animation: modalSlideUp .45s var(--ease-expo) both;
}
@keyframes modalSlideUp {
  from { transform: translateY(60px) scale(.96); opacity: 0; }
  to   { transform: translateY(0)    scale(1);   opacity: 1; }
}
.video-modal-backdrop {
  animation: backdropIn .35s ease both;
}
@keyframes backdropIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Stat Number Glow on Count-Up ──────────────────────────────── */
.stat-num {
  text-shadow: 0 0 20px rgba(201,168,76,.0);
  transition: text-shadow .3s;
}
.stat-num.counting {
  text-shadow: 0 0 30px rgba(201,168,76,.6), 0 0 60px rgba(201,168,76,.2);
}

/* ── Section Divider Gradient Separators ───────────────────────── */
.section::after {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--border-gold), transparent);
  opacity: .6;
  pointer-events: none;
}
.hero-section::after,
.mega-cta-section::after,
.marquee-section::after {
  display: none; /* Don't add divider to these */
}

/* ── About Section Enhanced Floating Badge ─────────────────────── */
.about-badge {
  animation: badgeFloat 4s ease-in-out infinite;
}
@keyframes badgeFloat {
  0%,100% { transform: translateY(0) rotate(-1deg); }
  50%     { transform: translateY(-8px) rotate(1deg); }
}

/* ── Process Step Active Highlight on Scroll ───────────────────── */
.process-step.in-view {
  border-color: var(--border-gold);
}
.process-step.in-view .process-step-num {
  color: rgba(201,168,76,.14);
}

/* ── Testimonial Card Float on Hover ───────────────────────────── */
.testimonial-card {
  transition: transform .4s var(--ease-expo), box-shadow .4s, border-left-color .3s !important;
}
.testimonial-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.4), 0 0 20px rgba(201,168,76,.06) !important;
}

/* ── Mega CTA Enhanced ─────────────────────────────────────────── */
.mega-cta-section {
  overflow: hidden;
  position: relative;
}
.mega-cta-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(201,168,76,.04) 0%, transparent 70%);
  pointer-events: none;
}

/* ── Footer Social Icon Hover ──────────────────────────────────── */
.footer-socials a {
  transition: transform .3s var(--ease-back), color .3s, filter .3s;
  opacity: .55;
}
.footer-socials a:hover {
  transform: translateY(-4px) scale(1.15);
  opacity: 1;
  filter: drop-shadow(0 0 8px var(--gold));
}

/* ── Hero CTA Button Extra Shimmer ─────────────────────────────── */
.btn-primary::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  transform: skewX(-20deg);
  animation: btnShimmer 3.5s ease-in-out infinite;
}
@keyframes btnShimmer {
  0%   { left: -100%; }
  40%, 100% { left: 160%; }
}

/* ── Mobile Responsive Polishing ───────────────────────────────── */
@media (max-width: 768px) {
  .availability-badge {
    top: auto;
    bottom: 5rem;
    right: 50%;
    transform: translateX(50%);
  }
  .tools-strip-inner {
    justify-content: center;
  }
  .tools-label { display: none; }
}

/* ── WhatsApp Floating Button ────────────────────────────────── */
.wa-float {
  position: fixed;
  bottom: 30px;
  left: 30px;
  width: 60px;
  height: 60px;
  background: #25d366;
  color: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.4);
  z-index: 1000;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  animation: waBounce 2s infinite;
}
.wa-float svg { width: 32px; height: 32px; }
.wa-float:hover { transform: scale(1.1); box-shadow: 0 8px 25px rgba(37, 211, 102, 0.6); background: #20ba5a; }
.wa-status { position: absolute; left: 70px; background: white; color: #075e54; padding: 6px 12px; border-radius: 20px; font-size: 13px; font-weight: 600; white-space: nowrap; box-shadow: 0 2px 10px rgba(0,0,0,0.1); opacity: 0; transform: translateX(-10px); transition: all 0.3s ease; pointer-events: none; }
.wa-float:hover .wa-status { opacity: 1; transform: translateX(0); }
@keyframes waBounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }

@media (max-width: 768px) {
  .wa-float { bottom: 20px; left: 20px; width: 50px; height: 50px; }
  .wa-float svg { width: 26px; height: 26px; }
  .wa-status { display: none; }
}