/* UX006. CSS is the complete static fallback; motion enhances only wide, tall screens. */
.caeli-site .caeli-photo-fan {
    display: block;
    min-height: 0;
    background: var(--caeli-rose, #ecddda);
    --caeli-fan-inset: 89px;
}
.caeli-photo-fan__panel {
    width: 100%;
    padding-block: clamp(2rem, 4vh, 3rem);
    background: var(--caeli-rose, #ecddda);
    box-sizing: border-box;
}
.caeli-photo-fan__inner {
    width: min(var(--caeli-content, 82rem), calc(100% - 2 * var(--caeli-gutter, 24px)));
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 1.5rem;
}
.caeli-photo-fan__copy { min-width: 0; max-width: 38rem; position: relative; z-index: 1; }
.caeli-site .caeli-photo-fan__copy h2 { font-size: clamp(2.5rem, 4.5vw, 4.75rem); margin-block: 0 1.25rem; }
.caeli-photo-fan__copy > p { max-width: 34ch; }
.caeli-photo-fan__copy .caeli-eyebrow { margin-top: 0; }
.caeli-photo-fan__copy .caeli-caption { font-size: .7rem; margin-bottom: 0; }
.caeli-photo-fan__copy .caeli-text-link { min-height: 44px; box-sizing: border-box; }
.caeli-photo-fan__stage {
    position: relative;
    min-width: 0;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 1rem;
    padding: .75rem .375rem;
    box-sizing: border-box;
    isolation: isolate;
}
.caeli-photo-fan__card {
    margin: 0;
    width: 100%;
    aspect-ratio: 4 / 5;
    padding: clamp(.5rem, 1.2vw, .875rem);
    padding-bottom: clamp(1rem, 2vw, 1.75rem);
    box-sizing: border-box;
    background: #fffdfa;
    box-shadow: 0 8px 24px rgb(27 23 24 / 8%);
    transform: rotate(-2deg);
    z-index: 1;
}
.caeli-photo-fan__card:nth-child(2) { transform: translateY(10px) rotate(1deg); z-index: 3; }
.caeli-photo-fan__card:nth-child(3) { transform: rotate(3deg); z-index: 2; grid-column: 1 / -1; width: 55%; justify-self: center; }
.caeli-photo-fan__card img { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (min-width: 480px) {
    .caeli-photo-fan__stage { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding: 1.5rem .5rem; }
    .caeli-photo-fan__card:nth-child(3) { grid-column: auto; width: 100%; }
}
@media (min-width: 1024px) {
    .caeli-photo-fan__panel { min-height: calc(100vh - var(--caeli-fan-inset)); min-height: calc(100svh - var(--caeli-fan-inset)); display: grid; align-items: center; }
    .caeli-photo-fan__inner { grid-template-columns: minmax(0, 39fr) minmax(0, 61fr); gap: clamp(1.5rem, 3vw, 3rem); }
    .caeli-photo-fan__stage { display: block; height: clamp(380px, 64vh, 600px); height: clamp(380px, 64svh, 600px); padding: 0; }
    .caeli-photo-fan__card { position: absolute; left: 50%; top: 50%; width: 33%; max-width: 270px; transform: translate(-130%, -50%) rotate(-9deg); }
    .caeli-photo-fan__card:nth-child(2) { transform: translate(-50%, calc(-50% - 12px)) rotate(-1deg); }
    .caeli-photo-fan__card:nth-child(3) { width: 33%; transform: translate(30%, -50%) rotate(9deg); }
    [data-caeli-photo-fan][data-fan-motion] .caeli-photo-fan__card { will-change: transform; }
}
@media (prefers-reduced-motion: reduce) {
    .caeli-photo-fan__card { transition: none; animation: none; }
}