/* ONIC - CSS trang chủ mới. Dán vào: Giao diện > Tùy biến > CSS bổ sung (hoặc Flatsome > Advanced > Custom CSS).
   Mọi lớp đều bắt đầu bằng .ovn- nên không đụng vào phần còn lại của website. */
.ovn{--blue:#1976D2;--blue-d:#1565C0;--orange:#F1821F;--green:#4CAF50;--navy:#0F172A;--navy2:#1B2742;--ink:#1e293b;--body:#475569;--mute:#64748b;--line:#e2e8f0;--bg:#f8fafc;--light:#C9D5E8;font-family:inherit;color:var(--ink);line-height:1.6}
.ovn *{box-sizing:border-box}
/* Phần dùng bộ oa-* (trong .onic-article) giữ nguyên kiểu của bộ đó, không bị reset */
.ovn :is(h1,h2,h3,p,ul,ol):not(.onic-article *){margin:0;padding:0}
.ovn :is(h1,h2,h3):not(.onic-article *){font-weight:800;letter-spacing:-.01em;color:inherit}
.ovn a:not(.onic-article *){text-decoration:none}
.ovn img:not(.onic-article *){max-width:100%;height:auto}
.ovn-in .onic-article{width:100%;max-width:100%}
.ovn a.ovn-card{color:inherit}
.ovn a.ovn-card:hover{border-color:var(--blue)}
.ovn a.ovn-linkb{color:var(--blue);font-weight:700}
.ovn-sec{width:100%}
.ovn-in{max-width:1180px;margin:0 auto;padding:80px 24px;display:flex;flex-direction:column;gap:36px}
.ovn-in--row{flex-direction:row;flex-wrap:wrap;align-items:center;gap:44px}
.ovn-bg-navy{background:var(--navy);color:#fff}
.ovn-bg-soft{background:var(--bg)}
.ovn-bg-white{background:#fff}
.ovn-kick{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.ovn-bg-navy .ovn-kick{color:#64B5F6}
.ovn-h2{font-size:clamp(26px,3.4vw,38px);line-height:1.18}
.ovn-lead{font-size:17px;line-height:1.65;color:var(--body)}
.ovn-bg-navy .ovn-lead{color:var(--light)}
.ovn-head{max-width:780px;display:flex;flex-direction:column;gap:14px}
.ovn-btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-size:15px;line-height:1.2;padding:15px 30px;border-radius:999px;text-transform:uppercase;letter-spacing:.02em;border:2px solid transparent;transition:transform .15s,background .15s}
.ovn-btn:hover{transform:translateY(-1px)}
.ovn-btn--orange{background:var(--orange);color:#fff!important;box-shadow:0 6px 16px rgba(241,130,31,.35)}
.ovn-btn--orange:hover{background:#e0720f}
.ovn-btn--ghost{border-color:#3A4E70;color:#fff!important}
.ovn-btn--line{border-color:var(--ink);color:var(--ink)!important}
.ovn-btn--green{background:var(--green);color:#fff!important;box-shadow:0 6px 16px rgba(76,175,80,.3)}
.ovn-btn--green:hover{background:#43a047}
.ovn-btn--blue{background:var(--blue);color:#fff!important}
.ovn-btn--block{display:flex;width:100%}
.ovn-btns{display:flex;flex-wrap:wrap;gap:12px}
/* hero */
.ovn-hero{display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.ovn-hero-text{flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:22px}
.ovn-h1{font-size:clamp(30px,4.4vw,48px);line-height:1.15;color:var(--ink)}
.ovn-hero-note{font-size:13px;line-height:1.6;color:#8FA2C0}
.ovn-proof{flex:1 1 400px;min-width:0;max-width:500px;margin:0 auto;background:#fff;color:var(--ink);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:14px;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.ovn-proof-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;align-items:baseline}
.ovn-proof h2{font-size:20px}
.ovn-proof small{font-size:12px;color:var(--mute)}
.ovn-proof p{font-size:14px;line-height:1.55;color:var(--body)}
.ovn-rank{display:flex;align-items:center;gap:12px;background:var(--bg);border-radius:10px;padding:11px 14px}
.ovn-rank b{background:var(--green);color:#0F172A;font-weight:800;font-size:14px;border-radius:8px;padding:5px 10px;min-width:64px;text-align:center}
.ovn-rank span{flex:1;font-size:15px;font-weight:600}
.ovn-rank em{font-style:normal;font-size:13px;color:var(--mute)}
.ovn-proof a.ovn-link{font-size:14px;font-weight:700;color:var(--blue)}
/* số liệu */
.ovn-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
@media (max-width:900px){.ovn-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ovn-stat{display:flex;flex-direction:column;gap:6px}
.ovn-stat b{font-size:42px;line-height:1.05;letter-spacing:-.02em;color:var(--ink)}
.ovn-stat span{font-size:14px;line-height:1.5;color:var(--body)}
.ovn-in--stats{padding-top:40px;padding-bottom:40px}
/* thẻ */
.ovn-cards{display:flex;flex-wrap:wrap;gap:20px}
.ovn-card{flex:1 1 300px;min-width:0;background:var(--bg);border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:12px}
.ovn-card--white{background:#fff;border:1px solid var(--line)}
.ovn-card h3{font-size:19px;line-height:1.3}
.ovn-card p{font-size:15px;line-height:1.65;color:var(--body)}
.ovn-card .ovn-no{font-size:15px;font-weight:800;color:var(--blue)}
.ovn-card--dark{background:var(--navy);color:#fff}
.ovn-card--dark p{color:var(--light)}
.ovn-card--dashed{background:transparent;border:2px dashed #B7C3D6}
.ovn-tiles{display:flex;flex-wrap:wrap;gap:20px}
.ovn-tile{flex:1 1 240px;border-top:3px solid var(--blue);padding-top:18px;display:flex;flex-direction:column;gap:8px}
.ovn-tile h3{font-size:18px}
.ovn-tile p{font-size:15px;line-height:1.6;color:var(--body)}
/* vòng tăng trưởng */
.ovn-loop{display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.ovn-ringwrap{flex:1 1 380px;min-width:0;display:flex;justify-content:center}
.ovn-ring{position:relative;width:min(460px,100%);aspect-ratio:1/1}
.ovn-ring-line{position:absolute;left:15%;top:15%;width:70%;height:70%;border-radius:50%;border:2px dashed #3A4E70}
.ovn-core{position:absolute;left:50%;top:50%;width:34%;aspect-ratio:1/1;transform:translate(-50%,-50%);border-radius:50%;background:var(--blue);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:6px}
.ovn-core b{font-size:clamp(12px,2.6vw,17px);line-height:1.15}
.ovn-core span{font-size:clamp(9px,1.9vw,12px);line-height:1.25;margin-top:3px}
.ovn-step{position:absolute;width:19%;aspect-ratio:1/1;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #64B5F6;background:var(--navy2);color:#fff;font-weight:700;font-size:clamp(8px,1.8vw,12px);line-height:1.15;padding:2px;cursor:pointer;font-family:inherit}
.ovn-step.is-on{background:var(--orange);border-color:var(--orange);color:#fff}
.ovn-step.ovn-st1{left:50%;top:13%}
.ovn-step.ovn-st2{left:82%;top:31.5%}
.ovn-step.ovn-st3{left:82%;top:68.5%}
.ovn-step.ovn-st4{left:50%;top:87%}
.ovn-step.ovn-st5{left:18%;top:68.5%}
.ovn-step.ovn-st6{left:18%;top:31.5%}
.ovn-looptext{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:18px}
.ovn-stepbox{background:var(--navy2);border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:10px;min-height:190px}
.ovn-stepbox small{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#64B5F6}
.ovn-stepbox h3{font-size:26px;line-height:1.2;color:#fff}
.ovn-stepbox p{font-size:16px;line-height:1.65;color:var(--light)}
.ovn-looptext>p{font-size:14px;color:#8FA2C0}
/* vai trò */
.ovn-tabs{display:flex;flex-wrap:wrap;gap:10px}
.ovn-tab{padding:12px 22px;border-radius:999px;font-size:15px;font-weight:600;cursor:pointer;border:1.5px solid #B7C3D6;background:#fff;color:var(--ink);font-family:inherit}
.ovn-tab.is-on{background:var(--blue);border-color:var(--blue);color:#fff}
.ovn-panel{display:flex;flex-wrap:wrap;gap:32px;background:var(--bg);border-radius:18px;padding:36px}
.ovn-panel[hidden]{display:none}
.ovn-panel-main{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:14px}
.ovn-panel-main h3{font-size:25px;line-height:1.2}
.ovn-panel-main p{font-size:16px;line-height:1.65;color:var(--body)}
.ovn-panel-side{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:12px;justify-content:center}
.ovn-panel-side small{font-size:14px;color:var(--mute)}
.ovn-panel-side b{font-size:28px;line-height:1.2}
.ovn-panel-side p{font-size:15px;color:var(--body)}
.ovn-panel-side .ovn-btn{align-self:flex-start;padding:13px 24px;font-size:15px}
/* module */
.ovn-feat{display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.ovn-feat--rev{flex-direction:row-reverse}
.ovn-feat-text{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;gap:14px}
.ovn-feat-text small{font-size:13px;font-weight:700;color:var(--blue);letter-spacing:.06em}
.ovn-feat-text h3{font-size:27px;line-height:1.2}
.ovn-feat-text p{font-size:16px;line-height:1.65;color:var(--body)}
.ovn-feat-text ul{padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:1.55;color:var(--body)}
.ovn-feat-img{flex:1 1 400px;min-width:0}
.ovn-feat-img img{width:100%;border-radius:16px;border:1px solid var(--line);box-shadow:0 10px 30px rgba(15,23,42,.08)}
/* bảng */
.ovn-tablewrap{overflow-x:auto}
.ovn-table{width:100%;min-width:640px;border-collapse:collapse;background:#fff;border:1px solid var(--line)}
.ovn-table th{background:var(--navy);color:#fff;text-align:left;padding:16px 20px;font-size:14px;font-weight:600}
.ovn-table th.is-onic{background:var(--blue)}
.ovn-table td{padding:16px 20px;font-size:15px;border-top:1px solid var(--line);color:var(--body)}
.ovn-table td:first-child{font-weight:700;color:var(--ink)}
.ovn-table td.is-onic{font-weight:700;color:var(--blue-d)}
.ovn-note{font-size:13px;line-height:1.6;color:var(--mute)}
/* ảnh bằng chứng */
.ovn-shots{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}
.ovn-shots figure{flex:1 1 360px;min-width:0;margin:0;display:flex;flex-direction:column;gap:8px}
.ovn-shots img{width:100%;border-radius:12px;border:1px solid var(--line)}
.ovn-shots figcaption{font-size:13px;color:var(--mute)}
.ovn-gallerybox{max-width:900px;margin:0 auto 24px;width:100%;text-align:center}
/* các bước */
.ovn-steps{list-style:none;display:flex;flex-direction:column;gap:14px}
.ovn-steps li{display:flex;gap:16px;align-items:flex-start;font-size:16px;line-height:1.55;color:var(--body)}
.ovn-steps li>span{flex:0 0 36px;height:36px;border-radius:50%;background:var(--blue);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center}
.ovn-steps li.is-last>span{background:var(--green);color:#0F172A}
.ovn-steps strong{color:var(--ink)}
/* founder */
.ovn-founder{display:flex;flex-wrap:wrap;gap:36px;align-items:center;background:var(--navy);color:#fff;border-radius:18px;padding:40px}
.ovn-founder-id{flex:1 1 280px;display:flex;flex-direction:column;gap:10px}
.ovn-founder-id h2{font-size:clamp(26px,3.2vw,34px);color:#fff}
.ovn-founder-stats{flex:2 1 460px;display:flex;flex-wrap:wrap;gap:20px}
.ovn-founder-stats div{flex:1 1 200px;display:flex;flex-direction:column;gap:6px}
.ovn-founder-stats b{font-size:34px;line-height:1.05;color:#fff}
.ovn-founder-stats span{font-size:14px;line-height:1.5;color:var(--light)}
.ovn-links{display:flex;flex-wrap:wrap;gap:16px;font-size:14px;font-weight:700}
.ovn-links a{color:#64B5F6}
/* bảng giá */
.ovn-plans{display:flex;flex-wrap:wrap;gap:20px;align-items:stretch}
.ovn-plan{flex:1 1 300px;min-width:0;background:#fff;border:1px solid var(--line);border-radius:16px;padding:32px;display:flex;flex-direction:column;gap:14px}
.ovn-plan--hot{border:2px solid var(--blue);box-shadow:0 12px 32px rgba(25,118,210,.18)}
.ovn-plan small{font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--mute)}
.ovn-plan--hot small{color:var(--blue)}
.ovn-plan h3{font-size:25px}
.ovn-price{font-size:36px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.ovn-price span{font-size:15px;font-weight:500;color:var(--mute)}
.ovn-price-sub{font-size:13px;color:var(--mute)}
.ovn-plan ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;font-size:15px;line-height:1.5;color:var(--body);flex-grow:1}
.ovn-plan li{position:relative;margin:0;padding-left:26px}
.ovn-plan li:before{content:"\2713";position:absolute;left:0;top:0;color:var(--green);font-weight:800}
.ovn-trial{background:#E8F5E9;border-radius:14px;padding:20px 26px;display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:space-between}
.ovn-trial p{font-size:15px;line-height:1.55;color:var(--ink)}
/* faq */
.ovn-faq{max-width:820px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:10px}
.ovn-faq details{border:1px solid var(--line);border-radius:12px;padding:18px 22px;background:#fff}
.ovn-faq summary{font-weight:700;font-size:17px;cursor:pointer;list-style:none}
.ovn-faq summary::-webkit-details-marker{display:none}
.ovn-faq summary:after{content:"+";float:right;color:var(--blue);font-weight:800}
.ovn-faq details[open] summary:after{content:"\2212"}
.ovn .ovn-faq details p{margin-top:12px;font-size:15px;line-height:1.7;color:var(--body)}
/* cta cuối */
.ovn-cta{max-width:900px;margin:0 auto;padding:80px 24px;display:flex;flex-direction:column;gap:20px;align-items:center;text-align:center}
.ovn-cta h2{font-size:clamp(28px,4vw,44px);line-height:1.12;color:#fff}
.ovn-cta p{font-size:17px;color:var(--light);max-width:620px}
.ovn-sec{scroll-margin-top:80px}


/* ===== Phần đầu và cuối cho khớp giao diện hiện tại (menu xanh, hero nền sáng, footer navy) ===== */
.ovn-bg-hero{background:linear-gradient(180deg,#EEF5FD 0%,#fff 100%)}
.ovn-bg-hero .ovn-in{padding-top:56px;gap:44px}
.ovn-herotop{max-width:900px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
.ovn-pill{display:inline-block;background:var(--blue);color:#fff;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:8px 20px;border-radius:999px}
.ovn-acc-b{color:var(--blue)}
.ovn-acc-g{color:var(--green)}
.ovn-herotop .ovn-lead{max-width:760px}
.ovn-herotop .ovn-btns{justify-content:center}
.ovn-checks{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;font-size:14px;color:var(--body)}
.ovn-checks span:before{content:"\2713";display:inline-block;margin-right:7px;width:18px;height:18px;line-height:18px;text-align:center;border-radius:4px;background:var(--green);color:#fff;font-size:12px;font-weight:800}
.ovn-bg-hero .ovn-hero-note{max-width:760px;color:var(--mute)}
.ovn-herorow{display:flex;flex-wrap:wrap;gap:28px;align-items:center}
.ovn-herovis{flex:1 1 460px;min-width:0}
.ovn-herovis img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 12px 30px rgba(15,23,42,.12)}
.ovn-herorow .ovn-proof{flex:1 1 380px;max-width:none;margin:0;box-shadow:0 12px 30px rgba(15,23,42,.12);border:1px solid var(--line)}
.ovn-btn--white{background:#fff;color:var(--blue-d)!important}
.ovn-ctabox{max-width:900px;width:100%;margin:0 auto;border-radius:18px;padding:52px 32px;background:linear-gradient(135deg,#1976D2 0%,#4CAF50 100%);color:#fff;display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px}
.ovn-ctabox h2{font-size:clamp(26px,3.6vw,38px);line-height:1.15;color:#fff}
.ovn-ctabox p{font-size:17px;color:#fff;max-width:620px}
.ovn-ctabox .ovn-btns{justify-content:center}
/* nút gạt Năm / Tháng (JS cũ pricing-toggle.js điều khiển các id onic-*) */
.ovn-toggle{display:flex;align-items:center;justify-content:center;gap:14px}
.ovn-tg-y{font-weight:700;color:#1976d2;font-size:14px;cursor:pointer}
.ovn-tg-m{color:#64748b;font-size:14px;cursor:pointer}
.ovn-switch{position:relative;display:inline-block;width:46px;height:26px;cursor:pointer}
.ovn-slider{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#1976d2;border-radius:26px;transition:background-color .2s}
.ovn-knob{position:absolute;height:20px;width:20px;left:3px;top:3px;background-color:#fff;border-radius:50%;transition:left .2s}
/* .onic-price là lớp JS nút gạt dùng, nhưng custom-site.css cũ cũng định kiểu nó (flex, margin): ghi đè lại cho đúng */
.ovn .ovn-price .onic-price{display:inline!important;margin:0!important;gap:0!important;font-size:inherit;font-weight:inherit;color:inherit}
.ovn .ovn-price .onic-unit{display:inline!important;font-size:15px;font-weight:500;color:var(--mute);margin-left:4px}
/* sơ đồ 4 bước: 4 vòng tròn trên một hàng, luôn đủ 4 cột */
.ovn .ovn-fl{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;max-width:960px;margin:0 auto;width:100%}
.ovn .ovn-fl-i{position:relative;display:flex!important;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:0 10px;margin:0!important}
.ovn .ovn-fl-n{position:relative;z-index:1;display:flex!important;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--blue);color:#fff;font-size:22px;font-weight:800;line-height:1;box-shadow:0 0 0 6px #E3F0FC}
.ovn .ovn-fl-i.is-last .ovn-fl-n{background:var(--green);color:#0F172A;box-shadow:0 0 0 6px #E8F5E9}
.ovn .ovn-fl-i:not(:last-child):before{content:"";position:absolute;top:27px;left:calc(50% + 42px);right:calc(-50% + 42px);border-top:2px dashed #9DB4D3}
.ovn .ovn-fl-t{display:block!important;font-size:17px;font-weight:700;line-height:1.3;color:var(--ink);margin:6px 0 0!important}
.ovn .ovn-fl-d{display:block!important;font-size:14px;line-height:1.5;color:var(--body);margin:0!important}
/* Tương tác bằng CSS thuần (radio + label), không cần JavaScript */
.ovn-r{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.ovn-loop,.ovn-roles{position:relative}
.ovn-roles{display:flex;flex-direction:column;gap:20px}
label.ovn-step{display:flex;align-items:center;justify-content:center;text-align:center;user-select:none}
label.ovn-tab{display:inline-block;user-select:none;margin:0}
label.ovn-step{margin:0}
.ovn-roles .ovn-panel{display:none}
.ovn-sp{display:none}
#ovn-s1:checked ~ .ovn-ringwrap label[for=ovn-s1]{background:var(--orange);border-color:var(--orange);color:#fff}
#ovn-s1:checked ~ .ovn-looptext .ovn-sp1{display:flex}
#ovn-t1:checked ~ .ovn-tabs label[for=ovn-t1]{background:var(--blue);border-color:var(--blue);color:#fff}
#ovn-t1:checked ~ .ovn-pn1{display:flex}
#ovn-s2:checked ~ .ovn-ringwrap label[for=ovn-s2]{background:var(--orange);border-color:var(--orange);color:#fff}
#ovn-s2:checked ~ .ovn-looptext .ovn-sp2{display:flex}
#ovn-t2:checked ~ .ovn-tabs label[for=ovn-t2]{background:var(--blue);border-color:var(--blue);color:#fff}
#ovn-t2:checked ~ .ovn-pn2{display:flex}
#ovn-s3:checked ~ .ovn-ringwrap label[for=ovn-s3]{background:var(--orange);border-color:var(--orange);color:#fff}
#ovn-s3:checked ~ .ovn-looptext .ovn-sp3{display:flex}
#ovn-t3:checked ~ .ovn-tabs label[for=ovn-t3]{background:var(--blue);border-color:var(--blue);color:#fff}
#ovn-t3:checked ~ .ovn-pn3{display:flex}
#ovn-s4:checked ~ .ovn-ringwrap label[for=ovn-s4]{background:var(--orange);border-color:var(--orange);color:#fff}
#ovn-s4:checked ~ .ovn-looptext .ovn-sp4{display:flex}
#ovn-s5:checked ~ .ovn-ringwrap label[for=ovn-s5]{background:var(--orange);border-color:var(--orange);color:#fff}
#ovn-s5:checked ~ .ovn-looptext .ovn-sp5{display:flex}
#ovn-s6:checked ~ .ovn-ringwrap label[for=ovn-s6]{background:var(--orange);border-color:var(--orange);color:#fff}
#ovn-s6:checked ~ .ovn-looptext .ovn-sp6{display:flex}
.ovn-r:focus-visible ~ .ovn-ringwrap,.ovn-r:focus-visible ~ .ovn-tabs{outline:2px solid #64B5F6;outline-offset:4px;border-radius:12px}
@media (max-width:640px){.ovn-ctabox{padding:36px 20px}.ovn-bg-hero .ovn-in{padding-top:36px}.ovn .ovn-fl-n{width:42px;height:42px;font-size:17px;box-shadow:0 0 0 4px #E3F0FC}.ovn .ovn-fl-i.is-last .ovn-fl-n{box-shadow:0 0 0 4px #E8F5E9}.ovn .ovn-fl-i{padding:0 4px}.ovn .ovn-fl-i:not(:last-child):before{top:20px;left:calc(50% + 28px);right:calc(-50% + 28px)}.ovn .ovn-fl-t{font-size:13px}.ovn .ovn-fl-d{display:none!important}.ovn-in{padding:56px 18px}.ovn-panel,.ovn-founder{padding:24px}.ovn-btn{width:100%}.ovn-btns{flex-direction:column}}


/* ===== v7: hiện khi cuộn, album tải ảnh theo yêu cầu, rút gọn gói ===== */
.ovn .ovn-cnt{font-style:normal;font-variant-numeric:tabular-nums}
.ovn.ovn-js .ovn-rv{opacity:0;transform:translateY(26px);transition:opacity .6s ease var(--d,0ms),transform .6s cubic-bezier(.2,.7,.2,1) var(--d,0ms);will-change:opacity,transform}
.ovn.ovn-js .ovn-rv.is-in{opacity:1;transform:none;will-change:auto}
@media (prefers-reduced-motion:reduce){.ovn.ovn-js .ovn-rv{opacity:1;transform:none;transition:none}}
/* rê chuột: các nút vòng và tab có phản hồi */
@media (hover:hover){.ovn .ovn-ring label,.ovn .ovn-tabs label{cursor:pointer}.ovn .ovn-plan{transition:transform .25s,box-shadow .25s}.ovn .ovn-plan:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(15,23,42,.12)}}
/* gói: danh sách rút gọn */
.ovn .ovn-more{margin:0 0 4px}
.ovn .ovn-more>summary{list-style:none;cursor:pointer;font-weight:700;font-size:14px;color:var(--blue-d);padding:6px 0 10px 28px;position:relative}
.ovn .ovn-more>summary::-webkit-details-marker{display:none}
.ovn .ovn-more>summary:before{content:"+";position:absolute;left:6px;top:4px;font-size:18px}
.ovn .ovn-more[open]>summary{display:none}
.ovn .ovn-plan details ul{margin:0}
/* album */
.ovn .ovn-gal{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:14px;width:100%;text-align:center}
.ovn .ovn-gal-stage{position:relative;aspect-ratio:16/10;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.ovn .ovn-gal-open{display:block;width:100%;height:100%;padding:0;margin:0;border:0;background:none;cursor:zoom-in}
.ovn .ovn-gal-stage img{width:100%;height:100%;object-fit:contain;display:block;margin:0}
.ovn .ovn-gal-prev,.ovn .ovn-gal-next{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;border:0;padding:0;background:rgba(15,23,42,.72);color:#fff;font-size:24px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ovn .ovn-gal-prev{left:12px}.ovn .ovn-gal-next{right:12px}
.ovn .ovn-gal-prev:hover,.ovn .ovn-gal-next:hover{background:var(--blue)}
.ovn .ovn-gal-cap{margin:0;font-weight:700;color:var(--ink);font-size:15px}
.ovn .ovn-gal-nav{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.ovn .ovn-gal-chip{flex:0 0 auto;border:1.5px solid var(--line);background:#fff;color:var(--body);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;margin:0;text-transform:none}
.ovn .ovn-gal-chip:hover{border-color:var(--blue);color:var(--blue-d)}
.ovn .ovn-gal-chip.is-on{background:var(--blue);border-color:var(--blue);color:#fff}
.ovn .ovn-gal-note{margin:0;font-size:13px;line-height:1.6;color:var(--mute)}
@media (max-width:640px){.ovn .ovn-gal-prev,.ovn .ovn-gal-next{width:36px;height:36px}}
/* phóng to (nằm ngoài .ovn) */
.ovn-lb{position:fixed;inset:0;z-index:99999;background:rgba(8,12,24,.92);display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px;padding:24px}
.ovn-lb.is-open{display:flex}
.ovn-lb img{max-width:min(1200px,94vw);max-height:80vh;object-fit:contain;border-radius:8px;background:#fff}
.ovn-lb p{color:#fff;font:600 15px/1.4 Roboto,sans-serif;margin:0;text-align:center;max-width:900px}
.ovn-lb button{position:absolute;border:0;background:rgba(255,255,255,.14);color:#fff;border-radius:50%;width:44px;height:44px;font-size:26px;cursor:pointer;padding:0}
.ovn-lb button:hover{background:#1976D2}
.ovn-lb-x{top:16px;right:16px}.ovn-lb-p{left:16px;top:50%}.ovn-lb-n{right:16px;top:50%}

/* ===== v8: số liệu dạng ô màu thương hiệu + hướng xuất hiện ===== */
.ovn .ovn-stat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px 22px;gap:10px;box-shadow:0 6px 20px rgba(15,23,42,.05);position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s}
.ovn .ovn-stat:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--sc)}
.ovn .ovn-stat b{color:var(--sc);font-size:40px}
.ovn .ovn-stat span{color:var(--body)}
.ovn .ovn-stat .ovn-stat-ic{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--st);color:var(--sc);font-size:0}
.ovn .ovn-stat.c-blue{--sc:#1976D2;--st:#E3F0FD}
.ovn .ovn-stat.c-orange{--sc:#F1821F;--st:#FEF0E1}
.ovn .ovn-stat.c-green{--sc:#3d9a41;--st:#E6F4E7}
.ovn .ovn-stat.c-navy{--sc:#0F172A;--st:#E8ECF4}
@media (hover:hover){.ovn .ovn-stat:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(15,23,42,.12)}}
.ovn .ovn-stats{align-items:stretch}
/* hướng xuất hiện */
.ovn.ovn-js .ovn-rv--l{transform:translateX(-56px)}
.ovn.ovn-js .ovn-rv--r{transform:translateX(56px)}
.ovn.ovn-js .ovn-rv--z{transform:scale(.94)}
.ovn.ovn-js .ovn-rv.is-in{transform:none}
@media (max-width:640px){.ovn.ovn-js .ovn-rv--l{transform:translateX(-28px)}.ovn.ovn-js .ovn-rv--r{transform:translateX(28px)}}
.ovn{overflow-x:clip}

/* ===== v9: nội dung bước và vai trò ===== */
.ovn .ovn-stepbox .ovn-ctrl{margin-top:4px;padding-top:12px;border-top:1px solid rgba(255,255,255,.14);font-size:15px;color:#fff}
.ovn .ovn-stepbox .ovn-ctrl b{color:#F6A353}
.ovn .ovn-stepbox{min-height:260px}
.ovn .ovn-ticks{list-style:none;display:flex;flex-direction:column;gap:10px;margin-top:4px}
.ovn .ovn-ticks li{position:relative;padding-left:28px;font-size:16px;line-height:1.55;color:var(--ink)}
.ovn .ovn-ticks li:before{content:"\2713";position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;background:var(--green);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* ===== v10: bấm/rê vào Brand Context ở giữa vòng ===== */
.ovn label.ovn-core{margin:0;cursor:pointer;transition:box-shadow .25s,transform .25s;box-shadow:0 0 0 0 rgba(25,118,210,.5)}
@media (hover:hover){.ovn label.ovn-core:hover{box-shadow:0 0 0 10px rgba(100,181,246,.25)}}
#ovn-s7:checked ~ .ovn-ringwrap label.ovn-core{box-shadow:0 0 0 10px rgba(241,130,31,.35),0 0 0 3px var(--orange)}
#ovn-s7:checked ~ .ovn-looptext .ovn-sp7{display:flex}
.ovn .ovn-bclink{align-self:flex-start;margin-top:4px;color:#64B5F6;font-weight:700;font-size:16px}
.ovn .ovn-bclink:hover{color:#fff}
@media (min-width:900px){.ovn .ovn-looptext{min-height:440px;justify-content:center}.ovn .ovn-stepbox{min-height:340px;justify-content:center}}


/* ===== v11: BỔ SUNG - dán NỐI TIẾP vào cuối CSS hiện tại (không thay thế) =====
   Dành cho các khối mới: tư vấn, so sánh, tính năng đầy đủ, founder, sticky mobile. Chỉ dùng lớp .ovn- */

/* dòng liên hệ nhanh trong hero */
.ovn .ovn-helpline{font-size:15px;color:var(--body)}
.ovn .ovn-helpline a{color:var(--blue-d);font-weight:700;text-decoration:underline}

/* nhãn gói */
.ovn .ovn-tag{display:inline-flex;align-self:flex-start;align-items:center;padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:800;background:#E3F0FD;color:var(--blue-d);white-space:nowrap}
.ovn .ovn-tag--green{background:#E6F4E7;color:#2e7d32}
.ovn .ovn-tag--orange{background:#FEF0E1;color:#b45309}
.ovn .ovn-tag--cyan{background:#E0F5FF;color:#0b6a99}

/* định nghĩa + câu nối */
.ovn .ovn-def{max-width:880px;padding:24px 28px;border-radius:16px;background:#fff;border:1px solid var(--line);border-left:6px solid var(--blue);box-shadow:0 6px 20px rgba(15,23,42,.05);font-size:17px;font-weight:600;line-height:1.65;color:var(--ink)}
.ovn .ovn-bridge{font-size:18px;font-weight:700;color:var(--blue-d);max-width:780px}
.ovn .ovn-q{padding:14px 18px;border-left:4px solid var(--orange);background:#FFF7EE;border-radius:8px;font-weight:600;color:var(--ink)}

/* nhóm ngành */
.ovn .ovn-inds{display:flex;flex-wrap:wrap;gap:10px}
.ovn .ovn-inds span,.ovn .ovn-compat span{padding:8px 16px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:700;font-size:13.5px;color:var(--ink)}
.ovn .ovn-compat{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}

/* bảng so sánh */
.ovn .ovn-subh{font-size:clamp(20px,2.4vw,26px);margin-top:12px}
.ovn .ovn-x{color:#94a3b8;font-weight:700}
.ovn .ovn-table--plans{min-width:720px}
.ovn .ovn-table--plans th:nth-child(3){background:var(--blue)}
.ovn .ovn-table--plans .ovn-pricerow td{font-weight:800;color:var(--ink);background:#F4F9FF}
.ovn .ovn-table td.is-onic{background:#F4F9FF}
.ovn .ovn-btns--c{justify-content:center}
.ovn .ovn-note--c{text-align:center}

/* danh sách tính năng đầy đủ (accordion) */
.ovn .ovn-accgroup{display:flex;flex-direction:column;gap:14px}
.ovn .ovn-acch{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-top:22px;border-top:1px dashed #cbd5e1}
.ovn .ovn-accgroup:first-of-type .ovn-acch{border-top:0;padding-top:0}
.ovn .ovn-acch h3{font-size:clamp(20px,2.4vw,26px)}
.ovn .ovn-accp{font-size:15px;color:var(--body);max-width:820px}
.ovn .ovn-acc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;align-items:start}
.ovn .ovn-acc details{background:#fff;border:1px solid var(--line);border-radius:14px;transition:border-color .2s,box-shadow .2s}
.ovn .ovn-acc details[open]{border-color:var(--blue);box-shadow:0 6px 20px rgba(25,118,210,.1)}
.ovn .ovn-acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;font-weight:700;font-size:15.5px;color:var(--ink)}
.ovn .ovn-acc summary::-webkit-details-marker{display:none}
.ovn .ovn-acc summary:after{content:"+";flex:none;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#E3F0FD;color:var(--blue-d);font-size:19px;line-height:1}
.ovn .ovn-acc details[open] summary:after{content:"\2013";background:var(--blue);color:#fff}
.ovn .ovn-acc details>div{padding:0 18px 18px;display:flex;flex-direction:column;gap:8px}
.ovn .ovn-acc details>div p{font-size:14.5px;line-height:1.6;color:var(--body)}
.ovn .ovn-acc details>div p b{color:var(--ink)}
.ovn .ovn-acc summary:focus-visible,.ovn .ovn-faq summary:focus-visible{outline:3px solid #64B5F6;outline-offset:2px}
@media (max-width:900px){.ovn .ovn-acc{grid-template-columns:1fr}}

/* founder có ảnh */
.ovn .ovn-fbox{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:20px;padding:36px;box-shadow:0 10px 30px rgba(15,23,42,.06)}
.ovn .ovn-fphoto img{width:100%;max-width:360px;aspect-ratio:1/1;object-fit:cover;border-radius:20px;display:block;margin:0 auto}
.ovn .ovn-ftext{display:flex;flex-direction:column;gap:14px}
.ovn .ovn-ftext h2{font-size:clamp(26px,3.2vw,34px)}
.ovn .ovn-ftext>p{font-size:16px;line-height:1.65;color:var(--body)}
.ovn .ovn-fstats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ovn .ovn-fstats div{padding:16px;border-radius:14px;background:#F4F9FF;border:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.ovn .ovn-fstats b{font-size:24px;line-height:1.15;color:var(--blue)}
.ovn .ovn-fstats span{font-size:13.5px;color:var(--body)}
@media (max-width:900px){.ovn .ovn-fbox{grid-template-columns:1fr;padding:24px}.ovn .ovn-fphoto img{max-width:240px}}
@media (max-width:549px){.ovn .ovn-fstats{grid-template-columns:1fr}}

/* bảng giá bổ sung */
.ovn .ovn-plan{position:relative}
.ovn .ovn-ribbon{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--orange);color:#fff;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:6px 16px;border-radius:999px;white-space:nowrap}
.ovn .ovn-gift{align-self:flex-start;background:#E6F4E7;color:#2e7d32;font-size:13px;font-weight:700;padding:5px 12px;border-radius:999px}
.ovn .ovn-plan--hot small{margin-top:4px}

/* khối tư vấn */
.ovn .ovn-contact{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
.ovn .ovn-contact-text{display:flex;flex-direction:column;gap:18px}
.ovn .ovn-contact-text .ovn-lead{color:var(--light)}
.ovn .ovn-ticks--w li{color:#fff}
.ovn .ovn-ch{display:flex;flex-wrap:wrap;gap:12px}
.ovn .ovn-contact-form{background:#fff;color:var(--ink);border-radius:18px;padding:30px;display:flex;flex-direction:column;gap:14px;box-shadow:0 20px 50px rgba(0,0,0,.3)}
.ovn .ovn-contact-form h3{font-size:22px;color:var(--ink)}
.ovn .ovn-contact-form input[type=text],.ovn .ovn-contact-form input[type=email],.ovn .ovn-contact-form input[type=tel],.ovn .ovn-contact-form input[type=url],.ovn .ovn-contact-form select,.ovn .ovn-contact-form textarea{width:100%;margin:0 0 12px;padding:13px 16px;border:1.5px solid #cbd5e1;border-radius:12px;font-size:15px;font-family:inherit;background:#fff;box-shadow:none}
.ovn .ovn-contact-form textarea{min-height:100px}
.ovn .ovn-contact-form input:focus,.ovn .ovn-contact-form select:focus,.ovn .ovn-contact-form textarea:focus{border-color:var(--blue);outline:0}
.ovn .ovn-contact-form input[type=submit],.ovn .ovn-contact-form button[type=submit]{width:100%;background:var(--orange);color:#fff;border:0;border-radius:999px;padding:15px 24px;font-size:15px;font-weight:800;text-transform:uppercase;cursor:pointer;margin:0}
.ovn .ovn-contact-form input[type=submit]:hover{background:#e0720f}
.ovn .ovn-contact-form label{font-size:14px;font-weight:700;color:var(--ink)}
@media (max-width:900px){.ovn .ovn-contact{grid-template-columns:1fr}}

/* thanh liên hệ cố định trên điện thoại */
.ovn .ovn-sticky{display:none}
@media (max-width:767px){
 .ovn{padding-bottom:64px}
 .ovn .ovn-sticky{display:grid;grid-template-columns:1fr 1fr 1.4fr;position:fixed;left:0;right:0;bottom:0;z-index:9990;background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(15,23,42,.12)}
 .ovn .ovn-sticky a{display:flex;align-items:center;justify-content:center;padding:15px 6px;font-size:14px;font-weight:800;color:var(--ink)}
 .ovn .ovn-sticky-zalo{border-left:1px solid var(--line);color:var(--blue-d)!important}
 .ovn .ovn-sticky-buy{background:var(--orange);color:#fff!important}
}