:root{
    --miiti-blue:#083f78;
    --miiti-dark:#062f5c;
    --miiti-orange:#ff7a3d;
    --miiti-sea:#8fd3df;
    --miiti-text:#5f7188;
    --miiti-border:#e6edf5;
    --miiti-soft:#f6f9fd;
    --miiti-white:#ffffff;
}

html,
body{
    margin:0;
    padding:0;
    overflow-x:hidden;
    background:#edf4fb;
}

body{
    color:var(--miiti-text);
}

.miiti4-page{
    overflow:hidden;
    background:
        radial-gradient(circle at top right, rgba(255,122,61,.10), transparent 30%),
        radial-gradient(circle at 12% 24%, rgba(143,211,223,.20), transparent 34%),
        linear-gradient(135deg,#ffffff 0%,#f7fbff 48%,#edf6fb 100%);
}

.miiti4-container{
    width:min(1180px, calc(100% - 40px));
    margin:0 auto;
}

/* HERO */

.miiti4-hero{
    position:relative;
    padding:118px 0 78px;
}

.miiti4-hero::before{
    content:"";
    position:absolute;
    top:-180px;
    right:-160px;
    width:560px;
    height:560px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(143,211,223,.34), transparent 68%);
    pointer-events:none;
}

.miiti4-hero-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);
    gap:54px;
    align-items:center;
}

.miiti4-back-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:18px;
    color:var(--miiti-blue);
    text-decoration:none;
    font-size:var(--fs-sm);
    font-weight:var(--fw-semibold);
    transition:.25s ease;
}

.miiti4-back-link i{
    color:var(--miiti-orange);
}

.miiti4-back-link:hover{
    color:var(--miiti-orange);
}

.miiti4-tag,
.miiti4-section-label{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:34px;
    padding:0 18px;
    border-radius:999px;
    color:var(--miiti-orange);
    background:rgba(255,122,61,.10);
    border:1px solid rgba(255,122,61,.18);
    font-size:var(--fs-xs);
    font-weight:var(--fw-semibold);
    letter-spacing:2.2px;
    text-transform:uppercase;
}

.miiti4-hero-content h1{
    margin:20px 0 0;
    color:var(--miiti-blue);
    font-size:clamp(30px,4vw,52px);
    font-weight:var(--fw-bold);
    line-height:1.05;
    letter-spacing:-.045em;
}

.miiti4-hero-content h1 span{
    display:block;
    color:var(--miiti-orange);
}

.miiti4-lead{
    max-width:650px;
    margin:24px 0 0;
    color:var(--miiti-text);
    font-size:var(--fs-base);
    font-weight:var(--fw-regular);
    line-height:var(--lh-relaxed);
}

.miiti4-hero-features{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:12px;
    margin-top:28px;
}

.miiti4-hero-features div{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:56px;
    padding:0 14px;
    border-radius:18px;
    background:rgba(255,255,255,.82);
    border:1px solid rgba(8,63,120,.08);
    box-shadow:0 14px 30px rgba(8,63,120,.06);
}

.miiti4-hero-features i{
    width:32px;
    height:32px;
    flex:0 0 32px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:11px;
    color:#fff;
    background:var(--miiti-orange);
    font-size:13px;
}

.miiti4-hero-features span{
    color:var(--miiti-blue);
    font-size:var(--fs-xs);
    font-weight:var(--fw-semibold);
    line-height:1.35;
}

.miiti4-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:32px;
}

.miiti4-btn{
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:0 22px;
    border-radius:999px;
    text-decoration:none;
    font-size:var(--fs-sm);
    font-weight:var(--fw-semibold);
    transition:.28s ease;
}

.miiti4-btn.primary{
    color:#fff;
    background:linear-gradient(135deg,var(--miiti-blue),#0a5598);
    box-shadow:0 16px 34px rgba(8,63,120,.18);
}

.miiti4-btn.secondary{
    color:var(--miiti-blue);
    background:#fff;
    border:1px solid rgba(8,63,120,.10);
    box-shadow:0 12px 26px rgba(8,63,120,.08);
}

.miiti4-btn:hover{
    transform:translateY(-4px);
}

.miiti4-btn.primary:hover,
.miiti4-btn.secondary:hover{
    color:#fff;
    background:linear-gradient(135deg,var(--miiti-orange),#ff9b66);
    border-color:transparent;
}

/* HERO VIDEO MODERN ALAN */

.miiti4-hero-visual{
    position:relative;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    min-height:440px;
}

/* Video arkasındaki dar modern cam kart */
.miiti4-hero-visual::before{
    content:"";
    position:absolute;
    right:-18px;
    top:50%;
    width:470px;
    height:430px;
    transform:translateY(-50%) rotate(-1.5deg);
    border-radius:38px;
    background:
        radial-gradient(circle at 22% 18%, rgba(255,122,61,.24), transparent 32%),
        radial-gradient(circle at 80% 78%, rgba(143,211,223,.34), transparent 36%),
        linear-gradient(135deg, rgba(255,255,255,.82), rgba(237,246,251,.62));
    border:1px solid rgba(255,255,255,.72);
    box-shadow:
        0 28px 70px rgba(8,63,120,.14),
        inset 0 1px 0 rgba(255,255,255,.95);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    z-index:0;
    pointer-events:none;
}

/* Video arkasındaki yumuşak ışık */
.miiti4-hero-visual::after{
    content:"";
    position:absolute;
    right:34px;
    bottom:18px;
    width:230px;
    height:90px;
    border-radius:999px;
    background:linear-gradient(135deg, rgba(255,122,61,.30), rgba(8,63,120,.15));
    filter:blur(20px);
    opacity:.82;
    z-index:0;
    pointer-events:none;
}

.miiti4-hero-video{
    position:relative;
    z-index:2;
    width:100%;
    max-width:450px;
    height:400px;
    margin-left:auto;
    overflow:hidden;
    border-radius:34px;
    background:#061f3d;
    border:1px solid rgba(255,255,255,.72);
    box-shadow:
        0 28px 68px rgba(8,63,120,.21),
        0 0 0 7px rgba(255,255,255,.38);
}

.miiti4-hero-video::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:
        linear-gradient(180deg, rgba(6,31,61,.08) 0%, transparent 42%, rgba(6,31,61,.58) 100%),
        radial-gradient(circle at top right, rgba(255,122,61,.18), transparent 34%);
    pointer-events:none;
}

.miiti4-hero-video video{
    position:relative;
    z-index:1;
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    background:#061f3d;
}

.miiti4-video-sound-toggle{
    position:absolute;
    top:22px;
    right:22px;
    z-index:5;
    width:52px;
    height:52px;
    border:none;
    border-radius:18px;
    cursor:pointer;
    color:#fff;
    background:rgba(8,63,120,.72);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    box-shadow:0 12px 28px rgba(0,0,0,.18);
    transition:.28s ease;
}

.miiti4-video-sound-toggle:hover{
    transform:translateY(-3px);
    background:var(--miiti-orange);
}

.miiti4-video-sound-toggle i{
    font-size:18px;
}

.miiti4-video-badge{
    position:absolute;
    left:24px;
    right:24px;
    bottom:24px;
    z-index:4;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:18px 20px;
    border-radius:22px;
    background:rgba(255,255,255,.94);
    border:1px solid rgba(255,255,255,.34);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    box-shadow:0 20px 44px rgba(0,0,0,.18);
}

.miiti4-video-badge strong{
    color:var(--miiti-blue);
    font-size:var(--fs-lg);
    font-weight:var(--fw-bold);
}

.miiti4-video-badge span{
    color:var(--miiti-orange);
    font-size:var(--fs-xs);
    font-weight:var(--fw-semibold);
    text-align:right;
}

/* INFO CARDS */

.miiti4-info-section{
    padding:0 0 76px;
}

.miiti4-info-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.miiti4-info-card{
    padding:30px;
    border-radius:28px;
    background:#fff;
    border:1px solid rgba(8,63,120,.08);
    box-shadow:0 16px 38px rgba(8,63,120,.07);
    transition:.3s ease;
}

.miiti4-info-card:hover{
    transform:translateY(-6px);
    box-shadow:0 26px 60px rgba(8,63,120,.12);
}

.miiti4-info-icon{
    width:54px;
    height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:18px;
    color:#fff;
    background:linear-gradient(135deg,var(--miiti-orange),#ff9b66);
    box-shadow:0 16px 30px rgba(255,122,61,.22);
}

.miiti4-info-card h3{
    margin:20px 0 0;
    color:var(--miiti-blue);
    font-size:var(--fs-xl);
    font-weight:var(--fw-bold);
    line-height:1.18;
}

.miiti4-info-card p{
    margin:12px 0 0;
    color:var(--miiti-text);
    font-size:var(--fs-sm);
    line-height:var(--lh-relaxed);
}

/* DETAIL */

.miiti4-detail-section{
    padding:0 0 82px;
}

.miiti4-detail-grid{
    display:grid;
    grid-template-columns:minmax(340px,.94fr) minmax(0,1.06fr);
    gap:44px;
    align-items:center;
}

.miiti4-detail-image{
    overflow:hidden;
    width:100%;
    max-width:450px;
    height:400px;
    margin:0 auto;
    border-radius:30px;
    background:#fff;
    border:1px solid rgba(8,63,120,.08);
    box-shadow:0 24px 60px rgba(8,63,120,.11);
}

.miiti4-detail-image img{
    width:100%;
    height:100%;
    min-height:auto;
    display:block;
    object-fit:cover;
    transition:.45s ease;
}

.miiti4-detail-image:hover img{
    transform:scale(1.045);
}

.miiti4-detail-content{
    padding:10px 0;
}

.miiti4-detail-content h2{
    margin:18px 0 0;
    color:var(--miiti-blue);
    font-size:clamp(30px,3.4vw,46px);
    font-weight:var(--fw-bold);
    line-height:1.06;
    letter-spacing:-.045em;
}

.miiti4-detail-content p{
    max-width:650px;
    margin:18px 0 0;
    color:var(--miiti-text);
    font-size:var(--fs-base);
    line-height:var(--lh-relaxed);
}

.miiti4-check-list{
    display:grid;
    gap:12px;
    margin:24px 0 0;
    padding:0;
    list-style:none;
}

.miiti4-check-list li{
    display:flex;
    align-items:flex-start;
    gap:11px;
    color:var(--miiti-blue);
    font-size:var(--fs-sm);
    font-weight:var(--fw-medium);
    line-height:1.55;
}

.miiti4-check-list i{
    width:24px;
    height:24px;
    flex:0 0 24px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:1px;
    border-radius:9px;
    color:#fff;
    background:var(--miiti-orange);
    font-size:11px;
}

.miiti4-mini-specs{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-top:28px;
}

.miiti4-mini-specs div{
    padding:18px;
    border-radius:20px;
    background:#fff;
    border:1px solid rgba(8,63,120,.08);
    box-shadow:0 12px 28px rgba(8,63,120,.06);
}

.miiti4-mini-specs strong{
    display:block;
    color:var(--miiti-orange);
    font-size:var(--fs-xs);
    font-weight:var(--fw-semibold);
    letter-spacing:1.4px;
    text-transform:uppercase;
}

.miiti4-mini-specs span{
    display:block;
    margin-top:8px;
    color:var(--miiti-blue);
    font-size:var(--fs-sm);
    font-weight:var(--fw-semibold);
}

/* TECH SPECS */

.miiti4-spec-section{
    padding:0 0 82px;
}

.miiti4-spec-card{
    overflow:hidden;
    border-radius:34px;
    background:#fff;
    border:1px solid rgba(8,63,120,.08);
    box-shadow:0 24px 60px rgba(8,63,120,.10);
}

.miiti4-spec-head{
    padding:38px 38px 28px;
    background:
        radial-gradient(circle at top right, rgba(255,122,61,.10), transparent 35%),
        linear-gradient(135deg,#ffffff 0%,#f7fbff 100%);
}

.miiti4-spec-head h2{
    margin:16px 0 0;
    color:var(--miiti-blue);
    font-size:clamp(28px,3vw,42px);
    font-weight:var(--fw-bold);
    line-height:1.14;
    letter-spacing:-.04em;
}

.miiti4-spec-head p{
    max-width:680px;
    margin:14px 0 0;
    color:var(--miiti-text);
    font-size:var(--fs-base);
    line-height:var(--lh-relaxed);
}

.miiti4-spec-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid rgba(8,63,120,.07);
}

.miiti4-spec-item{
    min-height:150px;
    padding:24px;
    border-right:1px solid rgba(8,63,120,.07);
    border-bottom:1px solid rgba(8,63,120,.07);
    background:#fff;
    transition:.25s ease;
}

.miiti4-spec-item:nth-child(4n){
    border-right:none;
}

.miiti4-spec-item:hover{
    background:#f8fbff;
}

.miiti4-spec-item i{
    width:42px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:15px;
    color:var(--miiti-orange);
    background:rgba(255,122,61,.10);
    font-size:15px;
}

.miiti4-spec-item strong{
    display:block;
    margin-top:16px;
    color:var(--miiti-blue);
    font-size:var(--fs-sm);
    font-weight:var(--fw-bold);
}

.miiti4-spec-item span{
    display:block;
    margin-top:7px;
    color:var(--miiti-text);
    font-size:var(--fs-sm);
    font-weight:var(--fw-medium);
}

/* OTHER PRODUCTS */

.miiti4-other-section{
    padding:0 0 86px;
}

.miiti4-other-box{
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    padding:44px;
    border-radius:30px;
    color:#fff;
    background:
        radial-gradient(circle at top right, rgba(255,122,61,.25), transparent 30%),
        linear-gradient(135deg,#083f78,#0a5598);
    box-shadow:0 26px 68px rgba(8,63,120,.20);
}

.miiti4-other-box span{
    display:inline-block;
    margin-bottom:10px;
    color:#ffb089;
    font-size:var(--fs-xs);
    font-weight:var(--fw-semibold);
    letter-spacing:2px;
    text-transform:uppercase;
}

.miiti4-other-box h2{
    margin:0;
    color:#fff;
    font-size:var(--fs-3xl);
    font-weight:var(--fw-bold);
    line-height:1.18;
    letter-spacing:-.035em;
}

.miiti4-other-box p{
    max-width:650px;
    margin:12px 0 0;
    color:rgba(255,255,255,.78);
    font-size:var(--fs-base);
    line-height:var(--lh-relaxed);
}

.miiti4-other-actions{
    flex:0 0 auto;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.miiti4-other-actions a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:46px;
    padding:0 20px;
    border-radius:999px;
    color:var(--miiti-blue);
    background:#fff;
    text-decoration:none;
    font-size:var(--fs-sm);
    font-weight:var(--fw-semibold);
    transition:.28s ease;
}

.miiti4-other-actions a:hover{
    transform:translateY(-4px);
    color:#fff;
    background:var(--miiti-orange);
}

/* RESPONSIVE */

@media(max-width:1100px){
    .miiti4-hero-grid,
    .miiti4-detail-grid{
        grid-template-columns:1fr;
    }

    .miiti4-hero-visual{
        justify-content:center;
        min-height:420px;
    }

    .miiti4-hero-visual::before{
        right:50%;
        top:50%;
        width:470px;
        height:410px;
        transform:translate(50%, -50%) rotate(-1.5deg);
    }

    .miiti4-hero-visual::after{
        right:50%;
        bottom:24px;
        transform:translateX(50%);
        width:230px;
        height:88px;
    }

    .miiti4-hero-video{
        margin-left:0;
    }

    .miiti4-hero-features{
        grid-template-columns:1fr;
    }

    .miiti4-info-grid{
        grid-template-columns:1fr;
    }

    .miiti4-spec-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .miiti4-spec-item:nth-child(4n){
        border-right:1px solid rgba(8,63,120,.07);
    }

    .miiti4-spec-item:nth-child(2n){
        border-right:none;
    }

    .miiti4-other-box{
        flex-direction:column;
        align-items:flex-start;
    }
}

@media(max-width:700px){
    .miiti4-container{
        width:min(100% - 28px,1180px);
    }

    .miiti4-hero{
        padding:98px 0 60px;
    }

    .miiti4-hero-content h1{
        font-size:42px;
    }

    .miiti4-hero-actions,
    .miiti4-other-actions{
        width:100%;
        flex-direction:column;
    }

    .miiti4-btn,
    .miiti4-other-actions a{
        width:100%;
    }

    .miiti4-hero-visual{
        justify-content:center;
        min-height:305px;
    }

    .miiti4-hero-visual::before{
        right:50%;
        top:50%;
        width:310px;
        height:285px;
        transform:translate(50%, -50%) rotate(-1.5deg);
        border-radius:26px;
    }

    .miiti4-hero-visual::after{
        right:50%;
        bottom:8px;
        width:160px;
        height:70px;
        transform:translateX(50%);
        filter:blur(18px);
    }

    .miiti4-hero-video{
        max-width:100%;
        height:260px;
        margin-left:0;
        border-radius:24px;
        box-shadow:
            0 22px 55px rgba(8,63,120,.18),
            0 0 0 6px rgba(255,255,255,.38);
    }

    .miiti4-video-sound-toggle{
        width:46px;
        height:46px;
        top:16px;
        right:16px;
        border-radius:14px;
    }

    .miiti4-video-badge{
        left:16px;
        right:16px;
        bottom:16px;
        flex-direction:column;
        align-items:flex-start;
    }

    .miiti4-video-badge span{
        text-align:left;
    }

    .miiti4-info-card{
        padding:24px;
    }

    .miiti4-detail-image{
        max-width:100%;
        height:300px;
    }

    .miiti4-mini-specs{
        grid-template-columns:1fr;
    }

    .miiti4-spec-head{
        padding:28px 22px 22px;
    }

    .miiti4-spec-grid{
        grid-template-columns:1fr;
    }

    .miiti4-spec-item,
    .miiti4-spec-item:nth-child(2n),
    .miiti4-spec-item:nth-child(4n){
        border-right:none;
    }

    .miiti4-other-box{
        padding:30px 24px;
        border-radius:24px;
    }

    .miiti4-other-box h2{
        font-size:var(--fs-2xl);
    }
}