/* Historia is intentionally a page-specific visual system. It recreates the
   original archival timeline without Elementor or its layer-animation plugin. */
body.page-template-page-historia { background: #fff; }
.page-template-page-historia .site-main { margin-top: 0; overflow: visible; }

.history-hero { position: relative; display: grid; width: 100%; min-height: calc(162px + 790px); margin-top: -162px; padding-top: 162px; overflow: hidden; color: #fff; background: #1a1a1a 50% 50% / cover no-repeat var(--history-hero); }
.history-hero__content { position: relative; z-index: 1; display: grid; min-height: 790px; place-items: center; }
.history-hero h1 { margin: 0; color: #fff; font-family: var(--font-display); font-size: 40px; font-weight: 400; letter-spacing: 0; line-height: 45px; text-align: center; text-transform: capitalize; text-shadow: none; }

.history-timeline { overflow: visible; }
.history-entry { position: relative; min-height: 680px; padding: 140px 0; overflow: visible; background: #fff; }
.history-entry:nth-child(even) { background: #f8f8f8; }
.history-entry__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(55px, 9vw, 160px); align-items: center; min-height: 440px; }
.history-entry--copy-right .history-entry__copy { order: 2; }
.history-entry--copy-right .history-entry__visual { order: 1; }
.history-entry__copy { position: relative; z-index: 2; max-width: 470px; }
.history-entry--copy-right .history-entry__copy { justify-self: end; }
.history-entry__category { display: block; margin-bottom: 20px; color: var(--ccu-green-bright); font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: 2.88px; line-height: 1.2; text-transform: uppercase; }
.history-entry h2 { position: relative; z-index: 1; margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(5.2rem, 8.55vw, 110px); font-weight: 600; letter-spacing: 0; line-height: 1; }
.history-entry p { position: relative; z-index: 1; max-width: 470px; margin: 40px 0 0; color: #a0a0a0; font-family: var(--font-body); font-size: 17px; font-weight: 400; letter-spacing: 0; line-height: 1.6; }
.history-entry__watermark { position: absolute; z-index: 0; top: 56px; left: -164px; color: rgb(87 184 71 / 8%); font-family: var(--font-display); font-size: clamp(13rem, 23vw, 300px); font-weight: 600; letter-spacing: 0; line-height: 1; pointer-events: none; }
.history-entry--copy-right .history-entry__watermark { right: -164px; left: auto; }
.history-entry__visual { position: relative; min-height: 480px; overflow: visible; isolation: isolate; }
.history-entry__image { position: absolute; display: block; width: auto; height: auto; max-width: 100%; object-fit: contain; object-position: center; box-shadow: 0 16px 34px rgb(0 0 0 / 7%); transition: transform 850ms cubic-bezier(.2,.7,.2,1), opacity 650ms ease; }
.history-entry__image--1 { z-index: 1; top: 12px; right: 2%; max-width: min(100%, 520px); max-height: 480px; }
.history-entry__image--2 { z-index: 2; top: -28px; left: 4%; max-width: min(58%, 300px); max-height: 280px; opacity: .92; }
.history-entry__image--3 { z-index: 3; right: 4%; bottom: -12px; max-width: min(48%, 260px); max-height: 320px; box-shadow: none; }
.history-entry--copy-right .history-entry__image--1 { right: auto; left: 2%; }
.history-entry--copy-right .history-entry__image--2 { right: 4%; left: auto; }
.history-entry--copy-right .history-entry__image--3 { right: auto; left: 5%; }
.ccu-motion-enabled .history-entry__copy[data-reveal], .ccu-motion-enabled .history-entry__visual[data-reveal] { opacity: 0; transform: translateY(25px); transition: opacity 650ms ease, transform 750ms cubic-bezier(.2,.7,.2,1); }
.ccu-motion-enabled .history-entry__copy[data-reveal].is-revealed, .ccu-motion-enabled .history-entry__visual[data-reveal].is-revealed { opacity: 1; transform: none; }
.ccu-motion-enabled .history-entry__visual[data-reveal].is-revealed .history-entry__image--2 { transform: translate(9px, -7px); }
.ccu-motion-enabled .history-entry__visual[data-reveal].is-revealed .history-entry__image--3 { transform: translate(-10px, 8px); }

@media (max-width: 1024px) {
  .history-hero { min-height: calc(82px + 790px); margin-top: -82px; padding-top: 82px; }
}
@media (max-width: 900px) {
  .history-entry { min-height: 0; padding: 82px 0; }
  .history-entry__inner { gap: 42px; }
  .history-entry__visual { min-height: 380px; overflow: visible; }
  .history-entry__image--1 { max-height: 360px; max-width: min(100%, 480px); }
}
@media (max-width: 700px) {
  .history-hero { min-height: calc(82px + 590px); margin-top: -82px; padding-top: 82px; background-image: var(--history-hero-mobile); background-position: top center; background-size: cover; }
  .history-hero__content { min-height: 590px; padding: 0; }
  .history-hero h1 { font-size: clamp(2rem, 8.4vw, 2.4rem); }
  .history-entry { padding: 56px 0; }
  .history-entry__inner { display: flex; flex-direction: column; gap: 28px; align-items: stretch; }
  .history-entry--copy-right .history-entry__copy, .history-entry--copy-right .history-entry__visual { order: initial; }
  .history-entry__copy { max-width: none; overflow: visible; }
  .history-entry--copy-right .history-entry__copy { justify-self: auto; }
  .history-entry h2 { font-size: clamp(3.4rem, 16vw, 5rem); }
  .history-entry p { margin-top: 18px; font-size: 16px; }
  .history-entry__watermark { top: 36px; left: 0; font-size: clamp(4rem, 28vw, 6.5rem); }
  .history-entry--copy-right .history-entry__watermark { right: 0; }
  .history-entry__visual { min-height: 300px; overflow: visible; }
  .history-entry__image--1 { top: 12px; right: 0; max-width: 90%; max-height: 300px; }
  .history-entry__image--2 { top: -8px; left: 0; max-width: 48%; max-height: 180px; }
  .history-entry__image--3 { right: 0; bottom: -8px; max-width: 40%; max-height: 200px; }
}
@media (prefers-reduced-motion: reduce) { .history-entry__image { transition: none; } }