/* Manifesto page — declaration + submissions coda * * NOTE ON DUPLICATION * Blocks marked COPY are verbatim duplicates of rules that live in another page * stylesheet. They are duplicated deliberately: manifesto is the only page loading * this file, so nothing here can leak into a finished page. If you restyle one of * these components, restyle BOTH files. Source of truth is noted per block. * * Media queries live at the END of this file — see Chimera_design_principles.md §7. */ body{font-size:19px;line-height:1.8} /* COPY of article.css .progress */ .progress{position:fixed;top:0;left:0;height:3px;background:var(--ox);width:0;z-index:300} /* COPY of store.css .shero block — text-only hero, no background photo */ .shero{max-width:820px;margin:0 auto;padding:64px 30px 40px;text-align:center} .shero .kicker{font-family:"Roboto Mono",monospace;font-size:12px;letter-spacing:0.3em;text-transform:uppercase;color:var(--ox)} .shero h1{font-family:"Archivo Black",sans-serif;text-transform:uppercase;letter-spacing:-0.05em;font-size:clamp(38px,6vw,64px);line-height:0.9;margin-top:16px;overflow-wrap:anywhere} .shero .sub{font-family:"Roboto Mono",monospace;font-weight:400;font-size:16px;line-height:1.6;letter-spacing:-0.3px;color:var(--bone-soft);margin:22px auto 0;max-width:56ch} /* COPY of article.css .body block — the prose column */ .body{max-width:680px;margin:0 auto;padding:46px 0 10px} .body p{margin-bottom:26px} .body a{color:var(--ox);text-decoration:none;border-bottom:1px solid rgba(186,137,53,0.5);transition:.2s} .body a:hover{color:#000;border-color:#000} /* COPY of article.css .pull block — pull-quote with left ochre rule */ .pull{max-width:680px;margin:44px auto;padding-left:24px;border-left:2px solid var(--ox)} .pull blockquote{font-family:"Roboto Mono",monospace;font-weight:500;font-size:20px;line-height:1.5;letter-spacing:-0.3px;color:var(--bone)} .pull blockquote .ox{color:var(--ox)} /* COPY of store.css .drophead block — centered section-break header */ .drophead{max-width:1000px;margin:0 auto;padding:0 30px;text-align:center} .drophead .dropkicker{font-family:"Roboto Mono",monospace;font-size:11px;letter-spacing:0.24em;text-transform:uppercase;color:var(--bone-dim)} .drophead .dropname{font-family:"Archivo Black",sans-serif;text-transform:uppercase;letter-spacing:-0.04em;font-size:clamp(22px,3.4vw,32px);margin-top:8px} /* COPY of store.css .sactions block — CTA cluster */ .sactions{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:30px} .wa-btn{display:inline-block;background:var(--bone);color:var(--ink);padding:16px 30px;font-family:"Roboto Mono",monospace;font-weight:700;font-size:13px;letter-spacing:0.2em;text-transform:uppercase;transition:.2s} .wa-btn:hover{background:var(--ox)} .ig-link{font-family:"Roboto Mono",monospace;font-size:12px;letter-spacing:0.1em;text-transform:uppercase;color:var(--bone-dim);border-bottom:1px solid transparent;transition:.2s} .ig-link:hover{color:var(--ox);border-color:var(--ox)} /* NEW — submissions coda. Blocks are flat siblings of .body, never nested, so the mobile side padding below is applied exactly once. */ .coda-rule{max-width:680px;margin:72px auto 0;border-top:1px solid var(--line-2)} .coda-head{margin-top:44px} .coda-head.drophead{max-width:680px} /* dev-only: outlines every unreplaced placeholder. Remove class="dev" from (or delete this rule) once the real prose is in. */ .dev [data-placeholder]{outline:1px dashed rgba(186,137,53,.45);outline-offset:4px} /* ---- media queries last (design principles §7) ---- */ @media(max-width:700px){ .body,.coda-rule,.coda-head.drophead{padding-left:24px;padding-right:24px} /* .pull keeps its base padding-left:24px (the gap between rule and text) and gains side margins, so the ochre rule lands on the body text's left edge instead of flush against the viewport. Preserves the desktop relationship. NOTE: article.css does NOT do this — its pull rule sits at x=0 on mobile. */ .pull{margin-left:24px;margin-right:24px;padding-right:24px} /* ---- reading rhythm on phones ---- 19px mono in a 327px column gives ~28 characters per line, which rags badly. 17px gets it to ~32 and reads calmer. The paragraph gap has to exceed the line gap (30.6px here) or paragraphs visually merge into one slab — at the old 26px it was smaller than the leading, which is what read as "tight". */ body{font-size:17px} .body p{margin-bottom:34px} .body{padding-top:40px;padding-bottom:24px} /* breathing room around the pull-quote and into the coda */ .pull{margin-top:48px;margin-bottom:48px} .coda-rule{margin-top:64px} .coda-head{margin-top:40px} .sactions{margin-top:36px} }