:root{
  --gm-primary:#1664e6;
  --gm-ink:#0b1220;
  --gm-muted:rgba(11,18,32,.72);
  --gm-card:#ffffff;
  --gm-border:rgba(11,18,32,.12);
}

/* ===== HERO (som tidigare) ===== */
.gm-home{ margin-top: 0; }

.gm-heroCard{ padding: 18px 0 10px; }
.gm-heroCard__inner{
  width: min(1320px, calc(100% - 32px));
  margin: 0 auto;
  border-radius: 26px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 18px 60px rgba(11,18,32,.12);
  background: #000;
}
.gm-heroCard__media{ display:block; }
.gm-heroCard__media img{
  width: 100%;
  height: min(72vh, 720px);
  object-fit: cover;
  display:block;
}
.gm-heroCard__overlay{
  position:absolute; inset:0;
  display:grid; place-content:center;
  text-align:center;
  padding: clamp(18px,4vw,44px);
  color:#fff;
}
.gm-heroCard__overlay::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(900px 520px at 50% 35%, rgba(0,0,0,.26), rgba(0,0,0,.08) 55%, rgba(0,0,0,0) 72%),
    linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,.06) 35%, rgba(0,0,0,0) 72%);
  z-index:-1;
}
.gm-heroCard__overlay h1{
  margin:0 0 10px;
  font-weight: 900;
  letter-spacing:-0.02em;
  font-size: clamp(30px,3.6vw,54px);
  line-height:1.05;
  text-shadow: 0 18px 55px rgba(0,0,0,.72);
}
.gm-heroCard__overlay p{
  margin:0 0 18px;
  color: rgba(255,255,255,.94);
}
.gm-heroCard__cta{
  display:flex; gap:14px; justify-content:center; flex-wrap:wrap;
  margin-bottom: 14px;
}
.gm-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 13px 22px;
  min-width: 190px;
  border-radius: 14px;
  font-weight: 900;
  text-decoration:none !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.22);
}
.gm-btn--primary{ background: var(--gm-primary); color:#fff; }
.gm-btn--ghost{ background: rgba(255,255,255,.90); color: var(--gm-ink); border: 1px solid rgba(255,255,255,.35); }

.gm-proof{
  display:inline-flex; align-items:center; gap:10px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.22);
}
.gm-proof__star{ color:#ffcc4d; }

/* ===== TRUST BAR ===== */
.gm-trustbar{ padding: 14px 0 6px; }
.gm-trustbar__cols p{
  margin:0;
  padding: 14px 14px;
  border: 1px solid var(--gm-border);
  border-radius: 16px;
  background: var(--gm-card);
}

/* ===== SPLIT SECTION (FIXED BALANCE) ===== */
.gm-split{ padding: 16px 0; }

/* Gör columns till “riktigt grid” för lika höjd */
.gm-split__cols{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: stretch;
}
.gm-split__cols > .wp-block-column{ width: auto !important; margin:0 !important; }

/* Card */
.gm-card{
  border: 1px solid var(--gm-border);
  border-radius: 22px;
  padding: 18px;
  background: var(--gm-card);
  height: 100%;
  display:flex;
  flex-direction: column;
  gap: 10px;
}
.gm-card h2{ margin: 0 0 4px; }
.gm-card p{ margin: 0 0 10px; color: var(--gm-muted); }

/* Visual module area inside both cards */
.gm-card__visual{
  margin-top: 8px;
  border-radius: 18px;
  border: 1px solid rgba(11,18,32,.10);
  background: rgba(11,18,32,.03);
  padding: 14px;
  flex: 1;              /* <-- gör att båda korten fyller ut lika */
  display:flex;
  flex-direction: column;
  gap: 12px;
  overflow: hidden;
}

/* Repair picker tonas ner så den inte dominerar */
.gm-card__visual--repair{
  background: rgba(11,18,32,.025);
}

/* Shop visual */
.gm-card__visual--shop{
  background:
    radial-gradient(900px 420px at 20% 20%, rgba(22,100,230,.12), rgba(22,100,230,0) 60%),
    rgba(11,18,32,.02);
}

/* Chips */
.gm-chips{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
}
.gm-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 9px 12px;
  border-radius: 999px;
  border: 1px solid rgba(11,18,32,.10);
  background: #fff;
  text-decoration:none !important;
  font-weight: 800;
  color: rgba(11,18,32,.86);
}
.gm-chip:hover{ border-color: rgba(22,100,230,.35); }

/* Mini cards grid */
.gm-miniGrid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.gm-miniCard{
  display:flex;
  gap: 12px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(11,18,32,.10);
  background: rgba(255,255,255,.9);
}
.gm-miniCard__img{
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(22,100,230,.22), rgba(22,100,230,.06));
  border: 1px solid rgba(22,100,230,.18);
}
.gm-miniCard__meta{ display:flex; flex-direction:column; justify-content:center; }
.gm-miniCard__title{ font-weight: 900; color: rgba(11,18,32,.92); }
.gm-miniCard__sub{ font-weight: 700; color: rgba(11,18,32,.60); font-size: 13px; }

/* Shop proof */
.gm-shopProof{
  margin-top: auto; /* tryck ner proof så båda känns lika “fyllda” */
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(11,18,32,.10);
  background: rgba(255,255,255,.75);
  color: rgba(11,18,32,.72);
  font-weight: 800;
  font-size: 13px;
}
.gm-shopProof__dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(22,100,230,.9);
}

/* ===== OTHER SECTIONS ===== */
.gm-how, .gm-reviews, .gm-faq{ padding: 18px 0; }
.gm-muted{ color: var(--gm-muted); }

.gm-finalCta{
  margin: 10px 0 26px;
  border-radius: 22px;
  border: 1px solid var(--gm-border);
  background: linear-gradient(180deg, rgba(22,100,230,.08), rgba(22,100,230,0));
  padding: 18px;
}

/* ===== MOBILE ===== */
@media (max-width: 781px){
  .gm-heroCard__inner{ width: calc(100% - 24px); border-radius: 18px; }
  .gm-heroCard__media img{ height: 560px; }
  .gm-heroCard__overlay{ place-content: end center; padding-bottom: 18px; }
  .gm-heroCard__cta{ flex-direction: column; gap:10px; }
  .gm-btn{ width: min(420px, 100%); min-width: 0; box-shadow:none; }

  .gm-split__cols{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .gm-card{ padding: 16px; }
  .gm-card__visual{ padding: 12px; }
}
