/* Tëimur · Raças: inserção orgânica.
   Dois ritmos alternados: faixas panorâmicas que atravessam a página (Fadas, Gigantes, Povo-fera)
   e cenas laterais. Cada povo tem o material da sua terra na borda e um representante que sai da cena. */

.races-gathering img{mask-image:none!important;-webkit-mask-image:none!important}

.race-chapter{overflow-x:clip;overflow-y:visible;min-height:0!important}
.race-chapter:not(.race-band){grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)!important;gap:4vw!important;padding:80px 8%!important}
.race-chapter.reverse:not(.race-band){grid-template-columns:minmax(0,1fr) minmax(0,1.08fr)!important}

.race-art.org-art{position:relative;padding:0!important;height:760px;isolation:isolate;transform:none!important}
.race-art.org-art:hover img{transform:none}
.race-art .org-scene,.race-art .org-figure{border-radius:0!important;aspect-ratio:auto!important;object-fit:fill!important;max-height:none!important;
  -webkit-mask-image:none;mask-image:none}
.org-scene{position:absolute;display:block;height:auto;max-width:none;z-index:0;pointer-events:none;
  opacity:0;transform:translateY(24px) scale(.985)!important;transition:opacity 1.4s ease,transform 1.8s cubic-bezier(.2,.7,.2,1)!important}
.org-figure{position:absolute;display:block;width:auto;max-width:none;z-index:2;pointer-events:none;
  -webkit-mask-image:linear-gradient(#000 68%,transparent 97%)!important;mask-image:linear-gradient(#000 68%,transparent 97%)!important;
  filter:drop-shadow(0 16px 20px rgba(20,34,38,.25));
  opacity:0;transform:translateY(40px)!important;transition:opacity 1.2s ease .25s,transform 1.6s cubic-bezier(.2,.7,.2,1) .25s!important}
.race-chapter.visible .org-scene,.race-chapter.visible .org-figure{opacity:1;transform:none!important}
.race-chapter.visible .race-art{animation:none!important}
.race-copy{position:relative;z-index:3}

/* Faixas panorâmicas: a cena atravessa a página e o texto corre embaixo, em duas colunas */
.race-band{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto auto;gap:0!important;padding:40px 8% 90px!important}
.race-band .race-art{grid-column:1!important;grid-row:1;order:0!important;height:min(44vw,640px)}
.race-band .org-scene{left:-9vw;top:0;width:calc(100% + 18vw)}
.race-band .org-figure{height:80%;left:1%;bottom:-16%}
.race-band.band-right .org-figure{left:auto;right:1%}
.race-band .race-copy{grid-column:1;grid-row:2;order:0!important;max-width:min(880px,66%);margin:-10px 0 0 auto;columns:2;column-gap:6%}
.race-band.band-right .race-copy{margin:-10px auto 0 0}
.race-band .race-copy .eyebrow,.race-band .race-copy h2{column-span:all}
.race-band .race-copy p{break-inside:avoid}

/* Ajustes de cada povo: fundo da pasta Raças, representante da pasta do RPG */
.race-chapter:not(.race-band):not(.reverse) .org-scene{left:-9vw;top:2%;width:calc(100% + 9vw)}
.race-chapter.reverse:not(.race-band) .org-scene{right:-9vw;top:2%;width:calc(100% + 9vw)}
#humanos .org-figure{height:70%;right:-10%;bottom:0}
#elfos .org-figure{height:86%;left:-6%;bottom:0}
#anoes .org-figure{height:72%;right:-6%;bottom:0;scale:-1 1}
#orcs .org-figure{height:82%;left:-6%;bottom:0;scale:-1 1}
#fadas .org-figure{height:88%;bottom:-18%}
#gnomos .org-figure{height:76%;right:-6%;bottom:0}
#gigantes .org-figure{height:98%;bottom:-14%;scale:-1 1}
#povo-do-mar .org-figure{height:80%;left:-4%;bottom:-2%}
#arvan .org-figure{height:84%;bottom:-16%}
#goblins .org-figure{height:80%;right:-6%;bottom:0}

/* Efeitos de cada terra */
.org-fx{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:visible}
.org-fx i{position:absolute;display:block;opacity:0}
.org-fx i:nth-child(1){left:8%}.org-fx i:nth-child(2){left:20%;animation-delay:1.1s}.org-fx i:nth-child(3){left:33%;animation-delay:2.3s}
.org-fx i:nth-child(4){left:47%;animation-delay:3.2s}.org-fx i:nth-child(5){left:58%;animation-delay:.6s}.org-fx i:nth-child(6){left:69%;animation-delay:1.8s}
.org-fx i:nth-child(7){left:80%;animation-delay:2.8s}.org-fx i:nth-child(8){left:90%;animation-delay:3.9s}.org-fx i:nth-child(9){left:40%;animation-delay:4.6s}
.org-fx-snow i{top:-2%;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 6px rgba(255,255,255,.9);animation:rfx-fall 9s linear infinite}
.org-fx-leaves i{top:-3%;width:14px;height:9px;border-radius:0 80% 0 80%;background:linear-gradient(135deg,#e1a743,#9b5a1c);animation:rfx-fall 10s linear infinite}
.org-fx-embers i{bottom:14%;width:4px;height:4px;border-radius:50%;background:#ffcf7a;box-shadow:0 0 8px 2px rgba(255,140,40,.8);animation:rfx-rise 5.5s ease-in infinite}
.org-fx-motes i{bottom:16%;width:5px;height:5px;border-radius:50%;background:radial-gradient(circle,#fff,#e9d3ff 45%,transparent 70%);animation:rfx-rise 8s linear infinite}
.org-fx-bubbles i{bottom:10%;width:8px;height:8px;border-radius:50%;border:1px solid rgba(220,245,255,.85);background:rgba(200,240,255,.15);animation:rfx-rise 7s ease-in infinite}
.org-fx-sand i{top:40%;width:60px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,rgba(214,166,98,.7),transparent);animation:rfx-drift 4.5s linear infinite}
.org-fx-sand i:nth-child(2n){top:55%}.org-fx-sand i:nth-child(3n){top:68%}
@keyframes rfx-fall{0%{opacity:0;transform:translate(0,0) rotate(0)}10%{opacity:.9}100%{opacity:0;transform:translate(-50px,620px) rotate(300deg)}}
@keyframes rfx-rise{0%{opacity:0;transform:translate(0,0)}15%{opacity:1}100%{opacity:0;transform:translate(16px,-380px)}}
@keyframes rfx-drift{0%{opacity:0;transform:translateX(-80px)}20%{opacity:.8}100%{opacity:0;transform:translateX(260px)}}

@media(prefers-reduced-motion:reduce){.org-fx i{animation:none!important}.org-scene,.org-figure{transition:none!important;opacity:1;transform:none!important}}

@media(max-width:900px){
  .race-chapter,.race-chapter.reverse,.race-band,.race-band.band-right{display:flex!important;flex-direction:column;gap:14px!important;padding:46px 6vw!important}
  .race-art.org-art,.race-band .race-art{order:0!important;width:100%;height:min(110vw,560px)!important}
  .race-band .race-art{height:min(70vw,420px)!important}
  .race-art .org-scene,.race-band .org-scene{left:-8vw!important;right:auto!important;top:4%!important;width:116vw!important}
  .race-art .org-figure{height:88%!important;top:auto!important;bottom:0!important;left:50%!important;right:auto!important;translate:-50% 0}
  .race-band .org-figure{height:96%!important}
  .race-band .race-copy,.race-band.band-right .race-copy{columns:1;max-width:none;margin:0}
}
.race-art .org-figure{width:auto!important;max-width:none!important}
/* Onde o retrato encostava na moldura original, a lateral também se desfaz */
#anoes .org-figure,#fadas .org-figure,#elfos .org-figure{-webkit-mask-image:linear-gradient(#000 68%,transparent 97%),linear-gradient(to left,transparent,#000 14%)!important;mask-image:linear-gradient(#000 68%,transparent 97%),linear-gradient(to left,transparent,#000 14%)!important;-webkit-mask-composite:source-in;mask-composite:intersect}
#povo-do-mar .org-figure{-webkit-mask-image:linear-gradient(#000 52%,transparent 80%),linear-gradient(to left,transparent,#000 14%)!important;mask-image:linear-gradient(#000 52%,transparent 80%),linear-gradient(to left,transparent,#000 14%)!important;-webkit-mask-composite:source-in;mask-composite:intersect}
#orcs .org-figure,#humanos .org-figure,#arvan .org-figure{-webkit-mask-image:linear-gradient(#000 68%,transparent 97%),linear-gradient(to right,transparent,#000 14%)!important;mask-image:linear-gradient(#000 68%,transparent 97%),linear-gradient(to right,transparent,#000 14%)!important;-webkit-mask-composite:source-in;mask-composite:intersect}