/*
Theme Name: Maroc Gazon
Description: Thème enfant Astra pour marocgazon.com
Author: Maroc Gazon
Version: 1.0.0
Template: astra
Text Domain: marocgazon
*/

:root {
  --mg-green: #24743a;
  --mg-dark: #173b27;
  --mg-yellow: #f2c94c;
  --mg-light: #f4f7f2;
  --mg-text: #243329;
}

body {
  color: var(--mg-text);
}

.mg-wrap {
  width: min(1120px, calc(100% - 36px));
  margin-inline: auto;
}

.mg-hero {
  padding: clamp(64px, 10vw, 120px) 0;
  background: linear-gradient(120deg, var(--mg-dark), var(--mg-green));
  color: #fff;
}

.mg-hero h1,
.mg-hero p {
  color: #fff;
  max-width: 760px;
}

.mg-hero h1 {
  font-size: clamp(36px, 6vw, 64px);
  line-height: 1.08;
}

.mg-hero p {
  font-size: 19px;
}

.mg-button {
  display: inline-block;
  padding: 13px 22px;
  margin: 8px 8px 0 0;
  border-radius: 6px;
  background: var(--mg-yellow);
  color: #17271c;
  font-weight: 700;
  text-decoration: none;
}

.mg-button--light {
  background: #fff;
}

.mg-section {
  padding: clamp(42px, 7vw, 78px) 0;
}

.mg-section--light {
  background: var(--mg-light);
}

.mg-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.mg-card {
  padding: 24px;
  border: 1px solid #e4eae2;
  border-radius: 10px;
  background: #fff;
}

.mg-card h3 {
  margin-top: 0;
  color: var(--mg-green);
}

.mg-cta {
  padding: 42px 24px;
  border-radius: 12px;
  background: var(--mg-dark);
  color: #fff;
  text-align: center;
}

.mg-cta h2,
.mg-cta p {
  color: #fff;
}

@media (max-width: 760px) {
  .mg-grid {
    grid-template-columns: 1fr;
  }
}