.plan-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 26px 0 34px;
}

.plan-card {
  background: var(--clay-soft);
  border: 2px solid var(--clay-line);
  border-radius: 22px;
  padding: 26px;
}

.plan-card.featured { box-shadow: 0 10px 28px rgba(159, 47, 103, .12); }
.plan-card h3 { color: #9f2f67; font-size: 28px; line-height: 1.15; margin: 5px 0 10px; }
.plan-kicker { color: #9f2f67; font-size: 13px; font-weight: 900; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.plan-price { color: var(--clay-dark); font-size: 34px; font-weight: 950; margin: 8px 0; }
.plan-price small { font-size: 16px; }
.plan-card li { margin: 8px 0; }
.pack-prices { display: grid; gap: 8px; margin: 16px 0; }
.pack-prices span { background: #fff; border: 1px solid var(--clay-line); border-radius: 12px; padding: 10px 12px; }
.comparison-table-wrap { overflow-x: auto; }
.comparison-table { border-collapse: separate; border-spacing: 0; margin: 16px 0 36px; min-width: 720px; width: 100%; }
.comparison-table th, .comparison-table td { border-bottom: 1px solid var(--clay-line); padding: 15px; text-align: left; vertical-align: top; }
.comparison-table thead th { background: var(--clay-pink); color: #fff; }
.comparison-table thead th:first-child { border-radius: 14px 0 0; }
.comparison-table thead th:last-child { border-radius: 0 14px 0 0; }
.comparison-table tbody th { color: #9f2f67; width: 20%; }
.policy-callout { background: #fff4c7; border: 2px solid #f1cf58; border-radius: 20px; margin: 34px 0; padding: 8px 25px 24px; }
.policy-callout h2 { font-size: 30px; margin-top: 20px; }
.studio-credit-callout { background: #eefaf4; border-color: #72c99b; }
.kids-details-actions { display: flex; gap: 12px; margin: 20px 0 34px; }
.small-angle-button { background: #fff7fb; border: 2px solid var(--clay-pink); border-radius: 9px 3px 9px 3px; color: #9f2f67; cursor: pointer; font-size: 13px; font-style: italic; font-weight: 900; padding: 9px 14px; transform: skewX(-8deg); }
.small-angle-button span { display: block; transform: skewX(8deg); }
.small-angle-button:hover { background: var(--clay-pink); color: #fff; }
.modal-open { overflow: hidden; }
.kids-perks-modal[hidden] { display: none; }
.kids-perks-modal { align-items: center; display: flex; inset: 0; justify-content: center; padding: 22px; position: fixed; z-index: 100; }
.kids-perks-backdrop { background: rgba(36, 25, 34, .72); inset: 0; position: absolute; }
.kids-perks-dialog { background: #fff; border: 3px solid var(--clay-line); border-radius: 24px; box-shadow: 0 22px 70px rgba(0,0,0,.25); max-height: 90vh; max-width: 850px; overflow: auto; padding: 28px; position: relative; width: 100%; z-index: 1; }
.kids-perks-dialog-close { align-items: center; background: var(--clay-dark); border: 0; border-radius: 50%; color: #fff; cursor: pointer; display: flex; font-size: 28px; height: 42px; justify-content: center; position: absolute; right: 16px; top: 16px; width: 42px; }
.kids-perks-dialog-hero { align-items: center; display: flex; gap: 18px; padding-right: 45px; }
.kids-perks-dialog-hero img { height: 82px; width: auto; }
.kids-perks-dialog-hero h2 { color: #9f2f67; font-size: 38px; line-height: 1; margin: 5px 0 8px; }
.kids-perks-dialog-hero p { margin: 0; }
.kids-perks-preview { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 24px 0; }
.kids-perks-preview img { background: var(--clay-soft); border-radius: 16px; height: 170px; object-fit: contain; padding: 10px; width: 100%; }
.kids-perks-grid { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kids-perks-grid article { background: var(--clay-soft); border: 1px solid var(--clay-line); border-radius: 16px; padding: 18px; }
.kids-perks-grid h3 { color: #9f2f67; margin: 0 0 6px; }
.kids-perks-grid p { margin: 0; }
.kids-perks-dialog-footer { align-items: center; display: flex; gap: 18px; justify-content: space-between; margin-top: 22px; }

@media (max-width: 760px) {
  .plan-grid { grid-template-columns: 1fr; }
  .kids-perks-dialog { padding: 22px 16px; }
  .kids-perks-dialog-hero { align-items: flex-start; flex-direction: column; }
  .kids-perks-dialog-hero h2 { font-size: 30px; }
  .kids-perks-preview { grid-template-columns: 1fr 1fr 1fr; }
  .kids-perks-preview img { height: 110px; }
  .kids-perks-grid { grid-template-columns: 1fr; }
  .kids-perks-dialog-footer { align-items: flex-start; flex-direction: column; }
}
