/* BizHelper visual product presentation. All interface values are demo data. */
.visual-home .section { padding-block: 82px; }
.visual-home .section-heading { margin-bottom: 34px; }
.visual-home .hero.visual-hero { grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); gap: 42px; min-height: 700px; padding-block: 46px 54px; }
.visual-hero .hero-copy { min-width:0; }
.visual-hero h1 { font-size:clamp(44px,4.65vw,66px); line-height:1.07; letter-spacing:-2.5px; }
.visual-hero .hero-description { max-width:370px; margin-top:27px; font-size:16px; }
.visual-hero .actions { gap:20px; margin-top:28px; }
.visual-hero .hero-note { margin-top:32px; }
.hero-product-view { min-width:0; position:relative; }
.hero-product-view .crm-chart { max-height:170px; }
.hero-product-view .crm-main { padding-top:17px; padding-bottom:14px; }
.hero-product-view .crm-panel { padding:12px; }
.hero-product-view .crm-team,.hero-product-view .crm-alert-list { gap:8px; }
.screen-heading,.hero-screen-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.screen-heading { margin-bottom:15px; color:#b1c2d3; font-size:11px; }
.screen-heading>span { display:flex; align-items:center; gap:11px; }
.screen-expand { border:1px solid #34485a; background:#172735; color:#b9ddff; border-radius:7px; width:34px; height:34px; }
.hero-screen-footer { font-size:10px; color:#a2b6c9; padding-top:17px; }
.screen-switch { display:flex; gap:5px; flex-shrink:0; }
.screen-switch button { color:#9db3c7; border:1px solid #2b3b4b; background:#142230; border-radius:5px; padding:5px 13px; font-size:11px; }
.screen-switch button[aria-pressed=true] { color:#eef8ff; border-color:#4099e0; background:#1b486b; }
.visual-home .principles { margin-top:0; }
.visual-home .approach { gap:60px; }
.approach-art { align-self:center; min-width:0; background:#0d141c; }
.approach-art img { width:100%; height:auto; border-radius:15px; }
.visual-home .approach-copy .section-description { font-size:14px; }
.visual-home .benefit-row { padding-block:16px; }
.products-showcase { background:#111e2b; border-block:1px solid #253543; }
.anchor-point { display:block; position:relative; top:-100px; visibility:hidden; }
.product-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; }
.product-tile { overflow:hidden; border:1px solid #2a3e50; border-radius:16px; background:#0d141c; }
.product-tile-head { padding:18px 26px 15px; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:88px; }
.product-wordmark { width:250px; height:auto; object-fit:contain; mix-blend-mode:lighten; }
.product-tile-head>span { color:#98afc5; font-size:8px; letter-spacing:1.2px; max-width:92px; }
.product-art-link { display:block; overflow:hidden; }
.product-art { width:100%; height:auto; aspect-ratio:3/2; object-fit:contain; transition:transform .45s ease; }
.product-art-link:hover img { transform:scale(1.025); }
.product-tile-copy { padding:27px 30px 28px; }
.product-tile h3 { font-size:28px; font-weight:550; letter-spacing:-.6px; }
.product-tile-copy>p { margin-top:16px; font-size:14px; color:#afbed0; line-height:1.75; }
.product-tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:20px; }
.product-tags span { font-size:10px; color:#b9d0e1; border:1px solid #2d4255; border-radius:4px; padding:4px 9px; }
.product-tile-copy>.text-link { display:flex; border-top:1px solid #2b3c4b; padding-top:18px; margin-top:24px; }
.product-tile-copy>.product-pilot { margin-top:13px; font-size:10px; color:#cfb487; }
.workspace-section { min-width:0; }
.workspace-tabs { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:15px; }
.workspace-tabs button { display:flex; align-items:center; gap:10px; border:1px solid #2c4052; border-radius:7px; padding:11px 16px; background:#132331; color:#a8bed0; font-size:12px; }
.workspace-tabs button span { color:#638ba8; font-size:9px; }
.workspace-tabs button[aria-pressed=true] { background:#247cc4; border-color:#499ddf; color:#fff; }
.workspace-tabs button[aria-pressed=true] span { color:#adddff; }
.workspace-tabs .workspace-expand { margin-left:auto; background:transparent; color:#a9cde8; }
.workspace-stage { padding:15px; border:1px solid #334c63; background:linear-gradient(125deg,#1c3449,#0f202e); border-radius:16px; }
.workspace-insights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; margin-top:30px; }
.workspace-insights>div { display:flex; gap:14px; align-items:center; }
.insight-icon { display:grid; place-items:center; color:#76c2ff; background:#1a354c; border:1px solid #2c4c66; width:42px; height:42px; border-radius:10px; flex-shrink:0; font-size:23px; }
.workspace-insights h3 { font-size:14px; font-weight:550; margin-bottom:6px; }
.workspace-insights p { font-size:11px; color:#9bb2c5; }
.visual-home #how { padding-top:20px; }
.flow-visual-strip { display:flex; gap:10px; align-items:center; margin-top:25px; padding:20px; border-radius:8px; background:#0d1925; border:1px solid #243d52; }
.flow-visual-node { flex:1; text-align:center; color:#829fb5; border:1px solid #2d4356; border-radius:7px; padding:13px 8px; font-size:12px; }
.flow-visual-node.is-current { color:#dff4ff; border-color:#48aef6; background:#1c4363; box-shadow:0 0 25px #2679bb20; }
.flow-visual-node.is-done { background:#15352f; color:#8adebe; border-color:#305a50; }
.flow-visual-strip i { font-style:normal; color:#577992; }
.flow-document-heading { justify-content:space-between; color:#d7e6f0; padding-bottom:18px; margin-bottom:15px; border-bottom:1px solid #385066; font-size:11px; }
.flow-document-heading small { color:#84a0b7; font-size:9px; }
.visual-home .flow-record { background:#192d3e; }
.visual-home .flow-detail { padding-top:25px; }
.benefits-bento { display:grid; grid-template-columns:1.28fr 1fr; gap:25px; }
.mobile-art { margin:0; border-radius:14px; overflow:hidden; border:1px solid #293f52; background:#132333; display:flex; flex-direction:column; }
.mobile-art img { width:100%; height:100%; min-height:300px; object-fit:cover; }
.mobile-art figcaption { color:#c0d7e8; background:#132333; padding:15px 22px; font-size:13px; }
.bento-stack { display:grid; gap:22px; }
.brand-preview,.integration-preview { border:1px solid #2c4053; border-radius:13px; background:#152433; padding:25px; }
.brand-preview h3,.integration-preview h3 { font-size:19px; font-weight:550; margin-top:20px; }
.brand-preview p,.integration-preview p { font-size:12px; line-height:1.7; color:#9db4c7; margin-top:8px; }
.client-brand { font-size:23px; color:#d3edff; display:flex; gap:14px; align-items:center; }
.client-brand>span { display:grid; place-items:center; width:43px; height:43px; border:1px dashed #668fac; border-radius:10px; font-size:29px; color:#75b8e8; }
.brand-palette { display:flex; gap:10px; margin-top:17px; }
.brand-palette i { width:40px; height:10px; border-radius:5px; background:#1f95fb; }
.brand-palette i:nth-child(2) { background:#32c6c3; }
.brand-palette i:nth-child(3) { background:#8972e8; }
.brand-palette i:nth-child(4) { background:#e6ad64; }
.integration-map { display:grid; grid-template-columns:repeat(3,1fr); text-align:center; gap:8px; }
.integration-map span { border:1px solid #375770; border-radius:6px; padding:7px 3px; font-size:10px; color:#acc9de; }
.integration-map b { grid-column:1/-1; color:#55b3f5; font-weight:400; line-height:1; }
.integration-map strong { grid-column:1/-1; justify-self:center; font-size:13px; font-weight:550; color:#d9f0ff; padding:6px 37px; background:#1e4969; border:1px solid #367db0; border-radius:6px; }
.visual-home .process-grid { --process-column-gap:32px; column-gap:var(--process-column-gap); }
.visual-home .process-grid>li:not(:last-child)>span::after { content:'→'; position:absolute; top:50%; right:calc(var(--process-column-gap) / -2); transform:translate(50%,-50%); color:#648ca9; font-size:24px; line-height:1; }
.visual-home .process-grid li>span { position:relative; border:1px solid #3b5e77; border-radius:8px; padding:7px 11px; background:#1c354a; }
.visual-home .process-grid h3 { margin-top:25px; }
.visual-home .faq-section { padding-top:30px; }
@media(min-width:681px) { .hero-product-view .crm-panel-head { margin-bottom:10px; } }
@media(min-width:1100px) { .visual-home .hero.visual-hero .crm-shell { box-shadow:0 24px 85px #050c1260; } }
@media(max-width:1100px) {
 .visual-home .hero.visual-hero { grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:26px; }
 .visual-hero h1 { font-size:50px; }
 .product-tile-head { padding:18px; }
 .product-wordmark { width:220px; }
 .product-tile-head>span { font-size:7px; }
}
@media(max-width:900px) {
 .visual-home .process-grid { --process-column-gap:40px; }
 .visual-home .process-grid>li:nth-child(even)>span::after { display:none; }
 .visual-home .hero.visual-hero { grid-template-columns:1fr; gap:34px; }
 .visual-hero .hero-copy { max-width:680px; }
 .visual-hero h1 { font-size:58px; }
 .visual-hero h1 br:first-of-type { display:none; }
 .visual-hero .hero-description { max-width:510px; }
 .visual-home .hero-note { display:none; }
 .visual-home .approach { gap:30px; }
 .visual-home .section { padding-block:64px; }
 .product-tile-head { flex-direction:column; align-items:flex-start; gap:0; }
 .product-tile-head>span { max-width:none; font-size:8px; margin-left:13px; }
 .product-wordmark { width:240px; }
 .product-tile-copy { padding:24px; }
 .product-tile h3 { font-size:25px; }
 .workspace-insights { gap:15px; }
 .workspace-insights>div { align-items:flex-start; gap:10px; }
 .workspace-insights h3 { line-height:1.3; }
 .insight-icon { width:32px; height:32px; font-size:19px; }
 .benefits-bento { grid-template-columns:1fr 1fr; }
}
@media(max-width:680px) {
 .visual-home .section { padding-block:52px; }
 .visual-home .hero.visual-hero { padding-block:28px 36px; gap:28px; }
 .visual-hero h1 { font-size:45px; letter-spacing:-1.8px; }
 .visual-hero h1 br:first-of-type { display:block; }
 .visual-hero .hero-description { font-size:15px; margin-top:20px; }
 .visual-hero .actions { gap:18px; }
 .visual-hero .actions .button { min-width:170px; }
 .screen-heading { font-size:9px; gap:8px; }
 .hero-screen-footer { font-size:9px; align-items:center; }
 .hero-screen-footer>span { max-width:160px; }
 .hero-product-view .crm-grid.crm-equal,.hero-product-view .crm-grid>.crm-panel:nth-child(2) { display:none; }
 .hero-product-view .crm-chart { max-height:200px; }
 .visual-home .approach { gap:25px; }
 .visual-home .approach-art { order:2; }
 .approach-art img { max-height:320px; object-fit:contain; }
 .product-pair { grid-template-columns:1fr; gap:24px; }
 .product-tile-head { flex-direction:row; align-items:center; padding:14px 19px; }
 .product-wordmark { width:210px; max-width:70%; }
 .product-tile-head>span { max-width:82px; margin:0; font-size:7px; }
 .product-art { height:auto; aspect-ratio:3/2; }
 .product-tile-copy { padding:23px; }
 .product-tile-copy>p { font-size:13px; }
 .product-tile-copy>.product-pilot { font-size:10px; }
 .workspace-tabs { gap:6px; }
 .workspace-tabs button { flex:1 1 calc(33% - 6px); justify-content:center; padding:10px 7px; font-size:10px; gap:6px; }
 .workspace-tabs .workspace-expand { margin:0; }
 .workspace-stage { padding:6px; margin-inline:-5px; border-radius:11px; }
 .workspace-insights { grid-template-columns:1fr; gap:18px; margin-top:24px; }
 .workspace-insights>div { align-items:center; }
 .workspace-insights h3 { font-size:13px; margin-bottom:3px; }
 .workspace-insights p { font-size:11px; }
 .flow-visual-strip { gap:4px; padding:12px 7px; overflow:hidden; }
 .flow-visual-node { font-size:8px; padding:10px 2px; border-radius:5px; min-width:0; }
 .flow-visual-strip i { font-size:10px; }
 .flow-document-heading { font-size:10px; }
 .benefits-bento { grid-template-columns:1fr; }
 .mobile-art img { min-height:0; height:auto; }
 .bento-stack { grid-template-columns:1fr; gap:18px; }
 .mobile-art figcaption { font-size:12px; }
 .visual-home .process-grid { --process-column-gap:23px; }
 .visual-home .process-grid>li:not(:last-child)>span::after { display:none; }
 .visual-home .process-grid h3 { margin-top:0; }
 .visual-home .process-grid li>span { padding:3px 7px; }
}
@media(prefers-reduced-motion:reduce) { .product-art { transition:none; } }
