/* Hydrocell-owned tokens. Root font size follows the browser; 1rem = 16px at its default.
   ACSS is not installed. Do not overwrite ACSS variables; map these aliases after configuration. */
:root{
  --hc-color-brand: #e30613;
  --hc-color-brand-hover: #b90510;
  --hc-color-logo: #9c1006;
  --hc-color-paper: #fafaf8;
  --hc-color-ink: #292c2c;
  --hc-color-muted: #5d6261;
  --hc-color-graphite: #242626;
  --hc-color-footer: var(--hc-color-graphite);
  --hc-color-product: var(--hc-color-graphite);
  --hc-color-link: #171a18;
  --hc-color-link-hover: #c90612;
  --hc-color-link-inverse-hover: #ff756e;
  --hc-color-white: #ffffff;
  --hc-color-sand: #f0e7da;
  --hc-color-apricot: #f4dfd0;
  --hc-color-vanilla: #f4eedb;
  --hc-color-clay: #f3e8e6;
  --hc-color-sage: #e3e8e5;
  --hc-color-sand-strong: #dfc397;
  --hc-color-sage-strong: #b9cbbc;
  --hc-color-terracotta: #a33c27;
  --hc-color-forest: #245748;
  --hc-color-neutral: #eceeeb;
  --hc-font-body: Roboto, Arial, sans-serif;
  --hc-font-heading: RC, Arial, sans-serif;
  --hc-text-xs: .8125rem;
  --hc-text-s: .875rem;
  --hc-text-m: 1rem;
  --hc-text-body: 1.0625rem;
  --hc-text-link: .9375rem;
  --hc-heading-hero: 3.5rem;
  --hc-heading-section: 2.8125rem;
  --hc-heading-product: 2.9375rem;
  --hc-heading-planning: 2.625rem;
  --hc-heading-card: 2.25rem;
  --hc-heading-footer: 3.1875rem;
  --hc-radius-button: .3125rem;
  --hc-radius-panel: 1.25rem;
  --hc-radius-card: 1.375rem;
  --hc-content-width: 90rem;
  --hc-gutter: 4rem;
  --hc-touch-target: 2.75rem;
  --hc-border-thin: .0625rem;
  --hc-focus-width: .125rem;
  --hc-motion-fast: .18s;
  --hc-motion-reveal: .24s;
  --hc-space-64: 4rem;
  --hc-space-32: 2rem;
  --hc-space-58: 3.625rem;
  --hc-space-20: 1.25rem;
  --hc-space-27: 1.6875rem;
  --hc-space-35: 2.1875rem;
  --hc-space-12: 0.75rem;
  --hc-space-19: 1.1875rem;
  --hc-space-95: 5.9375rem;
  --hc-space-18: 1.125rem;
  --hc-space-34: 2.125rem;
  --hc-space-5: 0.3125rem;
  --hc-space-24: 1.5rem;
  --hc-space-65: 4.0625rem;
  --hc-space-40: 2.5rem;
  --hc-space-50: 3.125rem;
  --hc-space-28: 1.75rem;
  --hc-space-36: 2.25rem;
  --hc-space-33: 2.0625rem;
  --hc-space-7: 0.4375rem;
  --hc-space-60: 3.75rem;
  --hc-space-45: 2.8125rem;
  --hc-space-23: 1.4375rem;
  --hc-space-110: 6.875rem;
  --hc-space-105: 6.5625rem;
  --hc-space-68: 4.25rem;
  --hc-space-16: 1rem;
  --hc-space-22: 1.375rem;
  --hc-space-80: 5rem;
  --hc-space-25: 1.5625rem;
  --hc-space-21: 1.3125rem;
  --hc-space-75: 4.6875rem;
  --hc-space-38: 2.375rem;
  --hc-space-30: 1.875rem;
  --hc-space-90: 5.625rem;
  --hc-space-31: 1.9375rem;
  --hc-space-4: 0.25rem;
  --hc-space-15: 0.9375rem;
  --hc-space-10: 0.625rem;
  --hc-space-9: 0.5625rem;
  --hc-space-14: 0.875rem;
  --hc-space-26: 1.625rem;
  --hc-space-11: 0.6875rem;
  --hc-space-13: 0.8125rem;
  --hc-space-6: 0.375rem;
  --hc-space-55: 3.4375rem;
  --hc-space-8: 0.5rem;
}
html{font-size:100%}

/* Hydrocell shade proposals: OKLab interpolation, not ACSS-generated defaults.
   Map secondary/tertiary to ACSS 4 palette slots when installed. */
:root{
  --hc-primary:var(--hc-color-brand);
  --hc-secondary-ultra-light:#F4FAFB;
  --hc-secondary-light:#D9F0F2;
  --hc-secondary-semi-light:#9FD8DE;
  --hc-secondary:#00B0BD;
  --hc-secondary-semi-dark:#00828C;
  --hc-secondary-dark:#004247;
  --hc-secondary-ultra-dark:#001416;
  --hc-secondary-hover:#008D98;
  --hc-tertiary-ultra-light:#FEFBF5;
  --hc-tertiary-light:#FBF0DE;
  --hc-tertiary-semi-light:#F4DAAC;
  --hc-tertiary:#E8B44D;
  --hc-tertiary-semi-dark:#AC8537;
  --hc-tertiary-dark:#594418;
  --hc-tertiary-ultra-dark:#1D1404;
  --hc-tertiary-hover:#BB903C;
}

/* Primary scale proposals and neutral palette. */
:root{
  --hc-primary-ultra-light:#FFF3F1;
  --hc-primary-light:#FFD8D2;
  --hc-primary-semi-light:#FC9C90;
  --hc-primary-semi-dark:#A8030B;
  --hc-primary-dark:#570103;
  --hc-primary-ultra-dark:#1D0000;
  --hc-primary-hover:#B90510;
  --hc-neutral-black:#080909;
  --hc-neutral-graphite:#242626;
  --hc-neutral-ink:#292C2C;
  --hc-neutral-muted:#5D6261;
  --hc-neutral-light:#ECEEEB;
  --hc-neutral-paper:#FAFAF8;
  --hc-neutral-white:#FFFFFF;
}

/* Approved material family, 15 September 2026. */
:root {
 --hc-secondary:#319D8D;
 --hc-secondary-ultra-light:#ECF6F2;
 --hc-secondary-light:#C4E9E2;
 --hc-secondary-semi-light:#91CFC2;
 --hc-secondary-dark:#245748;
 --hc-tertiary:#B87545;
 --hc-tertiary-ultra-light:#F5EBE3;
 --hc-tertiary-light:#F5D8C5;
 --hc-tertiary-semi-light:#E9BEA1;
 --hc-surface-cta:#F2F2EF;
 --hc-surface-hero:linear-gradient(to top,#E6E6E6 0%,#EBEBEB 50%,#F0F0F0 100%);
 --hc-surface-dark:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) .0625rem,transparent .0625rem,transparent .25rem),linear-gradient(to top,#202323,#242626);
 --hc-family-section-space:6rem;
 --hc-family-section-gap:7rem;
 --hc-family-panel-space:4rem;
}
@media(max-width:40rem){:root{--hc-family-section-space:3.5rem;--hc-family-section-gap:4.5rem;--hc-family-panel-space:2.5rem}}

/* Radius follows the scale of the surface. */
:root{--hc-radius-compact:.625rem;--hc-radius-support:.875rem}

/* All hero introductions are larger than body copy. */
:root{--hc-hero-intro-size:1.375rem;--hc-hero-intro-leading:1.6}
@media(max-width:40rem){:root{--hc-hero-intro-size:1.125rem}}

/* General surfaces are separate from HIP/HIK identification colours. */
:root{--hc-surface-info:#F0F3F6;--hc-surface-info-light:#F6F8FA;--hc-info-line:#697C90;--hc-surface-neutral:#F2F2EF}

:root{--hc-surface-grey:var(--hc-surface-neutral)}
