/* ==========================================================
   THE 1 ENERGY — FUTURE GLASS / DARK UI OVERRIDE
   UI only: intentionally scoped to screen so print/PDF output
   keeps the original document styling and business logic.
   ========================================================== */
@media screen {
  :root{
    color-scheme:dark;
    --f-bg:#050810;
    --f-bg-2:#09111f;
    --f-bg-3:#0d1728;
    --f-panel:rgba(13,23,40,.72);
    --f-panel-strong:rgba(12,22,38,.90);
    --f-panel-soft:rgba(255,255,255,.055);
    --f-line:rgba(139,213,255,.18);
    --f-line-strong:rgba(93,223,193,.35);
    --f-text:#f4f8ff;
    --f-muted:#a8b7ca;
    --f-cyan:#5edfff;
    --f-green:#4ce0a2;
    --f-orange:#ff9a43;
    --f-blue:#6c9cff;
    --f-red:#ff657a;
    --f-shadow:0 24px 70px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
    --f-glow:0 0 0 1px rgba(94,223,255,.06),0 0 34px rgba(76,224,162,.08),0 24px 70px rgba(0,0,0,.38);

    /* Existing variable compatibility */
    --text:var(--f-text);
    --ink:var(--f-text);
    --muted:var(--f-muted);
    --line:var(--f-line);
    --bg:var(--f-bg);
    --card:var(--f-panel);
    --soft:rgba(76,224,162,.10);
    --shadow:var(--f-shadow);
    --navy:#eaf4ff;
    --primary:#21c989;
    --primary-dark:#8bf3ca;
    --green:#31ce8d;
    --green-dark:#6af0b8;
    --green-soft:rgba(49,206,141,.12);
    --blue:#4d9dff;
    --blue-dark:#80bcff;
    --blue-soft:rgba(77,157,255,.12);
    --orange:#ff8a35;
    --red:#ff5268;
  }

  *{scrollbar-width:thin;scrollbar-color:rgba(94,223,255,.38) rgba(255,255,255,.04)}
  *::-webkit-scrollbar{width:10px;height:10px}
  *::-webkit-scrollbar-track{background:rgba(255,255,255,.03)}
  *::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(76,224,162,.52),rgba(94,223,255,.40));border:2px solid #08101c;border-radius:999px}
  html{background:#050810!important}
  body{
    background:
      radial-gradient(circle at 12% -10%,rgba(76,224,162,.15),transparent 27%),
      radial-gradient(circle at 88% 2%,rgba(94,223,255,.14),transparent 28%),
      radial-gradient(circle at 78% 80%,rgba(108,156,255,.10),transparent 30%),
      linear-gradient(180deg,#050810 0%,#07101c 45%,#050912 100%)!important;
    color:var(--f-text)!important;
    min-height:100vh;
    position:relative;
    isolation:isolate;
  }
  body::before{
    content:""!important;
    position:fixed!important;
    inset:0!important;
    z-index:-2!important;
    pointer-events:none!important;
    opacity:.58!important;
    background-image:
      linear-gradient(rgba(94,223,255,.032) 1px,transparent 1px),
      linear-gradient(90deg,rgba(94,223,255,.032) 1px,transparent 1px)!important;
    background-size:42px 42px!important;
    mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 92%)!important;
  }
  body::after{
    content:""!important;
    position:fixed!important;
    width:48vw!important;
    height:48vw!important;
    right:-22vw!important;
    top:22vh!important;
    z-index:-1!important;
    pointer-events:none!important;
    border-radius:50%!important;
    opacity:.72!important;
    background:radial-gradient(circle,rgba(76,224,162,.12),rgba(94,223,255,.05) 38%,transparent 68%)!important;
    filter:blur(10px)!important;
  }
  ::selection{background:rgba(76,224,162,.30);color:#fff}
  a{transition:color .2s ease,border-color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease}

  /* ---------- Main website shell ---------- */
  .site-header,.global-header,.loan-site-header,.topbar{
    background:rgba(5,10,18,.74)!important;
    border-color:rgba(139,213,255,.13)!important;
    box-shadow:0 12px 40px rgba(0,0,0,.26)!important;
    backdrop-filter:blur(22px) saturate(145%)!important;
    -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
  }
  .site-header{border-bottom:1px solid rgba(139,213,255,.13)!important}
  .site-header::after,.global-header::after,.loan-site-header::after{
    content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
    background:linear-gradient(90deg,transparent,rgba(76,224,162,.62),rgba(94,223,255,.48),transparent);
    pointer-events:none;
  }
  .brand img,.global-logo img,.loan-brand img,.login-logo img,.hero__logo--top,.brand-logo{
    background:rgba(255,255,255,.95)!important;
    border:1px solid rgba(255,255,255,.8)!important;
    box-shadow:0 8px 28px rgba(0,0,0,.22),0 0 26px rgba(76,224,162,.09)!important;
  }
  .site-header .brand,.global-logo,.loan-brand{filter:drop-shadow(0 0 16px rgba(76,224,162,.07))}
  .nav a,.global-nav a,.loan-nav a{
    color:#d9e6f5!important;
    text-shadow:0 1px 14px rgba(0,0,0,.45);
  }
  .nav a:hover,.nav a.active,.global-nav a:hover,.global-nav a.active,.loan-nav a:hover,.loan-nav a.active{color:#fff!important}
  .nav a.active::after,.nav a:hover::after{background:linear-gradient(90deg,var(--f-green),var(--f-cyan))!important;box-shadow:0 0 16px rgba(76,224,162,.45)}
  .menu-toggle,.loan-menu-toggle{
    color:#fff!important;background:rgba(255,255,255,.075)!important;border:1px solid rgba(139,213,255,.22)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.25)!important;
  }
  .nav.open,.loan-nav.open{
    background:rgba(7,14,25,.96)!important;border-color:rgba(139,213,255,.18)!important;box-shadow:0 28px 80px rgba(0,0,0,.58)!important;
    backdrop-filter:blur(24px)!important;
  }

  /* ---------- Reusable buttons ---------- */
  .btn,.primary,.secondary,.outline,.global-consult,.loan-nav-cta,.home-back-btn,.view-btn,.tab,.cta,.preview-close,button[class*="btn-"]{
    border-radius:15px!important;
    transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,border-color .18s ease!important;
  }
  .btn:hover,.primary:hover,.secondary:hover,.outline:hover,.global-consult:hover,.loan-nav-cta:hover,.home-back-btn:hover,.view-btn:hover,.tab:hover,.cta:hover,button[class*="btn-"]:hover{
    transform:translateY(-2px)!important;
    filter:brightness(1.06)!important;
  }
  .btn-primary,.primary,.global-consult,.loan-nav-cta{
    background:linear-gradient(135deg,#ff7d28,#ffad50)!important;
    color:#fff!important;border-color:rgba(255,179,107,.42)!important;
    box-shadow:0 12px 34px rgba(255,126,40,.22),inset 0 1px 0 rgba(255,255,255,.25)!important;
  }
  .btn-green,.green,.btn-green.action-btn-ai{
    background:linear-gradient(135deg,#15995f,#35df9b)!important;color:#fff!important;
    box-shadow:0 12px 34px rgba(49,206,141,.19)!important;
  }
  .btn-blue,.blue,.btn-blue.action-btn-custom{
    background:linear-gradient(135deg,#2569cc,#56b5ff)!important;color:#fff!important;
    box-shadow:0 12px 34px rgba(77,157,255,.20)!important;
  }
  .btn-red,.dangerBtn,.btn-red.save-right,.btn-red.action-btn-submit{
    background:linear-gradient(135deg,#b9203d,#ff6175)!important;color:#fff!important;border-color:transparent!important;
    box-shadow:0 12px 30px rgba(255,82,104,.18)!important;
  }
  .btn-orange,.btn-orange-dark,.btn-orange.action-btn-reset{
    background:linear-gradient(135deg,#cf5d10,#ff9a43)!important;color:#fff!important;
    box-shadow:0 12px 30px rgba(255,138,53,.18)!important;
  }
  .btn-outline,.btn-ghost,.outline,.secondary,.btn-white,.home-back-btn,.view-btn{
    background:rgba(255,255,255,.065)!important;
    border:1px solid rgba(139,213,255,.22)!important;
    color:#eaf4ff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 30px rgba(0,0,0,.20)!important;
    backdrop-filter:blur(12px)!important;
  }

  /* ---------- Hero / section atmosphere ---------- */
  .hero,.subhero,.article-hero-page{
    border-color:rgba(139,213,255,.12)!important;
  }
  .subhero,.article-hero-page{
    background:
      radial-gradient(circle at 15% 20%,rgba(76,224,162,.15),transparent 34%),
      radial-gradient(circle at 85% 10%,rgba(94,223,255,.12),transparent 28%),
      linear-gradient(135deg,rgba(7,15,27,.98),rgba(12,25,42,.92))!important;
    border-bottom:1px solid rgba(139,213,255,.13)!important;
  }
  .subhero h1,.article-hero-page h1,.article-hero-page h2{color:#f7fbff!important;text-shadow:0 0 26px rgba(94,223,255,.08)}
  .subhero p,.article-hero-page p,.article-meta{color:var(--f-muted)!important}
  .hero-fade{background:linear-gradient(90deg,rgba(4,8,15,.96) 0%,rgba(5,10,18,.90) 22%,rgba(5,10,18,.62) 48%,rgba(5,10,18,.18) 74%,rgba(5,10,18,.03) 100%)!important}
  .hero-img img{filter:brightness(.48) contrast(1.08) saturate(.82)!important}
  .hero-copy,.hero-card{
    background:linear-gradient(145deg,rgba(13,25,43,.78),rgba(8,17,30,.58))!important;
    border:1px solid rgba(139,213,255,.18)!important;
    box-shadow:var(--f-glow)!important;
    backdrop-filter:blur(24px) saturate(145%)!important;
  }
  .hero-copy{border-left:3px solid rgba(76,224,162,.72)!important}
  .hero h1{color:#fff!important;-webkit-text-stroke:0!important;text-shadow:0 0 28px rgba(255,138,53,.18),0 0 60px rgba(76,224,162,.08)!important}
  .hero h1 span{color:#ff9a43!important;-webkit-text-stroke:0!important;text-shadow:0 0 25px rgba(255,138,53,.20)!important}
  .hero p,.hero-copy p,.hero-card p{color:#c3d1e1!important}
  .hero-card i,.service-card i{background:linear-gradient(135deg,rgba(76,224,162,.16),rgba(94,223,255,.12))!important;border:1px solid rgba(76,224,162,.18)!important}
  .pill,.badge,.home-chip,.service-badge,.preview-tag{
    background:rgba(76,224,162,.10)!important;color:#92f6cf!important;border:1px solid rgba(76,224,162,.22)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
  }

  .section{background:transparent!important}
  .section.alt,.home-main-section,.lead-form-section{background:rgba(255,255,255,.015)!important;border-top:1px solid rgba(139,213,255,.04);border-bottom:1px solid rgba(139,213,255,.04)}
  .section-head h2,.section-title h2,.section-title,.info-card h2,.table-card h2,.contact-card h1,.finance-banner h1,.package-card h3,.article-body h2,.article-body h3{color:#f5f9ff!important}
  .section-head p,.info-card p,.service-card p,.tool-card p,.package-card ul,.table-note,.contact-card p,.finance-banner p,.article-body p,.preview-muted{color:var(--f-muted)!important}
  .section-title::before,.section-title::after{background:linear-gradient(90deg,var(--f-green),var(--f-cyan))!important;box-shadow:0 0 14px rgba(76,224,162,.22)}

  /* ---------- Glass surfaces ---------- */
  .promo-card,.service-card,.info-card,.package-card,.table-card,.gallery-card,.contact-card,.tool-card,
  .finance-banner,.contact-strip,.lead-form-card,.partner-card,.lender-showcase-item,.lender-mini,
  .article-card,.home-promo-card,.finance-style-card,.contact-style-card,.premium-service-card,
  .footer-card,.company-legal-block.company-legal-standalone,
  .card,.form-box,.visual-card,.choice,.benefit,.stat-card,.summary-kpi,.kpi,.metric,.detail-card,.note-card,
  .portfolio-upload-card,.portfolio-item,.dash-card,.crm-grid,.history-item,.backup-log-card,.admin-page-title-card,
  .preview-section,.preview-mini-card,.preview-article-card,.preview-portfolio-card,.preview-popup-sample,
  .confirm-box,.preview-box,.login-card,.solar-exit-box{
    background:linear-gradient(145deg,rgba(16,29,48,.78),rgba(8,17,30,.69))!important;
    border:1px solid rgba(139,213,255,.16)!important;
    box-shadow:var(--f-shadow)!important;
    backdrop-filter:blur(18px) saturate(135%)!important;
    -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
  }
  .promo-card,.service-card,.info-card,.package-card,.table-card,.gallery-card,.contact-card,.tool-card,.article-card,.partner-card,.card,.choice,.benefit,.stat-card,.metric,.detail-card,.login-card{position:relative;overflow:hidden}
  .promo-card::before,.service-card::before,.info-card::before,.package-card::before,.table-card::before,.contact-card::before,.tool-card::before,.article-card::before,.partner-card::before,.card::before,.choice::before,.benefit::before,.login-card::before{
    content:"";position:absolute;left:12%;right:12%;top:0;height:1px;z-index:2;pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(94,223,255,.48),rgba(76,224,162,.46),transparent);
  }
  .gallery-card img,.article-thumb img,.service-card-media img,.home-promo-visual img,.partner-logo-wrap,.product-showcase-media{
    filter:saturate(.90) contrast(1.02) brightness(.88);
  }
  .gallery-card div,.promo-card .content,.article-body,.service-card-body,.home-promo-content,.product-showcase-content{background:transparent!important}
  .feature-list div,.product-points span,.warranty-row div,.footer-badges span,.partner-tags span,.home-mini-points span{
    background:rgba(255,255,255,.055)!important;border-color:rgba(139,213,255,.14)!important;color:#dbe8f6!important;
  }
  .price{color:#ff7c8c!important}.save{color:#62e7ad!important}
  .big-phone,.footer-phone{color:#ffad61!important;text-shadow:0 0 26px rgba(255,138,53,.17)}

  /* ---------- Forms ---------- */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,select{
    background:rgba(3,9,17,.62)!important;
    color:#edf6ff!important;
    border:1px solid rgba(139,213,255,.18)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 22px rgba(0,0,0,.12)!important;
  }
  input::placeholder,textarea::placeholder{color:#6f849b!important}
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,textarea:focus,select:focus{
    outline:none!important;border-color:rgba(76,224,162,.65)!important;
    box-shadow:0 0 0 4px rgba(76,224,162,.10),0 0 24px rgba(76,224,162,.08)!important;
  }
  input[readonly],input:disabled,select:disabled,textarea:disabled{background:rgba(255,255,255,.04)!important;color:#9fb0c2!important}
  input[type="file"]{background:rgba(255,255,255,.04)!important;color:#c7d4e4!important}
  input[type="checkbox"],input[type="radio"]{accent-color:#35df9b}
  input[type="range"]{accent-color:#35df9b}
  label,.field label,.form-row label{color:#dce8f6!important}
  .hint,.notice,.note,.formula,.summary-warning,.preview-note,.finance-note{
    background:rgba(255,154,67,.075)!important;border-color:rgba(255,154,67,.20)!important;color:#ffd0a4!important;
  }
  .formula,.formula-card{background:rgba(94,223,255,.055)!important;border-color:rgba(94,223,255,.18)!important;color:#ccecff!important}
  .slider-field,.slider-row,.ncb-all-groups-box,.credit-explain{
    background:rgba(255,255,255,.045)!important;border-color:rgba(139,213,255,.14)!important;
  }

  /* ---------- Tables ---------- */
  .table-scroll,.table-wrap{background:rgba(3,9,17,.48)!important;border-color:rgba(139,213,255,.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
  table{background:rgba(4,10,18,.74)!important;color:#dfeaf6!important}
  th{
    background:linear-gradient(135deg,#0b3840,#0c4e49 50%,#0b3653)!important;
    color:#f7fdff!important;border-color:rgba(139,213,255,.13)!important;
    text-shadow:0 1px 12px rgba(0,0,0,.42);
  }
  td{border-color:rgba(139,213,255,.10)!important;color:#cbd8e7!important;background:rgba(255,255,255,.012)!important}
  tbody tr:nth-child(even) td{background:rgba(255,255,255,.025)!important}
  tbody tr:hover td,tr:hover td{background:rgba(76,224,162,.055)!important}

  /* ---------- Footer / legal ---------- */
  .site-footer,.footer-premium{
    background:
      radial-gradient(circle at 15% 0%,rgba(76,224,162,.11),transparent 25%),
      radial-gradient(circle at 85% 10%,rgba(94,223,255,.08),transparent 25%),
      linear-gradient(180deg,#07101c,#04070d)!important;
    border-top:1px solid rgba(139,213,255,.11)!important;
  }
  .site-footer p,.footer-meta p,.footer-facebook p,.footer-bottom,.company-legal-address{color:#9fb0c3!important}
  .site-footer h3,.company-legal-label{color:#8cf4cb!important}
  .footer-card{box-shadow:none!important}
  .footer-bottom{border-top-color:rgba(139,213,255,.11)!important}
  .company-legal-block,.company-legal-in-footer{background:rgba(255,255,255,.025)!important;border-color:rgba(139,213,255,.12)!important}
  .company-legal-company,.company-tax b,.company-legal-heading strong{color:#eef7ff!important}
  .company-tax em{color:#8fa3ba!important}

  /* ---------- Articles / finance / home specialty ---------- */
  .article-back-link,.article-read-btn{color:#8cf4cb!important}
  .article-read-btn{border-color:rgba(76,224,162,.24)!important;background:rgba(76,224,162,.07)!important}
  .finance-banner{background:linear-gradient(135deg,rgba(16,37,49,.84),rgba(20,21,48,.80))!important}
  .lender-mini,.partner-card{background:rgba(255,255,255,.045)!important}
  .contact-highlight-box{background:rgba(76,224,162,.06)!important;border-color:rgba(76,224,162,.17)!important}

  /* ---------- Admin ---------- */
  body:has(.admin-edit-section){background:linear-gradient(180deg,#050810,#07111d)!important}
  .top h1,.admin-page-title-card h2,.card h2,.card h3,.preview-head h2,.preview-section h3,.confirm-box h2{color:#f4f9ff!important}
  .sub,.small,.history-note,.article-color-hint,.portfolio-template-note{color:var(--f-muted)!important}
  .tabs{
    background:rgba(5,10,18,.73)!important;
    border:1px solid rgba(139,213,255,.08)!important;
    border-radius:22px!important;
    padding:10px!important;
    backdrop-filter:blur(18px)!important;
    box-shadow:0 15px 40px rgba(0,0,0,.20)!important;
  }
  .tabs a,.tabs .tab{
    background:rgba(255,255,255,.045)!important;border-color:rgba(139,213,255,.13)!important;color:#b8c9db!important;
  }
  .tabs a.active-admin-tab,.tabs .tab.active,.tab.active{
    background:linear-gradient(135deg,rgba(28,128,97,.95),rgba(40,157,174,.95))!important;
    color:#fff!important;border-color:rgba(94,223,255,.22)!important;
    box-shadow:0 12px 32px rgba(31,193,149,.18)!important;
  }
  .dash-card b,.history-date,.portfolio-upload-card strong,.preview-mini-card b{color:#70e8ff!important}
  .dash-card span,.history-action{color:#d8e5f3!important}
  .preview-overlay,.confirm-overlay{background:rgba(0,5,12,.78)!important;backdrop-filter:blur(10px)!important}
  .preview-head{background:rgba(7,14,25,.96)!important;border-color:rgba(139,213,255,.12)!important}
  .preview-body{background:transparent!important}
  .preview-close{background:rgba(255,82,104,.12)!important;color:#ff8a99!important;border:1px solid rgba(255,82,104,.18)!important}
  .preview-pill-on{background:rgba(76,224,162,.10)!important;color:#8cf4cb!important}
  .preview-pill-off{background:rgba(255,82,104,.10)!important;color:#ff8d9b!important}
  .article-admin-item,.portfolio-template-preview{
    background:linear-gradient(145deg,rgba(16,29,48,.76),rgba(8,17,30,.68))!important;border-color:rgba(139,213,255,.15)!important;
  }

  /* ---------- Login ---------- */
  .login-wrap{background:transparent!important;min-height:calc(100vh - 160px)!important}
  .login-card{border-radius:30px!important;box-shadow:0 35px 100px rgba(0,0,0,.54),0 0 60px rgba(76,224,162,.07)!important}
  .login-card h1,.login-card h2{color:#f6fbff!important}
  .login-card p{color:var(--f-muted)!important}
  .error{color:#ff8898!important}

  /* ---------- Assessment / calculators ---------- */
  .global-consult,.loan-nav-cta{border:1px solid rgba(255,174,100,.25)!important}
  .tools-page,.assessment-page{background:transparent!important}
  .choice{border-radius:30px!important}
  .choice.ongrid,.panel-green{background:linear-gradient(135deg,rgba(9,78,53,.82),rgba(8,40,43,.82))!important;color:#fff!important}
  .choice.hybrid,.panel-blue{background:linear-gradient(135deg,rgba(21,49,89,.86),rgba(27,38,74,.80))!important;color:#fff!important}
  .choice p,.benefit p,.panel-head p,.summary-lead,.summary-section,.credit-explain p{color:#afc2d6!important}
  .choice h2,.benefit b,.benefit strong,.panel-head h2,.summary-section h3{color:#f3f9ff!important}
  .choice .icon,.benefit .icon{background:rgba(255,255,255,.08)!important;border:1px solid rgba(139,213,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
  .view-switch{background:rgba(6,12,22,.76)!important;border:1px solid rgba(139,213,255,.12)!important;border-radius:22px!important;padding:8px!important;backdrop-filter:blur(16px)!important}
  .view-btn.active{background:linear-gradient(135deg,#167d64,#2d93a0)!important;color:#fff!important;border-color:transparent!important}
  .panel,.hybrid-section{background:transparent!important}
  .form-box,.result-card,.compare-card,.credit-explain,.ai-summary-card{border-radius:26px!important}
  .result-list .metric.highlight,.metric.highlight{background:linear-gradient(135deg,rgba(76,224,162,.10),rgba(94,223,255,.055))!important;border-color:rgba(76,224,162,.22)!important}
  .metric span,.kpi .label,.kpi .small{color:#8fa3ba!important}
  .metric strong,.kpi .value{color:#eff8ff!important}
  .warning,.warning.show{background:rgba(255,82,104,.08)!important;color:#ff9aaa!important;border-color:rgba(255,82,104,.18)!important}
  .summary-section{background:rgba(255,255,255,.035)!important;border-color:rgba(139,213,255,.12)!important}
  .summary-section b{color:#eef7ff!important}
  .saving-highlight.green,.saving-highlight.blue{
    background:linear-gradient(135deg,rgba(19,126,88,.95),rgba(22,91,116,.92))!important;
    border:1px solid rgba(94,223,255,.16)!important;box-shadow:0 24px 60px rgba(0,0,0,.30)!important;
  }
  .solar-exit-modal{background:rgba(0,5,12,.80)!important;backdrop-filter:blur(10px)!important}
  .solar-exit-box h2{color:#ff8d9b!important}.solar-exit-box p{color:#b5c7da!important}

  /* Loan-specific hero */
  .loan-site-header{position:sticky!important;top:0!important;z-index:90!important}
  .loan-site-header .loan-nav-row{min-height:82px}
  .loan-site-header .loan-brand img{max-height:58px}
  body:has(.loan-site-header) .hero{
    background:
      radial-gradient(circle at 10% 10%,rgba(76,224,162,.20),transparent 28%),
      radial-gradient(circle at 90% 0%,rgba(94,223,255,.17),transparent 30%),
      linear-gradient(135deg,#07121c,#0a2230 52%,#10253a)!important;
    color:#fff!important;border-bottom:1px solid rgba(139,213,255,.12)!important;
  }
  body:has(.loan-site-header) .hero::after{background:radial-gradient(circle,rgba(76,224,162,.12),transparent 68%)!important}
  body:has(.loan-site-header) .container{color:var(--f-text)!important}
  body:has(.loan-site-header) .tab.tab-icbc{background:linear-gradient(135deg,#8c2638,#d84b5d)!important}
  body:has(.loan-site-header) .tab.tab-tisco{background:linear-gradient(135deg,#1d4d96,#3e81dd)!important}
  body:has(.loan-site-header) .tab.tab-sme{background:linear-gradient(135deg,#126345,#2caa75)!important}
  body:has(.loan-site-header) .pill{color:#ffd0a4!important;background:rgba(255,154,67,.08)!important;border-color:rgba(255,154,67,.18)!important}

  /* Ongrid custom shell: override old light futuristic theme */
  body:has(.hero-brand) .hero{
    background:
      radial-gradient(circle at 12% 12%,rgba(76,224,162,.16),transparent 28%),
      radial-gradient(circle at 88% 8%,rgba(94,223,255,.13),transparent 30%),
      linear-gradient(135deg,rgba(7,20,27,.98),rgba(9,27,41,.96))!important;
    border:1px solid rgba(139,213,255,.14)!important;
    box-shadow:0 28px 76px rgba(0,0,0,.40)!important;
  }
  body:has(.hero-brand) .hero::before,body:has(.hero-brand) .hero::after{opacity:.35!important}
  body:has(.hero-brand) .hero h1,body:has(.hero-brand) .hero p{max-width:none!important;color:#edf7ff!important;text-shadow:none!important}
  .hero-brand-title,.hero-brand-sub{color:#edf7ff!important}
  .green-text{color:#66e9ae!important}.blue-text{color:#7fc3ff!important}

  /* Hybrid calculator shell */
  body:has(.hybrid-section) .hero{
    background:
      radial-gradient(circle at 14% 10%,rgba(76,224,162,.17),transparent 28%),
      radial-gradient(circle at 86% 14%,rgba(108,156,255,.15),transparent 30%),
      linear-gradient(135deg,#07131d,#0a1e2e 55%,#0f2035)!important;
  }
  body:has(.hybrid-section) .hero-card,body:has(.hybrid-section) .visual-card{background:linear-gradient(145deg,rgba(16,29,48,.76),rgba(8,17,30,.66))!important}
  .brand-text .t1,.brand-text .energy,.brand-text .sub{color:#eff8ff!important}

  /* Assessment landing */
  body:has(.choices) .hero{background:transparent!important;box-shadow:none!important;border:0!important}
  body:has(.choices) .brand{background:transparent!important}
  body:has(.choices) .choice .top{color:#f5faff!important}

  /* Portfolio template module */
  body:has(canvas) .wrap,body:has(.portfolio-template-preview){color:var(--f-text)!important}

  /* ---------- Responsive refinements ---------- */
  @media(max-width:1050px){
    .nav.open{top:88px!important}
  }
  @media(max-width:700px){
    body::before{background-size:30px 30px!important;opacity:.38!important}
    .hero-copy{padding:24px!important;border-radius:24px!important}
    .promo-card,.service-card,.info-card,.package-card,.table-card,.gallery-card,.contact-card,.tool-card,.card,.login-card{border-radius:20px!important}
    .tabs{border-radius:18px!important}
  }

  /* Keep document/report previews white even when viewed on dark UI. */
  .professional-print-report,.loan-print-report,.report-page,.print-only .report-page{
    color-scheme:light;
  }
}

/* ==========================================================
   V2 — PREMIUM FUTURE GLASS UI REFINEMENT
   Homepage readability + Assessment input experience + Loan UI
   Screen only. Print/PDF styling remains untouched.
   ========================================================== */
@media screen {
  :root{
    --v2-glass:rgba(8,17,30,.70);
    --v2-glass-strong:rgba(7,15,28,.88);
    --v2-stroke:rgba(133,224,255,.22);
    --v2-stroke-hot:rgba(74,231,178,.58);
    --v2-cyan:#6ee7ff;
    --v2-green:#55e6ac;
    --v2-orange:#ff9b45;
    --v2-white:#f8fbff;
    --v2-muted:#b8c7d9;
    --v2-shadow:0 26px 80px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.075);
  }

  /* ---------- V2 Homepage hero: remove the white wash and rebuild contrast ---------- */
  html body .hero.hero-final-static{
    background-image:
      linear-gradient(90deg,rgba(3,8,15,.96) 0%,rgba(4,10,18,.92) 25%,rgba(5,12,22,.76) 50%,rgba(5,12,22,.50) 70%,rgba(4,9,17,.66) 100%),
      radial-gradient(circle at 17% 26%,rgba(45,213,156,.22),transparent 34%),
      radial-gradient(circle at 84% 18%,rgba(69,180,255,.18),transparent 30%),
      url('assets/company-building.jpg') !important;
    background-size:cover,cover,cover,cover !important;
    background-position:center,center,center,center 48% !important;
    background-repeat:no-repeat !important;
    background-color:#040a13 !important;
    border-bottom:1px solid rgba(116,220,255,.14)!important;
    isolation:isolate!important;
  }
  html body .hero.hero-final-static::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    pointer-events:none!important;
    opacity:.55!important;
    background-image:
      linear-gradient(rgba(110,231,255,.038) 1px,transparent 1px),
      linear-gradient(90deg,rgba(110,231,255,.038) 1px,transparent 1px)!important;
    background-size:46px 46px!important;
    mask-image:linear-gradient(to right,#000 0%,rgba(0,0,0,.6) 50%,transparent 100%)!important;
  }
  html body .hero.hero-final-static::after{
    content:""!important;
    position:absolute!important;
    width:480px!important;
    height:480px!important;
    left:-180px!important;
    bottom:-260px!important;
    z-index:0!important;
    border-radius:50%!important;
    pointer-events:none!important;
    background:radial-gradient(circle,rgba(85,230,172,.20),rgba(61,159,255,.07) 45%,transparent 70%)!important;
    filter:blur(5px)!important;
  }
  html body .hero.hero-final-static .hero-content{
    z-index:2!important;
    padding-right:min(29vw,365px)!important;
  }
  html body .hero.hero-final-static .hero-copy{
    width:min(720px,100%)!important;
    max-width:720px!important;
    padding:34px 36px 32px!important;
    border-radius:32px!important;
    border:1px solid rgba(153,224,255,.22)!important;
    border-left:1px solid rgba(153,224,255,.22)!important;
    background:
      linear-gradient(145deg,rgba(11,24,41,.82),rgba(6,14,26,.65)) padding-box,
      linear-gradient(135deg,rgba(110,231,255,.55),rgba(85,230,172,.36),rgba(255,155,69,.24)) border-box!important;
    box-shadow:0 30px 86px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.09),0 0 55px rgba(69,189,255,.07)!important;
    backdrop-filter:blur(22px) saturate(142%)!important;
    -webkit-backdrop-filter:blur(22px) saturate(142%)!important;
    overflow:hidden!important;
  }
  html body .hero.hero-final-static .hero-copy::after{
    content:""!important;
    position:absolute!important;
    left:28px!important;
    right:28px!important;
    top:0!important;
    height:1px!important;
    background:linear-gradient(90deg,transparent,rgba(110,231,255,.76),rgba(85,230,172,.55),transparent)!important;
    display:block!important;
    z-index:2!important;
  }
  html body .hero.hero-final-static .hero-copy .pill{
    color:#9cf5d5!important;
    background:linear-gradient(135deg,rgba(34,179,128,.17),rgba(70,190,255,.09))!important;
    border:1px solid rgba(85,230,172,.31)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 0 24px rgba(85,230,172,.06)!important;
    padding:10px 16px!important;
    font-size:15px!important;
    letter-spacing:.01em!important;
  }
  html body .hero.hero-final-static h1{
    max-width:640px!important;
    margin:20px 0 14px!important;
    font-size:clamp(48px,5.2vw,72px)!important;
    line-height:1.02!important;
    letter-spacing:-.045em!important;
    color:#f8fbff!important;
    -webkit-text-fill-color:#f8fbff!important;
    -webkit-text-stroke:0!important;
    text-shadow:0 8px 32px rgba(0,0,0,.48),0 0 32px rgba(110,231,255,.08)!important;
    text-wrap:balance!important;
  }
  html body .hero.hero-final-static h1 span{
    display:inline-block!important;
    color:#ff9b45!important;
    -webkit-text-fill-color:#ff9b45!important;
    text-shadow:0 6px 26px rgba(0,0,0,.35),0 0 32px rgba(255,155,69,.20)!important;
    margin-left:0!important;
  }
  html body .hero.hero-final-static .hero-copy > p{
    color:#c7d5e6!important;
    font-size:17px!important;
    line-height:1.78!important;
    max-width:645px!important;
    margin:0!important;
    font-weight:600!important;
    text-shadow:0 2px 16px rgba(0,0,0,.35)!important;
  }
  html body .hero.hero-final-static .hero-benefits{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:10px!important;
    max-width:none!important;
    margin-top:24px!important;
  }
  html body .hero.hero-final-static .hero-benefits div{
    min-height:112px!important;
    padding:13px 8px 11px!important;
    border-radius:18px!important;
    color:#d9e7f6!important;
    font-size:12px!important;
    font-weight:800!important;
    line-height:1.45!important;
    background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035))!important;
    border:1px solid rgba(135,215,255,.14)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 12px 24px rgba(0,0,0,.14)!important;
    transition:transform .2s ease,border-color .2s ease,background .2s ease!important;
  }
  html body .hero.hero-final-static .hero-benefits div:hover{
    transform:translateY(-3px)!important;
    border-color:rgba(85,230,172,.35)!important;
    background:linear-gradient(145deg,rgba(85,230,172,.10),rgba(110,231,255,.055))!important;
  }
  html body .hero.hero-final-static .hero-benefits i{
    width:46px!important;
    height:46px!important;
    border-radius:14px!important;
    font-size:23px!important;
    background:linear-gradient(145deg,rgba(85,230,172,.14),rgba(110,231,255,.10))!important;
    border:1px solid rgba(85,230,172,.22)!important;
    box-shadow:0 8px 22px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.08)!important;
  }
  html body .hero.hero-final-static .hero-actions{
    gap:10px!important;
    margin-top:22px!important;
  }
  html body .hero.hero-final-static .hero-actions .btn{
    min-height:52px!important;
    padding:0 20px!important;
    border-radius:16px!important;
    font-size:15px!important;
    letter-spacing:.01em!important;
  }
  html body .hero.hero-final-static .hero-actions .btn-primary{
    background:linear-gradient(135deg,#ff7f2a,#ffad52)!important;
    box-shadow:0 14px 34px rgba(255,125,40,.22),inset 0 1px 0 rgba(255,255,255,.22)!important;
  }
  html body .hero.hero-final-static .hero-actions .btn-blue{
    background:linear-gradient(135deg,#276ed0,#42b1ff)!important;
    box-shadow:0 14px 34px rgba(52,145,235,.20),inset 0 1px 0 rgba(255,255,255,.18)!important;
  }
  html body .hero.hero-final-static .hero-actions .btn-outline{
    background:rgba(255,255,255,.065)!important;
    color:#f4f9ff!important;
    border-color:rgba(168,222,255,.22)!important;
  }
  html body .hero.hero-final-static .hero-manager-profile{
    filter:drop-shadow(0 28px 40px rgba(0,0,0,.30))!important;
  }
  html body .hero.hero-final-static .manager-photo-wrap::before{
    background:radial-gradient(circle at 50% 45%,rgba(85,230,172,.23) 0%,rgba(61,159,255,.12) 45%,rgba(255,155,69,.08) 62%,transparent 80%)!important;
  }
  html body .hero.hero-final-static .manager-photo-wrap img{
    filter:drop-shadow(0 18px 28px rgba(0,0,0,.36))!important;
  }
  html body .hero.hero-final-static .manager-namebox{
    width:246px!important;
    padding:13px 14px!important;
    background:linear-gradient(145deg,rgba(12,24,41,.88),rgba(6,15,27,.80))!important;
    border:1px solid rgba(139,220,255,.20)!important;
    border-left:3px solid rgba(85,230,172,.70)!important;
    box-shadow:0 18px 42px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.07)!important;
    backdrop-filter:blur(16px)!important;
  }
  html body .hero.hero-final-static .manager-namebox h2{color:#f8fbff!important;margin:0 0 5px!important}
  html body .hero.hero-final-static .manager-namebox p{color:#aebed0!important;margin:0!important}
  html body .hero.hero-final-static > .hero-card{
    right:calc(8.2% + 246px)!important;
    bottom:30px!important;
    max-width:300px!important;
    padding:14px 16px!important;
    border-radius:19px!important;
    background:linear-gradient(145deg,rgba(8,20,35,.86),rgba(6,14,26,.76))!important;
    border:1px solid rgba(85,230,172,.20)!important;
    box-shadow:0 20px 48px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.07)!important;
    backdrop-filter:blur(18px)!important;
  }
  html body .hero.hero-final-static > .hero-card b{font-size:18px!important;color:#91f2cf!important}
  html body .hero.hero-final-static > .hero-card p{font-size:12px!important;color:#aebed0!important;line-height:1.45!important}
  html body .hero.hero-final-static > .hero-card i{width:46px!important;height:46px!important;font-size:22px!important;flex:0 0 auto!important}

  /* ---------- Premium form language shared by Ongrid / Hybrid / Loan ---------- */
  body:has(.hero-brand) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  body:has(.hero-brand) select,
  body:has(.hero-brand) textarea,
  body:has(.hybrid-section) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  body:has(.hybrid-section) select,
  body:has(.hybrid-section) textarea,
  body:has(.loan-site-header) .form-card input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  body:has(.loan-site-header) .form-card select,
  body:has(.loan-site-header) .form-card textarea{
    min-height:52px!important;
    border:1px solid transparent!important;
    border-radius:15px!important;
    background:
      linear-gradient(180deg,rgba(4,11,20,.96),rgba(7,17,30,.92)) padding-box,
      linear-gradient(135deg,rgba(110,231,255,.38),rgba(85,230,172,.22),rgba(255,255,255,.08)) border-box!important;
    color:#eef7ff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 9px 24px rgba(0,0,0,.14)!important;
    transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease!important;
    caret-color:#6ee7ff!important;
  }
  body:has(.hero-brand) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover,
  body:has(.hero-brand) select:hover,
  body:has(.hybrid-section) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover,
  body:has(.hybrid-section) select:hover,
  body:has(.loan-site-header) .form-card input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover,
  body:has(.loan-site-header) .form-card select:hover{
    background:
      linear-gradient(180deg,rgba(5,14,25,.98),rgba(8,20,34,.96)) padding-box,
      linear-gradient(135deg,rgba(110,231,255,.56),rgba(85,230,172,.38),rgba(255,155,69,.18)) border-box!important;
  }
  body:has(.hero-brand) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
  body:has(.hero-brand) select:focus,
  body:has(.hero-brand) textarea:focus,
  body:has(.hybrid-section) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
  body:has(.hybrid-section) select:focus,
  body:has(.hybrid-section) textarea:focus,
  body:has(.loan-site-header) .form-card input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
  body:has(.loan-site-header) .form-card select:focus,
  body:has(.loan-site-header) .form-card textarea:focus{
    outline:none!important;
    transform:translateY(-1px)!important;
    background:
      linear-gradient(180deg,rgba(5,15,27,.99),rgba(8,21,35,.98)) padding-box,
      linear-gradient(135deg,rgba(110,231,255,.92),rgba(85,230,172,.86),rgba(255,155,69,.34)) border-box!important;
    box-shadow:0 0 0 4px rgba(85,230,172,.075),0 0 30px rgba(83,219,255,.09),0 14px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.07)!important;
  }
  body:has(.hero-brand) select option,
  body:has(.hybrid-section) select option,
  body:has(.loan-site-header) select option{background:#08111e!important;color:#edf6ff!important}

  /* ---------- Ongrid assessment: turn each input group into a micro glass card ---------- */
  body:has(.hero-brand) .wrap{max-width:1280px!important}
  body:has(.hero-brand) .hero{
    border-radius:32px!important;
    margin-top:24px!important;
    padding:28px 30px!important;
    background:
      radial-gradient(circle at 10% 10%,rgba(85,230,172,.17),transparent 32%),
      radial-gradient(circle at 92% 10%,rgba(110,231,255,.13),transparent 28%),
      linear-gradient(145deg,rgba(10,27,38,.94),rgba(7,19,34,.90))!important;
    border:1px solid rgba(129,220,255,.18)!important;
    box-shadow:0 28px 80px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.06)!important;
    overflow:hidden!important;
  }
  body:has(.hero-brand) .hero h1{
    font-size:clamp(34px,5vw,66px)!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    color:#f8fbff!important;
    margin-top:12px!important;
  }
  body:has(.hero-brand) .hero p{color:#b9cadc!important;font-weight:650!important}
  body:has(.hero-brand) .hero-brand{
    display:inline-flex!important;
    padding:10px 14px!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.045)!important;
    border:1px solid rgba(135,220,255,.12)!important;
  }
  body:has(.hero-brand) .nav{
    gap:9px!important;
    margin:18px 0!important;
    padding:9px!important;
    border-radius:21px!important;
    background:rgba(6,14,25,.68)!important;
    border:1px solid rgba(131,219,255,.12)!important;
    box-shadow:0 15px 38px rgba(0,0,0,.18)!important;
    backdrop-filter:blur(16px)!important;
  }
  body:has(.hero-brand) .grid.grid-2 > form.card,
  body:has(.hero-brand) .grid.grid-2 > aside.card{
    border-radius:30px!important;
    background:linear-gradient(145deg,rgba(12,25,42,.82),rgba(7,16,29,.74))!important;
    border:1px solid rgba(135,220,255,.16)!important;
    box-shadow:0 24px 70px rgba(0,0,0,.31),inset 0 1px 0 rgba(255,255,255,.06)!important;
  }
  body:has(.hero-brand) .field{
    position:relative!important;
    padding:12px!important;
    border-radius:18px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
    border:1px solid rgba(132,218,255,.105)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
  }
  body:has(.hero-brand) .field::before{
    content:""!important;
    position:absolute!important;
    left:16px!important;
    top:-1px!important;
    width:38%!important;
    height:1px!important;
    background:linear-gradient(90deg,rgba(110,231,255,.48),transparent)!important;
    pointer-events:none!important;
  }
  body:has(.hero-brand) .field:focus-within{
    transform:translateY(-2px)!important;
    border-color:rgba(85,230,172,.30)!important;
    background:linear-gradient(145deg,rgba(85,230,172,.065),rgba(110,231,255,.025))!important;
    box-shadow:0 14px 30px rgba(0,0,0,.18),0 0 26px rgba(85,230,172,.045),inset 0 1px 0 rgba(255,255,255,.05)!important;
  }
  body:has(.hero-brand) .field label{
    color:#d9e8f7!important;
    font-size:13px!important;
    font-weight:850!important;
    margin-bottom:8px!important;
  }
  body:has(.hero-brand) .required{color:#ff8b9b!important;text-shadow:0 0 14px rgba(255,92,114,.25)!important}
  body:has(.hero-brand) .footer-actions{
    gap:10px!important;
    padding-top:8px!important;
  }
  body:has(.hero-brand) .formula{
    border-radius:19px!important;
    padding:18px!important;
    line-height:1.75!important;
    background:linear-gradient(145deg,rgba(110,231,255,.055),rgba(85,230,172,.035))!important;
    border:1px solid rgba(110,231,255,.15)!important;
    color:#c7d9ea!important;
  }

  /* ---------- Hybrid assessment: premium calculator panel and glowing field frames ---------- */
  body:has(.hybrid-section) .hero-card,
  body:has(.hybrid-section) .visual-card,
  body:has(.hybrid-section) .panel{
    border:1px solid rgba(133,220,255,.16)!important;
    box-shadow:0 28px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.055)!important;
    background:linear-gradient(145deg,rgba(12,25,42,.82),rgba(7,16,29,.72))!important;
    backdrop-filter:blur(18px) saturate(135%)!important;
  }
  body:has(.hybrid-section) .hero-card h1{
    color:#f8fbff!important;
    text-shadow:0 8px 32px rgba(0,0,0,.32)!important;
  }
  body:has(.hybrid-section) .hero-card h1 .red{color:#ff8c54!important}
  body:has(.hybrid-section) .hero-copy{color:#b9cadc!important}
  body:has(.hybrid-section) .kicker{color:#79e9ff!important}
  body:has(.hybrid-section) .deye{color:#8fb7ff!important}
  body:has(.hybrid-section) .solar-battery{color:#69e7ae!important}
  body:has(.hybrid-section) .panel-head{
    background:
      radial-gradient(circle at 8% 50%,rgba(85,230,172,.19),transparent 27%),
      linear-gradient(135deg,#081a2c,#0b2b43 58%,#0a3548)!important;
    border-bottom:1px solid rgba(110,231,255,.13)!important;
  }
  body:has(.hybrid-section) .form-box{
    padding:22px!important;
    background:linear-gradient(180deg,rgba(7,16,29,.66),rgba(7,17,30,.48))!important;
    border-right:1px solid rgba(132,218,255,.12)!important;
  }
  body:has(.hybrid-section) .form-row{
    position:relative!important;
    margin-bottom:11px!important;
    padding:11px!important;
    border-radius:18px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
    border:1px solid rgba(132,218,255,.10)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
  }
  body:has(.hybrid-section) .form-row:focus-within{
    transform:translateY(-2px)!important;
    border-color:rgba(85,230,172,.31)!important;
    background:linear-gradient(145deg,rgba(85,230,172,.065),rgba(110,231,255,.025))!important;
    box-shadow:0 14px 30px rgba(0,0,0,.18),0 0 26px rgba(85,230,172,.045),inset 0 1px 0 rgba(255,255,255,.055)!important;
  }
  body:has(.hybrid-section) .form-row label{
    color:#dbe9f7!important;
    font-size:13px!important;
    font-weight:850!important;
    margin-bottom:8px!important;
  }
  body:has(.hybrid-section) .form-row label small{color:#8fa6bd!important}
  body:has(.hybrid-section) input.input-error{
    background:linear-gradient(180deg,rgba(48,10,18,.90),rgba(28,8,14,.90))!important;
    border-color:rgba(255,94,117,.62)!important;
    box-shadow:0 0 0 4px rgba(255,82,104,.09)!important;
  }
  body:has(.hybrid-section) .btns button{
    border:1px solid rgba(255,255,255,.07)!important;
    box-shadow:0 12px 28px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.13)!important;
  }
  body:has(.hybrid-section) .results{background:linear-gradient(180deg,rgba(7,16,29,.20),rgba(7,16,29,.04))!important}
  body:has(.hybrid-section) .recommend-card{
    background:
      radial-gradient(circle at 88% 15%,rgba(110,231,255,.16),transparent 28%),
      linear-gradient(135deg,#0a2744,#0c4a66 58%,#126246)!important;
    border:1px solid rgba(110,231,255,.16)!important;
    box-shadow:0 20px 48px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.08)!important;
  }
  body:has(.hybrid-section) .stat-card,
  body:has(.hybrid-section) .detail{
    background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;
    border-color:rgba(132,218,255,.12)!important;
  }
  body:has(.hybrid-section) .stat-card b,
  body:has(.hybrid-section) .detail strong{color:#eef7ff!important}
  body:has(.hybrid-section) .stat-card.good b{color:#68e9af!important}
  body:has(.hybrid-section) .info-line{
    background:rgba(255,155,69,.075)!important;
    border-color:rgba(255,155,69,.19)!important;
    color:#ffd0a5!important;
  }

  /* ---------- Loan assessment: field blocks, tabs and result cards ---------- */
  body:has(.loan-site-header) main.container{max-width:1180px!important}
  body:has(.loan-site-header) .tabs{
    gap:12px!important;
    padding:10px!important;
    border-radius:24px!important;
    background:rgba(5,12,22,.76)!important;
    border:1px solid rgba(132,218,255,.11)!important;
    box-shadow:0 20px 50px rgba(0,0,0,.24)!important;
  }
  body:has(.loan-site-header) .tabs .tab{
    min-height:58px!important;
    border-radius:17px!important;
    border:1px solid rgba(255,255,255,.08)!important;
    box-shadow:0 12px 28px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.10)!important;
  }
  body:has(.loan-site-header) .tabs .tab.active{
    transform:translateY(-2px)!important;
    box-shadow:0 17px 38px rgba(0,0,0,.26),inset 0 0 0 1px rgba(255,255,255,.20),0 0 28px rgba(110,231,255,.06)!important;
  }
  body:has(.loan-site-header) .section-head{
    padding:4px 2px!important;
  }
  body:has(.loan-site-header) .section-head h2{color:#f7fbff!important;letter-spacing:-.02em!important}
  body:has(.loan-site-header) .section-head p{color:#aebfd1!important}
  body:has(.loan-site-header) .form-card{
    padding:20px!important;
    border-radius:28px!important;
    background:linear-gradient(145deg,rgba(12,25,42,.84),rgba(7,16,29,.76))!important;
    border:1px solid rgba(132,218,255,.15)!important;
  }
  body:has(.loan-site-header) .form-card > h3{
    padding-bottom:12px!important;
    margin-bottom:14px!important;
    border-bottom:1px solid rgba(132,218,255,.10)!important;
  }
  body:has(.loan-site-header) .form-card > label:not(.checkline){
    position:relative!important;
    display:block!important;
    margin-bottom:11px!important;
    padding:11px!important;
    border-radius:18px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
    border:1px solid rgba(132,218,255,.10)!important;
    color:#dceaf7!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
  }
  body:has(.loan-site-header) .form-card > label:not(.checkline):focus-within{
    transform:translateY(-2px)!important;
    border-color:rgba(85,230,172,.31)!important;
    background:linear-gradient(145deg,rgba(85,230,172,.065),rgba(110,231,255,.025))!important;
    box-shadow:0 14px 30px rgba(0,0,0,.18),0 0 26px rgba(85,230,172,.045),inset 0 1px 0 rgba(255,255,255,.055)!important;
  }
  body:has(.loan-site-header) .form-card > label:not(.checkline) input,
  body:has(.loan-site-header) .form-card > label:not(.checkline) select{margin-top:8px!important}
  body:has(.loan-site-header) .checkline{
    margin:4px 0 12px!important;
    padding:12px 13px!important;
    border-radius:16px!important;
    background:rgba(255,255,255,.035)!important;
    border:1px solid rgba(132,218,255,.10)!important;
    color:#dce9f7!important;
  }
  body:has(.loan-site-header) .notice{
    background:linear-gradient(145deg,rgba(255,155,69,.075),rgba(255,155,69,.04))!important;
    border:1px solid rgba(255,155,69,.18)!important;
    color:#ffd0a6!important;
    border-radius:17px!important;
    line-height:1.65!important;
  }
  body:has(.loan-site-header) .result-card,
  body:has(.loan-site-header) .compare-card,
  body:has(.loan-site-header) .credit-explain,
  body:has(.loan-site-header) .detail-card,
  body:has(.loan-site-header) .formula-card{
    border-radius:28px!important;
    background:linear-gradient(145deg,rgba(12,25,42,.80),rgba(7,16,29,.70))!important;
    border:1px solid rgba(132,218,255,.14)!important;
  }
  body:has(.loan-site-header) .result-list .metric{
    min-height:92px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.052),rgba(255,255,255,.022))!important;
    border:1px solid rgba(132,218,255,.11)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  }
  body:has(.loan-site-header) .result-list .metric.highlight{
    background:linear-gradient(145deg,rgba(85,230,172,.11),rgba(110,231,255,.05))!important;
    border-color:rgba(85,230,172,.24)!important;
  }
  body:has(.loan-site-header) .result-list .metric strong{color:#f3f9ff!important}
  body:has(.loan-site-header) .table-wrap{border-radius:19px!important}

  /* ---------- UI details ---------- */
  body:has(.hero-brand) .section-title,
  body:has(.hybrid-section) .panel-head h2,
  body:has(.loan-site-header) .card h3{letter-spacing:-.015em!important}
  body:has(.hero-brand) button,
  body:has(.hybrid-section) button,
  body:has(.loan-site-header) button{transition:transform .18s ease,box-shadow .18s ease,filter .18s ease!important}
  body:has(.hero-brand) button:hover,
  body:has(.hybrid-section) button:hover,
  body:has(.loan-site-header) button:hover{transform:translateY(-2px)!important;filter:brightness(1.06)!important}

  /* ---------- Responsive ---------- */
  @media(max-width:1050px){
    html body .hero.hero-final-static{
      padding:30px 0 24px!important;
      background-image:
        linear-gradient(180deg,rgba(3,8,15,.92),rgba(4,10,18,.82) 55%,rgba(4,10,18,.88)),
        url('assets/company-building.jpg')!important;
      background-size:cover,cover!important;
      background-position:center,center!important;
    }
    html body .hero.hero-final-static .hero-content{padding-right:0!important}
    html body .hero.hero-final-static .hero-copy{max-width:820px!important;margin:0 auto!important}
    html body .hero.hero-final-static > .hero-card{position:relative!important;right:auto!important;bottom:auto!important;max-width:620px!important;margin:18px auto 0!important}
    html body .hero.hero-final-static .hero-manager-profile{margin-top:24px!important}
  }
  @media(max-width:760px){
    html body .hero.hero-final-static .hero-copy{padding:25px 21px 23px!important;border-radius:24px!important}
    html body .hero.hero-final-static h1{font-size:clamp(39px,11vw,54px)!important}
    html body .hero.hero-final-static .hero-copy > p{font-size:15px!important;line-height:1.7!important}
    html body .hero.hero-final-static .hero-benefits{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    html body .hero.hero-final-static .hero-benefits div{min-height:105px!important}
    html body .hero.hero-final-static .hero-actions .btn{width:100%!important}

    body:has(.hero-brand) .hero{padding:22px 18px!important;border-radius:24px!important}
    body:has(.hero-brand) .field,
    body:has(.hybrid-section) .form-row,
    body:has(.loan-site-header) .form-card > label:not(.checkline){padding:10px!important;border-radius:16px!important}
  }
}

/* ==========================================================
   V3 — WARM WHITE LEGIBILITY PASS
   Requested: replace cool gray/blue secondary UI copy with a
   warm white palette across every screen page for stronger
   contrast on the dark glass background.
   Screen only — print/PDF remains untouched.
   ========================================================== */
@media screen {
  :root{
    --warm-white:#fff9f1;
    --warm-white-2:#f6eee5;
    --warm-white-3:#eee4d9;
    --warm-placeholder:#d7cbbf;
    --f-text:var(--warm-white);
    --f-muted:var(--warm-white-2);
    --v2-white:var(--warm-white);
    --v2-muted:var(--warm-white-2);
    --text:var(--warm-white);
    --ink:var(--warm-white);
    --muted:var(--warm-white-2);
    --navy:var(--warm-white);
  }

  /* Global readable copy — warm white instead of cool gray/blue */
  html body{
    color:var(--warm-white)!important;
  }
  html body p,
  html body li,
  html body td,
  html body dd,
  html body figcaption,
  html body small,
  html body .sub,
  html body .small,
  html body .muted,
  html body .preview-muted,
  html body .table-note,
  html body .article-meta,
  html body .history-note,
  html body .article-color-hint,
  html body .portfolio-template-note,
  html body .summary-lead,
  html body .summary-section,
  html body .company-legal-address,
  html body .footer-bottom,
  html body .company-tax em,
  html body .history-action,
  html body .metric span,
  html body .kpi .label,
  html body .kpi .small,
  html body .quick-note,
  html body .detail,
  html body .credit-explain p,
  html body .choice p,
  html body .benefit p,
  html body .panel-head p,
  html body .section-head p,
  html body .subhero p,
  html body .info-card p,
  html body .service-card p,
  html body .service-card-body p,
  html body .tool-card p,
  html body .package-card ul,
  html body .contact-card p,
  html body .finance-banner p,
  html body .article-body p,
  html body .promo-card p,
  html body .home-promo-card p,
  html body .home-promo-content p,
  html body .site-footer p,
  html body .footer-meta p,
  html body .footer-facebook p,
  html body .login-card p,
  html body .hero p,
  html body .hero-copy p,
  html body .hero-card p{
    color:var(--warm-white-2)!important;
  }

  /* Navigation, labels and general interface copy */
  html body .nav a,
  html body .global-nav a,
  html body .loan-nav a,
  html body label,
  html body .field label,
  html body .form-row label,
  html body .checkline,
  html body .dash-card span,
  html body td,
  html body .detail,
  html body .form-card > label:not(.checkline){
    color:var(--warm-white)!important;
  }

  /* Homepage promo descriptions: explicit fix for the text shown in the reference image */
  html body .home-promo-content > p,
  html body .home-promo-card .home-promo-content > p{
    color:#fff8ef!important;
    opacity:1!important;
    font-weight:600!important;
    text-shadow:0 1px 10px rgba(0,0,0,.34)!important;
  }

  /* Homepage hero secondary copy */
  html body .hero.hero-final-static .hero-copy > p,
  html body .hero.hero-final-static .hero-benefits div,
  html body .hero.hero-final-static .manager-namebox p,
  html body .hero.hero-final-static > .hero-card p{
    color:#f7eee4!important;
    opacity:1!important;
  }

  /* Ongrid assessment */
  body:has(.hero-brand) .hero p,
  body:has(.hero-brand) .hero-copy,
  body:has(.hero-brand) .section-head p,
  body:has(.hero-brand) .form-row label,
  body:has(.hero-brand) .form-row label small,
  body:has(.hero-brand) .quick-note,
  body:has(.hero-brand) .metric span,
  body:has(.hero-brand) .kpi .label,
  body:has(.hero-brand) .kpi .small,
  body:has(.hero-brand) .detail,
  body:has(.hero-brand) td{
    color:var(--warm-white-2)!important;
  }

  /* Hybrid assessment */
  body:has(.hybrid-section) .hero-copy,
  body:has(.hybrid-section) .panel-head p,
  body:has(.hybrid-section) .form-row label,
  body:has(.hybrid-section) .form-row label small,
  body:has(.hybrid-section) .quick-note,
  body:has(.hybrid-section) .detail,
  body:has(.hybrid-section) .stat-card span,
  body:has(.hybrid-section) .metric span,
  body:has(.hybrid-section) td{
    color:var(--warm-white-2)!important;
  }

  /* Loan assessment */
  body:has(.loan-site-header) .section-head p,
  body:has(.loan-site-header) .form-card > label:not(.checkline),
  body:has(.loan-site-header) .checkline,
  body:has(.loan-site-header) .credit-explain p,
  body:has(.loan-site-header) .result-list .metric span,
  body:has(.loan-site-header) .detail-card p,
  body:has(.loan-site-header) td{
    color:var(--warm-white-2)!important;
  }

  /* Inputs and placeholders: keep typed values bright, placeholders slightly softer */
  html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  html body select,
  html body textarea{
    color:var(--warm-white)!important;
  }
  html body input::placeholder,
  html body textarea::placeholder{
    color:var(--warm-placeholder)!important;
    opacity:.88!important;
  }
  html body input[readonly],
  html body input:disabled,
  html body select:disabled,
  html body textarea:disabled{
    color:var(--warm-white-3)!important;
    opacity:.88!important;
  }

  /* Keep semantic/accent colors intentional so hierarchy is not flattened */
  html body .price{color:#ff7c8c!important}
  html body .save{color:#62e7ad!important}
  html body .big-phone,
  html body .footer-phone{color:#ffad61!important}
  html body .site-footer h3,
  html body .company-legal-label,
  html body .article-back-link,
  html body .article-read-btn,
  html body .preview-pill-on{color:#8cf4cb!important}
  html body .error,
  html body .warning,
  html body .warning.show,
  html body .preview-pill-off,
  html body .solar-exit-box h2{color:#ff9aaa!important}
  html body .green-text,
  body:has(.hybrid-section) .solar-battery{color:#69e7ae!important}
  html body .blue-text,
  body:has(.hybrid-section) .deye{color:#8fbfff!important}
  body:has(.hybrid-section) .kicker{color:#79e9ff!important}
  html body .hero h1 span{color:#ff9b45!important;-webkit-text-fill-color:#ff9b45!important}

  /* Notices remain warm and prominent instead of gray-blue */
  html body .notice,
  body:has(.loan-site-header) .notice,
  body:has(.hybrid-section) .info-line{
    color:#ffe0bf!important;
  }
}

/* ==========================================================
   V4 — DARK GLASS PRICE TABLES
   Remove light/white zebra rows from public Huawei Ongrid and
   Deye Hybrid price tables while preserving warm-white copy.
   Screen only; print/PDF remains untouched.
   ========================================================== */
@media screen {
  /* Ensure the old light theme's tr zebra background can never bleed through. */
  html body .table-card .table-scroll{
    background:
      radial-gradient(circle at 10% 0%,rgba(74,231,178,.08),transparent 26%),
      linear-gradient(145deg,rgba(3,10,18,.94),rgba(5,14,25,.90))!important;
    border:1px solid rgba(118,221,255,.19)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 18px 44px rgba(0,0,0,.22)!important;
  }

  html body .ongrid-table,
  html body .hybrid-table{
    background:#06101b!important;
    color:#fff9f1!important;
  }

  html body .ongrid-table tbody tr,
  html body .hybrid-table tbody tr{
    background:#07131f!important;
  }

  html body .ongrid-table tbody tr:nth-child(odd) td,
  html body .hybrid-table tbody tr:nth-child(odd) td{
    background:linear-gradient(90deg,rgba(6,18,30,.98),rgba(8,23,35,.98))!important;
    color:#fff9f1!important;
  }

  html body .ongrid-table tbody tr:nth-child(even) td,
  html body .hybrid-table tbody tr:nth-child(even) td{
    background:linear-gradient(90deg,rgba(7,31,35,.98),rgba(8,27,40,.98))!important;
    color:#fff9f1!important;
  }

  html body .ongrid-table tbody td,
  html body .hybrid-table tbody td{
    border-bottom:1px solid rgba(139,213,255,.105)!important;
    border-right:1px solid rgba(139,213,255,.055)!important;
    text-shadow:0 1px 10px rgba(0,0,0,.22)!important;
  }

  html body .ongrid-table tbody tr:hover td,
  html body .hybrid-table tbody tr:hover td{
    background:linear-gradient(90deg,rgba(10,52,53,.98),rgba(9,42,58,.98))!important;
    box-shadow:inset 0 1px 0 rgba(96,241,192,.08),inset 0 -1px 0 rgba(96,241,192,.08)!important;
  }

  html body .ongrid-table th,
  html body .hybrid-table th{
    background:linear-gradient(135deg,#0a3037 0%,#0b4a47 52%,#0a3451 100%)!important;
    color:#fffdf8!important;
    border-color:rgba(139,213,255,.13)!important;
  }

  html body .ongrid-table .price,
  html body .hybrid-table .price{color:#ff7f91!important;text-shadow:0 0 18px rgba(255,105,125,.10)!important}
  html body .ongrid-table .save,
  html body .hybrid-table .save{color:#63eab3!important;text-shadow:0 0 18px rgba(99,234,179,.10)!important}
}


/* ===== V6: persistent current-page navigation indicator ===== */
.nav a.active,
.nav a[aria-current="page"]{
  color:#fff!important;
  text-shadow:0 0 14px rgba(108,225,255,.22),0 1px 14px rgba(0,0,0,.55)!important;
}
.nav a.active::after,
.nav a[aria-current="page"]::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:-10px!important;
  height:4px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#4ce0a2 0%,#59d8ff 58%,#7fe9ff 100%)!important;
  box-shadow:0 0 10px rgba(89,216,255,.78),0 0 22px rgba(76,224,162,.34)!important;
  opacity:1!important;
  transform:none!important;
}
@media(max-width:1050px){
  .nav a.active::after,
  .nav a[aria-current="page"]::after{bottom:2px!important;}
}

/* ==========================================================
   V7 — HOMEPAGE FINANCE LENDER CARDS
   Branded dark-glass presentation for TISCO / ICBC / SME D Bank.
   Keeps the original logo files; CSS blend treatment removes the
   harsh white logo blocks against the dark UI.
   ========================================================== */
@media screen {
  .finance-style-card .lender-showcase-v7{
    gap:18px!important;
    margin-top:4px;
  }

  .finance-style-card .lender-showcase-v7 .lender-showcase-item{
    --brand-rgb: 94,223,255;
    position:relative!important;
    isolation:isolate;
    min-height:198px!important;
    padding:18px 16px 16px!important;
    gap:12px!important;
    overflow:hidden!important;
    border-radius:24px!important;
    border:1px solid rgba(var(--brand-rgb),.34)!important;
    background:
      radial-gradient(circle at 50% -18%,rgba(var(--brand-rgb),.20),transparent 48%),
      linear-gradient(145deg,rgba(13,28,48,.88),rgba(5,13,25,.90))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.07),
      0 16px 34px rgba(0,0,0,.25),
      0 0 28px rgba(var(--brand-rgb),.06)!important;
    backdrop-filter:blur(20px) saturate(140%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(140%)!important;
    transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
  }

  .finance-style-card .lender-showcase-v7 .lender-showcase-item::before{
    content:"";
    position:absolute;
    z-index:-1;
    left:18%;
    right:18%;
    top:0;
    height:3px;
    border-radius:0 0 999px 999px;
    background:linear-gradient(90deg,transparent,rgba(var(--brand-rgb),.98),transparent);
    box-shadow:0 0 18px rgba(var(--brand-rgb),.42);
  }

  .finance-style-card .lender-showcase-v7 .lender-showcase-item::after{
    content:"";
    position:absolute;
    z-index:-2;
    width:150px;
    height:150px;
    right:-56px;
    bottom:-70px;
    border-radius:50%;
    background:rgba(var(--brand-rgb),.14);
    filter:blur(28px);
    pointer-events:none;
  }

  .finance-style-card .lender-showcase-v7 .lender-showcase-item:hover{
    transform:translateY(-4px)!important;
    border-color:rgba(var(--brand-rgb),.58)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.10),
      0 20px 44px rgba(0,0,0,.31),
      0 0 34px rgba(var(--brand-rgb),.13)!important;
  }

  .finance-style-card .lender-showcase-v7 .lender-logo-stage{
    position:relative;
    width:100%;
    height:118px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:9px 14px;
    overflow:hidden;
    border-radius:18px;
    border:1px solid rgba(var(--brand-rgb),.20);
    background:
      radial-gradient(circle at 50% 28%,rgba(255,255,255,.32),rgba(255,255,255,.10) 42%,transparent 78%),
      linear-gradient(135deg,rgba(var(--brand-rgb),.28),rgba(var(--brand-rgb),.10))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.17),
      inset 0 -1px 0 rgba(0,0,0,.14),
      0 10px 24px rgba(0,0,0,.14);
  }

  .finance-style-card .lender-showcase-v7 .lender-logo-stage::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(115deg,transparent 8%,rgba(255,255,255,.08) 38%,transparent 62%);
  }

  .finance-style-card .lender-showcase-v7 .lender-logo-stage img{
    position:relative;
    z-index:1;
    display:block;
    width:auto!important;
    max-width:88%!important;
    height:auto!important;
    max-height:104px!important;
    object-fit:contain!important;
    border-radius:12px;
    mix-blend-mode:darken;
    filter:saturate(1.12) contrast(1.08) brightness(1.04)!important;
  }

  /* TISCO: larger logo and cool deep-blue identity */
  .finance-style-card .lender-showcase-v7 .lender-tisco{--brand-rgb:53,137,235;}
  .finance-style-card .lender-showcase-v7 .lender-tisco .lender-logo-stage{
    background:
      radial-gradient(circle at 50% 24%,rgba(188,222,255,.56),rgba(87,157,225,.30) 48%,rgba(20,74,130,.24) 100%)!important;
  }
  .finance-style-card .lender-showcase-v7 .lender-tisco .lender-logo-stage img{
    max-width:96%!important;
    max-height:108px!important;
    transform:scale(1.72);
  }
  .finance-style-card .lender-showcase-v7 .lender-tisco .lender-brand-name{
    color:#0b4fa7!important;
    -webkit-text-stroke:1.15px rgba(255,255,255,.94);
    paint-order:stroke fill;
    text-shadow:0 0 16px rgba(56,142,240,.36),0 2px 10px rgba(0,0,0,.55)!important;
  }

  /* ICBC: red identity */
  .finance-style-card .lender-showcase-v7 .lender-icbc{--brand-rgb:231,69,69;}
  .finance-style-card .lender-showcase-v7 .lender-icbc .lender-logo-stage{
    background:
      radial-gradient(circle at 50% 24%,rgba(255,221,221,.53),rgba(222,106,106,.28) 48%,rgba(112,29,29,.20) 100%)!important;
  }
  .finance-style-card .lender-showcase-v7 .lender-icbc .lender-logo-stage img{
    max-width:82%!important;
    max-height:108px!important;
  }
  .finance-style-card .lender-showcase-v7 .lender-icbc .lender-brand-name{
    color:#df2f36!important;
    -webkit-text-stroke:1.15px rgba(255,255,255,.95);
    paint-order:stroke fill;
    text-shadow:0 0 16px rgba(231,69,69,.34),0 2px 10px rgba(0,0,0,.55)!important;
  }

  /* SME D Bank: green identity */
  .finance-style-card .lender-showcase-v7 .lender-sme{--brand-rgb:58,191,118;}
  .finance-style-card .lender-showcase-v7 .lender-sme .lender-logo-stage{
    background:
      radial-gradient(circle at 50% 24%,rgba(219,255,234,.55),rgba(100,202,145,.29) 48%,rgba(30,101,65,.22) 100%)!important;
  }
  .finance-style-card .lender-showcase-v7 .lender-sme .lender-logo-stage img{
    max-width:94%!important;
    max-height:106px!important;
    transform:scale(1.18);
  }
  .finance-style-card .lender-showcase-v7 .lender-sme .lender-brand-name{
    color:#24a861!important;
    -webkit-text-stroke:1.15px rgba(255,255,255,.95);
    paint-order:stroke fill;
    text-shadow:0 0 16px rgba(58,191,118,.34),0 2px 10px rgba(0,0,0,.55)!important;
  }

  .finance-style-card .lender-showcase-v7 .lender-brand-name{
    position:relative;
    z-index:2;
    font-size:20px!important;
    line-height:1.1;
    font-weight:950!important;
    letter-spacing:.2px;
    text-align:center;
  }

  @media(max-width:680px){
    .finance-style-card .lender-showcase-v7{grid-template-columns:1fr!important;gap:14px!important;}
    .finance-style-card .lender-showcase-v7 .lender-showcase-item{min-height:184px!important;}
    .finance-style-card .lender-showcase-v7 .lender-logo-stage{height:108px;}
  }
}

/* ==========================================================
   V8 — HOMEPAGE FINANCE LOGOS: WHITE FROSTED GLASS
   Keeps branded dark-glass cards from V7, but restores a clean,
   bright white frosted-glass stage behind each official logo.
   ========================================================== */
@media screen {
  .finance-style-card .lender-showcase-v7 .lender-logo-stage,
  .finance-style-card .lender-showcase-v7 .lender-tisco .lender-logo-stage,
  .finance-style-card .lender-showcase-v7 .lender-icbc .lender-logo-stage,
  .finance-style-card .lender-showcase-v7 .lender-sme .lender-logo-stage{
    border:1px solid rgba(255,255,255,.72)!important;
    background:
      linear-gradient(145deg,rgba(255,255,255,.96),rgba(247,251,255,.88) 56%,rgba(232,241,249,.82))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,1),
      inset 0 -1px 0 rgba(161,183,203,.20),
      0 12px 30px rgba(0,0,0,.20),
      0 0 24px rgba(var(--brand-rgb),.10)!important;
    backdrop-filter:blur(24px) saturate(120%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(120%)!important;
  }

  .finance-style-card .lender-showcase-v7 .lender-logo-stage::before{
    content:"";
    position:absolute;
    left:8%;
    right:8%;
    top:8px;
    height:34%;
    border-radius:999px;
    background:linear-gradient(180deg,rgba(255,255,255,.74),rgba(255,255,255,0));
    filter:blur(6px);
    opacity:.76;
    pointer-events:none;
  }

  .finance-style-card .lender-showcase-v7 .lender-logo-stage::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    border-radius:inherit;
    background:
      linear-gradient(120deg,rgba(255,255,255,.38) 0%,rgba(255,255,255,.08) 33%,transparent 54%),
      radial-gradient(circle at 18% 12%,rgba(255,255,255,.42),transparent 34%);
    mix-blend-mode:screen;
  }

  .finance-style-card .lender-showcase-v7 .lender-logo-stage img{
    mix-blend-mode:normal!important;
    filter:saturate(1.08) contrast(1.07) brightness(1.01)!important;
    box-shadow:none!important;
  }

  .finance-style-card .lender-showcase-v7 .lender-showcase-item:hover .lender-logo-stage{
    border-color:rgba(255,255,255,.94)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,1),
      inset 0 -1px 0 rgba(161,183,203,.18),
      0 16px 34px rgba(0,0,0,.24),
      0 0 30px rgba(var(--brand-rgb),.18)!important;
  }
}

/* =========================================================
   V11 — THE 1 ENERGY company logo: white futuristic glass card
   Screen only. Keeps original logo artwork and white identity background.
   ========================================================= */
@media screen {
  :is(
    .site-header .brand img,
    .global-logo img,
    .loan-brand img,
    .login-logo img,
    .footer-brand img,
    .assessment-main-logo,
    .hero-brand-logo,
    .hero__logo--top,
    .brand-logo
  ) {
    background:linear-gradient(145deg,rgba(255,255,255,.985) 0%,rgba(255,255,255,.955) 44%,rgba(241,249,255,.925) 100%) !important;
    border:1px solid rgba(255,255,255,.96) !important;
    border-radius:20px !important;
    padding:8px 11px !important;
    overflow:hidden !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,1),inset 0 -12px 24px rgba(89,203,255,.055),0 10px 28px rgba(0,0,0,.30),0 0 0 1px rgba(94,223,255,.09),0 0 24px rgba(76,224,162,.08) !important;
    -webkit-backdrop-filter:blur(20px) saturate(145%) !important;
    backdrop-filter:blur(20px) saturate(145%) !important;
    filter:brightness(1.025) contrast(1.015) saturate(1.035) !important;
    transition:transform .22s ease,box-shadow .22s ease,filter .22s ease !important;
  }
  :is(.site-header .brand,.global-logo,.loan-brand){position:relative!important;border-radius:22px!important;isolation:isolate!important}
  :is(.site-header .brand,.global-logo,.loan-brand)::after{
    content:"";position:absolute;left:10%;right:10%;top:5px;height:1px;border-radius:99px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.98),rgba(94,223,255,.32),transparent);
    box-shadow:0 0 12px rgba(255,255,255,.34);pointer-events:none;z-index:2
  }
  :is(.site-header .brand,.global-logo,.loan-brand):hover img{
    transform:translateY(-1px)!important;
    filter:brightness(1.045) contrast(1.02) saturate(1.05)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,1),inset 0 -12px 24px rgba(89,203,255,.07),0 14px 34px rgba(0,0,0,.34),0 0 0 1px rgba(94,223,255,.18),0 0 30px rgba(76,224,162,.12)!important
  }
  .site-header .brand img{border-radius:18px!important}
  .global-logo img,.loan-brand img{border-radius:16px!important}
  .login-logo img,.assessment-main-logo,.hero-brand-logo,.hero__logo--top,.brand-logo,.footer-brand img{border-radius:18px!important}
  @media(max-width:680px){
    :is(.site-header .brand img,.global-logo img,.loan-brand img,.login-logo img,.footer-brand img,.assessment-main-logo,.hero-brand-logo,.hero__logo--top,.brand-logo){border-radius:15px!important;padding:6px 8px!important}
  }
}


/* =========================================================
   V12 — LOAN ASSESSMENT LENDER CARDS
   Match the premium lender logo cards used on the home page.
   Scoped only to tools/loan via .loan-site-header.
   ========================================================= */
@media screen {
  body:has(.loan-site-header) .loan-lender-tabs{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:26px!important;
    padding:0!important;
    margin:6px 0 28px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    overflow:visible!important;
  }

  body:has(.loan-site-header) .loan-lender-tabs .loan-lender-tab{
    position:relative!important;
    isolation:isolate!important;
    min-height:300px!important;
    padding:28px 26px 24px!important;
    border-radius:38px!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:20px!important;
    transform:none!important;
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,filter .22s ease!important;
    backdrop-filter:blur(26px) saturate(135%)!important;
    -webkit-backdrop-filter:blur(26px) saturate(135%)!important;
  }

  body:has(.loan-site-header) .loan-lender-tabs .loan-lender-tab::before{
    content:"";
    position:absolute;
    inset:0 15% auto 15%;
    height:4px;
    border-radius:0 0 999px 999px;
    opacity:.95;
    filter:drop-shadow(0 0 10px currentColor);
  }

  body:has(.loan-site-header) .loan-lender-tabs .loan-lender-tab::after{
    content:"";
    position:absolute;
    z-index:-1;
    width:72%;
    height:44%;
    left:14%;
    bottom:-18%;
    border-radius:50%;
    filter:blur(38px);
    opacity:.22;
    pointer-events:none;
  }

  body:has(.loan-site-header) .loan-lender-tabs .tab-icbc{
    background:
      radial-gradient(circle at 50% 3%,rgba(255,88,104,.17),transparent 34%),
      linear-gradient(145deg,rgba(42,15,26,.92),rgba(9,19,34,.94) 72%)!important;
    border:1px solid rgba(239,68,68,.48)!important;
    box-shadow:0 24px 58px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.07),0 0 30px rgba(239,68,68,.07)!important;
  }
  body:has(.loan-site-header) .loan-lender-tabs .tab-icbc::before{background:linear-gradient(90deg,transparent,#ff4458,transparent);color:#ff4458}
  body:has(.loan-site-header) .loan-lender-tabs .tab-icbc::after{background:#ef3340}

  body:has(.loan-site-header) .loan-lender-tabs .tab-tisco{
    background:
      radial-gradient(circle at 50% 3%,rgba(48,142,255,.17),transparent 34%),
      linear-gradient(145deg,rgba(10,35,69,.94),rgba(8,19,35,.95) 72%)!important;
    border:1px solid rgba(54,135,255,.50)!important;
    box-shadow:0 24px 58px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.07),0 0 30px rgba(50,130,255,.08)!important;
  }
  body:has(.loan-site-header) .loan-lender-tabs .tab-tisco::before{background:linear-gradient(90deg,transparent,#258dff,transparent);color:#258dff}
  body:has(.loan-site-header) .loan-lender-tabs .tab-tisco::after{background:#1769d8}

  body:has(.loan-site-header) .loan-lender-tabs .tab-sme{
    background:
      radial-gradient(circle at 50% 3%,rgba(53,220,142,.17),transparent 34%),
      linear-gradient(145deg,rgba(10,56,43,.94),rgba(7,25,30,.95) 72%)!important;
    border:1px solid rgba(45,196,119,.48)!important;
    box-shadow:0 24px 58px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.07),0 0 30px rgba(45,196,119,.08)!important;
  }
  body:has(.loan-site-header) .loan-lender-tabs .tab-sme::before{background:linear-gradient(90deg,transparent,#35d98c,transparent);color:#35d98c}
  body:has(.loan-site-header) .loan-lender-tabs .tab-sme::after{background:#23a96b}

  body:has(.loan-site-header) .loan-lender-logo-stage{
    position:relative!important;
    width:min(100%,250px)!important;
    height:178px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:18px!important;
    border-radius:34px!important;
    background:
      linear-gradient(145deg,rgba(255,255,255,.99),rgba(248,250,252,.95) 58%,rgba(224,230,236,.94))!important;
    border:1px solid rgba(255,255,255,.96)!important;
    box-shadow:
      0 18px 40px rgba(0,0,0,.24),
      inset 0 1px 0 rgba(255,255,255,1),
      inset 0 -1px 0 rgba(148,163,184,.20)!important;
    overflow:hidden!important;
  }
  body:has(.loan-site-header) .loan-lender-logo-stage::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(125deg,rgba(255,255,255,.74) 0%,rgba(255,255,255,.13) 38%,transparent 53%);
    pointer-events:none;
  }
  body:has(.loan-site-header) .loan-lender-logo-stage img{
    position:relative!important;
    z-index:1!important;
    display:block!important;
    width:100%!important;
    max-width:210px!important;
    height:100%!important;
    max-height:138px!important;
    object-fit:contain!important;
    filter:none!important;
    opacity:1!important;
  }
  body:has(.loan-site-header) .loan-lender-tabs .tab-icbc .loan-lender-logo-stage img{max-width:180px!important;max-height:145px!important}
  body:has(.loan-site-header) .loan-lender-tabs .tab-tisco .loan-lender-logo-stage img{max-width:215px!important;max-height:128px!important}
  body:has(.loan-site-header) .loan-lender-tabs .tab-sme .loan-lender-logo-stage img{max-width:185px!important;max-height:134px!important}

  body:has(.loan-site-header) .loan-lender-name{
    display:block!important;
    font-size:clamp(25px,2.5vw,35px)!important;
    line-height:1!important;
    font-weight:1000!important;
    letter-spacing:.01em!important;
    text-align:center!important;
    paint-order:stroke fill!important;
    -webkit-text-stroke:1.15px rgba(255,255,255,.96)!important;
    text-shadow:0 4px 18px rgba(0,0,0,.34)!important;
  }
  body:has(.loan-site-header) .tab-icbc .loan-lender-name{color:#e52d3d!important}
  body:has(.loan-site-header) .tab-tisco .loan-lender-name{color:#075aa8!important}
  body:has(.loan-site-header) .tab-sme .loan-lender-name{color:#15915a!important}

  body:has(.loan-site-header) .loan-lender-tabs .loan-lender-tab:hover{
    transform:translateY(-6px)!important;
    filter:brightness(1.05)!important;
  }
  body:has(.loan-site-header) .loan-lender-tabs .loan-lender-tab.active{
    transform:translateY(-5px)!important;
    outline:2px solid rgba(255,255,255,.70)!important;
    outline-offset:3px!important;
  }
  body:has(.loan-site-header) .loan-lender-tabs .tab-icbc.active{box-shadow:0 28px 66px rgba(0,0,0,.34),0 0 0 1px rgba(255,72,88,.30),0 0 42px rgba(255,72,88,.18)!important}
  body:has(.loan-site-header) .loan-lender-tabs .tab-tisco.active{box-shadow:0 28px 66px rgba(0,0,0,.34),0 0 0 1px rgba(52,142,255,.30),0 0 42px rgba(52,142,255,.18)!important}
  body:has(.loan-site-header) .loan-lender-tabs .tab-sme.active{box-shadow:0 28px 66px rgba(0,0,0,.34),0 0 0 1px rgba(53,217,140,.30),0 0 42px rgba(53,217,140,.18)!important}

  @media(max-width:860px){
    body:has(.loan-site-header) .loan-lender-tabs{grid-template-columns:1fr!important;gap:16px!important}
    body:has(.loan-site-header) .loan-lender-tabs .loan-lender-tab{min-height:210px!important;padding:18px!important;border-radius:28px!important;gap:14px!important}
    body:has(.loan-site-header) .loan-lender-logo-stage{height:128px!important;width:min(100%,230px)!important;border-radius:26px!important;padding:13px!important}
    body:has(.loan-site-header) .loan-lender-logo-stage img{max-height:102px!important}
    body:has(.loan-site-header) .loan-lender-name{font-size:27px!important}
  }
}

/* ==========================================================
   V13 — FINANCE PAGE: MATCH LENDER BRAND CARDS TO ASSESSMENT UI
   Applies the same TISCO / ICBC / SME D Bank visual language to
   both the compact lender row and the full partner cards.
   ========================================================== */
@media screen {
  /* ---------- Compact lender row inside the finance banner ---------- */
  .finance-banner .lender-mini-grid-banner{
    gap:14px!important;
    max-width:720px!important;
    margin-top:20px!important;
  }
  .finance-banner .lender-mini{
    --brand-rgb:94,223,255;
    position:relative!important;
    isolation:isolate!important;
    min-height:148px!important;
    padding:14px!important;
    gap:10px!important;
    overflow:hidden!important;
    border-radius:24px!important;
    border:1px solid rgba(var(--brand-rgb),.34)!important;
    background:
      radial-gradient(circle at 50% -20%,rgba(var(--brand-rgb),.18),transparent 48%),
      linear-gradient(145deg,rgba(14,29,48,.92),rgba(5,13,25,.94))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.07),
      0 16px 34px rgba(0,0,0,.25),
      0 0 26px rgba(var(--brand-rgb),.07)!important;
    backdrop-filter:blur(20px) saturate(145%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(145%)!important;
    transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important;
  }
  .finance-banner .lender-mini::before{
    content:"";
    position:absolute;
    left:18%;right:18%;top:0;height:3px;
    border-radius:0 0 999px 999px;
    background:linear-gradient(90deg,transparent,rgba(var(--brand-rgb),.95),transparent);
    box-shadow:0 0 18px rgba(var(--brand-rgb),.42);
    pointer-events:none;
  }
  .finance-banner .lender-mini::after{
    content:"";
    position:absolute;
    width:120px;height:120px;right:-42px;bottom:-58px;
    border-radius:50%;background:rgba(var(--brand-rgb),.12);filter:blur(24px);
    pointer-events:none;z-index:-1;
  }
  .finance-banner .lender-mini:nth-child(1){--brand-rgb:53,137,235;}
  .finance-banner .lender-mini:nth-child(2){--brand-rgb:231,69,69;}
  .finance-banner .lender-mini:nth-child(3){--brand-rgb:58,191,118;}
  .finance-banner .lender-mini:hover{
    transform:translateY(-4px)!important;
    border-color:rgba(var(--brand-rgb),.56)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 20px 42px rgba(0,0,0,.30),0 0 30px rgba(var(--brand-rgb),.13)!important;
  }
  .finance-banner .lender-mini img{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    height:88px!important;
    object-fit:contain!important;
    padding:10px 14px!important;
    border-radius:18px!important;
    border:1px solid rgba(255,255,255,.90)!important;
    background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(247,251,255,.94) 58%,rgba(232,241,249,.90))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,1),inset 0 -1px 0 rgba(161,183,203,.20),0 10px 24px rgba(0,0,0,.18),0 0 20px rgba(var(--brand-rgb),.09)!important;
    filter:saturate(1.08) contrast(1.06) brightness(1.01)!important;
  }
  .finance-banner .lender-mini:nth-child(1) img{padding:10px 8px!important;transform:scale(1.05);}
  .finance-banner .lender-mini:nth-child(2) img{padding:6px 18px!important;}
  .finance-banner .lender-mini:nth-child(3) img{padding:7px 18px!important;}
  .finance-banner .lender-mini span{
    font-size:19px!important;
    line-height:1!important;
    font-weight:1000!important;
    letter-spacing:.01em!important;
    paint-order:stroke fill!important;
    -webkit-text-stroke:1px rgba(255,255,255,.96)!important;
    text-shadow:0 3px 14px rgba(0,0,0,.42)!important;
  }
  .finance-banner .lender-mini:nth-child(1) span{color:#075aa8!important;}
  .finance-banner .lender-mini:nth-child(2) span{color:#e52d3d!important;}
  .finance-banner .lender-mini:nth-child(3) span{color:#15915a!important;}

  /* ---------- Full partner cards ---------- */
  .finance-partners .partner-grid{gap:22px!important;}
  .finance-partners .partner-card{
    --brand-rgb:94,223,255;
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    min-height:100%!important;
    padding:24px 24px 26px!important;
    border-radius:30px!important;
    border:1px solid rgba(var(--brand-rgb),.38)!important;
    background:
      radial-gradient(circle at 50% -12%,rgba(var(--brand-rgb),.18),transparent 44%),
      linear-gradient(145deg,rgba(14,29,48,.94),rgba(5,13,25,.96))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.08),
      0 22px 48px rgba(0,0,0,.28),
      0 0 36px rgba(var(--brand-rgb),.07)!important;
    backdrop-filter:blur(22px) saturate(145%)!important;
    -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
    transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
  }
  .finance-partners .partner-card:nth-child(1){--brand-rgb:53,137,235;}
  .finance-partners .partner-card:nth-child(2){--brand-rgb:231,69,69;}
  .finance-partners .partner-card:nth-child(3){--brand-rgb:58,191,118;}
  .finance-partners .partner-card::before{
    content:""!important;
    position:absolute!important;
    left:15%!important;right:15%!important;top:0!important;height:4px!important;
    border-radius:0 0 999px 999px!important;
    background:linear-gradient(90deg,transparent,rgba(var(--brand-rgb),1),transparent)!important;
    box-shadow:0 0 20px rgba(var(--brand-rgb),.48)!important;
    pointer-events:none!important;
  }
  .finance-partners .partner-card::after{
    content:"";
    position:absolute;
    z-index:-1;
    width:190px;height:190px;right:-76px;bottom:-90px;
    border-radius:50%;background:rgba(var(--brand-rgb),.13);filter:blur(34px);
    pointer-events:none;
  }
  .finance-partners .partner-card:hover{
    transform:translateY(-6px)!important;
    border-color:rgba(var(--brand-rgb),.62)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.11),0 28px 58px rgba(0,0,0,.34),0 0 42px rgba(var(--brand-rgb),.14)!important;
  }
  .finance-partners .partner-logo-wrap{
    position:relative!important;
    width:100%!important;
    height:188px!important;
    margin:0 0 20px!important;
    padding:18px 24px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    border-radius:28px!important;
    border:1px solid rgba(255,255,255,.94)!important;
    background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(247,251,255,.95) 58%,rgba(232,241,249,.91))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,1),inset 0 -1px 0 rgba(161,183,203,.20),0 14px 30px rgba(0,0,0,.20),0 0 26px rgba(var(--brand-rgb),.10)!important;
    backdrop-filter:blur(24px) saturate(120%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(120%)!important;
    filter:none!important;
  }
  .finance-partners .partner-logo-wrap::before{
    content:"";
    position:absolute;left:8%;right:8%;top:9px;height:34%;border-radius:999px;
    background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,0));
    filter:blur(6px);opacity:.80;pointer-events:none;
  }
  .finance-partners .partner-logo-wrap img{
    position:relative!important;
    z-index:1!important;
    display:block!important;
    width:100%!important;
    max-width:235px!important;
    height:100%!important;
    max-height:145px!important;
    object-fit:contain!important;
    filter:saturate(1.08) contrast(1.07) brightness(1.01)!important;
  }
  .finance-partners .partner-card:nth-child(1) .partner-logo-wrap img{max-width:250px!important;transform:scale(1.08);}
  .finance-partners .partner-card:nth-child(2) .partner-logo-wrap img{max-width:210px!important;}
  .finance-partners .partner-card:nth-child(3) .partner-logo-wrap img{max-width:210px!important;}
  .finance-partners .partner-card h3{
    margin:0 0 14px!important;
    font-size:clamp(28px,2.5vw,36px)!important;
    line-height:1.05!important;
    font-weight:1000!important;
    letter-spacing:.01em!important;
    paint-order:stroke fill!important;
    -webkit-text-stroke:1.2px rgba(255,255,255,.97)!important;
    text-shadow:0 4px 18px rgba(0,0,0,.38)!important;
  }
  .finance-partners .partner-card:nth-child(1) h3{color:#075aa8!important;}
  .finance-partners .partner-card:nth-child(2) h3{color:#e52d3d!important;}
  .finance-partners .partner-card:nth-child(3) h3{color:#15915a!important;}
  .finance-partners .partner-card p{
    color:#fff9f1!important;
    font-weight:650!important;
    line-height:1.78!important;
  }
  .finance-partners .partner-tags span{
    background:rgba(255,255,255,.07)!important;
    border:1px solid rgba(var(--brand-rgb),.24)!important;
    color:#fff9f1!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
  }

  @media(max-width:1050px){
    .finance-partners .partner-grid{grid-template-columns:1fr!important;}
    .finance-partners .partner-card{max-width:760px;margin-inline:auto;width:100%;}
    .finance-partners .partner-logo-wrap{height:180px!important;}
  }
  @media(max-width:680px){
    .finance-banner .lender-mini-grid-banner{grid-template-columns:1fr!important;}
    .finance-banner .lender-mini{min-height:136px!important;}
    .finance-banner .lender-mini img{height:82px!important;}
    .finance-partners .partner-card{padding:18px 18px 22px!important;border-radius:26px!important;}
    .finance-partners .partner-logo-wrap{height:150px!important;border-radius:22px!important;padding:14px 18px!important;}
    .finance-partners .partner-card h3{font-size:28px!important;}
  }
}

/* ==========================================================
   V14 — LOAN ASSESSMENT HEADER
   Match homepage logo scale and persistent active underline.
   Removes the old white/green pill active state from tools/loan.
   ========================================================== */
@media screen {
  body:has(.loan-site-header) .loan-nav-row{
    width:min(1220px,94vw)!important;
    max-width:1220px!important;
    min-height:104px!important;
    padding:6px 0!important;
    gap:20px!important;
  }

  body:has(.loan-site-header) .loan-brand{
    display:flex!important;
    align-items:center!important;
    flex:0 0 auto!important;
    min-width:220px!important;
    max-width:300px!important;
  }

  body:has(.loan-site-header) .loan-brand img{
    height:92px!important;
    width:auto!important;
    max-width:280px!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:left center!important;
  }

  body:has(.loan-site-header) .loan-nav{
    gap:16px!important;
    align-items:center!important;
  }

  body:has(.loan-site-header) .loan-nav a{
    position:relative!important;
    padding:10px 0!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff9f1!important;
    overflow:visible!important;
  }

  body:has(.loan-site-header) .loan-nav a:hover,
  body:has(.loan-site-header) .loan-nav a.active,
  body:has(.loan-site-header) .loan-nav a[aria-current="page"]{
    background:transparent!important;
    color:#fff!important;
    box-shadow:none!important;
    text-shadow:0 0 14px rgba(108,225,255,.22),0 1px 14px rgba(0,0,0,.55)!important;
  }

  body:has(.loan-site-header) .loan-nav a.active::after,
  body:has(.loan-site-header) .loan-nav a[aria-current="page"]::after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:-8px!important;
    height:4px!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,#4ce0a2 0%,#59d8ff 58%,#7fe9ff 100%)!important;
    box-shadow:0 0 10px rgba(89,216,255,.78),0 0 22px rgba(76,224,162,.34)!important;
    opacity:1!important;
    transform:none!important;
  }

  body:has(.loan-site-header) .loan-nav a:hover:not(.active):not([aria-current="page"])::after{
    content:""!important;
    position:absolute!important;
    left:18%!important;
    right:18%!important;
    bottom:-8px!important;
    height:3px!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,rgba(76,224,162,.72),rgba(89,216,255,.72))!important;
    box-shadow:0 0 12px rgba(89,216,255,.28)!important;
  }

  @media(max-width:1200px){
    body:has(.loan-site-header) .loan-brand{min-width:0!important;max-width:240px!important;}
    body:has(.loan-site-header) .loan-brand img{height:82px!important;max-width:240px!important;}
    body:has(.loan-site-header) .loan-nav{gap:12px!important;}
    body:has(.loan-site-header) .loan-nav a{font-size:14px!important;}
  }

  @media(max-width:980px){
    body:has(.loan-site-header) .loan-nav-row{min-height:86px!important;padding:8px 0!important;flex-wrap:wrap!important;}
    body:has(.loan-site-header) .loan-brand img{height:70px!important;max-width:220px!important;}
    body:has(.loan-site-header) .loan-nav{
      width:100%!important;
      margin-left:0!important;
      padding:12px 16px!important;
      border-radius:18px!important;
      background:rgba(7,14,25,.97)!important;
    }
    body:has(.loan-site-header) .loan-nav a{padding:12px 6px!important;border-radius:10px!important;}
    body:has(.loan-site-header) .loan-nav a.active::after,
    body:has(.loan-site-header) .loan-nav a[aria-current="page"]::after{bottom:2px!important;}
  }

  @media(max-width:560px){
    body:has(.loan-site-header) .loan-nav-row{width:calc(100% - 28px)!important;}
    body:has(.loan-site-header) .loan-brand img{height:62px!important;max-width:200px!important;}
  }
}

/* ==========================================================
   V16 — LOAN ASSESSMENT NAV TYPOGRAPHY
   Match the loan assessment header menu scale to the main site.
   Keeps the persistent cyan/green underline from V14.
   ========================================================== */
@media screen {
  body:has(.loan-site-header) .loan-nav a{
    font-size:16px!important;
    font-weight:1000!important;
    letter-spacing:-.15px!important;
    line-height:1.15!important;
  }

  @media(max-width:1200px) and (min-width:981px){
    body:has(.loan-site-header) .loan-nav a{
      font-size:16px!important;
    }
  }

  @media(max-width:980px){
    body:has(.loan-site-header) .loan-nav a{
      font-size:18px!important;
      line-height:1.2!important;
    }
  }
}


/* ========================================================================
   V18 — Admin Articles: no color pickers + unified futuristic cyan glass
   ======================================================================== */
:root{
  --article-future-cyan:#35E7FF;
  --article-future-cyan-rgb:53,231,255;
}

/* Admin > Articles: one standard action language, no per-article color UI */
html body #articlesSec .actions .btn:not(.dangerBtn),
html body #articlesSec .article-admin-actions .btn:not(.dangerBtn){
  position:relative;
  overflow:hidden;
  color:#06141c!important;
  background:
    linear-gradient(135deg,rgba(var(--article-future-cyan-rgb),.96),rgba(var(--article-future-cyan-rgb),.70))!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:
    0 10px 28px rgba(var(--article-future-cyan-rgb),.22),
    inset 0 1px 0 rgba(255,255,255,.76),
    inset 0 -1px 0 rgba(2,25,34,.22)!important;
  font-weight:1000!important;
  transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s ease,filter .24s ease!important;
}
html body #articlesSec .actions .btn:not(.dangerBtn)::before,
html body #articlesSec .article-admin-actions .btn:not(.dangerBtn)::before{
  content:"";
  position:absolute;
  inset:1px 8% auto;
  height:42%;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.46),rgba(255,255,255,0));
  pointer-events:none;
}
html body #articlesSec .actions .btn:not(.dangerBtn):hover,
html body #articlesSec .article-admin-actions .btn:not(.dangerBtn):hover{
  transform:translateY(-3px) scale(1.055)!important;
  filter:brightness(1.08) saturate(1.08)!important;
  box-shadow:
    0 16px 38px rgba(var(--article-future-cyan-rgb),.38),
    0 0 0 4px rgba(var(--article-future-cyan-rgb),.10),
    inset 0 1px 0 rgba(255,255,255,.88)!important;
}
html body #articlesSec .actions .btn:not(.dangerBtn):active,
html body #articlesSec .article-admin-actions .btn:not(.dangerBtn):active{
  transform:translateY(-1px) scale(1.02)!important;
}
html body #articlesSec input[type=file]::file-selector-button{
  border:1px solid rgba(var(--article-future-cyan-rgb),.34);
  border-radius:12px;
  background:rgba(var(--article-future-cyan-rgb),.10);
  color:#eaffff;
  padding:8px 12px;
  font-weight:900;
  cursor:pointer;
}

/* Public article buttons use the same single futuristic cyan glass standard */
html body .article-read-btn,
html body .articles-more-link{
  position:relative;
  overflow:hidden;
  min-height:46px;
  color:#06141c!important;
  background:
    linear-gradient(135deg,rgba(var(--article-future-cyan-rgb),.96),rgba(var(--article-future-cyan-rgb),.70))!important;
  border:1px solid rgba(255,255,255,.74)!important;
  box-shadow:
    0 12px 30px rgba(var(--article-future-cyan-rgb),.22),
    inset 0 1px 0 rgba(255,255,255,.76)!important;
  font-weight:1000!important;
  transition:transform .26s cubic-bezier(.2,.8,.2,1),box-shadow .26s ease,filter .26s ease!important;
}
html body .article-read-btn::before,
html body .articles-more-link::before{
  content:"";
  position:absolute;
  inset:1px 10% auto;
  height:42%;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.48),rgba(255,255,255,0));
  pointer-events:none;
}
html body .article-read-btn:hover,
html body .articles-more-link:hover{
  transform:translateY(-3px) scale(1.07)!important;
  filter:brightness(1.08) saturate(1.08)!important;
  box-shadow:
    0 18px 42px rgba(var(--article-future-cyan-rgb),.40),
    0 0 0 4px rgba(var(--article-future-cyan-rgb),.11),
    inset 0 1px 0 rgba(255,255,255,.90)!important;
}
html body .article-read-btn:active,
html body .articles-more-link:active{
  transform:translateY(-1px) scale(1.025)!important;
}

/* Category + date are also locked to the same standard hue */
html body .article-meta span,
html body .article-meta time,
html body .article-related-card span{
  --shade1:var(--article-future-cyan)!important;
  --shade2:var(--article-future-cyan)!important;
  color:var(--article-future-cyan)!important;
  -webkit-text-fill-color:var(--article-future-cyan)!important;
  background-image:none!important;
  filter:none!important;
}
html body .article-meta span,
html body .article-related-card span{
  background:rgba(var(--article-future-cyan-rgb),.09)!important;
  border:1px solid rgba(var(--article-future-cyan-rgb),.30)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 22px rgba(var(--article-future-cyan-rgb),.08)!important;
}

@media (prefers-reduced-motion:reduce){
  html body .article-read-btn,
  html body .articles-more-link,
  html body #articlesSec .btn{transition:none!important}
  html body .article-read-btn:hover,
  html body .articles-more-link:hover,
  html body #articlesSec .btn:hover{transform:none!important}
}

/* ==========================================================
   V19 — ARTICLE READER: DARK FUTURE GLASS
   Applies automatically to every article detail page rendered
   by articles.js, including newly added Admin articles.
   Screen only so print rules remain untouched.
   ========================================================== */
@media screen {
  html body #articleDetail .article-read-section{
    position:relative;
    background:
      radial-gradient(circle at 10% 4%,rgba(53,231,255,.08),transparent 30%),
      radial-gradient(circle at 88% 14%,rgba(76,224,162,.08),transparent 28%),
      linear-gradient(180deg,rgba(3,10,18,.94),rgba(5,14,24,.98))!important;
    border-top:1px solid rgba(109,226,255,.10)!important;
    border-bottom:1px solid rgba(109,226,255,.10)!important;
  }

  html body #articleDetail .article-read-grid{
    position:relative;
    z-index:1;
    gap:28px!important;
  }

  html body #articleDetail .article-content-card,
  html body #articleDetail .article-side-card{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    background:
      linear-gradient(145deg,rgba(15,31,51,.88),rgba(7,18,31,.82))!important;
    border:1px solid rgba(111,224,255,.22)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.08),
      0 22px 58px rgba(0,0,0,.35),
      0 0 0 1px rgba(76,224,162,.025)!important;
    backdrop-filter:blur(24px) saturate(145%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(145%)!important;
  }

  html body #articleDetail .article-content-card{
    border-radius:32px!important;
    padding:38px!important;
  }

  html body #articleDetail .article-content-card::before,
  html body #articleDetail .article-side-card::before{
    content:"";
    position:absolute;
    z-index:-1;
    left:7%;
    right:7%;
    top:0;
    height:2px;
    background:linear-gradient(90deg,transparent,rgba(53,231,255,.78),rgba(76,224,162,.72),transparent);
    box-shadow:0 0 22px rgba(53,231,255,.28);
  }

  html body #articleDetail .article-content-card::after{
    content:"";
    position:absolute;
    z-index:-2;
    width:320px;
    height:320px;
    right:-150px;
    top:-150px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(53,231,255,.08),transparent 70%);
    pointer-events:none;
  }

  html body #articleDetail .article-content-card p,
  html body #articleDetail .article-content-card li,
  html body #articleDetail .article-content-card blockquote{
    color:#f6eee5!important;
    -webkit-text-fill-color:#f6eee5!important;
    font-size:18px!important;
    line-height:1.95!important;
    text-shadow:0 1px 0 rgba(0,0,0,.18)!important;
  }

  html body #articleDetail .article-content-card h1,
  html body #articleDetail .article-content-card h2,
  html body #articleDetail .article-content-card h3,
  html body #articleDetail .article-content-card h4,
  html body #articleDetail .article-content-card strong,
  html body #articleDetail .article-content-card b{
    color:#fff9f1!important;
    -webkit-text-fill-color:#fff9f1!important;
  }

  html body #articleDetail .article-content-card h2,
  html body #articleDetail .article-content-card h3{
    text-shadow:0 0 24px rgba(53,231,255,.08)!important;
  }

  html body #articleDetail .article-content-card a:not(.btn){
    color:#7ff6e1!important;
    -webkit-text-fill-color:#7ff6e1!important;
    text-decoration-color:rgba(127,246,225,.45)!important;
  }

  html body #articleDetail .article-side-card{
    top:118px!important;
    border-radius:30px!important;
    padding:26px!important;
    background:
      radial-gradient(circle at 85% 5%,rgba(76,224,162,.13),transparent 34%),
      linear-gradient(145deg,rgba(16,34,51,.91),rgba(8,20,33,.86))!important;
    border-color:rgba(76,224,162,.24)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.09),
      0 22px 58px rgba(0,0,0,.34),
      0 0 34px rgba(76,224,162,.045)!important;
  }

  html body #articleDetail .article-side-card h3{
    color:#fff9f1!important;
    -webkit-text-fill-color:#fff9f1!important;
    font-size:25px!important;
    text-shadow:0 0 22px rgba(76,224,162,.10)!important;
  }

  html body #articleDetail .article-side-card p{
    color:#f6eee5!important;
    -webkit-text-fill-color:#f6eee5!important;
  }

  html body #articleDetail .article-side-card .btn{
    position:relative;
    overflow:hidden;
    border-radius:18px!important;
    min-height:54px;
    transition:transform .22s ease,box-shadow .22s ease,filter .22s ease!important;
  }

  html body #articleDetail .article-side-card .btn:hover{
    transform:translateY(-3px) scale(1.018)!important;
    filter:brightness(1.07)!important;
  }

  html body #articleDetail .article-related-section{
    background:
      radial-gradient(circle at 84% 8%,rgba(53,231,255,.055),transparent 28%),
      linear-gradient(180deg,rgba(4,12,21,.98),rgba(3,9,17,.99))!important;
    border-top:1px solid rgba(109,226,255,.08)!important;
  }

  html body #articleDetail .article-related-card{
    position:relative;
    overflow:hidden;
    background:linear-gradient(145deg,rgba(15,31,51,.84),rgba(7,18,31,.79))!important;
    border:1px solid rgba(111,224,255,.18)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 16px 42px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(18px) saturate(135%)!important;
    -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
    transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
  }

  html body #articleDetail .article-related-card:hover{
    transform:translateY(-5px) scale(1.012)!important;
    border-color:rgba(53,231,255,.42)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 22px 50px rgba(0,0,0,.34),0 0 30px rgba(53,231,255,.07)!important;
  }

  html body #articleDetail .article-related-card h3{
    color:#fff9f1!important;
    -webkit-text-fill-color:#fff9f1!important;
  }

  html body #articleDetail .article-related-card p{
    color:#f6eee5!important;
    -webkit-text-fill-color:#f6eee5!important;
  }

  html body #articleDetail .article-not-found{
    background:linear-gradient(145deg,rgba(15,31,51,.90),rgba(7,18,31,.84))!important;
    border:1px solid rgba(111,224,255,.22)!important;
    color:#fff9f1!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 22px 58px rgba(0,0,0,.34)!important;
    backdrop-filter:blur(22px)!important;
  }

  @media (max-width:760px){
    html body #articleDetail .article-content-card{padding:24px!important;border-radius:24px!important}
    html body #articleDetail .article-content-card p,
    html body #articleDetail .article-content-card li{font-size:16px!important;line-height:1.9!important}
    html body #articleDetail .article-side-card{top:auto!important;border-radius:24px!important}
  }
}