/** Shopify CDN: Minification failed

Line 39:0 All "@import" rules must come first

**/
/* ============================================
   LANDING PAGE OVERRIDES
   Add class "landing-page" to the page wrapper
   to enable full-width sections
   ============================================ */

/* NUCLEAR OVERRIDE - Force full width on landing pages */
.landing-page,
.landing-page.cp-landing {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  overflow-x: hidden !important;
}

/* Override ANY parent containers */
.shopify-section:has(.landing-page),
.main-content:has(.landing-page),
main:has(.landing-page),
#MainContent:has(.landing-page),
.page-width:has(.landing-page) {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ============================================
   PATCHES R US - LANDING PAGES CSS
   ============================================ */

/* Google Font */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* ============================================
   GLOBAL LANDING PAGE OVERRIDES
   Any page with .landing-page class gets these
   ============================================ */

.landing-page {
  --brand-blue: #75b7e1;
  --brand-pink: #e91e8c;
  --text-dark: #1a1a1a;
  --text-medium: #4a4a4a;
  --text-light: #717171;
  --bg-light: #f8f9fa;
  --bg-white: #ffffff;
  --border-light: #e5e5e5;
}

.landing-page,
.landing-page * {
  box-sizing: border-box;
}

.landing-page {
  font-family: 'Poppins', sans-serif !important;
  color: var(--text-dark);
  line-height: 1.6;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Remove Shopify theme container restrictions */
.landing-page .page-width,
.landing-page .container,
.landing-page .wrapper,
.landing-page [class*="container"],
.landing-page [class*="wrapper"] {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}

/* Hide Shopify's default page title on landing pages */
.landing-page-wrapper .page-header,
.landing-page-wrapper h1.page-title,
.template-page h1.page-title,
.page-template h1.page-title,
h1.page-header__title,
.page-header__title {
  display: none !important;
}

/* ============================================
   LAYOUT UTILITIES
   ============================================ */

.lp-section {
  width: 100% !important;
  padding: 80px 0 !important;
}

.lp-container {
  width: 100% !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 60px !important;
}

/* ============================================
   GRID SYSTEM
   ============================================ */

.lp-grid {
  display: grid !important;
  gap: 30px !important;
  width: 100% !important;
}

.lp-grid--2 {
  grid-template-columns: repeat(2, 1fr) !important;
}

.lp-grid--3 {
  grid-template-columns: repeat(3, 1fr) !important;
}

.lp-grid--4 {
  grid-template-columns: repeat(4, 1fr) !important;
}

.lp-grid--5 {
  grid-template-columns: repeat(5, 1fr) !important;
}

/* ============================================
   BUTTONS
   ============================================ */

.lp-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 32px !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-radius: 50px !important;
  transition: all 0.3s ease !important;
  cursor: pointer !important;
  border: none !important;
  font-family: 'Poppins', sans-serif !important;
}

.lp-btn--blue {
  background-color: #75b7e1 !important;
  color: #ffffff !important;
}

.lp-btn--blue:hover {
  background-color: #5fa8d6 !important;
  transform: translateY(-2px) !important;
  color: #ffffff !important;
}

.lp-btn--pink {
  background-color: #e91e8c !important;
  color: #ffffff !important;
}

.lp-btn--pink:hover {
  background-color: #d11a7d !important;
  transform: translateY(-2px) !important;
  color: #ffffff !important;
}

.lp-btn--white {
  background-color: #ffffff !important;
  color: #75b7e1 !important;
}

.lp-btn--white:hover {
  background-color: #f0f0f0 !important;
  transform: translateY(-2px) !important;
  color: #75b7e1 !important;
}

/* ============================================
   CARDS
   ============================================ */

.lp-card {
  background: var(--bg-white) !important;
  border-radius: 16px !important;
  padding: 35px 30px !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.08) !important;
  transition: all 0.3s ease !important;
}

.lp-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 8px 25px rgba(0,0,0,0.12) !important;
}

/* ============================================
   HERO SECTION
   ============================================ */

.lp-section--hero,
.cp-hero {
  background: linear-gradient(135deg, #75b7e1 0%, #5a9fd4 100%) !important;
  padding: 80px 0 !important;
  color: white !important;
  text-align: center !important;
  width: 100% !important;
}

.cp-hero h1 {
  font-size: 2.8rem !important;
  font-weight: 700 !important;
  margin-bottom: 24px !important;
  color: white !important;
}

.cp-hero-subheading {
  font-size: 1.2rem !important;
  max-width: 900px !important;
  margin: 0 auto 40px !important;
  opacity: 0.95;
  color: white !important;
}

.cp-trust-bullets {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  max-width: 750px !important;
  margin: 0 auto 40px !important;
  text-align: left !important;
}

.cp-trust-bullet {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  color: white !important;
}

.cp-trust-bullet svg {
  width: 22px !important;
  height: 22px !important;
  flex-shrink: 0 !important;
  stroke: white !important;
}

.cp-hero-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 15px !important;
  margin-bottom: 20px !important;
}

.cp-hero-microcopy {
  font-size: 0.9rem !important;
  opacity: 0.85;
  font-style: italic !important;
  color: white !important;
}

/* ============================================
   PATCH TYPES SECTION
   ============================================ */

.cp-patch-types {
  padding: 80px 40px !important;
  background-color: var(--bg-light) !important;
  width: 100% !important;
}

.cp-patch-types .lp-container {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

.cp-patch-types .lp-grid {
  justify-content: center !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.cp-section-header {
  text-align: center !important;
  margin-bottom: 50px !important;
}

.cp-section-title {
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  margin-bottom: 15px !important;
  color: var(--text-dark) !important;
}

.cp-section-intro {
  font-size: 1.1rem !important;
  color: var(--text-medium) !important;
  max-width: 800px !important;
  margin: 0 auto !important;
}

/* Tiles */
.cp-tile {
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
}

.cp-tile-icon {
  width: 80px !important;
  height: 80px !important;
  margin: 0 auto 20px !important;
  background: linear-gradient(135deg, #75b7e1 0%, #e91e8c 100%) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cp-tile-icon svg {
  width: 40px !important;
  height: 40px !important;
  stroke: white !important;
  fill: none !important;
  stroke-width: 2 !important;
}

.cp-tile h3 {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  margin-bottom: 12px !important;
  color: var(--text-dark) !important;
}

.cp-tile p {
  font-size: 1rem !important;
  color: var(--text-light) !important;
  margin-bottom: 20px !important;
  flex-grow: 1 !important;
}

.cp-tile .lp-btn {
  padding: 12px 24px !important;
  font-size: 0.95rem !important;
  width: 100% !important;
}

/* Highlighted tile (pink) */
.cp-tile-highlight {
  background: linear-gradient(135deg, #e91e8c 0%, #c4167a 100%) !important;
}

.cp-tile-highlight h3,
.cp-tile-highlight p {
  color: white !important;
}

.cp-tile-highlight .cp-tile-icon {
  background: rgba(255,255,255,0.2) !important;
}

.cp-tile-highlight .lp-btn {
  background-color: #ffffff !important;
  color: #e91e8c !important;
}

.cp-tile-highlight .lp-btn:hover {
  background-color: #f0f0f0 !important;
  color: #e91e8c !important;
}

/* ============================================
   QUOTE FORM SECTION - NUCLEAR VERSION
   ============================================ */

.landing-page .cp-quote-section,
.cp-landing .cp-quote-section,
section.cp-quote-section {
  padding: 80px 20px !important;
  background-color: #ffffff !important;
  width: 100% !important;
}

.landing-page .cp-quote-wrapper,
.cp-landing .cp-quote-wrapper,
.cp-quote-section .cp-quote-wrapper {
  max-width: 600px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.landing-page .cp-quote-intro,
.cp-landing .cp-quote-intro {
  text-align: center !important;
  margin-bottom: 30px !important;
}

.landing-page .cp-quote-intro p,
.cp-landing .cp-quote-intro p {
  color: #4a4a4a !important;
  font-size: 1rem !important;
}

.landing-page .cp-quote-form,
.cp-landing .cp-quote-form,
form.cp-quote-form {
  background: #f8f9fa !important;
  padding: 30px 35px !important;
  border-radius: 16px !important;
  max-width: 600px !important;
  margin: 0 auto !important;
}

.landing-page .cp-form-row,
.cp-landing .cp-form-row,
.cp-quote-form .cp-form-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 15px !important;
}

.landing-page .cp-form-group,
.cp-landing .cp-form-group,
.cp-quote-form .cp-form-group {
  margin-bottom: 15px !important;
}

.cp-form-group.cp-full-width {
  grid-column: 1 / -1 !important;
}

.landing-page .cp-form-group label,
.cp-landing .cp-form-group label,
.cp-quote-form .cp-form-group label {
  display: block !important;
  font-weight: 500 !important;
  margin-bottom: 6px !important;
  font-size: 0.9rem !important;
  color: #1a1a1a !important;
}

.cp-form-group label .cp-required {
  color: #e91e8c !important;
}

.cp-form-group .cp-helper-text {
  display: block !important;
  font-size: 0.75rem !important;
  color: #717171 !important;
  margin-top: 4px !important;
}

.landing-page .cp-form-group input,
.landing-page .cp-form-group select,
.landing-page .cp-form-group textarea,
.cp-landing .cp-form-group input,
.cp-landing .cp-form-group select,
.cp-landing .cp-form-group textarea,
.cp-quote-form input,
.cp-quote-form select,
.cp-quote-form textarea {
  width: 100% !important;
  padding: 10px 14px !important;
  border: 2px solid #e5e5e5 !important;
  border-radius: 8px !important;
  font-size: 0.95rem !important;
  font-family: 'Poppins', sans-serif !important;
  transition: border-color 0.3s ease !important;
  background-color: #ffffff !important;
  box-sizing: border-box !important;
}

.cp-quote-form input:focus,
.cp-quote-form select:focus,
.cp-quote-form textarea:focus {
  outline: none !important;
  border-color: #75b7e1 !important;
}

.cp-quote-form textarea {
  resize: vertical !important;
  min-height: 80px !important;
}

.landing-page .cp-checkbox-group,
.cp-landing .cp-checkbox-group,
.cp-quote-form .cp-checkbox-group {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
}

.cp-checkbox-item {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  font-size: 0.9rem !important;
}

.cp-checkbox-item input {
  width: 16px !important;
  height: 16px !important;
  accent-color: #75b7e1 !important;
  padding: 0 !important;
}

.landing-page .cp-form-submit,
.cp-landing .cp-form-submit,
.cp-quote-form .cp-form-submit {
  text-align: center !important;
  margin-top: 20px !important;
}

.cp-form-submit .lp-btn {
  padding: 14px 50px !important;
  font-size: 1rem !important;
}

.landing-page .cp-form-note,
.cp-landing .cp-form-note,
.cp-quote-form .cp-form-note {
  text-align: center !important;
  margin-top: 15px !important;
  font-size: 0.8rem !important;
  color: #717171 !important;
}

.cp-form-note a {
  color: #75b7e1 !important;
  text-decoration: none !important;
}

.cp-form-note a:hover {
  text-decoration: underline !important;
}
/* ============================================
   HOW IT WORKS SECTION
   ============================================ */

.cp-how-it-works {
  padding: 80px 40px !important;
  background-color: #f8f9fa !important;
  width: 100% !important;
}

.cp-how-it-works .lp-container {
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.cp-how-it-works .cp-section-header {
  text-align: center !important;
  margin-bottom: 50px !important;
}

.cp-how-it-works .cp-section-title {
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  margin-bottom: 15px !important;
  color: #1a1a1a !important;
}

.cp-steps-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 25px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.cp-step {
  text-align: center !important;
  padding: 25px 15px !important;
  background: #ffffff !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}

.cp-step-number {
  width: 50px !important;
  height: 50px !important;
  background: linear-gradient(135deg, #75b7e1 0%, #5a9fd4 100%) !important;
  color: #ffffff !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  margin: 0 auto 15px !important;
}

.cp-step h4 {
  font-size: 1rem !important;
  font-weight: 600 !important;
  margin-bottom: 10px !important;
  color: #1a1a1a !important;
}

.cp-step p {
  font-size: 0.9rem !important;
  color: #717171 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}
/* ============================================
   WHY / BENEFITS SECTION
   ============================================ */

.cp-why-section {
  padding: 80px 40px !important;
  background-color: #ffffff !important;
  width: 100% !important;
}

.cp-benefit-card {
  text-align: center !important;
}

.cp-benefit-icon {
  width: 70px !important;
  height: 70px !important;
  margin: 0 auto 20px !important;
  background: linear-gradient(135deg, #75b7e1 0%, #5a9fd4 100%) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cp-benefit-icon svg {
  width: 35px !important;
  height: 35px !important;
  stroke: white !important;
}

.cp-benefit-card h3 {
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  margin-bottom: 12px !important;
  color: #1a1a1a !important;
}

.cp-benefit-card p {
  font-size: 1rem !important;
  color: #717171 !important;
  line-height: 1.6 !important;
}

/* ============================================
   CUSTOMISATION OPTIONS SECTION
   ============================================ */

.cp-customisation-section {
  padding: 80px 40px !important;
  background-color: #f8f9fa !important;
  width: 100% !important;
}

.cp-option-card {
  text-align: left !important;
}

.cp-option-icon {
  width: 60px !important;
  height: 60px !important;
  margin-bottom: 20px !important;
  background: linear-gradient(135deg, #e91e8c 0%, #c4167a 100%) !important;
  border-radius: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cp-option-icon svg {
  width: 30px !important;
  height: 30px !important;
  stroke: white !important;
}

.cp-option-card h3 {
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  margin-bottom: 12px !important;
  color: #1a1a1a !important;
}

.cp-option-card p {
  font-size: 1rem !important;
  color: #717171 !important;
  line-height: 1.6 !important;
}

.cp-option-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.cp-option-list li {
  padding: 8px 0 !important;
  font-size: 1rem !important;
  color: #717171 !important;
  border-bottom: 1px solid #e5e5e5 !important;
}

.cp-option-list li:last-child {
  border-bottom: none !important;
}

.cp-option-list strong {
  color: #1a1a1a !important;
}

/* ============================================
   PRICING SECTION
   ============================================ */

.cp-pricing-section {
  padding: 80px 40px !important;
  background-color: #ffffff !important;
  width: 100% !important;
}

.cp-pricing-table-wrapper {
  max-width: 800px !important;
  margin: 0 auto 30px !important;
  overflow-x: auto !important;
}

.cp-pricing-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: 'Poppins', sans-serif !important;
}

.cp-pricing-table th,
.cp-pricing-table td {
  padding: 16px 20px !important;
  text-align: left !important;
  border-bottom: 1px solid #e5e5e5 !important;
}

.cp-pricing-table th {
  background: linear-gradient(135deg, #75b7e1 0%, #5a9fd4 100%) !important;
  color: white !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
}

.cp-pricing-table th:first-child {
  border-radius: 10px 0 0 0 !important;
}

.cp-pricing-table th:last-child {
  border-radius: 0 10px 0 0 !important;
}

.cp-pricing-table td {
  font-size: 1rem !important;
  color: #4a4a4a !important;
}

.cp-pricing-table tbody tr:hover {
  background-color: #f8f9fa !important;
}

.cp-pricing-table tbody tr:last-child td:first-child {
  border-radius: 0 0 0 10px !important;
}

.cp-pricing-table tbody tr:last-child td:last-child {
  border-radius: 0 0 10px 0 !important;
}

.cp-pricing-note {
  text-align: center !important;
  font-size: 0.95rem !important;
  color: #717171 !important;
  font-style: italic !important;
  margin-bottom: 40px !important;
}

.cp-moq-info {
  max-width: 600px !important;
  margin: 0 auto !important;
  background: #f8f9fa !important;
  padding: 30px !important;
  border-radius: 16px !important;
  text-align: center !important;
}

.cp-moq-info h3 {
  font-size: 1.3rem !important;
  font-weight: 600 !important;
  margin-bottom: 15px !important;
  color: #1a1a1a !important;
}

.cp-moq-info ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.cp-moq-info li {
  padding: 8px 0 !important;
  font-size: 1rem !important;
  color: #4a4a4a !important;
}

/* ============================================
   GALLERY SECTION
   ============================================ */

.cp-gallery-section {
  padding: 80px 40px !important;
  background-color: #f8f9fa !important;
  width: 100% !important;
}

.cp-gallery-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 20px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

.cp-gallery-item {
  text-align: center !important;
}

.cp-gallery-item img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover !important;
  border-radius: 12px !important;
  margin-bottom: 12px !important;
}

.cp-gallery-placeholder {
  width: 100% !important;
  height: 200px !important;
  background: linear-gradient(135deg, #e5e5e5 0%, #d0d0d0 100%) !important;
  border-radius: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #717171 !important;
  font-size: 0.9rem !important;
  margin-bottom: 12px !important;
}

.cp-gallery-caption {
  font-size: 0.9rem !important;
  color: #4a4a4a !important;
  font-style: italic !important;
}

/* ============================================
   FAQ SECTION
   ============================================ */

.cp-faq-section {
  padding: 80px 40px !important;
  background-color: #ffffff !important;
  width: 100% !important;
}

.cp-faq-section .lp-container {
  max-width: 800px !important;
  margin: 0 auto !important;
}

.cp-faq-list {
  max-width: 800px !important;
  margin: 0 auto !important;
}

.cp-faq-item {
  border-bottom: 1px solid #e5e5e5 !important;
  padding: 25px 0 !important;
}

.cp-faq-item:last-child {
  border-bottom: none !important;
}

.cp-faq-question {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  margin-bottom: 12px !important;
}

.cp-faq-answer {
  font-size: 1rem !important;
  color: #717171 !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}

/* ============================================
   CTA SECTION
   ============================================ */

.cp-cta-section {
  padding: 80px 40px !important;
  background: linear-gradient(135deg, #75b7e1 0%, #5a9fd4 100%) !important;
  width: 100% !important;
  text-align: center !important;
}

.cp-cta-section .lp-container {
  max-width: 800px !important;
  margin: 0 auto !important;
}

.cp-cta-section h2 {
  font-size: 2rem !important;
  font-weight: 700 !important;
  color: white !important;
  margin-bottom: 20px !important;
}

.cp-cta-section > .lp-container > p {
  font-size: 1.1rem !important;
  color: white !important;
  opacity: 0.95 !important;
  margin-bottom: 30px !important;
}

.cp-cta-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 15px !important;
  margin-bottom: 20px !important;
}

.cp-cta-microcopy {
  font-size: 0.9rem !important;
  color: white !important;
  opacity: 0.85 !important;
}

/* ============================================
   TRUST SECTION
   ============================================ */

.cp-trust-section {
  padding: 80px 40px !important;
  background-color: #f8f9fa !important;
  width: 100% !important;
}

.cp-trust-section .lp-container {
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.cp-trust-point {
  text-align: center !important;
  padding: 30px 20px !important;
  background: #ffffff !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}

.cp-trust-icon {
  width: 60px !important;
  height: 60px !important;
  margin: 0 auto 15px !important;
  background: linear-gradient(135deg, #75b7e1 0%, #5a9fd4 100%) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cp-trust-icon svg {
  width: 30px !important;
  height: 30px !important;
  stroke: white !important;
}

.cp-trust-point h3 {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  margin-bottom: 8px !important;
}

.cp-trust-point p {
  font-size: 0.95rem !important;
  color: #717171 !important;
  margin: 0 !important;
}

/* ============================================
   FOOTER NAVIGATION
   ============================================ */

.cp-footer-nav {
  padding: 40px !important;
  background-color: #1a1a1a !important;
  width: 100% !important;
}

.cp-footer-nav .lp-container {
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.cp-footer-links {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 30px !important;
}

.cp-footer-links a {
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
  transition: color 0.3s ease !important;
}

.cp-footer-links a:hover {
  color: #75b7e1 !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1200px) {
  .lp-container {
    padding: 0 40px !important;
  }
  .cp-steps-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .cp-gallery-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .lp-grid--4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 992px) {
  .lp-grid--3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .lp-grid--4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .cp-hero {
    padding: 60px 20px !important;
  }
  .cp-hero h1 {
    font-size: 2rem !important;
  }
  .cp-patch-types,
  .cp-quote-section,
  .cp-how-it-works,
  .cp-why-section,
  .cp-customisation-section,
  .cp-pricing-section,
  .cp-gallery-section,
  .cp-faq-section,
  .cp-cta-section,
  .cp-trust-section {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .cp-form-row {
    grid-template-columns: 1fr !important;
  }
  .cp-quote-form {
    padding: 25px !important;
  }
  .lp-grid--3,
  .lp-grid--2 {
    grid-template-columns: 1fr !important;
  }
  .lp-grid--4 {
    grid-template-columns: 1fr !important;
  }
  .cp-steps-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .cp-gallery-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .lp-container {
    padding: 0 20px !important;
  }
  .cp-cta-section h2 {
    font-size: 1.6rem !important;
  }
  .cp-footer-links {
    flex-direction: column !important;
    align-items: center !important;
    gap: 15px !important;
  }
}

@media (max-width: 480px) {
  .cp-hero h1 {
    font-size: 1.7rem !important;
  }
  .cp-hero-buttons,
  .cp-cta-buttons {
    flex-direction: column !important;
    align-items: center !important;
  }
  .lp-btn {
    width: 100% !important;
    max-width: 280px !important;
  }
  .cp-steps-grid {
    grid-template-columns: 1fr !important;
  }
  .cp-gallery-grid {
    grid-template-columns: 1fr !important;
  }
  .cp-pricing-table th,
  .cp-pricing-table td {
    padding: 12px 10px !important;
    font-size: 0.9rem !important;
  }
}