:root {
  font-size: clamp(9px, 1.28535vw, 18px);
  --ink: #0a1021;
  --body: #18243f;
  --green: #218f05;
  --icon: #35a400;
  --card: linear-gradient(150deg, #fff 30%, #f7faf8);
  --shadow: 0 .3rem .75rem #294f4d1c, 0 .08rem .22rem #294f4d18;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font: 1.05rem/1.35 Arial, Helvetica, sans-serif; }
h1, h2, h3, p, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
h2 { font-size: 1.96rem; line-height: 1.08; letter-spacing: -.065rem; font-weight: 700; }
h3 { font-size: 1.06rem; line-height: 1.16; font-weight: 700; letter-spacing: -.02rem; }
p { color: var(--body); }
a { color: inherit; text-decoration: none; }
/* Existing typography is preserved; context links reveal affordance on hover only. */
a.erp-seo-context-link:hover { text-decoration: underline; text-underline-offset: 2px; }
button, input, select { font: inherit; }
button { cursor: pointer; }
img { max-width: 100%; display: block; }
em { color: var(--green); font-style: normal; }
:focus-visible { outline: .22rem solid #208f05; outline-offset: .2rem; }
[hidden] { display: none !important; }
.container { width: calc(100% - 4.4rem); max-width: 86rem; margin-inline: auto; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon, .check { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.check { width: 1.4rem; height: 1.4rem; padding: .23rem; border-radius: 50%; background: #d8f1cc; color: #247c0d; stroke-width: 3; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.section-intro { margin-top: .45rem; font-size: 1.05rem; line-height: 1.24; }

/* Header and shared buttons */
.site-header { position: relative; z-index: 2; background: #fff; box-shadow: 0 .16rem .85rem #123b1110; }
.header-row { height: 4.15rem; display: flex; gap: 1.3rem; justify-content: space-between; align-items: center; }
.brand-pair { display: flex; align-items: center; flex: none; gap: .9rem; }
.brand-pair img:first-child { width: 9.15rem; height: 3.1rem; object-fit: contain; }
.brand-pair img + img { width: 8.2rem; }
.brand-pair span { font-size: 1.2rem; line-height: 1; }
.main-nav, .footer-nav { display: flex; align-items: center; gap: 1.5rem; font-size: .78rem; font-weight: 700; white-space: nowrap; }
.main-nav a:hover, .footer-nav a:hover { text-decoration: underline; }
.header-actions, .hero-actions { display: flex; gap: .65rem; align-items: center; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: .55em; min-height: 3.15rem; padding: .6em 1.45em; border: 1px solid transparent; border-radius: .65rem; font-size: 1.02rem; font-weight: 700; line-height: 1.05; white-space: nowrap; }
.button .icon { width: 1.15em; height: 1.15em; }
.button-green { color: #fff; background: linear-gradient(#57a806, #198600 52%, #086105); }
.button-green:hover { background: linear-gradient(#408900, #075604); }
.button-outline, .button-white { color: #0a1115; background: #fff; border-color: #329b23; }
.button-outline:hover, .button-white:hover { background: #edf9e9; }
.header-actions .button { font-size: .82rem; min-height: 2.25rem; border-radius: .5rem; padding-inline: 1.28em; }
.header-actions .button-outline { border-color: #c7dece; }
.menu-toggle { display: none; }

/* First screen and laptop chassis */
.hero { min-height: 32.85rem; background: linear-gradient(90deg, #fff 0%, #fff 28%, #fffffff0 37%, #ffffff68 47%, #ffffff00 64%), url("assets/greenhouse.jpg") center 23% / cover no-repeat, #eef6e9; overflow: hidden; }
.hero-inner { min-height: inherit; position: relative; display: flex; align-items: flex-start; }
.hero-copy { position: relative; z-index: 1; width: 31.8rem; padding-top: 3.05rem; }
.eyebrow { display: inline-block; margin-bottom: 1.18rem; padding: .36rem .83rem; border-radius: 2rem; color: #122121; background: #e8f4e9; box-shadow: 0 .12rem .23rem #245c2217; font-size: .78rem; font-weight: 800; }
.hero .hero-brand { display: flex; align-items: center; gap: .55rem; height: 3.58rem; font-size: 3.58rem; line-height: 1; letter-spacing: -.13rem; }
.hero .hero-brand img { width: 19rem; margin-left: -.65rem; }
.hero .hero-brand strong { color: #248c04; }
.hero-title { width: 33rem; margin-top: .55rem; color: var(--ink); font-size: 1.79rem; line-height: 1.08; letter-spacing: -.055rem; font-weight: 700; }
.hero-description { max-width: 30rem; margin-top: .92rem; font-size: 1.12rem; line-height: 1.34; }
.hero-actions { margin-top: 1.7rem; }
.hero-points { display: flex; gap: 1.45rem; margin-top: 2.0rem; }
.hero-points li, .contact-points li { display: flex; align-items: center; gap: .65rem; font-size: .82rem; font-weight: 700; line-height: 1.15; }
.hero-laptop { position: absolute; top: 4.75rem; right: 1.9rem; width: 41rem; perspective: 90rem; }
.laptop-lid { position: relative; margin-left: 4.8rem; padding: .9rem .95rem 1.05rem; border-radius: 1.45rem 1.45rem .5rem .5rem; border: .17rem solid #b3bab9; background: linear-gradient(130deg, #363d43, #0b1115 25% 86%, #434c50); box-shadow: .14rem .28rem .4rem #080c09c9; transform: perspective(70rem) rotateX(3deg) rotateY(-11deg) skewX(-4deg); transform-origin: center bottom; }
.laptop-lid::before { content: ""; position: absolute; top: .34rem; left: 50%; width: .32rem; height: .32rem; border-radius: 50%; background: #455158; }
.laptop-base { position: relative; height: 1.3rem; border-radius: 0 0 50% 50% / 0 0 75% 75%; background: linear-gradient(#e5e8e8 0%, #a5adaf 24%, #6a777a 34%, #dde2df 44%, #525959 81%, #262d2c 100%); box-shadow: 0 .66rem .8rem #101a1652; }
.laptop-base::after { content: ""; position: absolute; top: 0; left: 42%; width: 16%; height: .34rem; border-radius: 0 0 50% 50%; background: #626b6b; }

/* Benefits and module cards */
.advantages { min-height: 14.4rem; padding-top: 1.56rem; background: linear-gradient(#fbfcfb, #fff); }
.advantage-brand { display: inline-flex; align-items: center; height: 1.65rem; vertical-align: middle; gap: .22rem; }
.advantage-brand img { width: 9.25rem; }
.advantage-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .93rem; margin-top: .98rem; }
.advantage-grid li, .module-card, .interface-card, .connection-card, .core-modules li, .role-card, .stage-card { border: 1px solid #edf3f0; border-radius: 1.08rem; box-shadow: var(--shadow); background: var(--card); }
.advantage-grid li { min-height: 8.27rem; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: .7rem; text-align: center; font-size: 1rem; font-weight: 700; line-height: 1.18; }
.advantage-grid .icon, .module-card .icon, .role-card .icon, .stage-card .icon { color: var(--icon); font-size: 2.62rem; }
.onec { display: inline-grid; flex: none; place-items: center; width: 3rem; height: 2.6rem; border-radius: .55rem; background: #ffe100; color: #d02710; font-size: 1.53rem; font-weight: 900; letter-spacing: -.12em; padding-right: .14em; }
.modules { min-height: 24.25rem; padding-block: 1.26rem 1.2rem; background: linear-gradient(122deg, #fff 64%, #eff8ec 100%); }
.module-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .95rem 1.1rem; margin-top: 1.12rem; }
.module-card { display: flex; gap: 1.42rem; min-height: 7.6rem; padding: 1rem 1.2rem; }
.module-card p { margin-top: .48rem; font-size: .89rem; line-height: 1.29; }
.module-card .icon { margin-top: .15rem; }

/* Interface cards */
.interfaces { min-height: 25.2rem; padding-block: 1.18rem .85rem; background: linear-gradient(142deg, #fff 72%, #e9f7e3 100%); }
.interface-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .95rem; margin: 1.97rem -.5rem 0; }
.interface-card { min-height: 17.55rem; padding: 0 .45rem; }
.interface-preview { display: block; width: 100%; padding: 0; background: #f4f7f7; color: inherit; border: .15rem solid #d7dfe1; border-radius: .82rem; box-shadow: 0 .46rem .8rem #2a464e44; overflow: hidden; }
.interface-preview:hover { border-color: #62ad35; }
.interface-caption { padding: 1.02rem .23rem .85rem; }
.interface-caption h3 { display: flex; align-items: center; gap: .6rem; font-size: 1.01rem; }
.interface-caption .icon { color: var(--icon); font-size: 1.4rem; }
.interface-caption p { margin-top: .5rem; font-size: .86rem; line-height: 1.27; }

/* Application views shared by the hero, cards and modal */
.dashboard { --accent: #168d09; display: block; width: 100%; min-width: 0; aspect-ratio: 1.61; overflow: hidden; container-type: inline-size; color: #131a21; background: #ecf0f4; text-align: left; }
.dashboard-main { border-radius: .55rem; }
.dash-frame { height: 100%; display: grid; grid-template-columns: 21% 79%; font-size: 2.2cqw; line-height: 1.2; }
.dash-sidebar { padding: 1.2cqw 1cqw; color: #fff; background: linear-gradient(150deg, #053a22, #081813 70%); }
.dash-brand { display: flex; align-items: center; gap: .25cqw; height: 4.8cqw; margin-bottom: 1.05cqw; color: #fff; }
.dash-brand img { width: 78%; min-width: 0; }
.dash-brand strong { flex: none; font-size: 1.45cqw; }
.dash-nav { display: grid; gap: .31cqw; }
.dash-tab { display: flex; gap: .85cqw; align-items: center; border: 0; border-radius: .75cqw; color: #fff; padding: .85cqw .58cqw; background: transparent; text-align: left; font-size: 1.95cqw; line-height: 1.18; }
.dash-tab .icon { font-size: 2.4cqw; }
.dash-tab.is-active, button.dash-tab:hover { background: linear-gradient(100deg, #147c22, #0d5c23); }
.dash-main { padding: 1.6cqw 1.9cqw; overflow: hidden; }
.dash-top { display: flex; justify-content: flex-end; align-items: center; gap: 1.35cqw; min-height: 4.85cqw; margin-bottom: 1.5cqw; }
.dash-select { background: #fff; border: 1px solid #dce2e8; border-radius: .65cqw; color: #23313a; padding: .45cqw .7cqw; font-size: 1.75cqw; font-weight: 700; }
.dash-avatar { display: grid; place-items: center; background: #165646; color: #fff; border-radius: 50%; width: 3cqw; height: 3cqw; }
.dash-title { margin-bottom: 1.25cqw; font-size: 3cqw; letter-spacing: -.05em; color: #141a22; }
.dash-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1cqw; }
.dash-kpi, .dash-panel { padding: 1.05cqw; background: #fff; border-radius: 1.45cqw; box-shadow: 0 .32cqw .9cqw #1a344018; }
.dash-kpi { display: grid; align-content: start; min-height: 13.7cqw; gap: .32cqw; }
.dash-kpi .icon { font-size: 4.15cqw; color: #17a918; }
.dash-kpi.is-warning .icon { color: #fcb832; }
.dash-kpi strong { font-size: 3.3cqw; letter-spacing: -.035em; }
.dash-kpi.is-warning strong { color: #f2291c; }
.dash-kpi small { font-size: 1.55cqw; line-height: 1.1; }
.dash-charts { display: grid; grid-template-columns: 2fr 1fr; gap: 1.15cqw; margin-top: 1.6cqw; }
.dash-panel { color: #152127; }
.dash-panel > strong { display: block; font-size: 2.08cqw; }
.yield-chart { display: block; width: 100%; margin-top: .65cqw; overflow: visible; }
.dash-donut { display: grid; place-items: center; margin: 2.2cqw auto .5cqw; width: 13.5cqw; height: 13.5cqw; border-radius: 50%; background: conic-gradient(#23b51a 0 var(--completion), #d4f4cf var(--completion) 100%); }
.dash-donut b { display: grid; place-items: center; width: 10.2cqw; height: 10.2cqw; border-radius: 50%; background: white; font-size: 3.6cqw; }
.dash-equipment { display: grid; grid-template-columns: 1fr 1.65fr; gap: 2cqw; }
.equipment-list li { padding: 1.05cqw .55cqw; border-bottom: 1px solid #e7ecec; font-size: 1.85cqw; }
.equipment-list .icon { color: var(--accent); margin-right: .65cqw; }
.equipment-schematic { display: block; width: 100%; margin-top: 2cqw; }
.production-row { display: grid; grid-template-columns: 25% 75%; align-items: center; padding: 1.6cqw 0; border-bottom: 1px solid #e8eeef; }
.production-track { display: flex; background: repeating-linear-gradient(to right, #eef1f2 0 1px, transparent 1px 20%); height: 2.1cqw; }
.production-track i { display: block; border-radius: .35cqw; background: linear-gradient(90deg, #46af08, #9ce320); }
.dash-analytics-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2cqw; margin-bottom: 1.3cqw; }
.dash-analytics-kpis b { display: block; margin-top: .55cqw; font-size: 3.4cqw; }
.dash-analytics-kpis small { color: #168b13; }
.analytics-bars { display: flex; align-items: flex-end; gap: 2.9cqw; padding: 1.5cqw 2cqw .6cqw; height: 23.5cqw; background: repeating-linear-gradient(to top, #e5ecea 0 1px, transparent 1px 5.1cqw); }
.analytics-bars i { flex: 1; position: relative; margin-bottom: 2cqw; border-radius: .5cqw .5cqw 0 0; background: linear-gradient(100deg, #2d8d03, #85d117); }
.analytics-bars span { position: absolute; bottom: -2.1cqw; width: 100%; text-align: center; font-size: 1.6cqw; font-style: normal; }

/* Architecture map and connected system cards */
.architecture { min-height: 28.8rem; padding-block: 1.04rem 1rem; background: linear-gradient(#fff, #f7faf7); }
.architecture-grid { position: relative; display: grid; grid-template-columns: 20.5rem 1fr 19.2rem; gap: 1.05rem; margin-top: 1.18rem; min-height: 22rem; }
.architecture-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.architecture-side { display: flex; flex-direction: column; gap: .9rem; position: relative; }
.architecture-inputs { padding-top: .5rem; gap: 1.32rem; }
.connection-card { display: flex; align-items: center; gap: 1.1rem; padding: .75rem 1.18rem; min-height: 6.2rem; }
.architecture-inputs .connection-card { min-height: 8.53rem; padding-inline: .8rem; }
.connection-card h3 { font-size: .97rem; }
.connection-card p { margin-top: .38rem; font-size: .87rem; line-height: 1.23; }
.connection-card > .icon { color: var(--icon); width: 3.4rem; height: 3.4rem; padding: .28rem; }
.connection-card > .code-icon { color: #111720; border-radius: .5rem; background: #eff3f4; }
.connection-card .onec { width: 3.65rem; height: 3.35rem; font-size: 1.82rem; }
.controller-device { position: relative; display: grid; place-items: center; flex: 0 0 5.7rem; height: 2.9rem; border: .1rem solid #b4b9b4; border-radius: .5rem; background: repeating-linear-gradient(90deg, #bcc4c3 0 .12rem, #d9dfdc .12rem .44rem); box-shadow: inset 0 -.5rem #4a5c50, 0 .25rem .45rem #121a1850; }
.controller-device img { width: 1.8rem; }
.phone-device { position: relative; display: grid; place-items: center; flex: 0 0 4.3rem; height: 6.52rem; margin-inline: .6rem .8rem; border: .35rem solid #152121; border-radius: .85rem; background: linear-gradient(#14ae12 15%, #fff 15% 89%, #eef4f3 89%); box-shadow: 0 .35rem .5rem #162a2854; }
.phone-device img { width: 2.3rem; }
.architecture-core { display: flex; align-items: center; flex-direction: column; position: relative; min-width: 0; }
.architecture-brands { margin: .4rem 0 1.03rem; }
.architecture-brands img:first-child { width: 9.8rem; }
.architecture-brands img:last-child { width: 8.8rem; }
.core-laptop { width: 21rem; }
.core-screen { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 80%; height: 11.3rem; margin: 0 auto; border: .55rem solid #182923; border-bottom-width: .7rem; border-radius: .75rem .75rem 0 0; background: radial-gradient(ellipse at 65% 20%, #639b65, #133e22 48%, #032213); color: #fff; text-align: center; box-shadow: 0 0 2.2rem #83df6788; }
.core-brand { display: flex; align-items: center; justify-content: center; gap: .3rem; width: 100%; }
.core-brand img { width: 10.4rem; }
.core-brand strong { font-size: 1.45rem; line-height: 1; }
.core-screen p { color: #fff; margin-top: .35rem; font-size: .95rem; line-height: 1.14; }
.core-laptop .laptop-base { height: .72rem; }
.core-modules { display: grid; grid-template-columns: repeat(6, 1fr); width: 100%; gap: .33rem; margin-top: 1rem; }
.core-modules li { display: grid; justify-items: center; gap: .34rem; padding: .55rem .12rem .48rem; border-radius: .7rem; font-size: .63rem; font-weight: 700; }
.core-modules .icon { color: var(--icon); font-size: 1.55rem; }

/* Roles and implementation steps */
.roles { min-height: 17.55rem; padding: 1.48rem 0 .88rem; background: linear-gradient(90deg, #f6faf7 0% 57%, #f6faf7df 68%, #f6faf700 91%), url("assets/agronomist.jpg") right top / auto 119% no-repeat, #f6faf7; }
.role-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); width: 82%; gap: .9rem; margin-top: .9rem; }
.role-card { min-height: 10.25rem; padding: .77rem 1.1rem; background: linear-gradient(140deg, #ffffffed, #f9fcf7e9); }
.role-card h3 { margin: .22rem 0 .45rem; }
.role-card p { font-size: .84rem; line-height: 1.25; }
.role-card .icon { font-size: 2.38rem; }
.implementation { min-height: 18.35rem; padding-block: .98rem .78rem; background: linear-gradient(#fbfefa, #f1faed); }
.implementation-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.25rem; margin-top: .93rem; }
.stage-card { position: relative; min-height: 10.9rem; padding: .78rem .8rem 1rem 2.45rem; background: linear-gradient(145deg, #fff, #f2faec); }
.stage-card:not(:last-child)::after { content: "⟶"; position: absolute; z-index: 1; top: 3.35rem; right: -1.55rem; color: #3ca900; font-size: 1.95rem; }
.stage-number { position: absolute; top: 1.02rem; left: .76rem; display: grid; place-items: center; width: 1.72rem; height: 1.72rem; border-radius: 50%; background: linear-gradient(#71be08, #228e02); color: #fff; font-size: .98rem; font-weight: 800; }
.stage-card .icon { display: block; font-size: 2.28rem; margin: 0 0 .57rem .62rem; }
.stage-card p { margin-top: .55rem; font-size: .82rem; line-height: 1.2; }

/* Presentation banner, contact and footer */
.download-section { min-height: 11.55rem; padding-top: .32rem; }
.download-banner { display: flex; align-items: center; gap: 1.95rem; min-height: 9.25rem; padding: 1.05rem 2.9rem 1.05rem 3.85rem; border-radius: 1.15rem; background: linear-gradient(90deg, #022c16cf, #08361cbf 44%, #06381e0a 78%, #032f1cc7), url("assets/sunset.jpg") center 52% / cover, #0b4124; color: white; }
.pdf-sheet { width: 4.2rem; height: 5.3rem; flex: none; position: relative; border-radius: .52rem .9rem .55rem .55rem; background: linear-gradient(140deg, #fff, #d9e0e3); box-shadow: 0 .4rem .8rem #0004; }
.pdf-sheet::after { content: ""; position: absolute; inset: 0 0 auto auto; width: 1.45rem; height: 1.45rem; border-radius: 0 .6rem 0 .3rem; background: linear-gradient(45deg, #bfcdd0 50%, #dbe3e6 50%); }
.pdf-sheet span { position: absolute; bottom: .85rem; left: 1.3rem; border-radius: .34rem; background: #f00000; padding: .15rem .38rem; font-size: 1.25rem; font-weight: 900; }
.download-copy h2 { color: #fff; font-size: 1.98rem; }
.download-copy p { max-width: 31rem; margin-top: .6rem; color: white; font-size: 1.13rem; line-height: 1.3; }
.download-banner .button { margin-left: auto; min-height: 3.65rem; border-color: #fff; border-radius: .75rem; padding-inline: 1.85em; }
.download-banner .icon { color: #14702d; }
.contact { min-height: 16rem; background: linear-gradient(90deg, transparent 7%, #fffffff0 29%, #ffffff 38%, #f3faef 87%, #dff3d9), url("assets/contact.jpg") left 54% / auto 133% no-repeat; }
.contact-inner { min-height: inherit; display: flex; justify-content: flex-end; align-items: flex-start; }
.contact-copy { width: 69%; padding-top: 1.7rem; }
.contact h2 { font-size: 2.12rem; }
.contact .section-intro { font-size: 1.11rem; line-height: 1.3; }
.contact-form { display: grid; grid-template-columns: 1fr 1.02fr 1fr 1.05fr; gap: .5rem; margin-top: 1.4rem; }
.contact-form label { display: flex; min-width: 0; align-items: center; gap: .55rem; padding: 0 .72rem; border: 1px solid #d5e0e7; border-radius: .55rem; background: #fcfdfd; box-shadow: 0 .08rem .2rem #8a9fa72a; }
.contact-form label .icon { font-size: 1.2rem; color: #1e2c44; }
.contact-form input { width: 100%; min-width: 0; color: var(--ink); padding: .6rem 0; border: 0; background: transparent; font-size: .87rem; }
.contact-form input::placeholder { color: #4b5d76; }
.contact-form label:focus-within { outline: .17rem solid #208f05; }
.contact-form input:focus-visible { outline: none; }
.contact-form .button { padding-inline: .7em; }
.contact-points { display: flex; flex-wrap: wrap; gap: .72rem 2.55rem; margin-top: 1.56rem; }
.contact-points li { font-size: .78rem; gap: .46rem; }
.contact-points .check { width: 1.22rem; height: 1.22rem; padding: .15rem; background: #b1e86e; }
.form-status { margin-top: .6rem; color: #20562b; font-weight: 700; }
.site-footer { margin-top: 1.5rem; color: #fff; background: linear-gradient(100deg, #073926, #183b2c 60%, #0d3229); }
.footer-row { min-height: 7.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.footer-brands img:first-child { width: 10.7rem; height: 3.7rem; }
.footer-brands img:last-child { width: 9.85rem; }
.footer-description { flex: 1; border-left: 1px solid #ffffff7a; padding-left: 1.6rem; color: #fff; font-size: .78rem; line-height: 1.22; }
.footer-product { display: flex; align-items: center; gap: .15rem; height: 1.35rem; margin-bottom: .2rem; font-size: 1.04rem; }
.footer-product img { width: 5.75rem; margin-left: -.22rem; }
.footer-nav { gap: 1.12rem; font-weight: 500; }

/* Interactive detail dialog */
.demo-dialog { width: min(64rem, calc(100% - 2rem)); max-height: calc(100% - 2rem); padding: 1.2rem; border: 1px solid #d7ead5; border-radius: 1rem; color: var(--ink); }
.demo-dialog::backdrop { background: #0b271ec9; }
.dialog-header { display: flex; justify-content: space-between; align-items: center; gap: .75rem; margin-bottom: .85rem; }
.dialog-dashboard { border-radius: .7rem; }
.demo-note { margin-top: .65rem; }

@media (max-width: 699px) {
  :root { font-size: 12px; }
  .container { width: calc(100% - 2.5rem); }
  h2 { font-size: 1.78rem; }
  .header-row { min-height: 4.35rem; height: auto; gap: .4rem; }
  .header-row .brand-pair { gap: .45rem; }
  .header-row .brand-pair img:first-child { width: 6.6rem; height: auto; }
  .header-row .brand-pair img + img { width: 5.65rem; }
  .header-actions { display: none; }
  .menu-toggle { display: inline-flex; margin-left: auto; padding: .55rem .8rem; background: #fff; color: #235f21; border: 1px solid #b4d5b4; border-radius: .48rem; }
  .main-nav { display: none; position: absolute; inset: 100% 0 auto; padding: 1.1rem 1.25rem; background: #fff; box-shadow: var(--shadow); font-size: 1rem; }
  .main-nav.is-open { display: flex; flex-wrap: wrap; }
  .hero { background-position: center, 58% center; background-image: linear-gradient(#fffffff3 0%, #fff9 47%, #ffffff16 85%), url("assets/greenhouse.jpg"); }
  .hero-inner { display: block; padding-bottom: 2rem; }
  .hero-copy { width: 100%; padding-top: 1.85rem; }
  .hero .hero-brand { font-size: clamp(2.55rem, 10vw, 3.7rem); }
  .hero .hero-brand img { width: min(63%, 19rem); }
  .hero-title { width: auto; font-size: 1.63rem; }
  .hero-description { max-width: 26rem; }
  .hero-actions, .hero-points { flex-wrap: wrap; }
  .hero-actions { margin-top: 1.1rem; }
  .hero-points { margin-top: 1.3rem; gap: .75rem 1.1rem; }
  .hero-laptop { position: relative; inset: auto; width: min(95%, 34rem); margin: 1.65rem auto 0; }
  .laptop-lid { margin-left: 2.1rem; padding: .65rem .62rem .7rem; }
  .laptop-base { height: .8rem; }
  .section, .download-section { min-height: 0; padding-block: 1.55rem; }
  .advantage-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .advantage-grid li { min-height: 7rem; font-size: .93rem; }
  .module-grid, .interface-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .module-card { display: block; padding: .95rem; }
  .module-card .icon { margin: 0 0 .55rem; }
  .interface-grid { margin: 1.15rem 0 0; }
  .interface-card { min-height: 0; }
  .architecture-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem .7rem; }
  .architecture-core { grid-column: 1 / -1; grid-row: 1; }
  .architecture-lines { display: none; }
  .architecture-inputs { padding-top: 0; }
  .connection-card, .architecture-inputs .connection-card { padding: .75rem; flex-direction: column; align-items: flex-start; gap: .65rem; }
  .controller-device, .phone-device { flex: none; margin: 0; }
  .controller-device { width: 5.4rem; }
  .phone-device { width: 3.2rem; height: 5rem; }
  .core-modules { width: min(100%, 28rem); }
  .roles { background-size: auto, auto 75%; background-position: center, right bottom; background-image: linear-gradient(90deg, #f6faf7 0% 25%, #f6faf79c 80%, #f6faf74d), url("assets/agronomist.jpg"); }
  .role-grid, .implementation-grid { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .role-card { min-height: 0; }
  .stage-card:not(:last-child)::after { display: none; }
  .download-banner { display: grid; grid-template-columns: auto 1fr; gap: 1rem; padding: 1.25rem; }
  .download-copy h2 { font-size: 1.48rem; }
  .download-copy p { font-size: 1rem; }
  .download-banner .button { grid-column: 1 / -1; margin: 0; justify-self: start; }
  .contact { background-image: linear-gradient(#fff9, #f6fbf3 62%), url("assets/contact.jpg"); background-size: auto, cover; background-position: center; }
  .contact-copy { width: 100%; padding: 0; }
  .contact h2 { font-size: 1.78rem; }
  .contact-form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
  .contact-points { gap: .7rem 1rem; }
  .desktop-break { display: none; }
  .site-footer { margin-top: 0; }
  .footer-row { flex-wrap: wrap; padding-block: 1.25rem; }
  .footer-description { flex: 1 1 11rem; }
  .footer-nav { flex-wrap: wrap; white-space: normal; }
}
@media (max-width: 355px) {
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .module-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Native Bitrix ERP consent, separate row without changing original fields. */
.contact-form .erp-consent {grid-column:1/-1;display:flex;align-items:flex-start;gap:.45rem;padding:0;border:0;border-radius:0;background:none;box-shadow:none;font-size:.72rem;line-height:1.4}
.contact-form .erp-consent input[type=checkbox]{width:1.1rem;min-width:1.1rem;height:1.1rem;margin:.05rem 0 0;padding:0;accent-color:#208f05;cursor:pointer}
.contact-form .erp-consent a{color:#236b35;text-decoration:underline}
.erp-form-errors{margin-top:1rem;color:#9b1c1c;font-size:.84rem}
.erp-form-success{color:#20562b}


/* GardenBoss: site-only floating scroll-to-top control. Cookie UI has higher z-index. */
body .gb-back-to-top{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:40;
  display:flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  padding:0;
  border:1px solid #0d6932;
  border-radius:50%;
  background:linear-gradient(180deg,#168a4b,#07592e);
  color:#fff;
  box-shadow:0 7px 24px rgba(7,68,38,.25);
  opacity:0;
  visibility:hidden;
  transform:translateY(14px);
  pointer-events:none;
  transition:opacity .23s ease,transform .23s ease,visibility .23s ease,box-shadow .23s ease;
}
body .gb-back-to-top.is-visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}
body .gb-back-to-top.is-visible:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 28px rgba(7,68,38,.32);
}
body .gb-back-to-top:focus-visible{
  outline:3px solid #78c94a;
  outline-offset:3px;
}
body .gb-back-to-top svg{width:24px;height:24px;flex:0 0 24px}
@media(max-width:650px){
  body .gb-back-to-top{width:46px;height:46px;right:16px;bottom:16px}
  body .gb-back-to-top svg{width:22px;height:22px;flex-basis:22px}
}
@media(prefers-reduced-motion:reduce){
  body .gb-back-to-top{transition:none}
  body .gb-back-to-top.is-visible:hover{transform:none}
}