/*
Theme Name: Climate Strike Coalition
Author: Luova Club
Description: XR-inspired WordPress theme for ilmastolakko.fi.
Version: 1.0.1
*/

: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", Georgia, serif;
}

@font-face { font-family: "FUCXED CAPS"; src: url("assets/fonts/FUCXEDCAPSLatin-Regular.woff") format("woff"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Crimson"; src: url("assets/fonts/CrimsonText-Regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
* { 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-lime); }
.site-title, h1, h2, h3, .button, .tagline, .strike-date, .time-pill { 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, 4rem); text-decoration: none; }
.lang-switch { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; font-family: var(--title-font); }
.lang-switch a { padding: .35rem .5rem .25rem; text-decoration: none; border: 3px solid currentColor; }
.lang-switch a[aria-current="page"] { background: var(--xr-warm-yellow); color: var(--xr-black); }
.hero { min-height: 68vh; display: grid; align-items: end; padding: clamp(2rem, 7vw, 6rem) clamp(1rem, 5vw, 5rem); background: linear-gradient(135deg, rgba(247,238,106,.94), rgba(117,208,241,.82)), repeating-linear-gradient(-12deg, rgba(0,0,0,.2) 0 12px, transparent 12px 38px); border-bottom: 14px solid var(--xr-black); }
.hero-inner { max-width: 1040px; }
.hero h1 { margin: 0 0 1rem; font-size: clamp(4rem, 16vw, 12rem); max-width: 980px; }
.hero p { max-width: 760px; 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.green { background: var(--xr-light-green); }
.band.pink { background: var(--xr-pink); }
.band.blue { background: var(--xr-light-blue); }
.band.red { background: var(--xr-red); color: var(--xr-white); }
.content { max-width: 1040px; margin: 0 auto; }
.band h2 { margin: 0 0 1.25rem; font-size: clamp(2.7rem, 9vw, 7rem); }
.notice { border: 5px solid var(--xr-black); background: var(--xr-lime); padding: 1rem; box-shadow: 7px 7px 0 var(--xr-black); max-width: 780px; font-weight: 700; }
.strike-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; }
.strike-card { background: var(--xr-white); color: var(--xr-black); border: 5px solid var(--xr-black); padding: 1rem; box-shadow: 7px 7px 0 var(--xr-black); }
.strike-date { font-size: 2rem; color: var(--xr-red); }
.strike-location { font-weight: 700; margin-top: .5rem; }
.time-pill { display: inline-block; margin-top: .75rem; padding: .35rem .45rem .25rem; background: var(--xr-black); color: var(--xr-white); }
.programme-list { display: grid; gap: .65rem; margin: 0; padding: 0; list-style: none; max-width: 860px; }
.programme-list li { background: var(--xr-white); border: 4px solid var(--xr-black); padding: .8rem 1rem; }
.qa-grid { display: grid; gap: 1rem; max-width: 900px; }
details { background: var(--xr-white); color: var(--xr-black); border: 4px solid var(--xr-black); padding: 1rem; }
summary { cursor: pointer; font-family: var(--title-font); font-size: 1.8rem; line-height: 1; }
.button { display: inline-block; margin-top: 1rem; padding: .7rem 1rem .55rem; border: 4px solid var(--xr-black); background: var(--xr-warm-yellow); color: var(--xr-black); box-shadow: 6px 6px 0 var(--xr-black); text-decoration: none; }
.site-footer { padding: 1.5rem clamp(1rem, 4vw, 3rem); background: var(--xr-black); color: var(--xr-white); }
@media (max-width: 720px) { .site-header { align-items: flex-start; flex-direction: column; } body { font-size: 18px; } .strike-date { font-size: 1.55rem; } }