/* =============================================================================
   uikit-replace.css
   Replaces uikit-custom.min.css (111 KB → ~6 KB).
   Only the uk-* classes actually used in templates + content pages.
   Class names kept identical — no template changes required.
   custom.css loads after this and overrides where needed.

   Structure (matches UIkit cascade order):
   1. Reset + Base
   2. Container + Grid (layout)
   3. Components (navbar, tile, divider, heading-line, dropcap, label, button, search)
   4. Utilities (margin, padding, width, text, visibility, display, align, border)
   ============================================================================= */

/* === 1. Reset + Base ======================================================== */

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

html {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, "Noto Sans", sans-serif,
                 "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    background: #fff;
    color: #666;
}

body { margin: 0; }

/* --- Inline elements ------------------------------------------------------- */

a { color: #1e87f0; text-decoration: none; }
a:hover { color: #0f6ecd; text-decoration: underline; }

b, strong { font-weight: bolder; }
small     { font-size: 80%; }

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup { top: -0.5em; }
sub { bottom: -0.25em; }

mark { background: #ffd; color: #666; }
abbr[title] { text-decoration: underline dotted; }
address     { font-style: normal; }

/* --- Media ----------------------------------------------------------------- */

audio, canvas, iframe, img, svg, video { vertical-align: middle; }

canvas, img, svg, video {
    max-width: 100%;
    box-sizing: border-box;
    height: auto;
}

img:not([src]) { visibility: hidden; min-width: 1px; }
iframe { border: 0; }

/* --- Block spacing --------------------------------------------------------- */

address, dl, fieldset, figure, ol, p, pre, ul {
    margin: 0 0 20px 0;
}

* + address, * + dl, * + fieldset, * + figure,
* + ol, * + p, * + pre, * + ul {
    margin-top: 20px;
}

ol, ul { padding-left: 30px; }
ol > li > ol, ol > li > ul, ul > li > ol, ul > li > ul { margin: 0; }

dt { font-weight: 700; }
dd { margin-left: 0; }

/* --- Headings -------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6,
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6 {
    margin: 0 0 20px 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    font-weight: 300;
    color: #333;
    text-transform: none;
}

h1, .uk-h1 { font-size: 2.23125rem; line-height: 1.2; }
h2, .uk-h2 { font-size: 1.7rem;     line-height: 1.3; }
h3, .uk-h3 { font-size: 1.5rem;     line-height: 1.4; }
h4, .uk-h4 { font-size: 1.25rem;    line-height: 1.4; }
h5, .uk-h5 { font-size: 16px;       line-height: 1.4; }
h6, .uk-h6 { font-size: 0.875rem;   line-height: 1.4; }

* + h1, * + h2, * + h3, * + h4, * + h5, * + h6,
* + .uk-h1, * + .uk-h2, * + .uk-h3, * + .uk-h4, * + .uk-h5, * + .uk-h6 {
    margin-top: 40px;
}

/* --- Blockquote ------------------------------------------------------------ */

blockquote {
    margin: 0 0 20px 0;
    font-size: 1.25rem;
    line-height: 1.5;
    font-style: italic;
}
* + blockquote { margin-top: 20px; }
blockquote p:last-of-type { margin-bottom: 0; }
blockquote footer { margin-top: 10px; font-size: 0.875rem; line-height: 1.5; }

/* --- Pre / code ------------------------------------------------------------ */

pre {
    font: 0.875rem/1.5 Consolas, monaco, monospace;
    color: #666;
    -moz-tab-size: 4;
    tab-size: 4;
    overflow: auto;
}
pre code { font-family: Consolas, monaco, monospace; }

/* --- Misc block elements --------------------------------------------------- */

details, main { display: block; }
summary       { display: list-item; }
template      { display: none; }

/* --- HR -------------------------------------------------------------------- */

hr, .uk-hr {
    border: 0;
    border-top: 1px solid lightgray;
    margin: 0 0 20px 0;
    overflow: visible;
}
* + .uk-hr, * + hr { margin-top: 20px; }


/* === 2. Container + Grid ==================================================== */

.uk-container {
    display: flow-root;
    box-sizing: content-box;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 5px;   /* custom.css overrides at each breakpoint */
    padding-right: 15px;
}

.uk-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
}

.uk-grid > * { min-width: 0; }

.uk-grid-small { gap: 15px; }


/* === 3. Components ========================================================== */

/* --- Tile ------------------------------------------------------------------ */

.uk-tile         { display: block; padding: 30px; }
.uk-tile-muted   { background: #f8f8f8; }

/* --- Position & overlay ---------------------------------------------------- */

.uk-overlay {
    padding: 30px;
}

.uk-position-center {
    position: absolute !important;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: max-content;
    max-width: 100%;
    box-sizing: border-box;
}

.uk-position-left {
    position: absolute !important;
    top: 0; bottom: 0; left: 0;
}

/* --- Heading line ---------------------------------------------------------- */

.uk-heading-line { overflow: hidden; }

.uk-heading-line > * {
    display: inline-block;
    position: relative;
}

.uk-heading-line > *::before,
.uk-heading-line > *::after {
    content: '';
    position: absolute;
    top: calc(50% - (calc(.2px + .05em) / 2));
    width: 2000px;
    border-bottom: calc(.2px + .05em) solid #e5e5e5;
}

.uk-heading-line > *::before { right: 100%; margin-right: calc(5px + .3em); }
.uk-heading-line > *::after  { left: 100%;  margin-left: calc(5px + .3em); }

/* --- Dropcap --------------------------------------------------------------- */

/* font-family already set in custom.css; this adds the float geometry */
.uk-dropcap::first-letter,
.uk-dropcap > p:first-of-type::first-letter {
    display: block;
    float: left;
    font-size: 4.5em;
    line-height: 0.85;
    margin-right: 0.1em;
    margin-top: 0.05em;
}

/* --- Dividers -------------------------------------------------------------- */

/* border-color for both dividers is set to lightgray in custom.css */

.uk-divider-small {
    border: 0;
    margin-bottom: 0;
}

.uk-divider-small::after {
    content: '';
    display: block;
    border-top: 1px solid;
    width: 100px;
}

.uk-divider-icon {
    position: relative;
    height: 0;
    border-top: 1px solid;
    text-align: center;
    margin: 2em 0;
}

.uk-divider-icon::before,
.uk-divider-icon::after {
    content: '';
    position: absolute;
    top: -1px;
    border-top: 1px solid;
    width: calc(50% - 40px);
}

.uk-divider-icon::before { left: 0; }
.uk-divider-icon::after  { right: 0; }

/* --- Navigation ------------------------------------------------------------ */

/* Structure — colors/fonts overridden in custom.css */

.uk-navbar-container       { position: relative; }
.uk-navbar-transparent     { background: transparent; box-shadow: none; }
.uk-navbar-left,
.uk-navbar-right,
[class*=uk-navbar-center]  { display: flex; gap: 0; align-items: stretch; }
.uk-navbar-left,
.uk-navbar-right           { flex-wrap: wrap; }

.uk-subnav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: -20px;     /* custom.css overrides to 0 */
    padding: 0;
    list-style: none;
}

.uk-subnav > * {
    flex: none;
    padding-left: 20px;    /* custom.css overrides to 0 */
    position: relative;
}

.uk-subnav > * > :first-child {
    display: flex;
    align-items: center;
    column-gap: .25em;
    color: #999;
    font-size: .875rem;
    text-transform: uppercase;
    transition: .1s ease-in-out;
    transition-property: color, background-color;
}

.uk-subnav > * > a:hover { color: #666; text-decoration: none; }
.uk-subnav > .uk-active > a { color: #333; }

.uk-subnav-pill { margin-left: -20px; }
.uk-subnav-pill > * { padding-left: 20px; }

.uk-subnav-pill > * > :first-child {
    padding: 5px 10px;
    background: transparent;
    color: #999;
}

.uk-subnav-pill > * > a:hover,
.uk-subnav-pill > * > a:active {
    background-color: #f8f8f8;
    color: #666;
}

.uk-subnav-pill > .uk-active > a {
    background-color: #1e87f0;
    color: #fff;
}

/* --- Label ----------------------------------------------------------------- */

/* Fully defined in custom.css; just add base display */
.uk-label {
    display: inline-block;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 2px;
}

/* --- Button ---------------------------------------------------------------- */

/* Fully defined in custom.css; just add base structure */
.uk-button {
    display: inline-block;
    border: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
}

.uk-button-large { padding: 0 40px; line-height: 55px; font-size: 1.25rem; }

/* --- Search ---------------------------------------------------------------- */

/* uk-search-input, uk-search-default focus — defined in custom.css */
.uk-search         { display: inline-block; position: relative; }
.uk-search-default { width: 100%; }

.uk-search-input {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
    border: none;
    overflow: visible;
    font: inherit;
    color: inherit;
}

.uk-search-default .uk-search-input {
    display: block;
    width: 100%;
    height: 40px;
    padding: 0 5px 0 40px;
    font-size: 16px;
}

.uk-search-icon {
    position: absolute;
    top: 0; left: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
}


/* === 4. Utilities (MUST come last to override components) =================== */

/* --- Width ----------------------------------------------------------------- */

.uk-width-1-1 { width: 100%; }
.uk-width-1-2 { width: 50%; }
.uk-width-1-3 { width: 33.333%; }
.uk-width-2-3 { width: 66.667%; }
.uk-width-2-5 { width: 40%; }

@media (min-width: 640px) {
    .uk-width-1-1\@s { width: 100%; }
    .uk-width-1-2\@s { width: 50%; }
    .uk-width-1-3\@s { width: 33.333%; }
    .uk-width-2-3\@s { width: 66.667%; }
    .uk-width-2-5\@s { width: 40%; }
}

@media (min-width: 768px) {
    .uk-width-1-1\@m { width: 100%; }
    .uk-width-1-2\@m { width: 50%; }
    .uk-width-1-3\@m { width: 33.333%; }
    .uk-width-2-3\@m { width: 66.667%; }
    .uk-width-2-5\@m { width: 40%; }
}

@media (min-width: 960px) {
    .uk-width-1-1\@l { width: 100%; }
    .uk-width-1-2\@l { width: 50%; }
    .uk-width-1-3\@l { width: 33.333%; }
    .uk-width-2-3\@l { width: 66.667%; }
    .uk-width-2-5\@l { width: 40%; }
}

/* --- Margin ---------------------------------------------------------------- */

.uk-margin            { margin: 30px 0; }
.uk-margin-top        { margin-top: 30px; }

.uk-margin-small-top    { margin-top: 15px; }
.uk-margin-small-bottom { margin-bottom: 15px; }
.uk-margin-small-left   { margin-left: 15px; }
.uk-margin-small-right  { margin-right: 15px; }

.uk-margin-medium        { margin: 40px 0; }
.uk-margin-medium-top    { margin-top: 40px; }
.uk-margin-medium-bottom { margin-bottom: 40px; }

.uk-margin-large        { margin: 40px 0; }
.uk-margin-large-top    { margin-top: 40px; }
.uk-margin-large-bottom { margin-bottom: 40px; }

.uk-margin-xlarge-top    { margin-top: 70px; }
.uk-margin-xlarge-bottom { margin-bottom: 70px; }

@media (min-width: 960px) {
    .uk-margin-large        { margin: 70px 0; }
    .uk-margin-large-top    { margin-top: 70px; }
    .uk-margin-large-bottom { margin-bottom: 70px; }
    .uk-margin-xlarge-top    { margin-top: 140px; }
    .uk-margin-xlarge-bottom { margin-bottom: 140px; }
}

.uk-margin-remove        { margin: 0 !important; }
.uk-margin-remove-top    { margin-top: 0 !important; }
.uk-margin-remove-bottom { margin-bottom: 0 !important; }
.uk-margin-remove-left   { margin-left: 0 !important; }
.uk-margin-remove-right  { margin-right: 0 !important; }

/* --- Padding --------------------------------------------------------------- */

.uk-padding-small         { padding: 15px; }
.uk-padding-remove        { padding: 0 !important; }
.uk-padding-remove-top    { padding-top: 0 !important; }
.uk-padding-remove-bottom { padding-bottom: 0 !important; }

/* --- Display --------------------------------------------------------------- */

.uk-inline       { display: inline-block; position: relative; max-width: 100%; vertical-align: middle; }
.uk-inline-block { display: inline-block; }

/* --- Float align ----------------------------------------------------------- */

.uk-align-right { float: right; margin-left: 30px; }
.uk-align-left  { float: left;  margin-right: 30px; }

@media (min-width: 640px) {
    .uk-align-right\@s { float: right; margin-left: 25px; }
    .uk-align-left\@s  { float: left;  margin-right: 25px; }
}

@media (min-width: 768px) {
    .uk-align-right\@m { float: right; margin-left: 30px; }
    .uk-align-left\@m  { float: left;  margin-right: 30px; }
}

@media (min-width: 960px) {
    .uk-align-right\@l { float: right; margin-left: 30px; }
    .uk-align-left\@l  { float: left;  margin-right: 30px; }
}

/* --- Visibility ------------------------------------------------------------ */

.uk-hidden { display: none !important; }

/* uk-visible@s/m: hidden below breakpoint, no display override above */
@media (max-width: 639.98px) { .uk-visible\@s { display: none !important; } }
@media (max-width: 767.98px) { .uk-visible\@m { display: none !important; } }

@media (min-width: 768px) { .uk-hidden\@m  { display: none !important; } }
@media (min-width: 960px) { .uk-hidden\@l  { display: none !important; } }

/* --- Text ------------------------------------------------------------------ */

.uk-text-small  { font-size: 0.875rem; line-height: 1.5; }
.uk-text-muted  { color: #999; }
.uk-text-italic { font-style: italic; }
.uk-text-left   { text-align: left !important; }
.uk-text-right  { text-align: right !important; }
.uk-text-center { text-align: center !important; }

/* --- Border ---------------------------------------------------------------- */

.uk-border-pill { border-radius: 500px; }
