/*
 * Skin · skin-corporative-2-agro
 * Variante AGROPECUARIA del core corporative-2 (Opción B: producto vertical
 * propio; el core institucional conserva skin-corporative-2 en navy/oro).
 *
 * Identidad: verde campo del Norte argentino. Comunica tradición generacional,
 * rigor profesional y arraigo a la tierra. Referente: Don Octavio SRL.
 *
 * Paleta:  verde campo #0E5430 · verde oscuro #062817 · verde claro #E8F5EA ·
 *          acento trigo/cosecha #B98A2E.
 * Fonts:   Lexend (titulares) + Open Sans (texto).
 *
 * Escala de tokens completa (patrón Porto: -100/-300 shades, -rgba-0..90,
 * inverse, greys) para que los componentes nativos no queden sin valor —
 * la skin institucional carecía de estas escalas.
 */

/* General */
:root {
    --border-radius:   2px;
    --border-radius2x: 4px;
    --default:         #6b7280;
}

/* Skin Colors — Agropecuario (verde campo + trigo) */
:root {
    --primary:      #0E5430;
    --primary-rgb:  14, 84, 48;
    --primary-100:  #0c4a2a;
    --primary-200:  #0a4025;
    --primary-300:  #08351f;
    --primary--100: #166b3e;
    --primary--200: #1d8149;
    --primary--300: #249755;
    --primary-rgba-0:  rgba(14, 84, 48, 0);
    --primary-rgba-10: rgba(14, 84, 48, 0.1);
    --primary-rgba-20: rgba(14, 84, 48, 0.2);
    --primary-rgba-30: rgba(14, 84, 48, 0.3);
    --primary-rgba-40: rgba(14, 84, 48, 0.4);
    --primary-rgba-50: rgba(14, 84, 48, 0.5);
    --primary-rgba-60: rgba(14, 84, 48, 0.6);
    --primary-rgba-70: rgba(14, 84, 48, 0.7);
    --primary-rgba-80: rgba(14, 84, 48, 0.8);
    --primary-rgba-90: rgba(14, 84, 48, 0.9);

    --secondary:      #B98A2E;
    --secondary-rgb:  185, 138, 46;
    --secondary-100:  #a87d29;
    --secondary-200:  #977024;
    --secondary-300:  #86641f;
    --secondary--100: #c69a4a;
    --secondary--200: #d2ab66;
    --secondary--300: #debc82;
    --secondary-rgba-0:  rgba(185, 138, 46, 0);
    --secondary-rgba-10: rgba(185, 138, 46, 0.1);
    --secondary-rgba-20: rgba(185, 138, 46, 0.2);
    --secondary-rgba-30: rgba(185, 138, 46, 0.3);
    --secondary-rgba-40: rgba(185, 138, 46, 0.4);
    --secondary-rgba-50: rgba(185, 138, 46, 0.5);
    --secondary-rgba-60: rgba(185, 138, 46, 0.6);
    --secondary-rgba-70: rgba(185, 138, 46, 0.7);
    --secondary-rgba-80: rgba(185, 138, 46, 0.8);
    --secondary-rgba-90: rgba(185, 138, 46, 0.9);

    --tertiary:      #5C7A66;
    --tertiary-rgb:  92, 122, 102;
    --tertiary-100:  #536e5c;
    --tertiary-200:  #4a6252;
    --tertiary-300:  #425749;
    --tertiary--100: #6a8674;
    --tertiary--200: #789181;
    --tertiary--300: #869d8e;
    --tertiary-rgba-0:  rgba(92, 122, 102, 0);
    --tertiary-rgba-10: rgba(92, 122, 102, 0.1);
    --tertiary-rgba-20: rgba(92, 122, 102, 0.2);
    --tertiary-rgba-30: rgba(92, 122, 102, 0.3);
    --tertiary-rgba-40: rgba(92, 122, 102, 0.4);
    --tertiary-rgba-50: rgba(92, 122, 102, 0.5);
    --tertiary-rgba-60: rgba(92, 122, 102, 0.6);
    --tertiary-rgba-70: rgba(92, 122, 102, 0.7);
    --tertiary-rgba-80: rgba(92, 122, 102, 0.8);
    --tertiary-rgba-90: rgba(92, 122, 102, 0.9);

    --quaternary:      #E8F5EA;
    --quaternary-rgb:  232, 245, 234;
    --quaternary-100:  #dae9dc;
    --quaternary-200:  #cddecf;
    --quaternary-300:  #bfd3c2;
    --quaternary--100: #ffffff;
    --quaternary--200: #ffffff;
    --quaternary--300: #ffffff;
    --quaternary-rgba-0:  rgba(232, 245, 234, 0);
    --quaternary-rgba-10: rgba(232, 245, 234, 0.1);
    --quaternary-rgba-20: rgba(232, 245, 234, 0.2);
    --quaternary-rgba-30: rgba(232, 245, 234, 0.3);
    --quaternary-rgba-40: rgba(232, 245, 234, 0.4);
    --quaternary-rgba-50: rgba(232, 245, 234, 0.5);
    --quaternary-rgba-60: rgba(232, 245, 234, 0.6);
    --quaternary-rgba-70: rgba(232, 245, 234, 0.7);
    --quaternary-rgba-80: rgba(232, 245, 234, 0.8);
    --quaternary-rgba-90: rgba(232, 245, 234, 0.9);

    --dark:      #062817;
    --dark-rgb:  6, 40, 23;
    --dark-100:  #041e11;
    --dark-200:  #03150c;
    --dark-300:  #010b06;
    --dark--100: #0a3a22;
    --dark--200: #0e4c2d;
    --dark--300: #125e38;
    --dark-rgba-0:  rgba(6, 40, 23, 0);
    --dark-rgba-10: rgba(6, 40, 23, 0.1);
    --dark-rgba-20: rgba(6, 40, 23, 0.2);
    --dark-rgba-30: rgba(6, 40, 23, 0.3);
    --dark-rgba-40: rgba(6, 40, 23, 0.4);
    --dark-rgba-50: rgba(6, 40, 23, 0.5);
    --dark-rgba-60: rgba(6, 40, 23, 0.6);
    --dark-rgba-70: rgba(6, 40, 23, 0.7);
    --dark-rgba-80: rgba(6, 40, 23, 0.8);
    --dark-rgba-90: rgba(6, 40, 23, 0.9);

    --light:      #FFFFFF;
    --light-rgb:  255, 255, 255;
    --light-100:  #f2f2f2;
    --light-200:  #ececec;
    --light-300:  #e6e6e6;
    --light--100: #ffffff;
    --light--200: #ffffff;
    --light--300: #ffffff;
    --light-rgba-0:  rgba(255, 255, 255, 0);
    --light-rgba-10: rgba(255, 255, 255, 0.1);
    --light-rgba-20: rgba(255, 255, 255, 0.2);
    --light-rgba-30: rgba(255, 255, 255, 0.3);
    --light-rgba-40: rgba(255, 255, 255, 0.4);
    --light-rgba-50: rgba(255, 255, 255, 0.5);
    --light-rgba-60: rgba(255, 255, 255, 0.6);
    --light-rgba-70: rgba(255, 255, 255, 0.7);
    --light-rgba-80: rgba(255, 255, 255, 0.8);
    --light-rgba-90: rgba(255, 255, 255, 0.9);
}

/* Skin Colors — Inverse */
:root {
    --primary-inverse:    #FFFFFF;
    --secondary-inverse:  #062817;
    --tertiary-inverse:   #FFFFFF;
    --quaternary-inverse: #062817;
    --dark-inverse:       #FFFFFF;
    --light-inverse:      #062817;
}

/* Grey Colors */
:root {
    --grey:      #969696;
    --grey-100:  #f4f4f4;
    --grey-200:  #eaeaea;
    --grey-300:  #e5e5e5;
    --grey-400:  #e0e0e0;
    --grey-500:  #dbdbdb;
    --grey-600:  #cecece;
    --grey-700:  #c1c1c1;
    --grey-800:  #a8a8a8;
    --grey-900:  #8e8e8e;
    --grey-1000: #757575;
}

/* === Corp vocabulario propio (lo consumen .corp-* del demo compartido) === */
:root {
    --corp-navy:        #0E5430;   /* verde campo = color institucional dominante */
    --corp-navy-rgb:    14, 84, 48;
    --corp-navy-soft:   rgba(14, 84, 48, 0.92);
    --corp-graphite:    #062817;   /* verde muy oscuro */
    --corp-bone:        #E8F5EA;   /* verde muy claro = fondos de sección */
    --corp-paper:       #FFFFFF;
    --corp-gold:        #B98A2E;   /* trigo/cosecha = acento decorativo */
    --corp-gold-rgb:    185, 138, 46;
    --corp-gold-soft:   #E3D3A8;
    --corp-stone:       #D8EBDB;
    --corp-ink:         #062817;
    --corp-muted:       #5A6472;   /* gris con contraste AA sobre bone */
    --corp-accent-ink:  #0E5430;   /* acento para TEXTO sobre fondo claro (AA ~7:1) */
    --corp-rule:        rgba(14, 84, 48, 0.14);
    --corp-rule-light:  rgba(255, 255, 255, 0.16);

    /* Sombras tintadas con el verde de marca */
    --corp-shadow-sm:   0 6px 24px -12px rgba(6, 40, 23, 0.28);
    --corp-shadow-md:   0 12px 40px -16px rgba(6, 40, 23, 0.22);

    /* Radios y contenedor */
    --corp-radius:      2px;
    --corp-radius-pill: 1.25rem;
    --corp-container:   1320px;
    --corp-track-label: 0.14em;

    /* Escala tipográfica */
    --fs-eyebrow: 0.75rem;
    --fs-label:   0.8rem;
    --fs-sm:      0.9rem;
    --fs-body:    1rem;
    --fs-lead:    1.15rem;
    --fs-h3:      1.35rem;
    --fs-h2:      clamp(1.9rem, 3vw, 2.6rem);
    --fs-display: clamp(2.4rem, 5vw, 4.2rem);

    /* Ritmo vertical / gaps */
    --corp-gap:      clamp(4rem, 8vw, 7rem);
    --corp-grid-gap: 1.75rem;
}

/* === Fonts — Lexend (titulares) + Open Sans (texto) === */
:root {
    --font-family-primary:   'Lexend', system-ui, -apple-system, sans-serif;
    --font-family-secondary: 'Open Sans', system-ui, -apple-system, sans-serif;
    --font-family-tertiary:  'Lexend', system-ui, -apple-system, sans-serif;
    --font-primary:          var(--font-family-primary);
    --font-secondary:        var(--font-family-secondary);

    --bs-font-sans-serif:  'Open Sans', system-ui, -apple-system, sans-serif;
    --bs-body-font-family: 'Open Sans', system-ui, -apple-system, sans-serif;
    --bs-body-color:       #062817;
    --bs-body-bg:          #FFFFFF;
    --bs-link-color:       #0E5430;
    --bs-link-hover-color: #B98A2E;
}

/* === Helpers custom-color-* (convención Porto) === */
.custom-bg-color-1 { background-color: var(--corp-bone) !important; }
.custom-bg-color-2 { background-color: var(--corp-navy) !important; }
.custom-bg-color-3 { background-color: var(--corp-graphite) !important; }
.custom-bg-color-4 { background-color: var(--corp-stone) !important; }

.custom-text-color-1 { color: var(--corp-ink) !important; }
.custom-text-color-2 { color: var(--corp-accent-ink) !important; }
.custom-text-color-3 { color: var(--corp-muted) !important; }

/* === Buttons — verde campo con acento trigo en hover === */
.btn-primary {
    background-color: var(--corp-navy);
    border-color: var(--corp-navy);
    color: var(--corp-paper);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: var(--corp-graphite);
    border-color: var(--corp-gold);
    color: var(--corp-paper);
}
.btn-secondary {
    background-color: var(--corp-gold);
    border-color: var(--corp-gold);
    color: var(--corp-graphite);
}
.btn-secondary:hover {
    background-color: var(--corp-gold-soft);
    border-color: var(--corp-gold-soft);
    color: var(--corp-graphite);
}
.btn-outline-primary {
    color: var(--corp-navy);
    border-color: var(--corp-navy);
}
.btn-outline-primary:hover {
    background-color: var(--corp-navy);
    border-color: var(--corp-navy);
    color: var(--corp-paper);
}

/* === Headings — Lexend sobre páginas del demo === */
h1, h2, h3, h4, h5, h6,
.font-primary, .heading-primary {
    font-family: var(--font-family-primary);
    font-weight: 600;
    color: var(--corp-ink);
    letter-spacing: -0.015em;
}

/* === Body — Open Sans === */
body {
    font-family: var(--font-family-secondary);
    color: var(--corp-graphite);
    background: var(--corp-paper);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}