/*
 Theme Name:   Assist Child Theme
 Theme URI:    https://generatepress.comline-height
 Description:  Assist Child Theme (A GeneratePress child theme)
 Author:       Geoff Balfre
 Author URI:   https://geoffbalfre.
 Template:     generatepress
 Version:      0.1
*/

:root {

  /* interpolate-size: allow-keywords; */
  /* color-scheme: light dark; */

  --ct-content-max-width:  1280px;

/* COLOR VARIABLES */

  /* primary colors */

  --ct-color-primary:       hsl(210 100% 36.1%);  /* primary #005CB8 */
  --ct-color-primary-dark:  hsl(from var(--ct-color-primary) h s calc(l - 10));
  --ct-color-primary-light: hsl(from var(--ct-color-primary) h s calc(l + 10));
  --ct-color-primary-deco:  hsl(from var(--ct-color-primary) h s calc(l + 60));

  /* accent colors */

  --ct-color-accent:        hsl(35 100% 54.1%);  /* accent #FF9E15 */
  --ct-color-accent-dark:   hsl(from var(--ct-color-accent) h s calc(l - 10));
  --ct-color-accent-light:  hsl(from var(--ct-color-accent) h s calc(l + 10));
  --ct-color-accent-deco:   hsl(from var(--ct-color-accent) h s calc(l + 40));

  /* neutral colors */

  --ct-color-base:          hsl(0 0% 50%); /* #808080 */
  --ct-color-50:            hsl(from var(--ct-color-base) h s calc(l + 45)); /* background */
  --ct-color-100:           hsl(from var(--ct-color-base) h s calc(l + 40));
  --ct-color-150:           hsl(from var(--ct-color-base) h s calc(l + 35));
  --ct-color-200:           hsl(from var(--ct-color-base) h s calc(l + 30));
  --ct-color-300:           hsl(from var(--ct-color-base) h s calc(l + 20));
  --ct-color-400:           hsl(from var(--ct-color-base) h s calc(l + 10));
  --ct-color-500:           var(--ct-color-base);                            /* base */
  --ct-color-600:           hsl(from var(--ct-color-base) h s calc(l - 10)); /* muted text */
  --ct-color-700:           hsl(from var(--ct-color-base) h s calc(l - 20)); /* text */
  --ct-color-800:           hsl(from var(--ct-color-base) h s calc(l - 30));
  --ct-color-850:           hsl(from var(--ct-color-base) h s calc(l - 35));
  --ct-color-900:           hsl(from var(--ct-color-base) h s calc(l - 40));
  --ct-color-950:           hsl(from var(--ct-color-base) h s calc(l - 45));

/* TYPOGRAPHY VARIABLES */

  /* typography colors */

  --ct-color-text-light:    var(--ct-color-50);
  --ct-color-text:          var(--ct-color-700);
  --ct-color-text-heading:  var(--ct-color-800);
  --ct-color-text-muted:    var(--ct-color-600);
  --ct-color-background:    hsl(from var(--ct-color-primary) h s calc(l + 60));

  /* typography line height */
  --ct-text-line-height:    1.6; /* see in reset also */
  --ct-heading-line-height: 1.1; /* see in reset also */

  /* font family system fonts https://tailwindcss.com/docs/font-family */
  --ct-text-font:     ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --ct-heading-font:  ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  /*--ct-heading-font:  ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif; */
  --ct-mono-font:     ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;

  /* font weights */
  --ct-font-weight-100: 100;
  --ct-font-weight-200: 200;
  --ct-font-weight-300: 300; /* muted */
  --ct-font-weight-400: 400; /* default */
  --ct-font-weight-500: 500;
  --ct-font-weight-600: 600;
  --ct-font-weight-700: 700; /* bold */
  --ct-font-weight-800: 800;
  --ct-font-weight-900: 900;

/* FLUID TYPE AND SPACE VARIABLES https://utopia.fyi/type minor third major third - 360 1240 */

  /* font sizing */
  --ct-step--2: clamp(0.7813rem, 0.7736rem + 0.0341vw, 0.8rem);
  --ct-step--1: clamp(0.9375rem, 0.9119rem + 0.1136vw, 1rem);
  --ct-step-0: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem); /* default font size */
  --ct-step-1: clamp(1.35rem, 1.2631rem + 0.3864vw, 1.5625rem);
  --ct-step-2: clamp(1.62rem, 1.4837rem + 0.6057vw, 1.9531rem);
  --ct-step-3: clamp(1.944rem, 1.7405rem + 0.9044vw, 2.4414rem);
  --ct-step-4: clamp(2.3328rem, 2.0387rem + 1.3072vw, 3.0518rem);
  --ct-step-5: clamp(2.7994rem, 2.384rem + 1.8461vw, 3.8147rem);

  /* fluid space */
  --ct-space-3xs: clamp(0.3125rem, 0.3125rem + 0vw, 0.3125rem);
  --ct-space-2xs: clamp(0.5625rem, 0.5369rem + 0.1136vw, 0.625rem);
  --ct-space-xs: clamp(0.875rem, 0.8494rem + 0.1136vw, 0.9375rem);
  --ct-space-s: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem);
  --ct-space-m: clamp(1.6875rem, 1.6108rem + 0.3409vw, 1.875rem);
  --ct-space-l: clamp(2.25rem, 2.1477rem + 0.4545vw, 2.5rem);
  --ct-space-xl: clamp(3.375rem, 3.2216rem + 0.6818vw, 3.75rem);
  --ct-space-2xl: clamp(4.5rem, 4.2955rem + 0.9091vw, 5rem);
  --ct-space-3xl: clamp(6.75rem, 6.4432rem + 1.3636vw, 7.5rem);

  /* one-up pairs */
  --ct-space-3xs-2xs: clamp(0.3125rem, 0.1847rem + 0.5682vw, 0.625rem);
  --ct-space-2xs-xs: clamp(0.5625rem, 0.4091rem + 0.6818vw, 0.9375rem);
  --ct-space-xs-s: clamp(0.875rem, 0.7216rem + 0.6818vw, 1.25rem);
  --ct-space-s-m: clamp(1.125rem, 0.8182rem + 1.3636vw, 1.875rem);
  --ct-space-m-l: clamp(1.6875rem, 1.3551rem + 1.4773vw, 2.5rem);
  --ct-space-l-xl: clamp(2.25rem, 1.6364rem + 2.7273vw, 3.75rem);
  --ct-space-xl-2xl: clamp(3.375rem, 2.7102rem + 2.9545vw, 5rem);
  --ct-space-2xl-3xl: clamp(4.5rem, 3.2727rem + 5.4545vw, 7.5rem);

  /* custom pairs */
  --ct-space-s-l: clamp(1.125rem, 0.5625rem + 2.5vw, 2.5rem);

}

/* RESET STYLES - https://piccalil.li/blog/a-more-modern-css-reset/ */

/* Box sizing rules */
/* *, *::before, *::after { box-sizing: border-box; }

/* Prevent font size inflation */
/* html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } */

/* Remove default margin in favour of better control in authored CSS */
/* body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd { margin-block-end: 0; } */

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
/* ul[role='list'], ol[role='list'] { list-style: none; } */

/* Set core body defaults ENHANCED */
/* body { min-height: 100vh; min-block-size: 100svh; line-height: 1.6; } */

/* Set shorter line heights on headings and interactive elements */
/* h1, h2, h3, h4, h5, h6, button, input, label { line-height: 1.1; } */

/* Balance text wrapping on headings */
/* h1, h2, h3, h4, h5, h6 { text-wrap: balance; } */

/* A elements that don't have a class get default styles */
/* a:not([class]) { text-decoration-skip-ink: auto; color: currentColor; } */

/* Make images easier to work with */
/* img, picture { max-width: 100%; display: block; } */

/* Inherit fonts for inputs and buttons */
/* input, button, textarea, select { font: inherit; } */

/* Make sure textareas without a rows attribute are not tiny */
/* textarea:not([rows]) { min-height: 10em; } */

/* Anything that has been anchored to should have extra scroll margin */
/* :target { scroll-margin-block: 5ex; } */

/* GLOBAL STYLES */

/* prevent font size inflation and manage scroll bar on short pages */
html {
    scrollbar-gutter: stable;
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
}

/* respect user motion preferences for accessibility */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* TYPOGRAPHY CLASSES */

body {
  -webkit-font-smoothing:  antialiased;
  -moz-osx-font-smoothing: grayscale;

  color:       var(--ct-color-text);
  background:  var(--ct-color-background);

  font-size:   var(--ct-step-0);
  font-family: var(--ct-text-font);
  font-weight: var(--ct-font-weight-400);
  line-height: var(--ct-text-line-height);
  margin-block-end: 0; /* see in reset also */
  hanging-punctuation: first last; /* progressive enhancement */
}

/* headings and heading text */
h1, h2, h3, h4, .xl-text, .h1-text, .h2-text, .h3-text, .h4-text {
  color:       var(--ct-color-text-heading);
  font-family: var(--ct-heading-font);
  font-weight: var(--ct-font-weight-700);
  line-height: var(--ct-heading-line-height);

  margin-block-end: 0; /* see in reset also */
  margin-top: 1em;

  text-wrap: balance; /* progressive enhancement */
}
.xl-text {
  font-size: var(--ct-step-5);
}
h1, .h1-text {
  font-size: var(--ct-step-4);
}
h2, .h2-text {
  font-size: var(--ct-step-3);
}
h3, .h3-text {
  font-size: var(--ct-step-2);
}
h4, .h4-text {
  font-size: var(--ct-step-1);
}

p {
  color: var(--ct-color-text);
  font-size: var(--ct-step-0);
  margin-top: var(--ct-step-0);
  margin-block-end: 0; /* see in reset also  */
}
h1 + p {
  font-size: var(--ct-step-2);
  margin-top: var(--ct-step-2);
  margin-block-end: 0; /* see in reset also  */
}


/* mono font styles */
pre, code, samp, kbd {
  color: currentColor;
  font-size: var(--ct-step-0);
  font-family: var(--ct-mono-font);
  line-height: var(--ct-text-line-height);
}

/* custom text styles */
.promo-text-example {
  font-size: var(--ct-step-2);
  margin-block-end: 0; /* see in reset also  */
}
.text-light {
  color: var(--ct-color-text-light);
}
.text-muted {
  color: var(--ct-color-text-muted);
  font-weight: var(--ct-font-weight-300);
}



/* CUSTOM BANNER CLASSES */

.ct-banner {
  width: 100%;
  background-color:  var(--ct-color-primary);
}
.ct-banner-list {
  color: var(--ct-color-text-light);
  max-width: var(--ct-content-max-width);
  margin: 0 auto;
  padding: 0.92em 0.92em;
  display: flex;
  justify-content: space-between;
  gap: 1em;
  align-items: center;
  list-style: none;
  font-weight: 500;
}
.ct-banner-list a {
  color: var(--ct-color-text-light);
  display: flex;
  align-items: center;
  text-decoration: none;
  transition: color 150ms ease;
  white-space: nowrap;
}
.ct-banner-list a:hover {
    color: var(--ct-color-text-light);
  text-decoration: underline;
}

.ct-banner-label {

}
.ct-banner-text {
  padding-right: 0.42em;
}
.ct-banner-value {

}

@media screen and (max-width: 960px) {
  .ct-banner-list {
    padding: 0.42em;
  }
  .ct-banner-label {
    display: none;
  }
}
@media screen and (max-width: 414px) {
  .ct-banner-label svg {
    display: none;
  }
}

/* CUSTOM HERO CLASSES */





/* CUSTOM FOOTER CLASSES */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

    footer.site-info {
      all: unset;
    }
    footer.site-info .inside-site-info {
      all: unset;
    }

    .ct-footer {
      position: relative;
      background: var(--ct-color-primary);
      padding: 3rem 1rem 1rem 1rem;
    }

    .ct-footer p,
    .ct-footer a,
    .ct-footer li,
    .ct-footer dt,
    .ct-footer address {
      color: var(--ct-color-text-light);
    }

    .ct-footer-inner {
      max-width: 1280px;
      min-width: 360px;
      margin: 0 auto;
      padding: 0;
    }
    .ct-footer-columns {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1rem;
      align-items: start;
    }
    .ct-footer-section {
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .ct-footer-title {
      margin-bottom: 0.25rem;
    }
    .ct-footer-title span {
      font-weight: 700;
      line-height: 1.6;
      display: inline-block;
      border-bottom: 2px solid var(--ct-color-accent);
      padding-bottom: 0.25rem;
    }

    .ct-footer-recognition ul {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 0.25rem;
      line-height: 1.6;
      margin: 0;
    }

    .ct-contact-details {
      margin-top: 0.42rem;
      display: flex;
      flex-direction: column;
      gap: 0.42rem;
    }


    dl.contact-details {
      margin-block-start: 0;
    }
    dl.contact-details dt {
      font-weight: 600;
    }
    dl.contact-details dd {
      margin: 0;
      margin-bottom: 0.42rem;
    }


    .ct-address-block {
      margin-top: 0.42rem;
      margin-bottom: 0;
      line-height: 1.6;
      font-style: normal;
    }

    .ct-footer-label {
      font-weight: 600;
      display: block;
      margin-bottom: 0.42rem;
    }
    .ct-hours {
      margin-top: 0.75rem;
      display: block;
    }


    .ct-footer-nav ul {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 0.25rem;
      line-height: 1.6;
      margin: 0;
    }

    .ct-footer-legal {
      margin-top: 2rem;
      padding: 1rem;
      text-align: center;
    }
    .ct-footer-legal p {
      font-size: 0.875rem;
      padding-bottom: 0.42rem;
    }

    @media (max-width: 1024px) {
      .ct-footer-columns {
        grid-template-columns: repeat(2, 1fr);
        justify-items: center;
        gap: 1rem;
      }
      .ct-footer-section {
        width: 100%;
        max-width: 22rem;
      }
    }

    @media (max-width: 512px) {
      .ct-footer-columns {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 1rem;
      }
      .ct-footer-section {
        width: 16rem;
      }
    }





/* STYLEGUIDE COLOR ILLUSTRATION */

/* color swatches */
.style-guide {
  display: flex;
  flex-direction: column;
  gap: 32px;
  max-width: 900px;
}
.swatch-group {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.color-swatch {
  width: 88px;
  height: 88px;
  border-radius: 0.25rem;
  border: 1px solid #ddd;
}

/* depth cards */
.depth-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  max-width: 900px;
}
/* darkest layer: the base */
.depth-wrapper {
  background: var(--ct-color-150);
  padding: 2rem;
  border-radius: 1rem;
}
/* mid layer: the card */
.depth-card {
  background: var(--ct-color-100);
  padding: 1rem;
  border-radius: 0.5rem;
  box-shadow:
    2px 2px 4px rgba(0,0,0,0.10),   /* soft near shadow */
    6px 6px 14px rgba(0,0,0,0.18);  /* deeper offset shadow */
}
/* surface layer: content panel */
.depth-content {
  background: var(--ct-color-50);
  padding: 1rem;
  border-radius: 0.5rem;
  border: 1px solid var(--ct-color-300);
}