/* ══════════════════════════════════════════════════════
   CRITICAL IMAGE SAFETY NET
   Prevents Elementor placeholder GIFs from being visible,
   and ensures images are never hidden by opacity/display tricks.
   ══════════════════════════════════════════════════════ */

/* Hide the blank GIF placeholder so no broken image icon shows */
img[src*="data:image/gif"] {
  visibility: hidden;
  width: 0; height: 0;
}

/* Once data-src is removed (by our fix script), show the real image */
img:not([data-src]) {
  visibility: visible;
}

/* Elementor widget images — always block display */
.elementor-widget-image img,
.elementor-widget-image-carousel img,
.wp-block-image img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ══════════════════════════════════════════════════════
   MOBILE VISIBILITY — ALL CONTENT ALWAYS VISIBLE ON TOUCH DEVICES
   Overrides all opacity:0 animation starts on mobile/tablet.
   Animations are a desktop-only enhancement.
   ══════════════════════════════════════════════════════ */
@media (hover: none), (pointer: coarse) {
  /* Every element that uses animation/transition to reveal */
  .reveal, .reveal-r, .reveal-s,
  .hero-ey-text, .htl, .hero-sub, .hero-badge,
  .hero-actions, .hero-scroll,
  .stat-card, .service-card, .gal-item,
  .wf-step, .t-card, .ret-card,
  .faq-item, .est-form, .est-result,
  .blog-card, .section-eyebrow, .section-title,
  .intro-text, .intro-right, .team-photo-wrap,
  [class*="reveal"] {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    visibility: visible !important;
    transition: none !important;
  }

  /* Images specifically — always show */
  img {
    opacity: 1 !important;
    visibility: visible !important;
    display: block;
  }
}

/* =====================================================
   i2MP Theme — assets/css/i2mp-main.css
   Imagination 2 Motion Productions
   Brand: Primary #0ec73f · Body font Century Gothic (see --font-sans)
   ===================================================== */

:root {
  --green:       #0ec73f;
  --green-light: #3adb6e;
  --green-dim:   rgba(14,199,63,0.2);
  --font-sans:    'QUESTRIAL', sans-serif;
  --red:         #CC3322;
  --dark:        #0C0E0A;
  --dark-2:      #141A10;
  --dark-3:      #1C2416;
  --cream:       #F0F4EB;
  --muted:       rgba(240,244,235,0.55);
  --border:      rgba(14,199,63,0.22);
  --ease:        cubic-bezier(0.16,1,0.3,1);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--dark);
  color: var(--cream);
  font-family: Questrial(--font-sans);
  font-weight: 300;
  overflow-x: hidden;
  cursor: none;
}

/* ── PRELOADER ─────────────────────────────────────── */
#preloader{
  position:fixed;inset:0;z-index:99999;
  background:var(--dark);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  transition:opacity .8s ease .2s,visibility .8s ease .2s;
}
#preloader.done{opacity:0;visibility:hidden;pointer-events:none}
.pre-logo{font-family:'Questrial',serif;font-size:clamp(2.5rem,6vw,5rem);font-weight:300;letter-spacing:.1em;color:var(--cream)}
.pre-logo span{color:var(--green)}
.pre-bar-wrap{width:200px;height:1px;background:rgba(240,244,235,.1);margin-top:2rem;overflow:hidden}
.pre-bar{height:100%;background:var(--green);width:0;animation:preLoad 1.9s var(--ease) forwards}
@keyframes preLoad{to{width:100%}}
.pre-counter{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--green);margin-top:1rem;font-weight:500}

/* ── CURSOR ───────────────────────────────────────── */
.i2mp-cursor { position: fixed; top: 0; left: 0; width: 10px; height: 10px; background: var(--green); border-radius: 50%; pointer-events: none; z-index: 9999; transform: translate(-50%,-50%); transition: width .25s, height .25s; mix-blend-mode: difference; }
.i2mp-cursor-ring { position: fixed; top: 0; left: 0; width: 36px; height: 36px; border: 1px solid rgba(14,199,63,.55); border-radius: 50%; pointer-events: none; z-index: 9998; transform: translate(-50%,-50%); transition: width .3s, height .3s, border-color .3s; }
.i2mp-cursor.big { width: 18px; height: 18px; }
.i2mp-cursor-ring.big { width: 54px; height: 54px; border-color: var(--green); }
.i2mp-cursor.play { background: transparent; width: 50px; height: 50px; border: 2px solid var(--green); mix-blend-mode: normal; }
.i2mp-cursor-ring.play { opacity: 0; }

/* ── TOP BAR ──────────────────────────────────────── */
.i2mp-topbar {
  background: var(--dark-3); border-bottom: 1px solid var(--border);
  padding: .5rem 4rem; display: flex; align-items: center; justify-content: space-between;
  font-size: .71rem; letter-spacing: .08em; color: var(--muted);
}
.i2mp-topbar a { color: var(--muted); text-decoration: none; transition: color .2s; }
.i2mp-topbar a:hover { color: var(--green); }
.topbar-left { display: flex; gap: 2rem; }
.topbar-right { display: flex; gap: 1.2rem; }

/* ── NAV ──────────────────────────────────────────── */
.i2mp-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  padding: 1.6rem 4rem; display: flex; align-items: center; justify-content: space-between;
  transition: background .4s, padding .4s;
}
.i2mp-nav.scrolled {
  background: rgba(12,14,10,.94); backdrop-filter: blur(14px);
  padding: 1rem 4rem; border-bottom: 1px solid var(--border);
}
.nav-logo { display: flex; align-items: center; gap: .8rem; text-decoration: none; }
.nav-logo img { width: 36px; height: 36px; object-fit: contain; }
.nav-logo-text { font-family: 'Questrial', serif; font-size: 1.05rem; font-weight: 600; letter-spacing: .08em; color: var(--cream); text-transform: lowercase; line-height: 1.1; }
.nav-logo-text span { color: var(--green); }
.nav-links { display: flex; gap: 2.5rem; list-style: none; }
.nav-links a { color: var(--muted); text-decoration: none; font-size: .77rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 400; transition: color .3s; position: relative; }
.nav-links a::after { content: ''; position: absolute; bottom: -3px; left: 0; width: 0; height: 1px; background: var(--green); transition: width .3s ease; }
.nav-links a:hover { color: var(--cream); }
.nav-links a:hover::after { width: 100%; }
/* Active nav item */
.nav-links .current-page > a,
.nav-links li.current-menu-item > a {
  color: var(--green);
}

.nav-right { display: flex; align-items: center; gap: 1.5rem; }
.nav-cta { background: transparent; border: 1px solid var(--green); color: var(--green); padding: .52rem 1.4rem; font-family: var(--font-sans); font-size: .75rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; cursor: none; transition: background .3s, color .3s; }
.nav-cta:hover { background: var(--green); color: var(--dark); }
.hamburger { display: none; flex-direction: column; gap: 5px; cursor: none; padding: 4px; background: none; border: none; }
.hamburger span { display: block; width: 24px; height: 1px; background: var(--cream); transition: transform .35s, opacity .35s, width .35s; }
.hamburger.open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; width: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ── MOBILE MENU ──────────────────────────────────── */
.i2mp-mobile-menu {
  position: fixed; inset: 0; z-index: 999;
  background: rgba(12,14,10,.98); backdrop-filter: blur(16px);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2.2rem;
  opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s;
}
.i2mp-mobile-menu.open { opacity: 1; visibility: visible; }
.i2mp-mobile-menu a { font-family: 'Questrial', serif; font-size: clamp(1.8rem,6vw,3.2rem); font-weight: 300; color: var(--cream); text-decoration: none; letter-spacing: .04em; opacity: 0; transform: translateY(28px); transition: color .3s, opacity .5s var(--ease), transform .5s var(--ease); }
.i2mp-mobile-menu.open a { opacity: 1; transform: translateY(0); }
.i2mp-mobile-menu.open a:nth-child(1){transition-delay:.05s} .i2mp-mobile-menu.open a:nth-child(2){transition-delay:.1s} .i2mp-mobile-menu.open a:nth-child(3){transition-delay:.15s} .i2mp-mobile-menu.open a:nth-child(4){transition-delay:.2s} .i2mp-mobile-menu.open a:nth-child(5){transition-delay:.25s} .i2mp-mobile-menu.open a:nth-child(6){transition-delay:.3s} .i2mp-mobile-menu.open a:nth-child(7){transition-delay:.35s}
.i2mp-mobile-menu a:hover { color: var(--green); }
.mmcta { border: 1px solid var(--green) !important; padding: .8rem 2.5rem; font-family: var(--font-sans) !important; font-size: .8rem !important; letter-spacing: .14em; color: var(--green) !important; font-weight: 500 !important; }

/* ── SHARED LAYOUT ────────────────────────────────── */
section { padding: 8rem 4rem; }
.section-eyebrow { font-size: .7rem; letter-spacing: .28em; text-transform: uppercase; color: var(--green); font-weight: 500; margin-bottom: 1rem; display: flex; align-items: center; gap: .8rem; }
.section-eyebrow::before { content: ''; display: inline-block; width: 28px; height: 1px; background: var(--green); }
.section-title { font-family: 'QUESTRIAL', serif; font-size: clamp(2.4rem,4.5vw,3.8rem); font-weight: 300; line-height: 1.1; margin-bottom: 1.5rem; }
.section-title em { font-style: italic; color: var(--green-light); }

/* ── REVEAL ANIMATIONS ────────────────────────────── */
/* ── Scroll reveal — desktop only ─────────────────────────────────
   On mobile: always visible (opacity:1) so images never get stuck
   hidden when IntersectionObserver doesn't fire.
   On desktop (hover/pointer capable): start hidden, animate in.
   ──────────────────────────────────────────────────────────────── */

/* Mobile first — always visible */
.reveal, .reveal-r, .reveal-s {
  opacity: 1;
  transform: none;
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}

/* Desktop only — start hidden, reveal on scroll */
@media (hover: hover) and (pointer: fine) {
  .reveal        { opacity: 0; transform: translateY(38px); }
  .reveal-r      { opacity: 0; transform: translateX(38px); }
  .reveal-s      { opacity: 0; transform: scale(.94); }
  .reveal.visible  { opacity: 1; transform: translateY(0); }
  .reveal-r.visible { opacity: 1; transform: translateX(0); }
  .reveal-s.visible { opacity: 1; transform: scale(1); }
}
.d1{transition-delay:.08s} .d2{transition-delay:.16s} .d3{transition-delay:.24s} .d4{transition-delay:.32s} .d5{transition-delay:.4s} .d6{transition-delay:.48s}

/* ── BUTTONS ──────────────────────────────────────── */
.btn-p { background: var(--green); color: #fff; padding: .95rem 2.4rem; font-family: var(--font-sans); font-size: .79rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; cursor: none; border: none; transition: background .3s, transform .2s, box-shadow .3s; display: inline-block; }
.btn-p:hover { background: var(--green-light); transform: translateY(-2px); box-shadow: 0 12px 40px rgba(14,199,63,.35); }
.btn-g { color: var(--cream); padding: .95rem 2.4rem; font-family: var(--font-sans); font-size: .79rem; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; cursor: none; border: 1px solid rgba(240,244,235,.22); transition: border-color .3s, color .3s; display: inline-block; }
.btn-g:hover { border-color: var(--cream); color: #fff; }
.btn-go { color: var(--green); padding: .95rem 2.4rem; font-family: var(--font-sans); font-size: .79rem; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; cursor: none; border: 1px solid var(--border); transition: border-color .3s, color .3s, background .3s; display: inline-block; }
.btn-go:hover { border-color: var(--green); background: rgba(14,199,63,.08); }

/* ── HERO ─────────────────────────────────────────── */
.i2mp-hero { position: relative; min-height: 100vh; display: flex; align-items: center; overflow: hidden; padding-top: 90px; }
.hero-bg { position: absolute; inset: 0; background: linear-gradient(135deg,rgba(12,14,10,.97) 0%,rgba(12,14,10,.78) 55%,rgba(12,14,10,.5) 100%), linear-gradient(to bottom,transparent 55%,var(--dark) 100%); z-index: 1; }
.hero-grid { position: absolute; inset: 0; z-index: 0; background-image: linear-gradient(rgba(14,199,63,.04) 1px,transparent 1px), linear-gradient(90deg,rgba(14,199,63,.04) 1px,transparent 1px); background-size: 80px 80px; animation: gridShift 22s linear infinite; }
@keyframes gridShift { from{background-position:0 0} to{background-position:80px 80px} }
.hero-images { position: absolute; inset: 0; z-index: 0; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 2px; }
.hero-images img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(25%) brightness(.32); transition: filter 6s ease; display: block; }
.hero-images img.loaded { filter: grayscale(15%) brightness(.36); }
.hero-vig { position: absolute; inset: 0; z-index: 1; background: radial-gradient(ellipse 100% 80% at 20% 50%,rgba(12,14,10,.5) 0%,transparent 70%); }
.hero-content { position: relative; z-index: 2; padding: 0 4rem; max-width: 920px; }
.hero-ey { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.8rem; }
.hero-ey-line { width: 48px; height: 1px; background: var(--green); animation: expandLine 1s ease .3s forwards; transform-origin: left; transform: scaleX(0); }
@keyframes expandLine { to { transform: scaleX(1); } }
.hero-ey-text { font-size: .72rem; letter-spacing: .25em; text-transform: uppercase; color: var(--green); font-weight: 500; opacity: 1; animation: none; }
@media (hover: hover) and (pointer: fine) {
  .hero-ey-text { opacity: 0; animation: fadeUp .8s ease .5s forwards; }
}
.hero-title { font-family: 'QUESTRIAL', serif; font-size: clamp(3.2rem,7.5vw,6.8rem); font-weight: 300; line-height: .92; letter-spacing: -.01em; margin-bottom: 1.8rem; overflow: hidden; }
.htl { display: block; opacity: 1; transform: none; animation: none; }
@media (hover: hover) and (pointer: fine) {
  .htl { opacity: 0; transform: translateY(65px); animation: slideUp 1s var(--ease) forwards; }
}
.htl:nth-child(1){animation-delay:.2s} .htl:nth-child(2){animation-delay:.38s} .htl:nth-child(3){animation-delay:.54s}
.hero-title em { font-style: italic; color: var(--green-light); }
@keyframes slideUp { to{opacity:1;transform:translateY(0)} }
@keyframes fadeUp { to{opacity:1;transform:translateY(0)} }
.hero-sub { font-size: 1.05rem; line-height: 1.75; color: var(--muted); max-width: 530px; margin-bottom: 2.8rem; opacity: 1; transform: none; animation: none; }
@media (hover: hover) and (pointer: fine) {
  .hero-sub { opacity: 0; transform: translateY(20px); animation: fadeUp 1s ease .9s forwards; }
}
.hero-sub strong { color: var(--cream); font-weight: 500; }
.hero-actions { display: flex; gap: 1.2rem; align-items: center; opacity: 1; transform: none; }
.hero-scroll { position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: .5rem; z-index: 3; opacity: 1; }
@media (hover: hover) and (pointer: fine) {
  .hero-actions { opacity: 0; animation: fadeUp 1s ease 1.1s forwards; transform: translateY(20px); }
  .hero-scroll  { opacity: 0; animation: fadeUp 1s ease 1.5s forwards; }
}
.hero-scroll-text { font-size: .6rem; letter-spacing: .28em; text-transform: uppercase; color: var(--muted); }
.scroll-line { width: 1px; height: 50px; background: linear-gradient(to bottom,var(--green),transparent); animation: scrollPulse 2s ease-in-out infinite; }
@keyframes scrollPulse { 0%,100%{transform:scaleY(1);opacity:1}50%{transform:scaleY(.45);opacity:.35} }
.hero-badge { position: absolute; right: 4rem; top: 50%; z-index: 3; width: 110px; height: 110px; border: 1px solid var(--border); border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; opacity: 1; animation: badgeSpin 28s linear infinite; }
@media (hover: hover) and (pointer: fine) {
  .hero-badge { opacity: 0; animation: badgeFade 1s ease 1.3s forwards, badgeSpin 28s linear 1.3s infinite; }
}
@keyframes badgeFade { to{opacity:1} }
@keyframes badgeSpin { from{transform:translateY(-50%) rotate(0deg)} to{transform:translateY(-50%) rotate(360deg)} }
.hero-badge-inner { animation: badgeSpinRev 28s linear infinite; }
@keyframes badgeSpinRev { from{transform:rotate(0deg)} to{transform:rotate(-360deg)} }
.hero-badge-cert { font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: var(--green); font-weight: 500; line-height: 1.5; }

/* ── MARQUEE ──────────────────────────────────────── */
.i2mp-marquee { background: var(--green); overflow: hidden; padding: .85rem 0; }
.mq-track { display: flex; gap: 0; animation: marquee 32s linear infinite; white-space: nowrap; }
.mq-item { display: inline-flex; align-items: center; gap: 1.8rem; padding: 0 1.8rem; font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: #F0F4EB; }
.mq-dot { width: 4px; height: 4px; background: rgba(240,244,235,.4); border-radius: 50%; flex-shrink: 0; }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── INTRO STRIP ──────────────────────────────────── */
.i2mp-intro { background: var(--dark-3); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 7rem 4rem; display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.intro-text p { font-size: 1.02rem; line-height: 1.82; color: var(--muted); margin-bottom: 1.2rem; }
.intro-text p strong { color: var(--cream); font-weight: 500; }
.intro-text p:last-of-type { margin-bottom: 1.8rem; }
.intro-right { border-left: 1px solid var(--border); padding-left: 4rem; }
.intro-right blockquote { font-family: 'QUESTRIAL', serif; font-size: 1.55rem; font-weight: 300; line-height: 1.55; color: rgba(240,244,235,.78); font-style: italic; margin-bottom: 2rem; }
.intro-right cite { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--green); font-style: normal; }

/* ── STATS ────────────────────────────────────────── */
.i2mp-stats { background: var(--dark-2); border-bottom: 1px solid var(--border); padding: 5rem 4rem; }
.stats-grid { display: grid; grid-template-columns: repeat(4,1fr); background: var(--border); border: 1px solid var(--border); gap: 1px; }
.stat-card { background: var(--dark-2); padding: 3.5rem 2.5rem; text-align: center; position: relative; overflow: hidden; transition: background .4s; }
.stat-card::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg,rgba(14,199,63,.06),transparent); opacity: 0; transition: opacity .4s; }
.stat-card:hover { background: rgba(14,199,63,.04); }
.stat-card:hover::before { opacity: 1; }
.stat-num { font-family: 'QUESTRIAL', serif; font-size: clamp(3rem,5vw,4.5rem); font-weight: 300; color: var(--green); line-height: 1; display: block; }
.stat-suf { font-family: 'QUESTRIAL', serif; font-size: .55em; font-weight: 300; color: var(--green-light); }
.stat-label { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); margin-top: .6rem; display: block; }
.stat-desc { font-size: .8rem; color: rgba(240,244,235,.3); margin-top: .35rem; }

/* ── SERVICES ─────────────────────────────────────── */
.i2mp-services { background: var(--dark); }
.svcs-hdr { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 4rem; gap: 2rem; flex-wrap: wrap; }
.svcs-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); }
.svc-card { background: var(--dark-2); padding: 3rem 2.5rem; transition: background .4s; position: relative; overflow: hidden; }
.svc-card::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 1.5px; background: linear-gradient(to right,var(--green),var(--green-light)); transition: width .5s ease; }
.svc-card:hover { background: #111a0d; }
.svc-card:hover::after { width: 100%; }
.svc-num { font-family: 'QUESTRIAL', serif; font-size: 4.5rem; font-weight: 300; color: rgba(14,199,63,.1); line-height: 1; margin-bottom: 1.2rem; transition: color .4s; }
.svc-card:hover .svc-num { color: rgba(14,199,63,.22); }
.svc-icon { font-size: 1.4rem; margin-bottom: .9rem; }
.svc-name { font-family: 'QUESTRIAL', serif; font-size: 1.38rem; font-weight: 600; margin-bottom: .75rem; line-height: 1.2; color: var(--cream); }
.svc-desc { font-size: .87rem; color: var(--muted); line-height: 1.72; }

/* ── WORKFLOW ─────────────────────────────────────── */
.i2mp-workflow { background: var(--dark-3); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.wf-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center; }
.wf-steps { list-style: none; margin-top: 2rem; }
.wf-step { display: flex; gap: 1.5rem; align-items: flex-start; padding: 1.5rem 0; border-bottom: 1px solid var(--border); }
.wf-step:last-child { border-bottom: none; }
.wf-num { font-family: 'QUESTRIAL', serif; font-size: 1.05rem; color: var(--green); font-weight: 600; min-width: 2rem; padding-top: 2px; }
.wf-txt { font-size: .87rem; color: var(--muted); line-height: 1.65; }
.wf-txt strong { color: var(--cream); font-weight: 500; display: block; margin-bottom: .25rem; font-size: .95rem; }
.wf-right { position: relative; padding-bottom: 3rem; }
.wf-img-main { width: 100%; aspect-ratio: 4/3; object-fit: cover; filter: grayscale(15%) brightness(.78); display: block; }
.wf-img-acc { position: absolute; bottom: -2rem; right: -2rem; width: 58%; aspect-ratio: 1; object-fit: cover; border: 3px solid var(--dark-3); filter: grayscale(15%) brightness(.82); transition: transform .5s var(--ease); }
.wf-right:hover .wf-img-acc { transform: translate(-6px,-6px); }
.wf-tag { position: absolute; top: 1.5rem; left: 1.5rem; background: rgba(14,199,63,.9); color: #fff; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; padding: .38rem .85rem; z-index: 1; }

/* ── SHOWREEL ─────────────────────────────────────── */
.i2mp-showreel { background: var(--dark); padding: 8rem 4rem; text-align: center; position: relative; }
.i2mp-showreel::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 60% at 50% 50%,rgba(14,199,63,.04) 0%,transparent 70%); pointer-events: none; }
.reel-wrap { position: relative; max-width: 1000px; margin: 0 auto; aspect-ratio: 16/9; overflow: hidden; border: 1px solid var(--border); cursor: none; }
.reel-thumb { width: 100%; height: 100%; object-fit: cover; filter: grayscale(20%) brightness(.7); transition: filter .5s, transform .6s var(--ease); display: block; }
.reel-wrap:hover .reel-thumb { filter: grayscale(5%) brightness(.85); transform: scale(1.02); }
.reel-overlay { position: absolute; inset: 0; background: rgba(12,14,10,.35); display: flex; align-items: center; justify-content: center; transition: background .4s; }
.reel-wrap:hover .reel-overlay { background: rgba(12,14,10,.18); }
.play-btn { width: 90px; height: 90px; border-radius: 50%; border: 1.5px solid rgba(240,244,235,.8); background: rgba(12,14,10,.35); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; cursor: none; transition: transform .4s var(--ease),border-color .3s,background .3s; position: relative; }
.play-btn::before { content: ''; position: absolute; inset: -12px; border: 1px solid rgba(240,244,235,.15); border-radius: 50%; animation: ripple 2.5s ease-in-out infinite; }
@keyframes ripple { 0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.12);opacity:.2} }
.play-icon { width: 0; height: 0; border-style: solid; border-width: 14px 0 14px 26px; border-color: transparent transparent transparent var(--cream); margin-left: 5px; }
.reel-wrap:hover .play-btn { transform: scale(1.12); border-color: var(--green); background: rgba(14,199,63,.18); }
.reel-wrap:hover .play-icon { border-color: transparent transparent transparent var(--green); }
.reel-label { position: absolute; bottom: 1.5rem; left: 1.5rem; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(240,244,235,.55); }
.reel-year { position: absolute; bottom: 1.5rem; right: 1.5rem; font-family: 'QUESTRIAL', serif; font-size: 1.1rem; font-weight: 300; color: var(--green); }

/* ── YT MODAL ─────────────────────────────────────── */
.yt-modal { position: fixed; inset: 0; z-index: 10000; background: rgba(4,6,2,.96); backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s; }
.yt-modal.open { opacity: 1; visibility: visible; }
.yt-inner { width: min(900px,92vw); aspect-ratio: 16/9; position: relative; }
.yt-inner iframe { width: 100%; height: 100%; border: none; }
.yt-close { position: absolute; top: -3rem; right: 0; background: none; border: none; color: var(--cream); cursor: none; opacity: .7; transition: opacity .2s, color .2s; font-family: var(--font-sans); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; }
.yt-close:hover { opacity: 1; color: var(--green); }

/* ── GALLERY ──────────────────────────────────────── */
.i2mp-gallery { background: var(--dark); padding: 8rem 4rem; }
.gal-hdr { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3rem; gap: 2rem; flex-wrap: wrap; }
.gal-grid { display: grid; grid-template-columns: repeat(4,1fr); grid-auto-rows: 220px; gap: 3px; }
.gal-item { overflow: hidden; position: relative; cursor: none; }
.gal-item:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.gal-item:nth-child(5) { grid-column: span 2; }
.gal-item:nth-child(9) { grid-column: span 2; }
.gal-item img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(22%) brightness(.7); transition: transform .7s var(--ease), filter .5s; display: block; }
.gal-item:hover img { transform: scale(1.08); filter: grayscale(0%) brightness(.88); }
.gal-ov { position: absolute; inset: 0; background: linear-gradient(to top,rgba(12,14,10,.75) 0%,transparent 55%); opacity: 0; transition: opacity .4s; display: flex; align-items: flex-end; padding: 1.2rem; }
.gal-item:hover .gal-ov { opacity: 1; }
.gal-label { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--green); }


/* ── Portfolio video grid ────────────────────────────────────── */
.gal-item--video { cursor: pointer; }

/* 16:9 thumbnail container */
.gal-thumb-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
  overflow: hidden;
  background: #0a0a0a;
}
.gal-thumb-wrap img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(.82);
  transition: transform .5s cubic-bezier(.16,1,.3,1), filter .4s;
}
.gal-item--video:hover .gal-thumb-wrap img {
  transform: scale(1.04);
  filter: brightness(.95);
}

/* Overlay — always covers thumb */
.gal-item--video .gal-ov {
  position: absolute;
  inset: 0;
  top: 0; /* reset any existing positioning */
  background: rgba(12,14,10,.22);
  opacity: 1; /* always visible — not just on hover */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: background .3s;
  padding: 1rem;
}
.gal-item--video:hover .gal-ov {
  background: rgba(12,14,10,.08);
}

/* Play button — always visible */
.gal-play-btn {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 2.5px solid rgba(255,255,255,.92);
  background: rgba(12,14,10,.45);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .3s, border-color .3s, background .3s;
  flex-shrink: 0;
}
.gal-play-icon {
  width: 0; height: 0;
  border-style: solid;
  border-width: 11px 0 11px 22px;
  border-color: transparent transparent transparent #fff;
  margin-left: 5px;
  transition: border-color .3s;
}
.gal-item--video:hover .gal-play-btn {
  transform: scale(1.12);
  border-color: var(--green);
  background: rgba(14,199,63,.22);
}
.gal-item--video:hover .gal-play-icon {
  border-color: transparent transparent transparent var(--green);
}

/* Category label — bottom of overlay */
.gal-item--video .gal-label {
  position: absolute;
  bottom: .8rem;
  left: .8rem;
  font-size: .6rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--green);
  background: rgba(12,14,10,.7);
  border: 1px solid rgba(14,199,63,.3);
  padding: .2rem .6rem;
  line-height: 1;
}

/* Video title bar below thumbnail */
.gal-title-bar {
  background: var(--dark-2);
  border-top: 1px solid var(--border);
  padding: .75rem 1rem;
  font-family: 'Courier New', monospace;
  font-size: .78rem;
  color: var(--muted);
  line-height: 1.3;
  transition: color .25s;
  /* Clamp to one line */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gal-item--video:hover .gal-title-bar {
  color: var(--cream);
}


/* ── TESTIMONIALS ─────────────────────────────────── */
.i2mp-testimonials { background: var(--dark-2); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 8rem 4rem; overflow: hidden; }
.t-hdr { text-align: center; margin-bottom: 4rem; }
.t-track-wrap { overflow: hidden; }
.t-track { display: flex; gap: 2rem; transition: transform .6s var(--ease); will-change: transform; }
.t-card { flex: 0 0 calc(33.333% - 1.34rem); background: var(--dark-3); border: 1px solid var(--border); padding: 2.5rem; position: relative; transition: border-color .4s, transform .4s; }
.t-card.active { border-color: rgba(14,199,63,.5); transform: translateY(-4px); }
.t-card::before { content: '\201C'; font-family: 'QUESTRIAL', serif; font-size: 5rem; font-weight: 300; color: rgba(14,199,63,.12); position: absolute; top: .5rem; left: 1.5rem; line-height: 1; }
.t-stars { display: flex; gap: 3px; margin-bottom: 1.2rem; }
.star { width: 12px; height: 12px; background: var(--green); clip-path: polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%); }
.t-text { font-size: .95rem; line-height: 1.75; color: rgba(240,244,235,.75); margin-bottom: 1.8rem; font-style: italic; }
.t-author { display: flex; align-items: center; gap: .8rem; }
.t-avatar { width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg,var(--green),var(--dark-3)); display: flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 600; color: #fff; flex-shrink: 0; }
.t-name { font-size: .85rem; font-weight: 500; color: var(--cream); }
.t-role { font-size: .75rem; color: var(--muted); }
.t-controls { display: flex; align-items: center; justify-content: center; gap: 1.5rem; margin-top: 3rem; }
.t-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(240,244,235,.2); cursor: none; transition: background .3s, transform .3s; border: none; }
.t-dot.active { background: var(--green); transform: scale(1.3); }
.t-btn { background: transparent; border: 1px solid var(--border); color: var(--muted); width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; cursor: none; transition: border-color .3s, color .3s; font-size: 1rem; }
.t-btn:hover { border-color: var(--green); color: var(--green); }

/* ── WHY US ───────────────────────────────────────── */
.i2mp-why { background: var(--dark-3); }
.why-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center; }
.why-list { list-style: none; margin-top: 2rem; }
.why-item { display: flex; gap: 1.2rem; align-items: flex-start; padding: 1.2rem 0; border-bottom: 1px solid var(--border); transition: padding-left .3s; }
.why-item:first-child { border-top: 1px solid var(--border); }
.why-item:hover { padding-left: 6px; }
.why-check { width: 22px; height: 22px; border: 1px solid var(--green); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px; font-size: .68rem; color: var(--green); transition: background .3s, color .3s; }
.why-item:hover .why-check { background: var(--green); color: #fff; }
.why-txt { font-size: .87rem; color: var(--muted); line-height: 1.65; }
.why-txt strong { color: var(--cream); font-weight: 500; display: block; margin-bottom: .15rem; font-size: .93rem; }
.why-right { display: flex; flex-direction: column; gap: 2rem; }
.why-quote { background: var(--dark-2); border: 1px solid var(--border); border-left: 3px solid var(--green); padding: 2.8rem; }
.why-q-text { font-family: 'QUESTRIAL', serif; font-size: 1.5rem; font-weight: 300; font-style: italic; line-height: 1.5; color: var(--cream); margin-bottom: 1.5rem; }
.why-q-auth { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--green); }
.cert-badge { background: var(--dark-2); border: 1px solid var(--border); padding: 1.8rem; display: flex; align-items: center; gap: 1.5rem; }
.cert-icon { width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--green); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 1.3rem; }
.cert-lbl { font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; color: var(--green); display: block; margin-bottom: .25rem; }
.cert-ttl { font-size: .95rem; color: var(--cream); font-weight: 500; }
.cert-sub { font-size: .82rem; color: var(--muted); margin-top: .3rem; }

/* ── AREAS ────────────────────────────────────────── */
.i2mp-areas { background: var(--dark-2); border-top: 1px solid var(--border); padding: 5rem 4rem; text-align: center; }
.areas-text { font-family: 'QUESTRIAL', serif; font-size: clamp(1.5rem,3vw,2.2rem); font-weight: 300; color: var(--muted); max-width: 720px; margin: 0 auto 2.5rem; line-height: 1.55; }
.areas-text strong { color: var(--cream); font-weight: 600; }
.areas-text em { color: var(--green-light); font-style: italic; }
.areas-grid { display: flex; justify-content: center; border: 1px solid var(--border); max-width: 700px; margin: 0 auto; flex-wrap: wrap; }
.area-cell { padding: 2rem 3rem; border-right: 1px solid var(--border); flex: 1; text-align: center; transition: background .3s; min-width: 150px; }
.area-cell:last-child { border-right: none; }
.area-cell:hover { background: rgba(14,199,63,.05); }
.area-name { font-family: 'QUESTRIAL', serif; font-size: 1.4rem; font-weight: 300; color: var(--cream); display: block; margin-bottom: .2rem; }
.area-sub { font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: var(--green); }

/* ── BLOG ─────────────────────────────────────────── */
.i2mp-blog { background: var(--dark); border-top: 1px solid var(--border); }
.blog-hdr { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 4rem; gap: 2rem; flex-wrap: wrap; }
.blog-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 1px; background: var(--border); border: 1px solid var(--border); }
.blog-card { background: var(--dark-2); overflow: hidden; position: relative; cursor: none; transition: background .4s; text-decoration: none; display: block; }
.blog-card:hover { background: #111a0d; }
.blog-img-w { overflow: hidden; height: 220px; }
.blog-card:first-child .blog-img-w { height: 320px; }
.blog-img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(20%) brightness(.72); transition: transform .6s var(--ease), filter .5s; display: block; }
.blog-card:hover .blog-img { transform: scale(1.06); filter: grayscale(5%) brightness(.88); }
.blog-body { padding: 2rem; }
.blog-tag { font-size: .64rem; letter-spacing: .2em; text-transform: uppercase; color: var(--green); margin-bottom: .6rem; display: block; }
.blog-title { font-family: 'QUESTRIAL', serif; font-size: 1.3rem; font-weight: 400; line-height: 1.3; margin-bottom: .8rem; color: var(--cream); transition: color .3s; }
.blog-card:first-child .blog-title { font-size: 1.7rem; }
.blog-card:hover .blog-title { color: var(--green-light); }
.blog-exc { font-size: .84rem; color: var(--muted); line-height: 1.65; margin-bottom: 1.2rem; }
.blog-meta { font-size: .7rem; color: rgba(240,244,235,.3); letter-spacing: .08em; }
.blog-arr { position: absolute; bottom: 2rem; right: 2rem; width: 38px; height: 38px; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; color: var(--muted); transition: border-color .3s, color .3s, transform .3s; }
.blog-card:hover .blog-arr { border-color: var(--green); color: var(--green); transform: translate(3px,-3px); }

/* ── CONTACT ──────────────────────────────────────── */
.i2mp-contact { background: var(--dark-3); border-top: 1px solid var(--border); }
.ct-inner { display: grid; grid-template-columns: 1fr 1.4fr; gap: 6rem; align-items: start; }
.ct-lbl { font-size: .68rem; letter-spacing: .22em; text-transform: uppercase; color: var(--green); margin-bottom: .4rem; display: block; margin-top: 2rem; }
.ct-val { font-size: .95rem; color: var(--cream); }
.ct-val a { color: var(--cream); text-decoration: none; transition: color .2s; }
.ct-val a:hover { color: var(--green); }
.ct-div { height: 1px; background: var(--border); margin: 2.5rem 0; }
.ct-socials { display: flex; gap: 1.2rem; flex-wrap: wrap; margin-top: 1rem; }
.ct-soc { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); text-decoration: none; border: 1px solid var(--border); padding: .4rem .85rem; transition: border-color .3s, color .3s; }
.ct-soc:hover { border-color: var(--green); color: var(--green); }
.i2mp-cf { display: flex; flex-direction: column; gap: 0; }
.cf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; }
.cf-grp { position: relative; margin-bottom: 1px; }
.cf-grp label { position: absolute; top: 1.1rem; left: 1.2rem; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); transition: top .25s, font-size .25s, color .25s; pointer-events: none; z-index: 1; }
.cf-grp.focused label, .cf-grp.has-val label { top: .45rem; font-size: .58rem; color: var(--green); }
.cf-grp input, .cf-grp select, .cf-grp textarea { width: 100%; background: var(--dark-2); border: none; border-bottom: 1px solid var(--border); color: var(--cream); font-family: var(--font-sans); font-size: .95rem; font-weight: 300; padding: 1.7rem 1.2rem .7rem; outline: none; transition: border-color .3s, background .3s; resize: none; appearance: none; -webkit-appearance: none; cursor: none; }
.cf-grp textarea { height: 140px; }
.cf-grp input:focus, .cf-grp select:focus, .cf-grp textarea:focus { border-color: var(--green); background: #111a0d; }
.cf-grp select option { background: var(--dark-2); }
.cf-submit { background: var(--green); color: #fff; border: none; padding: 1.3rem 2.5rem; font-family: var(--font-sans); font-size: .8rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; cursor: none; width: 100%; transition: background .3s, letter-spacing .3s; margin-top: 1px; }
.cf-submit:hover { background: var(--green-light); letter-spacing: .22em; }
.cf-success { display: none; text-align: center; padding: 3rem; background: rgba(14,199,63,.05); border: 1px solid var(--border); }
.cf-success h3 { font-family: 'QUESTRIAL', serif; font-size: 1.8rem; font-weight: 300; color: var(--cream); margin-bottom: .8rem; }
.cf-success p { color: var(--muted); font-size: .9rem; }

/* ── CTA BANNER ───────────────────────────────────── */
.i2mp-cta { background: var(--dark); border-top: 1px solid var(--border); padding: 9rem 4rem; text-align: center; position: relative; overflow: hidden; }
.i2mp-cta::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 90% 70% at 50% 100%,rgba(14,199,63,.07) 0%,transparent 70%); pointer-events: none; }
.i2mp-cta::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 600px; height: 1px; background: linear-gradient(to right,transparent,var(--green),transparent); }
.cta-title { font-family: 'QUESTRIAL', serif; font-size: clamp(2.8rem,5.5vw,5rem); font-weight: 300; line-height: 1.08; margin-bottom: 1.5rem; }
.cta-title em { font-style: italic; color: var(--green-light); }
.cta-sub { font-size: 1rem; color: var(--muted); max-width: 480px; margin: 0 auto 3rem; line-height: 1.72; }
.cta-acts { display: flex; gap: 1.2rem; justify-content: center; flex-wrap: wrap; }

/* ── SOCIAL STRIP ─────────────────────────────────── */
.i2mp-social-strip { background: var(--dark-2); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 2.2rem 4rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.soc-lbl { font-size: .67rem; letter-spacing: .25em; text-transform: uppercase; color: var(--muted); }
.soc-icons { display: flex; gap: 1.8rem; flex-wrap: wrap; }
.soc-icons a { color: var(--muted); text-decoration: none; font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; transition: color .3s; }
.soc-icons a:hover { color: var(--green); }
.aerial-link { font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--green); text-decoration: none; border: 1px solid var(--green); padding: .5rem 1.2rem; transition: background .3s, color .3s; white-space: nowrap; }
.aerial-link:hover { background: var(--green); color: #fff; }

/* ── FOOTER ───────────────────────────────────────── */
.i2mp-footer { background: #060804; padding: 6rem 4rem 3rem; }
.ft-top { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 4rem; padding-bottom: 4rem; border-bottom: 1px solid var(--border); }
.ft-brand-logo { display: flex; align-items: center; gap: .8rem; margin-bottom: 1.4rem; }
.ft-brand-logo img { width: 38px; height: 38px; object-fit: contain; }
.ft-brand-name { font-family: 'QUESTRIAL', serif; font-size: 1rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cream); line-height: 1.15; }
.ft-brand-name span { color: var(--green); }
.ft-tag { font-size: .86rem; color: var(--muted); line-height: 1.75; max-width: 280px; margin-bottom: 1.5rem; }
.ft-cert { background: rgba(14,199,63,.1); border: 1px solid rgba(14,199,63,.25); padding: .3rem .8rem; font-size: .64rem; letter-spacing: .15em; text-transform: uppercase; color: var(--green); display: inline-block; margin-bottom: 1.5rem; }
.ft-ci { font-size: .82rem; color: var(--muted); margin-bottom: .45rem; }
.ft-ci a { color: var(--muted); text-decoration: none; transition: color .2s; }
.ft-ci a:hover { color: var(--green); }
.ft-col-ttl { font-size: .67rem; letter-spacing: .22em; text-transform: uppercase; color: var(--green); font-weight: 500; margin-bottom: 1.5rem; padding-bottom: .7rem; border-bottom: 1px solid var(--border); }
.ft-links { list-style: none; }
.ft-links li { margin-bottom: .75rem; }
.ft-links a { font-size: .84rem; color: var(--muted); text-decoration: none; transition: color .3s, padding-left .3s; }
.ft-links a:hover { color: var(--cream); padding-left: 4px; }
.ft-bottom { display: flex; align-items: center; justify-content: space-between; padding-top: 2rem; font-size: .7rem; color: rgba(240,244,235,.25); letter-spacing: .08em; flex-wrap: wrap; gap: 1rem; }
.ft-cert-sm { background: rgba(14,199,63,.07); border: 1px solid rgba(14,199,63,.15); padding: .25rem .7rem; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(14,199,63,.6); }

/* ── WP PAGE / SINGLE ─────────────────────────────── */
.i2mp-page-hero { background: var(--dark-3); border-bottom: 1px solid var(--border); padding: 8rem 4rem 4rem; text-align: center; }
.i2mp-page-hero h1 { font-family: 'QUESTRIAL', serif; font-size: clamp(2.5rem,5vw,4rem); font-weight: 300; }
.i2mp-page-content { max-width: 800px; margin: 0 auto; padding: 5rem 4rem; }
.i2mp-page-content h1,.i2mp-page-content h2,.i2mp-page-content h3 { font-family: 'QUESTRIAL', serif; font-weight: 300; margin-bottom: 1rem; color: var(--cream); }
.i2mp-page-content p { font-size: 1rem; line-height: 1.8; color: var(--muted); margin-bottom: 1.5rem; }
.i2mp-page-content a { color: var(--green); transition: color .2s; }
.i2mp-page-content a:hover { color: var(--green-light); }
.i2mp-post-meta { font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 3rem; }
.i2mp-post-thumb { width: 100%; aspect-ratio: 16/9; object-fit: cover; margin-bottom: 3rem; filter: brightness(.85); }

/* ── RESPONSIVE ───────────────────────────────────── */
@media(max-width:1024px) {
  .hero-badge { display: none; }
  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .svcs-grid { grid-template-columns: repeat(2,1fr); }
  .t-card { flex: 0 0 calc(50% - 1rem); }
  .blog-grid { grid-template-columns: 1fr; }
  .ft-top { grid-template-columns: 1fr 1fr; gap: 3rem; }
}
@media(max-width:768px) {
  .i2mp-nav,.i2mp-nav.scrolled { padding: 1rem 1.5rem; }
  .i2mp-topbar { padding: .4rem 1.5rem; font-size: .65rem; }
  .topbar-left span,.topbar-right { display: none; }
  .nav-links { display: none; }
  .hamburger { display: flex; }
  section { padding: 5rem 1.5rem; }
  .hero-content { padding: 0 1.5rem; }
  .hero-actions { flex-direction: column; align-items: flex-start; }
  .i2mp-intro { grid-template-columns: 1fr; gap: 2.5rem; padding: 5rem 1.5rem; }
  .intro-right { border-left: none; padding-left: 0; border-top: 1px solid var(--border); padding-top: 2rem; }
  .wf-inner,.why-inner,.ct-inner { grid-template-columns: 1fr; gap: 3rem; }
  .wf-img-acc { display: none; }
  .gal-grid { grid-template-columns: repeat(2,1fr); grid-auto-rows: 180px; }
  .gal-item:nth-child(1) { grid-column: span 2; }
  .gal-item:nth-child(5),.gal-item:nth-child(9) { grid-column: span 1; }
  .svcs-grid { grid-template-columns: 1fr; }
  .svcs-hdr,.blog-hdr,.gal-hdr { flex-direction: column; align-items: flex-start; }
  .t-card { flex: 0 0 85vw; }
  .areas-grid { flex-direction: column; }
  .area-cell { border-right: none; border-bottom: 1px solid var(--border); }
  .area-cell:last-child { border-bottom: none; }
  .i2mp-social-strip { flex-direction: column; text-align: center; padding: 2rem 1.5rem; }
  .ft-top { grid-template-columns: 1fr; gap: 2.5rem; padding: 0 0 3rem; }
  .ft-bottom { flex-direction: column; text-align: center; }
  .cf-row { grid-template-columns: 1fr; }
  .cta-acts { flex-direction: column; align-items: center; }
  .i2mp-stats { padding: 5rem 1.5rem; }
  .i2mp-showreel { padding: 5rem 1.5rem; }
  .i2mp-page-content { padding: 3rem 1.5rem; }
}


/* ══════════════════════════════════════════════════════
   NEW SECTIONS — Competitor-Gap Upgrades
   ══════════════════════════════════════════════════════ */

/* ── 1. CLIENT LOGOS ──────────────────────────────────── */
.i2mp-clients{background:var(--dark-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:4rem}
.clients-eyebrow{text-align:center;margin-bottom:2.5rem}
.clients-eyebrow p{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted)}
.clients-marquee-wrap{overflow:hidden;position:relative;-webkit-mask:linear-gradient(to right,transparent,black 10%,black 90%,transparent);mask:linear-gradient(to right,transparent,black 10%,black 90%,transparent)}
.clients-track{display:flex;gap:0;animation:clientsScroll 28s linear infinite;white-space:nowrap}
.clients-track:hover{animation-play-state:paused}
.client-logo{display:inline-flex;align-items:center;justify-content:center;padding:0 3rem;height:60px;opacity:.4;transition:opacity .3s,filter .3s;flex-shrink:0;filter:grayscale(1) brightness(1.4)}
.client-logo:hover{opacity:.85;filter:grayscale(0) brightness(1)}
.client-logo-text{font-family:'QUESTRIAL',serif;font-size:1.3rem;font-weight:600;color:var(--cream);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.client-logo-sep{width:1px;height:20px;background:var(--border);flex-shrink:0;margin:0 1.5rem}
@keyframes clientsScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── 2. EQUIPMENT STRIP ───────────────────────────────── */
.i2mp-equipment{background:var(--dark-3);border-bottom:1px solid var(--border);padding:3.5rem 4rem}
.equip-inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.equip-label{font-size:.68rem;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);flex-shrink:0}
.equip-divider{width:1px;height:36px;background:var(--border);flex-shrink:0}
.equip-items{display:flex;align-items:center;gap:0;flex:1;flex-wrap:wrap}
.equip-item{display:flex;align-items:center;gap:.75rem;padding:.6rem 2rem;border-right:1px solid var(--border);transition:background .3s}
.equip-item:last-child{border-right:none}
.equip-item:hover{background:rgba(14,199,63,.05)}
.equip-icon{font-size:1.1rem;flex-shrink:0}
.equip-text{display:flex;flex-direction:column}
.equip-name{font-size:.82rem;font-weight:500;color:var(--cream);letter-spacing:.04em}
.equip-sub{font-size:.68rem;color:var(--muted);letter-spacing:.06em}
@media(max-width:900px){.equip-inner{flex-direction:column;align-items:flex-start}.equip-divider{display:none}.equip-items{flex-direction:column;align-items:flex-start;gap:0;width:100%}.equip-item{border-right:none;border-bottom:1px solid var(--border);width:100%;padding:.8rem 0}.equip-item:last-child{border-bottom:none}}

/* ── 3. RETAINER PACKAGES ─────────────────────────────── */
.i2mp-retainer{background:var(--dark);border-top:1px solid var(--border)}
.retainer-hdr{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:4rem;gap:2rem;flex-wrap:wrap}
.retainer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.ret-card{background:var(--dark-2);padding:3rem 2.5rem;position:relative;transition:background .4s;display:flex;flex-direction:column}
.ret-card.featured{background:var(--dark-3)}
.ret-card.featured::before{content:'Most Popular';position:absolute;top:0;left:50%;transform:translateX(-50%);background:var(--green);color:#fff;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;padding:.3rem 1rem;white-space:nowrap}
.ret-card:hover{background:#111a0d}
.ret-tier{font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;color:var(--green);font-weight:500;margin-bottom:.8rem;display:block}
.ret-name{font-family:'QUESTRIAL',serif;font-size:1.8rem;font-weight:300;color:var(--cream);margin-bottom:.5rem;line-height:1.1}
.ret-tagline{font-size:.85rem;color:var(--muted);margin-bottom:2rem;line-height:1.55;flex:1}
.ret-price{margin-bottom:2rem}
.ret-price-from{font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:.2rem}
.ret-price-num{font-family:'QUESTRIAL',serif;font-size:3rem;font-weight:300;color:var(--green);line-height:1}
.ret-price-period{font-size:.75rem;color:var(--muted);margin-left:.3rem}
.ret-features{list-style:none;margin-bottom:2.5rem;border-top:1px solid var(--border);padding-top:1.5rem}
.ret-feature{display:flex;gap:.75rem;align-items:flex-start;padding:.5rem 0;border-bottom:1px solid rgba(14,199,63,.1);font-size:.86rem;color:var(--muted)}
.ret-feature:last-child{border-bottom:none}
.ret-check{color:var(--green);flex-shrink:0;font-size:.8rem;margin-top:2px}
.ret-cta{margin-top:auto}
@media(max-width:900px){.retainer-grid{grid-template-columns:1fr}}

/* ── 4. FAQ ───────────────────────────────────────────── */
.i2mp-faq{background:var(--dark-3);border-top:1px solid var(--border)}
.faq-inner{display:grid;grid-template-columns:1fr 1.6fr;gap:6rem;align-items:start}
.faq-list{margin-top:2rem}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item:first-child{border-top:1px solid var(--border)}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.4rem 0;cursor:none;font-size:.95rem;color:var(--cream);font-weight:400;transition:color .3s}
.faq-q:hover{color:var(--green)}
.faq-q.open{color:var(--green)}
.faq-icon{width:22px;height:22px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.7rem;color:var(--muted);transition:transform .35s,border-color .3s,background .3s}
.faq-q.open .faq-icon{transform:rotate(45deg);border-color:var(--green);background:rgba(14,199,63,.1);color:var(--green)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease}
.faq-a.open{max-height:400px}
.faq-a-inner{padding-bottom:1.4rem;font-size:.9rem;color:var(--muted);line-height:1.75}
.faq-a-inner strong{color:var(--cream);font-weight:500}
.faq-a-inner a{color:var(--green);text-decoration:none}
.faq-side{position:sticky;top:120px}
.faq-side-card{background:var(--dark-2);border:1px solid var(--border);border-left:3px solid var(--green);padding:2.5rem;margin-bottom:1.5rem}
.faq-side-title{font-family:'QUESTRIAL',serif;font-size:1.6rem;font-weight:300;line-height:1.3;color:var(--cream);margin-bottom:1rem}
.faq-side-text{font-size:.88rem;color:var(--muted);line-height:1.7;margin-bottom:1.5rem}
@media(max-width:900px){.faq-inner{grid-template-columns:1fr;gap:3rem}.faq-side{position:static}}

/* ── 5. PROJECT ESTIMATOR ─────────────────────────────── */
.i2mp-estimator{background:var(--dark-2);border-top:1px solid var(--border)}
.est-inner{display:grid;grid-template-columns:1fr 1.2fr;gap:6rem;align-items:start}
.est-form{margin-top:2rem}
.est-step{margin-bottom:2.5rem}
.est-step-label{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--green);margin-bottom:.8rem;display:flex;align-items:center;gap:.6rem}
.est-step-label::before{content:'';display:inline-block;width:20px;height:1px;background:var(--green)}
.est-step-title{font-size:.95rem;color:var(--cream);margin-bottom:1rem;font-weight:400}
.est-options{display:flex;flex-wrap:wrap;gap:8px}
.est-opt{background:transparent;border:1px solid var(--border);color:var(--muted);padding:.55rem 1.1rem;font-family:var(--font-sans);font-size:.8rem;letter-spacing:.06em;cursor:none;transition:border-color .25s,color .25s,background .25s}
.est-opt:hover{border-color:var(--green);color:var(--cream)}
.est-opt.selected{border-color:var(--green);background:rgba(14,199,63,.1);color:var(--green)}
.est-result{background:var(--dark-3);border:1px solid var(--border);padding:3rem;position:sticky;top:120px}
.est-result-eyebrow{font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}
.est-result-label{font-family:'QUESTRIAL',serif;font-size:1rem;font-weight:300;color:var(--muted);margin-bottom:.5rem}
.est-result-range{font-family:'QUESTRIAL',serif;font-size:3.5rem;font-weight:300;color:var(--green);line-height:1;margin-bottom:.5rem;transition:all .4s var(--ease)}
.est-result-note{font-size:.78rem;color:var(--muted);line-height:1.6;margin-bottom:2rem;padding-top:.8rem;border-top:1px solid var(--border)}
.est-disclaimer{font-size:.72rem;color:rgba(240,244,235,.25);line-height:1.6;margin-bottom:1.5rem;font-style:italic}
.est-breakdown{list-style:none;margin-bottom:2rem;border-top:1px solid var(--border);padding-top:1rem}
.est-breakdown li{display:flex;justify-content:space-between;padding:.4rem 0;font-size:.82rem;color:var(--muted);border-bottom:1px solid rgba(14,199,63,.08)}
.est-breakdown li strong{color:var(--cream);font-weight:400}
.est-breakdown li:last-child{border-bottom:none}
.est-nothing{font-family:'QUESTRIAL',serif;font-size:1.2rem;font-weight:300;color:rgba(240,244,235,.25);font-style:italic;margin:1rem 0 2rem}
@media(max-width:900px){.est-inner{grid-template-columns:1fr;gap:3rem}.est-result{position:static}}
/* ── TEAM PHOTO ───────────────────────────────────────── */
.team-photo-wrap {
  position: relative;
  margin-bottom: 2.5rem;
  overflow: hidden;
}
.team-photo {
  width: 100%;
  display: block;
  filter: grayscale(15%) brightness(0.92);
  transition: filter 0.5s ease;
  border-bottom: 2px solid var(--green);
}
.team-photo-wrap:hover .team-photo {
  filter: grayscale(0%) brightness(1);
}
.team-names {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background: var(--dark-2);
  border: 1px solid var(--border);
  border-top: none;
}
.team-member {
  padding: 0.9rem 0.5rem;
  text-align: center;
  border-right: 1px solid var(--border);
  transition: background 0.3s;
}
.team-member:last-child { border-right: none; }
.team-member:hover { background: rgba(14,199,63,0.06); }
.team-name {
  font-family: 'QUESTRIAL', monospace;
  font-size: 0.8rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--green);
  font-weight: 500;
  display: block;
}

/* ── GALLERY VIDEO PLAY ICON ──────────────────────── */
.gal-play-icon {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 56px; height: 56px;
  border-radius: 50%;
  border: 2px solid rgba(240,244,235,0.9);
  background: rgba(12,14,10,0.55);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem;
  color: #fff;
  opacity: 0;
  transition: opacity 0.3s, transform 0.3s, border-color 0.3s;
  pointer-events: none;
  padding-left: 4px;
}
.gal-item:hover .gal-play-icon {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.08);
  border-color: var(--green);
}
/* Shift label to bottom-left when play icon is present */
.gal-ov .gal-label {
  position: absolute;
  bottom: 1rem; left: 1rem;
}

/* ══════════════════════════════════════════════════════
   PORTFOLIO PAGE — page-portfolio.php
   ══════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════
   PORTFOLIO PAGE — /portfolio/ — page-portfolio.php
   ══════════════════════════════════════════════════════ */

/* Hero */
.port-hero {
  background: var(--dark);
  border-bottom: 1px solid var(--border);
  padding: 8rem 4rem 4rem;
  text-align: center;
  position: relative;
}
.port-hero-title {
  font-family: 'QUESTRIAL', monospace;
  font-size: clamp(2.5rem, 6vw, 5rem);
  font-weight: 300; line-height: 1.05;
  color: var(--cream); margin-bottom: 1rem;
}
.port-hero-title em { font-style: italic; color: var(--green-light); }
.port-hero-sub { font-size: 1rem; color: var(--muted); max-width: 500px; margin: 0 auto; line-height: 1.7; }

/* Stats bar */
.port-stats-bar {
  background: var(--dark-2); border-bottom: 1px solid var(--border);
  padding: 1.5rem 4rem; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
}
.port-stat { display: flex; flex-direction: column; align-items: center; gap: .2rem; padding: .75rem 2.5rem; }
.port-stat-num { font-family: 'QUESTRIAL', monospace; font-size: 1.8rem; font-weight: 300; color: var(--green); line-height: 1; }
.port-stat-label { font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.port-stat-sep { width: 1px; height: 36px; background: var(--border); flex-shrink: 0; }

/* Admin notice */
.port-admin-notice {
  background: rgba(14,199,63,.08); border-left: 3px solid var(--green);
  padding: .8rem 2rem; font-size: .82rem; color: var(--cream); text-align: center;
}
.port-admin-notice a { color: var(--green); }

/* Grid section */
.port-grid-section { background: var(--dark); padding: 2rem 1rem; min-height: 60vh; }

/* 3-column grid */
.port-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  max-width: 1400px;
  margin: 0 auto;
}

/* Item */
.port-item {
  background: var(--dark-2);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  opacity: 1;
  transition: background .3s;
}
.port-item:hover { background: #111a0d; }

/* Thumbnail — true 16:9 via padding-top */
.port-thumb-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  overflow: hidden;
  background: #0a0a0a;
}
.port-thumb {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  filter: brightness(.82);
  transition: transform .5s cubic-bezier(.16,1,.3,1), filter .4s;
}
.port-item:hover .port-thumb { transform: scale(1.04); filter: brightness(.95); }

/* Play button — always visible */
.port-overlay {
  position: absolute; inset: 0;
  background: rgba(12,14,10,.2);
  display: flex; align-items: center; justify-content: center;
  transition: background .3s;
}
.port-item:hover .port-overlay { background: rgba(12,14,10,.05); }
.port-play {
  width: 60px; height: 60px;
  border-radius: 50%;
  border: 2.5px solid rgba(255,255,255,.9);
  background: rgba(12,14,10,.45);
  display: flex; align-items: center; justify-content: center;
  transition: transform .3s, border-color .3s, background .3s;
}
.port-play-icon {
  width: 0; height: 0;
  border-style: solid;
  border-width: 10px 0 10px 20px;
  border-color: transparent transparent transparent #fff;
  margin-left: 4px;
  transition: border-color .3s;
}
.port-item:hover .port-play { transform: scale(1.1); border-color: var(--green); background: rgba(14,199,63,.2); }
.port-item:hover .port-play-icon { border-color: transparent transparent transparent var(--green); }

/* Year pill */
.port-year-pill {
  position: absolute; top: .6rem; right: .6rem;
  background: rgba(12,14,10,.75);
  border: 1px solid rgba(14,199,63,.3);
  color: var(--green); font-size: .6rem;
  letter-spacing: .12em; padding: .18rem .55rem;
  font-family: 'QUESTRIAL', monospace;
}

/* Info bar */
.port-info { padding: .85rem 1rem; border-top: 1px solid var(--border); background: var(--dark-2); }
.port-title {
  font-family: 'QUESTRIAL', monospace;
  font-size: .8rem; font-weight: 500; color: var(--cream); line-height: 1.3;
  transition: color .25s;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.port-item:hover .port-title { color: var(--green-light); }
.port-desc {
  font-size: .72rem; color: var(--muted); margin-top: .2rem; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}

/* Empty state */
.port-empty { text-align: center; padding: 6rem 2rem; color: var(--muted); grid-column: 1/-1; }

/* ── VIDEO MODAL ──────────────────────────────────────
   Outer: overflow-y:auto scroll container (no flex)
   Inner wrap: min-height:100vh + flex centering
   Card: sized by viewport height so video always fits
   ──────────────────────────────────────────────────── */
.port-modal {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(4,6,2,.97);
  overflow-y: auto;
  opacity: 0; visibility: hidden;
  transition: opacity .35s, visibility .35s;
}
.port-modal.open { opacity: 1; visibility: visible; }

.port-modal-wrap {
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  padding: 1rem;
}
.port-modal-inner {
  width: 100%;
  max-width: min(920px, calc((100vh - 130px) * 1.778));
  display: flex; flex-direction: column;
}
.port-modal-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: .75rem 0; gap: 1rem; flex-shrink: 0;
}
.port-modal-title {
  font-family: 'QUESTRIAL', monospace; font-size: .92rem; font-weight: 500;
  color: var(--cream); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.port-modal-client { font-size: .72rem; color: var(--green); letter-spacing: .08em; }
.port-modal-close {
  background: none; border: 1px solid var(--border); color: var(--muted);
  font-family: 'QUESTRIAL', monospace; font-size: .68rem; letter-spacing: .1em;
  text-transform: uppercase; cursor: pointer; padding: .3rem .75rem;
  white-space: nowrap; flex-shrink: 0; transition: border-color .25s, color .25s;
}
.port-modal-close:hover { border-color: var(--green); color: var(--green); }
.port-modal-video {
  position: relative; width: 100%; padding-top: 56.25%;
  background: #000; flex-shrink: 0;
}
.port-modal-video iframe {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; display: block;
}
.port-modal-footer { padding: .5rem 0 0; text-align: right; flex-shrink: 0; }

/* Responsive */
@media(max-width:1100px) { .port-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:768px) {
  .port-hero { padding: 6rem 1.5rem 3rem; }
  .port-stats-bar { padding: 1rem; }
  .port-stat { padding: .6rem 1.2rem; }
  .port-grid-section { padding: 1rem .25rem; }
  .port-grid { grid-template-columns: repeat(2, 1fr); gap: 2px; }
  .port-modal-wrap { padding: .5rem; }
}
@media(max-width:480px) { .port-grid { grid-template-columns: 1fr; } }

/* ── GOOGLE REVIEWS ──────────────────────────────────────────── */

/* Overall rating bar */
.g-rating-bar {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 2.5rem;
  padding: 1.2rem 2rem;
  background: var(--dark-3);
  border: 1px solid var(--border);
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}
.g-rating-score {
  font-family: 'QUESTRIAL', monospace;
  font-size: 2.8rem;
  font-weight: 300;
  color: var(--green);
  line-height: 1;
  flex-shrink: 0;
}
.g-rating-stars {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
}
.g-star {
  font-size: 1.1rem;
  color: rgba(240,244,235,.2);
}
.g-star.filled { color: #f5c518; }
.g-rating-count {
  font-size: .72rem;
  color: var(--muted);
  letter-spacing: .06em;
  white-space: nowrap;
}
.g-rating-link {
  font-size: .68rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--green);
  text-decoration: none;
  border: 1px solid var(--border);
  padding: .4rem .9rem;
  transition: border-color .25s, background .25s;
  white-space: nowrap;
}
.g-rating-link:hover {
  border-color: var(--green);
  background: rgba(14,199,63,.08);
}

/* Profile photo avatar */
.t-avatar-img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid var(--border);
}

/* Filled star in review cards */
.star.filled { background: #f5c518; }

/* Google G badge on verified reviews */
.t-google-badge {
  margin-left: auto;
  flex-shrink: 0;
  opacity: .7;
}

/* Star ratings in cards */
.t-stars {
  display: flex;
  gap: 3px;
  margin-bottom: 1rem;
}
.t-stars .star {
  width: 12px; height: 12px;
  border-radius: 2px;
  background: rgba(240,244,235,.12);
}
.t-stars .star.filled { background: #f5c518; }

/* ══════════════════════════════════════════════════════════════
   GOOGLE REVIEWS SECTION
   ══════════════════════════════════════════════════════════════ */

.i2mp-greviews {
  background: var(--dark-2);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 96px 52px;
  position: relative;
  overflow: hidden;
}
/* Subtle background glow */
.i2mp-greviews::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--green), transparent);
  opacity: .4;
}

/* ── Header row ──────────────────────────────────────────────── */
.gr-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 3rem;
  margin-bottom: 64px;
  flex-wrap: wrap;
}
.gr-header-left { flex: 1; min-width: 260px; }

.gr-eyebrow-line {
  display: inline-block;
  width: 28px; height: 1px;
  background: var(--green);
  margin-right: 10px;
  vertical-align: middle;
}
.gr-sub {
  font-size: .88rem;
  color: var(--muted);
  margin-top: .8rem;
  line-height: 1.65;
  max-width: 380px;
}

/* ── Hero score block ────────────────────────────────────────── */
.gr-hero-score {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  background: var(--dark-3);
  border: 1px solid var(--border);
  padding: 1.4rem 1.8rem;
  flex-shrink: 0;
  position: relative;
}
.gr-hero-score::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, var(--green), var(--green-light));
}
.gr-score-num {
  font-family: 'QUESTRIAL', sans-serif;
  font-size: 3.8rem;
  font-weight: 300;
  color: var(--green);
  line-height: 1;
}
.gr-score-right { display: flex; flex-direction: column; gap: .5rem; }
.gr-score-stars { display: flex; gap: 3px; }
.gr-star-svg { color: rgba(240,244,235,.15); transition: color .2s; }
.gr-star-svg.on { color: #f5b400; }
.gr-score-count {
  font-size: .7rem;
  color: var(--muted);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.gr-score-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .65rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--green);
  text-decoration: none;
  border: 1px solid var(--border);
  padding: .3rem .7rem;
  transition: border-color .25s, background .25s;
  width: fit-content;
}
.gr-score-link:hover {
  border-color: var(--green);
  background: rgba(14,199,63,.08);
}

/* ── Review grid — masonry-like 3-column ─────────────────────── */
.gr-grid {
  columns: 3;
  column-gap: 16px;
}

/* ── Individual card ─────────────────────────────────────────── */
.gr-card {
  break-inside: avoid;
  background: var(--dark-3);
  border: 1px solid var(--border);
  padding: 1.6rem 1.4rem 1.2rem;
  margin-bottom: 16px;
  position: relative;
  transition: border-color .35s, transform .35s, background .35s;
  /* entrance animation */
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .6s ease, transform .6s ease, border-color .3s, background .3s;
}
.gr-card.gr-card--visible {
  opacity: 1;
  transform: translateY(0);
}
/* Mobile: always visible */
@media (hover: none), (pointer: coarse) {
  .gr-card { opacity: 1; transform: none; }
}
.gr-card:hover {
  border-color: rgba(14,199,63,.4);
  background: #131a0e;
}
.gr-card--hidden {
  display: none;
}
/* Revealed cards animate in */
.gr-card--revealed {
  display: block;
}

/* Decorative quote mark */
.gr-quote-icon {
  position: absolute;
  top: .6rem; right: 1rem;
  font-size: 3.5rem;
  line-height: 1;
  color: rgba(14,199,63,.12);
  font-family: Georgia, serif;
  pointer-events: none;
  user-select: none;
}

/* Stars */
.gr-card-stars {
  display: flex;
  gap: 3px;
  margin-bottom: .85rem;
}

/* Review text */
.gr-card-text {
  font-size: .82rem;
  color: rgba(240,244,235,.72);
  line-height: 1.68;
  margin-bottom: 1.1rem;
  font-style: italic;
}

/* Footer */
.gr-card-footer {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding-top: .9rem;
  border-top: 1px solid rgba(14,199,63,.1);
}

/* Avatar */
.gr-avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family:  'QUESTRIAL', sans-serif;
  font-size: .78rem;
  font-weight: 600;
  color: #fff;
  flex-shrink: 0;
  letter-spacing: 0;
}

/* Author info */
.gr-author-name {
  font-size: .8rem;
  font-weight: 500;
  color: var(--cream);
  letter-spacing: .02em;
}
.gr-author-meta {
  font-size: .65rem;
  color: var(--muted);
  margin-top: .15rem;
  display: flex;
  align-items: center;
  gap: .3rem;
}

/* ── Show more button ────────────────────────────────────────── */
.gr-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 2.5rem;
}
.gr-more-btn {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--muted);
  font-family:  'QUESTRIAL', sans-serif;
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  padding: .85rem 2rem;
  cursor: pointer;
  transition: border-color .3s, color .3s, background .3s;
  position: relative;
  overflow: hidden;
}
.gr-more-btn::before {
  content: '';
  position: absolute; inset: 0;
  background: rgba(14,199,63,.06);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s ease;
}
.gr-more-btn:hover {
  border-color: var(--green);
  color: var(--cream);
}
.gr-more-btn:hover::before { transform: scaleX(1); }
.gr-more-count {
  background: rgba(14,199,63,.15);
  color: var(--green);
  font-size: .6rem;
  padding: .15rem .5rem;
  border-radius: 2px;
}
.gr-more-arrow {
  transition: transform .35s ease;
}
.gr-more-btn:hover .gr-more-arrow {
  transform: translateY(3px);
}
.gr-more-btn.gr-more-btn--done {
  opacity: .4;
  pointer-events: none;
}

/* ── Footer link ─────────────────────────────────────────────── */
.gr-footer-link {
  text-align: center;
  margin-top: 2.5rem;
}
.gr-footer-link a {
  font-size: .7rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(14,199,63,.6);
  text-decoration: none;
  transition: color .25s;
}
.gr-footer-link a:hover { color: var(--green); }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .gr-grid { columns: 2; }
}
@media (max-width: 768px) {
  .i2mp-greviews { padding: 64px 24px; }
  .gr-header { flex-direction: column; gap: 2rem; }
  .gr-grid { columns: 1; }
  .gr-hero-score { width: 100%; }
  .gr-score-num { font-size: 2.8rem; }
}