/* Sport Massage Isabelle theme. Load after widget.css and add class="smi" to the widget.
   Colours and shapes copied from sportmassageisabelle.com (navy #2C2F88, cyan #00A4E0, gold #d4af37). */
.gr-widget.smi {
  --gr-bg: transparent;
  --gr-card: #ffffff;
  --gr-text: #333333;
  --gr-muted: #777777;
  --gr-accent: #00A4E0;
  --gr-radius: 18px;
  --smi-navy: #2C2F88;
  --smi-gold: #d4af37;
  font-family: 'Segoe UI', sans-serif;
}
.smi .gr-name { color: var(--smi-navy); }
.smi .gr-author-name { color: var(--smi-navy); }
.smi .gr-card { box-shadow: 0 8px 25px rgba(0,0,0,.08); transition: transform .3s ease, box-shadow .3s ease; }
.smi .gr-card:hover { transform: translateY(-4px); box-shadow: 0 15px 35px rgba(0,0,0,.12); }
.smi .gr-text { color: #555; line-height: 1.7; }
.smi .gr-more { font-weight: 600; }
.smi .gr-btn { background: var(--smi-navy); border-radius: 30px; padding: 12px 24px; font-weight: 700; transition: background .3s; }
.smi .gr-btn:hover { background: var(--gr-accent); opacity: 1; }
.smi .gr-initial { background: linear-gradient(to bottom right, var(--smi-navy), var(--gr-accent)); }
.smi.gr-carousel .gr-card { border: 0; }
/* Grid styles: 3 per row, a short last row is centred instead of left alone. */
@media (min-width: 601px) {
  .smi:not(.gr-carousel):not(.smi-big) .gr-list { display: flex; flex-wrap: wrap; justify-content: center; }
  .smi:not(.gr-carousel):not(.smi-big) .gr-card { flex: 0 1 calc((100% - 32px) / 3); }
}
.smi .gr-arrow { background: var(--smi-navy); }
.smi .gr-arrow:hover { background: var(--gr-accent); }

/* smi-gradient: blue band like the hero at the top of the site. */
.smi.smi-gradient {
  background: linear-gradient(to bottom right, var(--smi-navy), var(--gr-accent));
  padding: 32px 24px; border-radius: 18px;
}
.smi-gradient .gr-name, .smi-gradient .gr-score, .smi-gradient .gr-count { color: #fff; }
.smi-gradient .gr-star:not(.on) { color: rgba(255,255,255,.35); }
.smi-gradient .gr-card .gr-star:not(.on) { color: #d9d9d9; }
.smi-gradient .gr-btn { background: #fff; color: var(--smi-navy); }
.smi-gradient .gr-btn:hover { background: var(--gr-accent); color: #fff; }
.smi-gradient .gr-g { background: #fff; border-radius: 50%; padding: 6px; width: 44px; height: 44px; }
.smi-gradient .gr-arrow { background: #fff; color: var(--smi-navy); }

/* smi-signature: gold details like the "Ritual Signature" card. Use together with gr-quotes. */
.smi.smi-signature { --gr-accent: var(--smi-gold); --gr-star: var(--smi-gold); }
.smi-signature .gr-card { border: 2px solid var(--smi-gold); }
.smi-signature .gr-btn { background: var(--smi-gold); }
.smi-signature .gr-btn:hover { background: var(--smi-navy); }
.smi-signature .gr-more { color: var(--smi-navy); }
.smi-signature .gr-initial { background: var(--smi-gold); }

/* smi-big: large 5.0 score on the left, reviews on the right (desktop). */
@media (min-width: 900px) {
  .smi.smi-big { display: grid; grid-template-columns: 230px 1fr; gap: 28px; align-items: start; }
  .smi-big .gr-header { flex-direction: column; align-items: flex-start; position: sticky; top: 110px; margin: 0; }
  .smi-big .gr-score { flex-direction: column; align-items: flex-start; gap: 2px; }
  .smi-big .gr-score strong { font-size: 3.4em; line-height: 1; color: var(--smi-navy); }
  .smi-big .gr-score .gr-stars { font-size: 1.4em; }
  .smi-big .gr-list { grid-template-columns: repeat(2, 1fr); }
}
