/* ============================================================ NOSAVENOPAY — "THE LEDGER" THEME — retargeted to the Negotiation Consulting design system (EB Garamond / Hanken Grotesk / IBM Plex Mono, paper-ink-redline palette) Light editorial / financial-broadsheet re-skin. Loaded LAST in so it overrides each page's inline dark design-system styles. Re-themes by overriding the shared design tokens + component classes used site-wide. Fraunces (display) · Outfit (body) · IBM Plex Mono (data) ============================================================ */ /* ---- 1. TOKENS: flip the whole var()-based palette ---- */ :root{ --bg-primary:#F6F3EC !important; --bg-secondary:#FFFFFF !important; --bg-tertiary:#EFEBE1 !important; --bg-elevated:#FFFFFF !important; --bg-glass:rgba(28,36,32,.03) !important; --text-primary:#1C2420 !important; --text-secondary:#3A423D !important; --text-tertiary:#6E726B !important; --text-inverse:#FFFFFF !important; --accent-primary:#1D5C42 !important; --accent-hover:#16462F !important; --accent-muted:#1D5C42 !important; --accent-glow:rgba(29,92,66,.10) !important; --accent-glow-strong:rgba(29,92,66,.18) !important; --accent-subtle-bg:rgba(29,92,66,.07) !important; --accent-secondary:#9A6B12 !important; --accent-secondary-glow:rgba(154,107,18,.10) !important; --success:#1D5C42 !important; --warning:#9A6B12 !important; --danger:#B5402C !important; --info:#1F5F8B !important; --border-subtle:rgba(28,36,32,.10) !important; --border-medium:rgba(28,36,32,.16) !important; --border-strong:rgba(28,36,32,.26) !important; --border-accent:rgba(29,92,66,.30) !important; --gradient-hero:radial-gradient(ellipse at 18% 40%,rgba(29,92,66,.05),transparent 60%),linear-gradient(180deg,#F6F3EC,#FFFFFF) !important; --gradient-card:linear-gradient(180deg,#FFFFFF,#F6F3EC) !important; --gradient-accent:linear-gradient(135deg,#1D5C42,#16462F) !important; --gradient-text:linear-gradient(90deg,#1D5C42,#16462F) !important; --gradient-cta-bg:linear-gradient(135deg,#FFFFFF,#EFEBE1) !important; --gradient-savings:linear-gradient(135deg,#1D5C42,#9A6B12) !important; --font-display:'EB Garamond',Georgia,serif !important; --font-body:'Hanken Grotesk',system-ui,sans-serif !important; --font-mono:'IBM Plex Mono',monospace !important; --lg-paper:#F6F3EC; --lg-paper2:#FFFFFF; --lg-ink:#1C2420; --lg-inksoft:#3A423D; --lg-muted:#6E726B; --lg-em:#1D5C42; --lg-gold:#9A6B12; --lg-rule:#1C2420; --lg-line:rgba(28,36,32,.12); --lg-shadow:0 18px 50px -28px rgba(28,36,32,.45); } /* ---- 2. BASE ---- */ body{ background:var(--lg-paper) !important; color:var(--lg-inksoft) !important; font-family:'Hanken Grotesk',system-ui,sans-serif !important; } body::before{display:none !important;} /* kill dark grain overlay */ ::selection{background:var(--lg-em);color:#fff;} h1,h2,h3,h4,h5,h6{font-family:'EB Garamond',Georgia,serif !important;color:var(--lg-ink) !important;letter-spacing:-.02em;} h1{font-weight:600 !important;} h2,h3{font-weight:600 !important;} a{color:var(--lg-em);} a:hover{color:var(--lg-ink);} strong,b{color:var(--lg-ink);} hr{border-color:var(--lg-line) !important;} /* eyebrow / kicker */ .eyebrow{font-family:'IBM Plex Mono',monospace !important;color:var(--lg-em) !important;letter-spacing:.14em !important;} .eyebrow::before{background:var(--lg-em) !important;} .gradient-text,.savings-text{ background:none !important; -webkit-background-clip:initial !important;background-clip:initial !important;-webkit-text-fill-color:currentColor !important;color:var(--lg-em) !important; } /* ---- 3. GUARANTEE BAR — signature ink bar ---- */ .guarantee-bar{ background:var(--lg-ink) !important; color:var(--lg-paper) !important; border-top:none !important;border-bottom:none !important; font-family:'IBM Plex Mono',monospace !important;letter-spacing:.04em !important; } .guarantee-bar a{color:#9FD0B4 !important;text-decoration:underline !important;text-underline-offset:3px;} /* ---- 4. NAV ---- */ .nav{ background:rgba(247,244,236,.86) !important; -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px); border-bottom:1px solid var(--lg-rule) !important; box-shadow:none !important; } .nav.scrolled,.nav[class*="scroll"]{background:rgba(247,244,236,.95) !important;} .nav-logo,.footer-logo{color:var(--lg-ink) !important;font-family:'EB Garamond',Georgia,serif !important;font-weight:600 !important;} .logo-mark{ background:var(--lg-em) !important;color:#fff !important; border-radius:6px;padding:0 6px;font-family:'IBM Plex Mono',monospace !important; -webkit-text-fill-color:#fff !important; } .logo-accent{color:var(--lg-em) !important;-webkit-text-fill-color:var(--lg-em) !important;} .nav-link{color:var(--lg-inksoft) !important;font-family:'Hanken Grotesk',sans-serif !important;font-weight:600 !important;} .nav-link:hover{color:var(--lg-em) !important;} .dropdown,.dropdown-menu{ background:var(--lg-paper2) !important; border:1px solid var(--lg-rule) !important;border-radius:6px !important; box-shadow:var(--lg-shadow) !important; } .dropdown-link{color:var(--lg-inksoft) !important;} .dropdown-link:hover{background:rgba(28,36,32,.05) !important;color:var(--lg-em) !important;} .dropdown-label{color:var(--lg-gold) !important;font-family:'IBM Plex Mono',monospace !important;} /* ---- 5. BUTTONS ---- */ .btn-primary{ background:var(--lg-em) !important;color:#fff !important; border:1.5px solid var(--lg-em) !important;border-radius:4px !important; font-family:'Hanken Grotesk',sans-serif !important;font-weight:600 !important; box-shadow:none !important; } .btn-primary:hover{background:var(--lg-ink) !important;border-color:var(--lg-ink) !important;color:#fff !important;transform:translateY(-2px);} .btn-secondary{ background:transparent !important;color:var(--lg-ink) !important; border:1.5px solid var(--lg-ink) !important;border-radius:4px !important; font-family:'Hanken Grotesk',sans-serif !important;font-weight:600 !important; } .btn-secondary:hover{background:var(--lg-ink) !important;color:var(--lg-paper) !important;} /* ---- 6. CARDS / SECTIONS ---- */ .card{ background:var(--lg-paper2) !important; border:1.5px solid var(--lg-rule) !important;border-radius:6px !important; box-shadow:none !important; } .card::before{display:none !important;} .card:hover{ border-color:var(--lg-rule) !important;transform:translateY(-3px); box-shadow:var(--lg-shadow) !important; } .section-alt{background:var(--lg-paper2) !important;} .savings-badge{ background:rgba(29,92,66,.07) !important;color:var(--lg-em) !important; border:1px solid var(--lg-em) !important;font-family:'IBM Plex Mono',monospace !important; } .savings-badge::before{color:var(--lg-em);} /* stats */ .stat-number{font-family:'EB Garamond',Georgia,serif !important;color:var(--lg-em) !important;font-weight:600 !important;} .stat-label{color:var(--lg-muted) !important;font-family:'IBM Plex Mono',monospace !important;} /* vendor tags */ .vendor-tag{ background:var(--lg-paper2) !important;color:var(--lg-inksoft) !important; border:1px solid var(--lg-line) !important;border-radius:4px !important; font-family:'IBM Plex Mono',monospace !important; } .vendor-tag:hover{border-color:var(--lg-em) !important;color:var(--lg-em) !important;} /* details / FAQ accordion */ details{background:var(--lg-paper2) !important;border:1.5px solid var(--lg-line) !important;border-radius:6px !important;} details summary{color:var(--lg-ink) !important;font-family:'EB Garamond',Georgia,serif !important;} details summary:hover{background:rgba(28,36,32,.04) !important;} details[open] summary{background:rgba(29,92,66,.07) !important;} details summary::after,details[open] summary::after{color:var(--lg-em) !important;} details > div{color:var(--lg-inksoft) !important;} /* inline CTA / testimonial / process */ .cta-inline{background:var(--lg-paper2) !important;border:1.5px solid var(--lg-line) !important;border-left:3px solid var(--lg-em) !important;border-radius:6px !important;} .cta-inline h4{color:var(--lg-em) !important;} .testimonial{border-left:2px solid var(--lg-em) !important;} .testimonial blockquote{color:var(--lg-ink) !important;} .testimonial cite{color:var(--lg-muted) !important;} .process-step{border-bottom:1px solid var(--lg-line) !important;} .step-number{background:rgba(29,92,66,.10) !important;color:var(--lg-em) !important;} /* forms */ .form-input,.form-textarea,.form-select{ background:var(--lg-paper2) !important;color:var(--lg-ink) !important; border:1.5px solid var(--lg-line) !important;border-radius:4px !important; font-family:'Hanken Grotesk',sans-serif !important; } .form-input:focus,.form-textarea:focus,.form-select:focus{ border-color:var(--lg-em) !important;box-shadow:0 0 0 3px rgba(29,92,66,.12) !important; } .form-label{color:var(--lg-ink) !important;} ::placeholder{color:var(--lg-muted) !important;opacity:1;} /* ---- 7. HERO (force light + serif, fix contrast) ---- */ .hero{background:var(--gradient-hero) !important;} .hero h1,.hero-content h1{color:var(--lg-ink) !important;} .hero p,.hero-sub,.hero-content p{color:var(--lg-inksoft) !important;} .hero .stat-number,.hero-stats .stat-number{color:var(--lg-em) !important;} /* ---- 8. FOOTER ---- */ .footer{background:var(--lg-paper2) !important;border-top:1.5px solid var(--lg-rule) !important;color:var(--lg-inksoft) !important;} .footer-guarantee,.footer-guarantee-inner{ background:var(--lg-paper) !important;border:1.5px solid var(--lg-rule) !important;border-radius:0 !important; } .footer-guarantee strong{color:var(--lg-ink) !important;font-family:'EB Garamond',Georgia,serif !important;} .footer-guarantee p{color:var(--lg-muted) !important;} .footer-heading{color:var(--lg-gold) !important;font-family:'IBM Plex Mono',monospace !important;} .footer-col a,.footer a{color:var(--lg-inksoft) !important;} .footer-col a:hover,.footer a:hover{color:var(--lg-em) !important;} .footer-desc,.footer-location,.footer-bottom,.footer-bottom p{color:var(--lg-muted) !important;} .footer-social a{color:var(--lg-inksoft) !important;} .footer-social a:hover{color:var(--lg-em) !important;} .footer-bottom{border-top:1px solid var(--lg-line) !important;} /* ---- 9. MISC dark-panel utilities seen across pages ---- */ [class*="dark"],.bg-dark{background:var(--lg-paper2) !important;} /* ---- 10. MOBILE NAV DRAWER (override hardcoded dark drawer) ---- Selectors are deliberately high-specificity (html .nav .nav-links …) so they win over the template's own !important mobile rules regardless of source order. ---- */ @media (max-width:768px){ html .nav .nav-links{ background:var(--lg-paper2) !important; border-left:1px solid var(--lg-em) !important; box-shadow:-12px 0 40px rgba(28,36,32,.25) !important; } html .nav .nav-links::before{background:var(--lg-paper2) !important;color:var(--lg-inksoft) !important;border-bottom:1px solid var(--lg-line) !important;} html .nav .nav-links .nav-link,html .nav .nav-links > a.nav-link{color:var(--lg-ink) !important;border-bottom-color:var(--lg-line) !important;background:transparent !important;} html .nav .nav-links .nav-link:hover,html .nav .nav-links > a.nav-link:hover{background:rgba(29,92,66,.07) !important;color:var(--lg-em) !important;} html .nav .nav-links .dropdown{background:var(--lg-paper) !important;border-top:1px solid var(--lg-line) !important;} html .nav .nav-links .dropdown-link{color:var(--lg-inksoft) !important;} html .nav .nav-links .dropdown-link:hover{color:var(--lg-em) !important;} html .nav .nav-links .dropdown-label{color:var(--lg-gold) !important;} html .nav .hamburger span{background:var(--lg-ink) !important;} }