/* Bench to Billable brand theme, October 2026.
   Light look: white and off-white pages, navy headings, blue buttons, gold accents.
   Loaded after each page's own styles, so it only overrides colors. */

:root{
  --navy:#0B2D59; --navy-2:#123A6E; --navy-line:#24497D;
  --sky:#EAF3FC; --light-blue:#BBD9F4; --gold-text:#9A6A1F;
  --paper:#F8FAFD; --surface:#FFFFFF; --text:#1A2333; --strong:#0B2D59; --muted:#5A6577; --line:#DDE6F1;
  --gold:#C58A30; --gold-2:#E0B160; --gold-soft:rgba(197,138,48,.14);
  --blue:#2479C7; --blue-dark:#1B5F9E; --blue-soft:rgba(36,121,199,.10);
}
body{background:var(--paper)}
a{color:var(--blue)}
.label{color:var(--gold-text)}
.tint{background:#EEF5FC}
.rule{background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* Buttons: blue is the main action, gold is the accent (nav button) */
.btn.gold,.dark .btn.gold,.wk .btn.gold{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 10px 24px rgba(36,121,199,.25)}
.btn.gold:hover{background:var(--blue-dark);border-color:var(--blue-dark);color:#fff}
.btn.accent,.dark .btn.accent{background:var(--gold);border-color:var(--gold);color:var(--navy);box-shadow:0 8px 20px rgba(197,138,48,.25)}
.btn.accent:hover{background:#B07A26;border-color:#B07A26;color:#fff}

/* Former dark bands become light (add class "navy" to keep one navy) */
.dark:not(.navy){
  --ink:#EAF3FC; --ink-2:#FFFFFF; --ink-3:#DCEBFA; --line-d:#CFE0F2; --on-d:#1A2333; --muted-d:#5A6577;
  background:linear-gradient(180deg,#FFFFFF 0%,#EAF3FC 100%); color:var(--text);
}
.hero:not(.navy){
  background:
    radial-gradient(760px 420px at 92% 0%,rgba(197,138,48,.10),transparent 60%),
    radial-gradient(700px 420px at 0% 100%,rgba(36,121,199,.10),transparent 60%),
    linear-gradient(180deg,#FFFFFF 0%,#EAF3FC 100%);
}
.dark:not(.navy) h1,.dark:not(.navy) h2,.dark:not(.navy) h3{color:var(--strong)}
.dark:not(.navy) .btn:not(.gold):not(.accent){border-color:var(--strong);color:var(--strong)}
.dark:not(.navy) .card{background:#fff;border-color:var(--line)}
.dark:not(.navy) .field label,.dark:not(.navy) .res b,.dark:not(.navy) ul.clean b,.dark:not(.navy) summary,
.dark:not(.navy) .why b,.dark:not(.navy) .flow b,.dark:not(.navy) .model .big,.dark:not(.navy) .trust b,
.dark:not(.navy) .metric .v,.dark:not(.navy) .num,.dark:not(.navy) .quote,.dark:not(.navy) .gtop b{color:var(--strong)}
.dark:not(.navy) .field output{color:var(--gold-text)}
.dark:not(.navy) .pill.bench{color:#9A5B12;background:rgba(242,179,90,.20)}
.dark:not(.navy) .pill.bill{color:var(--gold-text);background:var(--gold-soft)}
.dark:not(.navy) .glass{background:#fff;border-color:var(--line);box-shadow:0 24px 60px rgba(11,45,89,.10)}
.dark:not(.navy) .track{background:#DCEBFA}

/* Header and nav on the light hero */
.logo{color:var(--strong)}
.logo small{color:var(--gold-text)}
.hero:not(.navy) nav a{color:var(--strong)}
.hero:not(.navy) nav a:hover{color:var(--blue)}
.hero:not(.navy) nav a.free{color:var(--gold-text)!important;font-weight:700}
.hero:not(.navy) .aud a.on{background:var(--sky);color:var(--strong)}
.hero:not(.navy) .menu-btn{background:#fff;border-color:var(--line)}
.hero:not(.navy) .menu-btn span{background:var(--strong)}

/* Navy bands and cards */
.dark.navy,.hero.navy,.signature,.monday{
  --ink:#0B2D59; --ink-2:#123A6E; --line-d:#24497D; --on-d:#E8EEF7; --muted-d:#B9C7DB;
}
.dark.navy,.hero.navy{background:radial-gradient(700px 360px at 90% 0%,rgba(197,138,48,.20),transparent 60%),radial-gradient(600px 320px at 0% 100%,rgba(36,121,199,.25),transparent 60%),var(--navy);color:var(--on-d)}
.signature,.monday{background:var(--navy);border-color:var(--navy)}
.navy .btn.gold{background:#fff;border-color:#fff;color:var(--navy);box-shadow:none}
.navy .btn.gold:hover{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.navy h1 em,.navy h2 em,.signature .price{color:var(--gold-2)}
.navy .label{color:var(--gold-2)}
.navy a.mail{color:var(--gold-2)}

/* Two-week widget keeps its dark card, in brand navy */
.wk{background:radial-gradient(700px 360px at 92% 0%,rgba(197,138,48,.20),transparent 60%),radial-gradient(600px 320px at 0% 100%,rgba(36,121,199,.25),transparent 60%),#0B2D59}
.wk-toggle,.wk-stats div{background:#123A6E;border-color:#24497D}
.wk-days:before{background:#24497D}
.wk-days button i{background:#0B2D59;border-color:#3F6496}
.wk-sub,.wk-foot,.wk-stats span,.wk-days button{color:#B9C7DB}

/* Footer and sticky bar go light */
footer{background:#fff;color:var(--muted);border-top:1px solid var(--line)}
footer .wrap{border-top:0}
.contact{color:var(--strong)}
footer a.mail,footer a{color:var(--blue)}
.sticky{background:rgba(255,255,255,.96);border-top:1px solid var(--line);box-shadow:0 -10px 30px rgba(11,45,89,.08)}
.sticky span{color:var(--strong)}

/* New homepage hero photo */
.hero-photo{position:relative;margin:0}
.hero-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:22px;box-shadow:0 30px 70px rgba(11,45,89,.18)}
.hero-photo::before{content:"";position:absolute;inset:-14px -14px auto auto;width:120px;height:120px;border-radius:50%;border:2px solid var(--gold);opacity:.55;z-index:-1}
.hero-photo figcaption{position:absolute;left:18px;bottom:18px;background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:14px;padding:12px 16px;display:grid;gap:2px;box-shadow:0 12px 30px rgba(11,45,89,.12)}
.hero-photo figcaption b{color:var(--strong);font-size:.95rem}
.hero-photo figcaption span{color:var(--muted);font-size:.82rem}
.safe{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;padding:0;list-style:none}
.safe li{display:flex;align-items:center;gap:8px;font-size:.9rem;font-weight:600;color:var(--strong)}
.safe li::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
@media (max-width:860px){.hero-photo figcaption{left:12px;bottom:12px;padding:10px 12px}}
.hero-copy h1{font-size:clamp(2.7rem,5.6vw,4.6rem);line-height:1.04}
.hero-copy .label{display:block}

/* Single-column pages (privacy, terms, demo, thanks) in the light theme */
body.lightpage{
  --ink:#EAF3FC; --ink-2:#FFFFFF; --line-d:#DDE6F1; --on-d:#1A2333; --muted-d:#5A6577;
  background:radial-gradient(760px 420px at 92% 0%,rgba(197,138,48,.08),transparent 60%),linear-gradient(180deg,#FFFFFF 0%,#EAF3FC 70%,#F8FAFD 100%);
  color:var(--text);
}
body.lightpage h1,body.lightpage h2,body.lightpage h3{color:var(--strong)}
body.lightpage .lede b,body.lightpage .doc b,body.lightpage .sub,body.lightpage .pk b{color:var(--strong)}
body.lightpage .card,body.lightpage .box,body.lightpage .chips a,body.lightpage .week div{background:#fff;border-color:var(--line);color:var(--text);box-shadow:0 12px 30px rgba(11,45,89,.06)}
body.lightpage .back{color:var(--strong)}
body.lightpage .btn:not(.gold):not(.accent){border-color:var(--strong);color:var(--strong)}
body.lightpage footer{background:transparent;border-top-color:var(--line)}

/* Playbook page */
body.pb{--navy:#0B2D59;--navy2:#123A6E;--gold:#C58A30;--gold2:#E0B160;--goldd:#9A6A1F;--ivory:#F8FAFD;--ink:#1A2333;--muted:#5A6577;--line:#DDE6F1;background:#F8FAFD}
body.pb nav{background:#fff;color:var(--strong);border-bottom:1px solid var(--line)}
body.pb .nlinks a{color:var(--strong)}
body.pb nav a.nb{color:var(--gold-text)}
body.pb .menu-btn{border-color:var(--line)}
body.pb .menu-btn span{background:var(--strong)}
body.pb .hero{color:var(--strong)}
body.pb .hero .eyebrow{color:var(--gold-text)}
body.pb .hero p.sub{color:var(--muted)}
body.pb .hero .small{color:var(--muted)}
body.pb .hero img{box-shadow:0 30px 70px rgba(11,45,89,.18)}
body.pb .btn{background:var(--blue);color:#fff;box-shadow:0 10px 24px rgba(36,121,199,.25)}
body.pb .btn:hover{background:var(--blue-dark);color:#fff}
body.pb .btn.ghost{background:transparent;border:1.5px solid var(--blue);color:var(--blue);box-shadow:none}
body.pb .dark{color:var(--text)}
body.pb .dark p{color:var(--muted)}
body.pb .dark summary{color:var(--strong)}
body.pb .story{grid-template-columns:1fr;max-width:760px}
body.pb .sticky .btn{color:#fff}
body.lightpage .doc p,body.lightpage .doc li{color:#3A4458}
body.lightpage .next{background:linear-gradient(180deg,#FFFFFF,#EAF3FC);border-color:var(--light-blue);box-shadow:0 14px 40px rgba(11,45,89,.06)}
body.lightpage .wk h3{color:#fff}
body.lightpage .wk .label{color:var(--gold-2)}