/* ===== ERP365 · Home page ("ledger" layout) =====
   Section scaffolding (.erp-lsec, .erp-llabel, .erp-lh2, .erp-lhead, .erp-stage,
   data-reveal) is shared and lives in site.v6.css; this file holds only the
   blocks unique to the home page. */

/* ====== Hero ====== */
/* Pulled up under the transparent sticky nav so the grid texture runs behind it. */
.erp-home-hero { position: relative; margin-top: -65px; padding: 144px 0 0; overflow: hidden; }
.erp-home-hero-grid {
  position: absolute; inset: 0 0 auto 0; height: 820px; pointer-events: none;
  background-image:
    linear-gradient(var(--erp-grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--erp-grid-line) 1px, transparent 1px);
  background-size: 48px 48px; background-position: center -1px;
  -webkit-mask-image: radial-gradient(ellipse 75% 85% at 90% 0%, #000 0%, transparent 72%);
          mask-image: radial-gradient(ellipse 75% 85% at 90% 0%, #000 0%, transparent 72%);
}
.erp-home-hero-head {
  position: relative; display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  gap: 40px 48px; align-items: stretch;
}
/* Headline tops out level with the lede; the facts row settles level with the buttons. */
.erp-home-hero-main { display: flex; flex-direction: column; justify-content: space-between; }
.erp-home-hero-title {
  /* Capped below the h1 token so "nuo pirmos dienos." holds one line beside the side column. */
  font: 700 clamp(38px, 17px + 5.4vw, 78px)/var(--erp-h1-lh) var(--erp-font-display);
  letter-spacing: var(--erp-h1-tracking); color: var(--erp-maastricht); margin: 0;
}
.erp-home-facts {
  list-style: none; margin: 36px 0 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 10px 28px;
  font: 500 13px/1.3 var(--erp-font-mono); color: var(--erp-gray-700);
}
.erp-home-facts li { display: inline-flex; align-items: center; gap: 10px; }

/* Drawn check mark, shared by the facts row and the plan lists. */
.erp-home-facts li::before,
.erp-home-plan-list li::before {
  content: ""; flex-shrink: 0; width: 9px; height: 5px;
  border-left: 1.5px solid var(--erp-freedom-ink); border-bottom: 1.5px solid var(--erp-freedom-ink);
  transform: translateY(-2px) rotate(-45deg);
}

.erp-home-hero-side { padding-bottom: 6px; }
.erp-home-hero-lede { font: 400 19px/1.5 var(--erp-font-body); color: var(--erp-gray-700); margin: 0; text-wrap: pretty; }
/* The price reads as one ledger line between two rules. */
.erp-home-hero-price {
  margin: 20px 0 28px; padding: 11px 0;
  border-top: 1px solid var(--erp-rule); border-bottom: 1px solid var(--erp-rule);
  font: 500 13.5px/1.4 var(--erp-font-mono); color: var(--erp-maastricht);
}
.erp-home-hero-ctas { display: grid; gap: 10px; }

/* ====== Module console: sheet tabs over a paper stage ====== */
.erp-home-console { position: relative; margin-top: 80px; }
.erp-home-modnav {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 16px;
  border-bottom: 1px solid var(--erp-rule);
}
.erp-home-modnav-tabs {
  display: flex; gap: 2px; min-width: 0; margin-bottom: -1px;
  overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;
}
.erp-home-modnav-tabs::-webkit-scrollbar { display: none; }
.erp-home-modnav-item {
  flex-shrink: 0; display: inline-flex; align-items: center; gap: 7px;
  padding: 11px 11px 13px; border: 1px solid transparent; border-bottom: 0;
  border-radius: 8px 8px 0 0; background: transparent; cursor: pointer;
  font: 500 14px/1 var(--erp-font-body); color: var(--erp-gray-600);
  transition: background-color 150ms var(--erp-ease-out), color 150ms var(--erp-ease-out), border-color 150ms var(--erp-ease-out), transform 150ms var(--erp-ease-out);
}
.erp-home-modnav-item:hover { color: var(--erp-maastricht); background: rgba(243, 246, 250, 0.8); }
.erp-home-modnav-item:active { transform: scale(0.97); }
.erp-home-modnav-item.is-active { color: var(--erp-maastricht); background: var(--erp-paper); border-color: var(--erp-rule); }
.erp-home-modnav-icon { width: 18px; height: 18px; display: block; }
.erp-home-modnav-more {
  flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; padding: 12px 0 14px;
  font: 500 14.5px/1 var(--erp-font-body); color: var(--erp-freedom-ink); text-decoration: none; white-space: nowrap;
}
.erp-home-modnav-more:hover { color: var(--erp-freedom-ink-deep); }
.erp-home-modnav-more:hover .erp-btn-arrow { transform: translateX(3px); }

/* The paper frame is the shared .erp-stage; here it hangs from the tab row, so
   no top edge and square top corners. .erp-hero-mock-wrap stays for the
   desktop↔phone mock switch, so its own box is reset. */
.erp-home-stage.erp-hero-mock-wrap { max-width: none; margin: 0; border-top: 0; border-radius: 0 0 12px 12px; }
/* LiveShot carries its own framed shadow; the swap wrapper must not add another. */
.erp-stage .erp-mock-swap > .erp-ls { border-radius: 0; box-shadow: none; }

@media (prefers-reduced-motion: no-preference) {
  .erp-home-console { animation: erp-rise 720ms var(--erp-ease-out) 120ms backwards; }
}

/* ====== Clients ====== */
.erp-home-clients { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 48px 64px; align-items: start; }
.erp-home-clients-copy .erp-llede { margin-top: 20px; font-size: 17px; }
/* 1px gaps over a rule-coloured ground draw the inner lines; the outer edge
   has rules only top and bottom, like a printed table. */
.erp-home-logos {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px;
  background: var(--erp-rule); border-top: 1px solid var(--erp-rule); border-bottom: 1px solid var(--erp-rule);
}
.erp-home-logo { height: 120px; display: flex; align-items: center; justify-content: center; padding: 24px; background: #fff; }
.erp-home-logo img {
  max-width: 100%; max-height: 30px; object-fit: contain;
  filter: grayscale(1); opacity: 0.72;
  transition: filter 200ms var(--erp-ease-out), opacity 200ms var(--erp-ease-out);
}
.erp-home-logo:hover img { filter: none; opacity: 1; }
/* Squarer marks need more height to carry the same weight as wide wordmarks. */
.erp-home-logo img[alt="Cherrymusic"]       { max-height: 28px; }
.erp-home-logo img[alt="Klimato vektoriai"] { max-height: 36px; }
.erp-home-logo img[alt="Lithutec"]          { max-height: 42px; }
.erp-home-logo img[alt="MDP Cloud"]         { max-height: 46px; }

/* ====== Capability ledger ====== */
.erp-home-ledger { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--erp-rule); }
.erp-home-ledger > li { border-top: 1px solid var(--erp-rule); }
.erp-home-ledger-row {
  display: grid; grid-template-columns: 44px minmax(0, 4fr) minmax(0, 6fr) 28px;
  grid-template-areas: "logo title desc go";
  gap: 8px 28px; align-items: center;
  margin: 0 -16px; padding: 28px 16px; border-radius: 8px;
  color: inherit; text-decoration: none;
  transition: background-color 200ms var(--erp-ease-out);
}
.erp-home-ledger-row:hover { background: var(--erp-paper); color: inherit; }
.erp-home-ledger-row:active { background: var(--erp-paper-deep); }
.erp-home-ledger-row:focus-visible { outline: 2px solid var(--erp-freedom); outline-offset: -2px; }
.erp-home-ledger-logo { grid-area: logo; width: 44px; height: 44px; }
.erp-home-ledger-t { grid-area: title; font: 650 25px/1.15 var(--erp-font-display); letter-spacing: -0.022em; color: var(--erp-maastricht); margin: 0; }
.erp-home-ledger-d { grid-area: desc; }
.erp-home-ledger-d p { font: 400 16px/1.55 var(--erp-font-body); color: var(--erp-gray-600); margin: 0; max-width: 54ch; }
.erp-home-ledger-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.erp-home-ledger-tags span {
  font: 500 12px/1 var(--erp-font-mono); color: var(--erp-maastricht);
  background: #fff; border: 1px solid var(--erp-rule); border-radius: 4px; padding: 6px 8px;
}
.erp-home-ledger-go {
  grid-area: go; justify-self: end; font: 400 20px/1 var(--erp-font-body); color: var(--erp-gray-400);
  transition: transform 200ms var(--erp-ease-out), color 200ms var(--erp-ease-out);
}
.erp-home-ledger-row:hover .erp-home-ledger-go { color: var(--erp-freedom-ink); transform: translateX(4px); }

/* ====== Why ERP365: reasons in figures, on navy ====== */
.erp-home-why { position: relative; background: var(--erp-maastricht); color: #fff; padding: 104px 0 120px; overflow: hidden; }
.erp-home-why-grid-bg {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 48px 48px; background-position: center -1px;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 70%);
          mask-image: linear-gradient(180deg, #000 0%, transparent 70%);
}
.erp-home-why .erp-container { position: relative; }
.erp-home-why .erp-llabel { color: var(--erp-maastricht-100); }
.erp-home-why .erp-llabel::after { background: var(--erp-rule-inverse); }
.erp-home-why .erp-lh2 { color: #fff; max-width: 20ch; }
.erp-home-reasons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 72px; border-top: 1px solid var(--erp-rule-inverse); }
.erp-home-reason { padding: 40px 32px 0; border-left: 1px solid var(--erp-rule-inverse); }
.erp-home-reason:first-child { padding-left: 0; border-left: 0; }
.erp-home-reason:last-child { padding-right: 0; }
.erp-home-reason-fig {
  font: 600 clamp(38px, 1.4rem + 2.4vw, 60px)/1 var(--erp-font-display);
  letter-spacing: -0.04em; color: #fff; margin-bottom: 32px; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
/* "Not 6-12 months": the old timeline, crossed out in the reserve yellow the
   way a figure is corrected in a ledger — a drawn line, slightly off level. */
.erp-home-reason-fig.is-struck { position: relative; display: inline-block; color: var(--erp-maastricht-200); }
.erp-home-reason-fig.is-struck::after {
  content: ""; position: absolute; left: -4px; right: -6px; top: 54%; height: 3px;
  background: var(--erp-yellow); border-radius: 2px; transform: rotate(-3deg);
}
.erp-home-reason h3 { font: 650 21px/1.25 var(--erp-font-display); letter-spacing: -0.015em; color: #fff; margin: 0 0 10px; }
.erp-home-reason p { font: 400 16px/1.6 var(--erp-font-body); color: var(--erp-maastricht-100); margin: 0; max-width: 38ch; }

/* Phone-only parts: the logo marquee's second copy and the plan switch. */
.erp-home-logo.is-dup, .erp-home-plan-switch { display: none; }

/* ====== Pricing: one table, rows aligned across plans via subgrid ====== */
.erp-home-plans {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(6, auto);
  border: 1px solid var(--erp-rule); border-radius: 12px; overflow: hidden; background: var(--erp-paper);
}
.erp-home-plan {
  display: grid; grid-row: span 6; grid-template-rows: subgrid;
  padding: 32px 32px 36px; border-left: 1px solid var(--erp-rule);
}
.erp-home-plan:first-child { border-left: 0; }
/* The recommended plan is the lit sheet: white, blue top rule, primary action. */
.erp-home-plan-plus { background: #fff; box-shadow: inset 0 3px 0 var(--erp-freedom); }

.erp-home-plan-top { position: relative; }
.erp-home-plan-name { font: 500 13px/1 var(--erp-font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--erp-gray-600); margin: 0; }
.erp-home-plan-plus .erp-home-plan-name { color: var(--erp-freedom-ink); }
.erp-home-plan-flag {
  position: absolute; top: -5px; right: 0;
  font: 500 11px/1 var(--erp-font-mono); letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--erp-maastricht); background: var(--erp-yellow); padding: 6px 8px; border-radius: 3px;
}
.erp-home-plan-tag { font: 600 21px/1.25 var(--erp-font-display); letter-spacing: -0.015em; color: var(--erp-maastricht); margin: 14px 0 0; }
.erp-home-plan-price {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 4px;
  margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--erp-rule);
}
.erp-home-plan-n { font: 700 60px/0.9 var(--erp-font-display); letter-spacing: -0.045em; font-variant-numeric: tabular-nums; color: var(--erp-maastricht); }
.erp-home-plan-cur { font: 600 30px/1 var(--erp-font-display); color: var(--erp-maastricht); margin-right: 10px; }
.erp-home-plan-pre, .erp-home-plan-u { font: 400 14px/1 var(--erp-font-mono); color: var(--erp-gray-600); }
.erp-home-plan-pre { margin-right: 8px; }
.erp-home-plan-desc { font: 400 15px/1.55 var(--erp-font-body); color: var(--erp-gray-600); margin: 18px 0 0; text-wrap: pretty; }
.erp-home-plan-cta { margin-top: 24px; }
.erp-home-plan-sep {
  margin-top: 32px; padding-bottom: 12px; border-bottom: 1px solid var(--erp-rule);
  font: 500 12px/1 var(--erp-font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--erp-gray-600);
}
.erp-home-plan-list { list-style: none; margin: 0; padding: 0; }
.erp-home-plan-list li {
  display: flex; align-items: baseline; gap: 12px; padding: 12px 0;
  border-bottom: 1px solid var(--erp-rule); font: 400 15px/1.4 var(--erp-font-body); color: var(--erp-maastricht);
}
.erp-home-plan-list li:last-child { border-bottom: 0; }
.erp-home-plan-list li::before { transform: translateY(-3px) rotate(-45deg); }

/* ====== Responsive ====== */
@media (max-width: 1180px) {
  /* Tabs scroll sideways here; fade the trailing edge so the cut reads as "more". */
  .erp-home-modnav-tabs {
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
            mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
  }
}
@media (max-width: 1024px) {
  .erp-home-hero-head { grid-template-columns: 1fr; align-items: start; }
  .erp-home-hero-side { max-width: 560px; }
  .erp-home-hero-ctas { grid-template-columns: repeat(2, max-content); }
  .erp-home-clients { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .erp-home-ledger-row {
    grid-template-columns: 40px minmax(0, 1fr) 24px;
    grid-template-areas: "logo title go" ". desc .";
    gap: 10px 18px; padding: 24px 16px;
  }
  .erp-home-ledger-logo { width: 40px; height: 40px; }
  .erp-home-ledger-t { font-size: 21px; }
  .erp-home-reasons { grid-template-columns: 1fr; margin-top: 48px; border-top: 0; }
  .erp-home-reason, .erp-home-reason:first-child, .erp-home-reason:last-child { padding: 32px 0; border-left: 0; border-top: 1px solid var(--erp-rule-inverse); }
  .erp-home-reason-fig { margin-bottom: 20px; }
  .erp-home-plans { grid-template-columns: 1fr; }
  .erp-home-plan { border-left: 0; border-top: 1px solid var(--erp-rule); }
  .erp-home-plan:first-child { border-top: 0; }
  .erp-home-modnav-more { display: none; }
}
@media (max-width: 560px) {
  .erp-home-hero { padding-top: 116px; }
  .erp-home-hero-lede { font-size: 17px; }
  .erp-home-facts { margin-top: 24px; gap: 8px 18px; font-size: 12px; }
  .erp-home-hero-ctas { grid-template-columns: 1fr; }
  .erp-home-console { margin-top: 48px; }
  .erp-home-modnav-item { padding: 10px 11px 12px; font-size: 13.5px; gap: 6px; }
  .erp-home-modnav-icon { width: 18px; height: 18px; }
  /* Ekranų kortelė ir skirtukai per visą telefono plotį (kaip .erp-stage kitur). */
  .erp-home-stage.erp-hero-mock-wrap { margin: 0 -16px; padding: 8px; border-radius: 0; border-left: 0; border-right: 0; }
  .erp-home-modnav { margin: 0 -16px; }
  .erp-home-modnav-tabs { padding: 0 16px; }
  .erp-home-why { padding: 72px 0 80px; }
  .erp-home-plan { padding: 28px 20px 30px; }
  .erp-home-plan-n { font-size: 52px; }
}

/* ====== Phones: a version built for the thumb, not a squeezed desktop ======
   - client logos run as one strip instead of a 4-row grid
   - capabilities become a swipeable row of cards (next card peeks in)
   - pricing shows one plan at a time behind a segmented switch
   - MobileActionBar (site.v6.css) keeps the demo one tap away */
@media (max-width: 767px) {
  .erp-home-facts { margin-top: 20px; }

  /* Clients: one moving strip, edges fade out */
  .erp-home-clients { gap: 28px; }
  .erp-home-logos-wrap {
    overflow: hidden; margin: 0 -16px;
    border-top: 1px solid var(--erp-rule); border-bottom: 1px solid var(--erp-rule);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
            mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  }
  .erp-home-logos {
    display: flex; width: max-content; gap: 0; background: none; border: 0;
    animation: erp-marquee 38s linear infinite;
  }
  .erp-home-logo, .erp-home-logo.is-dup { display: flex; flex: 0 0 auto; width: 148px; height: 84px; padding: 20px 22px; background: none; }

  /* Capabilities: swipe row */
  .erp-home-ledger {
    display: flex; gap: 12px; margin: 0 -16px; padding: 2px 16px 14px; border-bottom: 0;
    overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 16px; scrollbar-width: none;
  }
  .erp-home-ledger::-webkit-scrollbar { display: none; }
  .erp-home-ledger > li {
    flex: 0 0 84%; scroll-snap-align: start;
    border: 1px solid var(--erp-rule); border-radius: 12px; background: #fff;
  }
  .erp-home-ledger-row { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; height: 100%; margin: 0; padding: 22px 20px 18px; }
  .erp-home-ledger-row:hover { background: #fff; }
  .erp-home-ledger-t { font-size: 23px; }
  .erp-home-ledger-go { align-self: flex-end; margin-top: auto; color: var(--erp-freedom-ink); }

  /* Why: tighter figures */
  .erp-home-reason, .erp-home-reason:first-child, .erp-home-reason:last-child { padding: 26px 0; }
  .erp-home-reason-fig { margin-bottom: 14px; font-size: 42px; }

  /* Pricing: segmented switch, one plan visible */
  .erp-home-plan-switch {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin-bottom: 14px; padding: 4px;
    background: var(--erp-paper); border: 1px solid var(--erp-rule); border-radius: 10px;
  }
  .erp-home-plan-switch button {
    display: flex; flex-direction: column; align-items: center; gap: 4px; min-height: 56px; padding: 8px 4px;
    border: 0; border-radius: 7px; background: transparent; cursor: pointer; font-family: inherit;
    font: 600 15px/1.1 var(--erp-font-body); color: var(--erp-gray-600);
    transition: background-color 180ms var(--erp-ease-out), color 180ms var(--erp-ease-out), box-shadow 180ms var(--erp-ease-out), transform 150ms var(--erp-ease-out);
  }
  .erp-home-plan-switch button:active { transform: scale(0.97); }
  .erp-home-plan-switch button.is-on { background: #fff; color: var(--erp-maastricht); box-shadow: var(--erp-shadow-sm); }
  .erp-home-plan-switch-p { font: 500 12px/1 var(--erp-font-mono); color: var(--erp-gray-600); }
  .erp-home-plan-switch button.is-on .erp-home-plan-switch-p { color: var(--erp-freedom-ink); }
  .erp-home-plan:not(.is-current) { display: none; }
  .erp-home-plan, .erp-home-plan:first-child { border-top: 0; }
  .erp-home-plan.is-current { animation: erp-mock-swap-in 220ms var(--erp-ease-out); }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .erp-home-logos { animation: none !important; }
  .erp-home-logos-wrap { overflow-x: auto; }
  .erp-home-logo.is-dup { display: none; }
}
@keyframes erp-marquee { to { transform: translateX(-50%); } }
