/* Shared layout and interaction layer. Loaded after page-specific styles. */
:root{--portal-navy:#102f4c;--portal-blue:#086ecb;--portal-muted:#62758a;--portal-line:#dce6ef;--portal-paper:#f5f8fc}
body{background-color:var(--portal-paper);font-family:Inter,"Be Vietnam Pro",Arial,sans-serif}
[hidden]{display:none!important}
button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}
button{cursor:pointer}button:disabled{cursor:wait;opacity:.65}
:focus-visible{outline:3px solid #188fea;outline-offset:4px}
main{min-height:55vh}main img{height:auto}p{overflow-wrap:anywhere}
.site-header{z-index:80}.header-inner{max-width:1440px}.logo-text{font-size:.83rem}.main-nav a{font-size:.76rem}
.portal-search-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--portal-line);border-radius:12px;background:white;color:var(--portal-navy);flex-shrink:0}
.portal-search-button kbd{display:none}
.hero{position:relative;overflow:hidden;background:radial-gradient(ellipse at 85% 10%,#126f8a 0,transparent 44%),linear-gradient(125deg,#0b2441,#124c79);color:white;padding:82px 0 110px}
.hero-container{position:relative;z-index:1;max-width:1100px;text-align:center}.hero-eyebrow{display:inline-flex;gap:10px;align-items:center;background:#ffffff12;border:1px solid #ffffff24;border-radius:30px;padding:9px 17px;font-size:.78rem;color:#d2eafa}
.hero h1{font-family:"Be Vietnam Pro",sans-serif;font-size:clamp(2.15rem,5vw,4.2rem);letter-spacing:-.045em;line-height:1.2;margin:24px auto;max-width:900px;font-weight:800}.hero h1 span{display:block;color:#78ddf3}.hero p{max-width:660px;margin:0 auto;color:#d2e1ed;line-height:1.85;font-size:1rem}
.hero-btns,.hero-trust{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:28px}.hero-btns .btn{padding:14px 22px;border-radius:12px}.btn-hero-primary{background:white;color:#123c61;box-shadow:0 8px 24px #00132525}.btn-hero-secondary{background:#ffffff0d;color:white;border:1px solid #ffffff4a}.hero-trust{font-size:.75rem;color:#c5dcea;gap:24px;margin-top:32px}.hero-trust i{margin-right:6px;color:#78ddf3}
.hero-orb{position:absolute;width:420px;height:420px;border:1px solid #ffffff0c;border-radius:50%;pointer-events:none}.hero-orb-one{right:-120px;top:20px}.hero-orb-two{left:-190px;bottom:-160px;width:540px;height:540px}
.account-spotlight-section{position:relative;margin-top:-38px;z-index:2}.account-spotlight{display:flex;gap:22px;align-items:center;padding:26px 30px;background:white;border:1px solid var(--portal-line);border-radius:20px;box-shadow:0 12px 40px #1539560c}.account-spotlight-icon,.quick-icon,.service-stat-icon{display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border-radius:15px;background:#eaf5ff;color:#0874c7;font-size:1.3rem}.account-spotlight-copy{flex:1}.account-spotlight-status{font-size:.7rem;font-weight:700;color:#0874c7;letter-spacing:.06em;text-transform:uppercase}.account-spotlight h2{font-size:1.12rem;margin:5px 0}.account-spotlight p{font-size:.85rem;color:var(--portal-muted);margin:0}
.service-strip{padding:32px 0}.service-strip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.service-stat{display:flex;gap:12px;align-items:center;padding:14px}.service-stat strong{display:block;color:var(--portal-navy);font-size:1.1rem}.service-stat p,.service-stat small{margin:4px 0;color:var(--portal-muted);font-size:.75rem}
.news-section,.quick-section,.journey-section,body[data-page=home] .vinh-quang-page{padding:50px 0}.section-title{margin:0 0 28px;text-align:left}.section-title>span{color:#0874c7;font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.section-title h2{font-family:"Be Vietnam Pro",sans-serif;font-size:clamp(1.4rem,3vw,2rem);letter-spacing:-.035em;margin:8px 0;color:var(--portal-navy)}
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.news-card{background:white;border:1px solid var(--portal-line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}.news-card:hover,.quick-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px #244b6a12}.news-img{width:100%;aspect-ratio:16/10;object-fit:cover;background:#e4eef6}.news-content{padding:22px;display:flex;flex-direction:column;flex:1;gap:18px}.news-content>div{flex:1}.news-date{color:var(--portal-muted);font-size:.75rem}.news-title{font-size:1.04rem;line-height:1.65;margin:12px 0;color:var(--portal-navy)}.news-excerpt{font-size:.84rem;line-height:1.75;color:var(--portal-muted)}.news-readmore{align-self:flex-start}.news-actions{text-align:center;margin-top:26px}
.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.quick-card,.journey-card{display:block;background:white;border:1px solid var(--portal-line);border-radius:18px;padding:26px;transition:transform .2s,box-shadow .2s}.quick-card h3,.journey-card h3{font-size:1rem;margin:20px 0 12px;color:var(--portal-navy)}.quick-card p,.journey-card p{font-size:.84rem;line-height:1.8;color:var(--portal-muted);margin:0}.journey-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.journey-card{position:relative}.journey-number{font-size:2.5rem;line-height:1;font-weight:800;color:#c8ddec}.journey-card>i{float:right;color:#0874c7;font-size:1.5rem}
body[data-page=home] .grid-container{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}body[data-page=home] .honor-card{position:relative;overflow:hidden;background:linear-gradient(145deg,#133a64,#087b99);color:white;border-radius:18px;text-align:center;min-height:240px;padding:28px 15px;cursor:pointer}body[data-page=home] .honor-card:nth-child(2n){background:linear-gradient(145deg,#164564,#236d79)}body[data-page=home] .card-logo{height:60px;width:60px;object-fit:contain;margin:0 auto 20px;font-size:3rem;color:#ffdd81}body[data-page=home] .card-title{font-size:1rem;line-height:1.7}body[data-page=home] .card-action{font-size:.8rem;color:#c3eafb}
body[data-page=home] .modal-overlay{position:fixed;inset:0;background:#071c37b8;z-index:110;display:none;align-items:center;justify-content:center;padding:24px}body[data-page=home] .modal-content{position:relative;background:white;border-radius:20px;padding:32px;max-width:1000px;width:100%;max-height:88vh;overflow:auto}body[data-page=home] .close-btn{position:absolute;top:8px;right:16px;font-size:2rem;background:none}body[data-page=home] .image-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}body[data-page=home] .image-gallery img{width:100%;border-radius:8px;cursor:zoom-in}
.portal-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:20px 0}.portal-toolbar input,.portal-toolbar select,.portal-input{min-height:44px;padding:11px 14px;border:1px solid var(--portal-line);border-radius:11px;background:white;color:var(--portal-navy);max-width:100%}.portal-toolbar input{flex:1;min-width:160px}.portal-chip,.portal-secondary{padding:10px 16px;border:1px solid var(--portal-line);border-radius:10px;background:white;color:var(--portal-navy);font-size:.85rem}.portal-chip[aria-pressed=true]{background:#e4f2ff;border-color:#0874c7;color:#075c9e}.portal-save{align-self:flex-start;font-size:.8rem;background:#f1f7fc;border:1px solid var(--portal-line);border-radius:8px;padding:8px 12px;color:#254c70}.portal-save[aria-pressed=true]{color:#00685a;background:#e0f7f0}
.portal-dialog{border:1px solid var(--portal-line);border-radius:20px;padding:26px;width:min(620px,calc(100% - 28px));max-height:85dvh;color:var(--portal-navy);box-shadow:0 24px 90px #00152c40}.portal-dialog::backdrop{background:#08243ab3;backdrop-filter:blur(5px)}.portal-dialog-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.portal-dialog h2{font-size:1.25rem;margin:0}.portal-dialog input[type=search]{width:100%}.portal-results{display:grid;gap:8px;margin-top:16px}.portal-result{padding:14px 16px;border:1px solid var(--portal-line);border-radius:12px;display:block}.portal-result:hover{background:#f0f7ff}.portal-result strong,.portal-result small{display:block}.portal-result small{margin-top:5px;color:var(--portal-muted)}
.portal-notice{padding:12px 18px;background:#fff5df;color:#72500c;font-size:.85rem;text-align:center}.portal-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:14px 22px;background:#143c58;color:white;border-radius:12px;z-index:200;max-width:calc(100% - 32px);box-shadow:0 8px 28px #102f4c25;font-size:.85rem}.portal-top{position:fixed;bottom:22px;right:22px;z-index:50;width:44px;height:44px;border-radius:14px;background:#123e65;color:white;box-shadow:0 4px 20px #102f4c30}
.portal-workspace{padding:45px 0 60px}.portal-workspace-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px}.portal-workspace h2{margin:7px 0;color:var(--portal-navy);font-size:1.65rem;letter-spacing:-.03em}.portal-eyebrow{font-size:.72rem;letter-spacing:.08em;color:#0874c7;font-weight:800;text-transform:uppercase}.portal-workspace p{color:var(--portal-muted);font-size:.86rem;margin:0}.portal-workspace-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:24px}.portal-panel{padding:26px;border:1px solid var(--portal-line);border-radius:18px;background:white}.portal-panel h3{margin:0 0 6px;font-size:1rem;color:var(--portal-navy)}.portal-task-form{display:grid;grid-template-columns:minmax(0,1fr) 145px auto;gap:10px;margin:20px 0}.portal-task-form label{font-size:.75rem;color:var(--portal-muted);display:grid;gap:5px}.portal-task-form button{align-self:end;height:44px}.portal-task-list{display:grid;gap:10px;margin:18px 0;padding:0;list-style:none}.portal-task{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--portal-line);border-radius:12px}.portal-task input{width:18px;height:18px;accent-color:#0874c7}.portal-task-copy{flex:1;min-width:0;overflow-wrap:anywhere}.portal-task-copy small{display:block;color:var(--portal-muted);font-size:.72rem;margin-top:4px}.portal-task.done strong{text-decoration:line-through;color:var(--portal-muted)}.portal-task.overdue{border-left:3px solid #d68d1a}.portal-task button{background:none;color:#6c7d8b;font-size:.78rem;padding:8px}.portal-empty{padding:26px 12px;text-align:center;background:#f7fafd;border:1px dashed var(--portal-line);border-radius:12px;font-size:.85rem;color:var(--portal-muted)}.portal-progress{width:100%;height:7px;accent-color:#0874c7;border:0;display:block;margin:12px 0}.portal-sync{font-size:.75rem!important;line-height:1.65;margin-top:14px!important}.portal-draft{display:flex;gap:12px;align-items:center;flex-wrap:wrap;border:1px solid #cce7f9;border-radius:12px;background:#f0f8ff;padding:14px;margin-bottom:20px;font-size:.8rem}.portal-draft span{flex:1}.portal-error{color:#a63b22!important}.portal-summary{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}.portal-summary>div{padding:18px 22px;flex:1;min-width:130px;background:white;border:1px solid var(--portal-line);border-radius:14px}.portal-summary strong{display:block;font-size:1.7rem;color:var(--portal-navy)}.portal-summary small{color:var(--portal-muted)}
@media(min-width:1025px) and (max-width:1250px){.logo-text{max-width:180px}.main-nav ul{gap:4px}.header-inner{gap:12px}}
@media(max-width:900px){.news-grid,.quick-grid,body[data-page=home] .grid-container{grid-template-columns:repeat(2,minmax(0,1fr))}.portal-workspace-grid{grid-template-columns:1fr}.service-strip-grid{grid-template-columns:repeat(2,1fr)}.journey-grid{gap:14px}.hero{padding:60px 0 85px}}
@media(max-width:600px){.news-grid,.quick-grid,.journey-grid{grid-template-columns:1fr}.account-spotlight{padding:20px;gap:14px;flex-wrap:wrap}.account-spotlight-copy{flex-basis:calc(100% - 70px)}.account-spotlight-action{width:100%}.hero{padding:45px 0 76px}.hero-eyebrow{font-size:.65rem}.hero p{font-size:.88rem}.hero-trust{gap:12px;font-size:.66rem}.hero-btns .btn{width:100%}.hero-btns{padding:0 15px}.service-stat{padding:8px;gap:8px}.service-stat-icon{width:40px;height:40px;flex-basis:40px}.service-stat strong{font-size:.92rem}.news-section,.quick-section,.journey-section,body[data-page=home] .vinh-quang-page{padding:30px 0}.portal-panel{padding:18px}.portal-task-form{grid-template-columns:1fr auto}.portal-task-form label:first-child{grid-column:1/-1}.portal-workspace-head{display:block}.portal-dialog{padding:18px}.logo-text{font-size:.7rem}.header-inner{gap:8px}.header-actions{gap:6px}.header-actions>.btn{font-size:.7rem;padding:9px}.portal-search-button{width:34px;height:36px}.logo-container img{width:38px;height:38px;flex-basis:38px}.logo-text span{display:none}.portal-workspace{padding:30px 0}.portal-top{right:12px;bottom:12px}body[data-page=home] .image-gallery{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}.reveal-ready [data-reveal]{opacity:1!important;transform:none!important}}
.news-api-status{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:.76rem;color:var(--portal-muted);margin:16px 0}.news-api-status button{border:0;background:none;color:#0879b5;font:inherit;cursor:pointer}.news-api-status a{margin-left:auto;color:#0879b5;font-weight:600}.news-card .news-image{display:grid;place-items:center;aspect-ratio:16/10;background:#e7f1f7;overflow:hidden}.news-card .news-image img{width:100%;height:100%;object-fit:cover}.news-card .news-image img.placeholder{width:64px;height:64px;object-fit:contain;opacity:.65}.news-card[data-dynamic-news] .news-title{margin:0}.news-card[data-dynamic-news] .news-date{margin-top:auto}.news-card .news-category{font-size:.7rem;color:#0879b5;font-weight:700}
@media print{.site-header,.header,.site-footer,.page-footer,.portal-toolbar,.portal-task-form,.portal-top,.portal-save,.portal-search-button,.portal-draft{display:none!important}.portal-panel,.news-card{break-inside:avoid;box-shadow:none}body{background:white}}
.unit-home-panel{max-width:1200px;margin:auto;padding:32px;border:1px solid #bfe2ef;border-radius:22px;background:linear-gradient(120deg,#e9f8ff,#f7fbff);color:#163d54}.unit-home-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.unit-home-kicker{font-size:.7rem;letter-spacing:.1em;font-weight:800;color:#0485a3}.unit-home-heading h2{font-size:1.65rem;line-height:1.3;margin:8px 0}.unit-home-heading p,.unit-home-status{font-size:.87rem;color:#56778b;line-height:1.6}.unit-home-link{display:inline-block;padding:13px 18px;border-radius:10px;background:#087fa4;color:#fff;text-decoration:none;font-weight:700;white-space:nowrap}.unit-home-counts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px}.unit-home-counts>div{padding:20px;border:1px solid #d2e5ef;border-radius:14px;background:#fff}.unit-home-counts strong,.unit-home-counts span{display:block}.unit-home-counts strong{font-size:2rem;color:#086e98}.unit-home-counts span{margin-top:8px;color:#607589;font-size:.82rem}#portal-planner[hidden]{display:none}@media(max-width:700px){.unit-home-panel{padding:22px 18px;margin:0 12px}.unit-home-heading{align-items:flex-start;flex-direction:column}.unit-home-counts{grid-template-columns:1fr 1fr;gap:10px}.unit-home-counts>div{padding:16px}}
