/* ============================================================
   MURAT KARAN - ULTRA CYBER HERO V5
   V4 çalışan hero görüntü sisteminin üstüne eklenmiştir.
   ============================================================ */

.hero-premium .hero-visual{
    position:relative!important;
    isolation:isolate!important;
    perspective:1300px;
    overflow:visible!important;
}

/* Eski shell gizli kalır; çalışan V4 yaklaşımı korunur. */
.hero-premium .hero-photo-shell{
    opacity:0!important;
    pointer-events:none!important;
}

/* -----------------------------
   NEON BACKGROUND FLOW
------------------------------ */
.hero-premium .mk-cyber-neon-layer{
    position:absolute;
    inset:-12% -15%;
    z-index:18;
    pointer-events:none;
    overflow:hidden;
    border-radius:32px;
    filter:saturate(120%);
}

.hero-premium .mk-neon-beam{
    position:absolute;
    display:block;
    height:2px;
    width:72%;
    border-radius:999px;
    opacity:.9;
    filter:blur(.3px) drop-shadow(0 0 8px currentColor) drop-shadow(0 0 22px currentColor);
    transform-origin:center;
    mix-blend-mode:screen;
}

.hero-premium .mk-neon-beam::after{
    content:"";
    position:absolute;
    inset:-8px 0;
    background:inherit;
    opacity:.24;
    filter:blur(12px);
}

.hero-premium .mk-neon-beam-a{
    left:-18%;
    top:38%;
    color:#60A5FA;
    background:linear-gradient(90deg,transparent,#0284C7,#38BDF8,#67E8F9,transparent);
    animation:mkBeamA 5.8s linear infinite;
}

.hero-premium .mk-neon-beam-b{
    right:-15%;
    top:64%;
    color:#67E8F9;
    background:linear-gradient(90deg,transparent,#67E8F9,#38BDF8,#60A5FA,transparent);
    animation:mkBeamB 7.4s linear infinite;
}

.hero-premium .mk-neon-beam-c{
    left:8%;
    top:18%;
    width:52%;
    color:#38BDF8;
    background:linear-gradient(90deg,transparent,#38BDF8,#60A5FA,transparent);
    animation:mkBeamC 6.6s ease-in-out infinite alternate;
}

@keyframes mkBeamA{
    0%{transform:translateX(-22%) rotate(-7deg);opacity:.2}
    25%{opacity:1}
    100%{transform:translateX(88%) rotate(-7deg);opacity:.12}
}
@keyframes mkBeamB{
    0%{transform:translateX(28%) rotate(10deg);opacity:.18}
    20%{opacity:.9}
    100%{transform:translateX(-96%) rotate(10deg);opacity:.08}
}
@keyframes mkBeamC{
    from{transform:translate3d(-8%,0,0) rotate(3deg);opacity:.25}
    to{transform:translate3d(35%,14px,0) rotate(3deg);opacity:.95}
}

.hero-premium .mk-neon-orbit{
    position:absolute;
    left:50%;
    top:50%;
    border:1px solid rgba(96,165,250,.3);
    border-radius:50%;
    transform:translate(-50%,-50%) rotate(-14deg);
    box-shadow:0 0 24px rgba(2,132,199,.18),inset 0 0 24px rgba(103,232,249,.06);
}

.hero-premium .mk-neon-orbit-a{
    width:112%;
    height:48%;
    border-color:rgba(96,165,250,.34);
    animation:mkOrbitPulse 4.6s ease-in-out infinite;
}

.hero-premium .mk-neon-orbit-b{
    width:96%;
    height:34%;
    transform:translate(-50%,-50%) rotate(15deg);
    border-color:rgba(103,232,249,.22);
    animation:mkOrbitPulse 5.6s ease-in-out infinite reverse;
}

@keyframes mkOrbitPulse{
    0%,100%{opacity:.25;filter:blur(.1px)}
    50%{opacity:.9;filter:drop-shadow(0 0 8px #60A5FA)}
}

/* -----------------------------
   CYBER FRAME
------------------------------ */
.hero-premium .mk-cyber-frame-wrap{
    --rx:0deg;
    --ry:0deg;
    --mx:50%;
    --my:50%;

    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:min(640px,94%)!important;
    height:410px!important;
    z-index:55!important;

    transform:
        translate(-50%,-50%)
        rotateX(var(--rx))
        rotateY(var(--ry))
        translateZ(0);

    transform-style:preserve-3d;
    transform-origin:center;
    transition:transform .18s ease-out;
    will-change:transform;
}

.hero-premium .mk-cyber-frame-glow{
    position:absolute;
    inset:-24px;
    z-index:-2;
    border-radius:40px;
    background:
        radial-gradient(circle at var(--mx) var(--my),rgba(103,232,249,.28),transparent 24%),
        radial-gradient(circle at 22% 15%,rgba(56,189,248,.2),transparent 28%),
        radial-gradient(circle at 82% 80%,rgba(2,132,199,.26),transparent 30%);
    filter:blur(22px);
    opacity:.9;
    transition:background .12s linear;
}

.hero-premium .mk-cyber-frame{
    position:absolute;
    inset:0;
    padding:9px;
    clip-path:polygon(
        8% 0,
        38% 0,
        41% 3%,
        81% 3%,
        86% 0,
        96% 0,
        100% 10%,
        100% 78%,
        96% 82%,
        96% 94%,
        89% 100%,
        18% 100%,
        13% 96%,
        4% 96%,
        0 87%,
        0 15%
    );
    background:
        linear-gradient(135deg,#67E8F9 0%,#0284C7 12%,#0284C7 34%,#38BDF8 49%,#60A5FA 68%,#67E8F9 88%,#0284C7 100%);
    box-shadow:
        0 30px 70px rgba(0,0,0,.46),
        0 0 18px rgba(103,232,249,.34),
        0 0 34px rgba(96,165,250,.26);
    animation:mkFrameGlow 3.2s ease-in-out infinite;
}

@keyframes mkFrameGlow{
    0%,100%{filter:brightness(.92) saturate(115%)}
    50%{filter:brightness(1.22) saturate(150%)}
}

.hero-premium .mk-cyber-frame-inner{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
    clip-path:polygon(
        7% 0,
        39% 0,
        42% 3%,
        80% 3%,
        85% 0,
        96% 0,
        100% 11%,
        100% 80%,
        96% 84%,
        96% 93%,
        89% 100%,
        17% 100%,
        12% 96%,
        4% 96%,
        0 86%,
        0 15%
    );
    background:#060F16;
    transform:translateZ(18px);
}

.hero-premium .mk-cyber-frame-inner::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:4;
    pointer-events:none;
    background:
        linear-gradient(90deg,rgba(103,232,249,.14),transparent 12%,transparent 88%,rgba(56,189,248,.13)),
        linear-gradient(180deg,rgba(255,255,255,.08),transparent 16%,transparent 82%,rgba(96,165,250,.09));
}

.hero-premium .mk-cyber-frame .mk-hero-force-photo{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:cover!important;
    object-position:center!important;

    display:block!important;
    visibility:visible!important;
    opacity:1!important;

    transform:translateZ(0) scale(1.008);
    z-index:2!important;

    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    clip-path:none!important;
    mask:none!important;
    -webkit-mask:none!important;
    filter:contrast(1.035) saturate(1.06)!important;
    animation:none!important;
}

/* Moving light sweep over photo */
.hero-premium .mk-cyber-light-sweep{
    position:absolute;
    inset:-30%;
    z-index:5;
    pointer-events:none;
    background:linear-gradient(110deg,transparent 38%,rgba(255,255,255,.08) 47%,rgba(103,232,249,.16) 50%,rgba(255,255,255,.05) 53%,transparent 62%);
    transform:translateX(-60%);
    animation:mkSweep 5.2s ease-in-out infinite;
    mix-blend-mode:screen;
}

@keyframes mkSweep{
    0%,18%{transform:translateX(-62%)}
    48%,100%{transform:translateX(64%)}
}

/* scanlines */
.hero-premium .mk-cyber-scanlines{
    position:absolute;
    inset:0;
    z-index:4;
    pointer-events:none;
    opacity:.1;
    background:repeating-linear-gradient(
        180deg,
        rgba(255,255,255,.12) 0,
        rgba(255,255,255,.12) 1px,
        transparent 1px,
        transparent 5px
    );
}

/* Angular corner markers */
.hero-premium .mk-corner{
    position:absolute;
    width:42px;
    height:42px;
    z-index:7;
    pointer-events:none;
}
.hero-premium .mk-corner::before,
.hero-premium .mk-corner::after{
    content:"";
    position:absolute;
    background:currentColor;
    box-shadow:0 0 10px currentColor;
}
.hero-premium .mk-corner::before{width:100%;height:2px}
.hero-premium .mk-corner::after{width:2px;height:100%}

.hero-premium .mk-corner-tl{left:13px;top:13px;color:#67E8F9}
.hero-premium .mk-corner-tr{right:13px;top:13px;color:#38BDF8;transform:scaleX(-1)}
.hero-premium .mk-corner-bl{left:13px;bottom:13px;color:#60A5FA;transform:scaleY(-1)}
.hero-premium .mk-corner-br{right:13px;bottom:13px;color:#67E8F9;transform:scale(-1)}

.hero-premium .mk-tech-mark{
    position:absolute;
    left:50%;
    width:110px;
    height:5px;
    z-index:8;
    transform:translateX(-50%);
    border-radius:999px;
    background:linear-gradient(90deg,transparent,#60A5FA,#67E8F9,#38BDF8,transparent);
    box-shadow:0 0 12px #60A5FA;
}
.hero-premium .mk-tech-mark-top{top:5px}
.hero-premium .mk-tech-mark-bottom{bottom:5px}

/* particles */
.hero-premium .mk-neon-particle{
    position:absolute;
    width:5px;
    height:5px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 8px #67E8F9,0 0 18px #60A5FA;
    animation:mkParticleFloat 4s ease-in-out infinite;
}
.hero-premium .mk-p1{left:12%;top:24%;animation-delay:-.6s}
.hero-premium .mk-p2{left:22%;top:72%;animation-delay:-1.7s}
.hero-premium .mk-p3{right:12%;top:28%;animation-delay:-2.4s}
.hero-premium .mk-p4{right:20%;top:76%;animation-delay:-3.1s}
.hero-premium .mk-p5{left:48%;top:10%;animation-delay:-1.2s}
.hero-premium .mk-p6{left:62%;bottom:8%;animation-delay:-2.8s}

@keyframes mkParticleFloat{
    0%,100%{transform:translate3d(0,0,0) scale(.7);opacity:.25}
    50%{transform:translate3d(0,-18px,0) scale(1.35);opacity:1}
}

/* Keep existing floating badges above frame */
.hero-premium .hero-stats-stack,
.hero-premium .hero-signature{
    z-index:78!important;
}

/* -----------------------------
   POINTER INTERACTION
------------------------------ */
.hero-premium .mk-cyber-frame-wrap.is-hovering{
    transition:transform .045s linear;
}

.hero-premium .mk-cyber-frame-wrap.is-hovering .mk-cyber-frame{
    box-shadow:
        0 34px 80px rgba(0,0,0,.48),
        0 0 22px rgba(103,232,249,.50),
        0 0 48px rgba(96,165,250,.38);
}

/* responsive */
@media(max-width:1100px){
    .hero-premium .mk-cyber-frame-wrap{
        width:min(620px,92%)!important;
        height:390px!important;
    }
}

@media(max-width:900px){
    .hero-premium .hero-visual{
        min-height:460px!important;
    }
    .hero-premium .mk-cyber-frame-wrap{
        width:min(680px,92%)!important;
        height:405px!important;
    }
}

@media(max-width:600px){
    .hero-premium .hero-visual{
        min-height:380px!important;
    }
    .hero-premium .mk-cyber-frame-wrap{
        width:92%!important;
        height:330px!important;
    }
    .hero-premium .mk-cyber-neon-layer{
        inset:-8% -8%;
    }
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
    .hero-premium .mk-neon-beam,
    .hero-premium .mk-neon-orbit,
    .hero-premium .mk-neon-particle,
    .hero-premium .mk-cyber-frame,
    .hero-premium .mk-cyber-light-sweep{
        animation:none!important;
    }
    .hero-premium .mk-cyber-frame-wrap{
        transform:translate(-50%,-50%)!important;
    }
}