*{box-sizing:border-box;margin:0;padding:0}
:root{--azul:#1F5FA3;--ouro:#B5852F;--terracota:#A03E25;--slate:#64748B}
html{scroll-behavior:smooth;background:#0a1330;color:var(--azul);font-family:system-ui,-apple-system,sans-serif}
/* céu do fim de tarde: mancha laranja só lá embaixo, sobe para azul-noite */
body{min-height:100vh;position:relative;
  background:
    radial-gradient(ellipse 90% 380px at 50% 100%,rgba(232,112,44,.55) 0%,rgba(196,84,52,.28) 40%,transparent 100%),
    linear-gradient(to top,#3a2f5e 0%,#23305f 14%,#15214a 40%,#0d1738 70%,#070d25 100%)}
/* estrelas (CSS puro, sem imagem): concentradas no alto e esmaecendo para baixo, atrás dos papiros */
body::before,body::after{content:"";position:absolute;left:0;right:0;top:0;height:min(100%,1500px);pointer-events:none;z-index:0;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 30%,transparent 78%);mask-image:linear-gradient(to bottom,#000 0%,#000 30%,transparent 78%)}
body::before{background-image:
    radial-gradient(1.6px 1.6px at 59% 61%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.9px 1.9px at 26% 25%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.4px 1.4px at 82% 25%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 20% 13%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 83% 7%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 59% 22%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.3px 1.3px at 10% 9%,#fff 55%,transparent 62%),
    radial-gradient(1.8px 1.8px at 78% 5%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 58% 27%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.3px 1.3px at 39% 65%,#fff 55%,transparent 62%),
    radial-gradient(1.6px 1.6px at 60% 37%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.5px 1.5px at 12% 34%,#fff 55%,transparent 62%),
    radial-gradient(1.3px 1.3px at 67% 38%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.4px 1.4px at 15% 53%,#f6e7b4 55%,transparent 62%),
    radial-gradient(2.0px 2.0px at 51% 10%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.4px 1.4px at 2% 29%,#fff 55%,transparent 62%),
    radial-gradient(2.0px 2.0px at 62% 50%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 55% 11%,#fff 55%,transparent 62%),
    radial-gradient(1.5px 1.5px at 88% 36%,#f6e7b4 55%,transparent 62%),
    radial-gradient(2.0px 2.0px at 44% 3%,#fff 55%,transparent 62%),
    radial-gradient(1.8px 1.8px at 19% 33%,#fff 55%,transparent 62%),
    radial-gradient(1.9px 1.9px at 9% 61%,#fff 55%,transparent 62%),
    radial-gradient(1.6px 1.6px at 89% 26%,#fff 55%,transparent 62%),
    radial-gradient(1.6px 1.6px at 95% 18%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.6px 1.6px at 16% 52%,#fff 55%,transparent 62%),
    radial-gradient(1.9px 1.9px at 2% 36%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.4px 1.4px at 40% 4%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.3px 1.3px at 79% 14%,#fff 55%,transparent 62%),
    radial-gradient(1.5px 1.5px at 29% 58%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.6px 1.6px at 44% 39%,#fff 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 13% 28%,#fff 55%,transparent 62%),
    radial-gradient(1.6px 1.6px at 3% 49%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.9px 1.9px at 18% 63%,#fff 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 51% 25%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.8px 1.8px at 31% 33%,#fff 55%,transparent 62%),
    radial-gradient(1.8px 1.8px at 96% 27%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.6px 1.6px at 63% 12%,#fff 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 15% 6%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.5px 1.5px at 32% 52%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 64% 39%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.5px 1.5px at 10% 18%,#dfe8ff 55%,transparent 62%),
    radial-gradient(1.5px 1.5px at 85% 11%,#fff 55%,transparent 62%),
    radial-gradient(1.3px 1.3px at 97% 4%,#f6e7b4 55%,transparent 62%),
    radial-gradient(1.3px 1.3px at 59% 33%,#fff 55%,transparent 62%),
    radial-gradient(1.7px 1.7px at 38% 49%,#fff 55%,transparent 62%),
    radial-gradient(1.4px 1.4px at 13% 48%,#f6e7b4 55%,transparent 62%);
  background-size:760px 620px;opacity:.9}
body::after{background-image:
    radial-gradient(3.1px 3.1px at 44% 44%,#fff6d0 55%,transparent 62%),
    radial-gradient(3.3px 3.3px at 77% 4%,#ffffff 55%,transparent 62%),
    radial-gradient(2.7px 2.7px at 47% 46%,#fff6d0 55%,transparent 62%),
    radial-gradient(3.0px 3.0px at 4% 40%,#ffffff 55%,transparent 62%),
    radial-gradient(2.7px 2.7px at 10% 48%,#fff6d0 55%,transparent 62%),
    radial-gradient(2.9px 2.9px at 11% 6%,#ffffff 55%,transparent 62%),
    radial-gradient(3.3px 3.3px at 96% 4%,#fff6d0 55%,transparent 62%),
    radial-gradient(2.5px 2.5px at 45% 24%,#ffffff 55%,transparent 62%),
    radial-gradient(3.3px 3.3px at 11% 57%,#fff6d0 55%,transparent 62%),
    radial-gradient(2.4px 2.4px at 65% 38%,#ffffff 55%,transparent 62%),
    radial-gradient(2.4px 2.4px at 50% 39%,#fff6d0 55%,transparent 62%),
    radial-gradient(3.0px 3.0px at 12% 7%,#ffffff 55%,transparent 62%);
  background-size:980px 760px;animation:brilho 5s ease-in-out infinite alternate}
@keyframes brilho{from{opacity:.35}to{opacity:1}}
@media(prefers-reduced-motion:reduce){body::after{animation:none;opacity:.8}}
body>*{position:relative;z-index:1}
.header{display:flex;justify-content:space-between;align-items:center;padding:18px 4vw 18px 76px;border-bottom:2px solid rgba(181,133,47,.75)}
.brand{font-family:'Cinzel',Georgia,serif;font-size:22px;font-weight:700;color:#f6e7b4;text-decoration:none;text-transform:uppercase;letter-spacing:2px}
.logo-home{text-align:center;padding:22px 4vw 0}
.logo-home img{display:inline-block;width:min(520px,100%);height:auto;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
.header{justify-content:center}
.nav-menu{display:flex;gap:28px}
.nav-menu a{font-family:'Cinzel',Georgia,serif;color:#efe3c2;text-decoration:none;font-weight:600;font-size:14px;letter-spacing:.5px}
.nav-menu a:hover{color:#B5852F}
@media(max-width:700px){.logo-home{padding-top:60px}.header{flex-direction:column;gap:10px;padding:18px 62px 14px;text-align:center}.brand{font-size:16px;letter-spacing:1.5px}.nav-menu{gap:16px;flex-wrap:wrap;justify-content:center}}

.container{width:100%;padding:0 4vw;margin:28px 0}
.top-banners{display:grid;gap:4vw;margin:0 0 5vw}
@media(min-width:700px){.top-banners{grid-template-columns:repeat(2,minmax(0,1fr))}}
.services-grid{display:grid;gap:2.5vw;margin:0 0 30px}
@media(min-width:900px){.services-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:899px){.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.services-grid{gap:4vw}.papiro .folha{font-size:clamp(9px,2.9vw,13px);padding:0 5%}}


/* papiro aberto (CSS puro, a partir da referência do usuário) */
.papiro{display:flex;align-items:stretch;aspect-ratio:2/1;text-decoration:none;transition:transform .25s ease,filter .25s ease;
  filter:drop-shadow(0 6px 8px rgba(70,45,15,.28))}
.top-banners .papiro{aspect-ratio:2.6/1}
.papiro:hover{transform:translateY(-5px);filter:drop-shadow(0 12px 14px rgba(70,45,15,.34))}
.papiro .rolo{display:none;flex:0 0 5.5%;background:linear-gradient(90deg,#8f6f3e 0%,#c9a768 38%,#ecd9a6 55%,#b48f53 100%);border-radius:999px/14% ;box-shadow:inset 0 0 0 1px rgba(90,60,25,.25)}
.papiro .rolo.d{background:linear-gradient(90deg,#b48f53 0%,#ecd9a6 45%,#c9a768 62%,#8f6f3e 100%)}
.papiro .folha{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;padding:0 8%;
  font-family:'Cardo','GFS Didot',Georgia,serif;font-weight:700;color:#2b1d12;line-height:1.25;letter-spacing:.06em;text-transform:uppercase;
  font-size:clamp(11px,1.3vw,19px);
  background:var(--papiro-fundo);
  clip-path:polygon(0 4%,4% 0,18% 2%,36% 0,55% 2.4%,74% 0,92% 2%,100% 4%,98.6% 24%,100% 42%,98.8% 62%,100% 80%,99% 96%,92% 100%,78% 97.6%,60% 100%,40% 97.8%,20% 100%,5% 98%,0 96%,1.4% 76%,0 56%,1.2% 34%,0 18%)}
.top-banners .papiro .folha{font-size:clamp(14px,2vw,30px)}
@media(max-width:899px){.papiro .folha{font-size:clamp(12px,3.2vw,18px)}}
@media(max-width:699px){.top-banners .papiro .folha{font-size:clamp(14px,4.4vw,24px)}}

.social-bar{display:flex;justify-content:center;align-items:center;gap:20px;margin:0 0 4px}
.social-bar a img,.social-bar a svg{width:44px;height:44px;display:block;transition:transform .2s ease}
.social-bar a:hover img{transform:translateY(-3px)}
.blog-access-section{text-align:center;margin:30px 0}
.blog-access-label{font-size:14px;font-weight:700;letter-spacing:1px;color:#cbbf9f;text-transform:uppercase;margin-bottom:12px}
.blog-access-card{display:inline-block;max-width:340px;width:100%;transition:transform .25s ease}
.blog-access-card:hover{transform:translateY(-4px)}
.blog-access-card img{width:100%;height:auto;display:block;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
.footer{text-align:center;padding:20px;font-size:13px;color:#f1e6c6;border-top:2px solid var(--ouro);margin-top:40px}

/* ilustração dentro do papiro: tudo posicionado por % (não depende do tamanho do SVG; igual em todo navegador) */
.papiro{aspect-ratio:1.1/1;min-width:0;width:100%}
.papiro .folha{display:block;position:relative;padding:0;min-width:0;text-align:center}
.papiro .folha img{position:absolute;top:7%;left:10%;width:80%;height:66%;object-fit:contain;opacity:.92}
.papiro .folha b{color:var(--terracota);position:absolute;left:5%;right:5%;bottom:3%;height:21%;display:flex;align-items:center;justify-content:center;font-weight:700}
.top-banners .papiro{aspect-ratio:2.4/1}
.top-banners .papiro .folha img{top:8%;bottom:8%;left:6%;width:38%;height:84%}
.top-banners .papiro .folha b{left:48%;right:6%;top:0;bottom:0;height:auto}
@media(max-width:699px){.top-banners .papiro{aspect-ratio:2.2/1}}
html,body{max-width:100%;overflow-x:hidden}

/* redes sociais + logo do blog sobre um pedaço de papiro */
.redes-wrap{max-width:440px;margin:40px auto 30px;filter:drop-shadow(0 6px 8px rgba(70,45,15,.28))}
.redes-folha{padding:30px 7% 28px;text-align:center;
  background:var(--papiro-fundo);
  clip-path:polygon(0 4%,4% 0,18% 2%,36% 0,55% 2.4%,74% 0,92% 2%,100% 4%,98.6% 24%,100% 42%,98.8% 62%,100% 80%,99% 96%,92% 100%,78% 97.6%,60% 100%,40% 97.8%,20% 100%,5% 98%,0 96%,1.4% 76%,0 56%,1.2% 34%,0 18%)}
.redes-linha{border:0;border-top:2px solid rgba(31,95,163,.75);margin:22px 0 16px}
.redes-blog{display:block;text-decoration:none}
.redes-blog-label{display:block;font-family:'Cardo','GFS Didot',Georgia,serif;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--terracota);margin-bottom:10px}
.redes-blog img{width:100%;height:auto;display:block}

/* banner da Mentoria: Hermes Trismegisto (moldura + meandros + figura) sobre o papiro; título à esquerda */
.top-banners .papiro.mentoria-hermes{aspect-ratio:2.4/1}
.top-banners .papiro.mentoria-hermes .folha img{top:0;left:0;width:100%;height:100%;object-fit:contain;opacity:1}
.top-banners .papiro.mentoria-hermes .folha b{left:8%;right:41%;top:0;bottom:0;height:auto}

/* moldura com meandros (a mesma da Mentoria) nos demais banners, por cima do papiro */
.top-banners .papiro:not(.mentoria-hermes) .folha::after,.services-grid .papiro .folha::after{content:"";position:absolute;inset:0;pointer-events:none;background:no-repeat center/100% 100%}
.top-banners .papiro:not(.mentoria-hermes) .folha::after{background-image:url(img/moldura-larga.svg?v=2)}
.services-grid .papiro .folha::after{background-image:url(img/moldura-quadrada.svg?v=2)}
/* o conteúdo fica dentro dos meandros */
.top-banners .papiro:not(.mentoria-hermes) .folha img{top:17%;height:66%;left:8%;width:36%}
.services-grid .papiro .folha img{top:13%;height:53%}
.services-grid .papiro .folha b{bottom:12%;height:19%}

/* bloco de redes: mesma moldura com meandros; o logo do blog perdeu a moldura própria (img/logo-blog.svg) */
.redes-folha{position:relative;padding:50px 9% 48px}
.redes-folha::after{content:"";position:absolute;inset:0;pointer-events:none;border-style:solid;border-width:36px 22px;border-image:var(--moldura-img,url(img/moldura-redes.svg?v=3)) 130 80 / 36px 22px round}

/* ===== página inicial: barra de papiro com os botões e as redes; mentoria e alunos; serviços em duas colunas ===== */
.barra-wrap{max-width:460px;margin:18px auto 28px;padding:0 4vw;filter:drop-shadow(0 6px 8px rgba(70,45,15,.3))}
.barra-topo{padding:18px 7% 16px;background:var(--papiro-fundo);
  clip-path:polygon(0 4%,4% 0,18% 2%,36% 0,55% 2.4%,74% 0,92% 2%,100% 4%,98.6% 24%,100% 42%,98.8% 62%,100% 80%,99% 96%,92% 100%,78% 97.6%,60% 100%,40% 97.8%,20% 100%,5% 98%,0 96%,1.4% 76%,0 56%,1.2% 34%,0 18%)}
.cab-nav{display:flex;border:0;margin:6px 0 0;font:700 13px 'Cinzel',serif;letter-spacing:.03em;text-align:center}
.cab-nav a{flex:1;padding:9px 0;color:var(--terracota);text-decoration:none}
.cab-nav a+a{border-left:2px solid #1F5FA3}
.cab-nav a.atual{color:#B5852F}
.cab-linha{border:0;height:2px;background:#1F5FA3;margin:14px 0 12px}
.barra-topo .social-bar{margin:0}
.container{max-width:940px;margin:28px auto}
.top-banners.um{grid-template-columns:1fr!important;gap:2.5vw;margin:0}
.linha-ceu{border:0;height:2px;background:rgba(241,230,198,.55);margin:30px auto}
.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}

/* a barra de papiro também leva a moldura com meandros (todo papiro leva) */
.barra-topo.papiro-moldura{position:relative;padding:calc(130px*var(--moldura-m) + 12px) calc(80px*var(--moldura-m) + 16px)}
.barra-texto{margin:0;font:700 14px/1.6 'Cinzel',serif;color:#16233F;text-align:justify;text-align-last:center}

/* ===== computador e tablet deitado: a página inicial usa a largura (antes era uma coluna estreita no meio) ===== */
@media(min-width:900px){
  .barra-wrap{max-width:1100px}
  .barra-topo .cab-nav{max-width:640px;margin-left:auto;margin-right:auto}
  .barra-topo .barra-texto{font-size:clamp(15px,1.3vw,19px)}
  .container{max-width:1100px}
  .top-banners.um{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:2.5vw}
  .services-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* barra única: logo, linha, botões, redes, linha e texto no mesmo papiro com moldura */
.barra-wrap{margin-top:62px}
.barra-topo .cab-logo{display:block;max-width:300px;margin:0 auto}
.barra-topo .cab-logo img{display:block;width:100%;height:auto}
.barra-topo .cab-nav{margin-top:2px}
.barra-topo .social-bar{margin-top:14px}