:root { --navy:#152b49; --blue:#2855a1; --accent:#f2ac35; --ink:#24364e; --muted:#617085; --bg:#ffffff; --line:#dfe5ee; --content:1200px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
[id] { scroll-margin-top:0; }
body { background:var(--bg); color:var(--ink); display:flex; flex-direction:column; font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif; line-height:1.65; margin:0; min-height:100vh; min-height:100svh; }
a { color:inherit; text-underline-offset:.2em; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { color:var(--navy); letter-spacing:-.035em; line-height:1.18; text-wrap:balance; }
p { text-wrap:pretty; }
a:focus-visible,summary:focus-visible { outline:3px solid var(--blue); outline-offset:4px; }
main { display:flex; flex:1; }
main:focus { outline:none; }
.page-shell { margin:0 auto; max-width:var(--content); padding:2.5rem 1.5rem; width:100%; }
.skip-link { background:white; border-radius:8px; left:1rem; padding:.7rem 1rem; position:fixed; top:-100px; z-index:10; }
.skip-link:focus { top:1rem; }
.eyebrow { align-items:center; color:var(--blue); display:flex; font-size:.7rem; font-weight:750; gap:.6rem; letter-spacing:.1em; text-transform:uppercase; }
.eyebrow i { background:var(--accent); border-radius:50%; height:7px; width:7px; }
.button { align-items:center; border:1px solid transparent; border-radius:10px; display:inline-flex; font:inherit; font-size:.875rem; font-weight:650; gap:.75rem; justify-content:center; line-height:1.4; min-height:46px; padding:.8rem 1.2rem; text-align:center; text-decoration:none; transition:background .15s,border-color .15s; }
.button-primary { background:var(--accent); color:var(--navy); box-shadow:0 5px 16px #f2ac3525; }
.button-primary:hover { background:#ffc35b; }
.button-secondary { background:white; border-color:var(--line); color:var(--navy); }
.button-secondary:hover { background:#edf2fa; border-color:#b9c9df; }
.button-quiet { color:var(--navy); }
.button-quiet:hover { background:#eaf0f8; }

/* Section links keep the product tour in one continuous page. */
.header-wrap { background:#ffffffed; backdrop-filter:blur(16px); border-bottom:1px solid #e6edf3; position:sticky; top:0; z-index:5; }
.site-header { align-items:center; display:flex; gap:1.5rem; justify-content:space-between; margin:0 auto; max-width:var(--content); padding:1.25rem 1.5rem; width:100%; }
.brand { align-items:center; display:inline-flex; flex-shrink:0; font-size:1.15rem; font-weight:800; gap:.65rem; line-height:1.15; text-decoration:none; }
.brand small { color:var(--muted); display:block; font-size:.55rem; font-weight:650; letter-spacing:.12em; margin-top:.3rem; text-transform:uppercase; }
.brand-mark,.story-mark { align-items:center; background:var(--accent); border-radius:10px; color:var(--navy); display:flex; flex-shrink:0; font-size:.75rem; font-weight:800; height:36px; justify-content:center; width:36px; }
.site-header nav { display:flex; gap:.2rem; padding:.3rem; }
.site-header nav a { border-radius:8px; color:var(--muted); font-size:.825rem; font-weight:600; padding:.55rem .9rem; text-decoration:none; white-space:nowrap; }
.site-header nav a:hover { background:#fff1d9; color:var(--navy); }
.header-actions { align-items:center; display:flex; gap:.4rem; }
.culture-link { color:var(--muted); font-size:.7rem; font-weight:750; padding:.7rem .5rem; text-decoration:none; }
.login-link { font-size:.75rem; min-height:40px; padding:.6rem .8rem; }
footer { align-items:center; border-top:1px solid var(--line); color:var(--muted); display:flex; font-size:.75rem; gap:1.5rem; justify-content:space-between; margin:0 auto; max-width:calc(var(--content) - 3rem); padding:1.25rem 0; width:calc(100% - 3rem); }
footer p { margin:0; }
footer a { flex-shrink:0; text-decoration:none; }
footer a:hover { color:var(--blue); }

/* A short, colourful introduction leads into the product sections. */
.landing-page { width:100%; }
.hero-band { background:radial-gradient(ellipse at 95% 0%,#42648b 0%,transparent 48%),linear-gradient(120deg,#102b4b,#1d436b); }
.hero-band .home-copy h1 { color:white; }
.hero-band .home-copy>p { color:#d5e2f0; }
.hero-band .eyebrow { color:#ffcc77; }
.hero-band .proof { color:#bed1e5; }
.hero-band .product-story { border-color:#ffffff40; background:#f5f9ff; box-shadow:0 20px 50px #03162b40; }
.hero-band .story-number { background:#e0ebfa; }
.hero-band .product-story li:nth-child(2) .story-number { background:#ffead0; color:#8b5011; }
.hero-band .product-story li:nth-child(3) .story-number { background:#d7efe6; color:#245e49; }
.hero-band .story-caption { background:#e5edf8; color:#415e7d; }
.features-section { padding-top:3.5rem; padding-bottom:3rem; }
.feature-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:1rem; }
.feature-card { border:1px solid #d6e4f6; border-radius:18px; background:#edf4fe; grid-column:span 2; padding:1.5rem; }
.feature-card:nth-child(-n+2),.feature-card:nth-child(n+6) { grid-column:span 3; }
.feature-card h3 { font-size:1.2rem; margin:1rem 0 .75rem; }
.feature-card p { color:#4b6078; font-size:.9rem; margin:0; }
.feature-label { display:inline-flex; background:#d3e4fc; border-radius:7px; color:#254f8c; font-size:.75rem; font-weight:700; padding:.25rem .65rem; }
.feature-ai-receiving { background:linear-gradient(125deg,#e8f0ff,#f3edff); border-color:#cbd8f4; border-top:3px solid #647ace; }
.feature-ai-receiving .feature-label { background:#d9dffa; color:#3d4789; }
.feature-ai-planning { background:linear-gradient(125deg,#e7f5f4,#eaf0ff); border-color:#c9dfe8; border-top:3px solid #38899b; }
.feature-ai-planning .feature-label { background:#cde9ee; color:#246272; }
.feature-procurement { background:#fff5e7; border-color:#f2e0c4; }
.feature-procurement .feature-label { background:#ffe2b7; color:#805015; }
.feature-manufacturing { background:#ecf7f1; border-color:#cfe7da; }
.feature-manufacturing .feature-label { background:#ccebdc; color:#286348; }
.feature-planning { background:#f4f0fb; border-color:#e4dbf4; }
.feature-planning .feature-label { background:#e5dbf7; color:#65478f; }
.feature-control { background:#eff6f8; border-color:#d7e8ed; }
.feature-control .feature-label { background:#d4e9ed; color:#356773; }
.feature-hint { color:var(--muted); font-size:.8rem; margin:1rem 0 0; }
.pricing-band { background:#eef3fa; border-block:1px solid #dfe8f4; }
.pricing-band .page-shell { padding-top:3rem; padding-bottom:3rem; }

.home-page { align-items:center; display:grid; gap:clamp(2.5rem,6vw,6rem); grid-template-columns:1fr 1fr; padding-bottom:3rem; padding-top:3rem; }
.home-copy h1 { font-size:clamp(2.8rem,4.9vw,4.1rem); font-weight:650; letter-spacing:-.05em; line-height:1.08; margin:1.4rem 0; white-space:pre-line; }
.home-copy>p { color:var(--muted); font-size:1.05rem; line-height:1.8; max-width:480px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.8rem; }
.proof { color:var(--muted); display:flex; flex-wrap:wrap; font-size:.75rem; gap:.6rem 1.2rem; margin-top:1.5rem; }
.product-story { background:white; border:1px solid var(--line); border-radius:24px; box-shadow:0 20px 60px -32px #24406155; padding:1.75rem; }
.product-story header { align-items:center; border-bottom:1px solid var(--line); display:flex; font-size:1rem; font-weight:650; gap:.85rem; padding-bottom:1.4rem; }
.product-story header small { color:var(--muted); display:block; font-size:.75rem; font-weight:400; margin-top:.15rem; }
.product-story ol { list-style:none; margin:0; padding:0; }
.product-story li { align-items:center; display:flex; gap:1rem; padding:1.4rem 0; position:relative; }
.product-story li+li { border-top:1px dashed var(--line); }
.story-number { align-items:center; background:#eff3f9; border-radius:12px; color:var(--blue); display:flex; flex-shrink:0; font-size:.75rem; font-weight:700; height:44px; justify-content:center; width:44px; }
.product-story li strong { font-size:1rem; font-weight:650; }
.product-story li p { color:var(--muted); font-size:.85rem; margin:.2rem 0 0; }
.story-check { color:#49856c; margin-left:auto; }
.product-story .story-caption { background:#f5f7fa; border-radius:9px; color:var(--muted); font-size:.75rem; margin:.25rem 0 0; padding:.7rem; text-align:center; }

.page-heading { margin-bottom:2rem; max-width:780px; }
.page-heading h1,.page-heading h2 { font-size:clamp(2rem,3.3vw,2.8rem); font-weight:650; margin:.6rem 0 .8rem; }
.page-heading p { color:var(--muted); font-size:.975rem; margin:0; }
/* Included modules and limits stay visible for direct comparison. */
.plan-grid { align-items:start; display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)); }
.offer-group+.offer-group { margin-top:2rem; }
.offer-group>h3 { color:var(--muted); font-size:.8rem; font-weight:500; margin:0 0 .8rem; }
.plan-card { background:white; border:1px solid var(--line); border-radius:18px; min-width:0; padding:1.5rem; }
.plan-card h3 { font-size:1.35rem; font-weight:650; margin:0 0 .5rem; overflow-wrap:anywhere; }
.plan-card>p { color:var(--muted); font-size:.85rem; line-height:1.65; min-height:3.3em; margin-bottom:1rem; }
.plan-card ul { font-size:.825rem; list-style:none; margin:0 0 .8rem; padding:0; }
.plan-card li { display:flex; gap:.5rem; padding:.3rem 0; }
.plan-card li::before { color:#49856c; content:"\2713"; }
.plan-limits { border-top:1px solid var(--line); font-size:.75rem; margin:.75rem 0; padding-top:.7rem; }
.plan-limits div { align-items:baseline; display:flex; gap:.8rem; justify-content:space-between; padding:.3rem 0; }
.plan-limits dt { color:var(--muted); }
.plan-limits dd { font-weight:650; margin:0; }
.plan-price { padding-top:1rem; }
.plan-price+.plan-price { border-top:1px solid var(--line); margin-top:1rem; }
.price-amount { align-items:baseline; display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1rem; }
.price-amount strong { color:var(--navy); font-size:1.8rem; font-variant-numeric:tabular-nums; font-weight:650; letter-spacing:-.04em; }
.price-amount small { color:var(--muted); font-size:.75rem; }
.plan-price .button,.contact-plan { width:100%; }
.contact-plan { margin-top:1rem; }
.plans-note { color:var(--muted); font-size:.825rem; margin:1.25rem 0 0; }
.catalog-state { background:white; border:1px solid var(--line); border-radius:16px; padding:2rem; }
.catalog-state p { color:var(--muted); }
.catalog-state a { color:var(--blue); }
.disclosure summary,.faq-page summary { align-items:center; cursor:pointer; display:flex; font-size:.85rem; font-weight:600; gap:1rem; justify-content:space-between; list-style:none; padding:.85rem 0; }
.disclosure summary::-webkit-details-marker,.faq-page summary::-webkit-details-marker { display:none; }
.disclosure summary::after,.faq-page summary::after { content:"+"; color:var(--blue); flex-shrink:0; font-size:1.2rem; font-weight:400; }
.disclosure[open]>summary::after,.faq-page details[open]>summary::after { content:"\2212"; }
.plan-includes { border-bottom:1px solid var(--line); border-top:1px solid var(--line); }
.plan-includes h4 { color:var(--navy); font-size:.85rem; font-weight:600; margin:1rem 0 .65rem; }

/* Action first; the explanation can be expanded. */
.selected-plan { align-items:center; background:#eaf0f8; border:1px solid #d2deee; border-radius:10px; display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin-bottom:1.5rem; padding:.85rem 1.2rem; }
.selected-plan>span { color:var(--muted); font-size:.875rem; }
.start-choices { display:grid; gap:1.25rem; grid-template-columns:1fr 1fr; }
.start-choices article { background:white; border:1px solid var(--line); border-radius:18px; padding:1.8rem; }
.start-choices .new-customer { border-top:3px solid var(--accent); }
.start-choices h2 { font-size:1.3rem; font-weight:650; }
.start-choices p { color:var(--muted); font-size:.925rem; }
.start-choices .email-fallback { font-size:.8rem; margin:1rem 0 0; overflow-wrap:anywhere; }
.start-steps { border-bottom:1px solid var(--line); margin:1.2rem 0; }
.start-steps>summary { font-size:.9rem; padding:1rem 0; }
.step-grid { display:grid; gap:1.5rem; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; margin:0; padding:1rem 0; }
.step-grid li>span { color:var(--blue); font-size:.75rem; font-weight:700; }
.step-grid h2 { font-size:1.05rem; margin:.6rem 0; }
.step-grid p { color:var(--muted); font-size:.85rem; }
.back-link { color:var(--muted); font-size:.8rem; }
.faq-page { max-width:900px; }
.faq-page details { background:white; border:1px solid var(--line); border-radius:12px; margin:.65rem 0; padding:0 1.5rem; }
.faq-page summary { font-size:1rem; padding:1.2rem 0; }
.faq-page details p { color:var(--muted); font-size:.925rem; padding-bottom:.7rem; }
.faq-page details a { color:var(--blue); }
.error-page { margin:auto; max-width:700px; padding:4rem 1.5rem; }
.error-page h1 { font-size:2.5rem; }
.error-page p { color:var(--muted); }

@media(max-width:1050px) {
    .site-header { gap:.75rem; flex-wrap:wrap; }
    .site-header nav { justify-content:center; order:3; width:100%; }
    html { scroll-padding-top:140px; }
    .home-page { gap:2.5rem; }
    .home-copy h1 { font-size:3rem; }
    .plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
    .page-shell { padding:2rem 1.25rem; }
    .home-page { gap:2rem; grid-template-columns:1fr; }
    .feature-grid { grid-template-columns:1fr; }
    .feature-card,.feature-card:nth-child(-n+2),.feature-card:nth-child(n+6) { grid-column:auto; padding:1.25rem; }
    .feature-card h3 { margin:.75rem 0 .5rem; }
    .home-copy h1 { font-size:clamp(2.4rem,8vw,3rem); }
    .home-copy>p { font-size:.95rem; }
    .hero-actions { margin-top:1.25rem; }
    .product-story { padding:1.25rem; }
    .product-story li { padding:1rem 0; }
    .start-choices { grid-template-columns:1fr; }
    .step-grid { gap:.8rem; grid-template-columns:1fr; }
    .page-heading { margin-bottom:1.5rem; }
    .page-heading h1,.page-heading h2 { font-size:2rem; }
    footer { align-items:flex-start; font-size:.7rem; }
    footer p { max-width:240px; }
}
@media(max-width:480px) {
    html { scroll-padding-top:124px; }
    .site-header { padding:1rem 1.25rem .5rem; }
    .brand { font-size:1rem; gap:.5rem; }
    .brand small { font-size:.5rem; }
    .brand-mark { height:30px; width:30px; }
    .header-actions { gap:0; }
    .login-link { font-size:.65rem; padding:.5rem; min-height:38px; }
    .login-link span { display:none; }
    .culture-link { padding:.5rem; }
    .site-header nav a { flex:1; font-size:.75rem; padding:.5rem .4rem; text-align:center; }
    .plan-grid { grid-template-columns:1fr; }
    .hero-actions .button { flex:1; padding:.8rem .6rem; }
    .proof { font-size:.7rem; gap:.5rem; }
    .story-check { display:none; }
    .product-story header { font-size:.9rem; }
    .story-number { height:36px; width:36px; }
    .start-choices article { padding:1.5rem; }
}
@media(max-width:360px) { .site-header .brand small { display:none; }.site-header .brand { font-size:.9rem; }.site-header { gap:.5rem; }.culture-link { padding:.4rem; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.button { transition:none; } }