/* ──────────────────────────────────────────────────────────────
   Daylight — site chrome
   Restyles the EXISTING header and footer markup by its own theme
   classes. No block structure is changed, so the navigation block,
   site logo, social links and every menu item keep working exactly
   as before. Loaded site-wide from the header template part.
   ────────────────────────────────────────────────────────────── */

:root{
  --dl-bg:#fcfaf7; --dl-surface:#ffffff; --dl-sand:#f7f2ea;
  --dl-sage:#5e8c77; --dl-sage-deep:#3f6b58; --dl-sage-darker:#2f5343;
  --dl-sage-tint:#e6efe9;
  --dl-peach:#e9a07b; --dl-peach-deep:#b86f4a; --dl-peach-tint:#fbeee5;
  --dl-ink:#2e3335; --dl-body:#5b6264; --dl-muted:#89908f;
  --dl-line:#ece5db; --dl-line-2:#f4efe7;
  --dl-ease:cubic-bezier(.22,.9,.3,1);
  --dl-sh-1:inset 0 1px 0 rgba(255,255,255,.9), 0 1px 2px rgba(92,74,58,.05), 0 4px 12px -5px rgba(92,74,58,.12);
  --dl-sh-2:inset 0 1px 0 rgba(255,255,255,.9), 0 1px 3px rgba(92,74,58,.06), 0 12px 26px -10px rgba(92,74,58,.16);
}

/* ── header shell ───────────────────────────────────────────── */
.main-header{
  background:var(--dl-bg)!important;
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif;
  border-bottom:1px solid var(--dl-line);
}

/* top strip: email + social */
.main-header .topbar{
  background:var(--dl-sand)!important;
  border-bottom:1px solid var(--dl-line);
  padding-top:9px!important;padding-bottom:9px!important;
}
.main-header .topbar p,
.main-header .topbar p.has-foreground-color,
.main-header .topbar .has-link-color a{
  color:var(--dl-body)!important;
  font-size:14px!important;font-weight:500;letter-spacing:-.01em;margin:0;
}
.main-header .topbar .dashicons{
  color:var(--dl-sage-deep)!important;vertical-align:middle;margin-right:7px;
}
.main-header .topbar .wp-block-social-link{
  background:transparent!important;
}
.main-header .topbar .wp-block-social-link a{
  color:var(--dl-sage-deep)!important;
  transition:transform .3s var(--dl-ease),color .3s var(--dl-ease);
}
.main-header .topbar .wp-block-social-link a:hover{
  color:var(--dl-sage-darker)!important;transform:translateY(-2px);
}
.main-header .topbar .wp-block-social-link svg{fill:currentColor!important}

/* menu row */
.main-header .menu-header{
  background:var(--dl-bg)!important;
  border-radius:0!important;
}
.main-header .menu-header-boxes{
  margin-top:0!important;margin-bottom:0!important;
  padding-top:14px!important;padding-bottom:14px!important;
}

/* brand */
.main-header .logo-box{gap:12px;align-items:center}
.main-header .wp-block-site-title,
.main-header .wp-block-site-title a{
  color:var(--dl-ink)!important;
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif!important;
  font-size:1.2rem!important;font-weight:800!important;letter-spacing:-.045em!important;
  text-decoration:none;
}
.main-header .wp-block-site-title a:hover{color:var(--dl-sage-deep)!important}
.main-header .wp-block-site-logo img{border-radius:14px}

/* navigation — pills, exactly like the homepage nav */
.main-header .wp-block-navigation{
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif!important;
  font-size:16px!important;font-weight:600!important;
}
.main-header .wp-block-navigation .wp-block-navigation-item__content{
  color:var(--dl-body)!important;
  padding:11px 16px!important;border-radius:999px;
  letter-spacing:-.012em;text-decoration:none!important;
  transition:background .3s var(--dl-ease),color .3s var(--dl-ease);
}
.main-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.main-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content{
  background:var(--dl-sage-tint)!important;color:var(--dl-sage-deep)!important;
}
/* dropdowns */
.main-header .wp-block-navigation .wp-block-navigation__submenu-container{
  background:var(--dl-surface)!important;
  border:1px solid var(--dl-line)!important;border-radius:18px!important;
  box-shadow:var(--dl-sh-2)!important;padding:8px!important;overflow:hidden;
}
.main-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  border-radius:12px;padding:10px 14px!important;
}
/* mobile overlay */
.main-header .wp-block-navigation__responsive-container.is-menu-open{
  background:var(--dl-bg)!important;
}
.main-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
  color:var(--dl-ink)!important;
}
.main-header .wp-block-navigation__responsive-container-open,
.main-header .wp-block-navigation__responsive-container-close{
  color:var(--dl-ink)!important;
}

/* header CTA button */
.main-header .header-button .wp-block-button__link,
.main-header .header-btn .wp-block-button__link{
  background:var(--dl-sage-deep)!important;
  border-color:var(--dl-sage-deep)!important;border-width:1.5px!important;
  color:#fff!important;
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif!important;
  font-size:15px!important;font-weight:700!important;letter-spacing:-.012em!important;
  border-radius:999px!important;
  padding:13px 26px!important;min-height:46px;display:inline-flex;align-items:center;
  box-shadow:0 1px 2px rgba(47,83,67,.18),0 10px 18px -10px rgba(47,83,67,.7);
  transition:background .3s var(--dl-ease),transform .3s var(--dl-ease);
}
.main-header .header-button .wp-block-button__link:hover,
.main-header .header-btn .wp-block-button__link:hover{
  background:var(--dl-sage-darker)!important;color:#fff!important;transform:translateY(-2px);
}

/* ── footer ─────────────────────────────────────────────────── */
.footer-outer-box{
  background:var(--dl-sand)!important;
  border-top:1px solid var(--dl-line);
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif;
  color:var(--dl-body)!important;
}
.footer-outer-box h1,.footer-outer-box h2,.footer-outer-box h3,
.footer-outer-box h4,.footer-outer-box h5,.footer-outer-box h6{
  color:var(--dl-ink)!important;
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif!important;
  letter-spacing:-.035em!important;font-weight:800!important;
}
.footer-outer-box p,
.footer-outer-box li,
.footer-outer-box .wp-block-paragraph{
  color:var(--dl-body)!important;
}
.footer-outer-box a{
  color:var(--dl-body)!important;text-decoration:none!important;
  transition:color .26s var(--dl-ease);
}
.footer-outer-box a:hover{color:var(--dl-sage-deep)!important}
.footer-outer-box .wp-block-site-title,
.footer-outer-box .wp-block-site-title a{
  color:var(--dl-ink)!important;font-weight:800!important;letter-spacing:-.045em!important;
}
.footer-outer-box .wp-block-social-link{background:transparent!important}
.footer-outer-box .wp-block-social-link a{color:var(--dl-sage-deep)!important}
.footer-outer-box .wp-block-social-link svg{fill:currentColor!important}
.footer-outer-box .wp-block-social-link a:hover{color:var(--dl-sage-darker)!important}

@media (max-width:781px){
  .main-header .menu-header-boxes{padding-top:10px!important;padding-bottom:10px!important}
  .main-header .topbar p{font-size:13px!important}
}

/* ──────────────────────────────────────────────────────────────
   COPYRIGHT BAR
   It is a separate alignfull group, a sibling of .footer-outer-box,
   and carries the theme's navy "background" preset. Bring it into
   the Daylight palette so the footer reads as one warm block.
   ────────────────────────────────────────────────────────────── */
footer.wp-block-template-part > .wp-block-group.alignfull:not(.footer-outer-box){
  background:var(--dl-sand) !important;
  background-color:var(--dl-sand) !important;
  border-top:1px solid var(--dl-line);
  color:var(--dl-body) !important;
}
footer.wp-block-template-part > .wp-block-group.alignfull:not(.footer-outer-box) *{
  color:var(--dl-body) !important;
}
footer.wp-block-template-part > .wp-block-group.alignfull:not(.footer-outer-box) a{
  color:var(--dl-sage-deep) !important;text-decoration:none;
}
footer.wp-block-template-part > .wp-block-group.alignfull:not(.footer-outer-box) a:hover{
  color:var(--dl-sage-darker) !important;
}

/* one typeface across the whole chrome — the theme mixes Poppins and Inter */
.main-header, .main-header *,
footer.wp-block-template-part, footer.wp-block-template-part *{
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",Roboto,sans-serif !important;
}
.main-header .dashicons, .main-header .dashicons-email,
footer .dashicons{font-family:dashicons !important}

/* footer headings and brand, locked to the Daylight ink */
footer.wp-block-template-part h1, footer.wp-block-template-part h2,
footer.wp-block-template-part h3, footer.wp-block-template-part h4,
footer.wp-block-template-part h5, footer.wp-block-template-part h6{
  color:var(--dl-ink) !important;font-weight:800 !important;letter-spacing:-.035em !important;
}
footer.wp-block-template-part .wp-block-site-title,
footer.wp-block-template-part .wp-block-site-title a{
  color:var(--dl-ink) !important;font-weight:800 !important;letter-spacing:-.045em !important;
}

/* ──────────────────────────────────────────────────────────────
   MOBILE HEADER — conservative tightening only.
   The theme stacks its header columns below 781px. Leave that
   stacking alone (forcing a single row collapses the site title),
   and only remove dead space: the empty phone column it ships,
   and the oversized vertical padding.
   ────────────────────────────────────────────────────────────── */
@media (max-width:781px){
  .main-header .topbar{padding-top:6px!important;padding-bottom:6px!important}
  .main-header .topbar .top-phone-box{display:none!important}
  .main-header .topbar p{font-size:12.5px!important}
  .main-header .menu-header-boxes{
    padding-top:10px!important;padding-bottom:10px!important;
    margin-top:0!important;margin-bottom:0!important;
    row-gap:8px!important;
  }
  .main-header .menu-header-boxes > .wp-block-column{margin-top:0!important;margin-bottom:0!important}
  .main-header .header-btn .wp-block-button__link,
  .main-header .header-button .wp-block-button__link{
    padding:11px 20px!important;font-size:13.5px!important;min-height:42px;
  }
}

/* ══════════════════════════════════════════════════════════════
   REFINEMENTS — owner request
   1. drop the email/social top strip
   2. bring the brand + menu closer to the Daylight prototype
   3. two-tone footer wordmark
   4. green footer column headings
   ══════════════════════════════════════════════════════════════ */

/* 1 ── remove the top strip entirely (markup untouched, just hidden) */
.main-header .topbar{display:none!important}

/* 2 ── brand + menu, matched to the prototype and made lighter */
.main-header .menu-header-boxes{
  padding-top:12px!important;padding-bottom:12px!important;
  margin-top:0!important;margin-bottom:0!important;
}
.main-header .wp-block-site-logo img{
  width:44px!important;height:44px!important;object-fit:contain;border-radius:13px;
}
.main-header .logo-box{gap:12px!important;align-items:center!important}
.main-header .wp-block-site-title,
.main-header .wp-block-site-title a{
  font-size:1.18rem!important;font-weight:800!important;letter-spacing:-.045em!important;
  text-transform:none!important;line-height:1.1!important;
}
/* the small standfirst the prototype carries under the wordmark */
.main-header .wp-block-site-title::after{
  content:"Billing reference";
  display:block;
  font-size:.65rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--dl-muted);margin-top:1px;
}
.main-header .wp-block-navigation{font-size:15px!important;font-weight:600!important}
.main-header .wp-block-navigation .wp-block-navigation-item__content{
  padding:10px 15px!important;
}

/* 3 ── footer wordmark: half ink, half sage.
       "Cure" is 30.6% of the wordmark's width in this typeface, in either
       case style, so the hard stop lands exactly on the word boundary. */
footer.wp-block-template-part .wp-block-site-title{
  display:inline-block!important;
  text-transform:none!important;
  color:var(--dl-ink)!important;            /* fallback if background-clip is unsupported */
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  footer.wp-block-template-part .wp-block-site-title,
  footer.wp-block-template-part .wp-block-site-title a{
    background-image:linear-gradient(90deg,
      var(--dl-ink) 0, var(--dl-ink) 30.6%,
      var(--dl-sage-deep) 30.6%, var(--dl-sage-deep) 100%)!important;
    -webkit-background-clip:text!important;
    background-clip:text!important;
    -webkit-text-fill-color:transparent!important;
    color:transparent!important;
  }
}

/* 4 ── footer column headings in sage */
footer.wp-block-template-part h1, footer.wp-block-template-part h2,
footer.wp-block-template-part h3, footer.wp-block-template-part h4,
footer.wp-block-template-part h5, footer.wp-block-template-part h6{
  color:var(--dl-sage-deep)!important;
}

@media (max-width:781px){
  .main-header .menu-header-boxes{padding-top:10px!important;padding-bottom:10px!important}
  .main-header .wp-block-site-logo img{width:38px!important;height:38px!important}
  .main-header .wp-block-site-title,
  .main-header .wp-block-site-title a{font-size:1.05rem!important}
}

/* the theme sets a very large block-gap on the nav, which wrapped five items
   onto three lines and made the desktop bar ~164px tall */
.main-header .wp-block-navigation,
.main-header .wp-block-navigation .wp-block-navigation__container{
  gap:4px!important;
  row-gap:4px!important;
  align-items:center!important;
}
.main-header .menu-box{flex-basis:auto!important}
.main-header .menu-header-boxes{align-items:center!important}

/* the wordmark must not break onto two lines; keep the theme's explicit column
   percentages (removing them collapses the nav and breaks the whole bar) */
.main-header .header-logo{flex-basis:30%!important}
.main-header .menu-box{flex-basis:50%!important}
.main-header .wp-block-site-title,
.main-header .wp-block-site-title a,
.main-header .wp-block-site-title::after{white-space:nowrap!important}

/* ══════════════════════════════════════════════════════════════
   OWNER FIXES — 2026-09-23
   1. drop the "Billing reference" standfirst
   2. larger logo
   3. mobile header on a single row
   4. footer headings inherit their column's alignment
   ══════════════════════════════════════════════════════════════ */

/* 1 ── no standfirst under the wordmark */
.main-header .wp-block-site-title::after{content:none!important;display:none!important}

/* 2 ── a larger mark */
.main-header .wp-block-site-logo img{width:58px!important;height:58px!important}
.main-header .wp-block-site-title,
.main-header .wp-block-site-title a{font-size:1.3rem!important}

/* 3 ── mobile: brand, menu and CTA on one row.
       The theme stacks its header columns below 781px (flex-basis:100%),
       which produced three rows and a 143px bar. The wordmark carries
       white-space:nowrap so it can never break mid-word. */
@media (max-width:781px){
  .main-header .menu-header-boxes{
    display:flex!important;flex-wrap:nowrap!important;align-items:center!important;
    gap:9px!important;padding-top:9px!important;padding-bottom:9px!important;
    margin-top:0!important;margin-bottom:0!important;
  }
  .main-header .menu-header-boxes > .wp-block-column{
    flex:0 0 auto!important;flex-basis:auto!important;margin:0!important;width:auto!important;
  }
  .main-header .header-logo{flex:1 1 auto!important;order:1;min-width:0}
  .main-header .header-btn-box{order:2}
  .main-header .menu-box{order:3}
  .main-header .logo-box{gap:9px!important;flex-wrap:nowrap!important;justify-content:flex-start!important}
  .main-header .wp-block-site-logo img{width:44px!important;height:44px!important}
  .main-header .wp-block-site-title,
  .main-header .wp-block-site-title a{font-size:1.02rem!important}
  .main-header .header-btn .wp-block-button__link,
  .main-header .header-button .wp-block-button__link{
    padding:9px 15px!important;font-size:12.5px!important;min-height:40px;white-space:nowrap;
  }
  .main-header .burger,
  .main-header .wp-block-navigation__responsive-container-open{flex:none}
}
@media (max-width:400px){
  .main-header .wp-block-site-logo img{width:40px!important;height:40px!important}
  .main-header .wp-block-site-title,
  .main-header .wp-block-site-title a{font-size:.93rem!important}
  .main-header .header-btn .wp-block-button__link,
  .main-header .header-button .wp-block-button__link{padding:8px 12px!important;font-size:11.5px!important}
}

/* 4 ── footer headings: match whatever their own column does.
       "Quick Links" carried has-text-align-left while its siblings were
       centred, so it sat off to one side on mobile. */
footer.wp-block-template-part h1, footer.wp-block-template-part h2,
footer.wp-block-template-part h3, footer.wp-block-template-part h4,
footer.wp-block-template-part h5, footer.wp-block-template-part h6{
  text-align:inherit!important;
  color:var(--dl-sage-deep)!important;
}
@media (max-width:781px){
  footer.wp-block-template-part .footer-div,
  footer.wp-block-template-part .footer-div *{text-align:center!important}
  footer.wp-block-template-part .wp-block-social-links{justify-content:center!important}
}
