/*
Theme Name: Discover Business Loans
Theme URI: https://example.com/discover-business-loans
Author: Discover Business Loans
Author URI: https://example.com
Description: A distinct, multi-page WordPress theme for the Discover Business Loans business-funding brand. Editorial / institutional aesthetic on warm paper, with a petrol-teal + terracotta palette, Spectral / Hanken Grotesk / IBM Plex Mono type, and Calendly-based booking in place of lead-capture forms. Classic theme (PHP templates, no block editor required).
Version: 1.0.3
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: discover-business-loans
*/

/* =========================================================================
   Design tokens
   ========================================================================= */
:root{
  --paper:        #F6F1E7;   /* warm paper background */
  --paper-2:      #FCF8F0;   /* lighter card / panel */
  --paper-3:      #EFE7D7;   /* sunken / alt band */

  --ink:          #19302C;   /* deep teal-ink text */
  --ink-soft:     #4C5A55;   /* muted body */
  --ink-faint:    #7A857F;   /* captions / fine print */

  --teal:         #0E4F4A;   /* petrol primary */
  --teal-deep:    #09322F;   /* header / footer */
  --teal-soft:    #16635C;

  --clay:         #B24A22;   /* terracotta accent / CTA */
  --clay-deep:    #92381A;
  --clay-soft:    #C76A41;

  --brass:        #B08A3E;   /* rule / ledger accent */
  --brass-soft:   #C9A961;

  --line:         rgba(25,48,44,.16);
  --line-strong:  rgba(25,48,44,.30);
  --line-light:   rgba(255,255,255,.18);

  --shadow:       0 24px 60px rgba(9,50,47,.12);
  --shadow-sm:    0 10px 26px rgba(9,50,47,.08);

  --r-lg: 18px;
  --r-md: 12px;
  --r-sm: 8px;

  --max: 1140px;
  --max-narrow: 820px;

  --serif: "Spectral", Georgia, "Times New Roman", serif;
  --sans:  "Hanken Grotesk", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --mono:  "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* =========================================================================
   Base
   ========================================================================= */
*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body.dbl{
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  /* faint ledger paper texture */
  background-image:
    radial-gradient(circle at 1px 1px, rgba(25,48,44,.04) 1px, transparent 0);
  background-size: 22px 22px;
}
img{ max-width: 100%; height: auto; display: block; }
a{ color: var(--clay-deep); text-decoration: none; }
a:hover{ text-decoration: underline; }
:focus-visible{ outline: 3px solid var(--brass); outline-offset: 2px; border-radius: 4px; }

h1,h2,h3,h4{ font-family: var(--serif); color: var(--ink); font-weight: 600; line-height: 1.1; letter-spacing: -0.01em; margin: 0 0 .5em; }
h1{ font-size: clamp(38px, 6vw, 64px); }
h2{ font-size: clamp(28px, 3.6vw, 42px); }
h3{ font-size: clamp(20px, 2.2vw, 26px); }
p{ margin: 0 0 1.1em; }
.dbl-container{ width: min(var(--max), calc(100% - 48px)); margin-inline: auto; }
.dbl-narrow{ width: min(var(--max-narrow), calc(100% - 48px)); margin-inline: auto; }
.dbl-lead{ font-size: clamp(18px, 2vw, 21px); color: var(--ink-soft); }
.dbl-muted{ color: var(--ink-soft); }

/* =========================================================================
   Eyebrows / rules (editorial motif)
   ========================================================================= */
.dbl-eyebrow{
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--mono); font-size: 12px; letter-spacing: .22em;
  text-transform: uppercase; color: var(--teal); margin: 0 0 18px;
}
.dbl-eyebrow__num{
  color: var(--clay); font-weight: 600;
  border: 1px solid var(--line-strong); border-radius: 999px;
  padding: 3px 9px;
}
.dbl-rule{ height: 0; border: 0; border-top: 1px solid var(--line); margin: 0; }
.dbl-rule--double{
  border: 0; height: 5px;
  border-top: 1px solid var(--brass); border-bottom: 1px solid var(--brass);
  background: transparent;
}

/* =========================================================================
   Buttons
   ========================================================================= */
.dbl-btn{
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--sans); font-weight: 600; font-size: 15px;
  padding: 13px 20px; border-radius: var(--r-md);
  border: 1.5px solid transparent; cursor: pointer;
  transition: transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
  text-decoration: none; line-height: 1; white-space: nowrap;
}
.dbl-btn:hover{ text-decoration: none; transform: translateY(-1px); }
.dbl-btn__arrow{ width: 17px; height: 17px; }
.dbl-btn--primary{ background: var(--clay); color: #FFF6EE; border-color: var(--clay); }
.dbl-btn--primary:hover{ background: var(--clay-deep); border-color: var(--clay-deep); color: #FFF6EE; }
.dbl-btn--ghost{ background: transparent; color: var(--teal); border-color: var(--line-strong); }
.dbl-btn--ghost:hover{ border-color: var(--teal); background: rgba(14,79,74,.06); color: var(--teal); }
.dbl-btn--light{ background: #FFF6EE; color: var(--teal-deep); border-color: #FFF6EE; }
.dbl-btn--light:hover{ background: #fff; color: var(--teal-deep); }

/* =========================================================================
   Header / nav
   ========================================================================= */
.dbl-header{
  position: sticky; top: 0; z-index: 100;
  background: rgba(246,241,231,.88);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.dbl-header__row{
  display: flex; align-items: center; justify-content: space-between;
  gap: 18px; padding: 14px 0;
}
.dbl-brand{ display: flex; align-items: center; gap: 12px; text-decoration: none; }
.dbl-brand:hover{ text-decoration: none; }
.dbl-brand__mark{
  width: 44px; height: 44px; flex: none; border-radius: 12px;
  display: grid; place-items: center;
  background: var(--teal-deep); border: 1px solid var(--teal);
}
.dbl-brand__name{
  font-family: var(--serif); font-weight: 600; font-size: 20px;
  color: var(--ink); line-height: 1.05; letter-spacing: -.01em;
}
.dbl-brand__tag{
  display: block; font-family: var(--mono); font-size: 10.5px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint);
  margin-top: 3px; font-weight: 500;
}
.dbl-nav{ display: flex; align-items: center; gap: 22px; }
.dbl-nav__list{ display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
.dbl-nav__item{ position: relative; }
.dbl-nav__link{
  font-family: var(--sans); font-size: 15px; font-weight: 500; color: var(--ink);
  background: transparent; border: 0; cursor: pointer;
  padding: 9px 13px; border-radius: var(--r-sm);
  display: inline-flex; align-items: center; gap: 5px;
}
.dbl-nav__link:hover{ background: rgba(14,79,74,.07); color: var(--teal); text-decoration: none; }
.dbl-nav__chev{ width: 15px; height: 15px; transition: transform .18s ease; }
.dbl-has-sub:hover .dbl-nav__chev,
.dbl-has-sub:focus-within .dbl-nav__chev{ transform: rotate(180deg); }

/* CSS-only dropdown (hover + keyboard focus, no JS) */
.dbl-nav__sub{
  position: absolute; top: calc(100% + 8px); left: 0;
  min-width: 250px; list-style: none; margin: 0; padding: 8px;
  background: var(--paper-2); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--shadow);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.dbl-has-sub:hover .dbl-nav__sub,
.dbl-has-sub:focus-within .dbl-nav__sub{ opacity: 1; visibility: visible; transform: translateY(0); }
.dbl-nav__sub li a{
  display: block; padding: 10px 12px; border-radius: var(--r-sm);
  font-size: 15px; color: var(--ink); font-weight: 500;
}
.dbl-nav__sub li a:hover{ background: rgba(14,79,74,.08); color: var(--teal); text-decoration: none; }
.dbl-header__cta{ display: flex; align-items: center; gap: 10px; }

.dbl-nav-toggle{ display: none; }

/* =========================================================================
   Hero
   ========================================================================= */
.dbl-hero{
  position: relative; overflow: hidden;
  background:
    radial-gradient(900px 480px at 88% -10%, rgba(178,74,34,.10), transparent 60%),
    radial-gradient(800px 460px at 0% 110%, rgba(14,79,74,.10), transparent 60%);
  border-bottom: 1px solid var(--line);
}
.dbl-hero__inner{ padding: 70px 0 64px; display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }
.dbl-hero h1{ margin-bottom: 18px; }
.dbl-hero h1 em{ font-style: italic; color: var(--clay); }
.dbl-hero__ctas{ display: flex; gap: 12px; flex-wrap: wrap; margin: 26px 0 18px; }
.dbl-hero__note{ font-family: var(--mono); font-size: 12.5px; color: var(--ink-faint); letter-spacing: .02em; }

.dbl-hero__panel{
  background: var(--paper-2); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow); padding: 28px;
  position: relative;
}
.dbl-hero__panel::before{
  content:""; position: absolute; left: 28px; right: 28px; top: 0; height: 4px;
  background: linear-gradient(90deg, var(--clay), var(--brass));
  border-radius: 0 0 4px 4px;
}
.dbl-hero__panel h3{ font-size: 21px; margin-bottom: 8px; }
.dbl-checklist{ list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 12px; }
.dbl-checklist li{ display: flex; gap: 11px; align-items: flex-start; font-size: 15px; color: var(--ink-soft); }
.dbl-check{
  flex: none; width: 22px; height: 22px; border-radius: 6px; margin-top: 1px;
  display: grid; place-items: center; background: rgba(14,79,74,.10);
  border: 1px solid rgba(14,79,74,.22);
}

/* =========================================================================
   Section scaffolding
   ========================================================================= */
.dbl-section{ padding: 64px 0; }
.dbl-section--tight{ padding: 44px 0; }
.dbl-section--alt{ background: var(--paper-3); border-block: 1px solid var(--line); }
.dbl-section--ink{ background: var(--teal-deep); color: #EAF2F0; }
.dbl-section--ink h1,.dbl-section--ink h2,.dbl-section--ink h3{ color: #FFF6EE; }
.dbl-section--ink .dbl-eyebrow{ color: var(--brass-soft); }
.dbl-section--ink .dbl-eyebrow__num{ color: var(--clay-soft); border-color: var(--line-light); }
.dbl-section--ink .dbl-muted{ color: rgba(234,242,240,.78); }

.dbl-section__head{ max-width: 64ch; margin-bottom: 36px; }
.dbl-section__head h2{ margin-bottom: 12px; }

/* =========================================================================
   Card grids
   ========================================================================= */
.dbl-grid{ display: grid; gap: 20px; }
.dbl-grid--3{ grid-template-columns: repeat(3, 1fr); }
.dbl-grid--2{ grid-template-columns: repeat(2, 1fr); }
.dbl-grid--4{ grid-template-columns: repeat(4, 1fr); }

.dbl-card{
  background: var(--paper-2); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 24px; position: relative;
  box-shadow: var(--shadow-sm);
}
.dbl-card--bare{ box-shadow: none; }
.dbl-card__top{ height: 3px; width: 44px; background: var(--clay); border-radius: 3px; margin-bottom: 16px; }
.dbl-card__icon{
  width: 44px; height: 44px; border-radius: 11px; margin-bottom: 14px;
  display: grid; place-items: center; background: rgba(14,79,74,.08);
  border: 1px solid rgba(14,79,74,.16);
}
.dbl-card h3{ font-size: 19px; margin-bottom: 8px; }
.dbl-card p{ font-size: 15px; color: var(--ink-soft); margin-bottom: 0; }
.dbl-card__link{ display: inline-flex; gap: 6px; margin-top: 14px; font-weight: 600; font-size: 14.5px; color: var(--teal); }
.dbl-card__link svg{ width: 15px; height: 15px; }
.dbl-card__link:hover{ color: var(--clay-deep); text-decoration: none; }

/* Numbered process steps */
.dbl-steps{ display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; counter-reset: step; }
.dbl-step{ position: relative; padding-top: 18px; border-top: 2px solid var(--brass); }
.dbl-step__num{ font-family: var(--mono); font-size: 13px; color: var(--clay); font-weight: 600; letter-spacing: .1em; }
.dbl-step h3{ font-size: 18px; margin: 10px 0 7px; }
.dbl-step p{ font-size: 15px; color: var(--ink-soft); margin: 0; }

/* Stat / quals row */
.dbl-quals{ display: grid; grid-template-columns: repeat(3,1fr); gap: 0; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; background: var(--paper-2); }
.dbl-qual{ padding: 28px 26px; border-right: 1px solid var(--line); }
.dbl-qual:last-child{ border-right: 0; }
.dbl-qual__big{ font-family: var(--serif); font-size: 38px; color: var(--teal); line-height: 1; margin-bottom: 8px; }
.dbl-qual__label{ font-family: var(--mono); font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 10px; }
.dbl-qual p{ font-size: 14.5px; color: var(--ink-soft); margin: 0; }

/* =========================================================================
   Long-form article body (legal + content pages)
   ========================================================================= */
.dbl-prose{ max-width: 72ch; }
.dbl-prose h2{ margin-top: 1.6em; }
.dbl-prose h3{ margin-top: 1.4em; font-size: 21px; }
.dbl-prose ul,.dbl-prose ol{ margin: 0 0 1.2em; padding-left: 1.3em; }
.dbl-prose li{ margin-bottom: .5em; color: var(--ink-soft); }
.dbl-prose p{ color: var(--ink-soft); }
.dbl-prose strong{ color: var(--ink); }

/* Definition-style blocks for product pages */
.dbl-deflist{ display: grid; gap: 0; border-top: 1px solid var(--line); margin: 28px 0; }
.dbl-deflist__row{ display: grid; grid-template-columns: 220px 1fr; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.dbl-deflist__row dt{ font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--teal); }
.dbl-deflist__row dd{ margin: 0; color: var(--ink-soft); }

/* Use-case chips */
.dbl-chips{ display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 0; padding: 0; list-style: none; }
.dbl-chips li{ font-size: 14px; padding: 8px 14px; border-radius: 999px; background: var(--paper-3); border: 1px solid var(--line); color: var(--ink); }

/* Notice / flag box (for legal placeholders) */
.dbl-notice{
  border: 1px dashed var(--brass); background: rgba(176,138,62,.08);
  border-radius: var(--r-md); padding: 16px 18px; margin: 0 0 28px;
  font-size: 14.5px; color: var(--ink);
}
.dbl-notice strong{ color: var(--clay-deep); }

/* Sample testimonial (clearly labelled, non-fabricated) */
.dbl-quote{ background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: 24px; }
.dbl-quote__label{ font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--clay); margin-bottom: 12px; }
.dbl-quote p{ font-family: var(--serif); font-size: 18px; font-style: italic; color: var(--ink); line-height: 1.5; margin-bottom: 10px; }
.dbl-quote cite{ font-style: normal; font-size: 13.5px; color: var(--ink-faint); }

/* FAQ */
.dbl-faq{ display: grid; gap: 12px; max-width: 820px; }
.dbl-faq details{ border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper-2); padding: 4px 20px; }
.dbl-faq summary{ cursor: pointer; list-style: none; font-family: var(--serif); font-size: 18px; font-weight: 600; color: var(--ink); padding: 16px 0; display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.dbl-faq summary::-webkit-details-marker{ display: none; }
.dbl-faq summary .dbl-faq__chev{ width: 18px; height: 18px; flex: none; transition: transform .18s ease; color: var(--clay); }
.dbl-faq details[open] summary .dbl-faq__chev{ transform: rotate(180deg); }
.dbl-faq details p{ margin: 0 0 16px; color: var(--ink-soft); font-size: 15.5px; }

/* CTA band */
.dbl-ctaband{ position: relative; overflow: hidden; }
.dbl-ctaband__inner{
  background: var(--teal-deep); color: #EAF2F0; border-radius: var(--r-lg);
  padding: 44px; display: flex; gap: 28px; align-items: center; justify-content: space-between;
  flex-wrap: wrap; position: relative;
}
.dbl-ctaband__inner::before{
  content:""; position: absolute; inset: 0; opacity: .5; pointer-events: none;
  background: radial-gradient(500px 240px at 90% 10%, rgba(178,74,34,.4), transparent 60%);
}
.dbl-ctaband h2{ color: #FFF6EE; margin: 0 0 6px; position: relative; }
.dbl-ctaband p{ color: rgba(234,242,240,.82); margin: 0; max-width: 52ch; position: relative; }
.dbl-ctaband__actions{ display: flex; gap: 12px; flex-wrap: wrap; position: relative; }

/* =========================================================================
   Footer
   ========================================================================= */
.dbl-footer{ background: var(--teal-deep); color: rgba(234,242,240,.78); padding: 56px 0 28px; }
.dbl-footer a{ color: rgba(234,242,240,.78); }
.dbl-footer a:hover{ color: #FFF6EE; }
.dbl-footer__cols{ display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 32px; padding-bottom: 36px; border-bottom: 1px solid var(--line-light); }
.dbl-footer__brand{ font-family: var(--serif); font-size: 22px; color: #FFF6EE; margin-bottom: 10px; }
.dbl-footer__about{ font-size: 14.5px; max-width: 38ch; }
.dbl-footer h4{ font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--brass-soft); margin: 0 0 16px; }
.dbl-footer ul{ list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.dbl-footer ul a{ font-size: 14.5px; }
.dbl-footer ul a:hover{ text-decoration: none; }
.dbl-footer__legal{ padding-top: 24px; font-size: 12.5px; line-height: 1.6; color: rgba(234,242,240,.6); }
.dbl-footer__legal p{ margin: 0 0 10px; }
.dbl-footer__copy{ display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 12.5px; color: rgba(234,242,240,.6); }

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 960px){
  .dbl-hero__inner{ grid-template-columns: 1fr; gap: 34px; padding: 48px 0; }
  .dbl-grid--3,.dbl-grid--4{ grid-template-columns: repeat(2,1fr); }
  .dbl-steps{ grid-template-columns: repeat(2,1fr); }
  .dbl-deflist__row{ grid-template-columns: 1fr; gap: 6px; }
  .dbl-footer__cols{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px){
  body.dbl{ font-size: 16px; }
  .dbl-nav, .dbl-header__cta .dbl-btn--ghost{ display: none; }
  .dbl-nav-toggle{ display: inline-flex; }
  .dbl-grid--2,.dbl-grid--3,.dbl-grid--4{ grid-template-columns: 1fr; }
  .dbl-steps{ grid-template-columns: 1fr; }
  .dbl-quals{ grid-template-columns: 1fr; }
  .dbl-qual{ border-right: 0; border-bottom: 1px solid var(--line); }
  .dbl-qual:last-child{ border-bottom: 0; }
  .dbl-ctaband__inner{ padding: 28px; }
  .dbl-footer__cols{ grid-template-columns: 1fr; }
  .dbl-section{ padding: 44px 0; }
}

/* Mobile nav: details/summary based, no JS */
.dbl-mnav{ display: none; }
@media (max-width: 720px){
  .dbl-mnav{ display: block; border-top: 1px solid var(--line); }
  .dbl-mnav summary{ list-style: none; cursor: pointer; padding: 12px 0; font-family: var(--mono); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--teal); display: flex; align-items: center; gap: 8px; }
  .dbl-mnav summary::-webkit-details-marker{ display: none; }
  .dbl-mnav ul{ list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 2px; }
  .dbl-mnav ul a{ display: block; padding: 10px 12px; border-radius: var(--r-sm); color: var(--ink); font-weight: 500; }
  .dbl-mnav ul a:hover{ background: rgba(14,79,74,.07); text-decoration: none; }
}