/*
Theme Name: Safe Flow Traffic
Theme URI: https://example.com/safe-flow-traffic
Author: Rianytown Media
Author URI: https://raintownmedia.example
Description: A lightweight, Gutenberg-friendly starter theme for Safe Flow Traffic.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: safe-flow-traffic
*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800&display=swap');

:root { --font: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }

h1 { font-family: var(--font); font-weight: 800; letter-spacing: .5px; }
h3 { font-family: var(--font); font-weight: 600; }
body { font-family: var(--font); font-weight: 400; }

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#222;background:#fff}

.site-header{background:var(--sft-dark);color:#fff}
.site-header .site-branding{display:flex;gap:.75rem;align-items:center;padding:1rem}
.site-header a{color:#fff;text-decoration:none}

.primary-nav{display:flex;gap:1rem;flex-wrap:wrap;padding:0 1rem 1rem}
.primary-nav a{color:#fff;padding:.5rem .75rem;border-radius:.375rem}
.primary-nav a:hover,.primary-nav .current-menu-item>a{background:var(--sft-primary)}

.container{max-width:1100px;margin:0 auto;padding:0 1rem}
.entry-title{margin:.5rem 0 1rem}
.entry-content img{max-width:100%;height:auto}

.site-footer{background:#111;color:#c9d1c8;padding:2rem 1rem;margin-top:3rem}
.site-footer a{color:#c9d1c8}

.btn{display:inline-block;background:var(--sft-accent);color:#0b1f1a;padding:.65rem 1rem;border-radius:.5rem;text-decoration:none}
.btn:hover{filter:brightness(.95)}

/*** HEader Css**/
.site-header a {
    color: #000;
    text-decoration: none;
    font-weight: 500;
}
.site-header .red-btn a {
display: inline-block;
    padding: .65rem 1.25rem !important;
    color: #fff;
    /* font-weight: 800; */
    border: 0;
    border-radius: 9999px;
    text-decoration: none;
    background: linear-gradient(180deg, #ff2e2e 0%, #d70b0b 55%, #a70000 100%);
    box-shadow: 0 2px 0 rgba(0, 0, 0, .12), inset 0 0 0 1px rgba(255, 255, 255, .35);
    position: relative;
    transition: filter .15s ease, transform .08s ease;
}
/*** top banner**/
.carousel-item img { height: 60vh; object-fit: cover; }
.carousel-caption { left: 5%; right: auto; bottom: 20% !important; text-align: left; }
.carousel-item .btn,
.bttn.red-btn{
  display: inline-block;
    padding: .65rem 2.5rem !important;
    color: #fff;
    font-weight: 500;
    border: 0;
    border-radius: 9999px;
    text-decoration: none;
    background: linear-gradient(180deg, #ff2e2e 0%, #d70b0b 55%, #a70000 100%);
    box-shadow: 0 2px 0 rgba(0, 0, 0, .12), inset 0 0 0 1px rgba(255, 255, 255, .35);
    position: relative;
    transition: filter .15s ease, transform .08s ease;
}
.carousel-item h1{
 font-size: 52px;
    font-weight: 700;
    max-width: 600px;
}
.carousel-item p{
	    font-size: 24px;
    max-width: 600px;
    font-weight: 400;
}
/* ourservices */
.red-border{
		width:120px;
		height:4px;
		background:#e10600;
		border-radius:2px;
}
/* about us */
/*  Talk to Our Experts*/
.talk-to-our-experts h2{
	max-width: 400px;
}
.talk-to-our-experts .desc{
	max-width: 550px;
}
.why-choose{
	padding-top:40px;
}
.why-choose strong{
	font-size:24px;
}
.why-choose ul {
  list-style: none;
  padding: 0;
  margin: 0;
  max-width: 400px;
}

.why-choose ul  li {
  background: url("https://safeflow.webvancouverdesign.com/wp-content/uploads/2025/11/checkicon.jpg") no-repeat left center;
  background-size: 30px;
  padding-left: 40px;
  margin-bottom: 10px;
}
#frm-getquote{
	background:#FAFAFA;
}
#frm-getquote h3{
	font-weight:bold;
}
#frm-getquote .frm_submit .frm_button_submit{
	    display: inline-block;
    padding: .65rem 2.5rem !important;
    color: #fff;
    font-weight: 500;
    border: 0;
    border-radius: 9999px;
    text-decoration: none;
    background: linear-gradient(180deg, #ff2e2e 0%, #d70b0b 55%, #a70000 100%);
    box-shadow: 0 2px 0 rgba(0, 0, 0, .12), inset 0 0 0 1px rgba(255, 255, 255, .35);
    position: relative;
    transition: filter .15s ease, transform .08s ease;
    width: 100%;
}
#frm-getquote .bttn.white-btn{
	    display: inline-block;
    padding: .65rem 2.5rem !important;
    color: #000;
    font-weight: 500;
    border: 1px solid #000;
    border-radius: 9999px;
    text-decoration: none;
    background: linear-gradient(180deg, #fff 0%, #fff 55%, #fff 100%);
    box-shadow: 0 2px 0 rgba(0, 0, 0, .12), inset 0 0 0 1px rgba(255, 255, 255, .35);
    position: relative;
    transition: filter .15s ease, transform .08s ease;
    width: 100%;
	font-size:14px;
}
#frm_field_12_container{
	margin-bottom: 0px;
}
/*  site-footer*/
.site-footer{background:#e10600;color:#fff}
.site-footer a{color:#fff}
.footer-heading{font-weight:600;font-size:28px;display:inline-block;border-bottom:2px solid rgba(255,255,255,.35);padding-bottom:.25rem}
.footer-input{border-bottom:2px solid rgba(255,255,255,.5);padding:.5rem 0}
.footer-input input{flex:1;border:0;background:transparent;color:#fff;outline:0}
.footer-input input::placeholder{color:rgba(255,255,255,.75)}
.footer-social a{display:inline-flex;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.15);align-items:center;justify-content:center;text-decoration:none}
.footer-menu li{margin:.4rem 0}
.footer-menu a{text-decoration:none}
.footer-menu a:hover{text-decoration:underline}
.footer-contact a{text-decoration:none}
.footer-menu .red-btn{
	display:none;
}
.footer-heading-subscribe{
	font-size: 24px;
}
.footer-subscribe{
	max-width: 400px;
}

/* Contact hero */
.contact-hero { min-height: 45vh; }
.contact-hero__bg{
  position:absolute; inset:0; background-size:cover; background-position:center;
}
.contact-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .1), rgba(0, 0, 0, .4));
}
.contact-hero .container{ position:relative; z-index:2; }

/* force white text for all editor content in the banner */
.contact-hero .banner-content, 
.contact-hero .banner-content * { color:#fff !important; }

/* tidy spacing */
.contact-hero .banner-content > *:first-child{ margin-top:0; }
.contact-hero .banner-content p {
    margin-bottom: 1rem;
    line-height: 1.6;
    max-width: 600px;
}
.contact-hero .banner-content h1{ font-weight:800; margin:.5rem 0 1rem; }
#frm-contact h3{
	font-weight:bold;
}
#frm-contact .frm_submit .frm_button_submit{
	    display: inline-block;
    padding: .65rem 2.5rem !important;
    color: #fff;
    font-weight: 500;
    border: 0;
    border-radius: 9999px;
    text-decoration: none;
    background: linear-gradient(180deg, #ff2e2e 0%, #d70b0b 55%, #a70000 100%);
    box-shadow: 0 2px 0 rgba(0, 0, 0, .12), inset 0 0 0 1px rgba(255, 255, 255, .35);
    position: relative;
    transition: filter .15s ease, transform .08s ease;
    width: 100%;
}
#frm-contact .with_frm_style .frm_primary_label {
    font-weight: 500;
    color: #000;
}

#frm-contact .with_frm_style input[type=text], 
#frm-contact .with_frm_style input[type=password],
#frm-contact .with_frm_style input[type=email],
#frm-contact .with_frm_style input[type=number],
#frm-contact .with_frm_style input[type=url],
#frm-contact .with_frm_style input[type=tel], 
#frm-contact .with_frm_style input[type=search], 
#frm-contact .with_frm_style select,
 #frm-contact .with_frm_style textarea{

    border: 0px !important;
    border-bottom: 1px solid gray !important;
    border-radius: 0px !important;
    padding: 5px 0px !important;
}

@media (max-width: 991px) {
	.navbar-collapse {
		flex-basis: 100%;
		flex-grow: 1;
		align-items: center;
		padding: 20px;
		text-align: center;
		border-top: 1px solid gray;
		margin-top: 20px;
		position: absolute;
		z-index: 9999;
		width: 100%;
		left: 0px;
		background: #fff;
		top: 50px;
	}
	 .site-header img{
		 width: 250px;
		height: auto;
	 }
	 .footer-heading {
		font-size: 24px;
	}
}
@media (max-width: 767px) {
	 .site-header img{
		 width: 250px;
		height: auto;
	 }
	 .carousel-caption {
		          left: 40px !important;
        bottom: 20% !important;
    }
	}
	.carousel-item h1 {
		font-size: 36px;
	}
	.footer-heading {
		font-size: 24px;
	}
	.carousel-item p {
		font-size: 20px;
		max-width: 600px;
		font-weight: 400;
	}
}