/*
Theme Name: Oráculo do Xirê
Theme URI: https://oraculodoxire.com.br/
Author: Rodrigo Araujo
Description: Tema WordPress personalizado para o Oráculo do Xirê, convertido da página original.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: oraculo-do-xire
*/

:root{
    --bg:#0b0907;
    --bg-soft:#13100c;
    --gold:#cda35a;
    --gold-bright:#e8c777;
    --ink:#f1ece1;
    --ink-dim:#a89c8a;
    --line:rgba(205,163,90,0.18);

    --c-iansa:#b0392f;
    --c-iemanja:#3f6a93;
    --c-ifa:#cda35a;
    --c-nana:#6f5a8c;
    --c-oba:#a1452f;
  }

  *{margin:0;padding:0;box-sizing:border-box;}

  html{scroll-behavior:smooth;}

  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Jost', sans-serif;
    font-weight:300;
    line-height:1.7;
    overflow-x:hidden;
  }

  h1,h2,h3,h4{
    font-family:'Marcellus', serif;
    font-weight:400;
    letter-spacing:0.02em;
  }

  .eyebrow{
    font-family:'Jost',sans-serif;
    font-size:0.72rem;
    letter-spacing:0.32em;
    text-transform:uppercase;
    color:var(--gold);
    opacity:0.85;
  }

  a{color:var(--gold-bright);text-decoration:none;}

  /* ===== Background texture ===== */
  body::before{
    content:'';
    position:fixed;
    inset:0;
    background:
      radial-gradient(ellipse at 50% -10%, rgba(205,163,90,0.10), transparent 55%),
      radial-gradient(ellipse at 85% 110%, rgba(176,57,47,0.08), transparent 45%);
    pointer-events:none;
    z-index:0;
  }

  /* ===== Header / Nav ===== */
  header{
    position:fixed;
    top:0;left:0;right:0;
    z-index:100;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:1.6rem clamp(1.5rem,5vw,4rem);
    background:linear-gradient(to bottom, rgba(11,9,7,0.92), transparent);
    backdrop-filter:blur(2px);
  }
  .logo{
    font-family:'Marcellus',serif;
    font-size:1.15rem;
    letter-spacing:0.18em;
    color:var(--ink);
    text-transform:uppercase;
  }
  .logo span{color:var(--gold);}
  nav{display:flex;gap:2.4rem;}
  nav a{
    font-size:0.78rem;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--ink-dim);
    transition:color 0.3s;
  }
  nav a:hover{color:var(--gold-bright);}
  .nav-toggle{display:none;}

  /* ===== Hero ===== */
  .hero{
    position:relative;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    padding:8rem 1.5rem 4rem;
    overflow:hidden;
  }

  .hero-ring{
    position:absolute;
    top:50%;left:50%;
    width:min(78vw,640px);
    height:min(78vw,640px);
    transform:translate(-50%,-50%);
    border:1px solid var(--line);
    border-radius:50%;
    animation:spin 140s linear infinite;
    z-index:0;
  }
  .hero-ring::before, .hero-ring::after{
    content:'';
    position:absolute;
    border:1px solid var(--line);
    border-radius:50%;
  }
  .hero-ring::before{inset:7%;}
  .hero-ring::after{inset:14%;}

  @keyframes spin{from{transform:translate(-50%,-50%) rotate(0deg);}to{transform:translate(-50%,-50%) rotate(360deg);}}

  .hero-glyphs{
    position:absolute;
    top:50%;left:50%;
    width:min(78vw,640px);
    height:min(78vw,640px);
    transform:translate(-50%,-50%);
    animation:spin 140s linear infinite;
    z-index:0;
  }
  .hero-glyph{
    position:absolute;
    width:54px;height:54px;
    border-radius:50%;
    overflow:hidden;
    border:1px solid var(--gold);
    opacity:0.55;
    box-shadow:0 0 24px rgba(205,163,90,0.15);
  }
  .hero-glyph img{width:100%;height:100%;object-fit:cover;}
  .hero-glyph:nth-child(1){top:0%;left:50%;transform:translate(-50%,-50%);}
  .hero-glyph:nth-child(2){top:34%;left:97%;transform:translate(-50%,-50%);}
  .hero-glyph:nth-child(3){top:90%;left:78%;transform:translate(-50%,-50%);}
  .hero-glyph:nth-child(4){top:90%;left:22%;transform:translate(-50%,-50%);}
  .hero-glyph:nth-child(5){top:34%;left:3%;transform:translate(-50%,-50%);}

  .hero-content{position:relative;z-index:1;max-width:760px;}
  .hero-eyebrow{margin-bottom:1.4rem;}
  .hero h1{
    font-size:clamp(2.6rem,7vw,5.2rem);
    line-height:1.05;
    font-weight:400;
    color:var(--ink);
  }
  .hero h1 em{
    font-style:italic;
    font-family:'Cormorant Garamond',serif;
    color:var(--gold-bright);
  }
  .hero p.lead{
    margin:1.8rem auto 2.4rem;
    max-width:520px;
    color:var(--ink-dim);
    font-size:1.05rem;
  }

  .btn{
    display:inline-block;
    padding:0.95rem 2.4rem;
    border:1px solid var(--gold);
    border-radius:999px;
    font-size:0.78rem;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--gold-bright);
    transition:all 0.35s;
  }
  .btn:hover{background:var(--gold);color:var(--bg);}

  .scroll-cue{
    position:absolute;
    bottom:2.4rem;left:50%;
    transform:translateX(-50%);
    font-size:0.68rem;
    letter-spacing:0.3em;
    text-transform:uppercase;
    color:var(--ink-dim);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:0.6rem;
  }
  .scroll-cue::after{
    content:'';
    width:1px;height:34px;
    background:linear-gradient(to bottom, var(--gold), transparent);
    animation:pulse 2.4s ease-in-out infinite;
  }
  @keyframes pulse{0%,100%{opacity:0.3;}50%{opacity:1;}}

  /* ===== Section shared ===== */
  section{
    position:relative;
    z-index:1;
    padding:7rem clamp(1.5rem,6vw,6rem);
  }
  .section-head{
    max-width:680px;
    margin:0 auto 3.5rem;
    text-align:center;
  }
  .section-head h2{
    font-size:clamp(1.9rem,4vw,2.8rem);
    margin-top:0.8rem;
  }
  .section-head p{
    margin-top:1.2rem;
    color:var(--ink-dim);
  }

  /* ===== Sobre ===== */
  .about{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:4rem;
    max-width:1100px;
    margin:0 auto;
    align-items:center;
  }
  .about-visual{
    position:relative;
    aspect-ratio:3/4;
    border-radius:4px;
    overflow:hidden;
    border:1px solid var(--line);
  }
  .about-visual img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05);}
  .about-text .eyebrow{margin-bottom:1rem;}
  .about-text h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-bottom:1.4rem;}
  .about-text p{color:var(--ink-dim);margin-bottom:1.1rem;}
  .about-text p strong{color:var(--ink);font-weight:500;}

  /* ===== Estrutura - 4 elementos ===== */
  .structure{
    background:var(--bg-soft);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .structure-grid{
    max-width:1100px;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
  }
  .structure-item{
    background:var(--bg-soft);
    padding:2.6rem 1.6rem;
    text-align:center;
  }
  .structure-item .num{
    font-family:'Cormorant Garamond',serif;
    font-style:italic;
    font-size:2.2rem;
    color:var(--gold);
    display:block;
    margin-bottom:0.8rem;
  }
  .structure-item h3{
    font-size:1.15rem;
    margin-bottom:0.7rem;
    color:var(--ink);
  }
  .structure-item p{
    font-size:0.9rem;
    color:var(--ink-dim);
  }

  /* ===== Cartas / Galeria ===== */
  .cards-grid{
    max-width:1240px;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:1.6rem;
  }
  .card{
    position:relative;
    border-radius:6px;
    overflow:hidden;
    border:1px solid var(--line);
    aspect-ratio:2/3;
    cursor:default;
    --accent:var(--gold);
  }
  .card[data-orixa="iansa"]{--accent:var(--c-iansa);}
  .card[data-orixa="iemanja"]{--accent:var(--c-iemanja);}
  .card[data-orixa="ifa"]{--accent:var(--c-ifa);}
  .card[data-orixa="nana"]{--accent:var(--c-nana);}
  .card[data-orixa="oba"]{--accent:var(--c-oba);}

  .card img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
    transition:transform 0.8s cubic-bezier(.2,.7,.2,1), filter 0.5s;
    filter:saturate(0.95);
  }
  .card:hover img{transform:scale(1.06);}
  .card-overlay{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:1.4rem;
    background:linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.1) 55%, transparent 100%);
  }
  .card-overlay .tag{
    font-size:0.65rem;
    letter-spacing:0.28em;
    text-transform:uppercase;
    color:var(--accent);
    margin-bottom:0.4rem;
    filter:brightness(1.5);
  }
  .card-overlay h3{
    font-size:1.4rem;
    color:#fff;
  }
  .card-overlay p{
    font-size:0.85rem;
    color:rgba(255,255,255,0.7);
    margin-top:0.4rem;
    max-height:0;
    overflow:hidden;
    transition:max-height 0.4s ease;
  }
  .card:hover .card-overlay p{max-height:6em;}
  .card::after{
    content:'';
    position:absolute;
    inset:0;
    border:1px solid var(--accent);
    opacity:0;
    transition:opacity 0.4s;
    pointer-events:none;
    mix-blend-mode:screen;
  }
  .card:hover::after{opacity:0.5;}

  .gallery-note{
    text-align:center;
    margin-top:3rem;
    color:var(--ink-dim);
    font-size:0.92rem;
    font-style:italic;
    font-family:'Cormorant Garamond',serif;
  }

  /* ===== Citação ===== */
  .quote-block{
    max-width:760px;
    margin:0 auto;
    text-align:center;
  }
  .quote-block blockquote{
    font-family:'Cormorant Garamond',serif;
    font-style:italic;
    font-size:clamp(1.5rem,3vw,2.1rem);
    line-height:1.5;
    color:var(--ink);
  }
  .quote-block cite{
    display:block;
    margin-top:1.4rem;
    font-style:normal;
    font-size:0.8rem;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--gold);
  }

  /* ===== Livro ===== */
  .book{
    background:var(--bg-soft);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .book-inner{
    max-width:900px;
    margin:0 auto;
    text-align:center;
  }
  .book-inner .eyebrow{margin-bottom:1rem;}
  .book-inner h2{font-size:clamp(1.9rem,4vw,2.8rem);margin-bottom:1.2rem;}
  .book-inner p{color:var(--ink-dim);max-width:620px;margin:0 auto 1.1rem;}
  .book-toc{
    margin:2.6rem auto 0;
    max-width:760px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0.6rem 3rem;
    text-align:left;
  }
  .book-toc div{
    display:flex;
    justify-content:space-between;
    padding:0.55rem 0;
    border-bottom:1px solid var(--line);
    font-size:0.92rem;
    color:var(--ink-dim);
  }
  .book-toc div span:first-child{color:var(--ink);}
  .book-toc div span:last-child{
    font-family:'Cormorant Garamond',serif;
    font-style:italic;
    color:var(--gold);
  }

  /* ===== Contato / Footer ===== */
  .contact{
    text-align:center;
  }
  .contact .section-head h2{margin-bottom:0.6rem;}
  .contact-form{
    max-width:480px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:1rem;
  }
  .contact-form input, .contact-form textarea{
    background:transparent;
    border:1px solid var(--line);
    border-radius:4px;
    padding:0.9rem 1.1rem;
    color:var(--ink);
    font-family:'Jost',sans-serif;
    font-size:0.95rem;
    resize:vertical;
  }
  .contact-form input::placeholder, .contact-form textarea::placeholder{color:var(--ink-dim);}
  .contact-form input:focus, .contact-form textarea:focus{
    outline:none;
    border-color:var(--gold);
  }
  .contact-form button{
    margin-top:0.4rem;
    align-self:center;
  }

  footer{
    padding:3rem 1.5rem;
    text-align:center;
    border-top:1px solid var(--line);
    color:var(--ink-dim);
    font-size:0.8rem;
    letter-spacing:0.08em;
  }
  footer .logo{margin-bottom:1rem;}
  footer .foot-links{
    display:flex;
    justify-content:center;
    gap:2rem;
    margin-bottom:1.4rem;
    flex-wrap:wrap;
  }
  footer .foot-links a{
    font-size:0.72rem;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--ink-dim);
  }
  footer .foot-links a:hover{color:var(--gold-bright);}

  /* ===== Reveal on scroll ===== */
  .reveal{
    opacity:0;
    transform:translateY(24px);
    transition:opacity 0.9s ease, transform 0.9s ease;
  }
  .reveal.visible{opacity:1;transform:translateY(0);}


  /* ===== Consulta ===== */
  .consulta{
    background:var(--bg);
    position:relative;
    overflow:hidden;
    text-align:center;
  }
  .consulta::before{
    content:'';
    position:absolute;
    inset:0;
    background:
      radial-gradient(ellipse at 50% 50%, rgba(205,163,90,0.10), transparent 65%);
    pointer-events:none;
  }
  .consulta-inner{
    position:relative;
    z-index:1;
    max-width:700px;
    margin:0 auto;
  }
  .consulta-ring{
    width:220px;height:220px;
    border-radius:50%;
    border:1px solid var(--gold);
    margin:0 auto 2.8rem;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    animation:spin 30s linear infinite;
  }
  .consulta-ring::before{
    content:'';
    position:absolute;
    inset:14%;
    border-radius:50%;
    border:1px solid rgba(205,163,90,0.35);
  }
  .consulta-ring-center{
    animation:spin 30s linear infinite reverse;
    font-family:'Marcellus',serif;
    font-size:2.8rem;
    color:var(--gold);
    line-height:1;
  }
  .consulta h2{
    font-size:clamp(2rem,4.5vw,3.2rem);
    margin-bottom:1.2rem;
  }
  .consulta p{
    color:var(--ink-dim);
    max-width:520px;
    margin:0 auto 2.4rem;
    font-size:1.05rem;
  }
  .btn-primary{
    display:inline-block;
    padding:1.1rem 3rem;
    background:var(--gold);
    border:1px solid var(--gold);
    border-radius:999px;
    font-size:0.82rem;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--bg);
    font-weight:500;
    transition:all 0.35s;
    box-shadow:0 0 40px rgba(205,163,90,0.25);
  }
  .btn-primary:hover{
    background:var(--gold-bright);
    border-color:var(--gold-bright);
    box-shadow:0 0 60px rgba(205,163,90,0.4);
  }
  .consulta-note{
    margin-top:1.6rem;
    font-size:0.78rem;
    letter-spacing:0.12em;
    color:var(--ink-dim);
    opacity:0.7;
  }

  /* ===== Reduced motion ===== */
  @media (prefers-reduced-motion: reduce){
    .hero-ring,.hero-glyphs,.scroll-cue::after,.consulta-ring{animation:none;}
    .reveal{transition:none;opacity:1;transform:none;}
    .card img{transition:none;}
  }

  /* ===== Responsive ===== */
  @media (max-width:860px){
    nav{
      position:fixed;
      top:0;right:0;
      height:100vh;
      width:240px;
      background:var(--bg-soft);
      border-left:1px solid var(--line);
      flex-direction:column;
      justify-content:center;
      align-items:flex-start;
      gap:2rem;
      padding:0 2.4rem;
      transform:translateX(100%);
      transition:transform 0.4s ease;
      z-index:99;
    }
    nav.open{transform:translateX(0);}
    .nav-toggle{
      display:flex;
      flex-direction:column;
      gap:5px;
      cursor:pointer;
      z-index:101;
      background:none;
      border:none;
      padding:0.4rem;
    }
    .nav-toggle span{
      display:block;width:22px;height:1px;background:var(--ink);
    }
    .about{grid-template-columns:1fr;gap:2.4rem;}
    .about-visual{aspect-ratio:4/3;}
    .structure-grid{grid-template-columns:repeat(2,1fr);}
    .book-toc{grid-template-columns:1fr;}
  }

  @media (max-width:520px){
    .hero-glyph{width:38px;height:38px;}
    section{padding:5rem 1.2rem;}
  }


/* WordPress menu normalization */
header .menu, footer .menu { list-style:none; margin:0; padding:0; }
header .menu { display:flex; gap:2.4rem; }
header .menu li, footer .menu li { margin:0; padding:0; }
header .menu a { font-size:0.78rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-dim); transition:color 0.3s; }
header .menu a:hover { color:var(--gold-bright); }
footer .foot-links, footer .menu { display:flex; justify-content:center; gap:2rem; margin-bottom:1.4rem; flex-wrap:wrap; }
footer .menu a { font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--ink-dim); }
footer .menu a:hover { color:var(--gold-bright); }
@media (max-width:860px){
  header .menu{
    position:fixed; top:0; right:0; height:100vh; width:240px; background:var(--bg-soft);
    border-left:1px solid var(--line); flex-direction:column; justify-content:center; align-items:flex-start;
    gap:2rem; padding:0 2.4rem; transform:translateX(100%); transition:transform 0.4s ease; z-index:99;
  }
  header .menu.open{ transform:translateX(0); }
}
.admin-bar header { top:32px; }
@media (max-width:782px){ .admin-bar header { top:46px; } }