:root {
    --mungo-color-bg: #ffffff;
    --mungo-color-surface: #f8fafc;
    --mungo-color-text: #111827;
    --mungo-color-muted: #4b5563;
    --mungo-color-border: #e5e7eb;
    --mungo-color-primary: #166534;
    --mungo-color-primary-contrast: #ffffff;
    --mungo-color-link: #14532d;
    --mungo-radius-sm: 0.5rem;
    --mungo-radius-md: 0.85rem;
    --mungo-radius-lg: 1.25rem;
    --mungo-shadow-soft: 0 10px 30px rgba(15, 23, 42, 0.08);
    --mungo-container: 1180px;
    --mungo-container-wide: 1320px;
    --mungo-gap: clamp(1rem, 2vw, 2rem);
    --mungo-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mungo-font-heading: var(--mungo-font-body);
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    background: var(--mungo-color-bg);
    color: var(--mungo-color-text);
    font-family: var(--mungo-font-body);
    font-size: clamp(1rem, 0.96rem + 0.2vw, 1.08rem);
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a {
    color: var(--mungo-color-link);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
}

a:hover, a:focus { color: var(--mungo-color-primary); }

img, svg, video, canvas {
    display: block;
    max-width: 100%;
    height: auto;
}

iframe { max-width: 100%; }

figure { margin: 0 0 1.5rem; }

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 0.75em;
    color: var(--mungo-color-text);
    font-family: var(--mungo-font-heading);
    line-height: 1.12;
    letter-spacing: -0.025em;
}

h1 { font-size: clamp(2.1rem, 4.2vw, 4rem); }
h2 { font-size: clamp(1.7rem, 3vw, 2.7rem); }
h3 { font-size: clamp(1.35rem, 2vw, 1.9rem); }
h4 { font-size: 1.2rem; }

p { margin: 0 0 1.2rem; }

ul, ol { margin-top: 0; }

input, button, textarea, select {
    font: inherit;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--mungo-color-border);
    border-radius: var(--mungo-radius-sm);
    padding: 0.65rem 0.85rem;
    background: #fff;
    color: var(--mungo-color-text);
}

input:focus, textarea:focus, select:focus {
    outline: 3px solid color-mix(in srgb, var(--mungo-color-primary) 20%, transparent);
    border-color: var(--mungo-color-primary);
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.mungo-button,
.wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border: 0;
    border-radius: 999px;
    padding: 0.68rem 1.15rem;
    background: var(--mungo-color-primary);
    color: var(--mungo-color-primary-contrast);
    font-weight: 700;
    line-height: 1.1;
    text-decoration: none;
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.mungo-button:hover,
.wp-block-button__link:hover {
    color: var(--mungo-color-primary-contrast);
    transform: translateY(-1px);
    box-shadow: var(--mungo-shadow-soft);
}

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    clip: auto !important;
    clip-path: none;
    display: block;
    height: auto;
    left: 1rem;
    top: 1rem;
    width: auto;
    z-index: 100000;
    padding: 0.75rem 1rem;
    background: #fff;
    color: #111;
    border-radius: 0.5rem;
    box-shadow: var(--mungo-shadow-soft);
}

.mungo-container {
    width: min(100% - 2rem, var(--mungo-container));
    margin-inline: auto;
}

.mungo-container-wide {
    width: min(100% - 2rem, var(--mungo-container-wide));
    margin-inline: auto;
}

.mungo-card-like {
    background: #fff;
    border: 1px solid var(--mungo-color-border);
    border-radius: var(--mungo-radius-lg);
    box-shadow: var(--mungo-shadow-soft);
    padding: clamp(1.25rem, 3vw, 2rem);
}
