@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700&display=swap');

/* ============================================
   VARIÁVEIS
   (valores padrão; se cards.css ou Ficha.css
   redefinirem alguma, a deles prevalece)
   ============================================ */

:root{
    /* paleta original */
    --tinta: #ececec;
    --linha: #472020;
    --sangue-1: #7a1515;
    --sangue-2: #a51e1e;
    --sangue-3: #b62525;
    --fonte-corpo: Georgia, serif;
    --fonte-titulo: 'Cinzel', Georgia, serif;

    /* layout e recepção */
    --pv-bg: #0d0a0a;
    --pv-bg-alt: #130d0d;
    --pv-surface: #1f1212;
    --pv-surface-2: #2b1717;
    --pv-border: #472020;
    --pv-red: #b62525;
    --pv-red-bright: #d63c3c;
    --pv-red-dark: #7a1515;
    --pv-text: #ececec;
    --pv-muted: #a89494;
    --pv-gold: #c9a45c;
    --pv-radius: 10px;
    --pv-shadow: 0 6px 18px rgba(0,0,0,.4);
}

/* ============================================
   BASE
   ============================================ */

body{
    background: #0f0b0b;
    color: #ececec;
    font-family: Georgia, serif;
    margin: 0;
}

h1, h3, h5, p{
    color: #f3f3f3;
}

h1, h3, h5{
    font-family: 'Cinzel', Georgia, serif;
}

/* ============================================
   SELECT
   ============================================ */

select{
    width: 100%;
    padding: 11px 40px 11px 14px;

    background: #1f1212;
    color: var(--tinta);

    border: 1px solid var(--linha);
    border-radius: 8px;

    font-family: var(--fonte-corpo);
    font-size: .95rem;

    cursor: pointer;

    appearance: none;

    transition: border-color .15s;

    /* Seta personalizada */
    background-image:
        linear-gradient(45deg, transparent 50%, var(--sangue-3) 50%),
        linear-gradient(135deg, var(--sangue-3) 50%, transparent 50%);

    background-position:
        calc(100% - 18px) 50%,
        calc(100% - 12px) 50%;

    background-size:
        6px 6px,
        6px 6px;

    background-repeat: no-repeat;
}

select:hover{
    border-color: var(--sangue-2);
}

select:focus{
    outline: none;
    border-color: var(--sangue-3);
}

select option{
    background: #1f1212;
    color: var(--tinta);
    padding: 10px;
}

/* HEADER (padrão das demais páginas) */

header{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:15px;
    padding:25px 0;
}

/* FOOTER (padrão das demais páginas) */

footer{
    display:flex;
    justify-content:center;
    align-items:center;
    margin-top:40px;
    padding:20px;
    border-top:1px solid #7a1515;
}

/* LINKS */

a{
    color:#b83030;
    text-decoration:none;
    transition:color .15s;
}

a:hover{
    color:#e04a4a;
}

/* INPUTS */

input,
textarea{
    background:#241515;

    color:#ececec;
    font-family: Georgia, serif;

    border:1px solid #472020;
    border-radius:8px;

    padding:10px 14px;

    transition:border-color .15s;
}

input::placeholder,
textarea::placeholder{
    color:#9b8686;
}

input:focus,
textarea:focus{
    outline:none;
    border-color:#b62525;
}

/* SCROLL */

textarea::-webkit-scrollbar{
    width:10px;
}

textarea::-webkit-scrollbar-track{
    background:#1b0d0d;
    border-radius:10px;
}

textarea::-webkit-scrollbar-thumb{
    background:#6e2525;
    border-radius:10px;
    border:2px solid #1b0d0d;
}

textarea::-webkit-scrollbar-thumb:hover{
    background:#8f3030;
}

/* LINHA */

hr{
    width:90%;
    height:1px;
    border:none;
    background:var(--linha);
}

/* ==========================================================
   LAYOUT — prefixo "pv-"
   (cabeçalho, menu, recepção, rodapé)
   ========================================================== */

.pv-body{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    line-height:1.6;
}

.pv-body *,
.pv-body *::before,
.pv-body *::after{
    box-sizing:border-box;
}

.pv-main{
    flex:1;
}

.pv-container{
    width:100%;
    max-width:1140px;
    margin:0 auto;
    padding:0 24px;
}

/* ---------- Header ---------- */

.pv-header{
    position:sticky;
    top:0;
    z-index:1000;
    display:block;
    padding:0;
    background:rgba(13,10,10,.95);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--pv-border);
    overflow:visible;
}

/* Dropdown acima do conteúdo */
.pv-dropdown{
    z-index:1100;
}

.pv-header__inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:72px;
}

/* Marca */

.pv-brand,
.pv-brand:hover{
    display:flex;
    align-items:center;
    gap:12px;
    color:var(--pv-text);
}

.pv-brand__mark{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:50%;
    border:1px solid var(--pv-red);
    color:var(--pv-red-bright);
    font-size:1.2rem;
}

.pv-brand__text{
    display:flex;
    flex-direction:column;
    line-height:1.1;
}

.pv-brand__title{
    font-family:var(--fonte-titulo);
    font-weight:700;
    font-size:1.15rem;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.pv-brand__sub{
    font-family:var(--fonte-titulo);
    font-size:.7rem;
    letter-spacing:.4em;
    color:var(--pv-red-bright);
    font-weight:700;
}

/* Navegação */

.pv-nav__list{
    display:flex;
    align-items:center;
    gap:4px;
    margin:0;
    padding:0;
    list-style:none;
}

.pv-nav__item{
    position:relative;
}

.pv-nav__link{
    display:flex;
    align-items:center;
    gap:6px;
    padding:10px 16px;
    border-radius:6px;
    font-family:var(--fonte-titulo);
    font-size:.9rem;
    font-weight:500;
    letter-spacing:.03em;
    color:var(--pv-muted);
    transition:color .15s, background .15s;
}

.pv-nav__link:hover,
.pv-has-dropdown:hover > .pv-nav__link,
.pv-has-dropdown:focus-within > .pv-nav__link{
    color:#fff;
    background:var(--pv-surface);
}

.pv-caret{
    font-size:.7rem;
    opacity:.7;
}

/* Dropdown */

.pv-dropdown{
    position:absolute;
    top:100%;
    left:0;
    min-width:270px;
    padding:8px;
    margin-top:8px;
    background:var(--pv-surface);
    border:1px solid var(--pv-border);
    border-radius:var(--pv-radius);
    box-shadow:var(--pv-shadow);
    opacity:0;
    visibility:hidden;
    transition:opacity .15s, visibility .15s;
}

.pv-dropdown::before{
    content:'';
    position:absolute;
    top:-10px;
    left:0;
    right:0;
    height:10px;
}

.pv-has-dropdown:hover > .pv-dropdown,
.pv-has-dropdown:focus-within > .pv-dropdown{
    opacity:1;
    visibility:visible;
}

.pv-dropdown__link{
    display:flex;
    flex-direction:column;
    padding:10px 14px;
    border-radius:6px;
    color:var(--pv-text);
    transition:background .15s;
}

.pv-dropdown__link strong{
    font-size:.92rem;
    font-weight:700;
}

.pv-dropdown__link small{
    color:var(--pv-muted);
    font-size:.78rem;
}

.pv-dropdown__link:hover{
    background:var(--pv-surface-2);
    color:var(--pv-text);
}

/* Botão do menu mobile (sem JavaScript) */

.pv-menu-toggle{
    display:none;
}

.pv-menu-button{
    display:none;
    flex-direction:column;
    gap:5px;
    padding:10px;
    cursor:pointer;
}

.pv-menu-button span{
    display:block;
    width:24px;
    height:2px;
    background:var(--pv-text);
    border-radius:2px;
}

/* ---------- Botões ---------- */

.pv-btn{
    display:inline-block;
    padding:12px 26px;
    border-radius:8px;
    font-family:var(--fonte-titulo);
    font-weight:700;
    font-size:.9rem;
    letter-spacing:.04em;
    border:1px solid transparent;
    cursor:pointer;
    transition:background .15s, border-color .15s, color .15s;
}

.pv-btn--primary{
    background:var(--pv-red-dark);
    border-color:var(--pv-red-dark);
    color:#fff;
}

.pv-btn--primary:hover{
    background:var(--pv-red);
    border-color:var(--pv-red);
    color:#fff;
}

.pv-btn--ghost{
    border-color:var(--pv-border);
    color:var(--pv-text);
}

.pv-btn--ghost:hover{
    color:#fff;
    border-color:var(--pv-muted);
}

.pv-btn--outline{
    border-color:var(--pv-red);
    color:var(--pv-red-bright);
    padding:10px 22px;
}

.pv-btn--outline:hover{
    background:var(--pv-red);
    color:#fff;
}

/* ---------- Hero ---------- */

.pv-hero{
    position:relative;
    padding:120px 0 110px;
    text-align:center;
    overflow:hidden;
    background:var(--pv-bg-alt);
    border-bottom:1px solid var(--pv-border);
}

.pv-hero::before{
    content:'✠';
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    font-size:36rem;
    line-height:1;
    color:rgba(182,37,37,.04);
    pointer-events:none;
}

.pv-hero__inner{
    position:relative;
    max-width:820px;
}

.pv-eyebrow{
    display:inline-block;
    margin-bottom:14px;
    font-family:var(--fonte-titulo);
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:var(--pv-red-bright);
}

.pv-hero__title{
    margin:0 0 20px;
    font-size:clamp(2.6rem, 7vw, 4.8rem);
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    line-height:1.05;
}

.pv-hero__lead{
    max-width:640px;
    margin:0 auto 38px;
    font-size:1.1rem;
    color:var(--pv-muted);
}

.pv-hero__actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:14px;
}

/* ---------- Seções ---------- */

.pv-section{
    padding:80px 0;
}

.pv-section--alt{
    background:var(--pv-bg-alt);
    border-top:1px solid var(--pv-border);
    border-bottom:1px solid var(--pv-border);
}

.pv-section__head{
    max-width:620px;
    margin:0 auto 50px;
    text-align:center;
}

.pv-section__title{
    margin:0 0 10px;
    font-size:clamp(1.8rem, 4vw, 2.3rem);
    font-weight:700;
    letter-spacing:.03em;
}

.pv-section__desc{
    margin:0;
    color:var(--pv-muted);
}

/* ---------- Grids ---------- */

.pv-grid{
    display:grid;
    gap:24px;
}

.pv-grid--3{
    grid-template-columns:repeat(3, 1fr);
}

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

/* ---------- Cards ---------- */

.pv-card{
    padding:30px 26px;
    background:var(--pv-surface);
    border:1px solid var(--pv-border);
    border-radius:var(--pv-radius);
    transition:border-color .15s;
}

.pv-card:hover{
    border-color:var(--pv-red-dark);
}

.pv-card__icon{
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    margin-bottom:20px;
    font-size:1.5rem;
    border-radius:10px;
    background:rgba(182,37,37,.12);
    border:1px solid var(--pv-border);
}

.pv-card__title{
    margin:0 0 8px;
    font-size:1.2rem;
    letter-spacing:.02em;
}

.pv-card__text{
    margin:0 0 18px;
    color:var(--pv-muted);
    font-size:.95rem;
}

.pv-card__link{
    display:inline-block;
    font-family:var(--fonte-titulo);
    font-weight:700;
    font-size:.85rem;
    letter-spacing:.03em;
    color:var(--pv-red-bright);
    transition:color .15s;
}

.pv-card__link:hover{
    color:#fff;
}

/* ---------- Livros ---------- */

.pv-book{
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:var(--pv-surface);
    border:1px solid var(--pv-border);
    border-radius:var(--pv-radius);
    transition:border-color .15s;
}

.pv-book:hover{
    border-color:var(--pv-red-dark);
}

.pv-book__cover{
    position:relative;
    display:grid;
    place-items:center;
    height:210px;
    padding:24px;
    text-align:center;
    font-family:var(--fonte-titulo);
    font-size:1.4rem;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--pv-text);
    border-bottom:2px solid var(--pv-red);
}

.pv-book__cover::after{
    content:'';
    position:absolute;
    inset:12px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:4px;
    pointer-events:none;
}

.pv-book__cover--a{ background:#120a0b; }
.pv-book__cover--b{ background:#3f0c11; }
.pv-book__cover--c{ background:#1d1618; }

.pv-book__body{
    padding:24px 26px 28px;
}

.pv-book__title{
    margin:0 0 8px;
    font-size:1.15rem;
}

.pv-book__text{
    margin:0 0 16px;
    color:var(--pv-muted);
    font-size:.93rem;
}

/* ---------- Outros sistemas ---------- */

.pv-system{
    display:flex;
    align-items:center;
    gap:26px;
    padding:28px;
    background:var(--pv-surface);
    border:1px solid var(--pv-border);
    border-radius:var(--pv-radius);
    transition:border-color .15s;
}

.pv-system:hover{
    border-color:var(--pv-red-dark);
}

.pv-system__badge{
    flex-shrink:0;
    display:grid;
    place-items:center;
    width:80px;
    height:80px;
    border-radius:50%;
    font-family:var(--fonte-titulo);
    font-weight:700;
    font-size:1.2rem;
    color:var(--pv-gold);
    border:1px solid var(--pv-gold);
}

.pv-system__title{
    margin:0 0 6px;
    font-size:1.25rem;
}

/* ---------- Leitor de PDF (versão simples com iframe) ---------- */

.pv-reader{
    padding:40px 0 60px;
}

.pv-reader__bar{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:24px;
}

.pv-reader__title{
    margin:0;
    font-size:clamp(1.6rem, 4vw, 2.2rem);
    letter-spacing:.03em;
}

.pv-reader__actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.pv-reader__actions .pv-btn{
    padding:10px 22px;
}

.pv-reader__frame{
    height:80vh;
    min-height:480px;
    background:var(--pv-surface);
    border:1px solid var(--pv-border);
    border-radius:var(--pv-radius);
    overflow:hidden;
}

.pv-reader__frame iframe{
    display:block;
    width:100%;
    height:100%;
    border:0;
}

/* ---------- Footer ---------- */

.pv-footer{
    margin-top:auto;
    padding:28px 0;
    display:block;
    background:#080506;
    border-top:1px solid var(--sangue-1);
    color:var(--pv-muted);
    font-size:.85rem;
}

.pv-footer__inner{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.pv-footer__inner p{
    margin:0;
    color:var(--pv-muted);
}

.pv-footer__brand{
    display:flex;
    align-items:center;
    gap:10px;
    font-family:var(--fonte-titulo);
    color:var(--pv-text);
    letter-spacing:.04em;
}

.pv-footer__brand .pv-brand__mark{
    width:30px;
    height:30px;
    font-size:1rem;
}

/* ---------- Responsivo ---------- */

@media (max-width:900px){
    .pv-grid--3{
        grid-template-columns:repeat(2, 1fr);
    }
}

@media (max-width:820px){

    .pv-menu-button{
        display:flex;
    }

    .pv-nav{
        position:absolute;
        top:72px;
        left:0;
        right:0;
        display:none;
        max-height:calc(100vh - 72px);
        overflow-y:auto;
        padding:12px 24px 20px;
        background:var(--pv-bg);
        border-bottom:1px solid var(--pv-border);
    }

    .pv-menu-toggle:checked ~ .pv-nav{
        display:block;
    }

    .pv-nav__list{
        flex-direction:column;
        align-items:stretch;
    }

    .pv-dropdown{
        position:static;
        min-width:0;
        margin:0 0 8px 12px;
        padding:4px;
        opacity:1;
        visibility:visible;
        box-shadow:none;
        background:transparent;
        border:0;
        border-left:2px solid var(--pv-red-dark);
        border-radius:0;
    }

    .pv-dropdown::before{
        display:none;
    }

    .pv-hero{
        padding:90px 0 80px;
    }

    .pv-section{
        padding:64px 0;
    }
}

@media (max-width:640px){

    .pv-grid--3,
    .pv-grid--2{
        grid-template-columns:1fr;
    }

    .pv-system{
        flex-direction:column;
        text-align:center;
    }

    .pv-footer__inner{
        justify-content:center;
        text-align:center;
    }

    .pv-reader__frame{
        height:70vh;
    }
}

/* ============================================
   INPUT NUMBER — setas de aumentar/diminuir
   ============================================ */

/* Chrome, Edge, Safari */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button{
    -webkit-appearance: none;
    appearance: none;
    opacity: 1;
    cursor: pointer;

    width: 26px;
    height: 30px;
    margin-left: 8px;

    background-color: #2b1717;
    border: 1px solid var(--linha);
    border-radius: 6px;

    /* seta pra cima (topo) e pra baixo (base) */
    background-image:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 5l4-4 4 4' fill='none' stroke='%23b62525' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>"),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23b62525' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position:
        center 6px,
        center calc(100% - 6px);

    transition: background-color .15s, border-color .15s;
}

input[type="number"]::-webkit-inner-spin-button:hover{
    background-color: var(--sangue-1);
    border-color: var(--sangue-3);

    background-image:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 5l4-4 4 4' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>"),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

/* Firefox: não permite estilizar as setas, então só esconde */
input[type="number"]{
    -moz-appearance: textfield;
    appearance: textfield;
}