.quote-page{
    background:#282828;
    color:#fff;
}

.quote-page .container{
    width:min(1320px, calc(100% - 48px));
    margin:0 auto;
}

.quote-hero{
    padding:95px 0 80px;
    text-align:center;
}

.ufuk-breadcrumb a{
    color:#fff;
    text-decoration:none;
    transition:color .3s ease;
}

.ufuk-breadcrumb a:hover{
    color:#ffc400;
}

.ufuk-breadcrumb span{
    color:#9a9a9a;
}

.ufuk-breadcrumb span:nth-child(2){
    color:#ffc400;
}

.quote-hero__title{
    margin:0;
    color:#fff;
    font-size:64px;
    font-weight:700;
    line-height:1;
    letter-spacing:-2px;
}

.quote-hero__line{
    display:block;
    width:90px;
    height:4px;
    margin:35px auto 0;
    border-radius:10px;
    background:#ffc400;
}

.quote-section{
    padding:35px 0 120px;
}

.quote-section__header{
    max-width:760px;
    margin-bottom:55px;
}

.quote-section__eyebrow{
    display:block;
    margin-bottom:15px;
    color:#ffc400;
    font-size:13px;
    font-weight:700;
    letter-spacing:5px;
}

.quote-section__header h2{
    margin:0 0 20px;
    color:#fff;
    font-size:46px;
    font-weight:700;
    line-height:1.15;
    letter-spacing:-1.5px;
}

.quote-section__header h2 span{
    color:#ffc400;
}

.quote-section__header p{
    max-width:690px;
    margin:0;
    color:#999;
    font-size:17px;
    line-height:1.8;
}

.quote-layout{
    display:grid;
    grid-template-columns:minmax(0, 1.65fr) minmax(300px, .75fr);
    gap:28px;
    align-items:stretch;
}

.quote-form-wrapper{
    padding:38px;
    border:1px solid rgba(255,255,255,.10);
    background:#303030;
}

.quote-form__grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px;
}

.quote-form__group{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.quote-form__group--full{
    grid-column:1 / -1;
}

.quote-form__group label{
    color:#f5f5f5;
    font-size:14px;
    font-weight:600;
}

.quote-form__group label span{
    color:#ffc400;
}

.quote-form__group input,
.quote-form__group textarea{
    width:100%;
    box-sizing:border-box;
    border:1px solid rgba(255,255,255,.12);
    outline:none;
    background:#282828;
    color:#fff;
    font-family:inherit;
    font-size:15px;
    transition:.3s ease;
}

.quote-form__group input{
    height:58px;
    padding:0 18px;
}

.quote-form__group textarea{
    min-height:135px;
    padding:17px 18px;
    resize:vertical;
    line-height:1.6;
}

.quote-form__group input::placeholder,
.quote-form__group textarea::placeholder{
    color:#777;
}

.quote-form__group input:focus,
.quote-form__group textarea:focus{
    border-color:#ffc400;
    background:#2b2b2b;
    box-shadow:0 0 0 3px rgba(255,196,0,.08);
}

.quote-form__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    margin-top:30px;
}

.quote-form__footer p{
    margin:0;
    color:#777;
    font-size:12px;
}

.quote-form__footer p span{
    color:#ffc400;
}

.quote-form__button{
    min-width:225px;
    height:58px;
    padding:0 24px;
    border:1px solid #ffc400;
    background:#ffc400;
    color:#222;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    font-family:inherit;
    font-size:14px;
    font-weight:700;
    cursor:pointer;
    transition:.3s ease;
}

.quote-form__button svg{
    width:20px;
    height:20px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
    transition:transform .3s ease;
}

.quote-form__button:hover{
    background:transparent;
    color:#ffc400;
    transform:translateY(-2px);
}

.quote-form__button:hover svg{
    transform:translateX(4px);
}

.quote-info{
    position:relative;
    overflow:hidden;
    padding:42px 35px;
    border:1px solid rgba(255,196,0,.28);
    background:
        linear-gradient(
            145deg,
            rgba(255,196,0,.08),
            rgba(255,196,0,0) 52%
        ),
        #242424;
}

.quote-info::after{
    content:"";
    position:absolute;
    right:-110px;
    bottom:-110px;
    width:240px;
    height:240px;
    border:1px solid rgba(255,196,0,.13);
    border-radius:50%;
}

.quote-info__number{
    display:block;
    margin-bottom:30px;
    color:#ffc400;
    font-size:13px;
    font-weight:700;
    letter-spacing:4px;
}

.quote-info h3{
    position:relative;
    z-index:1;
    margin:0 0 18px;
    color:#fff;
    font-size:29px;
    line-height:1.3;
}

.quote-info > p{
    position:relative;
    z-index:1;
    margin:0;
    color:#929292;
    font-size:15px;
    line-height:1.8;
}

.quote-info__items{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    gap:22px;
    margin-top:38px;
    padding-top:30px;
    border-top:1px solid rgba(255,255,255,.10);
}

.quote-info__item{
    display:flex;
    align-items:flex-start;
    gap:15px;
}

.quote-info__icon{
    flex:0 0 42px;
    width:42px;
    height:42px;
    border:1px solid rgba(255,196,0,.35);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ffc400;
}

.quote-info__icon svg{
    width:20px;
    height:20px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.quote-info__item div{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.quote-info__item strong{
    color:#f5f5f5;
    font-size:14px;
    line-height:1.4;
}

.quote-info__item small{
    color:#7f7f7f;
    font-size:12px;
    line-height:1.55;
}

@media (max-width:991px){
    .quote-layout{
        grid-template-columns:1fr;
    }
}

@media (max-width:767px){
    .quote-page .container{
        width:min(100% - 30px, 1320px);
    }

    .quote-hero{
        padding:70px 0 60px;
    }

    .quote-hero__title{
        font-size:46px;
    }

    .quote-section{
        padding:25px 0 80px;
    }

    .quote-section__header h2{
        font-size:36px;
    }

    .quote-form-wrapper{
        padding:25px 20px;
    }

    .quote-form__grid{
        grid-template-columns:1fr;
        gap:20px;
    }

    .quote-form__group--full{
        grid-column:auto;
    }

    .quote-form__footer{
        align-items:flex-start;
        flex-direction:column;
    }

    .quote-form__button{
        width:100%;
    }
}

@media (max-width:480px){
    .ufuk-breadcrumb{
        font-size:11px;
        letter-spacing:1.5px;
    }

    .quote-hero__title{
        font-size:40px;
    }

    .quote-section__header h2{
        font-size:32px;
    }

    .quote-section__header p{
        font-size:15px;
    }

    .quote-info{
        padding:30px 22px;
    }

    .quote-info h3{
        font-size:25px;
    }
}

.teklif-al-gorsel{
    margin-top:30px;
    overflow:hidden;
    border:1px solid rgba(255,196,0,.18);
    border-radius:8px;
    height:350px; 
}