/* =========================================================
   Replica Std — Typographie CNDAPS
   ========================================================= */

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-Light.otf") format("opentype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-LightItalic.otf") format("opentype");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-Regular.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-Italic.otf") format("opentype");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-Bold.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-BoldItalic.otf") format("opentype");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-Heavy.otf") format("opentype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Replica Std";
    src: url("../fonts/ReplicaStd-HeavyItalic.otf") format("opentype");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}


:root {
  /* Brand / ICAPS */
  --color-icaps-700: #4f8c2f;
  --color-icaps-600: #69aa3f;
  --color-icaps-500: #78b94d;
  --color-icaps-100: #eef7e9;
  --color-icaps-50: #f7fbf4;

  --color-cndaps-pink: #c91e5f;
  --color-cndaps-orange: #d66b2c;
  --color-cndaps-red: #c3352a;
  --color-cndaps-black: #343433;

  /* Neutrals */
  --color-ink: #202323;
  --color-muted: #69706c;
  --color-line: #dfe5df;
  --color-surface: #ffffff;
  --color-surface-soft: #f5f7f4;

  /* Typography */
  --font-primary: "Replica Std", Arial, sans-serif;

  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-bold: 700;
  --font-weight-heavy: 900;

  /* Radius */
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 28px;

  /* Shadows */
  --shadow-sm: 0 8px 20px rgba(38, 54, 37, 0.06);
  --shadow-md: 0 14px 35px rgba(38, 54, 37, 0.08);
  --shadow-lg: 0 24px 60px rgba(38, 54, 37, 0.12);

  /* Transitions */
  --transition-fast: 0.18s ease;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body {
  margin: 0;
  font-family: var(--font-primary);
  font-weight: var(--font-weight-regular);
  color: var(--color-ink);
  background: var(--color-surface-soft);
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
  font: inherit;
}

a {
  color: inherit;
}

.button {
  min-height: 46px;
  padding: 0 18px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 10px;

  border: 0;
  border-radius: var(--radius-md);

  font-weight: var(--font-weight-bold);
  text-decoration: none;

  cursor: pointer;

  transition:
    background var(--transition-fast),
    color var(--transition-fast),
    transform var(--transition-fast);
}

.button--primary {
  background: var(--color-icaps-600);
  color: #fff;
}

.button--primary:hover {
  background: var(--color-icaps-700);
  transform: translateY(-1px);
}

.button--secondary {
  border: 1px solid var(--color-line);
  background: #fff;
  color: var(--color-ink);
}

.card {
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.form-control {
  width: 100%;
  min-height: 54px;

  padding: 0 16px;

  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);

  background: #fff;
  color: var(--color-ink);

  outline: none;

  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);
}

.form-control:focus {
  border-color: var(--color-icaps-600);
  box-shadow: 0 0 0 4px rgba(105, 170, 63, 0.13);
}

