/*
============================================================
MAKARN AI
Natural Green and Yellow Brand Theme
Version: 0.6
============================================================
*/

:root {
    --color-background: #f4f9ee;
    --color-background-soft: #d5ebbd;
    --color-surface: #ffffff;
    --color-surface-raised: #f9fcf5;
    --color-surface-light: #f7faef;
    --color-white: #ffffff;

    --color-text: #18372a;
    --color-text-soft: #526b5d;
    --color-text-dark: #173528;
    --color-text-dark-soft: #536a5d;

    --color-border: rgba(45, 91, 61, 0.16);
    --color-border-dark: rgba(45, 91, 61, 0.18);

    --color-accent: #dcae1f;
    --color-accent-light: #f3d449;
    --color-accent-dark: #896c09;
    --color-success: #3f965d;
    --color-error: #b93f37;

    --shadow-large:
        0 30px 80px rgba(49, 84, 58, 0.16);

    --shadow-card:
        0 18px 45px rgba(49, 84, 58, 0.11);
}


/* Base */

body {
    color: var(--color-text);
    background: var(--color-background);
}

::selection {
    color: #173528;
    background: #f3d449;
}

.eyebrow {
    color: #6d811d;
}


/* Header */

.site-header {
    background: rgba(247, 251, 241, 0.93);
    border-bottom-color: rgba(47, 91, 62, 0.15);
}

.brand-name {
    color: #1f5136;
}

.main-navigation a {
    color: #456052;
}

.main-navigation a:hover,
.main-navigation a:focus-visible {
    color: #173f2b;
}

.main-navigation a::after {
    background: #d8b42f;
}

.language-control select {
    color: #214732;
    background-color: #ffffff;
    border-color: rgba(42, 92, 59, 0.2);
}

.language-control select:focus-visible {
    border-color: #829b2c;
    box-shadow: 0 0 0 3px rgba(226, 190, 63, 0.22);
}

.menu-button {
    border-color: rgba(42, 92, 59, 0.2);
}

.menu-button span {
    background: #214732;
}


/* Hero */

.hero-section {
    color: #173528;
}

.hero-background {
    background:
        radial-gradient(
            circle at 11% 21%,
            rgba(159, 203, 126, 0.42),
            transparent 34%
        ),
        radial-gradient(
            circle at 88% 17%,
            rgba(246, 223, 121, 0.55),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #f7faef 0%,
            #d6edbd 53%,
            #fff1a8 100%
        );
}

.hero-background::before {
    opacity: 0.26;
    background-image:
        linear-gradient(
            rgba(54, 105, 69, 0.1) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(54, 105, 69, 0.1) 1px,
            transparent 1px
        );
}

.hero-summary {
    color: #50685a;
}

.button-primary {
    color: #18372a;
    background: #edc832;
    border-color: #e1c344;
    box-shadow: 0 9px 24px rgba(164, 132, 20, 0.18);
}

.button-primary:hover {
    color: #153a27;
    background: #f8e68f;
    border-color: #d4b32f;
}

.button-secondary {
    color: #224b34;
    background: rgba(255, 255, 255, 0.62);
    border-color: rgba(43, 91, 59, 0.2);
}

.button-secondary:hover {
    color: #153a27;
    background: #ffffff;
    border-color: rgba(43, 91, 59, 0.34);
}

.hero-metrics {
    border-top-color: rgba(43, 91, 59, 0.16);
}

.hero-metrics dt {
    color: #567062;
}

.hero-metrics dd {
    color: #1d4b32;
}


/* AI console */

.ai-console {
    color: #18372a;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.98),
            rgba(242, 248, 233, 0.98)
        );
    border-color: rgba(43, 91, 59, 0.18);
    box-shadow:
        0 30px 80px rgba(57, 94, 62, 0.18),
        0 0 0 1px rgba(255, 255, 255, 0.76) inset;
}

.ai-console-header {
    border-bottom-color: rgba(43, 91, 59, 0.13);
}

.ai-identity h2 {
    color: #193e2a;
}

.ai-status {
    color: #5d7467;
}

.status-dot {
    background: #4da76b;
    box-shadow: 0 0 0 5px rgba(77, 167, 107, 0.13);
}

.conversation {
    background:
        linear-gradient(
            180deg,
            rgba(229, 242, 215, 0.64),
            rgba(255, 250, 220, 0.46)
        );
    scrollbar-color: rgba(54, 99, 68, 0.32) transparent;
}

.message-ai {
    color: #1d392b;
    background: rgba(255, 255, 255, 0.84);
    border-color: rgba(43, 91, 59, 0.14);
}

.message-user {
    color: #173528;
    background: #f3dc72;
}

.message-error {
    color: #812f2a;
    background: rgba(185, 63, 55, 0.09);
    border-color: rgba(185, 63, 55, 0.22);
}

.message-author {
    color: #527326;
}

.message-user .message-author {
    color: rgba(24, 55, 42, 0.7);
}

.question-chip {
    color: #496457;
    background: rgba(255, 255, 255, 0.62);
    border-color: rgba(43, 91, 59, 0.17);
}

.question-chip:hover,
.question-chip:focus-visible {
    color: #173f2b;
    background: #ffffff;
    border-color: rgba(43, 91, 59, 0.31);
}

.question-form input {
    color: #173528;
    background: #ffffff;
    border-color: rgba(43, 91, 59, 0.2);
}

.question-form input::placeholder {
    color: #71847a;
}

.question-form input:focus {
    border-color: #80982c;
    box-shadow: 0 0 0 3px rgba(226, 190, 63, 0.2);
}

.send-button {
    color: #173528;
    background: #edc832;
    border: 1px solid #dec03f;
}

.send-button:hover {
    background: #f8e892;
}

.ai-notice {
    color: #687d71;
}


/* Company */

.company-section {
    color: #173528;
    background: #ffffff;
}

.company-section .eyebrow {
    color: #718525;
}

.section-heading > p:not(.eyebrow),
.section-copy > p {
    color: #536a5d;
}

.leadership-list {
    border-top-color: rgba(43, 91, 59, 0.16);
}

.leadership-list span {
    color: #64796d;
}

.leadership-list strong {
    color: #1b442e;
}


/* Production */

.production-section {
    color: #173528;
    background:
        linear-gradient(
            150deg,
            #c9e5ac 0%,
            #e1f1d0 56%,
            #ffe993 100%
        );
}

.production-section .section-heading > p:not(.eyebrow) {
    color: #536b5e;
}

.capability-card {
    background: rgba(255, 255, 255, 0.78);
    border-color: rgba(43, 91, 59, 0.15);
    box-shadow: 0 15px 38px rgba(49, 84, 58, 0.09);
}

.capability-card:hover {
    background: #ffffff;
    border-color: rgba(128, 152, 44, 0.38);
}

.card-number {
    color: #7b8f2d;
}

.capability-card h3 {
    color: #183d2a;
}

.capability-card p {
    color: #536b5e;
}

.capability-card strong {
    color: #6f7917;
}


/* Divisions */

.divisions-section {
    color: #173528;
    background: #fbfcf7;
}

.divisions-section .eyebrow {
    color: #718525;
}

.division-card {
    background: #ffffff;
    border-color: rgba(43, 91, 59, 0.14);
}

.division-card:nth-child(1) {
    border-top: 5px solid #8fbd67;
}

.division-card:nth-child(2) {
    border-top: 5px solid #e7c84f;
}

.division-card:nth-child(3) {
    border-top: 5px solid #62976e;
}

.division-code {
    color: #72851f;
}

.division-card h3 {
    color: #193f2b;
}

.division-card p:not(.division-code) {
    color: #566d60;
}

.division-card span {
    color: #294e38;
    border-top-color: rgba(43, 91, 59, 0.14);
}


/* Markets */

.market-section {
    color: #173528;
    background:
        radial-gradient(
            circle at 90% 18%,
            rgba(246, 223, 121, 0.6),
            transparent 32%
        ),
        linear-gradient(
            140deg,
            #edf6e4,
            #c9e5ac
        );
}

.market-section .section-heading > p:not(.eyebrow) {
    color: #536b5e;
}

.market-panel {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(43, 91, 59, 0.16);
    box-shadow: var(--shadow-large);
}

.market-item + .market-item {
    border-top-color: rgba(43, 91, 59, 0.14);
}

.market-item span {
    color: #607568;
}

.market-item strong {
    color: #1b472f;
}

.market-item small {
    color: #7b7c12;
}


/* Industrial AI */

.industrial-ai-section {
    color: #173528;
    background: #ffffff;
}

.ai-platform-mark {
    background:
        radial-gradient(
            circle,
            rgba(246, 223, 121, 0.52),
            transparent 58%
        ),
        linear-gradient(
            145deg,
            #d9ecc7,
            #f5f9ed
        );
    border: 1px solid rgba(43, 91, 59, 0.12);
}

.industrial-ai-section .eyebrow {
    color: #718525;
}

.industrial-ai-section .section-heading > p:not(.eyebrow) {
    color: #536b5e;
}

.feature-list li {
    color: #294e38;
    border-bottom-color: rgba(43, 91, 59, 0.14);
}

.feature-list li::before {
    background: #e0be3e;
    box-shadow: 0 0 0 5px rgba(224, 190, 62, 0.14);
}


/* Contact */

.contact-section {
    color: #173528;
    background:
        linear-gradient(
            145deg,
            #c9e5ac,
            #f4f8e9 55%,
            #ffe78c
        );
}

.contact-section .section-heading > p:not(.eyebrow) {
    color: #536b5e;
}

.contact-card {
    background: rgba(255, 255, 255, 0.88);
    border-color: rgba(43, 91, 59, 0.16);
    box-shadow: var(--shadow-card);
}

.contact-card div + div {
    border-top-color: rgba(43, 91, 59, 0.13);
}

.contact-card span {
    color: #607568;
}

.contact-card a {
    color: #1a432d;
}

.contact-card a:hover,
.contact-card a:focus-visible {
    color: #7a6c09;
}


/* Footer */

.site-footer {
    color: #cbd9cf;
    background: #173b29;
    border-top-color: rgba(255, 255, 255, 0.1);
}

.footer-layout strong {
    color: #fff4b8;
}


/* Mobile navigation */

@media (max-width: 860px) {
    .main-navigation {
        background: rgba(247, 251, 241, 0.99);
        border-bottom-color: rgba(43, 91, 59, 0.15);
        box-shadow: 0 20px 38px rgba(49, 84, 58, 0.14);
    }

    .main-navigation a {
        color: #294e38;
        border-bottom-color: rgba(43, 91, 59, 0.13);
    }
}


@media (max-width: 640px) {
    .hero-metrics div {
        border-bottom-color: rgba(43, 91, 59, 0.15);
    }
}