/* GENERATED by tools/build.py from src/pages/ed/index.html (its style block and its style="..."
   attributes) - do not edit this file. Edit the source page, then run the build. */
  /* ===================== HOME: page-specific CSS ===================== */
  /* The shared base (palette, nav, buttons, trust strip, hero, why-grid,
     merged base/CTA/footer, responsive) lives in assets/css/styles.css.
     Below: the hero dashboard mock, the product bento and its vignettes,
     and the trusted-by-schools strip, none of which are in the shared sheet. */

  /* The canonical header carries "Try it live" twice (once in .nav-links for
     the mobile menu, once in .nav-cta for desktop). Hide the in-menu copy on
     desktop; the shared sheet reveals it again below 900px. */
  @media (min-width:901px){ .nav-links .btn{display:none} }

  /* Visually hidden text for screen readers */
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

  /* Focus rings on the dark hero and the deep base: white reads clearly on navy */
  .hero a:focus-visible,.base a:focus-visible{outline-color:#fff}

  /* Short note under the hero and CTA buttons */
  .hero-note{margin-top:14px;font-size:.86rem;color:#d6e7f6}
  .cta-text p a{color:#fff;text-decoration:underline;text-underline-offset:3px}
  .cta-text p.cta-note{margin-top:10px;font-size:.9rem;color:#bfd6ea}

  /* ---------- Hero dashboard mock ---------- */
  .mock{position:relative}
  .mock-card{
    background:#fff;border-radius:22px;box-shadow:var(--shadow-lg);
    overflow:hidden;color:var(--ink);transform:perspective(1600px) rotateY(-9deg) rotateX(3deg);
  }
  .mock-top{display:flex;align-items:center;gap:8px;padding:14px 18px;background:#f4f7fb;border-bottom:1px solid var(--border)}
  .mock-top .dots{display:flex;gap:6px}
  .mock-top .dots i{width:10px;height:10px;border-radius:50%;display:block}
  .mock-top .dots i:nth-child(1){background:#ff6058}
  .mock-top .dots i:nth-child(2){background:#ffbd2e}
  .mock-top .dots i:nth-child(3){background:#28c840}
  .mock-top .url{margin-left:10px;font-size:.74rem;color:var(--slate);background:#fff;border:1px solid var(--border);border-radius:7px;padding:4px 12px}
  .mock-body{padding:22px}
  .mock-body .mock-h{font-family:var(--font-head);font-weight:800;font-size:1.04rem;color:var(--blue-900);line-height:1.12;letter-spacing:-.02em;margin-bottom:3px}
  .mock-body .sub{font-size:.78rem;color:var(--slate);margin-bottom:18px}
  .kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
  .kpi{border:1px solid var(--border);border-radius:13px;padding:13px 14px;background:var(--tint-2)}
  .kpi .k-lbl{font-size:.68rem;color:var(--slate);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
  .kpi .k-val{font-family:var(--font-head);font-weight:800;font-size:1.25rem;color:var(--blue-900);margin-top:4px}
  .kpi .k-tag{font-size:.66rem;font-weight:700;margin-top:5px;display:inline-block;padding:2px 8px;border-radius:20px}
  .kpi .up{color:#1f9d57;background:#e4f7ec}
  .kpi .info{color:var(--blue-700);background:#e6f1fb}
  .chart{border:1px solid var(--border);border-radius:13px;padding:14px 16px 8px;background:#fff}
  .chart .c-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
  .chart .c-head span{font-size:.78rem;font-weight:700;color:var(--ink)}
  .chart .c-head em{font-size:.7rem;color:var(--slate);font-style:normal}
  .bars{display:flex;align-items:flex-end;gap:11px;height:96px}
  .bars .bar{flex:1;border-radius:6px 6px 0 0;background:linear-gradient(180deg,var(--blue-500),var(--blue-700))}
  .bars .bar.hl{background:linear-gradient(180deg,#f8b977,var(--orange))}
  .float-chip{
    position:absolute;background:#fff;border-radius:14px;box-shadow:var(--shadow);
    padding:12px 15px;display:flex;align-items:center;gap:11px;color:var(--ink);
  }
  .float-chip .ico{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
  .float-chip .ico svg{width:20px;height:20px}
  .float-chip .t1{font-family:var(--font-head);font-weight:700;font-size:.86rem;color:var(--blue-900);line-height:1.1}
  .float-chip .t2{font-size:.7rem;color:var(--slate)}
  .chip-pay{top:-26px;left:-46px}
  .chip-pay .ico{background:#e4f7ec;color:#1f9d57}
  .chip-cert{bottom:-30px;right:-40px}
  .chip-cert .ico{background:#fdeedd;color:var(--orange-600)}
  /* Where the chips float beside the mock, lift the payment chip clear of the URL bar */
  @media (min-width:981px){ .chip-pay{top:-64px} }
  @media (min-width:981px) and (max-width:1100px){ .chip-cert{right:-14px} }

  /* ===================== THE PRODUCT BENTO ===================== */
  .features{background:var(--tint-2);position:relative;overflow:hidden}
  .features::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background-image:radial-gradient(rgba(27,108,168,.06) 1.4px,transparent 1.4px);
    background-size:30px 30px;
    -webkit-mask-image:radial-gradient(80% 60% at 50% 0%,#000,transparent 75%);
            mask-image:radial-gradient(80% 60% at 50% 0%,#000,transparent 75%);
  }
  .features .wrap{position:relative;z-index:1}

  /* Rows grow to fit their content (no tile clips), and "dense" packing
     back-fills any gap so the grid never shows an empty cell. */
  .bento{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    grid-auto-rows:minmax(172px,auto);
    grid-auto-flow:dense;
    gap:20px;
  }
  .tile{
    position:relative;overflow:hidden;
    border:1px solid var(--border);border-radius:var(--radius);
    background:#fff;box-shadow:var(--shadow-sm);
    padding:22px 22px;
    display:flex;flex-direction:column;
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
  }
  .tile:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#cfe0f0}
  /* spans */
  .t-w2h2{grid-column:span 2;grid-row:span 2}

  .tile-eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:13px}
  .tile-eyebrow .tag{
    width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;
    background:linear-gradient(150deg,#e9f2fb,#d7e9f8);color:var(--blue-700);
  }
  .tile-eyebrow .tag svg{width:18px;height:18px}
  .tile-eyebrow .tt{font-family:var(--font-head);font-weight:700;font-size:1.02rem;color:var(--blue-900);line-height:1.15;letter-spacing:normal;margin:0;display:block}
  .tile-eyebrow .ts{font-size:.74rem;color:var(--slate);margin-top:1px;display:block}
  .tile p.desc{font-size:.9rem;color:var(--slate);line-height:1.5;margin-top:auto}

  /* orange-accented tiles */
  .tile.accent .tile-eyebrow .tag{background:linear-gradient(150deg,#fdeedd,#fbe1c5);color:var(--orange-600)}

  /* dark tiles */
  .tile.dark{
    background:linear-gradient(160deg,#0d3b66,#1b6ca8);border-color:transparent;color:#fff;
  }
  .tile.dark::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:rgba(244,162,89,.16);top:-90px;right:-70px;filter:blur(4px);pointer-events:none}
  .tile.dark::before{content:"";position:absolute;inset:0;pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:30px 30px;
    -webkit-mask-image:radial-gradient(70% 70% at 75% 15%,#000,transparent 80%);mask-image:radial-gradient(70% 70% at 75% 15%,#000,transparent 80%)}
  .tile.dark .tile-eyebrow .tag{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.22)}
  .tile.dark .tile-eyebrow .tt{color:#fff;position:relative;z-index:1}
  .tile.dark .tile-eyebrow .ts{color:#a9cbe6;position:relative;z-index:1}
  .tile.dark p.desc{color:#cfe2f3;position:relative;z-index:1}

  /* The tall portal tile spans 4 rows so it can show the phone, a short
     description and the "coming soon" badge. `zoom` shrinks the phone AND
     reflows the layout to the scaled size. The phone-wrap's auto margins share
     any spare height above and below the phone. */
  .tile.portal{grid-row:span 4}
  .tile.portal .phone-wrap{flex:0 1 auto;min-height:0;overflow:hidden;margin:auto 0}
  .tile.portal .phone{zoom:.9;margin:6px auto 0}
  @media (min-width:1100px){ .tile.portal .phone{zoom:1} }
  .tile.portal p.desc{margin-top:14px;flex:0 0 auto}
  .tile.portal .soon-badge{flex:0 0 auto;align-self:flex-start}

  /* ---- Mini phone (student portal) ---- */
  .phone{
    position:relative;z-index:1;margin:6px auto 0;width:194px;
    background:#0b3357;border-radius:26px;padding:9px;
    box-shadow:0 24px 48px -22px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06) inset;
  }
  .phone .notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:54px;height:6px;border-radius:6px;background:rgba(255,255,255,.25);z-index:3}
  .phone .screen{background:#f6f9fd;border-radius:19px;overflow:hidden;padding-top:22px}
  .phone .p-head{background:linear-gradient(140deg,#0d3b66,#1b6ca8);color:#fff;padding:11px 14px 14px}
  .phone .p-head .pt-lbl{font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:#bcdcf3;font-weight:600}
  .phone .p-head .pt-name{font-family:var(--font-head);font-weight:700;font-size:.86rem;margin-top:1px}
  .phone .p-due{margin:-9px 12px 0;background:#fff;border-radius:13px;padding:11px 13px;box-shadow:0 10px 22px -12px rgba(13,59,102,.4)}
  .phone .p-due .lbl{font-size:.58rem;text-transform:uppercase;letter-spacing:.05em;color:var(--slate);font-weight:600}
  .phone .p-due .amt{font-family:var(--font-head);font-weight:800;font-size:1.28rem;color:var(--blue-900);margin-top:2px}
  .phone .p-due .due{font-size:.62rem;color:#c2762a;font-weight:600;margin-top:1px}
  .phone .p-pay{margin:9px 12px 0;background:var(--orange);color:#3a2208;font-family:var(--font-head);font-weight:700;font-size:.74rem;text-align:center;border-radius:10px;padding:9px 0}
  .phone .p-rows{padding:11px 12px 14px}
  .phone .p-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid #e7eef7}
  .phone .p-row:last-child{border-bottom:0}
  .phone .p-row .pic{width:24px;height:24px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;background:#e4f7ec;color:#1f9d57}
  .phone .p-row .pic.b{background:#e6f1fb;color:var(--blue-700)}
  .phone .p-row .pic svg{width:13px;height:13px}
  .phone .p-row .rt{display:block;font-size:.62rem;font-weight:700;color:var(--ink);line-height:1.1}
  .phone .p-row .rs{display:block;font-size:.55rem;color:var(--slate)}
  .phone .p-row .rv{margin-left:auto;font-size:.62rem;font-weight:700;color:var(--blue-900);font-family:var(--font-head)}
  /* "Student app coming soon" badge on the portal tile */
  .soon-badge{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:.72rem;font-weight:700;color:#fff;background:rgba(0,0,0,.22);border:1px solid rgba(244,162,89,.55);border-radius:20px;padding:5px 12px;position:relative;z-index:1}
  .soon-badge svg{width:13px;height:13px;color:#f8c98a}

  /* ---- Accounting dashboard (wide tile) ---- */
  .acct{position:relative;z-index:1;display:grid;grid-template-columns:.92fr 1.08fr;gap:16px;margin-top:4px;flex:1;align-items:stretch}
  .acct .kgrid{display:flex;flex-direction:column;gap:9px;justify-content:center}
  .acct .kc{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:11px;padding:9px 12px}
  .acct .kc .kl{font-size:.6rem;text-transform:uppercase;letter-spacing:.05em;color:#a9cbe6;font-weight:600}
  .acct .kc .kv{font-family:var(--font-head);font-weight:800;font-size:1.18rem;color:#fff;margin-top:1px}
  .acct .kc .kv em{font-style:normal;font-size:.6rem;color:#7ff0b0;font-weight:700;margin-left:6px}
  .acct .ch{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:13px;padding:13px 14px 11px;display:flex;flex-direction:column}
  .acct .ch .chh{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
  .acct .ch .chh b{font-size:.7rem;font-weight:700;color:#eaf3fb;font-family:var(--font-head)}
  .acct .ch .chh i{font-size:.6rem;font-style:normal;color:#a9cbe6}
  .acct .bars2{display:flex;align-items:flex-end;gap:7px;flex:1;min-height:74px}
  .acct .bars2 .b{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(180deg,#7cc0ef,#2f8fd0)}
  .acct .bars2 .b.hl{background:linear-gradient(180deg,#f8b977,var(--orange))}
  .acct .xax{display:flex;justify-content:space-between;margin-top:6px;font-size:.5rem;color:#8fb6d6;letter-spacing:.02em}

  /* ---- Attendance heat grid ---- */
  .heat{position:relative;z-index:1;margin-top:6px;flex:1;display:flex;flex-direction:column;justify-content:center}
  .heat .hrow{display:flex;align-items:center;gap:5px;margin-bottom:5px}
  .heat .hrow .hl{width:30px;font-size:.58rem;font-weight:700;color:var(--slate);flex:0 0 auto}
  .heat .cell{width:15px;height:15px;border-radius:4px;flex:0 0 auto;background:#e3edf7}
  .heat .cell.l1{background:#cfe6d6}
  .heat .cell.l2{background:#9fd6b1}
  .heat .cell.l3{background:#5fc185}
  .heat .cell.l4{background:#2fae63}
  .heat .cell.ab{background:#f6cdb0}
  .heat .legend{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:.58rem;color:var(--slate)}
  .heat .legend .sw{width:11px;height:11px;border-radius:3px}

  /* ---- Online-class video grid ---- */
  .vgrid{position:relative;z-index:1;margin-top:6px;flex:1;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:7px;min-height:0}
  .vtile{position:relative;border-radius:9px;overflow:hidden;background:linear-gradient(150deg,#13456f,#1f6196);display:flex;align-items:flex-end;justify-content:flex-start;padding:5px}
  .vtile .ava{position:absolute;top:50%;left:50%;transform:translate(-50%,-58%);width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;font-size:.66rem;color:#fff}
  .vtile .nm{position:relative;z-index:1;font-size:.5rem;font-weight:700;color:#fff;background:rgba(0,0,0,.32);border-radius:4px;padding:1px 5px}
  .vtile.live{outline:2px solid var(--orange);outline-offset:-2px}
  .vtile .dotlive{position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:#ff5b5b;box-shadow:0 0 0 3px rgba(255,91,91,.25)}
  .vtile .mic{position:absolute;top:5px;left:5px;width:13px;height:13px;border-radius:4px;background:rgba(0,0,0,.32);display:flex;align-items:center;justify-content:center}
  .vtile .mic svg{width:8px;height:8px;color:#fff}

  /* ---- Certificate w/ seal ---- */
  .cert{position:relative;z-index:1;margin-top:6px;flex:1;background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;box-shadow:inset 0 0 0 3px #f3f7fc, inset 0 0 0 4px var(--border)}
  .cert .ct-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
  .cert .ct-title{font-family:var(--font-head);font-weight:800;font-size:.78rem;color:var(--blue-900);letter-spacing:.02em;text-transform:uppercase}
  .cert .ct-sub{font-size:.56rem;color:var(--slate);margin-top:1px;letter-spacing:.08em;text-transform:uppercase}
  .cert .ct-no{font-size:.55rem;color:var(--slate);font-weight:600;text-align:right;flex:0 0 auto}
  .cert .ct-no b{display:block;color:var(--blue-700);font-family:var(--font-head)}
  .cert .ct-fields{margin-top:14px;display:flex;flex-direction:column;justify-content:space-evenly;gap:11px;flex:1}
  .cert .ct-field{display:flex;align-items:flex-end;gap:10px}
  .cert .ct-field .k{flex:0 0 96px;font-size:.55rem;font-weight:600;color:var(--slate);line-height:1}
  .cert .ct-field .v{height:5px;border-radius:3px;background:#e8eef6}
  .cert .ct-field .v.w1{width:62%}.cert .ct-field .v.w2{width:44%}.cert .ct-field .v.w3{width:30%}
  .cert .ct-foot{display:flex;align-items:flex-end;justify-content:space-between;margin-top:auto;padding-top:12px}
  .cert .ct-sign .sg{font-family:"Plus Jakarta Sans";font-style:italic;font-weight:700;font-size:.8rem;color:#34506b;transform:rotate(-3deg)}
  .cert .ct-sign .sl{font-size:.52rem;color:var(--slate);border-top:1px solid var(--border);padding-top:3px;margin-top:2px}
  .seal{width:52px;height:52px;flex:0 0 auto}

  /* ---- Report card row ---- */
  .rcard{position:relative;z-index:1;margin-top:4px;flex:1;display:flex;flex-direction:column;justify-content:center;gap:7px}
  .rrow{display:grid;grid-template-columns:1fr 54px 40px;align-items:center;gap:8px;font-size:.66rem}
  .rrow .sub{font-weight:700;color:var(--ink)}
  .rrow .track{height:7px;border-radius:5px;background:#e8eef6;overflow:hidden}
  .rrow .fill{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--blue-500),var(--blue-700))}
  .rrow .fill.o{background:linear-gradient(90deg,#f8b977,var(--orange))}
  .rrow .gr{font-family:var(--font-head);font-weight:800;font-size:.74rem;color:var(--blue-900);text-align:right}
  .rcard .rtot{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed var(--border);padding-top:8px;margin-top:2px}
  .rcard .rtot span{font-size:.62rem;color:var(--slate);font-weight:600}
  .rcard .rtot b{font-family:var(--font-head);font-size:.86rem;color:var(--blue-900)}
  .rcard .rtot b em{font-style:normal;color:#1f9d57;font-size:.62rem;margin-left:5px}

  /* ---- Staff DigiLocker tile ---- */
  .kyc{position:relative;z-index:1;margin-top:auto;display:flex;flex-direction:column;gap:9px}
  .kyc .row{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:11px;padding:8px 11px}
  .kyc .row .ic{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;background:rgba(255,255,255,.16);color:#fff}
  .kyc .row .ic svg{width:14px;height:14px}
  .kyc .row .tx{font-size:.68rem;font-weight:700;color:#fff;font-family:var(--font-head)}
  .kyc .row .tx em{display:block;font-style:normal;font-weight:500;font-size:.56rem;color:#bcdcf3;margin-top:0}
  .kyc .row .ok{margin-left:auto;font-size:.56rem;font-weight:700;color:#7ff0b0;display:flex;align-items:center;gap:3px}
  .kyc .row .ok svg{width:11px;height:11px}

  /* ---- simple feature tiles (icon + text) ---- */
  .tile .micro-ico{
    width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(150deg,#e9f2fb,#d7e9f8);color:var(--blue-700);margin-bottom:12px;
  }
  .tile.accent .micro-ico{background:linear-gradient(150deg,#fdeedd,#fbe1c5);color:var(--orange-600)}
  .tile .micro-ico svg{width:23px;height:23px}
  .tile h3{font-size:1.04rem;margin-bottom:6px;font-weight:700}
  .tile h3 + p.desc{margin-top:0}

  /* ===================== WHY SCHOOLS CHOOSE US ===================== */
  .why-visual .why-title{position:relative;z-index:1;font-family:var(--font-head);font-weight:800;color:#fff;font-size:1.7rem;line-height:1.12;letter-spacing:-.02em;margin-bottom:12px}
  .why-item h3{font-size:1.06rem;margin-bottom:4px;font-weight:700}

  /* ===================== TRUSTED BY SCHOOLS ===================== */
  .logo-strip{
    display:flex;align-items:stretch;justify-content:center;gap:22px;flex-wrap:wrap;
    margin:0 auto 44px;max-width:760px;
  }
  .logo-strip .logo-chip{
    flex:0 1 auto;display:flex;align-items:center;justify-content:center;
    background:#fff;border:1px solid var(--border);border-radius:16px;
    padding:18px 26px;box-shadow:var(--shadow-sm);
  }
  .logo-strip .logo-chip img{height:60px;width:auto}

  .tcards{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:920px;margin:0 auto}
  .tcard{
    background:#fff;border:1px solid var(--border);border-radius:var(--radius);
    box-shadow:var(--shadow-sm);padding:28px 30px;display:flex;flex-direction:column;
  }
  .tcard .quote-mark{font-family:var(--font-head);font-weight:800;font-size:2.6rem;color:var(--orange);line-height:.6;height:24px}
  .tcard .quote-mark.close{align-self:flex-end;height:auto;margin-top:10px}
  .tcard blockquote{font-size:1.04rem;color:var(--ink);line-height:1.6;margin:8px 0 0;font-style:italic}
  .tcard .attrib{display:flex;align-items:center;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}
  .tcard .attrib .av{width:42px;height:42px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:.9rem;color:#fff}
  .tcard .attrib .nm{font-family:var(--font-head);font-weight:700;color:var(--blue-900);font-size:.95rem;line-height:1.2;display:block}
  .tcard .attrib .rl{font-size:.8rem;color:var(--slate);display:block;margin-top:1px}

  /* ===================== FOOTER (page-local additions) ===================== */
  .foot-col .foot-h{font-family:var(--font-head);color:#fff;font-size:.85rem;line-height:1.6;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px;font-weight:700}
  .foot-bottom .copy .copy-op{display:block;margin-top:2px}

  /* ===================== REDUCED MOTION ===================== */
  @media (prefers-reduced-motion:reduce){
    .tile{transition:none}
    .tile:hover{transform:none}
  }

  /* ===================== RESPONSIVE (page-specific) ===================== */
  @media (max-width:980px){
    .bento{grid-template-columns:repeat(2,1fr)}
    .t-w2h2{grid-column:span 2}
    .mock-card{transform:none;margin-top:40px;max-width:520px}
    .chip-pay{left:-10px}
    .chip-cert{right:-10px}
  }
  @media (max-width:760px){
    .tcards{grid-template-columns:1fr}
  }
  @media (max-width:560px){
    .bento{grid-template-columns:1fr;grid-auto-rows:auto}
    .t-w2h2,.tile.portal{grid-column:span 1;grid-row:auto}
    .tile{min-height:200px}
    .acct{grid-template-columns:1fr}
    .vgrid{min-height:150px}
    .vtile{min-height:64px}
    .float-chip{position:static;margin-top:14px}
  }
.s-0dfa4bd6{height:42% !important}
.s-101860af{font-size:1.2rem !important}
.s-1514e994{height:83% !important}
.s-18861723{font-size:2.4rem !important;margin:14px 0 30px !important}
.s-18f067f6{background:#2fae63 !important}
.s-1c75fcc1{width:84% !important}
.s-23699087{height:92% !important}
.s-2ea7fe0f{height:60% !important}
.s-35f82652{height:61% !important}
.s-38729897{width:36px !important}
.s-3d2662cf{height:74% !important}
.s-411fa3cd{height:64% !important}
.s-4ac39ccb{background:linear-gradient(150deg,#1b6ca8,#0d3b66) !important}
.s-4c05c69f{height:80% !important}
.s-50374b1b{background:linear-gradient(150deg,#f08c8c,#e05a5a) !important}
.s-5397d2b7{background:#e3edf7 !important}
.s-55df5a83{width:78% !important}
.s-6c79d0eb{width:91% !important}
.s-7205568b{background:linear-gradient(150deg,#9b8cf0,#6d5ae0) !important}
.s-791b859d{height:44% !important}
.s-7acd2c76{background:linear-gradient(150deg,#f4a259,#ed8f3e) !important}
.s-80ae296e{height:90% !important}
.s-a006daa9{background:linear-gradient(150deg,#2f8fd0,#1b6ca8) !important}
.s-a8d24f9a{background:linear-gradient(150deg,#f4a259,#ed8f3e) !important;color:#3a2208 !important}
.s-ab928472{height:72% !important}
.s-b2f47f84{height:52% !important}
.s-cd5fa508{height:71% !important}
.s-d2a7f643{background:linear-gradient(150deg,#5fc185,#2fae63) !important}
.s-d6f2af6e{margin-top:14px !important}
.s-e0c3139f{height:70% !important}
.s-e560174f{height:51% !important}
.s-e7319693{height:66% !important}
.s-fa45bdd5{background:#f6cdb0 !important}