/* Агропроцессор.Ядро — раздел «Шкафы управления».
   Подключать ПОСЛЕ styles.css. Токены совпадают с :root сайта (--ink, --accent, --pale, --line, --muted, --cyan).
   Все новые компоненты имеют префикс .cab-, чтобы не пересекаться со стилями сайта. */
:root { --deep: #103d2a; --tint: #edf7ed }
.cab-hero,.cab-card,.cab-panel{box-sizing:border-box}
.cab-hero *,.cab-card *,.cab-panel *{box-sizing:border-box}

/* header: активный пункт */
.desktop-nav a[aria-current="page"]{color:var(--accent);font-weight:700}
.mobile-nav a[aria-current="page"]{color:var(--accent);font-weight:700}

/* HERO */
.cab-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:56px;align-items:center;padding:64px 0 44px}
.cab-hero h1{font-size:60px;line-height:1.08;letter-spacing:-1.6px;font-weight:700;margin:14px 0 20px;color:var(--ink)}
.cab-hero h1 span{color:var(--accent)}
.cab-lead{font-size:18px;line-height:1.65;color:var(--muted);max-width:560px;margin:0 0 28px}
.cab-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-bottom:30px}
.cab-hero .maker{display:inline-flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);text-decoration:none}
.cab-hero .maker b{color:#1b3a8f;font-size:15px;letter-spacing:.2px}
.cab-hero .nano-logo{display:block}
.cab-hero-visual{margin:0;position:relative;border-radius:16px 16px 44px 16px;overflow:hidden;background:var(--ink);aspect-ratio:4/4.6;max-height:560px}
.cab-hero-visual img{width:100%;height:100%;object-fit:cover;display:block;opacity:.96}
.cab-hero-visual figcaption{position:absolute;left:0;right:0;bottom:0;padding:70px 28px 26px;color:#fff;font-size:22px;line-height:1.25;font-weight:700;background:linear-gradient(to top,rgba(16,61,42,.92),rgba(16,61,42,0))}
.cab-hero-visual figcaption small{display:block;font-size:11px;letter-spacing:1.15px;text-transform:uppercase;font-weight:700;color:var(--cyan);margin-bottom:6px}

/* proofbar */
.cab-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 0}
.cab-proof-item{display:flex;gap:14px;align-items:flex-start}
.cab-num{flex:0 0 28px;width:28px;min-width:28px;height:28px;border:1px solid #b7d7c3;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;color:var(--accent)}
.cab-proof-item strong{display:block;font-size:14px;color:var(--ink)}
.cab-proof-item small{display:block;font-size:12px;color:var(--muted);margin-top:3px}

/* заголовок секции */
.cab-heading{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:end;margin:12px 0 34px}
.cab-heading h2,.cab-panel h2,.cab-platform h2,.cab-start h2{font-size:47px;line-height:1.15;letter-spacing:-1px;font-weight:700;margin:12px 0 0;color:var(--ink)}
.cab-heading p{margin:0;color:var(--muted);font-size:16px;line-height:1.6;max-width:430px;justify-self:end}

/* фильтр */
.cab-filter{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 26px}
.cab-filter button{font:inherit;font-size:14px;cursor:pointer;padding:10px 16px;border-radius:24px;border:1px solid var(--ink);background:#fff;color:var(--ink);min-height:44px;transition:background .15s,color .15s}
.cab-filter button.is-on,.cab-filter button:hover{background:var(--ink);color:#fff}
.cab-filter button:focus-visible,.cab-card summary:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}

/* карточки задач */
.cab-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cab-card{position:relative;background:var(--tint);border:1px solid var(--line);border-radius:16px;padding:26px;display:flex;flex-direction:column;gap:0}
.cab-card[hidden]{display:none}
.cab-card-no{position:absolute;right:22px;top:20px;font-size:12px;color:var(--muted)}
.cab-tag{align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;padding:5px 10px;border-radius:14px;border:1px solid var(--line);color:var(--muted);background:#fff;margin-bottom:16px}
.cab-tag-on{background:var(--accent);border-color:var(--accent);color:#fff}
.cab-card h3{font-size:23px;line-height:1.25;font-weight:700;margin:0 0 10px;color:var(--ink)}
.cab-card>p{font-size:14px;line-height:1.65;color:var(--muted);margin:0 0 10px}
.cab-card .cab-dir{font-size:12px;font-weight:700;color:var(--accent);margin-top:auto;padding-top:6px}
.cab-card details{border-top:1px solid var(--line)}
.cab-card summary{display:flex;justify-content:space-between;align-items:center;gap:14px;cursor:pointer;list-style:none;font-weight:700;min-height:48px;line-height:1.45}
.cab-card summary{font-size:14px}
.cab-card summary::-webkit-details-marker{display:none}
.cab-card summary::after{content:"+";color:var(--accent);flex:0 0 16px;font-size:23px;font-weight:400}
.cab-card details[open]>summary::after{content:"−"}
.cab-card details p{font-size:14px;line-height:1.65;color:var(--muted);margin:0 0 12px}
.cab-card .text-link{margin-top:10px}
.cab-note{margin:22px 0 0;color:var(--muted);font-size:14px;max-width:760px}

/* центральная панель */
.cab-panel{background:var(--deep);color:#fff;padding:80px 0}
.cab-panel-inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}
.cab-panel-photo{margin:0;background:var(--pale);border-radius:16px;padding:16px;color:var(--ink)}
.cab-badge{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;margin-bottom:14px}
.cab-badge img{height:22px;width:auto}
.cab-panel-photo>img{display:block;width:100%;max-height:520px;object-fit:contain;background:#fff;border-radius:10px}
.cab-panel-photo figcaption{font-size:11px;color:var(--muted);margin-top:10px}
.cab-panel h2{color:#fff}
.cab-panel .eyebrow{color:#7fe3b0}
.cab-panel-lead{font-size:16px;line-height:1.65;color:#cfe3d6;margin:16px 0 22px;max-width:620px}
.cab-spec{margin:0 0 26px}
.cab-spec>div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:24px;padding:14px 0;border-top:1px solid rgba(255,255,255,.18)}
.cab-spec>div:last-child{border-bottom:1px solid rgba(255,255,255,.18)}
.cab-spec dt{font-size:13px;color:#a9c7b6}
.cab-spec dd{margin:0;font-size:15px;font-weight:700;line-height:1.45}
.cab-panel-links{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center}
.cab-panel .text-link{color:#7fe3b0}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:#e8f4ec}

/* как устроен / шаги */
.cab-flow,.cab-steps{list-style:none;margin:0;padding:0;display:grid;gap:28px}
.cab-flow{grid-template-columns:repeat(4,minmax(0,1fr))}
.cab-flow li{position:relative;border-top:2px solid var(--accent);padding-top:18px}
.cab-flow li:not(:last-child)::after{content:"→";position:absolute;right:-22px;top:6px;color:var(--accent);font-size:18px}
.cab-flow h3,.cab-steps h3,.cab-triple h3{font-size:20px;line-height:1.3;margin:12px 0 8px;font-weight:700}
.cab-flow p,.cab-steps p,.cab-triple p{font-size:14px;line-height:1.65;color:var(--muted);margin:0}

/* платформа */
.cab-platform{background:var(--deep);color:#fff;padding:80px 0}
.cab-platform h2{color:#fff}
.cab-platform .eyebrow{color:#7fe3b0}
.cab-triple{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px;margin:38px 0 28px}
.cab-triple>div{border-top:1px solid rgba(255,255,255,.2);padding-top:18px}
.cab-triple .cab-num{border-color:rgba(255,255,255,.35);color:#7fe3b0}
.cab-triple small{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#7fe3b0;margin-bottom:8px}
.cab-triple p{color:#cfe3d6}
.text-link-light{color:#7fe3b0}

/* как заказать */
.cab-start{background:var(--pale);padding:78px 0}
.cab-start .cab-heading{margin-bottom:34px}
.cab-steps{grid-template-columns:repeat(3,minmax(0,1fr))}

/* планшет */
@media (max-width:1100px){
  .cab-hero{grid-template-columns:1fr;gap:36px}
  .cab-hero-visual{max-height:420px;aspect-ratio:16/10}
  .cab-hero h1{font-size:48px}
  .cab-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cab-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cab-flow li::after{display:none}
  .cab-panel-inner,.cab-heading{grid-template-columns:1fr;gap:32px}
  .cab-heading p{justify-self:start}
}
/* телефон */
@media (max-width:640px){
  .cab-hero{padding:40px 0 30px}
  .cab-hero h1{font-size:38px;letter-spacing:-1px}
  .cab-lead{font-size:16px}
  .cab-heading h2,.cab-panel h2,.cab-platform h2,.cab-start h2{font-size:34px}
  .cab-proof,.cab-grid,.cab-flow,.cab-steps,.cab-triple{grid-template-columns:1fr}
  .cab-panel,.cab-platform,.cab-start{padding:56px 0}
  .cab-spec>div{grid-template-columns:1fr;gap:4px}
}
@media (prefers-reduced-motion:reduce){.cab-filter button{transition:none}}

/* Shared site components provide the form, footer and mobile controls. */
.cab-hero-copy, .cab-panel-copy, .cab-card { min-width: 0 }
.cab-hero h1, .cab-panel h2 { overflow-wrap: anywhere }
.cab-tag { max-width: calc(100% - 24px); letter-spacing: .2px }
.cab-hero-visual { aspect-ratio: 9 / 14; background: var(--pale); max-height: 620px }
.cab-hero-visual img { object-fit: contain; opacity: 1 }
.object-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px }
.object-gallery figure { min-width: 0; margin: 0 }
.object-gallery img { width: 100%; height: auto; border-radius: 16px }
.object-gallery figcaption { margin-top: 12px; font-size: 14px; color: var(--muted) }
@media (max-width: 1100px) {
 .cab-hero { grid-template-columns: minmax(0, 1fr) minmax(0, .75fr); gap: 28px }
 .cab-hero h1 { font-size: 42px }
 .cab-hero-visual { max-height: 540px }
}
@media (max-width: 767px) {
 .cab-hero { grid-template-columns: minmax(0, 1fr) }
 .cab-hero-visual { width: 100%; max-width: 380px; height: 470px; justify-self: center }
 .object-gallery { grid-template-columns: minmax(0, 1fr) }
}
@media (max-width: 640px) {
 .cab-hero h1 { font-size: 36px }
 .cab-actions { align-items: stretch; flex-direction: column; gap: 8px }
 .cab-actions .btn, .cab-actions .text-link { justify-content: center }
 .cab-hero-visual figcaption { font-size: 19px; padding: 60px 20px 20px }
}