:root{ --prim:#c23a1e; --texto:#333 }
.wedding-actions{ max-width:960px; margin:0 auto; padding:24px 18px 6px; color:var(--texto); }
.wedding-actions .header{ text-align:center; margin-bottom:10px; }
.wedding-actions .header h1{ font: 400 22px/1 "Playfair Display", serif; color:#60646b; margin:0 0 4px; letter-spacing:.02em; }
.wedding-actions .header h2{ font: 600 34px/1.1 "Playfair Display", serif; color:#3c3f46; margin:0 0 8px; }

.wedding-actions .grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(150px,1fr));
  gap:28px 22px;
  align-items:center;
  justify-items:center;
  margin:18px auto 8px;
}

.badge{ width:170px; aspect-ratio:1/1; text-decoration:none; display:block; }
.badge svg{ width:100%; height:100%; display:block; overflow:visible; transition:transform .28s ease, filter .28s ease; filter: drop-shadow(0 1px 0 rgba(0,0,0,.02)); }
.badge:hover svg{ transform:translateY(-2px) scale(1.02); filter: drop-shadow(0 8px 14px rgba(0,0,0,.12)); }
.badge .icon{ fill:var(--prim); }
.badge .curve{ fill:none; stroke:transparent; }
.badge text{ fill:var(--prim); }
.badge text.label-script{ font-family:"Great Vibes", cursive; font-size:20px; }
.badge text.label-smallcaps{ font-family:"Playfair Display", serif; font-variant:small-caps; letter-spacing:.08em; font-size:12px; }

@media (max-width:420px){
  .badge{ width:140px; }
  .wedding-actions .header h2{ font-size:28px; }
}