@font-face { font-family: "Avenir"; font-weight: 300; font-style: normal;
  src: url("../fonts/Avenir-Light.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Avenir"; font-weight: 300; font-style: oblique;
  src: url("../fonts/Avenir-Light-Oblique.woff2") format("woff2"); font-display: swap; }

@font-face { font-family: "Avenir"; font-weight: 400; font-style: normal;
  src: url("../fonts/Avenir-Book.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Avenir"; font-weight: 400; font-style: oblique;
  src: url("../fonts/Avenir-Book-Oblique.woff2") format("woff2"); font-display: swap; }

@font-face { font-family: "Avenir"; font-weight: 500; font-style: normal;
  src: url("../fonts/Avenir-Medium.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Avenir"; font-weight: 500; font-style: oblique;
  src: url("../fonts/Avenir-Medium-Oblique.woff2") format("woff2"); font-display: swap; }

@font-face { font-family: "Avenir"; font-weight: 700; font-style: normal;
  src: url("../fonts/Avenir-Heavy.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Avenir"; font-weight: 700; font-style: oblique;
  src: url("../fonts/Avenir-Heavy-Oblique.woff2") format("woff2"); font-display: swap; }

@font-face { font-family: "Avenir"; font-weight: 900; font-style: normal;
  src: url("../fonts/Avenir-Black.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Avenir"; font-weight: 900; font-style: oblique;
  src: url("../fonts/Avenir-Black-Oblique.woff2") format("woff2"); font-display: swap; }

@font-face { font-family: "Avenir Roman"; font-weight: 400; font-style: normal;
  src: url("../fonts/Avenir-Regular.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Avenir Roman"; font-weight: 400; font-style: oblique;
  src: url("../fonts/Avenir-Oblique.woff2") format("woff2"); font-display: swap; }


@font-face { font-family: "Cormorant"; font-style: italic; font-weight: 300;
  src: url("../fonts/cormorant-300-italic.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Cormorant"; font-style: italic; font-weight: 400;
  src: url("../fonts/cormorant-400-italic.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Cormorant"; font-style: italic; font-weight: 500;
  src: url("../fonts/cormorant-500-italic.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Libre Baskerville"; font-style: italic; font-weight: 400;
  src: url("../fonts/libre-baskerville-400-italic.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Libre Baskerville"; font-style: normal; font-weight: 400;
  src: url("../fonts/libre-baskerville-400.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Libre Baskerville"; font-style: normal; font-weight: 700;
  src: url("../fonts/libre-baskerville-700.woff2") format("woff2"); font-display: swap; }


:root {


  --h7-natural-linen: #EEE5D6;
  --h7-dark-indigo:   #1E2D49;
  --h7-earthen-clay:  #794530;
  --h7-aged-brass:    #8A6A2F;

  --h7-bone:          #E7DED0;
  --h7-pottery-red:   #9A4930;
  --h7-smoke-timber:  #433328;
  --h7-soot:          #292827;


  --h7-brass-light:    #C9A84C;
  --h7-deep-brass:     #6E5426;
  --h7-indigo-raised:  #26375A;
  --h7-indigo-deep:    #16223A;


  --h7-font-display:    "Libre Baskerville", Georgia, "Times New Roman", serif;
  --h7-font-body:       "Avenir", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --h7-font-body-roman: "Avenir Roman", var(--h7-font-body);
  --h7-font-accent:     "Cormorant", Georgia, serif;

  --h7-weight-light:  300;
  --h7-weight-book:   400;
  --h7-weight-medium: 500;
  --h7-weight-heavy:  700;
  --h7-weight-black:  900;


  --h7-size-display-1: clamp(2.75rem, 6.2vw, 5.625rem);
  --h7-size-display-2: clamp(2.375rem, 4.9vw, 4.375rem);
  --h7-size-display-3: clamp(2rem, 4.2vw, 3.75rem);
  --h7-size-headline:  clamp(1.75rem, 2.8vw, 2.5rem);
  --h7-size-title:     clamp(1.3125rem, 1.7vw, 1.5625rem);
  --h7-size-body-lg:   clamp(1.1875rem, 1.5vw, 1.375rem);
  --h7-size-body:      1.1875rem;
  --h7-size-body-sm:   1.125rem;
  --h7-size-ui:        1.25rem;
  --h7-size-caption:   0.9375rem;
  --h7-size-eyebrow:   0.9375rem;
  --h7-size-accent:    clamp(2rem, 3.5vw, 3.125rem);
  --h7-size-accent-sm: 1.25rem;

  --h7-leading-display: 1.02;
  --h7-leading-tight:   1.15;
  --h7-leading-title:   1.3;
  --h7-leading-body:    1.65;
  --h7-tracking-caps:   0.18em;
  --h7-tracking-button: 0.14em;


  --h7-space-1:  4px;    --h7-space-2:  8px;    --h7-space-3:  12px;
  --h7-space-4:  16px;   --h7-space-5:  24px;   --h7-space-6:  32px;
  --h7-space-7:  40px;   --h7-space-8:  56px;   --h7-space-9:  72px;
  --h7-space-10: 96px;   --h7-space-11: 128px;  --h7-space-12: 160px;

  --h7-page-max:    1440px;
  --h7-content-max: 1140px;
  --h7-measure:     68ch;

  --h7-gutter: 80px;
  --h7-grid-gap: 24px;
  --h7-section-y: 128px;

  --h7-header-h: 88px;


  --h7-radius-xs:   2px;
  --h7-radius-card: 4px;
  --h7-radius-pill: 999px;


  --h7-shadow-1: 0 1px 2px rgba(67, 51, 40, 0.08);
  --h7-shadow-2: 0 2px 6px rgba(67, 51, 40, 0.10);
  --h7-shadow-3: 0 8px 24px rgba(67, 51, 40, 0.14);
  --h7-shadow-4: 0 24px 64px rgba(67, 51, 40, 0.28);


  --h7-shadow-card:       0 6px 18px rgba(14, 10, 7, 0.30);
  --h7-shadow-card-hover: 0 16px 40px rgba(14, 10, 7, 0.44);

  --h7-scrim-bottom: linear-gradient(to top,
      rgba(30, 45, 73, 0.86) 0%, rgba(30, 45, 73, 0.55) 32%, rgba(30, 45, 73, 0) 68%);
  --h7-scrim-modal: rgba(41, 40, 39, 0.62);


  --h7-duration-instant: 90ms;
  --h7-duration-fast:    160ms;
  --h7-duration-base:    240ms;
  --h7-duration-slow:    420ms;
  --h7-duration-reveal:  720ms;
  --h7-duration-ken-burns: 12s;

  --h7-ease-standard: cubic-bezier(0.22, 0.61, 0.36, 1);
  --h7-ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --h7-ease-in:       cubic-bezier(0.5, 0, 0.75, 0);
  --h7-ease-linen:    cubic-bezier(0.33, 0.02, 0, 1);

  --h7-transition-colour: color var(--h7-duration-fast) var(--h7-ease-standard),
                          background-color var(--h7-duration-fast) var(--h7-ease-standard),
                          border-color var(--h7-duration-fast) var(--h7-ease-standard);
  --h7-transition-transform: transform var(--h7-duration-base) var(--h7-ease-standard);
}


:root,
[data-theme="dark"] .h7-invert {
  --h7-surface-page:    var(--h7-natural-linen);
  --h7-surface-raised:  var(--h7-bone);
  --h7-surface-card:    var(--h7-natural-linen);
  --h7-surface-subtle:  var(--h7-bone);
  --h7-surface-inset:   rgba(67, 51, 40, 0.04);

  --h7-text-primary:    var(--h7-dark-indigo);
  --h7-text-secondary:  rgba(30, 45, 73, 0.78);
  --h7-text-muted:      rgba(30, 45, 73, 0.56);
  --h7-text-accent:     var(--h7-earthen-clay);
  --h7-text-link:       var(--h7-earthen-clay);
  --h7-text-link-hover: var(--h7-pottery-red);

  --h7-border-default:  rgba(138, 106, 47, 0.38);
  --h7-border-strong:   rgba(138, 106, 47, 0.62);

  --h7-action-primary-bg:       var(--h7-earthen-clay);
  --h7-action-primary-bg-hover: var(--h7-pottery-red);
  --h7-action-primary-fg:       var(--h7-natural-linen);
  --h7-action-secondary-fg:     var(--h7-dark-indigo);

  --h7-icon-default: var(--h7-dark-indigo);
  --h7-icon-muted:   var(--h7-aged-brass);

  --h7-focus-ring: 0 0 0 2px var(--h7-natural-linen), 0 0 0 4px var(--h7-aged-brass);
  --h7-card-bg: var(--h7-dark-indigo);
  --h7-logo:     url("../logos/house7-logo-gold-on-linen.png");
  --h7-monogram: url("../logos/house7-monogram-gold-on-linen.png");

  color-scheme: light;
}


[data-theme="dark"],
:root:not([data-theme="dark"]) .h7-invert,
:root:not([data-theme="dark"]) .h7-invert-on-light,
.h7-header,
.h7-card,
.h7-plate,
.h7-aside,
.h7-archival-note {
  --h7-surface-page:    var(--h7-dark-indigo);
  --h7-surface-raised:  var(--h7-indigo-raised);
  --h7-surface-card:    var(--h7-indigo-raised);
  --h7-surface-subtle:  var(--h7-indigo-deep);
  --h7-surface-inset:   rgba(238, 229, 214, 0.05);

  --h7-text-primary:    var(--h7-natural-linen);
  --h7-text-secondary:  rgba(238, 229, 214, 0.78);
  --h7-text-muted:      rgba(238, 229, 214, 0.55);
  --h7-text-accent:     var(--h7-brass-light);
  --h7-text-link:       var(--h7-brass-light);
  --h7-text-link-hover: var(--h7-natural-linen);

  --h7-border-default:  rgba(238, 229, 214, 0.22);
  --h7-border-strong:   rgba(238, 229, 214, 0.40);

  --h7-action-primary-bg:       var(--h7-natural-linen);
  --h7-action-primary-bg-hover: var(--h7-bone);
  --h7-action-primary-fg:       var(--h7-dark-indigo);
  --h7-action-secondary-fg:     var(--h7-natural-linen);

  --h7-icon-default: var(--h7-natural-linen);
  --h7-icon-muted:   var(--h7-brass-light);

  --h7-focus-ring: 0 0 0 2px var(--h7-dark-indigo), 0 0 0 4px var(--h7-brass-light);
  --h7-card-bg: var(--h7-indigo-deep);
  --h7-logo:     url("../logos/house7-logo-gold-on-indigo.png");
  --h7-monogram: url("../logos/house7-monogram-gold-on-indigo.png");

  color-scheme: dark;
}


@media (max-width: 1024px) {
  :root { --h7-gutter: 48px; --h7-section-y: 96px; }
}

@media (max-width: 640px) {
  :root { --h7-gutter: 24px; --h7-section-y: 72px; --h7-header-h: 72px; }
}


@media (max-width: 430px) {
  :root {
    --h7-size-display-1: 2.125rem;
    --h7-size-display-2: 1.875rem;
    --h7-size-display-3: 1.625rem;
    --h7-size-headline:  1.375rem;
    --h7-size-title:     1.125rem;
    --h7-size-body-lg:   1.0625rem;
    --h7-size-body:      1.0625rem;
    --h7-size-body-sm:   1rem;
  }
}


@media (prefers-reduced-motion: reduce) {
  :root {
    --h7-duration-instant: 1ms;
    --h7-duration-fast:    1ms;
    --h7-duration-base:    1ms;
    --h7-duration-slow:    1ms;
    --h7-duration-reveal:  1ms;
    --h7-duration-ken-burns: 1ms;
  }
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}