html[data-aud=b2b] [data-aud-show]:not([data-aud-show~=b2b]),html[data-aud=b2c] [data-aud-show]:not([data-aud-show~=b2c]),html[data-aud=both] [data-aud-show]:not([data-aud-show~=both]){display:none!important}
[data-aud-show]{animation:audFade .35s ease}
@keyframes audFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.aud-pill[aria-pressed=true]{background:#08a270!important;color:#fff!important;border-color:#08a270!important;box-shadow:0 6px 18px rgba(8,162,112,.28)}
.aud-pill:hover{border-color:#08a270}
.aud-pill:focus-visible{outline:3px solid #30cf94;outline-offset:3px}
@keyframes audPulse{0%{box-shadow:0 0 0 0 rgba(48,207,148,.6)}100%{box-shadow:0 0 0 16px rgba(48,207,148,0)}}
.aud-switch.is-hint .aud-pill[aria-pressed=false]{animation:audPulse 1.4s ease-out 3}
/* v1.3 layout grids on unclassed wrappers (hero, order/portal card rows, demo steps) */
.aud-hero>.container>div{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:3.5rem;align-items:center}
@media (max-width:991px){.aud-hero>.container>div{grid-template-columns:minmax(0,1fr);gap:2.5rem}}
@media (max-width:479px){.aud-pill{padding:.7rem 1.1rem!important;font-size:1rem!important}.aud-ask{font-size:1.5rem!important}}
.ord-card>div:not([class]){display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.25rem 1rem;padding:.75rem 0;border-top:1px solid #e6e6e6}
.ord-foot{margin-top:.25rem}
/* v1.4 B2B hero card compact on phones: smaller type, 3 rows instead of 4 */
@media (max-width:767px){.ord-card{padding:1.1rem!important}.ord-card_top{margin-bottom:.4rem!important}.ord-card_label{font-size:.68rem!important}.ord-card_cust{font-size:1rem!important}.ord-card_meta{font-size:.75rem!important}.ord-badge{font-size:.68rem!important;padding:.25rem .55rem!important}.ord-card>div:not([class]){padding:.55rem 0;gap:.1rem .75rem}.ord-item{font-size:.82rem!important;line-height:1.35}.ord-qty,.ord-codes,.ord-ok{font-size:.72rem!important}.ord-foot{font-size:.8rem!important;padding-top:.55rem!important}.ord-caption{font-size:.7rem!important;margin-top:.5rem!important}.ord-card>div:nth-child(4){display:none!important}}
#how-we-work .container>div:not([class]){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem}
@media (max-width:991px){#how-we-work .container>div:not([class]){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:479px){#how-we-work .container>div:not([class]){grid-template-columns:minmax(0,1fr)}}
.mp-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;margin-top:2.5rem}
.mp-logo{background:#fff;border:1px solid #e6e6e6;border-radius:10px;height:88px;display:flex;align-items:center;justify-content:center;padding:1rem;transition:transform .2s,box-shadow .2s}
.mp-logo:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(24,30,53,.08)}
.mp-logo img{max-height:46px;max-width:100%;object-fit:contain}
/* v1.1 Why/How/What: stack on tablet + mobile */
@media (max-width:991px){.why-grid{grid-template-columns:minmax(0,1fr)!important;gap:1rem!important;margin-top:2rem!important}.why-card{padding:1.25rem 1.5rem!important}.why-text{font-size:1rem!important}.why-label{margin-bottom:.5rem!important}}
@media (max-width:479px){.why-lead{font-size:1rem!important;line-height:1.55!important}.why-foot{font-size:.95rem!important}}
/* v1.2 icon cards (Why choose + B2B platform): 2 cols tablet, 1 col mobile */
.wc-icon .w-embed{display:flex;align-items:center;justify-content:center}
.wc-card .route-link{margin-top:auto}
@media (max-width:991px){.wc-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:1rem!important}.wc-card{padding:1.5rem!important}}
@media (max-width:767px){.wc-grid{grid-template-columns:minmax(0,1fr)!important}}
/* v1.5 hero imagery (Figma screendesign 2026): warehouse photo behind the hero, text side faded to the page tint, B2B view only */
html[data-aud=b2b] .aud-hero{background-color:#f4f7fa;background-image:linear-gradient(90deg,#f4f7fa 0%,#f4f7fa 40%,rgba(244,247,250,.55) 62%,rgba(244,247,250,0) 88%),url("/images/home/hero-warehouse.webp");background-position:0 0,center;background-repeat:no-repeat;background-size:auto,cover}
html[data-aud=b2b] .aud-hero .ord-card{box-shadow:0 30px 70px rgba(24,30,53,.28)}
@media (max-width:991px){html[data-aud=b2b] .aud-hero{background-image:linear-gradient(180deg,#f4f7fa 0%,#f4f7fa 55%,rgba(244,247,250,.85) 100%),url("/images/home/hero-warehouse-m.webp")}}
/* v1.6 hero imagery: Figma hero composition, product screen with three green-tick labels, inside the right column */
.hero-visual{position:relative}
.hero-shot{position:relative;padding:1.6rem 0 1.4rem}
.hero-screen{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 30px 70px rgba(24,30,53,.28)}
.hero-chip{position:absolute;display:inline-flex;align-items:center;gap:.6rem;background:#181e35;color:#fff;font-family:Space Grotesk,sans-serif;font-weight:600;font-size:.95rem;line-height:1;white-space:nowrap;padding:.55rem 1.1rem .55rem .55rem;border-radius:999px;box-shadow:0 12px 28px rgba(24,30,53,.3);z-index:1}
.hero-chip svg{flex:none;width:1.75rem;height:1.75rem;border-radius:50%;background:#08a270;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.hero-chip.is-1{top:0;left:19%}
.hero-chip.is-2{top:45%;right:-2%}
.hero-chip.is-3{bottom:0;left:27%}
@media (max-width:1279px){.hero-chip{font-size:.85rem}.hero-chip svg{width:1.5rem;height:1.5rem}.hero-chip.is-2{right:0}}
@media (max-width:767px){.hero-shot{padding:1.4rem 0 1.2rem}.hero-chip{font-size:.75rem;padding:.4rem .8rem .4rem .4rem;gap:.45rem}.hero-chip svg{width:1.25rem;height:1.25rem}.hero-chip.is-1{left:4%}.hero-chip.is-3{left:10%}}
@media (max-width:479px){.hero-chip{font-size:.68rem}.hero-chip.is-1{left:2%}.hero-chip.is-2{top:42%;right:2%}.hero-chip.is-3{left:6%}}

/* v1.7 imagery below the hero: photo beside the fix panel, banner under the steps, limits placeholder */
@media (min-width:1100px){.fix-split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:2rem;align-items:stretch}.fix-split .fix-panel{max-width:none;margin:0}.fix-split .fix-photo{height:100%;min-height:100%}}
.fix-photo,.how-photo{display:block;width:100%;height:auto;object-fit:cover;border-radius:12px;box-shadow:0 18px 40px -16px rgba(24,30,53,.25)}
.fix-split .fix-photo{margin-top:0}
@media (max-width:1099px){.fix-split{display:block}.fix-photo{margin-top:1.5rem;max-height:340px}}
.how-photo{margin:2.5rem 0 0;aspect-ratio:21 / 8}
@media (max-width:767px){.how-photo{aspect-ratio:16 / 10;margin-top:1.5rem}}
.limits-shot{margin-top:2.5rem}
.limits-shot>.section_header{margin-bottom:2rem}
/* v1.8 How it works: Figma composition, person at a laptop with the ERP and portal screens floating over the photo */
.how-shot{position:relative;max-width:1040px;margin:2.5rem auto 0;padding-right:27%}
.how-shot_photo{display:block;width:100%;height:auto;aspect-ratio:1.22;object-fit:cover;object-position:50% 50%;border-radius:14px;box-shadow:0 24px 60px rgba(24,30,53,.25)}
.how-shot_card{position:absolute;right:0;top:31%;width:52%;height:auto;filter:drop-shadow(0 18px 36px rgba(24,30,53,.28))}
.how-shot_badge{position:absolute;z-index:1;right:5.6%;top:42.6%;width:6.6%;height:auto;filter:drop-shadow(0 10px 20px rgba(24,30,53,.28))}
@media (max-width:767px){.how-shot{margin-top:1.5rem;padding-right:0;padding-bottom:30%}.how-shot_photo{aspect-ratio:4 / 3;object-position:30% 30%}.how-shot_card{width:78%;top:auto;bottom:0;right:-2%}.how-shot_badge{width:9.9%;top:auto;bottom:35%;right:6.4%}}
/* v1.9 limits CTA: Figma 772:8007, centred under the visual, full width on phones */
.limits-cta{display:flex;justify-content:center;margin-top:2.5rem}
@media (max-width:479px){.limits-cta{margin-top:2rem}.limits-cta .button{width:100%;text-align:center;box-sizing:border-box}}

/* v2.0 Figma screendesign 2026 pass (home only): shorter cards, Figma layouts, mobile per Figma 784:12105 */
/* Where off-the-shelf tools stop: Figma 772:6004 cards, red cross tile */
.hp-pains{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.hp-pain{background:#fff;border-radius:12px;padding:2rem 1.75rem;text-align:center;display:flex;flex-direction:column;align-items:center;box-shadow:0 1px 2px rgba(24,30,53,.04)}
.hp-pain_icon{display:flex;align-items:center;justify-content:center;width:3.25rem;height:3.25rem;border-radius:8px;background:#fdeceb;margin-bottom:1.25rem}
.hp-pain_icon svg{width:1.5rem;height:1.5rem;fill:none;stroke:#d64545;stroke-width:2.2;stroke-linecap:round}
.hp-pain_title{margin:0 0 .5rem;font-family:var(--_typography---font--heading);font-size:1.25rem;font-weight:700;line-height:1.3;color:#181e35}
.hp-pain_text{margin:0;font-size:1rem;line-height:1.55;color:#4a5568;max-width:19rem}
@media (max-width:991px){.hp-pains{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}}
@media (max-width:767px){.hp-pains{grid-template-columns:minmax(0,1fr);gap:.75rem}.hp-pain{text-align:left;align-items:flex-start;padding:1.25rem 1.25rem 1.35rem;display:grid;grid-template-columns:2.5rem minmax(0,1fr);column-gap:1rem;row-gap:.25rem}.hp-pain_icon{grid-row:span 2;width:2.5rem;height:2.5rem;margin:0}.hp-pain_icon svg{width:1.15rem;height:1.15rem}.hp-pain_title{font-size:1.0625rem;margin:0;align-self:center}.hp-pain_text{font-size:.9375rem;max-width:none}}

/* What we fix: Figma 772:7613 cards, green icon tile, last card navy */
.hp-fix_grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem}
.hp-fix_card{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid #e3e8ee;border-radius:12px;padding:1.75rem 1.5rem}
.hp-fix_icon{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:8px;background:#e7f6f0;margin-bottom:1.25rem}
.hp-fix_icon svg{width:1.4rem;height:1.4rem;fill:none;stroke:#08a270;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hp-fix_title{margin:0 0 .5rem;font-family:var(--_typography---font--heading);font-size:1.1875rem;font-weight:700;line-height:1.3;color:#181e35}
.hp-fix_text{margin:0;font-size:.9375rem;line-height:1.55;color:#4a5568}
.hp-fix_card.is-close{background:#181e35;border-color:#181e35}
.hp-fix_card.is-close .hp-fix_icon{background:#08a270}
.hp-fix_card.is-close .hp-fix_icon svg{stroke:#fff}
.hp-fix_card.is-close .hp-fix_title{color:#fff}
.hp-fix_card.is-close .hp-fix_text{color:#c9d1e0}
.hp-fix_cta{margin-top:auto;width:100%;box-sizing:border-box;text-align:center;justify-content:center;white-space:nowrap;padding:.7rem 1rem;font-size:.9375rem}
.hp-fix_card.is-close .hp-fix_text{margin-bottom:1.25rem}
.hp-fix_limits{margin:1.75rem auto 0;max-width:46rem;text-align:center;font-size:.9375rem;line-height:1.5;color:#596780}
@media (max-width:1099px){.hp-fix_grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}}
@media (max-width:767px){.hp-fix_grid{grid-template-columns:minmax(0,1fr);gap:.75rem}.hp-fix_card{display:grid;grid-template-columns:2.5rem minmax(0,1fr);column-gap:1rem;row-gap:.25rem;padding:1.25rem}.hp-fix_icon{grid-row:span 2;width:2.5rem;height:2.5rem;margin:0}.hp-fix_icon svg{width:1.15rem;height:1.15rem}.hp-fix_title{font-size:1.0625rem;margin:0;align-self:center}.hp-fix_text{font-size:.9375rem}.hp-fix_card.is-close .hp-fix_text{margin-bottom:1rem}.hp-fix_cta{grid-column:1/-1;width:100%;text-align:center;box-sizing:border-box}.hp-fix_limits{text-align:left;font-size:.875rem;margin-top:1.25rem}}

/* How it works: Figma 772:7670, copy and steps left, photo composition right */
.hp-how_grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:4rem;align-items:center}
.hp-how_intro{margin-top:1rem!important;color:#4a5568}
.hp-how_steps{list-style:none;margin:2rem 0 2.25rem;padding:0;display:flex;flex-direction:column;gap:1.25rem}
.hp-how_step{display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:1rem;align-items:start}
.hp-how_num{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:50%;background:#181e35;color:#fff;font-family:var(--_typography---font--heading);font-weight:700;font-size:1rem}
.hp-how_title{margin:.3rem 0 .25rem;font-family:var(--_typography---font--heading);font-size:1.125rem;font-weight:700;line-height:1.3;color:#181e35}
.hp-how_text{margin:0;font-size:.9375rem;line-height:1.55;color:#4a5568}
.hp-how .how-shot{margin:0;max-width:none}
@media (max-width:991px){.hp-how_grid{grid-template-columns:minmax(0,1fr);gap:2.5rem}.hp-how .how-shot{max-width:40rem;margin:0 auto;width:100%}}
@media (max-width:767px){.hp-how_steps{margin:1.5rem 0 1.75rem;gap:1rem}.hp-how_num{width:2rem;height:2rem;font-size:.9375rem}.hp-how_step{grid-template-columns:2rem minmax(0,1fr);gap:.875rem}.hp-how_title{margin-top:.2rem;font-size:1.0625rem}.hp-how_cta{width:100%;text-align:center;box-sizing:border-box}}

/* FAQ: Figma 772:6264, filled rows on white, no card shadows */
#v2-faq.section{background:#fff}
#v2-faq .faq-list{gap:.625rem}
#v2-faq .faq-item{background:#f4f7fa;border:0;box-shadow:none;border-radius:8px}
#v2-faq .faq-item_icon{width:16px;height:16px}
#v2-faq .faq-item_icon::before,#v2-faq .faq-item_icon::after{width:16px;height:2.5px;top:6.75px;background:#181e35;border-radius:2px}

/* Hero: room between the headline and the lead; more air above the second heading in the limits section */
.aud-hero .heading-h1{margin-bottom:1.25rem}
@media (min-width:768px){.limits-shot{margin-top:5rem}}

/* Phones, Figma 784:12105: headings left, full-width buttons, calmer spacing */
@media (max-width:767px){
.section_header{text-align:left;align-items:flex-start;margin-bottom:2rem}
.aud-hero .heading-h1{font-size:2.375rem;line-height:1.12}
.aud-hero .text-lead{font-size:1rem;line-height:1.65}
.limits-shot{margin-top:3.5rem}
.lim-pill{font-size:13px;width:fit-content;max-width:100%}
.logo-bar_inner{align-items:center}
.logo-bar_title{text-align:center;max-width:18rem;font-size:1.125rem}
.logo-marquee{width:calc(100% + 2.5rem);margin:0 -1.25rem}
.addons_list{display:block}
.addons_list li{position:relative;background:none;border:0;border-radius:0;padding:.3rem 0 .3rem 1.25rem;font-size:.9375rem}
.addons_list li::before{content:"";position:absolute;left:.15rem;top:.85em;width:.45rem;height:.45rem;border-radius:50%;background:#08a270}
}
