/*
Theme Name: PotencI.A
Theme URI: https://potencia.site
Author: PotencI.A
Description: Tema personalizado do site institucional da PotencI.A.
Version: 1.8.4
Text Domain: potencia
Requires at least: 6.0
Requires PHP: 7.4
*/

/* Os estilos visuais do tema ficam em assets/css/main.css. */

/* v1.5.2 — previews específicos para a moldura mobile dos cases.
   Mantém as imagens horizontais originais no mockup desktop e usa recortes
   verticais próprios apenas na área de experiência responsiva. */
.case-priscila-page .case-mobile-frame {
    background-image: url('assets/images/portfolio/priscila-mobile.webp');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    background-color: #f5f1eb;
}

.case-rogerio-page .case-mobile-frame {
    background-image: url('assets/images/portfolio/rogerio-mobile.webp');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    background-color: #f7f9fb;
}

.case-priscila-page .case-mobile-frame > img,
.case-rogerio-page .case-mobile-frame > img {
    opacity: 0;
}

/* v1.5.5 — case Ayla */
.projects-hub-image-ayla {
    background:
        radial-gradient(circle at 50% 42%, rgba(93,228,255,.12), transparent 18rem),
        radial-gradient(circle at 82% 18%, rgba(166,108,255,.12), transparent 14rem),
        #091426;
}

.projects-hub-image-ayla img {
    width: min(100%, 360px);
    max-height: 360px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
    border-radius: 24px;
}

.case-ayla-page .case-hero {
    background:
        radial-gradient(circle at 76% 30%, rgba(93,228,255,.06), transparent 24rem),
        radial-gradient(circle at 88% 55%, rgba(166,108,255,.07), transparent 26rem);
}

.case-ayla-portrait {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 18px;
}

.case-ayla-image-shell {
    position: relative;
    width: min(100%, 470px);
    aspect-ratio: 1 / 1;
    padding: 12px;
    overflow: hidden;
    border: 1px solid rgba(93,228,255,.16);
    border-radius: 34px;
    background:
        linear-gradient(145deg, rgba(93,228,255,.07), rgba(166,108,255,.06)),
        #091426;
    box-shadow: 0 34px 90px rgba(0,0,0,.36);
}

.case-ayla-image-shell::before {
    content: "";
    position: absolute;
    inset: -28%;
    z-index: 0;
    background: conic-gradient(from 180deg, transparent, rgba(93,228,255,.14), transparent, rgba(166,108,255,.12), transparent);
    filter: blur(36px);
}

.case-ayla-image-shell img {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 25px;
}

.case-ayla-image-shell > span {
    position: absolute;
    left: 28px;
    bottom: 28px;
    z-index: 2;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(7,16,31,.78);
    backdrop-filter: blur(14px);
    color: #dce7f4;
    font-size: .68rem;
    font-weight: 750;
}

.case-ayla-caption {
    width: min(100%, 470px);
    padding: 14px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 16px;
    background: rgba(255,255,255,.022);
}

.case-ayla-caption small,
.case-ayla-caption strong {
    display: block;
}

.case-ayla-caption small {
    color: #74849a;
    font-size: .64rem;
}

.case-ayla-caption strong {
    color: #e7edf5;
    font-size: .78rem;
    text-align: right;
}

.case-ayla-flow-visual {
    background:
        radial-gradient(circle at 50% 38%, rgba(93,228,255,.10), transparent 20rem),
        radial-gradient(circle at 74% 72%, rgba(166,108,255,.08), transparent 18rem),
        #091426 !important;
}

.case-ayla-flow {
    width: min(100%, 470px);
    display: grid;
    justify-items: center;
    gap: 12px;
}

.case-ayla-flow > i {
    color: rgba(93,228,255,.55);
    font-style: normal;
    font-size: 1.2rem;
}

.case-ayla-flow-step {
    width: 100%;
    padding: 18px 20px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    background: rgba(10,20,36,.92);
}

.case-ayla-flow-step small,
.case-ayla-flow-step strong,
.case-ayla-flow-step span {
    display: block;
}

.case-ayla-flow-step small {
    color: var(--cyan);
    font-size: .64rem;
    font-weight: 850;
}

.case-ayla-flow-step strong {
    margin-top: 6px;
    color: #eff4fa;
    font-size: 1rem;
}

.case-ayla-flow-step span {
    margin-top: 4px;
    color: #7d8ca1;
    font-size: .72rem;
}

.case-ayla-flow-accent {
    border-color: rgba(93,228,255,.18);
    background: linear-gradient(135deg, rgba(93,228,255,.06), rgba(166,108,255,.05)), #0a1424;
}

.case-ayla-flow-branches {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.case-ayla-flow-branches span {
    padding: 14px 10px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 14px;
    background: rgba(255,255,255,.022);
    text-align: center;
}

.case-ayla-flow-branches b,
.case-ayla-flow-branches small {
    display: block;
}

.case-ayla-flow-branches b {
    color: #dfe7f0;
    font-size: .76rem;
}

.case-ayla-flow-branches small {
    margin-top: 3px;
    color: #75849a;
    font-size: .61rem;
}

.case-ayla-architecture {
    border-color: rgba(93,228,255,.17);
    background:
        radial-gradient(circle at 100% 0%, rgba(93,228,255,.09), transparent 22rem),
        radial-gradient(circle at 0% 100%, rgba(166,108,255,.07), transparent 20rem),
        linear-gradient(135deg, rgba(93,228,255,.035), rgba(166,108,255,.035));
}

/* v1.6.0 — integração definitiva dos cases com Home e navegação */
.nav-list > li.is-current > a,
.mobile-menu-link.is-active {
    color: var(--cyan);
}

.project-case-badge {
    border-color: rgba(93,228,255,.16) !important;
    background: rgba(93,228,255,.06) !important;
    color: var(--cyan) !important;
}

.project-card-has-case {
    border-color: rgba(93,228,255,.12);
}

.project-card-secondary {
    opacity: .96;
}

.portfolio-cases-actions {
    margin-top: 30px;
    justify-content: center;
}

/* v1.8.2 — integração visual do Google Agenda no briefing */
.request-booking-hours {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.request-booking-actions {
    margin-top: 18px;
}

.request-booking-actions .button {
    flex: 0 0 auto;
}

/* v1.8.4 — redes sociais oficiais no rodapé */
.footer-social {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.footer-social a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 11px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
    color: #aeb9c8;
    font-size: .72rem;
    font-weight: 750;
    transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}

.footer-social a:hover {
    color: #fff;
    border-color: rgba(93,228,255,.2);
    background: rgba(93,228,255,.05);
    transform: translateY(-2px);
}

.footer-social svg {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.footer-social a:last-child svg {
    fill: currentColor;
    stroke: none;
}

@media (max-width: 780px) {
    .case-ayla-image-shell {
        width: min(100%, 390px);
        border-radius: 26px;
    }

    .case-ayla-image-shell img {
        border-radius: 19px;
    }

    .case-ayla-caption {
        width: min(100%, 390px);
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .case-ayla-caption strong {
        text-align: left;
    }

    .case-ayla-flow-branches {
        grid-template-columns: 1fr;
    }

    .portfolio-cases-actions {
        margin-top: 22px;
        justify-content: stretch;
    }

    .portfolio-cases-actions .button,
    .request-booking-actions .button {
        width: 100%;
    }

    .request-booking-hours {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-social {
        margin-top: 16px;
    }
}