/* Homepage integrations farm + $99 use-case showcase. */
.homepage-integrations,
.homepage-use-cases {
  --hi-muted:#5f6878;
  --hi-paper:#fffdf9;
  --hi-crop:#a9bb74;
  --hi-crop-2:#d7c875;
  --hi-crop-3:#c48775;
  padding:96px 0;
}

.hi-section-head {
  display:grid;
  grid-template-columns:1fr minmax(280px,430px);
  gap:40px;
  align-items:end;
  margin-bottom:46px;
}
.hi-section-head h2 {
  max-width:13ch;
  margin-top:14px;
  font-size:clamp(38px,5.3vw,65px);
  letter-spacing:-.04em;
}
.hi-section-head > p { margin:0; color:var(--ink-2); font-size:18px; }

.homepage-integrations { overflow:hidden; background:#152238; color:#f7f0ee; }
.homepage-integrations h2 { color:#f7f0ee; }
.homepage-integrations .eyebrow,
.homepage-integrations .hi-section-head > p { color:#cbd0da; }

.hi-farm {
  position:relative;
  min-height:690px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  border-radius:30px;
  background:
    radial-gradient(circle at 50% 48%,rgba(170,196,255,.18),transparent 24%),
    radial-gradient(circle at 16% 14%,rgba(205,230,133,.09),transparent 29%),
    radial-gradient(circle at 51% 48%,rgba(255,255,255,.13) 0 2px,transparent 3px),
    repeating-linear-gradient(21deg,rgba(255,255,255,.025) 0 1px,transparent 1px 14px),
    #26324a;
  box-shadow:0 35px 80px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.14);
}
.hi-farm::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(98deg,transparent 0 47.8%,rgba(236,223,200,.25) 48% 49.1%,transparent 49.3%),
    linear-gradient(12deg,transparent 0 48.2%,rgba(236,223,200,.2) 48.4% 49.2%,transparent 49.4%);
}
.hi-farm::after {
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle,rgba(255,255,255,.18) 0 .7px,transparent .9px) 0 0/18px 18px,
    linear-gradient(108deg,transparent 18%,rgba(255,255,255,.05) 35%,transparent 52%);
  mix-blend-mode:screen;
  opacity:.4;
  animation:hi-farm-light 12s ease-in-out infinite alternate;
}
.hi-farm-core {
  position:absolute;
  z-index:10;
  left:50%;
  top:49%;
  width:142px;
  height:118px;
  translate:-50% -50%;
  filter:drop-shadow(0 12px 14px rgba(0,0,0,.35));
}
.hi-farm-core svg,
.hi-farm-gate svg { display:block; width:100%; height:100%; }
.hi-farm-gate {
  position:absolute;
  z-index:12;
  left:50%;
  top:8px;
  width:154px;
  height:82px;
  translate:-50% 0;
  pointer-events:none;
  filter:drop-shadow(0 7px 7px rgba(0,0,0,.32));
}
.hi-dog-run {
  position:absolute;
  z-index:11;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}
.hi-dog-run-mobile { display:none; }
.hi-fly-moving { filter:drop-shadow(0 5px 5px rgba(0,0,0,.35)); }
.hi-fly-resolved { animation:hi-fly-resolve 3s ease-in-out infinite; }
.hi-farm-orb { animation:hi-orb-resolve 3s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
.hi-farm-orb-spin { animation:hi-orb-spin 1.8s linear infinite; transform-box:fill-box; transform-origin:center; }

.hi-field {
  position:absolute;
  z-index:2;
  overflow:hidden;
  isolation:isolate;
  padding:25px 28px;
  border:1px solid rgba(255,255,255,.34);
  color:#172033;
  box-shadow:0 18px 28px rgba(3,10,25,.25),inset 0 1px rgba(255,255,255,.42),inset 0 -12px 24px rgba(66,43,28,.1);
  transition:transform .35s ease,filter .35s ease,box-shadow .35s ease;
}
.hi-field::before { content:""; position:absolute; z-index:-1; inset:0; opacity:.34; }
.hi-field::after {
  content:"";
  position:absolute;
  z-index:-1;
  inset:7px;
  border:1px solid rgba(255,255,255,.17);
  border-radius:inherit;
  box-shadow:inset 0 0 32px rgba(255,255,255,.08);
  pointer-events:none;
}
.hi-field:hover,
.hi-field:focus-visible {
  transform:translateY(-7px) scale(1.008);
  filter:saturate(1.13) brightness(1.04);
  box-shadow:0 25px 38px rgba(3,10,25,.32),inset 0 1px rgba(255,255,255,.5);
}
.hi-field h3 { max-width:74%; margin-bottom:14px; color:#172033; font-size:25px; letter-spacing:-.025em; }
.hi-field .hi-status {
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:12px;
  font:600 9px var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.hi-field .hi-status::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.hi-logos { display:flex; flex-wrap:wrap; gap:7px; }
.hi-logo {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 9px;
  border:1px solid rgba(21,34,56,.14);
  border-radius:8px;
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(247,240,238,.78));
  box-shadow:0 5px 10px rgba(30,33,20,.13),inset 0 1px #fff;
  font:600 10px var(--mono);
  transition:transform .25s ease,box-shadow .25s ease;
}
.hi-field:hover .hi-logo { transform:translateY(-1px); box-shadow:0 7px 14px rgba(30,33,20,.16),inset 0 1px #fff; }
.hi-logo-mark { display:block; width:14px; height:14px; flex:none; }
.hi-field-commerce { left:4%; top:7%; width:39%; height:35%; rotate:-2deg; border-radius:50% 16% 28% 18%/24% 18% 48% 22%; background:var(--hi-crop); }
.hi-field-marketing { right:4%; top:6%; width:38%; height:36%; rotate:2deg; border-radius:18% 44% 18% 38%/23% 18% 44% 27%; background:var(--hi-crop-2); }
.hi-field-finance { left:5%; bottom:6%; width:38%; height:38%; rotate:1deg; border-radius:20% 36% 16% 46%/40% 18% 32% 18%; background:#cba177; }
.hi-field-context { right:5%; bottom:6%; width:38%; height:39%; rotate:-1deg; border-radius:42% 18% 38% 16%/22% 42% 19% 38%; background:var(--hi-crop-3); }
.hi-field-commerce::before { background:radial-gradient(circle,rgba(89,62,44,.62) 0 3px,transparent 4px),repeating-linear-gradient(100deg,rgba(69,76,47,.24) 0 1px,transparent 1px 14px); background-size:34px 28px,auto; }
.hi-field-marketing::before { background:radial-gradient(ellipse,rgba(255,255,255,.54) 0 4px,transparent 5px),repeating-linear-gradient(100deg,rgba(109,91,29,.25) 0 1px,transparent 1px 13px); background-size:31px 25px,auto; }
.hi-field-finance::before { background:repeating-linear-gradient(104deg,rgba(103,68,37,.55) 0 2px,transparent 2px 9px); }
.hi-field-context::before { background:repeating-linear-gradient(22deg,rgba(102,48,41,.4) 0 2px,transparent 2px 14px); }
.hi-field-commerce > * { rotate:2deg; }
.hi-field-marketing > * { rotate:-2deg; }
.hi-field-finance > * { rotate:-1deg; }
.hi-field-context > * { rotate:1deg; }
.hi-crop-id { position:absolute; right:22px; top:20px; display:grid; justify-items:center; width:58px; color:rgba(21,34,56,.78); }
.hi-crop-id svg { width:50px; height:50px; filter:drop-shadow(0 2px 0 rgba(255,255,255,.28)); }

.homepage-use-cases { background:var(--surface); }
.homepage-use-cases .hi-section-head h2 { max-width:14ch; }
.hi-price-lockup { display:flex; align-items:baseline; gap:12px; margin-top:22px; }
.hi-price-lockup strong { color:var(--ink); font-size:44px; letter-spacing:-.05em; }
.hi-price-lockup span { color:var(--ink-2); font:12px var(--mono); }
.hi-case-tabs { display:grid; grid-template-columns:repeat(3,1fr); overflow:hidden; border:1px solid var(--line); border-radius:14px 14px 0 0; background:var(--surface-2); }
.hi-case-tab { padding:18px 20px; border:0; border-right:1px solid var(--line); background:transparent; color:var(--ink-2); text-align:left; cursor:pointer; }
.hi-case-tab:last-child { border-right:0; }
.hi-case-tab[aria-selected="true"] { background:#152238; color:#fff; }
.hi-case-tab b { display:block; font-size:17px; }
.hi-case-tab small { font:10px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.hi-case-panel { display:none; grid-template-columns:minmax(270px,.72fr) minmax(430px,1.28fr); min-height:540px; overflow:hidden; border:1px solid var(--line); border-top:0; border-radius:0 0 18px 18px; }
.hi-case-panel.is-active { display:grid; }
.hi-case-copy { padding:48px; background:var(--ground); }
.hi-case-copy .hi-case-no { color:var(--ink-3); font:11px var(--mono); }
.hi-case-copy h3 { margin:20px 0; font-size:clamp(34px,4vw,50px); letter-spacing:-.04em; }
.hi-case-copy ul { margin:28px 0 0; padding:0; list-style:none; }
.hi-case-copy li { padding:10px 0; border-top:1px solid var(--line); font-size:14px; }
.hi-case-copy li::before { content:"✓"; margin-right:10px; color:#637644; font-weight:700; }
.hi-case-demo { display:grid; align-content:center; padding:34px; background:#c6cff0; }
.hi-product-window { overflow:hidden; border:1px solid rgba(21,34,56,.18); border-radius:14px; background:#fff; color:#1c2434; box-shadow:0 22px 50px rgba(21,34,56,.18); }
.hi-window-head { display:flex; align-items:center; justify-content:space-between; padding:13px 16px; border-bottom:1px solid #e2dfe2; background:#faf8f6; color:#5f6878; font:10px var(--mono); }
.hi-dots { color:#b75e73; letter-spacing:3px; }
.hi-live-chip { padding:4px 7px; border:1px solid #c9d5b5; border-radius:20px; background:#eef4e5; color:#52613c; }
.hi-window-body { padding:22px; }
.hi-query { padding:14px 16px; border:1px solid #d8d6d3; border-radius:10px; color:#1c2434; font-size:16px; }
.hi-sources { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.hi-source { padding:5px 7px; border-radius:5px; background:#edf0f8; color:#59627b; font:9px var(--mono); }
.hi-answer { position:relative; overflow:hidden; margin-top:22px; padding:18px; border-left:3px solid #e3aeb4; background:#fbf5f3; }
.hi-answer b { display:block; font-size:22px; }
.hi-answer p { margin:6px 0 0; color:#5f6878; font-size:13px; }
.hi-answer::after { content:""; position:absolute; inset:15px; opacity:0; background:linear-gradient(#d9dce5 0 0) 0 4px/58% 14px no-repeat,linear-gradient(#e6e7ec 0 0) 0 30px/94% 8px no-repeat,linear-gradient(#e6e7ec 0 0) 0 46px/72% 8px no-repeat; }
.hi-rec-row { display:grid; grid-template-columns:1.2fr .8fr .7fr; gap:8px; align-items:center; padding:13px 5px; border-bottom:1px solid #e8e3df; font-size:13px; }
.hi-rec-row:first-child { color:#5f6878; font:9px var(--mono); text-transform:uppercase; }
.hi-action { justify-self:start; padding:4px 7px; border-radius:5px; background:#edf0f8; font:600 9px var(--mono); }
.hi-action.hi-cut { background:#f8e6e9; color:#9e3451; }
.hi-action.hi-keep { background:#f4e9d6; color:#8a591c; }
.hi-savings { display:flex; align-items:flex-end; justify-content:space-between; margin-top:18px; }
.hi-savings span { color:#5f6878; font-size:12px; }
.hi-savings strong { color:#52613c; font-size:31px; letter-spacing:-.04em; }
.hi-campaign { display:grid; grid-template-columns:1fr auto; gap:4px 12px; margin-bottom:10px; padding:15px; border:1px solid #e0dcda; border-radius:10px; }
.hi-campaign b { font-size:14px; }
.hi-campaign p { grid-column:1; margin:0; color:#5f6878; font-size:11px; }
.hi-campaign .hi-state { grid-column:2; grid-row:1/3; align-self:center; padding:5px 7px; border-radius:6px; background:#eef4e5; color:#52613c; font:9px var(--mono); }
.hi-campaign .hi-state.hi-review { background:#f4e9d6; color:#8a591c; }
.hi-approval { margin-top:18px; padding:14px; border-radius:9px; background:#152238; color:#fff; font-size:12px; }
.hi-approval b { color:#c6cff0; }

.hi-case-panel.is-active .hi-query { animation:hi-query-focus 8s ease-in-out infinite; }
.hi-case-panel.is-active .hi-source { animation:hi-source-check 8s ease-in-out infinite both; }
.hi-case-panel.is-active .hi-source:nth-child(2) { animation-delay:.25s; }
.hi-case-panel.is-active .hi-source:nth-child(3) { animation-delay:.5s; }
.hi-case-panel.is-active .hi-source:nth-child(4) { animation-delay:.75s; }
.hi-case-panel.is-active .hi-answer { animation:hi-answer-rise 8s ease-in-out infinite both; }
.hi-case-panel.is-active .hi-answer b,
.hi-case-panel.is-active .hi-answer p { animation:hi-answer-copy 8s ease-in-out infinite both; }
.hi-case-panel.is-active .hi-answer::after { animation:hi-answer-loading 8s ease-in-out infinite both; }
.hi-case-panel.is-active .hi-rec-row:not(:first-child) { animation:hi-row-scan 8s ease-in-out infinite both; }
.hi-case-panel.is-active .hi-rec-row:nth-child(3) { animation-delay:.22s; }
.hi-case-panel.is-active .hi-rec-row:nth-child(4) { animation-delay:.44s; }
.hi-case-panel.is-active .hi-rec-row:nth-child(5) { animation-delay:.66s; }
.hi-case-panel.is-active .hi-savings { animation:hi-savings-rise 8s ease-in-out infinite both; }
.hi-case-panel.is-active .hi-campaign { animation:hi-campaign-build 8s ease-in-out infinite both; }
.hi-case-panel.is-active .hi-campaign:nth-child(2) { animation-delay:.25s; }
.hi-case-panel.is-active .hi-campaign:nth-child(3) { animation-delay:.5s; }
.hi-case-panel.is-active .hi-campaign:nth-child(4) { animation-delay:.75s; }
.hi-case-panel.is-active .hi-state { animation:hi-state-pulse 8s ease-in-out infinite; }
.hi-case-panel.is-active .hi-approval { animation:hi-approval-ready 8s ease-in-out infinite both; }

@keyframes hi-farm-light { from { transform:translateX(-5%); opacity:.28; } to { transform:translateX(5%); opacity:.5; } }
@keyframes hi-fly-resolve { 0%,14%,86%,100% { opacity:1; } 34%,66% { opacity:0; } }
@keyframes hi-orb-resolve { 0%,14%,86%,100% { opacity:0; transform:scale(.6); } 34%,66% { opacity:1; transform:scale(1); } }
@keyframes hi-orb-spin { to { transform:rotate(360deg); } }
@keyframes hi-query-focus { 0%,8% { opacity:.45; transform:translateY(8px); border-color:#d8d6d3; } 16%,82% { opacity:1; transform:none; border-color:#9da9d2; box-shadow:0 0 0 3px rgba(95,112,177,.1); } 92%,100% { opacity:.65; box-shadow:none; } }
@keyframes hi-source-check { 0%,16% { opacity:.2; transform:scale(.86); } 26%,82% { opacity:1; transform:none; background:#e4e9fb; } 92%,100% { opacity:.45; } }
@keyframes hi-answer-rise { 0%,18% { opacity:.6; transform:translateY(12px); } 30%,84% { opacity:1; transform:none; } 94%,100% { opacity:.6; transform:translateY(4px); } }
@keyframes hi-answer-copy { 0%,29% { opacity:0; } 40%,84% { opacity:1; } 94%,100% { opacity:0; } }
@keyframes hi-answer-loading { 0%,14% { opacity:0; transform:translateX(-8px); } 20%,29% { opacity:1; transform:none; } 40%,100% { opacity:0; } }
@keyframes hi-row-scan { 0%,12% { opacity:.25; transform:translateX(-12px); } 25%,82% { opacity:1; transform:none; background:rgba(255,255,255,.54); } 92%,100% { opacity:.35; } }
@keyframes hi-savings-rise { 0%,35% { opacity:0; transform:translateY(12px); } 48%,82% { opacity:1; transform:none; } 58% { transform:scale(1.025); } 92%,100% { opacity:0; } }
@keyframes hi-campaign-build { 0%,10% { opacity:.2; transform:translateY(12px); } 24%,82% { opacity:1; transform:none; } 92%,100% { opacity:.35; } }
@keyframes hi-state-pulse { 0%,32% { filter:saturate(.5); } 45%,70% { filter:saturate(1.3); box-shadow:0 0 0 4px rgba(99,118,68,.09); } 90%,100% { box-shadow:none; } }
@keyframes hi-approval-ready { 0%,38% { opacity:0; transform:translateY(10px); } 52%,82% { opacity:1; transform:none; } 92%,100% { opacity:0; } }

@media (max-width:800px) {
  .hi-section-head,
  .hi-case-panel { grid-template-columns:1fr; }
  .hi-farm { min-height:960px; }
  .hi-field { left:8%; right:auto; width:84%; height:20%; }
  .hi-field-commerce { top:8%; }
  .hi-field-marketing { top:30.5%; }
  .hi-field-finance { top:53%; bottom:auto; }
  .hi-field-context { top:75.5%; bottom:auto; }
  .hi-farm-core { width:70px; height:58px; }
  .hi-farm-gate { top:4px; width:116px; height:64px; }
  .hi-dog-run-desktop { display:none; }
  .hi-dog-run-mobile { display:block; }
  .hi-case-tabs { grid-template-columns:1fr; }
  .hi-case-tab { border-right:0; border-bottom:1px solid var(--line); }
}
@media (max-width:520px) {
  .homepage-integrations,
  .homepage-use-cases { padding:70px 0; }
  .hi-field { padding:18px; }
  .hi-field h3 { font-size:20px; }
  .hi-crop-id { right:13px; top:13px; width:60px; }
  .hi-crop-id svg { width:38px; height:38px; }
  .hi-case-copy,
  .hi-case-demo { padding:25px; }
  .hi-rec-row { grid-template-columns:1fr auto; }
  .hi-rec-row > span:nth-child(2) { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .hi-dog-run { display:none!important; }
  .homepage-integrations *,
  .homepage-integrations *::before,
  .homepage-integrations *::after,
  .homepage-use-cases *,
  .homepage-use-cases *::before,
  .homepage-use-cases *::after {
    animation:none!important;
    scroll-behavior:auto!important;
    transition:none!important;
  }
}
