/* ===========================================================
   Crònica de s'Albufera — sistema visual
   Editorial / d'arxiu · càlid i natural
   =========================================================== */

:root {
  /* Paper & ink */
  --paper:      oklch(0.967 0.013 84);
  --paper-2:    oklch(0.935 0.017 80);
  --paper-3:    oklch(0.905 0.020 78);
  --ink:        oklch(0.245 0.014 56);
  --ink-soft:   oklch(0.435 0.013 58);
  --ink-faint:  oklch(0.585 0.012 62);
  --line:       oklch(0.845 0.018 76);
  --line-soft:  oklch(0.895 0.016 78);

  /* Accents (aiguamoll) */
  --reed:       oklch(0.420 0.062 152);
  --reed-deep:  oklch(0.320 0.052 152);
  --gold:       oklch(0.560 0.082 74);
  --gold-deep:  oklch(0.470 0.075 70);

  /* Type */
  --display: "Cormorant Garamond", Georgia, serif;
  --body:    "Spectral", Georgia, "Times New Roman", serif;

  --maxw: 1280px;
  --gutter: clamp(1.25rem, 4vw, 4rem);

  --shadow-sm: 0 1px 2px oklch(0.245 0.014 56 / 0.06), 0 4px 14px oklch(0.245 0.014 56 / 0.06);
  --shadow-md: 0 6px 22px oklch(0.245 0.014 56 / 0.10), 0 22px 54px oklch(0.245 0.014 56 / 0.12);
}

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

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--body);
  font-size: 18px;
  line-height: 1.65;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

::selection { background: var(--reed); color: var(--paper); }

/* ---------- helpers ---------- */
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }

.eyebrow {
  font-family: var(--body);
  font-size: 0.72rem;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--gold-deep);
}

.rule { height: 1px; background: var(--line); border: 0; margin: 0; }

h1, h2, h3 { font-family: var(--display); font-weight: 600; line-height: 1.04; margin: 0; }

/* ===========================================================
   Top utility bar
   =========================================================== */
.topbar {
  background: var(--ink);
  color: var(--paper);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.topbar .wrap {
  display: flex; align-items: center; justify-content: space-between;
  min-height: 38px; gap: 1rem;
}
.topbar .tag { color: oklch(0.82 0.02 80); }
.topbar .langs { display: flex; gap: 0.9rem; }
.topbar .langs a { opacity: 0.6; transition: opacity 0.2s; }
.topbar .langs a:hover, .topbar .langs a[aria-current="true"] { opacity: 1; }
.topbar .langs a[aria-current="true"] { color: var(--gold); }

/* ===========================================================
   Masthead + nav
   =========================================================== */
.masthead {
  position: sticky; top: 0; z-index: 60;
  background: oklch(0.967 0.013 84 / 0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
  transition: padding 0.3s ease, box-shadow 0.3s ease;
}
.masthead.compact { box-shadow: var(--shadow-sm); }
.masthead .wrap { display: flex; align-items: center; gap: clamp(1rem, 4vw, 3rem); min-height: 92px; transition: min-height 0.3s ease; }
.masthead.compact .wrap { min-height: 66px; }

.brand { display: flex; align-items: center; gap: 0.85rem; flex-shrink: 0; }
.brand .seal {
  width: 46px; height: 46px; border-radius: 50%;
  border: 1px solid var(--line);
  background: var(--paper-2) center/64% no-repeat;
  display: grid; place-items: center; overflow: hidden;
  transition: width 0.3s, height 0.3s;
}
.masthead.compact .brand .seal { width: 38px; height: 38px; }
.brand .seal img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.brand .wordmark { display: flex; flex-direction: column; line-height: 1; }
.brand .wordmark .t1 {
  font-family: var(--display); font-size: 1.62rem; font-weight: 600;
  letter-spacing: 0.005em; color: var(--ink); transition: font-size 0.3s;
  white-space: nowrap;
}
.masthead.compact .brand .wordmark .t1 { font-size: 1.4rem; }
.brand .wordmark .t2 {
  font-size: 0.6rem; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--ink-faint); margin-top: 3px; font-weight: 600;
}

/* primary nav */
.nav { margin-left: auto; }
.nav > ul { list-style: none; display: flex; align-items: center; gap: clamp(0.6rem, 1.8vw, 1.9rem); margin: 0; padding: 0; }
.nav > ul > li { position: relative; }
.nav > ul > li > a {
  display: inline-flex; align-items: center; gap: 0.35rem;
  font-size: 0.78rem; letter-spacing: 0.13em; text-transform: uppercase; font-weight: 600;
  color: var(--ink-soft); padding: 0.4rem 0; white-space: nowrap;
  border-bottom: 2px solid transparent; transition: color 0.2s, border-color 0.2s;
}
.nav > ul > li > a:hover, .nav > ul > li.open > a { color: var(--ink); border-color: var(--gold); }
.nav .caret { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: 0.6; transition: transform 0.25s; }
.nav > ul > li.open .caret { transform: rotate(225deg) translateY(-1px); }
.nav .pill > a { color: var(--paper); background: var(--reed); padding: 0.5rem 1rem; border-radius: 999px; border: 0; }
.nav .pill > a:hover { background: var(--reed-deep); color: var(--paper); }

/* dropdown */
.submenu {
  position: absolute; top: calc(100% + 14px); left: 0;
  min-width: 290px; background: var(--paper);
  border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow-md); padding: 0.5rem;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity 0.22s, transform 0.22s, visibility 0.22s;
}
.submenu.wide { min-width: 540px; columns: 2; column-gap: 0.5rem; padding: 0.6rem; }
li.open > .submenu { opacity: 1; visibility: visible; transform: translateY(0); }
.submenu a {
  display: block; break-inside: avoid;
  font-family: var(--body); font-size: 0.92rem; letter-spacing: 0;
  text-transform: none; font-weight: 500; color: var(--ink-soft);
  padding: 0.5rem 0.7rem; border-radius: 7px; transition: background 0.16s, color 0.16s;
}
.submenu a:hover { background: var(--paper-2); color: var(--reed-deep); }
.submenu .group-label {
  font-size: 0.64rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold-deep); font-weight: 700; padding: 0.7rem 0.7rem 0.3rem;
}

/* burger */
.burger { display: none; margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); cursor: pointer; position: relative; }
.burger span, .burger span::before, .burger span::after { content: ""; position: absolute; left: 0; width: 20px; height: 2px; background: var(--ink); transition: transform 0.25s, opacity 0.2s; }
.burger span { top: 20px; left: 10px; }
.burger span::before { top: -6px; }
.burger span::after { top: 6px; }
body.menu-open .burger span { background: transparent; }
body.menu-open .burger span::before { transform: translateY(6px) rotate(45deg); }
body.menu-open .burger span::after { transform: translateY(-6px) rotate(-45deg); }

/* ===========================================================
   Hero
   =========================================================== */
.hero { position: relative; min-height: min(86vh, 760px); display: flex; align-items: flex-end; overflow: hidden; background: var(--ink); }
.hero .bg { position: absolute; inset: 0; }
.hero .bg img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.82) contrast(1.02); }
.hero .scrim { position: absolute; inset: 0; background:
  linear-gradient(180deg, oklch(0.2 0.02 60 / 0.5) 0%, oklch(0.2 0.02 60 / 0.0) 32%, oklch(0.18 0.02 60 / 0.15) 55%, oklch(0.16 0.02 60 / 0.86) 100%); }
.hero .wrap { position: relative; z-index: 2; padding-block: clamp(2.5rem, 6vw, 5rem); color: var(--paper); width: 100%; }
.hero .eyebrow { color: var(--gold); }
.hero h1 {
  font-size: clamp(3rem, 9vw, 7.2rem); color: var(--paper); margin: 0.5rem 0 0;
  letter-spacing: -0.01em; max-width: 16ch; text-wrap: balance;
}
.hero h1 em { font-style: italic; color: oklch(0.9 0.04 80); }
.hero .lede {
  margin-top: 1.4rem; max-width: 48ch; font-size: clamp(1.05rem, 2vw, 1.32rem);
  color: oklch(0.92 0.01 80); line-height: 1.55;
}
.hero .meta { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem; align-items: center; }
.hero .meta .stat { display: flex; flex-direction: column; gap: 2px; }
.hero .meta .stat b { font-family: var(--display); font-size: 2rem; font-weight: 600; line-height: 1; color: var(--paper); }
.hero .meta .stat span { font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: oklch(0.82 0.02 80); }
.hero .meta .divider { width: 1px; align-self: stretch; background: oklch(0.92 0.01 80 / 0.3); }

/* ===========================================================
   Section scaffolding
   =========================================================== */
section { padding-block: clamp(3.5rem, 8vw, 7rem); }
.section-head { max-width: 60ch; margin-bottom: clamp(2rem, 4vw, 3.2rem); }
.section-head h2 { font-size: clamp(2rem, 4.5vw, 3.2rem); margin-top: 0.6rem; letter-spacing: -0.01em; }
.section-head p { color: var(--ink-soft); font-size: 1.1rem; margin: 1rem 0 0; max-width: 56ch; }

/* mission / intro */
.mission { background: var(--paper); }
.mission .grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.mission .lead-quote { font-family: var(--display); font-size: clamp(1.7rem, 3.4vw, 2.6rem); line-height: 1.2; color: var(--ink); letter-spacing: -0.005em; }
.mission .lead-quote em { color: var(--reed-deep); font-style: italic; }
.mission .body p { color: var(--ink-soft); margin: 0 0 1.1rem; }
.mission .body p:first-child { margin-top: 0; }
.mission .body .first-letter::first-letter { font-family: var(--display); font-size: 3.6rem; line-height: 0.8; float: left; padding: 6px 10px 0 0; color: var(--reed); font-weight: 600; }

/* ===========================================================
   Pillars
   =========================================================== */
.pillars { background: var(--paper-2); border-block: 1px solid var(--line); }
.pillars .cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 4vw, 3rem); }
.pillar { display: flex; flex-direction: column; }
.pillar .pic { aspect-ratio: 4 / 3; overflow: hidden; border-radius: 10px; background: var(--paper-3); border: 1px solid var(--line); }
.pillar .pic img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s cubic-bezier(.2,.7,.2,1); filter: saturate(0.85); }
.pillar:hover .pic img { transform: scale(1.05); }
.pillar h3 { font-size: 1.7rem; margin-top: 1.3rem; }
.pillar .num { font-size: 0.7rem; letter-spacing: 0.22em; color: var(--gold-deep); font-weight: 600; text-transform: uppercase; }
.pillar p { color: var(--ink-soft); margin: 0.6rem 0 0; font-size: 1rem; }
.pillar a.more { margin-top: auto; padding-top: 1rem; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; color: var(--reed-deep); display: inline-flex; align-items: center; gap: 0.4rem; }
.pillar a.more::after { content: "→"; transition: transform 0.25s; }
.pillar:hover a.more::after { transform: translateX(4px); }

/* ===========================================================
   Sections directory (cards)
   =========================================================== */
.directory { background: var(--paper); }
.dir-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(1rem, 2.5vw, 1.5rem); }
.dcard {
  position: relative; overflow: hidden; border-radius: 12px; min-height: 280px;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 1.6rem; color: var(--paper); background: var(--ink);
  border: 1px solid transparent; transition: transform 0.4s cubic-bezier(.2,.7,.2,1), box-shadow 0.4s;
}
.dcard:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.dcard .bg { position: absolute; inset: 0; }
.dcard .bg img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(.2,.7,.2,1); filter: saturate(0.78) brightness(0.92); }
.dcard:hover .bg img { transform: scale(1.06); }
.dcard .bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, oklch(0.2 0.02 60 / 0.05) 0%, oklch(0.16 0.02 60 / 0.78) 78%); }
.dcard .inner { position: relative; z-index: 2; }
.dcard .kicker { font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); font-weight: 600; }
.dcard h3 { font-size: clamp(1.6rem, 2.4vw, 2.1rem); margin-top: 0.5rem; color: var(--paper); }
.dcard p { font-size: 0.95rem; color: oklch(0.9 0.01 80); margin: 0.5rem 0 0; max-width: 38ch; }
.dcard .count { position: absolute; top: 1.4rem; right: 1.5rem; z-index: 2; font-family: var(--display); font-size: 1.05rem; color: oklch(0.9 0.02 80); border: 1px solid oklch(0.9 0.02 80 / 0.4); border-radius: 999px; padding: 0.1rem 0.7rem; }
.dcard.lg { grid-column: span 7; min-height: 360px; }
.dcard.md { grid-column: span 5; }
.dcard.sm { grid-column: span 4; }

/* light variant card (no image) */
.dcard.plain { background: var(--paper-2); color: var(--ink); border-color: var(--line); }
.dcard.plain:hover { border-color: var(--gold); }
.dcard.plain h3 { color: var(--ink); }
.dcard.plain p { color: var(--ink-soft); }
.dcard.plain .kicker { color: var(--gold-deep); }
.dcard.plain .arrow { position: absolute; bottom: 1.6rem; right: 1.6rem; font-size: 1.4rem; color: var(--reed); }

/* ===========================================================
   Gallery
   =========================================================== */
.gallery { background: var(--ink); color: var(--paper); }
.gallery .section-head h2 { color: var(--paper); }
.gallery .section-head p { color: oklch(0.82 0.02 80); }
.gallery .section-head .eyebrow { color: var(--gold); }
.masonry { columns: 4; column-gap: 14px; }
.masonry .shot { break-inside: avoid; margin-bottom: 14px; position: relative; cursor: pointer; overflow: hidden; border-radius: 8px; background: oklch(0.3 0.01 60); }
.masonry .shot img { width: 100%; height: auto; transition: transform 0.7s cubic-bezier(.2,.7,.2,1), filter 0.4s; filter: saturate(0.7) brightness(0.92); }
.masonry .shot:hover img { transform: scale(1.05); filter: saturate(0.95) brightness(1); }
.masonry .shot::after { content: "⤢"; position: absolute; top: 10px; right: 12px; color: var(--paper); opacity: 0; transform: translateY(-4px); transition: opacity 0.25s, transform 0.25s; font-size: 1.1rem; }
.masonry .shot:hover::after { opacity: 0.95; transform: translateY(0); }
.gallery .gallery-foot { margin-top: 2.5rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; border-top: 1px solid oklch(0.9 0.02 80 / 0.18); padding-top: 1.6rem; }
.gallery .gallery-foot p { margin: 0; color: oklch(0.82 0.02 80); font-size: 0.95rem; max-width: 50ch; }

/* ===========================================================
   Notice / avís
   =========================================================== */
.notice { background: var(--paper-2); border-block: 1px solid var(--line); }
.notice .box { display: grid; grid-template-columns: auto 1fr auto; gap: clamp(1.2rem, 3vw, 2.5rem); align-items: center; }
.notice .mark { width: 64px; height: 64px; border-radius: 50%; border: 1.5px solid var(--gold); color: var(--gold-deep); display: grid; place-items: center; font-family: var(--display); font-size: 2rem; font-weight: 600; flex-shrink: 0; }
.notice .txt .lbl { font-size: 0.7rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold-deep); font-weight: 700; }
.notice .txt p { margin: 0.4rem 0 0; font-size: 1.15rem; color: var(--ink); max-width: 60ch; }
.notice .txt p a { color: var(--reed-deep); border-bottom: 1px solid var(--reed); }
.notice .cta { white-space: nowrap; }
.btn { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; padding: 0.85rem 1.5rem; border-radius: 999px; background: var(--ink); color: var(--paper); border: 1px solid var(--ink); transition: background 0.2s, color 0.2s; }
.btn:hover { background: transparent; color: var(--ink); }
.btn.ghost { background: transparent; color: var(--ink); }
.btn.ghost:hover { background: var(--ink); color: var(--paper); }

/* ===========================================================
   Footer
   =========================================================== */
.footer { background: var(--ink); color: oklch(0.85 0.015 80); padding-block: clamp(3rem, 6vw, 4.5rem) 1.5rem; }
.footer .top { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); }
.footer .ex { display: flex; gap: 1.2rem; align-items: flex-start; }
.footer .ex img { width: 92px; flex-shrink: 0; border-radius: 6px; filter: saturate(0.6); }
.footer .ex .cap { font-size: 0.85rem; color: oklch(0.72 0.015 80); }
.footer .ex .cap b { display: block; font-family: var(--display); font-size: 1.5rem; color: var(--paper); font-weight: 600; margin-bottom: 0.3rem; }
.footer h4 { font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); font-weight: 700; margin: 0 0 1rem; }
.footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.footer ul a { font-size: 0.95rem; color: oklch(0.82 0.015 80); transition: color 0.18s; }
.footer ul a:hover { color: var(--gold); }
.footer .bottom { margin-top: clamp(2.5rem, 5vw, 3.5rem); padding-top: 1.5rem; border-top: 1px solid oklch(0.85 0.015 80 / 0.18); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; font-size: 0.8rem; color: oklch(0.66 0.015 80); }
.footer .bottom a { color: oklch(0.72 0.015 80); }
.footer .bottom a:hover { color: var(--gold); }
.footer .bottom .legal { display: flex; gap: 1.2rem; flex-wrap: wrap; }

/* ===========================================================
   Mobile menu drawer
   =========================================================== */
.drawer { position: fixed; inset: 0; z-index: 90; visibility: hidden; }
.drawer .veil { position: absolute; inset: 0; background: oklch(0.16 0.02 60 / 0); transition: background 0.3s; }
.drawer .panel { position: absolute; top: 0; right: 0; height: 100%; width: min(86vw, 400px); background: var(--paper); box-shadow: var(--shadow-md); transform: translateX(100%); transition: transform 0.35s cubic-bezier(.3,.7,.2,1); overflow-y: auto; padding: 1.5rem; }
body.menu-open .drawer { visibility: visible; }
body.menu-open .drawer .veil { background: oklch(0.16 0.02 60 / 0.5); }
body.menu-open .drawer .panel { transform: translateX(0); }
.drawer h4 { font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold-deep); font-weight: 700; margin: 1.4rem 0 0.5rem; }
.drawer nav a { display: block; font-family: var(--display); font-size: 1.45rem; padding: 0.45rem 0; color: var(--ink); border-bottom: 1px solid var(--line-soft); }
.drawer nav .sub a { font-family: var(--body); font-size: 1rem; padding: 0.4rem 0 0.4rem 0.8rem; color: var(--ink-soft); border: 0; }

/* ===========================================================
   Lightbox
   =========================================================== */
.lightbox { position: fixed; inset: 0; z-index: 120; background: oklch(0.12 0.015 60 / 0.96); display: none; align-items: center; justify-content: center; padding: clamp(1rem, 4vw, 3rem); }
.lightbox.on { display: flex; }
.lightbox img { max-width: 100%; max-height: 86vh; object-fit: contain; border-radius: 4px; box-shadow: var(--shadow-md); }
.lightbox .lb-close, .lightbox .lb-nav { position: absolute; background: oklch(0.96 0.01 80 / 0.1); border: 1px solid oklch(0.9 0.02 80 / 0.3); color: var(--paper); cursor: pointer; border-radius: 50%; width: 52px; height: 52px; display: grid; place-items: center; font-size: 1.5rem; transition: background 0.2s; }
.lightbox .lb-close:hover, .lightbox .lb-nav:hover { background: oklch(0.96 0.01 80 / 0.22); }
.lightbox .lb-close { top: clamp(1rem, 3vw, 2rem); right: clamp(1rem, 3vw, 2rem); }
.lightbox .lb-nav.prev { left: clamp(0.5rem, 3vw, 2rem); top: 50%; transform: translateY(-50%); }
.lightbox .lb-nav.next { right: clamp(0.5rem, 3vw, 2rem); top: 50%; transform: translateY(-50%); }
.lightbox .lb-count { position: absolute; bottom: clamp(1rem, 3vw, 2rem); left: 50%; transform: translateX(-50%); color: oklch(0.82 0.02 80); font-size: 0.8rem; letter-spacing: 0.18em; text-transform: uppercase; }

/* ===========================================================
   Reveal on scroll
   =========================================================== */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.8s cubic-bezier(.2,.7,.2,1), transform 0.8s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* ===========================================================
   Responsive
   =========================================================== */
@media (max-width: 1080px) {
  .masonry { columns: 3; }
}
@media (max-width: 1024px) {
  .nav { display: none; }
  .burger { display: block; }
  .masthead .wrap { min-height: 76px; }
  .mission .grid { grid-template-columns: 1fr; }
  .pillars .cols { grid-template-columns: 1fr; max-width: 480px; }
  .dir-grid { grid-template-columns: 1fr; }
  .dcard.lg, .dcard.md, .dcard.sm { grid-column: 1 / -1 !important; min-height: 240px; }
  .footer .top { grid-template-columns: 1fr; }
  .notice .box { grid-template-columns: 1fr; text-align: left; }
}
@media (max-width: 640px) {
  body { font-size: 17px; }
  .masonry { columns: 2; column-gap: 10px; }
  .masonry .shot { margin-bottom: 10px; }
  .hero .meta .divider { display: none; }
}

/* ===== Pàgines interiors: fotografia ===== */
.crumbs{display:flex;flex-wrap:wrap;gap:.5rem;font-size:.78rem;letter-spacing:.08em;color:var(--ink-faint);margin-bottom:1.6rem}
.crumbs a{color:var(--ink-soft);border-bottom:1px solid var(--line)}.crumbs a:hover{color:var(--reed-deep)}
.phead{padding-block:clamp(3rem,7vw,6rem) clamp(2rem,4vw,3rem);border-bottom:1px solid var(--line)}
.phead-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,5rem);align-items:end}
.phead h1{font-size:clamp(2.6rem,6vw,5rem);margin-top:.6rem;text-wrap:balance}.phead h1 em{color:var(--reed-deep)}
.phead-text p{color:var(--ink-soft);margin:0 0 1rem;text-wrap:pretty}
.arxius{padding-top:clamp(2.5rem,5vw,4rem)}
.arxius-list{display:flex;flex-direction:column;gap:clamp(2.5rem,6vw,5rem)}
.acard{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.acard.flip .apic{order:2}
.apic{aspect-ratio:3/2;overflow:hidden;border-radius:10px;background:var(--paper-3);border:1px solid var(--line)}
.apic img{width:100%;height:100%;object-fit:cover;filter:saturate(.8);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.acard:hover .apic img{transform:scale(1.04)}
.atext h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin:.6rem 0 0}
.atext p{color:var(--ink-soft);margin:1rem 0 0;text-wrap:pretty}
.ameta{display:flex;flex-wrap:wrap;gap:1rem 1.6rem;align-items:center;margin-top:1.4rem;font-size:.95rem;color:var(--ink-soft)}
.ameta b{font-family:var(--display);font-size:1.6rem;color:var(--ink);font-weight:600}
.ameta .go{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--reed-deep)}
.badge{display:inline-flex;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--gold-deep);border:1px solid var(--gold);border-radius:999px;padding:.3rem .8rem}
.ahead{position:relative;background:var(--ink);color:var(--paper);padding-block:clamp(4rem,10vw,8rem) clamp(2rem,4vw,3rem);overflow:hidden}
.ahead-bg{position:absolute;inset:0}.ahead-bg img{width:100%;height:100%;object-fit:cover;opacity:.42;filter:saturate(.6)}
.ahead-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,oklch(.2 .02 60/.2),oklch(.16 .02 60/.9))}
.ahead .wrap{position:relative}
.ahead .crumbs,.ahead .crumbs a{color:oklch(.85 .015 80);border-color:oklch(.85 .015 80/.3)}
.ahead .eyebrow{color:var(--gold)}
.ahead h1{font-size:clamp(2.4rem,6vw,4.8rem);color:var(--paper);margin-top:.6rem;max-width:18ch;text-wrap:balance}
.acount{margin:1.2rem 0 0;color:oklch(.85 .015 80)}.acount b{font-family:var(--display);font-size:1.6rem;color:var(--paper)}
.ahead .badge{color:var(--gold);border-color:var(--gold)}
.tabs-bar{position:sticky;top:66px;z-index:40;background:var(--paper);border-bottom:1px solid var(--line)}
.tabs{display:flex;gap:.4rem;overflow-x:auto;padding-block:.7rem;scrollbar-width:none}
.tabs a{flex-shrink:0;font-size:.82rem;font-weight:500;padding:.45rem 1rem;border-radius:999px;color:var(--ink-soft);border:1px solid transparent}
.tabs a:hover{border-color:var(--line);color:var(--ink)}
.tabs a[aria-current="page"]{background:var(--ink);color:var(--paper)}
.aintro{padding-block:clamp(2.5rem,5vw,4rem) 0}
.aintro-text{max-width:68ch;columns:auto}.aintro-text p{color:var(--ink-soft);margin:0 0 1rem;text-wrap:pretty}
.aintro-text p:first-child{font-size:1.2rem;color:var(--ink)}
.aphotos{padding-top:clamp(2rem,4vw,3rem)}
.group{font-size:clamp(1.6rem,3vw,2.2rem);margin:clamp(2.5rem,5vw,4rem) 0 1.5rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.group:first-child{margin-top:0}
.plates{columns:2;column-gap:clamp(1.2rem,3vw,2.5rem)}
.plate{break-inside:avoid;margin:0 0 clamp(1.8rem,3.5vw,2.8rem)}
.pimg{display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--paper-3);cursor:zoom-in}
.pimg img{width:100%;height:auto;filter:saturate(.85);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.plate:hover .pimg img{transform:scale(1.03)}
.plate figcaption{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.9rem;margin-top:.8rem;font-size:.95rem;line-height:1.55}
.pn{font-family:var(--display);font-size:1.1rem;color:var(--gold-deep);font-weight:600;line-height:1.4}
.ct{display:block;color:var(--ink);text-wrap:pretty}
.cs{display:block;margin-top:.35rem;font-size:.78rem;color:var(--ink-faint);font-style:italic}
.pending{padding:3rem 0;display:flex;flex-direction:column;gap:1.2rem;align-items:flex-start}.pending p{font-size:1.2rem;color:var(--ink-soft);margin:0}
.pager{border-top:1px solid var(--line)}
.pager .wrap{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding-block:2rem}
.pager a{display:flex;flex-direction:column;gap:.3rem;padding:1rem 0}.pager a.nx{text-align:right;align-items:flex-end}
.pager span{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.pager b{font-family:var(--display);font-size:1.4rem;font-weight:600}.pager a:hover b{color:var(--reed-deep)}
.plb{position:fixed;inset:0;z-index:120;background:oklch(.12 .015 60/.97);display:none;grid-template-rows:minmax(0,1fr) auto;padding:clamp(1rem,3vw,2rem)}
.plb.on{display:grid}
.plb-stage{display:flex;align-items:center;justify-content:center;min-height:0}
.plb-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:3px}
.plb-cap{max-width:80ch;margin:1rem auto 0;color:oklch(.9 .01 80);font-size:.95rem;line-height:1.55;text-align:center;text-wrap:pretty}
.plb-cap .pn{display:block;font-size:.8rem;letter-spacing:.18em;color:var(--gold);margin-bottom:.3rem}
.plb-cap em{display:block;margin-top:.3rem;font-size:.8rem;color:oklch(.72 .015 80)}
.plb-x,.plb-nav{position:absolute;width:48px;height:48px;border-radius:50%;background:oklch(.96 .01 80/.1);border:1px solid oklch(.9 .02 80/.3);color:var(--paper);font-size:1.4rem;cursor:pointer;display:grid;place-items:center}
.plb-x:hover,.plb-nav:hover{background:oklch(.96 .01 80/.22)}
.plb-x{top:1rem;right:1rem}.plb-nav{top:45%}.plb-nav.prev{left:1rem}.plb-nav.next{right:1rem}
@media (max-width:820px){.phead-grid,.acard{grid-template-columns:1fr}.acard.flip .apic{order:0}.plates{columns:1}.pager .wrap{grid-template-columns:1fr}}

.tabs a{white-space:nowrap}
.crumbs a,.crumbs span{white-space:nowrap}
.ahead .eyebrow{color:oklch(.84 .08 80)}
@media (max-width:1024px){.tabs-bar{top:66px}}

/* ===== Cartografia ===== */
.chero{padding-block:clamp(5rem,12vw,10rem) clamp(2.5rem,5vw,4rem)}.chero h1 em{color:var(--gold)}
.clead{max-width:60ch;font-size:1.1rem;color:oklch(.88 .015 80);text-wrap:pretty}
.cdoc{padding-block:clamp(2.5rem,5vw,4.5rem)}
.cdoc-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.ctoc{position:sticky;top:100px;max-height:calc(100vh - 120px);overflow:auto;padding-right:.5rem}
.ctoc ol{list-style:none;margin:.9rem 0 0;padding:0;display:flex;flex-direction:column;gap:.15rem;border-left:1px solid var(--line)}
.ctoc a{display:block;padding:.35rem 0 .35rem .9rem;margin-left:-1px;border-left:2px solid transparent;font-size:.9rem;line-height:1.35;color:var(--ink-soft)}
.ctoc a:hover{color:var(--reed-deep);border-color:var(--gold)}
.cbody{max-width:760px}
.cbody>h2{font-size:clamp(1.9rem,3.6vw,2.6rem);margin:clamp(3rem,6vw,4.5rem) 0 1.4rem;padding-top:1.4rem;border-top:1px solid var(--line);text-wrap:balance}
.cbody>h2:first-child{margin-top:0;border-top:0;padding-top:0}
.cbody>p{margin:0 0 1.1rem;color:var(--ink-soft);text-wrap:pretty}
.cbody b{color:var(--ink);font-weight:600}
.cbody blockquote{margin:1.6rem 0;padding:.2rem 0 .2rem 1.4rem;border-left:2px solid var(--gold);font-style:italic;color:var(--ink-soft);font-size:1rem;line-height:1.7}
.cbody blockquote cite,.ctrans cite{display:block;margin-top:.8rem;font-style:normal;font-size:.78rem;letter-spacing:.04em;color:var(--ink-faint)}
.cnote{font-size:.85rem!important;color:var(--ink-faint)!important;font-style:italic}
.clist{margin:0 0 1.2rem;padding-left:1.2rem;color:var(--ink-soft)}.clist li{margin-bottom:.45rem}
.cfig{margin:2rem 0}.cfig.narrow{max-width:460px}.cfig.small{max-width:260px}
.cimg{display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:6px;background:var(--paper-2);cursor:zoom-in;overflow:hidden}
.cimg img{display:block;width:100%;height:auto;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cimg:hover img{transform:scale(1.015)}
.cfig figcaption{display:flex;flex-direction:column;gap:.3rem;margin-top:.8rem;font-size:.9rem;line-height:1.5;color:var(--ink-soft);text-wrap:pretty}
.cfig .cs{font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.4rem;margin:2rem 0 .6rem}
.cgrid .cfig{margin:0}.cgrid .cimg{aspect-ratio:4/3}.cgrid .cimg img{height:100%;object-fit:cover}
.cgrid figcaption{font-size:.84rem}
.ctrans{margin:2.4rem 0;padding:clamp(1.4rem,3vw,2.2rem);background:var(--paper-2);border:1px solid var(--line);border-radius:10px}
.ctrans h3{font-size:1.6rem;margin:.5rem 0 1rem}.ctrans p{font-size:.98rem;color:var(--ink-soft);margin:0 0 .9rem;font-style:italic}
@media (max-width:900px){.cdoc-grid{grid-template-columns:minmax(0,1fr)}.ctoc{position:static;max-height:none;padding:1rem 1.2rem;border:1px solid var(--line);border-radius:10px;background:var(--paper-2)}}

/* ===== Dessecacions ===== */
.dsc-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);max-width:1000px}
.dsc-item{display:grid;grid-template-columns:3.5rem minmax(0,1fr) auto;gap:clamp(1rem,3vw,2.5rem);align-items:start;padding:clamp(1.6rem,3vw,2.4rem) 0;border-bottom:1px solid var(--line)}
.dsc-n{font-family:"Cormorant Garamond",serif;font-size:2rem;line-height:1;color:var(--gold-deep)}
.dsc-main h2{font-size:clamp(1.5rem,2.8vw,2.1rem);margin:.45rem 0 .6rem;text-wrap:balance}
.dsc-main p{margin:0 0 .7rem;color:var(--ink-soft);max-width:62ch;text-wrap:pretty}
.dsc-by{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--ink-faint)}
.dsc-dl{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;padding:.8rem 1.2rem;border:1px solid var(--reed-deep);border-radius:999px;color:var(--reed-deep);white-space:nowrap;transition:background .2s,color .2s}
.dsc-dl span{font-weight:600;font-size:.92rem}.dsc-dl small{font-size:.75rem;opacity:.8}
.dsc-dl:hover{background:var(--reed-deep);color:var(--paper)}
.dsc-foot{margin-top:2rem}
@media (max-width:700px){.dsc-item{grid-template-columns:minmax(0,1fr)}.dsc-n{font-size:1.5rem}.dsc-dl{justify-self:start}}

.dsc-read{display:inline-block;margin-left:1rem;font-weight:600;font-size:.92rem;color:var(--reed-deep);border-bottom:1px solid var(--gold)}
.dsc-read:hover{color:var(--gold-deep)}
.csub{font-size:1.45rem;margin:2.2rem 0 .9rem;color:var(--reed-deep)}
.cverse{font-style:italic;line-height:1.9}
.ctoc-dl{margin-top:1.4rem}

.cpeople{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.4rem;margin:1.6rem 0 2rem}
.cperson{padding:1.3rem;border:1px solid var(--line);border-radius:10px;background:var(--paper-2)}
.cperson img{width:84px;height:84px;object-fit:cover;border-radius:50%;filter:sepia(.25);margin-bottom:.9rem}
.cini{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--reed-deep);color:var(--paper);font-family:"Cormorant Garamond",serif;font-size:1.8rem;margin-bottom:.9rem}
.cperson h3{font-size:1.35rem;margin:0 0 .3rem}.cperson p{font-size:.92rem;color:var(--ink-soft);margin:.6rem 0 0;text-wrap:pretty}
.cdoc-dl{display:flex;flex-direction:column;gap:.3rem;margin:1.6rem 0;padding:1.2rem 1.4rem;border:1px solid var(--line);border-radius:10px;background:var(--paper-2);color:var(--ink);transition:border-color .2s}
.cdoc-dl b{font-family:"Cormorant Garamond",serif;font-size:1.4rem;font-weight:600}.cdoc-dl span:not(.eyebrow){font-size:.9rem;color:var(--ink-soft)}
.cdoc-dl em{font-style:normal;font-weight:600;font-size:.9rem;color:var(--reed-deep)}.cdoc-dl:hover{border-color:var(--gold)}

.nmlc-h{font-size:clamp(2rem,4vw,3rem);margin:.6rem 0 0;text-wrap:balance}.nmlc-h em{color:var(--reed-deep)}
.nmlc-people{padding-top:0}.nmlc-people .cpeople{margin-top:1.2rem}

/* ===== Toponímia ===== */
.ctags{margin:1.6rem 0;padding:1.2rem 1.4rem;border:1px solid var(--line);border-radius:10px;background:var(--paper-2)}
.ctags ul{list-style:none;margin:.8rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.ctags li{white-space:nowrap;padding:.3rem .75rem;border:1px solid var(--line);border-radius:999px;background:var(--paper);font-size:.88rem;color:var(--ink-soft)}
.cdl{margin:1.4rem 0 2rem}.cdl-i{padding:1.1rem 0;border-top:1px solid var(--line)}.cdl-i:last-child{border-bottom:1px solid var(--line)}
.cdl dt{font-family:"Cormorant Garamond",serif;font-size:1.35rem;font-weight:600;color:var(--reed-deep);margin-bottom:.3rem}
.cdl dd{margin:0;color:var(--ink-soft);text-wrap:pretty}
.ctl-q{width:100%;padding:.8rem 1.1rem;border:1px solid var(--line);border-radius:999px;background:var(--paper);font:inherit;color:var(--ink);margin:.4rem 0 1.2rem}
.ctl-q:focus{outline:2px solid var(--gold);outline-offset:1px}
.ctl-list{list-style:none;margin:0;padding:0;columns:3 200px;column-gap:1.6rem}
.ctl-list li{display:flex;gap:.6rem;break-inside:avoid;padding:.28rem 0;border-bottom:1px dotted var(--line);font-size:.92rem;color:var(--ink-soft)}
.ctl-list b{min-width:2.2rem;font-variant-numeric:tabular-nums;color:var(--gold-deep);font-weight:600}
.ctl-none{color:var(--ink-faint);font-style:italic}

.phead-long{align-items:start}.phead-long>div:first-child{position:sticky;top:110px}
@media (max-width:900px){.phead-long>div:first-child{position:static}}

/* ===== Presentació (crèdits) ===== */
.mission-side{position:sticky;top:110px}
.mission-note{font-style:italic;color:var(--ink-faint)!important;border-top:1px solid var(--line);padding-top:1.1rem;margin-top:1.6rem!important}
.mission-cards{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(1.2rem,3vw,2rem);margin-top:clamp(2.5rem,5vw,4rem)}
.m-author,.m-collab{padding:clamp(1.4rem,3vw,2rem);border:1px solid var(--line);border-radius:12px;background:var(--paper-2)}
.m-author{display:grid;grid-template-columns:130px minmax(0,1fr);gap:1.6rem;align-items:start}
.m-author img{width:130px;aspect-ratio:3/4;object-fit:cover;border-radius:8px;filter:sepia(.2)}
.m-author h3,.m-collab h3{font-size:1.7rem;margin:.4rem 0 .7rem}
.m-author p:not(.eyebrow),.m-collab p:not(.eyebrow){color:var(--ink-soft);margin:0 0 .8rem;font-size:.98rem;text-wrap:pretty}
.m-since{display:inline-block;margin-top:.3rem;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--gold-deep)}
.m-collab{display:flex;flex-direction:column;align-items:flex-start;background:var(--reed-deep);border-color:var(--reed-deep)}
.m-collab .eyebrow{color:var(--gold)}.m-collab h3{color:var(--paper)}.m-collab p:not(.eyebrow){color:oklch(.92 .015 85)!important}
.m-collab .btn{margin-top:auto}
@media (max-width:900px){.mission-side{position:static}.mission-cards{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.m-author{grid-template-columns:minmax(0,1fr)}}
.credits{background:var(--paper);border-top:1px solid var(--line)}.credits .section-head .eyebrow{display:none}.credits .mission-cards{margin-top:1.5rem}
.dcard.dark .bg::after{background:linear-gradient(180deg,oklch(.16 .02 60/.25) 0%,oklch(.14 .02 60/.72) 30%,oklch(.12 .02 60/.9) 100%)}

/* ===== Mapa del lloc ===== */
.smap{background:var(--paper);padding:clamp(2rem,5vw,4rem) 0 clamp(4rem,8vw,6rem)}
.smap-tools{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.6rem}
.smap-btn{white-space:nowrap;line-height:1.2;display:inline-flex;align-items:center;width:auto;font:inherit;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;padding:.5rem 1rem;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink-soft);cursor:pointer}
.smap-btn:hover{border-color:var(--reed-deep);color:var(--reed-deep)}
.smap-tree ul{list-style:none;margin:0;padding:0}
.smap-root{display:grid;gap:.4rem;max-width:860px}
.smap-root>li{border-top:1px solid var(--line);padding:.9rem 0}
.smap-root>li>details>summary,.smap-root>li.leaf>*{font-family:"Cormorant Garamond",serif;font-size:clamp(1.6rem,3vw,2.1rem);font-weight:600;color:var(--ink)}
.smap-tree li li{position:relative;padding-left:1.6rem}
.smap-tree li ul{margin:.3rem 0 .4rem .55rem;border-left:1px solid var(--line)}
.smap-tree li li::before{content:"";position:absolute;left:0;top:1.05em;width:1.1rem;border-top:1px solid var(--line)}
.smap-tree li li>details>summary,.smap-tree li li.leaf>*{font-size:1.06rem;line-height:1.5;padding:.28rem 0;display:inline-block}
.smap-tree li li li>details>summary,.smap-tree li li li.leaf>*{font-size:.98rem;color:var(--ink-soft)}
.smap-tree summary{cursor:pointer;list-style:none;display:flex!important;align-items:baseline;gap:.6rem}
.smap-tree summary::-webkit-details-marker{display:none}
.smap-tree summary::before{content:"+";flex:none;width:1.1rem;font-family:"Spectral",serif;font-weight:500;color:var(--gold-deep)}
.smap-tree details[open]>summary::before{content:"–"}
.smap-tree a{color:var(--reed-deep);text-decoration:none}
.smap-tree a:hover{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}
.smap-n{font-family:"Spectral",serif;font-size:.72rem;font-weight:600;letter-spacing:.06em;color:var(--ink-faint);border:1px solid var(--line);border-radius:999px;padding:0 .5rem;line-height:1.6}
.smap-tree .soon{color:var(--ink-faint)}
.smap-tree .soon::after,.smap-dot{content:"";display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--gold);margin-left:.5rem;vertical-align:middle}
.smap-legend{display:flex;align-items:center;gap:.2rem;font-size:.92rem;color:var(--ink-faint)!important}
.smap-legend .smap-dot{margin:0 .5rem 0 0}
.footer .ex{gap:1.6rem}.footer .ex-fig{margin:0;flex:none;width:112px;display:flex;flex-direction:column;gap:.5rem}.footer .ex-fig img{width:100%;border-radius:6px;filter:saturate(.6)}.footer .ex-fig figcaption{font-size:.72rem;line-height:1.35;font-style:italic;color:oklch(.72 .015 80)}.footer .ex .cap{padding-left:1.6rem;border-left:1px solid oklch(.4 .015 80)}
.cperson.wide{grid-column:1/-1}
.cmore{margin-top:1rem;border-top:1px solid var(--line);padding-top:.9rem}
.cmore summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--reed-deep)}
.cmore summary::-webkit-details-marker{display:none}.cmore summary::before{content:"+";font-size:1.1rem;color:var(--gold-deep)}.cmore[open] summary::before{content:"–"}
.cmore-body{margin-top:1.2rem;max-width:760px}.cmore-body p{font-size:1rem!important;line-height:1.7;margin:0 0 1rem!important}
.cmore-body h4{font-family:"Cormorant Garamond",serif;font-size:1.5rem;font-weight:600;margin:1.8rem 0 .8rem}
.cmore-fig{margin:0 0 1.4rem}.cmore-fig img{width:100%;height:auto!important;border-radius:6px!important;filter:none!important;margin:0!important}.cmore-fig figcaption{font-size:.82rem;font-style:italic;color:var(--ink-faint);margin-top:.4rem}
.ctoc li.sub{padding-left:1rem}.ctoc li.sub a{font-size:.9em;color:var(--ink-faint)}
.cgrid.portrait{align-items:start}.cgrid.portrait img{aspect-ratio:auto!important;height:auto!important;object-fit:contain!important}
.cgrid.portrait .cimg,.cgrid.portrait .cfig{aspect-ratio:auto!important;height:auto!important}

.cbyline{margin:-.6rem 0 1.6rem!important;font-size:.82rem!important;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--gold-deep)!important}
.toc-by{display:block;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;opacity:.75;margin-top:.15rem}


.exl-right{flex-shrink:0;display:block;width:34px;height:47px;margin-left:1rem;border:1px solid var(--line);border-radius:3px;overflow:hidden;opacity:.85;transition:opacity .2s,width .3s,height .3s}
.exl-right:hover{opacity:1}
.exl-right img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply;filter:sepia(.25)}
.masthead.compact .exl-right{width:28px;height:39px}
@media (max-width:1024px){.exl-right{margin-left:auto;margin-right:.6rem}.exl-right~.burger{margin-left:0}}

.cbody .cfig.fleft{float:left;width:min(40%,230px);margin:.35rem 1.8rem 1rem 0}
.cbody h2,.cbody h3,.cbody .cgrid,.cbody .cdoc-dl{clear:both}
@media (max-width:560px){.cbody .cfig.fleft{float:none;width:min(70%,260px);margin:0 auto 1.4rem}}

.apic.apic-full{background:var(--paper-2)}
.apic.apic-full img{object-fit:contain;padding:clamp(.8rem,2vw,1.4rem);filter:none}

.tabs-bar .tabs{flex-wrap:wrap;overflow-x:visible;row-gap:.2rem}

.ctable{margin:1.4rem 0;overflow-x:auto}.ctable table{border-collapse:collapse;font-size:.95rem;font-variant-numeric:tabular-nums}.ctable th,.ctable td{padding:.25rem 1.6rem .25rem 0;text-align:left;white-space:nowrap}.ctable th{border-bottom:1px solid var(--line);font-weight:600}.ctable tr:last-child td{border-top:1px solid var(--line);font-weight:600}

/* NOVETATS amagat: esborrar aquesta línia per activar-lo */
[data-nov]{display:none!important}

/* Hero contrast variants */
[data-hero="a"] .hero .scrim{background:linear-gradient(180deg,oklch(.96 .02 80/.15) 0%,oklch(.96 .02 80/.35) 35%,oklch(.96 .02 80/.88) 62%,oklch(.96 .02 80/.97) 100%)}
[data-hero="a"] .hero .wrap,[data-hero="a"] .hero h1{color:oklch(.22 .03 50)}
[data-hero="a"] .hero h1 em{color:oklch(.42 .11 40)}
[data-hero="a"] .hero .eyebrow{color:oklch(.42 .11 40);font-weight:600}
[data-hero="a"] .hero .lede{color:oklch(.28 .03 50)}
[data-hero="a"] .hero .meta .stat b{color:oklch(.22 .03 50)}[data-hero="a"] .hero .meta .stat span{color:oklch(.38 .03 50)}
[data-hero="b"] .hero .scrim{background:linear-gradient(180deg,oklch(.16 .02 50/.45) 0%,oklch(.16 .02 50/.55) 30%,oklch(.14 .02 50/.9) 60%,oklch(.12 .02 50/.97) 100%)}
[data-hero="b"] .hero .eyebrow{color:oklch(.86 .13 85);font-weight:600}
[data-hero="b"] .hero h1 em{color:oklch(.86 .13 85)}
[data-hero="b"] .hero .lede{color:oklch(.96 .01 80)}
[data-hero="c"] .hero .scrim{background:none}
[data-hero="c"] .hero .wrap{background:oklch(.97 .015 80/.94);color:oklch(.22 .03 50);border-radius:14px;padding:clamp(1.5rem,4vw,2.5rem);margin:0 auto clamp(1rem,4vw,3rem);width:min(100% - 2rem,1100px);box-shadow:0 10px 40px oklch(.2 .02 50/.25)}
[data-hero="c"] .hero h1{color:oklch(.22 .03 50)}[data-hero="c"] .hero h1 em{color:oklch(.42 .11 40)}
[data-hero="c"] .hero .eyebrow{color:oklch(.42 .11 40);font-weight:600}
[data-hero="c"] .hero .lede{color:oklch(.3 .03 50)}
[data-hero="c"] .hero .meta .stat b{color:oklch(.22 .03 50)}[data-hero="c"] .hero .meta .stat span{color:oklch(.38 .03 50)}

/* Light hero variants */
[data-hero="d"] .hero .scrim{background:linear-gradient(180deg,oklch(.98 .01 85/.35) 0%,oklch(.98 .01 85/.6) 40%,oklch(.98 .01 85/.9) 70%,oklch(.98 .01 85/.98) 100%)}
[data-hero="d"] .hero .wrap,[data-hero="d"] .hero h1{color:oklch(.2 .03 50)}
[data-hero="d"] .hero h1 em{color:oklch(.42 .12 40)}
[data-hero="d"] .hero .eyebrow{color:oklch(.4 .12 40);font-weight:700}
[data-hero="d"] .hero .lede{color:oklch(.26 .03 50)}
[data-hero="d"] .hero .meta .stat b{color:oklch(.2 .03 50)}[data-hero="d"] .hero .meta .stat span{color:oklch(.34 .03 50)}
[data-hero="d"] .hero .divider{background:oklch(.2 .03 50/.25)}
[data-hero="e"] .hero .scrim{background:linear-gradient(180deg,oklch(.98 .01 85/.6) 0%,oklch(.98 .01 85/.8) 40%,oklch(.98 .01 85/.95) 70%,oklch(.98 .01 85/.98) 100%)}
[data-hero="e"] .hero .wrap,[data-hero="e"] .hero h1{color:oklch(.2 .03 50)}
[data-hero="e"] .hero h1 em{color:oklch(.42 .12 40)}
[data-hero="e"] .hero .eyebrow{color:oklch(.4 .12 40);font-weight:700}
[data-hero="e"] .hero .lede{color:oklch(.26 .03 50)}
[data-hero="e"] .hero .meta .stat b{color:oklch(.2 .03 50)}[data-hero="e"] .hero .meta .stat span{color:oklch(.34 .03 50)}
[data-hero="e"] .hero .divider{background:oklch(.2 .03 50/.25)}
[data-hero="f"] .hero .scrim{background:linear-gradient(180deg,oklch(.98 .01 85/.85) 0%,oklch(.98 .01 85/.92) 40%,oklch(.98 .01 85/.97) 70%,oklch(.98 .01 85/.98) 100%)}
[data-hero="f"] .hero .wrap,[data-hero="f"] .hero h1{color:oklch(.2 .03 50)}
[data-hero="f"] .hero h1 em{color:oklch(.42 .12 40)}
[data-hero="f"] .hero .eyebrow{color:oklch(.4 .12 40);font-weight:700}
[data-hero="f"] .hero .lede{color:oklch(.26 .03 50)}
[data-hero="f"] .hero .meta .stat b{color:oklch(.2 .03 50)}[data-hero="f"] .hero .meta .stat span{color:oklch(.34 .03 50)}
[data-hero="f"] .hero .divider{background:oklch(.2 .03 50/.25)}
.ctoc li.annex{margin-top:1rem;padding-top:.9rem;border-top:1px dashed var(--line)}.ctoc li.annex a{font-style:italic;color:var(--gold-deep);font-weight:600}

.drawer nav h4{font-family:var(--display);font-size:1.45rem;letter-spacing:0;text-transform:none;color:var(--ink);font-weight:400;margin:0;padding:.45rem 1.6rem .45rem 0;border-bottom:1px solid var(--line-soft);cursor:pointer;position:relative;user-select:none}
.drawer nav h4::after{content:"";position:absolute;right:.3rem;top:50%;width:.5rem;height:.5rem;border-right:2px solid var(--gold-deep);border-bottom:2px solid var(--gold-deep);transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.drawer nav h4.open::after{transform:translateY(-30%) rotate(-135deg)}
.drawer nav h4+.sub{display:none;padding:.3rem 0 .6rem}
.drawer nav h4.open+.sub{display:block}

.cy-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.cy-tabs a{padding:.35rem .9rem;border:1px solid currentColor;border-radius:999px;font-size:.95rem;text-decoration:none;color:inherit;opacity:.85}
.cy-tabs a[aria-current="page"]{opacity:1;background:var(--paper,#f4efe4);color:var(--ink,#222)}
.csep{display:block;text-align:center;letter-spacing:.6em;opacity:.55;margin:1.6rem 0}

.cy-secs{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;margin-top:1rem;font-size:1.15rem}
.cy-secs a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.1rem}
.cy-secs a:hover{opacity:.75}

.cbody .ct{font-style:italic}.cbody .ct em{font-style:italic}