/* DCHost customer guidance: server-rendered content and native disclosures. */
.dc-service-notes { padding: 64px var(--dc-gutter, 28px); background: var(--dc-surface); color: var(--dc-ink); }
.dc-service-notes .dc-notes-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.35fr); align-items: start; gap: clamp(28px, 4vw, 64px); padding: 0; }
.dc-service-notes .dc-notes-lead { position: relative; overflow: hidden; padding: 32px; border: 1px solid var(--dc-line); border-radius: 16px; background: var(--dc-soft); }
.dc-service-notes .dc-notes-lead::after { content: ""; position: absolute; right: -80px; bottom: -110px; width: 300px; height: 300px; background: url('/assets/images/theme/favicon.svg') center / contain no-repeat; opacity: .045; pointer-events: none; }
.dc-service-notes .dc-notes-kicker { margin: 0 0 16px; color: var(--dc-action); font: 600 12px/1.6 var(--secondary-font); letter-spacing: .08em; text-transform: uppercase; }
.dc-service-notes h2 { margin: 0 0 20px; color: var(--dc-ink); font: 600 clamp(25px, 2.3vw, 34px)/1.3 var(--primary-font); letter-spacing: -.025em; overflow-wrap: break-word; }
.dc-service-notes .dc-notes-intro { margin: 0; color: var(--dc-muted); font: 400 16px/1.8 var(--secondary-font); }
.dc-service-notes .dc-notes-art { display: block; width: 192px; height: 140px; margin: 30px 0 0; object-fit: contain; }
.dc-service-notes .dc-notes-topic { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 20px; padding: 24px 0; border-top: 1px solid var(--dc-line); }
.dc-service-notes .dc-notes-topic:first-child { padding-top: 0; border-top: 0; }
.dc-service-notes .dc-notes-marker { display: grid; place-items: center; align-self: start; width: 40px; height: 40px; border: 1px solid var(--dc-line); border-radius: 50%; background: var(--dc-soft); color: var(--dc-action); font: 500 12px/1 var(--secondary-font); }
.dc-service-notes h3 { margin: 4px 0 10px; color: var(--dc-ink); font: 600 19px/1.5 var(--primary-font); }
.dc-service-notes .dc-notes-topic p, .dc-service-notes details p { margin: 0; color: var(--dc-muted); font: 400 15px/1.85 var(--secondary-font); }
.dc-service-notes a { color: var(--dc-action); text-decoration: underline; text-underline-offset: .22em; font: 500 14px/1.7 var(--secondary-font); }
.dc-service-notes a:hover { text-decoration-thickness: 2px; }
.dc-service-notes .dc-notes-topic a, .dc-service-notes details a { display: inline-block; margin-top: 12px; }
.dc-service-notes .dc-notes-details { border-top: 1px solid var(--dc-line); }
.dc-service-notes details { margin: 0; border-bottom: 1px solid var(--dc-line); }
.dc-service-notes summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 60px; padding: 16px 0; color: var(--dc-ink); font: 500 15px/1.6 var(--secondary-font); list-style: none; cursor: pointer; }
.dc-service-notes summary::-webkit-details-marker { display: none; }
.dc-service-notes summary::marker { content: ""; }
.dc-service-notes .dc-notes-toggle { position: relative; flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; color: var(--dc-action); background: var(--dc-accent); }
.dc-service-notes .dc-notes-toggle::before, .dc-service-notes .dc-notes-toggle::after { content: ""; position: absolute; left: 7px; top: 11px; width: 10px; height: 2px; background: currentColor; }
.dc-service-notes .dc-notes-toggle::after { transform: rotate(90deg); }
.dc-service-notes details[open] .dc-notes-toggle::after { display: none; }
.dc-service-notes details > div { padding: 0 30px 22px 0; }
.dc-service-notes a:focus-visible, .dc-service-notes summary:focus-visible { outline: 2px solid var(--dc-action); outline-offset: 4px; border-radius: 3px; }
.dc-service-notes .dc-notes-related { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 24px; }
.dc-service-notes--compact { padding: 28px 0; background: transparent; }
.dc-service-notes--compact .dc-notes-layout { gap: 28px; }
.dc-service-notes--compact .dc-notes-lead { padding: 24px; }
.dc-service-notes--compact h2 { font-size: 23px; }
.dc-service-notes--compact .dc-notes-art { width: 112px; height: 82px; margin-top: 20px; }
.dc-service-notes--compact .dc-notes-intro { font-size: 14px; }
@media (max-width: 991px) {
  .dc-service-notes .dc-notes-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .dc-service-notes .dc-notes-lead { padding-right: 222px; min-height: 202px; }
  .dc-service-notes .dc-notes-art { position: absolute; right: 28px; top: 50%; transform: translateY(-50%); margin: 0; width: 152px; height: 112px; }
  .dc-service-notes--compact .dc-notes-lead { padding-right: 156px; min-height: 148px; }
  .dc-service-notes--compact .dc-notes-art { width: 100px; height: 74px; }
}
@media (max-width: 600px) {
  .dc-service-notes { padding: 44px 20px; }
  .dc-service-notes .dc-notes-lead { padding: 24px; min-height: 0; }
  .dc-service-notes .dc-notes-art { position: static; width: 132px; height: 96px; transform: none; margin: 22px 0 0; }
  .dc-service-notes h2 { font-size: 26px; }
  .dc-service-notes .dc-notes-topic { gap: 14px; grid-template-columns: 32px minmax(0, 1fr); }
  .dc-service-notes .dc-notes-marker { width: 32px; height: 32px; }
  .dc-service-notes h3 { margin-top: 0; font-size: 18px; }
  .dc-service-notes--compact { padding: 22px 0; }
  .dc-service-notes--compact h2 { font-size: 22px; }
  .dc-service-notes--compact .dc-notes-art { width: 96px; height: 70px; }
}

/* Purchase guidance uses the existing DCHost identity and local fonts. */
.dc-purchase { padding: 48px var(--dc-gutter, 28px) 64px; background: var(--dc-surface); }
.dc-purchase-shell { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); border: 1px solid var(--dc-line); border-radius: 16px; overflow: hidden; }
.dc-purchase-lead { position: relative; isolation: isolate; overflow: hidden; padding: clamp(28px, 3vw, 48px); background: #1b2741; }
.dc-purchase-lead::after { content: ""; position: absolute; z-index: -1; right: -100px; bottom: -160px; width: 460px; height: 460px; background: url('/assets/images/theme/favicon.svg') center / contain no-repeat; opacity: .07; pointer-events: none; }
.dc-purchase .dc-purchase-brand { display: flex; align-items: center; gap: 20px; margin-bottom: 24px; }
.dc-purchase-brand img { flex: 0 0 96px; width: 96px; height: 72px; object-fit: contain; padding: 4px; border-radius: 6px 22px 6px 6px; background: #eae7ff; }
.dc-purchase .dc-purchase-brand p { margin: 0; color: #d0c7ff; font: 600 12px/1.7 var(--secondary-font); letter-spacing: .07em; text-transform: uppercase; }
.dc-purchase h2 { margin: 0 0 18px; color: #fff; font: 600 clamp(26px, 2.5vw, 38px)/1.25 var(--primary-font); letter-spacing: -.025em; text-wrap: balance; }
.dc-purchase .dc-purchase-intro { margin: 0; max-width: 65ch; color: #d5dcea; font: 400 16px/1.8 var(--secondary-font); }
.dc-purchase-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 24px; margin-top: 28px; }
.dc-purchase a { font: 500 14px/1.5 var(--secondary-font); }
.dc-purchase .dc-purchase-primary { display: inline-flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 48px; max-width: 100%; padding: 14px 20px; border: 1px solid #eae7ff; border-radius: 8px; background: #eae7ff; color: #292052; text-decoration: none; }
.dc-purchase .dc-purchase-primary span { flex-shrink: 0; font-size: 19px; }
.dc-purchase .dc-purchase-primary:hover { background: #fff; border-color: #fff; color: #292052; }
.dc-purchase .dc-purchase-secondary { padding: 10px 0; color: #e4defb; text-decoration: underline; text-underline-offset: 4px; }
.dc-purchase a:focus-visible { outline: 3px solid #d0c7ff; outline-offset: 4px; }
.dc-purchase-steps { display: flex; flex-direction: column; justify-content: center; margin: 0; padding: 18px clamp(24px, 3vw, 44px); list-style: none; background: var(--dc-soft); }
.dc-purchase-steps li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 20px; padding: 24px 0; border-bottom: 1px solid var(--dc-line); }
.dc-purchase-steps li:last-child { border-bottom: 0; }
.dc-purchase-number { padding-top: 3px; color: var(--dc-action); font: 500 13px/1.6 var(--secondary-font); }
.dc-purchase h3 { margin: 0 0 8px; color: var(--dc-ink); font: 600 18px/1.5 var(--primary-font); }
.dc-purchase-steps p { margin: 0; color: var(--dc-muted); font: 400 15px/1.8 var(--secondary-font); }
@media (max-width: 991px) {
  .dc-purchase-shell { grid-template-columns: minmax(0, 1fr); }
  .dc-purchase .dc-purchase-intro { max-width: none; }
}
@media (max-width: 600px) {
  .dc-purchase { padding: 32px 20px 44px; }
  .dc-purchase-lead { padding: 26px 24px; }
  .dc-purchase .dc-purchase-brand { gap: 16px; }
  .dc-purchase-brand img { flex-basis: 80px; width: 80px; height: 60px; }
  .dc-purchase-steps { padding: 4px 24px; }
  .dc-purchase-steps li { grid-template-columns: 24px minmax(0, 1fr); gap: 12px; }
  .dc-purchase .dc-purchase-primary { width: 100%; padding: 14px 16px; }
}
