@font-face {font-family: 'montserrat';font-style: normal;src: url(../fonts/montserrat.ttf);}
@font-face {font-family: 'montserrat';font-style: italic;src: url(../fonts/montserrat-italic.ttf);}
:root {
    --turuncu: #fbbc05;
    --gri:#b7b7b7;
    --kgri:#4f535f;
    --agri:#efefef;
}


*{/* box-shadow: 0 0 2px 0;*/margin: 0;padding: 0;font-family: 'montserrat';text-decoration: none;list-style: none;word-wrap: break-word;}
body,html{width: 100%}
body{padding-bottom: 176px;}
img{max-width: 100%;}
ul:not(.iletisim ul){display: inline-block;}
.tsag{text-align: right;}
.tcenter{text-align: center;}
.mtop{margin-top: 0!important;}
.none{display: none!important}
.turuncu{color:var(--turuncu)} .gri{color:var(--gri);} .kgri{color:var(--kgri);}

.col-12{width: calc(100%*(12/12));float: left;}.col-11{width: calc(100%*(11/12));float: left;}.col-10{width: calc(100%*(10/12));float: left;}.col-9{width: calc(100%*(9/12));float: left;}.col-8{width: calc(100%*(8/12));float: left;}.col-7{width: calc(100%*(7/12));float: left;}.col-6{width: calc(100%*(6/12));float: left;}.col-5{width: calc(100%*(5/12));float: left;}.col-4{width: calc(100%*(4/12));float: left;}.col-3{width: calc(100%*(3/12));float: left;}.col-2{width: calc(100%*(2/12));float: left;}.col-1{width: calc(100%*(1/12));float: left;}
.fixed{position: fixed;}
.flex{display: flex;flex-wrap: wrap;}

canvas{width: 100%;height: 100%;}
#particles-js{width: 100%;position: absolute;z-index: 3;}
.pfixed{position: fixed !important;opacity: 0.2;pointer-events: none;top:0;}

header{display: flex;position: absolute;top:0;left: 0;width: 100%;pointer-events: none;z-index: 20}
header *{pointer-events: all;}

.menu{position: fixed;width: 100%;height:100%;top:0;left: 0;background: #fff;z-index: 19;transform: translate3d(100%, 0, 0);}
.menu .iletisim, .menu nav{height: 100%;display: flex;line-height: 1.5}
.menu a{color:var(--kgri);transition: all ease .25s;font-weight: 800;}
.menu a:hover{color:var(--turuncu)}

.menu nav ul{margin: auto;margin-left: 121px;}
.menu nav ul li{overflow: hidden;}
.menu nav ul li a{font-size: 40px;display: block}

.menu .iletisim{background: #f2f2f2;color:var(--kgri)}
.menu .iletisim ul a{font-size: 0;}
.menu .iletisim ul a i{font-size: 16px;}
.menu .iletisim .content{margin: auto;margin-left: 55px;}
.menu .iletisim span{font-size: 28px;font-weight: 800;color:var(--turuncu);display: block;text-align: left}
.menu .iletisim li{float: left;margin-right:10px;padding-top:5px}


.whatsapp{position: fixed;right: 18px;bottom: 25px; z-index: 22;}


.logo{padding: 30px;}
.logo img{width: 380px;height: auto;}
.nav-icon{width: 30px;padding: 20px 30px;cursor: pointer;margin:auto 0 auto 0}
.nav-icon span{display: block;height: 4px;width: 100%;margin-bottom: 3px;background: #000;float: right;clear: both;transition: 0.25s ease-in-out;}
.nav-icon span:nth-child(3){width: 60%;}
.nav-icon:hover >  span:nth-child(3){width: 100%}

.nav-icon.aktif:hover >  span{background: var(--turuncu)}
.nav-icon.aktif >  span:nth-child(1){transform:translateY(7px) rotateZ(-45deg)}
.nav-icon.aktif >  span:nth-child(2){opacity: 0;transform: rotateZ(45deg);}
.nav-icon.aktif >  span:nth-child(3){transform:translateY(-7px) rotateZ(45deg);width: 100%}
.dil{margin: auto 0 auto auto;}
.dil a{font-weight: 600;color:#000}


#intro{line-height: 1.5;width: calc(100% - 180px);pointer-events: none;padding:0 90px;position: relative;z-index: 2;background: #fff;display: inline-block;margin-bottom: -4px;    height: calc(100% - 117.641px);
    padding-top: 117.641px;}
#intro .metin, #intro .gorsel{height: 100%;display: flex;}
.bos{height: 1px}
#intro .metin .content{margin: auto;}
#intro h1{font-size: 40px;font-weight: 700;}
#intro p{font-size: 28px;font-weight: 500;}
#intro .element,.typed-cursor{font-weight: 800;color:#000}

.flip-card {max-height: 400px;background-color: transparent;width: 100%;height: 100%;perspective: 1000px;float: right;overflow: hidden;margin: auto;}
.flip-card-inner {position: relative;width: 100%;height: 100%;text-align: center;transition: transform 1s;transform-style: preserve-3d;}
.flip-card.aktif .flip-card-inner {transform: rotateY(180deg);}
.flip-card-front, .flip-card-back {position: absolute;width: 100%;height: 100%;-webkit-backface-visibility: hidden;backface-visibility: hidden;display: flex;}
.flip-card-inner img{margin: auto;max-height: 100%;width: 400px}
.flip-card-back {transform: rotateY(180deg);}

.baslik h1{font-size: 45px;text-align: center;font-weight: 800;color: var(--turuncu);}
.baslik span{font-size: 24px;font-weight: 500;text-align: center;display: block;padding: 0 30px;}


.icerik,.baslik {z-index: 2;position: relative;padding-top:75px;background: #fff;display: inline-block;width: 100%;margin-bottom: -4px}
.icerik.ilk,.baslik{padding-top:0;padding-bottom: 4px}
.icerik h2,.h2{font-size: 35px;text-align: center;font-weight: 700;}
.icerik h3,.h3{font-weight: 500;font-size: 22px;text-align: center;}
.icerik p,.p{padding:0 30px;font-size: 18px;color:var(--kgri);}
.icerik a{color:var(--kgri);}

hr{margin:20px auto; float: none!important}
.referanslar,.neler,.forms, .hakkimizda,.video, .text,.neler_yapiyoruz,.nyalt,.projelerimiz,.iletisim{float: none;margin: auto;display: flex;flex-wrap: wrap;justify-content: center;}
.icerik .neler a{display: block;color:var(--kgri);text-align: center;margin: auto;padding-bottom: 15px;transition: transform ease .25s}
.icerik .neler a img{filter: grayscale(100%) contrast(0%) brightness(20%);margin: auto;float:none;transition: all ease .25s; }
.icerik .neler a span{font-size: 19px;display: block;font-weight:500 ;padding:0 30px;transition: all ease .25s;}
.icerik .neler a .line{background: var(--turuncu);width: 35px;height: 4px;margin: 10px auto;display: inline-block;}
.icerik .neler a p{font-size: 15px;line-height: 22px;overflow: hidden;height: 66px;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;color:#000}

.icerik .neler a:hover {transform: translateY(-5px);}
.icerik .neler a:hover img{filter: none;}
.icerik .neler a:hover span{color:var(--turuncu);}

.icerik .referanslar img {margin: auto;transform: scale(0.7);filter: grayscale(100%);opacity: .5;transition: all ease .25s;}
.icerik .referanslar img:hover{opacity: 1;filter: none;}

.icerik .forms .input{display: flex;margin-top: 30px;}
.icerik .forms input,.icerik .forms  textarea{width:calc( 100% - 66px)!important;margin:auto;border: solid 3px var(--kgri) ;border-radius: 27px;font-size: 13px;padding: 15px;outline: 0;}
.icerik .forms textarea{height: 100px;}
.icerik .forms input:focus,.icerik .forms  textarea:focus{border-color: var(--turuncu);}
.icerik .forms .g-recaptcha{margin: auto;}
.icerik .forms .gonder{background: var(--kgri);font-size: 15px;margin: auto;width: 175px;text-align: center;line-height: 45px; border-radius: 25px;color: #fff;cursor: pointer;transition: all ease .25s;}
.icerik .forms .gonder:hover{background: var(--turuncu);}

.icerik .embed{height: 70vh;max-height: 700px;min-height: 400px;}
.icerik .embed iframe{width: 100%;height: 100%;}

.video{padding-left:30px;}
.text p,.p{margin-top: 15px}
.text p:nth-child(1):not(li p) {margin: 0;}
.text div,.video iframe{margin: auto;}
.video,.text{height: 100%;}

.hakkimizda{padding: 15px 0}
.neler_yapiyoruz h2,.neler_yapiyoruz hr{display: none}

.kutucuklar{width: 100%; padding-left: 15px}
.kutucuk img{width: 100%;display: block;transition: all ease .25s;}
.kutucuk .all{margin: 0 15px 15px 0;position: relative;overflow: hidden;border-radius: 15px}

.kutucuk .back{cursor:pointer;position: absolute;color: #fff;background-color: rgba(251,188,5,.8);top: 25%;left: 0;bottom: 0;right: 0;z-index: 1;display: flex;transition: all ease .25s;opacity: 0}
.kutucuk .all:hover .back {opacity: 1;top: 0}
.kutucuk .all:hover img {transform: scale(1.2);}
.kutucuk h3{padding: 0 30px;margin: auto 0;text-align: left;}

.iletisim{text-align: center;}
.iletisim a{color: var(--kgri);}


.nyalt .h3{font-weight: 700;}
.nyalt li.p span{padding: 0 15px;display: block;}
.canli img{display: block;margin: auto 0;transform: scale(0.7);}

.oyunlastirma{padding: 15px 0;}

.matterport{margin-bottom: 15px}
.matterport .all{text-decoration: underline;cursor: pointer;}
.matterport li img{float: none;filter: grayscale(100%) contrast(0%) brightness(20%);transform: scale(0.8);}
.matterport li strong{display: block;}
.matterport i{font-size: .8em}

.metaofis{padding-top: 15px}
.metaofis img{float: none}
.metaofis p{display:block;}
.metaofis .text div{margin: 0}
.metaofis a{display: block;line-height: 50px;background: var(--turuncu);padding:0 30px;font-weight: 700;border-radius:10px;border-end-start-radius:100px;border-start-end-radius:100px;}


i.list{position: relative;width: 10px;display: block;float: left;color:transparent;}
i.list:before{content: "";width: 5px;height: 5px;background: var(--kgri);display: block;position: absolute;top: 50%;transform: translateY(-50%);left: 0px;border-radius: 3px}

.footer{height: 90px;width: 100%;background: #fff;position: relative;z-index: 2;margin-top:-4px}
footer{font-size: 14px;color: var(--kgri);background: var(--agri);height: 170px;position: fixed;bottom: 0;z-index: 1;border-bottom: solid 6px #fbbc05;display: flex;flex-wrap: wrap;justify-content: center;}
footer img{width: 220px;margin-bottom: 5px}
footer .col-4{margin: auto;}
footer strong{font-size: 20px;color:#000;margin-bottom: 5px;display: block;}
footer a{color: var(--kgri);transition: all ease .25s;}
footer a:hover{color: var(--turuncu);}
footer p{padding: 0 30px;}

.popup{padding: 15px;pointer-events: none;position: fixed;width: calc(100% - 30px);height:calc(100% - 30px);z-index: 23;background:rgba(0, 0, 0, .8);top:0;opacity:0;animation-duration: 0.5s !important; }
.popup iframe,.popup video{border: none;width: 100%;margin: auto!important;max-height: 100%;max-width: 100%; }
.popup .video{padding: 0}
.popup.animate__fadeIn{display: block;pointer-events: all;}
.popup.animate__fadeOut{pointer-events: none;}
.videoplay iframe{display: none}
.frameplay video{display: none}

.f2x{font-size: 2em;}
@media only screen and (max-width: 1023px) {
    .smg{display: none;}
    .col-sm-12{width: calc(100%*(12/12));}.col-sm-11{width: calc(100%*(11/12));}.col-sm-10{width: calc(100%*(10/12));}.col-sm-9{width: calc(100%*(9/12));}.col-sm-8{width: calc(100%*(8/12));}.col-sm-7{width: calc(100%*(7/12));}.col-sm-6{width: calc(100%*(6/12));}.col-sm-5{width: calc(100%*(5/12));}.col-sm-4{width: calc(100%*(4/12));}.col-sm-3{width: calc(100%*(3/12));}.col-sm-2{width: calc(100%*(2/12));}.col-sm-1{width: calc(100%*(1/12));}
    hr{margin:10px auto;}
    #intro{height: auto!important;width:calc(100% - 30px)}
    #intro h1,.menu nav ul li a{font-size: 35px;}
    .baslik h1{font-size: 30px;}
    #intro p,.icerik h3,.h3{font-size: 20px;}
    .logo,.nav-icon {padding: 15px;}
    .logo img{max-width: 80%;}
    .menu nav ul{margin-left: auto;}
    .menu nav ul li a,.icerik h2,.h2{font-size: 25px;}
    
    .icerik p,.p,.baslik span,.icerik .neler a span,#intro,.video{padding:0 15px;}
    .video iframe{margin-bottom: 15px}
    .icerik .neler a span,.icerik p,.p,.baslik span{font-size: 16px;}
    .icerik .neler a p{font-size: 12px;}
    .icerik .neler a .line{margin: 5px auto;}

    

}
@media only screen and (max-width: 768px) {
    .col-xs-12{width: calc(100%*(12/12));}.col-xs-11{width: calc(100%*(11/12));}.col-xs-10{width: calc(100%*(10/12));}.col-xs-9{width: calc(100%*(9/12));}.col-xs-8{width: calc(100%*(8/12));}.col-xs-7{width: calc(100%*(7/12));}.col-xs-6{width: calc(100%*(6/12));}.col-xs-5{width: calc(100%*(5/12));}.col-xs-4{width: calc(100%*(4/12));}.col-xs-3{width: calc(100%*(3/12));}.col-xs-2{width: calc(100%*(2/12));}.col-xs-1{width: calc(100%*(1/12));}
    .logo img {max-width: 130px;width: 100%;}
}

/* =============================================
   MR SERVICES — Grid + Icon Animations
   ============================================= */

/* ---- section wrapper + background ---- */
.mr-services {
    position: relative;
    background: #f6f7f9;
    padding: 80px 0 70px;
    margin: 0 -90px;
    overflow: hidden;
}
/* particles canvas */
#particles-services {
    position: absolute;
    inset: 0;
    z-index: 0;
}
/* floating turuncu glow — top right */
.mr-services::after {
    content: '';
    position: absolute;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(251,188,5,0.08) 0%, transparent 65%);
    top: -180px;
    right: -120px;
    z-index: 0;
    animation: mr-glow-drift 22s ease-in-out infinite;
}
/* second floating glow — bottom left (via extra element in header) */
.mr-services-header::before {
    content: '';
    position: absolute;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(251,188,5,0.06) 0%, transparent 65%);
    bottom: -250px;
    left: -100px;
    z-index: 0;
    animation: mr-glow-drift 28s ease-in-out infinite reverse;
    pointer-events: none;
}

@keyframes mr-glow-drift {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33%      { transform: translate(25px, -15px) scale(1.05); }
    66%      { transform: translate(-15px, 10px) scale(0.97); }
}

/* all content above decorative bg */
.mr-services-header,
.mr-services-grid {
    position: relative;
    z-index: 1;
}

.mr-services-header {
    text-align: center;
    margin-bottom: 50px;
    padding: 0 30px;
}
.mr-services-header .mr-services-label {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--turuncu);
    margin-bottom: 10px;
}
.mr-services-header h2 {
    font-size: 38px;
    font-weight: 800;
    color: #1a1a1a;
    margin-bottom: 12px;
}
.mr-services-header p {
    font-size: 17px;
    color: var(--kgri);
    max-width: 520px;
    margin: 0 auto;
    line-height: 1.6;
    padding: 0;
}

/* ---- grid ---- */
.mr-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 30px;
}

/* ---- card (horizontal layout) ---- */
.mr-card {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    background: #fff;
    border-radius: 12px;
    padding: 22px 22px;
    text-decoration: none;
    color: var(--kgri);
    overflow: hidden;
    border: 1px solid #ebebeb;
    transition: transform 0.35s cubic-bezier(.22,.68,0,1),
                box-shadow 0.35s cubic-bezier(.22,.68,0,1),
                border-color 0.3s ease;
}

/* turuncu left accent — slides in from top */
.mr-card::after {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: 3px;
    background: var(--turuncu);
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.4s cubic-bezier(.22,.68,0,1);
}

/* ---- icon container ---- */
.mr-card-icon {
    position: relative;
    width: 46px;
    height: 46px;
    min-width: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #f4f4f4;
    flex-shrink: 0;
    overflow: hidden;
    z-index: 1;
}

/* fill-up effect on hover */
.mr-card-icon::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--turuncu);
    border-radius: inherit;
    transform: translateY(100%);
    transition: transform 0.4s cubic-bezier(.22,.68,0,1);
    z-index: 0;
}

.mr-card-icon img {
    position: relative;
    z-index: 1;
    width: 24px;
    height: 24px;
    filter: grayscale(100%) brightness(35%);
    opacity: 0.7;
    transition: filter 0.3s ease, opacity 0.3s ease, transform 0.4s cubic-bezier(.34,1.56,.64,1);
    float: none;
    margin: 0;
}

/* ---- text block ---- */
.mr-card-text {
    flex: 1;
    min-width: 0;
}

/* ---- title ---- */
.mr-card h3 {
    font-size: 14px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    margin: 0;
    text-align: left;
    transition: color 0.3s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---- description ---- */
.mr-card p {
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--kgri);
    margin: 4px 0 0;
    padding: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---- arrow ---- */
.mr-card-arrow {
    font-size: 18px;
    color: var(--turuncu);
    opacity: 0;
    flex-shrink: 0;
    transition: opacity 0.25s ease, transform 0.25s cubic-bezier(.22,.68,0,1);
    transform: translateX(-6px);
}

/* ---- icon bounce keyframe ---- */
@keyframes mr-icon-pop {
    0%   { transform: scale(1) rotate(0deg); }
    30%  { transform: scale(0.8) rotate(-8deg); }
    60%  { transform: scale(1.15) rotate(4deg); }
    100% { transform: scale(1) rotate(0deg); }
}

/* ============ HOVER ============ */

.mr-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0,0,0,0.09);
    border-color: #e0e0e0;
}

/* accent line (left) */
.mr-card:hover::after {
    transform: scaleY(1);
}

/* icon fill-up */
.mr-card:hover .mr-card-icon::before {
    transform: translateY(0);
}

/* icon img: white + bounce */
.mr-card:hover .mr-card-icon img {
    filter: brightness(0) invert(1);
    opacity: 1;
    animation: mr-icon-pop 0.5s cubic-bezier(.34,1.56,.64,1) forwards;
}

/* title color */
.mr-card:hover h3 {
    color: var(--turuncu);
}

/* arrow slide in */
.mr-card:hover .mr-card-arrow {
    opacity: 1;
    transform: translateX(0);
}

/* ============ RESPONSIVE ============ */

@media only screen and (max-width: 1100px) {
    .mr-services { margin: 0 -15px; padding: 60px 0 50px; }
    .mr-services-grid { gap: 14px; }
    .mr-services-header h2 { font-size: 32px; }
    .mr-card { padding: 16px 18px; }
    .mr-card h3 { font-size: 13.5px; }
    .mr-card p { font-size: 11.5px; }
}

@media only screen and (max-width: 768px) {
    .mr-services { margin: 0; padding: 50px 0 40px; }
    .mr-services-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
        padding: 0 15px;
    }
    .mr-services-header { margin-bottom: 36px; }
    .mr-services-header h2 { font-size: 26px; }
    .mr-services-header p { font-size: 15px; }
    .mr-card { padding: 14px 16px; gap: 12px; border-radius: 10px; }
    .mr-card-icon { width: 40px; height: 40px; min-width: 40px; border-radius: 10px; }
    .mr-card-icon img { width: 20px; height: 20px; }
    .mr-card h3 { font-size: 13px; }
    .mr-card p { display: none; }
    .mr-card-arrow { display: none; }
}

@media only screen and (max-width: 480px) {
    .mr-services { padding: 40px 0 30px; }
    .mr-services-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .mr-card h3 { font-size: 13.5px; }
    .mr-card p { display: block; font-size: 11.5px; }
}


/* =============================================
   MR REFERANSLAR — Draggable Marquee
   ============================================= */

.mr-ref {
    padding: 70px 0 60px;
}

.mr-ref-header {
    text-align: center;
    margin-bottom: 20px;
}
.mr-ref-header .mr-ref-label {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--turuncu);
    margin-bottom: 10px;
}
.mr-ref-header h2 {
    font-size: 34px;
    font-weight: 800;
    color: #1a1a1a;
    margin-bottom: 6px;
}
.mr-ref-header p {
    font-size: 16px;
    color: var(--kgri);
    margin: 0;
    padding: 0;
}

/* stat counter */
.mr-ref-stat {
    text-align: center;
    margin-bottom: 36px;
}
.mr-ref-stat .mr-ref-num {
    font-size: 52px;
    font-weight: 800;
    color: var(--turuncu);
    line-height: 1;
    display: inline-block;
}
.mr-ref-stat .mr-ref-num small {
    font-size: 36px;
    font-weight: 700;
}
.mr-ref-stat .mr-ref-stat-text {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--kgri);
    letter-spacing: 1px;
    margin-top: 4px;
}

/* marquee container */
.mr-ref-marquee {
    overflow: hidden;
    width: 100%;
    cursor: grab;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 5%, #000 95%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, #000 5%, #000 95%, transparent 100%);
    padding: 10px 0;
    -webkit-user-select: none;
    user-select: none;
}

.mr-ref-track {
    display: flex;
    gap: 50px;
    align-items: center;
    width: max-content;
    will-change: transform;
}

/* logo item */
.mr-ref-logo {
    flex-shrink: 0;
    width: 130px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mr-ref-logo img {
    max-width: 100%;
    max-height: 55px;
    filter: grayscale(100%) opacity(0.35);
    transition: filter 0.35s ease, transform 0.35s ease;
    float: none;
    margin: 0;
    -webkit-user-drag: none;
}
.mr-ref-logo img:hover {
    filter: grayscale(0%) opacity(1);
    transform: scale(1.08);
}

/* responsive */
@media only screen and (max-width: 1023px) {
    .mr-ref { padding: 55px 0 45px; }
    .mr-ref-header h2 { font-size: 28px; }
    .mr-ref-stat .mr-ref-num { font-size: 42px; }
    .mr-ref-track { gap: 36px; }
    .mr-ref-logo { width: 110px; height: 55px; }
    .mr-ref-logo img { max-height: 46px; }
}
@media only screen and (max-width: 768px) {
    .mr-ref { padding: 45px 0 35px; }
    .mr-ref-header h2 { font-size: 24px; }
    .mr-ref-header { margin-bottom: 16px; }
    .mr-ref-stat .mr-ref-num { font-size: 36px; }
    .mr-ref-stat { margin-bottom: 24px; }
    .mr-ref-track { gap: 28px; }
    .mr-ref-logo { width: 95px; height: 48px; }
    .mr-ref-logo img { max-height: 40px; }
}


/* =============================================
   MR MATTERPORT — 3D Tour Section
   ============================================= */

.mr-matterport {
    position: relative;
    background: #f6f7f9;
    padding: 70px 0 60px;
    margin: 0 -90px;
    overflow: hidden;
}

.mr-matterport-header {
    text-align: center;
    margin-bottom: 40px;
    position: relative;
    z-index: 1;
}
.mr-matterport-header .mr-matterport-label {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--turuncu);
    margin-bottom: 10px;
}
.mr-matterport-header h2 {
    font-size: 34px;
    font-weight: 800;
    color: #1a1a1a;
    margin-bottom: 10px;
}
.mr-matterport-header p {
    font-size: 16px;
    color: var(--kgri);
    max-width: 500px;
    margin: 0 auto;
    line-height: 1.6;
    padding: 0;
}

.mr-matterport-embed {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 30px;
    position: relative;
    z-index: 1;
}
.mr-matterport-embed iframe {
    width: 100%;
    height: 520px;
    border: none;
    border-radius: 14px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.1);
}

@media only screen and (max-width: 1023px) {
    .mr-matterport { margin: 0 -15px; padding: 55px 0 45px; }
    .mr-matterport-header h2 { font-size: 28px; }
    .mr-matterport-embed iframe { height: 420px; border-radius: 12px; }
}
@media only screen and (max-width: 768px) {
    .mr-matterport { margin: 0; padding: 45px 0 35px; }
    .mr-matterport-header h2 { font-size: 24px; }
    .mr-matterport-header p { font-size: 14px; }
    .mr-matterport-embed { padding: 0 15px; }
    .mr-matterport-embed iframe { height: 300px; border-radius: 10px; }
}