/* Growth Marketing page */

/* Packages --------------------------------------------------------------- */

.packages { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.packages__group { margin: 48px 0 16px; font-family: var(--font-display); font-weight: 700; font-size: 26px; letter-spacing: -0.01em; }
.package {
    display: flex; flex-direction: column; gap: 14px; padding: 28px;
    border-radius: 24px; background: #fff; border: 2px solid var(--rule);
}
.package__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.package__head h3 { margin: 0; font-family: var(--font-display); font-weight: 700; font-size: 24px; }
.package__head .badge { font-size: 12px; padding: 4px 10px; }
.package__price { font-family: var(--font-display); font-weight: 800; font-size: 44px; letter-spacing: -0.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.package__price small { font: 600 16px var(--font-body); letter-spacing: 0; color: var(--muted); }
.package__includes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; flex: 1; font-size: 15px; }
.package__includes li { display: flex; gap: 10px; }
.package__includes li::before { content: "✓"; font-weight: 800; color: var(--green); }
.package__term { margin: 0; font-size: 14px; color: var(--muted); }
.package .btn { min-height: 50px; font-size: 16px; }

.package--popular { background: var(--purple); border-color: var(--purple); color: #fff; }
.package--popular .package__price small, .package--popular .package__term { color: var(--lavender-light); }
.package--popular .package__includes li::before { color: var(--sprout); }

/* Individual services ---------------------------------------------------- */

.services { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 0 32px; }
.services__item { padding: 18px 0; border-top: 1px solid var(--rule); }
.services__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 12px; }
.services__head h3 { margin: 0; font-size: 17px; }
.services__price { font-weight: 700; font-size: 15px; color: var(--purple); font-variant-numeric: tabular-nums; }
.services__item p { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: var(--muted); }
.services__fine { margin: 24px 0 0; font-size: 14px; color: var(--muted); }