* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        :root {
            --primary-yellow: #ffdf00;
            --primary-red: #ff0505;
            --dark-bg: #0a0a0a;
            --light-gray: #f8f9fa;
            --text-dark: #1a1a1a;
            --text-gray: #666;
        }
        
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
            line-height: 1.6;
            color: var(--text-dark);
            overflow-x: hidden;
			min-width:370px;
        }
        

        
        /* Hero Section */
        .hero {
            background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 30%)), url('https://www.sos-tyres.co.uk/img/vanandtyre1.webp');
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
            min-height: 85vh;
            display: flex;
            align-items: center;
            position: relative;
			background-position-y: -5px;
        }
        
        .hero::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
        }
        
        .hero-content {
            max-width: 1400px;
            margin: 0 auto;
            padding: 60px 10px;
            position: relative;
            z-index: 2;
        }
		
        .h1-top {color: #ffffff; padding-left: 41px; font-size: 36px; letter-spacing: 10px; line-height: 1.5;}
		.h1-middle {font-size: 6vw; display: block; letter-spacing: 4px; position: relative; top: -10px; text-align: center;}
		.h1-bottom {color: white; padding-left: 13px; font-size: 27px; position: relative; padding-right: 204px; display: block; text-align: right; bottom: 5px; letter-spacing: 4px;}
		
        .hero h1 {
            font-size: 58px;
            font-weight: 900;
            color: white;
            line-height: 1.2;
            margin-bottom: 20px;
            text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.8);
        }
        
        .hero h1 .highlight {
            background: linear-gradient(135deg, var(--primary-yellow), var(--primary-red));
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        
        .hero-subtitle {
            font-size: 24px;
            color: white;
            margin-bottom: 40px;
            text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.7);
        }
        
        /* Tyre Search Form */
        .tyre-search-form {
            background: rgb(0 0 0 / 59%);
            backdrop-filter: blur(10px);
            padding: 35px;
            border-radius: 20px;
            box-shadow: 0 15px 50px rgba(0, 0, 0, 0.4);
            max-width: 900px;
            margin-top: 30px;
        }
        
        .form-title {
            font-size: 26px;
            font-weight: 700;
            margin-bottom: 25px;
            color: var(--light-gray);
        }
        
        .form-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            gap: 15px;
            margin-bottom: 20px;
        }
        
        .form-group {
            display: flex;
            flex-direction: column;
        }
        
        .form-group label {
            font-weight: 600;
            margin-bottom: 8px;
            color: var(--light-gray);
            font-size: 14px;
        }
        
        .form-group input, .form-group select {
            padding: 14px 16px;
            border: 2px solid #e0e0e0;
            border-radius: 10px;
            font-size: 15px;
            transition: all 0.3s ease;
            background: white;
        }
        
        .form-group input:focus, .form-group select:focus {
            outline: none;
            border-color: var(--primary-yellow);
            box-shadow: 0 0 0 3px rgba(255, 223, 0, 0.1);
        }
        
        .search-btn {
			background: linear-gradient(135deg, #00287b, #192039);
			color: #ffffff;
			font-weight: 700;
			font-size: 18px;
			padding: 16px 40px;
			border: none;
			border-radius: 12px;
			cursor: pointer;
			transition: all 0.3s ease;
			width: 100%;	
        }
        
        .search-btn:hover {
            transform: translateY(-2px);
        }
        
        /* Section Styles */
        section {
            padding: 80px 40px;
        }
        
        .container {
            max-width: 1400px;
            margin: 0 auto;
        }
        
        .section-title {
            font-size: 36px;
            font-weight: 800;
            text-align: center;
            margin-bottom: 50px;
            color: var(--light-gray);
            position: relative;
            padding-bottom: 20px;
        }
        
        .section-title::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100px;
            height: 4px;
            background: linear-gradient(to right, var(--primary-yellow), var(--primary-red));
        }
        
        /* Why Choose Us */
        .why-choose {
            background: var(--light-gray);
        }
        
        .benefits-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
            gap: 30px;
            margin-top: 40px;
        }
        
		.benefit-card.full-width {
			grid-column: 1 / -1; /* Makes it span the entire row */
			text-align: center;
		}


		
        .benefit-card {
            background: white;
            padding: 35px;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
            transition: all 0.3s ease;
        }
        
        .benefit-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
        }
        
        .benefit-icon {
            width: 60px;
            height: 60px;
            background: linear-gradient(135deg, #0054ff, #192039);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 20px;
            font-size: 28px;
        }
        
        .benefit-card h3 {
            font-size: 22px;
            margin-bottom: 15px;
            color: var(--text-dark);
        }
        
        .benefit-card p {
            color: var(--text-gray);
            line-height: 1.7;
        }
        
        /* Tyre Repairs Section */
        .tyre-repairs {
            background: linear-gradient(135deg, var(--dark-bg), #1a1a1a);
            color: white;
        }
        
        .repairs-content {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 60px;
            align-items: center;
        }
        
        .repairs-text h2 {
            font-size: 38px;
            margin-bottom: 25px;
            color: white;
        }
        
        .repairs-text p {
            font-size: 17px;
            line-height: 1.8;
            margin-bottom: 20px;
            color: #ddd;
        }
        
        .guarantee-badge {
            border: 2px solid var(--primary-yellow);
            padding: 20px;
            border-radius: 12px;
            margin: 30px 0;
        }
        
        .guarantee-badge h3 {
            color: var(--primary-yellow);
            font-size: 20px;
            margin-bottom: 10px;
        }
        
        .cta-btn {
            display: inline-block;
			background-color: #ffffff;
			color: black;
			padding: 16px 40px;
			border-radius: 50px;
			text-decoration: none;
			font-weight: 700;
			font-size: 18px;
        }
        
        .cta-btn:hover {
            transform: translateY(-3px);

        }
        
        .repairs-image {
            position: relative;
			margin:auto;
        }
        
      
        
        
        /* Services Section */
        .services-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
            gap: 30px;
        }
        
        .service-card {
            background: white;
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
            transition: all 0.3s ease;
            border-top: 4px solid transparent;
        }
        
        .service-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
            border-top: 4px solid var(--primary-yellow);
        }
        
        .service-icon {
            width: 80px;
            height: 80px;
            background: linear-gradient(135deg, #0054ff, #192039);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 30px auto 20px;
            font-size: 36px;
        }
        
        .service-card h3 {
            font-size: 22px;
            text-align: center;
            padding: 0 20px;
            margin-bottom: 15px;
        }
        
        .service-card p {
            color: var(--text-gray);
            padding: 0 25px 30px;
            text-align: center;
            line-height: 1.7;
        }
        
        /* County Coverage Section */
        .county-coverage {
            padding: 72px 0;
            background: var(--light-gray);
        }

        .county-heading {
            max-width: 850px;
            margin: 0 auto 38px;
            text-align: center;
        }

        .county-eyebrow {
            display: inline-block;
            margin-bottom: 8px;
            color: var(--primary-red);
            font-size: 13px;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .county-heading .section-title {
            margin-bottom: 12px;
            color: var(--text-dark);
        }

        .county-heading p {
            margin: 0;
            color: var(--text-gray);
            font-size: 17px;
            line-height: 1.7;
        }

        .county-grid {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            gap: 16px;
        }

        .county-card {
            display: flex;
            flex-direction: column;
            min-height: 270px;
            padding: 24px 22px 20px;
            border: 1px solid #e2e7ec;
            border-top: 4px solid var(--primary-red);
            border-radius: 14px;
            background: #fff;
            box-shadow: 0 5px 18px rgba(0,0,0,.06);
            transition: transform .2s ease, box-shadow .2s ease;
        }

        .county-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 10px 26px rgba(0,0,0,.10);
        }

        .county-card-top {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 16px;
        }

        .county-pin {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            border-radius: 50%;
            background: #fff1f0;
            color: var(--primary-red);
            font-size: 24px;
            font-weight: 900;
        }

        .county-region {
            display: block;
            margin-bottom: 2px;
            color: var(--text-gray);
            font-size: 10px;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .county-card h3 {
            margin: 0;
            color: var(--text-dark);
            font-size: 19px;
            line-height: 1.2;
        }

        .county-card p {
            margin: 0 0 20px;
            color: var(--text-gray);
            font-size: 13px;
            line-height: 1.65;
        }

        .county-link {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-top: auto;
            padding-top: 15px;
            border-top: 1px solid #edf0f3;
            color: var(--primary-red);
            font-size: 12px;
            font-weight: 800;
            text-decoration: none;
        }

        .county-link span {
            font-size: 18px;
            line-height: 1;
            transition: transform .2s ease;
        }

        .county-link:hover span {
            transform: translateX(4px);
        }

        .county-postcode-cta {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 22px;
            margin-top: 26px;
            padding: 20px 24px;
            border-radius: 14px;
            background: var(--dark-bg);
            color: #fff;
        }

        .county-postcode-cta strong,
        .county-postcode-cta span {
            display: block;
        }

        .county-postcode-cta strong {
            margin-bottom: 4px;
            font-size: 17px;
        }

        .county-postcode-cta span {
            color: #d8dee6;
            font-size: 13px;
        }

        .county-check-button {
            flex: 0 0 auto;
            padding: 12px 18px;
            border-radius: 8px;
            background: var(--primary-red);
            color: #fff;
            font-size: 12px;
            font-weight: 800;
            text-decoration: none;
        }

        @media (max-width: 1100px) {
            .county-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 650px) {
            .county-coverage {
                padding: 50px 0;
            }

            .county-heading p {
                font-size: 15px;
            }

            .county-grid {
                grid-template-columns: 1fr;
                gap: 12px;
            }

            .county-card {
                min-height: 0;
                padding: 20px;
            }

            .county-postcode-cta {
                align-items: stretch;
                flex-direction: column;
                text-align: center;
            }

            .county-check-button {
                text-align: center;
            }
        }

        /* Map Section */
        .map-section {
            padding: 0;
            background: var(--dark-bg);
        }
        
        .map-section iframe {
            display: block;
            width: 100%;
        }
        
        /* Hours Section */
        .hours-section {
            background: linear-gradient(135deg, var(--dark-bg), #1a1a1a);
            color: white;
            text-align: center;
        }
        
        .hours-content {
            margin: 0 auto;
        }
        
        .hours-grid {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            gap: 30px;
            margin-top: 40px;
        }
        
        .hours-card {
            background: rgba(255, 255, 255, 0.05);
            padding: 30px;
            border-radius: 15px;
            border: 2px solid rgba(255, 223, 0, 0.2);
        }
        
        .hours-card h3 {
            font-size: 20px;
            color: var(--primary-yellow);
            margin-bottom: 15px;
        }
        
        .hours-card p {
            font-size: 18px;
            color: white;
        }
        
        /* Reviews Section */
        .reviews {
            background: var(--light-gray);
        }
        
        .reviews-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 30px;
        }
        
        .review-card {
            background: white;
            padding: 30px;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
        }
        
        .stars {
            color: var(--primary-yellow);
            font-size: 20px;
            margin-bottom: 15px;
        }
        
        .review-text {
            color: var(--text-gray);
            font-style: italic;
            margin-bottom: 20px;
            line-height: 1.7;
        }
        
        .reviewer {
            font-weight: 700;
            color: var(--text-dark);
        }
        
        /* Footer Icons */
        .fbook {
            width: 42px;
            height: 42px;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23ffdf00" viewBox="0 0 24 24"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>') no-repeat center;
            background-size: contain;
            transition: transform 0.3s ease;
        }
        
        .fbook:hover {
            transform: scale(1.1);
        }
        
        .X-icon {
            width: 42px;
            height: 42px;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23ffdf00" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>') no-repeat center;
            background-size: contain;
            transition: transform 0.3s ease;
        }
        
        .X-icon:hover {
            transform: scale(1.1);
        }
        
        .youtube {
            width: 42px;
            height: 42px;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23ffdf00" viewBox="0 0 24 24"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>') no-repeat center;
            background-size: contain;
            transition: transform 0.3s ease;
        }
        
        .youtube:hover {
            transform: scale(1.1);
        }
        
        .whatsApp {
            width: 42px;
            height: 42px;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23ffdf00" viewBox="0 0 24 24"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z"/></svg>') no-repeat center;
            background-size: contain;
            transition: transform 0.3s ease;
        }
        
        .whatsApp:hover {
            transform: scale(1.1);
        }
		
		/* ************************************************************* TABLET ********************************************************/
        
        /* Responsive Design */
        @media (max-width: 968px) {
			
			.hero{
				background-position-x: -140px;
			}
            .nav-links {
                display: none;
            }
            
            .mobile-toggle {
                display: flex;
            }
            
            .nav-links.active {
                display: flex;
                flex-direction: column;
                position: absolute;
                top: 90px;
                left: 0;
                right: 0;
                background: rgba(10, 10, 10, 0.98);
                padding: 20px;
                gap: 20px;
            }
            
            .hero h1 {
                font-size: 38px;
            }
            
            .hero-subtitle {
                font-size: 18px;
            }
            
            .form-grid {
                grid-template-columns: 1fr;
            }
            
            .repairs-content {
                grid-template-columns: 1fr;
            }
            
          
            .hours-grid {
                grid-template-columns: 1fr;
            }
			
			.h1-bottom {padding-right:unset; text-align:center; font-size:4.5vw;}
			.h1-middle {font-size:3.5em;}
        }
		
		@media (max-width: 760px) {
				
			
			
		}
		
        /* ***************************************************************************** MOBILE **************************************************************/
        @media (max-width: 640px) {
            nav {
                padding: 15px 20px;
				min-width:370px;
            }
            
			.hero{
				background-position-x: -199px;
				min-width:360px;
			}
			.hero-content{
				padding: 10px 10px;
			}
			
            .logo img {
                height: 50px;
            }
            
            section {
                padding: 60px 10px;
            }
            
            .hero h1 {
                font-size: 32px;
            }
            
            .section-title {
                font-size: 22px;
            }
            
            .tyre-search-form {
                padding: 25px;
            }
			
			.h1-top{font-size: 7.5vw; line-height: 1.5; text-align: center; display: block; padding-left:unset; margin-bottom:8px;}
			.h1-bottom {padding-right: unset; text-align: center; font-size: 5.5vw; margin-top: 8px;}
			
	       .cta-btn {
            display: flex;
		   }
        }

/* Shared footer */
.site-footer{width:100%;padding-bottom:15px;background:#000;border-top:3px solid;border-image:linear-gradient(to right,#ffdf00,#ff0505) 1 0 0 0}
.site-footer-social{height:68px;padding:15px 0 10px;display:flex;align-items:center;justify-content:center;gap:20px}
.site-footer-copy{text-align:center;color:#888;font-size:16px}

/* Tyre search validation modal */
.search-modal{position:fixed;inset:0;z-index:3000;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.72)}
.search-modal.is-open{display:flex}.search-modal-card{width:min(520px,100%);padding:28px;border-radius:18px;background:#101722;color:#fff;box-shadow:0 24px 70px rgba(0,0,0,.45);text-align:center;border:1px solid rgba(255,255,255,.12)}
.search-modal-icon{width:58px;height:58px;margin:0 auto 13px;border-radius:50%;display:grid;place-items:center;background:#172a47;color:#ffdf00;font-size:28px;font-weight:900}.search-modal-card h3{margin:0 0 9px;font-size:25px}.search-modal-card p{margin:0 0 18px;color:#d7dee8;line-height:1.6}.search-modal-card strong{color:#ffdf00}.search-modal-close{border:0;border-radius:10px;padding:12px 22px;background:#ffdf00;color:#111;font-weight:900;cursor:pointer}.search-status{min-height:22px;margin-top:8px;color:#666;font-size:13px}.search-status.is-checking{color:#1c5fa8}


/* Homepage tyre search tabs / registration search */
.tyre-search-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin:0 0 22px;
  padding:5px;
  border-radius:12px;
  background:rgba(255,255,255,.10);
}
.tyre-search-tab{
  min-height:46px;
  padding:9px 14px;
  border:1px solid transparent;
  border-radius:9px;
  background:transparent;
  color:#fff;
  font:inherit;
  font-size:15px;
  font-weight:800;
  cursor:pointer;
}
.tyre-search-tab.is-active{
  border-color:rgba(255,223,0,.55);
  background:var(--primary-yellow);
  color:#111;
  box-shadow:0 5px 15px rgba(0,0,0,.18);
}
.tyre-search-tab-panel{display:none}
.tyre-search-tab-panel.is-active{display:block}
.reg-search-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
}
.registration-search-input{
  text-transform:uppercase;
  letter-spacing:1.5px;
  font-weight:900!important;
}
.reg-search-help{
  margin:13px 0 5px;
  color:rgba(255,255,255,.78);
  font-size:13px;
  line-height:1.55;
}
.vehicle-search-modal-card{
  position:relative;
  width:min(620px,100%);
}
.vehicle-modal-x{
  position:absolute;
  top:10px;
  right:12px;
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  background:rgba(255,255,255,.06);
  color:#fff;
  cursor:pointer;
  font-size:25px;
  line-height:1;
}
.vehicle-modal-message{color:#d7dee8;line-height:1.55}
.vehicle-confirm-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  margin:4px 0 16px;
  padding:15px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:12px;
  background:#172231;
}
.vehicle-confirm-reg{
  color:var(--primary-yellow);
  font-size:24px;
  font-weight:900;
  letter-spacing:1.3px;
}
.vehicle-confirm-card strong{color:#fff;font-size:18px}
.vehicle-confirm-colour{
  margin-top:3px;
  color:#aeb9c8;
  font-size:12px;
  text-transform:capitalize;
}
.vehicle-modal-actions{
  display:flex;
  justify-content:center;
  gap:9px;
  flex-wrap:wrap;
  margin-top:18px;
}
.vehicle-primary-action,
.vehicle-secondary-action{
  min-height:44px;
  padding:11px 18px;
  border-radius:9px;
  font:inherit;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
  text-decoration:none;
}
.vehicle-primary-action{
  border:0;
  background:var(--primary-yellow);
  color:#111;
}
.vehicle-secondary-action{
  border:1px solid rgba(255,255,255,.25);
  background:transparent;
  color:#fff;
}
.trusted-size-intro{
  margin:0 0 13px;
  color:#d7dee8;
  font-size:13px;
}
.trusted-size-list{
  display:grid;
  gap:8px;
}
.trusted-size-option{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px solid rgba(255,223,0,.35);
  border-radius:10px;
  background:#172231;
  color:#fff;
  text-align:left;
  text-decoration:none;
}
.trusted-size-option:hover{border-color:var(--primary-yellow);background:#1c2b3f}
.trusted-size-option span,
.trusted-size-option strong,
.trusted-size-option small{display:block}
.trusted-size-option strong{color:#fff;font-size:18px}
.trusted-size-option small{margin-top:2px;color:#aeb9c8;font-size:11px}
.trusted-size-option>b{
  color:var(--primary-yellow);
  font-size:12px;
  white-space:nowrap;
}
.physical-check-warning{
  padding:14px;
  border:1px solid rgba(255,193,7,.48);
  border-radius:11px;
  background:#2a2514;
  text-align:left;
}
.physical-check-warning>strong{
  display:block;
  color:#ffd84d;
  font-size:15px;
}
.physical-check-warning p{
  margin:9px 0 0;
  color:#f0ead4;
  font-size:13px;
}
.physical-check-warning .do-not-lookup{
  color:#fff;
  font-weight:900;
}
.tyre-size-example{
  display:block;
  margin-top:11px;
  color:#cbd4df;
  font-size:12px;
}
@media(max-width:650px){
  .reg-search-grid{grid-template-columns:1fr}
  .tyre-search-tab{font-size:13px;padding:8px}
  .vehicle-modal-actions{display:grid;grid-template-columns:1fr}
  .vehicle-primary-action,.vehicle-secondary-action{width:100%}
  .trusted-size-option{align-items:flex-start;flex-direction:column}
}


/*google map on homepage styles

  /* Make map taller on mobile */
    #sos-map{
      width:100%;
      height:500px;           /* default desktop/tablet */
      border-radius:12px;
      overflow:hidden;
    }
    @media (max-width: 679px){
      #sos-map{
        height:70vh;          /* use viewport height on phones */
        min-height:500px;     /* ensures it never feels tiny */
      }
    }

    /* Bigger, mobile-friendly info window text */
    .sos-infowin{
      font-family: Arial, sans-serif;
      font-size:16px;
      line-height:1.35;
      padding:6px 2px;
      max-width:260px;
    }
    .sos-infowin strong{
      font-size:18px;
      display:block;
      margin-bottom:4px;
    }

    /* Make the default Google InfoWindow container a bit wider */
    .gm-style .gm-style-iw-c{
      padding:12px !important;
      border-radius:12px !important;
    }
    .gm-style .gm-style-iw-d{
      overflow: auto !important;
    }
	.map-btn{
	  display:inline-block;
	  margin-top:6px;
	  padding:8px 12px;
	  background:#ff7b00;
	  color:#fff;
	  text-decoration:none;
	  font-size:14px;
	  border-radius:6px;
	  font-weight:bold;
	}

	.map-btn:hover{
	  background:#ff9a2b;
	}

/* Homepage county postcode checker */
.county-check-button{
    border:0;
    cursor:pointer;
    font-family:inherit;
}

.county-postcode-modal{
    position:fixed;
    inset:0;
    z-index:16000;
    display:none;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:rgba(8,20,36,.72);
    backdrop-filter:blur(3px);
}

.county-postcode-modal.is-open{
    display:flex;
}

.county-postcode-dialog{
    position:relative;
    width:min(520px,100%);
    padding:30px;
    border-radius:18px;
    background:#fff;
    box-shadow:0 24px 70px rgba(0,0,0,.28);
    text-align:center;
}

.county-postcode-close{
    position:absolute;
    top:11px;
    right:13px;
    width:34px;
    height:34px;
    border:0;
    border-radius:50%;
    background:#eef2f6;
    color:#10233e;
    font-size:24px;
    line-height:1;
    cursor:pointer;
}

.county-postcode-icon{
    width:58px;
    height:58px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 12px;
    border-radius:50%;
    background:#fff1f0;
    color:var(--primary-red);
    font-size:31px;
    font-weight:900;
}

.county-postcode-dialog h2{
    margin:0 0 8px;
    color:var(--text-dark);
    font-size:24px;
}

.county-postcode-dialog>p{
    max-width:420px;
    margin:0 auto 20px;
    color:var(--text-gray);
    font-size:13px;
    line-height:1.55;
}

#countyPostcodeForm{
    text-align:left;
}

#countyPostcodeForm label{
    display:block;
    margin-bottom:6px;
    color:var(--text-dark);
    font-size:11px;
    font-weight:800;
}

.county-postcode-input-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
}

.county-postcode-input-row input{
    min-width:0;
    height:46px;
    padding:0 13px;
    border:1px solid #ced7e1;
    border-radius:9px;
    color:#10233e;
    font:inherit;
    font-size:15px;
    font-weight:700;
    text-transform:uppercase;
    outline:none;
}

.county-postcode-input-row input:focus{
    border-color:var(--primary-red);
    box-shadow:0 0 0 3px rgba(220,53,46,.10);
}

.county-postcode-input-row button,
.county-postcode-use{
    min-height:46px;
    padding:0 16px;
    border:0;
    border-radius:9px;
    background:var(--primary-red);
    color:#fff;
    font-family:inherit;
    font-size:11px;
    font-weight:800;
    cursor:pointer;
}

.county-postcode-input-row button:disabled{
    cursor:wait;
    opacity:.65;
}

.county-postcode-result{
    margin-top:14px;
    padding:12px 14px;
    border-radius:10px;
    font-size:12px;
    line-height:1.55;
    text-align:left;
}

.county-postcode-result.is-covered{
    border:1px solid #a9dcc0;
    background:#ecf8f1;
    color:#126a43;
}

.county-postcode-result.is-uncovered,
.county-postcode-result.is-error{
    border:1px solid #efc0bc;
    background:#fff1f0;
    color:#9f2922;
}

.county-postcode-result strong{
    color:inherit;
}

.county-postcode-actions{
    margin-top:10px;
}

.county-postcode-use{
    width:100%;
    background:#10233e;
}

.county-postcode-help{
    margin-top:16px;
    color:var(--text-gray);
    font-size:10px;
}

.county-postcode-help a{
    color:var(--primary-red);
    font-weight:800;
    text-decoration:none;
}

@media(max-width:560px){
    .county-postcode-dialog{
        padding:27px 18px 20px;
    }

    .county-postcode-input-row{
        grid-template-columns:1fr;
    }

    .county-postcode-input-row button{
        width:100%;
    }
}