/* Collage Pack Hero — all rules are contained by the instance root. */
.cph {
    --cph-columns: var(--cph-desktop-columns, 5);
    --cph-radius: 28px; --cph-gap: 2px; --cph-left: 1; --cph-center: 1.15; --cph-right: 1;
    --cph-background: #172321; --cph-accent: #d6ba83; --cph-accent-width: 32px; --cph-accent-thickness: 1px;
    --cph-caption-inset: 24px; --cph-caption-offset: 36px; --cph-center-emphasis: 1.12;
    --cph-side-brightness: .88; --cph-center-brightness: 1; --cph-fit: cover; --cph-overlay: transparent;
    --cph-hover-scale: 1.045; --cph-hover-speed: 850ms; --cph-vignette: .22;
    --cph-divider-width: 1px; --cph-divider-color: #ffffff26;
    --cph-dot: #a3a7a3; --cph-dot-active: #596d5f; --cph-dot-size: 6px; --cph-dot-gap: 4px;
    --cph-nav-space: 14px; --cph-arrow-size: 38px; --cph-arrow-color: #fff; --cph-arrow-background: #10221d66;
    --cph-progress-color: #d6ba83; --cph-progress-size: 2px;
    position: relative; width: 100%; max-width: 100%; min-width: 0; isolation: isolate;
    font-family: inherit; color: #fff; -webkit-tap-highlight-color: transparent;
}
.cph, .cph * { box-sizing: border-box; }
.cph .cph__frame { position: relative; width: 100%; aspect-ratio: 16 / 9; min-height: 360px; max-height: 680px; border-radius: var(--cph-radius); overflow: hidden; isolation: isolate; background: var(--cph-background); box-shadow: 0 22px 55px -20px #172b2433; }
.cph .cph__stage { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; touch-action: pan-y pinch-zoom; }
.cph .cph__pack { position: absolute; inset: 0; display: flex; gap: var(--cph-gap); direction: ltr; visibility: hidden; pointer-events: none; }
.cph .cph__pack.is-active, .cph .cph__pack.is-leaving { visibility: visible; }
.cph .cph__pack.is-active { z-index: 2; pointer-events: auto; }
.cph .cph__pack.is-leaving { z-index: 3; pointer-events: none; }
.cph .cph__pack.is-entering { z-index: 4; }
.cph .cph__panel { flex: var(--cph-left) 1 0%; display: block; min-width: 0; height: 100%; overflow: hidden; position: relative; isolation: isolate; color: inherit; text-decoration: none; background: var(--cph-background); border: 0; border-radius: 0; }
.cph .cph__panel--center { flex-grow: var(--cph-center); }
.cph .cph__panel--right { flex-grow: var(--cph-right); }
.cph .cph__panel--fourth { flex-grow: var(--cph-fourth, 1); }
.cph .cph__panel--fifth { flex-grow: var(--cph-fifth, 1); }
.cph .cph__pack { transition: gap var(--cph-hover-speed) cubic-bezier(.22,.7,.18,1); }
.cph .cph__panel { transition: flex-grow var(--cph-hover-speed) cubic-bezier(.22,.7,.18,1), border-width var(--cph-hover-speed) ease; }
.cph .cph__navigation[hidden], .cph .cph__arrow[hidden], .cph .cph__progress[hidden] { display: none; }
/* The selected panel keeps its identity as it grows, preventing hover oscillation. */
.cph .cph__pack.is-expanded { gap: 0; }
.cph .cph__pack.is-expanded > .cph__panel { border-left-width: 0; }
.cph .cph__pack.is-expanded > .cph__panel:not(.is-expanded-panel) { flex-grow: 0; pointer-events: none; }
.cph .cph__pack.is-expanded > .cph__panel:not(.is-expanded-panel) .cph__caption { opacity: 0; }
.cph .cph__pack.is-expanded > .cph__panel.is-expanded-panel { flex-grow: 1; }
.cph .cph__pack.is-expanded .is-expanded-panel .cph__image { transform: scale(1.001); }
.cph .cph__pack.is-expanded .is-expanded-panel .cph__title { --cph-title-size: clamp(26px, 3.4vw, 46px); }
.cph:dir(rtl) .cph__panel { direction: rtl; }
.cph:dir(ltr) .cph__panel { direction: ltr; }
.cph.cph--divider .cph__panel + .cph__panel { border-left: var(--cph-divider-width) solid var(--cph-divider-color); }
.cph .cph__media { position: absolute; inset: 0; overflow: hidden; transform: translateZ(0); }
.cph .cph__image { width: 100%; height: 100%; max-width: none; display: block; object-fit: var(--cph-fit); object-position: var(--cph-focus, 50% 50%); transform: scale(1.001); filter: brightness(var(--cph-side-brightness)); transition: transform var(--cph-hover-speed) cubic-bezier(.2,.65,.2,1), filter var(--cph-hover-speed) ease; border: 0; border-radius: 0; margin: 0; }
.cph .cph__panel--center .cph__image { filter: brightness(var(--cph-center-brightness)); }
.cph .cph__shade { position: absolute; inset: 0; pointer-events: none; background: var(--cph-overlay); }
.cph.cph--caption-style-editorial .cph__shade, .cph.cph--caption-style-minimal .cph__shade { background: linear-gradient(180deg, transparent 30%, #06181418 52%, #061814ad 100%), var(--cph-overlay); }
.cph.cph--vignette .cph__frame::after { content: ''; pointer-events: none; position: absolute; inset: 0; z-index: 5; border-radius: inherit; box-shadow: inset 0 0 90px rgb(0 0 0 / var(--cph-vignette)); }
.cph .cph__caption-motion { position: absolute; inset-inline: var(--cph-caption-inset); bottom: var(--cph-caption-offset); z-index: 2; min-width: 0; max-height: calc(100% - 2 * var(--cph-caption-offset)); }
.cph.cph--caption-position-top .cph__caption-motion { top: var(--cph-caption-offset); bottom: auto; }
.cph.cph--caption-position-middle .cph__caption-motion { top: 50%; bottom: auto; translate: 0 -50%; }
.cph .cph__caption { display: block; min-width: 0; max-width: 100%; max-height: inherit; overflow: hidden; color: inherit; text-decoration: none; text-align: start; transition: transform var(--cph-hover-speed) ease, background var(--cph-hover-speed) ease, opacity 250ms ease; }
.cph .cph__caption:empty { display: none; }
.cph .cph__caption::before { display: none; content: ''; width: min(100%, var(--cph-accent-width)); height: var(--cph-accent-thickness); background: var(--cph-accent); margin-bottom: 15px; transform-origin: left; transition: transform var(--cph-hover-speed) ease; }
.cph.cph--accent .cph__caption:not(:empty)::before { display: block; }
.cph .cph__kicker, .cph .cph__title, .cph .cph__subtitle, .cph .cph__badge { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.cph .cph__kicker { font-size: 10px; font-weight: 500; line-height: 1.6; letter-spacing: .14em; text-transform: uppercase; color: #eee9dc; white-space: nowrap; margin-bottom: 9px; }
.cph .cph__title { --cph-title-size: clamp(20px, 2.4vw, 34px); font-size: var(--cph-title-size); font-weight: 500; letter-spacing: -.035em; line-height: 1.15; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; text-wrap: balance; }
.cph .cph__panel--center .cph__title { font-size: calc(var(--cph-title-size) * var(--cph-center-emphasis)); }
.cph .cph__subtitle { font-size: 12px; font-weight: 400; line-height: 1.6; color: #f3f0e0d9; white-space: nowrap; margin-bottom: 12px; }
.cph .cph__badge { font-size: 9px; line-height: 1.6; font-weight: 400; letter-spacing: .08em; color: #dfd7c5; white-space: nowrap; }
.cph:dir(rtl) .cph__kicker, .cph:dir(rtl) .cph__title, .cph:dir(rtl) .cph__badge { letter-spacing: normal; }
.cph.cph--caption-style-white .cph__caption { padding: 20px; border-radius: 12px; background: #fffdf8f7; box-shadow: 0 8px 30px #14261b14; color: #233c32; border: 1px solid #ffffff88; }
.cph.cph--caption-style-white .cph__kicker, .cph.cph--caption-style-white .cph__subtitle, .cph.cph--caption-style-white .cph__badge { color: #647164; }
.cph.cph--caption-style-glass .cph__caption { padding: 20px; border-radius: 14px; background: #ffffff17; border: 1px solid #ffffff30; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.cph.cph--caption-style-bar .cph__caption-motion { inset-inline: 0; bottom: 0; max-height: 100%; }
.cph.cph--caption-style-bar .cph__caption { padding: 25px var(--cph-caption-inset); background: #0e201dcc; }
.cph.cph--caption-style-chip .cph__caption { padding: 14px 20px; border-radius: 28px; background: #faf8efeb; color: #233c32; }
.cph.cph--caption-style-chip .cph__kicker, .cph.cph--caption-style-chip .cph__subtitle, .cph.cph--caption-style-chip .cph__badge { color: #647164; }
.cph.cph--caption-style-chip .cph__title { --cph-title-size: 20px; }
.cph.cph--caption-style-minimal .cph__kicker, .cph.cph--caption-style-minimal .cph__subtitle, .cph.cph--caption-style-minimal .cph__badge, .cph.cph--caption-style-minimal .cph__caption::before { display: none; }
.cph.cph--caption-style-editorial .cph__caption::before { margin-bottom: 18px; }
.cph .cph__progress { position: absolute; bottom: 0; inset-inline: 0; height: var(--cph-progress-size); background: #ffffff12; z-index: 8; pointer-events: none; overflow: hidden; }
.cph .cph__progress span { display: block; height: 100%; width: 100%; background: var(--cph-progress-color); transform: scaleX(0); transform-origin: left; }
.cph:dir(rtl) .cph__progress span { transform-origin: right; }
.cph.cph--progress-position-top .cph__progress { top: 0; bottom: auto; }
.cph.cph--progress-glow .cph__progress { overflow: visible; }
.cph.cph--progress-glow .cph__progress span { box-shadow: 0 0 12px var(--cph-progress-color); }
.cph .cph__navigation { display: flex; align-items: center; justify-content: center; gap: 8px; padding-top: var(--cph-nav-space); min-width: 0; max-width: 100%; }
/* Reserve the navigation row across regrouping, including a one-scene desktop layout. */
.cph.cph--nav-slot.cph--dot-position-below { padding-bottom: calc(var(--cph-nav-space) + 38px); }
.cph.cph--nav-slot.cph--dot-position-below .cph__navigation { position: absolute; inset-inline: 0; bottom: 0; }
.cph .cph__dots { display: flex; align-items: center; justify-content: safe center; gap: var(--cph-dot-gap); max-width: 100%; min-width: 0; overflow-x: auto; scrollbar-width: thin; padding: 3px; }
.cph button { appearance: none; -webkit-appearance: none; cursor: pointer; border: 0; border-radius: 0; padding: 0; margin: 0; font: inherit; line-height: 1; text-transform: none; letter-spacing: normal; box-shadow: none; text-shadow: none; background: transparent; color: inherit; min-height: 0; min-width: 0; }
.cph button:hover, .cph button:focus { background: transparent; color: inherit; }
.cph .cph__dot { display: grid; place-items: center; min-width: 28px; height: 32px; flex: 0 0 auto; }
.cph .cph__dot span { display: block; height: var(--cph-dot-size); width: var(--cph-dot-size); border-radius: 99px; background: var(--cph-dot); transition: width 400ms ease, background 400ms ease; }
.cph .cph__dot[aria-current="true"] span { background: var(--cph-dot-active); }
.cph.cph--dot-style-pills .cph__dot span { width: calc(var(--cph-dot-size) * 3); height: max(3px, calc(var(--cph-dot-size) / 2)); }
.cph.cph--dot-style-luxury .cph__dot[aria-current="true"] span { width: calc(var(--cph-dot-size) * 5); height: max(3px, calc(var(--cph-dot-size) / 2)); }
.cph .cph__playback { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 32px; color: var(--cph-dot-active); border-radius: 50%; }
.cph .cph__playback svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 1.4; fill: none; }
.cph .cph__play-icon, .cph.is-paused .cph__pause-icon { display: none; }
.cph.is-paused .cph__play-icon { display: block; }
.cph.cph--dot-position-bottom .cph__navigation, .cph.cph--dot-position-top .cph__navigation { position: absolute; z-index: 10; inset-inline: 12px; bottom: var(--cph-nav-space); padding-top: 0; --cph-dot: #ffffff70; --cph-dot-active: #fff4d7; }
.cph.cph--dot-position-top .cph__navigation { bottom: auto; top: var(--cph-nav-space); }
.cph.cph--has-nav.cph--dot-position-bottom .cph__caption-motion { bottom: max(var(--cph-caption-offset), calc(var(--cph-nav-space) + 48px)); }
.cph.cph--has-nav.cph--dot-position-top.cph--caption-position-top .cph__caption-motion { top: max(var(--cph-caption-offset), calc(var(--cph-nav-space) + 48px)); }
.cph .cph__arrow { position: absolute; top: 50%; translate: 0 -50%; z-index: 9; width: var(--cph-arrow-size); height: var(--cph-arrow-size); display: grid; place-items: center; background: var(--cph-arrow-background); color: var(--cph-arrow-color); border: 1px solid #ffffff38; border-radius: 50%; backdrop-filter: blur(10px); }
.cph .cph__arrow:hover, .cph .cph__arrow:focus { background: var(--cph-arrow-background); color: var(--cph-arrow-color); }
.cph .cph__arrow--prev { inset-inline-start: 14px; }
.cph .cph__arrow--next { inset-inline-end: 14px; }
.cph .cph__arrow svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.cph:dir(rtl) .cph__arrow svg { transform: rotate(180deg); }
.cph .cph__arrow:disabled { opacity: .3; cursor: default; }
.cph button:focus-visible, .cph a:focus-visible, .cph:focus-visible { outline: 2px solid var(--cph-accent); outline-offset: 3px; }
.cph a.cph__panel:focus-visible { outline-offset: -5px; }
.cph .cph__sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.cph .cph__placeholder { position: absolute; inset: 0; background: #758279; }
.cph .cph__placeholder::before { content: ''; position: absolute; inset: 12% 16% 0; border-radius: 45% 45% 0 0; border: 1px solid #e9e5d04d; border-bottom: 0; background: #1f3b3038; }
.cph .cph__placeholder span { position: absolute; inset: 26% 26% 0; border-radius: 45% 45% 0 0; background: #d9cfb526; }
.cph .cph__panel--center .cph__placeholder { background: #8d9889; }
.cph .cph__panel--right .cph__placeholder { background: #616f66; }
.cph:not(.is-ready) .cph__navigation, .cph:not(.is-ready) .cph__arrow { visibility: hidden; }
@media (hover: hover) and (pointer: fine) {
    .cph.cph--hover-enabled .cph__pack:not(.is-entering) .cph__panel:hover .cph__image { transform: scale(var(--cph-hover-scale)); }
    .cph.cph--hover-enabled.cph--neighbor .cph__pack:not(.is-entering):has(.cph__panel:hover) .cph__panel:not(:hover) .cph__image { filter: brightness(calc(var(--cph-side-brightness) * .86)); transform: scale(1.001); }
    .cph.cph--hover-enabled.cph--neighbor .cph__pack:not(.is-entering):has(.cph__panel:hover) .cph__panel--center:not(:hover) .cph__image { filter: brightness(calc(var(--cph-center-brightness) * .86)); }
    .cph.cph--hover-enabled.cph--caption-hover-lift .cph__panel:hover .cph__caption { transform: translateY(-3px); }
    .cph.cph--hover-enabled.cph--caption-hover-accent .cph__panel:hover .cph__caption::before { transform: scaleX(1.2); }
    .cph.cph--caption-visibility-hover .cph__panel:not(:hover):not(:focus-within) .cph__caption { opacity: 0; }
    .cph.cph--caption-visibility-hybrid .cph__panel:not(:hover):not(:focus-within) .cph__kicker,
    .cph.cph--caption-visibility-hybrid .cph__panel:not(:hover):not(:focus-within) .cph__subtitle,
    .cph.cph--caption-visibility-hybrid .cph__panel:not(:hover):not(:focus-within) .cph__badge { opacity: 0; }
}
@media (max-width: 1024px) {
    .cph { --cph-columns: var(--cph-tablet-columns, 2); }
    .cph { --cph-caption-inset: 18px; --cph-caption-offset: 28px; }
    .cph .cph__frame { aspect-ratio: 4 / 3; min-height: 340px; }
    .cph .cph__title { --cph-title-size: clamp(19px, 2.7vw, 30px); }
}
@media (max-width: 767px) {
    .cph { --cph-columns: var(--cph-mobile-columns, 1); }
    .cph { --cph-caption-inset: 9px; --cph-caption-offset: 18px; --cph-radius: 20px; --cph-accent-width: 20px; --cph-center-emphasis: 1.06; --cph-arrow-size: 30px; }
    .cph .cph__frame { aspect-ratio: 1 / 1; min-height: 320px; }
    .cph .cph__title { --cph-title-size: clamp(15px, 3.8vw, 23px); line-height: 1.3; letter-spacing: -.02em; margin-bottom: 6px; }
    .cph .cph__kicker { font-size: 8px; letter-spacing: .04em; margin-bottom: 6px; }
    .cph .cph__subtitle { font-size: 9px; margin-bottom: 7px; }
    .cph .cph__badge { font-size: 8px; letter-spacing: 0; }
    .cph .cph__caption::before { margin-bottom: 10px; }
    .cph.cph--caption-style-white .cph__caption, .cph.cph--caption-style-glass .cph__caption, .cph.cph--caption-style-chip .cph__caption { padding: 12px 8px; border-radius: 9px; }
    .cph.cph--caption-style-chip .cph__title { --cph-title-size: 15px; }
    .cph.cph--caption-style-bar .cph__caption { padding: 16px 9px; }
    .cph.cph--mobile-layout-touch .cph__panel { flex-grow: .8; }
    .cph.cph--mobile-layout-touch .cph__panel--center { flex-grow: 1.4; }
    .cph.cph--mobile-layout-touch .cph__panel:not(.cph__panel--center) .cph__kicker,
    .cph.cph--mobile-layout-touch .cph__panel:not(.cph__panel--center) .cph__subtitle,
    .cph.cph--mobile-layout-touch .cph__panel:not(.cph__panel--center) .cph__badge { display: none; }
    .cph .cph__arrow--prev { inset-inline-start: 8px; }
    .cph .cph__arrow--next { inset-inline-end: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .cph *, .cph *::before, .cph *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
    .cph .cph__image, .cph .cph__caption { transform: none !important; }
}
@media (forced-colors: active) {
    .cph .cph__caption { background: Canvas; color: CanvasText; }
    .cph .cph__dot span { background: ButtonText; forced-color-adjust: none; }
    .cph .cph__dot[aria-current] { outline: 2px solid Highlight; }
}