/* =========================================
   Casting Agency v1.0.7
   ========================================= */

* { box-sizing: border-box; }

/* ─── WRAP ─── */
div.ca-wrap {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* ─── GRID ─── */
div.ca-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
}
@media (max-width: 1024px) { div.ca-grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 768px)  { div.ca-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; } }
@media (max-width: 480px)  { div.ca-grid { grid-template-columns: 1fr !important; } }

/* ─── CARD ─── */
article.ca-card {
    display: flex !important;
    flex-direction: column !important;
    cursor: pointer !important;
    overflow: hidden !important;
    border: 1px solid #222 !important;
    background: #000 !important;
    transition: border-color 0.2s, transform 0.2s !important;
    margin: 0 !important;
    padding: 0 !important;
}
article.ca-card:hover  { border-color: #555 !important; transform: translateY(-3px) !important; }
article.ca-card:focus  { outline: 2px solid #ff5a00 !important; outline-offset: 2px !important; }

article.ca-card div.ca-card__photo {
    width: 100% !important;
    overflow: hidden !important;
    background: #1a1a1a !important;
    display: block !important;
    line-height: 0 !important;
    font-size: 0 !important;
}
article.ca-card div.ca-card__photo img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    position: static !important;
    max-width: 100% !important;
    transition: transform 0.35s ease !important;
}
article.ca-card:hover div.ca-card__photo img { transform: scale(1.04) !important; }

article.ca-card div.ca-card__footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 11px 14px 12px !important;
    background: #000 !important;
    border-top: 1px solid #1c1c1c !important;
    flex-shrink: 0 !important;
}
article.ca-card span.ca-card__name {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #fff !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    flex: 1 !important;
    line-height: 1.2 !important;
}
article.ca-card span.ca-card__age {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 300 !important;
    color: #fff !important;
    margin-left: 10px !important;
    flex-shrink: 0 !important;
    line-height: 1.2 !important;
}

/* ══════════════════════════════════════════
   MODAL BASE — aplica em AMBOS os modais
   via classes compartilhadas
══════════════════════════════════════════ */

/* Overlay */
div#ca-modal,
div#ca-inf-modal,
div#ca-st-modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    margin: 0 !important;
    background: transparent !important;
}
div#ca-modal[hidden],
div#ca-inf-modal[hidden],
div#ca-st-modal[hidden] { display: none !important; }

/* Backdrop */
div#ca-modal div.ca-modal__backdrop,
div#ca-inf-modal div.ca-modal__backdrop {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0,0,0,0.84) !important;
    cursor: pointer !important;
}

/* Box branca */
div#ca-modal div.ca-modal__box,
div#ca-inf-modal div.ca-modal__box,
div#ca-st-modal div.ca-modal__box {
    position: relative !important;
    background: #ffffff !important;
    border-radius: 6px !important;
    width: 100% !important;
    max-width: 960px !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 44px 48px 40px !important;
    display: flex !important;
    flex-direction: column !important;
    color: #000 !important;
    z-index: 1 !important;
}
div#ca-modal div.ca-modal__box::-webkit-scrollbar,
div#ca-inf-modal div.ca-modal__box::-webkit-scrollbar,
div#ca-st-modal div.ca-modal__box::-webkit-scrollbar { width: 5px; }
div#ca-modal div.ca-modal__box::-webkit-scrollbar-thumb,
div#ca-inf-modal div.ca-modal__box::-webkit-scrollbar-thumb,
div#ca-st-modal div.ca-modal__box::-webkit-scrollbar-thumb { background: #ddd; border-radius: 3px; }

/* Botão fechar */
div#ca-modal button.ca-modal__close,
div#ca-inf-modal button.ca-modal__close,
div#ca-st-modal button.ca-modal__close {
    position: absolute !important;
    top: 14px !important;
    right: 16px !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 1.5px solid #ccc !important;
    border-radius: 50% !important;
    font-size: 20px !important;
    line-height: 1 !important;
    color: #666 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.15s, border-color 0.15s, color 0.15s !important;
    z-index: 10 !important;
}
div#ca-modal button.ca-modal__close:hover,
div#ca-inf-modal button.ca-modal__close:hover,
div#ca-st-modal button.ca-modal__close:hover {
    background: #ff5a00 !important;
    border-color: #ff5a00 !important;
    color: #fff !important;
}

/* ── Galeria: 4 thumbs — usando classe, funciona nos dois modais ── */
div#ca-modal div.ca-modal__gallery,
div#ca-inf-modal div.ca-modal__gallery,
div#ca-st-modal div.ca-modal__gallery {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 12px !important;
    margin: 0 0 28px 0 !important;
    padding: 0 !important;
}
div#ca-modal div.ca-modal__gallery:empty,
div#ca-inf-modal div.ca-modal__gallery:empty,
div#ca-st-modal div.ca-modal__gallery:empty { display: none !important; margin: 0 !important; }

div#ca-modal div.ca-gallery-thumb,
div#ca-inf-modal div.ca-gallery-thumb,
div#ca-st-modal div.ca-gallery-thumb {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: 160px !important;
    overflow: hidden !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    background: #ddd !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}
div#ca-modal div.ca-gallery-thumb:hover,
div#ca-inf-modal div.ca-gallery-thumb:hover,
div#ca-st-modal div.ca-gallery-thumb:hover { opacity: 0.82 !important; }

div#ca-modal div.ca-gallery-thumb img,
div#ca-inf-modal div.ca-gallery-thumb img,
div#ca-st-modal div.ca-gallery-thumb img {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

div#ca-modal div.ca-gallery-thumb::after,
div#ca-inf-modal div.ca-gallery-thumb::after,
div#ca-st-modal div.ca-gallery-thumb::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 28px !important;
    background-color: transparent !important;
    opacity: 0 !important;
    transition: opacity 0.2s, background-color 0.2s !important;
    pointer-events: none !important;
}
div#ca-modal div.ca-gallery-thumb:hover::after,
div#ca-inf-modal div.ca-gallery-thumb:hover::after,
div#ca-st-modal div.ca-gallery-thumb:hover::after {
    opacity: 1 !important;
    background-color: rgba(0,0,0,0.32) !important;
}

@media (max-width: 640px) {
    div#ca-modal div.ca-modal__gallery,
    div#ca-inf-modal div.ca-modal__gallery,
    div#ca-st-modal div.ca-modal__gallery { grid-template-columns: repeat(2, 1fr) !important; }
    div#ca-modal div.ca-gallery-thumb,
    div#ca-inf-modal div.ca-gallery-thumb,
    div#ca-st-modal div.ca-gallery-thumb { height: 120px !important; }
}

/* ── Lightbox — classe, funciona nos dois ── */
div#ca-modal div.ca-lightbox,
div#ca-inf-modal div.ca-lightbox,
div#ca-st-modal div.ca-lightbox {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    right: 0 !important; bottom: 0 !important;
    background: rgba(0,0,0,0.96) !important;
    z-index: 20 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 6px !important;
}
div#ca-modal div.ca-lightbox[hidden],
div#ca-inf-modal div.ca-lightbox[hidden],
div#ca-st-modal div.ca-lightbox[hidden] { display: none !important; }

div#ca-modal div.ca-lightbox div.ca-lightbox__img-wrap,
div#ca-inf-modal div.ca-lightbox div.ca-lightbox__img-wrap,
div#ca-st-modal div.ca-lightbox div.ca-lightbox__img-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 70px 90px !important;
}
div#ca-modal div.ca-lightbox div.ca-lightbox__img-wrap img,
div#ca-inf-modal div.ca-lightbox div.ca-lightbox__img-wrap img,
div#ca-st-modal div.ca-lightbox div.ca-lightbox__img-wrap img {
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    border-radius: 3px !important;
    position: static !important;
}

div#ca-modal button.ca-lightbox__close,
div#ca-inf-modal button.ca-lightbox__close,
div#ca-st-modal button.ca-lightbox__close {
    position: absolute !important;
    top: 14px !important; right: 16px !important;
    width: 36px !important; height: 36px !important;
    min-width: 0 !important; padding: 0 !important;
    background: rgba(255,255,255,0.12) !important;
    border: 1.5px solid rgba(255,255,255,0.3) !important;
    border-radius: 50% !important;
    font-size: 20px !important; color: #fff !important;
    cursor: pointer !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    transition: background 0.15s !important;
    z-index: 21 !important;
}
div#ca-modal button.ca-lightbox__close:hover,
div#ca-inf-modal button.ca-lightbox__close:hover,
div#ca-st-modal button.ca-lightbox__close:hover { background: #ff5a00 !important; border-color: #ff5a00 !important; }

div#ca-modal button.ca-lightbox__prev,
div#ca-modal button.ca-lightbox__next,
div#ca-inf-modal button.ca-lightbox__prev,
div#ca-inf-modal button.ca-lightbox__next,
div#ca-st-modal button.ca-lightbox__prev,
div#ca-st-modal button.ca-lightbox__next {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 46px !important; height: 46px !important;
    min-width: 0 !important; padding: 0 !important;
    background: rgba(255,255,255,0.12) !important;
    border: 1.5px solid rgba(255,255,255,0.2) !important;
    border-radius: 50% !important;
    font-size: 30px !important; color: #fff !important;
    cursor: pointer !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    transition: background 0.15s !important;
    z-index: 21 !important; line-height: 1 !important;
}
div#ca-modal button.ca-lightbox__prev,
div#ca-inf-modal button.ca-lightbox__prev,
div#ca-st-modal button.ca-lightbox__prev { left: 14px !important; }
div#ca-modal button.ca-lightbox__next,
div#ca-inf-modal button.ca-lightbox__next,
div#ca-st-modal button.ca-lightbox__next { right: 14px !important; }
div#ca-modal button.ca-lightbox__prev:hover,
div#ca-modal button.ca-lightbox__next:hover,
div#ca-inf-modal button.ca-lightbox__prev:hover,
div#ca-inf-modal button.ca-lightbox__next:hover,
div#ca-st-modal button.ca-lightbox__prev:hover,
div#ca-st-modal button.ca-lightbox__next:hover { background: #ff5a00 !important; border-color: #ff5a00 !important; }
div#ca-modal button.ca-lightbox__prev:disabled,
div#ca-modal button.ca-lightbox__next:disabled,
div#ca-inf-modal button.ca-lightbox__prev:disabled,
div#ca-inf-modal button.ca-lightbox__next:disabled,
div#ca-st-modal button.ca-lightbox__prev:disabled,
div#ca-st-modal button.ca-lightbox__next:disabled { opacity: 0.2 !important; cursor: default !important; }

/* ── Divisor horizontal ── */
div#ca-modal hr.ca-modal__divider,
div#ca-inf-modal hr.ca-modal__divider,
div#ca-st-modal hr.ca-modal__divider {
    border: none !important;
    border-top: 1.5px solid #111 !important;
    margin: 0 0 28px 0 !important;
}

/* ── Corpo ── */
div#ca-modal div.ca-modal__body,
div#ca-inf-modal div.ca-modal__body,
div#ca-st-modal div.ca-modal__body {
    display: grid !important;
    grid-template-columns: 220px 57px 1fr !important;
    gap: 0 !important;
    margin-bottom: 28px !important;
    align-items: start !important;
}
@media (max-width: 640px) {
    div#ca-modal div.ca-modal__body,
    div#ca-inf-modal div.ca-modal__body,
    div#ca-st-modal div.ca-modal__body { grid-template-columns: 1fr !important; }
    div#ca-modal div.ca-modal__divider-v,
    div#ca-inf-modal div.ca-modal__divider-v,
    div#ca-st-modal div.ca-modal__divider-v { display: none !important; }
}

div#ca-modal div.ca-modal__divider-v,
div#ca-inf-modal div.ca-modal__divider-v,
div#ca-st-modal div.ca-modal__divider-v {
    background: #111 !important;
    align-self: stretch !important;
    margin: 0 !important;
    padding: 0 28px !important;
    width: 57px !important;
    background-clip: content-box !important;
}

/* ── Info lista ── */
div#ca-modal dl.ca-info-list,
div#ca-inf-modal dl.ca-info-list,
div#ca-st-modal dl.ca-info-list {
    margin: 0 !important; padding: 0 !important;
    display: flex !important; flex-direction: column !important; gap: 9px !important;
}
div#ca-modal div.ca-info-row,
div#ca-inf-modal div.ca-info-row,
div#ca-st-modal div.ca-info-row {
    display: flex !important; align-items: baseline !important; gap: 8px !important;
}
div#ca-modal dl.ca-info-list dt,
div#ca-inf-modal dl.ca-info-list dt,
div#ca-st-modal dl.ca-info-list dt {
    font-family: 'Barlow', sans-serif !important;
    font-size: 14px !important; font-weight: 700 !important; color: #000 !important;
    white-space: nowrap !important; min-width: 80px !important;
}
div#ca-modal dl.ca-info-list dd,
div#ca-inf-modal dl.ca-info-list dd,
div#ca-st-modal dl.ca-info-list dd {
    font-family: 'Barlow', sans-serif !important;
    font-size: 14px !important; font-weight: 400 !important;
    color: #000 !important; margin: 0 !important;
}

/* ── Formulário ── */
div#ca-modal div.ca-modal__form,
div#ca-inf-modal div.ca-modal__form,
div#ca-st-modal div.ca-modal__form {
    display: flex !important; flex-direction: column !important; gap: 12px !important;
}
div#ca-modal div.ca-form__group,
div#ca-inf-modal div.ca-form__group,
div#ca-st-modal div.ca-form__group { display: flex !important; flex-direction: column !important; gap: 4px !important; }
div#ca-modal label.ca-form__label,
div#ca-inf-modal label.ca-form__label,
div#ca-st-modal label.ca-form__label {
    font-family: 'Barlow', sans-serif !important;
    font-size: 13px !important; font-weight: 700 !important; color: #000 !important; display: block !important;
}
div#ca-modal input.ca-form__input,
div#ca-modal textarea.ca-form__input,
div#ca-inf-modal input.ca-form__input,
div#ca-inf-modal textarea.ca-form__input,
div#ca-st-modal input.ca-form__input,
div#ca-st-modal textarea.ca-form__input {
    width: 100% !important; padding: 12px 14px !important;
    border: 1.5px solid #111 !important; border-radius: 3px !important;
    font-size: 14px !important; font-family: 'Barlow', sans-serif !important;
    color: #222 !important; background: #fff !important;
    outline: none !important; box-shadow: none !important;
    -webkit-appearance: none !important; resize: none !important; display: block !important; margin: 0 !important;
}
div#ca-modal input.ca-form__input:focus,
div#ca-modal textarea.ca-form__input:focus,
div#ca-inf-modal input.ca-form__input:focus,
div#ca-inf-modal textarea.ca-form__input:focus,
div#ca-st-modal input.ca-form__input:focus,
div#ca-st-modal textarea.ca-form__input:focus { border-color: #ff5a00 !important; box-shadow: none !important; }
div#ca-modal input.ca-form__input::placeholder,
div#ca-modal textarea.ca-form__input::placeholder,
div#ca-inf-modal input.ca-form__input::placeholder,
div#ca-inf-modal textarea.ca-form__input::placeholder,
div#ca-st-modal input.ca-form__input::placeholder,
div#ca-st-modal textarea.ca-form__input::placeholder { color: #bbb !important; }
div#ca-modal textarea.ca-form__textarea,
div#ca-inf-modal textarea.ca-form__textarea,
div#ca-st-modal textarea.ca-form__textarea { min-height: 100px !important; resize: vertical !important; }

/* ── Botão CAST ME / WORK WITH ME ── */
div#ca-modal button.ca-btn-cast,
div#ca-inf-modal button.ca-btn-cast,
div#ca-st-modal button.ca-btn-cast {
    display: block !important; width: 100% !important;
    padding: 20px 24px !important;
    background: #ff5a00 !important; background-color: #ff5a00 !important;
    color: #fff !important;
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: 18px !important; font-weight: 700 !important;
    letter-spacing: 0.14em !important; text-transform: uppercase !important;
    border: none !important; border-radius: 10px !important;
    cursor: pointer !important;
    transition: background 0.18s, transform 0.1s !important;
    margin-top: 10px !important; text-align: center !important;
    line-height: 1 !important; box-shadow: none !important; -webkit-appearance: none !important;
}
div#ca-modal button.ca-btn-cast:hover,
div#ca-inf-modal button.ca-btn-cast:hover,
div#ca-st-modal button.ca-btn-cast:hover { background: #e04d00 !important; color: #fff !important; }
div#ca-modal button.ca-btn-cast:active,
div#ca-inf-modal button.ca-btn-cast:active,
div#ca-st-modal button.ca-btn-cast:active { transform: scale(0.99) !important; }
div#ca-modal button.ca-btn-cast:disabled,
div#ca-inf-modal button.ca-btn-cast:disabled,
div#ca-st-modal button.ca-btn-cast:disabled { background: #bbb !important; cursor: not-allowed !important; }

/* ── Feedback ── */
div#ca-modal div.ca-form__feedback,
div#ca-inf-modal div.ca-form__feedback,
div#ca-st-modal div.ca-form__feedback {
    text-align: center !important; padding: 11px 16px !important;
    border-radius: 4px !important; font-size: 14px !important; font-weight: 600 !important;
    margin-top: 10px !important; font-family: 'Barlow', sans-serif !important;
}
div#ca-modal div.ca-form__feedback.is-success,
div#ca-inf-modal div.ca-form__feedback.is-success,
div#ca-st-modal div.ca-form__feedback.is-success { background: #d4edda !important; color: #155724 !important; }
div#ca-modal div.ca-form__feedback.is-error,
div#ca-inf-modal div.ca-form__feedback.is-error,
div#ca-st-modal div.ca-form__feedback.is-error { background: #f8d7da !important; color: #721c24 !important; }

/* ── Animação ── */
@keyframes ca-modal-in {
    from { opacity: 0; transform: translateY(14px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
div#ca-modal:not([hidden]) div.ca-modal__box,
div#ca-inf-modal:not([hidden]) div.ca-modal__box,
div#ca-st-modal:not([hidden]) div.ca-modal__box {
    animation: ca-modal-in 0.22s ease forwards;
}

/* ══════════════════════════════════════════
   INFLUENCER — extras específicos
══════════════════════════════════════════ */
div#ca-inf-modal .ca-inf-bio-row { margin: 4px 0 12px 0 !important; }
div#ca-inf-modal p.ca-inf-bio-text {
    font-family: 'Barlow', sans-serif !important;
    font-size: 13px !important; font-weight: 400 !important;
    color: #555 !important; line-height: 1.5 !important;
    margin: 0 !important; padding: 0 !important;
}

/* Botão Download Midia Kit */
div#ca-inf-modal a.ca-btn-mediakit {
    display: block !important; width: 100% !important;
    padding: 16px 20px !important; margin-top: 20px !important;
    background: #000 !important; background-color: #000 !important;
    color: #fff !important;
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: 15px !important; font-weight: 700 !important;
    letter-spacing: 0.10em !important; text-transform: uppercase !important;
    text-align: center !important; text-decoration: none !important;
    border: none !important; border-radius: 10px !important;
    cursor: pointer !important; transition: background 0.18s !important; line-height: 1 !important;
}
div#ca-inf-modal a.ca-btn-mediakit:hover {
    background: #333 !important; background-color: #333 !important;
    color: #fff !important; text-decoration: none !important;
}

p.ca-empty { color: #777 !important; text-align: center !important; padding: 60px 20px !important; }

@media (max-width: 768px) {
    div#ca-modal div.ca-modal__box,
    div#ca-inf-modal div.ca-modal__box,
    div#ca-st-modal div.ca-modal__box { padding: 28px 18px 24px !important; }
}

/* ══════════════════════════════════════════
   STUDIO — Cards horizontais 3 colunas
══════════════════════════════════════════ */

div.ca-st-wrap {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

div.ca-st-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 25px !important;
    margin: 0 !important;
    padding: 0 !important;
}
@media (max-width: 900px) { div.ca-st-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 560px) { div.ca-st-grid { grid-template-columns: 1fr !important; } }

/* Card Studio */
article.ca-st-card {
    position: relative !important;
    display: block !important;
    cursor: pointer !important;
    overflow: hidden !important;
    background: #111 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    /* ratio 16:10 — horizontal */
    aspect-ratio: 16 / 10 !important;
}
article.ca-st-card:focus { outline: 3px solid #ff5a00 !important; outline-offset: -3px !important; }

/* Imagem de fundo que preenche o card */
div.ca-st-card__img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}
div.ca-st-card__img img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}
article.ca-st-card:hover div.ca-st-card__img img { transform: scale(1.06) !important; }

/* Overlay gradiente escuro na parte inferior */
div.ca-st-card__overlay {
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(to top, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0) 100%) !important;
    transition: opacity 0.3s !important;
}
article.ca-st-card:hover div.ca-st-card__overlay { opacity: 0.9 !important; }

/* Título e preço sobre a imagem */
div.ca-st-card__info {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    padding: 16px 20px !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 10px !important;
    z-index: 2 !important;
}

span.ca-st-card__title {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: clamp(14px, 1.4vw, 20px) !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    line-height: 1.15 !important;
    text-shadow: 0 1px 4px rgba(0,0,0,0.5) !important;
    flex: 1 !important;
}

span.ca-st-card__price {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    opacity: 0.85 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    background: rgba(255,90,0,0.85) !important;
    padding: 3px 10px !important;
    border-radius: 4px !important;
}

/* Borda hover sutil */
article.ca-st-card::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    border: 2px solid transparent !important;
    transition: border-color 0.2s !important;
    pointer-events: none !important;
    z-index: 3 !important;
}
article.ca-st-card:hover::after { border-color: rgba(255,255,255,0.25) !important; }

/* ── Modal Studio — seletores base já cobertos pelos globais ── */
/* Apenas extras específicos */

div#ca-st-modal .ca-st-desc-text {
    font-family: 'Barlow', sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #555 !important;
    line-height: 1.5 !important;
    margin: 4px 0 12px 0 !important;
    padding: 0 !important;
}

div#ca-st-modal dl.ca-info-list dt {
    min-width: 88px !important;
}

/* Botão BOOK NOW */
div#ca-st-modal button.ca-btn-rent {
    background: #ff5a00 !important;
    background-color: #ff5a00 !important;
}
div#ca-st-modal button.ca-btn-rent:hover {
    background: #e04d00 !important;
    background-color: #e04d00 !important;
}

/* ── Correções v1.1.0: card studio borda + fonte ── */

/* Borda branca no card */
article.ca-st-card {
    border: 1px solid rgba(255,255,255,0.18) !important;
    outline: none !important;
}
article.ca-st-card:hover {
    border-color: rgba(255,255,255,0.55) !important;
}
article.ca-st-card:focus {
    border-color: #ff5a00 !important;
    outline: none !important;
}

/* Garantir fonte Barlow Condensed no título do card */
span.ca-st-card__title {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    font-style: italic !important;
}

/* ── Form row: dois campos lado a lado (studio modal) ── */
div#ca-st-modal div.ca-form__row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
}
@media (max-width: 500px) {
    div#ca-st-modal div.ca-form__row {
        grid-template-columns: 1fr !important;
    }
}

/* ══════════════════════════════════════════
   TEAM — Cards sem modal, 5 colunas
══════════════════════════════════════════ */

div.ca-team-wrap {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

div.ca-team-grid {
    display: grid !important;
    grid-template-columns: repeat(var(--ca-team-cols, 5), 1fr) !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
}
@media (max-width: 1200px) { div.ca-team-grid { grid-template-columns: repeat(4, 1fr) !important; } }
@media (max-width: 900px)  { div.ca-team-grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 620px)  { div.ca-team-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; } }
@media (max-width: 380px)  { div.ca-team-grid { grid-template-columns: 1fr !important; } }

/* Card */
div.ca-team-card {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border: 1px solid #fff !important;
    background: #000 !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: default !important;
}

/* Foto — sem ratio fixo, proporcional */
div.ca-team-card div.ca-team-card__photo {
    width: 100% !important;
    overflow: hidden !important;
    background: #1a1a1a !important;
    display: block !important;
    line-height: 0 !important;
    font-size: 0 !important;
}
div.ca-team-card div.ca-team-card__photo img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    position: static !important;
    max-width: 100% !important;
    filter: grayscale(100%) !important;
    transition: filter 0.35s ease !important;
}
div.ca-team-card:hover div.ca-team-card__photo img {
    filter: grayscale(0%) !important;
}

/* Rodapé preto com nome e cargo */
div.ca-team-card div.ca-team-card__footer {
    background: #000 !important;
    padding: 12px 14px 14px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    border-top: 1px solid #fff !important;
    flex-shrink: 0 !important;
}

/* Nome — Barlow Condensed Bold */
div.ca-team-card span.ca-team-card__name {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    letter-spacing: 0.01em !important;
    line-height: 1.1 !important;
    display: block !important;
}

/* Cargo — menor, uppercase, espaçado */
div.ca-team-card span.ca-team-card__role {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #ffffff !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    line-height: 1.2 !important;
    display: block !important;
    opacity: 0.75 !important;
}

/* ── Studio modal: padding extra embaixo para botão não cortar ── */
div#ca-st-modal div.ca-modal__box {
    padding-bottom: 56px !important;
}

/* ══════════════════════════════════════════
   VIDEO PRODUCTION — Before/After Slider
══════════════════════════════════════════ */

div.ca-ba-wrap {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #000 !important;
    user-select: none !important;
    -webkit-user-select: none !important;
}

/* Container do slider — relative para clip-path funcionar */
div.ca-ba-slider {
    position: relative !important;
    width: 100% !important;
    overflow: hidden !important;
    cursor: ew-resize !important;
    touch-action: pan-y !important;
    /* Altura responsiva: 55vw desktop, 60vw tablet, 75vw mobile */
    height: 55vw !important;
    max-height: 680px !important;
    min-height: 280px !important;
    display: block !important;
}

/* AFTER — fundo, cobre tudo */
div.ca-ba-after,
div.ca-ba-before {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
}

div.ca-ba-after img,
div.ca-ba-before img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    pointer-events: none !important;
    draggable: false !important;
}

/* BEFORE — clip-path dinâmico via JS (inicia em 50%) */
div.ca-ba-before {
    clip-path: inset(0 50% 0 0); /* SEM !important — JS sobrescreve via inline style */
    z-index: 2 !important;
}

/* Texto esquerdo (BEFORE) — Neue Power Ultra / Barlow Condensed */
div.ca-ba-left-text {
    position: absolute !important;
    left: 6% !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 15 !important; /* acima do handle (10) e de tudo */
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    pointer-events: none !important;
}

div.ca-ba-left-text span {
    font-family: 'Neue Power Ultra', 'NeuePowerUltra', 'neue-power', 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif !important;
    font-size: clamp(20px, 2.6vw, 42px) !important;
    font-weight: 800 !important;
    font-style: normal !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    line-height: 1.1 !important;
    display: block !important;
    text-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
}

/* Texto direito (AFTER) */
div.ca-ba-right-text {
    position: absolute !important;
    right: 5% !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    max-width: 280px !important;
    z-index: 3 !important;
    text-align: right !important;
    pointer-events: none !important;
}

div.ca-ba-right-text {
    font-family: 'Barlow', 'Helvetica Neue', Arial, sans-serif !important;
    font-size: clamp(11px, 1.1vw, 15px) !important;
    font-weight: 400 !important;
    color: rgba(255,255,255,0.88) !important;
    line-height: 1.55 !important;
    text-shadow: 0 1px 4px rgba(0,0,0,0.35) !important;
}

/* Handle — linha + círculo */
div.ca-ba-handle {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 50%; /* SEM !important — JS atualiza via inline style */
    transform: translateX(-50%) !important;
    z-index: 10 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    pointer-events: none !important;
}

div.ca-ba-line {
    width: 2px !important;
    flex: 1 !important;
    background: #ffffff !important;
    box-shadow: 0 0 8px rgba(0,0,0,0.4) !important;
}

div.ca-ba-circle {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 44px !important;
    height: 44px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.35) !important;
    transition: transform 0.15s ease !important;
    flex-shrink: 0 !important;
}

div.ca-ba-wrap:hover div.ca-ba-circle {
    transform: translate(-50%, -50%) scale(1.1) !important;
}

div.ca-ba-circle svg {
    display: block !important;
    pointer-events: none !important;
}

/* Mobile */
@media (max-width: 768px) {
    div.ca-ba-slider {
        height: 68vw !important;
        max-height: 480px !important;
        min-height: 220px !important;
        cursor: ns-resize !important;
    }
    div.ca-ba-left-text span { font-size: clamp(13px, 3.5vw, 24px) !important; }
    div.ca-ba-right-text { max-width: 38% !important; font-size: clamp(9px, 2vw, 13px) !important; }
    div.ca-ba-circle { width: 36px !important; height: 36px !important; }
}

@media (max-width: 480px) {
    div.ca-ba-slider { height: 80vw !important; min-height: 200px !important; }
    div.ca-ba-left-text span { font-size: clamp(11px, 4vw, 20px) !important; }
    div.ca-ba-right-text { display: none !important; }
}

/* picture element herda estilos — before/after mobile */
div.ca-ba-after picture,
div.ca-ba-before picture {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}
div.ca-ba-after picture img,
div.ca-ba-before picture img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    pointer-events: none !important;
}

/* ══════════════════════════════════════════
   VIDEO CAROUSEL — 1 + 1/2 peek effect
══════════════════════════════════════════ */

div.ca-vc-wrap {
    position: relative !important;
    width: 100% !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
    user-select: none !important;
    -webkit-user-select: none !important;
}

/* Header com título */
div.ca-vc-header {
    margin: 0 0 0 0 !important;
    padding: 0 !important;
}

h2.ca-vc-title {
    font-family: 'Neue Power Ultra', 'NeuePowerUltra', 'Barlow Condensed', Arial, sans-serif !important;
    font-size: clamp(28px, 4vw, 56px) !important;
    font-weight: 800 !important;
    font-style: normal !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
    line-height: 1 !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
}

/* Viewport — overflow hidden, mostra 1 + meio */
div.ca-vc-viewport {
    position: relative !important;
    width: 100% !important;
    height: var(--ca-vc-h, 620px) !important;
    overflow: hidden !important;
    cursor: grab !important;
}
div.ca-vc-viewport:active { cursor: grabbing !important; }

/* Track — flex, sem quebra */
div.ca-vc-track {
    display: flex !important;
    height: 100% !important;
    will-change: transform !important;
    transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Slide individual — 1 card visível + 50% do próximo */
div.ca-vc-slide {
    position: relative !important;
    /* Largura: ~66.6% → mostra 1 + metade do próximo */
    flex: 0 0 calc(66.67% - 8px) !important;
    width: calc(66.67% - 8px) !important;
    height: 100% !important;
    overflow: hidden !important;
    cursor: pointer !important;
    margin-right: 16px !important;
    background: #111 !important;
}
div.ca-vc-slide:last-child { margin-right: 0 !important; }
div.ca-vc-slide:focus { outline: 2px solid #ff5a00 !important; outline-offset: -2px !important; }

/* Thumbnail que preenche o slide */
div.ca-vc-thumb {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}
div.ca-vc-thumb img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}
div.ca-vc-slide:hover div.ca-vc-thumb img { transform: scale(1.04) !important; }

/* Overlay escuro */
div.ca-vc-overlay {
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(to bottom, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.15) 50%, rgba(0,0,0,0.5) 100%) !important;
    transition: opacity 0.3s !important;
}
div.ca-vc-slide:hover div.ca-vc-overlay { opacity: 0.7 !important; }

/* Categoria — canto superior esquerdo */
div.ca-vc-category {
    position: absolute !important;
    top: 18px !important;
    left: 20px !important;
    z-index: 5 !important;
    font-family: 'Neue Power Ultra', 'NeuePowerUltra', 'Barlow Condensed', Arial, sans-serif !important;
    font-size: clamp(13px, 1.4vw, 20px) !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    text-shadow: 0 1px 6px rgba(0,0,0,0.5) !important;
    pointer-events: none !important;
}

/* Botão play centralizado */
div.ca-vc-play-btn {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 6 !important;
    width: 72px !important;
    height: 72px !important;
    background: rgba(255,255,255,0.15) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s, transform 0.2s !important;
    pointer-events: none !important;
}
div.ca-vc-slide:hover div.ca-vc-play-btn {
    background: rgba(255,255,255,0.28) !important;
    transform: translate(-50%, -50%) scale(1.08) !important;
}
div.ca-vc-play-btn svg { margin-left: 4px !important; }

/* Player (iframe/video) — overlay que cobre o slide */
div.ca-vc-player {
    position: absolute !important;
    inset: 0 !important;
    z-index: 20 !important;
    background: #000 !important;
}
div.ca-vc-player[hidden] { display: none !important; }
div.ca-vc-player iframe,
div.ca-vc-player video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    display: block !important;
}

/* Botões prev/next */
button.ca-vc-btn {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 30 !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 0 !important;
    padding: 0 !important;
    background: rgba(0,0,0,0.55) !important;
    border: 1.5px solid rgba(255,255,255,0.25) !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.15s, border-color 0.15s !important;
    backdrop-filter: blur(4px) !important;
}
button.ca-vc-btn:hover {
    background: #ff5a00 !important;
    border-color: #ff5a00 !important;
}
button.ca-vc-btn--prev { left: 12px !important; }
button.ca-vc-btn--next { right: 12px !important; }
button.ca-vc-btn[disabled] { opacity: 0.25 !important; cursor: default !important; }

/* ── Mobile ── */
@media (max-width: 768px) {
    div.ca-vc-viewport {
        height: calc(var(--ca-vc-h, 620px) * 0.65) !important;
    }
    div.ca-vc-slide {
        /* Mobile: mostra 1 + 30% do próximo */
        flex: 0 0 calc(78% - 6px) !important;
        width: calc(78% - 6px) !important;
        margin-right: 10px !important;
    }
    div.ca-vc-play-btn { width: 56px !important; height: 56px !important; }
    div.ca-vc-category { font-size: clamp(11px, 3vw, 16px) !important; top: 12px !important; left: 14px !important; }
    button.ca-vc-btn { width: 38px !important; height: 38px !important; }
}

@media (max-width: 480px) {
    div.ca-vc-viewport { height: calc(var(--ca-vc-h, 620px) * 0.55) !important; }
    div.ca-vc-slide { flex: 0 0 calc(88% - 6px) !important; width: calc(88% - 6px) !important; }
}
