/* Grupo Cerne — shared stylesheet Palette: default = timber (heartwood). Add class "palette-green" on for the green direction. Type: Newsreader (display serif) + Inter (body sans), self-hosted woff2. No external origins. */ /* ---------- Self-hosted fonts ---------- */ @font-face{font-family:"Newsreader";src:url("fonts/newsreader-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap} @font-face{font-family:"Newsreader";src:url("fonts/newsreader-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap} @font-face{font-family:"Newsreader";src:url("fonts/newsreader-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap} @font-face{font-family:"Inter";src:url("fonts/inter-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap} @font-face{font-family:"Inter";src:url("fonts/inter-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap} @font-face{font-family:"Inter";src:url("fonts/inter-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap} /* ---------- Tokens — timber (default) ---------- */ :root{ --bg:#F6F2EA; --ink:#1A1611; --accent:#8A5A2B; --accent-deep:#5F3D1E; --muted:#6E675F; --rule:rgba(26,22,17,.14); --serif:"Newsreader",Georgia,"Times New Roman",serif; --sans:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif; --measure:64ch; --prose:680px; } /* ---------- Tokens — green (forest / heartwood) ---------- */ html.palette-green{ --bg:#F5F3EC; --ink:#15140F; --accent:#2A4A3A; --accent-deep:#1A3328; --muted:#6B655C; --rule:rgba(21,20,15,.14); } *{box-sizing:border-box} html{-webkit-text-size-adjust:100%} body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.6; font-feature-settings:"kern" 1,"liga" 1; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; } ::selection{background:rgba(138,90,43,.16);color:var(--ink)} .palette-green ::selection{background:rgba(42,74,58,.16)} /* skip link */ .skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--bg); padding:.55rem 1rem;border-radius:2px;z-index:20;text-decoration:none} .skip:focus{left:.6rem;top:.6rem} /* layout */ .wrap{max-width:var(--prose);margin:0 auto;padding:0 32px} @media(max-width:600px){.wrap{padding:0 24px}} /* header / topbar */ .site-header{padding:30px 0 6px} .topbar{max-width:var(--prose);margin:0 auto;padding:0 32px; display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;flex-wrap:wrap} @media(max-width:600px){.topbar{padding:0 24px}} .wordmark{display:inline-flex;align-items:center;gap:9px;font-family:var(--serif); font-style:italic;font-weight:400;font-size:1.3rem;color:var(--accent); text-decoration:none;letter-spacing:.01em;white-space:nowrap} .wordmark::before{content:"";width:23px;height:23px;flex:none; background:url("mark.svg") center/contain no-repeat} @media(max-width:600px){.wordmark::before{width:21px;height:21px}} .nav-primary{display:flex;flex-wrap:wrap;align-items:baseline;gap:.55rem;font-size:.85rem} .nav-primary a{color:var(--muted);text-decoration:none} .nav-primary a:hover{color:var(--accent)} .nav-primary a[aria-current="page"]{color:var(--ink)} .nav-primary .sep{color:var(--rule)} .lang{font-size:.85rem;white-space:nowrap;color:var(--rule)} .lang a{color:var(--muted);text-decoration:none} .lang a[aria-current="true"]{color:var(--ink)} .lang a:hover{color:var(--accent)} @media(max-width:600px){.nav-primary{display:none}} /* page body */ .page{padding:26px 0 8px} .prose{} .eyebrow{font-family:var(--serif);font-variant:small-caps;letter-spacing:.12em; color:var(--muted);font-size:.84rem;margin:0 0 1rem} .hero-eyebrow{color:var(--accent-deep);font-size:.9rem;margin-bottom:1.1rem} h1{font-family:var(--serif);font-weight:400;font-size:clamp(36px,6vw,56px); line-height:1.05;letter-spacing:-.02em;margin:.1em 0 .65em;text-wrap:balance} h2{font-family:var(--serif);font-weight:600;font-size:1.4rem;line-height:1.22; letter-spacing:-.01em;margin:0 0 .5rem;text-wrap:balance;scroll-margin-top:1.5rem} p{margin:0 0 1.15rem;max-width:var(--measure);text-wrap:pretty} .lede{font-size:1.2rem;line-height:1.5;color:var(--ink)} /* home stanzas */ .stanza{margin:0 0 1.55rem} .stanza .eyebrow{margin:0 0 .3rem} .stanza p:last-child{margin-bottom:0} .closing{margin-top:2.4rem} /* drop cap — long-form first paragraph */ .dropcap::first-letter{font-family:var(--serif);font-weight:400;float:left; font-size:3.7em;line-height:.8;padding:.04em .12em 0 0;color:var(--accent-deep)} /* principle / numbered section */ .principle{margin:0 0 1.9rem} .principle h2 .num{color:var(--accent);font-variant:small-caps;letter-spacing:.08em;font-weight:600} .principle h2 .sep{color:var(--rule);font-weight:400} /* anchor on headings (CSS-only reveal) */ .anchored{position:relative} .anchored .anchor{position:absolute;left:-1.1em;opacity:0;color:var(--muted); text-decoration:none;font-weight:400} .anchored:hover .anchor,.anchored .anchor:focus-visible{opacity:1} :target{background:transparent} h2:target{box-shadow:-.5rem 0 0 var(--accent)} /* founders photo */ .founder{display:flex;gap:28px;align-items:flex-start;margin:0 0 2.2rem} .founder-portrait{flex:none;width:172px;margin:0} .founder-portrait img{width:172px;height:auto;display:block;border:1px solid var(--rule); border-radius:4px;filter:saturate(.96)} .founder-portrait figcaption{font-family:var(--serif);font-style:italic;font-size:.82rem; color:var(--muted);margin-top:.5rem;line-height:1.35} .founder-bio{min-width:0} .founder-bio>h2:first-child{margin-top:0} @media(max-width:560px){.founder{gap:16px}.founder-portrait{width:118px}.founder-portrait img{width:118px}} /* signed letter (about) */ .letter p{max-width:64ch} .signoff{font-family:var(--serif);font-style:italic;color:var(--muted);margin-top:1.7rem} .signoff span{font-style:normal;font-variant:small-caps;letter-spacing:.04em;color:var(--accent-deep)} .rooted{font-family:var(--serif);font-style:italic;font-size:1.12rem;line-height:1.4;color:var(--accent-deep);margin-top:1.8rem} /* prose links */ .prose a{color:var(--accent-deep);text-decoration:underline; text-decoration-thickness:1px;text-underline-offset:.2em} .prose a:hover{color:var(--accent)} /* divider */ hr.rule{border:0;border-top:1px solid var(--rule);margin:64px 0 32px} /* criteria table */ table.criteria{width:100%;border-collapse:collapse;margin:.2rem 0 1rem;font-size:16px} table.criteria th,table.criteria td{text-align:left;vertical-align:top;padding:12px 0;border-bottom:1px solid var(--rule)} table.criteria th{width:32%;font-weight:500;color:var(--muted);font-family:var(--sans);padding-right:18px} table.criteria tr:last-child th,table.criteria tr:last-child td{border-bottom:0} @media(max-width:520px){table.criteria th{width:40%}} /* faq */ .faq{max-width:var(--measure)} .faq h3{font-family:var(--serif);font-weight:600;font-size:1.14rem;line-height:1.25; margin:1.5rem 0 .35rem;text-wrap:balance} .faq h3:first-of-type{margin-top:0} .faq p{margin:0} /* focus */ a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:1px} /* footer */ .site-footer{margin-top:76px;padding:0 0 56px} .foot-rule{border:0;border-top:1px solid var(--rule);margin:0 0 18px} .foot-contact{font-size:.86rem;color:var(--muted);margin:0 0 1rem} .foot-contact a{color:var(--accent-deep);text-decoration:underline; text-decoration-thickness:1px;text-underline-offset:.2em} .foot-nav{font-size:.84rem;color:var(--muted);margin:0 0 .7rem;line-height:1.95} .foot-nav a{color:var(--muted);text-decoration:none} .foot-nav a:hover{color:var(--accent)} .foot-nav .sep{color:var(--rule)} .foot-meta{font-size:.82rem;color:var(--muted);display:flex; justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:0} .foot-meta a{color:var(--muted);text-decoration:none} .foot-meta a:hover{color:var(--accent)} .foot-meta time{color:var(--muted)} /* refined typography */ html{hanging-punctuation:first allow-end} @media(max-width:600px){.dropcap::first-letter{font-size:3.2em}} .foot-meta{row-gap:.4rem} /* closing onward-link */ .closing{margin-top:2.4rem} .next-step{margin-top:2.6rem;font-family:var(--serif);font-style:italic;font-size:1.12rem; line-height:1.5;color:var(--accent-deep)} .next-step a{color:var(--accent-deep);text-decoration:underline; text-decoration-thickness:1px;text-underline-offset:.2em} .next-step a:hover{color:var(--accent)} /* investor grid (ready for named backers) */ .investor-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:20px 22px;margin:1.6rem 0 0;padding:0;list-style:none} .investor-grid li{font-size:14px;line-height:1.4} .investor-grid .name{font-family:var(--serif);font-weight:600;font-size:15px;color:var(--ink)} .investor-grid .firm{color:var(--muted)} @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}} /* print — clean letter */ @media print{ :root{--bg:#fff;--ink:#000;--muted:#333;--accent:#000;--accent-deep:#000} .site-header,.site-footer,.skip,.nav-primary,.lang{display:none} body{background:#fff;color:#000} .wrap{max-width:none} h1,h2{page-break-after:avoid} p{orphans:3;widows:3} }