/* ============================================================
   Espaço do Insight — sistema de "story-blocks"
   (blocos alternados de imagem + texto, usados em: Sobre (home),
   WISC (home), página Bio e topo da página Depoimentos)
   Usado por: index.html, bio.html, depoimentos.html
   ============================================================ */

.about-story{margin-top:56px;display:flex;flex-direction:column;gap:24px;}

.story-block{
  display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:center;
}
.story-block.reverse{grid-template-columns:1.15fr 1fr;}
.story-block.reverse .story-image{order:2;}
.story-block.reverse .story-text{order:1;}
.story-block.img-wide{grid-template-columns:1fr 1.15fr;}
.story-block.reverse.img-wide{grid-template-columns:1.15fr 1fr;}
.story-block.img-narrow{grid-template-columns:1fr 1.15fr;}
.story-block.reverse.img-narrow{grid-template-columns:1.15fr 1fr;}

.story-image{position:relative;max-width:400px;margin:0 auto;}

.story-frame{
  position:relative;z-index:1;overflow:hidden;border-radius:26px;aspect-ratio:1/1;
  border:7px solid #fff;box-shadow:0 26px 50px -26px rgba(44,74,71,.4);
}
.story-frame img{width:100%;height:100%;object-fit:cover;display:block;}

.deco-dot{
  position:absolute;z-index:0;border-radius:50%;
}

.deco-1::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:-24px;right:26px;bottom:-16px;
  background:var(--sage-light);border-radius:34px;
  transform:rotate(-5deg);
}
.deco-1::after{
  content:"";position:absolute;z-index:0;
  width:38px;height:38px;border-radius:50%;
  background:var(--gold);opacity:.5;
  bottom:-16px;right:-14px;
}
.deco-1 .deco-dot{width:22px;height:22px;background:var(--coral-soft);opacity:.8;top:-12px;right:32px;}

.deco-2::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:22px;right:-26px;bottom:-16px;
  background:var(--coral-soft);opacity:.6;border-radius:50%;
}
.deco-2::after{
  content:"";position:absolute;z-index:0;
  width:44px;height:44px;
  background:var(--sage-light);border-radius:14px;
  transform:rotate(12deg);
  top:-16px;left:-14px;
}
.deco-2 .deco-dot{width:20px;height:20px;background:var(--gold);opacity:.6;bottom:26px;left:-10px;}

.deco-3::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:20px;right:-18px;bottom:-16px;
  background:var(--gold);opacity:.32;
  border-radius:44% 56% 62% 38% / 48% 42% 58% 52%;
  transform:rotate(8deg);
}
.deco-3::after{
  content:"";position:absolute;z-index:0;
  width:42px;height:42px;border-radius:50%;
  background:var(--coral-soft);opacity:.6;
  bottom:-16px;left:-16px;
}
.deco-3 .deco-dot{width:18px;height:18px;background:var(--sage-light);opacity:.9;top:18px;left:-14px;}

.deco-4::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:-22px;right:32px;bottom:-16px;
  background:var(--sage-light);border-radius:30px;
  transform:rotate(-10deg);
}
.deco-4::after{
  content:"";position:absolute;z-index:0;
  width:56px;height:56px;border-radius:50%;
  background:var(--coral-soft);opacity:.75;
  bottom:-16px;right:-16px;
}
.deco-4 .deco-dot{width:20px;height:20px;background:var(--gold);opacity:.7;top:-14px;right:24px;}

.deco-5::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:22px;right:-20px;bottom:-16px;
  background:var(--coral-soft);opacity:.55;
  border-radius:46% 54% 58% 42% / 50% 44% 56% 50%;
  transform:rotate(6deg);
}
.deco-5::after{
  content:"";position:absolute;z-index:0;
  width:40px;height:40px;border-radius:50%;
  background:var(--gold);opacity:.55;
  bottom:-16px;right:30px;
}
.deco-5 .deco-dot{width:18px;height:18px;background:var(--sage-light);opacity:.9;bottom:20px;left:-14px;}

.deco-6::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:-20px;right:28px;bottom:-16px;
  background:var(--gold);opacity:.3;border-radius:50%;
}
.deco-6::after{
  content:"";position:absolute;z-index:0;
  width:44px;height:44px;
  background:var(--coral-soft);opacity:.6;border-radius:14px;
  transform:rotate(-14deg);
  bottom:-16px;right:-14px;
}
.deco-6 .deco-dot{width:20px;height:20px;background:var(--sage-light);opacity:.9;top:-12px;right:34px;}

.deco-7::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:-26px;right:24px;bottom:-16px;
  background:var(--sage-light);border-radius:32px;
  transform:rotate(-6deg);
}
.deco-7::after{
  content:"";position:absolute;z-index:0;
  width:42px;height:42px;border-radius:50%;
  background:var(--coral-soft);opacity:.6;
  top:-16px;right:28px;
}
.deco-7 .deco-dot{width:18px;height:18px;background:var(--gold);opacity:.7;bottom:-12px;right:-10px;}

.deco-8::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:-20px;right:28px;bottom:-16px;
  background:var(--coral-soft);opacity:.6;border-radius:30px;
  transform:rotate(7deg);
}
.deco-8::after{
  content:"";position:absolute;z-index:0;
  width:48px;height:48px;border-radius:50%;
  background:var(--gold);opacity:.55;
  top:-16px;right:-14px;
}
.deco-8 .deco-dot{width:20px;height:20px;background:var(--sage-light);opacity:.9;bottom:-10px;left:26px;}

.deco-9::before{
  content:"";position:absolute;z-index:0;
  top:-16px;left:-24px;right:28px;bottom:-16px;
  background:var(--gold);opacity:.3;border-radius:30px;
  transform:rotate(-7deg);
}
.deco-9::after{
  content:"";position:absolute;z-index:0;
  width:46px;height:46px;border-radius:50%;
  background:var(--sage-light);
  bottom:-16px;right:-14px;
}
.deco-9 .deco-dot{width:20px;height:20px;background:var(--coral-soft);opacity:.8;top:-16px;right:30px;}

/* Layout centralizado, usado para textos curtos/poéticos */
.story-block.story-feature{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:32px;
}
.story-feature .story-image{width:100%;max-width:400px;}
.story-feature .story-image::before{top:-16px;left:16px;right:-16px;bottom:16px;}
.story-feature .story-text{max-width:560px;}
.story-feature .story-text p{text-align:center;}

.story-text p{color:var(--text-soft);font-size:1.05rem;margin-bottom:16px;}
.story-text strong{color:var(--teal);font-weight:600;}
.story-text .hl{
  color:var(--coral);font-style:italic;font-weight:600;
  font-family:'Fraunces',serif;
}
.story-caps{
  color:var(--coral);font-weight:700;letter-spacing:.12em;
  font-size:1rem;margin:22px 0 12px;
}
.story-text p.poetic{
  font-family:'Fraunces',serif;font-style:italic;color:var(--teal-soft);
  font-size:1.1rem;line-height:1.7;
}

/* Divisória entre blocos */
.story-divider{
  position:relative;height:1px;
  margin:28px 0;
  background:linear-gradient(90deg, transparent, rgba(44,74,71,.28) 20%, rgba(44,74,71,.28) 80%, transparent);
}
.story-divider-dot{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:var(--ivory-deep);
  padding:0 14px;
  display:flex;align-items:center;justify-content:center;
}

@media (max-width:880px){
  .story-block,.story-block.reverse,.story-block.img-wide,.story-block.reverse.img-wide,
  .story-block.img-narrow,.story-block.reverse.img-narrow{grid-template-columns:1fr;gap:36px;}
  .story-block.story-feature{gap:36px;}
  .story-block.reverse .story-image,.story-block.reverse .story-text{order:initial;}
  .story-image{max-width:300px;margin:0 auto;}
  .story-feature .story-image{max-width:300px;}
  .story-text{text-align:center;}
  .story-text p{text-align:center;}
  .about-story{gap:18px;}
}
