:root{
  --bg:#f6f4fc;
  --surface:#ffffff;
  --surface-2:#f1eefa;
  --ink:#1e1b4b;
  --ink-soft:#4c4772;
  --ink-faint:#8b86ad;
  --border:#e2ddf2;
  --accent:#7c3aed;
  --accent-strong:#5b21b6;
  --accent-soft:#f1ebfd;
  --critical:#b42318;
  --critical-soft:#fdecec;
  --shadow:0 18px 50px rgba(46,16,101,.14);
  --grad-deep:#231259;
  --grad-mid:#46229e;
  --grad-bright:#7c3aed;
  --grad-glow:#a78bfa;
}
*{ box-sizing:border-box; }
body{
  margin:0; min-height:100vh; background:var(--bg); color:var(--ink);
  font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
body:before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:-1;
  background:
    radial-gradient(circle at 12% 10%, rgba(124,58,237,.10), transparent 28%),
    radial-gradient(circle at 86% 22%, rgba(30,27,75,.08), transparent 26%),
    linear-gradient(180deg, #fff 0%, var(--bg) 44%, #efeaf9 100%);
}
a{ color:inherit; text-decoration:none; }
button,input{ font:inherit; }
.public-nav{
  height:68px; display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:0 clamp(18px,4vw,56px); border-bottom:1px solid var(--border); background:rgba(255,255,255,.86);
  backdrop-filter:blur(12px); position:sticky; top:0; z-index:5;
}
.brand{ display:inline-flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.01em; }
.brand img{ width:34px; height:34px; object-fit:contain; }
.public-nav nav{ display:flex; align-items:center; gap:10px; }
.public-nav nav a,
.public-nav nav button{
  height:36px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--border);
  background:var(--surface); color:var(--ink-soft); border-radius:8px; padding:0 13px; cursor:pointer;
}
.public-nav nav a:hover,
.public-nav nav button:hover{ color:var(--ink); border-color:var(--accent); }
.public-nav nav form{ margin:0; }
.public-nav .nav-cta{ background:var(--accent); border-color:var(--accent); color:#fff; }
.message-wrap{
  position:fixed; top:82px; right:18px; width:min(420px,calc(100% - 36px));
  max-width:none; margin:0; padding:0; z-index:30; pointer-events:none;
}
.message{
  border:1px solid var(--border); background:var(--surface); border-radius:8px; padding:10px 13px;
  color:var(--ink-soft); font-size:13px; box-shadow:0 12px 30px rgba(46,16,101,.12);
  pointer-events:auto;
}
.message.success{ border-color:#b7dfc5; background:#ecf9f0; color:#17633a; }
.message.error{ border-color:#f3b4b4; background:var(--critical-soft); color:var(--critical); }
.hero{
  max-width:1160px; margin:0 auto; padding:72px 24px 34px;
  display:grid; grid-template-columns:minmax(0,1.06fr) minmax(340px,.94fr); gap:38px; align-items:center;
}
.hero-copy{ min-width:0; }
.hero-badge{
  width:max-content; max-width:100%; display:inline-flex; align-items:center; gap:8px;
  border:1px solid rgba(11,122,136,.20); background:rgba(226,243,245,.72);
  color:var(--accent-strong); border-radius:999px; padding:7px 11px;
  font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.06em;
}
.eyebrow{ margin:0 0 10px; color:var(--accent); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
h1,h2,h3,p{ margin-top:0; }
.hero h1{ font-size:clamp(42px,6vw,72px); line-height:.96; letter-spacing:0; margin:18px 0; max-width:760px; }
.hero-sub{ font-size:18px; line-height:1.6; color:var(--ink-soft); max-width:650px; }
.hero-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:26px; }
.btn{
  min-height:42px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--border);
  border-radius:8px; padding:0 16px; background:var(--surface); color:var(--ink); font-weight:700; cursor:pointer;
}
.btn.primary{ background:var(--accent); border-color:var(--accent); color:#fff; }
.btn:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(17,24,39,.08); }
.btn.full{ width:100%; }
.hero-points{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.hero-points span{
  display:inline-flex; align-items:center; min-height:30px; border:1px solid var(--border);
  background:rgba(255,255,255,.72); color:var(--ink-soft); border-radius:999px; padding:0 10px;
  font-size:12px; font-weight:700;
}
.product-preview{
  border:1px solid rgba(217,224,230,.96); background:rgba(255,255,255,.88); border-radius:14px;
  padding:16px; box-shadow:var(--shadow); transform:translateY(8px);
}
.preview-top{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.preview-top div{ display:flex; align-items:center; gap:9px; min-width:0; }
.preview-mark{
  width:34px; height:34px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center;
  background:var(--accent); color:#fff; font-weight:900; box-shadow:0 8px 20px rgba(11,122,136,.22);
}
.preview-top strong{ font-size:14px; }
.preview-chip{ border:1px solid var(--border); background:var(--surface-2); border-radius:999px; padding:5px 9px; color:var(--ink-faint); font-size:12px; font-weight:800; }
.preview-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:12px; }
.preview-kpis div{ border:1px solid var(--border); border-radius:10px; padding:12px; background:#fbfdfe; }
.preview-kpis span{ display:block; color:var(--ink-faint); font-size:11.5px; margin-bottom:8px; }
.preview-kpis strong{ font-size:20px; line-height:1; }
.preview-board{ display:grid; gap:10px; }
.preview-card{
  border:1px solid var(--border); background:var(--surface-2); border-radius:10px; padding:13px;
  display:grid; gap:4px;
}
.preview-card.primary{ background:var(--accent-soft); border-color:rgba(11,122,136,.18); }
.preview-card span{ color:var(--accent-strong); font-size:11.5px; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.preview-card strong{ font-size:14px; }
.preview-card em{ color:var(--ink-faint); font-style:normal; font-size:12.5px; line-height:1.45; }
.flow-section{
  max-width:1160px; margin:0 auto; padding:8px 24px 24px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:12px;
}
.flow-step{
  border:1px solid var(--border); background:rgba(255,255,255,.78); border-radius:10px; padding:16px;
}
.flow-step span{ color:var(--accent); font-size:12px; font-weight:900; }
.flow-step strong{ display:block; margin:16px 0 7px; font-size:15px; }
.flow-step p{ margin:0; color:var(--ink-soft); font-size:12.8px; line-height:1.5; }
.module-section{ max-width:1160px; margin:0 auto; padding:28px 24px 48px; }
.section-head{ margin-bottom:18px; max-width:680px; }
.section-head h2{ font-size:30px; line-height:1.15; margin-bottom:0; }
.section-head > p:not(.eyebrow){ color:var(--ink-soft); line-height:1.55; margin:10px 0 0; }
.module-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; }
.module-card{
  min-height:178px; border:1px solid var(--border); background:rgba(255,255,255,.9); border-radius:10px; padding:18px;
  display:flex; flex-direction:column;
}
.module-card:hover{ border-color:var(--accent); box-shadow:0 14px 34px rgba(17,24,39,.08); transform:translateY(-2px); }
.module-card span{ color:var(--accent); font-size:12px; font-weight:800; }
.module-card h3{ margin:22px 0 8px; font-size:18px; }
.module-card p{ color:var(--ink-soft); font-size:13.5px; line-height:1.5; margin-bottom:18px; }
.module-card strong{ margin-top:auto; color:var(--accent-strong); font-size:12.5px; }
.feature-hero{
  max-width:1160px; margin:0 auto; padding:64px 24px 28px;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.64fr); gap:28px; align-items:stretch;
}
.feature-hero-copy{
  min-width:0; border:1px solid rgba(217,224,230,.9); background:rgba(255,255,255,.72);
  border-radius:12px; padding:30px;
}
.feature-hero h1{
  font-size:clamp(38px,5vw,60px); line-height:1; letter-spacing:0; margin:18px 0;
  max-width:760px;
}
.feature-hero-copy > p:not(.hero-badge){
  color:var(--ink-soft); font-size:17px; line-height:1.6; max-width:760px;
}
.feature-stats{
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
}
.feature-stats div{
  border:1px solid var(--border); background:rgba(255,255,255,.9); border-radius:12px; padding:18px;
  min-height:126px; display:flex; flex-direction:column; justify-content:space-between;
}
.feature-stats strong{ color:var(--accent-strong); font-size:30px; line-height:1; }
.feature-stats span{ color:var(--ink-soft); font-size:13px; line-height:1.45; font-weight:700; }
.feature-highlights{
  max-width:1160px; margin:0 auto; padding:0 24px 28px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:12px;
}
.feature-highlights article{
  border:1px solid rgba(11,122,136,.18); background:var(--accent-soft); border-radius:10px; padding:16px;
}
.feature-highlights span{ color:var(--accent); font-size:12px; font-weight:900; }
.feature-highlights h2{ margin:16px 0 8px; font-size:17px; line-height:1.25; }
.feature-highlights p{ margin:0; color:var(--ink-soft); font-size:13px; line-height:1.5; }
.feature-catalogue{ max-width:1160px; margin:0 auto; padding:28px 24px 48px; }
.feature-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:14px; }
.feature-card{
  border:1px solid var(--border); background:rgba(255,255,255,.92); border-radius:10px; padding:18px;
  display:flex; flex-direction:column; min-height:100%;
}
.feature-card-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.feature-card-head span{
  width:34px; height:34px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center;
  background:var(--accent); color:#fff; font-size:12px; font-weight:900;
}
.feature-card-head strong{
  border:1px solid rgba(11,122,136,.18); background:var(--accent-soft); color:var(--accent-strong);
  border-radius:999px; padding:6px 9px; font-size:11px; text-transform:uppercase; letter-spacing:.06em;
}
.feature-card h3{ margin:0 0 8px; font-size:19px; line-height:1.2; }
.feature-card > p{ color:var(--ink-soft); font-size:13.5px; line-height:1.55; margin-bottom:14px; }
.feature-card ul{
  margin:0; padding:0; list-style:none; display:grid; gap:8px;
}
.feature-card li{
  position:relative; padding-left:18px; color:var(--ink-soft); font-size:13px; line-height:1.45;
}
.feature-card li:before{
  content:""; position:absolute; left:0; top:.6em; width:6px; height:6px; border-radius:999px;
  background:var(--accent);
}
.closing-strip{
  max-width:1112px; margin:0 auto 72px; padding:22px 24px; border:1px solid rgba(11,122,136,.18);
  background:var(--accent-soft); border-radius:12px; display:flex; align-items:center; justify-content:space-between; gap:18px;
}
.closing-strip h2{ margin:0; font-size:24px; }
.closing-strip .eyebrow{ margin-bottom:6px; }
.closing-actions{ display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
.auth-shell{ min-height:calc(100vh - 68px); display:flex; align-items:center; justify-content:center; padding:42px 18px; }
.auth-card{
  width:min(440px,100%); border:1px solid var(--border); background:var(--surface); border-radius:12px;
  box-shadow:var(--shadow); padding:28px;
}
.auth-card.wide{ width:min(760px,100%); }
.auth-intro{ margin-bottom:22px; }
.auth-intro h1{ font-size:30px; margin-bottom:8px; }
.auth-intro p{ color:var(--ink-soft); line-height:1.5; margin-bottom:0; }
.auth-form{ display:flex; flex-direction:column; gap:14px; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.form-field.span-2{ grid-column:1/-1; }
.form-field label{ color:var(--ink-soft); font-size:12px; font-weight:700; }
.field-input{
  width:100%; height:42px; border:1px solid var(--border); border-radius:8px; background:var(--surface-2);
  color:var(--ink); padding:0 12px;
}
.field-input:focus{ outline:2px solid var(--accent); outline-offset:1px; background:var(--surface); }
.field-error{ color:var(--critical); font-size:12px; font-weight:700; }
.form-errors-banner{ background:var(--critical-soft); color:var(--critical); border-radius:8px; padding:10px 12px; font-size:12.5px; font-weight:700; }
.auth-foot{ color:var(--ink-soft); font-size:13px; margin:18px 0 0; text-align:center; }
.auth-foot a{ color:var(--accent-strong); font-weight:800; }
@media (max-width:840px){
  .hero{ grid-template-columns:1fr; padding-top:48px; }
  .hero h1{ font-size:40px; }
  .product-preview{ transform:none; }
  .flow-section{ grid-template-columns:1fr 1fr; }
  .feature-hero{ grid-template-columns:1fr; padding-top:42px; }
  .feature-highlights{ grid-template-columns:1fr 1fr; }
  .closing-strip{ align-items:flex-start; flex-direction:column; }
  .closing-actions{ justify-content:flex-start; }
}
@media (max-width:620px){
  .public-nav{ height:auto; padding:14px 18px; align-items:flex-start; }
  .public-nav nav{ flex-wrap:wrap; justify-content:flex-end; }
  .message-wrap{ top:96px; right:12px; width:calc(100% - 24px); }
  .preview-kpis{ grid-template-columns:1fr; }
  .flow-section{ grid-template-columns:1fr; }
  .feature-hero-copy{ padding:22px; }
  .feature-hero h1{ font-size:38px; }
  .feature-stats{ grid-template-columns:1fr; }
  .feature-highlights{ grid-template-columns:1fr; }
  .feature-grid{ grid-template-columns:1fr; }
  .closing-actions .btn{ width:100%; }
  .form-grid{ grid-template-columns:1fr; }
  .form-field.span-2{ grid-column:auto; }
}

/* ============ Brochure design (index + features) ============ */
.bro-hero{
  position:relative; overflow:hidden; color:#fff; text-align:center;
  background:
    radial-gradient(circle at 82% 12%, rgba(167,139,250,.35), transparent 34%),
    radial-gradient(circle at 10% 82%, rgba(124,58,237,.5), transparent 40%),
    linear-gradient(155deg, var(--grad-deep) 0%, var(--grad-mid) 52%, var(--grad-bright) 100%);
  padding:76px 24px 70px;
}
.bro-hero:before, .bro-hero:after{
  content:"✽"; position:absolute; color:rgba(255,255,255,.10); pointer-events:none;
  font-size:150px; line-height:1;
}
.bro-hero:before{ top:26px; left:5%; }
.bro-hero:after{ bottom:16px; right:6%; font-size:200px; }
.bro-hero-inner{ position:relative; max-width:860px; margin:0 auto; }
.bro-logo{
  width:128px; height:128px; margin:0 auto 26px; border-radius:999px; background:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 0 10px rgba(255,255,255,.08), 0 0 0 26px rgba(255,255,255,.05), 0 24px 60px rgba(20,8,60,.45);
}
.bro-logo img{ width:88px; height:88px; object-fit:contain; }
.bro-wordmark{ margin:0; font-size:clamp(44px,7vw,74px); font-weight:900; letter-spacing:.22em; text-indent:.22em; line-height:1; }
.bro-erp-pill{
  display:inline-block; margin:16px 0 26px; border:1.5px solid rgba(255,255,255,.65); border-radius:999px;
  padding:7px 26px; font-size:15px; font-weight:800; letter-spacing:.42em; text-indent:.42em;
}
.bro-tagline{ margin:0 0 14px; font-size:15px; font-weight:800; letter-spacing:.3em; color:#ded2fb; }
.bro-sub{ margin:0 auto; max-width:620px; color:#e9e2fb; font-size:16px; line-height:1.65; }
.bro-actions{ display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:30px; }
.bro-actions .btn{ border-color:rgba(255,255,255,.5); background:transparent; color:#fff; padding:11px 22px; }
.bro-actions .btn.primary{ background:#fff; border-color:#fff; color:var(--grad-mid); }
.bro-actions .btn:hover{ box-shadow:0 10px 26px rgba(20,8,60,.4); }
.bro-stats{
  display:grid; grid-template-columns:repeat(4,minmax(120px,150px)); justify-content:center; gap:14px; margin-top:40px;
}
.bro-stats div{
  border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.09); backdrop-filter:blur(4px);
  border-radius:12px; padding:16px 10px;
}
.bro-stats strong{ display:block; font-size:26px; line-height:1.1; }
.bro-stats span{ display:block; margin-top:6px; color:#d9cdf9; font-size:11.5px; font-weight:700; letter-spacing:.02em; }
.bro-band{
  color:#fff; padding:34px 24px 30px;
  background:linear-gradient(120deg, var(--grad-deep) 0%, var(--grad-mid) 60%, var(--grad-bright) 130%);
}
.bro-band-inner{ max-width:1112px; margin:0 auto; }
.bro-band .eyebrow{ color:#cbb7f7; }
.bro-band h2{ margin:0; font-size:clamp(26px,3.6vw,38px); line-height:1.12; }
.bro-band p.bro-band-sub{ margin:10px 0 0; color:#ded2fb; font-size:15px; line-height:1.55; }
.bro-section{ max-width:1160px; margin:0 auto; padding:34px 24px; }
.bro-chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.bro-chips span{
  border:1px solid var(--border); background:var(--accent-soft); color:var(--accent-strong);
  border-radius:999px; padding:9px 15px; font-size:13px; font-weight:800;
}
.bro-why{ display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.68fr); gap:30px; align-items:center; }
.bro-why h2{ font-size:clamp(30px,4vw,44px); line-height:1.05; margin:12px 0 14px; }
.bro-why > div > p{ color:var(--ink-soft); font-size:16px; line-height:1.6; margin:0; }
.bro-module-band{
  color:#fff; text-align:center; padding:56px 24px 64px;
  background:
    radial-gradient(circle at 14% 16%, rgba(167,139,250,.28), transparent 30%),
    radial-gradient(circle at 88% 80%, rgba(124,58,237,.45), transparent 36%),
    linear-gradient(165deg, var(--grad-deep) 0%, var(--grad-mid) 55%, #6d28d9 100%);
}
.bro-module-band .eyebrow{ color:#cbb7f7; }
.bro-module-band h2{ margin:0 auto 34px; max-width:640px; font-size:clamp(28px,4vw,42px); line-height:1.15; }
.bro-module-grid{
  max-width:1060px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:13px; text-align:left;
}
.bro-module-grid a{
  display:flex; align-items:center; gap:14px; border:1px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.08); border-radius:10px; padding:15px 18px;
  transition:background .15s ease, transform .15s ease;
}
.bro-module-grid a:hover{ background:rgba(255,255,255,.16); transform:translateY(-2px); }
.bro-module-grid span{ color:#cbb7f7; font-size:12.5px; font-weight:900; }
.bro-module-grid strong{ font-size:14.5px; font-weight:700; }
.bro-cta{
  max-width:1060px; margin:52px auto 0; background:#fff; color:var(--ink); border-radius:16px;
  padding:30px 32px; display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.55fr); gap:26px;
  text-align:left; box-shadow:0 30px 70px rgba(15,5,45,.45);
}
.bro-cta h2{ margin:0 0 10px; font-size:27px; }
.bro-cta p{ margin:0 0 18px; color:var(--ink-soft); font-size:14.5px; line-height:1.55; }
.bro-cta-btn{
  display:inline-block; border-radius:999px; padding:13px 30px; color:#fff; font-weight:800; font-size:14.5px;
  background:linear-gradient(120deg,#7c3aed,#8b5cf6); box-shadow:0 12px 30px rgba(124,58,237,.35);
}
.bro-cta-btn:hover{ transform:translateY(-1px); }
.bro-contact{ border-left:1px solid var(--border); padding-left:26px; display:grid; gap:14px; align-content:center; }
.bro-contact span{ display:block; color:var(--accent); font-size:11px; font-weight:900; letter-spacing:.14em; }
.bro-contact strong{ font-size:14.5px; font-weight:700; word-break:break-word; }
.bro-footer{
  color:#fff; text-align:center; padding:44px 24px 40px;
  background:linear-gradient(150deg, var(--grad-deep) 0%, var(--grad-mid) 70%, var(--grad-bright) 140%);
}
.bro-footer strong{ display:block; font-size:22px; font-weight:900; letter-spacing:.28em; text-indent:.28em; }
.bro-footer em{ display:block; margin:10px 0 8px; font-style:normal; color:#cbb7f7; font-size:12px; font-weight:800; letter-spacing:.3em; }
.bro-footer span{ color:#b9a8ec; font-size:13px; }
.feature-card{ border-top:3px solid var(--accent); }
.feature-card li:before{ border-radius:2px; transform:rotate(45deg); top:.5em; }
@media (max-width:840px){
  .bro-stats{ grid-template-columns:1fr 1fr; }
  .bro-why{ grid-template-columns:1fr; }
  .bro-module-grid{ grid-template-columns:1fr 1fr; }
  .bro-cta{ grid-template-columns:1fr; }
  .bro-contact{ border-left:0; padding-left:0; border-top:1px solid var(--border); padding-top:18px; }
}
@media (max-width:620px){
  .bro-module-grid{ grid-template-columns:1fr; }
  .bro-hero{ padding:56px 18px 52px; }
  .bro-hero:before, .bro-hero:after{ display:none; }
}