@layer reset, variables, base, components, layout;

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/reset.css */
@layer reset {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }
  *:not(dialog) {
    margin: 0;
  }
  @media (prefers-reduced-motion: no-preference) {
    html {
      interpolate-size: allow-keywords;
    }
  }
  body {
    line-height: 1.4;
    -webkit-font-smoothing: antialiased;
  }
  img,
  picture,
  video,
  canvas,
  svg {
    display: block;
    max-width: 100%;
  }
  input,
  button,
  textarea,
  select {
    font: inherit;
  }
  p,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    overflow-wrap: break-word;
  }
  p {
    text-wrap: pretty;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    text-wrap: balance;
  }
  #root,
  #__next {
    isolation: isolate;
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/variables/colors.css */
@layer variables {
  :root {
    --color-blue-50: #eff7ff;
    --color-blue-100: #dcecff;
    --color-blue-200: #c0ddff;
    --color-blue-300: #93c5ff;
    --color-blue-400: #519bff;
    --color-blue-500: #0070ff;
    --color-blue-600: #0042ff;
    --color-blue-700: #0021ff;
    --color-blue-800: #0023db;
    --color-blue-900: #002da7;
    --color-blue-950: #012166;
    --color-blue-1000: #001c57;
    --color-yellow-50: #fff8ec;
    --color-yellow-100: #ffedce;
    --color-yellow-200: #ffdba1;
    --color-yellow-300: #ffc46d;
    --color-yellow-400: #ffaf4a;
    --color-yellow-500: #ffa046;
    --color-yellow-600: #db8234;
    --color-yellow-700: #a96223;
    --color-yellow-800: #8a501e;
    --color-yellow-900: #73451e;
    --color-yellow-950: #42250c;
    --color-slate-50: #f8f6fd;
    --color-slate-100: #f2eefc;
    --color-slate-200: #e3ddf6;
    --color-slate-300: #cdc1ef;
    --color-slate-400: #9c87d0;
    --color-slate-500: #7354ae;
    --color-slate-600: #563290;
    --color-slate-700: #421c77;
    --color-slate-800: #2a0354;
    --color-slate-900: #180039;
    --color-slate-950: #06001a;
    --color-sky-50: #f3f9ff;
    --color-sky-100: #e7f1ff;
    --color-sky-200: #cce3ff;
    --color-sky-300: #a2ceff;
    --color-sky-400: #6faeff;
    --color-sky-500: #5496f4;
    --color-sky-600: #3d79ce;
    --color-sky-700: #3061a8;
    --color-sky-800: #284f87;
    --color-sky-900: #20406d;
    --color-sky-950: #112747;
    --color-yellow-2-50: #fff9f2;
    --color-yellow-2-100: #fff0db;
    --color-yellow-2-200: #ffe1b9;
    --color-yellow-2-300: #ffd095;
    --color-yellow-2-400: #ffbf7e;
    --color-yellow-2-500: #feb174;
    --color-yellow-2-600: #db9760;
    --color-yellow-2-700: #b47b4d;
    --color-yellow-2-800: #92633e;
    --color-yellow-2-900: #785336;
    --color-yellow-2-950: #452e1b;
    --color-orange-50: #fff6eb;
    --color-orange-100: #ffeacd;
    --color-orange-200: #ffd39b;
    --color-orange-300: #ffb658;
    --color-orange-400: #ff9300;
    --color-orange-500: #ff7f00;
    --color-orange-600: #e46400;
    --color-orange-700: #b34900;
    --color-orange-800: #8c3a00;
    --color-orange-900: #703100;
    --color-orange-950: #3a1400;
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/variables/fonts.css */
@layer variables {
  :root {
    --font-family-serif: "Libre Baskerville", serif;
    --font-family-sans-serif: "Cooper Hewitt", sans-serif;
    --font-size-4: clamp(2.986rem, 2.7212rem + 3.0385vw, 5rem);
    --font-size-3: clamp(2.488rem, 2.1769rem + 2.4308vw, 4rem);
    --font-size-2: clamp(2.074rem, 1.925rem + 1.4333vw, 3rem);
    --font-size-1: clamp(1.728rem, 1.1596rem + 1.1205vw, 2rem);
    --font-size-0: clamp(1.125rem, 1.0558rem + 0.1923vw, 1.2rem);
    --font-size--1: clamp(0.8rem, 0.5231rem + 0.7692vw, 1.1rem);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/variables/light-dark.css */
@layer variables {
  @media (prefers-color-scheme: dark) {
    :root {
      --bg-primary: hsl(from var(--color-blue-1000) h calc(s * 0.5) calc(l * 0.75));
      --text-primary: var(--color-sky-50);
      --accent: var(--color-yellow-2-900);
      --bg-card: var(--color-yellow-2-800);
      --shadow-color: 221deg 100% 7%;
      --bg-secondary: var(--color-royal-ink);
      --text-secondary: var(--color-antique-brass);
      --border: var(--color-cherry-mahog);
      --accent-deep: var(--color-dark-walnut);
      --cta: var(--color-antique-brass);
      --cta-text: var(--color-night-royal);
    }
  }
  @media (prefers-color-scheme: light) {
    :root {
      --bg-primary: hsl(from var(--color-yellow-2-50) h s calc(l * 1.02));
      --bg-secondary: var(--color-sky-700);
      --text-primary: var(--color-blue-1000);
      --text-secondary: var(--color-sky-50);
      --accent: var(--color-yellow-2-600);
      --accent-deep: var(--color-sky-950);
      --bg-card: var(--color-yellow-2-100);
      --border: var(--color-orange-800);
      --shadow-color: 40deg 25% 63%;
      --cta: var(--color-brushed-brass);
      --cta-text: var(--color-walnut-edge);
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/variables/shadows.css */
@layer variables {
  :root {
    --shadow-elevation-low:
      0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.34),
      0.4px 0.8px 1px -1.2px hsl(var(--shadow-color) / 0.34),
      1px 2px 2.5px -2.5px hsl(var(--shadow-color) / 0.34);
    --shadow-elevation-medium:
      0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.36),
      0.8px 1.6px 2px -0.8px hsl(var(--shadow-color) / 0.36),
      2.1px 4.1px 5.2px -1.7px hsl(var(--shadow-color) / 0.36),
      5px 10px 12.6px -2.5px hsl(var(--shadow-color) / 0.36);
    --shadow-elevation-high:
      0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.34),
      1.5px 2.9px 3.7px -0.4px hsl(var(--shadow-color) / 0.34),
      2.7px 5.4px 6.8px -0.7px hsl(var(--shadow-color) / 0.34),
      4.5px 8.9px 11.2px -1.1px hsl(var(--shadow-color) / 0.34),
      7.1px 14.3px 18px -1.4px hsl(var(--shadow-color) / 0.34),
      11.2px 22.3px 28.1px -1.8px hsl(var(--shadow-color) / 0.34),
      17px 33.9px 42.7px -2.1px hsl(var(--shadow-color) / 0.34),
      25px 50px 62.9px -2.5px hsl(var(--shadow-color) / 0.34);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/variables/_index.css */
@layer variables;

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/a.css */
@layer base {
  a {
    color: color-mix(in hsl, blue, var(--text-primary) 75%);
    &:hover {
      filter: brightness(1.25);
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/body.css */
@layer base {
  body {
    --primary-layout-content: 150px;
    --primary-layout-extra-wide: 150px;
    --primary-layout-extra-wide-increase: 150px;
    --primary-layout-narrow: calc(860px - 150px);
    --primary-layout-narrow-reduction: 150px;
    --primary-layout-padding: clamp(2.25rem, 2.0966rem + 0.6818vw, 2.625rem);
    --primary-layout-wide: 150px;
    --primary-layout-wide-increase: 150px;
    --primary-layout-width: 860px;
    display: grid;
    grid-template-columns: [full-width-start] minmax(var(--primary-layout-padding), 1fr) [extra-wide-start] minmax(0, var(--primary-layout-extra-wide)) [wide-start] minmax(0, var(--primary-layout-wide)) [content-start] minmax(0, var(--primary-layout-content)) [narrow-start] min(100% - var(--primary-layout-padding) * 2, var(--primary-layout-narrow)) [narrow-end] minmax(0, var(--primary-layout-content)) [content-end] minmax(0, var(--primary-layout-wide)) [wide-end] minmax(0, var(--primary-layout-extra-wide)) [extra-wide-end] minmax(var(--primary-layout-padding), 1fr) [full-width-end];
    & > {
      grid-column: content;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/font-face.css */
@layer base {
  @font-face {
    font-family: "Libre Baskerville";
    src: url(/fonts/LibreBaskerville[wght].woff2);
  }
  @font-face {
    font-family: "Libre Baskerville";
    font-style: italic;
    src: url(/fonts/LibreBaskerville-Italic[wght].woff2);
  }
  @font-face {
    font-family: "Cooper Hewitt";
    font-weight: bold;
    src: url(/fonts/CooperHewitt-Semibold.woff2);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/footer.css */
@layer base {
  footer {
    grid-column: full-width;
    border-top: 1px solid;
    margin-block-start: 3rem;
    padding-block: 3rem;
    display: grid;
    grid-template-columns: inherit;
    border-top: 0.25rem solid var(--accent-deep);
    background-color: hsl(from var(--bg-primary) h calc(s * 0.5) calc(l / 1.05));
    box-shadow: inset 0 2px 2rem hsl(var(--shadow-color));
    gap: 2rem 0;
    justify-items: center;
    & > * {
      grid-column: content;
    }
    a:has(.logo) {
      width: 100%;
      max-width: 400px;
    }
    img {
      max-height: 200px;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/form.css */
@layer base {
  form {
    fieldset {
      border: 0;
      outline: 0;
      padding: 0;
    }
    label {
      display: block;
    }
    input:not([type=submit]),
    textarea {
      width: 100%;
      padding: 0.25rem;
    }
    input[type=submit] {
      margin-block: 1rem;
      margin-inline-start: auto;
      display: block;
      background: var(--text-primary);
      color: var(--bg-primary);
      outline: 0;
      border: 0;
      border-radius: 0.25rem;
      box-shadow: var(--shadow-elevation-low);
      font-size: var(--font-size-0);
      font-family: var(--font-family-sans-serif);
      padding: 0.5rem 1rem;
      &:hover {
        filter: brightness(1.25);
      }
      &:active {
        position: relative;
        transform: translateY(2px);
      }
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/headings.css */
@layer base {
  h1,
  h2,
  h3 {
    font-weight: 475;
  }
  h1,
  .fs-h1 {
    font-size: var(--font-size-4);
    line-height: 1.1;
  }
  h2,
  .fs-h2 {
    font-size: var(--font-size-3);
    line-height: 1.1;
  }
  h3,
  .fs-h3 {
    font-size: var(--font-size-2);
    line-height: 1.1;
  }
  h4,
  .fs-h4 {
    font-size: calc(var(--font-size-1) * 1.075);
    line-height: 1.1;
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/html.css */
@layer base {
  html {
    font-family: var(--font-family-serif);
    font-size: var(--font-size-0);
    background-color: var(--bg-primary);
    color: var(--text-primary);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/image.css */
@layer base {
  p img {
    float: var(--float, left);
    margin-inline: var(--margin-inline, 1rem);
    border: 0.5rem solid var(--border);
    box-shadow: var(--shadow-elevation-medium);
  }
  p.featured,
  img.featured {
    grid-column: wide;
    box-shadow: var(--shadow-elevation-medium);
    border: 0.5rem solid var(--border);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/main.css */
@layer base {
  main {
    grid-column: full-width;
    margin-block: 3rem;
    display: grid;
    grid-template-columns: inherit;
    & > * {
      grid-column: content;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/nav.css */
@layer base {
  nav {
    ul {
      --justify-content: space-between;
      list-style: none;
      padding-inline: 0;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/section.css */
@layer base {
  main > section:not(:first-child) {
    & > *:first-child {
      margin-block-start: 1em;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/base/_index.css */
@layer base;

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/button.css */
@layer components {
  a.button,
  p.button {
    --max-width: 300px;
    text-align: center;
  }
  a.button,
  p.button a {
    display: inline-block;
    border-radius: 0.5rem;
    box-shadow:
      0 0 0 4px var(--bg-primary),
      0 0 0 6px var(--bg-secondary),
      var(--shadow-elevation-medium);
    background-color: var(--bg-secondary);
    color: var(--text-secondary);
    text-decoration: none;
    text-align: center;
    padding: 0.25rem 0.5rem;
    margin: 6px;
    max-width: var(--max-width, 300px);
    &:hover {
      filter: brightness(1.25);
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/callout.css */
@layer components {
  .callout {
    padding: 1rem;
    padding-inline-start: 2rem;
    border-radius: 0.5rem;
    background:
      linear-gradient(
        to right,
        var(--accent) 0,
        var(--accent) 1rem,
        transparent 1rem,
        transparent 100%),
      var(--bg-card);
    box-shadow: inset 0px 2px 6px 0px hsl(var(--shadow-color));
    font-style: italic;
    font-size: var(--font-size-1);
    margin-block: 1em;
    grid-column: narrow;
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/cf-turnstile.css */
@layer components {
  .cf-turnstile {
    margin-block: 1rem;
    opacity: 0.7;
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/deep-link.css */
@layer components {
  .deep-link {
    display: none;
    opacity: 0.1;
    position: absolute;
    padding: 1ch;
    top: -1ch;
    left: -2ch;
    transition: 0.2s ease-out all;
    text-decoration: none;
    height: 100%;
    color: var(--text-primary);
  }
  h2:has(.deep-link),
  h3:has(.deep-link) {
    position: relative;
    &:hover {
      .deep-link {
        display: inline-block;
        opacity: 0.5;
      }
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/featured.css */
@layer components {
  .featured {
    grid-column: wide;
    box-shadow: var(--shadow-elevation-medium);
    border: 0.5rem solid var(--border);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/group.css */
@layer components {
  .group {
    display: flex;
    gap: var(--gap, 1rem);
    align-items: var(--align-items, center);
    flex-wrap: var(--flex-wrap, wrap);
    justify-content: var(--justify-content, flex-start);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/logo.css */
@layer components {
  .logo {
    background-color: var(--text-primary);
    min-height: 75px;
    height: 100%;
    min-width: 250px;
    font-size: 0;
    mask: url(/icons/logo.svg) center/contain no-repeat;
  }
  a:has(.logo) {
    text-decoration: none;
    color: var(--text-primary);
    display: inline-block;
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/pile.css */
@layer components {
  .pile {
    display: grid;
    grid-template-areas: "pile";
    place-items: center;
    & > * {
      grid-area: pile;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/prose.css */
@layer components {
  .prose {
    & > * + * {
      margin-block-start: 1em;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/stack.css */
@layer components {
  .stack {
    display: flex;
    flex-direction: column;
    gap: var(--stack-gap, 1rem);
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/colors.css */
@layer components {
  .colors {
    display: flex;
    .column {
      width: 150px;
    }
    .color {
      height: 50px;
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/components/_index.css */
@layer components;

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/layout/banner.css */
@layer layout {
  .banner {
    display: grid;
    grid-template-columns: inherit;
    grid-column: full-width;
    font-family: "Cooper Hewitt", sans-serif;
    font-size: var(--font-size--1);
    padding-block: 1rem;
    margin-block-end: 1rem;
    box-shadow: var(--shadow-elevation-medium);
    background-color: hsl(from var(--bg-primary) h calc(s * 0.5) calc(l / 1.05));
    nav {
      grid-column: wide;
      display: flex;
      gap: 2ch;
      flex-wrap: wrap;
      & > ul {
        --gap: 1.5rem;
        --justify-content: flex-start;
        --flex-wrap: no-wrap;
        flex: 1;
        overflow-x: scroll;
        @media screen and (max-width: 900px) {
          flex: 0 0 100%;
        }
      }
    }
    a {
      text-decoration: none;
      font-weight: 550;
      color: var(--text-primary);
      &:hover {
        text-decoration: underline 3px;
      }
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/layout/card.css */
@layer layout {
  .card {
    border-radius: 1rem;
    text-decoration: none;
    overflow: hidden;
    font-family: var(--font-family-sans-serif);
    box-shadow: var(--shadow-elevation-medium);
    p {
      padding: 0.5rem;
      background-color: hsl(from var(--text-primary) h s l / 70%);
      color: var(--bg-primary);
      place-self: end start;
      width: 100%;
      transform: scale(1);
    }
    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: 0.25s ease-out transform;
    }
    &:hover {
      img {
        transform: scale(1.05);
        filter: brightness(1.25);
      }
    }
    &:hover {
      filter: brightness(1.1);
    }
    @media screen and (max-width: 900px) {
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/layout/hero.css */
@layer layout {
  .hero {
    grid-column: wide;
    container-name: hero;
    container-type: inline-size;
    @media screen and (min-width: 900px) {
      display: grid;
      grid-template-columns: [hero-content hero-icons] 1fr;
      gap: 4rem;
      grid-template-columns: [hero-content-start] 0.75fr [hero-content-end hero-icons-start] 1.75fr [hero-icons-end];
    }
    .content {
      grid-column: hero-content;
      margin-block-end: 1rem;
    }
    .icons {
      grid-column: hero-icons;
      display: grid;
      gap: 1rem;
      grid-template-columns: 1fr;
      container: icons / inline-size;
      @container hero (width > calc(250px * 2 + 1rem)) {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        grid-template-rows: repeat(auto-fit, 1fr);
      }
      @container icons (width <= calc(500px + 1rem)) {
        .card {
          display: flex;
          align-items: center;
          background-color: hsl(from var(--text-primary) h s l / 70%);
          img {
            border-radius: 1rem;
            aspect-ratio: 4 / 3;
            max-width: 150px;
            padding: 0.5rem;
          }
          p {
            background: none;
            padding-inline-start: 0.75rem;
            padding-inline-end: 3rem;
            place-self: unset;
            &::after {
              content: "\2192";
              position: absolute;
              right: 1rem;
              top: calc(50% - 0.75rem);
              background: var(--bg-primary);
              color: var(--text-primary);
              width: 1.5rem;
              height: 1.5rem;
              text-align: center;
              line-height: 1.75rem;
              border-radius: 50%;
            }
          }
        }
      }
    }
  }
}

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/layout/title-image.css */
@layer layout;

/* ns-hugo-imp:/var/home/thomas/Projects/www/azarlawoffices.com/assets/styles/layout/_index.css */
@layer layout;

/* <stdin> */