.ap-siteground main h1 {
  margin: 0 0 var(--space-4);
  font-size: var(--type-display);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
}

.ap-siteground main h2 {
  margin: 0 0 var(--space-4);
  font-size: var(--type-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
}

.ap-siteground main h3 {
  margin: 0 0 var(--space-3);
  font-size: var(--type-subheading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
}

.ap-siteground .ap-kicker { margin: 0 0 var(--space-3); }
.ap-siteground .sg-lead { max-width: var(--reading); font-size: var(--type-lead); line-height: var(--leading-lead); }
.ap-siteground .sg-note { max-width: var(--reading); color: var(--muted); font-size: var(--type-body-small); }
.ap-siteground .sg-text-link { color: var(--blue-2); text-decoration: underline; text-underline-offset: 4px; }
.ap-siteground .sg-text-link:focus-visible,
.ap-siteground summary:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.ap-siteground .sg-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--space-4); margin-block: var(--space-5) 0; }
.ap-siteground .sg-hero { padding-block: var(--hero-space); background: var(--ice); }
.ap-siteground .sg-hero-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--space-6); }
.ap-siteground .sg-brand-media { margin: 0; }
.ap-siteground .sg-logo { display: block; width: min(100%, 200px); height: auto; margin: 0 0 var(--space-5); }
.ap-siteground .sg-business-media { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); }
.ap-siteground .sg-actions > .sg-text-link { padding-top: var(--space-2); }
.ap-siteground .sg-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gap); margin-top: var(--space-5); }
.ap-siteground .sg-card { display: flex; flex-direction: column; min-width: 0; }
.ap-siteground .sg-card > p { margin: 0 0 var(--space-4); }
.ap-siteground .sg-card .sg-text-link { margin-top: auto; padding-top: var(--space-3); }
.ap-siteground .sg-card-photo { margin: 0 0 var(--space-4); }
.ap-siteground .sg-card-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); }
.ap-siteground .sg-plans { background: var(--ice); }
.ap-siteground .sg-plan-layout { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr); gap: var(--space-6); }
.ap-siteground .sg-plan-intro { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: var(--space-4); min-width: 0; }
.ap-siteground .sg-plan-intro h2 { margin: 0; }
.ap-siteground .sg-plan-grid { display: grid; border-top: 1px solid var(--line); }
.ap-siteground .sg-plan { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-4); min-width: 0; padding-block: var(--space-4); border-bottom: 1px solid var(--line); }
.ap-siteground .sg-plan h3, .ap-siteground .sg-plan-cost p { margin: 0; }
.ap-siteground .sg-plan-fit { margin: var(--space-1) 0 0; }
.ap-siteground .sg-plan-cost { text-align: right; }
.ap-siteground .sg-plan .sg-price-line { display: flex; justify-content: flex-end; align-items: baseline; gap: var(--space-1); }
.ap-siteground .sg-price { color: var(--text); font-size: var(--type-heading); font-weight: var(--weight-semibold); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); }
.ap-siteground .sg-price-unit { color: var(--muted); font-size: var(--type-body); }
.ap-siteground .sg-plan .sg-plan-renewal { margin-top: var(--space-1); color: var(--muted); font-size: var(--type-body-small); }
.ap-siteground .sg-official-banner { margin: 0; }
.ap-siteground .sg-official-banner a { display: inline-block; max-width: 100%; }
.ap-siteground .sg-official-banner img { display: block; max-width: 100%; height: auto; }
.ap-siteground .sg-official-banner a:focus-visible { outline: 3px solid var(--contrast); outline-offset: 4px; }
.ap-siteground .sg-hosting-banner { width: 300px; max-width: 100%; }
.ap-siteground .sg-service-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-5); }
.ap-siteground .sg-service { display: flex; flex-direction: column; min-width: 0; }
.ap-siteground .sg-service h3 { margin-bottom: var(--space-1); font-size: var(--type-lead); letter-spacing: normal; }
.ap-siteground .sg-service > p { flex: 1; margin: 0 0 var(--space-3); color: var(--muted); font-size: var(--type-body-small); }
.ap-siteground .sg-service-note { margin: var(--space-4) 0 0; }
.ap-siteground .sg-plan-action { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-4); margin-top: var(--space-5); }
.ap-siteground .sg-pricing-note { margin: 0; color: var(--muted); font-size: var(--type-body-small); }
.ap-siteground .sg-plan-destination { display: flex; flex-direction: column; align-items: center; gap: var(--space-1); flex-shrink: 0; }
.ap-siteground .sg-partner-link { color: var(--muted); font-size: var(--type-body-small); }
.ap-siteground .sg-start-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto 1fr; gap: var(--space-5) var(--space-6); }
.ap-siteground .sg-start-heading h2 { margin: 0; }
.ap-siteground .sg-start-action { grid-column: 1; grid-row: 2; align-self: end; justify-self: start; }
.ap-siteground .sg-start-grid > .sg-steps { grid-column: 2; grid-row: 1 / span 2; }
.ap-siteground .sg-steps { counter-reset: sg-step; list-style: none; padding: 0; margin: 0; }
.ap-siteground .sg-steps li { counter-increment: sg-step; display: flex; align-items: flex-start; gap: var(--space-4); padding-block: var(--space-4); border-bottom: 1px solid var(--line); }
.ap-siteground .sg-steps li:first-child { padding-top: 0; }
.ap-siteground .sg-steps li::before { content: counter(sg-step); display: grid; place-items: center; flex: 0 0 var(--space-6); height: var(--space-6); border-radius: 50%; color: var(--blue-2); background: var(--ice); font-weight: var(--weight-bold); }
.ap-siteground .sg-steps h3 { margin-bottom: var(--space-2); }
.ap-siteground .sg-steps p { margin: 0; }
.ap-siteground .sg-faq-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr); gap: var(--space-6); }
.ap-siteground .sg-faq-list { min-width: 0; }
.ap-siteground .sg-details { border-top: 1px solid var(--line); }
.ap-siteground .sg-details summary { padding-block: var(--space-4); font-weight: var(--weight-semibold); cursor: pointer; }
.ap-siteground .sg-details p { max-width: var(--reading); margin: 0 0 var(--space-4); }
.ap-siteground .sg-closing { color: var(--surface); background: var(--navy); }
.ap-siteground .sg-closing-grid { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); }
.ap-siteground .sg-closing h2 { margin: 0; }
.ap-siteground .sg-closing .sg-partner-link { color: var(--line); }
.ap-siteground .sg-closing .sg-text-link { color: var(--surface); }

@media (max-width: 900px) {
  .ap-siteground .sg-hero-grid { grid-template-columns: 1fr; }
  .ap-siteground .sg-business-media { aspect-ratio: 2 / 1; }
  .ap-siteground .sg-start-grid, .ap-siteground .sg-faq-grid { grid-template-columns: 1fr; gap: var(--space-5); }
  .ap-siteground .sg-start-grid { grid-template-rows: auto; }
  .ap-siteground .sg-start-grid > .sg-steps, .ap-siteground .sg-start-action { grid-column: auto; grid-row: auto; }
  .ap-siteground .sg-plan-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
  .ap-siteground .sg-plan-intro { flex-direction: row; align-items: center; }
  .ap-siteground .sg-hosting-banner { flex-shrink: 0; }
  .ap-siteground .sg-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
}

@media (max-width: 760px) {
  .ap-siteground .sg-card-grid { grid-template-columns: 1fr; }
  .ap-siteground .sg-plan-intro { flex-direction: column; align-items: flex-start; }
  .ap-siteground .sg-hosting-banner { align-self: center; }
  .ap-siteground .sg-plan-action { flex-direction: column; align-items: flex-start; }
  .ap-siteground .sg-card-photo img { aspect-ratio: 16 / 9; }
  .ap-siteground .sg-closing-grid { flex-direction: column; align-items: flex-start; gap: var(--space-5); }
}

@media (max-width: 480px) {
  .ap-siteground main h1 { font-size: var(--type-heading); }
  .ap-siteground .sg-actions { align-items: flex-start; flex-direction: column; }
  .ap-siteground .sg-actions .button { width: 100%; }
  .ap-siteground .sg-plan-destination, .ap-siteground .sg-plan-destination .button { width: 100%; }
  .ap-siteground .sg-start-action { width: 100%; }
  .ap-siteground .sg-plan { grid-template-columns: 1fr; gap: var(--space-3); }
  .ap-siteground .sg-plan-cost { text-align: left; }
  .ap-siteground .sg-plan .sg-price-line { justify-content: flex-start; }
  .ap-siteground .sg-service-grid { grid-template-columns: 1fr; }
  .ap-siteground .sg-service { width: 250px; max-width: 100%; justify-self: center; }
}
.ap-siteground .sg-closing .button-secondary { color: var(--text); }
.ap-siteground .sg-closing .sg-text-link:focus-visible { outline-color: var(--surface); }