/* PINOVA UX 2026 · bộ nâng cấp giao diện, dùng cùng theme hiện hữu */
:root{--navy:#082b59;--deep:#061c42;--green:#11773b;--light:#f3f8f9;--ink:#162c42;--muted:#51657a;--line:#dce5ed}
html{scroll-behavior:smooth;scroll-padding-top:95px}body{font-size:15px!important;line-height:1.76!important;overflow-x:hidden}body button,body input,body select,body textarea{font:inherit}
.pin-icon{width:1.2em;height:1.2em;display:inline-block;vertical-align:-.16em;flex-shrink:0;stroke-width:1.9}
.pin-skip-link{position:fixed;top:-99px;left:10px;z-index:99999;background:#fff;color:#061c42;padding:12px 20px;border-radius:8px;box-shadow:0 4px 16px #0003}.pin-skip-link:focus{top:10px}
.pin-btn,.pin-nav-cta,.pin-card-link,.pin-small-btn,.pin-quickstrip a,.pin-footer-lead,.pin-mobile-cta a{display:inline-flex;align-items:center;justify-content:center;gap:9px}.pin-btn{min-height:47px;padding:12px 20px;white-space:normal;text-align:center}.pin-btn .pin-icon{width:18px;height:18px}.pin-btn-main{background:#11773b;border-color:#11773b}.pin-btn-main:hover{background:#0c5b2b}.pin-btn:focus-visible,.pin-nav-cta:focus-visible,.pin-tool-card:focus-visible,.pin-problem-card:focus-visible,.pin-app:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #24b85b;outline-offset:3px}
.pin-top .pin-container{gap:10px}.pin-top span{display:inline-flex;align-items:center;gap:7px}
.pin-nav-inner{min-height:76px;gap:20px}.pin-logo{display:inline-flex;flex-direction:column;justify-content:center;max-width:195px;flex-shrink:0}.pin-logo-img{max-width:170px}.pin-logo small{color:#137238!important;line-height:1.25;font-size:7px;letter-spacing:.5px}.pin-menu{gap:16px;margin:auto;flex:1;justify-content:center}.pin-menu a{font-size:12px;white-space:nowrap;position:relative;padding:9px 0}.pin-menu a:hover,.pin-menu a[aria-current="page"]{color:#116c37}.pin-menu a:hover::after,.pin-menu a[aria-current="page"]::after{content:"";height:2px;background:var(--green);position:absolute;bottom:2px;left:0;right:0}
.pin-nav-actions{display:flex;align-items:center;gap:13px}.pin-nav-cta{white-space:nowrap;background:#e7f5eb;color:#0e6e36;border:1px solid #cde8d2;border-radius:9px;padding:9px 13px;font-weight:800;font-size:12px;min-height:44px}.pin-nav-cta:hover{background:#d4eedd}.pin-cart{display:flex;align-items:center;justify-content:center;position:relative;min-width:37px;min-height:44px}.pin-cart sup{position:absolute;top:1px;right:-7px;background:#0c7138;color:white;border-radius:50%;font-size:10px;padding:2px 5px}.pin-hamb{min-width:44px;min-height:44px;align-items:center;justify-content:center;cursor:pointer}
.pin-container{max-width:1220px}
.pin-hero-v2{background:radial-gradient(ellipse at 70% 42%,#c9e9d854,transparent 36%),linear-gradient(120deg,#f4fafc,#eef9f4 52%,#e9f4f8);min-height:540px;isolation:isolate}
.pin-hero-v2:before{display:none}.pin-hero-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:25px;align-items:center;padding-top:55px;padding-bottom:55px;position:relative;z-index:1}.pin-hero-copy{position:relative;z-index:3}.pin-hero-v2 .pin-eyebrow{font-size:10px;letter-spacing:.45px;background:#e2f4e8;color:#09682f;border-color:#bfe3c9;gap:7px}.pin-hero-v2 h1{font-size:clamp(34px,3.5vw,54px);line-height:1.23;letter-spacing:-1.9px;max-width:680px;margin:19px 0 19px}.pin-hero-v2 h1 span{color:#0d7437}.pin-hero-v2 .pin-lead{max-width:600px;color:#405a6c;font-size:15px;line-height:1.9;margin:0}.pin-hero-v2 .pin-actions{margin-top:27px}.pin-hero-proof{display:flex;gap:10px 20px;flex-wrap:wrap;margin-top:25px}.pin-hero-proof span{display:flex;align-items:center;gap:4px;font-weight:650;color:#275344;font-size:11px}.pin-hero-proof .pin-icon{color:#108b41}
.pin-hero-media{position:relative;min-width:0}.pin-hero-media-inner{position:relative;border-radius:32px;background:radial-gradient(circle at 40% 35%,#d9f4e6 0%,#d8eaf2 57%,#e7f2f8 100%);box-shadow:inset 0 0 0 1px #b7d6cb7c;min-height:420px;display:flex;align-items:center;justify-content:center}.pin-hero-product-art{width:100%;max-width:440px;padding:8px}.pin-hero-product-art img{width:100%;height:auto;display:block;filter:drop-shadow(0 22px 14px #102f3a24)}.pin-hero-mini{position:absolute;bottom:25px;left:-26px;background:white;box-shadow:0 15px 50px #0f405c18;border:1px solid #d7e8ec;border-radius:14px;display:flex;align-items:center;gap:13px;padding:14px 18px;max-width:92%}.pin-hero-mini-icon{width:45px;height:45px;border-radius:13px;display:grid;place-items:center;background:#dff5e7;color:#11773b}.pin-hero-mini b{font-size:12px;color:#092d54;display:block;line-height:1.5}.pin-hero-mini span{font-size:11px;line-height:1.55;color:#50677b;display:block}
.pin-quickstrip{border-bottom:1px solid #e0e9ee;background:#fff}.pin-quickstrip-inner{display:flex;align-items:center;gap:12px;padding-block:14px;flex-wrap:wrap}.pin-quickstrip-inner>span{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:800;color:#0d2e55;margin-right:auto}.pin-quickstrip-inner>a{padding:7px 13px;border-radius:100px;background:#f0f6f8;border:1px solid #dce7ed;font-size:11px;color:#0d4c32;font-weight:750;transition:.2s}.pin-quickstrip-inner>a:hover{background:#e1f3e6}
.pin-section{padding:70px 0}.pin-section-kicker,.pin-overline{color:#0e7739;font-weight:800;font-size:11px;letter-spacing:1.2px;display:block;margin-bottom:9px}.pin-heading h2{line-height:1.35;max-width:770px;letter-spacing:-.8px}.pin-heading p{line-height:1.8;max-width:780px;margin-top:10px}.pin-heading{align-items:end;margin-bottom:27px}.pin-heading>a{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;color:#0d7337}
.pin-problem-grid,.pin-tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pin-problem-card,.pin-tool-card{display:flex;flex-direction:column;gap:10px;padding:26px;background:#fff;border:1px solid #d9e6eb;border-radius:18px;transition:transform .18s,box-shadow .18s;min-width:0}.pin-problem-card:hover,.pin-tool-card:hover{transform:translateY(-4px);box-shadow:0 18px 34px #08295c11}.pin-problem-ico,.pin-tool-icon{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:16px;color:#0b783b;background:#e7f6ed;margin-bottom:6px}.pin-problem-card strong{font-size:18px;line-height:1.45;color:#092e58}.pin-problem-card p,.pin-tool-card p{color:#51677b;font-size:13px;line-height:1.85;margin:0 0 6px;flex:1}.pin-card-link{color:#0e7438!important;font-size:12px!important;font-weight:800;line-height:1.5;margin-top:auto}
.pin-split{display:grid;grid-template-columns:.88fr 1.12fr;gap:55px;align-items:center}.pin-split h2{font-size:clamp(26px,2.7vw,37px);line-height:1.35;color:#0b2c55;letter-spacing:-.8px;margin:0 0 20px}.pin-split>div>p{color:#4b6172;line-height:1.9;margin:0 0 22px}.pin-steps{list-style:none;padding:0;margin:0;display:grid;gap:15px}.pin-steps li{display:flex;align-items:flex-start;gap:18px;border-radius:16px;background:white;padding:19px 22px;border:1px solid #dce8ed}.pin-steps li>span{display:grid;place-items:center;width:49px;height:49px;flex:0 0 49px;border-radius:14px;background:#dcf4e5;color:#0d793d;font-weight:800}.pin-steps strong{font-size:16px;color:#0b3156}.pin-steps p{color:#516578;font-size:12.5px;line-height:1.8;margin:5px 0 0}
.pin-tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.pin-tool-card{padding:21px;min-height:230px}.pin-tool-card strong{font-size:15px;line-height:1.45;color:#082f59}.pin-tool-icon{width:46px;height:46px}.pin-app-grid .pin-app-body{padding:18px}.pin-app-grid .pin-app-body strong{display:flex;justify-content:space-between;align-items:center;gap:8px;line-height:1.5}.pin-app-grid .pin-app-visual{height:164px}.pin-app-grid .pin-app-body span{font-size:12px;line-height:1.7;display:block}
.pin-catalog-message{border:1px solid #d2e8da;background:linear-gradient(125deg,#f1fbf5,#f0f7fb);padding:28px 32px;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:26px}.pin-catalog-message h3{font-size:21px;color:#0b2c55;margin:0 0 8px}.pin-catalog-message p{color:#52697c;font-size:13px;max-width:720px;margin:0 0 18px;line-height:1.8}.pin-catalog-message .pin-btn{flex-shrink:0}
.pin-mini-glossary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:22px}.pin-mini-glossary>div{border-left:3px solid #188c4a;background:white;border-radius:8px;padding:17px}.pin-mini-glossary b{display:block;font-size:13px;color:#0e3056}.pin-mini-glossary p{font-size:12px;color:#526b7c;line-height:1.8;margin:7px 0 0}.pin-knowledge-grid .pin-app{height:100%}.pin-knowledge-grid .pin-app-body{padding:22px;display:flex;flex-direction:column;gap:13px;min-height:200px}.pin-knowledge-grid .pin-app-body strong{font-size:15px;line-height:1.6}.pin-article-tag{font-size:10px!important;letter-spacing:.5px;font-weight:800;color:#11773b!important}
.pin-faq-v2{max-width:960px;margin:auto}.pin-faq-v2 details{padding:20px 22px;margin-bottom:11px}.pin-faq-v2 summary{font-size:15px}.pin-faq-v2 p{font-size:13px!important;line-height:1.9!important;margin-top:15px!important}.pin-faq-v2 p a{color:#0e7339;text-decoration:underline}
.pin-final-cta{background:linear-gradient(118deg,#082b59,#0e4b56);border-radius:23px;padding:47px;display:flex;align-items:center;justify-content:space-between;gap:45px;color:white}.pin-final-cta h2{font-size:clamp(25px,2.8vw,36px);line-height:1.35;color:#fff;margin:0 0 10px}.pin-final-cta p{color:#dce9f0;max-width:650px;font-size:13px}.pin-final-cta .pin-overline{color:#9ee3af}.pin-final-actions{display:flex;flex-direction:column;gap:12px;align-items:stretch;min-width:210px}
.pin-footer{padding-top:0}.pin-footer-lead{display:flex;align-items:center;gap:30px;justify-content:space-between;padding:43px 0;border-bottom:1px solid #ffffff23;margin-bottom:35px}.pin-footer-lead h2{font-size:25px;line-height:1.4;color:white;margin:0 0 8px;max-width:640px}.pin-footer-lead p{max-width:680px;line-height:1.8;margin:0}.pin-footer .pin-overline{color:#a5deb4}.pin-footer-grid{grid-template-columns:1.65fr 1fr 1fr 1.2fr}.pin-footer h3{font-size:14px}.pin-footer p,.pin-footer a{font-size:12px;line-height:1.8}.pin-footer .pin-logo small{color:#9ae6ad!important}.pin-social{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.pin-social>a{border:1px solid #ffffff30;border-radius:8px;padding:6px 9px;color:white;display:flex;align-items:center;gap:5px}.pin-footer-note{font-size:11px!important;color:#aebfd2!important;margin-top:14px!important}.pin-bottom{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}
.pin-mobile-cta{display:none}.pin-app-visual .pin-glyph{display:grid;place-items:center}.pin-app-body strong svg{flex-shrink:0}.pin-page .entry-content{max-width:960px}.pin-page .entry-content h2{margin-top:32px;color:#0d345c;font-size:23px}.pin-page .entry-content h3{color:#133b5f;margin-top:23px}.pin-page .entry-content li{margin-bottom:6px}.pin-page .entry-content a:not(.pin-btn){color:#12723c;text-decoration:underline}.pin-page .entry-content p,.pin-page .entry-content li{font-size:14px;line-height:1.95}.pin-page h1{font-size:clamp(27px,3vw,40px);line-height:1.3}.pin-page{min-height:60vh}
.pin-contact-panel{width:min(100%,880px);max-width:880px}.pin-contact-panel .pin-btn,.pin-advisor .pin-btn{font-weight:800}
@media(max-width:1150px){.pin-nav-inner{gap:12px}.pin-menu{gap:10px}.pin-menu a{font-size:11px}.pin-nav-cta{padding:9px}.pin-hero-v2 h1{font-size:43px}.pin-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:980px){.pin-menu{display:none;position:absolute;top:100%;left:0;right:0;background:white;padding:12px 20px;box-shadow:0 12px 24px #061c421f;flex-direction:column;align-items:stretch;gap:0;max-height:calc(100dvh - 80px);overflow-y:auto}.pin-menu.open{display:flex}.pin-menu a{font-size:15px;padding:13px;border-bottom:1px solid #e5edf0}.pin-menu a::after{display:none}.pin-hamb{display:flex!important;margin-left:0}.pin-nav-actions{margin-left:auto}.pin-hero-layout{grid-template-columns:1fr 0.85fr}.pin-hero-v2 h1{font-size:39px}.pin-hero-mini{left:-10px}.pin-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.pin-mini-glossary{grid-template-columns:repeat(2,minmax(0,1fr))}.pin-split{gap:30px}}
@media(max-width:760px){.pin-nav-inner{min-height:69px}.pin-nav-cta span{display:none}.pin-nav-cta{width:42px;min-width:42px;height:44px}.pin-nav-cta svg{width:19px;height:19px}.pin-hero-layout{grid-template-columns:1fr;gap:14px;padding:36px 0 28px}.pin-hero-v2 h1{font-size:clamp(33px,7vw,44px);letter-spacing:-1.2px}.pin-hero-v2 .pin-lead{font-size:14px}.pin-hero-media{max-width:470px;width:100%;margin:auto}.pin-hero-media-inner{min-height:295px;max-height:340px}.pin-hero-product-art{max-width:310px}.pin-hero-mini{bottom:11px;left:8px;right:8px;max-width:none;padding:11px}.pin-hero-proof{gap:8px 12px}.pin-quickstrip-inner{gap:8px;padding:12px 0}.pin-quickstrip-inner>span{flex-basis:100%}.pin-quickstrip-inner>a{flex:1;white-space:nowrap;text-align:center;font-size:10px;padding:7px 4px}.pin-quickstrip-inner>a .pin-icon{display:none}.pin-section{padding:45px 0}.pin-heading{flex-direction:column;align-items:stretch;gap:12px}.pin-heading h2{font-size:25px}.pin-heading p{font-size:13px}.pin-problem-grid{grid-template-columns:1fr;gap:11px}.pin-problem-card{padding:19px;display:grid;grid-template-columns:52px 1fr;column-gap:15px;align-items:start}.pin-problem-ico{grid-row:span 3}.pin-problem-card strong{font-size:15px}.pin-problem-card p{font-size:12px}.pin-problem-card .pin-card-link{grid-column:2}.pin-split{grid-template-columns:1fr;gap:25px}.pin-split h2{font-size:27px}.pin-steps li{padding:16px}.pin-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.pin-tool-card{padding:15px;min-height:225px}.pin-tool-card strong{font-size:13px}.pin-tool-card p{font-size:11px}.pin-tool-icon{width:41px;height:41px}.pin-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pin-app-grid .pin-app-visual{height:115px}.pin-app-grid .pin-app-body{padding:12px}.pin-app-grid .pin-app-body strong{font-size:12px}.pin-app-grid .pin-app-body span{font-size:11px}.pin-catalog-message{flex-direction:column;align-items:stretch;padding:22px}.pin-catalog-message h3{font-size:18px}.pin-mini-glossary{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.pin-mini-glossary>div{padding:13px}.pin-knowledge-grid{grid-template-columns:1fr}.pin-knowledge-grid .pin-app-body{min-height:unset}.pin-faq-v2 summary{font-size:13px}.pin-final-cta{padding:27px;flex-direction:column;align-items:stretch;gap:16px}.pin-final-actions{min-width:0}.pin-final-cta h2{font-size:25px}.pin-footer-lead{flex-direction:column;align-items:stretch;padding:32px 0}.pin-footer-lead h2{font-size:23px}.pin-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px}.pin-footer h3{margin-top:0}.pin-footer .pin-logo-img{max-width:145px}.pin-footer p,.pin-footer a{font-size:11px}.pin-mobile-cta{display:flex;align-items:stretch;gap:7px;position:fixed;bottom:0;left:0;right:0;padding:9px max(12px,env(safe-area-inset-left)) calc(9px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-right));background:#fff;box-shadow:0 -7px 20px #061c4220;z-index:90}.pin-mobile-cta a{flex:1;min-height:43px;border-radius:8px;background:#e5f3eb;color:#0e6f37;font-size:12px;font-weight:800;padding:6px 9px;text-align:center}.pin-mobile-cta a:last-child{background:#0e7439;color:white}body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}.pin-bottom{font-size:10px}.pin-page{padding:33px 0}}
@media(max-width:390px){.pin-logo-img{width:130px}.pin-nav-actions{gap:5px}.pin-nav-cta{display:none}.pin-tool-grid{grid-template-columns:1fr}.pin-tool-card{min-height:160px}.pin-app-grid{grid-template-columns:1fr 1fr}.pin-hero-v2 h1{font-size:31px}.pin-hero-v2 .pin-actions{flex-direction:column}.pin-hero-v2 .pin-actions a{width:100%}.pin-quickstrip-inner>a{font-size:9px}.pin-footer-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
