/* NEO ERP landing page.
   Layout responds to the width of the page's own box (container queries), not the screen,
   so it is correct inside any theme column, on any device. Everything is scoped to #neo-erp. */
@font-face{font-family:"Haskoy";src:url("https://neotericdigital.co.uk/wp-content/themes/coachben/assets/fonts/haskoy/haskoy_normal_400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Haskoy";src:url("https://neotericdigital.co.uk/wp-content/themes/coachben/assets/fonts/haskoy/haskoy_normal_600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Haskoy";src:url("https://neotericdigital.co.uk/wp-content/themes/coachben/assets/fonts/haskoy/haskoy_normal_700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"D-DIN Condensed";src:url("https://neotericdigital.co.uk/wp-content/themes/coachben/assets/fonts/d-din-condensed/d-din-condensed_normal_700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* ---------- Root: tokens, full-width box ---------- */
#neo-erp{
  --base:#091217;--contrast:#fafafa;--primary:#e05534;--secondary:#c8401e;
  --surface:#0f1b23;--line:rgba(250,250,250,.12);--line-strong:rgba(250,250,250,.26);
  --muted:rgba(250,250,250,.66);--muted-2:rgba(250,250,250,.48);--tint:rgba(224,85,52,.12);
  --good:#4ade80;--warn:#fbbf24;
  --ui-bg:#ffffff;--ui-head:#0f172a;--ui-text:#334155;--ui-muted:#64748b;--ui-line:#e2e8f0;--ui-line-2:#f1f5f9;--ui-soft:#f8fafc;--ui-line-3:#cbd5e1;
  --ui-blue:#2563eb;--ui-blue-100:#dbeafe;--ui-green:#16a34a;--ui-green-bg:#dcfce7;--ui-amber:#f59e0b;--ui-amber-bg:#fef3c7;--ui-red:#dc2626;--ui-red-bg:#fee2e2;
  --display:"D-DIN Condensed","Antonio","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --body:"Haskoy",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --radius:8px;--radius-btn:4px;
  display:block;position:relative;box-sizing:border-box;width:auto;min-width:0;margin-top:0;margin-bottom:0;padding:0;border:0;
  background:var(--base);color:var(--contrast);text-align:left;overflow-x:hidden;overflow-x:clip;isolation:isolate
}
#neo-erp .neo-cq{container:neoerp / inline-size}
#neo-erp .neo-in{
  --section:56px;--gutter:20px;
  font-family:var(--body);font-size:16px;line-height:1.55;font-weight:400;letter-spacing:normal;
  -webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;overflow-wrap:break-word
}
@container neoerp (min-width:600px){#neo-erp .neo-in{--section:72px;--gutter:28px;font-size:17px}}
@container neoerp (min-width:1100px){#neo-erp .neo-in{--section:96px;--gutter:32px}}

/* ---------- Reset: shields the page from theme and plugin styles ---------- */
#neo-erp *,#neo-erp *::before,#neo-erp *::after{box-sizing:border-box}
#neo-erp :where(div,section,span,p,h1,h2,h3,h4,ul,ol,li,dl,dt,dd,figure,figcaption,table,thead,tbody,tr,th,td,details,summary,small,em,b,strong){margin:0;padding:0;border:0;background:transparent;box-shadow:none;font:inherit;color:inherit;letter-spacing:inherit;text-transform:none;text-decoration:none;text-shadow:none;text-align:inherit;float:none;max-width:none;min-height:0}
#neo-erp :where(b,strong){font-weight:700}
#neo-erp :where(ul,ol){list-style:none}
#neo-erp :where(li)::marker{content:none}
#neo-erp :where(a){color:inherit;text-decoration:none;background:none;border:0;box-shadow:none;font:inherit;letter-spacing:inherit;text-transform:none}
#neo-erp :where(button,summary){-webkit-appearance:none;appearance:none;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:inherit;font:inherit;letter-spacing:inherit;text-transform:none;text-align:inherit;line-height:inherit;width:auto;height:auto;min-height:0;cursor:pointer}
#neo-erp :where(svg){display:block;max-width:100%;overflow:visible}
#neo-erp :where(table){border-collapse:collapse;border-spacing:0;width:100%}
#neo-erp :where(th,td){vertical-align:middle;text-align:left}
#neo-erp :where(p:empty){display:none}
#neo-erp summary{list-style:none}
#neo-erp summary::-webkit-details-marker{display:none}
#neo-erp :focus-visible{outline:3px solid var(--primary);outline-offset:3px}
#neo-erp .num{font-variant-numeric:tabular-nums}

/* ---------- Type (fluid, follows the page's own width) ---------- */
#neo-erp h1,#neo-erp h2,#neo-erp h3{color:var(--contrast);font-family:var(--body);font-weight:600}
#neo-erp h1{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:0;line-height:.95;font-size:40px;font-size:clamp(38px,5.2cqi + 16px,74px)}
#neo-erp h2{font-size:28px;font-size:clamp(27px,2.2cqi + 18px,44px);line-height:1.1;letter-spacing:-.01em}
#neo-erp h3{font-size:19px;line-height:1.3;letter-spacing:.005em}

/* ---------- Layout helpers ---------- */
#neo-erp .container{width:100%;max-width:1280px;margin:0 auto;padding:0 var(--gutter)}
#neo-erp .section{padding:var(--section) 0;scroll-margin-top:96px}
#neo-erp .section.alt{background:var(--surface)}
#neo-erp .section-head{max-width:760px;margin-bottom:32px}
#neo-erp .section-head p{margin-top:14px;font-size:17px;color:var(--muted)}
@container neoerp (min-width:600px){#neo-erp .section-head{margin-bottom:44px}#neo-erp .section-head p{font-size:19px}}

/* ---------- Buttons ---------- */
#neo-erp .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:var(--radius-btn);font-weight:600;font-size:16px;line-height:1.2;border:1px solid transparent;text-align:center;transition:background-color .15s,border-color .15s}
#neo-erp .btn-primary{background:var(--primary);color:var(--base)}
#neo-erp .btn-primary:hover,#neo-erp .btn-primary:focus-visible{background:var(--secondary);color:var(--base)}
#neo-erp .btn-secondary{background:transparent;color:var(--contrast);border-color:var(--line-strong)}
#neo-erp .btn-secondary:hover{background:rgba(250,250,250,.06);color:var(--contrast)}
#neo-erp .btn-text{color:var(--contrast);font-weight:600;text-decoration:underline;text-underline-offset:3px}
#neo-erp .btn-text:hover{text-decoration:none}
#neo-erp .btn-row{display:flex;flex-direction:column;gap:12px}
@container neoerp (min-width:480px){#neo-erp .btn-row{flex-direction:row;flex-wrap:wrap}}

/* ---------- Hero ---------- */
#neo-erp .hero{padding:44px 0 48px;overflow:hidden;border-bottom:1px solid var(--line)}
#neo-erp .hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;align-items:center}
#neo-erp .eyebrow{display:block;font-size:14px;font-weight:600;color:var(--primary);margin-bottom:18px}
#neo-erp .hero h1{max-width:16ch}
#neo-erp .hero .lead{margin:22px 0 30px;font-size:17px;font-size:clamp(17px,.3cqi + 15px,19px);color:var(--muted);max-width:48ch}
#neo-erp .proof{display:flex;flex-direction:column;gap:10px;margin-top:26px;font-size:14px;color:var(--muted)}
#neo-erp .proof li{display:flex;align-items:center;gap:8px}
#neo-erp .proof svg{width:16px;height:16px;stroke:var(--primary);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
#neo-erp .hero-visual{min-width:0;position:relative}
#neo-erp .hero-visual .screen{display:none;box-shadow:0 30px 80px rgba(0,0,0,.55)}
#neo-erp .hero-phone{display:block}
@container neoerp (min-width:480px){#neo-erp .proof{flex-direction:row;flex-wrap:wrap;gap:12px 24px}}
@container neoerp (min-width:600px){#neo-erp .hero-visual .screen{display:block}#neo-erp .hero-phone{display:none}}
@container neoerp (min-width:1000px){
  #neo-erp .hero{padding:80px 0 72px}
  #neo-erp .hero-grid{grid-template-columns:minmax(0,5.5fr) minmax(0,6.5fr);gap:48px}
  #neo-erp .hero-visual{margin-right:calc(var(--gutter) * -0.75)}
}

/* ---------- Product mock screens (the app's own light UI); each sizes to its own width ---------- */
#neo-erp .screen{container:screen / inline-size;background:var(--ui-bg);border:1px solid var(--ui-line);border-radius:12px;overflow:hidden;color:var(--ui-text);font-size:13px;line-height:1.45;box-shadow:0 20px 50px rgba(0,0,0,.45)}
#neo-erp .screen-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid var(--ui-line);background:var(--ui-soft)}
#neo-erp .screen-bar .title{font-weight:600;color:var(--ui-head);font-size:13px;min-width:0}
#neo-erp .screen-bar .sample{white-space:nowrap;font-size:11px;color:var(--ui-muted);border:1px solid var(--ui-line);padding:2px 8px;border-radius:999px;background:#fff;flex:none}
#neo-erp .screen-body{padding:14px;overflow-x:auto}
#neo-erp .kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:14px}
#neo-erp .kpi{border:1px solid var(--ui-line);border-radius:8px;padding:10px 12px;min-width:0}
#neo-erp .kpi .label{font-size:11px;color:var(--ui-muted);margin-bottom:4px}
#neo-erp .kpi .value{font-size:20px;font-weight:700;color:var(--ui-head);letter-spacing:-.02em;line-height:1.1;white-space:nowrap}
#neo-erp .health{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
#neo-erp .chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:600;line-height:1.3}
#neo-erp .chip .dot{width:8px;height:8px;border-radius:50%;flex:none}
#neo-erp .chip.good{background:var(--ui-green-bg);color:#166534}#neo-erp .chip.good .dot{background:var(--ui-green)}
#neo-erp .chip.warn{background:var(--ui-amber-bg);color:#92400e}#neo-erp .chip.warn .dot{background:var(--ui-amber)}
#neo-erp .chip.crit{background:var(--ui-red-bg);color:#991b1b}#neo-erp .chip.crit .dot{background:var(--ui-red)}
#neo-erp .chip.neutral{background:var(--ui-line-2);color:var(--ui-text)}#neo-erp .chip.neutral .dot{background:var(--ui-muted)}
#neo-erp .chip.info{background:var(--ui-blue-100);color:#1e40af}#neo-erp .chip.info .dot{background:var(--ui-blue)}
#neo-erp .table{font-size:13px;color:var(--ui-text)}
#neo-erp .table th{font-size:11px;font-weight:600;color:var(--ui-muted);padding:0 8px 8px;border-bottom:1px solid var(--ui-line)}
#neo-erp .table td{padding:10px 8px;border-bottom:1px solid var(--ui-line-2);white-space:nowrap}
#neo-erp .table td.r,#neo-erp .table th.r{text-align:right}
#neo-erp .table tr:last-child td{border-bottom:0}
#neo-erp .table .job{font-weight:600;color:var(--ui-head);white-space:normal;min-width:120px}
#neo-erp .table th:nth-child(3),#neo-erp .table td:nth-child(3){display:none}
#neo-erp .badge{display:inline-block;font-size:11px;font-weight:600;padding:3px 8px;border-radius:999px;white-space:nowrap;transition:background-color .4s,color .4s}
#neo-erp .badge.good{background:var(--ui-green-bg);color:#166534}
#neo-erp .badge.warn{background:var(--ui-amber-bg);color:#92400e}
#neo-erp .badge.crit{background:var(--ui-red-bg);color:#991b1b}
#neo-erp .badge.info{background:var(--ui-blue-100);color:#1e40af}
#neo-erp .srow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--ui-line-2)}
#neo-erp .srow:last-child{border-bottom:0}
#neo-erp .srow .l{min-width:0}
#neo-erp .srow .n{font-weight:600;color:var(--ui-head)}
#neo-erp .srow .s{font-size:12px;color:var(--ui-muted)}
#neo-erp .srow .v{font-weight:600;color:var(--ui-head);white-space:nowrap}
#neo-erp .srow .badge,#neo-erp .srow .sig{flex:none}
#neo-erp .bars{display:grid;gap:10px;margin:8px 0 16px}
#neo-erp .bar{display:grid;grid-template-columns:minmax(64px,110px) minmax(0,1fr) auto;align-items:center;gap:10px;font-size:12px}
#neo-erp .bar .track{height:8px;background:var(--ui-line-2);border-radius:999px;overflow:hidden}
#neo-erp .bar .fill{height:100%;background:var(--ui-blue);border-radius:999px}
#neo-erp .bar .amt{text-align:right;font-weight:600;color:var(--ui-head)}
#neo-erp .sbtn{display:inline-block;border-radius:6px;padding:6px 10px;font-size:12px;font-weight:600;border:1px solid var(--ui-line-3);color:var(--ui-head);background:#fff}
#neo-erp .sbtn.primary{background:var(--ui-blue);border-color:var(--ui-blue);color:#fff}
#neo-erp .sig{font-family:"Brush Script MT","Segoe Script",cursive;font-size:22px;color:var(--ui-head);line-height:1}
@container screen (min-width:520px){#neo-erp .kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
@container screen (min-width:560px){#neo-erp .table th:nth-child(3),#neo-erp .table td:nth-child(3){display:table-cell}#neo-erp .screen-body{padding:16px}}
@container screen (min-width:640px){#neo-erp .kpi .value{font-size:22px}}
#neo-erp .phone{width:100%;max-width:280px;margin:0 auto;background:#1c1c1e;border-radius:36px;padding:12px;box-shadow:0 20px 50px rgba(0,0,0,.5)}
#neo-erp .phone .inner{background:#fff;border-radius:26px;overflow:hidden;font-size:13px;line-height:1.45;color:var(--ui-text)}
#neo-erp .phone .ptop{background:var(--ui-blue);color:#fff;padding:18px 16px 14px}
#neo-erp .phone .ptop .t{font-weight:600;font-size:15px}
#neo-erp .phone .ptop .s{font-size:12px;opacity:.85}
#neo-erp .phone .pbody{padding:14px 16px 18px}
#neo-erp .check-list li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--ui-line-2);font-size:13px;color:var(--ui-text)}
#neo-erp .check-list li:last-child{border-bottom:0}
#neo-erp .check-list .tick{width:20px;height:20px;border-radius:50%;background:var(--ui-green-bg);display:grid;place-items:center;flex:none}
#neo-erp .check-list .tick svg{width:12px;height:12px;stroke:#166534;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
#neo-erp .photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}
#neo-erp .photos div{aspect-ratio:1;border-radius:8px;background:linear-gradient(135deg,#e2e8f0,#cbd5e1);position:relative}
#neo-erp .photos div span{position:absolute;left:6px;bottom:6px;font-size:10px;font-weight:600;background:#fff;border-radius:4px;padding:1px 5px;color:var(--ui-text)}

/* ---------- Proof band ---------- */
#neo-erp .proof-band{padding:36px 0;border-bottom:1px solid var(--line)}
#neo-erp .proof-band .line{text-align:center;color:var(--muted);font-size:15px;margin-bottom:22px}
#neo-erp .outcomes{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
#neo-erp .outcome{border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;display:flex;gap:14px;align-items:center;background:var(--surface)}
#neo-erp .outcome svg{width:22px;height:22px;stroke:var(--primary);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
#neo-erp .outcome span{font-weight:600;color:var(--contrast);font-size:15px}
@container neoerp (min-width:480px){#neo-erp .outcomes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container neoerp (min-width:1000px){#neo-erp .outcomes{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}

/* ---------- Problem tiles ---------- */
#neo-erp .tiles{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
#neo-erp .tile{border:1px solid var(--line);border-radius:var(--radius);padding:24px;background:var(--surface)}
#neo-erp .icon{width:44px;height:44px;border-radius:8px;background:var(--tint);display:grid;place-items:center;margin-bottom:16px}
#neo-erp .icon svg{width:22px;height:22px;stroke:var(--primary);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
#neo-erp .tile h3{margin-bottom:10px}
#neo-erp .tile p{color:var(--muted);font-size:16px}
#neo-erp .after-tiles{margin-top:32px}
@container neoerp (min-width:900px){#neo-erp .tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}#neo-erp .tile{padding:28px}}

/* ---------- Ledger diagram: portrait on narrow widths, landscape on wide ---------- */
#neo-erp .diagram-wrap{border:1px solid var(--line);border-radius:var(--radius);background:var(--base);padding:12px}
#neo-erp .diagram-wrap svg{width:100%;height:auto}
#neo-erp .diagram-wrap .dg-wide{display:none}
#neo-erp .diagram-wrap .dg-tall{display:block;max-width:440px;margin:0 auto}
#neo-erp .diagram-wrap .caption{margin-top:16px;font-size:14px;color:var(--muted);max-width:70ch}
#neo-erp .dg-box{fill:rgba(250,250,250,.03);stroke:var(--line-strong);stroke-width:1.25}
#neo-erp .dg-ledger{fill:var(--tint);stroke:var(--primary);stroke-width:2}
#neo-erp .dg-name{font-family:var(--body);font-weight:600;font-size:14px;fill:var(--contrast)}
#neo-erp .dg-line{font-family:var(--body);font-size:12px;fill:rgba(250,250,250,.78)}
#neo-erp .dg-title{font-family:var(--body);font-weight:600;font-size:16px;fill:var(--contrast)}
#neo-erp .dg-sub{font-family:var(--body);font-size:12px;fill:var(--muted)}
#neo-erp .dg-arrow{stroke:rgba(250,250,250,.35);stroke-width:1.5;fill:none}
@container neoerp (min-width:680px){#neo-erp .diagram-wrap{padding:24px}#neo-erp .diagram-wrap .dg-wide{display:block}#neo-erp .diagram-wrap .dg-tall{display:none}}

/* ---------- Capabilities: accordion on narrow widths, tabs on wide ---------- */
#neo-erp .caps{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;align-items:start}
#neo-erp .cap-btn{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-btn);padding:14px 16px;font-weight:600;color:var(--contrast);font-size:15px;line-height:1.3;transition:border-color .15s,background-color .15s}
#neo-erp .cap-btn svg{width:20px;height:20px;stroke:var(--muted);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
#neo-erp .cap-btn[aria-selected="true"]{border-color:var(--primary);background:var(--tint)}
#neo-erp .cap-btn[aria-selected="true"] svg{stroke:var(--primary)}
#neo-erp .cap-btn:hover{border-color:var(--line-strong)}
#neo-erp .cap-panel{display:none;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start;padding:10px 0 28px}
#neo-erp .cap-panel.active{display:grid}
#neo-erp .cap-panel>*{min-width:0}
#neo-erp .cap-panel h3{font-size:22px;margin-bottom:14px;letter-spacing:-.01em}
#neo-erp .cap-panel ul{display:grid;gap:12px}
#neo-erp .cap-panel li{display:flex;gap:12px;align-items:flex-start;color:var(--muted);font-size:16px}
#neo-erp .cap-panel li svg{width:18px;height:18px;stroke:var(--primary);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:4px}
#neo-erp .cap-panel .btn{margin-top:22px}
#neo-erp .cap-btn:nth-of-type(1){order:1}#neo-erp .cap-panel:nth-of-type(1){order:2}
#neo-erp .cap-btn:nth-of-type(2){order:3}#neo-erp .cap-panel:nth-of-type(2){order:4}
#neo-erp .cap-btn:nth-of-type(3){order:5}#neo-erp .cap-panel:nth-of-type(3){order:6}
#neo-erp .cap-btn:nth-of-type(4){order:7}#neo-erp .cap-panel:nth-of-type(4){order:8}
#neo-erp .cap-btn:nth-of-type(5){order:9}#neo-erp .cap-panel:nth-of-type(5){order:10}
#neo-erp .cap-btn:nth-of-type(6){order:11}#neo-erp .cap-panel:nth-of-type(6){order:12}
#neo-erp .cap-btn:nth-of-type(7){order:13}#neo-erp .cap-panel:nth-of-type(7){order:14}
#neo-erp .cap-btn:nth-of-type(8){order:15}#neo-erp .cap-panel:nth-of-type(8){order:16}
#neo-erp .cap-btn:nth-of-type(9){order:17}#neo-erp .cap-panel:nth-of-type(9){order:18}
/* Without the script every module is shown, one after another */
#neo-erp:not(.neo-js) .cap-btn{display:none}
#neo-erp:not(.neo-js) .cap-panel{display:grid;padding:0 0 40px}
@container neoerp (min-width:600px){#neo-erp .cap-panel h3{font-size:26px}}
@container neoerp (min-width:1000px){
  #neo-erp.neo-js .caps{grid-template-columns:260px minmax(0,1fr);column-gap:32px;row-gap:8px}
  #neo-erp.neo-js .cap-btn{grid-column:1;order:0}
  #neo-erp.neo-js .cap-panel{grid-column:2;grid-row:1 / span 9;order:0;padding:0}
}
@container neoerp (min-width:1200px){#neo-erp .cap-panel{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:32px}#neo-erp .caps{column-gap:40px}}

/* ---------- Feature grid ---------- */
#neo-erp .grid-4{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
#neo-erp .card{border:1px solid var(--line);border-radius:var(--radius);padding:22px;background:var(--base)}
#neo-erp .card .icon{margin-bottom:14px}
#neo-erp .card h3{font-size:18px;margin-bottom:8px}
#neo-erp .card p{font-size:15px;color:var(--muted)}
@container neoerp (min-width:560px){#neo-erp .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container neoerp (min-width:880px){#neo-erp .grid-4{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}
@container neoerp (min-width:1180px){#neo-erp .grid-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}#neo-erp .card{padding:24px}}

/* ---------- How it works ---------- */
#neo-erp .steps{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;position:relative}
#neo-erp .step{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;align-items:start}
#neo-erp .step .n{width:52px;height:52px;border-radius:50%;background:var(--base);border:1px solid var(--line-strong);display:grid;place-items:center;font-weight:700;font-size:18px;color:var(--contrast);position:relative;z-index:1}
#neo-erp .step .n{grid-row:1 / span 2}
#neo-erp .step h3,#neo-erp .step p{grid-column:2}
#neo-erp .step h3{margin-bottom:8px;align-self:end}
#neo-erp .step p{font-size:15px;color:var(--muted)}
@container neoerp (min-width:640px){#neo-erp .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}#neo-erp .step{grid-template-columns:minmax(0,1fr)}#neo-erp .step .n{grid-row:auto;margin-bottom:4px}#neo-erp .step h3,#neo-erp .step p{grid-column:auto}}
@container neoerp (min-width:1000px){
  #neo-erp .steps{grid-template-columns:repeat(4,minmax(0,1fr))}
  #neo-erp .steps::before{content:"";position:absolute;left:52px;right:6%;top:26px;height:1px;background:var(--line)}
}

/* ---------- Preview ---------- */
#neo-erp .preview{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:start}
#neo-erp .preview figure{margin:0;min-width:0}
#neo-erp .preview figcaption{margin-top:14px;font-size:14px;color:var(--muted)}
#neo-erp .preview figcaption strong{color:var(--contrast);display:block;font-weight:600}
#neo-erp .preview-cta{margin-top:40px}
@container neoerp (min-width:700px){#neo-erp .preview{grid-template-columns:repeat(2,minmax(0,1fr))}#neo-erp .preview figure:nth-child(3){grid-column:1 / -1}}
@container neoerp (min-width:1080px){
  #neo-erp .preview{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,.8fr);gap:24px}
  #neo-erp .preview figure:nth-child(3){grid-column:auto;margin-top:80px}
  #neo-erp .preview figure:nth-child(2){margin-top:40px}
}

/* ---------- Comparison: stacked cards on narrow widths, table on wide ---------- */
#neo-erp .compare{border:1px solid var(--line);border-radius:var(--radius);background:var(--base);overflow:hidden;display:block}
#neo-erp .compare thead{display:none}
#neo-erp .compare tbody{display:block}
#neo-erp .compare tr{display:flex;flex-direction:column;border-bottom:1px solid var(--line);padding:12px 0}
#neo-erp .compare tr:last-child{border-bottom:0}
#neo-erp .compare td{display:flex;justify-content:space-between;gap:12px;padding:6px 16px;font-size:15px;color:var(--muted);border:0;order:2}
#neo-erp .compare td:first-child{display:block;order:0;padding:6px 16px 8px;font-weight:600;color:var(--contrast)}
#neo-erp .compare td:not(:first-child)::before{content:attr(data-label);color:var(--muted-2);font-weight:500}
#neo-erp .compare td.neo{order:1;background:var(--tint);border-radius:6px;margin:0 8px 6px}
#neo-erp .compare .yes{color:var(--good);font-weight:600}
#neo-erp .compare .no{color:var(--muted-2)}
#neo-erp .compare .part{color:var(--warn)}
@container neoerp (min-width:800px){
  #neo-erp .compare{display:table;width:100%;border-collapse:separate;border-spacing:0}
  #neo-erp .compare thead{display:table-header-group}
  #neo-erp .compare tbody{display:table-row-group}
  #neo-erp .compare tr{display:table-row;padding:0}
  #neo-erp .compare th,#neo-erp .compare td,#neo-erp .compare td:first-child,#neo-erp .compare td.neo{display:table-cell;padding:15px 16px;border-bottom:1px solid var(--line);border-radius:0;margin:0;font-size:15px;vertical-align:top}
  #neo-erp .compare tbody tr:last-child td{border-bottom:0}
  #neo-erp .compare td:not(:first-child)::before{content:none}
  #neo-erp .compare thead th{background:var(--surface);font-weight:600;color:var(--contrast);font-size:14px}
  #neo-erp .compare thead .neo{background:rgba(224,85,52,.22)}
  #neo-erp .compare td.neo{background:var(--tint)}
}

/* ---------- Integrations ---------- */
#neo-erp .int-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
#neo-erp .int{border:1px solid var(--line);border-radius:var(--radius);padding:18px;background:var(--base);display:flex;gap:14px;align-items:flex-start}
#neo-erp .int svg{width:22px;height:22px;stroke:var(--primary);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:2px}
#neo-erp .int strong{display:block;color:var(--contrast);font-size:15px;margin-bottom:4px}
#neo-erp .int span{display:block;font-size:14px;color:var(--muted)}
#neo-erp .dev-line{margin-top:26px;display:flex;gap:10px 16px;align-items:center;flex-wrap:wrap;font-size:15px;color:var(--muted)}
@container neoerp (min-width:560px){#neo-erp .int-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}
@container neoerp (min-width:1100px){#neo-erp .int-grid{grid-template-columns:repeat(4,minmax(0,1fr))}#neo-erp .int{padding:20px}}

/* ---------- Security ---------- */
#neo-erp .facts{display:grid;grid-template-columns:minmax(0,1fr);gap:0 40px;margin-bottom:32px}
#neo-erp .fact{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:16px 0;border-bottom:1px solid var(--line);font-size:15px}
#neo-erp .fact dt{font-weight:600;color:var(--contrast)}
#neo-erp .fact dd{color:var(--muted)}
#neo-erp .badges{display:flex;flex-wrap:wrap;gap:10px}
#neo-erp .badges span{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:14px;font-weight:600;color:var(--contrast);background:var(--surface)}
#neo-erp .badges svg{width:16px;height:16px;stroke:var(--primary);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
@container neoerp (min-width:520px){#neo-erp .fact{grid-template-columns:150px minmax(0,1fr);gap:16px}}
@container neoerp (min-width:940px){#neo-erp .facts{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- Pricing ---------- */
#neo-erp .toggle{display:inline-flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:36px;font-size:15px;font-weight:500;color:var(--contrast)}
#neo-erp:not(.neo-js) .toggle{display:none}
#neo-erp .switch{width:46px;height:26px;border-radius:999px;background:rgba(250,250,250,.25);position:relative;border:0;padding:0;flex:none;transition:background-color .2s}
#neo-erp .switch[aria-checked="true"]{background:var(--primary)}
#neo-erp .switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s}
#neo-erp .switch[aria-checked="true"]::after{transform:translateX(20px)}
#neo-erp .save{font-size:13px;color:var(--good);background:rgba(74,222,128,.12);padding:2px 8px;border-radius:999px;font-weight:600}
#neo-erp .tiers{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:stretch}
#neo-erp .tier{border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;background:var(--base);display:flex;flex-direction:column;position:relative}
#neo-erp .tier.featured{border-color:var(--primary);box-shadow:0 12px 40px rgba(224,85,52,.15);margin-top:8px}
#neo-erp .tier .tag{position:absolute;top:-13px;left:22px;background:var(--primary);color:var(--base);font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px}
#neo-erp .tier h3{font-size:22px;margin-bottom:6px}
#neo-erp .tier .for{font-size:14px;color:var(--muted)}
#neo-erp .tier .price{font-size:40px;font-weight:700;color:var(--contrast);letter-spacing:-.02em;margin:20px 0 4px;line-height:1}
#neo-erp .tier .price small{font-size:14px;font-weight:500;color:var(--muted);letter-spacing:0;margin-left:4px}
#neo-erp .tier .per{font-size:13px;color:var(--muted);margin-bottom:22px}
#neo-erp .tier ul{margin:0 0 26px;display:grid;gap:10px;font-size:15px;color:var(--muted)}
#neo-erp .tier li{display:flex;gap:10px;align-items:flex-start}
#neo-erp .tier li svg{width:16px;height:16px;stroke:var(--primary);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:5px}
#neo-erp .tier .btn{margin-top:auto;width:100%}
#neo-erp .pricing-note{text-align:center;margin-top:32px;color:var(--muted);font-size:15px}
@container neoerp (min-width:600px){#neo-erp .tiers{max-width:560px;margin:0 auto}}
@container neoerp (min-width:1000px){
  #neo-erp .tiers{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}
  #neo-erp .tier{padding:32px}
  #neo-erp .tier .tag{left:32px}
  #neo-erp .tier.featured{transform:translateY(-8px);margin-top:0}
  #neo-erp .tier .for{min-height:42px}
  #neo-erp .tier .price{font-size:44px}
}

/* ---------- FAQ (native details, works without the script) ---------- */
#neo-erp .faq{max-width:820px}
#neo-erp .faq-item{border-bottom:1px solid var(--line)}
#neo-erp .faq-q{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-size:17px;font-weight:600;color:var(--contrast);line-height:1.35}
#neo-erp .faq-q svg{width:20px;height:20px;stroke:var(--muted);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none;transition:transform .25s}
#neo-erp .faq-item[open] .faq-q svg{transform:rotate(45deg)}
#neo-erp .faq-a p{padding-bottom:20px;color:var(--muted);font-size:16px;max-width:70ch}
#neo-erp .faq-more{margin-top:28px;font-size:15px;color:var(--muted)}
#neo-erp .faq-more a{text-decoration:underline;text-underline-offset:3px}
@container neoerp (min-width:600px){#neo-erp .faq-q{font-size:19px;padding:22px 0}}

/* ---------- Final CTA ---------- */
#neo-erp .final{background:var(--surface);border-top:1px solid var(--line)}
#neo-erp .final .container{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:center}
#neo-erp .final h2{max-width:16ch}
#neo-erp .final p{font-size:17px;color:var(--muted);max-width:50ch;margin-top:14px}
@container neoerp (min-width:900px){#neo-erp .final .container{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px}#neo-erp .final p{font-size:18px}}

/* ---------- Sticky bar on phones (follows the screen, so a media query is right here) ---------- */
#neo-erp .sticky-cta{display:none}
@media (max-width:767px){
  #neo-erp .sticky-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:999;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(9,18,23,.96);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .25s;visibility:hidden}
  #neo-erp .sticky-cta.show{transform:none;visibility:visible}
  #neo-erp .sticky-cta .btn{display:flex;width:100%;min-height:48px;font-family:var(--body)}
}

/* ---------- Gentle entrance, only when the script is running and only below the fold ---------- */
#neo-erp .reveal{transition:opacity .45s ease,transform .45s ease}
#neo-erp .reveal.reveal-pending{opacity:0;transform:translateY(16px)}
@media (prefers-reduced-motion:reduce){
  #neo-erp .reveal,#neo-erp .badge,#neo-erp .switch,#neo-erp .switch::after,#neo-erp .faq-q svg,#neo-erp .btn,#neo-erp .sticky-cta{transition:none}
  #neo-erp .reveal.reveal-pending{opacity:1;transform:none}
}

/* ---------- Hide the theme's page title: the landing page has its own headline (keep it with data-show-title) ---------- */
body:has(#neo-erp:not([data-show-title])) .wp-block-post-title,body:has(#neo-erp:not([data-show-title])) .entry-title{display:none!important}