:root{
    --navy-900:#0b1230; --navy-850:#0e173d; --navy-800:#111a45; --navy-700:#16215a; --navy-600:#1b2a74;
    --ink:#f2f5ff; --muted:#a8b0d6; --line:rgba(255,255,255,.08);
    --brand:#d7570c; --brand-2:#ff8a47; --ok:#41d675; --warn:#ffd24c;
    --radius:22px; --radius-lg:28px; --shadow:0 30px 60px rgba(0,0,0,.35);
    --maxw:1280px; --pad:22px;
  }
  *{box-sizing:border-box} html,body{height:100%}
  body{margin:0;background:var(--navy-900);color:var(--ink);font:16px/1.6 'Outfit',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  .container{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}

  /* ===== Header (glass, sem caixas) ===== */
  .header{position:fixed;inset:0 0 auto 0;z-index:60;backdrop-filter:saturate(140%) blur(8px);}
  .header__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
  .header__bg{position:absolute;inset:0;background:linear-gradient(180deg, rgba(11,18,48,.92) 0, rgba(11,18,48,.60) 70%, transparent 100%);border-bottom:1px solid var(--line);}
  .logo {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: 'Outfit', sans-serif;
  font-weight: 800;
  letter-spacing: .1px;
}

.logo__mark {
  display: inline-block;
  vertical-align: middle; /* 👈 garante que fica à altura do texto */
  width: 28px;
  height: 28px;
  background: url("/images/logo.png") center/contain no-repeat;
  background-size: contain;
}

.logo__text {
  line-height: 1; /* impede o texto de puxar para cima/baixo */
  display: inline-block;
  vertical-align: middle;
    margin-left:-9px;
     font-size: 1.6rem;
}

.logo__text span { color: var(--brand-2); }
  .nav{position:relative;display:flex;gap:24px;align-items:center}
  .nav a{padding:10px 6px;border-bottom:2px solid transparent;opacity:.92;font-weight:600}
  .nav a:hover{border-color:var(--brand);opacity:1}
  .btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.16);cursor:pointer;font:600 14px/1 'Inter',sans-serif}
  .btn--primary{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent;box-shadow:var(--shadow)}
  .btn--ghost:hover{border-color:var(--brand)}

/* Mobile menu (no JS) */
.nav-toggle{
  display:none;
}

/* Botão hambúrguer */
.burger{
  display:none;               /* escondido no desktop */
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid var(--line);
  align-items:center;
  justify-content:center;
  cursor:pointer;
  flex-direction:column;
  gap:5px;
  background:rgba(0,0,0,.4);
  backdrop-filter:blur(6px);
}

.burger span{
  display:block;
  width:20px;
  height:2px;
  background:#fff;
  border-radius:999px;
  transition:.25s ease;
}

@media (max-width: 980px){
  /* só aparece em mobile */
  .burger{
    display:flex;
  }

  .nav{
    position:fixed !important;
    inset:72px 0 auto 0 !important;  /* começa 72px abaixo do topo (ajusta se preciso) */
    background:rgba(3, 6, 24, .96);
    backdrop-filter:blur(12px);

    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
    padding:24px 24px 40px;

    width:100vw !important;   /* 100% da largura da janela */
    max-width:100vw !important;
    margin:0 !important;
    border-radius:0 !important;
    z-index:900;

    transform:translateY(-120%);
    opacity:0;
    pointer-events:none;
    transition:transform .28s ease, opacity .28s ease;
  }

  .nav a{
    font-size:1.1rem;
    font-weight:600;
    text-decoration:none;
    color:#fff;
  }

  .nav a.btn{
    margin-top:8px;
    padding-inline:20px;
    padding-block:10px;
    border-radius:999px;
  }

  /* menu aberto */
  .nav-toggle:checked ~ .nav{
    transform:translateY(0);
    opacity:1;
    pointer-events:auto;
  }

  /* animação hambúrguer -> X */
  .nav-toggle:checked + .burger{
    border-color:var(--brand);
    background:rgba(0,0,0,.6);
  }
  .nav-toggle:checked + .burger span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }
  .nav-toggle:checked + .burger span:nth-child(2){
    opacity:0;
  }
  .nav-toggle:checked + .burger span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }
}


/* ========== LANG SWITCH – DESKTOP (default) ========== */

.lang-switch{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:0.9rem;
  color:#fff;
}

.lang-icon{
  font-size:0.9rem;
}

.lang-toggle{
  display:none; /* o checkbox é só para mobile */
}

/* no desktop não usamos a label, só as letras */
.lang-label{
  display:none;
}

.lang-links{
  display:flex;
  align-items:center;
  gap:4px;
}

.lang-links span{
  opacity:0.6;
}

.lang-links a{
  color:#fff;
  text-decoration:none;
  font-weight:600;
  opacity:0.9;
}

.lang-links a.active{
  color:var(--brand);   /* laranja WeStreamSports */
  opacity:1;
}



/* ========== LANG SWITCH – MOBILE (dropdown) ========== */

@media (max-width: 980px){

  .lang-switch{
    position:relative;        /* referencial do dropdown */
    display:flex;
    align-items:center;
    gap:6px;
    font-size:1rem;
  }

  .lang-label{
    display:flex;             /* agora mostramos a label */
    align-items:center;
    gap:4px;
    font-weight:600;
    color:#fff;
    cursor:pointer;
    user-select:none;
  }

  .lang-caret{
    font-size:0.8rem;
    opacity:0.9;
  }

  /* dropdown flutuante por baixo do ES ? */
  .lang-links{
    position:absolute;
    right:-10px;                /* afasta do canto direito */
    top:115%;                 /* posição vertical relativamente à label */
    background:rgba(3, 6, 24, 0.96);
    backdrop-filter:blur(6px);
    padding:8px 24px;
    border-radius:8px;

    display:flex;
    flex-direction:column;
    gap:6px;

    max-height:0;
    opacity:0;
    overflow:hidden;
    pointer-events:none;
    transition:max-height .2s ease, opacity .2s ease;
  }

  .lang-links span{
    display:none;             /* sem “·” em mobile */
  }

  .lang-links a{
    font-weight:500;
    opacity:0.85;
    white-space:nowrap;
  }

  .lang-links a.active{
    color:var(--brand);
    opacity:1;
    font-weight:700;
  }

  /* abrir dropdown quando clicas em PT/EN/ES ? */
  .lang-toggle:checked ~ .lang-links{
    max-height:150px;
    opacity:1;
    pointer-events:auto;
  }
}




  /* ===== HERO full‑bleed sem caixas ===== */
  .hero{position:relative;min-height:78vh;display:grid;place-items:end stretch;overflow:hidden}
  .hero__bg{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(11,18,48,.35) 0%, rgba(11,18,48,.65) 35%, rgba(11,18,48,.82) 100%),
    var(--hero-img, url('/media/hero-default.jpg')) center/cover no-repeat;
  }

  /* Arco curvo no fundo do hero */
  .hero__bg:after{content:"";position:absolute;left:-12%;right:-12%;bottom:-30%;height:70%;
    background:radial-gradient(110% 120% at 50% 0%, rgba(11,18,48,0) 40%, rgba(11,18,48,.96) 41%);
    filter:blur(0.5px)}
  .hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:end;padding-top:110px;padding-bottom:40px}
  .hero__title{margin:0 0 12px;font-size:clamp(32px,4.4vw,56px);line-height:1.05;font-weight:800;max-width:20ch}
  .hero__lead{margin:0 0 20px;color:var(--muted);max-width:42ch}
  .chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
  .chip{font:700 12px/1 'Inter',sans-serif;color:#fff;background:rgba(255,255,255,.09);border:1px solid var(--line);padding:8px 10px;border-radius:999px}
  .hero__cta{display:flex;gap:10px;flex-wrap:wrap}
  .pill-live{position:absolute;top:22px;left:22px;background:linear-gradient(135deg,#ff5858,#ff9147);color:#fff;padding:8px 12px;border-radius:999px;font:700 12px/1 'Inter',sans-serif;letter-spacing:.2px}

  /* ===== Latest + More (sem caixas pesadas) ===== */
  .section{margin-top:32px}
  .section__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
  .wrap-news{display:grid;grid-template-columns:1.45fr .85fr;gap:26px}
  .cards{display:grid;gap:18px}
  .cards--3{grid-template-columns:repeat(3,1fr)}
  .card{border-radius:24px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.35)}
  .card__media{position:relative}
  .card__media img{width:100%;height:100%;object-fit:cover}
  .card__media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,11,30,0) 40%, rgba(7,11,30,.9) 100%)}
  .card__body{position:absolute;left:0;right:0;bottom:0;padding:14px 14px 16px;display:grid;gap:6px}
  .card__title{margin:0;font-weight:800;font-size:18px}
  .card__meta{color:#d0d6ff;font-size:14px}
  .badge{position:absolute;top:10px;left:10px;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-size:12px;padding:6px 10px;border-radius:999px}

  /* Sidebar list – cartões planos */
  .side{display:grid;gap:10px}
  .side__item{display:grid;grid-template-columns:112px 1fr;gap:12px;align-items:center;background:rgba(255,255,255,.03);border:1px solid var(--line);padding:10px;border-radius:18px}
  .side__item:hover{background:rgba(255,255,255,.05)}
  .side__img{border-radius:14px;overflow:hidden}
  .tags{display:flex;gap:8px;margin-bottom:6px;flex-wrap:wrap}
  .tag{font:800 11px/1 'Inter',sans-serif;color:#fff;background:rgba(255,255,255,.08);border:1px solid var(--line);padding:6px 8px;border-radius:999px}

  /* Social vertical */
  .social{position:fixed;right:12px;top:40%;display:grid;gap:10px;z-index:40}
  .soc{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.10);border:1px solid var(--line)}

  /* Footer */
  .footer{border-top:1px solid var(--line);background:linear-gradient(180deg,var(--navy-900),#070b1e);margin-top:40px}
  .footer__inner{display:flex;align-items:center;justify-content:space-between;color:var(--muted);padding:20px var(--pad)}
  .foot-nav{display:flex;gap:16px}



.header__bar, .ws-header__inner,
.nav, .lang-switcher { position: relative; z-index: 3; pointer-events: auto; }


/* por via das dúvidas, força cursor “mão� nos links do switch */
.lang-switcher a { cursor: pointer; }

  /* Responsive */
  @media (max-width:1120px){ .cards--3{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:980px){ .hero__inner{grid-template-columns:1fr} .wrap-news{grid-template-columns:1fr} }
  @media (max-width:640px){ .cards--3{grid-template-columns:1fr} .side__item{grid-template-columns:96px 1fr} }

/* ========================
   PÁGINA DE LOGIN / REGISTO
   ======================== */

.auth-page{
  min-height:100vh;
  padding-top:100px;           /* espaço para o header fixo */
  padding-bottom:40px;
  display:flex;
  align-items:center;
}

.auth-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
}

.auth-panel{
  background:rgba(17,26,69,.9);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
  padding:26px 26px 28px;
  position:relative;
  overflow:hidden;
}

.auth-panel--login{
  backdrop-filter:blur(10px);
}

.auth-panel--register{
  background:linear-gradient(
    135deg,
    rgba(26,42,116,.96),
    rgba(215,87,12,.16)
  );
}

.auth-panel__head{
  margin-bottom:18px;
}

.auth-title{
  margin:0 0 4px;
  font-size:clamp(24px, 2.4vw, 30px);
  font-weight:800;
}

.auth-subtitle{
  margin:0;
  color:var(--muted);
  font-size:0.95rem;
}

.auth-form{
  display:grid;
  gap:14px;
}

.auth-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.auth-field label{
  font-size:0.9rem;
  font-weight:600;
}

.auth-field input{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(3,6,24,.9);
  color:var(--ink);
  font:14px 'Outfit',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  outline:none;
}

.auth-field input::placeholder{
  color:rgba(255,255,255,.35);
}

.auth-field input:focus{
  border-color:var(--brand-2);
  box-shadow:0 0 0 1px rgba(215,87,12,.55);
}

.auth-field__input-wrap{
  position:relative;
  display:flex;
  align-items:center;
}

.auth-field__input-wrap input{
  width:100%;
  padding-right:92px; /* espaço para o botão Mostrar/Ocultar */
}

.auth-toggle-pass{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(11,18,48,.9);
  color:#fff;
  font-size:11px;
  padding:4px 10px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}

.auth-toggle-pass__hide{
  display:none;
}

.auth-toggle-pass.is-visible .auth-toggle-pass__show{
  display:none;
}
.auth-toggle-pass.is-visible .auth-toggle-pass__hide{
  display:inline;
}

.auth-field__error{
  font-size:0.8rem;
  color:#ff8585;
}

.auth-field__hint{
  font-size:0.8rem;
  color:var(--muted);
}

.auth-field--error input{
  border-color:#ff5f5f;
}

.auth-extra-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-top:4px;
}

.auth-remember{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:0.85rem;
  color:var(--muted);
}

.auth-remember input{
  width:auto;
  padding:0;
}

.auth-link{
  color:var(--brand-2);
  font-size:0.85rem;
  text-decoration:none;
}
.auth-link:hover{
  text-decoration:underline;
}

.auth-submit{
  margin-top:4px;
  width:100%;
  justify-content:center;
}

.auth-hint{
  margin-top:12px;
  font-size:0.9rem;
  color:var(--muted);
}

.auth-terms{
  margin:4px 0 0;
  font-size:0.8rem;
  color:var(--muted);
}

.auth-alert{
  border-radius:14px;
  padding:10px 12px;
  font-size:0.9rem;
  margin-bottom:14px;
}

.auth-alert--error{
  background:rgba(255,70,70,.10);
  border:1px solid rgba(255,70,70,.4);
  color:#ffb3b3;
}

.auth-alert--success{
  background:rgba(65,214,117,.10);
  border:1px solid rgba(65,214,117,.5);
  color:#9bf7b8;
}

.auth-grid--2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

/* Responsivo */
@media (max-width: 920px){
  .auth-grid{
    grid-template-columns:1fr;
    max-width:640px;
  }
  .auth-page{
    padding-top:90px;
    padding-bottom:32px;
    justify-content:center;
  }
}

@media (max-width: 540px){
  .auth-panel{
    padding:20px 16px 22px;
  }
  .auth-extra-row{
    flex-direction:column;
    align-items:flex-start;
  }
  .auth-grid--2{
    grid-template-columns:1fr;
  }
}
/* ===== DASHBOARD – layout & cards ===== */

.dashboard{
  padding-top:96px;           /* espaço por causa do header fixo */
  padding-bottom:56px;
  background:
    radial-gradient(120% 140% at 0 0, rgba(215,87,12,.16), transparent 50%),
    radial-gradient(120% 160% at 100% 0, rgba(65,214,117,.08), transparent 55%);
}

/* topo / hero */

.dashboard__hero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:32px;
  margin-bottom:32px;
}

.dashboard__welcome{
  max-width:580px;
}

.dashboard__pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(6,10,40,.9);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  margin-bottom:10px;
}

.dashboard__greeting{
  margin:0 0 6px;
  font-size:1.9rem;
  font-weight:800;
  letter-spacing:.02em;
}

.dashboard__sub{
  margin:0;
  color:var(--muted);
  font-size:.92rem;
}

.dashboard__quick{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

/* tile genérico */

.dash-tile{
  background:linear-gradient(145deg, rgba(17,26,69,.98), rgba(11,18,48,.98));
  border-radius:var(--radius-lg);
  padding:18px 20px 20px;
  box-shadow:0 26px 60px rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.04);
}

.dash-tile__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.dash-tile__title{
  margin:0;
  font-size:1rem;
  font-weight:700;
}

.dash-tile__caption{
  margin:4px 0 0;
  font-size:.84rem;
  color:var(--muted);
}

/* resumo rápido */

.dashboard__summary{
  min-width:260px;
  max-width:320px;
}

.dashboard__summary-metrics{
  display:grid;
  gap:10px;
  margin-bottom:10px;
}

.metric{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(5,9,36,.9);
}

.metric__label{
  font-size:.82rem;
  color:var(--muted);
}

.metric__value{
  font-size:1.3rem;
  font-weight:800;
}

.metric--soon .metric__value{
  display:none;
}

.metric__tag{
  font-size:.78rem;
  padding:3px 9px;
  border-radius:999px;
  border:1px dashed rgba(255,255,255,.25);
  color:var(--muted);
}

.dashboard__summary-note{
  margin:2px 0 0;
  font-size:.8rem;
  color:var(--muted);
}

/* layout 2 colunas */

.dashboard__layout{
  margin-top:8px;
}

.dashboard__columns{
  display:grid;
  grid-template-columns: minmax(0,320px) minmax(0,1fr);
  gap:28px;
  align-items:flex-start;
}

.dashboard__sidebar{
  display:grid;
  gap:18px;
}

.dashboard__content{
  display:grid;
  gap:20px;
}

.dashboard__sidebar-footer{
  margin-top:14px;
}

.dashboard-tag{
  display:inline-flex;
  padding:5px 10px;
  border-radius:999px;
  border:1px dashed rgba(255,255,255,.2);
  font-size:.78rem;
  color:var(--muted);
}

/* perfil */

.dash-profile{
  display:grid;
  gap:10px;
  margin-top:6px;
}

.dash-profile__item{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  font-size:.9rem;
}

.dash-label{
  color:var(--muted);
  font-size:.82rem;
}

.dash-value{
  font-weight:500;
  text-align:right;
}

/* ajuda */

.dash-tile--help{
  background:linear-gradient(155deg, rgba(27,42,116,.98), rgba(17,26,69,.98));
}

.dash-help-text{
  margin:0 0 10px;
  font-size:.85rem;
  color:var(--muted);
}

/* secções de eventos */

.dash-tile--panel{
  padding-top:18px;
}

.dash-events-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  gap:18px;
}

.dash-empty{
  margin:8px 0 6px;
  font-size:.9rem;
  color:var(--muted);
}

/* cards de evento */

.dash-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:10px 10px 12px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.08);
  background:radial-gradient(circle at 0 0, rgba(255,255,255,.06), transparent 55%);
  box-shadow:0 18px 40px rgba(0,0,0,.65);
}

.dash-card__media{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  aspect-ratio:16/9;
  background:#050816;
}

.dash-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.dash-card__badge{
  position:absolute;
  right:10px;
  bottom:10px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(6,10,40,.85);
  border:1px solid rgba(255,255,255,.16);
  font-size:.78rem;
}

.dash-card__badge--vod{
  background:rgba(11,18,48,.9);
}

.dash-card__body{
  display:grid;
  gap:4px;
}

.dash-card__title{
  margin:0;
  font-size:1rem;
  font-weight:700;
}

.dash-card__text{
  margin:0;
  font-size:.86rem;
  color:var(--muted);
}

.dash-card__actions{
  margin-top:auto;
}

/* links */

.dash-link{
  font-size:.86rem;
  color:var(--muted);
  text-decoration:none;
}

.dash-link:hover{
  color:#fff;
}

/* responsivo */

@media (max-width: 960px){
  .dashboard__hero{
    flex-direction:column;
  }
  .dashboard__summary{
    max-width:100%;
    width:100%;
  }
  .dashboard__columns{
    grid-template-columns: minmax(0,1fr);
  }
}

@media (max-width: 600px){
  .dashboard{
    padding-top:84px;
  }
  .dashboard__greeting{
    font-size:1.6rem;
  }
}
.dash-tag--disabled{
  display:inline-flex;
  padding:4px 10px;
  border-radius:999px;
  border:1px dashed rgba(255,255,255,.25);
  font-size:.78rem;
  color:var(--muted);
}
.metric--tickets .metric__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  font-size:.8rem;
  font-weight:600;
  text-decoration:none;
  color:#fff;
  background:#d7570c; /* Laranja WeStreamSports */
  white-space:nowrap;
}

.metric--tickets .metric__btn:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.4);
}

/* ===== VIEW HERO (ASSISTIR) ===== */

.view-hero{
    padding-top:96px;          /* igual ao dashboard__hero */
    padding-bottom:32px;
}

.view-hero__layout{
    max-width:var(--maxw);
    margin:0 auto;
    padding-left: 0 !important;
    display:grid;
    grid-template-columns: minmax(0,340px) minmax(0,1fr); /* ESQ: card, DIR: hero */
    gap:28px;
    align-items:stretch;
}

/* coluna esquerda (Event details) */
.view-hero__left{
    display:flex;
    flex-direction:column;
    gap:18px;
}

/* coluna direita (You are watching + player) */
.view-hero__right{
    display:flex;
}

/* painel da direita baseado na dash-tile */
.view-hero__panel{
    width:100%;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

/* pill tipo dashboard__pill */
.view-hero__pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:5px 12px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(6,10,40,.9);
    font-size:.78rem;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--muted);
    margin-bottom:10px;
}

.view-hero__pill-dot{
    width:7px;
    height:7px;
    border-radius:999px;
    background:var(--muted);
}

/* textos do hero */
.view-hero__title{
    margin:0 0 4px;
    font-size:1.9rem;
    font-weight:800;
    letter-spacing:.02em;
}

.view-hero__sub{
    margin:0 0 10px;
    color:var(--muted);
    font-size:.92rem;
}

.view-hero__meta{
    margin:0 0 16px;
    color:var(--muted);
    font-size:.85rem;
}

/* player encaixado no fundo do painel */
.view-hero__player{
    margin-top:auto;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 26px 60px rgba(0,0,0,.65);
}

/* botão back ao estilo que já tinhas */
.view-hero__back{
    align-self:flex-start;
}

/* responsivo: 1 coluna em mobile */
@media (max-width: 960px){
    .view-hero__layout{
        grid-template-columns:1fr;
    }
    .view-hero__right{
        order:1;
    }
    .view-hero__left{
        order:2;
    }
}

/* ===== Player "pipi" VOD ===== */

.ws-player{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 26px 60px rgba(0,0,0,.65);
  background:#050816;
}

/* vídeo ocupa sempre 16:9, responsivo */
.ws-player__video{
  width:100%;
  height:auto;
  display:block;
  aspect-ratio:16/9;
  background:#000;
  object-fit:cover;
}

/* overlay por cima do poster até dar play */
.ws-player__overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:18px;
  border:0;
  cursor:pointer;
  background:
    linear-gradient(180deg, rgba(5,8,32,.4), rgba(5,8,32,.90)),
    radial-gradient(circle at 0 0, rgba(215,87,12,.3), transparent 55%);
  color:#fff;
  text-align:center;
  transition:background .25s ease, transform .15s ease, opacity .2s ease;
}

.ws-player__overlay:hover{
  background:
    linear-gradient(180deg, rgba(5,8,32,.5), rgba(5,8,32,.96)),
    radial-gradient(circle at 0 0, rgba(215,87,12,.5), transparent 55%);
  transform:scale(1.01);
}

.ws-player__badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.3);
  background:rgba(6,10,40,.8);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  margin-bottom:10px;
  opacity:.9;
}

.ws-player__title{
  font-size:1.3rem;
  font-weight:800;
  margin-bottom:4px;
}

.ws-player__sub{
  font-size:.9rem;
  opacity:.8;
}

/* botão de play redondo no centro */
.ws-player__play-btn{
  margin-top:16px;
  width:74px;
  height:74px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:radial-gradient(circle at 30% 30%, #fff, #ffd8c1);
  box-shadow:0 0 0 6px rgba(0,0,0,.45);
}

.ws-player__play-icon{
  font-size:1.9rem;
  margin-left:4px;
  color:#d7570c;
}

/* overlay escondido */
.ws-player__overlay.is-hidden{
  opacity:0;
  pointer-events:none;
}

/* No seu arquivo CSS */
.auth-alert--multi-login {
    background: rgba(255, 0, 0, 0.12);  /* Vermelho suave transparente */
    border: 1px solid rgba(255, 0, 0, 0.35);
    color: #ff6b6b; /* Vermelho claro elegante */
    padding: 14px 18px;
    border-radius: 8px;
    margin: 18px 0 0 0; /* Aparece logo abaixo do título */
    font-size: 15px;
    font-weight: 500;
}