/* Cacao Hedge — homepage styles, v1 (shared by / and /es/). Immutable-cached: ship changes as cacao-home.v2.css. */
  /* ── hero ── */
  .hero { position: relative; min-height: 100svh; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; padding: 120px var(--gutter) 48px; overflow: clip; }
  .orbits { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
  #mandala { position: absolute; z-index: 0; pointer-events: none; opacity: 0.38;
    -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 0 58%, transparent 71%);
            mask-image: radial-gradient(circle at 50% 50%, #000 0 58%, transparent 71%); }
  .hero-copy { position: relative; z-index: 2; }
  h1 { font: 100 clamp(58px, 8.8vw, 150px)/0.9 var(--sans); letter-spacing: -0.045em; color: var(--navy); margin: 22px 0 34px; }
  h1 em.e { display: block; padding-left: 0.42em; letter-spacing: -0.035em; }
  .hero-sub { max-width: 420px; margin-bottom: 36px; }
  .hero-actions { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
  .figure { position: relative; z-index: 1; justify-self: center; width: min(540px, 100%); }
  .figure canvas { display: block; width: 100%; aspect-ratio: 7 / 8; }
  .figure figcaption { display: flex; justify-content: space-between; gap: 16px; margin-top: 12px; border-top: 1px solid var(--rule); padding-top: 10px; }

  .facts { position: relative; z-index: 2; display: flex; align-items: center; gap: 14px 32px; flex-wrap: wrap; padding: 22px var(--gutter); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: var(--white); }
  .facts .name { font: 200 22px/1 var(--sans); color: var(--navy); letter-spacing: -0.01em; }
  .facts .sep { width: 1px; height: 18px; background: var(--rule); }
  .facts .spacer { flex: 1; }

  section { position: relative; padding: 140px var(--gutter); }
  h2.big { font: 100 clamp(42px, 5.6vw, 92px)/0.98 var(--sans); letter-spacing: -0.04em; color: var(--navy); text-wrap: balance; }
  .intro { max-width: 520px; margin-top: 26px; }

  /* principles: editorial paragraphs with roman marginalia */
  .split { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 110px); align-items: start; }
  .essay .para { display: grid; grid-template-columns: 70px 1fr; gap: 18px; padding: 24px 0; border-top: 1px solid var(--rule); }
  .essay .para:last-child { border-bottom: 1px solid var(--rule); }
  .essay .n { font: italic 200 32px/1 var(--sans); color: var(--coral); }
  .essay h3 { font: 600 10.5px/1.5 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--navy); margin-bottom: 8px; }
  .essay p { font-size: 15.5px; }

  /* frontier + construction */
  .frontier { border-top: 1px solid var(--rule); }
  .plate { width: min(470px, 100%); justify-self: center; }
  .plate svg { width: 100%; height: auto; overflow: visible; }
  .plate text { font-family: "Averta", sans-serif; font-weight: 600; letter-spacing: 1.5px; }
  .weights { list-style: none; margin-top: 34px; max-width: 460px; }
  .weights li { display: grid; grid-template-columns: 1fr 120px 42px; gap: 14px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--rule); font-size: 14.5px; }
  .weights .bar { height: 2px; background: var(--rule); }
  .weights .bar i { display: block; height: 100%; background: var(--navy); }
  .weights li.cash .bar i { background: var(--coral); }
  .weights .v { text-align: right; font-variant-numeric: tabular-nums; color: var(--navy); }
  .methods { margin-top: 18px; max-width: 460px; }

  /* method: five steps */
  .steps { list-style: none; border-top: 1px solid var(--navy); margin-top: 64px; }
  .steps li { display: grid; grid-template-columns: 90px minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 24px; padding: 26px 0; border-bottom: 1px solid var(--rule); align-items: baseline; }
  .steps .n { font: 100 40px/1 var(--sans); letter-spacing: -0.03em; color: var(--coral); }
  .steps h3 { font: 200 25px/1.15 var(--sans); letter-spacing: -0.015em; color: var(--navy); }

  /* regimes */
  .regimes { border-top: 1px solid var(--rule); }
  .rtable { width: 100%; border-collapse: collapse; margin-top: 64px; }
  .rtable th, .rtable td { text-align: left; vertical-align: baseline; padding: 20px 16px 20px 0; border-bottom: 1px solid var(--rule); font-size: 14.5px; }
  .rtable thead th { border-bottom: 1px solid var(--navy); padding-bottom: 12px; }
  .rtable tbody th { font: 200 22px/1.15 var(--sans); color: var(--navy); white-space: nowrap; }
  .rtable .eq { width: 180px; }
  .rtable .eq .bar { display: flex; align-items: center; gap: 10px; }
  .rtable .eq .bar span { flex: 1; height: 2px; background: var(--rule); }
  .rtable .eq .bar i { display: block; height: 100%; background: var(--navy); }
  .rtable .eq b { font-weight: 400; color: var(--navy); font-variant-numeric: tabular-nums; width: 34px; text-align: right; }
  .rtable caption { caption-side: bottom; text-align: left; padding-top: 14px; }

  /* platform catalogue */
  .catalogue { display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px; border-top: 1px solid var(--navy); margin-top: 64px; }
  .catalogue div { padding: 24px 0 26px; border-bottom: 1px solid var(--rule); }
  .catalogue h3 { font: 200 26px/1.1 var(--sans); letter-spacing: -0.015em; color: var(--navy); margin-bottom: 8px; }
  .catalogue h3 small { font: 600 9.5px/1 var(--sans); letter-spacing: 0.16em; color: var(--ink-3); vertical-align: middle; margin-left: 10px; }
  .catalogue p { font-size: 15px; }

  /* monitor: an engraved ledger, illustrative */
  .monitor { border-top: 1px solid var(--rule); }
  .ledger { border: 1px solid var(--navy); padding: 30px; background: var(--white); }
  .ledger .top { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; }
  .ledger .chip { color: var(--navy); border: 1px solid var(--coral); padding: 4px 8px; }
  .ledger .value { font: 100 58px/1 var(--sans); letter-spacing: -0.04em; color: var(--navy); margin: 18px 0 6px; font-variant-numeric: tabular-nums; }
  .ledger svg { width: 100%; height: 120px; margin: 26px 0; }
  .ledger dl { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--rule); }
  .ledger dl div { padding: 16px 0 0; }
  .ledger dd { font: 200 28px/1.1 var(--sans); color: var(--navy); margin-top: 6px; font-variant-numeric: tabular-nums; }
  .ledger .note { margin-top: 22px; }

  /* perspectives — discreet */
  .notes { padding-top: 110px; padding-bottom: 110px; border-top: 1px solid var(--rule); }
  .notes ol { list-style: none; border-top: 1px solid var(--navy); max-width: 980px; }
  .notes li a { display: grid; grid-template-columns: 210px 1fr 70px; gap: 20px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid var(--rule); }
  .notes li a:hover .t { color: var(--coral); }
  .notes .t { font: 200 22px/1.25 var(--sans); color: var(--navy); letter-spacing: -0.01em; transition: color 180ms; }
  .notes .rt { text-align: right; }

  /* access: the CACAO pattern, the form in its clearing */
  .access { min-height: 100svh; display: grid; place-items: center; text-align: center; overflow: hidden; border-top: 1px solid var(--rule); background: var(--white); }
  #pattern { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
  .access .inner { position: relative; z-index: 1; width: min(560px, 100%); }
  .access h2.big { margin-top: 30px; }
  .access .intro { margin: 24px auto 0; }
  form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; margin: 40px auto 0; text-align: left; background: rgba(255, 255, 255, 0.92); padding: 8px 0; }
  form .full { grid-column: 1 / -1; }
  label.lab { display: block; margin-bottom: 4px; }
  input, select, textarea { width: 100%; background: transparent; border: 0; border-bottom: 1px solid var(--ink-3); outline: 0; color: var(--navy); font: 300 16px/1.4 var(--sans); padding: 8px 2px; border-radius: 0; }
  select { appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--navy) 50%), linear-gradient(135deg, var(--navy) 50%, transparent 50%); background-position: calc(100% - 12px) 55%, calc(100% - 7px) 55%; background-size: 5px 5px; background-repeat: no-repeat; }
  textarea { resize: vertical; min-height: 84px; }
  input:focus, select:focus, textarea:focus { border-color: var(--navy); }
  input::placeholder, textarea::placeholder { color: var(--faint); }
  .hp { position: absolute; left: -9999px; }
  form .send { grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 10px; }
  form [data-status] { font-size: 13px; color: var(--navy); }
  .fine { font-size: 11.5px; color: var(--ink-3); margin-top: 20px; }

  @media (max-width: 960px) {
    .hero { grid-template-columns: 1fr; padding-top: 104px; gap: 28px; }
    .figure { width: min(400px, 94%); order: -1; }
    .orbits text, .orbits circle { display: none; }
    .split { grid-template-columns: 1fr; }
    .steps li { grid-template-columns: 56px 1fr; }
    .steps li p { grid-column: 2; }
    .catalogue { grid-template-columns: 1fr; }
    .rtable thead { display: none; }
    .rtable tr { display: grid; grid-template-columns: 1fr auto; padding: 16px 0; border-bottom: 1px solid var(--rule); }
    .rtable th, .rtable td { border: 0; padding: 4px 0; }
    .rtable td.cond, .rtable td.post { grid-column: 1 / -1; }
    .rtable .eq { width: auto; grid-row: 1; grid-column: 2; }
    .rtable .eq .bar span { width: 70px; flex: none; }
    .facts .spacer, .facts .sep { display: none; }
    section { padding: 100px var(--gutter); }
  }
  @media (max-width: 640px) {
    .notes li a { grid-template-columns: 1fr; gap: 4px; }
    .notes .rt { text-align: left; }
    form { grid-template-columns: 1fr; }
    .ledger dl { grid-template-columns: 1fr 1fr; }
    .ledger .value { font-size: 44px; }
  }
  @media (prefers-reduced-motion: reduce) { .planet { animation: none !important; } }
