/* ============================================================
   Riviera Beach Bar — Links
   Mesmos tokens de cor/tipografia do site principal, página
   independente (sem depender dos arquivos do site).
   ============================================================ */
:root{
  --dusk-ink:     #141C12;
  --golden-sand:  #F7E9B8;
  --riviera-lime: #A3DC42;
  --riviera-sun:  #FFF822;
  --sunset-coral: #FF5A36;
  --dusk-plum:    #3B1F4D;

  --ink-soft: #EFE6C8cc;
  --sand-ink: #22271a;

  --font-display: "Big Shoulders Display", sans-serif;
  --font-body: "Schibsted Grotesk", sans-serif;

  --ease: cubic-bezier(.16,.8,.24,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ min-height:100%; }
body{
  margin:0;
  min-height:100svh;
  background:var(--dusk-ink);
  color:var(--golden-sand);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  display:flex;
  justify-content:center;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

/* ============================================================
   Background
   ============================================================ */
.bg{
  position:fixed; inset:0; z-index:0;
  overflow:hidden;
}
.bg img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(1.05);
}
.bg__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(20,28,18,.55) 0%, rgba(20,28,18,.72) 30%, rgba(20,28,18,.94) 75%, var(--dusk-ink) 100%);
}

/* ============================================================
   Card
   ============================================================ */
.card{
  position:relative; z-index:1;
  width:100%; max-width:460px;
  padding:56px 24px 40px;
  display:flex; flex-direction:column; align-items:center;
  text-align:center;
}
.card__mark{
  width:88px; height:88px;
  border-radius:50%;
  box-shadow:0 10px 30px rgba(0,0,0,.5);
  margin-bottom:18px;
}
.card__word{
  font-family:var(--font-display);
  font-weight:900;
  font-size:clamp(2.6rem, 14vw, 3.4rem);
  line-height:.85;
  letter-spacing:-.01em;
  color:var(--riviera-sun);
  text-shadow:0 6px 24px rgba(0,0,0,.4);
  margin:0 0 .15em;
  transform:scaleY(1.06) skewX(-3deg);
}
.card__tag{
  font-family:var(--font-display);
  font-weight:800;
  font-size:1.15rem;
  margin:0 0 .5em;
}
.card__bio{
  font-size:.98rem;
  color:var(--ink-soft);
  max-width:30ch;
  margin:0 0 32px;
}

/* ============================================================
   Links
   ============================================================ */
.links{
  width:100%;
  display:flex; flex-direction:column; gap:14px;
  margin-bottom:40px;
}
.link{
  position:relative;
  display:flex; align-items:center; gap:14px;
  width:100%;
  padding:10px 20px 10px 10px;
  border-radius:100px;
  background:var(--golden-sand);
  color:var(--sand-ink);
  border:1px solid transparent;
  transition:transform .2s var(--ease), background .2s var(--ease);
}
.link:hover{ transform:translateY(-2px); }
.link:active{ transform:scale(.98); }

.link__thumb{
  flex:0 0 auto;
  width:44px; height:44px;
  border-radius:50%;
  overflow:hidden;
  background:var(--dusk-ink);
}
.link__thumb img{ width:100%; height:100%; object-fit:cover; }
.link__thumb--icon{
  display:flex; align-items:center; justify-content:center;
  background:var(--dusk-ink);
}
.link__thumb--icon svg{ width:22px; height:22px; fill:var(--golden-sand); }

.link__label{
  flex:1 1 auto;
  text-align:left;
  font-weight:700;
  font-size:1rem;
  display:flex; flex-direction:column; gap:2px;
}
.link__label small{
  font-weight:500;
  font-size:.78rem;
  opacity:.7;
}

.link__arrow{
  flex:0 0 auto;
  font-size:1.1rem;
  opacity:0;
  transform:translateX(-4px);
  transition:opacity .2s var(--ease), transform .2s var(--ease);
}
.link:hover .link__arrow{ opacity:1; transform:translateX(0); }

.link--coral{ background:var(--sunset-coral); color:var(--dusk-ink); }
.link--coral .link__thumb--icon{ background:rgba(20,28,18,.18); }
.link--coral .link__thumb--icon svg{ fill:var(--dusk-ink); }

.link--lime{ background:var(--riviera-lime); color:var(--dusk-ink); }
.link--lime .link__thumb--icon{ background:rgba(20,28,18,.18); }
.link--lime .link__thumb--icon svg{ fill:var(--dusk-ink); }

.link--line{
  background:transparent;
  border-color:rgba(247,233,184,.35);
  color:var(--golden-sand);
}
.link--line .link__thumb--icon{ background:rgba(247,233,184,.1); }

/* ============================================================
   Footer
   ============================================================ */
.card__footer{
  color:rgba(247,233,184,.6);
  font-size:.82rem;
  line-height:1.7;
}
.card__footer p{ margin:0; }
.card__legal{ margin-top:10px !important; color:rgba(247,233,184,.4); font-size:.78rem; }

@media(min-width:480px){
  .card{ padding-top:72px; }
}