/* ===== GL-003c — MARKAGENIE Design Tokens — shop5 Laser & CO2 ===== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;800&family=Inter:wght@400;500;600&display=swap');

:root {
  /* Couleurs GL-003c */
  --mkg-primary:        #2471A3;
  --mkg-primary-dark:   #1A5A87;
  --mkg-secondary:      #C8660E;
  --mkg-secondary-dark: #A5530B;
  --mkg-charcoal:       #1C2833;
  --mkg-charcoal-soft:  #354A5E;
  --mkg-neutral-0:      #FFFFFF;
  --mkg-neutral-1:      #F4F6F9;
  --mkg-neutral-2:      #DCE4EE;
  --mkg-neutral-3:      #8A9BB0;
  /* Echelle typographique */
  --text-display: clamp(2.5rem, 5vw, 4rem);
  --text-h1:      40px;
  --text-h2:      28px;
  --text-h3:      20px;
  --text-body:    16px;
  --text-caption: 13px;
  /* Spacing (multiples de 8px) */
  --space-xs:  8px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  40px;
  --space-xl:  64px;
  --space-2xl: 96px;
  /* Layout */
  --max-width-content: 1280px;
  --max-width-text:    760px;
}

/* ===== Corps & Titres ===== */
body {
  font-family: 'Inter', sans-serif;
  color: var(--mkg-charcoal-soft);
  font-size: var(--text-body);
  line-height: 1.7;
}
h1, h2, h3, h4 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  color: var(--mkg-charcoal);
}
h1 { font-size: var(--text-h1); line-height: 1.1; }
h2 { font-size: var(--text-h2); line-height: 1.2; }
h3 { font-size: var(--text-h3); font-weight: 700; line-height: 1.3; }
a { color: var(--mkg-primary); }
a:hover { color: var(--mkg-primary-dark); }

/* ===== Header Astra — fond charcoal industriel ===== */
.ast-primary-header-bar,
#masthead,
.site-header {
  background-color: var(--mkg-charcoal) !important;
}
.main-navigation a,
.ast-main-navigation a,
.ast-primary-header-bar .menu-item a,
#masthead .menu-item a {
  color: #FFFFFF !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.main-navigation a:hover,
.ast-main-navigation a:hover,
.ast-primary-header-bar .menu-item a:hover {
  color: var(--mkg-secondary) !important;
}

/* ===== Logo ===== */
.custom-logo,
.ast-site-identity img {
  max-height: 48px;
  width: auto;
}

/* ===== Footer ===== */
.ast-footer-overlay,
.site-footer,
#colophon {
  background-color: var(--mkg-charcoal) !important;
  color: #FFFFFF !important;
}
.site-footer a,
#colophon a {
  color: var(--mkg-neutral-3) !important;
}
.site-footer a:hover,
#colophon a:hover {
  color: var(--mkg-secondary) !important;
}

/* ===== Boutons WooCommerce — CTA primaire bleu ===== */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button {
  background-color: var(--mkg-primary) !important;
  color: var(--mkg-neutral-0) !important;
  border-radius: 4px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: var(--text-body) !important;
  padding: var(--space-sm) var(--space-lg) !important;
  border: 2px solid var(--mkg-primary) !important;
  letter-spacing: 0.03em;
  text-transform: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce #respond input#submit:hover {
  background-color: var(--mkg-primary-dark) !important;
  border-color: var(--mkg-primary-dark) !important;
}
/* CTA secondaire orange */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce #payment #place_order {
  background-color: var(--mkg-secondary) !important;
  border-color: var(--mkg-secondary) !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce #payment #place_order:hover {
  background-color: var(--mkg-secondary-dark) !important;
  border-color: var(--mkg-secondary-dark) !important;
}

/* ===== Prix WooCommerce ===== */
.woocommerce .price,
.woocommerce-Price-amount {
  color: var(--mkg-primary) !important;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
}

/* ===== Cards produits ===== */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  color: var(--mkg-charcoal);
}
.woocommerce ul.products li.product:hover {
  box-shadow: 0 6px 24px rgba(28, 40, 51, 0.14);
}

/* ===== Badges techniques orange (Laser / CO2) ===== */
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
  background-color: var(--mkg-secondary) !important;
  color: var(--mkg-neutral-0) !important;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: var(--text-caption);
}

/* ===== Formulaires ===== */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea,
select {
  border-color: var(--mkg-neutral-2) !important;
  font-family: 'Inter', sans-serif;
  border-radius: 4px;
}
input:focus,
textarea:focus,
select:focus {
  border-color: var(--mkg-primary) !important;
  outline: none;
  box-shadow: 0 0 0 2px rgba(36, 113, 163, 0.15);
}

/* ===== Section alternance ===== */
.woocommerce-products-header {
  background-color: var(--mkg-charcoal);
  color: var(--mkg-neutral-0);
  padding: var(--space-lg) 0;
}
.woocommerce-products-header__title {
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  color: var(--mkg-neutral-0);
}