/*
 * Assessment Platform Theme — unified subpage visual layer v1.4.0
 * Homepage is the visual master and is intentionally left untouched.
 * This file styles every NON-home surface without flattening semantic layouts.
 */

/* =========================
   1. Design tokens / base
   ========================= */
body:not(.home){
  --bg:#ffffff;
  --surface:#ffffff;
  --surface-2:#f8fafc;
  --ink:#101828;
  --muted:#667085;
  --line:#e6eaf0;
  --line-strong:#d8dee8;
  --brand:#155eef;
  --brand-2:#155eef;
  --cyan:#155eef;
  --green:#079455;
  --orange:#b54708;
  --red:#d92d20;
  --navy:#101828;
  --shadow:0 18px 50px rgba(16,24,40,.07);
  --shadow-sm:0 8px 24px rgba(16,24,40,.045);
  --r:14px;
  --container:1250px;
  margin:0;
  background:#fff;
  color:var(--ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:400;
  overflow-x:hidden;
}
body:not(.home) *,body:not(.home) *::before,body:not(.home) *::after{box-sizing:border-box}
body:not(.home) img,body:not(.home) svg,body:not(.home) video,body:not(.home) iframe{max-width:100%}
body:not(.home) button,body:not(.home) input,body:not(.home) select,body:not(.home) textarea{font:inherit}
body:not(.home) :where(h1,h2,h3,h4,h5,h6,strong,b,.brand,.brand-copy,.btn,.kicker,.tag,.badge,.tab,.workspace-copy,.metric strong,.stat strong,.price,.check,.user-avatar){font-weight:600}
body:not(.home) .container{width:min(1250px,calc(100% - 40px));margin-left:auto;margin-right:auto}
body:not(.home) main{min-width:0;background:#fff}
body:not(.home) a{overflow-wrap:anywhere}

/* =========================
   2. Header / navigation
   ========================= */
body:not(.home) .topbar{display:none}
body:not(.home) .header{position:sticky;top:0;z-index:80;background:#fff;border-bottom:1px solid var(--line);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
body:not(.home) .nav{height:78px;display:flex;align-items:center;gap:24px;min-width:0}
body:not(.home) .brand{display:flex;align-items:center;gap:10px;font-size:21px;letter-spacing:-.035em;color:#111827;white-space:nowrap}
body:not(.home) .brand-mark{width:38px;height:38px;border-radius:10px;background:#155eef;color:#fff;box-shadow:none;display:grid;place-items:center;flex:0 0 auto}
body:not(.home) .brand small,body:not(.home) .brand-copy small{font-size:9px;letter-spacing:.1em;color:#98a2b3;font-weight:500}
body:not(.home) .navlinks{display:flex;align-items:center;justify-content:center;gap:20px;flex:1;min-width:0}
body:not(.home) .navlinks>li{list-style:none}
body:not(.home) .navlinks>.menu-item>a,body:not(.home) .navitem>a{display:flex;align-items:center;gap:6px;padding:29px 0;font-size:13px;font-weight:600;color:#344054;white-space:nowrap}
body:not(.home) .navlinks>.menu-item>a:hover,body:not(.home) .navitem>a:hover{color:#155eef}
body:not(.home) .navlinks>.menu-item-has-children>a::after,body:not(.home) .navitem>a::after{content:'+';font-size:14px;line-height:1;color:#98a2b3;font-weight:500;margin-left:2px}
body:not(.home) .navlinks>.menu-item:not(.apt-mega):hover>.sub-menu,body:not(.home) .apt-mega-panel,body:not(.home) .mega{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 56px rgba(16,24,40,.11)}
body:not(.home) .navlinks>.menu-item:not(.apt-mega) .sub-menu a,body:not(.home) .apt-mega-link,body:not(.home) .mega a{color:#344054;border-radius:8px}
body:not(.home) .navlinks>.menu-item:not(.apt-mega) .sub-menu a:hover,body:not(.home) .apt-mega-link:hover,body:not(.home) .mega a:hover{background:#f8fafc;color:#155eef}
body:not(.home) .apt-mega-featured,body:not(.home) .mega-highlight{background:#f8fafc;border:1px solid var(--line);border-radius:10px}
body:not(.home) .apt-mega-featured.dark,body:not(.home) .dark-highlight{background:#101828;color:#fff;border-color:#101828}
body:not(.home) .dark-highlight :where(h3,h4,p,small),body:not(.home) .apt-mega-featured.dark :where(h3,h4,p,small){color:#fff}
body:not(.home) .login-link{font-size:12px;color:#475467;font-weight:600}
body:not(.home) .workspace-chip{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:none}
body:not(.home) .user-avatar{background:#eef4ff;color:#155eef}
body:not(.home) .mobile-toggle span{background:#344054}

/* =========================
   3. Buttons / small UI
   ========================= */
body:not(.home) .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:9px;padding:10px 15px;font-size:12.5px;font-weight:600;box-shadow:none;transition:background .15s,border-color .15s,color .15s}
body:not(.home) .btn:hover{transform:none}
body:not(.home) .btn-primary{background:#155eef;color:#fff;border-color:#155eef}
body:not(.home) .btn-primary:hover{background:#004eeb;border-color:#004eeb}
body:not(.home) .btn-secondary{background:#fff;border-color:var(--line-strong);color:#344054}
body:not(.home) .btn-secondary:hover{background:#fafbfc;border-color:#b9c2d0}
body:not(.home) .btn-dark{background:#101828;color:#fff;border-color:#101828}
body:not(.home) .btn-soft{background:#f8fafc;color:#344054;border:1px solid var(--line)}
body:not(.home) .eyebrow{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);color:#475467;padding:7px 10px;border-radius:7px;font-size:10px;letter-spacing:.08em}
body:not(.home) .dot{width:6px;height:6px;border-radius:99px;background:#079455;box-shadow:none}
body:not(.home) .chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:#667085;border-radius:7px;padding:6px 9px;font-size:11px}
body:not(.home) .tag{display:inline-flex;background:#f8fafc;color:#667085;padding:4px 8px;font-size:9px;border:1px solid var(--line);border-radius:6px;letter-spacing:.04em}

/* =========================
   4. Page hero
   ========================= */
body:not(.home) .page-hero,body:not(.home) .workspace-hero{padding:70px 0 62px;background:#fff;border-bottom:1px solid var(--line)}
body:not(.home) .page-hero.compact{padding:44px 0 38px}
body:not(.home) .page-hero .inner{max-width:920px}
body:not(.home) .breadcrumb,body:not(.home) .dash-breadcrumb{font-size:11px;color:#98a2b3;margin-bottom:18px}
body:not(.home) .breadcrumb a:hover{color:#155eef}
body:not(.home) .breadcrumb b,body:not(.home) .dash-breadcrumb b{color:#475467}
body:not(.home) h1,body:not(.home) h2,body:not(.home) h3{letter-spacing:-.038em;line-height:1.1;color:#101828}
body:not(.home) .page-hero h1{font-size:48px;line-height:1.06;margin:18px 0 16px;max-width:900px}
body:not(.home) .page-hero .lead{font-size:16px;line-height:1.75;color:#667085;max-width:760px;margin-bottom:0}
body:not(.home) .gradient-text{background:none;-webkit-background-clip:initial;background-clip:initial;color:#155eef}

/* =========================
   5. Section semantics
   ========================= */
body:not(.home) .page-content{width:100%;min-width:0;background:#fff}
body:not(.home) .page-content .section{padding:72px 0;color:#101828;background:#fff;border-bottom:1px solid #f0f2f5}
body:not(.home) .page-content .section.white{background:#fff}
body:not(.home) .page-content .section.soft{background:#f8fafc}
body:not(.home) .page-content .section.dark{background:#101828;color:#fff;border-bottom-color:#1d2939}
body:not(.home) .page-content .section.dark :where(h2,h3,h4,strong){color:#fff}
body:not(.home) .page-content .section.dark :where(p,.lead){color:#cfd6e2}
body:not(.home) .page-content .section.dark .kicker{color:#98a2b3}
body:not(.home) .section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:28px;min-width:0}
body:not(.home) .section-head>*,body:not(.home) .split>*,body:not(.home) .grid>*{min-width:0}
body:not(.home) .section-head h2,body:not(.home) .section h2{font-size:33px;line-height:1.14;margin-top:0}
body:not(.home) .section-head p{max-width:620px;margin:0;color:#667085;font-size:13px;line-height:1.7}
body:not(.home) .kicker{font-size:10px;letter-spacing:.12em;color:#667085;margin-bottom:9px;text-transform:uppercase;font-weight:600}

/* =========================
   6. Layout primitives
   ========================= */
body:not(.home) .grid{display:grid;gap:16px;min-width:0;width:100%}
body:not(.home) .g2{grid-template-columns:repeat(2,minmax(0,1fr))}
body:not(.home) .g3{grid-template-columns:repeat(3,minmax(0,1fr))}
body:not(.home) .g4{grid-template-columns:repeat(4,minmax(0,1fr))}
body:not(.home) .split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:54px;align-items:center;min-width:0}
body:not(.home) .metric-row{grid-template-columns:repeat(3,minmax(0,1fr))}
body:not(.home) .report-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
body:not(.home) .statband{grid-template-columns:repeat(4,minmax(0,1fr))}
body:not(.home) .lifecycle{grid-template-columns:repeat(8,minmax(0,1fr))}
body:not(.home) .page-content :where(.grid,.split,.mock,.browser,.statband,.report-grid,.metric-row,.lifecycle,.feature-list,.faq,.timeline){max-width:100%;min-width:0}

/* =========================
   7. Cards / modules
   ========================= */
body:not(.home) .card,body:not(.home) .mock,body:not(.home) .filter-sidebar,body:not(.home) .single-sidebar .sidebar-card,body:not(.home) .dash-card,body:not(.home) .builder-panel,body:not(.home) .auth-card,body:not(.home) .workspace-card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:none}
body:not(.home) .card{padding:22px;min-width:0;max-width:100%}
body:not(.home) a.card{display:block}
body:not(.home) .card.hover{transition:transform .15s,border-color .15s,box-shadow .15s}
body:not(.home) .card.hover:hover,body:not(.home) .workspace-card:hover{transform:translateY(-2px);border-color:#c9d2df;box-shadow:0 10px 28px rgba(16,24,40,.055)}
body:not(.home) .card h3{font-size:18px;letter-spacing:-.025em;margin-top:0}
body:not(.home) .card p{font-size:12.5px;line-height:1.65;color:#667085;margin-bottom:0}
body:not(.home) .card :where(h2,h3,h4,p,strong,span,small,li){overflow-wrap:anywhere}
body:not(.home) .mock{padding:18px;box-shadow:var(--shadow-sm)}
body:not(.home) .browser{background:#fff;border-color:var(--line);border-radius:10px}
body:not(.home) .metric{border-color:var(--line);background:#fff;border-radius:9px}
body:not(.home) .metric strong{font-size:19px}
body:not(.home) .metric span{font-size:9px}
body:not(.home) .mini-chart{background:#fff;border:1px solid var(--line)}
body:not(.home) .bars b{background:#155eef}
body:not(.home) .upload{border:1px dashed #b8c2d0;background:#fff;border-radius:10px}
body:not(.home) .step{border-color:var(--line);background:#fff;border-radius:9px;font-size:10.5px;font-weight:600}
body:not(.home) .statband{gap:0;border:1px solid var(--line);background:var(--line);border-radius:12px;overflow:hidden}
body:not(.home) .stat{background:#fff;padding:24px;min-width:0}
body:not(.home) .stat strong{font-size:27px}
body:not(.home) .stat span{font-size:11px}
body:not(.home) .section.dark .statband{border-color:#344054;background:#344054}
body:not(.home) .section.dark .stat{background:#1d2939;color:#fff}
body:not(.home) .section.dark .stat span{color:#cfd6e2}
body:not(.home) .tabs{gap:6px}
body:not(.home) .tab{border-color:var(--line);background:#fff;border-radius:7px;font-size:10.5px;font-weight:500}
body:not(.home) .tab.active{background:#101828;color:#fff;border-color:#101828;font-weight:600}
body:not(.home) .quote{border-left:3px solid #155eef;border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0 12px 12px 0;background:#fff;box-shadow:none}
body:not(.home) .price-card.popular{border:1px solid #a9c3ff;transform:none;box-shadow:none}
body:not(.home) .badge{background:#eef4ff;color:#155eef;font-size:8px}
body:not(.home) .price{font-size:28px;font-weight:600}
body:not(.home) .donut{background:conic-gradient(#155eef 0 74%,#edf0f5 74%)}
body:not(.home) .radar:before{border-color:#155eef;background:rgba(21,94,239,.08)}
body:not(.home) .check{width:22px;height:22px;border-radius:6px;font-size:10px;background:#ecfdf3;color:#079455}
body:not(.home) .meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:10.5px;color:#98a2b3;margin-top:13px;min-width:0}
body:not(.home) .test-card .score{height:4px;background:#eef1f4}
body:not(.home) .test-card .score span{background:#155eef}
body:not(.home) .solution-card ul{font-size:12px;line-height:1.8;color:#667085}

/* semantic icon tile */
body:not(.home) .icon{width:42px;height:42px;min-width:42px;border-radius:10px;background:#f6f8fb;color:#344054;border:1px solid var(--line);display:grid;place-items:center;font-size:0;position:relative;overflow:hidden;margin-bottom:16px}
body:not(.home) .icon::before{content:"";width:20px;height:20px;background-repeat:no-repeat;background-position:center;background-size:20px 20px;opacity:.95;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23344054' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 5 7v10l7 4 7-4V7l-7-4Z'/%3E%3Cpath d='m5 7 7 4 7-4M12 11v10'/%3E%3C/svg%3E")}
body:not(.home) .icon[data-icon="user"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 20c.8-4 3.3-6 7.5-6s6.7 2 7.5 6'/%3E%3C/svg%3E")}
body:not(.home) .icon[data-icon="users"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='9' r='3'/%3E%3Cpath d='M3.5 19c.6-3.4 2.5-5 5.5-5s4.9 1.6 5.5 5M15 6.5a3 3 0 0 1 0 5.5M16 14c2.4.5 3.8 2.2 4.5 5'/%3E%3C/svg%3E")}
body:not(.home) .icon[data-icon="chart"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E")}
body:not(.home) .icon[data-icon="target"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b54708' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Ccircle cx='12' cy='12' r='1'/%3E%3C/svg%3E")}
body:not(.home) .icon[data-icon="sparkles"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 1.2 3.3 3.3 1.2-3.3 1.2L12 12l-1.2-3.3-3.3-1.2 3.3-1.2L12 3ZM18.5 13l.7 1.8 1.8.7-1.8.7-.7 1.8-.7-1.8-1.8-.7 1.8-.7.7-1.8ZM5.5 14l.8 2.2 2.2.8-2.2.8L5.5 20l-.8-2.2-2.2-.8 2.2-.8.8-2.2Z'/%3E%3C/svg%3E")}
body:not(.home) .icon[data-icon="brain"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5.2A3.2 3.2 0 0 0 5.8 8.4c0 .4.1.8.2 1.2A3.6 3.6 0 0 0 6.5 16 3.5 3.5 0 0 0 10 19V5.8c-.3-.4-.6-.6-1-.6ZM15 5.2a3.2 3.2 0 0 1 3.2 3.2c0 .4-.1.8-.2 1.2a3.6 3.6 0 0 1-.5 6.4A3.5 3.5 0 0 1 14 19V5.8c.3-.4.6-.6 1-.6Z'/%3E%3C/svg%3E")}
body:not(.home) .icon[data-icon="book"],body:not(.home) .icon[data-icon="graduation"],body:not(.home) .icon[data-icon="file"],body:not(.home) .icon[data-icon="briefcase"],body:not(.home) .icon[data-icon="settings"],body:not(.home) .icon[data-icon="shield"]{background:#f8fafc}

/* =========================
   8. Timeline / FAQ / CTA
   ========================= */
body:not(.home) .timeline{padding-left:30px}
body:not(.home) .timeline:before{left:10px;width:1px;background:#dbe6ff}
body:not(.home) .timeline-item{padding-bottom:24px}
body:not(.home) .timeline-item:before{left:-24px;width:10px;height:10px;background:#155eef;box-shadow:0 0 0 4px #eef4ff}
body:not(.home) .timeline-item strong{font-size:13px;color:#344054}
body:not(.home) .faq{border-top:1px solid var(--line)}
body:not(.home) .faq details{border-bottom:1px solid var(--line);padding:18px 0}
body:not(.home) .faq summary{font-weight:600;color:#344054}
body:not(.home) .faq p{color:#667085}
body:not(.home) .cta{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:34px;border-radius:14px;background:#101828;color:#fff;border:1px solid #101828;box-shadow:none;min-width:0}
body:not(.home) .cta>div{min-width:0}
body:not(.home) .cta h2,body:not(.home) .cta h3{color:#fff;margin-top:0}
body:not(.home) .cta h2{font-size:30px}
body:not(.home) .cta p{color:#cfd6e2}
body:not(.home) .cta .btn-secondary{background:#fff;color:#101828;border-color:#fff}
body:not(.home) .cta .btn-dark{background:#155eef;border-color:#155eef}

/* =========================
   9. Archive / filter
   ========================= */
body:not(.home) .archive-shell{grid-template-columns:260px minmax(0,1fr);gap:28px;min-width:0}
body:not(.home) .archive-shell>*{min-width:0}
body:not(.home) .filter-sidebar{position:sticky;top:98px;padding:18px}
body:not(.home) .filter-group{border-bottom:1px solid var(--line)}
body:not(.home) .filter-group h4{font-size:13px;color:#344054}
body:not(.home) .filter-check{color:#475467}
body:not(.home) .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;min-width:0}
body:not(.home) .archive-grid>*{min-width:0}
body:not(.home) .archive-toolbar select{border-color:var(--line);border-radius:9px;background:#fff;color:#344054}
body:not(.home) .archive-pagination .page-numbers{border-color:var(--line);background:#fff}
body:not(.home) .archive-pagination .current{background:#155eef;color:#fff;border-color:#155eef}

/* =========================
   10. Single / related
   ========================= */
body:not(.home) .single-shell{grid-template-columns:minmax(0,1fr) 320px;gap:34px;min-width:0}
body:not(.home) .single-shell>*{min-width:0}
body:not(.home) .single-content .entry-content{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;min-width:0;overflow-wrap:anywhere}
body:not(.home) .single-content .entry-content :where(img,video,iframe,table,pre){max-width:100%}
body:not(.home) .single-sidebar{position:sticky;top:98px}
body:not(.home) .single-sidebar .sidebar-card{padding:18px}
body:not(.home) .related-wrap{width:min(1250px,calc(100% - 40px));max-width:1250px;min-width:0;margin:44px auto 0}
body:not(.home) .related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;min-width:0}
body:not(.home) .related-grid>*{min-width:0}
body:not(.home) .related-grid .card{width:100%;height:100%;overflow:hidden}
body:not(.home) .related-grid .card :where(h3,p,.tag,.meta){max-width:100%;overflow-wrap:anywhere}

/* =========================
   11. Tables / overflow-safe rich modules
   ========================= */
body:not(.home) .modern-table,body:not(.home) .mock:has(table){max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
body:not(.home) .modern-table table,body:not(.home) .mock table,body:not(.home) table.table{width:100%;min-width:620px;border-collapse:collapse}
body:not(.home) pre{max-width:100%;overflow:auto}
body:not(.home) code{overflow-wrap:anywhere}

/* =========================
   12. Auth / workspace / account
   ========================= */
body:not(.home) .auth-shell{background:#f8fafc}
body:not(.home) .auth-card{border-radius:14px;box-shadow:var(--shadow-sm)}
body:not(.home) .input-wrap{border-color:var(--line);border-radius:9px}
body:not(.home) .input-wrap:focus-within{border-color:#84adff;box-shadow:0 0 0 3px rgba(21,94,239,.08)}
body:not(.home) .workspace-page{background:#f8fafc}
body:not(.home) .workspace-card{border-radius:14px}
body:not(.home) .workspace-stats{border-color:var(--line);border-radius:14px}
body:not(.home) .account-layout,body:not(.home) .account-main,body:not(.home) .account-panel{min-width:0;max-width:100%}
body:not(.home) .account-nav a{border-radius:8px}
body:not(.home) .account-nav a.active{background:#eef4ff;color:#155eef}

/* =========================
   13. Dashboards
   ========================= */
body:not(.home) .dash,body:not(.home) .dash-main{min-width:0}
body:not(.home) .dash-side{background:#101828;color:#fff}
body:not(.home) .dash-content{background:#f8fafc}
body:not(.home) .dash-card{border-radius:13px;padding:17px}
body:not(.home) .dash-page-head h1{color:#101828}
body:not(.home) .dash-page-head p{color:#667085}
body:not(.home) .metric-label i,body:not(.home) .dash-ico,body:not(.home) .table-icon,body:not(.home) .result-icon{background:#eef4ff;color:#155eef}
body:not(.home) .table-progress span,body:not(.home) .class-progress i,body:not(.home) .trait-bar i,body:not(.home) .spark-bars i{background:#155eef}
body:not(.home) .text-link{color:#155eef}

/* =========================
   14. Footer / floating
   ========================= */
body:not(.home) .footer{background:#fff;border-top:1px solid var(--line);color:#667085;padding:60px 0 26px}
body:not(.home) .footer .brand,body:not(.home) .footer .brand-copy{color:#101828}
body:not(.home) .footer .brand-copy small{color:#98a2b3}
body:not(.home) .footer h4{color:#344054;font-weight:600}
body:not(.home) .footer a{color:#667085}
body:not(.home) .footer a:hover{color:#155eef}
body:not(.home) .footer-desc,body:not(.home) .footer-contact{color:#667085}
body:not(.home) .footer-social a,body:not(.home) .footer-legal-info,body:not(.home) .copyright{color:#98a2b3}
body:not(.home) .copyright{border-top-color:var(--line)}
body:not(.home) .floating-contact a{box-shadow:0 8px 22px rgba(16,24,40,.12)}
body:not(.home) .floating-contact .zalo{background:#155eef}

/* =========================
   15. Small icon UI
   ========================= */
body:not(.home) .ui-icon{width:18px;height:18px;display:inline-block;vertical-align:-3px;flex:0 0 auto;color:currentColor}
body:not(.home) .ui-icon-sm{width:15px;height:15px}
body:not(.home) .workspace-nav-icon{width:17px;height:17px;color:#667085;flex:0 0 auto}
body:not(.home) .btn,body:not(.home) .login-link,body:not(.home) .workspace-chip,body:not(.home) .footer-contact>a,body:not(.home) .footer-contact>span{display:flex;align-items:center;gap:7px}
body:not(.home) .breadcrumb>a:first-child{display:inline-flex;align-items:center;gap:5px}
body:not(.home) .breadcrumb>a:first-child::before{content:"";width:12px;height:12px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2398a2b3' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5 12 4l9 7.5M5.5 10v10h13V10M9.5 20v-6h5v6'/%3E%3C/svg%3E") center/contain no-repeat}

/* =========================
   16. Responsive
   ========================= */
@media(max-width:1180px){
  body:not(.home) .navlinks{gap:14px}
  body:not(.home) .nav{gap:16px}
  body:not(.home) .navlinks>.menu-item>a,body:not(.home) .navitem>a{font-size:12px}
  body:not(.home) .workspace-chip,body:not(.home) .nav-create{display:none}
}
@media(max-width:1050px){
  body:not(.home) .navlinks{display:none}
  body:not(.home) .mobile-toggle{display:flex}
  body:not(.home) .nav.open .navlinks{display:block;position:fixed;left:16px;right:16px;top:82px;max-height:calc(100vh - 100px);overflow:auto;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 60px rgba(17,24,39,.15);padding:8px}
  body:not(.home) .nav.open .navlinks>.menu-item>a,body:not(.home) .nav.open .navitem>a{padding:13px 12px;justify-content:space-between;border-radius:8px}
  body:not(.home) .nav.open .apt-mega-panel,body:not(.home) .nav.open .menu-item>.sub-menu,body:not(.home) .nav.open .mega{position:static!important;width:auto!important;box-shadow:none!important;padding:8px!important;background:#fff}
  body:not(.home) .g3,body:not(.home) .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.home) .split{grid-template-columns:1fr}
  body:not(.home) .lifecycle{grid-template-columns:repeat(4,minmax(0,1fr))}
  body:not(.home) .archive-shell,body:not(.home) .single-shell{grid-template-columns:1fr}
  body:not(.home) .single-sidebar{position:static}
  body:not(.home) .related-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  body:not(.home) .dash{grid-template-columns:1fr}
}
@media(max-width:768px){
  body:not(.home) .container{width:min(1250px,calc(100% - 28px))}
  body:not(.home) .nav{height:68px}
  body:not(.home) .nav-actions .login-link{display:none}
  body:not(.home) .nav.open .navlinks{top:76px}
  body:not(.home) .page-hero,body:not(.home) .workspace-hero{padding:50px 0 46px}
  body:not(.home) .page-hero h1{font-size:38px}
  body:not(.home) .page-hero .lead{font-size:14.5px}
  body:not(.home) .page-content .section{padding:56px 0}
  body:not(.home) .section-head{align-items:flex-start;flex-direction:column}
  body:not(.home) .section-head h2,body:not(.home) .section h2{font-size:28px}
  body:not(.home) .g2,body:not(.home) .g3,body:not(.home) .g4{grid-template-columns:1fr}
  body:not(.home) .report-grid{grid-template-columns:1fr}
  body:not(.home) .metric-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.home) .statband{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.home) .lifecycle{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.home) .cta{align-items:flex-start;flex-direction:column;padding:26px}
  body:not(.home) .cta h2{font-size:25px}
  body:not(.home) .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.home) .related-wrap{width:min(1250px,calc(100% - 28px))}
  body:not(.home) .related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.home) .single-content .entry-content{padding:22px}
  body:not(.home) .archive-toolbar{align-items:flex-start;flex-direction:column}
  body:not(.home) .filter-sidebar{display:block!important;position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:min(360px,88vw)!important;z-index:120!important;border-radius:0 18px 18px 0!important;overflow:auto;transform:translateX(-105%);transition:transform .22s ease;box-shadow:0 20px 60px rgba(16,24,40,.24)!important}
  body:not(.home) .filter-sidebar.open{transform:translateX(0)}
  body:not(.home) .modern-table{display:block;overflow-x:auto}
  body:not(.home) .account-nav{display:flex;overflow-x:auto;overflow-y:hidden}
  body:not(.home) .account-nav>a{flex:0 0 auto;white-space:nowrap}
}
@media(max-width:480px){
  body:not(.home) .container{width:min(1250px,calc(100% - 24px))}
  body:not(.home) .page-hero h1{font-size:34px}
  body:not(.home) .metric-row,body:not(.home) .statband,body:not(.home) .lifecycle{grid-template-columns:1fr}
  body:not(.home) .archive-grid,body:not(.home) .related-grid{grid-template-columns:1fr}
  body:not(.home) .related-wrap{width:min(1250px,calc(100% - 24px))}
  body:not(.home) .card{padding:18px}
  body:not(.home) .mock{padding:14px}
}

/* Dashboard tables: scroll inside the card instead of expanding the document on phones. */
@media(max-width:768px){
  body:not(.home) .dash-card:has(> .modern-table),
  body:not(.home) .panel-wide:has(> .modern-table){overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  body:not(.home) table.modern-table{min-width:620px;max-width:none}
}

/* Dashboard two-panel layouts need to stack before the 1200px test breakpoint. */
@media(max-width:1280px){
  body:not(.home) .dashboard-panels,
  body:not(.home) .dashboard-panels.lower{grid-template-columns:minmax(0,1fr)}
}

/* Dashboard off-canvas navigation must be removed from grid flow on tablet/mobile. */
@media(max-width:1050px){
  body:not(.home) .dash{display:block;min-height:100vh}
  body:not(.home) .dash-side{position:fixed!important;left:0;top:0;bottom:0;width:248px;height:100vh;overflow-y:auto;z-index:150;transform:translateX(-105%);transition:transform .2s ease;box-shadow:18px 0 46px rgba(16,24,40,.18)}
  body:not(.home) .dash.side-open .dash-side{transform:translateX(0)}
  body:not(.home) .dash-main{width:100%;min-width:0}
  body:not(.home) .dash-menu-btn{display:block}
}