/* Product story: real gallery designs, readable at every viewport. */
.mk-product h2 { font-size:clamp(2.2rem,4vw,3.6rem); line-height:1.05; letter-spacing:-.045em; margin:18px 0 24px; }
.mk-product h1 em,.mk-product h2 em { font-family:Georgia,serif; font-weight:400; letter-spacing:-.045em; }
.mk-product p { line-height:1.65; }
.mk-product-hero { display:grid; grid-template-columns: .9fr 1.1fr; grid-template-areas:'intro covers' 'note covers'; column-gap:48px; align-content:center; padding:64px 0 54px; }
.mk-product-intro { grid-area:intro; align-self:end; }
.mk-product-intro h1 { font-size:clamp(3rem,5.4vw,5.2rem); line-height:1.01; font-weight:600; letter-spacing:-.055em; margin:18px 0 24px; }
.mk-product-intro>p { max-width:460px; font-size:19px; margin:0 0 26px; }
.mk-product .mk-actions { gap:20px; }
.mk-product-start-note { grid-area:note; font-size:13px; color:var(--mk-muted); margin:20px 0 0; max-width:440px; }
.mk-product-start-note strong { color:var(--mk-ink); font-weight:500; }
.mk-product-covers { grid-area:covers; display:grid; grid-template-columns:.83fr 1fr .83fr; gap:14px; padding:30px 5px; align-items:center; min-width:0; }
.mk-product-cover { min-width:0; color:var(--mk-ink); text-decoration:none; transition:transform .2s ease; }
.mk-product-cover:first-child { transform:rotate(-5deg) translateY(22px); }
.mk-product-cover:last-child { transform:rotate(5deg) translateY(22px); }
.mk-product-cover:hover { transform:translateY(-8px); }
.mk-product-cover-image { aspect-ratio: .55; overflow:hidden; border:1px solid #22242024; box-shadow:0 14px 26px #22242013; background:var(--mk-soft); }
.mk-product-cover:nth-child(2) .mk-product-cover-image { aspect-ratio:.49; }
.mk-product-cover-image img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.mk-product-cover>span { display:flex; align-items:center; justify-content:space-between; gap:4px; font-size:12px; margin-top:14px; }
.mk-product-cover>span svg { flex-shrink:0; }
.mk-product-chapters { display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--mk-line); }
.mk-product-chapters a { display:flex; align-items:center; gap:14px; color:var(--mk-ink); text-decoration:none; padding:24px; font-size:15px; }
.mk-product-chapters a+a { border-left:1px solid var(--mk-line); }
.mk-product-chapters a>span { color:var(--mk-muted); font-size:12px; }
.mk-product-chapters a>svg { margin-left:auto; }
.mk-product-chapters a:hover { background:var(--mk-soft); }
.mk-product-story { display:grid; grid-template-columns: .85fr 1.15fr; gap:clamp(36px,6vw,88px); align-items:center; padding:96px 0; scroll-margin-top:24px; }
.mk-product-story-copy>p { color:var(--mk-muted); font-size:17px; max-width:490px; }
.mk-product-brief { margin-top:32px; padding:26px; background:#eeeee5; border-left:2px solid var(--mk-blue); }
.mk-product-brief blockquote { font-size:17px; line-height:1.6; margin:16px 0 20px; }
.mk-product-story-copy>.mk-product-aside { font-size:13px; margin:20px 0 0; }
.mk-product-result { min-width:0; margin:0; }
.mk-product-result>a { display:block; height:570px; overflow:hidden; border:1px solid var(--mk-line); background:var(--mk-soft); }
.mk-product-result img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.mk-product-result figcaption { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; font-size:12px; color:var(--mk-muted); }
.mk-product-edit { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(28px,7vw,100px); padding:56px; background:#e8eedf; scroll-margin-top:24px; }
.mk-product-edit>div>p { max-width:450px; }
.mk-product-plan-note { color:var(--mk-muted); font-size:13px!important; }
.mk-product-requests { padding:16px 0; }
.mk-product-requests blockquote { background:#f8faf4; border:1px solid #cbd2c0; border-radius:12px 12px 2px 12px; font-size:clamp(17px,2vw,23px); line-height:1.4; letter-spacing:-.02em; margin:18px 0; padding:20px 24px; }
.mk-product-requests blockquote:nth-of-type(2) { margin-left:24px; }
.mk-product-requests>p { font-size:13px; color:var(--mk-muted); text-align:right; }
.mk-product-site { grid-template-columns:1.1fr .9fr; }
.mk-product-site .mk-product-result>a { height:490px; }
.mk-product-site-map { margin:28px 0; }
.mk-product-site-map ul { display:grid; grid-template-columns:1fr 1fr; list-style:none; padding:0; gap:10px; margin:14px 0 0; }
.mk-product-site-map li { display:flex; align-items:center; gap:12px; border:1px solid var(--mk-line); padding:15px; font-size:14px; }
.mk-product-delivery { display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,7vw,100px); background:#242b23; color:#f8f8f2; padding:60px; scroll-margin-top:24px; }
.mk-product-delivery .mk-eyebrow { color:#c1c9b9; }
.mk-product-delivery p { color:#d3d9cd; max-width:430px; }
.mk-product-delivery .mk-text-link { color:#e0eebc; }
.mk-product-delivery-options article { display:flex; gap:20px; padding:24px 0; border-bottom:1px solid #51594b; }
.mk-product-delivery-options article:first-child { padding-top:10px; }
.mk-product-delivery-options article:last-child { border-bottom:0; }
.mk-product-delivery-options article>svg { flex-shrink:0; color:#d0e4a9; margin-top:4px; }
.mk-product-delivery-options h3 { font-size:21px; margin:0 0 8px; font-weight:500; }
.mk-product-delivery-options p { font-size:15px; margin:0; }
.mk-product-examples { padding:90px 0; }
.mk-product-examples .mk-design-grid { grid-template-columns:repeat(3,1fr); }
.mk-product-examples .mk-design-window { aspect-ratio:.9; }
.mk-product-all-examples { margin-top:32px; }
.mk-product-close { border-top:1px solid var(--mk-line); text-align:center; padding:70px 0 90px; }
.mk-product-close h2 { font-size:clamp(3rem,6vw,5.5rem); }
.mk-product-close .mk-actions { justify-content:center; margin-top:28px; }
.mk-product-close .mk-product-start-note { max-width:none; }
@media (max-width:1000px) {
  .mk-product-hero { column-gap:24px; padding-top:44px; }
  .mk-product-intro h1 { font-size:clamp(2.8rem,5.8vw,4rem); }
  .mk-product-intro>p { font-size:17px; }
  .mk-product-cover>span { font-size:10px; }
  .mk-product-cover>span svg { display:none; }
  .mk-product-story { gap:32px; padding:64px 0; }
  .mk-product-result>a { height:490px; }
  .mk-product-edit,.mk-product-delivery { padding:32px; gap:32px; }
  .mk-product-examples .mk-design-caption { display:block; }
  .mk-product-examples .mk-design-type { display:none; }
}
@media (max-width:700px) {
  .mk-product-hero { grid-template-columns:1fr; grid-template-areas:'intro' 'covers' 'note'; padding:28px 0 30px; }
  .mk-product-intro h1 { font-size:clamp(2.8rem,10vw,4rem); margin:14px 0 16px; }
  .mk-product-intro>p { font-size:16px; margin-bottom:18px; max-width:490px; }
  .mk-product .mk-actions { gap:12px 20px; }
  .mk-product-intro .mk-actions { flex-direction:row; flex-wrap:wrap; gap:14px; align-items:center; }
  .mk-product-intro .mk-button { min-height:46px; padding:12px 17px; }
  .mk-product-intro .mk-text-link { font-size:13px; }
  .mk-product-covers { gap:12px; padding:30px 7px 14px; max-width:550px; width:100%; margin:auto; }
  .mk-product-cover-image { aspect-ratio:.58; }
  .mk-product-cover:nth-child(2) .mk-product-cover-image { aspect-ratio:.55; }
  .mk-product-cover>span { font-size:11px; }
  .mk-product-start-note { margin-top:18px; }
  .mk-product-chapters { grid-template-columns:1fr; }
  .mk-product-chapters a { padding:17px 0; }
  .mk-product-chapters a+a { border-left:0; border-top:1px solid var(--mk-line); }
  .mk-product-story { grid-template-columns:1fr; padding:52px 0; gap:28px; }
  .mk-product h2 { font-size:2.5rem; margin:14px 0 20px; }
  .mk-product-story-copy>p { font-size:16px; }
  .mk-product-brief { padding:22px; margin-top:24px; }
  .mk-product-brief blockquote { font-size:16px; }
  .mk-product-result>a { height:auto; aspect-ratio:.95; }
  .mk-product-edit,.mk-product-delivery { grid-template-columns:1fr; padding:28px 22px; gap:18px; }
  .mk-product-requests { padding:0; }
  .mk-product-requests blockquote { padding:18px; }
  .mk-product-site .mk-product-result { order:2; }
  .mk-product-site .mk-product-result>a { height:auto; aspect-ratio:1.15; }
  .mk-product-examples { padding:52px 0; }
  .mk-product-examples .mk-design-grid { grid-template-columns:1fr; gap:32px; }
  .mk-product-examples .mk-design-window { aspect-ratio:1.1; }
  .mk-product-close { padding:48px 0 60px; }
  .mk-product-close h2 { font-size:clamp(2.6rem,10vw,4rem); }
}
@media (prefers-reduced-motion:reduce) { .mk-product-cover { transition:none; } }
