/* Alignment pass against the approved homepage mockup. Loaded last intentionally. */
.hero { min-height: 530px; }
.hero__grid { grid-template-columns: 34% 66%; min-height: 530px; }
.hero__copy { padding: 40px 18px 30px 0; }
.hero h1 { max-width: 480px; margin: 0 0 18px; font-size: clamp(38px, 3.25vw, 51px); line-height: 1.045; }
.hero__lead { max-width: 485px; font-size: 14px; line-height: 1.62; }
.hero__actions { margin-top: 23px; }
.hero__stats { margin-top: 27px; gap: 12px; }
.hero__stats dt { font-size: 19px; }
.hero__stats dd { font-size: 11px; }
.hero-system { min-height: 530px; margin: 0; overflow: visible; }
.hero-system__links { inset: 0; width: 100%; height: 100%; }
.system-card { width: 29%; min-width: 0; padding: 10px; border-radius: 10px; }
.system-card__head { grid-template-columns: 25px 1fr auto; gap: 7px; margin-bottom: 7px; }
.system-card__head > span { width: 25px; height: 25px; }
.system-card__head svg { width: 20px; }
.system-card__head strong { font-size: 12px; }
.system-card__head small { font-size: 10px; margin-top: 2px; }
.system-card__head b { font-size: 17px; }
.system-card .ui-preview__body { min-height: 62px; padding: 7px; }
.system-card .mock-map { min-height: 54px; }
.system-card .mock-chart { height: 52px; }
.system-card--sales { left: 8%; top: 12px; }
.system-card--stock { right: 4%; top: 12px; }
.system-card--docs { left: 0; top: 157px; }
.system-card--logistics { right: 0; top: 158px; }
.system-card--analytics { left: 8%; bottom: 54px; }
.system-card--production { right: 4%; bottom: 54px; }
.system-card--dev { left: 37.5%; bottom: 2px; width: 25%; }
.system-core { left: 38%; top: 151px; width: 24%; }
.system-core strong { font-size: clamp(19px, 1.65vw, 27px); }
.system-core span { font-size: 11px; margin-top: 10px; }
.process-breaks__inner { min-height: 100px; grid-template-columns: 230px 1fr 160px; gap: 18px; }
.process-breaks__title h2 { font-size: 21px; white-space: nowrap; }
.process-breaks__title p { font-size: 11px; margin-top: 6px; }
.process-breaks__items { gap: 12px; }
.problem-item { gap: 7px; }
.problem-item__icon, .problem-item__icon img { width: 30px; height: 30px; flex-basis: 30px; }
.problem-item strong, .problem-item span { font-size: 10px; }
.process-breaks__inner > .button { min-height: 44px; padding-inline: 10px; }

@media (max-width: 1240px) {
    .site-header__inner { grid-template-columns: 165px minmax(0,1fr) 150px; gap: 12px; }
    .site-nav { gap: 16px; }
    .site-nav a { font-size: 11px; white-space: nowrap; }
    .site-header__actions .button { min-height: 40px; padding-inline: 12px; font-size: 11px; }
    .hero { min-height: 500px; }
    .hero__grid { min-height: 500px; grid-template-columns: 35% 65%; }
    .hero__copy { padding-right: 14px; }
    .hero h1 { font-size: clamp(35px, 3.8vw, 44px); }
    .hero__lead { font-size: 13px; }
    .hero-system { min-height: 500px; transform: none; margin: 0; }
    .system-card--docs, .system-card--logistics { top: 148px; }
    .system-core { top: 143px; }
    .process-breaks__inner { grid-template-columns: 220px 1fr 150px; gap: 14px; padding-block: 0; }
    .process-breaks__inner > .button { grid-column: auto; justify-self: stretch; margin-top: 0; }
    .process-breaks__title h2 { font-size: 20px; }
    .process-breaks__items { gap: 8px; }
    .problem-item { gap: 5px; }
    .problem-item__icon, .problem-item__icon img { width: 27px; height: 27px; flex-basis: 27px; }
    .problem-item strong, .problem-item span { font-size: 9px; }
}

@media (max-width: 980px) {
    .site-header__inner { grid-template-columns: auto 1fr auto; }
    .hero { min-height: auto; }
    .hero__grid { grid-template-columns: 1fr; min-height: auto; }
    .hero__copy { padding: 44px 0 26px; }
    .hero h1 { max-width: 720px; font-size: clamp(38px, 6vw, 52px); }
    .hero__lead { max-width: 680px; font-size: 15px; }
    .hero-system { min-height: 520px; transform: none; margin: 0; }
    .process-breaks__inner { grid-template-columns: 1fr; padding-block: 20px; }
    .process-breaks__title h2 { white-space: normal; }
    .process-breaks__items { grid-template-columns: repeat(3,1fr); gap: 16px; }
    .process-breaks__inner > .button { grid-column: auto; justify-self: start; margin: 0; }
}

@media (max-width: 640px) {
    .hero__copy { padding-top: 34px; }
    .hero h1 { font-size: 38px; }
    .hero__stats { margin-top: 24px; }
    .hero-system { min-height: 790px; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: minmax(122px, auto); gap: 9px; padding-top: 158px; }
    .hero-system__links { display: none; }
    .system-core { left: 50%; top: 12px; transform: translateX(-50%); width: 148px; height: 136px; aspect-ratio: auto; }
    .hero-system .system-card { position: relative; inset: auto; width: auto; min-width: 0; padding: 9px; }
    .hero-system .system-card--dev { grid-column: 1/-1; width: 52%; justify-self: center; }
    .system-card .ui-preview__body { min-height: 54px; }
    .process-breaks__items { grid-template-columns: 1fr; }
}

/* Mid and lower page composition from the approved mockup. */
.architecture-band { background: linear-gradient(90deg, #fff8ee 0 45%, #f4f8ff 45% 100%); border-top: 3px solid #f1b24a; border-bottom: 3px solid #4db98d; }
.architecture-row { width: var(--shell); margin-inline: auto; display: grid; grid-template-columns: 44% 56%; align-items: stretch; }
.architecture-row .system-constructor,
.architecture-row .order-path { min-width: 0; padding: 28px 18px 22px; background: transparent; }
.architecture-row .system-constructor { border-right: 2px solid #7ea8ef; }
.architecture-row .order-path { border-left: 2px solid #f39a72; }
.architecture-row .shell { width: 100%; }
.architecture-row .section-heading { margin-bottom: 18px; }
.architecture-row .section-heading h2 { font-size: 24px; }
.architecture-row .section-heading p { font-size: 11px; max-width: 370px; }
.architecture-row .eyebrow { display: none; }
.architecture-row .constructor-grid { grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; }
.architecture-row .constructor-card { min-height: 260px; padding: 11px 9px; border-radius: 9px; }
.architecture-row .constructor-card h3 { margin-bottom: 12px; font-size: 10px; }
.architecture-row .constructor-card ul { gap: 9px; }
.architecture-row .constructor-card li { gap: 6px; font-size: 8px; }
.architecture-row .constructor-card li span { width: 7px; height: 7px; }
.architecture-row .constructor-card__highlight { padding: 9px 5px; margin-bottom: 10px; font-size: 8px; }
.architecture-row .constructor-footer { margin-top: 14px; gap: 20px; font-size: 9px; }
.architecture-row .constructor-footer .button { min-height: 32px; font-size: 9px; }
.architecture-row .order-path__track { grid-template-columns: repeat(8, minmax(0,1fr)); gap: 0; overflow: visible; padding-top: 2px; }
.architecture-row .path-step { min-width: 0; padding-inline: 4px; }
.architecture-row .path-step::before { top: 15px; }
.architecture-row .path-step__number { width: 31px; height: 31px; margin-bottom: 10px; font-size: 10px; }
.architecture-row .path-step h3 { min-height: 38px; font-size: 8px; }
.architecture-row .path-step p { min-height: 72px; margin: 8px 0; font-size: 7px; line-height: 1.35; }
.architecture-row .path-step__mock .ui-preview__body { min-height: 44px; padding: 4px; }
.architecture-row .path-step__mock .mock-map { min-height: 36px; }
.architecture-row .path-step__mock .mock-chart { height: 36px; }
.architecture-row .center-action { margin-top: 9px; }
.architecture-row .center-action .button { min-height: 34px; font-size: 9px; }

.ecosystem { border-top: 0; }
.ecosystem__grid { grid-template-columns: 1.02fr .96fr 1.06fr; gap: 14px; padding-top: 18px; padding-bottom: 18px; }
.ecosystem .section-intro--compact { padding-top: 0; }
.ecosystem .section-intro--compact h2 { font-size: 26px; }
.ecosystem .section-intro--compact p { margin: 10px 0 14px; font-size: 11px; line-height: 1.45; }
.integration-grid { gap: 7px; }
.integration-card { min-height: 112px; padding: 10px; }
.manager-dashboard { border-radius: 10px; padding: 13px; }
.cases-panel__head { margin-bottom: 9px; }
.case-card { padding: 12px; }
.case-mini-grid { gap: 8px; margin-top: 8px; }

.how-faq { padding: 22px 0 18px; }
.how-faq__grid { grid-template-columns: 1.58fr 1fr; gap: 18px; }
.work-steps { gap: 6px; }
.work-steps article { grid-template-columns: 36px 1fr; gap: 8px; }
.work-steps article > span { width: 34px; height: 34px; }
.how-note { min-height: 58px; margin-top: 18px; }
.faq-list summary { min-height: 34px; }

.final-cta__inner { min-height: 164px; grid-template-columns: 1.28fr auto .8fr; }
.final-cta__copy h2 { font-size: clamp(28px, 2.2vw, 36px); }
.site-footer__grid { min-height: 116px; }

@media (max-width: 1240px) {
    .architecture-row { grid-template-columns: 1fr; }
    .architecture-band { background: linear-gradient(180deg, #fff8ee 0 50%, #f4f8ff 50%); }
    .architecture-row .system-constructor { border-right: 0; border-bottom: 2px solid #7ea8ef; }
    .architecture-row .order-path { border-left: 0; border-top: 2px solid #f39a72; }
    .architecture-row .constructor-card { min-height: 235px; }
    .architecture-row .path-step h3 { font-size: 9px; }
    .architecture-row .path-step p { font-size: 8px; }
    .ecosystem__grid { grid-template-columns: 1fr 1fr; }
    .cases-panel { grid-column: 1/-1; }
}

@media (max-width: 980px) {
    .architecture-row .constructor-grid { grid-template-columns: repeat(2,1fr); }
    .architecture-row .constructor-card { min-height: 210px; }
    .architecture-row .constructor-card:last-child { grid-column: 1/-1; }
    .architecture-row .order-path__track { overflow-x: auto; grid-template-columns: repeat(8, 115px); }
    .architecture-row .path-step h3 { font-size: 10px; }
    .architecture-row .path-step p { font-size: 9px; }
    .ecosystem__grid { grid-template-columns: 1fr; }
    .cases-panel { grid-column: auto; }
}

@media (max-width: 640px) {
    .architecture-row .system-constructor,
    .architecture-row .order-path { padding-inline: 0; }
    .architecture-row .constructor-grid { grid-template-columns: 1fr; }
    .architecture-row .constructor-card:last-child { grid-column: auto; }
    .how-faq__grid { grid-template-columns: 1fr; }
}