/* Home introduction: a contained editorial layout, not a full-width colour slab. */
body .hero {
  width:calc(100% - 8%);
  max-width:1600px;
  margin:40px auto 48px;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(32px,4vw,72px);
  min-height:0;
  background:transparent;
  align-items:center;
}
body .hero-copy {padding:32px 0;background:transparent;color:var(--djup);min-width:0}
body .hero-copy>.eyebrow {font-size:12px;letter-spacing:.12em;color:var(--vass)}
body .hero h1 {font-size:clamp(46px,4.8vw,80px);line-height:1.07;letter-spacing:-.05em;color:var(--vass);margin:24px 0}
body .hero h1 span {display:block}
body .hero-intro {max-width:42ch;font-size:clamp(18px,1.2vw,21px);line-height:1.6;color:var(--muted)}
body .hero-copy .button {margin-top:32px;min-width:0;width:auto;padding:17px 24px;gap:32px}
body .hero-copy .button:focus-visible {outline-color:var(--djup)}
body .hero-note {margin-top:32px;padding-top:24px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;max-width:460px;align-items:center}
body .hero-note .mono {display:none}
body .hero-image {margin:0;aspect-ratio:1.16;min-height:0;overflow:hidden;border-radius:24px}
body .hero-image>img {object-position:50% center}
body .image-label {left:20px;bottom:20px;right:auto;max-width:calc(100% - 40px);min-width:250px;gap:2px 32px;padding:14px 18px;border:1px solid var(--line);border-radius:10px;background:var(--dimma)}
body .image-label strong {font-size:18px}
body .image-label>span:last-child {font-size:24px;color:var(--vass)}
body .benefits {max-width:1600px;margin:auto;padding:24px 4%;border-top:1px solid var(--line);font-size:14px}
@media(max-width:760px) {
  body .hero {width:calc(100% - 10%);margin:24px auto 32px;grid-template-columns:1fr;gap:28px}
  body .hero-copy {padding:8px 0 0}
  body .hero h1 {font-size:clamp(42px,10.5vw,64px);margin:18px 0 22px}
  body .hero-intro {font-size:18px;max-width:42ch}
  body .hero-copy .button {margin-top:24px;font-size:16px}
  body .hero-note {margin-top:24px;padding-top:18px}
  body .hero-image {aspect-ratio:1.1;border-radius:18px}
  body .image-label {left:14px;bottom:14px;max-width:calc(100% - 28px);min-width:0;padding:12px 15px;gap:2px 24px}
  body .image-label strong {font-size:17px}
  body .benefits {padding:22px 5%;gap:10px}
}