/* ============================================================
   ASTRONÒMIC · Sistema de marca
   Base: paper blanc + tinta negra. Recursos: verd/ambre/terracota
   ============================================================ */

@font-face{font-family:'Jost';src:url('fonts/Jost-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'Fraunces';src:url('fonts/Fraunces-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Fraunces';src:url('fonts/Fraunces-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-600.ttf') format('truetype');font-weight:600;font-display:swap}

:root{
  --blanc:#FAFAF9;      /* fons principal */
  --tinta:#14140F;      /* text i logotip */
  --gris:#6E6E68;       /* text secundari (ús mínim) */
  --gris-clar:#A8A8A2;  /* metadades */
  --line:rgba(20,20,15,.10);

  --verd:#38F5A0;       /* DIVULGACIÓ */
  --ambre:#F5B85C;      /* ESTADA */
  --terra:#C1553A;      /* TERRITORI */

  /* ---- Tema fosc (domina el negre) ---- */
  --bg:#0E0E0B;             /* fons principal fosc */
  --bg-alt:#16160F;         /* fons de secció alternat */
  --bg-soft:#1C1C15;        /* targetes / blocs elevats */
  --fg:#FAFAF9;             /* text principal (blanc càlid) */
  --fg-soft:rgba(250,250,249,.72); /* text secundari sobre fosc */
  --fg-faint:rgba(250,250,249,.42);/* metadades sobre fosc */
  --line-d:rgba(250,250,249,.12);  /* filets sobre fosc */

  --serif:'Fraunces',Georgia,serif;
  --sans:'Inter',system-ui,sans-serif;
  --logo:'Jost',system-ui,sans-serif;

  --wrap:1160px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  color:var(--tinta);
  background:var(--blanc);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

/* ---- Tipografia ---- */
.eyebrow{
  font-family:var(--sans);
  font-size:11px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;
  color:#9a9a92;
}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;color:var(--tinta);letter-spacing:-.015em}
.display{font-family:var(--serif);font-weight:400;letter-spacing:-.015em}
.wordmark{font-family:var(--logo);font-weight:500;letter-spacing:.16em;text-transform:uppercase}

/* ---- Layout ---- */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
section{padding:120px 0}
.rule{width:44px;height:2px;background:#c9c9c2;margin:26px 0}

/* ---- Accents per secció ---- */
.acc-verd{color:var(--verd)}
.acc-ambre{color:var(--ambre)}
.acc-terra{color:var(--terra)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:10px;vertical-align:middle}

/* ---- Botons ---- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:13px;font-weight:600;
  letter-spacing:.04em;
  padding:14px 26px;border-radius:2px;
  border:1px solid var(--tinta);
  background:var(--tinta);color:var(--blanc);
  cursor:pointer;transition:.25s;
}
.btn:hover{background:transparent;color:var(--tinta)}
.btn-ghost{background:transparent;color:var(--fg)}
.btn-ghost:hover{background:var(--fg);color:var(--bg)}

@media(max-width:700px){
  section{padding:80px 0}
  .wrap{padding:0 22px}
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}