@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,600;0,700;1,400&family=Source+Sans+3:wght@300;400;500;600;700&display=swap");
      :root {
        --nv: #0d1f3c;
        --nv2: #1a3460;
        --st: #1e5fa4;
        --tl: #0d7a6e;
        --gd: #a67c2a;
        --gd2: #d4a84b;
        --gd3: #fdf5e0;
        --bg: #eef2f7;
        --card: #fff;
        --bdr: #c8d8e8;
        --tx: #111827;
        --mu: #5b6e84;
        --grn: #166534;
        --red: #991b1b;
        --amb: #92400e;
        --pale: #e8eff8;
        --lb: #d0e4f4;
        --iy: #fffbea;
        --shad: 0 1px 12px rgba(13, 31, 60, 0.08);
        --fs: 12.5px;
      }
      * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }
      body {
        font-family: "Source Sans 3", sans-serif;
        background: var(--bg);
        color: var(--tx);
        font-size: var(--fs);
      }

      /* WIZARD */
      #wizard {
        position: fixed;
        inset: 0;
        background: linear-gradient(
          150deg,
          var(--nv) 0%,
          #0a2a5e 60%,
          #0d3d7a 100%
        );
        z-index: 9999;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        overflow-y: auto;
        padding: 24px 12px;
      }
      .wbox {
        background: #fff;
        border-radius: 16px;
        width: min(900px, 99vw);
        box-shadow: 0 40px 100px rgba(0, 0, 0, 0.5);
      }
      .whead {
        background: var(--nv);
        padding: 24px 32px 20px;
        border-radius: 16px 16px 0 0;
        position: relative;
        overflow: hidden;
      }
      .whead::after {
        content: "";
        position: absolute;
        bottom: -20px;
        right: -20px;
        width: 100px;
        height: 100px;
        border-radius: 50%;
        background: rgba(166, 124, 42, 0.12);
        pointer-events: none;
      }
      .whead h1 {
        font-family: "Lora", serif;
        color: #fff;
        font-size: 20px;
        margin-bottom: 3px;
      }
      .whead p {
        color: var(--gd2);
        font-size: 11.5px;
      }
      .wsteps {
        display: flex;
        background: #f0f5fa;
        border-bottom: 1px solid var(--bdr);
        overflow-x: auto;
      }
      .wstep {
        padding: 10px 14px;
        font-size: 10.5px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        color: var(--mu);
        border-bottom: 3px solid transparent;
        cursor: pointer;
        white-space: nowrap;
        transition: 0.15s;
      }
      .wstep.active {
        color: var(--nv);
        border-color: var(--gd);
      }
      .wstep.done {
        color: var(--tl);
      }
      .wbody {
        padding: 24px 32px;
        min-height: 340px;
      }
      .wnav {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 14px 32px;
        background: #f0f5fa;
        border-top: 1px solid var(--bdr);
        border-radius: 0 0 16px 16px;
      }
      .wpage {
        display: none;
      }
      .wpage.act {
        display: block;
      }

      /* FORMS */
      .fgrid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
      }
      .fgrid3 {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 12px;
      }
      .fgrid4 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
      }
      .fg {
        display: flex;
        flex-direction: column;
        gap: 4px;
      }
      .fg.full {
        grid-column: 1/-1;
      }
      label.fl {
        font-size: 10.5px;
        font-weight: 700;
        color: var(--nv2);
        text-transform: uppercase;
        letter-spacing: 0.4px;
      }
      input[type="text"],
      input[type="number"],
      input[type="date"],
      select,
      textarea {
        width: 100%;
        padding: 7px 10px;
        border: 1.5px solid var(--bdr);
        border-radius: 6px;
        font-size: 12.5px;
        font-family: "Source Sans 3", sans-serif;
        background: #fafcff;
        color: var(--tx);
        outline: none;
        transition: border-color 0.15s;
      }
      input:focus,
      select:focus,
      textarea:focus {
        border-color: var(--st);
        background: #fff;
      }
      textarea {
        resize: vertical;
        min-height: 52px;
      }
      .rg {
        display: flex;
        flex-wrap: wrap;
        gap: 7px;
        margin-top: 3px;
      }
      .ropt {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 6px 12px;
        border: 1.5px solid var(--bdr);
        border-radius: 6px;
        cursor: pointer;
        font-size: 12px;
        font-weight: 500;
        transition: 0.15s;
      }
      .ropt:hover {
        border-color: var(--st);
      }
      .ropt.sel {
        border-color: var(--st);
        background: var(--lb);
        font-weight: 700;
        color: var(--nv);
      }
      .ropt input {
        display: none;
      }
      .sdiv {
        font-size: 10.5px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        color: var(--nv2);
        padding: 9px 0 5px;
        border-bottom: 2px solid var(--lb);
        margin: 12px 0 10px;
      }
      .btn {
        padding: 8px 18px;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer;
        border: none;
        transition: 0.18s;
        font-family: "Source Sans 3", sans-serif;
        letter-spacing: 0.2px;
      }
      .btn-nv {
        background: var(--nv);
        color: #fff;
      }
      .btn-nv:hover {
        background: var(--nv2);
      }
      .btn-gd {
        background: var(--gd);
        color: #fff;
      }
      .btn-gd:hover {
        background: var(--gd2);
        color: var(--nv);
      }
      .btn-tl {
        background: var(--tl);
        color: #fff;
      }
      .btn-sm {
        padding: 5px 11px;
        font-size: 11px;
      }
      .btn-out {
        background: transparent;
        border: 1.5px solid var(--st);
        color: var(--st);
      }
      .btn-out:hover {
        border-color: var(--st);
        background: var(--pale);
        color: var(--nv);
      }
      .btn-out-lt {
        background: transparent;
        border: 1.5px solid rgba(255, 255, 255, 0.6);
        color: #fff;
      }
      .btn-out-lt:hover {
        background: rgba(255, 255, 255, 0.15);
        border-color: #fff;
      }
      .btn-del {
        background: #fff;
        border: 1px solid var(--red);
        color: var(--red);
        padding: 4px 10px;
        font-size: 11px;
        border-radius: 4px;
        white-space: nowrap;
        height: 32px;
        align-self: flex-end;
      }
      .ibox {
        background: var(--iy);
        border: 1px solid #e0c860;
        border-radius: 7px;
        padding: 9px 13px;
        font-size: 11.5px;
        color: #5a4000;
        margin-bottom: 12px;
      }

      /* LOAN CARD */
      .lcard {
        background: var(--pale);
        border: 1px solid var(--bdr);
        border-radius: 8px;
        padding: 11px;
        margin-bottom: 7px;
      }
      .lrow {
        display: flex;
        flex-wrap: wrap;
        gap: 7px;
        align-items: flex-end;
      }
      .lrow label.fl {
        font-size: 9.5px;
      }
      .lrow .fg {
        min-width: 110px;
        flex: 1;
      }
      .lrow .fg.fg-sm {
        min-width: 80px;
        flex: 0 0 80px;
      }
      .lrow .fg.fg-del {
        flex: 0 0 auto;
        min-width: unset;
      }

      /* APP HEADER */
      #app {
        display: none;
      }
      .hdr {
        background: var(--nv);
        height: 52px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 18px;
        position: sticky;
        top: 0;
        z-index: 200;
        box-shadow: 0 2px 14px rgba(13, 31, 60, 0.35);
      }
      .hbrand {
        display: flex;
        align-items: center;
        gap: 9px;
      }
      .hlogo {
        width: 30px;
        height: 30px;
        background: var(--gd);
        border-radius: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: "Lora", serif;
        font-size: 12px;
        font-weight: 700;
        color: var(--nv);
        transition: opacity 0.2s;
      }
      .hlogo:hover {
        opacity: 0.75;
      }
      .htxt .firm {
        font-family: "Lora", serif;
        color: #fff;
        font-size: 14px;
      }
      .htxt .tag {
        font-size: 9.5px;
        color: var(--gd2);
        letter-spacing: 0.3px;
      }
      .htitle {
        color: rgba(255, 255, 255, 0.65);
        font-size: 10.5px;
        letter-spacing: 0.6px;
        text-transform: uppercase;
      }
      .hact {
        display: flex;
        gap: 5px;
        align-items: center;
      }
      .btn-pro {
        background: linear-gradient(135deg, #a67c2a, #d4a84b);
        color: #fff;
        border: none;
        font-weight: 700;
      }
      .btn-pro:hover {
        background: linear-gradient(135deg, #8b6520, #c49535);
        transform: scale(1.03);
      }
      /* MANUAL EDIT MODE */
      .edit-mode-active .tbl td.editable-cell {
        background: #fffbea !important;
        cursor: text;
        position: relative;
      }
      .edit-mode-active .tbl td.editable-cell::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 2px;
        right: 2px;
        height: 2px;
        background: #e0a800;
        border-radius: 1px;
        pointer-events: none;
      }
      .edit-mode-active .tbl td.editable-cell:hover {
        background: #fef9c3 !important;
      }
      .edit-mode-active .tbl td.editable-cell input {
        width: 100%;
        min-width: 70px;
        padding: 2px 4px;
        border: 1.5px solid #d4a84b !important;
        border-radius: 3px;
        background: #fffbea !important;
        font-size: 11.5px;
        font-family: inherit;
        text-align: right;
        color: #7a4f00;
        font-weight: 600;
        outline: none;
        box-shadow: 0 0 0 2px rgba(212, 168, 75, 0.15);
      }
      .edit-mode-active .tbl td.editable-cell input:focus {
        border-color: #a67c2a !important;
        background: #fef9c3 !important;
        box-shadow: 0 0 0 3px rgba(166, 124, 42, 0.2);
      }
      /* Edit mode indicator badge on downstream forms */
      .edit-mode-indicator {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: #fef3c7;
        color: #92400e;
        border: 1px solid #d4a84b;
        border-radius: 12px;
        padding: 3px 10px;
        font-size: 10.5px;
        font-weight: 700;
        white-space: nowrap;
        cursor: pointer;
      }
      .edit-mode-indicator:hover {
        background: #fde68a;
      }
      .edit-mode-btn-on {
        background: #a67c2a !important;
        color: #fff !important;
        border-color: #a67c2a !important;
      }
      .edit-mode-banner {
        background: linear-gradient(135deg, #fdf5e0, #fef3c7);
        border: 1.5px solid #d4a84b;
        border-radius: 8px;
        padding: 9px 14px;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 8px;
        font-size: 11.5px;
        color: #7a4f00;
      }
      .edit-mode-banner strong {
        color: #a67c2a;
      }

      /* BLUR LOCK for non-Pro projection years 2-5 */
      .col-locked {
        filter: blur(4px);
        user-select: none;
        pointer-events: none;
        opacity: 0.7;
      }
      .col-locked-hdr {
        filter: blur(3px);
        user-select: none;
        pointer-events: none;
        opacity: 0.7;
      }
      .lock-overlay {
        position: sticky;
        top: 50%;
        left: 50%;
        transform: translateY(-50%);
        display: none;
        align-items: center;
        justify-content: center;
        z-index: 100;
        pointer-events: auto;
        padding: 8px 0;
      }
      .lock-overlay-inner {
        background: rgba(13, 31, 60, 0.92);
        color: #fff;
        border-radius: 10px;
        padding: 12px 18px;
        text-align: center;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
        cursor: pointer;
      }
      .lock-overlay-inner:hover {
        background: rgba(30, 95, 164, 0.95);
      }
      #app.pro-unlocked .col-locked {
        filter: none;
        user-select: auto;
        pointer-events: auto;
        opacity: 1;
      }
      #app.pro-unlocked::after {
        display: none !important;
      }
      #app.pro-unlocked .col-locked-hdr {
        filter: none;
        user-select: auto;
        pointer-events: auto;
        opacity: 1;
      }
      #app.pro-unlocked .lock-overlay {
        display: none !important;
      }
      @media print {
        .col-locked td,
        .col-locked th {
          color: transparent !important;
          background: #f0f0f0 !important;
        }
        .col-locked td::after {
          content: "🔒";
          color: #9ca3af;
          font-size: 10px;
        }
        .lock-overlay {
          display: none !important;
        }
      }
      .pro-toast {
        position: fixed;
        bottom: 24px;
        left: 50%;
        transform: translateX(-50%);
        background: #0d1f3c;
        color: #fff;
        padding: 10px 22px;
        border-radius: 24px;
        font-size: 12px;
        font-weight: 600;
        z-index: 9999;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
        display: none;
        align-items: center;
        gap: 10px;
        white-space: nowrap;
      }
      .pro-toast.show {
        display: flex;
      }
      /* WATERMARK */
      #app::after {
        content: "JS & Co";
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) rotate(-35deg);
        font-size: 140px;
        font-family: "Arial", sans-serif;
        font-weight: 700;
        color: rgba(150, 150, 150, 0.2);
        white-space: nowrap;
        pointer-events: none;
        z-index: 9000;
        user-select: none;
        letter-spacing: 12px;
        text-transform: uppercase;
        cursor: pointer;
      }
      #app.pro-unlocked::after {
        display: none;
      }
      @media print {
        #app::after {
          color: rgba(140, 140, 140, 0.25);
          position: fixed;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%) rotate(-35deg);
          font-size: 140px;
        }
      }
      .badge {
        font-size: 10px;
        font-weight: 700;
        padding: 2px 8px;
        border-radius: 10px;
      }
      .badge-gd {
        background: rgba(166, 124, 42, 0.22);
        color: var(--gd2);
      }
      .badge-tl {
        background: rgba(13, 122, 110, 0.22);
        color: #7ecdc5;
      }
      .badge-wn {
        background: rgba(220, 100, 50, 0.25);
        color: #ffae80;
      }

      /* TABS */
      .tabbar {
        background: var(--nv2);
        display: flex;
        padding: 0 18px;
        overflow-x: auto;
        gap: 1px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.07);
        position: sticky;
        top: 52px;
        z-index: 190;
      }
      .tabbar::-webkit-scrollbar {
        height: 3px;
      }
      .tbtn {
        padding: 9px 13px;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: rgba(255, 255, 255, 0.45);
        cursor: pointer;
        border: none;
        background: transparent;
        border-bottom: 3px solid transparent;
        white-space: nowrap;
        transition: 0.15s;
      }
      .tbtn:hover {
        color: rgba(255, 255, 255, 0.8);
      }
      .tbtn.active {
        color: var(--gd2);
        border-color: var(--gd);
      }

      /* MAIN */
      .main {
        padding: 16px 18px;
        max-width: 1800px;
        margin: 0 auto;
      }
      .panel {
        display: none;
      }
      .panel.active {
        display: block;
      }

      /* TABLES */
      .card {
        background: var(--card);
        border-radius: 10px;
        border: 1px solid var(--bdr);
        overflow: hidden;
        box-shadow: var(--shad);
        margin-bottom: 16px;
      }
      .card-h {
        background: var(--nv);
        padding: 10px 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      .card-h h2 {
        font-family: "Lora", serif;
        color: #fff;
        font-size: 14px;
        font-weight: 400;
      }
      .tbl {
        width: 100%;
        border-collapse: collapse;
        font-size: 11.5px;
      }
      .tbl th {
        background: var(--nv2);
        color: #fff;
        padding: 6px 9px;
        font-size: 10px;
        font-weight: 700;
        text-align: right;
        white-space: nowrap;
      }
      .tbl th:first-child,
      .tbl th.la {
        text-align: left;
        min-width: 200px;
      }
      .tbl th.act-h {
        background: #1f3c6a;
        border-right: 1px solid rgba(255, 255, 255, 0.08);
      }
      .tbl td {
        padding: 4px 9px;
        border-bottom: 1px solid var(--bdr);
        text-align: right;
        white-space: nowrap;
      }
      .tbl td:first-child {
        text-align: left;
      }
      .tbl tr.sec > td {
        background: var(--pale);
        font-weight: 700;
        font-size: 10.5px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: var(--nv2);
        padding: 5px 9px;
        border-bottom: 1px solid var(--lb);
      }
      .tbl tr.tot > td {
        background: #f3f8ff;
        font-weight: 700;
        border-top: 1.5px solid var(--lb);
        border-bottom: 1.5px solid var(--lb);
      }
      .tbl tr.grand > td {
        background: var(--nv);
        color: #fff;
        font-weight: 700;
        font-size: 12px;
      }
      .tbl tr.ital > td:first-child {
        font-style: italic;
        color: var(--mu);
        font-size: 11px;
      }
      .tbl tr.ind > td:first-child {
        padding-left: 20px;
        color: var(--mu);
      }
      .tbl tr.ind2 > td:first-child {
        padding-left: 32px;
        color: var(--mu);
      }
      .tbl tr:hover:not(.sec):not(.tot):not(.grand) {
        background: var(--pale);
      }
      .tbl td.act {
        background: #fafcff;
      }
      .tbl td.neg {
        color: var(--red);
        font-weight: 600;
      }
      .tbl td.pos {
        color: var(--grn);
        font-weight: 600;
      }
      .tbl td.pct {
        color: var(--mu);
        font-style: italic;
        font-size: 11px;
      }

      /* ASSUMPTION GRID */
      .asmp-wrap {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(580px, 1fr));
        gap: 14px;
      }
      .acard {
        background: var(--card);
        border-radius: 9px;
        border: 1px solid var(--bdr);
        overflow: hidden;
        box-shadow: var(--shad);
      }
      .ahead {
        background: var(--nv2);
        color: #fff;
        padding: 8px 13px;
        font-size: 10.5px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
      }
      .atbl {
        width: 100%;
        border-collapse: collapse;
        font-size: 11px;
      }
      .atbl th {
        background: var(--pale);
        padding: 5px 7px;
        font-size: 9.5px;
        font-weight: 700;
        text-align: right;
        color: var(--nv);
        border-bottom: 1px solid var(--bdr);
      }
      .atbl th:first-child {
        text-align: left;
        min-width: 180px;
      }
      .atbl th.act-h {
        background: var(--lb);
      }
      .atbl td {
        padding: 2px 3px;
        border-bottom: 1px solid var(--bdr);
      }
      .atbl td:first-child {
        padding: 3px 7px;
        font-size: 11px;
        color: var(--mu);
      }
      .atbl input[type="number"] {
        width: 100%;
        padding: 3px 5px;
        border: 1px solid var(--bdr);
        border-radius: 4px;
        font-size: 11px;
        text-align: right;
        background: var(--iy);
        font-family: "Source Sans 3", sans-serif;
      }
      .atbl input:focus {
        border-color: var(--st);
        background: #fff;
        outline: none;
      }
      .atbl input.act-in {
        background: #eef6ff;
      }
      .atbl input:disabled {
        background: #f0f0f0;
        color: #aaa;
        cursor: not-allowed;
      }
      .add-row {
        margin: 5px 7px;
        padding: 4px 10px;
        font-size: 10.5px;
        font-weight: 600;
        background: var(--pale);
        border: 1px dashed var(--bdr);
        border-radius: 5px;
        cursor: pointer;
        color: var(--nv2);
      }
      .add-row:hover {
        border-color: var(--st);
        background: var(--lb);
      }
      .rm-row {
        padding: 1px 6px;
        font-size: 10px;
        background: #fff;
        border: 1px solid #ddd;
        border-radius: 3px;
        cursor: pointer;
        color: #888;
      }
      .rm-row:hover {
        border-color: var(--red);
        color: var(--red);
      }

      /* KPIs */
      .kpi-row {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-bottom: 16px;
      }
      .kpi {
        background: var(--card);
        border-radius: 9px;
        padding: 12px 16px;
        min-width: 150px;
        flex: 1;
        border: 1px solid var(--bdr);
        border-left: 4px solid var(--bdr);
        box-shadow: var(--shad);
      }
      .kpi.gd {
        border-left-color: var(--grn);
      }
      .kpi.wn {
        border-left-color: var(--amb);
      }
      .kpi.bd {
        border-left-color: var(--red);
      }
      .kpi-l {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        color: var(--mu);
      }
      .kpi-v {
        font-size: 20px;
        font-weight: 700;
        color: var(--nv);
        margin: 3px 0 2px;
        letter-spacing: -0.4px;
      }
      .kpi.gd .kpi-v {
        color: var(--grn);
      }
      .kpi.wn .kpi-v {
        color: var(--amb);
      }
      .kpi.bd .kpi-v {
        color: var(--red);
      }
      .kpi-s {
        font-size: 10px;
        color: var(--mu);
      }

      /* CHART */
      .cg {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
        margin-bottom: 16px;
      }
      .cc {
        background: var(--card);
        border-radius: 9px;
        border: 1px solid var(--bdr);
        padding: 14px;
        box-shadow: var(--shad);
      }
      .cc h3 {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        color: var(--nv);
        margin-bottom: 10px;
      }
      .cc canvas {
        max-height: 220px;
      }

      /* MODAL */
      .modal {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9999;
        align-items: center;
        justify-content: center;
      }
      .modal.open {
        display: flex;
      }
      /* Welcome modal */
      #welcome-modal .mbox {
        max-width: 780px;
        width: 96vw;
        max-height: 88vh;
        padding: 0;
        overflow: hidden;
        border-radius: 14px;
      }
      #welcome-modal .wm-header {
        background: linear-gradient(120deg, #0d1f3c 0%, #1e5fa4 100%);
        padding: 22px 28px 18px;
        color: #fff;
      }
      #welcome-modal .wm-body {
        padding: 20px 28px;
        overflow-y: auto;
        max-height: calc(88vh - 140px);
      }
      #welcome-modal .wm-footer {
        padding: 14px 28px;
        border-top: 1px solid #e5e7eb;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #f9fafb;
      }
      #welcome-modal .step-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
        margin-bottom: 18px;
      }
      #welcome-modal .step-card {
        background: #f0f7ff;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        padding: 12px 14px;
      }
      #welcome-modal .step-num {
        width: 22px;
        height: 22px;
        background: #1e5fa4;
        color: #fff;
        border-radius: 50%;
        font-size: 11px;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 7px;
      }
      #welcome-modal .tip-row {
        display: flex;
        gap: 8px;
        align-items: flex-start;
        padding: 7px 0;
        border-bottom: 1px solid #f3f4f6;
      }
      #welcome-modal .tip-row:last-child {
        border-bottom: none;
      }
      #welcome-modal .tip-icon {
        font-size: 15px;
        line-height: 1;
        margin-top: 1px;
        flex-shrink: 0;
      }
      .modal.open {
        display: flex;
      }
      .mbox {
        background: #fff;
        border-radius: 12px;
        padding: 24px;
        width: min(480px, 96vw);
        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3);
        max-height: 90vh;
        overflow-y: auto;
      }
      .mbox h2 {
        font-family: "Lora", serif;
        font-size: 17px;
        color: var(--nv);
        margin-bottom: 4px;
      }

      /* BS CHECK */
      .bs-check {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 10.5px;
        font-weight: 700;
        padding: 3px 9px;
        border-radius: 8px;
      }
      .bs-check.ok {
        background: #d1fae5;
        color: #065f46;
      }
      .bs-check.fail {
        background: #fee2e2;
        color: #991b1b;
      }
      @keyframes bs-pulse {
        0%,
        100% {
          background: #fee2e2;
          color: #991b1b;
        }
        50% {
          background: #dc2626;
          color: #fff;
        }
      }
      @keyframes calc-spin {
        to {
          transform: rotate(360deg);
        }
      }

      /* OPTIMISE PANEL */
      .opt-panel {
        background: var(--iy);
        border: 1px solid #e0c860;
        border-radius: 8px;
        padding: 12px 16px;
        margin-bottom: 14px;
      }
      .opt-panel h3 {
        font-size: 11.5px;
        font-weight: 700;
        color: #5a4000;
        margin-bottom: 8px;
        text-transform: uppercase;
        letter-spacing: 0.4px;
      }
      .opt-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 8px;
      }
      .opt-item {
        background: #fff;
        border-radius: 6px;
        border: 1px solid #e0c860;
        padding: 7px 10px;
      }
      .opt-item label {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        color: var(--mu);
        display: block;
        margin-bottom: 3px;
      }

      /* ── MOBILE ── */
      @media (max-width: 768px) {
        /* Header */
        .hdr {
          padding: 0 10px;
          height: 48px;
        }
        .htxt .tag {
          display: none;
        }
        .hact .btn-sm {
          font-size: 10px;
          padding: 4px 8px;
        }
        /* Tabs */
        .tabbar {
          padding: 0 4px;
          top: 48px;
        }
        .tab {
          padding: 8px 9px;
          font-size: 9px;
          letter-spacing: 0;
        }
        /* Main */
        .main {
          padding: 8px 6px;
        }
        /* Cards */
        .card-h {
          padding: 8px 12px;
          flex-wrap: wrap;
          gap: 4px;
        }
        /* Wizard */
        #wizard {
          padding: 10px 6px;
          align-items: flex-start;
        }
        .wbox {
          border-radius: 10px;
          width: 100%;
        }
        .wsteps {
          overflow-x: auto;
          -webkit-overflow-scrolling: touch;
        }
        .wstep {
          padding: 7px 10px;
          font-size: 9px;
        }
        .wbody {
          padding: 14px 12px;
          min-height: auto;
        }
        .wnav {
          padding: 10px 12px;
          flex-wrap: wrap;
          gap: 8px;
        }
        .wnav .btn {
          font-size: 11px;
          padding: 7px 14px;
        }
        /* Form grids */
        .fgrid {
          grid-template-columns: 1fr;
        }
        .fgrid3 {
          grid-template-columns: 1fr;
        }
        .fgrid4 {
          grid-template-columns: 1fr 1fr;
        }
        /* Loan row */
        .lrow {
          grid-template-columns: 1fr 1fr;
          gap: 5px;
        }
        /* KPIs */
        .kpi-row {
          gap: 6px;
        }
        .kpi {
          min-width: calc(50% - 6px);
          padding: 9px 10px;
        }
        /* Charts */
        .cg {
          grid-template-columns: 1fr;
        }
        /* Assumptions */
        .asmp-wrap {
          grid-template-columns: 1fr;
        }
        /* Tables — horizontal scroll on screen only, not print */
        @media not print {
          .card {
            overflow-x: auto;
          }
          table {
            min-width: 580px;
          }
        }
        /* Modals */
        .mbox {
          width: 96vw;
          padding: 14px;
          max-height: 90vh;
          overflow-y: auto;
        }
        .mbox h2 {
          font-size: 14px;
        }
        /* Welcome modal — keep footer always reachable */
        #welcome-modal .mbox {
          max-width: 100%;
          max-height: 96vh;
          border-radius: 10px;
        }
        #welcome-modal .wm-body,
        #welcome-modal > .mbox > div[style*="overflow-y:auto"] {
          padding: 10px 12px !important;
        }
        #welcome-modal .step-grid,
        #welcome-modal
          > .mbox
          > div
          > div[style*="grid-template-columns:repeat(2"] {
          grid-template-columns: 1fr !important;
        }
        /* Opt grid */
        .opt-grid {
          grid-template-columns: 1fr;
        }
      }
      @media (max-width: 480px) {
        .kpi {
          min-width: 100%;
        }
        .fgrid4 {
          grid-template-columns: 1fr;
        }
        .hact .btn-sm:not(:last-child):not(#edit-mode-btn):not(#pro-btn) {
          display: none;
        }
        #edit-mode-btn {
          display: flex !important;
        }
      }

      /* Print-only warning divs — hidden on screen always, only appear in @media print when .show is set */
      #print-bs-warn,
      #print-edit-note {
        display: none !important;
      }

      /* PRINT */
      @media print {
        @page {
          size: A4 landscape;
          margin: 10mm;
        }
        /* Mobile browsers ignore @page size - ensure content fits portrait width too */
        table {
          min-width: unset !important;
          width: 100% !important;
        }
        td,
        th {
          white-space: normal !important;
          word-break: break-word;
        }
        .card {
          overflow: visible !important;
          max-width: 100% !important;
        }
        #wizard,
        .hdr,
        .tabbar,
        .hact,
        .no-print {
          display: none !important;
        }
        #print-header {
          display: none !important;
        }
        #print-footer {
          display: none !important;
        }
        .panel {
          display: none !important;
        }
        .panel.print-include {
          display: block !important;
          page-break-after: always;
          overflow: visible !important;
          height: auto !important;
          max-height: none !important;
          transform: none !important;
        }
        .panel.print-include:last-child {
          page-break-after: auto;
        }
        .panel.active:not(.print-hide) {
          display: block !important;
          overflow: visible !important;
        }
        body {
          background: #fff;
          font-size: 10px;
        }
        .card {
          box-shadow: none;
          border: 1px solid #ccc;
          margin-bottom: 6px;
          overflow: visible !important;
        }
        .main {
          padding: 4px;
        }
        .panel::before {
          content: attr(data-title);
          display: block;
          font-size: 11px;
          font-weight: 700;
          border-bottom: 2px solid #1e5fa4;
          padding: 3px 0;
          margin-bottom: 6px;
          color: #0d1f3c;
        }
        /* Charts */
        .cg {
          display: block !important;
        }
        .cc {
          width: 100% !important;
          max-width: 100% !important;
          margin-bottom: 12px;
          page-break-inside: avoid;
        }
        .cc canvas {
          display: none !important;
        }
        .print-chart-img {
          display: block !important;
          width: 100% !important;
          max-height: 220px !important;
          object-fit: contain;
        }
        /* Cover page */
        #print-cover {
          display: block !important;
          page-break-after: always;
        }
        /* Form II always starts on fresh page */
        #tab-f2 {
          page-break-before: always;
        }
        /* Exec summary and assumptions — always start fresh page */
        #print-exec {
          display: none;
          page-break-before: always;
          padding: 4mm 0;
        }
        #print-assumptions {
          display: none;
          page-break-before: always;
          padding: 4mm 0;
        }
        .btn,
        .badge:not(.badge-gd),
        .opt-panel {
          display: none !important;
        }
        .badge-gd {
          display: inline-block !important;
        }
        .kpi-row {
          flex-wrap: wrap;
        }
        .kpi {
          min-width: 120px !important;
        }
        /* BS Warning — show in print if unbalanced */
        #print-bs-warn {
          display: none;
        }
        #print-bs-warn.show {
          display: block !important;
          background: #fef2f2;
          border: 2px solid #dc2626;
          border-radius: 6px;
          padding: 8px 14px;
          margin-bottom: 10px;
          font-size: 10px;
          color: #991b1b;
          font-weight: 700;
        }
        /* Edit mode note — show in print if active */
        #print-edit-note {
          display: none;
        }
        #print-edit-note.show {
          display: block !important;
          background: #fffbea;
          border: 1.5px solid #d4a84b;
          border-radius: 6px;
          padding: 6px 12px;
          margin-bottom: 8px;
          font-size: 9.5px;
          color: #92400e;
        }
        /* Edit mode cells — reset to plain text in print, no gold borders or yellow */
        .edit-mode-active .tbl td.editable-cell {
          background: transparent !important;
        }
        .edit-mode-active .tbl td.editable-cell::after {
          display: none !important;
        }
        .edit-mode-active .tbl td.editable-cell input {
          border: none !important;
          background: transparent !important;
          box-shadow: none !important;
          color: inherit !important;
          font-size: inherit !important;
          font-weight: inherit !important;
          width: auto !important;
          padding: 0 !important;
        }
        .edit-mode-banner,
        .edit-mode-indicator {
          display: none !important;
        }
      }
      .cma-tour-overlay {
        position: fixed;
        inset: 0;
        z-index: 19000;
        pointer-events: none;
      }
      .cma-tour-spotlight {
        position: fixed;
        z-index: 19001;
        border-radius: 8px;
        box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.62);
        pointer-events: none;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      }
      .cma-tour-box {
        position: fixed;
        z-index: 19002;
        background: #fff;
        border-radius: 12px;
        max-width: 340px;
        width: 92vw;
        box-shadow: 0 8px 40px rgba(13, 31, 60, 0.32);
        font-family: "Source Sans 3", sans-serif;
        transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
        pointer-events: auto;
      }
      .cma-tour-hdr {
        background: var(--nv);
        color: #fff;
        border-radius: 12px 12px 0 0;
        padding: 10px 14px 8px;
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      .cma-tour-hdr-title {
        font-size: 13px;
        font-weight: 700;
        color: #fff;
      }
      .cma-tour-hdr-close {
        background: rgba(255, 255, 255, 0.18);
        border: none;
        color: #fff;
        border-radius: 50%;
        width: 22px;
        height: 22px;
        font-size: 13px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }
      .cma-tour-body {
        padding: 12px 14px 8px;
        font-size: 12.5px;
        color: #374151;
        line-height: 1.55;
      }
      .cma-tour-step-badge {
        font-size: 10px;
        color: var(--mu);
        margin-bottom: 6px;
      }
      .cma-tour-progress {
        height: 3px;
        background: #e5e7eb;
        border-radius: 2px;
        margin: 8px 14px;
      }
      .cma-tour-progress-inner {
        height: 3px;
        background: var(--gd);
        border-radius: 2px;
        transition: width 0.3s;
      }
      .cma-tour-footer {
        padding: 8px 14px 12px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
      }
      .cma-tour-arrow {
        position: fixed;
        z-index: 19003;
        width: 14px;
        height: 14px;
        background: #fff;
        transform: rotate(45deg);
        pointer-events: none;
        transition: all 0.28s;
      }
      .tour-help-btn {
        position: fixed;
        bottom: 90px;
        right: 28px;
        z-index: 9990;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: var(--nv);
        color: #fff;
        border: none;
        font-size: 16px;
        font-weight: 700;
        cursor: pointer;
        box-shadow: 0 3px 12px rgba(13, 31, 60, 0.4);
        display: none;
        align-items: center;
        justify-content: center;
      }
      .tour-help-btn:hover {
        background: var(--nv2);
      }
      @media (max-width: 768px) {
        .tour-help-btn {
          bottom: 78px;
          right: 18px;
        }
      }
      @media print {
        .cma-tour-overlay,
        .cma-tour-spotlight,
        .cma-tour-box,
        .cma-tour-arrow,
        .tour-help-btn {
          display: none !important;
        }
      }
      /* ── Layout ── */
      #landing {
        display: none;
        flex-direction: column;
        min-height: 100vh;
        background: #f0f5fa;
        font-family: "Inter", "Segoe UI", sans-serif;
      }
      #landing * {
        box-sizing: border-box;
      }
      .ld-nav {
        background: #0d1f3c;
        padding: 12px 5vw;
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: sticky;
        top: 0;
        z-index: 999;
      }
      .ld-nav-logo {
        display: flex;
        align-items: center;
        gap: 10px;
      }
      .ld-nav-logo img {
        height: 36px;
        width: 36px;
        border-radius: 5px;
        object-fit: contain;
        background: #fff;
        padding: 2px;
      }
      .ld-nav-brand {
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.2;
      }
      .ld-nav-brand small {
        display: block;
        font-size: 9.5px;
        font-weight: 400;
        color: rgba(255, 255, 255, 0.55);
        letter-spacing: 0.4px;
      }
      .ld-nav-cta {
        background: #d4a84b;
        color: #0d1f3c;
        border: none;
        padding: 8px 18px;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer;
        white-space: nowrap;
      }
      .ld-nav-cta:hover {
        background: #b8902f;
      }
      .ld-section {
        padding: 60px 5vw;
        max-width: 1100px;
        margin: 0 auto;
        width: 100%;
      }
      .ld-section-full {
        padding: 60px 5vw;
        width: 100%;
      }
      /* ── Hero ── */
      .ld-hero {
        background: linear-gradient(135deg, #0d1f3c 0%, #1e5fa4 100%);
        color: #fff;
        padding: 64px 5vw 56px;
        text-align: center;
      }
      .ld-hero h1 {
        font-size: clamp(24px, 4vw, 44px);
        font-weight: 800;
        line-height: 1.2;
        margin: 0 0 16px;
        max-width: 780px;
        margin-left: auto;
        margin-right: auto;
      }
      .ld-hero h1 span {
        color: #d4a84b;
      }
      .ld-hero p {
        font-size: clamp(14px, 1.8vw, 18px);
        opacity: 0.85;
        max-width: 600px;
        margin: 0 auto 28px;
        line-height: 1.6;
      }
      .ld-hero-bullets {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        justify-content: center;
        margin-bottom: 32px;
      }
      .ld-hero-bullets li {
        list-style: none;
        background: rgba(255, 255, 255, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 20px;
        padding: 6px 14px;
        font-size: 12.5px;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 6px;
      }
      .ld-hero-cta {
        display: inline-block;
        background: #d4a84b;
        color: #0d1f3c;
        padding: 16px 36px;
        border-radius: 8px;
        font-size: 16px;
        font-weight: 800;
        cursor: pointer;
        border: none;
        transition: 0.2s;
        box-shadow: 0 4px 20px rgba(212, 168, 75, 0.4);
      }
      .ld-hero-cta:hover {
        background: #b8902f;
        transform: translateY(-2px);
      }
      .ld-hero-note {
        margin-top: 14px;
        font-size: 11px;
        opacity: 0.6;
        letter-spacing: 0.3px;
      }
      .ld-badge {
        display: inline-block;
        background: rgba(212, 168, 75, 0.15);
        border: 1px solid rgba(212, 168, 75, 0.4);
        color: #d4a84b;
        font-size: 10.5px;
        font-weight: 700;
        padding: 4px 12px;
        border-radius: 12px;
        margin-bottom: 16px;
        letter-spacing: 0.5px;
        text-transform: uppercase;
      }
      /* ── Trust bar ── */
      .ld-trust {
        background: #fff;
        border-bottom: 1px solid #e5e7eb;
        padding: 18px 5vw;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 32px;
        flex-wrap: wrap;
      }
      .ld-trust-item {
        display: flex;
        align-items: center;
        gap: 7px;
        font-size: 12px;
        color: #374151;
        font-weight: 600;
      }
      .ld-trust-item span {
        font-size: 16px;
      }
      /* ── How it works ── */
      .ld-steps {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 20px;
        margin-top: 32px;
      }
      .ld-step {
        background: #fff;
        border-radius: 12px;
        padding: 24px 20px;
        text-align: center;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
        position: relative;
      }
      .ld-step-num {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: #0d1f3c;
        color: #fff;
        font-size: 14px;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 12px;
      }
      .ld-step h4 {
        font-size: 13.5px;
        font-weight: 700;
        color: #0d1f3c;
        margin: 0 0 6px;
      }
      .ld-step p {
        font-size: 12px;
        color: #6b7280;
        margin: 0;
        line-height: 1.5;
      }
      .ld-step-arrow {
        position: absolute;
        right: -14px;
        top: 50%;
        transform: translateY(-50%);
        color: #cbd5e1;
        font-size: 18px;
        z-index: 1;
      }
      /* ── Section headers ── */
      .ld-sec-hd {
        text-align: center;
        margin-bottom: 36px;
      }
      .ld-sec-hd h2 {
        font-size: clamp(20px, 2.5vw, 30px);
        font-weight: 800;
        color: #0d1f3c;
        margin: 0 0 8px;
      }
      .ld-sec-hd p {
        font-size: 13.5px;
        color: #6b7280;
        margin: 0;
        max-width: 540px;
        margin: 0 auto;
      }
      /* ── Features ── */
      .ld-features {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
        gap: 16px;
        margin-top: 32px;
      }
      .ld-feat {
        background: #fff;
        border-radius: 10px;
        padding: 20px;
        border-left: 3px solid #1e5fa4;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
      }
      .ld-feat-icon {
        font-size: 22px;
        margin-bottom: 8px;
      }
      .ld-feat h4 {
        font-size: 13px;
        font-weight: 700;
        color: #0d1f3c;
        margin: 0 0 4px;
      }
      .ld-feat p {
        font-size: 11.5px;
        color: #6b7280;
        margin: 0;
        line-height: 1.5;
      }
      /* ── Use cases ── */
      .ld-use-cases {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 20px;
        margin-top: 32px;
      }
      .ld-use {
        background: #fff;
        border-radius: 12px;
        padding: 24px;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
      }
      .ld-use-icon {
        font-size: 28px;
        margin-bottom: 10px;
      }
      .ld-use h4 {
        font-size: 14px;
        font-weight: 700;
        color: #0d1f3c;
        margin: 0 0 6px;
      }
      .ld-use p {
        font-size: 12px;
        color: #6b7280;
        margin: 0;
        line-height: 1.6;
      }
      .ld-use ul {
        margin: 8px 0 0;
        padding-left: 16px;
        font-size: 12px;
        color: #374151;
        line-height: 1.8;
      }
      /* ── SEO content ── */
      .ld-seo {
        background: #fff;
      }
      .ld-seo-inner {
        max-width: 820px;
        margin: 0 auto;
      }
      .ld-seo-inner h3 {
        font-size: 16px;
        font-weight: 700;
        color: #0d1f3c;
        margin: 24px 0 8px;
      }
      .ld-seo-inner p {
        font-size: 13px;
        color: #374151;
        line-height: 1.8;
        margin: 0 0 12px;
      }
      /* ── FAQ ── */
      .ld-faq {
        margin-top: 32px;
        max-width: 720px;
        margin-left: auto;
        margin-right: auto;
      }
      .ld-faq-item {
        background: #fff;
        border-radius: 10px;
        margin-bottom: 10px;
        overflow: hidden;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
      }
      .ld-faq-q {
        padding: 14px 18px;
        font-size: 13px;
        font-weight: 700;
        color: #0d1f3c;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        user-select: none;
      }
      .ld-faq-q:hover {
        background: #f8fafc;
      }
      .ld-faq-q .faq-arrow {
        font-size: 11px;
        color: #6b7280;
        transition: 0.2s;
        flex-shrink: 0;
      }
      .ld-faq-a {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition:
          max-height 0.3s ease,
          opacity 0.25s ease;
        padding: 0 18px;
        font-size: 12.5px;
        color: #374151;
        line-height: 1.7;
      }
      .ld-faq-item.open .ld-faq-a {
        padding-bottom: 14px;
      }
      .ld-faq-item.open .faq-arrow {
        transform: rotate(180deg);
      }
      /* ── Final CTA ── */
      .ld-final-cta {
        background: linear-gradient(135deg, #0d1f3c, #1e5fa4);
        color: #fff;
        text-align: center;
        padding: 64px 5vw;
      }
      .ld-final-cta h2 {
        font-size: clamp(20px, 2.5vw, 32px);
        font-weight: 800;
        margin: 0 0 12px;
      }
      .ld-final-cta p {
        font-size: 14px;
        opacity: 0.8;
        margin: 0 0 28px;
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
      }
      /* ── Footer ── */
      .ld-footer {
        background: #0d1f3c;
        color: rgba(255, 255, 255, 0.5);
        padding: 20px 5vw;
        text-align: center;
        font-size: 11px;
      }
      /* ── Sticky bottom CTA (shown in app when not Pro) ── */
      #sticky-pro-bar {
        display: none;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: #0d1f3c;
        color: #fff;
        z-index: 8000;
        padding: 10px 16px;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        border-top: 2px solid #d4a84b;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3);
      }
      #sticky-pro-bar .spb-text {
        font-size: 12px;
        font-weight: 600;
        flex: 1;
      }
      #sticky-pro-bar .spb-text strong {
        color: #d4a84b;
      }
      #sticky-pro-bar .spb-btns {
        display: flex;
        gap: 8px;
        flex-shrink: 0;
      }
      #sticky-pro-bar button {
        padding: 7px 16px;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer;
        border: none;
      }
      .spb-cta {
        background: #d4a84b;
        color: #0d1f3c;
      }
      .spb-close {
        background: rgba(255, 255, 255, 0.1);
        color: #fff;
      }
      @media (max-width: 600px) {
        .ld-trust {
          gap: 16px;
        }
        .ld-step-arrow {
          display: none;
        }
        .ld-hero h1 {
          font-size: 22px;
        }
        #sticky-pro-bar .spb-text {
          font-size: 11px;
        }
        #landing {
          font-size: 14px;
        }
      }
      @media print {
        #landing,
        #sticky-pro-bar {
          display: none !important;
        }
      }

      /* ── Scroll animations ───────────────────────────────────────────── */
      .ld-reveal {
        opacity: 0;
        transform: translateY(28px);
        transition:
          opacity 0.55s ease,
          transform 0.55s ease;
      }
      .ld-reveal.visible {
        opacity: 1;
        transform: translateY(0);
      }
      .ld-reveal-left {
        opacity: 0;
        transform: translateX(-32px);
        transition:
          opacity 0.55s ease,
          transform 0.55s ease;
      }
      .ld-reveal-left.visible {
        opacity: 1;
        transform: translateX(0);
      }
      .ld-reveal-right {
        opacity: 0;
        transform: translateX(32px);
        transition:
          opacity 0.55s ease,
          transform 0.55s ease;
      }
      .ld-reveal-right.visible {
        opacity: 1;
        transform: translateX(0);
      }
      .ld-stagger .ld-step:nth-child(1) {
        transition-delay: 0.05s;
      }
      .ld-stagger .ld-step:nth-child(2) {
        transition-delay: 0.15s;
      }
      .ld-stagger .ld-step:nth-child(3) {
        transition-delay: 0.25s;
      }
      .ld-stagger .ld-step:nth-child(4) {
        transition-delay: 0.35s;
      }
      .ld-stagger .ld-feat:nth-child(1) {
        transition-delay: 0.04s;
      }
      .ld-stagger .ld-feat:nth-child(2) {
        transition-delay: 0.1s;
      }
      .ld-stagger .ld-feat:nth-child(3) {
        transition-delay: 0.16s;
      }
      .ld-stagger .ld-feat:nth-child(4) {
        transition-delay: 0.22s;
      }
      .ld-stagger .ld-feat:nth-child(5) {
        transition-delay: 0.28s;
      }
      .ld-stagger .ld-feat:nth-child(6) {
        transition-delay: 0.34s;
      }
      .ld-stagger .ld-use:nth-child(1) {
        transition-delay: 0.06s;
      }
      .ld-stagger .ld-use:nth-child(2) {
        transition-delay: 0.16s;
      }
      .ld-stagger .ld-use:nth-child(3) {
        transition-delay: 0.26s;
      }
      .ld-feat,
      .ld-use,
      .ld-step {
        transition:
          transform 0.22s ease,
          box-shadow 0.22s ease,
          opacity 0.55s ease;
      }
      .ld-feat:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 28px rgba(13, 31, 60, 0.12);
      }
      .ld-use:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 28px rgba(13, 31, 60, 0.14);
      }
      .ld-step:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 22px rgba(13, 31, 60, 0.1);
      }
      @keyframes ld-hero-in {
        from {
          opacity: 0;
          transform: translateY(22px);
        }
        to {
          opacity: 1;
          transform: none;
        }
      }
      .ld-hero .ld-badge {
        animation: ld-hero-in 0.5s ease both;
      }
      .ld-hero h1 {
        animation: ld-hero-in 0.55s 0.1s ease both;
      }
      .ld-hero p {
        animation: ld-hero-in 0.55s 0.2s ease both;
      }
      .ld-hero .ld-hero-bullets {
        animation: ld-hero-in 0.55s 0.28s ease both;
      }
      .ld-hero .ld-hero-cta {
        animation: ld-hero-in 0.55s 0.38s ease both;
      }
      .ld-hero .ld-hero-note {
        animation: ld-hero-in 0.5s 0.46s ease both;
      }
      .ld-hero-cta {
        transition:
          transform 0.18s ease,
          box-shadow 0.18s ease,
          background 0.18s ease;
      }
      .ld-hero-cta:hover {
        transform: translateY(-3px) !important;
        box-shadow: 0 8px 24px rgba(13, 31, 60, 0.25) !important;
      }
      .ld-nav-cta {
        transition:
          transform 0.15s ease,
          background 0.15s ease;
      }
      .ld-nav-cta:hover {
        transform: translateY(-2px);
      }
      .wa-float {
        position: fixed;
        bottom: 28px;
        right: 28px;
        z-index: 9998;
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: #25d366;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 16px rgba(37, 211, 102, 0.5);
        cursor: pointer;
        text-decoration: none;
        animation: wa-pulse 2s ease-in-out infinite;
      }
      .wa-float:hover {
        background: #1ebe5d;
        transform: scale(1.08);
        animation: none;
        box-shadow: 0 6px 24px rgba(37, 211, 102, 0.7);
      }
      .wa-float svg {
        width: 30px;
        height: 30px;
        fill: #fff;
      }
      @keyframes wa-pulse {
        0%,
        100% {
          box-shadow: 0 4px 16px rgba(37, 211, 102, 0.5);
        }
        50% {
          box-shadow:
            0 4px 24px rgba(37, 211, 102, 0.8),
            0 0 0 8px rgba(37, 211, 102, 0.15);
        }
      }
      .wa-tooltip {
        position: fixed;
        bottom: 38px;
        right: 94px;
        z-index: 9997;
        background: #0d1f3c;
        color: #fff;
        font-size: 11.5px;
        font-weight: 600;
        padding: 6px 12px;
        border-radius: 20px;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s;
        font-family: "Source Sans 3", sans-serif;
      }
      .wa-float:hover + .wa-tooltip {
        opacity: 1;
      }
      @media (max-width: 768px) {
        .wa-float {
          bottom: 18px;
          right: 18px;
          width: 50px;
          height: 50px;
        }
        .wa-float svg {
          width: 26px;
          height: 26px;
        }
        .wa-tooltip {
          display: none;
        }
      }
      @media print {
        .wa-float,
        .wa-tooltip {
          display: none !important;
        }
      }

      @keyframes sample-pulse {
        0%,100% { box-shadow: 0 0 0 0 rgba(212,168,75,0.7), 0 0 0 0 rgba(212,168,75,0.3); opacity:1; }
        50%      { box-shadow: 0 0 0 8px rgba(212,168,75,0.25), 0 0 16px 4px rgba(212,168,75,0.15); opacity:0.85; }
      }
      .sample-dl-btn {
        display: inline-block;
        color: rgba(255,255,255,0.9) !important;
        font-size: 13px;
        text-decoration: none !important;
        border: 1.5px solid rgba(212,168,75,0.8);
        border-radius: 7px;
        padding: 7px 20px;
        background: rgba(212,168,75,0.15);
        animation: sample-pulse 2s ease-in-out infinite;
        transition: background 0.2s, border-color 0.2s;
        font-weight: 600;
        letter-spacing: 0.3px;
      }
      .sample-dl-btn:hover {
        background: rgba(212,168,75,0.35) !important;
        border-color: rgba(212,168,75,1) !important;
        animation: none;
        color: #fff !important;
      }
      .sample-dl-btn-plain {
        color: rgba(255,255,255,0.75) !important;
        font-size: 12px;
        text-decoration: underline !important;
        animation: sample-pulse-text 2.5s ease-in-out infinite;
      }
      @keyframes sample-pulse-text {
        0%,100% { opacity:0.75; }
        50%      { opacity:1; text-shadow: 0 0 8px rgba(212,168,75,0.6); }
      }

      /* ── Stats counter strip ──────────────────────────────────────────── */
      .ld-stats-strip {
        display: flex;
        justify-content: center;
        gap: 0;
        background: #fff;
        border-top: 1px solid #e2e8f0;
        border-bottom: 1px solid #e2e8f0;
        flex-wrap: wrap;
      }
      .ld-stat {
        flex: 1;
        min-width: 140px;
        text-align: center;
        padding: 24px 16px;
        border-right: 1px solid #e2e8f0;
        position: relative;
      }
      .ld-stat:last-child { border-right: none; }
      .ld-stat-num {
        font-size: clamp(30px, 4vw, 42px);
        font-weight: 800;
        color: var(--nv, #0d1f3c);
        line-height: 1;
        margin-bottom: 6px;
        font-family: "Source Sans 3", sans-serif;
      }
      .ld-stat-num span.accent { color: var(--gd2, #d4a84b); }
      .ld-stat-label {
        font-size: 12px;
        color: var(--mu, #6b7280);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
      }

      /* ── Testimonials ─────────────────────────────────────────────────── */
      .ld-testi-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 20px;
        margin-top: 28px;
      }
      .ld-testi-card {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        padding: 22px 20px;
        box-shadow: 0 2px 12px rgba(13,31,60,0.06);
        display: flex;
        flex-direction: column;
        gap: 14px;
        transition: box-shadow 0.2s, transform 0.2s;
      }
      .ld-testi-card:hover {
        box-shadow: 0 8px 28px rgba(13,31,60,0.12);
        transform: translateY(-2px);
      }
      .ld-testi-stars { color: #f59e0b; font-size: 15px; letter-spacing: 1px; }
      .ld-testi-text {
        font-size: 13.5px;
        line-height: 1.65;
        color: #374151;
        flex: 1;
        font-style: italic;
      }
      .ld-testi-text::before { content: '\201C'; }
      .ld-testi-text::after  { content: '\201D'; }
      .ld-testi-author {
        display: flex;
        align-items: center;
        gap: 11px;
        padding-top: 12px;
        border-top: 1px solid #f0f5fa;
      }
      .ld-testi-avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: var(--nv, #0d1f3c);
        color: var(--gd2, #d4a84b);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        font-weight: 800;
        flex-shrink: 0;
      }
      .ld-testi-name {
        font-size: 13px;
        font-weight: 700;
        color: var(--nv, #0d1f3c);
        line-height: 1.2;
      }
      .ld-testi-role {
        font-size: 11.5px;
        color: var(--mu, #6b7280);
        margin-top: 2px;
      }
      @media (max-width: 600px) {
        .ld-stat { min-width: 50%; border-bottom: 1px solid #e2e8f0; }
        .ld-stat:nth-child(2n) { border-right: none; }
      }