/* Instagram carousel viewer (shared by carousel/ and carousel/phone/). Recoloured to the funnel system. */
.car { position: relative; overflow: hidden; padding: clamp(52px, 8vh, 104px) 0 clamp(56px, 9vh, 104px); }
.car__viewer { display: flex; flex-direction: column; align-items: center; gap: 24px; }
.cstage { position: relative; width: min(90vw, 430px); aspect-ratio: 1080 / 1350; overflow: hidden; border-radius: 22px; background: var(--blush); touch-action: pan-y; user-select: none; box-shadow: 0 34px 90px -30px rgba(60, 20, 55, 0.45); }
.ctrack { display: flex; height: 100%; transition: transform 0.5s cubic-bezier(0.66, 0, 0.2, 1); will-change: transform; }
.ctrack.no-anim { transition: none; }
.cslide { min-width: 100%; height: 100%; }
.cslide img { width: 100%; height: 100%; object-fit: cover; display: block; -webkit-user-drag: none; }
.cnav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(128, 26, 135, 0.3); background: rgba(255, 255, 255, 0.85); backdrop-filter: blur(8px); cursor: pointer; transition: opacity 0.2s var(--ease); }
.cnav::before { content: ""; position: absolute; inset: 0; margin: auto; width: 10px; height: 10px; border-top: 2.5px solid var(--accent); border-right: 2.5px solid var(--accent); }
.cnav--prev { left: 14px; } .cnav--prev::before { transform: rotate(-135deg); margin-left: 19px; }
.cnav--next { right: 14px; } .cnav--next::before { transform: rotate(45deg); margin-right: 19px; }
.cnav[disabled] { opacity: 0; pointer-events: none; }
.cdots { display: flex; gap: 9px; }
.cdots button { width: 8px; height: 8px; border-radius: 50%; border: none; padding: 0; cursor: pointer; background: rgba(43, 22, 48, 0.2); transition: background 0.25s var(--ease), transform 0.25s var(--ease); }
.cdots button.is-on { background: var(--accent); transform: scale(1.3); }
.car__caption { margin: clamp(30px, 5vw, 48px) auto 0; max-width: 540px; background: var(--surface); border: 1px solid var(--hair); border-radius: 18px; padding: clamp(20px, 3vw, 28px); }
.car__caplabel { margin: 0 0 12px; font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); }
.car__captext { margin: 0; font-size: 15.5px; line-height: 1.62; color: var(--muted); white-space: pre-line; }
@media (prefers-reduced-motion: reduce) { .ctrack { transition: none; } }
