.elementor-2806 .elementor-element.elementor-element-9760b61{--display:flex;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-598a73c */#ph *,
    #ph *::before,
    #ph *::after,
    #ph-menu,
    #ph-menu * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    /* ── Variáveis ── */
    :root {
        --ph-h: 80px;
        --ph-pink: #E72274;
        --ph-ease: 0.35s ease;
        /* Fallbacks caso as variáveis Elementor ainda não estejam disponíveis */
        --ph-bg-scrolled: var(--e-global-color-secondary, #ffffff);
        --ph-text-scrolled: var(--e-global-color-primary, #562D79);
    }

    /* ════════════════════════════
   HEADER WRAPPER — fixed
════════════════════════════ */
    #ph {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: var(--ph-h);
        z-index: 9999;
        pointer-events: auto;
        /* sempre clicável */
    }

    /* Background que desce ao rolar — cor via variável Elementor */
    #ph::before {
        content: '';
        position: absolute;
        inset: 0;
        background: var(--ph-bg-scrolled);
        box-shadow: 0 2px 24px rgba(0, 0, 0, 0.07);
        transform: translateY(-100%);
        transition: transform var(--ph-ease);
        z-index: 0;
        pointer-events: none;
        /* o fundo não captura cliques */
    }

    #ph.scrolled::before {
        transform: translateY(0);
    }

    /* ── Inner ── */
    #ph-inner {
        position: relative;
        z-index: 1;
        /* acima do ::before */
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: var(--ph-h);
        max-width: 1850px;
        margin: 0 auto;
        padding: 0 35px;
    }

    /* ════════════════════════════
   LOGO
════════════════════════════ */
    #ph-logo {
        display: flex;
        align-items: center;
        text-decoration: none;
        flex-shrink: 0;
        line-height: 0;
        /* elimina espaço extra do inline */
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }

    #ph-logo svg {
        height: 26px;
        width: auto;
    }

    /* Letras brancas → escuras ao rolar */
    #ph-logo .ph-letra {
        fill: var(--ph-bg-scrolled);
        transition: fill var(--ph-ease);
    }

    #ph.scrolled #ph-logo .ph-letra {
        fill: var(--ph-text-scrolled);
    }

    /* Ponto rosa: não muda */
    #ph-logo .ph-dot {
        fill: var(--ph-pink);
    }

    /* ════════════════════════════
   NAV DESKTOP
════════════════════════════ */
    #ph-nav {
        display: flex;
        align-items: center;
        gap: 40px;
        list-style: none;
    }

    #ph-nav a {
        font-family: "Inter", sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 2em;
        text-transform: uppercase;
        text-decoration: none;
        color: var(--ph-bg-scrolled);
        display: inline-block;
        position: relative;
        -webkit-transition: color 1000ms ease-out, -webkit-transform 400ms ease-out;
        transition: color 1000ms ease-out, -webkit-transform 400ms ease-out;
        -o-transition: transform 400ms ease-out, color 1000ms ease-out;
        transition: transform 400ms ease-out, color 1000ms ease-out;
        transition: transform 400ms ease-out, color 1000ms ease-out, -webkit-transform 400ms ease-out;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    #ph.scrolled #ph-nav a {
        color: var(--ph-text-scrolled);
    }

    #ph-nav li {
        position: relative;
    }

    #ph-nav li::before {
        content: "";
        width: 100%;
        height: 1px;
        background: var(--ph-bg-scrolled);
        position: absolute;
        left: 0;
        bottom: 0;
        transform: scaleX(0) translateY(0);
        transform-origin: center;
        transition: transform 600ms ease, background-color 600ms ease;
    }

    #ph-inner .bloco-esq {
        display: flex;
        align-items: center;
        gap: 20px;
    }

    /* ════════════════════════════
   AÇÕES (search + hamburger)
════════════════════════════ */
    #ph-actions {
        display: flex;
        align-items: center;
        gap: 20px;
    }

    #ph-actions [type=button]:focus,
    #ph-actions [type=button]:hover,
    #ph-actions [type=submit]:focus,
    #ph-actions [type=submit]:hover,
    #ph-actions button:focus,
    #ph-actions button:hover {
        background-color: transparent !important;
    }

    /* Reset de botão — base para TODOS os botões do header */
    .ph-btn {
        all: unset;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
        /* sem delay de 300ms no iOS */
        min-width: 44px;
        /* área de toque mínima recomendada */
        min-height: 44px;
    }

    /* ── Lupa / Search ── */
    #ph-search-btn {
        -webkit-transition: -webkit-transform var(--ph-ease);
        transition: -webkit-transform var(--ph-ease);
        -o-transition: transform var(--ph-ease);
        transition: transform var(--ph-ease);
    }

    #ph-search-btn svg {
        display: block;
        cursor: pointer;
    }

    @media (min-width: 1025px) {

        #ph-search-btn:hover {
            transform: scale(1.15);
        }

        /* ── Sem .scrolled: hover não muda a cor do texto ── */
        #ph-nav li a:hover {
            color: var(--ph-bg-scrolled);
            /* branco — sem alteração visual */
            transform: translateY(-10px);
        }

        #ph-nav li:hover::before {
            background-color: var(--ph-bg-scrolled);
            /* branco */
            transform: scaleX(1) translateY(10px);
        }

        /* ── Com .scrolled: hover muda para rosa ── */
        #ph.scrolled #ph-nav li a:hover {
            color: var(--ph-pink);
            transform: translateY(-10px);
        }

        #ph.scrolled #ph-nav li:hover::before {
            background-color: var(--ph-text-scrolled);
            transform: scaleX(1) translateY(10px);
        }

    }


    #ph-search-btn .ph-icon-stroke {
        stroke: var(--ph-bg-scrolled);
        transition: stroke var(--ph-ease);
    }

    #ph.scrolled #ph-search-btn .ph-icon-stroke {
        stroke: var(--ph-text-scrolled);
    }

    /* Hamburger — só mobile */
    #ph-hamburger {
        display: none;
    }

    #ph-hamburger .ph-icon-stroke {
        stroke: #fff;
        transition: stroke var(--ph-ease);
    }

    #ph.scrolled #ph-hamburger .ph-icon-stroke {
        stroke: var(--ph-text-scrolled);
    }

    /* ════════════════════════════
   RESPONSIVE
════════════════════════════ */
    @media (max-width: 768px) {
        #ph-inner {
            padding: 0 20px;
        }


        :root {
            --ph-h: 64px;
        }
    }

    @media (max-width: 1024px) {
        #ph-nav {
            display: none;
        }

        #ph-hamburger {
            display: flex;
        }

        #ph-logo svg {
            height: 20px;
        }
    }

    /* ════════════════════════════
   MENU MOBILE — overlay
════════════════════════════ */
    #ph-menu {
        position: fixed;
        inset: 0;
        z-index: 9998;
        /* logo abaixo do header */
        background: var(--ph-text-scrolled);
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        padding: 80px 32px 60px;

        /* fechado */
        opacity: 0;
        visibility: hidden;
        transform: translateY(-16px);
        transition:
            opacity 0.3s ease,
            visibility 0.3s ease,
            transform 0.3s ease;
        pointer-events: none;
    }

    #ph-menu.open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
    }

    /* Hamburguer vira X quando o menu está aberto */
    #ph-hamburger[aria-expanded="true"] .ph-icon-stroke {
        stroke: #fff;
        /* garante visível sobre o overlay roxo */
    }

    /* Links do menu mobile */
    #ph-menu-nav {
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    #ph-menu-nav li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    #ph-menu-nav li:first-child {
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    #ph-menu-nav a {
        display: block;
        padding: 20px 0;
        font-size: 1.4rem;
        font-weight: 700;
        color: rgba(255, 255, 255, 0.85);
        text-decoration: none;
        letter-spacing: -0.01em;
        transition: color 0.2s, padding-left 0.2s;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }

    #ph-menu-nav a:hover,
    #ph-menu-nav a:active {
        color: var(--ph-pink);
        padding-left: 6px;
    }/* End custom CSS */