:root { --kd-paper: #eeece7; --kd-ink: #292622; --kd-stone: #d9d6d0; --kd-accent: #cfbda0; --kd-line: rgb(41 38 34 / 18%); }
.kd-case { background: #111112; color: var(--kd-ink); }
.kd-case main { background: var(--kd-paper); }
.kd-case .button, .kd-case .menu-toggle { color: var(--kd-ink); background: var(--kd-accent); border-color: var(--kd-accent); }
.kd-case .menu-toggle span { background: var(--kd-ink); }
.kd-shell { width: min(1520px, calc(100% - 96px)); margin-inline: auto; }
.kd-wide { width: min(1760px, calc(100% - 48px)); margin-inline: auto; }
.kd-kicker { margin: 0; font-size: 12px; line-height: 1.5; text-transform: uppercase; letter-spacing: .08em; }
.kd-hero__heading { display: grid; grid-template-columns: 1.4fr 1fr; align-items: end; gap: 48px; padding-block: clamp(42px, 5vw, 80px); }
.kd-hero h1 { margin: 24px 0 0; font: 400 clamp(94px, 12vw, 184px)/.9 var(--display); letter-spacing: -.035em; }
.kd-hero__lead { padding-bottom: 6px; }
.kd-hero__lead p { margin: 0 0 30px; font-size: clamp(28px, 3vw, 48px); line-height: 1.14; letter-spacing: -.02em; }
.kd-hero__lead > span { display: block; font-size: 17px; line-height: 1.5; color: #625c55; }
.kd-photo, .kd-plan { margin: 0; min-width: 0; }
.kd-photo.kd-wide { margin-inline: auto; }
.kd-photo > a, .kd-plan > a { display: block; }
.kd-photo img, .kd-plan img { display: block; width: 100%; height: auto; object-fit: contain; }
.kd-photo figcaption, .kd-plan figcaption { padding-top: 14px; font-size: 14px; line-height: 1.5; }
.kd-hero__photo { width: min(1920px, 100%); margin-inline: auto; }
.kd-hero__photo figcaption { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; padding: 18px 24px; color: #ddd9d2; background: var(--kd-ink); font-size: 12px; letter-spacing: .03em; }
.kd-index { position: static; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--kd-line); }
.kd-index a { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 22px 30px; border-right: 1px solid var(--kd-line); font-size: 14px; text-decoration: none; }
.kd-index a:last-child { border-right: 0; }
.kd-index a span { font-size: 12px; color: #786c5e; }
.kd-index a:is(:hover, :focus-visible) { background: var(--kd-stone); }
.kd-case section[id] { scroll-margin-top: calc(var(--header-h) + 24px); }
.kd-section { padding-block: clamp(64px, 7.5vw, 120px); }
.kd-intro { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(36px, 6vw, 96px); }
.kd-intro > *, .kd-hero__heading > *, .kd-furniture > *, .kd-note > * { min-width: 0; }
.kd-section h2 { margin: 22px 0 0; font: 400 clamp(54px, 6vw, 98px)/1.02 var(--display); letter-spacing: -.03em; }
.kd-copy { padding-top: 38px; }
.kd-copy p { max-width: 640px; margin: 0; font-size: clamp(18px, 1.4vw, 23px); line-height: 1.55; }
.kd-copy p + p { margin-top: 1em; }
.kd-feature { margin-top: clamp(44px, 5vw, 80px); }
.kd-pair, .kd-trio { display: grid; gap: 24px; margin-top: 40px; }
.kd-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kd-trio { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kd-pair.kd-feature, .kd-trio.kd-feature { margin-top: clamp(44px, 5vw, 80px); }
.kd-furniture { display: grid; grid-template-columns: 1fr 2fr; gap: 48px; margin-top: 56px; padding-block: 28px; border-block: 1px solid var(--kd-line); }
.kd-furniture dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px; margin: 0; }
.kd-furniture dt { font: 400 clamp(34px, 3vw, 48px)/1.1 var(--display); letter-spacing: -.02em; }
.kd-furniture dd { max-width: 400px; margin: 16px 0 0; font-size: 17px; line-height: 1.5; }
.kd-layout { background: var(--kd-stone); }
.kd-plans { background: #fff; }
.kd-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kd-tabs[hidden], .kd-plan[hidden] { display: none; }
.kd-tabs button { padding: 22px 26px; border: 1px solid var(--kd-line); border-bottom: 0; background: #eeece7; color: var(--kd-ink); cursor: pointer; font-size: 16px; text-align: left; }
.kd-tabs button + button { border-left: 0; }
.kd-tabs button[aria-selected="true"] { color: #fff; background: var(--kd-ink); }
.kd-tabs button:hover { box-shadow: inset 0 -3px var(--kd-accent); }
.kd-plan figcaption { padding: 16px 24px; border-top: 1px solid var(--kd-line); }
.kd-plan:focus-visible { outline: 2px solid var(--kd-ink); outline-offset: 4px; }
.kd-private { color: #f4f2ee; background: var(--kd-ink); }
.kd-private .kd-kicker { color: var(--kd-accent); }
.kd-private .kd-copy, .kd-private figcaption { color: #dedbd6; }
.kd-note { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 72px; padding-top: 30px; border-top: 1px solid var(--kd-line); }
.kd-note h3 { margin: 0; font: 400 clamp(42px, 4vw, 64px)/1.05 var(--display); letter-spacing: -.025em; }
.kd-note p { max-width: 640px; margin: 0; font-size: clamp(18px, 1.4vw, 23px); line-height: 1.55; }
.kd-end { display: flex; justify-content: space-between; align-items: end; flex-wrap: wrap; gap: 28px; margin-top: 72px; padding-top: 28px; border-top: 1px solid var(--kd-line); }
.kd-end p { margin: 0; font-size: 14px; letter-spacing: .03em; }
.kd-end p span { display: block; margin-top: 8px; font-size: 16px; letter-spacing: 0; }
.kd-end a { font-size: 16px; text-underline-offset: 5px; }
.kd-case > .site-footer { margin-top: 0; padding-block: 40px; color: #c9c8c5; }
.kd-case main a:focus-visible, .kd-tabs button:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
@media (max-width: 1050px) {
  .kd-shell { width: calc(100% - 48px); }
  .kd-hero__heading { gap: 32px; }
  .kd-furniture { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 760px) {
  .kd-hero__heading, .kd-intro, .kd-note { grid-template-columns: 1fr; gap: 28px; }
  .kd-hero h1 { font-size: clamp(86px, 16vw, 130px); }
  .kd-hero__lead p { margin-bottom: 18px; font-size: 26px; line-height: 1.3; }
  .kd-hero__lead p br { display: none; }
  .kd-section { padding-block: 64px; }
  .kd-copy { padding-top: 0; }
  .kd-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kd-index a { padding: 18px 24px; gap: 12px; }
  .kd-index a:nth-child(2) { border-right: 0; }
  .kd-index a:nth-child(-n+2) { border-bottom: 1px solid var(--kd-line); }
  .kd-pair, .kd-trio { grid-template-columns: 1fr; gap: 32px; margin-top: 32px; }
  .kd-trio { width: min(460px, calc(100% - 48px)); }
  .kd-furniture { margin-top: 40px; }
  .kd-furniture dl { grid-template-columns: 1fr; gap: 24px; }
  .kd-furniture dl > div + div { border-top: 1px solid var(--kd-line); padding-top: 24px; }
  .kd-tabs button { padding: 18px; font-size: 15px; }
  .kd-note { margin-top: 52px; gap: 22px; }
  .kd-end { align-items: start; margin-top: 52px; }
}
@media (max-width: 450px) {
  .kd-shell, .kd-wide { width: calc(100% - 32px); }
  .kd-hero__heading { padding-block: 38px; }
  .kd-hero h1 { font-size: clamp(76px, 21vw, 92px); }
  .kd-hero__photo figcaption { padding: 14px 16px; }
  .kd-section h2 { font-size: 48px; }
  .kd-index a { padding-inline: 14px; font-size: 13px; }
  .kd-plan figcaption { padding: 14px 16px; }
}
@media (prefers-reduced-motion: reduce) { .kd-case * { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }
@media print { .site-header, .mobile-menu, .kd-index, .kd-tabs, .kd-end, .site-footer { display: none !important; } .kd-plan[hidden] { display: block; } .kd-case { padding-top: 0; } }