/* OneCAD 2026 — trang giải pháp (ocd_solution): nền sáng, chữ dễ đọc, từng khối rõ ràng. Giữ nguyên nội dung. */
.oc-sol #content-wrapper{--sol-ink:#1F2D3A;--sol-mute:#4A5A6A;--sol-line:#DCE6F0;--sol-soft:#F4F8FC;overflow:clip;background:#fff;color:var(--sol-ink)}
.oc-sol #content-wrapper a{text-decoration:none}

/* 1. đầu trang: hàng tiêu đề + banner gộp thành một vùng sáng */
.oc-sol .content-title{position:relative;background:linear-gradient(180deg,#F4F8FC,#EDF4FB);padding:22px 0 8px;border-bottom:0}
.oc-sol .content-title::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,97,174,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(0,97,174,.06) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000);mask-image:linear-gradient(90deg,transparent 30%,#000);pointer-events:none}
.oc-sol .content-title .container{position:relative}
.oc-sol .content-title h1.title{margin:6px 0 0!important;max-width:980px;font-size:clamp(30px,3.8vw,50px)!important;line-height:1.1!important;font-weight:800!important;letter-spacing:-.02em;color:#000!important;text-wrap:balance}
.oc-sol #content-wrapper .solution-title{position:relative;background:linear-gradient(180deg,#EDF4FB,#F4F8FC)!important;background-image:none!important;padding:8px 0 44px;border-bottom:1px solid #DCE6F0}
.oc-sol #content-wrapper .solution-title::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--logo-grad);background-size:300% 100%;animation:ocLogoFlow 10s ease-in-out infinite alternate}
.oc-sol #content-wrapper .solution-title .block-header{border:0;padding:0;margin:0;max-width:860px;float:none;text-align:left}
.oc-sol #content-wrapper .solution-title h2.title{margin:0 0 14px;padding:0;border:0;font-size:26px;line-height:1.25;font-weight:800;color:#000;text-align:left}
.oc-sol #content-wrapper .solution-title h2.title::before,.oc-sol #content-wrapper .solution-title h2.title::after{display:none}
.oc-sol #content-wrapper .solution-title h2.title.oc-dup{display:none}
.oc-sol #content-wrapper .solution-title .text{margin:0;max-width:820px;font-size:19px;line-height:1.7;color:#2B3A4A}
.oc-sol #content-wrapper .solution-title hr{display:none}

/* 2. nhịp khối: mỗi khối có khoảng thở đều, nền xen kẽ nhẹ */
.oc-sol .ocd-cpt-layout>.block.ocd-cs{padding:64px 0;margin:0}
.oc-sol .ocd-cpt-layout>.block.ocd-cs:nth-of-type(even){background:var(--sol-soft)}
.oc-sol .ocd-cpt-layout .block.ocd-cs .container{max-width:1200px}
.oc-sol .ocd-cpt-layout .block.ocd-cs>.container>.row>.typography-block>p:first-child,.oc-sol .ocd-cpt-layout .block.ocd-cs>.container>.typography-block>p:first-child{margin-top:0}

/* 3. chữ: cỡ 17–18px, dòng thoáng, độ rộng đọc ~ 75 ký tự */
.oc-sol #content-wrapper .typography-block p,.oc-sol #content-wrapper .typography-block li{font-size:17.5px;line-height:1.8;color:var(--sol-ink);letter-spacing:0}
.oc-sol #content-wrapper .typography-block>p,.oc-sol #content-wrapper .typography-block>ul,.oc-sol #content-wrapper .typography-block>ol,.oc-sol #content-wrapper .typography-block>h3,.oc-sol #content-wrapper .typography-block>h4{max-width:780px}
.oc-sol #content-wrapper .typography-block p strong:only-child{font-weight:600}
.oc-sol #content-wrapper .typography-block>p:first-child>strong:only-child{display:block;font-size:20px;line-height:1.7;font-weight:600;color:#000}
.oc-sol #content-wrapper .typography-block em{color:var(--sol-mute)}
.oc-sol #content-wrapper .typography-block hr,.oc-sol #content-wrapper hr.wp-block-separator{border:0;height:1px;background:linear-gradient(90deg,#C9DAEA,transparent);margin:28px 0;max-width:780px}
.oc-sol #content-wrapper h2.title,.oc-sol #content-wrapper h2.wp-block-heading{position:relative;margin:0 0 18px!important;padding:16px 0 0!important;border:0;font-size:clamp(26px,2.8vw,36px)!important;line-height:1.2!important;font-weight:800!important;letter-spacing:-.015em;color:#000;text-align:left;text-wrap:balance}
.oc-sol #content-wrapper h2.title::before,.oc-sol #content-wrapper h2.wp-block-heading::before{content:"";position:absolute;left:0;top:0;width:44px;height:4px;border-radius:4px;background:var(--logo-grad);background-size:300% 100%}
.oc-sol #content-wrapper .solution-title h2.title{padding:0!important}
.oc-sol #content-wrapper h3.wp-block-heading,.oc-sol #content-wrapper .typography-block h3{margin:30px 0 10px;font-size:22px;line-height:1.3;font-weight:800;color:#000}
.oc-sol #content-wrapper .block-header{float:none;width:100%;max-width:780px;margin:0 0 24px!important;padding:0;text-align:left!important}
.oc-sol #content-wrapper .block-header[class*="col-md-offset"],.oc-sol #content-wrapper .block-header[class*="col-"]{margin-left:0!important}
.oc-sol #content-wrapper .block-header p{max-width:780px}
.oc-sol #content-wrapper a:not(.btn):not(.button):not(.oc-btn){color:var(--blue)}
.oc-sol #content-wrapper .typography-block ul,.oc-sol #content-wrapper .typography-block ol{padding-left:0;list-style:none;margin:0 0 18px}
.oc-sol #content-wrapper .typography-block ul>li{position:relative;padding:0 0 0 30px;margin:0 0 10px}
.oc-sol #content-wrapper .typography-block ul>li::before{content:"";position:absolute;left:0;top:7px;width:18px;height:18px;border-radius:6px;background:#EAF3FB url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%230061AE' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 9.5l3 2.8L13.5 6'/%3E%3C/svg%3E") center/16px no-repeat}
.oc-sol #content-wrapper .typography-block ol{counter-reset:s}
.oc-sol #content-wrapper .typography-block ol>li{position:relative;padding:0 0 0 40px;margin:0 0 12px;counter-increment:s}
.oc-sol #content-wrapper .typography-block ol>li::before{content:counter(s);position:absolute;left:0;top:2px;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:14px;font-weight:800;color:#fff;background:var(--logo-grad);background-size:300% 100%}

/* 4. hình ảnh: bo góc, đổ bóng nhẹ, không phình quá khổ */
.oc-sol #content-wrapper figure.wp-block-image,.oc-sol #content-wrapper .typography-block figure{margin:8px 0 24px}
.oc-sol #content-wrapper .typography-block>figure img,.oc-sol #content-wrapper .typography-block>.wp-block-group>figure img,.oc-sol #content-wrapper .text-image-box img,.oc-sol #content-wrapper .ocd-cs .wp-block-image img{border-radius:18px;box-shadow:0 24px 48px -32px rgba(0,60,120,.45)}
.oc-sol #content-wrapper .ocd-cs .wp-block-image img{max-width:100%;height:auto!important}
.oc-sol #content-wrapper .typography-block>figure,.oc-sol #content-wrapper .typography-block>.wp-block-group>figure{max-width:880px}

/* 5. lưới biểu tượng (.icon-entry): thẻ đều nhau thay cho ảnh 200px + chữ nhỏ */
.oc-sol #content-wrapper .typography-block:has(>.icon-entry),.oc-sol #content-wrapper .row:has(>.icon-entry){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;float:none;width:100%;margin:0}
.oc-sol #content-wrapper .typography-block:has(>.icon-entry)::before,.oc-sol #content-wrapper .typography-block:has(>.icon-entry)::after,.oc-sol #content-wrapper .row:has(>.icon-entry)::before,.oc-sol #content-wrapper .row:has(>.icon-entry)::after{display:none}
.oc-sol #content-wrapper .icon-entry{float:none;width:auto!important;max-width:none;margin:0;padding:26px 22px;border-radius:20px;background:#fff;border:1px solid var(--sol-line);text-align:left;transition:transform .3s,box-shadow .3s,border-color .3s}
.oc-sol #content-wrapper .ocd-cs:nth-of-type(even) .icon-entry{background:#fff}
.oc-sol #content-wrapper .icon-entry:hover{transform:translateY(-5px);border-color:#9CC3E3;box-shadow:0 26px 46px -32px rgba(0,60,120,.55)}
.oc-sol #content-wrapper .icon-entry img{display:block!important;width:64px!important;height:64px!important;max-width:64px;object-fit:contain;margin:0 0 16px!important;border-radius:0;box-shadow:none}
.oc-sol #content-wrapper .icon-entry p:empty{display:none}
.oc-sol #content-wrapper .icon-entry p{margin:0;font-size:15.5px;line-height:1.7;color:#2B3A4A;max-width:none}
.oc-sol #content-wrapper .icon-entry h3,.oc-sol #content-wrapper .icon-entry h4{margin:0 0 8px;font-size:18px;font-weight:800}

/* 6. hàng ảnh – chữ (.text-image-box) và cột đôi */
.oc-sol #content-wrapper .text-image-box{margin:0 0 28px}
.oc-sol #content-wrapper .text-image-box .text-wrapper,.oc-sol #content-wrapper .text-image-box p{font-size:17px;line-height:1.75}
.oc-sol #content-wrapper .row.ocd-half>[class*="col-"]{padding-top:0}

/* 7. hỏi đáp (accordion) */
.oc-sol #content-wrapper .accordeon-entry{margin:0 0 12px;border:1px solid var(--sol-line);border-radius:16px;background:#fff;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.oc-sol #content-wrapper .accordeon-entry:hover{border-color:#9CC3E3}
.oc-sol #content-wrapper .accordeon-entry.active{border-color:var(--blue);box-shadow:0 20px 38px -30px rgba(0,60,120,.55)}
.oc-sol #content-wrapper .accordeon-entry .title{padding:18px 22px;font-size:17px;line-height:1.5;font-weight:700;color:#000;background:transparent;cursor:pointer}
.oc-sol #content-wrapper .accordeon-entry .text{padding:0 22px 20px;font-size:16.5px;line-height:1.75;color:var(--sol-ink);background:transparent}

/* 8. thanh dòng sản phẩm (Forma…) và tab */
.oc-sol #content-wrapper nav.navbar-inverse{background:#fff;border:0;border-bottom:1px solid var(--sol-line);border-radius:0;margin:0;min-height:0}
.oc-sol #content-wrapper nav.navbar-inverse .container{display:flex;flex-wrap:wrap;gap:8px;padding-top:14px;padding-bottom:14px}
.oc-sol #content-wrapper nav.navbar-inverse a,.oc-sol #content-wrapper nav.navbar-inverse li>a{float:none;padding:9px 16px;border-radius:999px;font-size:14.5px;font-weight:700;color:#2B3A4A!important;background:#F1F6FB;border:0;transition:background .2s,color .2s}
.oc-sol #content-wrapper nav.navbar-inverse a:hover{background:#E1EDF8;color:var(--blue)!important}
.oc-sol #content-wrapper nav.navbar-inverse .active>a,.oc-sol #content-wrapper nav.navbar-inverse a.active,.oc-sol #content-wrapper nav.navbar-inverse li.active>a{color:#fff!important;background:var(--logo-grad);background-size:300% 100%}
.oc-sol #content-wrapper nav.navbar-inverse ul,.oc-sol #content-wrapper nav.navbar-inverse li{display:contents;list-style:none;margin:0;padding:0}
.oc-sol #content-wrapper .nav-tabs{border:0;display:flex;flex-wrap:wrap;gap:8px}
.oc-sol #content-wrapper .nav-tabs>li{float:none;margin:0}
.oc-sol #content-wrapper .nav-tabs>li>a{padding:9px 16px;border:0;border-radius:999px;background:#F1F6FB;font-weight:700;color:#2B3A4A}
.oc-sol #content-wrapper .nav-tabs>li.active>a{color:#fff;background:var(--logo-grad);background-size:300% 100%}

/* 9. sản phẩm liên quan: thẻ gọn */
.oc-sol #content-wrapper .product-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0}
.oc-sol #content-wrapper .product-list::before,.oc-sol #content-wrapper .product-list::after{display:none}
.oc-sol #content-wrapper .product-list>[class*="col-"]{float:none;width:auto;padding:0}
.oc-sol #content-wrapper .product-list br{display:none}
.oc-sol #content-wrapper .product-box{height:100%;display:flex;flex-direction:column;padding:0;border:1px solid var(--sol-line);border-radius:20px;overflow:hidden;background:#fff!important;transition:transform .3s,box-shadow .3s,border-color .3s}
.oc-sol #content-wrapper .product-box:hover{transform:translateY(-5px);border-color:#9CC3E3;box-shadow:0 26px 46px -32px rgba(0,60,120,.55)}
.oc-sol #content-wrapper .product-box>img{width:100%;height:120px;object-fit:cover;border-radius:0}
.oc-sol #content-wrapper .product-box-title a{display:flex;align-items:center;gap:12px;padding:16px 18px 6px;color:#000}
.oc-sol #content-wrapper .product-box-title img{width:44px;height:44px;flex:none;border-radius:10px}
.oc-sol #content-wrapper .product-box-title h3{margin:0;font-size:17px;font-weight:800;color:#000}
.oc-sol #content-wrapper .product-box-content{flex:1;padding:0 18px 12px}
.oc-sol #content-wrapper .product-box-content p{margin:0;font-size:14.5px;line-height:1.65;color:var(--sol-mute)}
.oc-sol #content-wrapper .product-box>a.btn{margin:0 18px 18px;width:auto;display:block;padding:11px 14px;border-radius:12px;font-weight:800;text-align:center;color:#fff!important;background:var(--logo-grad);background-size:300% 100%;border:0}
.oc-sol #content-wrapper .ocd-cpt-layout>.block:not(.ocd-cs):not(.solution-title){padding:56px 0 72px;background:var(--sol-soft);border-top:1px solid #E3ECF5}
.oc-sol #content-wrapper .ocd-cpt-layout>.block:not(.ocd-cs):not(.solution-title) .block-header h3.title{margin:0 0 6px;font-size:28px;font-weight:800}
.oc-sol #content-wrapper .ocd-cpt-layout>.block:not(.ocd-cs):not(.solution-title) hr{display:none}
.oc-sol #content-wrapper .ocd-page-views{max-width:1200px;margin:0 auto;padding:0 40px 10px;font-size:13px;color:#8493A3;text-align:left;background:transparent}

/* 10. thanh mục dính + khối kêu gọi (do solution.js dựng) */
.oc-sol-nav{position:sticky;top:var(--oc-hdr-h,72px);z-index:15;background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #E3ECF5;transition:box-shadow .3s}
.oc-sol-nav.is-on{box-shadow:0 12px 24px -20px rgba(0,40,80,.5)}
.oc-sol-nav .oc-wrap{display:flex;align-items:center;gap:6px;min-height:56px}
.oc-sol-nav-l{flex:1;min-width:0;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.oc-sol-nav-l::-webkit-scrollbar{display:none}
.oc-sol-nav a.oc-sol-i{flex:none;padding:9px 14px;border-radius:999px;font-size:14px;font-weight:700;color:#3A4A5A;white-space:nowrap;transition:background .2s,color .2s}
.oc-sol-nav a.oc-sol-i:hover{background:#EEF5FB;color:var(--blue)}
.oc-sol-nav a.oc-sol-i.is-on{color:#fff;background:var(--logo-grad);background-size:300% 100%}
.oc-sol-nav .oc-btn{flex:none;padding:10px 18px}
.oc-sol-cta{padding:0 0 72px;background:#fff}
.oc-sol-cta-in{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;align-items:center;padding:40px;border-radius:26px;color:#fff;background:linear-gradient(125deg,#003E73,#0061AE 42%,#107072 74%,#297A2D);background-size:220% 220%;animation:ocAbBg 16s ease-in-out infinite alternate}
.oc-sol-cta-in::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:36px 36px;-webkit-mask-image:linear-gradient(200deg,#000,transparent 70%);mask-image:linear-gradient(200deg,#000,transparent 70%)}
.oc-sol-cta-in>*{position:relative}
.oc-sol-cta small{display:block;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#D6ECF8}
.oc-sol-cta strong{display:block;margin-top:8px;font-size:clamp(24px,2.6vw,34px);line-height:1.2;font-weight:800}
.oc-sol-cta p{margin:10px 0 0;color:rgba(255,255,255,.9);font-size:16px;line-height:1.6}
.oc-sol-cta-b{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}
.oc-sol #content-wrapper .oc-sol-cta a.oc-sol-w{color:#00477F!important;display:inline-flex;align-items:center;gap:10px;padding:15px 24px;border-radius:12px;background:#fff;color:#00477F;font-weight:800}
.oc-sol #content-wrapper .oc-sol-cta a.oc-sol-o{display:inline-flex;align-items:center;padding:15px 22px;border-radius:12px;border:1.5px solid rgba(255,255,255,.65);color:#fff!important;font-weight:700}
@media (max-width:1100px){
 .oc-sol #content-wrapper .typography-block:has(>.icon-entry),.oc-sol #content-wrapper .row:has(>.icon-entry),.oc-sol #content-wrapper .product-list{grid-template-columns:repeat(2,minmax(0,1fr))}
 .oc-sol-cta-in{grid-template-columns:1fr}.oc-sol-cta-b{justify-content:flex-start}
}
@media (max-width:640px){
 .oc-sol .ocd-cpt-layout>.block.ocd-cs{padding:44px 0}
 .oc-sol #content-wrapper .typography-block p,.oc-sol #content-wrapper .typography-block li{font-size:16.5px}
 .oc-sol #content-wrapper .typography-block:has(>.icon-entry),.oc-sol #content-wrapper .row:has(>.icon-entry),.oc-sol #content-wrapper .product-list{grid-template-columns:1fr}
 .oc-sol #content-wrapper .solution-title .text{font-size:17px}
 .oc-sol-nav .oc-btn{display:none}
 .oc-sol-cta-in{padding:28px 20px;border-radius:20px}
}
@media (prefers-reduced-motion:reduce){.oc-sol *,.oc-sol-cta-in{animation:none!important}}
/* căn lề và nhịp đầu trang */
.oc-sol #content-wrapper .solution-title{padding-top:22px}
.oc-sol #content-wrapper .solution-title .row{margin-left:0;margin-right:0}
.oc-sol #content-wrapper .solution-title .block-header{padding-left:0;padding-right:0}
.oc-sol #content-wrapper .ocd-cs .row{margin-left:0;margin-right:0}
.oc-sol #content-wrapper .ocd-cs .row>[class*="col-"]{padding-left:0;padding-right:0}
.oc-sol #content-wrapper .ocd-cs .row.ocd-half>[class*="col-"]:first-child{padding-right:20px}
.oc-sol #content-wrapper .ocd-cs .row.ocd-half>[class*="col-"]:last-child{padding-left:20px}

.oc-sol #content-wrapper .ocd-cs .row>[class*="col-md-6"]:first-child:not(:only-child){padding-right:28px}
.oc-sol #content-wrapper .ocd-cs .row>[class*="col-md-6"]:last-child:not(:only-child){padding-left:28px}
.oc-sol-cta{padding-top:16px}
.oc-sol-cta .oc-wrap{max-width:1360px}
/* chi tiết thẻ biểu tượng, hỏi đáp, thẻ sản phẩm */
.oc-sol #content-wrapper .icon-entry .content h3.title{margin:0 0 8px;padding:0;font-size:19px;line-height:1.3;font-weight:800}
.oc-sol #content-wrapper .icon-entry .content .text{font-size:15.5px;line-height:1.7;color:#2B3A4A}
.oc-sol #content-wrapper .icon-entry>img{width:100%!important;max-width:100%!important;height:auto!important;max-height:150px;object-fit:cover;border-radius:14px;margin:0 0 16px!important}
.oc-sol #content-wrapper .accordeon-entry .title{display:flex;align-items:center;gap:12px;min-height:60px;margin:0}
.oc-sol #content-wrapper .accordeon-entry .title p{margin:0;padding:0;font-size:17px;line-height:1.5;font-weight:700;color:#000;max-width:none}
.oc-sol #content-wrapper .accordeon-entry .title::after{margin-left:auto}
.oc-sol #content-wrapper .product-box-title h3{height:auto;overflow:visible;text-align:left;line-height:1.3;white-space:normal}
.oc-sol #content-wrapper .product-box-title a{align-items:center}
/* thu gọn khoảng trống: bỏ đệm thừa của kiểu cũ, ảnh nằm cạnh chữ thay vì dưới chữ */
.oc-sol .ocd-cpt-layout>.block.ocd-cs{padding:44px 0}
.oc-sol #content-wrapper .typography-block{padding:0!important;margin:0}
.oc-sol #content-wrapper .typography-block hr,.oc-sol #content-wrapper hr.wp-block-separator{margin:18px 0!important}
.oc-sol #content-wrapper .typography-block>hr:last-child,.oc-sol #content-wrapper .typography-block>hr:first-child{display:none}
.oc-sol #content-wrapper .ocd-cs figure.wp-block-image,.oc-sol #content-wrapper .typography-block figure{margin:0!important}
.oc-sol #content-wrapper .ocd-cs figure img{margin:0!important;display:block}
.oc-sol #content-wrapper .ocd-cs .row,.oc-sol #content-wrapper .ocd-cs .container{margin-bottom:0}
.oc-sol #content-wrapper .ocd-cs .typography-block>*:last-child{margin-bottom:0}
.oc-sol #content-wrapper .ocd-cs h2.title,.oc-sol #content-wrapper .ocd-cs h2.wp-block-heading{margin-bottom:14px!important}
.oc-sol #content-wrapper .block-header{margin-bottom:22px!important}
@media (min-width:1260px){
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);column-gap:48px;align-items:start}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>*{grid-column:1;max-width:none}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>.wp-block-group:has(>figure){grid-column:2;grid-row:1/span 4}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>.wp-block-group>figure img{width:100%;height:auto;border-radius:20px}
}
.oc-sol .content-title{background:#F1F6FB}
.oc-sol #content-wrapper .solution-title{background:#F1F6FB!important}
/* biểu tượng PNG: nhỏ, vừa khung; ảnh minh hoạ jpg: nằm gọn trong thẻ */
.oc-sol #content-wrapper .icon-entry>img[src$=".png"]{width:60px!important;height:60px!important;max-width:60px!important;max-height:60px;object-fit:contain;border-radius:0;margin:0 0 16px!important}
.oc-sol #content-wrapper .icon-entry>img:not([src$=".png"]){object-fit:contain;background:#F4F8FC;max-height:170px;padding:8px}
/* hàng ảnh – chữ: có khoảng cách giữa hai cột, chữ canh giữa theo chiều dọc */
@media (min-width:768px){
 .oc-sol #content-wrapper .row.text-image-box:has(>[class*="col-"]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 48px;align-items:center;margin:0 0 36px}
 .oc-sol #content-wrapper .row.text-image-box:has(>[class*="col-"])>[class*="col-"]{float:none;width:auto;padding:0}
 .oc-sol #content-wrapper .row.text-image-box:has(>[class*="col-"])::before,.oc-sol #content-wrapper .row.text-image-box:has(>[class*="col-"])::after{display:none}
 .oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);column-gap:48px;align-items:start}
 .oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure)>*{grid-column:1;max-width:none}
 .oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure)>.wp-block-group:has(>figure){grid-column:2;grid-row:1/span 5}
}
.oc-sol #content-wrapper .text-image-box figure img{width:100%!important;height:auto!important}
.oc-sol #content-wrapper .text-image-box p{margin:0 0 14px}
/* bỏ chiều cao cố định và bố cục bảng của kiểu cũ (làm chữ nằm giữa khoảng trống) */
.oc-sol #content-wrapper .cell-view{display:block!important;height:auto!important;min-height:0!important;vertical-align:top}
.oc-sol #content-wrapper .text-image-box [class*="col-"],.oc-sol #content-wrapper .text-image-box .image-wrapper,.oc-sol #content-wrapper .text-image-box .text-wrapper{height:auto!important;min-height:0!important}
.oc-sol #content-wrapper .text-image-box .image-wrapper img,.oc-sol #content-wrapper .text-image-box figure img{border-radius:18px;max-width:100%;height:auto!important}
.oc-sol #content-wrapper .block[style*="height"],.oc-sol #content-wrapper .ocd-cs[style*="height"]{height:auto!important;min-height:0!important}
/* khối chữ của kiểu cũ có bề rộng cố định → ép về đúng cột */
.oc-sol #content-wrapper .cell-view,.oc-sol #content-wrapper .cell-view>*,.oc-sol #content-wrapper .text-image-box .text,.oc-sol #content-wrapper .text-image-box .text-wrapper{width:auto!important;max-width:100%!important;min-width:0!important}
.oc-sol #content-wrapper .text-image-box .cell-view{padding:0!important;margin:0!important}
.oc-sol #content-wrapper .text-image-box .cell-view h3.title{margin:0 0 12px;padding:0;font-size:24px;line-height:1.3;font-weight:800;color:#000}
.oc-sol #content-wrapper .text-image-box .image-wrapper,.oc-sol #content-wrapper .text-image-box .image-wrapper figure{margin:0!important;width:100%!important}
.oc-sol #content-wrapper .text-image-box a.fancybox{display:block;width:100%!important}

/* ảnh/infographic cạnh chữ: cột hẹp hơn và dính theo khi cuộn, tránh khoảng trống bên dưới chữ */
@media (min-width:1260px){
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure),.oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure){grid-template-columns:minmax(0,1fr) minmax(0,440px)}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>.wp-block-group:has(>figure),.oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure)>.wp-block-group:has(>figure){position:static}
}
/* khối nền tối của kiểu cũ (có chữ trắng đặt sẵn): dùng nền xanh thương hiệu thay vì ảnh đen */
.oc-sol #content-wrapper .ocd-cpt-layout>.block.typography-block[class*="ocd-content-"],.oc-sol #content-wrapper .block.type-5{position:relative;background:linear-gradient(125deg,#00477F,#0061AE 50%,#107072)!important;background-image:linear-gradient(125deg,#00477F,#0061AE 50%,#107072)!important;color:#fff;padding:56px 0!important}
.oc-sol #content-wrapper .ocd-cpt-layout>.block.typography-block[class*="ocd-content-"]::before,.oc-sol #content-wrapper .block.type-5::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:40px 40px;-webkit-mask-image:linear-gradient(200deg,#000,transparent 70%);mask-image:linear-gradient(200deg,#000,transparent 70%);pointer-events:none}
.oc-sol #content-wrapper .ocd-cpt-layout>.block.typography-block[class*="ocd-content-"]>*,.oc-sol #content-wrapper .block.type-5>*{position:relative}
.oc-sol #content-wrapper .ocd-cpt-layout>.block.typography-block[class*="ocd-content-"] :is(h2,h3,h4,p,li,span,em,strong),.oc-sol #content-wrapper .block.type-5 :is(h2,h3,h4,p,li,em){color:#fff}
.oc-sol #content-wrapper .ocd-cpt-layout>.block.typography-block[class*="ocd-content-"] a:not(.btn):not(.button),.oc-sol #content-wrapper .block.type-5 a:not(.btn):not(.button){color:#BDE4FF}
.oc-sol #content-wrapper .ocd-cpt-layout>.block.typography-block[class*="ocd-content-"] h2::before,.oc-sol #content-wrapper .block.type-5 h2::before{background:#fff}
.oc-sol #content-wrapper .ocd-cpt-layout>.block.typography-block[class*="ocd-content-"] p,.oc-sol #content-wrapper .block.type-5 p{max-width:none}
/* thẻ số liệu trong khối xanh */
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row:has(>[class*="col-"] .product-box){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0 0}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row:has(>[class*="col-"] .product-box)>[class*="col-"]{float:none;width:auto;padding:0}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box{height:100%;padding:26px 22px;background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.28);border-radius:20px;backdrop-filter:blur(8px);color:#fff;text-align:center}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box h4{margin:0 0 14px;font-size:19px;line-height:1.3;font-weight:800;color:#fff}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box p{margin:0 0 8px;font-size:16px;line-height:1.6}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box figure{margin:6px auto}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box figure img{width:70px!important;height:auto!important;max-height:140px;object-fit:contain;filter:none;box-shadow:none;border-radius:0}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box>.col-sm-6{float:none;width:auto;padding:0}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row:has(>[class*="col-"]>h2){display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 8px}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row:has(>[class*="col-"]>h2)>[class*="col-"]{float:none;width:auto}
@media (max-width:760px){.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row:has(>[class*="col-"] .product-box){grid-template-columns:1fr}}
/* hàng lưới trong khối xanh: ép đủ bề rộng (kiểu cũ làm co về 0) */
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row,.oc-sol #content-wrapper .block.type-5 .row{width:100%!important;max-width:none!important;margin-left:0;margin-right:0}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row:not(:has(.product-box)):not(:has(>[class*="col-"]>h2)):not(.text-image-box){display:block}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .row:has(.product-box)>*{width:auto!important;max-width:none!important;min-width:0!important;margin:0!important;padding:0!important;float:none!important;position:static!important;left:auto!important;right:auto!important}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box{width:100%!important;max-width:none!important;margin:0!important;float:none!important;min-width:0}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box>*{float:none!important;width:auto!important;max-width:100%}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] .product-box h4{writing-mode:horizontal-tb!important;word-break:normal;overflow-wrap:normal}
.oc-sol #content-wrapper .block.typography-block[class*="ocd-content-"] [class*="col-"]:has(>h2){width:100%!important;margin:0!important;padding:0 0 10px!important;float:none!important}

.oc-sol #content-wrapper .row:has(.product-box)::before,.oc-sol #content-wrapper .row:has(.product-box)::after{display:none!important}
.oc-sol #content-wrapper .product-box.typography-block{display:flex;flex-direction:column;align-items:stretch}
/* tab dọc «Khả năng vượt trội»: danh sách nhãn bên trái, nội dung bên phải, cân đối hai cột */
@media (min-width:901px){
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left{display:grid;grid-template-columns:300px minmax(0,1fr);gap:28px;align-items:start;padding:0}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-switch-box{grid-column:1;grid-row:1;margin:0;text-align:left;font-size:inherit;position:sticky;top:130px}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container{grid-column:2;grid-row:1;margin:0}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-desktop{display:flex;flex-direction:column;gap:8px}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-desktop>div{display:block;width:100%;padding:15px 18px;margin:0;border:0;border-radius:14px;background:#F1F6FB;color:#2B3A4A;font-size:16px;line-height:1.4;font-weight:700;text-align:left;cursor:pointer;transition:background .2s,color .2s,transform .2s}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-desktop>div p{margin:0;padding:0;color:inherit;font-size:inherit;line-height:inherit;font-weight:inherit;max-width:none}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-desktop>div:hover{background:#E1EDF8;color:var(--blue);transform:translateX(4px)}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-desktop>div.active{background:var(--logo-grad);background-size:300% 100%;color:#fff;box-shadow:0 16px 28px -18px rgba(16,112,114,.8)}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-desktop>div.active p{color:#fff}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container{padding:28px;border:1px solid var(--sol-line);border-radius:22px;background:#fff;min-height:300px}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container>.row{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:32px;align-items:center;margin:0}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container>.row::before,.oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container>.row::after{display:none}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container>.row>*{float:none;width:auto;max-width:none;margin:0;padding:0}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container figure{margin:0!important}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container figure img{width:100%!important;height:auto!important;border-radius:16px;box-shadow:0 22px 40px -28px rgba(0,60,120,.5)}
 .oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container .row p,.oc-sol #content-wrapper .tabs-wrapper.tabs-left>.tabs-container .row p span{font-size:18px!important;line-height:1.75;color:var(--sol-ink);max-width:none}
}
@media (max-width:900px){
 .oc-sol #content-wrapper .tabs-wrapper .tabs-switch-box{margin-bottom:18px;text-align:left}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-switch-box select{width:100%;padding:13px 14px;border:1px solid var(--sol-line);border-radius:12px;font:inherit;font-weight:700;background:#fff}
 .oc-sol #content-wrapper .tabs-wrapper>.tabs-container{padding:18px;border:1px solid var(--sol-line);border-radius:18px}
 .oc-sol #content-wrapper .tabs-wrapper>.tabs-container figure img{width:100%!important;height:auto!important}
}
/* ảnh cạnh chữ: dùng float (chữ ôm ảnh, không bị kéo dãn khoảng trống khi ảnh rất dài) */
@media (min-width:1260px){
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure),.oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure){display:flow-root!important}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>.wp-block-group:has(>figure),.oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure)>.wp-block-group:has(>figure){float:right;width:440px;max-height:640px;overflow:auto;margin:4px 0 24px 48px!important;border-radius:20px;grid-column:auto;grid-row:auto;position:static}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>:not(.wp-block-group:has(>figure)),.oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure)>:not(.wp-block-group:has(>figure)){max-width:780px}
}
@media (max-width:1259px){
 .oc-sol #content-wrapper .typography-block>.wp-block-group:has(>figure),.oc-sol #content-wrapper .row.text-image-box>.wp-block-group:has(>figure){max-width:100%;max-height:none;margin:12px 0 20px}
}
@media (min-width:1260px){
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>.wp-block-group:has(>figure),.oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure)>.wp-block-group:has(>figure){position:sticky;top:130px}
}
@media (max-width:1259px){
 .oc-sol #content-wrapper .typography-block>.wp-block-group:has(>figure),.oc-sol #content-wrapper .row.text-image-box>.wp-block-group:has(>figure){float:none;position:static;width:auto;max-width:560px;max-height:none;margin:8px 0 22px!important}
}
/* khối vừa là .container vừa là .typography-block: giữ lề hai bên */
.oc-sol #content-wrapper .container.typography-block{padding-left:40px!important;padding-right:40px!important;max-width:1360px;margin-left:auto!important;margin-right:auto!important}
@media (max-width:640px){.oc-sol #content-wrapper .container.typography-block{padding-left:20px!important;padding-right:20px!important}}
/* dưới 1260px: ảnh nằm trên/dưới chữ, không chia lưới (iPad dọc, điện thoại) */
@media (max-width:1259px){
 .oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure){display:block!important}
 .oc-sol #content-wrapper .row.text-image-box:not(:has(>[class*="col-"])):has(>.wp-block-group>figure)>*{grid-column:auto!important;grid-row:auto!important;max-width:100%!important}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure){display:block!important}
 .oc-sol #content-wrapper .typography-block:not(.product-box):not(.block):not(.container):has(>.wp-block-group>figure)>*{grid-column:auto!important;grid-row:auto!important;max-width:100%}
 .oc-sol #content-wrapper .ocd-cs .typography-block>p,.oc-sol #content-wrapper .ocd-cs .typography-block>ul,.oc-sol #content-wrapper .ocd-cs .typography-block>ol{max-width:none}
}
@media (max-width:767px){
 .oc-sol #content-wrapper .row.text-image-box,.oc-sol #content-wrapper .row.ocd-half{display:block!important}
 .oc-sol #content-wrapper .row.text-image-box>[class*="col-"],.oc-sol #content-wrapper .row.ocd-half>[class*="col-"]{float:none;width:100%!important;padding:0!important;margin:0 0 18px!important}
}
/* tab dọc trên iPad dọc và điện thoại: dùng ô chọn, bỏ khối nhãn nền tối của kiểu cũ */
@media (max-width:900px){
 .oc-sol #content-wrapper .tabs-wrapper .tabs-desktop,.oc-sol #content-wrapper .tabs-wrapper .tabs-select-text{display:none!important}
 .oc-sol #content-wrapper .tabs-wrapper .tabs-switch-box select{display:block!important;width:100%;padding:14px 16px;border:1.5px solid var(--blue);border-radius:14px;font:inherit;font-size:16px;font-weight:700;color:#000;background:#fff}
 .oc-sol #content-wrapper .tabs-wrapper>.tabs-container .row{display:block}
 .oc-sol #content-wrapper .tabs-wrapper>.tabs-container .row>*{float:none;width:auto;margin:0 0 14px}
}
/* thẻ câu chuyện khách hàng trong bài giải pháp */
.oc-sol #content-wrapper .oc-sol-story{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:6px 36px;align-items:start;margin:0 0 22px;padding:26px;border:1px solid var(--sol-line);border-radius:22px;background:#fff;transition:box-shadow .3s,border-color .3s}
.oc-sol #content-wrapper .oc-sol-story:hover{border-color:#9CC3E3;box-shadow:0 28px 50px -34px rgba(0,60,120,.55)}
.oc-sol #content-wrapper .oc-sol-story>figure{grid-column:1;grid-row:1/span 4;margin:0!important}
.oc-sol #content-wrapper .oc-sol-story>figure img{width:100%!important;height:auto!important;border-radius:16px;box-shadow:none}
.oc-sol #content-wrapper .oc-sol-story>:not(figure){grid-column:2;max-width:none!important}
.oc-sol #content-wrapper .oc-sol-story h3{margin:0 0 4px!important;font-size:21px!important;line-height:1.3!important;font-weight:800!important}
.oc-sol #content-wrapper .oc-sol-story p a{font-weight:800;color:var(--blue)}
@media (max-width:900px){.oc-sol #content-wrapper .oc-sol-story{grid-template-columns:1fr;padding:18px}.oc-sol #content-wrapper .oc-sol-story>figure,.oc-sol #content-wrapper .oc-sol-story>:not(figure){grid-column:1;grid-row:auto}}
/* chức năng và hệ sinh thái cloud (bài ACC) */
.oc-sol #content-wrapper .oc-sol-fns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:8px}
.oc-sol #content-wrapper .oc-sol-fn{position:relative;padding:24px 24px 18px;border:1px solid var(--sol-line);border-radius:20px;background:#fff;transition:transform .3s,box-shadow .3s,border-color .3s}
.oc-sol #content-wrapper .oc-sol-fn::before{content:"";position:absolute;left:24px;right:24px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--logo-grad);background-size:300% 100%}
.oc-sol #content-wrapper .oc-sol-fn:hover{transform:translateY(-4px);border-color:#9CC3E3;box-shadow:0 26px 46px -32px rgba(0,60,120,.55)}
.oc-sol #content-wrapper .oc-sol-fn h3{margin:6px 0 8px!important;font-size:20px!important;line-height:1.3!important;font-weight:800!important}
.oc-sol #content-wrapper .oc-sol-fn p{font-size:16px!important;line-height:1.65;max-width:none!important}
.oc-sol #content-wrapper .oc-sol-fn ul{margin:10px 0 4px!important}
.oc-sol #content-wrapper .oc-sol-fn li{font-size:15.5px!important;line-height:1.6;margin:0 0 8px!important}
.oc-sol #content-wrapper .oc-sol-eco{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:20px 0 26px;counter-reset:eco}
.oc-sol #content-wrapper .oc-sol-eco-c{position:relative;padding:20px 16px 16px;border:1px solid var(--sol-line);border-radius:18px;background:#fff;transition:transform .3s,box-shadow .3s}
.oc-sol #content-wrapper .oc-sol-eco-c:hover{transform:translateY(-4px);box-shadow:0 22px 40px -30px rgba(0,60,120,.55)}
.oc-sol #content-wrapper .oc-sol-eco-c:not(:last-child)::after{content:"";position:absolute;right:-13px;top:34px;width:13px;height:2px;background:var(--logo-grad)}
.oc-sol-eco-n{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;font-weight:800;color:#fff;background:var(--logo-grad);background-size:300% 100%;animation:ocLogoFlow 8s ease-in-out infinite alternate}
.oc-sol #content-wrapper .oc-sol-eco-c h3{margin:12px 0 6px!important;font-size:17px!important;line-height:1.3!important;font-weight:800!important}
.oc-sol #content-wrapper .oc-sol-eco-c p{font-size:14.5px!important;line-height:1.6;max-width:none!important}
@media (max-width:1100px){.oc-sol #content-wrapper .oc-sol-eco{grid-template-columns:repeat(2,minmax(0,1fr))}.oc-sol #content-wrapper .oc-sol-eco-c::after{display:none}}
@media (max-width:760px){.oc-sol #content-wrapper .oc-sol-fns,.oc-sol #content-wrapper .oc-sol-eco{grid-template-columns:1fr}}