@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600&display=swap');
/* Reference C: artwork is decorative; all page content remains accessible HTML. */
:root { --ink:#072c29; --line:#e5ddcf; }
body { color:var(--ink); }
body > header, main, footer { max-width:1600px; margin-inline:auto; }
.site-header { position:relative; padding:18px 8%; height:92px; }
.brand { font-size:18px; line-height:1; }
.nav { margin:auto; gap:32px; }
.pill { padding:14px 28px; font-size:18px; transition:transform .2s; }
.pill span { font-size:26px; line-height:1; }
.hero { display:block; min-height:0; height:auto; aspect-ratio:1.25; margin-top:-10px; padding:0; background:var(--cream) url('./assets/images/hero-editorial.png') center/100% 100% no-repeat; }
.hero-copy { position:absolute; top:5%; left:8%; width:36%; max-width:none; padding:0; }
.hero .eyebrow { margin:0 0 22px; font-size:clamp(10px,1.05vw,15px); letter-spacing:.22em; }
.hero h1 { font-size:clamp(60px,8.8vw,140px); line-height:.88; letter-spacing:-.065em; font-weight:700; margin:0 0 28px; }
.hero h1 strong { display:inline-block; font-size:1.3em; line-height:1; margin-bottom:8px; }
.hero-lede { font-size:clamp(18px,2.05vw,31px); max-width:95%; line-height:1.1; margin-bottom:24px; }
.hero-copy .pill { min-width:65%; justify-content:space-between; }
.hero-art { position:absolute; inset:0; min-height:0; overflow:visible; pointer-events:none; }
.scribble { font-family:'Caveat',cursive; font-weight:600; font-size:clamp(18px,2.5vw,36px); text-align:center; line-height:.85; }
.scribble-top { top:7%; right:20%; }
.scribble-bottom { bottom:20%; left:40%; }
.scribble svg { width:70px; height:70px; display:block; margin-left:auto; fill:none; stroke:var(--ink); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.scribble-bottom svg { width:105px; height:48px; }
.section { padding:48px 6.5%; }
.events { margin-top:-12px; }
.section-tag { font-size:11px; letter-spacing:.2em; margin:0 0 18px; }
.events .section-heading { display:grid; grid-template-columns:1fr auto; gap:0 32px; }
.events .section-heading > .section-tag { grid-column:1/-1; }
.events .section-heading > div { display:grid; grid-template-columns:1.4fr 1fr; align-items:center; gap:35px; }
.section-heading h2 { font-size:clamp(38px,6.2vw,95px); letter-spacing:-.055em; white-space:nowrap; margin:0; }
.section-heading > div p { font-size:18px; line-height:1.15; margin:0; }
.event-grid { margin-top:28px; gap:16px; }
.event-card { padding:14px; border-radius:8px; gap:22px; grid-template-columns:36% 1fr 44px; min-width:0; }
.event-thumb { width:100%; background-size:cover; }
.thumb-orange { background-image:url('./assets/images/pattern-warm.svg'); }
.thumb-green { background-image:url('./assets/images/pattern-orbit.svg'); }
.event-card h3 { font-size:clamp(22px,2.8vw,40px); margin:14px 0 24px; line-height:.95; }
.event-card small { font-size:13px; }
.event-card .eyebrow { font-size:9px; margin:0; }
.circle-arrow { width:44px; height:44px; font-size:25px; }
.projects { display:grid; grid-template-columns:42% 58%; align-items:start; padding-bottom:100px; position:relative; overflow:hidden; }
.projects .section-heading { display:block; padding-right:28px; }
.projects .section-heading h2 { margin:20px 0; }
.projects .section-heading::after { content:'rzeczy, które\a zostają w głowie ⤴'; white-space:pre; display:block; margin:65px 0 0 90px; font-family:'Caveat',cursive; font-size:28px; transform:rotate(-8deg); }
.project-feature { margin:0; padding:14px; grid-template-columns:40% 60%; border:1px solid var(--line); border-radius:8px; }
.project-art { background:url('./assets/images/pattern-project.svg') center/cover; min-height:260px; border:0; border-radius:5px; }
.project-art > * { display:none; }
.project-copy { padding:22px 26px; background:transparent; color:var(--ink); align-self:center; }
.project-copy h3 { font-size:clamp(25px,3vw,46px); letter-spacing:-.05em; margin:20px 0 14px; line-height:1; }
.project-copy p { font-size:18px; line-height:1.15; }
.outline-pill { border-color:#cdb792; font-size:16px; white-space:nowrap; }
.partners { border-block:1px solid var(--line); text-align:center; }
.partners h2 { font-size:36px; letter-spacing:-.04em; margin:16px 0; }
.partners a { text-decoration:underline; }
.about,.school { grid-template-columns:1fr 2fr; gap:40px; padding-block:75px; }
.about h2,.school h2 { font-size:clamp(38px,5vw,76px); letter-spacing:-.05em; }
.subject-grid a { border-radius:8px; }
.skip-link { position:absolute; left:16px; top:-100px; z-index:20; background:var(--cream); padding:15px; }
.skip-link:focus { top:10px; }
a:focus-visible { outline:3px solid var(--green); outline-offset:5px; }
@media(min-width:1600px) { .hero h1 { font-size:140px; } }
@media(max-width:1100px) {
  .site-header { padding-inline:5%; } .nav { gap:18px; } .brand { font-size:15px; }
  .events .section-heading > div { grid-template-columns:1.4fr 1fr; gap:20px; }
  .event-card { gap:12px; grid-template-columns:34% 1fr 34px; } .circle-arrow { width:34px; height:34px; }
  .section-heading > div p { font-size:15px; } .project-copy { padding:15px; }
}
@media(max-width:760px) {
  .site-header { height:auto; flex-wrap:wrap; gap:16px; padding:16px 6%; }
  .site-header > .pill { margin-left:auto; font-size:14px; padding:10px 16px; }
  .nav { display:flex; order:3; width:100%; justify-content:space-between; margin:0; }
  .hero { aspect-ratio:auto; min-height:990px; background-size:auto 580px; background-position:73% bottom; margin:0; }
  .hero-copy { top:30px; left:7%; width:86%; }
  .hero h1 { font-size:72px; max-width:330px; line-height:.84; margin-bottom:22px; }
  .hero h1 strong { font-size:1.15em; margin-bottom:6px; }
  .hero-lede { font-size:21px; max-width:300px; }
  .hero-copy .pill { min-width:210px; }
  .scribble-top { top:auto; bottom:380px; right:8%; font-size:23px; }
  .scribble-bottom { display:none; }
  .section { padding:32px 6%; } .events { margin-top:0; }
  .events .section-heading { display:block; }
  .events .section-heading > div { display:block; margin:0; }
  .section-heading h2 { font-size:45px; white-space:normal; }
  .section-heading > div p { margin:16px 0; font-size:17px; }
  .event-grid { grid-template-columns:1fr; margin-top:22px; }
  .event-card { grid-template-columns:32% 1fr 34px; }
  .event-card h3 { font-size:26px; }
  .projects { display:block; } .projects .section-heading::after { display:none; }
  .project-feature { grid-template-columns:38% 62%; margin-top:25px; }
  .project-art { min-height:250px; } .project-copy h3 { font-size:28px; }
  .outline-pill { font-size:13px; padding:10px; }
  .about,.school { display:block; } .subject-grid { grid-template-columns:1fr; }
  .site-footer { grid-template-columns:1fr; font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { .pill:hover { transform:none; } }