/* ---------------------------------------------------------------------------
   Dany’s Plumbing theme tokens
   GENERATED by client-sites/_engine/tokens/theme.js. Do not hand edit.
   Every colour below was resolved by the design-time contrast walk in
   tokens/contrast.js, not chosen by eye. The achieved ratios are recorded in
   the brief at design_brief.palette.*.derived.
   --------------------------------------------------------------------------- */
:root{
  /* colour */
  --brand-dark:#103155;
  --brand-detail:#2065AD;
  --brand-action:#C9400C;
  --brand-action-ink:#C9400C;        /* the action colour as SMALL TEXT on white */
  --brand-action-on-dark:#F47342;  /* the action colour as small text on the dark */
  --brand-tint:#FFF1EA;
  --surface:#FFFFFF;
  --surface-alt:#FFF1EA;
  --on-action:#FFFFFF;                 /* set by the 0.179 luminance switch, never by eye */
  --ink:#16202E;
  --ink-soft:color-mix(in srgb, var(--ink) 74%, var(--surface));
  --border:#E1E8ED;
  --border-brand:var(--brand-action);
  --badge-ink:#16202E;
  --badge-star-gold:#F6AB26;    /* fixed, never tinted to the brand */
  --review-star:#F0AD4E;
  --star-empty:#CCD6DF;
  --overlay:var(--brand-dark);
  --overlay-opacity:0.85;
  --rbadge-ink:#FFFFFF;
  --rbadge-star:#F6AB26;
  --rbadge-focus:var(--brand-action);

  /* type */
  --font-display:'Changa', sans-serif;
  --display-style:normal;
  --font-body:'Poppins', sans-serif;
  --body-fs:17px;
  --fs-h1:38px; --fs-h2:30px; --fs-h3:24px;
  --fs-body:16px; --fs-btn:16px; --fs-nav:17px; --fs-small:14px;
  --fw-h1:700; --fw-h2:700; --fw-h3:700;
  --fw-body:400; --fw-btn:700; --fw-nav:700;
  --lh-heading:1.2; --lh-body:1.8; --lh-btn:1.2; --lh-small:1.6;
  --tt-heading:uppercase; --tt-btn:uppercase;

  /* shell and rhythm */
  --shell-x:1.5em; --shell-y:3em; --gap:20px;
  --gap-cards:35px 30px; --container:1280px;

  /* geometry */
  --radius:8px; --radius-lg:12px; --radius-card:8px; --radius-chip:8px;
  --cta-border:3px double #FFFFFF;
  --cta-bar-h:52px;
  --hero-min-h:640px;
  --hero-text-col:43%;
  --badge-max:150px;

  /* z index ladder */
  --z-callbar:100; --z-nav:1000; --z-menu-panel:9997;
  --z-menu-toggle:9998; --z-modal:9999;
}
@media (min-width:768px){:root{
  --shell-x:3em; --shell-y:4em;
  --fs-h1:52px; --fs-h2:42px; --fs-h3:25px; --fs-body:17px;
}}
@media (min-width:1025px){:root{
  --fs-h1:56px; --fs-h2:44px; --fs-h3:26px;
}}
/* a light band flips the badge ink and nothing else. The Google G keeps
   Google's own colours on any ground. */
.rbadges--dark{--rbadge-ink:var(--badge-ink);}

@media (max-width:1179px){
  .nav--dropdown .nav__links{
    position:absolute;top:100%;right:0;bottom:auto;left:0;width:auto;
    max-height:calc(100vh - 100% - var(--cta-bar-h));
    max-height:calc(100dvh - 100% - var(--cta-bar-h));
    padding:8px var(--shell-x) 24px;overscroll-behavior:contain;
    transform:translateY(-8px);opacity:0;visibility:hidden;
    transition:transform .22s ease,opacity .22s ease,visibility 0s linear .22s;
    box-shadow:0 18px 30px rgba(0,0,0,.28);
  }
  .nav--dropdown .nav__links.open{transform:none;opacity:1;visibility:visible;transition:transform .22s ease,opacity .22s ease,visibility 0s}
  /* one line height for links and toggles: a <button> does not inherit it, so
     the Services and Areas rows used to sit 12px shorter than the rest */
  .nav--dropdown .nav__link,.nav--dropdown .nav__dropdown-toggle{line-height:1.3}
  /* the hamburger is the close control: its three bars fold into an X while
     the menu is open, and they keep the colour of their own nav surface */
  .nav--dropdown .nav__hamburger span{transition:transform .2s ease,opacity .2s ease}
  .nav--dropdown .nav__hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav--dropdown .nav__hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav--dropdown .nav__hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .nav--light.nav--dropdown .nav__hamburger[aria-expanded="true"] span{background:var(--brand-dark)}
  .nav--dropdown .nav__close,.nav--dropdown .nav__scrim,.nav--dropdown .nav__scrim[hidden]{display:none}
}