/* Design system Reformas Hernández — tokens. Portado de _ds/tokens/. No editar a mano salvo cambio de marca. */

/* --- colors --- */
:root{
  /* Base — carbón y grafito */
  --carbon-950:#0B0D0B;
  --graphite-900:#131613;
  --graphite-850:#181C18;
  --graphite-800:#1D221D;
  --graphite-700:#272D27;
  --line-800:#2C332C;
  /* Acento — verde lima */
  --lime-400:#C6F53F;
  --lime-300:#D6FA6E;
  --lime-500:#A8DB1F;
  --lime-text-on-light:#44660A;
  --on-lime:#0B0D0B;
  /* Texto — blanco y plata */
  --white-100:#F4F6F1;
  --silver-300:#B9C1B8;
  --silver-400:#98A197;
  --silver-500:#79837A;

  /* Semantic — dark is the primary mode */
  --surface-page:var(--carbon-950);
  --surface-raised:var(--graphite-900);
  --surface-card:var(--graphite-850);
  --surface-elevated:var(--graphite-700);
  --surface-input:var(--graphite-900);
  --text-heading:var(--white-100);
  --text-body:var(--silver-300);
  --text-muted:var(--silver-400);
  --text-faint:var(--silver-500);
  --text-accent:var(--lime-400);
  --accent:var(--lime-400);
  --accent-hover:var(--lime-300);
  --accent-press:var(--lime-500);
  --text-on-accent:var(--on-lime);
  --border-hairline:var(--line-800);
  --border-accent:color-mix(in srgb, var(--lime-400) 38%, transparent);
  --border-accent-strong:var(--lime-400);
  --border-input:#3A423A;
  --focus-ring:0 0 0 2px var(--surface-page), 0 0 0 4px var(--lime-400);
  /* Estado */
  --danger:#FF7A66;
  --danger-strong:#E5482F;
  --success:var(--lime-400);
  --warning:#F5C542;
  --overlay:rgba(6,8,6,.72);
}
[data-theme="light"]{
  --surface-page:#EFF1EC;
  --surface-raised:#F7F8F5;
  --surface-card:#FFFFFF;
  --surface-elevated:#FFFFFF;
  --surface-input:#FFFFFF;
  --text-heading:#121512;
  --text-body:#3A403A;
  --text-muted:#5C645C;
  --text-faint:#79837A;
  --text-accent:var(--lime-text-on-light);
  --accent:var(--lime-400);
  --accent-hover:#D6FA6E;
  --accent-press:#A8DB1F;
  --text-on-accent:#0B0D0B;
  --border-hairline:#D8DCD4;
  --border-accent:color-mix(in srgb, #44660A 40%, transparent);
  --border-accent-strong:#44660A;
  --border-input:#B9C0B6;
  --focus-ring:0 0 0 2px var(--surface-page), 0 0 0 4px #44660A;
  --danger:#C43A24;
  --danger-strong:#A82D19;
  --success:#44660A;
  --warning:#8A6A0A;
  --overlay:rgba(18,21,18,.45);
}

/* --- typography --- */
:root{
  --font-display:"Barlow Condensed", "Arial Narrow", sans-serif;
  --font-body:"Barlow", "Helvetica Neue", sans-serif;
  /* Display — sans condensada pesada, MAYÚSCULAS */
  --display-weight:800;
  --display-transform:uppercase; /* @kind other */
  --display-tracking:.01em;
  --text-display-xl:clamp(56px,7vw,96px);
  --text-display:clamp(40px,5vw,64px);
  --text-h1:44px;
  --text-h2:32px;
  --text-h3:24px;
  --text-h4:19px;
  --leading-display:.95;
  --leading-heading:1.05;
  /* Body — sans neutra */
  --text-lg:18px;
  --text-md:16px;
  --text-sm:14px;
  --text-xs:12.5px;
  --leading-body:1.55;
  /* Etiquetas / overline */
  --label-size:13px;
  --label-tracking:.14em;
  --label-weight:600;
}
body{margin:0;font-family:var(--font-body);font-size:var(--text-md);line-height:var(--leading-body);color:var(--text-body);background:var(--surface-page)}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--display-weight);text-transform:var(--display-transform);letter-spacing:var(--display-tracking);line-height:var(--leading-heading);color:var(--text-heading);margin:0}
h1{font-size:var(--text-h1)}h2{font-size:var(--text-h2)}h3{font-size:var(--text-h3)}h4{font-size:var(--text-h4)}
h1 em,h2 em,h3 em,.display em{font-style:italic;color:var(--text-accent)}
a{color:var(--text-accent);text-decoration:none}
a:hover{color:var(--accent-hover);text-decoration:underline;text-underline-offset:3px}
[data-theme="light"] a:hover{color:var(--text-accent)}
::selection{background:var(--accent);color:var(--text-on-accent)}

/* --- spacing --- */
:root{
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;--sp-12:48px;--sp-16:64px;--sp-20:80px;--sp-24:96px;
  --container-max:1200px;
  --section-pad-y:var(--sp-20);
  --card-pad:var(--sp-6);
  --stack-gap:var(--sp-4);
}

/* --- effects --- */
:root{
  /* Esquinas ligeramente redondeadas */
  --radius-sm:4px;
  --radius-md:6px;
  --radius-lg:8px;
  --radius-pill:999px;
  /* Reglas de 1px */
  --rule:1px solid var(--border-hairline);
  --rule-accent:1px solid var(--border-accent);
  /* Sombras — discretas; la marca se apoya en bordes, no en sombras */
  --shadow-card:none;
  --shadow-pop:0 12px 32px rgba(0,0,0,.45);
  --shadow-pop-light:0 12px 32px rgba(18,21,18,.14);
  /* Iconografía de línea */
  --icon-stroke:1.5;
  /* Motion */
  --ease-out:cubic-bezier(.2,.8,.2,1); /* @kind other */
  --dur-fast:120ms; /* @kind other */
  --dur-med:220ms; /* @kind other */
}