/* Banner and statistics strip — shared with the dairy traceability layout. */:root { --tg-primary:#0BA56A; --tg-primary-dark:#078857; --tg-primary-soft:#EAF7EF; --tg-heading:#111B24; --tg-body:#566B62; --tg-border:#DCE1E5; --tg-white:#FFFFFF }
/* Unique split-list design for the Why TransGenie section */ #why-transgenie .tg-container { display:grid; grid-template-columns:minmax(300px, .78fr) minmax(0, 1.22fr); gap:72px; align-items:start; padding:54px; border-radius:22px; background:#fff }
#why-transgenie .bf-section-head { position:sticky; top:110px; margin:0 }
#why-transgenie .bf-section-head>span { color:var(--tg-primary-dark) }
#why-transgenie .bf-section-head h2 { color:var(--tg-heading) }
#why-transgenie .bf-section-head p { color:var(--tg-body) }
#why-transgenie .bf-value-grid { display:block; border-top:1px solid rgba(16, 34, 42, .16) }
#why-transgenie .bf-value-grid article { display:grid; grid-template-columns:50px 1fr; column-gap:18px; row-gap:0; min-height:0; padding:15px 8px; border:0; border-bottom:1px solid rgba(16, 34, 42, .16); border-radius:0; background:transparent; transition:background-color .25s ease, padding .25s ease }
#why-transgenie .bf-value-grid article:hover { padding-inline:18px; background:rgba(255, 255, 255, .7) }
#why-transgenie .bf-value-grid span { width:auto; height:auto; margin:3px 0 0; place-items:start; border-radius:0; background:transparent; color:var(--tg-primary-dark); font-size:14px; letter-spacing:.08em }
#why-transgenie .bf-value-grid h3 { grid-column:2; margin:0; color:var(--tg-heading); font-size:18px }
#why-transgenie .bf-value-grid p { grid-column:2; max-height:0; margin:0; overflow:hidden; color:var(--tg-body); opacity:0; transform:translateY(-6px); transition:max-height .3s ease, margin-top .3s ease, opacity .25s ease, transform .3s ease }
#why-transgenie .bf-value-grid article:hover p { max-height:120px; margin-top:8px; opacity:1; transform:none }
@media (max-width: 991px) {
  #why-transgenie .tg-container { grid-template-columns:1fr; gap:38px; padding:38px }
  #why-transgenie .bf-section-head { position:static }
}
@media (max-width: 767px) {
  #why-transgenie { padding-inline:16px }
  #why-transgenie .tg-container { gap:18px; padding:18px 14px; border-radius:14px }
  #why-transgenie .bf-value-grid article { grid-template-columns:26px 1fr; column-gap:7px; padding:8px 2px }
  #why-transgenie .bf-value-grid article:hover { padding-inline:5px }
  #why-transgenie .bf-value-grid span { margin-top:1px; font-size:10px }
  #why-transgenie .bf-value-grid h3 { margin:0; font-size:15px; line-height:1.25 }
  #why-transgenie .bf-value-grid article:hover p { margin-top:5px }
}
.internal-links { color:#008352 !important; font-weight:700 !important }
.tg-main-wrap, .tg-main-wrap *, .tg-main-wrap *::before, .tg-main-wrap *::after { box-sizing:border-box }
.tg-main-wrap { color:var(--tg-body); background:var(--tg-white); font-family:"Inter", system-ui, -apple-system, sans-serif; font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased }
.tg-main-wrap h1, .tg-main-wrap p { margin:0 }
.tg-main-wrap h1 { color:var(--tg-heading); font-size:44px; font-weight:700; line-height:1.1; letter-spacing:-.03em }
.tg-main-wrap .body-large { color:var(--tg-body); font-size:18px; line-height:1.65 }
.tg-container { width:100%; max-width:1280px; margin-inline:auto; padding-inline:80px }
#site-header { min-height:90px }
.tg-shared-demo-host { display:block; min-height:485px }
.tg-hero { overflow:hidden; padding-block:65px 70px }
.tg-hero-grid { display:grid; grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr); gap:56px; align-items:center }
.tg-hero h1 { margin-bottom:20px }
.tg-hero p { max-width:500px; margin-bottom:32px; color:var(--tg-body) }
.tg-hero-content .body-large { margin-bottom:0 }
.dairy-content .tg-dairy-stats-strip { overflow:hidden; padding:18px 0; border-top:1px solid #c9e6d9; border-bottom:1px solid #c9e6d9; background:#effaf5 }
.dairy-content .tg-dairy-stats-track { display:flex; width:max-content; will-change:transform; animation:tg-dairy-stats-marquee 24s linear infinite }
.dairy-content .tg-dairy-stats-group { display:flex; width:max-content; min-width:100vw; align-items:center; justify-content:space-around; flex-shrink:0 }
.dairy-content .tg-dairy-stats-group>div { display:flex; align-items:center; gap:10px; flex-shrink:0; padding:0 26px; border-right:1px solid #d9ebe2; white-space:nowrap }
.dairy-content .tg-dairy-stats-group>div:last-child { border-right:0 }
.dairy-content .tg-dairy-stats-group>div::before { display:grid; width:21px; height:21px; flex:0 0 21px; place-items:center; border-radius:50%; background:#05a96b; color:#fff; content:"✓"; font-size:12px; font-weight:800 }
.dairy-content .tg-dairy-stats-strip strong { color:var(--tg-heading); font-size:20px; font-weight:800; line-height:1; white-space:nowrap }
.dairy-content .tg-dairy-stats-strip span { color:var(--tg-heading); font-size:14px; font-weight:700; line-height:1.2 }
@keyframes tg-dairy-stats-marquee {
  from { transform:translate3d(0, 0, 0) }
  to { transform:translate3d(-50%, 0, 0) }
}
@media (max-width:991px) {
  #site-header { min-height:76px }
  .tg-container { padding-inline:48px }
  .tg-main-wrap h1 { font-size:34px; line-height:1.2 }
  .tg-main-wrap .body-large { font-size:16px; line-height:1.6 }
  .tg-hero-grid { grid-template-columns:1fr; gap:40px }
  .tg-hero-content, .tg-hero-content h1, .tg-hero-content p { max-width:none }
  .tg-hero p { max-width:880px; margin-bottom:15px }
  .tg-shared-demo-host { width:100%; min-height:510px }
}
@media (max-width:767px) {
  #site-header { min-height:64px }
  .tg-shared-demo-host { min-height:530px }
  .tg-container { padding-inline:18px }
  .tg-main-wrap h1 { font-size:28px; line-height:1.2 }
  .tg-main-wrap .body-large { font-size:15px; line-height:1.55 }
  .tg-hero { padding-block:50px }
  .dairy-content .tg-dairy-stats-strip { padding:14px 0 }
  .dairy-content .tg-dairy-stats-track { animation-duration:18s }
  .dairy-content .tg-dairy-stats-group>div { gap:8px; padding:0 16px }
  .dairy-content .tg-dairy-stats-group>div::before { width:18px; height:18px; flex-basis:18px; font-size:10px }
  .dairy-content .tg-dairy-stats-strip strong { font-size:17px }
  .dairy-content .tg-dairy-stats-strip span { font-size:12px }
}
@media (prefers-reduced-motion:reduce) {
  .dairy-content .tg-dairy-stats-track { animation:none }
}
@media (min-width:992px) {
  .navbar #navMenus { transform:translateX(-24px) }
}
/* ========================================================================== Diagnostic strip ========================================================================== */ .tg-diagnostic-headline { font-size:clamp(22px, 2.4vw, 27px); font-weight:700; color:var(--tg-heading); line-height:1.3; max-width:760px; margin-bottom:0 }
.tg-diagnostic-body { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:stretch }
.tg-diagnostic-index { display:grid; gap:0 }
.tg-diagnostic-item { width:100%; display:grid; grid-template-columns:30px 1fr auto; align-items:center; gap:16px; text-align:left; background:transparent; border:none; border-top:1px solid var(--tg-border); padding-block:18px }
.tg-diagnostic-item:last-child { border-bottom:1px solid var(--tg-border) }
.tg-diagnostic-num { font-size:13px; font-weight:700; color:var(--tg-body) }
.tg-diagnostic-label { font-size:15.5px; color:var(--tg-heading); font-weight:500 }
.tg-diagnostic-check { width:22px; height:22px; border-radius:6px; border:1.5px solid var(--tg-border); display:flex; align-items:center; justify-content:center; transition:background var(--tg-ease), border-color var(--tg-ease) }
.tg-diagnostic-check svg { width:18px; height:18px; stroke:#fff !important; fill:none; opacity:0; transition:opacity var(--tg-ease) }
.tg-diagnostic-check svg path { stroke:#fff !important; fill:none }
.tg-diagnostic-item.is-checked .tg-diagnostic-check { background:var(--tg-primary); border-color:var(--tg-primary) }
.tg-diagnostic-item.is-checked .tg-diagnostic-check svg { opacity:1 }
.tg-diagnostic-item.is-checked .tg-diagnostic-label { color:var(--tg-heading) }
.tg-diagnostic-panel { border:1px solid var(--tg-border); border-radius:var(--tg-radius-m); padding:32px; background:var(--tg-background-soft); position:sticky; top:96px; text-align:center; display:flex; min-height:0; height:100%; box-sizing:border-box; flex-direction:column; align-items:center; justify-content:center }
.tg-diagnostic-gauge-wrap { display:flex; justify-content:center; margin-bottom:6px }
.tg-diagnostic-gauge { width:190px; height:108px; overflow:visible }
.tg-diagnostic-gauge-track { fill:none; stroke:var(--tg-border); stroke-width:14 }
.tg-diagnostic-gauge-fill { fill:none; stroke:var(--tg-primary); stroke-width:14; stroke-linecap:round; transition:stroke-dashoffset 550ms ease, stroke 400ms ease }
.tg-diagnostic-gauge-num { font-size:30px; font-weight:700; fill:var(--tg-heading); font-family:"Inter", sans-serif }
.tg-diagnostic-gauge-of { font-size:12px; fill:var(--tg-body); font-family:"Inter", sans-serif }
.tg-diagnostic-states { display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:20px }
.tg-diagnostic-state { font-size:13px; font-weight:700; padding:6px 12px; border-radius:var(--tg-radius-pill) }
.tg-diagnostic-state--from { background:var(--tg-danger-soft); color:var(--tg-danger) }
.tg-diagnostic-state--to { background:var(--tg-primary-soft); color:var(--tg-primary-dark) }
.tg-diagnostic-arrow { width:18px; height:18px; stroke:var(--tg-body) }
.tg-diagnostic-result { font-size:16px; color:var(--tg-heading); font-weight:700; margin-bottom:6px }
.tg-diagnostic-result-copy { font-size:14.5px; color:var(--tg-body); max-width:340px; margin:0 auto; text-align:center }
.tg-diagnostic-reset { margin-top:18px; background:transparent; border:none; padding:0; font-size:13.5px; font-weight:600; color:var(--tg-teal); text-decoration:underline; text-underline-offset:3px }
.tg-diagnostic-reset:hover { color:var(--tg-primary-dark) }
/* Fruit traceability content */ .ft-section { padding:64px 0; scroll-margin-top:100px }
.ft-soft { background:#f7f9f7 }
.ft-dark { background:#f7f9f7; color:var(--tg-body) }
#why-fruit-traceability, #fda-ready, #industries, #getting-started, #roi { background:#f7f9f7 !important }
#before-after, #features, #risks, #comparison, #faq { background:#ffffff !important }
.ft-head { max-width:880px; margin-bottom:40px }
.ft-head>span { display:block; margin-bottom:10px; color:var(--tg-primary-dark); font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase }
.ft-head h2 { margin:0; color:var(--tg-heading); font-size:32px; font-weight:700; line-height:1.15; letter-spacing:-.02em }
.ft-head p { margin:14px 0 0; color:var(--tg-body); font-size:17px; line-height:1.6 }
.ft-dark .ft-head>span { color:var(--tg-primary-dark) }
.ft-dark .ft-head h2 { color:var(--tg-heading) }
.ft-dark .ft-head p { color:var(--tg-body) }
.ft-card-grid { display:grid; gap:18px }
.ft-card-grid--3 { grid-template-columns:repeat(3, minmax(0, 1fr)) }
.ft-card-grid--4 { grid-template-columns:repeat(4, minmax(0, 1fr)) }
.ft-card { position:relative; min-height:230px; padding:28px; overflow:hidden; border:1px solid var(--tg-border); border-radius:18px; background:#fff; transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease }
.ft-card:hover { border-color:#9bd8bd; box-shadow:0 18px 42px rgba(15, 51, 39, .1); transform:translateY(-5px) }
.ft-card>b { display:grid; width:38px; height:38px; place-items:center; margin-bottom:15px; border-radius:50%; background:var(--tg-primary-soft); color:var(--tg-primary-dark); font-size:12px }
.ft-card h3, .ft-industry-grid h3, .ft-steps h3, .ft-roi-grid h3, .ft-tab-panel h3 { margin:0 0 9px; color:var(--tg-heading); font-size:22px; font-weight:700; line-height:1.3 }
.ft-card p, .ft-industry-grid p, .ft-steps p, .ft-tab-panel p { margin:0; color:var(--tg-body); font-size:16px; line-height:1.6 }
.ft-compare { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:24px }
.ft-compare article { position:relative; padding:34px; border:1px solid var(--tg-border); border-radius:20px; background:#fff; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease }
.ft-compare__before { border-color:#e2e8f0; background:#ffffff }
.ft-compare__before:hover { border-color:#cbd5e1; transform:translateY(-4px); box-shadow:0 12px 30px rgba(0, 0, 0, .05) }
.ft-compare__after { border-color:#9cd9bd !important; background:#f0faf5 !important; box-shadow:0 18px 46px rgba(11, 165, 106, .09) }
.ft-compare__after:hover { transform:translateY(-4px); box-shadow:0 22px 50px rgba(11, 165, 106, .15) }
.ft-compare-tag { display:inline-flex; align-items:center; margin-bottom:14px; padding:4px 12px; border-radius:999px; font-size:12px; font-weight:700; letter-spacing:.02em }
.ft-compare-tag--generic { border:1px solid #fecaca; background:#fef2f2; color:#dc2626 }
.ft-compare-tag--transgenie { border:1px solid #a3e0c4; background:#e6f7f0; color:#078857 }
.ft-compare h3 { margin:0 0 22px; color:var(--tg-heading); font-size:22px; font-weight:700 }
.ft-compare ul, .ft-tab-panel ul, .ft-roi-grid ul { display:grid; gap:13px; margin:0; padding:0; list-style:none }
.ft-compare li, .ft-tab-panel li, .ft-roi-grid li { position:relative; padding-left:34px; color:var(--tg-heading); font-size:15px; line-height:1.55 }
.ft-compare__before li::before { position:absolute; top:2px; left:0; display:grid; width:22px; height:22px; place-items:center; border-radius:50%; background:#fef2f2; color:#dc2626; content:'✕'; font-size:11px; font-weight:800 }
.ft-compare__after li::before { position:absolute; top:2px; left:0; display:grid; width:22px; height:22px; place-items:center; border-radius:50%; background:#d1fae5; color:#059669; content:'✓'; font-size:12px; font-weight:800 }
.ft-cta { background:linear-gradient(120deg, #063d2d, #0ba56a) }
.ft-cta__inner { display:flex; align-items:center; justify-content:space-between; gap:40px; padding-block:38px }
.ft-cta h3 { margin:0 0 7px; color:#fff; font-size:25px; font-weight:700; line-height:1.25 }
.ft-cta p { margin:0; color:#d8efe6; font-size:15px; line-height:1.55 }
.ft-cta a { display:inline-flex; min-height:46px; align-items:center; justify-content:center; gap:9px; flex:0 0 auto; padding:12px 22px; border-radius:999px; background:#fff; color:#075b3d; font-size:14px; font-weight:800; text-decoration:none; transition:transform .2s ease, box-shadow .2s ease }
.ft-cta a:hover { box-shadow:0 10px 24px rgba(0, 0, 0, .16); transform:translateY(-2px) }
.ft-metrics { display:grid; grid-template-columns:repeat(3, 1fr); margin-top:28px; overflow:hidden; border:1px solid #cce8dc; border-radius:16px; background:#fff }
.ft-metrics>div { display:flex; min-height:105px; flex-direction:column; align-items:center; justify-content:center; gap:7px; padding:18px; border-right:1px solid #cce8dc; text-align:center }
.ft-metrics>div:last-child { border:0 }
.ft-metrics strong { color:var(--tg-primary-dark); font-size:27px; font-weight:800; line-height:1 }
.ft-metrics span { color:var(--tg-heading); font-size:13px; font-weight:700 }
.ft-tabs { display:grid; grid-template-columns:250px minmax(0, 1fr); gap:22px }
[data-fda-tabs] { grid-template-columns:350px minmax(0, 1fr) }
.ft-tab-list { display:flex; flex-direction:column; gap:9px }
.ft-tab-list button { min-height:58px; padding:12px 16px; border:1px solid var(--tg-border); border-radius:11px; background:#fff; color:var(--tg-heading); font:700 16px/1.3 Inter, sans-serif; text-align:left; transition:.2s ease }
.ft-tab-list button:hover, .ft-tab-list button.is-active { border-color:var(--tg-primary); background:var(--tg-primary); color:#fff; transform:translateX(4px) }
[data-fda-tabs] .ft-tab-list button { display:flex; align-items:center; gap:12px; min-height:64px; padding:14px 18px; border:1px solid var(--tg-border); border-radius:14px; background:#fff; color:var(--tg-heading); text-align:left; transition:all .2s ease }
[data-fda-tabs] .ft-tab-list button .ft-fda-num { display:grid; width:30px; height:30px; place-items:center; flex-shrink:0; border-radius:50%; background:var(--tg-primary-soft); color:var(--tg-primary-dark); font-size:12px; font-weight:800; transition:all .2s ease }
[data-fda-tabs] .ft-tab-list button:hover, [data-fda-tabs] .ft-tab-list button.is-active { border-color:var(--tg-primary); background:var(--tg-primary); color:#fff; transform:translateX(4px); box-shadow:0 8px 20px rgba(11, 165, 106, .15) }
[data-fda-tabs] .ft-tab-list button:hover .ft-fda-num, [data-fda-tabs] .ft-tab-list button.is-active .ft-fda-num { background:rgba(255, 255, 255, .25); color:#fff }
.ft-tab-panel { min-height:360px; padding:32px; border:1px solid var(--tg-border); border-radius:18px; background:#fff }
.ft-tab-panel[hidden] { display:none !important }
[data-fda-tabs] .ft-tab-panel { display:flex; flex-direction:column; justify-content:center; min-height:100%; padding:36px }
[data-fda-tabs] .ft-tab-panel>p { margin-bottom:0 }
[data-fruit-features] { display:flex; flex-direction:column; gap:24px }
[data-fruit-features] .ft-tab-list { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; align-items:center; gap:14px; position:relative }
[data-fruit-features] .ft-tab-list button { position:relative; display:flex; align-items:center; justify-content:center; min-height:58px; padding:14px 18px; border:1px solid #cce8dc; border-radius:14px; background:#effaf5; color:var(--tg-heading); font:700 16px/1.3 Inter, sans-serif; text-align:center; transition:all .2s ease }
[data-fruit-features] .ft-tab-list button:hover, [data-fruit-features] .ft-tab-list button.is-active { border-color:var(--tg-primary); background:var(--tg-primary); color:#fff; transform:translateY(-2px); box-shadow:0 8px 20px rgba(11, 165, 106, .15) }
[data-fruit-features] .ft-tab-arrow { display:flex; align-items:center; justify-content:center; width:32px; height:32px; flex-shrink:0; border:1px solid #cce8dc; border-radius:50%; background:#fff; color:var(--tg-primary); box-shadow:0 2px 6px rgba(0, 0, 0, .04) }
[data-fruit-features] .ft-tab-arrow svg { width:16px; height:16px; stroke:var(--tg-primary) }
[data-fruit-features] .ft-tab-panel { width:80%; margin-inline:auto; min-height:auto; padding:36px; border:1px solid #cce8dc; border-radius:18px; background:#effaf5; box-shadow:0 8px 26px rgba(0, 0, 0, .03) }
.ft-tab-panel li { position:relative; padding:12px 12px 12px 32px; border-bottom:1px solid #e2eae6 }
.ft-tab-panel li::before { position:absolute; top:50%; left:8px; width:8px; height:8px; border-radius:50%; background:var(--tg-primary); content:''; transform:translateY(-50%) }
.ft-industry-cards { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:24px }
.ft-ind-card { display:flex; flex-direction:column; justify-content:space-between; padding:32px; border:1px solid #dce8e1; border-radius:20px; background:#fff; transition:all .3s cubic-bezier(.4, 0, .2, 1); transition-delay:.02s }
.ft-ind-card:hover { border-color:var(--tg-primary); background:#f9fdfb; transform:translateY(-6px); box-shadow:0 16px 36px rgba(11, 165, 106, .12) }
.ft-ind-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px }
.ft-ind-num { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:#eaf7ef; color:var(--tg-primary-dark); font-size:13px; font-weight:800 }
.ft-ind-icon { display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:14px; background:#eaf7ef; color:var(--tg-primary); transition:all .25s ease }
.ft-ind-icon svg { width:22px; height:22px; stroke:var(--tg-primary); transition:all .25s ease }
.ft-ind-card:hover .ft-ind-icon { background:var(--tg-primary); color:#fff }
.ft-ind-card:hover .ft-ind-icon svg { stroke:#fff }
.ft-ind-card h3 { margin:0 0 10px; color:var(--tg-heading); font-size:20px; font-weight:700; line-height:1.3 }
.ft-ind-card p { margin:0 0 20px; color:var(--tg-body); font-size:15px; line-height:1.6 }
.ft-ind-tag { display:inline-flex; align-items:center; gap:6px; align-self:flex-start; padding:6px 14px; border-radius:999px; background:#eef9f4; color:#078857; font-size:12.5px; font-weight:700 }
.ft-ind-tag span { color:var(--tg-primary); font-weight:800 }
.ft-risk-accordion { display:grid; gap:16px }
.ft-risk-accordion details { overflow:hidden; border:1px solid #dce8e1; border-radius:18px; background:#fff; transition:all .3s cubic-bezier(.4, 0, .2, 1); transition-delay:.02s; box-shadow:0 4px 14px rgba(0, 0, 0, .02) }
.ft-risk-accordion details:hover { border-color:#b7e3d0; box-shadow:0 8px 24px rgba(11, 165, 106, .08) }
.ft-risk-accordion details[open] { border-color:var(--tg-primary); box-shadow:0 10px 28px rgba(11, 165, 106, .12) }
.ft-risk-accordion summary { display:flex; align-items:center; justify-content:space-between; padding:22px 28px; list-style:none; cursor:pointer; user-select:none }
.ft-risk-accordion summary::-webkit-details-marker { display:none }
.ft-risk-sum-left { display:flex; align-items:center; gap:16px }
.ft-risk-num { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:#effaf5; color:var(--tg-primary-dark); font-size:13px; font-weight:800 }
.ft-risk-accordion summary h3 { margin:0; color:var(--tg-heading); font-size:19px; font-weight:700; line-height:1.3 }
.ft-risk-arrow { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:#f2f7f4; color:var(--tg-heading); transition:all .3s cubic-bezier(.4, 0, .2, 1); transition-delay:.03s }
.ft-risk-arrow svg { width:18px; height:18px; stroke:currentColor }
.ft-risk-accordion details[open] summary .ft-risk-arrow { background:var(--tg-primary); color:#fff; transform:rotate(180deg) }
.ft-risk-body { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:0 28px 28px }
.ft-risk-box { padding:22px; border-radius:14px; transition:all .2s ease }
.ft-risk-box--problem { background:#fff8f8; border:1px solid #fee2e2 }
.ft-risk-box--solution { background:#f0fdf4; border:1px solid #bbf7d0 }
.ft-risk-badge { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:8px; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; margin-bottom:12px }
.ft-risk-badge svg { width:15px; height:15px }
.ft-risk-badge--danger { background:#fee2e2; color:#dc2626 }
.ft-risk-badge--danger svg { stroke:#dc2626 }
.ft-risk-badge--success { background:#dcfce7; color:#15803d }
.ft-risk-badge--success svg { stroke:#15803d }
.ft-risk-box p { margin:0; color:#374151; font-size:15px; line-height:1.6 }
.ft-risk-box--solution p { color:#166534 }
.ft-steps { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:18px; counter-reset:step }
.ft-steps article { position:relative; min-height:0; padding:28px 24px; border:1px solid #dce8e1; border-radius:18px; background:#fff; transition:all .3s cubic-bezier(.4, 0, .2, 1); transition-delay:.02s }
.ft-steps article:hover { border-color:var(--tg-primary); transform:translateY(-4px); box-shadow:0 12px 28px rgba(11, 165, 106, .08) }
.ft-steps article:not(:last-child)::after { position:absolute; z-index:2; top:29px; right:-25px; display:flex; align-items:center; justify-content:center; width:32px; height:32px; border:1px solid #cce8dc; border-radius:50%; background:#fff; box-shadow:0 2px 6px rgba(0, 0, 0, .04); content:''; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230ba56a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E"); background-position:center; background-repeat:no-repeat; background-size:16px 16px }
.ft-steps article>span { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; margin-bottom:20px; border-radius:50%; background:#effaf5; color:var(--tg-primary-dark); font-size:13px; font-weight:800 }
.ft-steps article h3 { margin:0 0 10px; color:var(--tg-heading); font-size:19px; font-weight:700; line-height:1.3 }
.ft-steps article p { margin:0; color:var(--tg-body); font-size:14.5px; line-height:1.6 }
.ft-table-wrap { overflow-x:auto; border:1px solid var(--tg-border); border-radius:16px; background:#fff }
.ft-table-wrap table { width:100%; min-width:680px; border-collapse:collapse }
.ft-table-wrap th, .ft-table-wrap td { padding:17px 20px; border-bottom:1px solid var(--tg-border); color:var(--tg-body); font-size:14px; text-align:center }
.ft-table-wrap thead th { background:#12372c; color:#fff; font-weight:700 }
.ft-table-wrap th:first-child { text-align:left }
.ft-table-wrap tbody th { color:var(--tg-heading); font-weight:700 }
.ft-table-wrap tbody td:nth-child(2) { background:#eef9f4; color:var(--tg-primary-dark); font-weight:800 }
.ft-roi-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:22px }
.ft-roi-grid article { padding:32px; border:1px solid #dce8e1; border-radius:20px; background:#fff; transition:all .3s cubic-bezier(.4, 0, .2, 1); transition-delay:.02s }
.ft-roi-grid article:hover { border-color:var(--tg-primary); transform:translateY(-4px); box-shadow:0 12px 28px rgba(11, 165, 106, .08) }
.ft-roi-grid h3 { margin:0 0 16px; padding-bottom:16px; border-bottom:1px solid #e2eae6; color:var(--tg-heading); font-size:20px; font-weight:700 }
.ft-roi-grid ul { display:grid; gap:14px; margin:0; padding:0; list-style:none }
.ft-roi-grid li { position:relative; padding-left:30px; color:var(--tg-body); font-size:15px; line-height:1.5 }
.ft-roi-grid li::before { position:absolute; top:1px; left:0; display:flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:#effaf5; content:''; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230ba56a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); background-position:center; background-repeat:no-repeat; background-size:12px 12px }
.ft-faq-list { display:grid; gap:14px }
.ft-faq-list details { overflow:hidden; border:1px solid #dce8e1; border-radius:16px; background:#fff; transition:all .3s cubic-bezier(.4, 0, .2, 1); transition-delay:.02s; box-shadow:0 2px 8px rgba(0, 0, 0, .02) }
.ft-faq-list details:hover { border-color:#b7e3d0; box-shadow:0 6px 18px rgba(11, 165, 106, .06) }
.ft-faq-list details[open] { border-color:var(--tg-primary); box-shadow:0 8px 24px rgba(11, 165, 106, .1) }
.ft-faq-list summary { position:relative; padding:20px 64px 20px 24px; color:var(--tg-heading); font-size:17.5px; font-weight:700; line-height:1.4; list-style:none; cursor:pointer; user-select:none; transition:color .2s ease; transition-delay:.01s }
.ft-faq-list summary::-webkit-details-marker { display:none }
.ft-faq-list summary:hover, .ft-faq-list details[open] summary { color:var(--tg-primary) }
.ft-faq-list summary::after { position:absolute; top:50%; right:22px; display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:#effaf5; color:var(--tg-primary); content:'+'; font-size:20px; font-weight:700; transform:translateY(-50%); transition:all .3s cubic-bezier(.4, 0, .2, 1); transition-delay:.03s }
.ft-faq-list details[open] summary::after { background:var(--tg-primary); color:#fff; content:'−'; transform:translateY(-50%) rotate(180deg) }
.ft-faq-list p { margin:0; padding:0 24px 22px; color:var(--tg-body); font-size:15px; line-height:1.6 }
@media (max-width:991px) {
  .ft-section { padding:56px 0 }
  .tg-main-wrap h1, .tg-hero h1, h1 { font-size:34px }
  .ft-head h2, .tg-main-wrap h2, h2 { font-size:28px }
  .ft-card h3, .ft-industry-grid h3, .ft-steps h3, .ft-roi-grid h3, .ft-tab-panel h3, .ft-ind-card h3, .ft-compare h3, h3 { font-size:20px }
  p, .tg-main-wrap p, .ft-head p, .tg-hero p, .body-large { font-size:16px }
  .ft-card-grid--4, .ft-steps { grid-template-columns:repeat(2, 1fr) }
  .ft-industry-grid, .ft-industry-cards { grid-template-columns:repeat(2, 1fr) }
  .ft-tabs { grid-template-columns:1fr }
  [data-fda-tabs] { grid-template-columns:1fr; gap:18px }
  [data-fda-tabs] .ft-tab-list { display:grid; grid-template-columns:repeat(2, 1fr); gap:10px }
  [data-fda-tabs] .ft-tab-list button { min-height:50px; padding:10px 14px; font-size:13.5px; gap:8px }
  [data-fda-tabs] .ft-tab-list button .ft-fda-num { width:26px; height:26px; font-size:11px }
  [data-fda-tabs] .ft-tab-panel { padding:24px; min-height:auto }
  .ft-tab-list button { text-align:center }
  .ft-steps article:nth-child(2)::after { display:none }
  [data-fruit-features] .ft-tab-list { grid-template-columns:repeat(2, 1fr); gap:10px }
  [data-fruit-features] .ft-tab-arrow { display:none }
  [data-fruit-features] .ft-tab-panel { width:100% }
  .ft-metrics strong { font-size:21px; line-height:1.05 }
}
@media (max-width:767px) {
  .tg-main-wrap h1, .tg-hero h1, h1 { font-size:28px }
  .ft-head h2, .tg-main-wrap h2, h2 { font-size:24px; line-height:1.28 }
  .ft-card h3, .ft-ind-card h3, .ft-steps h3, .ft-roi-grid h3, .ft-tab-panel h3, .ft-compare h3, h3 { font-size:18px }
  p, .tg-main-wrap p, .ft-head p, .tg-hero p, .body-large, .ft-card p, .ft-ind-card p, .ft-steps p, .ft-tab-panel p { font-size:15px }
  .ft-section { padding:28px 0 }
  .ft-head { margin-bottom:16px }
  .ft-head>span { margin-bottom:7px; font-size:10px }
  .ft-head p { margin-top:7px; font-size:14px; line-height:1.5 }
  .ft-card-grid--3, .ft-card-grid--4, .ft-compare, .ft-industry-grid, .ft-steps, .ft-roi-grid { grid-template-columns:1fr }
  .ft-card-grid { gap:10px }
  .ft-card { min-height:0; padding:15px 14px; border-radius:13px }
  .ft-card>b { width:28px; height:28px; margin-bottom:10px; font-size:9px }
  .ft-card h3 { margin-bottom:5px; font-size:16px }
  .ft-card p { font-size:13px; line-height:1.45 }
  .ft-compare { gap:14px }
  .ft-compare article { padding:20px 18px }
  .ft-compare h3 { margin-bottom:15px; font-size:18px }
  .ft-compare li, .ft-tab-panel li, .ft-roi-grid li { font-size:13.5px }
  .ft-cta__inner { flex-direction:column; align-items:flex-start; gap:12px; padding-block:20px }
  .ft-cta h3 { margin-bottom:5px; font-size:17px; line-height:1.3 }
  .ft-cta p { font-size:13px; line-height:1.45 }
  .ft-cta a { min-height:36px; gap:6px; padding:8px 14px; font-size:11.5px }
  .ft-cta a span { font-size:13px; line-height:1 }
  .ft-metrics { margin-top:18px; border-radius:12px }
  .ft-metrics>div { min-height:108px; gap:5px; padding:10px 6px }
  .ft-metrics strong { font-size:18px; line-height:1.05 }
  .ft-metrics span { font-size:11px; line-height:1.35 }
  .ft-tab-list { grid-template-columns:1fr 1fr; gap:7px }
  .ft-tab-list button { min-height:48px; padding:9px; font-size:12px }
  [data-fruit-features] { gap:14px }
  [data-fruit-features] .ft-tab-list { gap:8px }
  [data-fruit-features] .ft-tab-list button { min-height:44px; padding:8px 6px; border-radius:10px; font-size:13px; line-height:1.25 }
  [data-fda-tabs] { gap:12px }
  [data-fda-tabs] .ft-tab-list { gap:8px }
  [data-fda-tabs] .ft-tab-list button { min-height:44px; gap:6px; padding:7px 8px; border-radius:10px; font-size:12px; line-height:1.25 }
  [data-fda-tabs] .ft-tab-list button .ft-fda-num { width:23px; height:23px; font-size:9px }
  [data-fda-tabs] .ft-tab-panel { padding:16px 14px }
  .ft-tab-panel { min-height:0; padding:14px 12px }
  [data-fruit-features] .ft-tab-panel { padding:16px 14px; border-radius:13px }
  [data-fruit-features] .ft-tab-panel h3 { margin-bottom:5px; font-size:16px }
  [data-fruit-features] .ft-tab-panel>p { margin-bottom:10px; font-size:13px; line-height:1.45 }
  [data-fruit-features] .ft-tab-panel ul { gap:0 }
  .ft-tab-panel li { padding:8px 3px 8px 22px; font-size:12.5px; line-height:1.45 }
  .ft-tab-panel li::before { left:5px; width:6px; height:6px }
  .ft-industry-cards { grid-template-columns:repeat(2, 1fr); gap:12px }
  .ft-ind-card { padding:16px 14px; border-radius:14px }
  .ft-ind-top { margin-bottom:11px }
  .ft-ind-num { width:29px; height:29px; font-size:11px }
  .ft-ind-icon { width:38px; height:38px; border-radius:11px }
  .ft-ind-icon svg { width:18px; height:18px }
  .ft-ind-card h3 { margin-bottom:6px; font-size:16px }
  .ft-ind-card p { margin-bottom:12px; font-size:13px; line-height:1.45 }
  .ft-ind-tag { padding:5px 10px; font-size:10.5px }
  .ft-risk-accordion { gap:10px }
  .ft-risk-accordion summary { padding:13px 14px }
  .ft-risk-sum-left { gap:9px }
  .ft-risk-num,.ft-risk-arrow { width:29px; height:29px; font-size:11px }
  .ft-risk-accordion summary h3 { font-size:16px }
  .ft-risk-body { grid-template-columns:1fr; gap:9px; padding:0 14px 14px }
  .ft-risk-box { padding:14px; border-radius:10px }
  .ft-risk-badge { margin-bottom:8px; padding:4px 8px; font-size:10px }
  .ft-risk-box p { font-size:13px; line-height:1.5 }
  .ft-steps { gap:24px }
  .ft-steps article { padding:15px 14px; border-radius:13px }
  .ft-steps article>span { width:29px; height:29px; margin-bottom:10px; font-size:11px }
  .ft-steps article h3 { margin-bottom:5px; font-size:16px }
  .ft-steps article p { font-size:13px; line-height:1.45 }
  .ft-steps article:not(:last-child)::after { top:auto; right:calc(50% - 14px); bottom:-26px; display:flex; width:28px; height:28px; background-size:13px 13px; transform:rotate(90deg) }
  .ft-table-wrap th, .ft-table-wrap td { padding:13px 14px; font-size:12.5px }
  .ft-roi-grid article { padding:20px 18px }
  .ft-faq-list summary { padding:16px 52px 16px 18px; font-size:15.5px }
  .ft-faq-list p { padding:0 18px 18px; font-size:14px }
}
/* Mobile accordion for diagnostic */ .tg-diagnostic-accordion { display:none }
@media (max-width:767px) {
  .ft-industry-cards { grid-template-columns:1fr; gap:12px }
  .ft-ind-card { padding:16px 14px }
  .tg-diagnostic-body { grid-template-columns:1fr; gap:16px }
  .tg-diagnostic-panel { order:-1; position:static; height:auto; min-height:0; padding:18px 16px; border-radius:14px }
  .tg-diagnostic-index { order:1 }
  .tg-diagnostic-item { gap:10px; padding-block:12px }
  .tg-diagnostic-label { font-size:14px }
}
.tg-genealogy-diagram { position:relative; display:flex; justify-content:space-between; padding:8px 0 40px; margin-bottom:40px }
.tg-genealogy-node { position:relative; z-index:2; flex:1; display:flex; flex-direction:column; align-items:center; gap:12px; background:transparent; border:none; padding:0 6px }
.tg-genealogy-node:not(:last-child)::after { content:""; position:absolute; top:27px; left:50%; width:100%; height:2px; background:var(--tg-border); z-index:1; pointer-events:none }
.tg-genealogy-dot { position:relative; z-index:2; width:54px; height:54px; border-radius:50%; background:var(--tg-white); border:2px solid var(--tg-border); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; color:var(--tg-body); transition:border-color var(--tg-ease), background var(--tg-ease), color var(--tg-ease) }
.tg-genealogy-node span { font-size:13.5px; font-weight:600; color:var(--tg-heading); text-align:center; line-height:1.3 }
.tg-genealogy-node.is-active .tg-genealogy-dot { background:var(--tg-primary); border-color:var(--tg-primary); color:var(--tg-white) }
.tg-genealogy-node:hover .tg-genealogy-dot { border-color:var(--tg-primary) }
.tg-genealogy-panel { border:1px solid var(--tg-border); border-radius:var(--tg-radius-l); padding:40px; box-shadow:var(--tg-shadow-panel); display:grid; grid-template-columns:1fr 1fr; gap:40px }
.tg-genealogy-panel-head { display:flex; align-items:center; gap:10px; margin-bottom:14px }
.tg-genealogy-step-tag { font-size:12.5px; font-weight:700; color:var(--tg-primary); background:var(--tg-primary-soft); padding:4px 10px; border-radius:var(--tg-radius-pill) }
.tg-genealogy-panel h3 { font-size:23px; margin-bottom:12px }
.tg-genealogy-panel p { max-width:460px }
.tg-genealogy-fields { display:grid; gap:0; align-content:start }
.tg-genealogy-field { display:flex; align-items:center; gap:10px; padding-block:12px; border-top:1px solid var(--tg-border); font-size:14.5px; color:var(--tg-heading); font-weight:500 }
.tg-genealogy-field:last-child { border-bottom:1px solid var(--tg-border) }
.tg-genealogy-field svg { width:17px; height:17px; stroke:var(--tg-primary) }
@media (max-width:991px) {
  .tg-genealogy-diagram { margin-bottom:0px }
}
@media (max-width:767px) {
  .tg-genealogy-diagram { padding:8px 0 20px 0; margin-bottom:16px; overflow-x:auto; -webkit-overflow-scrolling:touch; gap:12px; justify-content:flex-start }
  .tg-genealogy-node { min-width:86px; flex:0 0 auto; gap:6px; padding:0 4px }
  .tg-genealogy-node:not(:last-child)::after { top:21px; width:calc(100% + 12px) }
  .tg-genealogy-dot { width:42px; height:42px; font-size:12px }
  .tg-genealogy-node span { font-size:12px }
  .tg-genealogy-panel { grid-template-columns:1fr; gap:18px; padding:20px 16px; border-radius:14px }
  .tg-genealogy-panel h3 { font-size:19px; margin-bottom:6px }
  .tg-genealogy-panel p { margin-bottom:12px; font-size:14px }
  .tg-genealogy-field { padding-block:10px; font-size:13.5px }
}
/* Mobile stepper */ .tg-genealogy-stepper { display:none }
.tg-toc-section { display:none; background-color:#fafafa; padding:32px 0; border-bottom:1px solid rgba(0, 0, 0, .05) }
.tg-toc-section .container-xl-custom { width:100%; max-width:1280px; margin-inline:auto; padding-inline:80px }
.tg-toc-card { max-width:100%; margin:0 auto; background:#fff; border:1px solid #e6f5ee; border-radius:16px; padding:15px 25px; box-shadow:0 8px 24px rgba(0, 40, 22, .04) }
.tg-toc-trigger { width:100%; background:none; border:none; display:flex; justify-content:space-between; align-items:center; padding:0; color:var(--tg-heading); cursor:pointer; font-family:'Inter', sans-serif }
.tg-toc-trigger-text { font-size:18px; font-weight:700; display:flex; align-items:center; gap:10px }
.tg-toc-trigger-text svg { width:22px; height:22px; color:var(--tg-primary); flex-shrink:0 }
.tg-toc-arrow { width:36px; height:36px; background:#e6f5ee; border-radius:50%; color:var(--tg-primary-dark); display:flex; align-items:center; justify-content:center; transition:transform .3s cubic-bezier(.4, 0, .2, 1) }
.tg-toc-arrow svg { width:18px; height:18px }
.tg-toc-card.active .tg-toc-arrow { transform:rotate(180deg) }
.tg-toc-body { max-height:0; overflow:hidden; transition:max-height .35s cubic-bezier(.4, 0, .2, 1) }
#toc-list-container.toc-expanded { max-height:1200px }
.tg-toc-nav { margin-top:20px; padding:20px 0 2px 20px; border-top:1px solid #e6f5ee; border-left:3px solid var(--tg-primary) }
.tg-toc-list { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:12px 24px }
.tg-toc-item { margin:0; padding:0 }
.tg-toc-link { display:flex; align-items:center; gap:8px; font-size:14.5px; color:#475467; font-weight:500; padding:4px 0; transition:color .2s ease; text-decoration:none }
.tg-toc-link::before { content:""; width:7px; height:7px; background-color:var(--tg-primary); border-radius:50%; display:inline-block; flex-shrink:0; margin-right:4px }
.tg-toc-link:hover, .tg-toc-link:active { color:var(--tg-primary); text-decoration:none }
@media (max-width:991px) {
  .tg-toc-section { display:block; padding:20px 0 }
  .tg-toc-section .container-xl-custom { padding-inline:48px }
}
@media (max-width:767px) {
  .tg-toc-section { padding:20px 0 }
  .tg-toc-section .container-xl-custom { padding-inline:16px }
  .tg-toc-card { padding:16px }
  .tg-toc-trigger-text { font-size:16px }
  .tg-toc-trigger-text svg { width:20px; height:20px }
  .tg-toc-arrow { width:32px; height:32px }
  .tg-toc-nav { margin-top:16px; padding:16px 0 2px 16px }
  .tg-toc-list { grid-template-columns:1fr; gap:10px }
  .tg-toc-link { padding:6px 0; font-size:14px }
}
