/* ─────────────────────────────────────────────────────────────
   collections-styles.css — /collections index + the static
   /collections/<slug> pages.

   Serves BOTH: the SPA index shell (Collections.html) and the
   generated static detail pages, which ship this file + styles.css
   and zero JS — the /map/<slug> pattern.

   Accessibility: --muted is NOT used for text anywhere here (it is
   3.95:1). Meta and label text uses --text3; --muted is reserved
   for separators and hairlines. Interactive rows clear 44px.
   ───────────────────────────────────────────────────────────── */

/* ───────── header (mirrors .disp-head; registered in the styles.css mobile block) ───────── */
.col-head{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:16px 30px;background:color-mix(in srgb,var(--bg),transparent 12%);backdrop-filter:blur(14px);border-bottom:1px solid color-mix(in srgb,var(--border),transparent 50%)}
.col-brand{font-family:"Cinzel",serif;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--text);text-decoration:none;display:inline-flex;align-items:baseline;gap:10px;white-space:nowrap;flex-shrink:0}
.col-brand .sep{color:var(--text3)}
.col-brand .sub{color:var(--text3)}
.col-nav{display:flex;gap:16px 18px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.col-nav a{font-family:"Jost",sans-serif;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text3);text-decoration:none;position:relative;padding:4px 0}
.col-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--accent);transition:right 300ms ease}
.col-nav a:hover,.col-nav a.active{color:var(--accent-hi)}
.col-nav a:hover::after,.col-nav a.active::after{right:0}
@media(max-width:1100px){.col-brand .sep,.col-brand .sub{display:none}.col-nav{gap:18px}}

/* ───────── shared shell ───────── */
.col-wrap{max-width:1180px;margin:0 auto;padding:52px 30px 110px}
.col-read{max-width:66ch;margin:0 auto;padding:44px 30px 110px}
@media(max-width:820px){.col-wrap{padding:34px 20px 76px}.col-read{padding:30px 20px 76px}}
.col-eyebrow{display:flex;align-items:center;gap:10px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}
.col-eyebrow .swatch{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}

/* ───────── index hero ───────── */
.col-hero{max-width:78ch;margin-bottom:64px}
.col-hero h1{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(38px,5.4vw,62px);line-height:1.06;letter-spacing:.01em;color:var(--cream);margin:0 0 26px}
.col-hero p{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:300;font-size:clamp(19px,2vw,23px);line-height:1.72;color:var(--text2);margin:0 0 18px;text-wrap:pretty}
.col-rule{height:1px;background:linear-gradient(90deg,var(--border2),transparent);margin:0 0 52px}

/* ───────── index list ───────── */
.col-label{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--text3);margin:0 0 26px;display:flex;align-items:center;gap:14px}
.col-label::after{content:"";flex:1;height:1px;background:var(--border)}
.col-list{display:grid;gap:22px}
.col-card{display:block;text-decoration:none;border:1px solid var(--border);background:color-mix(in srgb,var(--bg2),transparent 30%);padding:30px 34px 32px;position:relative;transition:border-color 260ms ease,background 260ms ease,transform 260ms ease}
.col-card:hover{border-color:var(--accent-lo);background:color-mix(in srgb,var(--bg3),transparent 34%);transform:translateY(-2px)}
.col-card-top{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.col-num{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;color:var(--accent)}
.col-kind{font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);border:1px solid var(--border2);padding:4px 9px}
.col-card h2{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(23px,2.5vw,30px);line-height:1.2;color:var(--cream);margin:0 0 12px;transition:color 260ms ease}
.col-card:hover h2{color:var(--accent-hi)}
.col-card .col-stand{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:300;font-size:19px;line-height:1.68;color:var(--text2);margin:0 0 20px;max-width:62ch;text-wrap:pretty}
.col-card-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-family:"Jost",sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3)}
.col-card-foot .go{color:var(--accent);margin-left:auto}

/* ───────── detail page ───────── */
.col-crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text3);margin-bottom:30px}
.col-crumb a{color:var(--text3);text-decoration:none;display:inline-flex;align-items:center;min-height:32px}
.col-crumb a:hover{color:var(--accent-hi)}
.col-crumb .sep{color:var(--faint)}
.col-title{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(32px,4.6vw,52px);line-height:1.1;color:var(--cream);margin:0 0 20px;text-wrap:pretty}
.col-standfirst{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:300;font-size:clamp(20px,2.2vw,25px);line-height:1.6;color:var(--accent-hi);margin:0 0 34px;text-wrap:pretty}
.col-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text3);padding-bottom:30px;border-bottom:1px solid var(--border);margin-bottom:40px}
.col-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--faint)}

/* prose */
.col-prose p{font-family:"Cormorant Garamond",serif;font-weight:300;font-size:20.5px;line-height:1.78;color:var(--text2);margin:0 0 22px;text-wrap:pretty}
.col-prose p strong{font-weight:500;color:var(--text);font-style:normal}
.col-prose p em{font-style:italic}
.col-prose a{color:var(--accent);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--accent),transparent 62%)}
.col-prose a:hover{color:var(--accent-hi);border-bottom-color:var(--accent-hi)}
.col-framing{margin-bottom:56px}
.col-framing p:first-child{font-size:22px;color:var(--text)}

/* section heads */
.col-sec{margin:0 0 54px}
.col-sec > h2{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(20px,2.2vw,26px);letter-spacing:.02em;color:var(--cream);margin:0 0 8px}
.col-sec > .col-sec-rule{height:1px;background:linear-gradient(90deg,var(--border2),transparent);margin:0 0 28px}
.col-sec-intro{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:300;font-size:19px;line-height:1.7;color:var(--text3);margin:0 0 28px;text-wrap:pretty}

/* entry cards — the doors */
.col-entries{display:grid;gap:30px}
.col-entry{border-left:1px solid var(--border2);padding:2px 0 2px 26px;position:relative}
.col-entry:hover{border-left-color:var(--accent-lo)}
.col-entry-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.col-entry-num{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;color:var(--accent)}
.col-entry h3{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(19px,2vw,24px);line-height:1.24;margin:0}
.col-entry h3 a{color:var(--cream);text-decoration:none;border-bottom:1px solid transparent;transition:color 220ms ease,border-color 220ms ease}
.col-entry h3 a:hover{color:var(--accent-hi);border-bottom-color:var(--accent-lo)}
.col-entry-meta{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:17px;color:var(--text3);margin:0 0 14px}
.col-entry-meta em{font-style:italic}
.col-entry .col-prose p{font-size:19.5px;margin-bottom:16px}
.col-entry .col-prose p:last-child{margin-bottom:0}
.col-entry-more{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-family:"Jost",sans-serif;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);text-decoration:none}
.col-entry-more:hover{color:var(--accent-hi)}
.col-entry-more .rt{font-family:"JetBrains Mono",monospace}

/* quotes — Gibran / Ecclesiastes / Tao / Heraclitus / Seneca only */
.col-quote{border-left:2px solid var(--accent-lo);padding:2px 0 2px 22px;margin:0 0 20px}
.col-quote .st{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:300;font-size:20px;line-height:1.66;color:var(--text);margin:0 0 14px}
.col-quote .st:last-child{margin-bottom:0}
.col-quote .st span{display:block}

/* list-style entry group (compact) */
.col-rows{display:grid;gap:2px}
.col-row{display:block;padding:18px 0;border-bottom:1px solid var(--border);min-height:44px}
.col-row:first-child{border-top:1px solid var(--border)}
.col-row-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:7px}
.col-row-head h3{font-family:"Cinzel",serif;font-weight:500;font-size:17.5px;line-height:1.3;margin:0}
.col-row-head h3 a{color:var(--cream);text-decoration:none}
.col-row-head h3 a:hover{color:var(--accent-hi)}
.col-row-meta{font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text3)}
.col-row .col-prose p{font-size:18.5px;margin:0;color:var(--text3)}
.col-row-links{display:flex;gap:14px;flex-wrap:wrap;margin-top:9px}
.col-row-links a{font-family:"Jost",sans-serif;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.col-row-links a:hover{color:var(--accent-hi)}

/* close + coda */
.col-close{margin-top:12px;padding-top:34px;border-top:1px solid var(--border)}
.col-close h2{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(19px,2vw,23px);color:var(--cream);margin:0 0 20px}
.col-coda{margin-top:44px;padding-top:26px;border-top:1px solid var(--border);font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:300;font-size:19px;line-height:1.7;color:var(--text3);text-wrap:pretty}
.col-coda a{color:var(--accent);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--accent),transparent 62%)}
.col-coda a:hover{color:var(--accent-hi)}
.col-glyph{text-align:center;color:var(--accent-lo);font-size:15px;letter-spacing:.4em;margin:44px 0}

/* back-to-index */
.col-back{margin-top:52px;padding-top:26px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.col-back a{font-family:"Jost",sans-serif;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.col-back a:hover{color:var(--accent-hi)}

/* footer */
.col-foot{border-top:1px solid var(--border);padding:40px 30px 56px;text-align:center}
.col-foot .fb{font-family:"Cinzel",serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--text3);margin-bottom:10px}
.col-foot .fc{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:16px;color:var(--text3);margin-bottom:18px}
.col-foot nav{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.col-foot nav a{font-family:"Jost",sans-serif;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text3);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.col-foot nav a:hover{color:var(--accent-hi)}