/* investirdanslia.fr — design tokens & base styles */

:root {
  /* Default (overridden inline by tweaks) */
  --accent: #3B0764;
  --accent-bright: #7C3AED;
  --accent-soft: #E6F9EE;
  --accent-deep: #00A344;

  /* Greys (no pure black) */
  --ink: #1F2421;          /* dark text */
  --ink-2: #3A413C;        /* secondary text */
  --ink-3: #6B7470;        /* tertiary */
  --ink-4: #9AA29E;        /* muted */
  --line: #E6E8E6;         /* hairlines */
  --line-2: #EFF1EF;       /* softer */
  --bg: #FFFFFF;
  --bg-2: #F7F8F7;         /* light gray surface */
  --bg-3: #F1F3F1;

  /* Type */
  --font-display: "Fraunces", "GT Sectra", "Tiempos Headline", Georgia, serif;
  --font-sans: "Inter Tight", "Söhne", "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Spacing */
  --pad-x: clamp(20px, 4vw, 56px);
  --maxw: 1320px;

  /* Radii */
  --r-1: 6px;
  --r-2: 10px;
  --r-3: 14px;
  --r-4: 22px;
}

[data-theme="dark"] {
  --ink: #ECEFEC;
  --ink-2: #C7CBC8;
  --ink-3: #9AA29E;
  --ink-4: #6F7773;
  --line: #2A2F2C;
  --line-2: #232825;
  --bg: #16181708;
  --bg: #15171608;
  --bg: #131514;
  --bg-2: #1B1E1C;
  --bg-3: #20231F;
  --accent-soft: #0E2A1A;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "ss01", "cv11";
}

a { color: inherit; text-decoration: none; }

img { max-width: 100%; display: block; }

/* Typo — strict no-italic policy */
.serif { font-family: var(--font-display); font-weight: 400; font-style: normal; letter-spacing: -0.01em; }
.mono { font-family: var(--font-mono); font-feature-settings: "tnum"; }
em, i, cite { font-style: normal; }

h1, h2, h3, h4 { margin: 0; font-family: var(--font-display); font-weight: 400; font-style: normal; letter-spacing: -0.018em; line-height: 1.05; }
h1 { font-size: clamp(40px, 5.4vw, 76px); }
h2 { font-size: clamp(28px, 3vw, 42px); }
h3 { font-size: clamp(20px, 1.6vw, 26px); }

p { margin: 0; }

button { font: inherit; color: inherit; cursor: pointer; }

/* Selection */
::selection { background: var(--accent); color: #fff; }

/* Utility */
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-sans);
  font-size: 11.5px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-3);
}
.eyebrow .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); display: inline-block; box-shadow: 0 0 0 4px var(--accent-soft); }

.container { max-width: var(--maxw); margin: 0 auto; padding-left: var(--pad-x); padding-right: var(--pad-x); }

.divider { height: 1px; background: var(--line); width: 100%; }

/* Subtle motion utilities */
.fade-up { animation: fadeUp .8s cubic-bezier(.2,.7,.2,1) both; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(10px);} to { opacity: 1; transform: none;} }

.reveal { opacity: 0; transform: translateY(14px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }

/* Article underline animation */
.link-underline { position: relative; display: inline; background-image: linear-gradient(var(--accent), var(--accent)); background-size: 0% 1px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .35s ease; }
.link-underline:hover { background-size: 100% 1px; }