/* ============================================================
   iCard — Taciana Baptista · RE/MAX Rapid (Equipa Portela & Santiago)
   Base de design: "Collection" (ver LEIA-ME.txt)
   Variante de cores desta carta: ELEGANTE NAVY + DOURADO
   (navy da equipa Portela & Santiago + dourado nos detalhes;
    vermelho RE/MAX reservado ao botão principal - WhatsApp).
   Todas as cores estão centralizadas em :root, editáveis aqui.
   ============================================================ */
:root{
  /* Fundo navy (cores da equipa Portela & Santiago) */
  --navy-de:#22375F;      /* topo do gradiente do cartão */
  --navy-ate:#0E1A31;     /* base do gradiente / fundo da página */
  --navy-card:#16243E;    /* aro interior da foto / selo */

  /* Dourado (detalhes elegantes - equipa) */
  --gold:#C69E4A;
  --gold-lt:#E8CE8B;
  --gold-dk:#9E7B33;

  /* Vermelho RE/MAX (só o botão de destaque) */
  --red:#DC1C2E;
  --red-lt:#EA2E42;

  /* Texto */
  --txt:#F5F2EA;
  --txt-soft:#C6CCD8;
  --line:rgba(198,158,74,.30);   /* linhas/bordas douradas subtis */

  /* Botões claros (visual leve) */
  --btn-bg:#F6F3EB;
  --btn-txt:#132038;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  background:var(--navy-ate);
  color:var(--txt);
  min-height:100vh;
  display:flex;justify-content:center;align-items:flex-start;
  padding:32px 16px 48px;
}
.wrap{width:100%;max-width:430px}

/* Cartão */
.card{
  position:relative;overflow:hidden;
  border-radius:28px;padding:34px 26px 30px;text-align:center;
  background:
    radial-gradient(130% 85% at 50% -8%, rgba(198,158,74,.18), transparent 55%),
    linear-gradient(168deg,#22375F 0%, #14243F 55%, #0E1A31 100%);
  border:1px solid var(--line);
  box-shadow:0 24px 55px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
}
.card::before{content:"";position:absolute;inset:10px;border-radius:20px;border:1px solid rgba(198,158,74,.16);pointer-events:none}
.inner{position:relative;z-index:2;text-align:center}

/* Logótipo RE/MAX Rapid (topo) */
.remax-logo{height:26px;margin:0 auto 22px;display:block;opacity:.96}

/* Foto do consultor (avatar circular com aro dourado) + selo da equipa */
.avatar-shell{width:184px;height:184px;margin:4px auto 0;position:relative}
.avatar-ring{
  width:100%;height:100%;border-radius:50%;padding:5px;
  background:conic-gradient(from 210deg,var(--gold-dk),var(--gold-lt) 25%,var(--gold) 50%,var(--gold-lt) 72%,var(--gold-dk));
  box-shadow:0 10px 26px rgba(0,0,0,.4);
}
.avatar-ring::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.avatar-img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:4px solid var(--navy-card);background:#fff;display:block}
.seal{
  position:absolute;bottom:-6px;right:-4px;width:64px;height:64px;border-radius:50%;
  background:var(--navy-card);padding:3px;
  box-shadow:0 6px 16px rgba(0,0,0,.45), 0 0 0 1px var(--line);
}
.seal img{width:100%;height:100%;border-radius:50%;display:block}

/* Nome / cargo / divisória */
.name{font-size:27px;font-weight:700;letter-spacing:.3px;margin:22px 0 4px}
.role{font-size:13.5px;letter-spacing:2.6px;text-transform:uppercase;color:var(--gold-lt);font-weight:600}
.divider{width:54px;height:2px;margin:14px auto;border:0;background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* Chip da equipa */
.team-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 15px 6px 8px;border-radius:100px;margin-bottom:16px;
  background:rgba(198,158,74,.10);border:1px solid var(--line);
}
.team-chip img{width:22px;height:22px;border-radius:50%}
.team-chip span{font-size:11px;letter-spacing:.6px;color:var(--txt-soft);text-transform:uppercase;font-weight:600}

/* Descrição */
.bio{font-size:13.5px;line-height:1.65;color:var(--txt-soft);max-width:320px;margin:0 auto 24px;text-align:center}

/* Botões (lista vertical, visual leve, texto centrado) */
.btns{display:flex;flex-direction:column;gap:11px;margin-bottom:24px}
.btn{
  display:flex;align-items:center;justify-content:center;gap:11px;
  padding:15px 18px;border-radius:14px;text-decoration:none;
  font-size:15px;font-weight:600;letter-spacing:.2px;
  background:var(--btn-bg);color:var(--btn-txt);border:1px solid rgba(255,255,255,.5);
  box-shadow:0 4px 14px rgba(0,0,0,.18);transition:.22s;
}
.btn svg{width:20px;height:20px;flex:0 0 20px;fill:var(--gold-dk);transition:.22s}
.btn:hover{transform:translateY(-2px);box-shadow:0 9px 20px rgba(0,0,0,.28)}
/* Botão de destaque: WhatsApp (vermelho RE/MAX) */
.btn--wa{
  background:linear-gradient(135deg,var(--red),var(--red-lt));color:#fff;border-color:transparent;
  box-shadow:0 10px 22px rgba(220,28,46,.34);
}
.btn--wa svg{fill:#fff}
.btn--wa:hover{box-shadow:0 14px 28px rgba(220,28,46,.44)}

/* Redes sociais */
.social{display:flex;justify-content:center;gap:14px;margin-bottom:22px}
.soc{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);background:rgba(255,255,255,.04);transition:.22s}
.soc svg{width:20px;height:20px;fill:var(--gold-lt);transition:.22s}
.soc:hover{transform:translateY(-3px)}
.soc.ig:hover{background:linear-gradient(45deg,#f09433,#dc2743,#bc1888);border-color:transparent}
.soc.fb:hover{background:#1877F2;border-color:transparent}
.soc.li:hover{background:#0A66C2;border-color:transparent}
.soc.yt:hover{background:#FF0000;border-color:transparent}
.soc:hover svg{fill:#fff}

/* Guardar contacto */
.save{
  display:inline-flex;align-items:center;gap:9px;justify-content:center;width:100%;
  padding:13px;border-radius:14px;text-decoration:none;
  border:1.5px dashed var(--line);color:var(--gold-lt);
  font-size:14px;font-weight:600;letter-spacing:.4px;transition:.22s;margin-bottom:24px;
}
.save svg{width:19px;height:19px;fill:var(--gold-lt)}
.save:hover{border-color:var(--gold);background:rgba(198,158,74,.08)}

/* Rodapé */
.foot{border-top:1px solid rgba(255,255,255,.08);padding-top:18px}
.foot .g{font-size:12px;letter-spacing:1.4px;color:var(--txt-soft);text-transform:uppercase;font-weight:600}
.foot .ami{font-size:11px;color:rgba(255,255,255,.42);margin-top:5px;letter-spacing:.5px}

@media (max-width:360px){
  .card{padding:28px 18px 26px}
  .name{font-size:24px}
}

/* Evita palavras sozinhas na última linha do texto */
.bio{text-wrap:pretty}
