@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Fraunces:opsz,wght@9..144,600;9..144,700&display=swap');

:root { --ink:#142321; --ink-soft:#35504b; --paper:#f7f4ed; --surface:#fffdf9; --line:#d7ded5; --teal:#087d70; --teal-dark:#065d54; --coral:#bd563f; --amber:#e2a33a; --mist:#e8f0ec; --shadow:0 18px 45px rgba(20,35,33,.11); --radius:20px; --sans:'DM Sans',Arial,sans-serif; --serif:Fraunces,Georgia,serif; --mono:'DM Mono',monospace; }
[data-brand='truepoint'] { --accent:var(--teal); --accent-dark:var(--teal-dark); --accent-pale:#dcefeb; }
[data-brand='compuhola'] { --accent:var(--coral); --accent-dark:#923f30; --accent-pale:#f6e4de; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); line-height:1.5; } a { color:inherit; } .shell { width:min(1120px, calc(100% - 40px)); margin:auto; } .eyebrow { margin:0 0 12px; color:var(--accent); font:500 12px/1.2 var(--mono); letter-spacing:.08em; text-transform:uppercase; } .wordmark { font:700 20px/1 var(--sans); letter-spacing:-.06em; text-decoration:none; } .wordmark span { color:var(--accent); } .button { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:12px 18px; border-radius:999px; background:var(--accent); color:#fff; font-weight:700; text-decoration:none; box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 22%,transparent); } .button:hover { background:var(--accent-dark); } .button--quiet { background:transparent; color:var(--ink); box-shadow:inset 0 0 0 1px var(--line); } .section { padding:92px 0; } .section-title { max-width:650px; margin:0; font:600 clamp(32px,5vw,56px)/1.02 var(--serif); letter-spacing:-.045em; } .section-copy { max-width:620px; color:var(--ink-soft); font-size:18px; } .card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 3px 10px rgba(20,35,33,.025); } .skip { position:absolute; left:-999px; } .skip:focus { left:12px; top:12px; z-index:20; background:#fff; padding:10px; }
@media (prefers-color-scheme: dark) { :root { --ink:#edf5f0; --ink-soft:#c0d1c8; --paper:#10201d; --surface:#172a26; --line:#355048; --mist:#1d3731; } .button--quiet { color:var(--ink); } }
@media (max-width:600px) { .shell { width:min(100% - 28px,1120px); } .section { padding:64px 0; } .section-copy { font-size:16px; } }