:root { --ink:#13231f; --muted:#456057; --paper:#f5f2ea; --cream:#fffdf8; --acid:#c9ee4d; --green:#0e4535; --line:#cad5cb; --orange:#c95f3d; --blue:#4262bf; --soft-green:#e6eddf; --shadow:0 20px 45px rgba(18,35,31,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--paper); }
body { margin:0; color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif; font-size:16px; line-height:1.5; background:var(--paper); }
a { color:inherit; }
.skip { position:absolute; top:-3rem; left:1rem; z-index:4; padding:.6rem 1rem; color:#fff; background:var(--green); border-radius:.3rem; }.skip:focus { top:1rem; }
.site-header { min-height:76px; display:flex; align-items:center; gap:1rem; padding:0 clamp(1.25rem,4vw,4.5rem); border-bottom:1px solid var(--line); background:var(--cream); }
.brand { display:flex; align-items:center; gap:.65rem; font-size:1.1rem; font-weight:700; text-decoration:none; letter-spacing:-.04em; }.brand svg { width:26px; height:26px; fill:var(--acid); stroke:var(--ink); stroke-width:2; }
.environment { margin-right:auto; display:flex; align-items:center; gap:.45rem; padding:.38rem .62rem; border:1px solid #b8cbbc; border-radius:99px; font-family:"DM Mono",monospace; font-size:.63rem; text-transform:uppercase; letter-spacing:.065em; color:var(--green); background:#f4f8ee; }.environment span { width:.45rem; height:.45rem; border-radius:50%; background:var(--acid); border:1px solid var(--green); }
nav { display:flex; gap:1.4rem; } nav a { color:var(--muted); font-size:.875rem; font-weight:600; text-decoration:none; } nav a:hover { color:var(--ink); }
main { overflow:hidden; }.hero { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); gap:clamp(2rem,8vw,10rem); align-items:end; min-height:600px; padding:clamp(4.75rem,9vw,9rem) clamp(1.25rem,8vw,9rem) clamp(4rem,7vw,7rem); background:var(--cream); }.hero h1,.section-heading h2,.safety h2 { margin:0; font-family:"Newsreader",Georgia,serif; font-size:clamp(3.3rem,6.5vw,6.4rem); font-weight:600; line-height:.9; letter-spacing:-.06em; text-wrap:balance; }.lede { max-width:49ch; margin:2rem 0 0; color:var(--muted); font-size:1.05rem; }.trust-strip { display:flex; flex-wrap:wrap; gap:.45rem .85rem; margin:1.35rem 0 0; color:var(--green); font-family:"DM Mono",monospace; font-size:.68rem; letter-spacing:.035em; text-transform:uppercase; }.trust-strip span { display:inline-flex; align-items:center; gap:.45rem; }.trust-strip span::before { content:""; width:.34rem; height:.34rem; border-radius:50%; background:var(--acid); border:1px solid var(--green); }.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2.2rem; }.button { display:inline-flex; align-items:center; gap:.8rem; padding:.85rem 1.05rem; border:1px solid var(--ink); border-radius:99px; font-weight:700; font-size:.9rem; text-decoration:none; transition:transform .18s ease,background .18s ease,box-shadow .18s ease; }.button:hover { transform:translateY(-2px); box-shadow:0 8px 16px rgba(18,35,31,.12); }.primary { background:var(--ink); color:#fff; }.primary span { color:var(--acid); font-size:1.15rem; }.quiet { color:var(--ink); background:transparent; }
.truth-panel { align-self:center; padding:1.7rem; color:#e3eee5; background:var(--green); border:1px solid #2f6958; border-radius:.55rem; box-shadow:var(--shadow); }.truth-top { display:flex; align-items:baseline; justify-content:space-between; font-family:"DM Mono",monospace; text-transform:uppercase; letter-spacing:.075em; font-size:.65rem; }.truth-top strong { color:var(--acid); font-family:"Newsreader",Georgia,serif; font-size:3.7rem; line-height:.8; letter-spacing:-.08em; }.truth-rule { height:1px; margin:1.45rem 0; background:rgba(255,255,255,.25); }.truth-panel p { max-width:27ch; margin:0 0:1.5rem; font-size:1.05rem; line-height:1.3; }.truth-panel dl { display:grid; grid-template-columns:repeat(3,1fr); gap:.45rem; margin:0; }.truth-panel dl div { padding:.55rem .4rem; border:1px solid rgba(255,255,255,.14); border-radius:.25rem; }.truth-panel dt { color:#b8d2c2; font-family:"DM Mono",monospace; font-size:.56rem; letter-spacing:.055em; text-transform:uppercase; }.truth-panel dd { margin:.25rem 0 0; color:#fff; font-size:.73rem; font-weight:600; }
.statement { padding:1.6rem clamp(1.25rem,8vw,9rem); color:#edf6de; background:var(--ink); }.statement p { max-width:75ch; margin:0; font-family:"Newsreader",Georgia,serif; font-size:clamp(1.3rem,2.3vw,2rem); line-height:1.08; letter-spacing:-.03em; }
.journey,.evidence,.limits { padding:clamp(4.8rem,9vw,9rem) clamp(1.25rem,8vw,9rem); }.section-heading { max-width:720px; }.section-heading h2,.safety h2 { font-size:clamp(2.6rem,5vw,5.3rem); }.section-heading > p { max-width:53ch; margin:1.2rem 0 0; color:var(--muted); }.evidence-meta { color:var(--green)!important; font-family:"DM Mono",monospace; font-size:.67rem; letter-spacing:.04em; text-transform:uppercase; }
.flow { display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; margin:4rem 0 0; padding:0; list-style:none; }.flow li { position:relative; min-height:255px; padding:1.5rem; border:1px solid var(--line); background:var(--cream); box-shadow:0 8px 18px rgba(18,35,31,.04); }.flow li:not(:last-child)::after { content:""; position:absolute; top:3rem; right:-1.3rem; z-index:2; width:1.25rem; height:1px; background:var(--green); }.flow li:not(:last-child)::before { content:""; position:absolute; top:calc(3rem - 3px); right:-1.3rem; z-index:3; width:6px; height:6px; border-top:1px solid var(--green); border-right:1px solid var(--green); transform:rotate(45deg); }.step { display:block; color:var(--green); font-family:"DM Mono",monospace; font-size:.68rem; }.flow svg { width:43px; height:43px; margin:2.3rem 0 1.15rem; padding:.55rem; border-radius:50%; background:var(--soft-green); fill:none; stroke:var(--green); stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; }.flow h3,.channel h3,.limits h3 { margin:0; font-size:1.05rem; letter-spacing:-.03em; }.flow p,.channel p,.limits p { margin:.45rem 0 0; color:var(--muted); font-size:.9rem; }
.evidence { background:var(--soft-green); }.evidence-heading { max-width:800px; }.channels { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-top:3rem; }.channel { display:grid; grid-template-columns:auto 1fr; column-gap:1rem; align-items:start; min-height:210px; padding:1.35rem; border:1px solid #c8d5c8; border-top:3px solid var(--green); background:var(--cream); box-shadow:0 10px 22px rgba(18,35,31,.06); }.channel-mark { display:grid; width:2.45rem; height:2.45rem; place-items:center; border:1px solid currentColor; border-radius:50%; font-family:"DM Mono",monospace; font-size:.7rem; font-weight:500; }.ml { color:var(--blue); background:#edf0ff; }.exito { color:#496018; background:#f0f8cf; }.dropi { color:#9f432b; background:#fbe6dc; }.channel .status { grid-column:1 / -1; align-self:end; width:max-content; margin-top:auto; padding:.38rem .6rem; border:1px solid #a9c7ae; border-radius:99px; color:var(--green); background:#f2f8ef; font-family:"DM Mono",monospace; font-size:.62rem; font-weight:500; letter-spacing:.035em; text-transform:uppercase; }.status::before { content:""; display:inline-block; width:.4rem; height:.4rem; margin-right:.4rem; border-radius:50%; background:#5e9a46; }
.safety { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,10vw,11rem); padding:clamp(5rem,10vw,10rem) clamp(1.25rem,8vw,9rem); color:#e8f2e9; background:var(--green); }.safety h2 { color:#fff; }.safety-copy { max-width:480px; }.safety-copy p { margin:0; font-family:"Newsreader",Georgia,serif; font-size:1.45rem; line-height:1.15; letter-spacing:-.025em; }.controls-list { margin:2rem 0 0; padding:0; list-style:none; counter-reset:controls; }.controls-list li { display:grid; grid-template-columns:2.6rem 1fr; gap:.6rem; padding:.85rem 0; border-top:1px solid rgba(255,255,255,.22); font-size:.9rem; }.controls-list strong { color:var(--acid); font-family:"DM Mono",monospace; font-size:.65rem; letter-spacing:.06em; }
.limits { background:var(--cream); border-top:1px solid #e7d7cb; }.limits-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,4vw,5rem); margin-top:3.5rem; }.limits-grid article { padding-top:1rem; border-top:1px solid rgba(19,35,31,.45); }.limit-icon { display:block; width:1.8rem; height:1.8rem; margin-bottom:2rem; text-align:center; color:#fff; background:var(--orange); border-radius:50%; font-family:"DM Mono",monospace; line-height:1.7rem; }.demo-note { padding:2rem clamp(1.25rem,8vw,9rem); background:var(--paper); border-top:1px solid var(--line); }.demo-note p { max-width:68ch; margin:0; color:var(--muted); font-size:.92rem; }footer { display:flex; justify-content:space-between; gap:1rem; padding:1.4rem clamp(1.25rem,4vw,4.5rem); color:#b9d1c1; background:var(--ink); font-family:"DM Mono",monospace; font-size:.64rem; letter-spacing:.04em; text-transform:uppercase; }
:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }::selection { color:#fff; background:var(--green); }::-webkit-scrollbar { width:11px; }::-webkit-scrollbar-track { background:var(--paper); }::-webkit-scrollbar-thumb { border:3px solid var(--paper); border-radius:99px; background:#789186; }@media (max-width:800px) { .site-header { min-height:65px; }.environment { display:none; }nav { margin-left:auto; gap:.8rem; }nav a { font-size:.75rem; }.hero,.safety { grid-template-columns:1fr; }.hero { min-height:auto; padding-top:4.5rem; }.truth-panel { max-width:450px; width:100%; justify-self:end; }.flow,.channels,.limits-grid { grid-template-columns:1fr 1fr; }.flow li { min-height:220px; }.flow li:nth-child(2)::after { display:none; }.flow li:nth-child(2)::before { display:none; }.safety { gap:3rem; }.safety-copy { max-width:100%; } }
@media (max-width:520px) { nav a:not(:last-child) { display:none; }.hero h1 { font-size:3.4rem; }.truth-panel dl { grid-template-columns:1fr; }.truth-panel dd { margin-top:0; }.flow,.channels,.limits-grid { grid-template-columns:1fr; }.flow li { min-height:auto; }.flow li:not(:last-child)::after,.flow li:not(:last-child)::before { display:none; }.flow svg { margin:1.6rem 0 .8rem; }.journey,.evidence,.limits { padding-top:4rem; padding-bottom:4rem; }footer { display:block; line-height:1.8; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; } }