/* Shared Chez Investe design tokens and base UI rules. */
:root {
  --title-font: Manrope, 'Miranda Sans', sans-serif;
  --body-font: 'Miranda Sans', sans-serif;
  --brand-black: #333333;
  --body-color: #333333;
  --surface-soft: #f9f7f6;
  --accent-color: #ffc628;
  --accent-hover: #ffd85c;
  --radius-sm: 8px;
  --radius-md: 14px;

  /* --- Layout system (see _build-tools/DESIGN-GUIDELINES.md) ---
     Every full-width band on the site uses the same container:
       width:100%; max-width: calc(var(--content-max) + 2*var(--gutter));
       margin-inline:auto; padding-inline: var(--gutter);
     so text, photos, cards and the footer all line up on one grid. */
  --content-max: 1140px;
  --gutter: clamp(20px, 5vw, 48px);
  --brand-navy: #1B2F52;
  --t1: 5.75rem;
  --t2: 3.25rem;
  --t3: 2.125rem;
  --t4: 1.625rem;
  --t5: 1.375rem;
  --t6: 1.125rem;
  --t7: 1rem;
  --t8: 0.875rem;

  /* --- Spacing scale (see _build-tools/DESIGN-GUIDELINES.md #6) ---
     Reverse-engineered from the values already dominant across chez-shell.css
     and chez-property.css. Use these for any new margin/padding/gap instead
     of a fresh px value; reach for the clamp() between two adjacent steps
     for anything that should scale with viewport width. */
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 20px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;
}

body,
.u-body,
p:not(.u-text-variant),
p.u-small-text,
p.u-large-text {
  color: var(--body-color);
  font-family: var(--body-font);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--body-color);
  font-family: var(--title-font);
  letter-spacing: 0;
}

h1 {
  font-size: var(--t1);
  font-weight: 800;
}

h2 {
  font-size: var(--t2);
  font-weight: 700;
}

h3 {
  font-size: var(--t3);
  font-weight: 600;
}

h4 {
  font-size: var(--t4);
  font-weight: 600;
}

h5 {
  font-size: var(--t5);
  font-weight: 500;
}

h6 {
  font-size: var(--t6);
  font-weight: 500;
}

/* Header, menu, mobile drawer, contact/footer and cookie banner
   are owned by chez-shell.css, loaded last on every page. */

.u-btn,
.u-button-style,
.cc-cookies-btn {
  font-family: var(--title-font) !important;
}

.u-text-custom-color-2,
a.u-button-style.u-text-custom-color-2,
a.u-button-style.u-text-custom-color-2[class*="u-border-"],
a.u-button-style.u-text-custom-color-2:hover,
a.u-button-style.u-text-custom-color-2[class*="u-border-"]:hover,
a.u-button-style.u-text-custom-color-2:focus,
a.u-button-style.u-text-custom-color-2[class*="u-border-"]:focus,
a.u-button-style.u-text-custom-color-2:active,
a.u-button-style.u-text-custom-color-2.active,
.u-link.u-text-custom-color-2,
.u-link.u-text-custom-color-2:hover,
a.u-link.u-text-hover-custom-color-2:hover,
a.u-button-style:hover > .u-text-hover-custom-color-2,
a.u-button-style.u-text-hover-custom-color-2:hover,
a.u-button-style.u-text-hover-custom-color-2:focus,
a.u-button-style.u-text-active-custom-color-2.active,
a.u-button-style.active > .u-text-active-custom-color-2,
.u-text-body-color,
a.u-button-style.u-text-body-color,
a.u-button-style.u-text-body-color:hover,
a.u-button-style.u-text-body-color:focus,
.u-text-grey-50,
.u-text-grey-80,
.u-text-grey-90,
.u-text-palette-1-base,
.u-text-active-palette-1-base.active,
.u-text-hover-palette-1-base:hover,
a.u-button-style.u-text-active-palette-1-base.active,
a.u-button-style.u-text-hover-palette-1-base:hover {
  color: var(--body-color) !important;
}

.u-text-custom-color-2 svg,
.u-text-hover-custom-color-2:hover svg,
.u-button-style:hover > .u-text-hover-custom-color-2 svg,
.u-button-style.active > .u-text-active-custom-color-2 svg,
.u-text-body-color svg,
.u-text-grey-50 svg,
.u-text-grey-80 svg,
.u-text-grey-90 svg,
.u-text-palette-1-base svg,
.u-text-active-palette-1-base.active svg,
.u-text-hover-palette-1-base:hover svg {
  fill: var(--body-color) !important;
}

a.u-btn-4,
a.u-btn-4:visited,
a.u-btn-4:hover,
a.u-btn-4:focus,
a.u-btn-4:active,
.cc-cookies-btn {
  border-radius: var(--radius-sm) !important;
  color: var(--body-color) !important;
  font-family: var(--title-font) !important;
  text-decoration: none !important;
}
