/* ==========================================================================
   Contemporan Homes — Design tokens
   Extrase din designul de referință (Contemporan Homes.html).
   Sursa de adevăr pentru culori, tipografie, spațiere, raze.
   ========================================================================== */
:root {
  /* --- Culori: suprafețe --- */
  --c-bg:            #F4F2ED;  /* fundal pagină */
  --c-surface:       #EFEBE3;  /* card / suprafață ridicată */
  --c-surface-2:     #EDE8DF;
  --c-surface-3:     #E7E1D6;  /* chip inactiv, separator plin */
  --c-border:        #DCD4C6;

  /* --- Culori: text --- */
  --c-ink:           #17130F;  /* text principal */
  --c-ink-soft:      #6E675F;  /* text secundar */
  --c-ink-invert:    #FFFFFF;

  /* --- Culori: accent (brand) --- */
  --c-accent:        #AF3E24;
  --c-accent-hover:  #AF2A1A;
  --c-accent-dark:   #8C2F19;
  --c-accent-soft:   #E9A08D;
  --c-accent-tint:   #F7E3DE;

  /* --- Culori: stare --- */
  --c-ok:            #2C5730;  /* disponibil */
  --c-ok-tint:       #E4EFE4;

  /* --- Culori: dark (footer / hero overlay) --- */
  --c-dark:          #17130F;
  --c-dark-2:        #171310;
  --c-dark-3:        #241D18;
  --c-on-dark:       rgba(255,255,255,.86);
  --c-on-dark-soft:  rgba(255,255,255,.72);
  --c-on-dark-mute:  rgba(255,255,255,.62);
  --c-on-dark-line:  rgba(255,255,255,.18);
  --c-on-dark-fill:  rgba(255,255,255,.08);

  /* --- Tipografie --- */
  --f-display: 'Familjen Grotesk', system-ui, sans-serif;  /* titluri */
  --f-body:    'Instrument Sans', system-ui, sans-serif;   /* text curent */

  --fs-xs:   12px;
  --fs-sm:   13px;
  --fs-base: 15px;
  --fs-md:   17px;
  --fs-lg:   21px;
  --fs-xl:   27px;
  --fs-2xl:  32px;
  --fs-hero: clamp(42px, 6.4vw, 80px);

  --lh-tight: 1.02;
  --lh-head:  1.15;
  --lh-body:  1.6;
  --ls-tight: -.05em;
  --ls-head:  -.035em;
  --ls-caps:  .36em;

  /* --- Raze --- */
  --r-pill: 999px;
  --r-lg:   24px;   /* carduri mari, secțiuni */
  --r-md:   16px;   /* media, carduri */
  --r-sm:   12px;
  --r-full: 50%;

  /* --- Layout --- */
  --wrap:       1280px;
  --gutter:     clamp(20px, 5vw, 60px);
  --header-h:   84px;

  /* --- Tranziții --- */
  --t-fast: .2s ease;
  --t-med:  .25s ease;
  --t-slow: .4s ease;

  /* --- Scală de spațiere ---------------------------------------------
     Derivată din valorile deja dominante în fișier: 8/12/16 (micro),
     24/32 (mediu), 36 (intro), plus trei roluri structurale.
     Stilurile inline din designul portat referă direct aceste variabile,
     deci un singur loc de editat. */
  --sp-2xs: 8px;      /* fostele 8, 9        */
  --sp-xs:  12px;     /* fostele 10, 11, 12  */
  --sp-sm:  16px;     /* fostele 14, 16, 18  */
  --sp-md:  24px;     /* fostele 22, 24, 26  */
  --sp-lg:  32px;     /* fostele 28, 32, 34  */

  --sp-intro:   36px;                        /* sub intro-ul de secțiune */
  --sp-split:   clamp(32px, 4.5vw, 72px);    /* între cele două coloane  */
  --sp-section: clamp(64px, 6.4vw, 96px);    /* padding vertical secțiune*/
  --sp-gutter:  clamp(20px, 5vw, 60px);      /* margine laterală         */
}