:root {
--deep-teal: #004b57;
--brand: #004b57;
--electric-blue: #0088cc;
--slate-grey: #4a5568;
--light-bg: #f8f9fa;
--white: #ffffff;
--shadow: 0 4px 15px rgba(0,0,0,0.08);
--transition: all 0.3s ease;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px;}
body { background:var(--white); font-family:'Montserrat',sans-serif; font-weight:400; font-size:1rem; color:#333333; 
       line-height:1.6; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { font-weight:600; line-height:1.2; margin:0 0 .6em; color:var(--deep-teal); letter-spacing:-0.01em; }

h1 { font-size: 1.5rem;} /* Big but thin */
h2 { font-size: 1.25rem; }
h3 { font-size: 1rem; }
h4 { font-size: .875rem; } /* Keep small headers slightly bolder for hierarchy */
h5 { font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.05em; }

/* --- NAVIGATION --- */
.site-header { position: relative; background-color: #0A192F; padding: 1.5rem 2rem; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
         padding: 1rem 5%;  left: 0; width: 100%; display: flex; justify-content: space-between; align-items: center; z-index: 1000;}
.logo img { height: 70px; width: auto; }
.nav-links { list-style: none; display: flex; gap: 1rem; }
.nav-links a { position: relative; text-decoration: none; font-size:.875rem; font-weight: 600; color: var(--white); transition: var(--transition); }
.nav-links a:hover { color: var(--electric-blue); }

.main-logo { height: 70px; width: auto; display: block; }
.logo-link { display: flex; align-items: center; text-decoration: none; }

/* Parent LI needs relative positioning */
.nav-links li { position: relative;}
/* Hide the sub-menu by default */
.sub-menu { position: absolute; top: 100%; left: 0; background-color: #0A192F; min-width: 160px; list-style: none; padding: 0.5rem 0; box-shadow: 0 8px 16px rgba(0,0,0,0.2); display: none; z-index: 1001; }
/* Sub-menu list items */
.sub-menu li { width: 100%;}
.sub-menu li a { padding: 10px 20px; display: block; white-space: nowrap; }
/* Hover Effect: Show the menu */
.has-dropdown:hover .sub-menu { display: block; }
/* Background change on hover for sub-links */
.sub-menu li a:hover { background-color: rgba(255, 255, 255, 0.1); color: var(--electric-blue);}
/* --- HAMBURGER STYLING --- */
.menu-toggle { display: none; flex-direction: column; cursor: pointer; gap: 5px; }
.bar { width: 25px; height: 3px; background-color: var(--white, #fff); transition: 0.3s; }

/* --- MOBILE RESPONSIVENESS (Update your existing Media Query) --- */
@media (max-width: 900px) {
    .site-header { padding: 0.8rem 3%; display: flex; justify-content: space-between; align-items: center;}
/* Reduce the container width */
    .search-container { flex: 0 1 auto; /* Allows it to shrink */ margin-left: 10px; /* Space between search and hamburger */}
    /* Make the input even smaller */
    .search-input { width: 80px; /* Smaller starting width */ padding: 5px 10px; /* Reduced padding */ font-size: 0.75rem;}

     .menu-toggle { margin-left: 10px; display: flex; /* Show hamburger */ z-index: 1002;}
    .nav-links { display: none; flex-direction: column; position: absolute; top: 100%; left: 0; width: 100%; background-color: #0A192F; padding: 2rem 0; text-align: center; box-shadow: 0 10px 10px rgba(0,0,0,0.2); }
    /* Class to show menu when toggled */
    .nav-links.active { display: flex; }
    .nav-links li { width: 100%; padding: 15px 0; }
    /* Sub-menu adjustments for mobile */
    .sub-menu { position: static; background: #112240; width: 100%; display: none; }
    .has-dropdown:hover .sub-menu { display: block; }
}

/* --- HEADER SEARCH BOX --- */
.search-form { display:flex; align-items:center; position:relative; background:#f1f3f5; border-radius:30px; padding:2px 5px; border:1px solid #e2e8f0; transition:var(--transition); }
.search-form:focus-within { background:#fff; border-color:var(--electric-blue); box-shadow:0 0 0 3px rgba(0,136,204,0.1); }
.search-input { background:transparent; border:none; padding:8px 15px; outline:none; width:180px; color:var(--slate-grey); transition:width 0.3s ease; }
.search-submit { background:var(--electric-blue); color:#fff; border:none; width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:var(--transition); margin-left:5px; }
.search-submit:hover { background:var(--deep-teal); transform:scale(1.05); }

/* --- HERO SLIDER (Updated for Multiple Images) --- */
.hero-slider-container { position:relative; width:100%; height:70vh; overflow:hidden; background:#000; z-index: 1; /* Keep this low */}
.hero-slider { width:100%; height:100%; }
.slide { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; transition:opacity 1s ease-in-out; display:flex; align-items:center; padding:0 5%; z-index:1; }
.slide.active { opacity:1; z-index:2; }
.slide img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; object-position:center 20%; z-index:-2; }
.slide::after { content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.4); z-index:-1; }
.hero-content { max-width:650px; color:var(--white); position:relative; z-index:10; }
.hero-content .title { font-size:3.2rem; margin-bottom:0.8rem; line-height:1.1; }
.hero-content p { margin-bottom:2rem; opacity:0.9; }

/* Navigation Dots Styles */
.slider-dots { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); display:flex; gap:10px; z-index:100; }
.dot { width:12px; height:12px; background:rgba(255,255,255,0.4); border-radius:50%; cursor:pointer; transition:var(--transition); }
.dot.active,.dot:hover { background:var(--white); transform:scale(1.2); }
@media (max-width:768px) { .hero-content h1 { font-size:2.2rem; } .hero-content p { font-size:1rem; } }

/* .main-section { max-width: 1200px; margin: 2rem auto; padding: 0 5%;} */
.container { padding: 0.75rem 5%; }
.section-title { margin: 1rem 0; display: flex; font-weight: 600; color: var(--brand); align-items: center;}
.section-header { color: var(--deep-teal); margin-bottom: 1.5rem; }
.category-header { margin-bottom: 1rem; }
/* --- ENHANCED PRODUCT CARD --- */
.product-grid { display:grid; gap:2rem; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); align-items:start; justify-content:start; }
.product-card { background:var(--white); border:1px solid #eef0f2; border-radius:12px; overflow:hidden; transition:transform 0.3s ease,border-color 0.3s ease; display:flex; flex-direction:column; }
.product-card:hover { transform:translateY(-8px); box-shadow:0 12px 30px rgba(0,75,87,0.1); border-color:var(--electric-blue); }

/* Image Area */
.product-image-container { padding:10px; width:100%; height:240px; background:#fdfdfd; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:var(--radius); }
.product-image-container a { width:100%; height:100%; display:block; }
.product-image-container img { width:100%; height:100%; object-fit:cover; display:block; border-radius:12px; }

/* Content Area */
.product-content { padding:1rem; display:flex; flex-direction:column; flex-grow:1;}
.product-rating { display:flex; align-items:center; gap:4px; }
.product-rating .stars { color:#ffc107; font-size:0.75rem; letter-spacing:1px; }
.product-rating .rating-count { color:var(--slate-grey); font-size:0.75rem; opacity:0.7; font-weight:600; }
.empty-star { color:#DDD; }

.product-content h3 { line-height:1; min-height:calc(1em * 2); color:var(--deep-teal); }
.product-content h3 a:hover{ color:var(--electric-blue); }
.product-content a { color: var(--slate-grey); text-decoration:none; }
.product-excerpt {  font-size:0.875rem; color:var(--slate-grey); margin-bottom:.5rem; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 4; 
  -webkit-box-orient: vertical; overflow: hidden; height: calc(1.4em * 4); overflow:hidden; }
.brand-category-tag, .related-row-brand-category { display: block; margin-bottom: .5rem; line-height:1; min-height:calc(1em * 2); font-size:0.65rem; font-weight:600;}
.brand-category-tag .brand::after, .related-row-brand-category .brand::after { content:"|"; margin-left:4px; margin-right:4px; color:var(--slate-grey); }
.brand-category-tag a, .related-row-brand-category a { color:var(--slate-grey); text-decoration: none;}
.brand-category-tag a:hover, .related-row-brand-category a:hover { color:var(--electric-blue); }

/* --- PRODUCT PRICE RATING--- */
.product-price-rating { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom: .5rem; }
.price-box { background:var(--light-bg); padding:6px 10px; border-radius:8px; margin:0; display:flex; align-items:center; gap:4px; }
.price-value { display:block; font-size:1.25rem; font-weight:600; color:var(--deep-teal); }

/* --- BUTTON GROUP CONTAINER --- */
.product-actions { display: flex; gap: 5px; margin-top: 5px; }
/* BASE BUTTON STYLES */
.btn-primary, .btn-secondary { flex:1; /* Makes same width */ padding: 10px 5px; border-radius:12px; font-weight:400; letter-spacing:0.5px; cursor:pointer; transition: var(--transition); display:inline-flex; justify-content:center; align-items:center; }
/* PRIMARY: Electric Blue (Main Action) */
.btn-primary { background-color: var(--electric-blue); color: #ffffff; border: 1px solid var(--electric-blue); }
.btn-primary:hover { background-color:var(--deep-teal); border-color:var(--deep-teal); transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,136,204,0.2); }
/* SECONDARY: Light Theme / Outline (Research Action) */
.btn-secondary { background-color: #ffffff; color: var(--deep-teal); border: 1px solid #ddd;}
.btn-secondary:hover { background: #f8f9fa; border-color: var(--deep-teal); color: var(--electric-blue); transform: translateY(-2px);}
/* Active/Press State */
.btn-primary:active, .btn-secondary:active { transform: translateY(0);}
/* Mobile Tweak: Stack them if the screen is very small */
@media (max-width: 400px) { .product-actions { flex-direction: column; }}

/* --- INTRODUCTION SECTION --- */
.intro-section { background:var(--light-bg); border-bottom:1px solid #eee; } 
.intro-grid { margin-top:20px; display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.intro-text h2 { color:var(--brand); margin-bottom:1.5rem; position:relative; }
.intro-text h2::after { content:''; display:block; width:60px; height:4px; background:var(--electric-blue); margin-top:10px; }
.value-props { display:flex; flex-direction:column; gap:.5rem; }
.prop-item { display:flex; gap:.5rem; align-items:flex-start; }
.prop-icon { background:var(--electric-blue); color:white; width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:50%; flex-shrink:0; font-size:0.8rem; }
.prop-item strong { color:var(--brand); display:block; }
.prop-item p { font-size:0.875rem; margin:0; }
@media (max-width:900px) { .intro-grid { grid-template-columns:1fr; gap:2rem; } }

 /* FOOTER */
.site-footer { margin-top: 10px; padding-top: 10px; background: #0A192F; font-size: .75rem; color: #cbd5e1; }
.site-footer a { color: #e2e8f0; text-decoration: none;}
.site-footer a:hover { color: var(--electric-blue);}
.footer-grid { display: grid; grid-template-columns: 1.5fr 2fr 3fr; gap: 20px; margin: 10px 0 10px 0; }
.footer-company { padding: .2rem 0; display: flex; flex-direction: column; align-items: center;   /* horizontal */
  justify-content: center; /* vertical */ text-align: center;}
.footer-heading { color: #fff; font-size: 1rem; font-weight: 600; margin-bottom: 15px; text-transform: uppercase; letter-spacing: 1px; } 
.footer-contact { display: flex; flex-direction: column; gap: .1rem;}
.footer-item { font-size: .875rem;}
.footer-item strong { color: #94a3b8; margin-right: .4rem;}
.footer-links{ columns:2; column-gap:20px; list-style:none; padding:0; margin:0; }
.footer-links li{ break-inside:avoid; margin-bottom:8px; }
.footer-links-brand{ columns:4; column-gap:20px; list-style:none; padding:0; margin:0; }
.footer-links-brand li{ break-inside:avoid; margin-bottom:8px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.08);}
.footer-bottom-row { display: flex; justify-content: center; padding: .5rem 0; font-size: .85rem; color: #94a3b8;}
.footer-contact { display: flex; flex-direction: column; gap: .1rem;}

@media (max-width: 992px) { .footer-grid { grid-template-columns: 1fr 1fr; }}
@media (max-width: 576px) {.footer-grid { grid-template-columns: 1fr; }}
@media (max-width: 768px) {.footer-bottom { flex-direction: column; gap: 20px; text-align: center; }}
/* END FOOTER */

/* PRODUCT MAIN */
.product-main { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-bottom:2rem; }
.main-image { background:#ffffff; border:1px solid #eee; border-radius:12px; padding:1rem; text-align:center; display:flex; align-items:center; justify-content:center; margin-bottom:1rem; }
#featured-image { max-width:100%; max-height:100%; object-fit:contain; border-radius:12px; cursor: zoom-in;}
.thumb-strip { display:flex; flex-wrap:wrap; gap:5px; overflow-x:auto; padding-bottom:5px; }
.thumb-strip::-webkit-scrollbar { height:4px; }
.thumb-strip::-webkit-scrollbar-thumb { background:#ddd; border-radius:10px; }
.thumb { width:80px; height:80px; border:2px solid #eee; border-radius:8px; cursor:pointer; object-fit:cover; transition:var(--transition); }
.thumb:hover { border-color:var(--electric-blue); }
.thumb.active { border-color:var(--electric-blue); box-shadow:0 2px 8px rgba(0,136,204,0.2); }

.product-details-info { display: flex; flex-direction: column;}
.product-details-info h1 { color:var(--deep-teal); margin:0.5rem 0; }
.price-box-single { background:var(--light-bg); padding:.5rem; border-radius:8px; margin:1rem 0; }
.price-label-single { font-size:0.75rem; display:block; color:#888; }
.price-value-single { display:block; font-size:1.25rem; font-weight:600; color:var(--deep-teal); }
.purchase-actions { display:flex; flex-direction:column; gap:1rem; margin-bottom:1rem; }
.quote-btn { padding:1.2rem; font-size:1.1rem; }
.key-features { list-style:none; border-top:1px solid #eee; padding-top:1.5rem; }
.key-features li { margin-bottom:0.5rem; font-size:0.95rem; }
@media (max-width:850px) { .product-main { grid-template-columns:1fr; } }

/* ---ERROR 404 --- */
.error-page { height:50vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:0 5%; }
.error-code { font-size:10rem; font-weight:600; color:var(--light-bg); line-height:1; position:relative; margin-bottom:-40px; z-index:-1; }
.error-content h1 { color:var(--deep-teal); font-size:2.5rem; margin-bottom:1rem; }
.error-actions { margin-top:2rem; display:flex; gap:1rem; justify-content:center; }
.error-actions a { text-decoration:none; }
@media (max-width:600px) { .error-actions { flex-direction:column; } }

/* --- FIND US ---- */
.find-us-content { display:grid; grid-template-columns:350px 1fr; gap:3rem; }
.location-details { background:var(--light-bg); padding:2.5rem; border-radius:15px; }
.detail-group { margin-bottom:2rem; }
.detail-group h3 { color:var(--electric-blue); font-size:1.1rem; text-transform:uppercase; margin-bottom:0.75rem; letter-spacing:0.5px; }
.hours-list { list-style:none; padding:0; }
.hours-list li { display:flex; justify-content:space-between; font-size:0.95rem; margin-bottom:0.5rem; }
.map-wrapper { border-radius:15px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,0.08); }
@media (max-width:992px) { .find-us-content { grid-template-columns:1fr; } }

/* --- VERTICAL RELATED LIST --- */
.related-sidebar-list { margin-top:1rem; padding-top:1rem; border-top:1px solid #eee; }
.related-sidebar-list h4 { font-size:0.85rem; color:var(--slate-grey); text-transform:uppercase; letter-spacing:1.5px; margin-bottom:1.2rem; }
.related-row { display:flex; align-items:center; text-decoration:none; padding:12px; margin-bottom:10px; background:#fff; border:1px solid #f0f0f0; border-radius:10px; transition:var(--transition); }
.related-row:hover { border-color:var(--electric-blue); background:#fdfdfd; box-shadow:0 4px 12px rgba(0,0,0,0.03); transform:translateX(5px); }
.related-row-thumb { width:60px; height:60px; flex-shrink:0; background:#f8f9fa; border-radius:6px; display:flex; align-items:center; justify-content:center; margin-right:15px; overflow:hidden; }
.related-row-thumb img { max-width:85%; max-height:85%; object-fit:contain; }
.related-row-info { flex-grow:1; display:flex; flex-direction:column; }

.related-row-title { font-size:0.9rem; font-weight:600; color:var(--deep-teal); margin:2px 0; }
.related-row-price { font-size:0.8rem; color:var(--slate-grey); }
.related-row-arrow { color:#ccc; font-size:1.2rem; transition:var(--transition); padding-left:10px; }
.related-row:hover .related-row-arrow { color:var(--electric-blue); }

/* --- BREADCRUMB STYLES --- */
.breadcrumb-container { padding:0.75rem 5%; background:var(--light-bg); border-bottom:1px solid #e5e7eb; }
.breadcrumb-list { display:flex; flex-wrap:wrap; align-items:center; gap:0.5rem; list-style:none; margin:0; padding:0; }
.breadcrumb-item { display:flex; align-items:center; font-size:.75rem; color:var(--slate-grey); }
.breadcrumb-item + .breadcrumb-item::before { content:"›"; margin:0 0.5rem; color:#9ca3af; font-weight:600; }
.breadcrumb-item a { text-decoration:none; color:var(--slate-grey); font-weight:600; transition:var(--transition); position:relative; }
.breadcrumb-item a:hover { color:var(--electric-blue); }
.breadcrumb-item.active { color:var(--deep-teal); font-weight:600; pointer-events:none; }
.breadcrumb-item a::after { content:""; position:absolute; left:0; bottom:-2px; width:0%; height:1px; background:currentColor; transition:var(--transition); }
.breadcrumb-item a:hover::after { width:100%; }
@media (max-width:600px) { .breadcrumb-container { padding:10px 5%; } .breadcrumb-list { font-size:0.75rem; } }

/* --- CATEGORY ICON SHOWCASE CONTAINER --- */
.category-icon-showcase { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px; padding:10px; background-color:#fdfdfd; }
.category-icon-showcase a { text-decoration:none; }
.icon-item { width:100%; height:120px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; background:#ffffff; border:1px solid #eee; border-radius:12px; text-align:center; transition:all 0.3s ease; box-sizing:border-box; overflow:hidden; }
.icon-item:hover { border-color:var(--electric-blue); transform:translateY(-5px); box-shadow:0 5px 15px rgba(0,136,204,0.1); }
.s1-icon { width:50px; height:50px; color:var(--deep-teal); margin-bottom:20px; flex-shrink:0; }
.icon-item:hover .s1-icon { color:var(--electric-blue); }
.icon-label { font-size:0.85rem; font-weight:600; color:var(--deep-teal); text-transform:uppercase; letter-spacing:0.5px; }

/* --- DESCRIPTION --- */
.description a { text-decoration:none; color: var(--slate-grey); }
.description .title { font-weight: 600; border-bottom:1px solid #eee;}
.description h2, .description h3, .description h4 { letter-spacing: 1px; color: var(--deep-teal); margin: 1rem 0 0.5rem;}
.description p { margin-bottom:1rem; }
.description ul, .description ol { padding-left:1.2rem; margin-bottom:1.2rem; }
.description li { margin-bottom:.2rem; position: relative; padding-left: 5px; }

.description table { width:100%; border-collapse:collapse; background:var(--white); border:1px solid #eee; border-radius:8px; overflow:hidden; margin:1.4rem 0; }
.description th { background:var(--light-bg); color:var(--deep-teal); text-align:left; padding:6px 7px; font-weight:600; border-bottom:2px solid #eee; }
.description td { padding:6px 7px; border-bottom:1px solid #eee; }
.description tr:nth-child(even) { background:#fafafa; }
.category-layout { display:grid; grid-template-columns:280px 1fr; gap:40px; margin-top:2rem; }

/* SIDEBAR STYLES */
.category-sidebar h3 { color:var(--deep-teal); margin-bottom:1.5rem; padding-bottom:10px; border-bottom:2px solid var(--light-bg); }
.sidebar-nav { list-style:none; }
.sidebar-nav li { list-style:none; margin-bottom:5px; }
.sidebar-nav li a { display:flex; justify-content:space-between; align-items:center; padding:7px 10px; text-decoration:none; color:var(--slate-grey); border-radius:8px; transition:all 0.3s ease; }
.sidebar-nav li.active a,.sidebar-nav li a:hover { background:var(--light-bg); color:var(--electric-blue); font-weight:700; }
.count { font-size:0.8rem; background:#eee; padding:2px 8px; border-radius:12px; color:#666; }
.sidebar-nav li.active .count { background:var(--electric-blue); color:white; }
@media (max-width:900px) { .category-layout { grid-template-columns:1fr; } .category-sidebar { display:none; } }

/* --- PAGINATION CONTAINER --- */
.pagination-container { margin:4rem 0; display:flex; justify-content:center; }
.pagination-list { display:flex; align-items:center; list-style:none; gap:8px; background:#ffffff; padding:8px 15px; border-radius:50px; border:1px solid #eee; box-shadow:0 4px 15px rgba(0,0,0,0.03); }
.pagination-link { text-decoration:none; color:var(--slate-grey); font-weight:600; font-size:0.9rem; width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:50%; transition:all 0.3s ease; }
.pagination-link.active { background-color:var(--electric-blue); color:#ffffff; box-shadow:0 4px 10px rgba(0,136,204,0.3); }
.pagination-link:hover:not(.active) { background-color:#f0f7ff; color:var(--electric-blue); }
.pagination-link.prev,.pagination-link.next { width:auto; padding:0 20px; border-radius:30px; text-transform:uppercase; letter-spacing:1px; font-size:0.75rem; }
.pagination-link.prev span,.pagination-link.next span { margin:0 5px; }
@media (max-width:480px) { .pagination-link.prev span,.pagination-link.next span { display:none; } .pagination-link.prev,.pagination-link.next { width:40px; padding:0; } }

/* --- SEARCH BOX FOR SEARCH FORM --- */
.search-form-main { display:flex; align-items:center; justify-content:center; margin:40px auto; max-width:600px; width:100%; background:#f1f3f5; border-radius:40px; padding:6px 10px; border:1px solid #e2e8f0; transition:var(--transition); }
.search-form-main:focus-within { background:#fff; border-color:var(--electric-blue); box-shadow:0 0 0 3px rgba(0,136,204,0.1); }
.search-input-main { background:transparent; border:none; outline:none; flex:1; padding:12px 18px; font-size:16px; color:var(--slate-grey); }
.search-input-main:focus { width:100%; }
.search-submit-main { background:var(--electric-blue); color:#fff; border:none; width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:var(--transition); }
.search-submit-main:hover { background:var(--deep-teal); transform:scale(1.05); }
@media (max-width:768px) { .search-form-main { margin:20px; } }

/* --- BRAND GRID --- */
.brand-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:15px; align-items:center; }
.brand-grid a { display:flex; align-items:center; justify-content:center; padding:18px; background:#f8fafc; border-radius:12px; border:1px solid #e2e8f0; transition:var(--transition); }
.brand-grid img { max-width:100%; max-height:40px; object-fit:contain; filter:grayscale(100%) opacity(0.7); transition:var(--transition); }
.brand-grid a:hover { transform:translateY(-4px); box-shadow:0 6px 18px rgba(0,0,0,0.06); border-color:var(--electric-blue); }
.brand-grid a:hover img { filter:grayscale(0%) opacity(1); }
@media (max-width:768px) { .brand-grid { gap:15px; } .brand-grid img { max-height:32px; } }

/* --- CONTACT FORM STYLING --- */
.contact-grid { display:grid; grid-template-columns:1fr 1.5fr; gap:2rem; align-items:start; }
.contact-map { border-radius:15px; overflow:hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.08); border:1px solid #eee; }
@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; }}
.contact-form-container { background:var(--light-bg); padding:1rem; border-radius:12px; }
.contact-form-container h2 {font-size: 1rem; margin-bottom:1rem; }
.main-contact-form { display:flex; flex-direction:column; }
.contact-info-card { background:var(--light-bg); padding:1rem; border-radius:12px; margin-bottom:1rem; }
.contact-info-card h3 { margin-bottom:1rem; color:var(--deep-teal); }
.contact-info-card p { margin-bottom:0.8rem; }
.contact-info-card hr { border:0; border-top:1px solid #cbd5e0; margin:1.5rem 0; }
.support-text { font-style:italic; font-size:0.85rem; color:var(--slate-grey); }
@media (max-width:768px) { .form-row { grid-template-columns:1fr; } }

/* --- MODAL OVERLAY --- */
.modal-overlay { display:none; position:fixed; z-index:2000; top:0; left:0; width:100%; height:100%; background-color:rgba(255,255,255,0.95); backdrop-filter:blur(5px); justify-content:center; align-items:center; }
.modal-content-wrapper { max-width:90%; max-height:90%; display:flex; justify-content:center; align-items:center; }
#modal-image { max-width:100%; max-height:90vh; border-radius:8px; box-shadow:0 10px 40px rgba(0,0,0,0.1); transform:scale(0.9); transition:transform 0.3s ease; }
.close-modal { position:absolute; top:30px; right:40px; color:var(--deep-teal); font-size:50px; font-weight:400; cursor:pointer; transition:var(--transition); line-height:1; }
.close-modal:hover { color:var(--electric-blue); transform:scale(1.1); }
.modal-overlay.active { display:flex; }
.modal-overlay.active #modal-image { transform:scale(1); }
.quote-modal-content { background:var(--white); width:95%; max-width:650px; padding:40px; border-radius:15px; position:relative; box-shadow:0 20px 60px rgba(0,0,0,0.15); animation:slideUp 0.4s ease-out; }
@keyframes slideUp { from { transform:translateY(30px); opacity:0; } to { transform:translateY(0); opacity:1; } }
.quote-header { margin-bottom:5px; /* border-bottom:1px solid #eee;*/ padding-bottom:5px; }
.quote-header h2 { color:var(--deep-teal); margin-bottom:5px; }
.quote-header p {color:var(--slate-grey); }

.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:10px; }
.form-group { display:flex; flex-direction:column; gap:8px; margin-bottom:5px; }
.form-group label { font-weight:600; font-size:0.85rem; color:var(--deep-teal); text-transform:uppercase; }
.form-group input,.form-group select,.form-group textarea { padding:10px 13px; border:1px solid #e2e8f0; border-radius:6px; transition:var(--transition); }
.form-group input:focus,.form-group select:focus,.form-group textarea:focus { outline:none; border-color:var(--electric-blue); box-shadow:0 0 0 3px rgba(0,136,204,0.1); }

.quote-footer { margin-top:10px; text-align:center; }
.submit-quote { width:100%; padding:15px; font-size:1.1rem; cursor:pointer; }
.privacy-note { font-size:0.75rem; color:#999; margin-top:15px; }
@media (max-width:600px) { .form-grid { grid-template-columns:1fr; } .quote-modal-content { padding:25px; } }
.alert-container { margin-bottom: 2rem; animation:slideDown 0.5s ease; }
.alert { padding: 15px 25px; border-radius:8px; font-size:0.875rem; font-weight: 600; display:block; border-left:5px solid; margin-bottom: 10px; }
.alert-success { background-color:#f0fff4; border-color:#38a169; color:#22543d; }
.alert-error { background-color:#fff5f5; border-color:#e53e3e; color:#742a2a; }
@keyframes slideDown { from { opacity:0; transform:translateY(-20px); } to { opacity:1; transform:translateY(0); } }

/* --- CAPTCHA --- */
.captcha-group { background: #f8f9fa; padding: 15px; border-radius: 8px; border: 1px solid #e9ecef; }
.captcha-input-wrapper { display: flex; align-items: center; gap: 15px; }
.captcha-question { font-weight: 700; color: var(--deep-teal); font-size: 1.1rem; white-space: nowrap; }
.captcha-group input { max-width: 120px; }

/* This hides the element visually but keeps it accessible to machines/crawlers */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; }


/* ===== BACK TO TOP ===== */
#backToTop { position:fixed; bottom:30px; right:30px; z-index:99; border:none; outline:none; background:var(--electric-blue); 
             color:#fff; cursor:pointer; padding:8px 12px; border-radius:50%; display:none; transition:0.3s; }
#backToTop:hover { background:var(--deep-teal); transform:scale(1.05); }