/* ========================================================================== campaign.css — THE OCTOBER CAMPAIGN, ON THE HOME PAGE. Adam, 2026-09-08: "2ndbrain homepage does not appear redesigned vs. campaign." He was right. The page had taken a COPY SWAP: October words poured into the old layout. The campaign is a LOOK, and the look is the approved one-pager v15, which he ratified after fourteen rejected versions. NOTHING HERE IS INVENTED. Every token, rule, kicker, yard line, board and ribbon below is lifted from "00 Inbox/Claude Outputs/(C) One-Pager v15 - 2026-09-08.html" and made fluid so it survives 390px as well as 1440px. The v15 spine is: deep purple masthead -> deep purple cover well -> ink flash bar -> CREAM body (four ways in, the October board, the proof ribbon) -> deep purple bands for #PutThemUp and the phone. Gold is ONE accent used sparingly, never a background block. Burnt orange is a second accent in five places only. Kickers are letterspaced mono caps with a hairline running off to the right. Marks are placed files, never redrawn. All of that is TASTE.md, and none of it is re-litigated here. Scoped to .camp* so it cannot reach the other twenty-five pages of this site, which are not campaign surfaces and were not asked to change. ========================================================================== */ .camp { --c-ink:#1D1430; --c-lav:#7A5FA6; --c-lav2:#563F82; --c-gold:#F5D77E; --c-cream:#FBF7EE; --c-deep:#1A1229; --c-body:#3A2F50; --c-line:rgba(29,20,48,.13); --c-rust:#B4542A; --c-pad: clamp(1.15rem, 4vw, 3rem); font-family: var(--font-body); } .camp *, .camp *::before, .camp *::after { box-sizing: border-box; } .camp h1, .camp h2, .camp h3, .camp h4 { letter-spacing:-.022em; margin:0; text-wrap:balance; } .camp p { margin:0; max-width:none; } .camp a { text-decoration:none; } .camp .nb { white-space:nowrap; } /* THE YARD LINE. v15's one structural rule, and the reason fall reads as structure rather than decoration: a 2px ink rule with hash marks hanging under it and one burnt-orange tick where the eye enters. */ .camp .yard { position:relative; border-top:2px solid var(--c-ink); } .camp .yard::before { content:""; position:absolute; left:0; right:0; top:0; height:4.5px; pointer-events:none; background:repeating-linear-gradient(90deg,rgba(29,20,48,.22) 0 1.2px,transparent 1.2px 18px); } .camp .yard::after { content:""; position:absolute; left:0; top:0; width:2px; height:8px; background:var(--c-rust); pointer-events:none; } /* the shared kicker. Sits ABOVE its yard line, per v15. */ .camp .ck { padding-top:0; font-family: var(--font-mono); font-size:clamp(.5rem,1.1vw,.58rem); font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--c-lav); display:flex; align-items:center; gap:10px; margin:0 0 .35rem; } .camp .ck::after { content:""; flex:1; height:1px; background:linear-gradient(90deg,rgba(122,95,166,.4),rgba(122,95,166,0)); } .camp .ck .note { font:600 clamp(.53rem,1.1vw,.6rem)/1.3 var(--font-body); letter-spacing:0; text-transform:none; color:#6B6386; } .camp .ck--gold { color:var(--c-gold); } .camp .ck--gold::after { background:linear-gradient(90deg,rgba(245,215,126,.6),rgba(245,215,126,0)); } .camp .inner { max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); } /* ========================================================================= REGION 1 : THE MASTHEAD FAULT 5. "need to see my big ole brian logo on that dang one pager, cmon now...and the phone number, big and fun like the logo." The brain was a 24px nav mark and the number was a footnote. Here they are a PAIR, edge to edge, so the bar carries no dead middle. ========================================================================= */ /* ===================================================================== THE THREE-HEADER FIX. 2026-09-09. Adam: "i'm annoyed that the site looks like it has literally, 3 headers. yet i somehow like the version it is becomming." MEASURED BEFORE TOUCHING ANYTHING, on production at 1440x900: nav 133px wire 76px campmast 140px h1 top 420px of a 900px viewport 47 PERCENT OF THE FIRST SCREEN WAS CHROME, and it carried the 2ndBrain mark TWICE and the phone number twice before a single word of the pitch. WHERE IT CAME FROM, because the cause is a good instruction applied to the wrong surface. On 2026-09-08 he ruled: "need to see my big ole brian logo on that dang ONE PAGER, cmon now...and the phone number, big and fun like the logo." That is a one-pager ruling. It was applied to the home page too, which already had a nav carrying a small mark and a small phone. Nobody removed the small pair, so the page ended up wearing both. THE RESOLUTION HONOURS BOTH RULINGS RATHER THAN PICKING ONE. He asked for big. So the BIG mark and BIG number stay and the small duplicates go, and the nav and the masthead become one band instead of two stacked ones. Home page only: .campmast exists on no other page, so nothing else moves. ===================================================================== */ /* One band. The nav loses its ground and its border so it reads as the top row of the masthead rather than as a separate bar sitting on top of it. */ /* The nav takes the masthead's OWN ground rather than going transparent. Transparent was the first attempt and it was wrong: the body under this nav is #FFFFFF, so inverting the link ink to #EDE6F8 put light text on white and the whole menu went unreadable. Caught by looking at the render rather than at the rule. The gradient below is lifted from .campmast's ::before so the two rows are one continuous band with no visible seam. */ body:has(.campmast) header.nav { background: radial-gradient(120% 400% at 2% 0%, #3A2A66 0%, rgba(58,42,102,0) 62%), linear-gradient(100deg, #2C1F52 0%, #1D1430 46%, #17101F 100%); border-bottom: 0; box-shadow: none; position: relative; z-index: 3; } /* The small mark and the small phone. Removed, not hidden from layout only: both are duplicates of a larger element sitting directly beneath them. */ body:has(.campmast) header.nav .nav__brand, body:has(.campmast) header.nav .navphone { display: none; } /* With the brand gone the links would jam left against the viewport edge. */ body:has(.campmast) header.nav .nav__links { margin-left: 0; } /* The nav sits ON the masthead's dark ground now, so its ink has to invert. Contrast checked against the masthead ground rather than assumed. */ body:has(.campmast) header.nav a { color: #EDE6F8; } body:has(.campmast) header.nav a:hover { color: #FFC933; } /* The mobile MENU toggle is a