/* Home page. Everything is scoped under .home so no other page is affected. */
/* Spacing comes from the system tokens in style.css (--sec, --sec-sm, --g-*); only layout lives here. */
/* Syndicate definition: a band, so it takes the band padding (entry styling is the shared .dict component in style.css) */
.home .home-defn .dict{margin-bottom:0}
.home .home-defn{padding:var(--sec-sm) 0}

/* What we do: 2x2 on phones */
@media (max-width:600px){
  .home .loop4{grid-template-columns:1fr 1fr;gap:24px 16px}
  .home .loop4 li{padding-top:14px}
  .home .loop4 li::before{margin-bottom:8px}
  .home .loop4 b{margin-bottom:4px}
  .home .loop4 span{font-size:15px;line-height:1.45;display:block}
}

/* Inputs panel with the price-structure animation */
.home .home-pp{--w-prod:60%;--w-svc:40%;--ex:rgba(196,163,90,.95);--exd:rgba(196,163,90,.3);margin-top:var(--g-block);padding:var(--pad-panel);background:var(--bg2);border:1px solid var(--border);border-radius:var(--r-lg);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4.5vw,64px);align-items:center}
.home .home-pp-copy h2{font-size:var(--fs-h2s);text-wrap:balance}
.home .home-pp-copy p{margin-top:var(--g-lead);color:var(--muted);font-size:var(--fs-lead)}
.home .home-pp-copy p b{color:var(--text)}
.home .home-pp-fig{margin:0;min-width:0}
.home .pp-card{padding:var(--pad-card);background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--r)}
.home .pp-k{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mint)}
.home .pp-row{display:flex;align-items:flex-end;gap:clamp(14px,3vw,28px);margin-top:14px;font-variant-numeric:tabular-nums}
.home .pp-now{display:flex;align-items:baseline;color:var(--text);font-weight:800;letter-spacing:-.03em;line-height:1;transition:color .5s ease}
.home .pp-d,.home .pp-n{font-size:clamp(56px,7vw,84px)}
.home .pp-n{display:inline-block;min-width:2ch}
.home .pp-u{font-size:clamp(22px,2.6vw,30px);font-weight:700;letter-spacing:0;color:var(--muted);margin-left:.15em}
.home .pp-side{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding-bottom:6px}
.home .pp-old{font-size:clamp(20px,2.2vw,26px);font-weight:700;color:var(--dim);text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:var(--ex);transition:opacity .4s ease}
.home .pp-chip{display:inline-block;min-width:6.6em;white-space:nowrap;text-align:center;padding:5px 12px;font-family:var(--mono);font-size:13px;font-weight:500;letter-spacing:.04em;color:#0b0b0d;background:var(--mint);border-radius:999px;transition:opacity .4s ease}
.home .pp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.home .pp-sum{margin-top:var(--g-stack);font-size:clamp(20px,2.4vw,26px);line-height:1.25;letter-spacing:-.015em;color:var(--muted)}
.home .pp-sum b{color:var(--text);font-weight:800}
.home .pp-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}
.home .pp-foot figcaption{font-size:13px;line-height:1.4;color:var(--dim);max-width:30em}
/* The end state ($20, struck $30, chip) is the default markup (no JS, reduced motion). JS adds .pp-armed (start: $30, ghost and chip hidden), .pp-count (ghost and chip fade in as the count starts) and .pp-done. */
.home .home-pp.pp-armed .pp-old,.home .home-pp.pp-armed .pp-chip{opacity:0}
.home .home-pp.pp-armed.pp-count .pp-old,.home .home-pp.pp-armed.pp-count .pp-chip{opacity:1}
.home .home-pp.pp-armed:not(.pp-done) .pp-now{color:var(--text)}
.home .home-pp.pp-done .pp-now{color:var(--mint)}
.home .home-pp:not(.pp-armed) .pp-now{color:var(--mint)}
@media (max-width:960px){.home .home-pp{grid-template-columns:minmax(0,1fr);gap:var(--g-block)}}
@media (prefers-reduced-motion:reduce){.home .home-pp *{transition:none!important}}

/* Regenerative: slimmer (no sub line or cards on Home; the punch line sits under the lead) */
.home .home-regen .regen{margin-bottom:0}
.home .home-regen .regen-svg{max-width:400px}
.home .home-regen .punch{margin-top:var(--g-stack);text-align:left;max-width:none}
@media (max-width:960px){.home .home-regen .regen{gap:var(--g-stack)}}
@media (max-width:600px){.home .home-regen .regen-svg{max-width:250px}}
/* Hero headline cycle: three pairs. "Better" on both lines is static text; only the noun after it changes (agronomy/recs/products, economics/prices/profits). Both nouns glitch on ONE shared clock
   (JS adds .gl to both .hc-w slots in the same tick; ~1 s: scramble out, decode left to right into the new word, red/cyan split, slice displacement, scanlines, a second intensity peak mid-way).
   The words of a line share one grid cell (.hc-w), so the slot is as wide/tall as the widest word; the glitch is drawn in an absolutely positioned overlay (.hc-x) whose glyph cells are
   measured from the real word, so nothing reflows or moves "Better". No-JS and reduced motion show the first pair (the default .on). */
.home .hcyc{--gx:5px}
.home .hcyc .hc-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.home .hcyc .hc-vis{display:block}
.home .hcyc .hc-line{display:block;white-space:nowrap}
.home .hcyc .hc-w{display:inline-grid;justify-items:start;position:relative;vertical-align:top}
.home .hcyc .hc-p{grid-area:1/1;white-space:nowrap;font-style:normal;opacity:0;visibility:hidden}
.home .hcyc .hc-p.on{opacity:1;visibility:visible}
.home .hcyc .hc-x{display:none;position:absolute;left:0;top:0;white-space:nowrap;pointer-events:none;font-style:normal;line-height:inherit;clip-path:inset(-6px -14px -6px 0)}
.home .hcyc .hc-xl{position:absolute;left:0;top:0;white-space:nowrap;clip-path:inset(0 0 100% 0)}
.home .hcyc .hc-xm{position:relative;clip-path:none}
.home .hcyc .hc-xl i{display:inline-flex;justify-content:center;font-style:normal}
.home .hcyc .hc-xr{color:#ff3d5a;opacity:.92}
.home .hcyc .hc-xc{color:#3de5ff;opacity:.92}
.home .hcyc .hc-w.gl .hc-p,.home .hcyc .hc-w.gl .hc-p.on{visibility:hidden}
.home .hcyc .hc-w.gl .hc-x{display:block}
.home .hcyc .hc-w.gl .hc-xm{animation:hc-m 1s steps(1,end) 1}
.home .hcyc .hc-w.gl .hc-xr{animation:hc-r 1s steps(1,end) 1}
.home .hcyc .hc-w.gl .hc-xc{animation:hc-c 1s steps(1,end) 1}
.home .hcyc .hc-w.gl .hc-xa{animation:hc-a 1s steps(1,end) 1}
.home .hcyc .hc-w.gl .hc-xb{animation:hc-b 1s steps(1,end) 1}
.home .hcyc .hc-w.gl::after{content:"";position:absolute;left:-2px;right:-2px;top:0;bottom:0;pointer-events:none;opacity:0;background:repeating-linear-gradient(0deg,rgba(11,11,13,.6) 0 1px,transparent 1px 3px);animation:hc-s 1s steps(1,end) 1}
@media (max-width:430px){.home .hcyc{--gx:3.5px;font-size:min(38px,calc((100vw - 40px) / 8.7))}}
@keyframes hc-m{
0%{transform:none;text-shadow:none;opacity:1}
5%{transform:translateX(calc(var(--gx) * -.8));text-shadow:calc(var(--gx) * .7) 0 rgba(255,61,90,.85),calc(var(--gx) * -.7) 0 rgba(61,229,255,.85)}
11%{transform:translateX(calc(var(--gx) * .7));text-shadow:calc(var(--gx) * -1) 0 rgba(255,61,90,.9),var(--gx) 0 rgba(61,229,255,.9)}
17%{opacity:.5;transform:translateX(calc(var(--gx) * -.4))}
20%{opacity:1;text-shadow:var(--gx) 0 rgba(255,61,90,.9),calc(var(--gx) * -1) 0 rgba(61,229,255,.9)}
27%{transform:translateX(calc(var(--gx) * .5));text-shadow:calc(var(--gx) * -.8) 0 rgba(255,61,90,.8),calc(var(--gx) * .8) 0 rgba(61,229,255,.8)}
36%{transform:none;text-shadow:calc(var(--gx) * .5) 0 rgba(255,61,90,.7),calc(var(--gx) * -.5) 0 rgba(61,229,255,.7)}
46%{transform:translateX(calc(var(--gx) * -.6));text-shadow:calc(var(--gx) * -.6) 0 rgba(255,61,90,.7),calc(var(--gx) * .6) 0 rgba(61,229,255,.7)}
54%{transform:translateX(calc(var(--gx) * 1.1));text-shadow:calc(var(--gx) * 1.5) 0 rgba(255,61,90,.95),calc(var(--gx) * -1.5) 0 rgba(61,229,255,.95)}
58%{transform:translateX(calc(var(--gx) * -1.2));text-shadow:calc(var(--gx) * -1.6) 0 rgba(255,61,90,.95),calc(var(--gx) * 1.6) 0 rgba(61,229,255,.95)}
62%{opacity:.5;transform:translateX(calc(var(--gx) * .8))}
64%{opacity:1;text-shadow:calc(var(--gx) * 1.2) 0 rgba(255,61,90,.9),calc(var(--gx) * -1.2) 0 rgba(61,229,255,.9)}
70%{transform:translateX(calc(var(--gx) * -.6));text-shadow:calc(var(--gx) * -.9) 0 rgba(255,61,90,.8),calc(var(--gx) * .9) 0 rgba(61,229,255,.8)}
78%{transform:translateX(calc(var(--gx) * .4));text-shadow:calc(var(--gx) * .6) 0 rgba(255,61,90,.6),calc(var(--gx) * -.6) 0 rgba(61,229,255,.6)}
87%{transform:none;text-shadow:calc(var(--gx) * -.35) 0 rgba(255,61,90,.45),calc(var(--gx) * .35) 0 rgba(61,229,255,.45)}
94%{text-shadow:calc(var(--gx) * .15) 0 rgba(255,61,90,.3),calc(var(--gx) * -.15) 0 rgba(61,229,255,.3)}
98%,100%{transform:none;text-shadow:none;opacity:1}}
@keyframes hc-r{
0%{clip-path:inset(0 0 100% 0)}
3%{clip-path:inset(8% 0 68% 0);transform:translateX(calc(var(--gx) * -1.4))}
8%{clip-path:inset(46% 0 26% 0);transform:translateX(calc(var(--gx) * 1.2))}
13%{clip-path:inset(70% 0 6% 0);transform:translateX(calc(var(--gx) * -1))}
19%{clip-path:inset(20% 0 52% 0);transform:translateX(calc(var(--gx) * 1.6))}
25%{clip-path:inset(0 0 40% 0);transform:translateX(calc(var(--gx) * -.8))}
31%{clip-path:inset(58% 0 12% 0);transform:translateX(calc(var(--gx) * 1))}
38%{clip-path:inset(30% 0 46% 0);transform:translateX(calc(var(--gx) * -.7))}
45%{clip-path:inset(0 0 100% 0)}
52%{clip-path:inset(12% 0 60% 0);transform:translateX(calc(var(--gx) * 1.6))}
56%{clip-path:inset(0 0 0 0);transform:translateX(calc(var(--gx) * -1.5))}
60%{clip-path:inset(50% 0 10% 0);transform:translateX(calc(var(--gx) * 1.8))}
65%{clip-path:inset(24% 0 44% 0);transform:translateX(calc(var(--gx) * -1.2))}
71%{clip-path:inset(66% 0 4% 0);transform:translateX(calc(var(--gx) * .9))}
77%{clip-path:inset(8% 0 70% 0);transform:translateX(calc(var(--gx) * -.8))}
84%{clip-path:inset(40% 0 36% 0);transform:translateX(calc(var(--gx) * .6))}
91%,100%{clip-path:inset(0 0 100% 0);transform:none}}
@keyframes hc-c{
0%{clip-path:inset(0 0 100% 0)}
2%{clip-path:inset(60% 0 14% 0);transform:translateX(calc(var(--gx) * 1.4))}
7%{clip-path:inset(6% 0 74% 0);transform:translateX(calc(var(--gx) * -1.3))}
12%{clip-path:inset(36% 0 38% 0);transform:translateX(calc(var(--gx) * 1.1))}
18%{clip-path:inset(76% 0 2% 0);transform:translateX(calc(var(--gx) * -1.5))}
24%{clip-path:inset(18% 0 56% 0);transform:translateX(calc(var(--gx) * 1))}
30%{clip-path:inset(46% 0 20% 0);transform:translateX(calc(var(--gx) * -1.2))}
37%{clip-path:inset(0 0 66% 0);transform:translateX(calc(var(--gx) * .8))}
44%{clip-path:inset(0 0 100% 0)}
51%{clip-path:inset(54% 0 8% 0);transform:translateX(calc(var(--gx) * -1.6))}
55%{clip-path:inset(0 0 0 0);transform:translateX(calc(var(--gx) * 1.5))}
59%{clip-path:inset(14% 0 58% 0);transform:translateX(calc(var(--gx) * -1.8))}
64%{clip-path:inset(62% 0 8% 0);transform:translateX(calc(var(--gx) * 1.3))}
70%{clip-path:inset(30% 0 40% 0);transform:translateX(calc(var(--gx) * -1))}
76%{clip-path:inset(72% 0 0 0);transform:translateX(calc(var(--gx) * .9))}
83%{clip-path:inset(4% 0 72% 0);transform:translateX(calc(var(--gx) * -.7))}
90%,100%{clip-path:inset(0 0 100% 0);transform:none}}
@keyframes hc-a{
0%{clip-path:inset(0 0 100% 0)}
4%{clip-path:inset(22% 0 62% 0);transform:translateX(calc(var(--gx) * 2.6))}
10%{clip-path:inset(64% 0 20% 0);transform:translateX(calc(var(--gx) * -2.8))}
16%{clip-path:inset(40% 0 44% 0);transform:translateX(calc(var(--gx) * 2.2))}
23%{clip-path:inset(0 0 100% 0)}
29%{clip-path:inset(10% 0 74% 0);transform:translateX(calc(var(--gx) * -2.4))}
35%{clip-path:inset(54% 0 30% 0);transform:translateX(calc(var(--gx) * 2.4))}
42%{clip-path:inset(0 0 100% 0)}
53%{clip-path:inset(30% 0 52% 0);transform:translateX(calc(var(--gx) * -3.2))}
58%{clip-path:inset(68% 0 14% 0);transform:translateX(calc(var(--gx) * 3.4))}
63%{clip-path:inset(8% 0 76% 0);transform:translateX(calc(var(--gx) * -2.6))}
69%{clip-path:inset(46% 0 38% 0);transform:translateX(calc(var(--gx) * 2.4))}
75%{clip-path:inset(0 0 100% 0)}
80%{clip-path:inset(58% 0 28% 0);transform:translateX(calc(var(--gx) * -1.6))}
86%,100%{clip-path:inset(0 0 100% 0);transform:none}}
@keyframes hc-b{
0%{clip-path:inset(0 0 100% 0)}
6%{clip-path:inset(74% 0 8% 0);transform:translateX(calc(var(--gx) * -2.4))}
13%{clip-path:inset(12% 0 70% 0);transform:translateX(calc(var(--gx) * 2.6))}
20%{clip-path:inset(0 0 100% 0)}
27%{clip-path:inset(48% 0 36% 0);transform:translateX(calc(var(--gx) * 2.2))}
33%{clip-path:inset(0 0 100% 0)}
40%{clip-path:inset(26% 0 58% 0);transform:translateX(calc(var(--gx) * -2.2))}
47%{clip-path:inset(0 0 100% 0)}
55%{clip-path:inset(60% 0 22% 0);transform:translateX(calc(var(--gx) * 3.2))}
60%{clip-path:inset(18% 0 66% 0);transform:translateX(calc(var(--gx) * -3.4))}
66%{clip-path:inset(42% 0 42% 0);transform:translateX(calc(var(--gx) * 2.6))}
72%{clip-path:inset(76% 0 4% 0);transform:translateX(calc(var(--gx) * -2.2))}
78%{clip-path:inset(0 0 100% 0)}
82%{clip-path:inset(34% 0 52% 0);transform:translateX(calc(var(--gx) * 1.6))}
88%,100%{clip-path:inset(0 0 100% 0);transform:none}}
@keyframes hc-s{0%{opacity:0}4%{opacity:1}30%{opacity:.35}38%{opacity:0}50%{opacity:0}54%{opacity:1}70%{opacity:.5}80%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.home .hcyc .hc-x{display:none!important}.home .hcyc .hc-w.gl .hc-p.on{visibility:visible}.home .hcyc .hc-w.gl::after{content:none}}