/* THE SAREE ATLAS — E16.2 · How a Saree Is Made (how-a-saree-is-made.html only).
   A photographic essay: wide frames, quiet captions, generous space. Uses the E15 tokens (e15.css). */
.mk-page{background:var(--e-paper,#FBF8F2)}
.mk{--mk-ink:var(--e-ink,#1F1917);--mk-ink2:var(--e-ink-2,#3F3431);--mk-muted:var(--e-muted,#6E625B);--mk-garnet:var(--e-garnet,#6E2639);
  --mk-zari:var(--e-zari,#A8823A);--mk-line:var(--e-line,#E2D7C6);--mk-ivory:var(--e-ivory,#F4EEE3);--mk-gut:clamp(16px,4vw,48px);
  display:block;overflow-x:clip;padding-bottom:clamp(40px,6vw,80px);color:var(--mk-ink)}
.mk *,.mk *::before,.mk *::after{box-sizing:border-box}
.mk a{color:var(--mk-garnet);text-decoration-thickness:1px;text-underline-offset:3px}
.mk-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Opening */
.mk-intro{max-width:1240px;margin:0 auto;padding:clamp(28px,4.4vw,64px) var(--mk-gut) clamp(22px,2.6vw,36px);text-align:center}
.mk-intro .eyebrow{font:600 .74rem/1.4 var(--e-text);letter-spacing:.18em;text-transform:uppercase;color:var(--mk-zari)}
.mk-intro h1{margin:.2em auto .06em!important;font:600 clamp(2.9rem,7.4vw,6.2rem)/.98 var(--e-display)!important;letter-spacing:-.01em;color:var(--mk-ink)!important}
.mk-subtitle{font:italic 500 clamp(1.5rem,3.2vw,2.4rem)/1.1 var(--e-display);color:var(--mk-garnet);margin:0 0 .7em}
.mk-standfirst{max-width:44ch;margin:0 auto;font-size:clamp(1.05rem,1.5vw,1.22rem);line-height:1.65;color:var(--mk-ink2)}
.mk-hero{max-width:1480px;margin:0 auto;padding:0 clamp(0px,2vw,24px)}
.mk-hero img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:clamp(0px,.6vw,6px)}
.mk-hero figcaption{max-width:1240px;margin:12px auto 0;padding:0 var(--mk-gut);font:italic 500 1.12rem/1.4 var(--e-display);color:var(--mk-muted);text-align:center}

/* Chapter rail */
.mk-toc{max-width:1040px;margin:clamp(32px,5vw,56px) auto 0;padding:0 var(--mk-gut);text-align:center}
.mk-toc ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px}
.mk-toc ol a{display:inline-flex;align-items:baseline;gap:8px;padding:9px 16px;border:1px solid var(--mk-line);border-radius:999px;
  background:#FFFDF9;color:var(--mk-ink2);font:500 .9rem/1.2 var(--e-text);text-decoration:none;transition:border-color .2s,color .2s}
.mk-toc ol a:hover,.mk-toc ol a:focus-visible{border-color:var(--mk-zari);color:var(--mk-garnet)}
.mk-toc ol a span{font:600 1rem/1 var(--e-display);color:var(--mk-zari)}
.mk-toc-note{margin:14px 0 0;font-size:.86rem;color:var(--mk-muted)}

/* Chapters */
.mk-section{margin-top:clamp(72px,11vw,150px)}
.mk-chapter{max-width:820px;margin:0 auto clamp(36px,5vw,64px);padding:0 var(--mk-gut);text-align:center;scroll-margin-top:96px}
.mk-numeral{margin:0;font:400 clamp(3rem,7vw,5.2rem)/1 var(--e-display);color:var(--mk-zari);letter-spacing:.04em}
.mk-chapter h2{margin:.12em 0 .35em;font:600 clamp(2.1rem,4.6vw,3.5rem)/1.05 var(--e-display);color:var(--mk-ink)}
.mk-chapter h2::after{content:"";display:block;width:56px;height:1px;margin:.5em auto 0;background:var(--mk-zari)}
.mk-chapter-lead{margin:0 auto;max-width:52ch;font-size:clamp(1.02rem,1.4vw,1.15rem);line-height:1.7;color:var(--mk-ink2)}

/* Photographs */
.mk-fig{margin:clamp(48px,7vw,96px) auto 0;padding:0 var(--mk-gut);scroll-margin-top:96px}
.mk-fig img{display:block;width:100%;height:auto;border-radius:4px;background:var(--mk-ivory)}
.mk-fig figcaption{margin-top:16px;max-width:64ch;font-size:.98rem;line-height:1.65;color:var(--mk-ink2)}
.mk-step{display:block;margin-bottom:4px;font:600 .7rem/1.3 var(--e-text);letter-spacing:.16em;text-transform:uppercase;color:var(--mk-garnet)}
.mk-cap-title{display:block;margin-bottom:4px;font:600 1.45rem/1.15 var(--e-display);color:var(--mk-ink)}
.mk-cap-text{display:block}
.mk-wide{max-width:1240px}
.mk-large{max-width:1100px}
.mk-full{max-width:1480px;padding:0 clamp(0px,2vw,24px)}
.mk-full figcaption{padding:0 var(--mk-gut);margin-left:auto;margin-right:auto;text-align:center}
.mk-full img{border-radius:clamp(0px,.6vw,6px)}
.mk-split{max-width:1240px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,4vw,56px);align-items:center}
.mk-split figcaption{margin-top:0}
.mk-split--rev{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.mk-split--rev img{order:2}
.mk-inset{display:block;margin-top:20px;max-width:300px}
.mk-inset img{border-radius:3px;box-shadow:0 10px 28px -14px rgba(31,25,23,.35)}
.mk-inset small{display:block;margin-top:8px;font-size:.84rem;color:var(--mk-muted)}
.mk-pair{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(20px,3vw,40px);padding:0 var(--mk-gut)}
.mk-pair .mk-fig{padding:0;max-width:none;margin-left:0;margin-right:0}
.mk-pair-offset{transform:translateY(clamp(0px,6vw,88px))}
.mk-pair + *{margin-top:clamp(48px,12vw,180px)}
.mk-pair .mk-pair img{aspect-ratio:auto}

/* Diagrams */
.mk-diagram{max-width:1240px;margin:clamp(56px,8vw,112px) auto 0;padding:clamp(22px,3.4vw,44px);display:grid;
  grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:clamp(20px,4vw,52px);align-items:center;background:var(--mk-ivory);
  border:1px solid var(--mk-line);border-radius:10px;scroll-margin-top:96px;width:calc(100% - 2 * var(--mk-gut))}
.mk-diagram--wide{grid-template-columns:minmax(0,3fr) minmax(0,7fr)}
.mk-kicker,.mk-diagram .mk-kicker{margin:0 0 6px;font:600 .7rem/1.3 var(--e-text);letter-spacing:.16em;text-transform:uppercase;color:var(--mk-zari)}
.mk-diagram h3{margin:0 0 .45em;font:600 clamp(1.6rem,2.8vw,2.2rem)/1.08 var(--e-display);color:var(--mk-ink)}
.mk-diagram p{margin:0 0 .8em;font-size:1rem;line-height:1.7;color:var(--mk-ink2)}
.mk-diagram .mk-note{padding-left:12px;border-left:2px solid var(--mk-zari);font-size:.94rem;color:var(--mk-muted)}
.mk-more{margin-top:1em!important;font-weight:600;font-size:.92rem!important}
.mk-more a{text-decoration:none;border-bottom:1px solid currentColor}
.mk-diagram-art{min-width:0}
.mk-svg{display:block;width:100%;height:auto;max-width:640px;margin:0 auto;border-radius:6px}

/* Jamdani aside */
.mk-jamdani{scroll-margin-top:96px}
.mk-jamdani .mk-diagram{margin-top:clamp(28px,4vw,48px)}

/* Coda and endings */
.mk-coda .mk-chapter h2::after{display:none}
.mk-closing{max-width:40ch;margin:clamp(40px,6vw,72px) auto 0;padding:0 var(--mk-gut);text-align:center;
  font:italic 500 clamp(1.35rem,2.6vw,1.9rem)/1.4 var(--e-display);color:var(--mk-ink)}
.mk-explore{max-width:1040px;margin:clamp(72px,10vw,128px) auto 0;padding:0 var(--mk-gut);scroll-margin-top:96px}
.mk-explore h2,.mk-about h2{font:600 clamp(1.6rem,3vw,2.2rem)/1.1 var(--e-display);margin:0 0 .6em;color:var(--mk-ink)}
.mk-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mk-links a{display:block;height:100%;padding:16px 18px;border:1px solid var(--mk-line);border-radius:8px;background:#FFFDF9;text-decoration:none;color:var(--mk-ink2)}
.mk-links a:hover,.mk-links a:focus-visible{border-color:var(--mk-zari)}
.mk-links b{display:block;font:600 1.2rem/1.2 var(--e-display);color:var(--mk-garnet)}
.mk-links span{display:block;margin-top:4px;font-size:.92rem;line-height:1.5}
.mk-further{margin:22px 0 0;font-size:.95rem;line-height:1.7;color:var(--mk-ink2)}
.mk-about{max-width:1040px;margin:clamp(40px,6vw,64px) auto 0;padding:clamp(18px,3vw,28px) var(--mk-gut);border-top:1px solid var(--mk-line);scroll-margin-top:96px}
.mk-about h2{font-size:1.3rem}
.mk-about p{margin:0;font-size:.9rem;line-height:1.7;color:var(--mk-muted)}

@media (max-width:900px){
  .mk-split,.mk-split--rev{grid-template-columns:1fr}
  .mk-split--rev img{order:0}
  .mk-split figcaption{margin-top:4px}
  .mk-diagram,.mk-diagram--wide{grid-template-columns:1fr}
  .mk-inset{max-width:220px}
}
@media (max-width:760px){
  .mk-pair{grid-template-columns:1fr;padding:0 var(--mk-gut)}
  .mk-pair-offset{transform:none}
  .mk-pair + *{margin-top:clamp(48px,7vw,96px)}
  .mk-links{grid-template-columns:1fr}
  .mk-diagram{width:calc(100% - 2 * 12px);padding:18px 14px}
  .mk-toc ol a{padding:8px 13px;font-size:.86rem}
}
@media (prefers-reduced-motion:reduce){.mk-toc a{transition:none}}
@media print{.mk-toc{display:none}.mk-fig,.mk-diagram{break-inside:avoid}}

/* E16.3 — the handloom in operation: the labelled loom, four movements in photographs, the side view as a summary */
.mk-loom{max-width:1240px;margin:clamp(56px,8vw,112px) auto 0;padding:0 var(--mk-gut);scroll-margin-top:96px}
.mk-loom-head,.mk-subhead{max-width:680px;margin:0 auto;text-align:center}
.mk-loom-head h3,.mk-subhead h3{margin:0 0 .4em;font:600 clamp(1.8rem,3.4vw,2.6rem)/1.08 var(--e-display);color:var(--mk-ink)}
.mk-loom-head p:not(.mk-kicker),.mk-subhead p:not(.mk-kicker){margin:0 0 .7em;font-size:1.04rem;line-height:1.7;color:var(--mk-ink2)}
.mk-loom .mk-fig{padding:0;margin-top:clamp(28px,4vw,48px)}
.mk-loom-parts figcaption{max-width:none}
.mk-hint{color:var(--mk-muted);font-size:.9rem}
.mk-key{margin-top:12px;max-width:980px}
.mk-key summary{cursor:pointer;font:600 .95rem/1.4 var(--e-text);color:var(--mk-garnet)}
.mk-key ul{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 28px;font-size:.92rem;line-height:1.5}
.mk-key b{display:block;color:var(--mk-ink)}
.mk-steps{list-style:none;margin:clamp(40px,6vw,72px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,4.4vw,56px) clamp(20px,3vw,40px)}
.mk-stepcard{scroll-margin-top:96px}
.mk-stepcard figure{margin:0}
.mk-stepcard img{display:block;width:100%;height:auto;border-radius:4px;background:var(--mk-ivory)}
.mk-stepcard .mk-step{margin:14px 0 2px}
.mk-stepcard h4{margin:0 0 .2em;font:600 clamp(1.7rem,2.6vw,2.15rem)/1.1 var(--e-display);color:var(--mk-ink)}
.mk-stepcard p:not(.mk-step){margin:0;max-width:46ch;font-size:1rem;line-height:1.65;color:var(--mk-ink2)}
.mk-loom-schematic{max-width:720px;margin:clamp(40px,6vw,72px) auto 0;padding:clamp(16px,3vw,28px);background:var(--mk-ivory);border:1px solid var(--mk-line);border-radius:10px}
.mk-loom-schematic .mk-svg{max-width:560px}
.mk-loom-schematic figcaption{max-width:56ch;margin:12px auto 0;text-align:center;font-size:.92rem;line-height:1.6;color:var(--mk-muted)}
.mk-loom-more{text-align:center}

/* E16.3 — Jacquard; diagrams with two layouts (panels across, stacked on narrower screens) */
.mk-jacquard{max-width:1240px;margin:clamp(72px,10vw,128px) auto 0;scroll-margin-top:96px}
.mk-subhead{padding:0 var(--mk-gut)}
.mk-jacq-photos{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,3vw,40px);align-items:end;padding:0 var(--mk-gut)}
.mk-jacq-photos .mk-fig{max-width:none;margin:clamp(28px,4vw,48px) 0 0;padding:0}
.mk-diagram--stack{grid-template-columns:1fr}
.mk-diagram--stack .mk-diagram-text{max-width:72ch}
.mk-diagram--stack .mk-svg{max-width:1100px}
.mk-svg--tall{display:none}
.mk-diagram-text--inset{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(20px,3vw,40px);align-items:start;max-width:none!important}
.mk-inset-fig{margin:0}
.mk-inset-fig img{display:block;width:100%;height:auto;border-radius:6px}
.mk-inset-fig figcaption{margin-top:8px;font-size:.84rem;line-height:1.5;color:var(--mk-muted)}
@media (max-width:1000px){.mk-key ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .mk-svg--wide{display:none}
  .mk-svg--tall{display:block;max-width:420px!important}
}
@media (max-width:760px){
  .mk-steps,.mk-key ul,.mk-jacq-photos,.mk-diagram-text--inset{grid-template-columns:1fr}
  .mk-inset-fig{max-width:360px}
}

/* E16.3 — how borders and pallus take shape: two paired comparisons (ordinary beside korvai, ordinary beside petni) */
.mk-bp{max-width:1240px;margin:clamp(72px,10vw,128px) auto 0;scroll-margin-top:96px}
.mk-bp .mk-diagram{margin-top:clamp(28px,4vw,48px)}
.mk-svg--pair{max-width:860px!important}
@media (max-width:900px){.mk-svg--pair.mk-svg--tall{max-width:420px!important}}
.mk-zoom{position:relative}

/* E16.3.1 — brocade and its motifs (chapter IV) */
.mk-ornament .mk-pair{margin-top:clamp(28px,4vw,48px)}
