/* Caduca — getcaduca.com
   The app's own design tokens, so the site and the product read as one thing:
   warm greys, a single vermilion accent, Archivo for labels and interface,
   a serif for headings and quantity. Light and dark both defined. */

@font-face { font-family:"Archivo"; font-weight:400; font-display:swap;
  src:url("fonts/archivo-v25-latin-regular.ttf") format("truetype"); }
@font-face { font-family:"Archivo"; font-weight:600; font-display:swap;
  src:url("fonts/archivo-v25-latin-600.ttf") format("truetype"); }
@font-face { font-family:"Archivo"; font-weight:800; font-display:swap;
  src:url("fonts/archivo-v25-latin-800.ttf") format("truetype"); }

:root {
  --page:#F3F2F2; --surface:#FFFFFF; --ink:#201E1D; --muted:#6E6A67;
  --faint:#9A948F; --hair:#E3E1DF; --accent:#EC3013; --accent-deep:#B2240E;
  --inset:#EDECEA;
  --sans:"Archivo",system-ui,-apple-system,sans-serif;
  --serif:ui-serif,Georgia,"Times New Roman",serif;
  --measure:36rem;
}
@media (prefers-color-scheme:dark) {
  :root {
    --page:#141211; --surface:#1E1B1A; --ink:#EDEAE7; --muted:#9A938E;
    --faint:#766F6B; --hair:#302C2A; --accent:#F2492E; --accent-deep:#FF7A62;
    --inset:#272322;
  }
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; background:var(--page); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.wrap { max-width:44rem; margin:0 auto; padding:clamp(2.5rem,6vw,5rem) 1.25rem 5rem; }

a { color:var(--accent-deep); text-decoration-thickness:1px; text-underline-offset:2px; }
a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:3px; }

.kicker { font-size:.6875rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--accent-deep); margin:0; }
h1 { font-family:var(--serif); font-weight:700; letter-spacing:-.015em;
  font-size:clamp(2.2rem,6vw,3.4rem); line-height:1.06; margin:.6rem 0 0;
  text-wrap:balance; }
h2 { font-family:var(--serif); font-weight:700; font-size:1.45rem;
  margin:2.6rem 0 .6rem; letter-spacing:-.01em; }
h3 { font-size:.6875rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--faint); margin:2rem 0 .4rem; }
p, li { max-width:var(--measure); }
p { margin:.9rem 0; color:var(--muted); }
h1 + p.lede { font-family:var(--serif); font-size:1.2rem; color:var(--muted); margin-top:1rem; }
strong { color:var(--ink); font-weight:600; }

nav { display:flex; gap:1.25rem; align-items:baseline;
  padding-bottom:1.5rem; border-bottom:1px solid var(--hair); margin-bottom:2.5rem; }
nav .mark { font-family:var(--serif); font-weight:700; font-size:1.35rem;
  color:var(--ink); text-decoration:none; margin-right:auto; }
nav a:not(.mark) { font-size:.82rem; font-weight:600; color:var(--muted);
  text-decoration:none; }
nav a:not(.mark):hover { color:var(--accent-deep); }

.features { display:grid; gap:1rem; margin:2.5rem 0 0;
  grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); }
.features div { background:var(--surface); border:1px solid var(--hair);
  border-radius:16px; padding:1.25rem; }
.features h4 { margin:0 0 .35rem; font-size:1rem; font-weight:600; color:var(--ink); }
.features p { margin:0; font-size:.92rem; }

.note { background:var(--inset); border-radius:14px; padding:1.1rem 1.25rem;
  margin:2rem 0; }
.note p { margin:0; font-size:.95rem; }

footer { margin-top:4rem; padding-top:1.5rem; border-top:1px solid var(--hair);
  font-size:.82rem; color:var(--faint); display:flex; gap:1rem; flex-wrap:wrap; }
footer a { color:var(--faint); }

dl { margin:1rem 0; }
dt { font-weight:600; color:var(--ink); margin-top:1.2rem; }
dd { margin:.3rem 0 0; color:var(--muted); max-width:var(--measure); }
