.connected-heading{padding:58px 24px 46px}
.connected-stage{overflow:hidden}
.connected-heading h1{max-width:1080px}
.five-second{max-width:850px;margin:14px auto 0;color:#bdd7e7;font-size:1rem;line-height:1.65}
.order-journey-rail{display:flex;align-items:center;justify-content:center;gap:clamp(8px,1.4vw,20px);max-width:1320px;margin:34px auto 0;padding:16px 22px;border:1px solid #5b8299;border-radius:14px;background:#0c2944b8;box-shadow:0 16px 45px #02152b38;color:#e8f5fb}
.order-journey-rail span,.order-journey-rail b{font-size:.8rem;font-weight:750;white-space:nowrap}
.order-journey-rail b{color:#45d6f2}
.order-journey-rail i{font-size:1rem;color:#25c8ed;font-style:normal}
.trace-intro h2{max-width:650px}
.trace-intro .button{white-space:nowrap}
.order-status-grid{display:grid;grid-template-columns:1fr 1fr 1.15fr 1fr 1fr;gap:10px;padding:18px 22px 16px;border-bottom:1px solid #d5e2e9}
.order-status-grid>div{min-height:72px;padding:12px 14px;border:1px solid #dce8ee;border-radius:9px;background:#f8fbfd}
.order-status-grid small,.order-status-grid b{display:block}
.order-status-grid small{color:#607b8d;font-size:.64rem;font-weight:800;letter-spacing:.1em}
.order-status-grid b{margin-top:8px;color:#102f47;font-size:.94rem}
.order-status-grid .order-progress i{display:block;height:6px;margin-top:8px;border-radius:8px;background:#d9e9ef;overflow:hidden}
.order-status-grid .order-progress i span{display:block;width:72%;height:100%;border-radius:8px;background:#0ca7c9}
.order-status-grid .order-risk b{color:#167a5d}
.order-status-grid .order-risk b i{display:inline-block;width:8px;height:8px;margin:0 7px 1px 0;border-radius:50%;background:#32b783}
.logistics-status{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:14px 22px;background:#edf5f8}
.logistics-status>span{padding:4px 14px;border-right:1px solid #d4e2e8}
.logistics-status>span:first-child{padding-left:0}
.logistics-status>span:last-child{border:0}
.logistics-status small,.logistics-status b{display:block}
.logistics-status small{color:#648093;font-size:.61rem;font-weight:800;letter-spacing:.09em}
.logistics-status b{margin-top:5px;color:#183b52;font-size:.76rem;line-height:1.4}
.price-intelligence-example{margin:28px 0 14px;padding:24px;border:1px solid #c9e0ea;border-radius:14px;background:linear-gradient(135deg,#f2f9fc,#fff);box-shadow:0 15px 40px #082d4810}
.price-example-heading{display:flex;align-items:center;justify-content:space-between;gap:18px}
.price-example-heading .mfg-kicker{margin-bottom:6px}
.price-example-heading h3{margin:0;color:#092d47;font:800 clamp(1.25rem,2vw,1.7rem)/1.2 var(--font-display);letter-spacing:-.035em}
.price-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin:20px 0}
.price-metrics>div{padding:13px;border:1px solid #dce8ee;border-radius:8px;background:white}
.price-metrics small,.price-metrics b{display:block}
.price-metrics small{color:#607b8d;font-size:.59rem;font-weight:800;letter-spacing:.075em;line-height:1.4}
.price-metrics b{margin-top:8px;color:#143b53;font:800 1.25rem/1.2 var(--font-display)}
.price-metrics .metric-good{border-color:#b9e4d6;background:#f2fbf7}
.price-metrics .metric-good b{color:#157253}
.price-metrics .metric-sacrifice{border-color:#eddfb5;background:#fffaf0}
.price-metrics .metric-sacrifice b{color:#8c6514;font-size:1rem}
.price-scaling{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);gap:16px;align-items:center;padding:16px;border-radius:9px;background:#08233c;color:white}
.price-scaling>div{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.price-scaling>div>b{grid-column:1/-1;font-size:.78rem}
.price-scaling>div>span{display:flex;flex-direction:column;gap:5px;padding:10px;border:1px solid #31536b;border-radius:7px;color:#c4d9e6;font-size:.68rem}
.price-scaling>div>span strong{color:white;font-size:1rem}
.price-scaling>div>.price-viable{border-color:#31c5ad;background:#0b3e47}
.price-scaling>div>.price-viable strong{color:#62e6ce}
.price-scaling>p{margin:0;color:#70e1cf;font:800 1.03rem/1.4 var(--font-display)}
.price-intelligence-example>.mfg-note{margin:13px 0 0}
#operacion-completa .profit-blocks{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:34px}
#operacion-completa .profit-blocks article{padding:19px 16px;border:1px solid #d6e4eb;border-radius:10px;background:#fff;box-shadow:0 10px 28px #102f470a}
#operacion-completa .profit-blocks .material-symbols-rounded{color:#078eb4;font-size:1.65rem}
#operacion-completa .profit-blocks h3{margin:14px 0 5px;color:#12364d;font:800 1rem var(--font-display)}
#operacion-completa .profit-blocks p{margin:0;color:#5a7081;font-size:.79rem;line-height:1.5}
#operacion-completa>.mfg-note{margin-top:20px}
.expected-actual-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);gap:clamp(36px,7vw,105px);align-items:center;background:#edf5f8}
.expected-actual-copy{max-width:650px}
.expected-actual-copy h2{margin:0 0 16px;color:#08263e;font:800 clamp(2rem,3.5vw,3.25rem)/1.12 var(--font-display);letter-spacing:-.045em}
.expected-actual-copy>p:not(.mfg-kicker){max-width:580px;color:#4e697b;font-size:1rem;line-height:1.7}
.variance-causes{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.variance-causes span{padding:8px 12px;border:1px solid #d0e1e8;border-radius:99px;background:white;color:#284d63;font-size:.74rem;font-weight:700}
.margin-comparison{padding:25px;border:1px solid #d1e1e8;border-radius:13px;background:#fff;box-shadow:0 18px 48px #0a2d4412}
.margin-value small{display:block;color:#567184;font-size:.66rem;font-weight:800;letter-spacing:.1em}
.margin-value strong{display:block;margin:5px 0 10px;color:#0c5777;font:800 2.7rem/1.1 var(--font-display)}
.margin-value i{display:block;height:9px;border-radius:10px;background:#e4edf1;overflow:hidden}
.margin-value i b{display:block;height:100%;border-radius:10px;background:#12a9c8}
.margin-value.actual-margin strong{color:#bd5960}
.margin-value.actual-margin i b{background:#e48082}
.margin-gap{display:flex;align-items:center;gap:12px;margin:13px 0;color:#9a5b4b;font-size:.77rem;font-weight:800}
.margin-gap:before,.margin-gap:after{content:"";height:1px;flex:1;background:#e5d7d2}
.margin-comparison>p{margin:17px 0 0;color:#697d8b;font-size:.7rem;line-height:1.5}
.operation-promises b{font-size:.76rem}
@media(max-width:1000px){
 .order-journey-rail{justify-content:flex-start;overflow-x:auto}
 .price-metrics{grid-template-columns:repeat(3,1fr)}
 #operacion-completa .profit-blocks{grid-template-columns:repeat(3,1fr)}
 .order-status-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:700px){
 .connected-heading{padding:44px 18px 36px}
 .five-second{font-size:.9rem}
 .order-journey-rail{margin-top:25px;padding:13px 16px}
 .order-journey-rail span,.order-journey-rail b{font-size:.72rem}
 .order-status-grid{grid-template-columns:repeat(2,1fr);padding:13px}
 .order-status-grid .order-progress{grid-column:span 2}
 .logistics-status{grid-template-columns:1fr 1fr;gap:10px;padding:14px}
 .logistics-status>span,.logistics-status>span:first-child{padding:5px;border:0}
 .price-intelligence-example{padding:17px}
 .price-metrics{grid-template-columns:1fr 1fr}
 .price-metrics>div:last-child{grid-column:1/-1}
 .price-scaling{grid-template-columns:1fr}
 .price-scaling>div{grid-template-columns:1fr 1fr}
 #operacion-completa .profit-blocks{grid-template-columns:1fr 1fr}
 .expected-actual-section{grid-template-columns:1fr;gap:24px}
 .margin-comparison{padding:19px}
 .price-example-heading{align-items:flex-start}
 .price-example-heading>.target-chip{display:none}
 .trace-intro .button{white-space:normal}
}
@media(max-width:380px){
 #operacion-completa .profit-blocks{grid-template-columns:1fr}
 .price-metrics{grid-template-columns:1fr}
 .price-metrics>div:last-child{grid-column:auto}
}
/* Manufacturer product experience */
.connected-hero{overflow:hidden}
.connected-heading{padding-bottom:48px}
.connected-heading .hero-actions{justify-content:center}
.hero-product-stage{position:relative;display:grid;grid-template-columns:minmax(220px,.34fr) minmax(0,1fr);gap:25px;align-items:center;width:min(1320px,calc(100% - 48px));margin:-12px auto 0;padding:34px 0 4px}
.hero-product-copy{max-width:290px;padding:0 4px;color:#143047}
.product-kicker{display:flex;align-items:center;gap:8px;color:#1685a5;font-size:.65rem;font-weight:800;letter-spacing:.12em}
.product-kicker i,.connection-live i{width:7px;height:7px;border-radius:50%;background:#25b68b;box-shadow:0 0 0 4px #25b68b1c}
.product-kicker span{margin-left:3px;color:#71899a;font-size:.56rem}
.hero-product-copy h2{margin:17px 0 12px;font:800 clamp(1.8rem,2.8vw,2.7rem)/1.12 var(--font-display);letter-spacing:-.045em}
.hero-product-copy p{color:#597286;font-size:.9rem;line-height:1.7}
.hero-dashboard-shell,.experience-window,.module-screen-shell,.ai-product-window{position:relative;overflow:hidden;border:1px solid #d8e2e9;border-radius:15px;background:#fff;box-shadow:0 25px 70px #0a2d4418}
.app-window-bar{height:52px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 17px;border-bottom:1px solid #e6edf1;background:#fff;color:#536b7d;font-size:.7rem}
.window-brand,.window-actions{display:flex;align-items:center;gap:9px}
.window-brand b{color:#12354d;font-size:.78rem}
.window-divider{padding:0 3px;color:#c2ced6}
.pf-mark{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#08233c;color:#35d4f1;font:800 .8rem var(--font-display)}
.hero-dashboard-shell .window-brand .pf-mark,.experience-window .window-brand .pf-mark{display:none}
.hero-dashboard-shell .window-brand>b,.experience-window .window-brand>b{font:800 .9rem/1 var(--font-display);letter-spacing:-.045em;background:linear-gradient(90deg,#12354d 0 56%,#11a9ca 56% 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.connection-live{display:inline-flex;align-items:center;gap:7px;color:#537082;font-size:.66rem;white-space:nowrap}
.connection-live i{width:6px;height:6px;box-shadow:none}
.avatar-dot{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#e4f2f7;color:#176685;font-size:.58rem;font-weight:800}
.hero-dashboard-content{padding:18px 20px 14px}
.hero-dashboard-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}
.hero-dashboard-heading small{color:#728898;font-size:.6rem;font-weight:800;letter-spacing:.11em}
.hero-dashboard-heading h3{margin:4px 0 0;color:#113149;font:800 1.1rem var(--font-display)}
.demo-label,.experience-example-tag{padding:6px 9px;border:1px solid #dce7ec;border-radius:99px;color:#6d8391;font-size:.56rem;font-weight:800;letter-spacing:.08em}
.hero-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.hero-kpi-grid article{position:relative;overflow:hidden;min-height:105px;padding:12px 13px;border:1px solid #e1e9ee;border-radius:9px;background:linear-gradient(140deg,#fff,#fbfdfe)}
.hero-kpi-grid article>small,.hero-kpi-grid article>span{display:block}
.hero-kpi-grid article>small{color:#6f8391;font-size:.63rem;font-weight:650}
.hero-kpi-grid article>strong{display:block;margin:9px 0 4px;color:#0e2f49;font:800 1.7rem/1 var(--font-display);letter-spacing:-.04em;font-variant-numeric:tabular-nums;transition:color .5s}
.hero-kpi-grid article>strong em{font-size:.9rem;font-style:normal}
.hero-kpi-grid article>span{color:#82939e;font-size:.57rem}
.hero-kpi-grid article>.kpi-warn{color:#d28225}
.sparkline{position:absolute;right:10px;bottom:13px;width:44px;height:17px;border-bottom:2px solid #8fd8e8;clip-path:polygon(0 70%,18% 50%,31% 66%,45% 20%,61% 47%,79% 10%,100% 25%,100% 100%,0 100%)}
.spark-orange{border-color:#edbd71;filter:drop-shadow(0 0 2px #edbd71)}
.spark-green{border-color:#78c9a6}
.kpi-progress{height:4px;margin-top:15px;border-radius:8px;background:#e6eef2;overflow:hidden}
.kpi-progress i{display:block;height:100%;border-radius:8px;background:#16aaca;animation:bar-glow 5s ease-in-out infinite alternate}
.hero-order-table{margin-top:15px}
.hero-order-head,.hero-order-row{display:grid;grid-template-columns:1.05fr 1.45fr .9fr .55fr;align-items:center;gap:10px}
.hero-order-head{padding:0 10px 7px;color:#82939e;font-size:.55rem;font-weight:800;letter-spacing:.08em}
.hero-order-row{min-height:35px;padding:0 10px;border-top:1px solid #edf1f4;color:#38556b;font-size:.67rem}
.hero-order-row>b{color:#17364c;font-size:.67rem}
.hero-order-row strong{text-align:right}
.status-dot{display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;vertical-align:1px}
.status-blue{background:#1da6c8}.status-orange{background:#dc9a3e}.status-red{background:#dc6b6d}
.margin-positive{color:#148365}.margin-negative{color:#bf4c53}
.hero-production-strip{display:grid;grid-template-columns:minmax(180px,1fr) minmax(100px,.8fr) auto;align-items:center;gap:13px;margin-top:11px;padding:10px 12px;border:1px solid #e0e9ee;border-radius:9px;background:#f8fbfc}
.hero-production-strip>div:first-child{display:flex;align-items:center;gap:9px}
.hero-production-strip .material-symbols-rounded{color:#138aaa;font-size:1.3rem}
.hero-production-strip p{margin:0}
.hero-production-strip p b,.hero-production-strip p small{display:block}
.hero-production-strip p b{color:#173a51;font-size:.65rem}
.hero-production-strip p small{margin-top:3px;color:#6c8392;font-size:.59rem}
.production-bar{height:5px;border-radius:9px;background:#e0eaee;overflow:hidden}
.production-bar i{display:block;height:100%;border-radius:9px;background:#15a9c8;transition:width 1.2s ease}
.hero-alert-pill{color:#b16c1d;font-size:.57rem;white-space:nowrap}
.hero-alert-pill i{display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:#df9a39}
.floating-alert{position:absolute;z-index:2;display:flex;align-items:center;gap:9px;max-width:245px;padding:9px 12px;border:1px solid #dce6eb;border-radius:10px;background:#fffffff2;box-shadow:0 12px 35px #0e30451a;animation:float-in .8s ease both}
.floating-alert p{margin:0}
.floating-alert p b,.floating-alert p small{display:block}
.floating-alert p b{color:#2b485e;font-size:.58rem;letter-spacing:.06em}
.floating-alert p small{margin-top:4px;color:#637b8c;font-size:.59rem}
.alert-icon{display:grid;place-items:center;flex:0 0 26px;height:26px;border-radius:8px;background:#e8f6fa;color:#087d9e;font-size:.62rem;font-weight:900}
.alert-icon-red{background:#fff0ef;color:#bf5353}.alert-icon-orange{background:#fff6e7;color:#b27c26}
.alert-icon .material-symbols-rounded{font-size:1rem}
.alert-scrap{top:20%;right:-6px;animation-delay:.18s}
.alert-margin{bottom:18%;left:-28px;animation-delay:.42s}
.alert-inventory{top:66%;right:-20px;animation-delay:.7s}
.five-second{max-width:900px;margin:26px auto 0;padding:16px 20px;border:1px solid #d9e7ed;border-radius:10px;background:#ffffffba;color:#38596f;font-size:.85rem;line-height:1.65;text-align:center}
.interactive-section-intro{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:26px}
.interactive-section-intro>div{max-width:760px}
.interactive-section-intro h2,.story-heading h2,.ai-intro h2{margin:0 0 10px;color:#092c45;font:800 clamp(2rem,3.5vw,3.15rem)/1.12 var(--font-display);letter-spacing:-.05em}
.interactive-section-intro>div>p:last-child,.story-heading>p:last-child,.ai-intro>p:last-child{margin:0;color:#587083;font-size:.94rem;line-height:1.6}
.experience-example-tag,.module-explorer-caption{flex-shrink:0}
.experience-window{border-radius:16px}
.experience-stage-tabs{display:flex;gap:5px;padding:12px 15px;border-bottom:1px solid #e8eef1;background:#fbfdfe;overflow-x:auto}
.experience-stage-tabs button{flex:1;min-width:max-content;padding:10px 13px;border:1px solid transparent;border-radius:8px;background:transparent;color:#63798a;font:700 .75rem var(--font-body);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.experience-stage-tabs button[aria-selected=true]{border-color:#cde7f0;background:#eaf7fb;color:#057d9f}
.experience-screen{min-height:275px;padding:24px;animation:screen-enter .42s ease both}
.experience-screen-heading{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}
.screen-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:12px;background:#e8f6fa;color:#078bad}
.screen-icon .material-symbols-rounded{font-size:1.5rem}
.screen-badge{color:#0786a5;font-size:.58rem;font-weight:850;letter-spacing:.1em}
.experience-screen-heading h3,.module-screen-heading h3{margin:6px 0 5px;color:#102f47;font:800 1.27rem var(--font-display)}
.experience-screen-heading p,.module-screen-heading p{margin:0;color:#647b8a;font-size:.75rem;line-height:1.5}
.screen-state{padding:8px 11px;border:1px solid #cce7dc;border-radius:99px;background:#f3fbf7;color:#16815f;font-size:.63rem;font-weight:750}
#experience-screen[data-active-stage=production] .screen-state,#experience-screen[data-active-stage=inventory] .screen-state{border-color:#f1ddb7;background:#fffaf0;color:#a77220}
#experience-screen[data-active-stage=margin] .screen-state{border-color:#f0c9c9;background:#fff4f3;color:#b84c53}
.experience-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:22px}
.experience-metric{min-height:68px;padding:13px;border:1px solid #e4ebef;border-radius:9px;background:#fff}
.experience-metric small,.experience-metric strong{display:block}
.experience-metric small{color:#718696;font-size:.6rem;font-weight:700}
.experience-metric strong{margin-top:8px;color:#173c55;font:800 1.04rem var(--font-display);font-variant-numeric:tabular-nums}
.experience-progress{margin-top:18px}
.experience-progress>div{display:flex;justify-content:space-between;color:#698091;font-size:.65rem}
.experience-progress>div b{color:#16809f}
.experience-progress>i{display:block;height:6px;margin-top:8px;border-radius:99px;background:#e8eff2;overflow:hidden}
.experience-progress>i span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#19aed0,#6bc9d8);transition:width .6s ease}
.experience-screen-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:17px;padding-top:14px;border-top:1px solid #edf1f4}
.experience-screen-footer p{margin:0;color:#657e8d;font-size:.68rem;line-height:1.5}
.demo-action{display:flex;align-items:center;gap:8px;flex-shrink:0;padding:9px 12px;border:0;border-radius:7px;background:#072c48;color:white;font:700 .68rem var(--font-body)}
.demo-action .material-symbols-rounded{font-size:.95rem}
.experience-window-footer{display:flex;justify-content:space-between;gap:12px;padding:11px 18px;border-top:1px solid #e7eef1;background:#f8fbfc;color:#738795;font-size:.62rem}
.experience-window-footer a{color:#087fa0;font-weight:750;text-decoration:none}
.module-explorer{background:#f5f8fa}
.module-explorer-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:16px}
.module-tab-list{display:grid;align-content:start;gap:5px}
.module-tab-list button{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid transparent;border-radius:8px;background:transparent;color:#607889;text-align:left;font:700 .77rem var(--font-body);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.module-tab-list button .material-symbols-rounded{font-size:1.1rem}
.module-tab-list button[aria-selected=true]{border-color:#d4e5eb;background:white;color:#087f9f;box-shadow:0 6px 16px #0b3c5509}
.module-screen-shell{min-height:340px;padding:22px}
.module-screen-heading{display:flex;align-items:start;justify-content:space-between;gap:18px}
.module-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:17px 0}
.module-stats>div{padding:12px 14px;border:1px solid #e3ebef;border-radius:8px;background:#fbfdfe}
.module-stats strong,.module-stats small{display:block}
.module-stats strong{color:#112f46;font:800 1.35rem var(--font-display)}
.module-stats small{margin-top:4px;color:#778d9b;font-size:.62rem}
.module-data-table{overflow:hidden;border:1px solid #e4ebef;border-radius:8px}
.module-data-head,.module-data-row{display:grid;grid-template-columns:1.2fr 1fr 1fr .9fr;gap:8px;align-items:center;padding:10px 12px}
.module-data-head{background:#f5f8fa;color:#82939d;font-size:.57rem;font-weight:800;letter-spacing:.08em}
.module-data-row{border-top:1px solid #edf1f4;color:#38566a;font-size:.65rem}
.module-data-row span:first-child{color:#1b3b52;font-weight:750}
.module-data-row span:nth-child(3){font-weight:750}
.module-explorer-caption{color:#718796;font-size:.61rem;font-weight:800;letter-spacing:.08em}
.scroll-story{background:#0c1e31;color:white}
.story-heading{max-width:700px;margin-bottom:30px}
.story-heading h2{color:white}
.story-heading>p:last-child{color:#b3c7d5}
.story-heading .mfg-kicker{color:#4bc8e1}
.story-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:45px;align-items:start}
.story-steps{display:grid;gap:9px}
.story-step{min-height:180px;padding:24px;border-left:2px solid #29465b;opacity:.62;transition:opacity .3s,border-color .3s,background .3s}
.story-step.is-active{border-color:#42c9e2;background:linear-gradient(90deg,#173247,#0c1e3100);opacity:1}
.story-step>span{color:#58cce2;font-size:.61rem;font-weight:850;letter-spacing:.12em}
.story-step h3{max-width:420px;margin:13px 0 8px;color:#f4f8fb;font:750 1.3rem/1.2 var(--font-display);letter-spacing:-.025em}
.story-step p{max-width:450px;margin:0;color:#afc3d0;font-size:.8rem;line-height:1.65}
.story-sticky{position:sticky;top:100px;padding-top:12px}
.story-preview{position:relative;overflow:visible;min-height:430px;border:1px solid #30495d;border-radius:14px;background:#f7fafb;color:#17354c;box-shadow:0 30px 70px #0004;animation:screen-enter .45s ease both}
.story-app-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 17px;border-bottom:1px solid #e3eaee;background:#fff;border-radius:14px 14px 0 0;color:#728491;font-size:.6rem}
.mini-brand{font-weight:850;color:#14364e}
.mini-brand span{color:#13a8ca}
.story-app-body{display:grid;grid-template-columns:44px 1fr;min-height:350px}
.story-app-nav{display:grid;align-content:start;justify-items:center;gap:19px;padding-top:20px;border-right:1px solid #e5ecef}
.story-app-nav i{width:14px;height:14px;border-radius:4px;background:#dce9ee}
.story-app-nav i:first-child{background:#18a8c5;box-shadow:0 0 0 5px #e2f5f8}
.story-app-content{padding:25px 28px}
.story-app-content h3{margin:9px 0 22px;color:#14364e;font:800 1.4rem var(--font-display)}
.story-app-list{display:grid}
.story-app-list>div{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid #e8eef1;color:#718594;font-size:.7rem}
.story-app-list b{color:#234a63;text-align:right}
.story-app-progress{height:6px;margin-top:20px;border-radius:9px;background:#e0eaee;overflow:hidden}
.story-app-progress i{display:block;width:73%;height:100%;border-radius:9px;background:#1bacc8;animation:bar-glow 4s ease-in-out infinite alternate}
.story-app-foot{margin:15px 0 0;color:#728895;font-size:.65rem;line-height:1.5}
.story-float-card{position:absolute;right:-22px;bottom:45px;padding:11px 14px;border:1px solid #dbe5ea;border-radius:9px;background:#fffffff5;box-shadow:0 16px 38px #0d2d401c;color:#426174;font-size:.62rem;font-weight:750;animation:float-in .5s ease both}
.profitflow-ai{display:grid;grid-template-columns:minmax(220px,.58fr) minmax(0,1.42fr);gap:45px;align-items:center}
.ai-intro{max-width:430px}
.ai-product-window{border-radius:15px}
.ai-window-content{display:grid;grid-template-columns:.82fr 1.18fr;min-height:355px}
.ai-questions{display:grid;align-content:start;gap:7px;padding:20px;border-right:1px solid #e6edf1;background:#f9fbfc}
.ai-questions>small{margin-bottom:4px;color:#718795;font-size:.57rem;font-weight:850;letter-spacing:.1em}
.ai-questions button{padding:11px 12px;border:1px solid #e4ebef;border-radius:8px;background:white;color:#526d7f;text-align:left;font:600 .68rem/1.45 var(--font-body);cursor:pointer;transition:background .2s,border-color .2s}
.ai-questions button[aria-pressed=true]{border-color:#afe0ea;background:#f0fafc;color:#086f8f}
.ai-answer-column{padding:19px}
.ai-search{display:flex;align-items:center;gap:9px;padding:11px 12px;border:1px solid #dce7ec;border-radius:8px;background:#fff;color:#81929c;font-size:.69rem}
.ai-search .material-symbols-rounded{color:#1387a7;font-size:1rem}
.ai-search kbd{margin-left:auto;padding:2px 6px;border:1px solid #e2e8eb;border-radius:4px;color:#78909e;font:600 .6rem var(--font-body)}
.ai-answer{margin-top:17px;animation:screen-enter .4s ease both}
.ai-answer-intro{display:flex;align-items:center;gap:8px;color:#183d55;font-size:.8rem;font-weight:800}
.ai-answer-intro .material-symbols-rounded{color:#13a6c4}
.ai-loss-list{display:grid;gap:6px;margin-top:12px}
.ai-loss-list>div{display:flex;justify-content:space-between;padding:9px 11px;border:1px solid #e7edef;border-radius:7px;background:white;color:#4e687a;font-size:.68rem}
.ai-loss-list b{color:#bb5558}
.ai-reason{margin-top:12px;padding:10px 12px;border-radius:7px;background:#f1f7f9;color:#486476;font-size:.66rem}
.ai-reason summary{color:#1d4961;font-weight:800;cursor:pointer}
.ai-reason p{margin:8px 0 0;line-height:1.55}
.ai-disclaimer{display:block;margin-top:11px;color:#8a9aa4;font-size:.58rem;line-height:1.45}
.connected-comparison{background:#f3f7f9}
.compare-switch{display:flex;align-items:center;gap:10px;padding:7px 12px 7px 8px;border:1px solid #dbe6eb;border-radius:99px;background:white;color:#526d7e;font:750 .7rem var(--font-body);cursor:pointer}
.switch-track{position:relative;width:36px;height:20px;border-radius:99px;background:#d6e1e6;transition:background .25s}
.switch-track i{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:white;box-shadow:0 1px 4px #0003;transition:transform .25s}
.compare-switch[aria-checked=true] .switch-track{background:#0a91b3}
.compare-switch[aria-checked=true] .switch-track i{transform:translateX(16px)}
.compare-stage{min-height:220px;padding:28px;border:1px solid #d9e4e9;border-radius:14px;background:white;box-shadow:0 15px 40px #0e2c400c;animation:screen-enter .4s ease both}
.disconnected-tools{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;max-width:820px;margin:3px auto 28px}
.disconnected-tools span{padding:12px 18px;border:1px solid #e2e9ed;border-radius:9px;background:#fafcfd;color:#526b7b;font-size:.77rem;font-weight:750;box-shadow:0 5px 14px #0c32470a}
.disconnected-tools span:nth-child(2n){transform:translateY(5px)}
.disconnected-product-note,.connected-product-note{display:flex;align-items:center;justify-content:center;gap:13px;padding-top:17px;border-top:1px solid #edf1f4}
.disconnected-product-note>.material-symbols-rounded{color:#d09037}
.connected-product-note>.material-symbols-rounded{color:#0b9c83}
.disconnected-product-note strong,.connected-product-note strong,.disconnected-product-note small,.connected-product-note small{display:block}
.disconnected-product-note strong,.connected-product-note strong{color:#25475d;font-size:.76rem}
.disconnected-product-note small,.connected-product-note small{margin-top:4px;color:#738896;font-size:.64rem}
.connected-flow{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:clamp(8px,1.3vw,18px);padding:20px 0 28px}
.connected-flow span,.connected-flow b{padding:12px 14px;border:1px solid #d6e9ee;border-radius:8px;background:#f3fafc;color:#286078;font-size:.74rem;font-weight:750}
.connected-flow b{border-color:#b9e5d7;background:#f1faf6;color:#13775a}
.connected-flow i{color:#1ca3be;font-style:normal}
@keyframes screen-enter{from{opacity:.45;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes float-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes bar-glow{from{filter:saturate(.85)}to{filter:saturate(1.15)}}
@media(max-width:1050px){
 .hero-product-stage{grid-template-columns:1fr;width:min(100% - 36px,950px);gap:15px}
 .hero-product-copy{max-width:650px}
 .hero-product-copy h2{margin:10px 0}
 .hero-product-copy>p{margin:0}
 .alert-scrap{right:-3px}
 .alert-margin{left:-8px}
 .alert-inventory{right:-8px}
 .story-layout{grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:24px}
}
@media(max-width:700px){
 .connected-heading .hero-actions{flex-direction:column;align-items:stretch}
 .connected-heading .hero-actions .button{width:100%}
 .hero-product-stage{width:calc(100% - 28px);padding-top:25px}
 .hero-product-copy h2{font-size:1.8rem}
 .hero-dashboard-content{padding:14px 12px}
 .app-window-bar{padding:0 11px}
 .window-brand{gap:6px;font-size:.63rem}
 .window-brand>span:last-child{display:none}
 .connection-live{font-size:.57rem}
 .hero-kpi-grid{grid-template-columns:repeat(2,1fr)}
 .hero-kpi-grid article{min-height:89px}
 .hero-order-head,.hero-order-row{grid-template-columns:.95fr 1.35fr .8fr .55fr;gap:5px}
 .hero-order-head{font-size:.48rem}
 .hero-order-row{padding:0 4px;font-size:.57rem}
 .hero-order-row>b{font-size:.58rem}
 .hero-production-strip{grid-template-columns:1fr auto}
 .production-bar{grid-column:1/-1;grid-row:2}
 .alert-scrap,.alert-margin,.alert-inventory{position:relative;inset:auto;display:inline-flex;margin:8px 5px 0 0;max-width:100%;animation:none}
 .hero-alert-pill{font-size:.51rem}
 .five-second{margin-top:17px;padding:13px;font-size:.78rem}
 .interactive-section-intro{display:block}
 .experience-example-tag,.module-explorer-caption{display:inline-flex;margin-top:14px}
 .experience-stage-tabs{padding:9px}
 .experience-stage-tabs button{padding:9px 10px;font-size:.68rem}
 .experience-screen{min-height:0;padding:16px}
 .experience-screen-heading{grid-template-columns:auto 1fr}
 .screen-state{grid-column:1/-1;justify-self:start}
 .experience-metrics{grid-template-columns:1fr 1fr;gap:7px;margin-top:15px}
 .experience-metric{min-height:60px;padding:10px}
 .experience-metric strong{font-size:.9rem}
 .experience-screen-footer{align-items:flex-start;flex-direction:column}
 .demo-action{align-self:stretch;justify-content:center}
 .experience-window-footer{display:block;line-height:1.5}
 .experience-window-footer a{display:block;margin-top:5px}
 .module-explorer-layout{grid-template-columns:1fr}
 .module-tab-list{display:flex;overflow-x:auto;padding-bottom:4px}
 .module-tab-list button{flex:0 0 auto}
 .module-tab-list button .material-symbols-rounded{display:none}
 .module-screen-shell{min-height:0;padding:14px}
 .module-screen-heading{align-items:flex-start;flex-direction:column}
 .module-stats{grid-template-columns:1fr 1fr}
 .module-data-head,.module-data-row{grid-template-columns:1fr 1fr}
 .module-data-head span:nth-child(3),.module-data-head span:nth-child(4){display:none}
 .module-data-row span:nth-child(2){font-weight:700}
 .module-data-row span:nth-child(3),.module-data-row span:nth-child(4){color:#78909e;font-size:.59rem}
 .story-heading{margin-bottom:10px}
 .story-layout{grid-template-columns:1fr}
 .story-step{min-height:150px;padding:20px}
 .story-sticky{position:sticky;top:78px;z-index:2;padding:0 0 12px}
 .story-preview{min-height:340px}
 .story-app-body{min-height:270px}
 .story-app-content{padding:18px 15px}
 .story-app-list>div{padding:10px 0;font-size:.63rem}
 .story-float-card{right:8px;bottom:10px}
 .profitflow-ai{grid-template-columns:1fr;gap:20px}
 .ai-window-content{grid-template-columns:1fr}
 .ai-questions{grid-template-columns:1fr 1fr;border-right:0;border-bottom:1px solid #e6edf1;padding:14px}
 .ai-questions>small{grid-column:1/-1}
 .ai-questions button{font-size:.6rem;padding:9px}
 .ai-answer-column{padding:14px}
 .compare-switch{margin-top:14px}
 .compare-stage{padding:18px}
 .connected-flow{gap:7px;padding:5px 0 18px}
 .connected-flow span,.connected-flow b{padding:9px 10px;font-size:.64rem}
 .disconnected-tools{gap:7px}
 .disconnected-tools span{padding:10px 12px;font-size:.68rem}
}
@media(prefers-reduced-motion:reduce){
 .floating-alert,.story-app-progress i,.kpi-progress i{animation:none!important}
 .experience-screen,.story-preview,.ai-answer,.compare-stage{animation:none!important}
 .production-bar i,.experience-progress>i span,.switch-track,.switch-track i{transition:none!important}
}

/* 2026 product-first hero refresh */
@media(min-width:1051px){
 .connected-hero{display:grid;grid-template-columns:minmax(370px,.82fr) minmax(640px,1.45fr);align-items:center;gap:clamp(28px,4vw,64px);min-height:690px;padding:48px clamp(34px,5vw,78px) 58px;background:radial-gradient(circle at 78% 35%,#0b3855 0,#071f38 32%,#030c20 76%)}
 .connected-heading{padding:0;background:none;text-align:left}
 .connected-heading .eyebrow{justify-content:flex-start;margin-bottom:18px;font-size:.66rem}
 .connected-heading h1{max-width:590px;margin:0;font-size:clamp(2.7rem,4.1vw,4.3rem);line-height:1.02}
 .connected-heading h1 br{display:none}
 .connected-lead{max-width:560px;margin:24px 0 0;font-size:1.04rem}
 .connected-heading .hero-actions{justify-content:flex-start;margin-top:27px}
 .connected-benefits{justify-content:flex-start;gap:11px;margin-top:27px}
 .connected-benefits>span{padding:8px 10px;border:1px solid #ffffff14;border-radius:9px;background:#ffffff08;font-size:.7rem}
 .connected-benefits i{font-size:1.08rem}
 .hero-product-stage{display:block;width:auto;margin:0;padding:0}
 .hero-product-copy,.hero-product-stage>.five-second{display:none}
 .hero-dashboard-shell{overflow:visible;border-color:#ffffff2c;box-shadow:0 38px 90px #0008,0 0 0 1px #ffffff0a;transform:perspective(1500px) rotateY(-1.5deg)}
 .hero-dashboard-shell:before{content:"CONTROL DE OPERACIÓN · EN VIVO";position:absolute;top:-27px;left:3px;color:#6fdcf0;font-size:.6rem;font-weight:850;letter-spacing:.14em}
 .floating-alert{backdrop-filter:blur(12px);animation:float-in .8s ease both,hero-card-float 5s ease-in-out 1s infinite alternate}
 .alert-margin{left:-38px}
 .alert-inventory{right:-25px}
}
@keyframes hero-card-float{from{transform:translateY(0)}to{transform:translateY(-7px)}}
@media(max-width:1050px){
 .connected-hero{background:#edf7fc}
 .hero-product-stage{padding-top:30px}
}
@media(prefers-reduced-motion:reduce){.floating-alert{animation:none!important}.hero-dashboard-shell{transform:none!important}}

/* Brand, contrast and light-surface refinement */
.site-header{color:#24465b;background:rgba(255,255,255,.9);border-bottom-color:#dbe8ee;box-shadow:0 8px 28px #0e38500f}
.site-header .brand{color:#12354d}.site-header .brand span{color:#08a9ca}
.site-header>.brand{display:block;flex:0 0 137px;width:137px;height:34px;background:url("./assets/profitflow-wordmark.svg") left center/contain no-repeat;color:transparent!important;font-size:0}
.site-header>.brand span{display:none}
.site-header .desktop-nav a,.site-header>.language-switch{color:#3e5c6e}
.site-header .desktop-nav a:hover{color:#067e9d}
.site-header .menu-button{color:#12354d}
.desktop-nav details>div{background:#fff;border-color:#d8e5eb;box-shadow:0 16px 40px #0c2e421c}
.desktop-nav details>div a{color:#294d62}
.mobile-nav{background:#fff!important;color:#173c52!important}

.window-brand .pf-mark{display:inline-block!important;flex:0 0 94px;width:94px;height:24px;border-radius:0;background:transparent url("./assets/profitflow-wordmark.svg") center/contain no-repeat;box-shadow:none;color:transparent;font-size:0}
.window-brand .pf-mark+b{display:none}
.ai-product-window .window-brand .pf-mark{width:94px}
.ai-product-window .window-brand .pf-mark+b{display:block;color:#087f9f!important;font-size:0;background:none;-webkit-text-fill-color:initial}
.ai-product-window .window-brand .pf-mark+b:after{content:"AI";font:800 .72rem var(--font-display)}
.mini-brand{display:inline-block;width:76px;height:18px;background:url("./assets/profitflow-wordmark.svg") center/contain no-repeat;color:transparent!important;font-size:0!important}
.mini-brand span{display:none}

@media(min-width:1051px){
 .connected-hero{background:radial-gradient(circle at 78% 28%,#ffffff 0,#eef9fc 35%,#dff2f7 100%)}
 .connected-heading{color:#102f47}
 .connected-heading h1{color:#102f47}
 .connected-heading h1 span{color:#08a9ca}
 .connected-heading .eyebrow{color:#087f9f}
 .connected-lead{color:#385b70}
 .connected-heading .button-ghost{border-color:#0b8eae;background:#fff;color:#11394f}
 .connected-benefits{color:#365a6f}
 .connected-benefits>span{border-color:#bdd9e3;background:#ffffffb8;box-shadow:0 5px 18px #153e5310}
 .hero-dashboard-shell{border-color:#c9dce4;box-shadow:0 34px 85px #1c5d7425,0 0 0 1px #ffffff}
 .hero-dashboard-shell:before{color:#087f9f}
}

.scroll-story{background:linear-gradient(145deg,#edf7fa,#f8fcfd);color:#17394f}
.story-heading h2{color:#12354d}.story-heading>p:last-child{color:#496a7d}.story-heading .mfg-kicker{color:#087f9f}
.story-step{border-left-color:#bdd5df;opacity:.82}.story-step.is-active{border-color:#0ba6c6;background:linear-gradient(90deg,#dff4f8,transparent);opacity:1}
.story-step>span{color:#087f9f}.story-step h3{color:#17394f}.story-step p{color:#48697c}
.story-preview{border-color:#c8dce4;box-shadow:0 24px 65px #17485e1f}

.hero-kpi-grid article>small,.hero-order-head,.experience-metric small,.module-stats small,.module-data-head{color:#526f80}
.hero-kpi-grid article>span,.hero-order-row,.experience-screen-heading p,.module-screen-heading p,.module-data-row,.ai-disclaimer{color:#536f80}
.hero-kpi-grid article>small{font-size:.68rem}.hero-kpi-grid article>span{font-size:.62rem}
.hero-order-head{font-size:.6rem}.hero-order-row{font-size:.7rem}
.experience-metric small,.module-stats small{font-size:.66rem}
.floating-alert p small{color:#4f6b7c;font-size:.62rem}.floating-alert p b{color:#1f4258;font-size:.61rem}
.app-window-bar{color:#3f6073}.connection-live{color:#45697c}
.demo-label,.experience-example-tag{color:#48697a;border-color:#cbdde4;background:#fff}

@media(max-width:1050px){
 .connected-heading{background:linear-gradient(145deg,#edf8fb,#dceff5);color:#12354d}
 .connected-heading h1{color:#12354d}.connected-heading h1 span{color:#08a9ca}
 .connected-heading .eyebrow{color:#087f9f}.connected-lead,.connected-benefits{color:#365a6f}
 .connected-heading .button-ghost{border-color:#0b8eae;background:#fff;color:#11394f}
}

/* Full-page visual system: calm light surfaces with contained product contrast */
.platform-section{background:linear-gradient(180deg,#f6fafb,#edf6f8)}
.quote-visual{border-color:#c7dce4;background:#fff;color:#17394f;box-shadow:0 24px 65px #17485e14}
.quote-top,.quote-line{border-color:#e0ebef}
.quote-top span,.quote-line span{color:#557284}
.quote-bottom{background:#f3f9fa;color:#496b7d}
.compare-section{background:linear-gradient(135deg,#e6f4f7,#f4fafb);color:#15384f}
.compare-copy h2{color:#12354d}.compare-copy h2 span{color:#087f9f}
.compare-copy>p:not(.eyebrow){color:#496a7c}
.comparison>div{border-color:#c9dce4;background:#fff;box-shadow:0 14px 38px #17485e12}
.comparison>div span,.comparison>div small{color:#567385}
.comparison>div strong{color:#173b52}
.comparison>div.actual{border-color:#89d9ca;background:#f1fbf7}
.comparison>.material-symbols-rounded{color:#4a7b8d}
.security-section{border-top:1px solid #d9e8ed;background:#f4f9fa;color:#15384f}
.security-mark{border-color:#b9dce6;background:#fff;color:#0795b5;box-shadow:0 14px 38px #17485e12}
.security-copy h2{color:#12354d}
.security-copy>p:last-child,.security-list li{color:#496a7c}
.security-list li{border-color:#c7dde5;background:#fff}
.security-list .material-symbols-rounded{color:#07987f}
footer{border-top:1px solid #cfE2e8;background:#e9f4f7;color:#496a7c}
footer .brand{color:#12354d}footer .brand span{color:#08a9ca}
footer>.brand{display:block;flex:0 0 112px;width:112px;height:28px;background:url("./assets/profitflow-wordmark.svg") left center/contain no-repeat;color:transparent!important;font-size:0}
footer>.brand span{display:none}
footer a{color:#2f5b70}footer a:hover{color:#087f9f}


/* User supplied ProfitFlow wordmark: black + cyan on light brand surfaces. */
.site-header>.brand{flex-basis:152px;width:152px;height:36px;background-image:url("./assets/profitflow-logo-black.png");background-position:left center;background-size:contain}
footer>.brand{flex-basis:140px;width:140px;height:32px;background-image:url("./assets/profitflow-logo-black.png");background-position:left center;background-size:contain}
