*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

  :root{
    --gold:#D4A853;
    --gold-light:#E8C878;
    --gold-dark:#B8922F;
    --gold-glow:rgba(212,168,83,0.25);
    --blue-deep:#0F1A2E;
    --blue-mid:#162240;
    --black:#080B12;
    --offwhite:#F7F4EE;
    --white:#FFFFFF;
    --gray:#9CA3AF;
    --glass-border:rgba(255,255,255,0.10);
    --glass-bg:rgba(255,255,255,0.045);
    --glass-bg-hover:rgba(255,255,255,0.08);
    --font-display:'Poppins','Segoe UI',system-ui,sans-serif;
    --font-body:'Inter','Segoe UI',system-ui,sans-serif;
    --radius:14px;
  }

  html{-webkit-text-size-adjust:100%}
  body{
    font-family:var(--font-body);
    color:var(--offwhite);
    background:var(--black);
    min-height:100vh;
    min-height:100dvh;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
    position:relative;
    overflow-x:hidden;
  }

  /* Fundo: azul-profundo + brilhos dourados sutis */
  .bg{
    position:fixed;inset:0;z-index:-2;
    background:
      radial-gradient(120% 90% at 50% -10%, #1a2a4a 0%, var(--blue-deep) 45%, var(--black) 100%);
  }
  .bg::before{
    content:"";position:absolute;inset:0;
    background:
      radial-gradient(40% 30% at 50% 8%, var(--gold-glow), transparent 70%),
      radial-gradient(30% 25% at 12% 55%, rgba(212,168,83,0.08), transparent 70%),
      radial-gradient(30% 25% at 88% 80%, rgba(212,168,83,0.07), transparent 70%);
  }
  /* Textura fina de grão */
  .bg::after{
    content:"";position:absolute;inset:0;opacity:0.035;
    background-image:radial-gradient(rgba(255,255,255,0.7) 0.5px, transparent 0.5px);
    background-size:3px 3px;
  }

  .wrap{
    width:100%;
    max-width:480px;
    margin:0 auto;
    padding:48px 22px 40px;
    display:flex;
    flex-direction:column;
    align-items:center;
  }

  /* Wordmark topo */
  .brand{
    font-family:var(--font-display);
    font-weight:700;
    letter-spacing:0.34em;
    font-size:0.72rem;
    text-transform:uppercase;
    color:var(--gold);
    margin-bottom:26px;
    padding-left:0.34em;
  }

  /* Avatar */
  .avatar-ring{
    width:132px;height:132px;border-radius:50%;
    padding:3px;
    background:linear-gradient(145deg,var(--gold-light),var(--gold-dark));
    box-shadow:0 0 0 6px rgba(212,168,83,0.10), 0 14px 40px rgba(0,0,0,0.5), 0 0 34px var(--gold-glow);
  }
  .avatar-ring img{
    width:100%;height:100%;border-radius:50%;
    object-fit:cover;display:block;
    border:3px solid var(--blue-deep);
  }

  h1{
    font-family:var(--font-display);
    font-weight:700;
    font-size:1.7rem;
    letter-spacing:-0.01em;
    margin-top:20px;
    color:var(--white);
  }
  .verified{
    display:inline-block;vertical-align:middle;
    width:19px;height:19px;margin-left:5px;color:var(--gold);
  }
  .roles{
    font-family:var(--font-display);
    font-weight:600;
    font-size:0.82rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--gold);
    margin-top:9px;
  }
  .tagline{
    font-size:0.98rem;
    color:#D8D2C6;
    max-width:340px;
    text-align:center;
    margin-top:14px;
    line-height:1.55;
  }

  /* Lista de links */
  .links{
    width:100%;
    margin-top:32px;
    display:flex;
    flex-direction:column;
    gap:14px;
  }

  .link{
    display:flex;
    align-items:center;
    gap:15px;
    width:100%;
    padding:16px 18px;
    border-radius:var(--radius);
    background:var(--glass-bg);
    border:1px solid var(--glass-border);
    color:var(--offwhite);
    text-decoration:none;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
    position:relative;
  }
  .link:hover,.link:focus-visible{
    background:var(--glass-bg-hover);
    border-color:rgba(212,168,83,0.45);
    transform:translateY(-2px);
    box-shadow:0 10px 30px rgba(0,0,0,0.35);
    outline:none;
  }
  .link:active{transform:translateY(0)}

  .link .ic{
    flex:0 0 42px;height:42px;width:42px;
    display:grid;place-items:center;
    border-radius:11px;
    background:rgba(212,168,83,0.12);
    color:var(--gold-light);
  }
  .link .ic svg{width:22px;height:22px}
  .link .txt{flex:1 1 auto;min-width:0;overflow:hidden}
  .link .txt .t{
    font-family:var(--font-display);
    font-weight:600;font-size:1.02rem;color:var(--white);
    line-height:1.25;
  }
  .link .txt .s{
    font-size:0.82rem;color:#B2BAC6;margin-top:3px;line-height:1.4;
    overflow:hidden;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  }
  .link .chev{flex:0 0 auto;color:var(--gray);opacity:.65;transition:transform .18s ease,color .18s ease}
  .link:hover .chev{transform:translateX(3px);color:var(--gold)}

  /* Botões em destaque (produtos principais) */
  .link.feat{
    background:linear-gradient(135deg, rgba(212,168,83,0.16), rgba(212,168,83,0.05));
    border-color:rgba(212,168,83,0.40);
    box-shadow:0 6px 26px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.06);
  }
  .link.feat .ic{
    background:linear-gradient(145deg,var(--gold-light),var(--gold-dark));
    color:var(--blue-deep);
  }
  .link.feat:hover{
    border-color:rgba(212,168,83,0.75);
    box-shadow:0 12px 34px rgba(0,0,0,0.4), 0 0 28px var(--gold-glow);
  }
  .link .tag{
    position:absolute;top:-9px;right:14px;
    font-family:var(--font-display);font-weight:700;
    font-size:0.6rem;letter-spacing:0.1em;text-transform:uppercase;
    color:var(--blue-deep);
    background:linear-gradient(145deg,var(--gold-light),var(--gold));
    padding:3px 9px;border-radius:20px;
    box-shadow:0 3px 10px rgba(0,0,0,0.35);
  }

  /* WhatsApp destaque verde sutil */
  .link.wpp .ic{background:rgba(37,211,102,0.16);color:#4ee584}

  /* Cards-âncora com foto (banner split) */
  .banner{
    position:relative;display:flex;align-items:stretch;
    width:100%;min-height:122px;border-radius:16px;overflow:hidden;
    text-decoration:none;color:var(--offwhite);
    background:linear-gradient(135deg, rgba(22,34,64,.72), rgba(8,11,18,.94));
    border:1px solid rgba(212,168,83,.38);
    box-shadow:0 8px 30px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05);
    transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
  }
  .banner:hover,.banner:focus-visible{
    transform:translateY(-2px);border-color:rgba(212,168,83,.8);
    box-shadow:0 14px 38px rgba(0,0,0,.45), 0 0 30px var(--gold-glow);outline:none;
  }
  .banner:active{transform:translateY(0)}
  .banner .photo{position:relative;flex:0 0 40%;max-width:148px;overflow:hidden}
  .banner .photo img{
    position:absolute;inset:0;width:100%;height:100%;
    object-fit:cover;object-position:center 20%;
    transition:transform .45s ease;
  }
  .banner:hover .photo img{transform:scale(1.06)}
  .banner .photo::after{content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,transparent 52%,rgba(8,11,18,.55) 82%,rgba(8,11,18,.95) 100%)}
  .banner .body{
    flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center;
    padding:15px 18px 15px 15px;
  }
  .banner .body .t{font-family:var(--font-display);font-weight:700;font-size:1.13rem;line-height:1.2;color:#fff}
  .banner .body .s{
    font-size:0.84rem;color:#C4CAD4;line-height:1.4;margin-top:5px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  .banner .cta{
    margin-top:9px;display:inline-flex;align-items:center;gap:6px;
    font-family:var(--font-display);font-weight:600;font-size:0.8rem;color:var(--gold-light);
  }
  .banner .cta svg{width:15px;height:15px;transition:transform .18s ease}
  .banner:hover .cta svg{transform:translateX(3px)}
  .banner .tag{
    display:inline-block;align-self:flex-start;margin-bottom:8px;
    font-family:var(--font-display);font-weight:700;
    font-size:0.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-deep);
    background:linear-gradient(145deg,var(--gold-light),var(--gold));
    padding:3px 10px;border-radius:20px;box-shadow:0 3px 10px rgba(0,0,0,.35);
  }

  /* Divisor de seção */
  .sep{
    width:100%;display:flex;align-items:center;gap:14px;
    margin:24px 0 6px;color:var(--gray);
    font-family:var(--font-display);font-weight:600;
    font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;
  }
  .sep::before,.sep::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.14),transparent)}

  /* Redes sociais */
  .social{
    display:flex;justify-content:center;gap:14px;
    margin-top:34px;
  }
  .social a{
    width:50px;height:50px;border-radius:50%;
    display:grid;place-items:center;
    background:var(--glass-bg);
    border:1px solid var(--glass-border);
    color:var(--offwhite);
    text-decoration:none;
    transition:transform .18s ease,background .18s ease,border-color .18s ease,color .18s ease;
  }
  .social a svg{width:23px;height:23px}
  .social a:hover{
    transform:translateY(-3px);
    background:rgba(212,168,83,0.14);
    border-color:rgba(212,168,83,0.5);
    color:var(--gold-light);
  }

  footer{
    margin-top:34px;text-align:center;
    font-size:0.78rem;color:var(--gray);line-height:1.7;
  }
  footer a{color:var(--gold);text-decoration:none}
  footer a:hover{text-decoration:underline}
  footer .z{
    display:block;margin:0 auto 14px;
    width:158px;max-width:56%;height:auto;
    opacity:.96;
  }

  /* Entrada suave */
  @keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
  .anim{opacity:0;animation:rise .55s cubic-bezier(.2,.7,.3,1) forwards}

  @media (prefers-reduced-motion:reduce){
    .anim{animation:none;opacity:1}
    .link,.social a,.link .chev{transition:none}
  }

  @media(max-width:400px){
    .wrap{padding:36px 16px 34px}
    h1{font-size:1.5rem}
    .link{padding:14px 15px;gap:13px}
    .link .txt .t{font-size:0.96rem}
  }