/* ============================================================
   Home — Juliane Ganem
   ============================================================ */

/* ---------------- HERO ---------------- */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;align-items:center;
  padding-block:clamp(112px,14vh,150px) clamp(64px,9vh,96px);
  background:#56754F;
  color:var(--creme);
  overflow:hidden;
  isolation:isolate;
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(66% 82% at 70% 46%,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 38%,rgba(18,38,24,.30) 66%,rgba(10,24,15,.72) 100%),
    linear-gradient(180deg,rgba(8,22,14,.42) 0%,rgba(0,0,0,0) 26%,rgba(0,0,0,0) 62%,rgba(8,22,14,.55) 100%);
}
.hero__grade{position:relative;z-index:2}
.hero__grade{
  display:grid;align-items:center;gap:clamp(24px,3vw,44px);
  grid-template-columns:1.06fr .94fr;
  width:100%;
}
/* bloco de perfil — mesmo desenho do site original (Poppins, anel do Instagram) */
.hero__id{display:flex;align-items:center;gap:14px;margin-bottom:28px;text-align:left}
.hero__avatar{
  flex:none;display:block;width:76px;height:76px;border-radius:50%;padding:3px;
  background:linear-gradient(45deg,#feda75 0%,#fa7e1e 26%,#d62976 58%,#962fbf 84%,#4f5bd5 100%);
  box-shadow:0 10px 26px -10px rgba(0,0,0,.55);
  transition:transform .35s var(--ease);
}
.hero__avatar:hover{transform:scale(1.04)}
.hero__avatar img{width:100%;height:100%;border-radius:50%;border:3px solid #000;object-fit:cover;display:block}
.hero__perfil{font-family:"Poppins",var(--sans);color:#fff;line-height:1.3;min-width:0}
.hero__nome{display:flex;align-items:center;gap:7px;font-weight:600;font-size:1.12rem;letter-spacing:0}
.hero__nome svg{width:18px;height:18px;flex:none}
.hero__papel{font-weight:600;font-size:.94rem;margin-top:1px}
.hero__arroba{display:inline-block;font-weight:400;font-size:.94rem;color:#fff;margin-top:1px}
.hero__arroba:hover{text-decoration:underline;text-underline-offset:3px}

.hero h1{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(2rem,4.2vw,3.35rem);
  line-height:1.08;letter-spacing:-.02em;
  text-shadow:0 2px 24px rgba(10,30,20,.35);
  margin-bottom:20px;max-width:16ch;
}
.hero h1 em{font-style:italic;color:var(--ouro-200)}
.hero__sub{
  max-width:50ch;font-size:clamp(.97rem,.4vw + .9rem,1.08rem);
  color:rgba(248,244,236,.88);line-height:1.78;
}
.hero__acoes{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}

.hero__retrato{position:relative;justify-self:center;z-index:0;isolation:isolate}
/* luz suave atrás dela (no lugar do brilho que vinha "assado" na foto antiga) */
.hero__retrato::before{
  content:"";position:absolute;z-index:-1;left:50%;top:6%;width:150%;aspect-ratio:1;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(150,180,135,.55),rgba(150,180,135,.18) 55%,rgba(150,180,135,0));
}
.hero__retrato img{
  height:min(70vh,640px);width:auto;
  -webkit-mask-image:linear-gradient(180deg,#000 68%,transparent 97%);
  mask-image:linear-gradient(180deg,#000 68%,transparent 97%);
}
.hero__selo{
  position:absolute;left:-28%;bottom:16%;
  display:flex;align-items:center;gap:10px;
  padding:11px 20px 11px 14px;
  background:rgba(6,32,24,.5);
  border:1px solid rgba(230,201,166,.34);
  border-radius:var(--raio-full);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  font-size:.68rem;letter-spacing:.17em;text-transform:uppercase;font-weight:600;
  color:var(--ouro-200);white-space:nowrap;
}
.hero__selo img{width:26px;height:26px;border-radius:50%;filter:none}

.hero__rolar{
  position:absolute;left:50%;bottom:22px;transform:translateX(-50%);
  display:grid;place-items:center;gap:9px;
  font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;
  color:rgba(248,244,236,.6);
}
.hero__rolar span::after{
  content:"";display:block;width:1px;height:36px;margin:9px auto 0;
  background:linear-gradient(180deg,var(--ouro),transparent);
  animation:desce 2.2s var(--ease) infinite;
}
@keyframes desce{0%{transform:scaleY(.2);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(.2);transform-origin:bottom}}
@media (prefers-reduced-motion:reduce){.hero__rolar span::after{animation:none}}

@media (max-width:900px){
  .hero{
    background:#56754F;
    padding-block:104px 84px;min-height:auto;
  }
  .hero::after{
    background:
      radial-gradient(84% 44% at 50% 26%,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 40%,rgba(18,38,24,.28) 70%,rgba(10,24,15,.7) 100%),
      linear-gradient(180deg,rgba(8,22,14,.5) 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 55%,rgba(8,22,14,.6) 100%);
  }
  .hero__grade{grid-template-columns:1fr;text-align:center;gap:0}
  .hero__retrato{order:-1;margin:0 auto -6%}
  .hero__retrato img{height:min(46vh,380px)}
  .hero__id{justify-content:center;margin-bottom:20px;gap:12px}
  .hero__avatar{width:64px;height:64px}
  .hero__nome{font-size:min(1.12rem,4.6vw)}
  .hero__papel,.hero__arroba{font-size:min(.94rem,3.4vw)}
  .hero__papel{white-space:nowrap}
  .hero h1{max-width:none}
  .hero__sub{margin-inline:auto}
  .hero__acoes{justify-content:center;margin-top:28px}
  .hero__selo{display:none}
  .hero__rolar{display:none}
}

/* ---------------- SOBRE ---------------- */
.sobre{background:var(--creme);position:relative;overflow:hidden}
.sobre__in{position:relative;max-width:760px}
.sobre h2{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.9rem,4vw,3rem);line-height:1.14;
  color:var(--verde-700);margin:20px 0 28px;letter-spacing:-.015em;
}
.sobre h2 em{font-style:italic;color:var(--ouro-800)}
.sobre p{color:var(--tinta-mid);margin-bottom:20px;max-width:62ch}
.sobre p strong{color:var(--verde-700);font-weight:600}
.sobre__assina{
  display:inline-flex;align-items:center;gap:14px;margin-top:14px;
  font-family:var(--serif);font-size:1.7rem;color:var(--verde-700);
}
.sobre__assina::before{content:"";width:52px;height:1px;background:var(--ouro-600)}

/* ---------------- CARDS ---------------- */
.links{background:linear-gradient(180deg,var(--creme) 0%,var(--creme-200) 100%);position:relative}
.links__topo{max-width:660px;margin:0 auto clamp(58px,8vw,86px);text-align:center}
.links__topo h2{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.9rem,4.2vw,3rem);line-height:1.12;
  color:var(--verde-700);margin:20px 0 16px;letter-spacing:-.015em;
}
.links__topo h2 em{font-style:italic;color:var(--ouro-800)}
.links__topo p{color:var(--tinta-mid)}
.links__lista{display:grid;gap:clamp(74px,9vw,104px)}

.card{
  --r:clamp(26px,3.4vw,46px);
  position:relative;
  display:grid;grid-template-columns:minmax(0,var(--fc,.5fr)) minmax(0,1fr);
  align-items:center;
  min-height:clamp(330px,33vw,430px);
  border-radius:var(--r);
  box-shadow:var(--sombra);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.card:hover{transform:translateY(-6px);box-shadow:var(--sombra-lg)}

/* recortes originais dos PSDs: a foto sai pelo topo do card e é cortada
   na base, exatamente como na arte original */
.card__foto{
  position:relative;align-self:stretch;
  clip-path:inset(-60% -30% 0 0 round 0 0 0 var(--r));
  pointer-events:none;
}
.card__foto img{
  position:absolute;bottom:var(--b,0%);left:var(--x,50%);
  height:var(--h,126%);width:auto;max-width:none;
  transform:translateX(var(--tx,-50%));
}
.card--empreendedora{--h:121%;--x:47%}
.card--despertar{--h:110%}
.card--mentoria{--fc:.58fr;--h:118%;--x:0%;--tx:0%}
.card--mentoria .card__foto img{
  -webkit-mask-image:linear-gradient(90deg,#000 76%,transparent 99%);
  mask-image:linear-gradient(90deg,#000 76%,transparent 99%);
}
.card--loja{--h:88%;--b:6%}
.card--loja .card__foto img{filter:drop-shadow(0 22px 22px rgba(10,25,12,.45))}
/* palestras não tem recorte: a cena inteira preenche a coluna e se dissolve no card */
.card--palestras .card__foto{
  overflow:hidden;
  clip-path:inset(0 round var(--r) 0 0 var(--r));
  -webkit-mask-image:linear-gradient(90deg,#000 62%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 62%,transparent 100%);
}
.card--palestras .card__foto img{
  inset:0;height:100%;width:100%;object-fit:cover;object-position:52% 62%;
  transform:scale(1.45);transform-origin:46% 80%;
}
.card--palestras .card__txt{padding-left:clamp(18px,2vw,30px)}
.card__txt{position:relative;padding:clamp(30px,3.6vw,54px) clamp(26px,4vw,64px) clamp(34px,3.6vw,54px) clamp(16px,2.4vw,36px)}
.card__marca{height:34px;width:auto;margin-bottom:16px}
.card__t{
  font-size:clamp(1.32rem,2.5vw,2.15rem);
  font-weight:800;letter-spacing:-.005em;line-height:1.06;
  text-transform:uppercase;margin-bottom:14px;
}
.card__d{font-size:clamp(.9rem,.35vw + .84rem,1rem);line-height:1.72;margin-bottom:26px;max-width:44ch}
.card .btn{box-shadow:0 12px 26px -14px rgba(0,0,0,.75)}

/* variações cromáticas — casam com o degradê original de cada peça */
.card--empreendedora{background:linear-gradient(100deg,#39412A 0%,#4A5F3D 42%,#516B4A 72%,#3F5334 100%);color:#fff}
.card--empreendedora .card__d{color:rgba(255,255,255,.9)}
.card--loja{background:linear-gradient(100deg,#4A6444 0%,#3D5238 42%,#364931 74%,#2E3F2A 100%);color:#fff}
.card--loja .card__d{color:rgba(255,255,255,.9)}
.card--despertar{background:linear-gradient(100deg,#08403C 0%,#0B524B 42%,#0D5D55 74%,#093F3A 100%);color:#fff}
.card--despertar .card__d{color:rgba(255,255,255,.9)}
.card--despertar .card__t{font-family:var(--serif);font-weight:300;letter-spacing:.02em;font-size:clamp(1.5rem,2.8vw,2.4rem);text-transform:none}
.card--mentoria{background:linear-gradient(100deg,#9B9C98 0%,#C9C9C7 40%,#D6D6D5 64%,#A9AAA8 100%);color:#1E4418}
.card--mentoria .card__t{color:#1E4418}
.card--mentoria .card__d{color:#2B3A26}
.card--palestras{background:linear-gradient(100deg,#6F8867 0%,#7B9574 42%,#84A07C 70%,#718C6A 100%);color:#fff}
.card--palestras .card__d{color:rgba(255,255,255,.93)}

/* selo de destaque no card do evento */
.card__flag{
  position:absolute;top:-14px;right:clamp(20px,3vw,44px);
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 18px;border-radius:var(--raio-full);
  background:linear-gradient(135deg,var(--ouro-200),var(--ouro) 55%,var(--ouro-600));
  color:var(--verde-900);
  font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800;
  box-shadow:0 10px 24px -10px rgba(6,32,24,.6);
}

@media (max-width:860px){
  .links__lista{gap:clamp(90px,18vw,120px)}
  .links__topo{margin-bottom:clamp(96px,24vw,130px)}
  .card{grid-template-columns:1fr;text-align:center;--r:34px;min-height:0}
  .card__foto{aspect-ratio:5/4;clip-path:inset(-40% 0 0 0 round 0)}
  .card__foto img{--x:50%;--tx:-50%;--b:0%}
  .card--mentoria .card__foto img,
  .card--empreendedora .card__foto img{
    -webkit-mask-image:linear-gradient(180deg,#000 84%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 84%,transparent 100%);
  }
  .card--loja .card__foto img{bottom:4%}
  .card--palestras .card__foto{
    clip-path:inset(0 round var(--r) var(--r) 0 0);
    -webkit-mask-image:linear-gradient(180deg,#000 70%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 70%,transparent 100%);
  }
  .card--palestras .card__foto img{object-position:52% 58%;transform:scale(1.3);transform-origin:46% 78%}
  .card--palestras .card__txt{padding-left:clamp(24px,7vw,40px)}
  .card__txt{padding:14px clamp(24px,7vw,40px) clamp(34px,7vw,44px)}
  .card__d{margin-inline:auto}
  .card__marca{margin-inline:auto}
  .card__flag{position:static;transform:none;margin:0 auto 16px}
}

/* ---------------- FAIXA CONTATO ---------------- */
.faixa{
  background:var(--verde-900);color:var(--creme);
  position:relative;overflow:hidden;
}
.faixa__in{display:grid;gap:clamp(26px,4vw,48px);grid-template-columns:1fr auto;align-items:center}
.faixa h2{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.7rem,3.6vw,2.7rem);line-height:1.12;letter-spacing:-.015em;
}
.faixa h2 em{font-style:italic;color:var(--ouro)}
.faixa p{color:rgba(248,244,236,.74);margin-top:14px;max-width:46ch}
.faixa__acoes{display:flex;flex-wrap:wrap;gap:14px}
@media (max-width:820px){.faixa__in{grid-template-columns:1fr;text-align:center}.faixa p{margin-inline:auto}.faixa__acoes{justify-content:center}}
