/* =====================================================================
   ARQUITETOS DA VIRTUDE — SISTEMA ÚNICO DE BACKGROUNDS CONTEXTUAIS
   Cada .scene-surface / .article-scene tem seu próprio fundo e rola junto
   com a seção. O frontend original (posições, tipografia, cards e hero)
   não é reposicionado por este arquivo.
   ===================================================================== */

:root{
  --scene-blue: rgba(54,86,196,.17);
  --scene-gold: rgba(201,162,39,.15);
}

/* Remove qualquer interferência visual do linework antigo, caso reste no cache. */
.masonic-linework-bg{display:none!important}

.scene-surface,
.article-scene{
  position:relative;
  isolation:isolate;
  --scene-image:none;
  --scene-opacity:.18;
  --scene-size:min(1380px, 96vw) auto;
  --scene-position:center center;
  --scene-blue-strength:.11;
  --scene-gold-strength:.09;
}

/* Fundo contextual. Não é fixed: acompanha a rolagem da própria seção. */
.scene-surface::before,
.article-scene::before{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-2;
  background-image:var(--scene-image);
  background-repeat:no-repeat;
  background-position:var(--scene-position);
  background-size:var(--scene-size);
  opacity:var(--scene-opacity);
  filter:saturate(.92) contrast(.96);
  -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 10%, #000 90%, transparent 100%);
  mask-image:linear-gradient(to bottom, transparent 0%, #000 10%, #000 90%, transparent 100%);
}
.scene-surface::before{inset:-70px 0}
.article-scene::before{top:-78px;bottom:-78px;left:-390px;right:-180px}

/* Luz azul à esquerda / dourada à direita. Também pertence à seção. */
.scene-surface::after,
.article-scene::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(ellipse 48% 62% at 4% 42%, rgba(53,82,188,var(--scene-blue-strength)) 0%, transparent 72%),
    radial-gradient(ellipse 48% 62% at 96% 42%, rgba(201,162,39,var(--scene-gold-strength)) 0%, transparent 72%),
    linear-gradient(180deg, rgba(6,11,26,.82) 0%, transparent 15%, transparent 85%, rgba(6,11,26,.82) 100%);
}
.scene-surface::after{inset:-40px 0}
.article-scene::after{top:-52px;bottom:-52px;left:-390px;right:-180px}

/* Cenas reutilizáveis */
[data-scene="temple"]{
  --scene-image:url('./images/scene-temple-sun-moon.png');
  --scene-opacity:.21;
  --scene-position:center center;
  --scene-size:min(1440px, 98vw) auto;
  --scene-blue-strength:.14;
  --scene-gold-strength:.12;
}
[data-scene="columns"]{
  --scene-image:url('./images/scene-temple-columns.png');
  --scene-opacity:.19;
  --scene-size:min(1420px, 98vw) auto;
}
[data-scene="overview"]{
  --scene-image:url('./images/scene-overview.png');
  --scene-opacity:.15;
  --scene-size:min(760px, 55vw) auto;
  --scene-position:88% center;
}
[data-scene="history"]{
  --scene-image:url('./images/scene-history.png');
  --scene-opacity:.17;
  --scene-size:min(1410px, 98vw) auto;
  --scene-position:center center;
}
[data-scene="myths"]{
  --scene-image:url('./images/scene-myths.png');
  --scene-opacity:.17;
  --scene-size:min(1410px, 98vw) auto;
  --scene-position:center center;
}
[data-scene="rito"]{
  --scene-image:url('./images/scene-rito.png');
  --scene-opacity:.19;
  --scene-size:min(1420px, 98vw) auto;
}
[data-scene="rito-history"]{
  --scene-image:url('./images/scene-rito-history.png');
  --scene-opacity:.17;
  --scene-size:min(1420px, 98vw) auto;
}
[data-scene="philanthropy"]{
  --scene-image:url('./images/filantropia-clean.png');
  --scene-opacity:.105;
  --scene-size:min(520px, 38vw) auto;
  --scene-position:88% center;
}
[data-scene="sacred-book"]{
  --scene-image:url('./images/livro-lei-sagrada.webp');
  --scene-opacity:.105;
  --scene-size:min(500px, 36vw) auto;
  --scene-position:11% center;
}
[data-scene="symbols"]{
  --scene-image:url('./images/esquadro-compasso.webp');
  --scene-opacity:.085;
  --scene-size:min(590px, 42vw) auto;
  --scene-position:88% center;
}
[data-scene="moon"]{
  --scene-image:url('./images/lua-estrelas.webp');
  --scene-opacity:.09;
  --scene-size:min(500px, 36vw) auto;
  --scene-position:9% center;
}

/* Restaura exatamente a lógica de espaçamento original após envolver o artigo em seções. */
article > .article-scene > h2{margin-top:60px}
article > .article-scene:first-child > h2{margin-top:0}

/* Menu lateral: seção ativa realmente acompanha o scroll e o próprio menu se reposiciona. */
.toc{scrollbar-width:thin;scrollbar-color:rgba(201,162,39,.55) rgba(16,27,60,.25)}
.toc::-webkit-scrollbar{width:6px}
.toc::-webkit-scrollbar-track{background:rgba(16,27,60,.2);border-radius:10px}
.toc::-webkit-scrollbar-thumb{background:rgba(201,162,39,.48);border-radius:10px}
.toc a{position:relative;transition:color .25s,border-color .25s,padding .25s,transform .25s,background .25s}
.toc a.active{
  color:var(--gold-bright)!important;
  border-left-color:var(--gold)!important;
  padding-left:22px!important;
  transform:translateX(4px);
  background:linear-gradient(90deg,rgba(201,162,39,.10),transparent 78%);
  text-shadow:0 0 16px rgba(227,195,77,.18);
}
.toc a.active::before{
  content:"✦";
  position:absolute;
  left:6px;
  top:7px;
  color:var(--gold-bright);
  font-size:.62rem;
}

/* Imagens editoriais já prontas dentro do HTML para quebrar páginas muito textuais. */
.story-visual{
  margin:30px 0 36px;
  border:1px solid rgba(201,162,39,.22);
  border-radius:20px;
  overflow:hidden;
  background:linear-gradient(150deg,rgba(24,38,79,.48),rgba(6,11,26,.78));
  box-shadow:0 18px 44px rgba(0,0,0,.28);
}
.story-visual img{
  display:block;
  width:100%;
  max-height:410px;
  object-fit:contain;
  padding:10px 12px 0;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,.32));
}
.story-visual figcaption{
  padding:14px 20px 18px;
  border-top:1px solid rgba(201,162,39,.14);
  color:var(--ivory-dim);
  font-family:var(--garamond);
  font-size:1.04rem;
  text-align:center;
}

/* Em telas menores o desenho fica mais central, sem cobrir o texto. */
@media(max-width:900px){
  .scene-surface::before{inset:-40px 0}
  .article-scene::before{left:-80px;right:-80px;top:-50px;bottom:-50px}
  .article-scene::after{left:-80px;right:-80px}
  [data-scene="overview"], [data-scene="symbols"], [data-scene="philanthropy"], [data-scene="sacred-book"], [data-scene="moon"]{
    --scene-position:center center;
    --scene-size:min(720px, 84vw) auto;
    --scene-opacity:.09;
  }
}


/* =====================================================================
   CORREÇÃO DIRECIONADA DAS PÁGINAS INTERNAS
   - não altera o INDEX
   - remove fundos repetidos por seção
   - elimina faixas/sombras nas emendas
   - protege o menu lateral
   - adiciona imagens editoriais contextuais menores
   ===================================================================== */

/* O problema das "emendas" vinha dos pseudo-elementos de cada article-scene.
   Nas páginas internas eles são desligados. O céu/constelações original continua. */
.article-scene::before,
.article-scene::after{
  display:none!important;
}

/* Mantém as seções limpas e contínuas, sem blocos escurecendo uma à outra. */
.article-scene{
  position:relative;
  isolation:auto;
  padding:0 0 26px;
  overflow:visible;
}
article > .article-scene + .article-scene{
  border-top:1px solid rgba(201,162,39,.055);
}
article > .article-scene > h2{
  margin-top:54px;
}
article > .article-scene:first-child > h2{
  margin-top:0;
}

/* Fundo contínuo das páginas longas: não termina a cada seção. */
.layout{
  position:relative;
  isolation:isolate;
}
.layout::before{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
  top:-40px;
  bottom:-90px;
  left:-120px;
  right:-120px;
  background:
    radial-gradient(ellipse 38% 18% at 10% 10%,rgba(49,76,177,.10),transparent 72%),
    radial-gradient(ellipse 38% 18% at 90% 10%,rgba(201,162,39,.075),transparent 72%),
    radial-gradient(ellipse 44% 20% at 50% 54%,rgba(24,38,79,.08),transparent 75%);
}

/* O menu nunca mais fica "apagado" por imagem/background. */
.toc{
  z-index:30!important;
  position:sticky!important;
  top:100px!important;
  background:
    linear-gradient(90deg,
      rgba(6,11,26,.97) 0%,
      rgba(6,11,26,.91) 70%,
      rgba(6,11,26,.58) 88%,
      transparent 100%);
  border-radius:14px;
  padding:18px 12px 18px 12px!important;
  box-shadow:0 14px 35px rgba(0,0,0,.12);
}
.toc h4{
  position:relative;
  z-index:2;
}
.toc a{
  opacity:.66;
  position:relative;
  z-index:2;
}
.toc a.active{
  opacity:1!important;
  color:var(--gold-bright)!important;
  border-left-color:var(--gold)!important;
  background:linear-gradient(90deg,rgba(201,162,39,.15),transparent 82%)!important;
  padding-left:24px!important;
  transform:translateX(3px);
  text-shadow:0 0 15px rgba(227,195,77,.22);
}
.toc a.active::before{
  content:"✦";
  position:absolute;
  left:7px;
  top:7px;
  color:var(--gold-bright);
  font-size:.62rem;
}

/* As imagens agora são conteúdo editorial, não background repetido. */
.story-visual{
  display:none!important;
}
.context-visual{
  float:right;
  width:min(285px, 39%);
  margin:6px 0 22px 30px;
  padding:10px;
  border:1px solid rgba(201,162,39,.18);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(16,27,60,.62),rgba(6,11,26,.34));
  box-shadow:0 16px 36px rgba(0,0,0,.22);
}
.context-visual img{
  display:block;
  width:100%;
  height:190px;
  object-fit:contain;
  border-radius:12px;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.30));
}
.context-visual figcaption{
  margin-top:9px;
  color:var(--muted);
  font-size:.75rem;
  line-height:1.35;
  text-align:center;
  font-family:var(--body);
}
.article-scene::after{
  content:"";
  display:block!important;
  clear:both;
  position:static!important;
  background:none!important;
}

/* Em seções curtas, não deixa a imagem empurrar demais o conteúdo. */
.article-scene.compact-visual .context-visual img{
  height:160px;
}

/* Mobile */
@media(max-width:900px){
  .toc{display:none!important}
  .layout::before{left:-30px;right:-30px}
  .context-visual{
    float:none;
    width:100%;
    max-width:520px;
    margin:24px auto 24px;
  }
  .context-visual img{
    height:auto;
    max-height:300px;
  }
}


/* =====================================================================
   PÁGINAS INTERNAS — LARGURA TOTAL + IMAGENS HISTÓRICAS REAIS
   NÃO afeta o index.html.
   ===================================================================== */
.internal-page .article-container{
  width:calc(100% - 44px)!important;
  max-width:1500px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
}
.internal-page .layout{
  width:100%!important;
  grid-template-columns:270px minmax(0,1fr)!important;
  gap:48px!important;
  align-items:start;
}
.internal-page article{
  max-width:none!important;
  width:100%!important;
  min-width:0!important;
}
.internal-page .article-scene{
  width:100%!important;
  max-width:none!important;
  padding-right:18px!important;
}
.internal-page .article-scene > p,
.internal-page .article-scene > ul,
.internal-page .article-scene > blockquote,
.internal-page .article-scene > .bio,
.internal-page .article-scene > .source{
  max-width:none!important;
}

/* Cards de imagens reais — menores e diretamente ligados ao assunto. */
.real-context-image{
  float:right;
  width:320px;
  max-width:38%;
  margin:4px 0 22px 32px;
  padding:9px;
  border:1px solid rgba(201,162,39,.20);
  border-radius:16px;
  background:rgba(11,20,48,.66);
  box-shadow:0 14px 34px rgba(0,0,0,.24);
}
.real-context-image img{
  display:block;
  width:100%;
  height:205px;
  object-fit:cover;
  object-position:center;
  border-radius:10px;
}
.real-context-image.portrait img{
  height:240px;
  object-fit:cover;
  object-position:center 22%;
}
.real-context-image.document img{
  height:230px;
  object-fit:contain;
  background:rgba(244,239,227,.045);
}
.real-context-image figcaption{
  margin-top:8px;
  color:var(--muted);
  font-size:.72rem;
  line-height:1.4;
}
.real-context-image figcaption a{
  color:var(--gold);
  text-decoration:none;
}
.real-context-image figcaption a:hover{
  color:var(--gold-bright);
}
.image-credit{
  opacity:.75;
}
.article-scene::after{
  content:"";
  display:block!important;
  clear:both;
}

/* Dupla histórica de 1813 */
.real-context-duo{
  float:right;
  width:min(430px,46%);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:4px 0 24px 32px;
}
.real-context-duo .real-context-image{
  float:none;
  width:100%;
  max-width:none;
  margin:0;
}
.real-context-duo .real-context-image img{
  height:205px;
}

/* Menu lateral: continua visível, nunca é encoberto pelo conteúdo. */
.internal-page .toc{
  z-index:40!important;
  position:sticky!important;
  top:96px!important;
  background:linear-gradient(90deg,rgba(6,11,26,.97),rgba(6,11,26,.90) 78%,rgba(6,11,26,.45));
  border-radius:14px;
  padding:18px 10px 18px 12px!important;
}
.internal-page .toc a.active{
  color:var(--gold-bright)!important;
  opacity:1!important;
  border-left-color:var(--gold)!important;
  background:linear-gradient(90deg,rgba(201,162,39,.15),transparent 82%)!important;
}

/* Não usar mais cards genéricos produzidos por IA nas páginas internas. */
.internal-page .context-visual,
.internal-page .story-visual{
  display:none!important;
}

@media(max-width:1050px){
  .internal-page .article-container{
    width:calc(100% - 28px)!important;
  }
  .internal-page .layout{
    grid-template-columns:230px minmax(0,1fr)!important;
    gap:30px!important;
  }
  .real-context-image{
    width:285px;
    max-width:42%;
  }
}
@media(max-width:900px){
  .internal-page .layout{
    display:block!important;
  }
  .internal-page .toc{
    display:none!important;
  }
  .real-context-image,
  .real-context-duo{
    float:none!important;
    width:100%!important;
    max-width:560px!important;
    margin:22px auto 26px!important;
  }
  .real-context-duo{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:560px){
  .real-context-duo{
    grid-template-columns:1fr;
  }
  .real-context-image img,
  .real-context-image.portrait img,
  .real-context-image.document img{
    height:auto;
    max-height:340px;
  }
}


/* =========================================================
   AJUSTES SOLICITADOS PELO USUÁRIO — VERSÃO AMBIENTADA
   - remove linha divisória entre seções
   - imagens reais em cada seção, integradas ao fundo
   - sem moldura, sem card, sem legenda visual
   ========================================================= */
.internal-page article > .article-scene + .article-scene{
  border-top:none!important;
}
.internal-page .article-scene{
  padding:0 0 22px!important;
}
.internal-page .article-scene::before,
.internal-page .article-scene::after{
  display:none!important;
}
.internal-page .layout::before{
  background:
    radial-gradient(ellipse 38% 18% at 10% 10%,rgba(49,76,177,.09),transparent 72%),
    radial-gradient(ellipse 38% 18% at 90% 10%,rgba(201,162,39,.06),transparent 72%),
    radial-gradient(ellipse 44% 20% at 50% 54%,rgba(24,38,79,.07),transparent 75%)!important;
}

/* imagem integrada */
.internal-page .ambient-photo{
  --photo-w:min(340px, 38%);
  --photo-h:248px;
  float:right;
  width:var(--photo-w);
  height:var(--photo-h);
  margin:8px 0 18px 28px;
  background-image:var(--ambient-image);
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  opacity:.92;
  filter:saturate(.86) brightness(.88) contrast(.94);
  shape-outside:inset(0 round 30px);
  -webkit-shape-outside:inset(0 round 30px);
  clip-path:inset(0 round 26px);
  -webkit-mask-image:radial-gradient(circle at center, rgba(0,0,0,1) 52%, rgba(0,0,0,.94) 64%, rgba(0,0,0,.70) 78%, rgba(0,0,0,0) 100%);
  mask-image:radial-gradient(circle at center, rgba(0,0,0,1) 52%, rgba(0,0,0,.94) 64%, rgba(0,0,0,.70) 78%, rgba(0,0,0,0) 100%);
  box-shadow:none!important;
  border:none!important;
  background-color:transparent!important;
}
.internal-page .ambient-photo.left{
  float:left;
  margin:8px 28px 18px 0;
}
.internal-page .ambient-photo.portrait{
  --photo-h:286px;
  background-size:contain;
}
.internal-page .ambient-photo.document{
  --photo-h:250px;
  background-size:contain;
  filter:saturate(.70) brightness(.98) contrast(.92);
  -webkit-mask-image:radial-gradient(circle at center, rgba(0,0,0,1) 46%, rgba(0,0,0,.88) 62%, rgba(0,0,0,.50) 78%, rgba(0,0,0,0) 100%);
  mask-image:radial-gradient(circle at center, rgba(0,0,0,1) 46%, rgba(0,0,0,.88) 62%, rgba(0,0,0,.50) 78%, rgba(0,0,0,0) 100%);
}
.internal-page .ambient-photo.landscape{
  --photo-h:220px;
}
.internal-page .real-context-image,
.internal-page .real-context-duo,
.internal-page .context-visual,
.internal-page .story-visual{
  display:none!important;
}

/* dá mais fôlego ao texto para página leiga */
.internal-page article p,
.internal-page article li{
  color:rgba(244,239,227,.92);
}
.internal-page article blockquote{
  border-left:none!important;
  padding-left:0!important;
  color:rgba(244,239,227,.92)!important;
  font-style:italic;
}

@media(max-width:1050px){
  .internal-page .ambient-photo{
    --photo-w:min(300px, 41%);
    margin-top:6px;
  }
}
@media(max-width:900px){
  .internal-page .ambient-photo,
  .internal-page .ambient-photo.left,
  .internal-page .ambient-photo.right{
    float:none!important;
    width:100%!important;
    max-width:520px!important;
    height:230px!important;
    margin:18px auto 20px!important;
    shape-outside:none!important;
    -webkit-shape-outside:none!important;
  }
  .internal-page .ambient-photo.portrait,
  .internal-page .ambient-photo.document{
    background-size:contain;
    height:260px!important;
  }
}


/* ============================================================
   CORREÇÃO PONTUAL — 29/08
   1. sem linha entre hero/seções
   2. fotos reais visíveis em todas as seções
   3. fotos sem card/moldura e com bordas dissolvidas no fundo
   ============================================================ */

.internal-page .hero{
  border-bottom:0!important;
  box-shadow:none!important;
}
.internal-page article > .article-scene,
.internal-page article > .article-scene + .article-scene{
  border-top:0!important;
  border-bottom:0!important;
}
.internal-page .article-scene::before,
.internal-page .article-scene::after{
  border:0!important;
}

/* elimina os antigos placeholders que estavam deixando "buracos" */
.internal-page .ambient-photo,
.internal-page .real-context-image,
.internal-page .real-context-duo,
.internal-page .context-visual,
.internal-page .story-visual{
  display:none!important;
}

/* Imagem visível e integrada ao texto */
.internal-page .section-real-photo{
  display:block;
  float:right;
  width:min(360px, 39%);
  margin:6px 0 22px 30px;
  shape-outside:ellipse(48% 48% at 50% 50%);
  -webkit-shape-outside:ellipse(48% 48% at 50% 50%);
}
.internal-page .section-real-photo.left{
  float:left;
  margin:6px 30px 22px 0;
}
.internal-page .section-real-photo img{
  display:block;
  width:100%;
  height:245px;
  object-fit:cover;
  object-position:center;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  opacity:.88;
  filter:saturate(.82) brightness(.88) contrast(1.02);
  -webkit-mask-image:radial-gradient(ellipse at center,
    #000 0%,
    #000 54%,
    rgba(0,0,0,.93) 65%,
    rgba(0,0,0,.62) 78%,
    rgba(0,0,0,.20) 91%,
    transparent 100%);
  mask-image:radial-gradient(ellipse at center,
    #000 0%,
    #000 54%,
    rgba(0,0,0,.93) 65%,
    rgba(0,0,0,.62) 78%,
    rgba(0,0,0,.20) 91%,
    transparent 100%);
}
.internal-page .article-scene::after{
  content:"";
  display:block!important;
  clear:both;
  position:static!important;
  background:none!important;
}

/* Não cria qualquer linha de separação visual entre tópicos */
.internal-page .article-scene + .article-scene{
  margin-top:8px!important;
}
.internal-page .article-scene > h2{
  margin-top:48px!important;
}
.internal-page .article-scene:first-child > h2{
  margin-top:0!important;
}

@media(max-width:980px){
  .internal-page .section-real-photo{
    width:min(315px,42%);
  }
}
@media(max-width:900px){
  .internal-page .section-real-photo,
  .internal-page .section-real-photo.left{
    float:none!important;
    width:100%!important;
    max-width:560px!important;
    margin:18px auto 24px!important;
    shape-outside:none!important;
    -webkit-shape-outside:none!important;
  }
  .internal-page .section-real-photo img{
    height:270px;
  }
}


/* ============================================================
   AJUSTE FINAL — continuidade visual + fotos reais integradas
   ============================================================ */
.internal-page .container.article-container{
  position:relative;
  margin-top:-28px!important;
  padding-top:28px!important;
}
.internal-page .hero{
  padding-bottom:132px!important;
  overflow:hidden!important;
}
.internal-page .hero.scene-surface::before{
  inset:-90px 0 -120px 0!important;
  opacity:.24!important;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 10%, #000 62%, rgba(0,0,0,.88) 74%, rgba(0,0,0,.36) 88%, transparent 100%)!important;
  mask-image:linear-gradient(to bottom, transparent 0%, #000 10%, #000 62%, rgba(0,0,0,.88) 74%, rgba(0,0,0,.36) 88%, transparent 100%)!important;
}
.internal-page .hero::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:190px;
  pointer-events:none;
  z-index:-1;
  background:
    linear-gradient(to bottom, rgba(6,11,26,0) 0%, rgba(6,11,26,.14) 22%, rgba(6,11,26,.44) 55%, rgba(6,11,26,.78) 76%, rgba(6,11,26,.98) 100%),
    radial-gradient(ellipse 44% 60% at 12% 56%, rgba(54,86,196,.08), transparent 70%),
    radial-gradient(ellipse 42% 56% at 86% 56%, rgba(201,162,39,.06), transparent 72%);
}
.internal-page .layout{padding-top:4px!important;}
.internal-page article > .article-scene,
.internal-page article > .article-scene + .article-scene,
.internal-page article > .article-scene::before,
.internal-page article > .article-scene::after{
  border:0!important;
  box-shadow:none!important;
}
.internal-page article > .article-scene + .article-scene{margin-top:2px!important;}
.internal-page .section-real-photo,
.internal-page .section-real-photo.left{
  display:block!important;
  float:right;
  width:min(370px,39%);
  max-width:39%;
  margin:4px 0 20px 30px!important;
  padding:0!important;
  background:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  overflow:visible!important;
  shape-outside:ellipse(46% 44% at 50% 50%);
  -webkit-shape-outside:ellipse(46% 44% at 50% 50%);
}
.internal-page .section-real-photo.left{
  float:left;
  margin:4px 30px 20px 0!important;
}
.internal-page .section-real-photo img{
  display:block;
  width:100%;
  height:250px!important;
  object-fit:cover!important;
  object-position:center!important;
  background:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  opacity:.92!important;
  filter:saturate(.86) brightness(.92) contrast(1.03)!important;
  -webkit-mask-image:linear-gradient(to right, transparent 0%, rgba(0,0,0,.96) 10%, #000 21%, #000 79%, rgba(0,0,0,.96) 90%, transparent 100%), linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.94) 10%, #000 20%, #000 80%, rgba(0,0,0,.94) 90%, transparent 100%)!important;
  mask-image:linear-gradient(to right, transparent 0%, rgba(0,0,0,.96) 10%, #000 21%, #000 79%, rgba(0,0,0,.96) 90%, transparent 100%), linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.94) 10%, #000 20%, #000 80%, rgba(0,0,0,.94) 90%, transparent 100%)!important;
}
.internal-page blockquote{border-left:0!important;padding-left:0!important;}
@media(max-width:980px){
  .internal-page .section-real-photo,
  .internal-page .section-real-photo.left{width:min(320px,42%);max-width:42%;}
}
@media(max-width:900px){
  .internal-page .container.article-container{margin-top:-18px!important;padding-top:18px!important;}
  .internal-page .hero{padding-bottom:96px!important;}
  .internal-page .section-real-photo,
  .internal-page .section-real-photo.left{float:none!important;width:100%!important;max-width:560px!important;margin:18px auto 24px!important;shape-outside:none!important;-webkit-shape-outside:none!important;}
  .internal-page .section-real-photo img{height:270px!important;}
}


/* ============================================================
   V3 FINAL — correções de layout pedidas pelo usuário
   ============================================================ */
.internal-page header{padding:12px 0!important}
.internal-page header.scrolled{padding:9px 0!important}
.internal-page .hero{
  padding:150px 24px 64px!important;
  overflow:hidden!important;
  border-bottom:none!important;
}
.internal-page .hero.scene-surface::before{
  inset:-46px 0 -28px 0!important;
  opacity:.18!important;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 14%, #000 86%, transparent 100%)!important;
  mask-image:linear-gradient(to bottom, transparent 0%, #000 14%, #000 86%, transparent 100%)!important;
}
.internal-page .hero::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:80px;
  pointer-events:none;
  z-index:-1;
  background:linear-gradient(to bottom, rgba(6,11,26,0) 0%, rgba(6,11,26,.18) 45%, rgba(6,11,26,.62) 100%);
}
.internal-page .container.article-container{
  margin-top:0!important;
  padding-top:0!important;
}
.internal-page .layout{
  padding-top:24px!important;
  gap:54px!important;
}
.internal-page .toc{top:96px!important;max-height:calc(100vh - 120px)!important}
.internal-page .article-scene{
  display:flow-root!important;
  padding:0 0 26px!important;
  overflow:visible!important;
}
.internal-page article > .article-scene + .article-scene{
  margin-top:0!important;
  padding-top:8px!important;
  border-top:0!important;
}
.internal-page .article-scene > h2{clear:both!important}
.internal-page .section-real-photo,
.internal-page .section-real-photo.left,
.internal-page .section-real-photo.right{
  display:block!important;
  width:min(360px,37%)!important;
  max-width:37%!important;
  padding:0!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  overflow:visible!important;
}
.internal-page .section-real-photo{float:right!important;margin:6px 0 18px 28px!important}
.internal-page .section-real-photo.left{float:left!important;margin:6px 28px 18px 0!important}
.internal-page .section-real-photo.right{float:right!important;margin:6px 0 18px 28px!important}
.internal-page .section-real-photo img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center top!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  background:none!important;
  opacity:.95!important;
  filter:saturate(.92) brightness(.96) contrast(1.02)!important;
  -webkit-mask-image:radial-gradient(circle at center, #000 70%, rgba(0,0,0,.82) 83%, transparent 100%)!important;
  mask-image:radial-gradient(circle at center, #000 70%, rgba(0,0,0,.82) 83%, transparent 100%)!important;
}
.internal-page .section-real-photo img.fallback-local{
  opacity:.86!important;
  filter:saturate(.9) brightness(.94) contrast(1.01)!important;
}
@media(max-width:900px){
  .internal-page .hero{padding:138px 24px 52px!important}
  .internal-page .layout{padding-top:18px!important;gap:26px!important}
  .internal-page .section-real-photo,
  .internal-page .section-real-photo.left,
  .internal-page .section-real-photo.right{
    float:none!important;
    width:100%!important;
    max-width:540px!important;
    margin:16px auto 22px!important;
  }
}


/* ============================================================
   V4 — correção forte de alinhamento das imagens das seções
   ============================================================ */
.internal-page .article-scene{padding:0 0 34px!important; clear:both!important; overflow:visible!important}
.internal-page .article-scene > h2{clear:both!important; margin-bottom:18px!important}
.internal-page .scene-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(260px,360px)!important;
  gap:28px!important;
  align-items:start!important;
}
.internal-page .scene-layout.image-left{
  grid-template-columns:minmax(260px,360px) minmax(0,1fr)!important;
}
.internal-page .scene-copy{min-width:0!important}
.internal-page .scene-copy > *:first-child{margin-top:0!important}
.internal-page .scene-copy p,
.internal-page .scene-copy .bio,
.internal-page .scene-copy .datebox,
.internal-page .scene-copy ul,
.internal-page .scene-copy ol,
.internal-page .scene-copy blockquote,
.internal-page .scene-copy .divider,
.internal-page .scene-copy .source,
.internal-page .scene-copy .cta-final{position:relative!important; z-index:1!important}
.internal-page .section-real-photo,
.internal-page .section-real-photo.left,
.internal-page .section-real-photo.right{
  float:none!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  align-self:start!important;
  justify-self:end!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  overflow:visible!important;
}
.internal-page .scene-layout.image-left > .section-real-photo{justify-self:start!important}
.internal-page .section-real-photo img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center top!important;
  border:0!important;
  box-shadow:none!important;
  background:none!important;
  opacity:.97!important;
  position:relative!important;
  z-index:0!important;
}
.internal-page .scene-copy .date-grid,
.internal-page .scene-copy .cards-grid,
.internal-page .scene-copy .pill-grid{grid-column:1/-1!important}
@media (max-width:980px){
  .internal-page .scene-layout,
  .internal-page .scene-layout.image-left{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }
  .internal-page .section-real-photo,
  .internal-page .scene-layout.image-left > .section-real-photo{justify-self:center!important; max-width:520px!important}
}


/* =====================================================================
   V17 — RESTAURAÇÃO FINAL DOS BACKGROUNDS CONTEXTUAIS DAS PÁGINAS INTERNAS
   Mantém as fotos reais V4, o texto em grid e recupera o fundo por sessão.
   ===================================================================== */
.internal-page .article-scene{
  position:relative!important;
  isolation:isolate!important;
  overflow:visible!important;
}
.internal-page .article-scene::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  pointer-events:none!important;
  z-index:-2!important;
  top:-54px!important;
  bottom:-58px!important;
  left:-370px!important;
  right:-4vw!important;
  background-image:var(--scene-image)!important;
  background-repeat:no-repeat!important;
  background-position:var(--scene-position)!important;
  background-size:var(--scene-size)!important;
  opacity:.095!important;
  filter:saturate(.82) brightness(.82) contrast(.96)!important;
  -webkit-mask-image:linear-gradient(to bottom,
    transparent 0%,
    rgba(0,0,0,.58) 10%,
    #000 21%,
    #000 79%,
    rgba(0,0,0,.58) 90%,
    transparent 100%)!important;
  mask-image:linear-gradient(to bottom,
    transparent 0%,
    rgba(0,0,0,.58) 10%,
    #000 21%,
    #000 79%,
    rgba(0,0,0,.58) 90%,
    transparent 100%)!important;
}
.internal-page .article-scene[data-scene="temple"]::before,
.internal-page .article-scene[data-scene="columns"]::before,
.internal-page .article-scene[data-scene="history"]::before,
.internal-page .article-scene[data-scene="rito"]::before,
.internal-page .article-scene[data-scene="rito-history"]::before{
  opacity:.115!important;
}
.internal-page .article-scene > h2,
.internal-page .scene-layout,
.internal-page .scene-copy,
.internal-page .section-real-photo{
  position:relative!important;
  z-index:1!important;
}

/* Fundo ocupa visualmente toda a faixa horizontal sem criar barra/corte nas emendas. */
@media(max-width:1050px){
  .internal-page .article-scene::before{
    left:-275px!important;
    right:-28px!important;
  }
}
@media(max-width:900px){
  .internal-page .article-scene::before{
    left:-28px!important;
    right:-28px!important;
    top:-30px!important;
    bottom:-34px!important;
    opacity:.075!important;
  }
}