/* Home intro — see resources/views/partials/intro.blade.php */
html.mci-off #mc-intro { display: none; }
html.mci-lock, html.mci-lock body { overflow: hidden !important; }
#mc-intro {
  position: fixed; inset: 0; z-index: 2147483000; overflow: hidden; cursor: pointer; color: #fff;
  font-family: Manrope, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; --cy: 47%;
}
#mc-intro img, #mc-intro svg { max-width: none; max-height: none; }
.mci-bg { position: absolute; inset: 0; background: radial-gradient(120% 100% at 50% 45%, #0b1e40 0%, #050f24 48%, #010409 100%); }
.mci-glow { position: absolute; left: 50%; top: var(--cy); width: 120vmin; height: 120vmin; transform: translate(-50%,-50%); border-radius: 50%; opacity: 0;
  background: radial-gradient(closest-side, rgba(52,130,235,.28), rgba(25,179,134,.08) 50%, transparent 72%); }
.mci-vig { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(120% 90% at 50% 50%, transparent 55%, rgba(0,0,0,.55) 100%); }
.mci-grain { position: absolute; inset: 0; opacity: .08; pointer-events: none; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }

/* ışık çizgisi (anamorfik flare) */
.mci-flare { position: absolute; left: 0; right: 0; top: var(--cy); height: 2px; margin-top: -1px; opacity: 0; transform: scaleX(0);
  background: linear-gradient(90deg, transparent, rgba(90,160,255,.5) 25%, #fff 50%, rgba(90,160,255,.5) 75%, transparent);
  box-shadow: 0 0 30px 6px rgba(80,150,255,.45), 0 0 90px 20px rgba(42,123,224,.25); }

/* dev kategori yazıları (arka plan) */
.mci-words { position: absolute; inset: 0; pointer-events: none; }
.mci-word { position: absolute; left: 50%; top: var(--cy); transform: translate(-50%,-50%); white-space: nowrap; opacity: 0;
  font-weight: 800; font-size: clamp(64px, 15vw, 260px); letter-spacing: -.04em; line-height: 1;
  color: transparent; -webkit-text-stroke: 1px rgba(160,200,255,.22); }

/* ürün çekimleri */
.mci-shots { position: absolute; inset: 0; pointer-events: none; }
.mci-shot { position: absolute; left: 50%; top: var(--cy); width: min(56vh, 72vw); height: min(56vh, 72vw); transform: translate(-50%,-50%); opacity: 0; will-change: transform, filter, opacity; }
.mci-shot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
  -webkit-box-reflect: below -4% linear-gradient(transparent 72%, rgba(255,255,255,.18)); }
.mci-sheen { position: absolute; inset: 0; opacity: 0; mix-blend-mode: overlay;
  background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.95) 50%, transparent 62%) no-repeat; background-size: 300% 100%;
  -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.mci-cap { position: absolute; left: 50%; top: calc(var(--cy) + min(28vh, 36vw) + 26px); transform: translateX(-50%);
  display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 6px 14px; width: max-content; max-width: 90vw; text-align: center; opacity: 0; }
.mci-cap > * { white-space: nowrap; }
.mci-cap b { font: 500 11px/1 var(--mono); letter-spacing: .18em; color: #7fdcbc; }
.mci-cap strong { font-weight: 600; font-size: clamp(15px, 1.6vw, 20px); letter-spacing: -.01em; }
.mci-cap em { font: 400 11px/1 var(--mono); font-style: normal; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.45); }

/* 3D implant halkası */
.mci-scene { position: absolute; inset: 0; perspective: 1100px; perspective-origin: 50% 40%; pointer-events: none; }
.mci-ringwrap { position: absolute; left: 50%; top: var(--cy); width: 0; height: 0; transform-style: preserve-3d; }
.mci-ring { position: absolute; left: 0; top: 0; transform-style: preserve-3d; }
.mci-ri { position: absolute; opacity: 0; backface-visibility: visible; }
.mci-ri img { width: 100%; height: 100%; object-fit: contain; -webkit-box-reflect: below 2% linear-gradient(transparent 70%, rgba(255,255,255,.16)); }

/* HUD */
.mci-hud { position: absolute; inset: 0; pointer-events: none; }
.mci-c { position: absolute; width: 22px; height: 22px; border: 0 solid rgba(255,255,255,.35); opacity: 0; }
.mci-tl { left: 24px; top: 24px; border-left-width: 1px; border-top-width: 1px; }
.mci-tr { right: 24px; top: 24px; border-right-width: 1px; border-top-width: 1px; }
.mci-bl { left: 24px; bottom: 24px; border-left-width: 1px; border-bottom-width: 1px; }
.mci-br { right: 24px; bottom: 24px; border-right-width: 1px; border-bottom-width: 1px; }
.mci-meta { position: absolute; font: 500 10.5px/1 var(--mono); letter-spacing: .22em; color: rgba(255,255,255,.45); opacity: 0; }
.mci-mtl { left: 58px; top: 30px; } .mci-mtr { right: 58px; top: 30px; }

.mci-flash { position: absolute; left: 0; top: 0; width: 10px; height: 10px; border-radius: 50%; opacity: 0; pointer-events: none;
  background: radial-gradient(closest-side, rgba(255,255,255,.95), rgba(127,220,188,.35) 40%, transparent); }
.mci-ring2 { position: absolute; border-radius: 50%; border: 1px solid rgba(127,220,188,.9); box-shadow: 0 0 24px rgba(127,220,188,.55), inset 0 0 24px rgba(127,220,188,.2); opacity: 0; pointer-events: none; }
.mci-dock { position: fixed; transform-origin: 0 0; pointer-events: none; z-index: 5; }
.mci-dock * { transition: none !important; animation: none !important; }
.mci-dock > * { margin: 0 !important; }
.mci-skip { position: absolute; right: 58px; bottom: 22px; z-index: 6; cursor: pointer; background: none; border: 0; padding: 4px 0;
  font: 500 10.5px/1 var(--mono); letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.55); transition: color .2s; }
.mci-skip:hover { color: #fff; }
.mci-skip span { display: inline-block; margin-left: 6px; transition: transform .2s; }
.mci-skip:hover span { transform: translateX(3px); }
@media (max-width: 640px) {
  #mc-intro { --cy: 44%; }
  .mci-mtr { display: none; }
  .mci-tl, .mci-bl { left: 16px; } .mci-tr, .mci-br { right: 16px; } .mci-tl, .mci-tr { top: 16px; } .mci-bl, .mci-br { bottom: 16px; }
  .mci-meta { font-size: 9px; letter-spacing: .16em; } .mci-mtl { left: 46px; top: 22px; right: 16px; }
  .mci-cap { top: calc(var(--cy) + min(28vh, 36vw) + 18px); }
  .mci-cap strong { font-size: 16px; }
  .mci-skip { right: 46px; bottom: 16px; font-size: 9.5px; }
}
@media (max-height: 480px) and (orientation: landscape) { .mci-meta, .mci-cap em { display: none; } }