/* === FOOTER COMPONENT STYLES === */

/* === FULL-WIDTH FOOTER FIX === */
#site-footer {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    position: relative;
    z-index: 1;
  }
  
  /* === FOOTER BASE === */
  .site-footer {
    background: linear-gradient(130deg, var(--sage) 0%, var(--ivory) 45%, var(--rose) 100%) !important;
    color: var(--forest) !important;
    padding: 3rem 0 0 !important;
    margin: 0 !important;
    width: 100% !important;
    position: relative;
  }
  
  .site-footer__inner {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 1.5rem !important;
  }
  
  /* === MAIN CONTENT GRID === */
  .footer-content {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 3rem !important;
    margin-bottom: 2rem !important;
    align-items: start !important;
  }
  
  /* === BRAND SECTION === */
  .footer-section--brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  
  .footer-logo {
    margin-bottom: 1rem !important;
  }
  
  .footer-logo__img {
    height: 60px !important;
    width: auto !important;
  }
  
  .footer-description {
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
    color: var(--forest) !important;
    margin: 0 0 1.5rem 0 !important;
    max-width: 35ch !important;
  }
  
  /* === CERTIFICATION BADGES === */
  .footer-certifications {
    display: flex !important;
    gap: 0.5rem !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }
  
  .cert-badge {
    display: flex !important;
    align-items: center !important;
    gap: 0.25rem !important;
    background: rgba(141, 198, 63, 0.14) !important;
    border: 1px solid rgba(141, 198, 63, 0.4) !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 15px !important;
    font-size: 0.7rem !important;
    color: var(--forest) !important;
    font-weight: 600 !important;
    transition: background 0.3s, border 0.3s !important;
    white-space: nowrap !important;
  }
  
  .cert-badge:hover {
    background: rgba(141, 198, 63, 0.26) !important;
    border-color: var(--provio-green) !important;
  }
  
  .cert-icon {
    font-size: 1em !important;
  }
  
  /* === FOOTER SECTIONS === */
  .footer-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  
  .footer-title {
    font: 600 1.125rem/1.2 'Poppins', sans-serif !important;
    color: var(--forest) !important;
    margin: 0 0 1.5rem 0 !important;
  }
  
  .footer-links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }
  
  .footer-links li {
    margin-bottom: 0.75rem !important;
  }
  
  .footer-links a {
    color: var(--forest) !important;
    text-decoration: none !important;
    font-size: 0.9rem !important;
    transition: color 0.25s ease !important;
    opacity: 0.8 !important;
  }
  
  .footer-links a:hover {
    color: var(--provio-green) !important;
    opacity: 1 !important;
  }
  
  /* === NEWSLETTER SECTION === */
  .footer-section--newsletter {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  
  .newsletter-description {
    font-size: 0.95rem !important;
    color: var(--forest) !important;
    margin: 0 0 1.5rem 0 !important;
    line-height: 1.5 !important;
    opacity: 0.9 !important;
  }
  
  .newsletter-form {
    width: 100% !important;
    margin-bottom: 1rem !important;
  }
  
  .form-group {
    display: flex !important;
    gap: 0.5rem !important;
    margin-bottom: 1rem !important;
  }
  
  .newsletter-input {
    flex: 1 !important;
    padding: 0.75rem 1rem !important;
    border: 2px solid rgba(141, 198, 63, 0.3) !important;
    border-radius: 50px !important;
    background: rgba(255, 247, 244, 0.8) !important;
    color: var(--forest) !important;
    font-size: 0.9rem !important;
    backdrop-filter: blur(12px) !important;
  }
  
  .newsletter-input::placeholder {
    color: rgba(64, 81, 59, 0.6) !important;
  }
  
  .newsletter-input:focus {
    outline: none !important;
    border-color: var(--provio-green) !important;
    background: rgba(255, 247, 244, 0.9) !important;
  }
  
  .newsletter-btn {
    background: var(--provio-green) !important;
    color: white !important;
    border: none !important;
    padding: 0.75rem 1.25rem !important;
    border-radius: 50px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    white-space: nowrap !important;
  }
  
  .newsletter-btn:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
  }
  
  .newsletter-btn:hover:not(:disabled) {
    background: #78ac33 !important;
    box-shadow: 0 0 0 4px rgba(141, 198, 63, 0.34) !important;
    transform: translateY(-2px) !important;
  }
  
  /* === CHECKBOX STYLING === */
  .checkbox-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 0.5rem !important;
    font-size: 0.8rem !important;
    color: var(--forest) !important;
    cursor: pointer !important;
    opacity: 0.8 !important;
  }
  
  .checkbox-input {
    display: none !important;
  }
  
  .checkbox-custom {
    width: 16px !important;
    height: 16px !important;
    border: 2px solid rgba(141, 198, 63, 0.4) !important;
    border-radius: 3px !important;
    background: rgba(255, 247, 244, 0.6) !important;
    position: relative !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
  }
  
  .checkbox-input:checked + .checkbox-custom::after {
    content: '✓' !important;
    position: absolute !important;
    top: -2px !important;
    left: 2px !important;
    color: var(--provio-green) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
  }
  
  .checkbox-text a {
    color: var(--provio-green) !important;
    text-decoration: underline !important;
  }
  
  /* === NEWSLETTER SUCCESS MESSAGE === */
  .newsletter-success {
    text-align: center !important;
    padding: 2rem 1rem !important;
    background: rgba(141, 198, 63, 0.1) !important;
    border: 2px solid rgba(141, 198, 63, 0.3) !important;
    border-radius: 20px !important;
    margin: 1rem 0 !important;
  }
  
  .newsletter-success .success-icon {
    font-size: 2rem !important;
    color: var(--provio-green) !important;
    margin-bottom: 0.5rem !important;
  }
  
  .newsletter-success h5 {
    color: var(--forest) !important;
    margin: 0 0 0.5rem 0 !important;
    font-size: 1.1rem !important;
  }
  
  .newsletter-success p {
    color: var(--forest) !important;
    margin: 0 !important;
    font-size: 0.9rem !important;
    opacity: 0.9 !important;
  }
  
  /* === NEWSLETTER MESSAGE === */
  .newsletter-message {
    padding: 0.75rem 1rem !important;
    border-radius: 8px !important;
    margin-top: 0.5rem !important;
    font-size: 0.85rem !important;
  }
  
  .newsletter-message--error {
    background: rgba(220, 53, 69, 0.1) !important;
    border: 1px solid rgba(220, 53, 69, 0.3) !important;
    color: #721c24 !important;
  }
  
  .newsletter-message--success {
    background: rgba(141, 198, 63, 0.1) !important;
    border: 1px solid rgba(141, 198, 63, 0.3) !important;
    color: var(--forest) !important;
  }
  
  /* === SECTION DIVIDERS === */
  .section-divider {
    height: 3.5px !important;
    background: white !important;
    margin: 2rem 0 !important;
    border-radius: 2px !important;
  }
  
  /* === FOOTER BOTTOM === */
  .footer-bottom {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 2rem !important;
    padding: 2rem 0 !important;
  }
  
  .payment-methods {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
  }
  
  .payment-label {
    font-size: 0.9rem !important;
    color: var(--forest) !important;
    opacity: 0.8 !important;
  }
  
  .payment-icons {
    display: flex !important;
    gap: 0.5rem !important;
  }
  
  .payment-icon {
    width: 32px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 247, 244, 0.6) !important;
    border-radius: 4px !important;
    font-size: 0.8rem !important;
    backdrop-filter: blur(12px) !important;
  }
  
  .trust-badges {
    display: flex !important;
    gap: 1.5rem !important;
  }
  
  .trust-badge {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    font-size: 0.85rem !important;
    color: var(--forest) !important;
    opacity: 0.8 !important;
  }
  
  .trust-icon {
    font-size: 1em !important;
  }
  
  .trust-text {
    font-size: 0.85rem !important;
    color: var(--forest) !important;
    opacity: 0.8 !important;
  }
  .trust-text .footer-phone { color: inherit !important; text-decoration: none !important; border-bottom: 1px dotted rgba(0,0,0,0.25) !important; padding-bottom: 1px !important; }
  .trust-text .footer-phone:hover { color: var(--provio-green) !important; border-color: var(--provio-green) !important; }
  
  .legal-links {
    display: flex !important;
    gap: 1.5rem !important;
    flex-wrap: wrap !important;
  }
  
  .legal-links a {
    color: var(--forest) !important;
    text-decoration: none !important;
    font-size: 0.85rem !important;
    transition: color 0.25s ease !important;
    opacity: 0.7 !important;
  }
  
  .legal-links a:hover {
    color: var(--provio-green) !important;
    opacity: 1 !important;
  }
  
  /* === COPYRIGHT === */
  .footer-copyright {
    text-align: center !important;
    padding: 1.5rem 0 !important;
    font-size: 0.8rem !important;
    color: var(--forest) !important;
    opacity: 0.7 !important;
  }
  
  .footer-copyright p {
    margin: 0 !important;
    font-size: 0.8rem !important;
    color: var(--forest) !important;
    opacity: 0.7 !important;
  }
  
  .footer-made-in {
    margin-top: 0.5rem !important;
    font-weight: 500 !important;
    opacity: 0.9 !important;
  }
  
  /* === DESKTOP CERTIFICATION LAYOUT === */
  @media (min-width: 993px) {
    .footer-certifications {
      display: grid !important;
      grid-template-columns: repeat(2, max-content) !important;
      column-gap: 0.75rem !important;
      row-gap: 0.75rem !important;
      align-items: center !important;
      justify-content: flex-start !important;
    }
  
    .footer-certifications .cert-badge:nth-child(3) {
      grid-column: 1 / -1 !important;
      justify-self: center !important;
    }
  
    .cert-badge {
      font-size: 0.78rem !important;
      padding: 0.4rem 0.7rem !important;
      border-radius: 28px !important;
      gap: 0.4rem !important;
    }
  
    .cert-icon {
      font-size: 0.95em !important;
    }
  }
  
  /* === RESPONSIVE STYLES === */
  /* Fix for medium screens - brand section on top, 2 sections below in equal columns */
  @media (max-width: 1000px) and (min-width: 769px) {
    .footer-content {
      display: grid !important;
      grid-template-columns: 1fr 1fr !important;
      grid-template-rows: auto auto !important;
      gap: 2rem !important;
      text-align: center !important;
    }
    
    /* Make brand section span full width (first row) */
    .footer-section--brand {
      grid-column: 1 / -1 !important;
      grid-row: 1 !important;
      align-items: center !important;
      text-align: center !important;
      margin-bottom: 1rem !important;
    }
    
    /* Products section - first column, second row */
    .footer-section:nth-of-type(2) {
      grid-column: 1 !important;
      grid-row: 2 !important;
      align-items: center !important;
    }
    
    /* Company section - second column, second row */
    .footer-section:nth-of-type(3) {
      grid-column: 2 !important;
      grid-row: 2 !important;
      align-items: center !important;
    }
    
    /* Other sections general styles */
    .footer-section {
      align-items: center !important;
    }
    
    .footer-description {
      text-align: center !important;
      margin-left: auto !important;
      margin-right: auto !important;
    }
    
    .footer-certifications {
      justify-content: center !important;
    }
  }

  @media (max-width: 768px) {
    .footer-content {
      grid-template-columns: 1fr !important;
      gap: 2rem !important;
    }
  }
  
  @media (min-width: 769px) and (max-width: 1100px) {
    .footer-bottom {
      flex-direction: column !important;
      align-items: center !important;
      gap: 1rem !important;
    }
    
    .payment-methods {
      justify-content: center !important;
      width: 100% !important;
    }
    
    .trust-section {
      display: flex !important;
      justify-content: center !important;
      width: 100% !important;
    }
    
    .trust-badges {
      flex-direction: row !important;
      flex-wrap: nowrap !important;
      justify-content: center !important;
      align-items: center !important;
      gap: 1.5rem !important;
    }
    
    .legal-links {
      justify-content: center !important;
      width: 100% !important;
    }
  }
  
  @media (max-width: 768px) {
    .site-footer {
      padding: 2rem 0 0 !important;
    }
    
    .footer-content {
      grid-template-columns: 1fr !important;
      gap: 2rem !important;
      margin-bottom: 2rem !important;
    }
    
    .footer-section--brand {
      align-items: center !important;
      text-align: center !important;
    }
    
    .footer-logo {
      display: flex !important;
      justify-content: center !important;
    }
    
    .footer-description {
      text-align: center !important;
      margin-left: auto !important;
      margin-right: auto !important;
    }
    
    .footer-title {
      text-align: center !important;
      align-self: center !important;
    }
    
    .footer-section {
      align-items: center !important;
      text-align: center !important;
    }
    
    .footer-certifications {
      justify-content: center !important;
      gap: 0.5rem !important;
    }
    
    .cert-badge {
      font-size: 0.85rem !important;
      padding: 0.3rem 0.6rem !important;
    }
    
    .cert-icon {
      font-size: 1.1rem !important;
    }
    
    .footer-section--newsletter {
      align-items: center !important;
    }
    
    .newsletter-description {
      text-align: center !important;
      align-self: center !important;
    }
    
    .newsletter-form {
      width: 100% !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
    }
    
    .form-group {
      flex-direction: column !important;
      width: 100% !important;
      max-width: 420px !important;
    }
    
    .newsletter-btn {
      align-self: stretch !important;
    }
    
    .newsletter-input,
    .newsletter-btn {
      width: 100% !important;
    }
    
    .form-disclaimer {
      text-align: center !important;
      width: 100% !important;
    }
    
    .checkbox-label {
      justify-content: center !important;
    }
    
    .footer-bottom {
      flex-direction: column !important;
      text-align: center !important;
      gap: 1.5rem !important;
      padding: 1.5rem 0 !important;
    }
    
    .payment-methods,
    .trust-section,
    .legal-links {
      justify-content: center !important;
    }
    
    .trust-badges {
      flex-direction: column !important;
      gap: 0.75rem !important;
      align-items: center !important;
    }
    
    .trust-badge {
      text-align: center !important;
    }
    
    .legal-links {
      flex-direction: column !important;
      gap: 0.75rem !important;
    }
  }
  
  @media (max-width: 480px) {
    .footer-certifications {
      flex-direction: row !important;
      flex-wrap: wrap !important;
      justify-content: center !important;
      align-items: center !important;
    }
    
    .payment-methods {
      flex-direction: column !important;
      gap: 0.75rem !important;
    }
    
    .footer-links {
      text-align: center !important;
    }
    
    .footer-links li {
      text-align: center !important;
    }
    
    .newsletter-description {
      text-align: center !important;
    }
  }