/* kor-whitening.html page styles. Owned by wave C (interiors-plan.md); loaded after
   tokens.css, site.css and interior.css on kor-whitening.html only. Shared selectors
   (chrome, .sheet, .canvas-wrap, .int-*, .contact) are wave A's: never restyle
   them here; file a request to the main session instead.

   mvendo-int/01 lesson stack (v2-specs/interiors-spec-kor-whitening.md): 16:9 media card,
   prose, GEO capsule, back pill. All widths authored px (Pass 1b: fixed at every desktop
   viewport; page height independent of viewport height). */

.kw-well { max-width: 1000px; margin: 0 auto; }

/* media card: 1000x562.5, house shadow, square corners, inset cover media */
.kw-media { margin: 0; position: relative; aspect-ratio: 16 / 9; box-shadow: var(--shadow-card); overflow: hidden; }
.kw-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }

/* prose: Lato 18/25.2, left, full well */
.kw-prose { margin-top: 44px; font-size: 18px; line-height: 25.2px; color: var(--body-ink); }
.kw-prose p { margin: 0 0 14px; }
.kw-prose > :last-child { margin-bottom: 0; }
.kw-prose a { color: var(--teal); text-decoration: underline; }
.kw-lede { font-weight: 700; color: var(--teal-deep); }
.kw-h {
  margin: 24px 0 14px; font-family: var(--font-display); font-weight: 400;
  font-size: 24px; line-height: 30px; color: var(--teal-deep);
}

/* GEO capsule: stadium card, radius 30, centred 18px. Landed 90.4 at 2 lines = 20 + 50.4 + 20
   (recipe 10/15 padding + inner block margins, collapsed into one padding) */
.kw-capsule {
  margin: 36px 0 0; padding: 20px 15px;
  background: #fff; border-radius: 30px; box-shadow: var(--shadow-card);
  font-size: 18px; line-height: 25.2px; text-align: center; color: var(--body-ink);
}
.kw-capsule a { color: var(--teal); text-decoration: underline; }

.kw-back { margin-top: 31px; }

@media (max-width: 600px) {
  .kw-media { margin: 0 -12px; }          /* media bleeds to the sheet edges */
  .kw-prose { margin-top: 28px; }
  .kw-capsule { margin-top: 28px; padding: 20px 20px; }   /* multi-line text clears the r30 corners */
  .kw-back { margin-top: 28px; }
}
