/* One mineral palette. Scene light may change temperature; the brand ink does not.
   palette.js reads these same tokens for WebGL and Safari's viewport surface. */
:root {
 --home-ink:#183343;
 --home-light:#e8e5dc;
 --home-dark:#101d2c;
 --home-slate:#1c3347;
 --home-slate-lit:#456477;
 --home-muted:#c5d2dc;
 --home-secondary:#4b6170;
 --home-quiet:#8a9ba4;
 --home-chalk:#f3f0e8;
 --home-stone:#d3c7b5;
 --home-edge:#819cac;
 --home-inset:#dce4e9;
 --home-start:#e2e0d7;
 --home-hero:#101d2c;
 --home-source-shade:#a9bfcb;
 --scene-soil-paper:#ecebe3;
 --scene-soil-shade:#dce4e9;
 --scene-feed-paper:#ebe9e0;
 --scene-feed-shade:#cbc8bd;
 --scene-water-paper:#e4e9e8;
 --scene-water-shade:#b9c8cd;
 --scene-fertilizer-paper:#142a40;
 --scene-fertilizer-shade:var(--home-dark);
 --scene-turf-paper:#e7eae0;
 --scene-turf-shade:#c3cbbe;
 --ink:var(--home-light);
 --paper:var(--home-hero);
}

/* Keep the approved hero atmosphere; carry its slate into every interface state. */
.header {--header-ink:color-mix(in srgb,var(--home-light) calc(100% - var(--light-phase)),var(--home-ink))}
.header .navigation {background:color-mix(in srgb,var(--home-muted) 14%,transparent)}
.navigation:before {background:linear-gradient(140deg,color-mix(in srgb,var(--home-chalk) 16%,transparent),transparent 70%)}
.navigation>a:before,.navigation>button:before {background:var(--home-light)}
.navigation>a:hover,.navigation>button:hover,.navigation>a:focus-visible,.navigation>button:focus-visible,
.header #menu-open:hover,.header #menu-open:focus-visible {color:var(--home-ink)}
.cut-button {--surface:var(--home-light);--foreground:var(--home-ink)}
.cut-button:before {background:linear-gradient(130deg,var(--home-chalk),var(--home-edge))}
.cut-button:hover:after {background:var(--home-chalk)}

.loader svg {color:var(--home-light)}
.source-light {background:radial-gradient(ellipse at 50% 42%,var(--home-chalk),var(--home-light) 50%,var(--home-source-shade) 100%)}
.source-story {color:var(--home-ink)}
.source-story p {color:var(--home-secondary)}
#menu {background:var(--home-slate);color:var(--home-light)}
#menu::backdrop {background:var(--home-slate)}
#menu-close {--surface:var(--home-slate);--foreground:var(--home-light)}
#menu-close:hover {--foreground:var(--home-ink);color:var(--home-ink)}
.menu-utilities #motion,.menu-company>a,.menu-markets>a {border-color:color-mix(in srgb,var(--home-muted) 20%,transparent)}
.menu-company>a:before {background:linear-gradient(100deg,color-mix(in srgb,var(--home-chalk) 7%,transparent),transparent)}
.menu-image {background:var(--home-slate-lit)}
/* One opaque viewport cover, independent of the pinned hero's scroll position. */
.homepage .loader{z-index:1000;pointer-events:auto;overscroll-behavior:none;touch-action:none}
.homepage .loader::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 65% 30%,#2b4a63,transparent 70%),var(--home-hero,#101d2c);opacity:1;transition:opacity .32s ease}
.loading-reveal .homepage .loader::before{opacity:0}
.restored-entry .homepage .loader svg{visibility:hidden}
.restored-entry .homepage .header .brand,.restored-entry .homepage .header .navigation,.restored-entry .homepage .header .contact,.restored-entry .homepage .opening h1,.restored-entry .homepage .primary-action{animation:none}
.homepage .loader[hidden]{display:none}
.home-loading{scroll-behavior:auto;overflow-anchor:none}
@media(prefers-reduced-motion:reduce){.homepage .loader::before{transition:none}}
