style

/*==================================================
TURTLE AUTO EMPORIUM
REQUEST FOR QUOTATION
ENTERPRISE PROCUREMENT PORTAL
==================================================*/

:root{

    primary:#0A7D25;
    primary-dark:#08631d;
    primary-light:#eef8f1;

    secondary:#17212b;

    text:#5f6c76;
    text-light:#8b97a2;

    heading:#1d2939;

    border:#e8edeb;

    card:#ffffff;
    section:#f8faf9;

    radius:18px;

    transition:.35s ease;

}

/*==================================================
GLOBAL
==================================================*/

html{

    scroll-behavior:smooth;

}

.rfq-page{

    background:#fff;

    color:var(--text);

    font-family:'Poppins',sans-serif;

    font-size:16px;

    line-height:1.9;

}

.rfq-page *{

    box-sizing:border-box;

}

.rfq-page section{

    position:relative;

}

.rfq-page a{

    transition:all .35s ease;

}

.rfq-page img{

    max-width:100%;

    height:auto;

}

/*==================================================
PAGE BANNER
==================================================*/

.rfq-page .rfq-banner{

    position:relative;

    overflow:hidden;

    padding:150px 0 90px;

    background:

    linear-gradient(rgba(0,0,0,.72),rgba(0,0,0,.60)),

    url("assets/img/procurement-banner.jpg");

    background-size:cover;

    background-position:center;

}

.rfq-page .rfq-banner::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    radial-gradient(circle at top right,

    rgba(255,255,255,.08),

    transparent 45%);

}

.rfq-page .rfq-banner::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:120px;

    background:

    linear-gradient(to top,#fff,transparent);

}

.rfq-page .rfq-banner .container{

    position:relative;

    z-index:5;

}

.rfq-page .rfq-banner h1{

    font-size:58px;

    font-weight:800;

    color:#fff;

    letter-spacing:-2px;

    line-height:1.15;

    margin-bottom:22px;

}

.rfq-page .rfq-banner p{

    max-width:760px;

    font-size:18px;

    line-height:2;

    color:rgba(255,255,255,.92);

    margin-bottom:35px;

}

.rfq-page .breadcrumb-area{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:12px;

    font-size:15px;

}

.rfq-page .breadcrumb-area a{

    color:#fff;

    opacity:.85;

    text-decoration:none;

}

.rfq-page .breadcrumb-area a:hover{

    opacity:1;

}

.rfq-page .breadcrumb-area span{

    color:rgba(255,255,255,.55);

}

/*==================================================
MAIN CONTENT
==================================================*/

.rfq-page .rfq-section{

    background:#fff;

    padding:120px 0;

}

.rfq-page .section-title{

    font-size:40px;

    font-weight:800;

    letter-spacing:-1px;

    color:var(--heading);

    line-height:1.25;

    margin-bottom:18px;

}

.rfq-page .section-text{

    max-width:760px;

    font-size:17px;

    color:#667085;

    line-height:2;

    margin-bottom:45px;

}

/*==================================================
SECTION DIVIDER
==================================================*/

.rfq-page .section-divider{

    width:70px;

    height:4px;

    border-radius:50px;

    background:linear-gradient(

    90deg,

    var(--primary),

    #28b24d

    );

    margin:25px 0 35px;

}

/*==================================================
SECTION LABEL
==================================================*/

.rfq-page .section-label{

    display:inline-flex;

    align-items:center;

    gap:10px;

    background:#eef8f1;

    color:var(--primary);

    padding:10px 18px;

    border-radius:40px;

    font-size:13px;

    font-weight:700;

    letter-spacing:.8px;

    text-transform:uppercase;

    margin-bottom:22px;

}

.rfq-page .section-label i{

    font-size:14px;

}

/*==================================================
PREMIUM RFQ CARD
==================================================*/

.rfq-page .rfq-card{

    position:relative;

    background:#ffffff;

    border:1px solid #edf2ef;

    border-radius:22px;

    padding:60px;

    overflow:hidden;

    box-shadow:

    0 12px 35px rgba(16,24,40,.04),

    0 35px 80px rgba(16,24,40,.05);

}

.rfq-page .rfq-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:5px;

    background:linear-gradient(

    90deg,

    #0A7D25,

    #18b64b

    );

}

/*==================================================
FORM SECTIONS
==================================================*/

.rfq-page .form-block{

    margin-bottom:55px;

    padding-bottom:40px;

    border-bottom:1px solid #eef2ef;

}

.rfq-page .form-block:last-child{

    margin-bottom:0;

    padding-bottom:0;

    border-bottom:none;

}

.rfq-page .form-block-title{

    font-size:24px;

    font-weight:700;

    color:#17212B;

    margin-bottom:10px;

}

.rfq-page .form-block-description{

    font-size:15px;

    color:#7a8793;

    margin-bottom:35px;

    line-height:1.9;

}

/*==================================================
LABELS
==================================================*/

.rfq-page .form-label{

    display:block;

    margin-bottom:10px;

    color:#344054;

    font-size:14px;

    font-weight:700;

    letter-spacing:.3px;

}

.rfq-page .text-danger{

    color:#e53935 !important;

}

/*==================================================
INPUTS
==================================================*/

.rfq-page .form-control,

.rfq-page .form-select{

    height:60px;

    border-radius:14px;

    border:1px solid #dfe8e3;

    background:#ffffff;

    font-size:15px;

    color:#344054;

    padding:0 20px;

    transition:all .30s ease;

    box-shadow:none;

}

.rfq-page textarea.form-control{

    height:210px;

    resize:vertical;

    padding:18px 20px;

    line-height:1.9;

}

.rfq-page .form-control:hover,

.rfq-page .form-select:hover{

    border-color:#bfd6c5;

}

.rfq-page .form-control:focus,

.rfq-page .form-select:focus{

    border-color:#0A7D25;

    background:#fff;

    box-shadow:

    0 0 0 5px rgba(10,125,37,.08);

}

.rfq-page input[type="date"]{

    cursor:pointer;

}

.rfq-page ::placeholder{

    color:#98a2b3;

    opacity:1;

}

/*==================================================
FORM SPACING
==================================================*/

.rfq-page .row>.col-md-6,

.rfq-page .row>.col-12{

    margin-bottom:8px;

}

/*==================================================
UPLOAD AREA
==================================================*/

.rfq-page .upload-box{

    position:relative;

    border:2px dashed #d9e8dd;

    border-radius:18px;

    background:#fbfcfb;

    padding:60px 40px;

    text-align:center;

    transition:.35s ease;

}

.rfq-page .upload-box:hover{

    border-color:#0A7D25;

    background:#f4faf6;

    transform:translateY(-4px);

}

.rfq-page .upload-box i{

    width:90px;

    height:90px;

    margin:auto;

    margin-bottom:22px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#eef8f1;

    color:#0A7D25;

    font-size:38px;

}

.rfq-page .upload-box h5{

    font-size:24px;

    font-weight:700;

    color:#1D2939;

    margin-bottom:12px;

}

.rfq-page .upload-box p{

    color:#667085;

    font-size:15px;

    line-height:1.9;

    margin-bottom:25px;

}

.rfq-page input[type=file]{

    border-radius:12px;

    border:1px solid #dfe8e3;

    padding:12px;

}

/*==================================================
CHECKBOX
==================================================*/

.rfq-page .form-check{

    background:#f8faf9;

    border:1px solid #e7ece9;

    border-radius:16px;

    padding:20px 22px;

}

.rfq-page .form-check-input{

    width:20px;

    height:20px;

    margin-top:2px;

}

.rfq-page .form-check-input:checked{

    background:#0A7D25;

    border-color:#0A7D25;

}

.rfq-page .form-check-label{

    color:#667085;

    line-height:1.9;

    padding-left:8px;

}

/*==================================================
BUTTON
==================================================*/

.rfq-page button.submit-btn{

display:flex !important;

align-items:center;

justify-content:center;

gap:12px;

width:100%;

max-width:340px;

height:62px;

background:#0A7D25 !important;

background-image:linear-gradient(135deg,#0A7D25,#18A83D);

border:none !important;

border-radius:14px;

color:#fff !important;

font-size:16px;

font-weight:700;

cursor:pointer;

text-decoration:none;

transition:.35s;

}

.rfq-page button.submit-btn:hover{

background:#08631d !important;

background-image:linear-gradient(135deg,#08631d,#149738);

color:#fff !important;

transform:translateY(-3px);

}

.rfq-page button.submit-btn i{

color:#fff !important;

}

.rfq-page .py-100{

padding:110px 0;

}


/*==================================================
HELP TEXT
==================================================*/

.rfq-page .field-help{

    display:block;

    margin-top:8px;

    color:#98a2b3;

    font-size:13px;

}

/*==================================================
PREMIUM PROCUREMENT SIDEBAR
==================================================*/

.rfq-page .sticky-sidebar{

    position:sticky;

    top:120px;

}

.rfq-page .info-card{

    position:relative;

    overflow:hidden;

    background:#fff;

    border:1px solid #edf2ef;

    border-radius:22px;

    padding:35px;

    margin-bottom:28px;

    transition:all .35s ease;

    box-shadow:

    0 12px 30px rgba(15,23,42,.04),

    0 30px 60px rgba(15,23,42,.04);

}

.rfq-page .info-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:5px;

    height:100%;

    background:linear-gradient(

    180deg,

    #0A7D25,

    #18b64b

    );

}

.rfq-page .info-card:hover{

    transform:translateY(-8px);

    box-shadow:

    0 20px 40px rgba(15,23,42,.08),

    0 45px 90px rgba(15,23,42,.07);

}

.rfq-page .info-card h4{

    color:#17212B;

    font-size:24px;

    font-weight:700;

    margin-bottom:18px;

    letter-spacing:-.5px;

}

.rfq-page .info-card p{

    color:#667085;

    font-size:15px;

    line-height:2;

    margin-bottom:25px;

}

/*==================================================
CONTACT BLOCK
==================================================*/

.rfq-page .contact-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    padding:18px 0;

    border-bottom:1px solid #f0f3f1;

}

.rfq-page .contact-item:last-child{

    border:none;

    padding-bottom:0;

}

.rfq-page .contact-item i{

    width:62px;

    height:62px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#eef8f1;

    color:#0A7D25;

    border:1px solid #d9ebdd;

    font-size:22px;

    transition:.35s;

}

.rfq-page .info-card:hover .contact-item i{

    transform:rotate(-8deg);

    background:#0A7D25;

    color:#fff;

}

.rfq-page .contact-item strong{

    display:block;

    color:#17212B;

    font-size:16px;

    margin-bottom:6px;

    font-weight:700;

}

.rfq-page .contact-item div{

    color:#667085;

    line-height:1.8;

}

/*==================================================
PROCUREMENT LISTS
==================================================*/

.rfq-page .info-card ul{

    list-style:none;

    padding:0;

    margin:0;

}

.rfq-page .info-card ul li{

    position:relative;

    padding-left:32px;

    margin-bottom:15px;

    color:#667085;

    line-height:1.8;

}

.rfq-page .info-card ul li::before{

    content:"✓";

    position:absolute;

    left:0;

    top:2px;

    width:20px;

    height:20px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#eef8f1;

    color:#0A7D25;

    font-size:11px;

    font-weight:700;

}

/*==================================================
WHATSAPP BUTTON
==================================================*/

.rfq-page .btn-success{

    background:#0A7D25;

    border:none;

    border-radius:14px;

    padding:15px 25px;

    font-weight:700;

    letter-spacing:.3px;

    transition:.35s;

    box-shadow:

    0 15px 30px rgba(10,125,37,.18);

}

.rfq-page .btn-success:hover{

    background:#08631d;

    transform:translateY(-3px);

}

/*==================================================
BUSINESS HOURS
==================================================*/

.rfq-page .table{

    margin:0;

}

.rfq-page .table tr{

    border-bottom:1px solid #edf2ef;

}

.rfq-page .table tr:last-child{

    border-bottom:none;

}

.rfq-page .table td{

    padding:15px 0;

    color:#667085;

    font-size:15px;

    border:none;

}

.rfq-page .table td:last-child{

    text-align:right;

    color:#17212B;

    font-weight:600;

}

/*==================================================
SERVICE HIGHLIGHTS
==================================================*/

.rfq-page .service-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    padding:18px 0;

}

.rfq-page .service-item i{

    width:58px;

    height:58px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#eef8f1;

    color:#0A7D25;

    font-size:22px;

}

.rfq-page .service-item h6{

    margin-bottom:8px;

    font-size:17px;

    color:#17212B;

    font-weight:700;

}

.rfq-page .service-item p{

    margin:0;

    color:#667085;

    font-size:15px;

    line-height:1.8;

}

/*==================================================
TIMELINE / PROCESS
==================================================*/

.rfq-page .process-box{

    position:relative;

    overflow:hidden;

    background:#fff;

    border-radius:22px;

    border:1px solid #edf2ef;

    padding:45px 35px;

    text-align:center;

    transition:.35s;

    height:100%;

    box-shadow:

    0 15px 35px rgba(15,23,42,.04);

}

.rfq-page .process-box::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:5px;

    background:linear-gradient(

    90deg,

    #0A7D25,

    #18b64b

    );

    transform:scaleX(0);

    transition:.35s;

}

.rfq-page .process-box:hover{

    transform:translateY(-10px);

}

.rfq-page .process-box:hover::before{

    transform:scaleX(1);

}

.rfq-page .process-number{

    width:78px;

    height:78px;

    margin:auto;

    margin-bottom:25px;

    border-radius:50%;

    background:linear-gradient(

    135deg,

    #0A7D25,

    #18b64b

    );

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:24px;

    font-weight:700;

    box-shadow:

    0 20px 35px rgba(10,125,37,.22);

}

.rfq-page .process-box .card-icon{

    width:75px;

    height:75px;

    margin:0 auto 25px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#eef8f1;

}

.rfq-page .process-box .card-icon i{

    font-size:30px;

    color:#0A7D25;

}

.rfq-page .process-box h5{

    font-size:22px;

    color:#17212B;

    font-weight:700;

    margin-bottom:18px;

}

.rfq-page .process-box p{

    color:#667085;

    line-height:1.9;

    margin:0;

}

/*==================================================
SECTION BADGES
==================================================*/

.rfq-page .section-badge{

display:inline-flex;

align-items:center;

gap:10px;

padding:10px 22px;

background:#eef8f1;

border:1px solid #dceede;

border-radius:50px;

font-size:13px;

font-weight:700;

letter-spacing:1px;

text-transform:uppercase;

color:#0A7D25;

margin-bottom:22px;

}

.rfq-page .section-badge i{

font-size:14px;

}

/*==================================================
CORPORATE CTA
==================================================*/

.rfq-page .cta-box{

position:relative;

overflow:hidden;

padding:70px 60px;

border-radius:24px;

background:

linear-gradient(135deg,

#0A7D25,

#149738);

color:#fff;

box-shadow:

0 30px 60px rgba(10,125,37,.25);

}

.rfq-page .cta-box::before{

content:"";

position:absolute;

right:-80px;

top:-80px;

width:260px;

height:260px;

border-radius:50%;

background:rgba(255,255,255,.08);

}

.rfq-page .cta-box::after{

content:"";

position:absolute;

left:-120px;

bottom:-120px;

width:320px;

height:320px;

border-radius:50%;

background:rgba(255,255,255,.04);

}

.rfq-page .cta-box>*{

position:relative;

z-index:2;

}

.rfq-page .cta-box h2{

font-size:42px;

font-weight:800;

margin-bottom:18px;

letter-spacing:-1px;

}

.rfq-page .cta-box p{

font-size:18px;

line-height:2;

opacity:.95;

margin-bottom:35px;

}

.rfq-page .cta-box .btn{

padding:17px 36px;

border-radius:14px;

font-weight:700;

font-size:16px;

}

/*==================================================
LIGHT BUTTON
==================================================*/

.rfq-page .btn-light{

background:#fff;

color:#0A7D25;

border:none;

transition:.35s;

}

.rfq-page .btn-light:hover{

background:#f3f7f4;

color:#08631d;

transform:translateY(-3px);

}

/*==================================================
DIVIDERS
==================================================*/

.rfq-page hr{

border:none;

height:1px;

background:#edf2ef;

margin:28px 0;

}

/*==================================================
LIST SPACING
==================================================*/

.rfq-page ul{

margin-bottom:0;

}

.rfq-page li:last-child{

margin-bottom:0;

}

/*==================================================
SCROLL ANIMATION
==================================================*/

.rfq-page .rfq-card,

.rfq-page .info-card,

.rfq-page .process-box{

transition:

transform .35s ease,

box-shadow .35s ease,

border-color .35s ease;

}

/*==================================================
INPUT ICON SUPPORT
==================================================*/

.rfq-page .input-group-text{

background:#eef8f1;

border:1px solid #dfe8e3;

border-right:none;

color:#0A7D25;

border-radius:12px 0 0 12px;

}

.rfq-page .input-group .form-control{

border-left:none;

border-radius:0 12px 12px 0;

}

/*==================================================
TABLET
==================================================*/

@media(max-width:1200px){

.rfq-page .rfq-card{

padding:45px;

}

.rfq-page .cta-box{

padding:55px 45px;

}

}

/*==================================================
MOBILE
==================================================*/

@media(max-width:991px){

.rfq-page .sticky-sidebar{

position:relative;

top:auto;

}

.rfq-page .rfq-banner{

padding:110px 0 70px;

text-align:center;

}

.rfq-page .rfq-banner h1{

font-size:42px;

}

.rfq-page .rfq-banner p{

font-size:17px;

margin:auto;

margin-bottom:30px;

}

.rfq-page .breadcrumb-area{

justify-content:center;

}

.rfq-page .rfq-card{

padding:35px;

}

.rfq-page .info-card{

padding:28px;

}

.rfq-page .process-box{

margin-bottom:25px;

}

.rfq-page .cta-box{

padding:45px 35px;

text-align:center;

}

.rfq-page .cta-box h2{

font-size:32px;

}

.rfq-page .cta-box p{

font-size:16px;

}

.rfq-page .submit-btn{

width:100%;

}

}

/*==================================================
SMALL MOBILE
==================================================*/

@media(max-width:576px){

.rfq-page .rfq-banner{

padding:95px 0 60px;

}

.rfq-page .rfq-banner h1{

font-size:34px;

line-height:1.25;

}

.rfq-page .section-title{

font-size:28px;

}

.rfq-page .rfq-card{

padding:25px;

border-radius:18px;

}

.rfq-page .info-card{

padding:22px;

border-radius:18px;

}

.rfq-page .upload-box{

padding:35px 20px;

}

.rfq-page .upload-box i{

width:70px;

height:70px;

font-size:28px;

}

.rfq-page .process-number{

width:65px;

height:65px;

font-size:20px;

}

.rfq-page .cta-box{

padding:35px 25px;

}

}

/*==================================================
PREMIUM SELECTION
==================================================*/

.rfq-page ::selection{

background:#0A7D25;

color:#fff;

}

/*==================================================
SMOOTH IMAGE HOVER
==================================================*/

.rfq-page img{

transition:.35s ease;

}

.rfq-page img:hover{

transform:scale(1.02);

}

/*==================================================
REMOVE BOOTSTRAP HARSH SHADOWS
==================================================*/

.rfq-page .shadow,

.rfq-page .shadow-sm,

.rfq-page .shadow-lg{

box-shadow:none !important;

}

/*==================================================
END
==================================================*/