/*
Theme Name: XR Youth
Author: Luova Club
Description: XR-inspired theme for Elokapina nuoret.
Version: 1.0.8
*/

@font-face { font-family: 'FUCXED CAPS'; src: url('assets/fonts/FUCXEDCAPSLatin-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Crimson Text'; src: url('assets/fonts/CrimsonText-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; }
:root {
  --xr-white: #ffffff; --xr-black: #000000; --xr-green: #14aa37; --xr-lemon: #f7ee6a; --xr-light-blue: #75d0f1; --xr-pink: #ed9bc4; --xr-purple: #986297; --xr-light-green: #bed276; --xr-warm-yellow: #ffc11e; --xr-bright-pink: #cf6297; --xr-red: #dc4f00; --xr-dark-blue: #3860aa; --xr-angry: #c80082; --xr-lime: #caff11; --xr-hot-pink: #ff1493; --xr-deep-teal: #195555; --xr-indigo: #36328c; --xr-fresh-green: #8edb74; --xr-lavender-blue: #7571cd; --xr-teal: #34717e; --xr-sky-teal: #68bac8;
  --title-font: 'FUCXED CAPS', Impact, 'Arial Black', sans-serif; --body-font: 'Crimson Text', Georgia, serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--xr-black); background: var(--xr-white); font-family: var(--body-font); font-size: 20px; line-height: 1.55; }
a { color: inherit; text-decoration-thickness: .12em; text-underline-offset: .18em; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem clamp(1rem, 4vw, 3rem); background: var(--xr-black); color: var(--xr-white); border-bottom: 10px solid var(--xr-warm-yellow); position: sticky; top: 0; z-index: 10; }
.site-title, h1, h2, h3, .button, .nav a, .swatch-name, .eyebrow { font-family: var(--title-font); font-weight: 400; letter-spacing: 0; text-transform: uppercase; line-height: .95; }
.site-title { font-size: clamp(1.7rem, 5vw, 3.6rem); text-decoration: none; }
.nav { display: flex; gap: .55rem; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.nav ul { display: flex; gap: .55rem; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.nav a { display: inline-block; padding: .38rem .5rem .28rem; border: 3px solid currentColor; text-decoration: none; font-size: 1rem; }
.nav a:hover, .current-menu-item > a { background: var(--xr-warm-yellow); color: var(--xr-black); }
.hero { min-height: 72vh; display: grid; align-items: end; padding: clamp(2rem, 7vw, 6rem) clamp(1rem, 5vw, 5rem); background: linear-gradient(135deg, rgba(255,193,30,.92), rgba(190,210,118,.86)), repeating-linear-gradient(-12deg, rgba(0,0,0,.22) 0 12px, transparent 12px 38px); border-bottom: 14px solid var(--xr-black); }
.page-default-hero { min-height: 46vh; }
.hero-inner { max-width: 1040px; }
.hero h1 { max-width: min(100%, 12ch); margin: 0 0 1rem; font-size: clamp(3.2rem, 11vw, 9rem); overflow-wrap: anywhere; }
.hero p { max-width: 780px; margin: 0; font-size: clamp(1.35rem, 3vw, 2rem); font-weight: 700; }
.band { padding: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 5vw, 5rem); }
.band.black { background: var(--xr-black); color: var(--xr-white); }
.band.pink { background: var(--xr-pink); }
.band.blue { background: var(--xr-light-blue); }
.band.green { background: var(--xr-light-green); }
.band.yellow { background: var(--xr-lemon); }
.band.red { background: var(--xr-red); color: var(--xr-white); }
.content { max-width: 1040px; margin: 0 auto; }
.band h2, .page-title { margin: 0 0 1.25rem; font-size: clamp(2.7rem, 9vw, 7rem); }
p, li { max-width: 820px; }
.lead { font-size: clamp(1.2rem, 2.4vw, 1.7rem); font-weight: 700; }
.button { display: inline-block; padding: .7rem 1rem .55rem; border: 4px solid var(--xr-black); background: var(--xr-red); color: var(--xr-white); box-shadow: 6px 6px 0 var(--xr-black); text-decoration: none; }
.button.alt { background: var(--xr-warm-yellow); color: var(--xr-black); }
.link-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; margin-top: 2rem; }
.link-card, .info-card { display: block; background: var(--xr-white); color: var(--xr-black); border: 5px solid var(--xr-black); padding: 1rem; box-shadow: 7px 7px 0 var(--xr-black); text-decoration: none; }
.link-card h3, .info-card h3 { margin: 0 0 .75rem; font-size: 2rem; }
.page-hero { padding: clamp(3rem, 8vw, 6rem) clamp(1rem, 5vw, 5rem); background: var(--xr-black); color: var(--xr-white); border-bottom: 12px solid var(--xr-warm-yellow); }
.page-main { padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 5vw, 5rem); }
.wp-content { max-width: 900px; margin: 0 auto; }
.wp-content h2 { font-size: clamp(2.2rem, 7vw, 5rem); margin: 2rem 0 1rem; }
.wp-content h3 { font-size: clamp(1.8rem, 5vw, 3.2rem); margin: 1.5rem 0 .75rem; }
.wp-content blockquote { margin: 2rem 0; padding: 1.25rem; border-left: 8px solid var(--xr-red); background: var(--xr-lemon); font-size: 1.4rem; font-weight: 700; }
.wp-content ol, .wp-content ul { padding-left: 1.3rem; }
.color-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 8px; margin-top: 1.25rem; }
.swatch { min-height: 92px; padding: .65rem; display: flex; flex-direction: column; justify-content: space-between; border: 3px solid var(--xr-black); color: var(--xr-black); }
.swatch.dark { color: var(--xr-white); }
.swatch-name { font-size: 1.1rem; }
.swatch-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem; }
.site-footer { padding: 1.5rem clamp(1rem, 4vw, 3rem); background: var(--xr-black); color: var(--xr-white); }
@media (max-width: 760px) { .site-header { align-items: flex-start; flex-direction: column; position: static; } body { font-size: 18px; } .nav a { font-size: .9rem; } }


.wp-block-group.hero, .wp-block-group.band { margin-top: 0; margin-bottom: 0; }
.wp-block-group.hero > .wp-block-group__inner-container,
.wp-block-group.band > .wp-block-group__inner-container { max-width: 1040px; margin: 0 auto; }
.wp-block-group.hero > .wp-block-group__inner-container { max-width: 1040px; }
.wp-block-group.hero h1 { max-width: min(100%, 12ch); margin: 0 0 1rem; font-size: clamp(3.2rem, 11vw, 9rem); overflow-wrap: anywhere; }
.wp-block-group.band h2 { margin: 0 0 1.25rem; font-size: clamp(2.7rem, 9vw, 7rem); }
.wp-block-buttons { margin-top: 1.25rem; }
.wp-block-button__link { display: inline-block; padding: .7rem 1rem .55rem; border: 4px solid var(--xr-black); border-radius: 0; background: var(--xr-red); color: var(--xr-white); box-shadow: 6px 6px 0 var(--xr-black); text-decoration: none; font-family: var(--title-font); text-transform: uppercase; line-height: .95; }
.wp-block-button.is-style-outline .wp-block-button__link, .wp-block-button__link.alt { background: var(--xr-warm-yellow); color: var(--xr-black); }

.band.white { background: var(--xr-white); color: var(--xr-black); }
.wp-content { max-width: 1040px; margin: 0 auto; }
.event-list { display: grid; gap: 1rem; margin-top: 2rem; }
.event-card, .empty-state { background: var(--xr-white); color: var(--xr-black); border: 5px solid var(--xr-black); padding: clamp(1rem, 3vw, 1.5rem); box-shadow: 7px 7px 0 var(--xr-black); }
.event-card h3 { margin: .5rem 0 .75rem; font-size: clamp(2rem, 5vw, 3.4rem); }
.event-meta, .quick-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.meta-pill { display: inline-block; border: 3px solid var(--xr-black); background: var(--xr-lemon); padding: .25rem .45rem .12rem; font-family: var(--title-font); text-transform: uppercase; line-height: .95; }

@media (max-width: 760px) { .hero h1, .wp-block-group.hero h1 { max-width: 100%; font-size: clamp(3rem, 18vw, 5.8rem); } }