/* ATRION websites preview — editorial page with cleaner hierarchy and fewer template-like repetitions. */
.page-websites h1, .page-websites h2, .page-websites h3, .page-websites dt { overflow-wrap: break-word; }
.page-websites .service-hero { padding-bottom: clamp(92px, 10vw, 144px); }
.page-websites .service-hero h1 { max-width: 980px; line-height: 1.08; }
.page-websites .service-hero__offer { max-width: 860px; margin-top: 20px; line-height: 1.18; }
.page-websites .service-hero__lead { max-width: 58ch; }

.website-formats { margin: 62px 0 0; }
.website-formats > div { display: grid; grid-template-columns: minmax(240px,.7fr) minmax(0,1.3fr); gap: 36px 72px; padding-block: 32px; border-top: 1px solid var(--hairline); }
.website-formats > div:last-child { border-bottom: 1px solid var(--hairline); }
.website-formats dt { margin: 0; font: 600 22px/1.35 var(--font-body); }
.website-formats dd { margin: 0; max-width: 66ch; }
.website-formats dd p { margin: 0; color: var(--muted-strong); font-size: 16px; line-height: var(--body-leading); }
.website-formats dd p + p { margin-top: 12px; color: var(--muted); }

.website-approach { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: clamp(56px, 9vw, 128px); align-items: start; }
.website-approach > div:first-child { position: sticky; top: 118px; }
.website-steps { display: grid; gap: 0; }
.website-steps section { padding: 30px 0; border-top: 1px solid var(--hairline); }
.website-steps section:first-child { padding-top: 0; border-top: 0; }
.website-steps h3 { margin: 0; font: 600 21px/1.35 var(--font-body); }
.website-steps p { margin: 12px 0 0; color: var(--muted); font-size: 16px; line-height: var(--body-leading); }

.website-scope { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: clamp(48px, 8vw, 112px); align-items: start; }
.website-scope > div { max-width: 68ch; padding: 30px 0 0 34px; border-left: 1px solid var(--hairline); }
.website-scope p { margin: 0; color: var(--muted-strong); font-size: 16px; line-height: var(--body-leading); }
.website-scope p + p { margin-top: 1.15em; }
.website-scope a { color: var(--ink); text-underline-offset: 4px; }

@media (max-width: 900px) {
  .page-websites .service-hero { padding-bottom: 72px; }
  .website-formats { margin-top: 40px; }
  .website-formats > div { grid-template-columns: 1fr; gap: 12px; padding-block: 26px; }
  .website-formats dt { font-size: 20px; }
  .website-approach, .website-scope { grid-template-columns: 1fr; gap: 32px; }
  .website-approach > div:first-child { position: static; }
  .website-steps section { padding-block: 24px; }
  .website-scope > div { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--hairline); }
}