/* ============================================================
   FOOTER — Graph'Art Studio
   Scope : .site-footer (classe Astra du footer)
   Dépend de : tokens.css
   ============================================================ */

.site-footer {
  background: var(--gas-color-bg-primary);
  color: var(--gas-color-text-secondary);
  font-family: var(--gas-font-body);
  border-top: 1px solid var(--gas-color-border);
  padding: var(--gas-spacing-4xl) var(--gas-gutter-desktop) var(--gas-spacing-xl);
  margin-top: 0;
}

/* Neutraliser les bordures, ombres et fond éventuels d'Astra */
.site-footer .site-below-footer-wrap,
.site-footer .site-primary-footer-wrap,
.site-footer .footer-widget-area,
.site-footer .ast-builder-grid-row-container,
.site-footer .ast-builder-grid-row {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  max-width: 100% !important;
}

/* ------------------------------------------------------------
   GRILLE PRINCIPALE — 4 colonnes (col 1 double largeur)
   ------------------------------------------------------------ */

.site-footer .gas-footer-top {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--gas-spacing-xxl);
  margin-bottom: 80px;
}

/* ------------------------------------------------------------
   COLONNE 1 — STUDIO
   ------------------------------------------------------------ */

.site-footer .gas-footer-logo {
  font-family: var(--gas-font-display);
  font-weight: var(--gas-font-weight-light);
  font-size: 36px;
  letter-spacing: var(--gas-letter-spacing-tight);
  color: var(--gas-color-text-primary);
  line-height: 1;
  margin: 0 0 var(--gas-spacing-md);
}

/* Lien du logo footer : hérite la couleur, pas de soulignement */
.site-footer .gas-footer-logo a,
.site-footer .gas-footer-logo .gas-logo-link {
  color: inherit;
  text-decoration: none;
  transition: color var(--gas-transition-fast) var(--gas-easing-default);
}

.site-footer .gas-footer-logo a:hover,
.site-footer .gas-footer-logo .gas-logo-link:hover {
  color: var(--gas-color-accent);
}

.site-footer .gas-footer-logo a:hover .gas-logo-g,
.site-footer .gas-footer-logo .gas-logo-link:hover .gas-logo-g {
  color: var(--gas-color-text-secondary);
}

/* "g" champagne — même traitement que dans le header */
.site-footer .gas-footer-logo .gas-logo-g {
  font-family: var(--gas-font-italic);
  font-style: italic;
  color: var(--gas-color-accent);
  font-size: 42px;
}

.site-footer .gas-footer-logo .gas-logo-art {
  font-family: var(--gas-font-italic);
  font-style: italic;
}

.site-footer .gas-footer-logo .gas-logo-img {
  width: 200px;
  height: auto;
  display: block;
}

.site-footer .gas-footer-baseline {
  font-family: var(--gas-font-italic);
  font-style: italic;
  font-size: 19px;
  line-height: var(--gas-line-height-body);
  color: var(--gas-color-text-secondary);
  margin: 0;
  max-width: 460px;
}

/* ------------------------------------------------------------
   COLONNES 2-4 — Titre de colonne uniforme
   ------------------------------------------------------------ */

.site-footer .gas-footer-col h4,
.site-footer .gas-footer-col-title {
  font-family: var(--gas-font-label);
  font-size: var(--gas-font-size-label);
  letter-spacing: var(--gas-letter-spacing-wide);
  text-transform: uppercase;
  color: var(--gas-color-text-tertiary);
  font-weight: var(--gas-font-weight-regular);
  margin: 0 0 20px;
}

.site-footer .gas-footer-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.site-footer .gas-footer-col li {
  margin-bottom: 10px;
}

.site-footer .gas-footer-col a {
  font-family: var(--gas-font-body);
  font-size: 14px;
  color: var(--gas-color-text-primary);
  text-decoration: none;
  transition: color var(--gas-transition-fast) var(--gas-easing-default);
}

.site-footer .gas-footer-col a:hover {
  color: var(--gas-color-accent);
}

/* ------------------------------------------------------------
   COLONNE 3 — NEWSLETTER
   ------------------------------------------------------------ */

.site-footer .gas-footer-newsletter {
  margin-top: var(--gas-spacing-md);
}

.site-footer .gas-footer-newsletter-title {
  font-family: var(--gas-font-label);
  font-size: var(--gas-font-size-label);
  letter-spacing: var(--gas-letter-spacing-wide);
  text-transform: uppercase;
  color: var(--gas-color-text-tertiary);
  margin: 0 0 var(--gas-spacing-xs);
}

.site-footer .gas-footer-newsletter-text {
  font-family: var(--gas-font-italic);
  font-style: italic;
  font-size: 15px;
  line-height: 1.5;
  color: var(--gas-color-text-secondary);
  margin: 0;
}

/* ------------------------------------------------------------
   COLONNE 4 — CONTACT
   ------------------------------------------------------------ */

.site-footer .gas-footer-phone {
  font-family: var(--gas-font-body);
  font-size: 14px;
  color: var(--gas-color-text-primary);
  margin-bottom: var(--gas-spacing-xs);
}

.site-footer .gas-footer-email {
  font-family: var(--gas-font-italic);
  font-style: italic;
  font-size: 18px;
  color: var(--gas-color-accent);
  text-decoration: none;
  transition: color var(--gas-transition-fast);
  display: block;
}

.site-footer .gas-footer-email:hover {
  color: var(--gas-color-text-primary);
}

/* ------------------------------------------------------------
   LIGNE DU BAS — copyright + mentions
   ------------------------------------------------------------ */

.site-footer .gas-footer-bottom {
  padding-top: var(--gas-spacing-lg);
  border-top: 1px solid var(--gas-color-border);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--gas-font-label);
  font-size: var(--gas-font-size-label);
  letter-spacing: var(--gas-letter-spacing-wide);
  text-transform: uppercase;
  color: var(--gas-color-text-tertiary);
}

.site-footer .gas-footer-legal {
  display: flex;
  gap: var(--gas-spacing-md);
}

.site-footer .gas-footer-legal a {
  color: var(--gas-color-text-tertiary);
  text-decoration: none;
  font-size: var(--gas-font-size-label);
  transition: color var(--gas-transition-fast);
}

.site-footer .gas-footer-legal a:hover {
  color: var(--gas-color-accent);
}

/* ------------------------------------------------------------
   BANDE CONFIANCE PAIEMENT
   ------------------------------------------------------------ */

.site-footer .gas-footer-trust {
  margin-top: var(--gas-spacing-lg);
}

.site-footer .gas-payment-label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: var(--gas-font-label);
  font-size: var(--gas-font-size-label);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gas-color-text-secondary);
  margin-bottom: var(--gas-spacing-sm);
}

.site-footer .gas-payment-lock {
  color: var(--gas-color-text-secondary);
  flex-shrink: 0;
}

.site-footer .gas-payment-methods {
  display: flex;
  align-items: center;
  gap: var(--gas-spacing-xs);
}

.site-footer .gas-payment-chip {
  display: inline-block;
  border: 1px solid var(--gas-color-border-strong);
  padding: 3px 9px;
  font-family: var(--gas-font-label);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gas-color-text-secondary);
  line-height: 1.6;
}

/* ------------------------------------------------------------
   COLONNE 4 — SWITCHER LANGUE
   ------------------------------------------------------------ */

.site-footer .gas-footer-lang {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: var(--gas-spacing-md);
}

.site-footer .gas-footer-lang-flag {
  display: inline-flex;
  border: none;
  padding: 0;
  background: none;
  text-decoration: none;
  opacity: 0.45;
  transition: opacity var(--gas-transition-fast);
}

.site-footer .gas-footer-lang-flag:hover {
  opacity: 1;
}

.site-footer .gas-footer-lang-flag--active {
  opacity: 1;
  cursor: default;
}

.site-footer .gas-footer-lang-flag img {
  display: block;
  border: 1px solid rgba(242, 235, 221, 0.15);
}

/* ------------------------------------------------------------
   FOCUS — supprime le contour au clic (meme solution que header)
   ------------------------------------------------------------ */

.site-footer *:focus,
.site-footer *:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* ------------------------------------------------------------
   BREVO NEWSLETTER FORM — Override GAS
   ------------------------------------------------------------ */

.site-footer .sib-form {
  background: transparent !important;
  padding: 0 !important;
  margin-top: var(--gas-spacing-md) !important;
  text-align: left !important;
}

.site-footer .sib-form-container {
  max-width: 100% !important;
  background: transparent !important;
}

.site-footer #sib-container {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  text-align: left !important;
}

.site-footer #sib-form .sib-input,
.site-footer #sib-form .sib-form-block {
  padding: 0 !important;
  margin-bottom: 0 !important;
}

.site-footer #sib-form .sib-form-block + .sib-form-block {
  margin-top: 8px !important;
}

/* Champ email */
.site-footer #sib-container .input {
  background: #ffffff !important;
  border: 1px solid var(--gas-color-border) !important;
  border-radius: 0 !important;
  color: #06142f !important;
  font-family: var(--gas-font-body) !important;
  font-size: 14px !important;
  padding: 10px 14px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.site-footer #sib-container .input::placeholder {
  color: #8899aa !important;
  font-family: var(--gas-font-label) !important;
  font-size: 11px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}

.site-footer #sib-container .input:focus {
  border-color: var(--gas-color-accent) !important;
  outline: none !important;
  box-shadow: none !important;
}

.site-footer #sib-container .input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #06142f inset !important;
  -webkit-text-fill-color: var(--gas-color-text-primary) !important;
}

/* Bouton */
.site-footer .sib-form-block__button {
  background: transparent !important;
  border: 1px solid var(--gas-color-border) !important;
  border-radius: 0 !important;
  color: var(--gas-color-text-secondary) !important;
  font-family: var(--gas-font-label) !important;
  font-size: var(--gas-font-size-label) !important;
  letter-spacing: var(--gas-letter-spacing-wide) !important;
  text-transform: uppercase !important;
  padding: 10px 20px !important;
  cursor: pointer !important;
  transition: border-color var(--gas-transition-fast), color var(--gas-transition-fast) !important;
  width: 100% !important;
}

.site-footer .sib-form-block__button:hover {
  border-color: var(--gas-color-accent) !important;
  color: var(--gas-color-accent) !important;
}

.site-footer .sib-form-block__button:focus,
.site-footer .sib-form-block__button:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.site-footer .sib-form-block__button .sib-hide-loader-icon {
  display: none !important;
}

/* Messages retour */
.site-footer #success-message,
.site-footer #error-message {
  font-family: var(--gas-font-body) !important;
  font-size: 12px !important;
  border-radius: 0 !important;
  padding: 8px 12px !important;
  margin-bottom: 8px !important;
}

.site-footer #success-message {
  color: var(--gas-color-accent) !important;
  background: rgba(196, 160, 48, 0.08) !important;
  border-color: var(--gas-color-accent) !important;
}

.site-footer #error-message {
  color: #ff8080 !important;
  background: rgba(255, 74, 74, 0.08) !important;
  border-color: #ff4949 !important;
}

/* Erreur inline champ */
.site-footer .entry__error {
  font-family: var(--gas-font-body) !important;
  font-size: 11px !important;
}

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

/* Tablette : 768–1199px */
@media (max-width: 1199px) {
  .site-footer {
    padding: 80px var(--gas-gutter-tablet) 40px;
  }
  .site-footer .gas-footer-top {
    grid-template-columns: 2fr 1fr;
    gap: var(--gas-spacing-xl);
    margin-bottom: var(--gas-spacing-xxl);
  }
  .site-footer .gas-footer-col-studio {
    grid-column: 1 / -1;
    text-align: center;
  }
  .site-footer .gas-footer-baseline {
    margin: 0 auto;
  }
  .site-footer .gas-footer-logo .gas-logo-img {
    width: 180px;
    margin: 0 auto;
  }
}

/* Tablette 921-1199px — 3 colonnes + studio centré + paiement centré */
@media (min-width: 921px) and (max-width: 1199px) {
  .site-footer .gas-footer-top {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .site-footer .gas-footer-col-studio {
    grid-column: 1 / -1;
    text-align: center;
  }
  .site-footer .gas-footer-baseline {
    margin: 0 auto;
  }
  .site-footer .gas-payment-label { justify-content: center; }
  .site-footer .gas-payment-methods { justify-content: center; }
  .site-footer .gas-footer-lang { justify-content: center; }
}

/* Mobile : ≤ 920px */
@media (max-width: 920px) {
  .site-footer {
    padding: 64px var(--gas-gutter-mobile) 32px;
  }
  .site-footer .gas-footer-top {
    grid-template-columns: 1fr;
    gap: var(--gas-spacing-xl);
    margin-bottom: var(--gas-spacing-xl);
  }
  .site-footer .gas-footer-logo {
    font-size: 28px;
  }
  .site-footer .gas-footer-logo .gas-logo-g {
    font-size: 33px;
  }
  .site-footer .gas-footer-logo .gas-logo-img {
    width: 160px;
  }
  .site-footer .gas-footer-bottom {
    flex-direction: column;
    gap: var(--gas-spacing-md);
    align-items: center;
    text-align: center;
  }
  .site-footer .gas-footer-legal {
    flex-wrap: wrap;
    gap: var(--gas-spacing-sm);
    justify-content: center;
  }
  .site-footer .gas-payment-label { justify-content: center; }
  .site-footer .gas-payment-methods { justify-content: center; }
  .site-footer .gas-footer-lang { justify-content: center; }
  .site-footer .gas-footer-newsletter,
  .site-footer .sib-form { max-width: 480px; margin-left: auto; margin-right: auto; }
}