/* Undernet global dark theme
   Deep navy / charcoal system based on the approved Areas of Experience visual direction.
   Global theme primitives and shared components. Page-specific migration remains separate.
*/

:root {
    /* Backgrounds */
    --site-bg: #071018;
    --site-bg-alt: #09131b;
    --site-bg-soft: #0b161e;

    /* Surfaces */
    --surface-1: #0d1820;
    --surface-2: #101c25;
    --surface-3: #14222c;

    /* Text */
    --text-primary: #f4f4f4;
    --text-secondary: #bec7ce;
    --text-muted: #8f9ba3;

    /* Brand */
    --brand-orange: #ff7a00;
    --brand-orange-soft: #f7941d;
    --brand-orange-hover: #ff9b2f;

    /* Borders */
    --border-subtle: rgba(255,255,255,.10);
    --border-default: rgba(255,255,255,.14);
    --border-strong: rgba(255,255,255,.22);

    /* Focus */
    --focus-ring: #ff9b2f;

    /* Radius */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 18px;

    /* Shadows */
    --shadow-soft: 0 16px 36px rgba(0,0,0,.22);
    --shadow-strong: 0 22px 54px rgba(0,0,0,.30);
}

body {
    background: var(--site-bg);
    color: var(--text-primary);
}

main,
#contenido {
    background: var(--site-bg);
    color: var(--text-primary);
}

h1,
h2,
h3,
h4,
h5,
h6,
strong {
    color: var(--text-primary);
}

p,
li,
small {
    color: inherit;
}

a {
    color: var(--brand-orange);
}

a:hover,
a:focus-visible {
    color: var(--brand-orange-hover);
}

.eyebrow,
.kicker,
.overline {
    color: var(--brand-orange);
}

/* Shared site chrome */
.site-header {
    background: linear-gradient(
        90deg,
        #454b4f 0%,
        #394147 18%,
        #29343b 36%,
        #17232b 58%,
        #0b141b 80%,
        #071018 100%
    );
    border-bottom: 1px solid var(--border-default);
    box-shadow: 0 8px 26px rgba(0,0,0,.22);
}

.main-nav a {
    color: var(--text-primary);
    text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.main-nav a:hover,
.main-nav a[aria-current="page"] {
    color: var(--brand-orange-hover);
    border-bottom-color: var(--brand-orange);
}

.nav-toggle span {
    background: var(--text-primary);
}

.site-footer {
    background: linear-gradient(180deg, var(--site-bg-alt) 0%, var(--site-bg) 100%);
    color: var(--text-secondary);
    border-top: 1px solid var(--border-default);
}

.site-footer h2,
.site-footer strong {
    color: var(--text-primary);
}

.site-footer a {
    color: #dce2e6;
}

.site-footer a:hover,
.site-footer a:focus-visible {
    color: var(--brand-orange-hover);
}

.footer-bottom {
    border-top-color: var(--border-default);
    color: var(--text-muted);
}

/* Shared page hero */
.page-hero {
    background:
        radial-gradient(circle at 88% 12%, rgba(255,122,0,.10), transparent 30%),
        linear-gradient(112deg, #071018 0%, #09131b 48%, #0d1820 78%, #09131b 100%);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-default);
}

.page-hero h1,
.page-hero h2 {
    color: var(--text-primary);
}

.page-lead,
.section-copy,
.prose-large,
.section-heading > p:last-child {
    color: var(--text-secondary);
}

/* Shared section surfaces */
.section-theme-base {
    background: var(--site-bg);
}

.section-theme-alt {
    background: var(--site-bg-alt);
}

.section-theme-soft {
    background: var(--site-bg-soft);
}

.section-soft {
    background: var(--site-bg-soft);
    color: var(--text-primary);
}

/* Shared cards/panels */
.theme-card,
.theme-panel,
.service-card,
.topic-grid article,
.process-grid article {
    background: var(--surface-1);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-md);
    box-shadow: none;
}

.theme-card:hover,
.theme-card:focus-within,
.service-card:hover,
.topic-grid article:hover,
.process-grid article:hover {
    background: var(--surface-2);
    border-color: rgba(255,122,0,.70);
}

.theme-muted {
    color: var(--text-secondary);
}

.theme-subtle {
    color: var(--text-muted);
}

/* Shared buttons */
.button-primary,
.theme-button-primary {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: #111;
}

.button-primary:hover,
.button-primary:focus-visible,
.theme-button-primary:hover,
.theme-button-primary:focus-visible {
    background: var(--brand-orange-hover);
    border-color: var(--brand-orange-hover);
    color: #111;
}

.button-secondary,
.theme-button-secondary {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-primary);
}

.button-secondary:hover,
.button-secondary:focus-visible,
.theme-button-secondary:hover,
.theme-button-secondary:focus-visible {
    background: var(--surface-1);
    border-color: var(--brand-orange);
    color: var(--text-primary);
}

/* Shared pills/tags */
.theme-pill,
.service-visual-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 7px 11px;
    border: 1px solid rgba(255,122,0,.38);
    border-radius: 999px;
    background: var(--surface-1);
    color: var(--text-primary);
    text-decoration: none;
}

.theme-pill:hover,
.theme-pill:focus-visible {
    background: var(--surface-2);
    border-color: var(--brand-orange);
    color: var(--text-primary);
}

/* Shared CTA treatment */
.cta-section {
    background: var(--site-bg-soft);
}

.cta-box {
    background: linear-gradient(135deg, #ff941f 0%, #ef7d00 100%);
    color: #17120d;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: var(--shadow-soft);
}

.cta-box h2,
.cta-box .eyebrow,
.cta-box p {
    color: #17120d;
}

/* Forms */
.theme-form-panel,
.contact-form,
.form-panel {
    background: var(--surface-1);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    color: var(--text-primary);
}

.theme-input,
.theme-select,
.theme-textarea,
.contact-form input,
.contact-form select,
.contact-form textarea,
.form-panel input,
.form-panel select,
.form-panel textarea {
    background: var(--surface-2);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
}

.theme-input::placeholder,
.theme-textarea::placeholder,
.contact-form input::placeholder,
.contact-form textarea::placeholder,
.form-panel input::placeholder,
.form-panel textarea::placeholder {
    color: var(--text-muted);
}

.theme-input:focus,
.theme-select:focus,
.theme-textarea:focus,
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus,
.form-panel input:focus,
.form-panel select:focus,
.form-panel textarea:focus {
    border-color: var(--brand-orange);
    outline: none;
}

/* Global focus */
:focus-visible {
    outline: 3px solid var(--focus-ring);
    outline-offset: 3px;
}

::selection {
    background: var(--brand-orange);
    color: #111;
}

/* Print behavior is intentionally not defined here.
   A dedicated @media print layer will be specified separately. */

@media (max-width: 1020px) {
    .main-nav {
        background: var(--surface-1);
        border-bottom-color: var(--border-default);
        box-shadow: 0 12px 28px rgba(0,0,0,.30);
    }
}

@media (prefers-reduced-motion: reduce) {
    * {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}