/* Shared opening styles, loaded on the homepage and the portada preview. */
@font-face { font-family: 'Yellowtail'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/yellowtail-latin-v1.woff2') format('woff2'); }
/* The skyline, stars and reading texture come from the shared site background. */
.claba-portada-lab, .claba-home-opening--hero { --pl-ink: #f4f2fc; --pl-muted: #c1cada; --pl-cyan: #94f4f2; --pl-pink: #f14acb; --pl-line: #8bb7d13d; }
.claba-portada-lab .pl-main { padding: 0; }
.pl-main *, .pl-header * { box-sizing: border-box; }
.pl-width { box-sizing: border-box; width: min(1320px, calc(100% - 80px)); margin-inline: auto; }
.pl-header { position: relative; z-index: 20; display: flex; align-items: center; gap: 28px; min-height: 92px; margin-top: 30px; padding: 10px 32px; border: 1px solid #739ac32c; border-radius: 5px; background: #040a18e8; box-shadow: 0 12px 34px #02061555; }
.pl-logo { display: block; width: 184px; flex: 0 0 184px; }
.pl-logo .claba-brand-mark { width: 100%; }
.pl-brandline { margin: 0; font: 8px/1.8 'Fira Mono', monospace; letter-spacing: .17em; color: #b1bde1; }
.pl-brandline span { display: block; }
.pl-navigation { display: flex; align-items: stretch; gap: clamp(18px, 2.3vw, 36px); margin-left: auto; align-self: stretch; }
.pl-navigation a { position: relative; display: flex; align-items: center; color: #eeeefa; font: 20px 'Bebas Neue', sans-serif; text-decoration: none; }
.pl-navigation a::after { content: ''; position: absolute; bottom: 7px; left: 0; right: 0; height: 2px; background: var(--pl-pink); transform: scaleX(0); transition: transform .2s; }
.pl-navigation a[aria-current]::after, .pl-navigation a:hover::after { transform: scaleX(1); }
.pl-search-shortcut { display: grid; place-items: center; min-width: 44px; min-height: 44px; color: #f4efff; }
.pl-mobile-menu { display: none; }
.pl-skip { position: fixed; z-index: 10050; top: 12px; left: 15px; padding: 12px 18px; background: #07172a; color: white; transform: translateY(-150%); }
.pl-skip:focus { transform: none; }
.pl-hero { position: relative; isolation: isolate; margin-top: -123px; padding-top: 123px; overflow: clip; }
.pl-hero-art { position: absolute; top: 0; left: 50%; width: min(1536px, 100%); aspect-ratio: 3/2; transform: translateX(-50%); z-index: -3; display: block; pointer-events: none; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 90%, transparent), linear-gradient(#000 45%, transparent 96%); mask-composite: intersect; }
/* PC Fútbol preview: keep Robinson and the entire ball opaque; fade only below it.
   The ball ends at ~77% of the 1536×1024 artwork; the jacket ends at ~91%. */
.claba-portada-lab .pl-hero-art[data-game-id="5542"] {
    -webkit-mask-image: linear-gradient(#000 77%, transparent 91%);
    mask-image: linear-gradient(#000 77%, transparent 91%);
}
.pl-hero-art img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center top; }
.pl-hero-shade { position: absolute; inset: 0; z-index: -2; pointer-events: none; background: linear-gradient(180deg, transparent 30%, #050c1852 65%, transparent 100%); }
.pl-hero-content { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 40px; align-items: end; padding-top: clamp(240px, 20vw, 310px); padding-bottom: 34px; }
.pl-intro { min-width: 0; position: relative; z-index: 2; text-shadow: 0 2px 5px #020615, 0 4px 18px #020615; }
.pl-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; color: #b6dbec; font: 10px/1.7 'Fira Mono', monospace; letter-spacing: .2em; text-transform: uppercase; }
body.claba-portada-lab .pl-intro h1, body .claba-home-opening--hero .pl-intro h1 { font: 400 clamp(52px, 4.8vw, 74px)/1.02 'Bebas Neue', sans-serif; letter-spacing: -.015em; margin: 0 0 22px; color: var(--pl-ink); text-shadow: 0 3px 20px #010513d9; }
.pl-intro h1 em, body .claba-home-opening--hero .pl-intro h1 em { display: block; font-style: normal; color: var(--pl-cyan); font-size: .94em; width: max-content; max-width: 116%; }
.pl-intro-text { max-width: 550px; margin: 0 0 27px; color: #d7deea; font: 16px/1.75 'Fira Sans', sans-serif; text-shadow: 0 2px 8px #000; }
.pl-actions { display: flex; gap: 16px; align-items: stretch; }
body .pl-button { display: inline-flex; justify-content: space-between; align-items: center; gap: 22px; flex: 0 0 auto; padding: 15px 22px; min-height: 52px; border: 1px solid #ff90e0; border-radius: 4px; background: linear-gradient(135deg, #b80b91, #d02aa8); box-shadow: inset 0 0 0 3px #f278d229, 0 0 25px #ee26b824; color: #fff; font: 22px/1 'Bebas Neue', sans-serif; letter-spacing: .025em; text-decoration: none; transition: transform .2s, box-shadow .2s; }
body .pl-button:hover { color: white; transform: translateY(-2px); box-shadow: inset 0 0 0 3px #f278d249, 0 4px 30px #ee26b847; }
.pl-button svg { width: 23px; flex-shrink: 0; }
.pl-terminal { position: relative; display: flex; align-items: center; flex: 1; min-width: 190px; border: 1px solid #8ca5ca66; border-radius: 4px; background: #030b1cbd; box-shadow: inset 0 1px #dbedff09; transition: border-color .2s, box-shadow .2s; }
.pl-terminal:focus-within { border-color: var(--pl-cyan); box-shadow: 0 0 0 2px #91ece62e; }
.pl-prompt { margin-left: 14px; font: 17px 'Fira Mono', monospace; color: var(--pl-cyan); }
body .pl-terminal input[type=search] { display: block; width: 100%; height: 52px; padding: 0 7px; min-width: 0; background: transparent; border: 0; outline: 0; box-shadow: none; font: 12px 'Fira Mono', monospace; color: #e7faff; }
.pl-terminal input::placeholder { color: #bdcfe5; opacity: 1; }
.pl-terminal.is-typing input::placeholder { color: transparent; }
.pl-terminal button { display: grid; place-items: center; flex: 0 0 40px; align-self: stretch; padding: 0; border: 0; background: transparent; color: var(--pl-cyan); cursor: pointer; }
.pl-terminal button svg { width: 19px; }
.pl-terminal-ghost { display: none; position: absolute; left: 33px; right: 42px; overflow: hidden; white-space: nowrap; pointer-events: none; color: #bcd4e8; font: 11px 'Fira Mono', monospace; }
.pl-terminal.is-typing .pl-terminal-ghost { display: flex; align-items: center; gap: 3px; }
.pl-terminal:focus-within .pl-terminal-ghost { display: none; }
.pl-terminal-ghost i { width: 6px; height: 13px; flex: 0 0 6px; background: var(--pl-cyan); animation: pl-caret 1s steps(2, jump-none) infinite; }
.pl-signature { margin: 24px 0 0 4px; color: #ff8cde; font: 400 34px/1.05 'Yellowtail', cursive; letter-spacing: 0; transform: rotate(-6deg); width: fit-content; text-shadow: 0 2px 3px #09031a, 0 0 12px #ed39c966, 0 0 26px #c1209b33; }
.pl-signature span { display: block; margin-left: 25px; }
.pl-feature { display: grid; grid-template-columns: minmax(0, 1fr) 225px; gap: 18px; align-items: end; min-width: 0; padding-bottom: 23px; }
.pl-feature-copy { min-width: 0; text-shadow: 0 2px 6px #020615, 0 4px 18px #020615; }
.pl-feature .pl-eyebrow { font-size: 9px; letter-spacing: .08em; gap: 7px; }
.pl-feature .pl-eyebrow svg { width: 15px; height: 15px; color: var(--pl-pink); fill: var(--pl-pink); }
body .pl-feature h2 { color: white; font: 36px/1.03 'Bebas Neue', sans-serif; letter-spacing: 0; margin: 0 0 14px; text-shadow: 0 2px 12px #020615; }
.pl-feature-copy > p:not(.pl-eyebrow) { color: #c8d3e2; font: 14px/1.65 'Fira Sans', sans-serif; margin: 0 0 18px; }
.pl-chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.pl-chips li { margin: 0; padding: 0; font: 10px 'Fira Mono', monospace; text-transform: uppercase; }
.pl-chips :is(a,span) { display: inline-flex; align-items: center; min-height: 32px; padding: 7px 12px; border: 1px solid #92a6c04d; border-radius: 3px; background: #040b1ba6; color: #e1e4f0; text-decoration: none; transition: border-color .18s, background-color .18s, color .18s; }
.pl-chips a:hover, .pl-chips a:focus-visible { border-color: var(--pl-cyan); color: var(--pl-cyan); background: #123044; text-decoration: underline; text-underline-offset: 3px; }
.pl-feature-side { min-width: 0; }
.pl-cover { display: block; position: relative; width: 100%; margin: 0 0 25px; border-radius: 3px; perspective: 900px; text-decoration: none; }
.pl-cover-surface { display: block; position: relative; overflow: hidden; border-radius: inherit; background: #101822; box-shadow: 0 12px 26px #0007, 0 2px 5px #0005; transform: translateY(0); transition: transform .28s cubic-bezier(.2,.7,.25,1); }
.pl-cover-surface::after { content: ''; position: absolute; inset: 0; border: 1px solid #dceeff36; border-radius: inherit; pointer-events: none; }
.pl-cover-surface img { display: block; width: 100%; height: auto; object-fit: contain; user-select: none; }
.pl-cover-shine { position: absolute; inset: -50%; pointer-events: none; background: linear-gradient(115deg, transparent 35%, #e4f5ff0a 42%, #fff5 49%, #e4f5ff0a 56%, transparent 63%); opacity: .1; transform: translate3d(var(--cover-light-x, -18%), var(--cover-light-y, -12%), 0); transition: opacity .25s, transform .22s ease-out; }
.pl-cover:focus-visible .pl-cover-surface::after { border-color: var(--pl-cyan); }
.pl-cover:focus-visible .pl-cover-shine { opacity: .35; }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
    .pl-cover:hover .pl-cover-surface, .pl-cover:focus-visible .pl-cover-surface { transform: translateY(-4px) rotateX(var(--cover-rx, 0deg)) rotateY(var(--cover-ry, 0deg)) scale(1.025); }
    .pl-cover:hover .pl-cover-shine { opacity: .65; }
    .pl-cover.is-tracking .pl-cover-surface { transition-duration: .14s; will-change: transform; }
}
.pl-rating { display: flex; align-items: center; gap: 9px; margin: 0 0 18px; color: #f6f1fd; }
.pl-rating > svg { color: #ffd369; fill: #ffd369; width: 29px; height: 29px; filter: drop-shadow(0 0 7px #edb34245); }
.pl-rating strong { font: 36px/1 'Bebas Neue', sans-serif; }
.pl-rating > span { font: 13px/1.5 'Fira Sans', sans-serif; color: #c6cbdf; }
.pl-rating small { display: block; font-size: 10px; }
body .pl-button-small { width: 100%; min-height: 44px; padding: 12px 14px; font-size: 20px; gap: 10px; }
.pl-quick { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border: 1px solid #71c9e647; border-radius: 4px; background: #060f1ed6; margin-top: 9px; }
.pl-quick a { position: relative; display: flex; align-items: center; gap: 18px; min-width: 0; padding: 27px 24px; color: var(--pl-cyan); text-decoration: none; }
.pl-quick a+a::before { content: ''; position: absolute; left: 0; top: 28%; bottom: 28%; width: 1px; background: #a3b6e04a; }
.pl-quick a:nth-child(2), .pl-quick a:nth-child(5) { color: var(--pl-pink); }
.pl-quick a:nth-child(3) { color: #b593ff; }
.pl-quick svg { width: 32px; height: 32px; flex-shrink: 0; }
.pl-quick small { display: block; color: #adc1d9; font: 8px/1.7 'Fira Mono', monospace; letter-spacing: .02em; }
.pl-quick strong { display: block; color: #e6eaf7; font: 20px/1.1 'Bebas Neue', sans-serif; font-weight: 400; }
.pl-quick a:hover { background: #8edfde09; }
.pl-stories { padding-top: 60px; padding-bottom: 42px; }
.pl-stories-heading { display: grid; grid-template-columns: 1.4fr 1fr auto; align-items: end; gap: 35px; margin-bottom: 25px; }
.pl-stories-heading .pl-eyebrow::before { content: ''; width: 9px; height: 9px; background: var(--pl-pink); }
body .pl-stories-heading h2 { font: 58px/.94 'Bebas Neue', sans-serif; letter-spacing: 0; color: var(--pl-ink); margin: 0; }
.pl-stories-heading > p { font: 14px/1.6 'Fira Sans', sans-serif; color: #c3cee0; margin: 0 0 4px; max-width: 290px; }
body .pl-text-link { display: inline-flex; align-items: center; justify-content: flex-end; gap: 16px; min-height: 40px; color: #f46dd2; font: 16px 'Bebas Neue', sans-serif; letter-spacing: .04em; text-decoration: none; }
.pl-text-link svg { width: 20px; }
.pl-stories-heading > .pl-text-link { border-bottom: 1px solid var(--pl-line); padding-bottom: 6px; }
.pl-stories-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 16px 22px; }
.pl-story { display: grid; grid-template-columns: minmax(150px,.85fr) minmax(0,1.15fr); min-width: 0; border: 1px solid var(--pl-line); border-radius: 6px; background: #0a1321b8; overflow: hidden; transition: border-color .2s, transform .2s; }
.pl-story:hover { transform: translateY(-3px); border-color: #a3e2e580; }
.pl-story-lead { grid-row: span 2; display: flex; flex-direction: column; }
.pl-story-image { display: block; overflow: hidden; min-height: 170px; }
.pl-story-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pl-story-lead .pl-story-image { aspect-ratio: 16/8; min-height: 0; }
.pl-story-copy { display: flex; flex-direction: column; min-width: 0; padding: 19px 20px 12px; }
.pl-story-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: #a9dce6; font: 8px/1.7 'Fira Mono', monospace; text-transform: uppercase; margin: 0 0 10px; }
body .pl-story h3 { font: 27px/1.03 'Bebas Neue', sans-serif; color: var(--pl-ink); margin: 0 0 10px; letter-spacing: 0; }
.pl-story h3 a { color: inherit; text-decoration: none; }
body .pl-story-lead h3 { font-size: 33px; }
.pl-story-copy > p:not(.pl-story-meta) { font: 13px/1.6 'Fira Sans', sans-serif; color: #c0cada; margin: 0 0 6px; }
.pl-story .pl-text-link { margin-top: auto; font-size: 14px; }
.pl-lab-note { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding-block: 22px; border-top: 1px solid var(--pl-line); color: #a7b8ce; }
.pl-lab-note > span { font: 9px 'Fira Mono', monospace; letter-spacing: .09em; }
.pl-lab-note p { font: 13px/1.6 'Fira Sans', sans-serif; margin: 0; }
.pl-lab-note a { display: flex; align-items: center; gap: 12px; font: 14px 'Fira Sans', sans-serif; margin-left: auto; }
.pl-lab-note svg { width: 18px; }
.pl-main :is(a,button,input):focus-visible, .pl-header :is(a,summary):focus-visible { outline: 2px solid var(--pl-cyan); outline-offset: 5px; }
@keyframes pl-caret { to { opacity: 0; } }
@keyframes pl-arrive { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion:no-preference) {
    .pl-hero-art { animation: pl-art-fadeinup 1.2s .1s cubic-bezier(.22,1,.36,1) backwards; }
    @keyframes pl-art-fadeinup { from { opacity: 0; translate: 0 36px; } to { opacity: 1; translate: 0 0; } }
    .pl-intro { animation: pl-arrive .8s .1s backwards; }
    .pl-feature-copy { animation: pl-arrive .8s .3s backwards; }
    .pl-cover { animation: pl-arrive .65s .3s backwards; }
}
@media (max-width:1199px) {
    .pl-width { width: calc(100% - 48px); }
    .pl-header { gap: 18px; padding-inline: 22px; }
    .pl-brandline { display: none; }
    .pl-hero-content { gap: 30px; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); }
    .pl-feature { grid-template-columns: minmax(0,1fr) 150px; gap: 12px; }
    body .pl-feature h2 { font-size: 30px; }
    .pl-actions { flex-wrap: wrap; }
    .pl-terminal { max-width: 320px; }
    .pl-quick a { padding: 23px 17px; gap: 11px; }
    .pl-quick strong { font-size: 18px; }
    .pl-quick small { font-size: 7px; }
    .pl-stories-heading { grid-template-columns: 1fr 1fr; }
    .pl-stories-heading > .pl-text-link { grid-column: 2; justify-self: end; }
    .pl-stories-heading > div { grid-row: span 2; }
}
@media (max-width:959px) {
    .pl-navigation { gap: 22px; }
    .pl-logo { width: 160px; flex-basis: 160px; }
    .pl-hero-content { grid-template-columns: 1fr; padding-top: 260px; gap: 38px; }
    .pl-intro { max-width: 690px; }
    .pl-intro h1 em, body .claba-home-opening--hero .pl-intro h1 em { max-width: 100%; width: auto; }
    .pl-hero-art { width: 1200px; left: 50%; transform: translateX(-61%); mask-image: linear-gradient(#000 30%, transparent 78%); }
    .pl-feature { width: min(500px,100%); grid-template-columns: 1fr 160px; justify-self: end; padding: 0; }
    .pl-feature-copy { padding-bottom: 8px; }
    .pl-cover { margin-top: -60px; }
    .pl-quick { grid-template-columns: repeat(3,1fr); }
    .pl-quick a { padding: 22px; }
    .pl-quick a:nth-child(4),.pl-quick a:nth-child(5) { border-top: 1px solid var(--pl-line); }
    .pl-quick a:nth-child(4)::before { display: none; }
    .pl-stories-grid { grid-template-columns: 1fr 1fr; }
    .pl-story { display: flex; flex-direction: column; }
    .pl-story-lead { grid-row: auto; grid-column: 1/-1; display: grid; grid-template-columns: 1fr 1fr; }
    .pl-story-lead .pl-story-image { height: 100%; aspect-ratio: auto; }
    .pl-story:not(.pl-story-lead) .pl-story-image { aspect-ratio: 16/9; min-height: 0; }
}
@media (max-width:760px) {
    .pl-width { width: calc(100% - 32px); }
    .pl-header { min-height: 78px; padding: 8px 15px; gap: 8px; margin-top: 16px; }
    .pl-logo { width: 146px; flex-basis: 146px; margin-right: auto; }
    .pl-navigation { display: none; }
    .pl-mobile-menu { display: block; }
    .pl-mobile-menu summary { display: flex; align-items: center; gap: 9px; min-height: 44px; padding: 0 4px; list-style: none; cursor: pointer; font: 17px 'Bebas Neue',sans-serif; color: var(--pl-ink); }
    .pl-mobile-menu summary::-webkit-details-marker { display: none; }
    .pl-mobile-menu summary span { font: 19px sans-serif; }
    .pl-mobile-menu nav { position: absolute; left: -1px; right: -1px; top: calc(100% + 6px); padding: 12px 20px; border: 1px solid #92a6c05c; border-radius: 4px; background: #081122; box-shadow: 0 18px 35px #0009; }
    .pl-mobile-menu nav a { display: block; padding: 13px; font: 22px 'Bebas Neue',sans-serif; color: #e7f1fa; border-bottom: 1px solid var(--pl-line); text-decoration: none; }
    .pl-mobile-menu nav a[aria-current] { color: var(--pl-pink); }
    .pl-hero { margin-top: -94px; padding-top: 94px; }
    .pl-hero-content { padding-top: 250px; padding-bottom: 28px; gap: 32px; }
    .pl-hero-art { top: 65px; width: 810px; transform: translateX(-66%); mask-image: linear-gradient(#000 30%, transparent 85%); }
    .pl-hero-shade { background: linear-gradient(180deg, transparent 24%, #050c1859 40%, transparent 72%); }
    .pl-eyebrow { font-size: 8px; letter-spacing: .09em; }
    body.claba-portada-lab .pl-intro h1, body .claba-home-opening--hero .pl-intro h1 { font-size: clamp(43px,11.3vw,68px); line-height: 1.02; }
    .pl-intro h1 em, body .claba-home-opening--hero .pl-intro h1 em { font-size: 1em; }
    .pl-intro-text { font-size: 15px; line-height: 1.8; }
    .pl-actions { flex-direction: column; gap: 13px; }
    .pl-actions .pl-button { justify-content: space-between; }
    .pl-terminal { width: 100%; max-width: none; flex-basis: auto; }
    body .pl-terminal input[type=search] { font-size: 16px; }
    .pl-signature { font-size: 30px; margin-top: 23px; }
    .pl-feature { grid-template-columns: 1fr; width: 100%; justify-self: stretch; gap: 16px; padding: 24px 0 0; border-top: 1px solid var(--pl-line); }
    body .pl-feature h2 { max-width: 370px; font-size: 35px; }
    .pl-feature-copy > p:not(.pl-eyebrow) { max-width: 410px; }
    .pl-cover { display: none; }
    .pl-feature-side { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .pl-rating { margin: 0; }
    .pl-rating small { max-width: 85px; }
    body .pl-button-small { width: auto; flex-shrink: 0; }
    .pl-quick { grid-template-columns: 1fr 1fr; }
    .pl-quick a { padding: 20px 15px; gap: 13px; }
    .pl-quick a:nth-child(n+3) { border-top: 1px solid var(--pl-line); }
    .pl-quick a:nth-child(odd)::before { display: none; }
    .pl-quick a:nth-child(4)::before { display: block; }
    .pl-quick a:last-child { grid-column: 1/-1; justify-content: center; }
    .pl-quick small { font-size: 7px; }
    .pl-quick strong { font-size: 19px; }
    .pl-quick svg { width: 28px; height: 28px; }
    .pl-stories { padding-top: 42px; }
    .pl-stories-heading { display: block; margin-bottom: 22px; }
    body .pl-stories-heading h2 { font-size: 49px; margin-bottom: 20px; }
    .pl-stories-heading > p { max-width: 360px; margin-bottom: 12px; }
    .pl-stories-grid { display: flex; flex-direction: column; gap: 18px; }
    .pl-story-lead { display: flex; }
    .pl-story-lead .pl-story-image { aspect-ratio: 16/9; }
    .pl-story:not(.pl-story-lead) { display: grid; grid-template-columns: minmax(100px,.8fr) minmax(0,1.2fr); }
    .pl-story:not(.pl-story-lead) .pl-story-image { aspect-ratio: auto; }
    .pl-story-copy { padding: 16px 14px 10px; }
    body .pl-story h3 { font-size: 25px; }
    body .pl-story-lead h3 { font-size: 31px; }
    .pl-story-copy > p:not(.pl-story-meta) { font-size: 12px; }
    .pl-lab-note { display: block; }
    .pl-lab-note p { margin: 12px 0; }
    .pl-lab-note a { width: fit-content; margin-left: 0; }
}
@media (max-width:359px) {
    .pl-width { width: calc(100% - 24px); }
    .pl-header { padding-inline: 9px; gap: 3px; }
    .pl-logo { width: 130px; flex-basis: 130px; }
    .pl-quick a { padding: 18px 10px; gap: 8px; }
    .pl-quick strong { font-size: 17px; }
    .pl-feature-side { flex-wrap: wrap; }
    .pl-story:not(.pl-story-lead) { display: flex; }
    .pl-story:not(.pl-story-lead) .pl-story-image { aspect-ratio: 16/9; }
}
@media (prefers-reduced-motion:reduce) {
    .pl-main *, .pl-main *::before, .pl-main *::after, .pl-header * { animation: none!important; transition: none!important; scroll-behavior: auto!important; }
}

/* The live site keeps its own navigation; only the opening hosts these components.
   The inner wrapper isolates quick links from the previous opening's direct-child rules. */
body .claba-home-opening--hero { display: block; width: 100%; max-width: none; padding: 0; margin: 0; }
.claba-home-opening--hero .pl-main { padding: 0; }
.claba-home-opening--hero .pl-hero { margin-top: -50px; padding-top: 0; overflow-x: clip; overflow-y: visible; }
body .claba-home-opening--hero .pl-signature,
body .claba-home-opening--hero .pl-signature span { text-shadow: 0 2px 3px #09031a, 0 0 12px #ed39c966, 0 0 26px #c1209b33; }

/* Lift the artwork behind the live navigation, keeping links above the scene. */
.home .claba-shell-header, .home .claba-shell-header-mobile { z-index: 2; }
body.home .cb-navbar-nav > li > a { text-shadow: 2px 3px 2px black; }
.claba-home-opening--hero .pl-hero-art { top: -90px; transform: translateX(-46%); }
/* Narrow screens need their own crop to keep the characters and controls in view. */
@media (max-width: 959px) {
    .claba-home-opening--hero .pl-hero { margin-top: -30px; overflow: clip; }
    .claba-home-opening--hero .pl-hero-art { top: 0; transform: translateX(-61%); }
}
@media (max-width: 760px) {
    .claba-home-opening--hero .pl-hero-art { transform: translateX(-66%); }
}

/* One focus treatment on the terminal shell, no second white rectangle in the input. */
body .pl-terminal input[type=search]:is(:focus,:focus-visible,:active){outline:none!important;border:0!important;box-shadow:none!important;background:transparent!important}
body .pl-terminal:focus-within,body .claba-home-opening--hero .pl-terminal:focus-within{border-color:#90ddd5;box-shadow:0 0 0 2px #91ece624}

a.pl-button{text-shadow:none!important}