/* Terrassa Breaking — full de estils únic per a tota la web.
   Colors i tipografies tretes del cartell de This is for Terrassa Vol. 6. */

@font-face{font-family:"Archivo Black";src:url(../fonts/archivo-black-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url(../fonts/barlow-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url(../fonts/barlow-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(../fonts/barlow-condensed-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(../fonts/barlow-condensed-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --peach:#FCC6A8;   /* fons */
  --cream:#FFF3E8;   /* blocs */
  --brown:#2A1712;   /* text, vores, ombres */
  --rust:#8E3A1B;    /* detalls secundaris */
  --orange:#D9541F;  /* botons, accent */
  --coral:#F05A4A;   /* títols grans */
  --display:"Archivo Black","Arial Black",Impact,sans-serif;
  --body:"Barlow","Helvetica Neue",Arial,sans-serif;
  --cond:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --max:1080px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:80px}
body{background:var(--peach);color:var(--brown);font:400 18px/1.6 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--brown);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--brown);color:var(--cream);padding:8px 14px;z-index:99}
.skip:focus{left:8px}

.container{max-width:var(--max);margin:0 auto;padding:0 22px}
.narrow > *{max-width:720px}

/* ---------- Capçalera ---------- */
.site-header{background:var(--brown);color:var(--cream);position:sticky;top:0;z-index:50}
.site-header .container{display:flex;align-items:center;gap:18px;min-height:64px}
.brand{font:400 20px/1 var(--display);text-decoration:none;color:var(--peach);letter-spacing:.01em;white-space:nowrap}
.brand img{height:48px;width:auto;display:block}
.nav-toggle{display:none;margin-left:auto;background:none;border:2px solid var(--peach);color:var(--peach);font:700 17px var(--cond);padding:4px 12px;cursor:pointer}
.site-nav{display:flex;align-items:center;gap:18px;margin-left:auto}
.site-nav ul{list-style:none;display:flex;gap:16px;flex-wrap:wrap}
.site-nav a{text-decoration:none;font:600 18px var(--cond);color:var(--cream)}
.site-nav a:hover{color:var(--peach);text-decoration:underline}
.site-nav a[aria-current="page"]{color:var(--peach);border-bottom:3px solid var(--orange)}
.langs{display:flex;gap:4px}
.langs a{font:700 15px var(--cond);border:2px solid var(--peach);color:var(--peach);padding:1px 8px;border-radius:999px;text-decoration:none}
.langs a[aria-current="true"]{background:var(--peach);color:var(--brown)}

@media (max-width:900px){
  .nav-toggle{display:block}
  .site-nav{display:none;position:absolute;top:64px;left:0;right:0;background:var(--brown);flex-direction:column;align-items:flex-start;padding:10px 22px 22px;gap:14px}
  .site-nav.open{display:flex}
  .site-nav ul{flex-direction:column;gap:10px}
  .site-nav a{font-size:22px}
}

/* ---------- Títols ---------- */
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.05}
.poster-title{font-size:clamp(46px,10vw,112px);line-height:.9;color:var(--coral);-webkit-text-stroke:2px var(--brown);text-shadow:6px 6px 0 var(--brown);letter-spacing:-.01em}
.page-title{font-size:clamp(34px,6.5vw,64px);line-height:.98}
h2{font-size:clamp(26px,3.6vw,34px);margin-bottom:14px}
h3{font-size:21px;margin-bottom:8px}
.lead{font-size:clamp(19px,2.2vw,22px);max-width:62ch}
p+p{margin-top:12px}
.tag{display:inline-block;font:400 22px var(--display);background:var(--brown);color:var(--peach);padding:2px 12px;transform:rotate(-3deg)}

/* ---------- Seccions ---------- */
.hero{padding-block:44px 40px}
.hero .lead{margin-top:22px}
.section{border-top:3px solid var(--brown);padding-block:40px}
.section:last-of-type{padding-block-end:56px}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:start}
.two{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:820px){.split,.two,.three{grid-template-columns:1fr}}

.block{background:var(--cream);border:3px solid var(--brown);padding:22px}
.block h3{color:var(--rust)}
.block .more{display:inline-block;margin-top:12px;font-weight:600}

.poster{border:3px solid var(--brown);box-shadow:8px 8px 0 var(--brown);background:var(--cream)}

/* ---------- Logos i fotos ---------- */
.logo-title img{width:100%;max-width:520px}
.logo-title.tift img{max-width:440px}
.photo{border:3px solid var(--brown);box-shadow:8px 8px 0 var(--brown);background:var(--cream)}
.photo img{width:100%}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.gallery figure{border:3px solid var(--brown);box-shadow:6px 6px 0 var(--brown);background:var(--cream)}
.gallery img{width:100%;aspect-ratio:4/5;object-fit:cover}
.gallery.square img{aspect-ratio:1}
.gallery.places{grid-template-columns:repeat(2,1fr)}
.gallery.places img{aspect-ratio:4/3}
.gallery.winners{margin-top:14px}
.gallery.winners img{aspect-ratio:4/3;object-fit:contain;background:var(--brown)}
.gallery figcaption{font:700 18px var(--cond);padding:6px 12px;border-top:3px solid var(--brown)}
.press-logo{width:100%;max-width:420px;margin-top:22px}
@media (max-width:820px){.gallery{grid-template-columns:repeat(2,1fr);gap:18px}}
@media (max-width:520px){.gallery.square,.gallery.winners,.gallery.places{grid-template-columns:1fr}}

/* ---------- Botons ---------- */
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.btn{display:inline-block;background:var(--orange);color:var(--cream);text-decoration:none;font:400 18px/1.2 var(--display);padding:14px 20px;border:3px solid var(--brown);box-shadow:5px 5px 0 var(--brown)}
.btn:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--brown)}
.btn.alt{background:var(--cream);color:var(--brown)}
@media (prefers-reduced-motion:reduce){.btn:hover{transform:none}}

/* ---------- Fitxes de dades (horari, preu, lloc) ---------- */
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:3px solid var(--brown);background:var(--cream)}
.facts div{padding:18px 20px;border-right:3px solid var(--brown)}
.facts div:last-child{border-right:0}
.facts dt{font:700 17px var(--cond);color:var(--rust)}
.facts dd{font-weight:600}
@media (max-width:820px){.facts{grid-template-columns:1fr}.facts div{border-right:0;border-bottom:3px solid var(--brown)}.facts div:last-child{border-bottom:0}}

/* ---------- Competició ---------- */
.prizes{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}
.prize b{display:block;font:400 52px/1 var(--display);color:var(--orange);margin-bottom:8px}
.prize.second b{font-size:40px}
@media (max-width:620px){.prizes{grid-template-columns:1fr}}
.rounds{display:grid;gap:10px;margin-top:18px}
.round{display:grid;grid-template-columns:130px 1fr;align-items:center;gap:12px;font:700 19px var(--cond)}
.bar{height:30px;background:var(--rust);color:var(--cream);display:flex;align-items:center;padding-left:10px;font-size:17px}
.bar.final{background:var(--orange)}
@media (max-width:520px){.round{grid-template-columns:90px 1fr}}

.people{list-style:none;display:grid;gap:8px}
.people li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-bottom:2px dashed var(--rust);padding-bottom:8px}
.role{font:700 17px var(--cond);color:var(--rust)}

.timeline{list-style:none}
.timeline li{display:grid;grid-template-columns:70px 1fr;gap:12px;padding:6px 0}
.timeline time{font:700 20px var(--cond)}
.timeline li.key{font-weight:600}
.timeline li.key time{color:var(--orange)}

/* ---------- Llistes d'enllaços, premsa, FAQ ---------- */
.linkrow{display:flex;flex-wrap:wrap;gap:10px}
.linkrow a{border:2px solid var(--brown);background:var(--cream);padding:7px 14px;text-decoration:none;font-weight:600}
.linkrow a:hover{background:var(--brown);color:var(--cream)}

.press{list-style:none;display:grid;gap:14px}
.press li{background:var(--cream);border:3px solid var(--brown);padding:16px 20px}
.press .outlet{font:700 18px var(--cond);color:var(--rust)}
.press a{font-weight:600}

.faq details{border-bottom:2px solid var(--brown);padding:12px 0}
.faq summary{cursor:pointer;font-weight:600;font-size:19px}
.faq details p{margin-top:8px}

.formats{counter-reset:none}
.formats .block h3{font-size:24px;color:var(--brown)}
.formats .dur{font:700 18px var(--cond);color:var(--orange);margin-bottom:6px;display:block}

.prose h2{margin-top:30px}
.prose ul{margin:10px 0 0 22px}
.prose li+li{margin-top:6px}

/* ---------- Peu ---------- */
.site-footer{background:var(--brown);color:var(--cream);padding:36px 0 26px;font-size:16px}
.site-footer .container{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:26px}
.site-footer .brand{font-size:22px;display:inline-block;margin-bottom:10px}
.site-footer ul{list-style:none}
.site-footer li+li{margin-top:4px}
.site-footer a{color:var(--cream)}
.site-footer .small{grid-column:1/-1;border-top:1px solid var(--rust);padding-top:14px;font-size:14px;opacity:.8;display:flex;flex-wrap:wrap;gap:14px}
.linkbtn{background:none;border:0;color:inherit;font:inherit;text-decoration:underline;cursor:pointer}
@media (max-width:820px){.site-footer .container{grid-template-columns:1fr}}

/* ---------- Bàner de galetes ---------- */
.cookie{position:fixed;left:16px;right:16px;bottom:16px;max-width:560px;background:var(--cream);border:3px solid var(--brown);box-shadow:6px 6px 0 var(--brown);padding:18px;z-index:100;font-size:16px}
.cookie .actions{margin-top:14px;gap:10px}
.cookie .btn{font-size:15px;padding:10px 14px;box-shadow:3px 3px 0 var(--brown)}