/* ============================================
   Evox Fibra — Design System
   Cores extraídas da logo: magenta #c7207b → rosa #e32e6a → cereja #ff3d60
   ============================================ */

@import url("section-scenes.css");

:root {
  /* Extraídas da logo Evox Digital (gradiente magenta → cereja) */
  --logo-magenta: #c7207b;
  --logo-rose: #e32e6a;
  --logo-cherry: #ff3d60;
  --logo-black: #0a0a0a;
  --primary: var(--logo-rose);
  --primary-dark: #9e1a56;
  --primary-light: var(--logo-cherry);
  --brand-pink: var(--logo-magenta);
  --cherry-mix: #d42a62;
  --secondary: var(--logo-black);
  --secondary-light: #1a1216;
  --accent: #ff6b85;
  --text: #1a1a2e;
  --text-muted: #5c5c6a;
  --text-light: #f9fafd;
  --bg: #ffffff;
  --bg-soft: #faf8f9;
  --bg-dark: var(--logo-black);
  --gradient-hero: linear-gradient(160deg, #141014 0%, var(--logo-black) 100%);
  --gradient-brand: linear-gradient(90deg, var(--logo-magenta) 0%, var(--logo-rose) 48%, var(--logo-cherry) 100%);
  --gradient-card: linear-gradient(135deg, var(--logo-magenta) 0%, var(--logo-rose) 50%, var(--logo-cherry) 100%);
  --shadow-sm: 0 2px 8px rgba(10, 10, 10, 0.08);
  --shadow-md: 0 8px 28px rgba(10, 10, 10, 0.12);
  --shadow-lg: 0 16px 44px rgba(227, 46, 106, 0.22);
  --radius: 16px;
  --radius-sm: 10px;
  --radius-lg: 24px;
  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --font: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
  --container: 1200px;
  --discount-green: #00c853;
}

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

html {
  scroll-behavior: smooth;
  scroll-padding-top: 140px;
}

body {
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

ul {
  list-style: none;
}

.container {
  width: min(100% - 2rem, var(--container));
  margin-inline: auto;
}

.skip-link {
  position: absolute;
  top: -100%;
  left: 1rem;
  background: var(--primary);
  color: white;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-sm);
  z-index: 9999;
}

.skip-link:focus {
  top: 1rem;
}

/* ========== Top Bar ========== */
.top-bar {
  background: var(--gradient-brand);
  color: white;
  font-size: 0.8rem;
  padding: 0.5rem 0;
}

.top-bar__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.top-bar__tagline {
  font-weight: 600;
}

.top-bar__tagline-mobile {
  display: none;
}

@media (max-width: 640px) {
  .top-bar__tagline-desktop {
    display: none;
  }

  .top-bar__tagline-mobile {
    display: inline;
  }
}

.top-bar__right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.social-links {
  display: flex;
  gap: 0.5rem;
}

.social-links__item {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  transition: var(--transition);
}

.social-links__item:hover {
  background: rgba(255, 255, 255, 0.3);
  transform: translateY(-2px);
}

.social-links__item svg {
  width: 14px;
  height: 14px;
}

.top-bar__switch {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.85rem;
  margin-left: 0.15rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  white-space: nowrap;
  transition: var(--transition);
}

.top-bar__switch:hover {
  background: rgba(255, 255, 255, 0.3);
  transform: translateY(-1px);
}

/* Top bar — estilo portal index v38 (#030303 + beam rosa/azul) */
.top-bar--portal {
  position: relative;
  overflow: hidden;
  background: #030303;
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.top-bar--portal .top-bar__inner {
  position: relative;
  z-index: 1;
}

.top-bar--portal::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.top-bar--portal.top-bar--res::before {
  background: radial-gradient(ellipse 85% 200% at 92% 120%, rgba(227, 46, 106, 0.5), transparent 68%);
}

.top-bar--portal.top-bar--emp::before {
  background: radial-gradient(ellipse 85% 200% at 92% 120%, rgba(59, 130, 246, 0.5), transparent 68%);
}

.top-bar--portal.top-bar--split::before {
  background:
    radial-gradient(ellipse 70% 200% at 10% 120%, rgba(227, 46, 106, 0.42), transparent 65%),
    radial-gradient(ellipse 70% 200% at 90% 120%, rgba(59, 130, 246, 0.42), transparent 65%);
}

.top-bar--portal.top-bar--split::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  transform: translateX(-50%);
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent,
    rgba(227, 46, 106, 0.35) 35%,
    rgba(255, 255, 255, 0.25) 50%,
    rgba(59, 130, 246, 0.35) 65%,
    transparent
  );
  opacity: 0.7;
}

.top-bar--portal .top-bar__tagline {
  color: rgba(255, 255, 255, 0.92);
}

.top-bar--portal .top-bar__right > span {
  color: rgba(255, 255, 255, 0.42);
}

.top-bar--portal.top-bar--res .top-bar__switch:hover {
  background: rgba(227, 46, 106, 0.32);
  border-color: rgba(227, 46, 106, 0.55);
}

.top-bar--portal.top-bar--emp .top-bar__switch:hover {
  background: rgba(59, 130, 246, 0.28);
  border-color: rgba(59, 130, 246, 0.55);
}

.top-bar--portal.top-bar--split .top-bar__switch--ghost:hover {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.45);
}

@media (max-width: 640px) {
  .top-bar--portal.top-bar--res .social-links,
  .top-bar--portal.top-bar--emp .social-links {
    display: none;
  }

  .top-bar--portal.top-bar--res .top-bar__right > span:not([class]),
  .top-bar--portal.top-bar--emp .top-bar__right > span:not([class]) {
    display: none;
  }
}

/* ========== Header ========== */
.header {
  background: white;
  box-shadow: var(--shadow-sm);
  position: sticky;
  top: 0;
  z-index: 1000;
}

.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 0;
  gap: 1rem;
}

.logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  background: transparent;
}

.logo__img {
  height: 52px;
  width: auto;
  max-width: none;
  display: block;
  background: transparent;
  object-fit: contain;
  image-rendering: auto;
}

.logo__img--footer {
  height: 48px;
}

.header__utilities {
  display: flex;
  gap: 0.5rem;
}

.utility-card {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
  transition: var(--transition);
  font-size: 0.75rem;
}

.utility-card:hover {
  background: var(--bg-soft);
}

.utility-card__icon {
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, rgba(227, 46, 106, 0.1), rgba(227, 46, 106, 0.05));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  flex-shrink: 0;
}

.utility-card__icon svg {
  width: 18px;
  height: 18px;
}

.utility-card strong {
  display: block;
  font-weight: 700;
  color: var(--secondary);
  font-size: 0.7rem;
}

.utility-card span {
  color: var(--text-muted);
  font-size: 0.65rem;
}

.utility-card--cta {
  background: var(--primary);
  color: white;
  border-radius: var(--radius);
}

.utility-card--cta .utility-card__icon {
  background: rgba(255, 255, 255, 0.2);
  color: white;
}

.utility-card--cta strong,
.utility-card--cta span {
  color: white;
}

.utility-card--cta:hover {
  background: var(--primary-dark);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.utility-card--portal {
  position: relative;
  margin-left: 0.55rem;
  padding: 0.45rem 0.9rem 0.45rem 0.5rem;
  gap: 0.55rem;
  background: #fff;
  border: 1.5px solid rgba(227, 46, 106, 0.45);
  border-radius: 50px;
  box-shadow: 0 2px 14px rgba(227, 46, 106, 0.1);
}

.utility-card--portal::before {
  content: '';
  position: absolute;
  left: -0.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 70%;
  background: rgba(3, 5, 65, 0.12);
}

.utility-card--portal strong {
  color: var(--primary);
  font-size: 0.72rem;
}

.utility-card--portal span {
  color: var(--secondary);
  font-size: 0.63rem;
  opacity: 0.85;
}

.utility-card--portal .utility-card__icon {
  width: 34px;
  height: 34px;
  background: var(--primary);
  color: #fff;
}

.utility-card--portal .utility-card__chevron {
  width: 14px;
  height: 14px;
  color: var(--primary);
  opacity: 0.55;
  flex-shrink: 0;
  margin-left: 0.1rem;
  transition: opacity var(--transition), transform var(--transition);
}

.utility-card--portal:hover {
  background: rgba(227, 46, 106, 0.04);
  border-color: var(--primary);
  box-shadow: 0 4px 20px rgba(227, 46, 106, 0.16);
  transform: translateY(-1px);
}

.utility-card--portal:hover .utility-card__icon {
  background: var(--primary-dark);
}

.utility-card--portal:hover .utility-card__chevron {
  opacity: 0.9;
  transform: translateX(2px);
}

/* ========== Navigation ========== */
.nav {
  border-top: 1px solid var(--bg-soft);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.5rem 0;
  flex-wrap: wrap;
}

.nav__link {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.6rem 1rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--secondary);
  border-radius: var(--radius-sm);
  transition: var(--transition);
}

.nav__link svg {
  width: 16px;
  height: 16px;
}

.nav__link:hover,
.nav__link--active {
  color: var(--primary);
  background: rgba(227, 46, 106, 0.08);
}

.nav__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  background: var(--primary);
  color: white;
  padding: 0.6rem 1.25rem;
  border-radius: 50px;
  font-size: 0.85rem;
  font-weight: 700;
  margin-left: 0.5rem;
  transition: var(--transition);
}

.nav__btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.nav__btn:hover {
  background: var(--primary-dark);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.nav__btn--evox {
  background: var(--primary);
  color: white;
  border: 1px solid var(--primary);
  box-shadow: 0 2px 12px rgba(227, 46, 106, 0.2);
  font-weight: 700;
}

.nav__btn--evox:hover {
  background: var(--primary-dark);
  border-color: var(--primary-dark);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(227, 46, 106, 0.28);
}

.nav__btn--speed {
  background: var(--secondary);
  box-shadow: none;
}

.nav__btn--speed:hover {
  background: var(--secondary-light);
  transform: none;
  box-shadow: none;
}

/* Desktop: utilitários no topo; nav só com links */
@media (min-width: 1101px) {
  .nav__btn--evox,
  .nav__btn--speed {
    display: none;
  }
}

.menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.5rem;
}

.menu-toggle span {
  width: 24px;
  height: 2px;
  background: var(--secondary);
  border-radius: 2px;
  transition: var(--transition);
}

/* ========== Buttons ========== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.875rem 2rem;
  border-radius: 50px;
  font-family: var(--font);
  font-size: 0.9rem;
  font-weight: 700;
  border: 2px solid transparent;
  cursor: pointer;
  transition: var(--transition);
}

.btn--primary {
  background: var(--gradient-brand);
  color: white;
  border: none;
}


.btn--lg {
  padding: 1rem 2.25rem;
  font-size: 1rem;
}

.btn--wa {
  background: #25d366;
  color: white;
  border: 2px solid #25d366;
}

.btn--wa:hover {
  background: #1fb855;
  border-color: #1fb855;
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(37, 211, 102, 0.35);
}

.btn--primary:hover {
  filter: brightness(1.06);
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

.portal__content .btn--portal {
  margin-top: 0.5rem;
  box-shadow: 0 4px 22px rgba(227, 46, 106, 0.28);
}

.portal__content .btn--portal:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(227, 46, 106, 0.34);
}

.btn--outline {
  background: transparent;
  color: white;
  border-color: rgba(255, 255, 255, 0.6);
}

.btn--outline:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: white;
}

.btn--outline-light {
  background: transparent;
  color: white;
  border-color: rgba(255, 255, 255, 0.5);
}

.btn--outline-light:hover {
  background: rgba(255, 255, 255, 0.1);
}

.btn--plan {
  width: 100%;
  background: var(--bg-soft);
  color: var(--secondary);
  border: 2px solid transparent;
}

.btn--plan:hover {
  background: var(--primary);
  color: white;
}

.btn--plan-featured {
  background: var(--primary);
  color: white;
}

.btn--plan-featured:hover {
  background: var(--primary-dark);
}

.btn--full {
  width: 100%;
}

/* ========== Hero ========== */
.hero {
  position: relative;
  min-height: 85vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.hero__bg {
  position: absolute;
  inset: 0;
}

.hero__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  background: var(--gradient-hero);
  opacity: 0.88;
}

.hero__content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  align-items: center;
  gap: 3rem;
  padding: 4rem 0;
}

.hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  padding: 0.5rem 1rem;
  border-radius: 50px;
  color: white;
  font-size: 0.8rem;
  font-weight: 600;
}

.hero__badge svg {
  width: 16px;
  height: 16px;
}

.hero__title {
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 900;
  color: white;
  line-height: 1.1;
  margin-bottom: 1.25rem;
}

.hero__title span {
  color: #e8838a;
}

.hero__desc {
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.1rem;
  max-width: 520px;
  margin-bottom: 2rem;
}

.hero__actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.hero__visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
}

.hero__float {
  position: absolute;
  font-size: 3rem;
  animation: float 4s ease-in-out infinite;
  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.3));
}

.hero__float--1 { top: 10%; left: 10%; animation-delay: 0s; }
.hero__float--2 { top: 20%; right: 15%; animation-delay: 1s; }
.hero__float--3 { bottom: 15%; right: 25%; animation-delay: 2s; }

@keyframes float {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-20px) rotate(5deg); }
}

.hero__speed {
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(20px);
  border: 2px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--radius-lg);
  padding: 2.5rem 3rem;
  text-align: center;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
}

.hero__speed-value {
  display: block;
  font-size: 5rem;
  font-weight: 900;
  color: white;
  line-height: 1;
}

.hero__speed-unit {
  font-size: 1.25rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
  letter-spacing: 3px;
}

/* ========== Marquee ========== */
.marquee {
  background: var(--gradient-brand);
  color: white;
  padding: 0.75rem 0;
  overflow: hidden;
  white-space: nowrap;
}

.marquee--dark {
  background: var(--secondary);
}

.marquee__track {
  display: inline-flex;
  animation: marquee 25s linear infinite;
}

.marquee__track--reverse {
  animation-direction: reverse;
}

.marquee__track span {
  padding: 0 2rem;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.5px;
}

@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ========== Sections ========== */
.section {
  padding: 5rem 0;
}

.section__title {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--secondary);
  text-align: center;
  margin-bottom: 0.75rem;
}

.section__title--left {
  text-align: left;
}

.section__title--light {
  color: white;
}

.section__subtitle {
  text-align: center;
  color: var(--text-muted);
  font-size: 1.05rem;
  margin-bottom: 3rem;
  max-width: 600px;
  margin-inline: auto;
}

.section__label {
  display: inline-block;
  background: rgba(227, 46, 106, 0.1);
  color: var(--primary);
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding: 0.4rem 1rem;
  border-radius: 50px;
  margin-bottom: 1rem;
}

.section__label--light {
  background: rgba(227, 46, 106, 0.2);
  color: #e8838a;
  border: 1px solid rgba(227, 46, 106, 0.35);
}

/* ========== Services ========== */
.services {
  background: var(--bg-soft);
}

.services__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.service-card {
  background: white;
  padding: 2rem 1.5rem;
  border-radius: var(--radius);
  text-align: center;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  border: 1px solid transparent;
}

.service-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
  border-color: rgba(227, 46, 106, 0.2);
}

.service-card__icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 1.25rem;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
}

.service-card__icon svg {
  width: 28px;
  height: 28px;
}

.service-card h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--secondary);
  margin-bottom: 0.75rem;
}

.service-card p {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.5;
}

/* ========== About ========== */
.about__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}

.about__image {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  background: linear-gradient(145deg, rgba(8, 10, 18, 0.95) 0%, rgba(14, 10, 20, 0.92) 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.about__image img {
  display: none;
}

.about__badge {
  position: absolute;
  bottom: 2rem;
  right: 2rem;
  z-index: 2;
  background: var(--primary);
  color: white;
  padding: 1.25rem 1.5rem;
  border-radius: var(--radius);
  text-align: center;
  box-shadow: var(--shadow-md);
}

.about__badge span {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.about__badge strong {
  font-size: 2rem;
  font-weight: 900;
}

.about__content p {
  color: var(--text-muted);
  margin-bottom: 1.5rem;
  font-size: 1rem;
}

.about__list {
  margin-bottom: 2rem;
}

.about__list li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.6rem 0;
  font-weight: 600;
  color: var(--secondary);
}

.about__list svg {
  width: 20px;
  height: 20px;
  color: var(--primary);
  flex-shrink: 0;
}

/* Animação fibra — about */
.evox-fiber-viz {
  position: relative;
  width: 100%;
  height: 450px;
  display: flex;
  flex-direction: column;
}

.evox-fiber-viz__stage {
  position: relative;
  flex: 1;
  min-height: 0;
}

.evox-fiber-viz__scene {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.evox-fiber-viz__art {
  width: 100%;
  height: 100%;
  display: block;
  padding: 1.25rem 1rem 0.5rem;
}

.evox-fiber-viz__captions {
  position: relative;
  flex: 0 0 3.25rem;
  padding: 0 1.25rem 1rem;
}

.evox-fiber-viz__caption {
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  margin: 0;
  opacity: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.72);
  text-align: center;
}

.evox-fiber-viz__caption strong {
  display: block;
  color: #fff;
  font-size: 0.92rem;
  font-weight: 800;
  margin-bottom: 0.15rem;
}

.evox-fiber-draw {
  fill: none;
  stroke-dasharray: 320;
  stroke-dashoffset: 320;
}

.evox-fiber-fill {
  opacity: 0;
}

.evox-fiber-pulse {
  opacity: 0;
}

.evox-fiber-node circle {
  fill: rgba(255, 255, 255, 0.08);
}

/* Cenas — ciclo 24s */
.evox-fiber-viz__scene--1 { animation: evox-fiber-scene-1 24s ease-in-out infinite; }
.evox-fiber-viz__scene--2 { animation: evox-fiber-scene-2 24s ease-in-out infinite; }
.evox-fiber-viz__scene--3 { animation: evox-fiber-scene-3 24s ease-in-out infinite; }
.evox-fiber-viz__scene--4 { animation: evox-fiber-scene-4 24s ease-in-out infinite; overflow: hidden; }

.evox-fiber-viz__scene--4 .evox-fiber-viz__art {
  overflow: hidden;
}

.evox-fiber-viz__caption--1 { animation: evox-fiber-caption-1 24s ease-in-out infinite; }
.evox-fiber-viz__caption--2 { animation: evox-fiber-caption-2 24s ease-in-out infinite; }
.evox-fiber-viz__caption--3 { animation: evox-fiber-caption-3 24s ease-in-out infinite; }
.evox-fiber-viz__caption--4 { animation: evox-fiber-caption-4 24s ease-in-out infinite; }

@keyframes evox-fiber-scene-1 {
  0%, 2% { opacity: 0; }
  4%, 22% { opacity: 1; }
  24%, 100% { opacity: 0; }
}

@keyframes evox-fiber-scene-2 {
  0%, 22% { opacity: 0; }
  24%, 46% { opacity: 1; }
  48%, 100% { opacity: 0; }
}

@keyframes evox-fiber-scene-3 {
  0%, 46% { opacity: 0; }
  48%, 70% { opacity: 1; }
  72%, 100% { opacity: 0; }
}

@keyframes evox-fiber-scene-4 {
  0%, 70% { opacity: 0; }
  72%, 98% { opacity: 1; }
  99%, 100% { opacity: 0; }
}

@keyframes evox-fiber-caption-1 {
  0%, 3% { opacity: 0; transform: translateY(6px); }
  5%, 21% { opacity: 1; transform: translateY(0); }
  23%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes evox-fiber-caption-2 {
  0%, 23% { opacity: 0; transform: translateY(6px); }
  25%, 45% { opacity: 1; transform: translateY(0); }
  47%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes evox-fiber-caption-3 {
  0%, 47% { opacity: 0; transform: translateY(6px); }
  49%, 69% { opacity: 1; transform: translateY(0); }
  71%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes evox-fiber-caption-4 {
  0%, 71% { opacity: 0; transform: translateY(6px); }
  73%, 97% { opacity: 1; transform: translateY(0); }
  99%, 100% { opacity: 0; transform: translateY(-4px); }
}

/* Cena 1 — rede própria */
.evox-fiber-draw--s1-1 { animation: evox-fiber-draw-s1-1 24s ease-in-out infinite; }
.evox-fiber-draw--s1-2 { animation: evox-fiber-draw-s1-2 24s ease-in-out infinite; }
.evox-fiber-draw--s1-3 { animation: evox-fiber-draw-s1-3 24s ease-in-out infinite; }
.evox-fiber-draw--s1-4 { animation: evox-fiber-draw-s1-4 24s ease-in-out infinite; }
.evox-fiber-draw--s1-5 { animation: evox-fiber-draw-s1-5 24s ease-in-out infinite; }
.evox-fiber-draw--s1-6 { animation: evox-fiber-draw-s1-6 24s ease-in-out infinite; }
.evox-fiber-draw--s1-7 { animation: evox-fiber-draw-s1-7 24s ease-in-out infinite; }
.evox-fiber-draw--s1-8 { animation: evox-fiber-draw-s1-8 24s ease-in-out infinite; }
.evox-fiber-draw--s1-9 { animation: evox-fiber-draw-s1-9 24s ease-in-out infinite; }
.evox-fiber-fill--s1-1 { animation: evox-fiber-fill-s1-1 24s ease-in-out infinite; }
.evox-fiber-fill--s1-2 { animation: evox-fiber-fill-s1-2 24s ease-in-out infinite; }

@keyframes evox-fiber-draw-s1-1 { 0%, 4% { stroke-dashoffset: 320; } 9%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-2 { 0%, 5% { stroke-dashoffset: 320; } 10%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-3 { 0%, 6% { stroke-dashoffset: 320; } 11%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-4 { 0%, 7% { stroke-dashoffset: 320; } 13%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-5 { 0%, 9% { stroke-dashoffset: 320; } 15%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-6 { 0%, 10% { stroke-dashoffset: 320; } 16%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-7 { 0%, 12% { stroke-dashoffset: 320; } 18%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-8 { 0%, 14% { stroke-dashoffset: 320; } 20%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s1-9 { 0%, 16% { stroke-dashoffset: 320; } 21%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-fill-s1-1 { 0%, 18% { opacity: 0; } 20%, 100% { opacity: 1; } }
@keyframes evox-fiber-fill-s1-2 { 0%, 19% { opacity: 0; } 21%, 100% { opacity: 1; } }

/* Cena 2 — speed test / velocímetro */
.evox-fiber-draw--s2-1 { animation: evox-fiber-draw-s2-1 24s ease-in-out infinite; }
.evox-fiber-draw--s2-2 { animation: evox-fiber-draw-s2-2 24s ease-in-out infinite; }
.evox-fiber-draw--s2-3 { animation: evox-fiber-draw-s2-3 24s ease-in-out infinite; }
.evox-fiber-draw--s2-4 { animation: evox-fiber-draw-s2-4 24s ease-in-out infinite; }
.evox-fiber-draw--s2-5 { animation: evox-fiber-draw-s2-5 24s ease-in-out infinite; }
.evox-fiber-draw--s2-6 { animation: evox-fiber-draw-s2-6 24s ease-in-out infinite; }
.evox-fiber-draw--s2-7 { animation: evox-fiber-draw-s2-7 24s ease-in-out infinite; }
.evox-fiber-draw--s2-8 { animation: evox-fiber-draw-s2-8 24s ease-in-out infinite; }
.evox-fiber-fill--s2-1 { animation: evox-fiber-fill-s2-1 24s ease-in-out infinite; }
.evox-fiber-fill--s2-2 { animation: evox-fiber-fill-s2-2 24s ease-in-out infinite; }
.evox-fiber-fill--s2-3 { animation: evox-fiber-fill-s2-3 24s ease-in-out infinite; }
.evox-fiber-fill--s2-4 { animation: evox-fiber-fill-s2-4 24s ease-in-out infinite; }
.evox-fiber-fill--s2-5 { animation: evox-fiber-fill-s2-5 24s ease-in-out infinite; }
.evox-fiber-fill--s2-6 { animation: evox-fiber-fill-s2-6 24s ease-in-out infinite; }
.evox-fiber-fill--s2-7 { animation: evox-fiber-fill-s2-7 24s ease-in-out infinite; }
.evox-fiber-gauge--s2 { animation: evox-fiber-gauge-s2 24s ease-in-out infinite; }
.evox-fiber-bar--s2 { animation: evox-fiber-bar-s2 24s ease-in-out infinite; }
.evox-fiber-speed-needle { animation: evox-fiber-needle-s2 24s ease-in-out infinite; }

.evox-fiber-gauge--s2 {
  fill: none;
  stroke-dasharray: 289;
  stroke-dashoffset: 289;
}

.evox-fiber-bar--s2 {
  transform-box: fill-box;
  transform-origin: left center;
  transform: scaleX(0);
}

.evox-fiber-speed-needle {
  transform-origin: 240px 168px;
  opacity: 0;
}

@keyframes evox-fiber-draw-s2-1 { 0%, 24% { stroke-dashoffset: 320; } 27%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s2-2 { 0%, 25% { stroke-dashoffset: 320; } 28%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s2-3 { 0%, 26% { stroke-dashoffset: 320; } 29%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s2-4 { 0%, 27% { stroke-dashoffset: 320; } 30%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s2-5 { 0%, 28% { stroke-dashoffset: 320; } 31%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s2-6 { 0%, 29% { stroke-dashoffset: 320; } 32%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s2-7 { 0%, 30% { stroke-dashoffset: 320; } 33%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s2-8 { 0%, 31% { stroke-dashoffset: 320; } 34%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-fill-s2-1 { 0%, 24% { opacity: 0; } 26%, 100% { opacity: 1; } }

@keyframes evox-fiber-gauge-s2 {
  0%, 28% { stroke-dashoffset: 289; opacity: 0; }
  29% { opacity: 1; stroke-dashoffset: 289; }
  40% { stroke-dashoffset: 0; }
  46%, 100% { stroke-dashoffset: 0; opacity: 1; }
}

@keyframes evox-fiber-needle-s2 {
  0%, 28% { opacity: 0; transform: rotate(-78deg); }
  29% { opacity: 1; transform: rotate(-78deg); }
  40% { transform: rotate(78deg); }
  46%, 100% { opacity: 1; transform: rotate(78deg); }
}

@keyframes evox-fiber-fill-s2-2 {
  0%, 36% { opacity: 0; }
  38%, 100% { opacity: 1; }
}

@keyframes evox-fiber-fill-s2-3 {
  0%, 37% { opacity: 0; }
  39%, 100% { opacity: 1; }
}

@keyframes evox-fiber-fill-s2-4 { 0%, 29% { opacity: 0; } 31%, 100% { opacity: 1; } }
@keyframes evox-fiber-fill-s2-5 { 0%, 29% { opacity: 0; } 31%, 100% { opacity: 1; } }
@keyframes evox-fiber-fill-s2-6 { 0%, 32% { opacity: 0; } 34%, 100% { opacity: 1; } }

@keyframes evox-fiber-bar-s2 {
  0%, 32% { transform: scaleX(0); opacity: 0; }
  33% { opacity: 1; transform: scaleX(0); }
  41% { transform: scaleX(1); opacity: 1; }
  46%, 100% { transform: scaleX(1); opacity: 1; }
}

@keyframes evox-fiber-fill-s2-7 {
  0%, 40% { opacity: 0; }
  42%, 100% { opacity: 1; }
}

/* Cena 3 — instalação grátis */
.evox-fiber-draw--s3-1 { animation: evox-fiber-draw-s3-1 24s ease-in-out infinite; }
.evox-fiber-draw--s3-2 { animation: evox-fiber-draw-s3-2 24s ease-in-out infinite; }
.evox-fiber-draw--s3-3 { animation: evox-fiber-draw-s3-3 24s ease-in-out infinite; }
.evox-fiber-draw--s3-4 { animation: evox-fiber-draw-s3-4 24s ease-in-out infinite; }
.evox-fiber-draw--s3-5 { animation: evox-fiber-draw-s3-5 24s ease-in-out infinite; }
.evox-fiber-draw--s3-6 { animation: evox-fiber-draw-s3-6 24s ease-in-out infinite; }
.evox-fiber-draw--s3-7 { animation: evox-fiber-draw-s3-7 24s ease-in-out infinite; }
.evox-fiber-draw--s3-8 { animation: evox-fiber-draw-s3-8 24s ease-in-out infinite; }
.evox-fiber-fill--s3-1 { animation: evox-fiber-fill-s3-1 24s ease-in-out infinite; }
.evox-fiber-fill--s3-2 { animation: evox-fiber-fill-s3-2 24s ease-in-out infinite; }

@keyframes evox-fiber-draw-s3-1 { 0%, 48% { stroke-dashoffset: 320; } 52%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s3-2 { 0%, 49% { stroke-dashoffset: 320; } 53%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s3-3 { 0%, 50% { stroke-dashoffset: 320; } 54%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s3-4 { 0%, 51% { stroke-dashoffset: 320; } 55%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s3-5 { 0%, 52% { stroke-dashoffset: 320; } 56%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s3-6 { 0%, 53% { stroke-dashoffset: 320; } 58%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s3-7 { 0%, 54% { stroke-dashoffset: 320; } 58%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s3-8 { 0%, 55% { stroke-dashoffset: 320; } 59%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-fill-s3-1 { 0%, 58% { opacity: 0; transform: scale(0.6); } 61%, 100% { opacity: 1; transform: scale(1); } }
@keyframes evox-fiber-fill-s3-2 { 0%, 59% { opacity: 0; } 62%, 100% { opacity: 1; } }

.evox-fiber-fill--s3-1 { transform-origin: 352px 200px; }

/* Cena 4 — mapa do Pará + zoom RMB + cobertura */
.evox-fiber-fill--s4-0 { animation: evox-fiber-fill-s4-0 24s ease-in-out infinite; }
.evox-fiber-fill--s4-rmb-title { animation: evox-fiber-fill-s4-rmb-title 24s ease-in-out infinite; opacity: 0; }
.evox-fiber-map-zoom {
  animation: evox-fiber-map-zoom-s4 24s ease-in-out infinite;
  transform-origin: 363px 122px;
  transform-box: view-box;
}
.evox-fiber-draw--s4-1 { animation: evox-fiber-draw-s4-1 24s ease-in-out infinite; stroke-dasharray: 1380; }
.evox-fiber-draw--s4-2 { animation: evox-fiber-draw-s4-2 24s ease-in-out infinite; stroke-dasharray: 280; }
.evox-fiber-fill--s4-1 { animation: evox-fiber-fill-s4-1 24s ease-in-out infinite; }
.evox-fiber-fill--s4-2 { animation: evox-fiber-fill-s4-2 24s ease-in-out infinite; }
.evox-fiber-fill--s4-3 { animation: evox-fiber-fill-s4-3 24s ease-in-out infinite; }
.evox-fiber-coverage--s4 { animation: evox-fiber-coverage-s4 24s ease-in-out infinite; }
.evox-fiber-pulse--s4 { animation: evox-fiber-map-pulse-s4 24s ease-in-out infinite; }
.evox-fiber-node--1 { animation: evox-fiber-node-1 24s ease-in-out infinite; }
.evox-fiber-node--2 { animation: evox-fiber-node-2 24s ease-in-out infinite; }
.evox-fiber-node--3 { animation: evox-fiber-node-3 24s ease-in-out infinite; }
.evox-fiber-node--4 { animation: evox-fiber-node-4 24s ease-in-out infinite; }
.evox-fiber-node--5 { animation: evox-fiber-node-5 24s ease-in-out infinite; }

.evox-fiber-coverage--s4 {
  opacity: 0;
  transform-origin: 363px 122px;
}

.evox-fiber-node {
  opacity: 0;
}

.evox-fiber-pulse--s4 {
  transform-origin: 358px 123px;
  opacity: 0;
}

@keyframes evox-fiber-fill-s4-0 {
  0%, 72% { opacity: 0; }
  74%, 79% { opacity: 1; }
  81%, 100% { opacity: 0; }
}

@keyframes evox-fiber-fill-s4-rmb-title {
  0%, 91% { opacity: 0; }
  93%, 97% { opacity: 1; }
  99%, 100% { opacity: 0; }
}

@keyframes evox-fiber-map-zoom-s4 {
  0%, 79% { transform: scale(1); }
  80%, 81% { transform: scale(1); }
  92%, 97% { transform: scale(3.6); }
  98%, 100% { transform: scale(1); }
}

@keyframes evox-fiber-draw-s4-1 { 0%, 72% { stroke-dashoffset: 1380; } 78%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-draw-s4-2 { 0%, 74% { stroke-dashoffset: 280; } 79%, 100% { stroke-dashoffset: 0; } }
@keyframes evox-fiber-fill-s4-1 { 0%, 92% { opacity: 0; } 94%, 100% { opacity: 1; } }
@keyframes evox-fiber-fill-s4-3 { 0%, 91% { opacity: 0; } 93%, 100% { opacity: 1; } }

@keyframes evox-fiber-coverage-s4 {
  0%, 91% { opacity: 0; transform: scale(0.92); }
  93%, 97% { opacity: 1; transform: scale(1); }
  99%, 100% { opacity: 0; transform: scale(0.92); }
}

@keyframes evox-fiber-fill-s4-2 {
  0%, 92% { opacity: 0; }
  94%, 100% { opacity: 1; }
}

@keyframes evox-fiber-map-pulse-s4 {
  0%, 93% { opacity: 0; transform: scale(0.85); }
  94% { opacity: 0.75; transform: scale(0.85); }
  97% { opacity: 0; transform: scale(1.2); }
  98%, 100% { opacity: 0; transform: scale(1.2); }
}

@keyframes evox-fiber-node-1 {
  0%, 92% { opacity: 0; }
  94%, 100% { opacity: 1; }
}

@keyframes evox-fiber-node-2 {
  0%, 93% { opacity: 0; }
  95%, 100% { opacity: 1; }
}

@keyframes evox-fiber-node-3 {
  0%, 94% { opacity: 0; }
  96%, 100% { opacity: 1; }
}

@keyframes evox-fiber-node-4 {
  0%, 95% { opacity: 0; }
  97%, 100% { opacity: 1; }
}

@keyframes evox-fiber-node-5 {
  0%, 96% { opacity: 0; }
  98%, 100% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .evox-fiber-viz__scene,
  .evox-fiber-viz__caption,
  .evox-fiber-draw,
  .evox-fiber-fill,
  .evox-fiber-pulse,
  .evox-fiber-node,
  .evox-fiber-gauge,
  .evox-fiber-bar,
  .evox-fiber-coverage,
  .evox-fiber-speed-needle,
  .evox-fiber-map-zoom {
    animation: none !important;
  }

  .evox-fiber-viz__scene--1 { opacity: 1; }
  .evox-fiber-viz__scene--2,
  .evox-fiber-viz__scene--3,
  .evox-fiber-viz__scene--4 { display: none; }

  .evox-fiber-viz__caption--1 {
    opacity: 1;
    transform: none;
  }

  .evox-fiber-viz__caption--2,
  .evox-fiber-viz__caption--3,
  .evox-fiber-viz__caption--4 { display: none; }

  .evox-fiber-draw { stroke-dashoffset: 0; }
  .evox-fiber-fill { opacity: 1; }
  .evox-fiber-node { opacity: 1; }
  .evox-fiber-gauge { stroke-dashoffset: 0; opacity: 1; }
  .evox-fiber-bar { transform: scaleX(1); opacity: 1; }
  .evox-fiber-coverage { opacity: 1; transform: none; }
  .evox-fiber-speed-needle { opacity: 1; transform: rotate(78deg); }
}

@media (max-width: 900px) {
  .evox-fiber-viz {
    height: 380px;
  }
}

/* ========== Plans ========== */
.plans {
  background: var(--bg-soft);
}

.plans__promo {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  max-width: 720px;
  margin: 0 auto 2rem;
  padding: 1.15rem 1.35rem;
  background: white;
  border: 1px solid rgba(227, 46, 106, 0.18);
  border-left: 4px solid var(--primary);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.plans__promo-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(227, 46, 106, 0.1);
  color: var(--primary);
}

.plans__promo-icon svg {
  width: 22px;
  height: 22px;
}

.plans__promo-text strong {
  display: block;
  font-size: 0.95rem;
  color: var(--secondary);
  margin-bottom: 0.35rem;
}

.plans__promo-text p {
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.55;
  margin: 0;
}

.plans__promo-text span {
  color: var(--primary);
  font-weight: 700;
}

.plans__grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.75rem;
  padding-top: 1.25rem;
}

.section-scene--plans > .container {
  width: min(100% - 1.5rem, 1480px);
}

.plans__grid:not(.plans__grid--corp) .plan-card--featured {
  transform: none;
}

.plans__grid:not(.plans__grid--corp) .plan-card--featured:hover {
  transform: translateY(-10px);
}

.plans__grid--corp {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.plan-card {
  background: white;
  border-radius: var(--radius-lg);
  padding: 2rem 1.5rem;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  position: relative;
  border: 2px solid transparent;
  display: flex;
  flex-direction: column;
}

.plan-card:hover {
  transform: translateY(-10px);
  box-shadow: var(--shadow-lg);
}

.plan-card--featured {
  border-color: var(--primary);
  transform: scale(1.03);
  box-shadow: var(--shadow-lg);
  overflow: visible;
  z-index: 1;
}

.plan-card--featured:hover {
  transform: scale(1.03) translateY(-10px);
}

.plan-card__badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--gradient-card);
  color: white;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.35rem 1rem;
  border-radius: 50px;
  white-space: nowrap;
  z-index: 2;
  box-shadow: 0 4px 14px rgba(227, 46, 106, 0.35);
}

.plan-card__tier {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--primary);
  margin-bottom: 0.5rem;
}

.plan-card__speed {
  font-size: 2.5rem;
  font-weight: 900;
  color: var(--secondary);
  line-height: 1;
  margin-bottom: 0.35rem;
}

.plan-card__bandwidth {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin-bottom: 1rem;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-muted);
  letter-spacing: 0.02em;
}

.plan-card__bandwidth span {
  padding: 0.2rem 0.45rem;
  background: var(--bg-soft);
  border-radius: 6px;
}

.plan-card__speed small {
  font-size: 1rem;
  font-weight: 700;
}

.plan-card__features {
  flex: 1;
  margin-bottom: 1.5rem;
}

.plan-card__features li {
  padding: 0.5rem 0;
  font-size: 0.85rem;
  color: var(--text-muted);
  border-bottom: 1px solid var(--bg-soft);
  position: relative;
  padding-left: 1.25rem;
}

.plan-card__features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--primary);
  font-weight: 700;
}

.plan-card__pricing {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 0.85rem;
}

.plan-card--pix-only .plan-card__price-block--pix {
  padding: 0.85rem 0.55rem;
}

.plan-card__price-block {
  padding: 0.65rem 0.55rem;
  border-radius: var(--radius-sm);
  text-align: center;
}

.plan-card__price-block--card {
  background: rgba(0, 200, 83, 0.08);
  border: 1px solid rgba(0, 200, 83, 0.25);
}

.plan-card__price-block--pix {
  background: var(--bg-soft);
  border: 1px solid rgba(3, 5, 65, 0.08);
}

.plan-card--featured .plan-card__price-block--card {
  background: rgba(0, 200, 83, 0.12);
  border-color: rgba(0, 200, 83, 0.35);
}

.plan-card__price-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin-bottom: 0.35rem;
  flex-wrap: wrap;
}

.plan-card__discount-tag {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: var(--discount-green);
  color: white;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.plan-card__price-label {
  font-size: 0.62rem;
  font-weight: 700;
  color: var(--secondary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.plan-card__price {
  margin-bottom: 0.2rem;
  line-height: 1.1;
}

.plan-card__price--installments {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 0.2rem 0.35rem;
}

.plan-card__installments {
  font-size: 0.72rem;
  font-weight: 800;
  color: var(--secondary);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.plan-card__price--alt .plan-card__amount {
  font-size: 1.35rem;
  color: var(--secondary);
}

.plan-card__amount {
  font-size: 1.65rem;
  font-weight: 900;
  color: var(--primary);
}

.plan-card__amount small {
  font-size: 1rem;
}

.plan-card__period {
  font-size: 0.75rem;
  color: var(--text-muted);
}

.plan-card__adesao {
  display: block;
  font-size: 0.62rem;
  font-weight: 600;
  color: var(--text-muted);
  line-height: 1.35;
}

.plan-card__adesao--free {
  color: var(--discount-green);
  font-weight: 700;
}

.plan-card {
  padding: 1.5rem 0.9rem;
}

.plan-card__speed {
  font-size: 1.85rem;
}

.plans__disclaimer {
  text-align: center;
  margin-top: 2rem;
  font-size: 0.85rem;
  color: var(--text-muted);
}

/* ========== TV Teaser (home) ========== */
.tv-teaser {
  background: var(--secondary);
  color: white;
  overflow: hidden;
  position: relative;
}

.tv-teaser__glow {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 75% 50%, rgba(227, 46, 106, 0.18), transparent 55%),
    radial-gradient(ellipse at 20% 80%, rgba(139, 26, 107, 0.12), transparent 45%);
  pointer-events: none;
}

.tv-teaser__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}

.tv-teaser__content p {
  color: rgba(255, 255, 255, 0.82);
  margin-bottom: 1.5rem;
  line-height: 1.7;
}

.tv-teaser__content p strong {
  color: #e8838a;
}

.tv-teaser__price {
  margin-bottom: 2rem;
}

.tv-teaser__price-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.55);
  margin-bottom: 0.35rem;
}

.tv-teaser__price-value {
  font-size: 2.75rem;
  font-weight: 900;
  color: var(--primary-light);
  line-height: 1;
}

.tv-teaser__price-value small {
  font-size: 1.1rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
}

.tv-teaser__img {
  width: 100%;
  max-width: 480px;
  margin-inline: auto;
  display: block;
  border-radius: var(--radius-lg);
  box-shadow:
    0 0 80px rgba(227, 46, 106, 0.25),
    0 20px 50px rgba(0, 0, 0, 0.45);
  border: 3px solid rgba(227, 46, 106, 0.35);
}

.service-card--link {
  text-decoration: none;
  color: inherit;
  display: block;
}

/* ========== TV Page ========== */
.tv__hero {
  background: var(--secondary);
  color: white;
  overflow: hidden;
  position: relative;
}

.tv__glow {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 75% 50%, rgba(227, 46, 106, 0.18), transparent 55%),
    radial-gradient(ellipse at 20% 80%, rgba(139, 26, 107, 0.12), transparent 45%);
  pointer-events: none;
}

.tv__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}

.tv__content p {
  color: rgba(255, 255, 255, 0.82);
  margin-bottom: 1.5rem;
  line-height: 1.7;
}

.tv__content p strong {
  color: #e8838a;
}

.tv__price-box {
  display: inline-block;
  margin-bottom: 2rem;
  padding: 1.25rem 1.5rem;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(227, 46, 106, 0.25);
  border-radius: var(--radius);
  backdrop-filter: blur(6px);
}

.tv__price-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.55);
  margin-bottom: 0.35rem;
}

.tv__price {
  line-height: 1;
}

.tv__price-amount {
  font-size: 3rem;
  font-weight: 900;
  color: var(--primary-light);
}

.tv__price-period {
  font-size: 1.25rem;
  color: rgba(255, 255, 255, 0.7);
}

.tv__hero-img {
  width: 100%;
  max-width: 520px;
  margin-inline: auto;
  display: block;
  border-radius: var(--radius-lg);
  box-shadow:
    0 0 80px rgba(227, 46, 106, 0.25),
    0 20px 50px rgba(0, 0, 0, 0.45);
  border: 3px solid rgba(227, 46, 106, 0.35);
}

.tv__plans {
  background: white;
}

.tv__grade {
  background: #f7f5fa;
}

.tv__extras {
  background: white;
}

.tv__block-header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.tv__block-header .section__subtitle {
  margin-top: 0.75rem;
  margin-bottom: 0;
}

.tv__accent {
  color: var(--primary);
}

.tv__disclaimer {
  margin-top: 0.5rem;
  font-size: 0.85rem;
  color: var(--text-muted);
}

.tv__plan-images {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.tv__plan-figure {
  margin: 0;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  border: 1px solid rgba(227, 46, 106, 0.12);
  background: white;
}

.tv__plan-figure img {
  width: 100%;
  height: auto;
  display: block;
}

.tv__apps {
  margin-bottom: 2rem;
}

.tv__apps-label {
  text-align: center;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 1.25rem;
}

.tv__apps-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  max-width: 720px;
  margin-inline: auto;
}

.tv__apps-grid img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  border-radius: 12px;
  background: #f7f5fa;
  padding: 4px;
  transition: var(--transition);
}

.tv__apps-grid img:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 6px 16px rgba(227, 46, 106, 0.2);
}

.tv__grade-tabs {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  margin-bottom: 2rem;
}

.tv__grade-tab {
  padding: 0.75rem 1.75rem;
  border: 2px solid rgba(227, 46, 106, 0.25);
  border-radius: 999px;
  background: white;
  color: var(--secondary);
  font-weight: 800;
  font-size: 0.95rem;
  cursor: pointer;
  transition: var(--transition);
}

.tv__grade-tab:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.tv__grade-tab.is-active {
  background: var(--primary);
  border-color: var(--primary);
  color: white;
  box-shadow: 0 6px 20px rgba(227, 46, 106, 0.35);
}

.tv__grade-panels {
  max-width: 820px;
  margin-inline: auto;
}

.tv__grade-panel {
  display: none;
}

.tv__grade-panel.is-active {
  display: block;
}

.tv__grade-title {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 1rem;
  text-align: center;
}

.tv__grade-img-wrap {
  background: white;
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  box-shadow: var(--shadow-md);
  border: 1px solid rgba(227, 46, 106, 0.1);
}

.tv__grade-img-wrap img {
  width: 100%;
  height: auto;
  display: block;
}

.tv__extras-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.tv__extra-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 1.5rem 1rem;
  background: #f7f5fa;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(227, 46, 106, 0.1);
  text-decoration: none;
  color: inherit;
  transition: var(--transition);
}

.tv__extra-card:hover {
  transform: translateY(-4px);
  border-color: var(--primary);
  box-shadow: 0 12px 28px rgba(227, 46, 106, 0.18);
}

.tv__extra-card img {
  width: 88px;
  height: 88px;
  object-fit: contain;
  margin-bottom: 0.85rem;
}

.tv__extra-card h4 {
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.35rem;
}

.tv__extra-price {
  font-size: 1rem;
  font-weight: 800;
  color: var(--primary);
}

.tv__cta-row {
  text-align: center;
}

/* ========== Telefonia VoIP ========== */
.telefonia {
  background: white;
}

.telefonia__header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 2.5rem;
}

.telefonia__highlights {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2.5rem;
}

.telefonia__highlight {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 1.25rem;
  background: var(--bg-soft);
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--secondary);
  border: 1px solid rgba(3, 5, 65, 0.06);
}

.telefonia__highlight svg {
  width: 18px;
  height: 18px;
  color: var(--primary);
  flex-shrink: 0;
}

.voip__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  padding-top: 1.25rem;
}

.voip-card {
  background: white;
  border-radius: var(--radius-lg);
  padding: 2rem 1.5rem;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  position: relative;
  border: 2px solid transparent;
  display: flex;
  flex-direction: column;
}

.voip-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
  border-color: rgba(227, 46, 106, 0.15);
}

.voip-card--featured {
  border-color: var(--primary);
  box-shadow: var(--shadow-lg);
  overflow: visible;
  z-index: 1;
}

.voip-card--featured:hover {
  transform: translateY(-8px);
}

.voip-card__badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--gradient-card);
  color: white;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.35rem 1rem;
  border-radius: 50px;
  white-space: nowrap;
  z-index: 2;
  box-shadow: 0 4px 14px rgba(227, 46, 106, 0.35);
}

.voip-card__tier {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--primary);
  margin-bottom: 0.5rem;
}

.voip-card__title {
  font-size: 1.5rem;
  font-weight: 900;
  color: var(--secondary);
  line-height: 1.2;
  margin-bottom: 0.75rem;
}

.voip-card__desc {
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.5;
  margin-bottom: 1.25rem;
  min-height: 3.8rem;
}

.voip-card__features {
  flex: 1;
  margin-bottom: 1.5rem;
}

.voip-card__features li {
  padding: 0.5rem 0;
  font-size: 0.85rem;
  color: var(--text-muted);
  border-bottom: 1px solid var(--bg-soft);
  position: relative;
  padding-left: 1.25rem;
}

.voip-card__features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--primary);
  font-weight: 700;
}

.voip-card__price {
  margin-bottom: 1.25rem;
}

.voip-card__amount {
  font-size: 2rem;
  font-weight: 900;
  color: var(--primary);
}

.voip-card__amount small {
  font-size: 1.25rem;
}

.voip-card__period {
  font-size: 0.9rem;
  color: var(--text-muted);
}

.telefonia__note {
  text-align: center;
  margin-top: 2rem;
  font-size: 0.9rem;
  color: var(--text-muted);
}

.telefonia__note strong {
  color: var(--secondary);
}

/* ========== Features ========== */
.features {
  background: var(--bg-soft);
  position: relative;
  overflow: hidden;
}

.features::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 10% 20%, rgba(227, 46, 106, 0.06), transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(3, 5, 65, 0.05), transparent 35%);
  pointer-events: none;
}

.features .container {
  position: relative;
  z-index: 1;
}

.features__header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 3rem;
}

.features__subtitle {
  margin-top: 1rem;
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.7;
}

.features__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.feature-card {
  position: relative;
  background: white;
  padding: 2rem 1.5rem 1.75rem;
  border-radius: var(--radius);
  text-align: center;
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(3, 5, 65, 0.06);
  transition: var(--transition);
  overflow: hidden;
}

.feature-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s ease;
}

.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
  border-color: rgba(227, 46, 106, 0.15);
}

.feature-card:hover::before {
  transform: scaleX(1);
}

.feature-card--highlight {
  border-color: rgba(227, 46, 106, 0.2);
  box-shadow: 0 12px 40px rgba(227, 46, 106, 0.12);
}

.feature-card--highlight::before {
  transform: scaleX(1);
}

.feature-card__tag {
  display: inline-block;
  margin-bottom: 1.25rem;
  padding: 0.3rem 0.75rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--primary);
  background: rgba(227, 46, 106, 0.08);
  border-radius: 999px;
}

.feature-card__icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 1.25rem;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  box-shadow: 0 8px 24px rgba(227, 46, 106, 0.25);
}

.feature-card__icon svg {
  width: 28px;
  height: 28px;
}

.feature-card h3 {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.75rem;
}

.feature-card p {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ========== Differentials ========== */
.differentials {
  background: var(--bg-soft);
  position: relative;
  overflow: hidden;
}

.differentials::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 85% 15%, rgba(227, 46, 106, 0.05), transparent 40%),
    radial-gradient(circle at 10% 85%, rgba(3, 5, 65, 0.04), transparent 35%);
  pointer-events: none;
}

.differentials .container {
  position: relative;
  z-index: 1;
}

.differentials__header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 3rem;
}

.differentials__subtitle {
  margin-top: 1rem;
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.7;
}

.differentials__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}

.differentials__grid--six {
  grid-template-columns: repeat(3, 1fr);
}

.diff-card--compact {
  padding: 1.75rem 1.5rem;
}

.diff-card--compact .diff-card__desc {
  margin-bottom: 0;
}

.diff-card {
  display: flex;
  flex-direction: column;
  background: white;
  padding: 2rem 1.75rem;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(3, 5, 65, 0.06);
  transition: var(--transition);
  overflow: hidden;
  position: relative;
  min-height: 100%;
}

.diff-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s ease;
}

.diff-card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-8px);
  border-color: rgba(227, 46, 106, 0.15);
}

.diff-card:hover::before {
  transform: scaleX(1);
}

.diff-card--highlight {
  border-color: rgba(227, 46, 106, 0.2);
  box-shadow: 0 12px 40px rgba(227, 46, 106, 0.1);
}

.diff-card--highlight::before {
  transform: scaleX(1);
}

.diff-card__tag {
  display: inline-block;
  align-self: flex-start;
  margin-bottom: 1.25rem;
  padding: 0.3rem 0.75rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--primary);
  background: rgba(227, 46, 106, 0.08);
  border-radius: 999px;
}

.diff-card__icon {
  width: 56px;
  height: 56px;
  margin-bottom: 1.25rem;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  box-shadow: 0 8px 24px rgba(227, 46, 106, 0.22);
}

.diff-card__icon svg {
  width: 26px;
  height: 26px;
}

.diff-card h3 {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.6rem;
}

.diff-card__desc {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.55;
  margin-bottom: 1.25rem;
}

.diff-card__list {
  margin-top: auto;
}

.diff-card__list li {
  padding: 0.55rem 0 0.55rem 1.5rem;
  font-size: 0.88rem;
  color: var(--secondary-light);
  position: relative;
  border-bottom: 1px solid var(--bg-soft);
}

.diff-card__list li:last-child {
  border-bottom: none;
}

.diff-card__list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 0.55rem;
  color: var(--primary);
  font-weight: 800;
  font-size: 0.8rem;
}

/* ========== Gamer ========== */
.gamer {
  background: var(--gradient-hero);
  color: white;
  position: relative;
  overflow: hidden;
}

.gamer::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}

.gamer__glow {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 15% 50%, rgba(255, 255, 255, 0.08), transparent 50%),
    radial-gradient(ellipse at 85% 30%, rgba(227, 46, 106, 0.35), transparent 45%);
  pointer-events: none;
}

.gamer__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 3.5rem;
  align-items: center;
}

.gamer__content p {
  color: rgba(255, 255, 255, 0.88);
  margin-bottom: 1.5rem;
  font-size: 1.05rem;
  line-height: 1.75;
  max-width: 34rem;
}

.gamer__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
}

.gamer__tag {
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #e8838a;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.gamer__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.25);
}

.gamer__cta svg {
  width: 18px;
  height: 18px;
}

.gamer__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}

.gamer__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.16);
  padding: 1.5rem 1rem 1.35rem;
  border-radius: var(--radius-lg);
  text-align: center;
  transition: var(--transition);
}

.gamer__stat:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 255, 255, 0.35);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22);
}

.gamer__stat--highlight {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 142, 200, 0.45);
  box-shadow: 0 0 40px rgba(227, 46, 106, 0.25);
}

.gamer__stat--highlight .gamer__stat-icon {
  background: var(--primary);
  color: white;
  box-shadow: 0 0 20px rgba(227, 46, 106, 0.5);
}

.gamer__stat-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.12);
  color: #e8838a;
  margin-bottom: 0.25rem;
}

.gamer__stat-icon svg {
  width: 22px;
  height: 22px;
}

.gamer__stat-value {
  display: block;
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 900;
  line-height: 1.1;
}

.gamer__stat-label {
  font-size: 0.7rem;
  font-weight: 700;
  opacity: 0.75;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* ========== Testimonials ========== */
.testimonials__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.testimonials__rating {
  margin-top: 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--primary);
}

.testimonials__carousel {
  position: relative;
}

.testimonials__viewport {
  overflow: hidden;
}

.testimonials__track {
  display: flex;
  gap: 1.5rem;
  will-change: transform;
}

.testimonials__track .testimonial-card {
  flex: 0 0 calc((100% - 3rem) / 3);
  min-width: 0;
}

.testimonials__dots {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1.75rem;
}

.testimonials__dot {
  width: 10px;
  height: 10px;
  border: none;
  border-radius: 50%;
  background: var(--bg-soft);
  cursor: pointer;
  padding: 0;
  transition: var(--transition);
}

.testimonials__dot--active,
.testimonials__dot:hover {
  background: var(--primary);
  transform: scale(1.15);
}

.testimonials__footer {
  text-align: center;
  margin-top: 1.5rem;
}

.testimonials__footer a {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--primary);
}

.testimonials__footer a:hover {
  text-decoration: underline;
}

.testimonial-card {
  background: white;
  padding: 2rem 1.5rem;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  border-left: 4px solid var(--primary);
  transition: var(--transition);
}

.testimonial-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
}

.testimonial-card__stars {
  color: #fbbf24;
  font-size: 1rem;
  margin-bottom: 1rem;
  letter-spacing: 2px;
}

.testimonial-card p {
  font-size: 0.9rem;
  color: var(--text-muted);
  font-style: italic;
  margin-bottom: 1.25rem;
  line-height: 1.6;
}

.testimonial-card footer strong {
  font-size: 0.9rem;
  color: var(--secondary);
}

/* ========== Portal ========== */
.portal {
  background: var(--secondary);
  color: white;
}

.portal__inner {
  display: grid;
  grid-template-columns: 1.5fr 0.5fr;
  gap: 3rem;
  align-items: center;
}

.portal__content p {
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 1rem;
}

.portal__content h3 {
  font-size: 1.25rem;
  margin: 1.5rem 0 0.75rem;
  color: var(--primary-light);
}

.portal__apps {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.app-badge {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 1rem 1.5rem;
  border-radius: var(--radius);
  font-weight: 700;
  transition: var(--transition);
}

.app-badge:hover {
  background: var(--primary);
  transform: translateX(8px);
}

.app-badge svg {
  width: 28px;
  height: 28px;
}

/* ========== Contact ========== */
.contact__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
}

.contact__info p {
  color: var(--text-muted);
  margin-bottom: 2rem;
}

.contact__cards {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.contact__card {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.25rem;
  background: var(--bg-soft);
  border-radius: var(--radius);
  transition: var(--transition);
}

.contact__card:hover {
  background: white;
  box-shadow: var(--shadow-md);
}

.contact__card svg {
  width: 24px;
  height: 24px;
  color: var(--primary);
  flex-shrink: 0;
  margin-top: 2px;
}

.contact__card strong {
  display: block;
  font-size: 0.9rem;
  color: var(--secondary);
  margin-bottom: 0.25rem;
}

.contact__card span,
.contact__card a {
  font-size: 0.85rem;
  color: var(--text-muted);
}

.contact__card a:hover {
  color: var(--primary);
}

.contact__form {
  background: white;
  padding: 2.5rem;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--bg-soft);
}

.contact__form h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--secondary);
  margin-bottom: 1.5rem;
}

.contact-form-alert {
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  border-radius: var(--radius-sm);
  font-size: 0.9rem;
  font-weight: 600;
}

.contact-form-alert--success {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}

.contact-form-alert--error {
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}

.form-group--honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.form-group {
  margin-bottom: 1.25rem;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.form-group label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--secondary);
  margin-bottom: 0.4rem;
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 2px solid var(--bg-soft);
  border-radius: var(--radius-sm);
  font-family: var(--font);
  font-size: 0.9rem;
  transition: var(--transition);
  background: var(--bg-soft);
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--primary);
  background: white;
  box-shadow: 0 0 0 4px rgba(227, 46, 106, 0.1);
}

.form-group textarea {
  resize: vertical;
  min-height: 100px;
}

/* ========== Footer ========== */
.footer {
  background: var(--secondary);
  color: rgba(255, 255, 255, 0.8);
}

.footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) repeat(4, minmax(0, 1fr));
  gap: 2rem 2.5rem;
  padding: 4rem 0 3rem;
  align-items: start;
}

.footer__inner--4col {
  grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
}

.footer__brand p {
  font-size: 0.9rem;
  margin: 1rem 0 1.5rem;
  line-height: 1.6;
}

.social-links--footer .social-links__item {
  background: rgba(255, 255, 255, 0.1);
}

.footer__links h4 {
  color: white;
  font-size: 0.95rem;
  font-weight: 700;
  margin-bottom: 1.25rem;
}

.footer__links li {
  margin-bottom: 0.55rem;
  font-size: 0.85rem;
  line-height: 1.45;
}

.footer__links--nav ul {
  columns: 2;
  column-gap: 1.25rem;
}

.footer__links--nav li {
  break-inside: avoid;
}

.footer__tel {
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.95);
  font-weight: 600;
}

.footer__tel:hover {
  color: var(--primary-light);
}

.footer__meta {
  color: rgba(255, 255, 255, 0.78);
}

.footer__meta strong {
  display: block;
  color: white;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.25rem;
}

.footer__links a {
  font-size: 0.85rem;
  transition: var(--transition);
}

.footer__links a:hover {
  color: var(--primary-light);
}

.footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 1.5rem 0;
  text-align: center;
  font-size: 0.8rem;
}

/* ========== WhatsApp Float ========== */
.whatsapp-float {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  width: 60px;
  height: 60px;
  background: #25d366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  box-shadow: 0 4px 20px rgba(37, 211, 102, 0.5);
  z-index: 999;
  transition: var(--transition);
  animation: pulse-wa 2s infinite;
}

.whatsapp-float:hover {
  transform: scale(1.1);
}

.whatsapp-float svg {
  width: 32px;
  height: 32px;
}

@keyframes pulse-wa {
  0%, 100% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.5); }
  50% { box-shadow: 0 4px 30px rgba(37, 211, 102, 0.8); }
}

/* ========== Reveal Animation ========== */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ========== Responsive ========== */
@media (max-width: 1200px) {
  .footer__inner,
  .footer__inner--4col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
  }

  .footer__brand {
    grid-column: 1 / -1;
  }

  .footer__links--nav ul {
    columns: 2;
  }
}

@media (max-width: 1400px) {
  .plans__grid--corp {
    grid-template-columns: repeat(2, 1fr);
  }

  .voip__grid--5 {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 1100px) {
  body {
    padding-bottom: calc(4.85rem + env(safe-area-inset-bottom, 0px));
  }

  body.has-cookie-banner {
    padding-bottom: calc(4.85rem + env(safe-area-inset-bottom, 0px));
  }

  .header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .header__utilities {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    display: flex;
    align-items: stretch;
    gap: 0.25rem;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0.35rem 0.5rem calc(0.35rem + env(safe-area-inset-bottom, 0px));
    background: rgba(255, 255, 255, 0.97);
    border-top: 1px solid rgba(227, 46, 106, 0.15);
    box-shadow: 0 -6px 24px rgba(10, 10, 10, 0.1);
    backdrop-filter: blur(8px);
  }

  body.has-cookie-banner .header__utilities {
    bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px));
  }

  .header__utilities::-webkit-scrollbar {
    display: none;
  }

  .utility-card {
    flex: 1 0 4.25rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    padding: 0.35rem 0.25rem;
    min-width: 4.25rem;
    max-width: none;
    text-align: center;
    border-radius: var(--radius-sm);
    background: transparent;
  }

  .utility-card:hover {
    background: var(--bg-soft);
  }

  .utility-card span {
    display: none;
  }

  .utility-card strong {
    font-size: 0.55rem;
    line-height: 1.2;
    white-space: normal;
    word-break: break-word;
  }

  .utility-card__icon {
    width: 30px;
    height: 30px;
  }

  .utility-card__icon svg {
    width: 15px;
    height: 15px;
  }

  .utility-card--portal {
    position: static;
    transform: none;
    margin-left: 0;
    padding: 0.35rem 0.25rem;
    border-radius: var(--radius-sm);
    border-width: 1px;
    box-shadow: none;
    flex: 1 0 4.25rem;
    max-width: none;
    justify-content: center;
  }

  .utility-card--portal::before {
    display: none;
  }

  .utility-card__chevron {
    display: none;
  }

  .utility-card--portal .utility-card__text {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .utility-card--active {
    background: rgba(227, 46, 106, 0.06);
  }

  .whatsapp-float {
    display: none;
  }

  .plans__grid,
  .services__grid,
  .features__grid,
  .voip__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .plans__grid--corp {
    grid-template-columns: repeat(2, 1fr);
  }

  .voip__grid--5 {
    grid-template-columns: repeat(2, 1fr);
  }

  .testimonials__track .testimonial-card {
    flex: 0 0 calc((100% - 1.5rem) / 2);
  }

  .plan-card--featured {
    transform: none;
  }

  .differentials__grid--six {
    grid-template-columns: repeat(2, 1fr);
  }

  .hero__content {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .hero__desc {
    margin-inline: auto;
  }

  .hero__actions {
    justify-content: center;
  }

  .hero__visual {
    display: none;
  }

  .about__inner,
  .tv-teaser__inner,
  .tv__inner,
  .gamer__inner,
  .contact__inner,
  .portal__inner {
    grid-template-columns: 1fr;
  }

  .footer__inner {
    grid-template-columns: repeat(2, 1fr);
  }

  .differentials__grid,
  .differentials__grid--six {
    grid-template-columns: 1fr;
  }

  .gamer__stats {
    max-width: 520px;
    margin-inline: auto;
  }
}

@media (max-width: 768px) {
  .top-bar__right span:first-child {
    display: none;
  }

  .top-bar__switch {
    font-size: 0.65rem;
    padding: 0.3rem 0.65rem;
  }

  .menu-toggle {
    display: flex;
  }

  .nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    box-shadow: var(--shadow-md);
  }

  .nav.open {
    display: block;
  }

  .nav__inner {
    flex-direction: column;
    padding: 1rem;
  }

  .nav__link {
    width: 100%;
    justify-content: center;
  }

  .nav__btn {
    margin-left: 0;
    width: 100%;
    text-align: center;
  }

  .plans__grid,
  .services__grid,
  .features__grid,
  .voip__grid {
    grid-template-columns: 1fr;
  }

  .voip__grid--5 {
    grid-template-columns: 1fr;
  }

  .telefonia__highlights {
    flex-direction: column;
    align-items: stretch;
  }

  .telefonia__highlight {
    justify-content: center;
  }

  .tv__plan-images {
    grid-template-columns: 1fr;
  }

  .tv__extras-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .tv-teaser__price-value {
    font-size: 2.25rem;
  }

  .tv__price-amount {
    font-size: 2.5rem;
  }

  .gamer__content .section__title--left {
    text-align: center;
  }

  .gamer__content p {
    text-align: center;
    margin-inline: auto;
  }

  .gamer__tags {
    justify-content: center;
  }

  .gamer__cta {
    margin-inline: auto;
  }

  .gamer__stats {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.65rem;
    max-width: none;
  }

  .gamer__stat {
    padding: 1.15rem 0.5rem;
  }

  .gamer__stat-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
  }

  .gamer__stat-icon svg {
    width: 18px;
    height: 18px;
  }

  .testimonials__track .testimonial-card {
    flex: 0 0 100%;
  }

  .form-row {
    grid-template-columns: 1fr;
  }

  .footer__inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .social-links--footer {
    justify-content: center;
  }

  .section {
    padding: 3rem 0;
  }
}

@media (max-width: 480px) {
  .gamer__stats {
    grid-template-columns: 1fr;
    max-width: 220px;
    margin-inline: auto;
  }
}

/* ========== Modal Ligue Agora ========== */
.ligue-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.ligue-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.ligue-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 5, 65, 0.65);
  backdrop-filter: blur(6px);
}

.ligue-modal__dialog {
  position: relative;
  width: min(100%, 420px);
  background: white;
  border-radius: var(--radius-lg);
  box-shadow: 0 25px 80px rgba(3, 5, 65, 0.35);
  overflow: hidden;
  transform: translateY(20px) scale(0.97);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ligue-modal.is-open .ligue-modal__dialog {
  transform: translateY(0) scale(1);
}

.ligue-modal__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
  width: 36px;
  height: 36px;
  border: none;
  background: var(--bg-soft);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  transition: var(--transition);
}

.ligue-modal__close:hover {
  background: var(--primary);
  color: white;
}

.ligue-modal__close svg {
  width: 18px;
  height: 18px;
}

.ligue-modal__header {
  padding: 1.75rem 1.5rem 1rem;
  text-align: center;
}

.ligue-modal__header h2 {
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.35rem;
}

.ligue-modal__header p {
  font-size: 0.88rem;
  color: var(--text-muted);
  margin: 0;
}

.ligue-modal__contacts {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0 1.25rem 1.5rem;
}

.ligue-modal__contact {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 1.25rem;
  background: var(--bg-soft);
  border: 1px solid rgba(227, 46, 106, 0.12);
  border-radius: var(--radius);
  text-decoration: none;
  color: inherit;
  transition: var(--transition);
}

.ligue-modal__contact:hover {
  background: white;
  border-color: var(--primary);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.ligue-modal__icon {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, rgba(227, 46, 106, 0.12), rgba(227, 46, 106, 0.05));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  flex-shrink: 0;
}

.ligue-modal__icon svg {
  width: 20px;
  height: 20px;
}

.ligue-modal__contact strong {
  display: block;
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.15rem;
}

.ligue-modal__contact span {
  font-size: 0.8rem;
  color: var(--text-muted);
}

/* ========== Modal Teste de Velocidade ========== */
.speedtest-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.speedtest-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.speedtest-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 5, 65, 0.65);
  backdrop-filter: blur(6px);
}

.speedtest-modal__dialog {
  position: relative;
  width: min(100%, 920px);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  background: white;
  border-radius: var(--radius-lg);
  box-shadow: 0 25px 80px rgba(3, 5, 65, 0.35);
  overflow: hidden;
  transform: translateY(20px) scale(0.97);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.speedtest-modal.is-open .speedtest-modal__dialog {
  transform: translateY(0) scale(1);
}

.speedtest-modal__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
  width: 36px;
  height: 36px;
  border: none;
  background: rgba(255, 255, 255, 0.95);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}

.speedtest-modal__close:hover {
  background: var(--primary);
  color: white;
}

.speedtest-modal__close svg {
  width: 18px;
  height: 18px;
}

.speedtest-modal__header {
  padding: 1.25rem 1.5rem 0.75rem;
  text-align: center;
  flex-shrink: 0;
}

.speedtest-modal__header h2 {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.25rem;
}

.speedtest-modal__header p {
  font-size: 0.85rem;
  color: var(--text-muted);
}

.speedtest-modal__embed {
  flex: 1;
  min-height: 650px;
  background: var(--bg-soft);
}

.speedtest-modal__embed iframe {
  width: 100%;
  height: 650px;
  border: none;
  display: block;
}

@media (max-width: 768px) {
  .speedtest-modal__embed,
  .speedtest-modal__embed iframe {
    min-height: 520px;
    height: 520px;
  }
}

/* ========== Modal Meu Evox — Central do Assinante ========== */
.meu-evox-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.meu-evox-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.meu-evox-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 5, 65, 0.65);
  backdrop-filter: blur(6px);
}

.meu-evox-modal__dialog {
  position: relative;
  width: min(100%, 420px);
  max-height: 90vh;
  overflow-y: auto;
  background: white;
  border-radius: var(--radius-lg);
  box-shadow: 0 25px 80px rgba(3, 5, 65, 0.35);
  padding: 2rem 2rem 1.5rem;
  transform: translateY(20px) scale(0.97);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.meu-evox-modal.is-open .meu-evox-modal__dialog {
  transform: translateY(0) scale(1);
}

.meu-evox-modal__dialog--iframe {
  width: min(100%, 480px);
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.meu-evox-modal__toolbar {
  display: flex;
  justify-content: flex-end;
  padding: 0.5rem 0.5rem 0;
}

.meu-evox-modal__dialog--iframe .meu-evox-modal__close {
  position: static;
}

.meu-evox-modal__frame-wrap {
  position: relative;
  width: 100%;
  height: min(78vh, 640px);
  background: #0b1028;
}

.meu-evox-modal__frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #0b1028;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.meu-evox-modal__frame.is-loaded {
  opacity: 1;
}

.meu-evox-modal__loading,
.meu-evox-modal__error {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 1.5rem;
  text-align: center;
  background: #f4f6fb;
  z-index: 1;
}

.meu-evox-modal__loading p,
.meu-evox-modal__error p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--text-muted);
}

.meu-evox-modal__spinner {
  width: 32px;
  height: 32px;
  border: 3px solid rgba(3, 5, 65, 0.12);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: meu-evox-spin 0.8s linear infinite;
}

@keyframes meu-evox-spin {
  to { transform: rotate(360deg); }
}

.meu-evox-modal__error-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
}

.meu-evox-modal__hint {
  margin: 0;
  padding: 0.65rem 1rem 1rem;
  font-size: 0.75rem;
  line-height: 1.45;
  color: var(--text-muted);
  text-align: center;
}

.meu-evox-modal__hint a {
  color: var(--primary);
  text-decoration: none;
}

.meu-evox-modal__hint a:hover {
  text-decoration: underline;
}

.meu-evox-modal__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 36px;
  height: 36px;
  border: none;
  background: var(--bg-soft);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  transition: var(--transition);
}

.meu-evox-modal__close:hover {
  background: var(--primary);
  color: white;
}

.meu-evox-modal__close svg {
  width: 18px;
  height: 18px;
}

.meu-evox-modal__header {
  text-align: center;
  margin-bottom: 1.75rem;
  padding-right: 2rem;
}

.meu-evox-modal__logo {
  height: 40px;
  width: auto;
  margin: 0 auto 1rem;
  object-fit: contain;
  image-rendering: auto;
}

.meu-evox-modal__header h2 {
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.35rem;
}

.meu-evox-modal__header p {
  font-size: 0.85rem;
  color: var(--text-muted);
}

.meu-evox-panel__desc {
  font-size: 0.9rem;
  color: var(--text-muted);
  margin-bottom: 1.25rem;
  line-height: 1.5;
}

.meu-evox-field {
  margin-bottom: 1.1rem;
}

.meu-evox-field label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--secondary);
  margin-bottom: 0.4rem;
}

.meu-evox-field input {
  width: 100%;
  padding: 0.8rem 1rem;
  border: 2px solid var(--bg-soft);
  border-radius: var(--radius-sm);
  font-family: var(--font);
  font-size: 0.9rem;
  background: var(--bg-soft);
  transition: var(--transition);
}

.meu-evox-field input:focus {
  outline: none;
  border-color: var(--primary);
  background: white;
  box-shadow: 0 0 0 4px rgba(227, 46, 106, 0.1);
}

.meu-evox-password {
  position: relative;
}

.meu-evox-password input {
  padding-right: 2.75rem;
}

.meu-evox-password__toggle {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-muted);
  padding: 0.25rem;
  display: flex;
}

.meu-evox-password__toggle:hover {
  color: var(--primary);
}

.meu-evox-password__toggle svg {
  width: 18px;
  height: 18px;
}

.meu-evox-checkbox {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  color: var(--text-muted);
  margin-bottom: 1.25rem;
  cursor: pointer;
}

.meu-evox-checkbox input {
  width: 16px;
  height: 16px;
  accent-color: var(--primary);
}

.meu-evox-submit {
  margin-bottom: 0.75rem;
  position: relative;
  min-height: 48px;
}

.meu-evox-submit__loader {
  width: 22px;
  height: 22px;
  border: 3px solid rgba(255, 255, 255, 0.3);
  border-top-color: white;
  border-radius: 50%;
  animation: meu-evox-spin 0.7s linear infinite;
  margin: 0 auto;
}

@keyframes meu-evox-spin {
  to { transform: rotate(360deg); }
}

.meu-evox-alert {
  padding: 0.75rem 1rem;
  border-radius: var(--radius-sm);
  font-size: 0.85rem;
  margin-bottom: 1rem;
  line-height: 1.4;
}

.meu-evox-alert--error {
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}

.meu-evox-alert--success {
  background: #f0fdf4;
  color: #15803d;
  border: 1px solid #bbf7d0;
}

.meu-evox-alert--info {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
}

.meu-evox-forgot {
  display: flex;
  justify-content: flex-end;
  margin: -0.35rem 0 0.85rem;
}

.meu-evox-legal {
  margin: 0.85rem 0 0;
  font-size: 0.75rem;
  line-height: 1.45;
  color: var(--text-muted);
  text-align: center;
}

.meu-evox-legal a {
  color: var(--primary);
  text-decoration: none;
}

.meu-evox-legal a:hover {
  text-decoration: underline;
}

.meu-evox-link {
  display: block;
  width: 100%;
  background: none;
  border: none;
  font-family: var(--font);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--primary);
  cursor: pointer;
  text-align: center;
  padding: 0.5rem;
  transition: var(--transition);
}

.meu-evox-link:hover {
  color: var(--primary-dark);
  text-decoration: underline;
}

.meu-evox-auth-frame {
  position: absolute;
  width: 0;
  height: 0;
  border: none;
  visibility: hidden;
  pointer-events: none;
}

/* ========== Hero Promo (consumer) ========== */
.hero--promo {
  position: relative;
  min-height: 88vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--gradient-hero);
}

.hero-promo__bg {
  position: absolute;
  inset: 0;
}

.hero-promo__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.22;
}

.hero-promo__shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(160deg, rgba(10, 10, 10, 0.92) 0%, rgba(20, 12, 18, 0.88) 100%),
    radial-gradient(ellipse at 65% 30%, rgba(199, 32, 123, 0.18) 0%, transparent 45%),
    radial-gradient(ellipse at 85% 60%, rgba(255, 61, 96, 0.12) 0%, transparent 40%),
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  background-size: auto, auto, auto, 48px 48px, 48px 48px;
}

.hero-promo__blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.28;
  animation: blobDrift 16s ease-in-out infinite;
}

.hero-promo__blob--1 {
  width: 260px;
  height: 260px;
  background: var(--logo-magenta);
  top: 10%;
  right: 10%;
}

.hero-promo__blob--2 {
  width: 180px;
  height: 180px;
  background: var(--logo-cherry);
  bottom: 20%;
  left: 10%;
  animation-delay: -6s;
}

.hero-promo__blob--3 {
  display: none;
}

@keyframes blobDrift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(18px, -22px) scale(1.1); }
}

.hero-promo {
  position: relative;
  z-index: 2;
  padding: 3rem 0 2.5rem;
}

.hero-promo__layout {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 2rem;
  align-items: center;
}

.hero-promo__copy {
  display: none;
  color: white;
}

.hero-promo__copy.is-active {
  display: block;
  animation: promoIn 0.5s ease;
}

@keyframes promoIn {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

.hero-promo__tag {
  display: inline-block;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.35);
  padding: 0.4rem 1rem;
  border-radius: 50px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}

.hero-promo__tag--gold {
  background: rgba(252, 211, 77, 0.25);
  border-color: rgba(252, 211, 77, 0.5);
  color: #fef3c7;
}

.hero-promo__tag--hot {
  background: var(--primary);
  color: white;
  border-color: var(--primary-light);
}

.hero-promo__title {
  font-size: clamp(2.2rem, 4.5vw, 3.5rem);
  font-weight: 900;
  line-height: 1.08;
  margin-bottom: 1.1rem;
  letter-spacing: -0.02em;
}

.hero-promo__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter: drop-shadow(0 0 24px rgba(255, 61, 96, 0.25));
}

.hero-promo__lead {
  font-size: 1.08rem;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.92);
  max-width: 34ch;
  margin-bottom: 1.75rem;
}

.hero-promo__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.hero-promo__flyers {
  position: relative;
  min-height: 420px;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 900px;
}

.plan-flash {
  display: none;
  width: min(100%, 360px);
}

.plan-flash.is-active {
  display: block;
  animation: flashPop 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes flashPop {
  from { opacity: 0; transform: scale(0.92) translateY(12px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

.plan-flash__tilt {
  transform-style: preserve-3d;
  transition: transform 0.15s ease-out;
  will-change: transform;
}

.plan-flash__panel {
  position: relative;
  padding: 1.35rem 1.25rem 1.25rem;
  border-radius: 24px;
  background: rgba(3, 5, 65, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.plan-flash__eyebrow {
  margin: 0 0 1rem;
  text-align: center;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.35;
}

.plan-flash__eyebrow span {
  display: block;
  margin-top: 0.3rem;
  font-size: clamp(1rem, 3vw, 1.25rem);
  letter-spacing: 0.1em;
  background: linear-gradient(135deg, #ffb3c6, var(--primary-light));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.plan-flash__capsule {
  display: flex;
  align-items: stretch;
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 0.85rem;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.28);
}

.plan-flash__capsule-left {
  flex: 1.15;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.15rem;
  padding: 1rem 1.15rem;
  background: #fff;
  min-width: 0;
}

.plan-flash__capsule-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.85rem 0.75rem;
  background: linear-gradient(160deg, var(--secondary) 0%, #050840 100%);
  color: #fff;
  text-align: center;
  position: relative;
}

.plan-flash__capsule-right::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 1px;
  background: rgba(255, 255, 255, 0.14);
}

.plan-flash__capsule-label {
  font-size: 0.55rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--text-muted);
}

.plan-flash__capsule-speed {
  font-size: clamp(1.65rem, 5vw, 2rem);
  font-weight: 900;
  line-height: 1;
  color: var(--secondary);
  letter-spacing: -0.03em;
}

.plan-flash__capsule-speed small {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  margin-left: 0.15rem;
}

.plan-flash__capsule-speed--off {
  background: linear-gradient(135deg, var(--primary-light), var(--primary-dark));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.plan-flash__capsule-speed--off small {
  display: block;
  margin-top: 0.1rem;
  margin-left: 0;
  font-size: 0.72rem;
  letter-spacing: 0.28em;
  -webkit-text-fill-color: var(--text-muted);
  color: var(--text-muted);
}

.plan-flash__capsule-bw {
  font-size: 0.62rem;
  font-weight: 700;
  color: var(--primary);
}

.plan-flash--coupon .plan-flash__capsule-left {
  background: linear-gradient(180deg, #fff 0%, #fffbeb 100%);
}

.plan-flash--coupon .plan-flash__capsule-right {
  background: linear-gradient(160deg, #d97706 0%, #92400e 100%);
}

.plan-flash--hot .plan-flash__capsule-right {
  background: linear-gradient(160deg, var(--primary) 0%, var(--primary-dark) 100%);
}

.plan-flash--tv .plan-flash__capsule-right {
  background: linear-gradient(160deg, #6366f1 0%, #4338ca 100%);
}

.plan-flash__capsule-from {
  font-size: 0.52rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  opacity: 0.72;
  margin-bottom: 0.15rem;
}

.plan-flash__bonus {
  margin: 0 0 0.85rem;
  text-align: center;
  font-size: 0.72rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.82);
}

.plan-flash__bonus strong {
  color: #ffb3c6;
  font-weight: 800;
}

.plan-flash__coupon-code {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 0.85rem;
  padding: 0.4rem 0.75rem;
  border: 1.5px dashed rgba(255, 179, 198, 0.55);
  border-radius: 10px;
  font-family: "Courier New", Courier, monospace;
  font-size: 0.85rem;
  font-weight: 900;
  letter-spacing: 0.2em;
  color: #fff;
  background: rgba(255, 255, 255, 0.06);
}

.plan-flash__stamp {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  padding: 0.3rem 0.55rem;
  border-radius: 999px;
  background: var(--primary);
  color: white;
  font-size: 0.55rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  box-shadow: 0 4px 14px rgba(227, 46, 106, 0.45);
}

.plan-flash__switch {
  display: block;
  cursor: pointer;
  margin-bottom: 0.75rem;
}

.plan-flash__switch-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.plan-flash__switch-ui {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  padding: 0.35rem 0.55rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  position: relative;
  min-height: 38px;
}

.plan-flash__switch-opt {
  font-size: 0.58rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, 0.55);
  z-index: 2;
  transition: color 0.25s ease;
  flex: 1;
  text-align: center;
}

.plan-flash__switch-knob {
  position: absolute;
  top: 4px;
  left: 4px;
  width: calc(50% - 6px);
  height: calc(100% - 8px);
  border-radius: 999px;
  background: var(--gradient-brand);
  box-shadow: 0 4px 12px rgba(227, 46, 106, 0.35);
  transition: left 0.35s cubic-bezier(0.34, 1.4, 0.64, 1);
  z-index: 1;
}

.plan-flash__switch-input:checked ~ .plan-flash__switch-ui .plan-flash__switch-knob {
  left: calc(50% + 2px);
}

.plan-flash__switch-input:checked ~ .plan-flash__switch-ui .plan-flash__switch-opt:last-child {
  color: white;
}

.plan-flash__switch-input:not(:checked) ~ .plan-flash__switch-ui .plan-flash__switch-opt:first-child {
  color: white;
}

.plan-flash__prices {
  position: relative;
  width: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.plan-flash__price-face {
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
}

.plan-flash__price-face.is-active {
  display: flex;
  animation: priceFlip 0.35s ease;
}

@keyframes priceFlip {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.plan-flash__price-main {
  font-size: clamp(1.85rem, 5vw, 2.25rem);
  font-weight: 900;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.03em;
}

.plan-flash__price-main::before {
  content: "R$ ";
  font-size: 0.45em;
  font-weight: 800;
  letter-spacing: 0;
  vertical-align: baseline;
}

.plan-flash__price-main small {
  font-size: 0.95rem;
}

.plan-flash__price-currency {
  font-size: 0.58rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.75;
}

.plan-flash__perks {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.35rem;
  margin-bottom: 0.85rem;
}

.plan-flash__perks span {
  flex-shrink: 0;
  font-size: 0.58rem;
  font-weight: 700;
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.9);
}

.plan-flash--coupon .plan-flash__perks span {
  background: rgba(251, 191, 36, 0.18);
  border-color: rgba(251, 191, 36, 0.35);
  color: #fde68a;
}

.plan-flash__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.9rem 1.25rem;
  border-radius: 999px;
  background: var(--gradient-brand);
  color: white;
  font-size: 0.92rem;
  font-weight: 800;
  transition: var(--transition);
  box-shadow: 0 8px 24px rgba(227, 46, 106, 0.35);
  text-align: center;
}

.plan-flash__btn--light {
  background: #fff;
  color: var(--secondary);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
}

.plan-flash__btn--light:hover {
  background: #fff;
  color: var(--primary);
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.28);
}

.plan-flash__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(227, 46, 106, 0.45);
}

@media (max-width: 480px) {
  .plan-flash__capsule {
    flex-direction: column;
    border-radius: 20px;
  }

  .plan-flash__capsule-right {
    padding: 0.75rem;
  }

  .plan-flash__capsule-right::before {
    left: 12%;
    right: 12%;
    top: 0;
    bottom: auto;
    width: auto;
    height: 1px;
  }
}

.hero-promo__picker {
  position: relative;
  z-index: 10001;
  display: flex;
  justify-content: center;
  gap: 0.85rem;
  margin-top: 2rem;
  flex-wrap: wrap;
}

.hero-promo__pick {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  width: 76px;
  padding: 0.65rem 0.4rem;
  border: 3px solid rgba(255, 255, 255, 0.25);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(8px);
  cursor: pointer;
  transition: var(--transition);
  font-family: var(--font);
  color: white;
}

.hero-promo__pick:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-3px);
}

.hero-promo__pick.is-active {
  background: white;
  border-color: white;
  color: var(--secondary);
  transform: translateY(-6px) scale(1.05);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
}

.hero-promo__pick-mega {
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1;
}

.hero-promo__pick.is-active .hero-promo__pick-mega {
  color: var(--primary);
}

.hero-promo__pick-name {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  opacity: 0.85;
}

.hero-promo__pick--hot::before {
  content: '★';
  position: absolute;
  top: -6px;
  right: -4px;
  font-size: 0.65rem;
  color: #fcd34d;
}

.hero-promo__pick {
  position: relative;
}


/* ========== Coverage ========== */
.coverage {
  background: var(--bg-alt);
}

.coverage__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.coverage__inner {
  background: white;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 2rem;
}

.coverage__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 2px solid var(--border);
  padding-bottom: 1rem;
}

.coverage__tab {
  padding: 0.6rem 1.25rem;
  border: none;
  border-radius: 50px;
  background: var(--bg-alt);
  color: var(--text-muted);
  font-family: var(--font);
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
}

.coverage__tab.is-active {
  background: var(--gradient);
  color: white;
}

.coverage__panel-intro {
  color: var(--text-muted);
  margin-bottom: 1rem;
}

.coverage__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.5rem 1rem;
  list-style: none;
}

.coverage__list li {
  position: relative;
  padding-left: 1.25rem;
  color: var(--text);
  font-size: 0.95rem;
}

.coverage__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--primary);
}

.coverage__cta {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.coverage__cta p {
  color: var(--text-muted);
  margin: 0;
}

/* ========== Referral ========== */
.referral {
  background: var(--gradient);
  color: white;
}

.referral__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.referral__content {
  flex: 1;
  min-width: 260px;
}

.referral__content p {
  color: rgba(255, 255, 255, 0.9);
  margin-top: 0.75rem;
}

.section__label--light {
  color: rgba(255, 255, 255, 0.85);
}

.section__title--light {
  color: white;
}

/* ========== FAQ ========== */
.faq__header {
  text-align: center;
  margin-bottom: 2rem;
}

.faq__tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
}

.faq__tab {
  padding: 0.65rem 1.5rem;
  border: 2px solid var(--border);
  border-radius: 50px;
  background: white;
  color: var(--text-muted);
  font-family: var(--font);
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
}

.faq__tab.is-active {
  border-color: var(--primary);
  background: var(--primary);
  color: white;
}

.faq__group {
  max-width: 800px;
  margin: 0 auto;
}

.faq__item {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 0.75rem;
  overflow: hidden;
  background: white;
}

.faq__question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.25rem;
  border: none;
  background: none;
  font-family: var(--font);
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  text-align: left;
  cursor: pointer;
  transition: var(--transition);
}

.faq__question::after {
  content: '+';
  font-size: 1.25rem;
  color: var(--primary);
  flex-shrink: 0;
  transition: transform 0.25s ease;
}

.faq__item.is-open .faq__question::after {
  transform: rotate(45deg);
}

.faq__answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}

.faq__item.is-open .faq__answer {
  max-height: 300px;
}

.faq__answer p {
  padding: 0 1.25rem 1.25rem;
  color: var(--text-muted);
  line-height: 1.6;
  margin: 0;
}

/* ========== Portal Features ========== */
.portal__features {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem 1.5rem;
  list-style: none;
  margin: 1.25rem 0 1.75rem;
}

.portal__features li {
  position: relative;
  padding-left: 1.5rem;
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.95rem;
}

.portal__features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--primary-light);
  font-weight: 700;
}

/* ========== Form LGPD ========== */
.form-lgpd {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.5;
  cursor: pointer;
}

.form-lgpd input {
  margin-top: 0.2rem;
  flex-shrink: 0;
  accent-color: var(--primary);
}

.form-lgpd a {
  color: var(--primary);
  text-decoration: underline;
}

/* ========== Cookie Banner ========== */
body.has-cookie-banner .hero-promo__picker {
  transform: translateY(-5.5rem);
}

.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: white;
  border-top: 1px solid var(--border);
  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.1);
  padding: 1rem 0;
  pointer-events: none;
}

.cookie-banner a,
.cookie-banner button {
  pointer-events: auto;
}

.cookie-banner__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.cookie-banner__inner p {
  margin: 0;
  font-size: 0.9rem;
  color: var(--text-muted);
  flex: 1;
  min-width: 240px;
}

.cookie-banner__inner a {
  color: var(--primary);
}

.btn--sm {
  padding: 0.55rem 1.25rem;
  font-size: 0.85rem;
}

@media (max-width: 900px) {
  .hero-promo__layout {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .hero-promo__lead {
    max-width: none;
    margin-inline: auto;
  }

  .hero-promo__ctas {
    justify-content: center;
  }

  .hero-promo__flyers {
    min-height: 360px;
  }

  .plan-flash {
    width: min(100%, 300px);
    margin: 0 auto;
  }

  .plan-flash__num {
    font-size: 3rem;
  }
}

@media (max-width: 768px) {
  .hero-promo__title {
    font-size: 2rem;
  }

  .plan-flash__price-main {
    font-size: 1.55rem;
  }

  .hero-promo__picker {
    gap: 0.5rem;
  }

  .hero-promo__pick {
    width: 68px;
  }

  .portal__features {
    grid-template-columns: 1fr;
  }

  .coverage__cta {
    flex-direction: column;
    align-items: flex-start;
  }

  .referral__inner {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ========== WLAN balance — jornada + cards laterais ========== */
.wlan-features {
  background: var(--bg-dark);
  padding: 4rem 0;
  position: relative;
  overflow: hidden;
}

.wlan-features::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 40% 50%, rgba(227, 46, 106, 0.1) 0%, transparent 55%);
  pointer-events: none;
}

.wlan-features__stack {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  align-self: center;
}

.wlan-features__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  position: relative;
}

.wlan-features__grid .wlan-features__card {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  padding: 2rem 1.75rem 2rem 1.5rem;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: white;
  opacity: 1;
  transform: none;
}

.wlan-features__grid .wlan-features__card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--logo-rose), var(--logo-cherry));
  opacity: 1;
  transform: scaleY(1);
}

.wlan-features__grid .wlan-features__card:nth-child(2),
.wlan-features__grid .wlan-features__card:nth-child(3) {
  background: rgba(255, 255, 255, 0.05);
}

.wlan-features__grid .wlan-features__card:hover {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22);
}

.wlan-features__grid .wlan-features__card h3 {
  font-size: 1.35rem;
  margin-bottom: 0.75rem;
}

.wlan-features__grid .wlan-features__card p {
  font-size: 0.92rem;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.95);
}

.wlan-features__card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.15rem 1.25rem 1.15rem 1rem;
  color: white;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  opacity: 0;
  transform: translateX(14px);
  transition: transform 0.35s ease, background 0.35s ease, border-color 0.35s ease;
}

.wlan-features__stack .wlan-features__card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--logo-rose), var(--logo-cherry));
  opacity: 0;
  transform: scaleY(0);
  transform-origin: top;
  transition: opacity 0.35s ease, transform 0.45s ease;
}

.reveal.visible .wlan-features__stack .wlan-features__card {
  animation: wlan-card-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) { animation-delay: 0.12s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) { animation-delay: 0.28s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) { animation-delay: 0.44s; }

.reveal.visible .wlan-features__stack .wlan-features__card::before {
  opacity: 1;
  transform: scaleY(1);
}

.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1)::before { transition-delay: 0.45s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2)::before { transition-delay: 0.6s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3)::before { transition-delay: 0.75s; }

@keyframes wlan-card-in {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.wlan-features__card:hover {
  transform: translateX(4px);
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
}

.wlan-features__icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  padding: 4px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.wlan-features__card-body {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.wlan-features__card h3 {
  font-size: 1.05rem;
  font-weight: 800;
  margin-bottom: 0.35rem;
}

.wlan-features__card p {
  font-size: 0.86rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.78);
}

.wlan-feature-draw__path {
  fill: none;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.reveal.visible .wlan-features__stack .wlan-feature-draw__path {
  animation: wlan-icon-draw 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .wlan-feature-draw__path--1 { animation-delay: 0.35s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .wlan-feature-draw__path--2 { animation-delay: 0.5s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .wlan-feature-draw__path--3 { animation-delay: 0.62s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .wlan-feature-draw__path--4 { animation-delay: 0.72s; }

.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .wlan-feature-draw__path--1 { animation-delay: 0.5s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .wlan-feature-draw__path--2 { animation-delay: 0.64s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .wlan-feature-draw__path--3 { animation-delay: 0.76s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .wlan-feature-draw__path--4 { animation-delay: 0.86s; }

.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .wlan-feature-draw__path--1 { animation-delay: 0.65s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .wlan-feature-draw__path--2 { animation-delay: 0.78s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .wlan-feature-draw__path--3 { animation-delay: 0.9s; }
.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .wlan-feature-draw__path--4 { animation-delay: 1s; }

@keyframes wlan-icon-draw {
  to { stroke-dashoffset: 0; }
}

/* ========== Card viz — animações temáticas (features + diferenciais) ========== */
.feature-card__viz,
.diff-card__viz {
  width: 100%;
  height: 100%;
  display: block;
}

.card-viz__path {
  fill: none;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.card-viz__fill {
  opacity: 0;
}

.card-viz__loop {
  opacity: 0;
}

.feature-card.reveal.visible .card-viz__path,
.diff-card.reveal.visible .card-viz__path {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.feature-card.reveal.visible .card-viz__fill,
.diff-card.reveal.visible .card-viz__fill {
  animation: card-viz-fill 0.45s ease forwards;
}

.feature-card.reveal.visible .card-viz__loop,
.diff-card.reveal.visible .card-viz__loop {
  animation: card-viz-loop-in 0.4s ease forwards;
}

@keyframes card-viz-draw {
  to { stroke-dashoffset: 0; }
}

@keyframes card-viz-fill {
  from { opacity: 0; transform: scale(0.85); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes card-viz-loop-in {
  to { opacity: 1; }
}

.feature-card.reveal.visible:nth-child(1) .card-viz__path--1 { animation-delay: 0.05s; }
.feature-card.reveal.visible:nth-child(1) .card-viz__path--2 { animation-delay: 0.15s; }
.feature-card.reveal.visible:nth-child(1) .card-viz__path--3 { animation-delay: 0.25s; }
.feature-card.reveal.visible:nth-child(1) .card-viz__path--4 { animation-delay: 0.35s; }
.feature-card.reveal.visible:nth-child(1) .card-viz__fill--1 { animation-delay: 0.55s; }

.feature-card.reveal.visible:nth-child(2) .card-viz__path--1 { animation-delay: 0.1s; }
.feature-card.reveal.visible:nth-child(2) .card-viz__path--2 { animation-delay: 0.2s; }
.feature-card.reveal.visible:nth-child(2) .card-viz__path--3 {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) 0.32s forwards, card-viz-wifi-pulse 2.4s ease-in-out 1.1s infinite;
}
.feature-card.reveal.visible:nth-child(2) .card-viz__path--4 {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) 0.42s forwards, card-viz-wifi-pulse 2.4s ease-in-out 1.2s infinite;
}

.feature-card.reveal.visible:nth-child(2) .card-viz__fill--1 { animation-delay: 0.58s; }

.feature-card.reveal.visible:nth-child(3) .card-viz__path--1 { animation-delay: 0.15s; }
.feature-card.reveal.visible:nth-child(3) .card-viz__path--2 { animation-delay: 0.25s; }
.feature-card.reveal.visible:nth-child(3) .card-viz__path--3 { animation-delay: 0.35s; }
.feature-card.reveal.visible:nth-child(3) .card-viz__path--4 { animation-delay: 0.45s; }
.feature-card.reveal.visible:nth-child(3) .card-viz__fill--1 { animation-delay: 0.6s; }

.feature-card.reveal.visible:nth-child(4) .card-viz__path--1 { animation-delay: 0.2s; }
.feature-card.reveal.visible:nth-child(4) .card-viz__path--2 { animation-delay: 0.3s; }
.feature-card.reveal.visible:nth-child(4) .card-viz__path--3 { animation-delay: 0.4s; }
.feature-card.reveal.visible:nth-child(4) .card-viz__fill--1 { animation-delay: 0.55s; transform-origin: 32px 32px; }
.feature-card.reveal.visible:nth-child(4) .card-viz__fill--2 { animation-delay: 0.68s; }

.differentials__grid .diff-card.reveal.visible:nth-child(1) .card-viz__path--1 { animation-delay: 0.05s; }
.differentials__grid .diff-card.reveal.visible:nth-child(1) .card-viz__path--2 { animation-delay: 0.12s; }
.differentials__grid .diff-card.reveal.visible:nth-child(1) .card-viz__path--3 { animation-delay: 0.2s; }
.differentials__grid .diff-card.reveal.visible:nth-child(1) .card-viz__path--4 { animation-delay: 0.3s; }
.differentials__grid .diff-card.reveal.visible:nth-child(1) .card-viz__path--5 { animation-delay: 0.4s; }
.differentials__grid .diff-card.reveal.visible:nth-child(1) .card-viz__fill--1 { animation-delay: 0.55s; }

.differentials__grid .diff-card.reveal.visible:nth-child(2) .card-viz__path--1 { animation-delay: 0.08s; }
.differentials__grid .diff-card.reveal.visible:nth-child(2) .card-viz__path--2 { animation-delay: 0.16s; }
.differentials__grid .diff-card.reveal.visible:nth-child(2) .card-viz__path--3 { animation-delay: 0.24s; }
.differentials__grid .diff-card.reveal.visible:nth-child(2) .card-viz__path--4 { animation-delay: 0.34s; }
.differentials__grid .diff-card.reveal.visible:nth-child(2) .card-viz__fill--1 { animation-delay: 0.5s; transform-origin: 38px 36px; }
.differentials__grid .diff-card.reveal.visible:nth-child(2) .card-viz__fill--2 { animation-delay: 0.62s; }

.differentials__grid .diff-card.reveal.visible:nth-child(3) .card-viz__path--1 { animation-delay: 0.1s; }
.differentials__grid .diff-card.reveal.visible:nth-child(3) .card-viz__path--2 { animation-delay: 0.18s; }
.differentials__grid .diff-card.reveal.visible:nth-child(3) .card-viz__path--3 {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) 0.28s forwards, card-viz-support-ring 2.5s ease-in-out 1s infinite;
}
.differentials__grid .diff-card.reveal.visible:nth-child(3) .card-viz__path--4 { animation-delay: 0.38s; }
.differentials__grid .diff-card.reveal.visible:nth-child(3) .card-viz__fill--1 { animation-delay: 0.52s; transform-origin: 36px 14px; }
.differentials__grid .diff-card.reveal.visible:nth-child(3) .card-viz__fill--2 { animation-delay: 0.62s; }

.differentials__grid .diff-card.reveal.visible:nth-child(4) .card-viz__path--1 { animation-delay: 0.12s; }
.differentials__grid .diff-card.reveal.visible:nth-child(4) .card-viz__path--2 { animation-delay: 0.2s; }
.differentials__grid .diff-card.reveal.visible:nth-child(4) .card-viz__path--3 { animation-delay: 0.28s; }
.differentials__grid .diff-card.reveal.visible:nth-child(4) .card-viz__fill--1 { animation-delay: 0.45s; }
.differentials__grid .diff-card.reveal.visible:nth-child(4) .card-viz__fill--2 { animation-delay: 0.58s; }

.differentials__grid .diff-card.reveal.visible:nth-child(5) .card-viz__path--1 { animation-delay: 0.14s; }
.differentials__grid .diff-card.reveal.visible:nth-child(5) .card-viz__path--2 { animation-delay: 0.24s; }
.differentials__grid .diff-card.reveal.visible:nth-child(5) .card-viz__path--3 { animation-delay: 0.34s; }
.differentials__grid .diff-card.reveal.visible:nth-child(5) .card-viz__fill--1 { animation-delay: 0.5s; }
.differentials__grid .diff-card.reveal.visible:nth-child(5) .card-viz__loop--map {
  animation: card-viz-loop-in 0.4s ease 0.65s forwards, card-viz-map-pulse 2s ease-in-out 1.1s infinite;
  transform-origin: 30px 32px;
}

.differentials__grid .diff-card.reveal.visible:nth-child(6) .card-viz__path--1 {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) 0.16s forwards, card-viz-bolt-flash 1.8s ease-in-out 0.9s infinite;
}

.differentials__grid .diff-card.reveal.visible:nth-child(6) .card-viz__path--2 { animation-delay: 0.28s; }
.differentials__grid .diff-card.reveal.visible:nth-child(6) .card-viz__fill--1 { animation-delay: 0.45s; }
.differentials__grid .diff-card.reveal.visible:nth-child(6) .card-viz__fill--2 { animation-delay: 0.52s; }
.differentials__grid .diff-card.reveal.visible:nth-child(6) .card-viz__fill--3 { animation-delay: 0.58s; }
.differentials__grid .diff-card.reveal.visible:nth-child(6) .card-viz__fill--4 { animation-delay: 0.68s; }

.feature-card.reveal.visible .card-viz__loop--fiber,
.diff-card.reveal.visible .card-viz__loop--fiber {
  animation: card-viz-loop-in 0.4s ease 0.7s forwards, card-viz-fiber-pulse 2.2s ease-in-out 1.1s infinite;
}

.diff-card.reveal.visible .card-viz__loop--map {
  animation: card-viz-loop-in 0.4s ease 0.65s forwards, card-viz-map-pulse 2s ease-in-out 1.1s infinite;
  transform-origin: 30px 32px;
}

.diff-card.reveal.visible .card-viz__loop--ping {
  animation: card-viz-fill 0.45s ease forwards, card-viz-ping-bar 1.6s ease-in-out 1s infinite;
}

@keyframes card-viz-fiber-pulse {
  0%, 100% { opacity: 0; transform: scale(0.7); }
  50% { opacity: 0.7; transform: scale(1.4); }
}

@keyframes card-viz-wifi-pulse {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 1; }
}

@keyframes card-viz-support-ring {
  0%, 100% { opacity: 0.2; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(1.08); }
}

@keyframes card-viz-map-pulse {
  0%, 100% { opacity: 0; transform: scale(0.8); }
  50% { opacity: 0.85; transform: scale(1.5); }
}

@keyframes card-viz-bolt-flash {
  0%, 100% { opacity: 0.75; filter: none; }
  15% { opacity: 1; filter: drop-shadow(0 0 4px var(--logo-cherry)); }
  30% { opacity: 0.8; filter: none; }
}

@keyframes card-viz-ping-bar {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 1; }
}

.section-scene .feature-card__icon {
  width: 56px;
  height: 56px;
  padding: 6px;
  border-radius: 14px;
  margin-inline: auto;
}

.section-scene .diff-card__icon {
  width: 56px;
  height: 56px;
  padding: 6px;
  border-radius: 14px;
}

.section-scene .diff-card__icon {
  width: 56px;
  height: 56px;
  padding: 6px;
  border-radius: 14px;
}

/* VoIP cards — ícones animados */
.voip-card__icon {
  width: 56px;
  height: 56px;
  padding: 6px;
  border-radius: 14px;
  margin-bottom: 1rem;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.voip-card__viz {
  width: 100%;
  height: 100%;
  display: block;
}

.voip-card.reveal.visible .card-viz__path {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.voip-card.reveal.visible .card-viz__fill {
  animation: card-viz-fill 0.45s ease forwards;
}

.voip-card.reveal.visible .card-viz__loop {
  animation: card-viz-fill 0.45s ease forwards, card-viz-ping-bar 1.6s ease-in-out 1s infinite;
}

.voip-card.reveal.visible:nth-child(1) .card-viz__path--1 { animation-delay: 0.05s; }
.voip-card.reveal.visible:nth-child(1) .card-viz__path--2 { animation-delay: 0.15s; }
.voip-card.reveal.visible:nth-child(1) .card-viz__path--3 { animation-delay: 0.25s; }
.voip-card.reveal.visible:nth-child(1) .card-viz__fill--1 { animation-delay: 0.4s; }

.voip-card.reveal.visible:nth-child(2) .card-viz__path--1 { animation-delay: 0.1s; }
.voip-card.reveal.visible:nth-child(2) .card-viz__path--2 { animation-delay: 0.2s; }
.voip-card.reveal.visible:nth-child(2) .card-viz__path--3 { animation-delay: 0.3s; }
.voip-card.reveal.visible:nth-child(2) .card-viz__fill--1 { animation-delay: 0.45s; }
.voip-card.reveal.visible:nth-child(2) .card-viz__fill--2 { animation-delay: 0.52s; }
.voip-card.reveal.visible:nth-child(2) .card-viz__fill--3 { animation-delay: 0.58s; }
.voip-card.reveal.visible:nth-child(2) .card-viz__fill--4 { animation-delay: 0.64s; }

.voip-card.reveal.visible:nth-child(3) .card-viz__path--1 { animation-delay: 0.12s; }
.voip-card.reveal.visible:nth-child(3) .card-viz__path--2 { animation-delay: 0.22s; }
.voip-card.reveal.visible:nth-child(3) .card-viz__fill--1 { animation-delay: 0.38s; }
.voip-card.reveal.visible:nth-child(3) .card-viz__fill--2 { animation-delay: 0.48s; }

.voip-card.reveal.visible:nth-child(4) .card-viz__path--1 { animation-delay: 0.14s; }
.voip-card.reveal.visible:nth-child(4) .card-viz__path--2 { animation-delay: 0.24s; }
.voip-card.reveal.visible:nth-child(4) .card-viz__fill--1 { animation-delay: 0.4s; }

/* WLAN grid empresas — ícones ao entrar na tela */
.wlan-features__icon--grid {
  width: 52px;
  height: 52px;
  padding: 4px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  margin-bottom: 1rem;
}

.wlan-features__grid.reveal.visible .card-viz__path {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.wlan-features__grid.reveal.visible .card-viz__fill {
  animation: card-viz-fill 0.45s ease forwards;
}

.wlan-features__grid.reveal.visible .card-viz__loop {
  animation: card-viz-loop-in 0.4s ease 0.7s forwards, card-viz-fiber-pulse 2.2s ease-in-out 1.1s infinite;
}

.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(1) .card-viz__path--1 { animation-delay: 0.08s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(1) .card-viz__path--2 { animation-delay: 0.16s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(1) .card-viz__path--3 { animation-delay: 0.24s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(1) .card-viz__path--4 { animation-delay: 0.32s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(1) .card-viz__fill--1 { animation-delay: 0.48s; }

.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(2) .card-viz__path--1 { animation-delay: 0.12s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(2) .card-viz__path--2 { animation-delay: 0.2s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(2) .card-viz__path--3 { animation-delay: 0.28s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(2) .card-viz__path--4 { animation-delay: 0.36s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(2) .card-viz__path--5 { animation-delay: 0.44s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(2) .card-viz__fill--1 { animation-delay: 0.58s; }

.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(3) .card-viz__path--1 { animation-delay: 0.16s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(3) .card-viz__path--2 { animation-delay: 0.24s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(3) .card-viz__path--3 { animation-delay: 0.32s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(3) .card-viz__fill--1 { animation-delay: 0.46s; }
.wlan-features__grid.reveal.visible .wlan-features__card:nth-child(3) .card-viz__fill--2 { animation-delay: 0.54s; }

/* Empresas — WLAN stack (layout split) */
.wlan-steps__layout.reveal.visible .wlan-features__stack .card-viz__path {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.wlan-steps__layout.reveal.visible .wlan-features__stack .card-viz__fill {
  animation: card-viz-fill 0.45s ease forwards;
}

.wlan-steps__layout.reveal.visible .wlan-features__stack .card-viz__loop {
  animation: card-viz-loop-in 0.4s ease 0.7s forwards, card-viz-fiber-pulse 2.2s ease-in-out 1.1s infinite;
}

.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .card-viz__path--1 { animation-delay: 0.45s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .card-viz__path--2 { animation-delay: 0.53s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .card-viz__path--3 { animation-delay: 0.61s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .card-viz__path--4 { animation-delay: 0.69s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(1) .card-viz__fill--1 { animation-delay: 0.85s; }

.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .card-viz__path--1 { animation-delay: 0.55s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .card-viz__path--2 { animation-delay: 0.63s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .card-viz__path--3 { animation-delay: 0.71s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .card-viz__path--4 { animation-delay: 0.79s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .card-viz__path--5 { animation-delay: 0.87s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(2) .card-viz__fill--1 { animation-delay: 1.02s; }

.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .card-viz__path--1 { animation-delay: 0.65s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .card-viz__path--2 { animation-delay: 0.73s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .card-viz__path--3 { animation-delay: 0.81s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .card-viz__fill--1 { animation-delay: 0.95s; }
.wlan-steps__layout.reveal.visible .wlan-features__stack .wlan-features__card:nth-child(3) .card-viz__fill--2 { animation-delay: 1.03s; }

.page-empresas .wlan-features .section__label {
  color: rgba(168, 212, 255, 0.95);
}

/* Topologia IP/LAN corporativa */
.evox-corp-lan-viz {
  width: 100%;
  max-width: 520px;
  margin-top: 0.5rem;
}

.evox-corp-lan-viz__art {
  width: 100%;
  height: auto;
  display: block;
}

.corp-lan-draw {
  fill: none;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.corp-lan-fill,
.corp-lan-loop {
  opacity: 0;
}

.wlan-steps__layout.reveal.visible .corp-lan-draw {
  animation: card-viz-draw 0.75s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.wlan-steps__layout.reveal.visible .corp-lan-draw--1 { animation-delay: 0.1s; }
.wlan-steps__layout.reveal.visible .corp-lan-draw--2 { animation-delay: 0.22s; }
.wlan-steps__layout.reveal.visible .corp-lan-draw--3 { animation-delay: 0.34s; }
.wlan-steps__layout.reveal.visible .corp-lan-draw--4 { animation-delay: 0.46s; }

.wlan-steps__layout.reveal.visible .corp-lan-fill {
  animation: card-viz-fill 0.45s ease forwards;
}

.wlan-steps__layout.reveal.visible .corp-lan-fill--1 { animation-delay: 0.62s; }
.wlan-steps__layout.reveal.visible .corp-lan-fill--2 { animation-delay: 0.72s; }
.wlan-steps__layout.reveal.visible .corp-lan-fill--3 { animation-delay: 0.52s; }
.wlan-steps__layout.reveal.visible .corp-lan-fill--4 { animation-delay: 0.64s; }

.wlan-steps__layout.reveal.visible .corp-lan-loop--1 {
  animation: card-viz-loop-in 0.4s ease 0.78s forwards, card-viz-fiber-pulse 2.2s ease-in-out 1.2s infinite;
}

/* Fluxo de contratação B2B (3 etapas) */
.evox-corp-flow {
  width: 100%;
  max-width: 520px;
}

.evox-corp-flow__viewport {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  height: 280px;
}

.evox-corp-flow__captions {
  position: relative;
  min-height: 2.75rem;
}

.evox-corp-flow__caption {
  position: absolute;
  inset: 0;
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.78);
  opacity: 0;
}

.evox-corp-flow__caption strong {
  display: block;
  color: #fff;
  font-weight: 800;
  margin-bottom: 0.15rem;
}

.evox-corp-flow__caption--1 { animation: evox-corp-caption-1 18s ease-in-out infinite; }
.evox-corp-flow__caption--2 { animation: evox-corp-caption-2 18s ease-in-out infinite; }
.evox-corp-flow__caption--3 { animation: evox-corp-caption-3 18s ease-in-out infinite; }

@keyframes evox-corp-caption-1 {
  0%, 3% { opacity: 0; transform: translateY(6px); }
  6%, 28% { opacity: 1; transform: translateY(0); }
  32%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes evox-corp-caption-2 {
  0%, 32% { opacity: 0; transform: translateY(6px); }
  36%, 62% { opacity: 1; transform: translateY(0); }
  66%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes evox-corp-caption-3 {
  0%, 66% { opacity: 0; transform: translateY(6px); }
  70%, 94% { opacity: 1; transform: translateY(0); }
  98%, 100% { opacity: 0; transform: translateY(-4px); }
}

.evox-corp-flow__stage {
  position: relative;
  flex: 1;
  min-height: 0;
}

.evox-corp-flow__scene {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.evox-corp-flow__scene--1 { animation: evox-corp-scene-1 18s ease-in-out infinite; }
.evox-corp-flow__scene--2 { animation: evox-corp-scene-2 18s ease-in-out infinite; }
.evox-corp-flow__scene--3 { animation: evox-corp-scene-3 18s ease-in-out infinite; }

@keyframes evox-corp-scene-1 {
  0%, 3% { opacity: 0; }
  6%, 28% { opacity: 1; }
  32%, 100% { opacity: 0; }
}

@keyframes evox-corp-scene-2 {
  0%, 32% { opacity: 0; }
  36%, 62% { opacity: 1; }
  66%, 100% { opacity: 0; }
}

@keyframes evox-corp-scene-3 {
  0%, 66% { opacity: 0; }
  70%, 94% { opacity: 1; }
  98%, 100% { opacity: 0; }
}

.evox-corp-flow__art {
  width: 100%;
  height: 100%;
}

.corp-flow-draw {
  fill: none;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.corp-flow-fill {
  opacity: 0;
}

.evox-corp-flow__scene--1 .corp-flow-draw { animation: card-viz-draw 0.65s ease forwards; }
.evox-corp-flow__scene--1 .corp-flow-draw--1 { animation-delay: 0.05s; }
.evox-corp-flow__scene--1 .corp-flow-draw--2 { animation-delay: 0.15s; }
.evox-corp-flow__scene--1 .corp-flow-draw--3 { animation-delay: 0.25s; }
.evox-corp-flow__scene--1 .corp-flow-draw--4 { animation-delay: 0.35s; }
.evox-corp-flow__scene--1 .corp-flow-fill { animation: card-viz-fill 0.45s ease forwards; }
.evox-corp-flow__scene--1 .corp-flow-fill--1 { animation-delay: 0.5s; }
.evox-corp-flow__scene--1 .corp-flow-fill--2 { animation-delay: 0.6s; }

.evox-corp-flow__scene--2 .corp-flow-draw { animation: card-viz-draw 0.65s ease forwards; }
.evox-corp-flow__scene--2 .corp-flow-fill--1 { animation: card-viz-fill 0.45s ease 0.45s forwards; }

.evox-corp-flow__scene--3 .corp-flow-draw { animation: card-viz-draw 0.65s ease forwards; }
.evox-corp-flow__scene--3 .corp-flow-fill--1 { animation: card-viz-fill 0.45s ease 0.5s forwards; }

/* Diferenciais B2B — 4 cards */
.differentials__grid--b2b .diff-card.reveal.visible:nth-child(1) .card-viz__fill--2 { animation-delay: 0.65s; }

.differentials__grid--b2b .diff-card.reveal.visible:nth-child(3) .card-viz__fill--1 {
  animation-delay: 0.52s;
  transform-origin: 36px 14px;
}

.differentials__grid--b2b .diff-card.reveal.visible:nth-child(4) .card-viz__path--4 { animation-delay: 0.36s; }
.differentials__grid--b2b .diff-card.reveal.visible:nth-child(4) .card-viz__path--5 { animation-delay: 0.44s; }
.differentials__grid--b2b .diff-card.reveal.visible:nth-child(4) .card-viz__fill--1 { animation-delay: 0.58s; }

.differentials__grid--b2b .diff-card.reveal.visible:nth-child(4) .card-viz__loop--map {
  animation: card-viz-loop-in 0.4s ease 0.72s forwards, card-viz-map-pulse 2s ease-in-out 1.15s infinite;
  transform-origin: 28px 32px;
}

.section-scene .btn--plan {
  background: rgba(227, 46, 106, 0.22);
  border: 1px solid rgba(227, 46, 106, 0.45);
  color: #fff;
}

.section-scene .btn--plan:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

/* Chatbot IA — animação de conversa */
.evox-chatbot-viz {
  width: 100%;
  padding: 1rem 1.1rem 1.15rem;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--radius);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  position: relative;
  overflow: hidden;
}

.evox-chatbot-viz::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, #6eb4ff, var(--logo-rose));
  opacity: 0.85;
}

.evox-chatbot-viz__art {
  width: 100%;
  height: auto;
  display: block;
}

.chatbot-viz-draw {
  fill: none;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.chatbot-viz-fill,
.chatbot-viz-msg,
.chatbot-viz-loop {
  opacity: 0;
}

.chatbot-viz-dot {
  opacity: 0;
}

.reveal.visible .chatbot-viz-draw--frame {
  animation: card-viz-draw 0.85s cubic-bezier(0.4, 0, 0.2, 1) 0.1s forwards;
}

.reveal.visible .chatbot-viz-draw--header {
  animation: card-viz-draw 0.65s cubic-bezier(0.4, 0, 0.2, 1) 0.35s forwards;
}

.reveal.visible .chatbot-viz-fill--ai-ring {
  animation: card-viz-draw 0.55s ease 0.45s forwards;
}

.reveal.visible .chatbot-viz-fill--ai-label {
  animation: chatbot-viz-ai-label 14s ease-in-out 0.55s infinite;
}

.reveal.visible .chatbot-viz-fill--online {
  animation: chatbot-viz-online-pulse 14s ease-in-out 0.6s infinite;
}

.reveal.visible .chatbot-viz-fill--title,
.reveal.visible .chatbot-viz-fill--badge {
  animation: card-viz-fill 0.4s ease 0.55s forwards;
}

.reveal.visible .chatbot-viz-msg--user {
  animation: chatbot-viz-user-in 14s ease-in-out 0.7s infinite;
}

.reveal.visible .chatbot-viz-msg--user-text {
  animation: chatbot-viz-user-text 14s ease-in-out 0.75s infinite;
}

.reveal.visible .chatbot-viz-msg--typing {
  animation: chatbot-viz-typing-box 14s ease-in-out 0.7s infinite;
}

.reveal.visible .chatbot-viz-dot--1 {
  animation: chatbot-viz-dot 14s ease-in-out 0.75s infinite;
}

.reveal.visible .chatbot-viz-dot--2 {
  animation: chatbot-viz-dot 14s ease-in-out 0.85s infinite;
}

.reveal.visible .chatbot-viz-dot--3 {
  animation: chatbot-viz-dot 14s ease-in-out 0.95s infinite;
}

.reveal.visible .chatbot-viz-msg--bot {
  animation: chatbot-viz-bot-in 14s ease-in-out 0.7s infinite;
}

.reveal.visible .chatbot-viz-msg--bot-line1,
.reveal.visible .chatbot-viz-msg--bot-line2 {
  animation: chatbot-viz-bot-text 14s ease-in-out 0.7s infinite;
}

.reveal.visible .chatbot-viz-loop--spark {
  animation: chatbot-viz-spark 14s ease-in-out 0.7s infinite;
  transform-origin: 320px 190px;
}

@keyframes chatbot-viz-ai-label {
  0%, 4% { opacity: 0; }
  8%, 92% { opacity: 1; }
  96%, 100% { opacity: 0; }
}

@keyframes chatbot-viz-online-pulse {
  0%, 4% { opacity: 0; }
  8%, 92% { opacity: 1; }
  50% { opacity: 0.55; }
  96%, 100% { opacity: 0; }
}

@keyframes chatbot-viz-user-in {
  0%, 8% { opacity: 0; transform: translateX(12px); }
  14%, 88% { opacity: 1; transform: translateX(0); }
  94%, 100% { opacity: 0; transform: translateX(8px); }
}

@keyframes chatbot-viz-user-text {
  0%, 10% { opacity: 0; }
  16%, 88% { opacity: 1; }
  94%, 100% { opacity: 0; }
}

@keyframes chatbot-viz-typing-box {
  0%, 18% { opacity: 0; transform: translateY(6px); }
  24%, 38% { opacity: 1; transform: translateY(0); }
  44%, 100% { opacity: 0; transform: translateY(4px); }
}

@keyframes chatbot-viz-dot {
  0%, 22% { opacity: 0; transform: translateY(0); }
  26%, 40% { opacity: 0.85; transform: translateY(-3px); }
  44%, 100% { opacity: 0; transform: translateY(0); }
}

@keyframes chatbot-viz-bot-in {
  0%, 40% { opacity: 0; transform: translateY(8px); }
  48%, 88% { opacity: 1; transform: translateY(0); }
  94%, 100% { opacity: 0; transform: translateY(6px); }
}

@keyframes chatbot-viz-bot-text {
  0%, 44% { opacity: 0; }
  50%, 88% { opacity: 1; }
  94%, 100% { opacity: 0; }
}

@keyframes chatbot-viz-spark {
  0%, 48% { opacity: 0; transform: scale(0.6); }
  54%, 72% { opacity: 0.9; transform: scale(1); }
  78%, 100% { opacity: 0; transform: scale(0.7); }
}

@media (prefers-reduced-motion: reduce) {
  .reveal.visible .chatbot-viz-draw,
  .reveal.visible .chatbot-viz-fill,
  .reveal.visible .chatbot-viz-msg,
  .reveal.visible .chatbot-viz-dot,
  .reveal.visible .chatbot-viz-loop {
    animation: none !important;
    stroke-dashoffset: 0;
    opacity: 1;
    transform: none;
  }
}

.wlan-features__grid .wlan-features__card h3 {
  color: #fff;
  font-size: 1.05rem;
  font-weight: 800;
  margin-bottom: 0.5rem;
}

.wlan-features__grid .wlan-features__card p {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.86rem;
  line-height: 1.55;
}

@media (prefers-reduced-motion: reduce) {
  .voip-card.reveal.visible .card-viz__path,
  .voip-card.reveal.visible .card-viz__fill,
  .voip-card.reveal.visible .card-viz__loop,
  .wlan-features__grid.reveal.visible .card-viz__path,
  .wlan-features__grid.reveal.visible .card-viz__fill,
  .wlan-features__grid.reveal.visible .card-viz__loop,
  .wlan-steps__layout.reveal.visible .wlan-features__stack .card-viz__path,
  .wlan-steps__layout.reveal.visible .wlan-features__stack .card-viz__fill,
  .wlan-steps__layout.reveal.visible .wlan-features__stack .card-viz__loop,
  .wlan-steps__layout.reveal.visible .corp-lan-draw,
  .wlan-steps__layout.reveal.visible .corp-lan-fill,
  .wlan-steps__layout.reveal.visible .corp-lan-loop,
  .evox-corp-flow__scene,
  .evox-corp-flow__caption,
  .corp-flow-draw,
  .corp-flow-fill {
    animation: none !important;
    stroke-dashoffset: 0;
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .feature-card.reveal.visible .card-viz__path,
  .diff-card.reveal.visible .card-viz__path,
  .feature-card.reveal.visible .card-viz__fill,
  .diff-card.reveal.visible .card-viz__fill,
  .feature-card.reveal.visible .card-viz__loop,
  .diff-card.reveal.visible .card-viz__loop {
    animation: none !important;
    stroke-dashoffset: 0;
    opacity: 1;
    transform: none;
  }
}

/* ========== Glass cards — seções escuras (estilo wlan-features) ========== */
.section-scene .plan-card,
.section-scene .plans__promo,
.section-scene .feature-card,
.section-scene .diff-card,
.section-scene .city-hub__card,
.section-scene .city-nearby__card,
.section-scene .city-aside__box,
.section-scene .local-seo__card,
.section-scene .careers__note,
.section-scene .voip-card,
.section-scene .testimonial-card,
.section-scene .faq__item,
.section-scene .contact__card,
.section-scene .contact__form {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: none;
  color: white;
}

.section-scene .emp-chatbot__panel {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.section-scene .plan-card,
.section-scene .feature-card,
.section-scene .diff-card,
.section-scene .city-hub__card,
.section-scene .city-nearby__card,
.section-scene .city-aside__box,
.section-scene .local-seo__card,
.section-scene .voip-card,
.section-scene .testimonial-card,
.section-scene .contact__card {
  position: relative;
  overflow: hidden;
}

.section-scene .plan-card::before,
.section-scene .feature-card::before,
.section-scene .diff-card::before,
.section-scene .city-hub__card::before,
.section-scene .city-nearby__card::before,
.section-scene .city-aside__box::before,
.section-scene .local-seo__card::before,
.section-scene .careers__note::before,
.section-scene .voip-card::before,
.section-scene .testimonial-card::before,
.section-scene .contact__card::before,
.section-scene .plans__promo::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--logo-rose), var(--logo-cherry));
  transform: scaleY(1);
  opacity: 1;
}

.section-scene .feature-card::before,
.section-scene .diff-card::before {
  top: 15%;
  bottom: 15%;
  right: auto;
  left: 0;
  width: 3px;
  height: auto;
  transform: scaleY(1);
  transform-origin: top;
}

.section-scene .plan-card:hover,
.section-scene .feature-card:hover,
.section-scene .diff-card:hover,
.section-scene .city-hub__card:hover,
.section-scene .city-nearby__card:hover,
.section-scene .city-aside__box:hover,
.section-scene .local-seo__card:hover,
.section-scene .voip-card:hover,
.section-scene .testimonial-card:hover,
.section-scene .contact__card:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22);
}

.section-scene .plan-card--featured,
.section-scene .feature-card--highlight,
.section-scene .diff-card--highlight,
.section-scene .voip-card--featured {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(227, 46, 106, 0.45);
  box-shadow: 0 0 40px rgba(227, 46, 106, 0.18);
  overflow: visible;
}

.section-scene .plan-card__tier,
.section-scene .feature-card__tag,
.section-scene .diff-card__tag,
.section-scene .voip-card__tier,
.section-scene .city-hub__badge {
  color: #ffb3c6;
  background: rgba(227, 46, 106, 0.22);
}

.section-scene .plan-card__speed,
.section-scene .feature-card h3,
.section-scene .diff-card h3,
.section-scene .voip-card__title,
.section-scene .city-hub__title,
.section-scene .contact__card strong,
.section-scene .contact__form h3,
.section-scene .testimonial-card footer strong {
  color: #fff;
}

.section-scene .plan-card__bandwidth,
.section-scene .plan-card__features li,
.section-scene .feature-card p,
.section-scene .diff-card__desc,
.section-scene .voip-card__desc,
.section-scene .city-hub__desc,
.section-scene .testimonial-card p,
.section-scene .contact__card span,
.section-scene .contact__card a {
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .plan-card__bandwidth span {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.85);
}

.section-scene .plan-card__features li {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.section-scene .plan-card__price-block--card {
  background: rgba(0, 200, 83, 0.12);
  border: 1px solid rgba(0, 200, 83, 0.28);
}

.section-scene .plan-card__price-block--pix {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.section-scene .plan-card__price-label,
.section-scene .plan-card__installments {
  color: rgba(255, 255, 255, 0.78);
}

.section-scene .plan-card__amount,
.section-scene .plan-card__price--alt .plan-card__amount {
  color: #fff;
}

.section-scene .plan-card__period {
  color: rgba(255, 255, 255, 0.55);
}

.section-scene .plan-card__adesao {
  color: rgba(255, 255, 255, 0.55);
}

.section-scene .plan-card__adesao--free {
  color: #7dffb0;
}

.section-scene .plan-card__features li::before,
.section-scene .voip-card__features li::before {
  color: var(--logo-rose);
}

.section-scene .voip-card__features li {
  color: rgba(255, 255, 255, 0.72);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.section-scene .voip-card__amount {
  color: #fff;
}

.section-scene .voip-card__period {
  color: rgba(255, 255, 255, 0.55);
}

.voip__grid--5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.section-scene .feature-card__icon,
.section-scene .diff-card__icon {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: none;
  color: #ffb3c6;
}

.section-scene .city-hub__bairros li {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .city-hub__link {
  color: #ffb3c6;
}

.section-scene .city-nearby__card,
.section-scene .city-aside__box,
.section-scene .local-seo__card,
.section-scene .careers__note {
  position: relative;
  overflow: hidden;
  border-left: none;
}

.section-scene .city-nearby__card strong,
.section-scene .city-aside__box h3,
.section-scene .local-seo__card h3 {
  color: #fff;
}

.section-scene .city-nearby__card,
.section-scene .city-aside__box p,
.section-scene .local-seo__card p,
.section-scene .careers__note {
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .careers__info p,
.section-scene .careers__benefits li {
  color: rgba(255, 255, 255, 0.85);
}

.section-scene .careers__benefits svg {
  color: var(--logo-rose);
}

.section-scene .file-upload__zone {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.2);
}

.section-scene .file-upload__zone p,
.section-scene .file-upload__hint {
  color: rgba(255, 255, 255, 0.65);
}

.section-scene .file-upload__zone strong {
  color: #ffb3c6;
}

.section-scene .file-upload__selected {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
}

.section-scene .file-upload__name {
  color: rgba(255, 255, 255, 0.9);
}

.section-scene .form-lgpd {
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .form-lgpd a {
  color: #ffb3c6;
}

.section-scene .careers-contact__lead {
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .careers-contact__card {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.85);
}

.section-scene .careers-contact__card strong {
  color: #fff;
}

.section-scene .careers-contact__card span {
  color: rgba(255, 255, 255, 0.65);
}

.section-scene .city-nearby__card:hover {
  color: #fff;
}

.section-scene .city-nearby__card:hover strong {
  color: #ffb3c6;
}

.section-scene .plans__promo {
  padding-left: 1.5rem;
  border-left: none;
  box-shadow: none;
}

.section-scene .plans__promo-icon {
  background: rgba(227, 46, 106, 0.18);
  color: #ffb3c6;
}

.section-scene .plans__promo-text strong {
  color: #fff;
}

.section-scene .plans__promo-text p {
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .plans__promo-text span {
  color: #ffb3c6;
}

.section-scene .telefonia__highlight {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.section-scene .telefonia__highlight svg {
  color: var(--logo-rose);
}

.section-scene .faq__tab {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .faq__tab.is-active {
  background: var(--primary);
  border-color: var(--primary);
  color: white;
}

.section-scene .faq__question {
  color: #fff;
}

.section-scene .faq__answer p {
  color: rgba(255, 255, 255, 0.72);
}

.section-scene .testimonials__dot {
  background: rgba(255, 255, 255, 0.2);
}

.section-scene .testimonial-card {
  border-left: none;
}

.section-scene .contact__card svg {
  color: var(--logo-rose);
}

.section-scene .contact__form label {
  color: rgba(255, 255, 255, 0.85);
}

.section-scene .contact__form .form-group input,
.section-scene .contact__form .form-group select,
.section-scene .contact__form .form-group textarea {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.section-scene .contact__form .form-group input::placeholder,
.section-scene .contact__form .form-group textarea::placeholder {
  color: rgba(255, 255, 255, 0.4);
}

.section-scene .contact__form .form-group input:focus,
.section-scene .contact__form .form-group select:focus,
.section-scene .contact__form .form-group textarea:focus {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--logo-rose);
  box-shadow: 0 0 0 4px rgba(227, 46, 106, 0.18);
}

/* Windows: lista nativa do <select> ignora background do controle */
.section-scene .contact__form .form-group select {
  color-scheme: dark;
}

.section-scene .contact__form .form-group select option {
  background-color: #14101c;
  color: #fff;
}

.section-scene .gamer__stat {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.12);
}

.section-scene .gamer__stat::before {
  content: "";
  position: absolute;
  left: 0;
  top: 22%;
  bottom: 22%;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--logo-rose), var(--logo-cherry));
}

.section-scene .gamer__stat {
  position: relative;
  overflow: hidden;
}

.section-scene .gamer__stat-icon {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #ffb3c6;
}

.section-scene .gamer__stat--highlight {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(227, 46, 106, 0.4);
}

.section-scene .gamer__stat--highlight .gamer__stat-icon {
  background: rgba(227, 46, 106, 0.28);
  color: #fff;
  box-shadow: none;
}

.wlan-steps {
  position: relative;
  overflow: hidden;
  background: var(--gradient-hero);
  padding: 4.5rem 0 5rem;
  color: white;
}

.wlan-steps__bg {
  z-index: 0;
}

.wlan-steps__inner {
  position: relative;
  z-index: 2;
  max-width: 1120px;
  margin-inline: auto;
}

.wlan-steps__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 2.5rem 3rem;
  align-items: start;
}

.wlan-steps__visual {
  width: 100%;
  text-align: left;
}

.wlan-steps__title {
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 800;
  line-height: 1.15;
  margin-bottom: 1rem;
  color: #fff;
}

.wlan-steps__visual > p {
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 1.5rem;
  max-width: 34rem;
  line-height: 1.7;
}

.wlan-steps__visual img {
  max-width: 320px;
  border-radius: var(--radius);
  filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.4));
}

.wlan-steps__cta {
  margin-top: 1.75rem;
}

/* Animação jornada: plano → contrato → técnico → instalação → roteador */
.evox-journey {
  width: 100%;
  max-width: 520px;
}

.evox-journey--layout-left .evox-journey__caption {
  left: 0;
  transform: translateY(8px);
  width: 100%;
  max-width: none;
  text-align: left;
}

.evox-journey--layout-left .evox-journey__caption--1 { animation: evox-journey-caption-1-left 32s ease-in-out infinite; }
.evox-journey--layout-left .evox-journey__caption--2 { animation: evox-journey-caption-2-left 32s ease-in-out infinite; }
.evox-journey--layout-left .evox-journey__caption--3 { animation: evox-journey-caption-3-left 32s ease-in-out infinite; }
.evox-journey--layout-left .evox-journey__caption--4 { animation: evox-journey-caption-4-left 32s ease-in-out infinite; }
.evox-journey--layout-left .evox-journey__caption--5 { animation: evox-journey-caption-5-left 32s ease-in-out infinite; }

@keyframes evox-journey-caption-1-left {
  0%, 3% { opacity: 0; transform: translateY(8px); }
  5%, 17% { opacity: 1; transform: translateY(0); }
  19%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes evox-journey-caption-2-left {
  0%, 19% { opacity: 0; transform: translateY(8px); }
  21%, 37% { opacity: 1; transform: translateY(0); }
  39%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes evox-journey-caption-3-left {
  0%, 39% { opacity: 0; transform: translateY(8px); }
  41%, 55% { opacity: 1; transform: translateY(0); }
  57%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes evox-journey-caption-4-left {
  0%, 57% { opacity: 0; transform: translateY(8px); }
  59%, 73% { opacity: 1; transform: translateY(0); }
  75%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes evox-journey-caption-5-left {
  0%, 75% { opacity: 0; transform: translateY(8px); }
  77%, 96% { opacity: 1; transform: translateY(0); }
  98%, 100% { opacity: 0; transform: translateY(-6px); }
}

.evox-journey__viewport {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 300px;
  overflow: hidden;
  background: transparent;
  gap: 0.35rem;
}

.evox-journey__stage {
  position: relative;
  flex: 1;
  min-height: 0;
}

.evox-journey__scene {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.evox-journey__art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.evox-journey__captions {
  position: relative;
  flex: 0 0 5.75rem;
  z-index: 2;
  padding: 0 1rem;
}

.evox-journey__caption {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: min(100%, 22rem);
  text-align: center;
  opacity: 0;
  pointer-events: none;
}

.evox-journey__caption strong {
  display: block;
  font-size: 1.05rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.25;
  margin-bottom: 0.35rem;
}

.evox-journey__caption span {
  display: block;
  font-size: 0.8rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.72);
}

.evox-journey__caption span strong {
  display: inline;
  font-size: inherit;
  color: var(--logo-rose);
  margin: 0;
  text-shadow: none;
}

/* ── Cenas: visibilidade (ciclo 32s) ── */
.evox-journey__scene--1 { animation: evox-journey-scene-1 32s ease-in-out infinite; }
.evox-journey__scene--2 { animation: evox-journey-scene-2 32s ease-in-out infinite; }
.evox-journey__scene--3 { animation: evox-journey-scene-3 32s ease-in-out infinite; }
.evox-journey__scene--4 { animation: evox-journey-scene-4 32s ease-in-out infinite; }
.evox-journey__scene--5 { animation: evox-journey-scene-5 32s ease-in-out infinite; }

.evox-journey__caption--1 { animation: evox-journey-caption-1 32s ease-in-out infinite; }
.evox-journey__caption--2 { animation: evox-journey-caption-2 32s ease-in-out infinite; }
.evox-journey__caption--3 { animation: evox-journey-caption-3 32s ease-in-out infinite; }
.evox-journey__caption--4 { animation: evox-journey-caption-4 32s ease-in-out infinite; }
.evox-journey__caption--5 { animation: evox-journey-caption-5 32s ease-in-out infinite; }

@keyframes evox-journey-scene-1 {
  0%, 2% { opacity: 0; }
  4%, 18% { opacity: 1; }
  20%, 100% { opacity: 0; }
}

@keyframes evox-journey-scene-2 {
  0%, 18% { opacity: 0; }
  20%, 38% { opacity: 1; }
  40%, 100% { opacity: 0; }
}

@keyframes evox-journey-scene-3 {
  0%, 38% { opacity: 0; }
  40%, 56% { opacity: 1; }
  58%, 100% { opacity: 0; }
}

@keyframes evox-journey-scene-4 {
  0%, 56% { opacity: 0; }
  58%, 74% { opacity: 1; }
  76%, 100% { opacity: 0; }
}

@keyframes evox-journey-scene-5 {
  0%, 74% { opacity: 0; }
  76%, 98% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes evox-journey-caption-1 {
  0%, 3% { opacity: 0; transform: translate(-50%, 8px); }
  5%, 17% { opacity: 1; transform: translate(-50%, 0); }
  19%, 100% { opacity: 0; transform: translate(-50%, -6px); }
}

@keyframes evox-journey-caption-2 {
  0%, 19% { opacity: 0; transform: translate(-50%, 8px); }
  21%, 37% { opacity: 1; transform: translate(-50%, 0); }
  39%, 100% { opacity: 0; transform: translate(-50%, -6px); }
}

@keyframes evox-journey-caption-3 {
  0%, 39% { opacity: 0; transform: translate(-50%, 8px); }
  41%, 55% { opacity: 1; transform: translate(-50%, 0); }
  57%, 100% { opacity: 0; transform: translate(-50%, -6px); }
}

@keyframes evox-journey-caption-4 {
  0%, 57% { opacity: 0; transform: translate(-50%, 8px); }
  59%, 73% { opacity: 1; transform: translate(-50%, 0); }
  75%, 100% { opacity: 0; transform: translate(-50%, -6px); }
}

@keyframes evox-journey-caption-5 {
  0%, 75% { opacity: 0; transform: translate(-50%, 8px); }
  77%, 96% { opacity: 1; transform: translate(-50%, 0); }
  98%, 100% { opacity: 0; transform: translate(-50%, -6px); }
}

/* ── Micro-animações por cena ── */
.evox-journey__plan-pick {
  animation: evox-journey-pick 32s ease-in-out infinite;
}

.evox-journey__coupon-type {
  animation: evox-journey-coupon 32s ease-in-out infinite;
}

.evox-journey__arm-point {
  animation: evox-journey-point 32s ease-in-out infinite;
  transform-origin: 108px 108px;
}

@keyframes evox-journey-pick {
  0%, 6% { stroke: rgba(255, 255, 255, 0.2); }
  8%, 17% { stroke: var(--logo-rose); filter: drop-shadow(0 0 6px rgba(227, 46, 106, 0.6)); }
  19%, 100% { stroke: rgba(255, 255, 255, 0.2); filter: none; }
}

@keyframes evox-journey-coupon {
  0%, 9% { opacity: 0; }
  11%, 17% { opacity: 1; }
  19%, 100% { opacity: 0.3; }
}

@keyframes evox-journey-point {
  0%, 7% { transform: rotate(0deg); }
  10%, 16% { transform: rotate(-8deg); }
  18%, 100% { transform: rotate(0deg); }
}

.evox-journey__signature {
  stroke-dasharray: 120;
  stroke-dashoffset: 120;
  animation: evox-journey-sign 32s ease-in-out infinite;
}

.evox-journey__pen {
  animation: evox-journey-pen 32s ease-in-out infinite;
  transform-origin: 136px 106px;
}

@keyframes evox-journey-sign {
  0%, 22% { stroke-dashoffset: 120; opacity: 0; }
  24% { opacity: 1; }
  28%, 36% { stroke-dashoffset: 0; opacity: 1; }
  38%, 100% { stroke-dashoffset: 0; opacity: 0; }
}

@keyframes evox-journey-pen {
  0%, 22% { transform: rotate(0deg); }
  26%, 34% { transform: rotate(6deg) translate(2px, 2px); }
  36%, 100% { transform: rotate(0deg); }
}

.evox-journey__van {
  animation: evox-journey-drive 32s linear infinite;
}

@keyframes evox-journey-drive {
  0%, 40% { transform: translateX(0); opacity: 0; }
  41% { opacity: 1; transform: translateX(0); }
  55% { transform: translateX(280px); opacity: 1; }
  57%, 100% { transform: translateX(280px); opacity: 0; }
}

.evox-journey__fiber-cable {
  stroke-dasharray: 80;
  stroke-dashoffset: 80;
  animation: evox-journey-fiber 32s ease-in-out infinite;
}

.evox-journey__toolbox {
  animation: evox-journey-tool 32s ease-in-out infinite;
}

@keyframes evox-journey-fiber {
  0%, 60% { stroke-dashoffset: 80; opacity: 0; }
  62% { opacity: 1; }
  68%, 72% { stroke-dashoffset: 0; opacity: 1; }
  74%, 100% { stroke-dashoffset: 0; opacity: 0; }
}

@keyframes evox-journey-tool {
  0%, 59% { opacity: 0; transform: translateY(6px); }
  61%, 72% { opacity: 1; transform: translateY(0); }
  74%, 100% { opacity: 0; }
}

/* ── Roteador: desenho progressivo (cena 5) ── */
.evox-router-draw__path {
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  fill: none;
}

.evox-journey__scene--5 .evox-router-draw__path--1 { animation: evox-router-draw-1 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--2 { animation: evox-router-draw-2 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--3 { animation: evox-router-draw-3 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--4 { animation: evox-router-draw-4 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--5 { animation: evox-router-draw-5 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--6 { animation: evox-router-draw-6 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--7 { animation: evox-router-draw-7 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--8 { animation: evox-router-draw-8 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__path--9 { animation: evox-router-draw-9 32s ease-in-out infinite; }

.evox-router-draw__fill {
  opacity: 0;
}

.evox-journey__scene--5 .evox-router-draw__fill--1 { animation: evox-router-fill-zte 32s ease-in-out infinite; }
.evox-journey__scene--5 .evox-router-draw__fill--2 { animation: evox-router-fill-body 32s ease-in-out infinite; }

.evox-journey__wifi-done {
  opacity: 0;
  animation: evox-router-wifi-done 32s ease-in-out infinite;
}

@keyframes evox-router-draw-1 {
  0%, 76% { stroke-dashoffset: 400; }
  79%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-2 {
  0%, 78% { stroke-dashoffset: 400; }
  82%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-3 {
  0%, 80% { stroke-dashoffset: 400; }
  84%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-4 {
  0%, 82% { stroke-dashoffset: 400; }
  86%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-5 {
  0%, 84% { stroke-dashoffset: 400; }
  88%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-6 {
  0%, 86% { stroke-dashoffset: 400; }
  89%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-7 {
  0%, 87% { stroke-dashoffset: 400; }
  90%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-8 {
  0%, 88% { stroke-dashoffset: 400; }
  91%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-draw-9 {
  0%, 89% { stroke-dashoffset: 400; }
  92%, 100% { stroke-dashoffset: 0; }
}

@keyframes evox-router-fill-zte {
  0%, 91% { opacity: 0; }
  93%, 100% { opacity: 1; }
}

@keyframes evox-router-fill-body {
  0%, 92% { opacity: 0; }
  94%, 100% { opacity: 1; }
}

@keyframes evox-router-wifi-done {
  0%, 93% { opacity: 0; transform: scale(0.65); }
  95%, 100% { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .evox-journey__scene,
  .evox-journey__caption,
  .evox-journey__plan-pick,
  .evox-journey__coupon-type,
  .evox-journey__arm-point,
  .evox-journey__signature,
  .evox-journey__pen,
  .evox-journey__van,
  .evox-journey__fiber-cable,
  .evox-journey__toolbox,
  .evox-router-draw__path,
  .evox-router-draw__fill,
  .evox-journey__wifi-done,
  .wlan-feature-draw__path {
    animation: none !important;
  }

  .wlan-feature-draw__path {
    stroke-dashoffset: 0;
  }

  .wlan-features__stack .wlan-features__card {
    opacity: 1;
    transform: none;
    animation: none !important;
  }

  .wlan-features__stack .wlan-features__card::before {
    opacity: 1;
    transform: scaleY(1);
  }

  .evox-journey--layout-left .evox-journey__caption--1 {
    opacity: 1;
    transform: translateY(0);
  }

  .evox-journey__scene--1 { opacity: 1; }
  .evox-journey__scene--2,
  .evox-journey__scene--3,
  .evox-journey__scene--4,
  .evox-journey__scene--5 { display: none; }

  .evox-journey__caption--1 {
    opacity: 1;
    transform: translate(-50%, 0);
  }

  .evox-journey__caption--2,
  .evox-journey__caption--3,
  .evox-journey__caption--4,
  .evox-journey__caption--5 { display: none; }

  .evox-router-draw__path { stroke-dashoffset: 0; }
  .evox-journey__signature { stroke-dashoffset: 0; opacity: 1; }
}

@media (max-width: 900px) {
  .evox-journey__viewport {
    height: 280px;
  }

  .evox-journey__captions {
    flex-basis: 5.25rem;
  }

  .evox-journey__caption strong {
    font-size: 0.95rem;
  }

  .evox-journey__caption span {
    font-size: 0.75rem;
  }
}

/* Animação legada (preview opção A) */
.evox-install-flow {
  max-width: 400px;
  margin-inline: auto;
  margin-top: 0.25rem;
}

.evox-install-flow__stage {
  position: relative;
  padding: 1.25rem 1rem 1.5rem;
  border-radius: var(--radius-lg);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.35);
  overflow: hidden;
}

.evox-install-flow__stage::before {
  content: "";
  position: absolute;
  inset: -40% -20% auto;
  height: 70%;
  background: radial-gradient(ellipse at center, rgba(227, 46, 106, 0.18) 0%, transparent 70%);
  pointer-events: none;
}

.evox-install-flow__track {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
  gap: 0;
}

.evox-install-flow__node {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
}

.evox-install-flow__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  border: 2px solid rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.5);
  transition: border-color 0.4s, background 0.4s, color 0.4s, box-shadow 0.4s, transform 0.4s;
}

.evox-install-flow__icon svg {
  width: 1.15rem;
  height: 1.15rem;
}

.evox-install-flow__label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.45);
  transition: color 0.4s;
}

.evox-install-flow__line {
  flex: 1;
  height: 2px;
  margin: 0 0.25rem;
  margin-bottom: 1.1rem;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 2px;
  overflow: hidden;
  list-style: none;
}

.evox-install-flow__line span {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--logo-magenta), var(--logo-cherry));
  border-radius: inherit;
}

.evox-install-flow__captions {
  position: relative;
  z-index: 2;
  height: 5.5rem;
  margin: 0.15rem 0 0.5rem;
}

.evox-install-flow__caption {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0 0.75rem;
  text-align: center;
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
}

.evox-install-flow__caption strong {
  font-size: 1rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
}

.evox-install-flow__caption span {
  font-size: 0.78rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.72);
  max-width: 18rem;
}

.evox-install-flow__caption span strong {
  font-size: inherit;
  color: var(--logo-rose);
}

.evox-install-flow__home {
  position: relative;
  z-index: 1;
  height: 140px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.evox-install-flow__fiber {
  position: absolute;
  left: 0;
  bottom: 2.5rem;
  width: 55%;
  height: 3px;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 3px;
  overflow: hidden;
}

.evox-install-flow__fiber::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 28%;
  background: linear-gradient(90deg, transparent, var(--logo-cherry), #fff, var(--logo-cherry), transparent);
  animation: evox-fiber-pulse 2.4s ease-in-out infinite;
}

.evox-install-flow__router {
  position: relative;
  width: 4.5rem;
  height: 1.35rem;
  background: linear-gradient(180deg, #2a2a4a 0%, #1a1a32 100%);
  border-radius: 0.35rem;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45);
}

.evox-install-flow__router::before {
  content: "";
  position: absolute;
  inset: 0.35rem 0.5rem auto;
  height: 0.35rem;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 2px;
}

.evox-install-flow__router-led {
  position: absolute;
  left: 0.45rem;
  bottom: 0.35rem;
  width: 0.35rem;
  height: 0.35rem;
  border-radius: 50%;
  background: var(--logo-cherry);
  animation: evox-led-blink 1.2s ease-in-out infinite;
}

.evox-install-flow__router-ant {
  position: absolute;
  top: -0.65rem;
  width: 2px;
  height: 0.55rem;
  background: rgba(255, 255, 255, 0.35);
  border-radius: 2px;
}

.evox-install-flow__router-ant:first-of-type {
  left: 1.1rem;
  transform: rotate(-12deg);
}

.evox-install-flow__router-ant:last-of-type {
  right: 1.1rem;
  transform: rotate(12deg);
}

.evox-install-flow__wifi {
  position: absolute;
  bottom: 2.2rem;
  left: 50%;
  transform: translateX(-50%);
  width: 5rem;
  height: 2.5rem;
  pointer-events: none;
}

.evox-install-flow__wifi span {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  border: 2px solid transparent;
  border-top-color: var(--logo-rose);
  border-radius: 50% 50% 0 0;
  opacity: 0;
  animation: evox-wifi-wave 2.4s ease-out infinite;
}

.evox-install-flow__wifi span:nth-child(1) {
  width: 1.5rem;
  height: 0.75rem;
  animation-delay: 0s;
}

.evox-install-flow__wifi span:nth-child(2) {
  width: 2.5rem;
  height: 1.25rem;
  animation-delay: 0.35s;
}

.evox-install-flow__wifi span:nth-child(3) {
  width: 3.5rem;
  height: 1.75rem;
  animation-delay: 0.7s;
}

.evox-install-flow__devices {
  position: absolute;
  inset: 0.5rem 0.75rem auto;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
}

.evox-install-flow__devices span {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: var(--logo-cherry);
  opacity: 0;
  box-shadow: 0 0 8px rgba(255, 61, 96, 0.6);
  animation: evox-device-pop 2.4s ease-in-out infinite;
}

.evox-install-flow__devices span:nth-child(1) { animation-delay: 1.6s; }
.evox-install-flow__devices span:nth-child(2) { animation-delay: 1.85s; }
.evox-install-flow__devices span:nth-child(3) { animation-delay: 2.1s; }

@keyframes evox-fiber-pulse {
  0% { left: -30%; opacity: 0; }
  20% { opacity: 1; }
  100% { left: 100%; opacity: 0; }
}

@keyframes evox-wifi-wave {
  0% { opacity: 0; transform: translateX(-50%) scale(0.6); }
  30% { opacity: 0.85; }
  100% { opacity: 0; transform: translateX(-50%) scale(1.15); }
}

@keyframes evox-led-blink {
  0%, 100% { opacity: 1; box-shadow: 0 0 6px var(--logo-cherry); }
  50% { opacity: 0.45; box-shadow: none; }
}

@keyframes evox-device-pop {
  0%, 55% { opacity: 0; transform: translateY(6px) scale(0.5); }
  70% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0.35; transform: translateY(-4px) scale(0.9); }
}

@keyframes evox-step-plan {
  0%, 100% { border-color: rgba(255, 255, 255, 0.85); background: rgba(227, 46, 106, 0.35); color: #fff; box-shadow: 0 0 20px rgba(227, 46, 106, 0.45); transform: scale(1.08); }
  33%, 66% { border-color: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.5); box-shadow: none; transform: scale(1); }
}

@keyframes evox-step-sign {
  0%, 33%, 100% { border-color: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.5); box-shadow: none; transform: scale(1); }
  34%, 66% { border-color: rgba(255, 255, 255, 0.85); background: rgba(227, 46, 106, 0.35); color: #fff; box-shadow: 0 0 20px rgba(227, 46, 106, 0.45); transform: scale(1.08); }
}

@keyframes evox-step-install {
  0%, 66%, 100% { border-color: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.5); box-shadow: none; transform: scale(1); }
  67%, 95% { border-color: rgba(255, 255, 255, 0.85); background: rgba(227, 46, 106, 0.35); color: #fff; box-shadow: 0 0 20px rgba(227, 46, 106, 0.45); transform: scale(1.08); }
}

@keyframes evox-line-fill-1 {
  0%, 33% { width: 100%; }
  34%, 100% { width: 100%; }
}

@keyframes evox-line-fill-2 {
  0%, 33% { width: 0; }
  34%, 66% { width: 100%; }
  67%, 100% { width: 100%; }
}

@keyframes evox-label-plan {
  0%, 32% { color: #fff; }
  33%, 100% { color: rgba(255, 255, 255, 0.45); }
}

@keyframes evox-label-sign {
  0%, 33% { color: rgba(255, 255, 255, 0.45); }
  34%, 65% { color: #fff; }
  66%, 100% { color: rgba(255, 255, 255, 0.45); }
}

@keyframes evox-label-install {
  0%, 66% { color: rgba(255, 255, 255, 0.45); }
  67%, 95% { color: #fff; }
  96%, 100% { color: rgba(255, 255, 255, 0.45); }
}

@keyframes evox-caption-plan {
  0%, 5% { opacity: 0; transform: translateY(8px); }
  8%, 30% { opacity: 1; transform: translateY(0); }
  33%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes evox-caption-sign {
  0%, 33% { opacity: 0; transform: translateY(8px); }
  36%, 63% { opacity: 1; transform: translateY(0); }
  66%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes evox-caption-install {
  0%, 66% { opacity: 0; transform: translateY(8px); }
  69%, 93% { opacity: 1; transform: translateY(0); }
  96%, 100% { opacity: 0; transform: translateY(-6px); }
}

.evox-install-flow__caption--plan {
  animation: evox-caption-plan 7.2s ease-in-out infinite;
}

.evox-install-flow__caption--sign {
  animation: evox-caption-sign 7.2s ease-in-out infinite;
}

.evox-install-flow__caption--install {
  animation: evox-caption-install 7.2s ease-in-out infinite;
}

.evox-install-flow__node--plan .evox-install-flow__icon {
  animation: evox-step-plan 7.2s ease-in-out infinite;
}

.evox-install-flow__node--sign .evox-install-flow__icon {
  animation: evox-step-sign 7.2s ease-in-out infinite;
}

.evox-install-flow__node--install .evox-install-flow__icon {
  animation: evox-step-install 7.2s ease-in-out infinite;
}

.evox-install-flow__node--plan .evox-install-flow__label {
  animation: evox-label-plan 7.2s ease-in-out infinite;
}

.evox-install-flow__node--sign .evox-install-flow__label {
  animation: evox-label-sign 7.2s ease-in-out infinite;
}

.evox-install-flow__node--install .evox-install-flow__label {
  animation: evox-label-install 7.2s ease-in-out infinite;
}

.evox-install-flow__line:first-of-type span {
  animation: evox-line-fill-1 7.2s ease-in-out infinite;
}

.evox-install-flow__line:last-of-type span {
  animation: evox-line-fill-2 7.2s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  .evox-install-flow__fiber::after,
  .evox-install-flow__wifi span,
  .evox-install-flow__router-led,
  .evox-install-flow__devices span,
  .evox-install-flow__node .evox-install-flow__icon,
  .evox-install-flow__node .evox-install-flow__label,
  .evox-install-flow__line span,
  .evox-install-flow__caption {
    animation: none;
  }

  .evox-install-flow__caption--plan {
    opacity: 1;
    transform: none;
  }

  .evox-install-flow__caption--sign,
  .evox-install-flow__caption--install {
    display: none;
  }

  .evox-install-flow__node--plan .evox-install-flow__icon,
  .evox-install-flow__node--plan .evox-install-flow__label {
    border-color: rgba(255, 255, 255, 0.85);
    background: rgba(227, 46, 106, 0.35);
    color: #fff;
  }

  .evox-install-flow__line span {
    width: 100%;
  }

  .evox-install-flow__wifi span:nth-child(2) {
    opacity: 0.6;
  }

  .evox-install-flow__devices span {
    opacity: 0.7;
  }
}

.wlan-steps__list {
  counter-reset: wlan-step;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.wlan-steps__list li {
  position: relative;
  padding-left: 0;
}

.wlan-steps__list li strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 800;
  margin-bottom: 0.35rem;
}

.wlan-steps__list li span {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.6;
}

.wlan-steps__cta {
  margin-top: 0.25rem;
}

.hero-promo__photo {
  opacity: 0.28;
}

/* ========== SEO local ========== */
.local-seo {
  background: var(--bg-soft);
}

.local-seo__header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 2.5rem;
}

.local-seo__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.local-seo__card {
  background: white;
  border: 1px solid rgba(227, 46, 106, 0.12);
  border-radius: var(--radius);
  padding: 1.75rem;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}

.local-seo__card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: rgba(227, 46, 106, 0.22);
}

.local-seo__card h3 {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.75rem;
  line-height: 1.25;
}

.local-seo__card p {
  font-size: 0.92rem;
  color: var(--text-muted);
  line-height: 1.65;
  margin-bottom: 1rem;
}

.local-seo__link {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--primary);
}

.local-seo__link:hover {
  text-decoration: underline;
}

@media (max-width: 900px) {
  .local-seo__grid {
    grid-template-columns: 1fr;
  }

  .wlan-steps__layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .wlan-features__grid {
    grid-template-columns: 1fr;
  }

  .wlan-steps__inner {
    max-width: 100%;
  }

  .evox-journey {
    max-width: 100%;
  }
}

/* ── City hub (home) ── */
.city-hub__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}

.city-hub__card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.75rem;
  background: white;
  border: 1px solid rgba(227, 46, 106, 0.12);
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: inherit;
  box-shadow: var(--shadow-sm);
  transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
}

.city-hub__card:hover {
  border-color: rgba(227, 46, 106, 0.28);
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.city-hub__badge {
  align-self: flex-start;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  background: rgba(227, 46, 106, 0.12);
  color: var(--primary);
}

.city-hub__title {
  font-size: 1.35rem;
  font-weight: 800;
  margin: 0;
  color: var(--text);
}

.city-hub__desc {
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--text-muted);
  margin: 0;
}

.city-hub__bairros {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.city-hub__bairros li {
  font-size: 0.75rem;
  padding: 0.2rem 0.55rem;
  background: var(--bg-soft);
  border-radius: 999px;
  color: var(--text-muted);
}

.city-hub__link {
  margin-top: auto;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--primary);
}

/* ── City pages ── */
.utility-card--compact {
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
}

.city-hero {
  padding: 7rem 0 4rem;
  background: linear-gradient(160deg, var(--bg) 0%, rgba(227, 46, 106, 0.06) 100%);
}

.city-hero__inner {
  max-width: 760px;
}

.city-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  margin-bottom: 1.25rem;
  color: var(--text-muted);
}

.city-breadcrumb a {
  color: var(--primary);
  text-decoration: none;
}

.city-breadcrumb a:hover {
  text-decoration: underline;
}

.city-hero__title {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 900;
  line-height: 1.15;
  margin: 0 0 1rem;
}

.city-hero__title span {
  color: var(--primary);
}

.city-hero__lead {
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--text-muted);
  margin: 0 0 1.75rem;
}

.city-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.city-hero__btn-outline {
  border-color: rgba(227, 46, 106, 0.35);
  color: var(--secondary);
}

.city-content__grid {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 2.5rem;
  align-items: start;
}

.city-prose h2 {
  font-size: 1.35rem;
  font-weight: 800;
  margin: 0 0 1rem;
}

.city-prose h2:not(:first-child) {
  margin-top: 2rem;
}

.city-prose p {
  line-height: 1.7;
  color: var(--text-muted);
  margin: 0 0 1rem;
}

.city-prose__list {
  padding-left: 1.25rem;
  line-height: 1.8;
  color: var(--text-muted);
}

.city-prose h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin: 1.5rem 0 0.65rem;
  color: var(--secondary);
}

.city-prose ul:not(.city-prose__list) {
  padding-left: 1.25rem;
  line-height: 1.8;
  color: var(--text-muted);
  margin: 0 0 1rem;
}

.legal-content {
  padding: 2.5rem 0 5rem;
  background: white;
}

.legal-content__inner {
  max-width: 760px;
}

.legal-meta {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bg-soft);
}

.legal-contact-box {
  margin-top: 2rem;
  padding: 1.25rem 1.5rem;
  background: var(--bg-soft);
  border-radius: var(--radius);
  border: 1px solid rgba(3, 5, 65, 0.08);
}

.legal-contact-box p {
  margin-bottom: 0.35rem;
}

.legal-contact-box p:last-child {
  margin-bottom: 0;
}

/* ========== Contratos e Regulamentos ========== */
.contrato-page {
  max-width: 820px;
}

.contrato-tabs {
  display: inline-flex;
  gap: 0.35rem;
  padding: 0.35rem;
  margin-bottom: 1.75rem;
  background: var(--bg-soft);
  border-radius: 999px;
  border: 1px solid rgba(3, 5, 65, 0.08);
}

.contrato-tabs__btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  font-family: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.65rem 1.25rem;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s;
}

.contrato-tabs__btn.is-active {
  background: #fff;
  color: var(--logo-navy);
  box-shadow: 0 2px 12px rgba(3, 5, 65, 0.08);
}

.contrato-panel__head {
  margin-bottom: 1rem;
}

.contrato-panel__head h2 {
  font-size: 1.35rem;
  margin: 0 0 0.25rem;
}

.contrato-panel__head p {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.95rem;
}

.contrato-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.contrato-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.15rem;
  background: #fff;
  border: 1px solid rgba(3, 5, 65, 0.1);
  border-radius: var(--radius);
  box-shadow: 0 2px 16px rgba(3, 5, 65, 0.04);
}

.contrato-item__icon {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.65rem;
  background: rgba(227, 46, 106, 0.08);
  color: var(--logo-cherry);
  flex-shrink: 0;
}

.contrato-item__icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

.contrato-item__body {
  min-width: 0;
}

.contrato-item__tag {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--logo-cherry);
  margin-bottom: 0.2rem;
}

.contrato-item__body h3 {
  font-size: 1rem;
  margin: 0 0 0.2rem;
  line-height: 1.3;
}

.contrato-item__body p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.45;
}

.contrato-item__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}

.contrato-note {
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(3, 5, 65, 0.08);
  color: var(--text-muted);
  font-size: 0.9rem;
}

@media (max-width: 720px) {
  .contrato-tabs {
    display: flex;
    width: 100%;
  }

  .contrato-tabs__btn {
    flex: 1;
    text-align: center;
    padding-inline: 0.75rem;
  }

  .contrato-item {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
  }

  .contrato-item__actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  .contrato-item__actions .btn {
    flex: 1;
    justify-content: center;
  }
}

.city-aside {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: sticky;
  top: 6rem;
}

.city-aside__box {
  padding: 1.5rem;
  background: white;
  border: 1px solid rgba(227, 46, 106, 0.12);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.city-aside__box h3 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

.city-aside__box p {
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--text-muted);
  margin: 0 0 0.5rem;
}

.city-aside__box--muted {
  background: rgba(227, 46, 106, 0.05);
  border-color: rgba(227, 46, 106, 0.2);
}

.city-aside__plan {
  font-weight: 700;
  color: var(--text) !important;
}

.city-aside__price {
  font-size: 1.15rem !important;
  font-weight: 800;
  color: var(--primary) !important;
}

.city-aside__link {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--primary);
  text-decoration: none;
}

.city-aside__link:hover {
  text-decoration: underline;
}

.city-coverage__header {
  text-align: center;
  margin-bottom: 2rem;
}

.coverage__list--city {
  justify-content: center;
  margin-bottom: 1.5rem;
}

.coverage__list--municipios {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: 0.35rem 1rem;
  justify-content: stretch;
  text-align: left;
  max-height: none;
}

.coverage__list--municipios a {
  color: var(--text-muted);
  font-size: 0.875rem;
  text-decoration: none;
  transition: color 0.2s;
}

.coverage__list--municipios a:hover {
  color: var(--logo-rose);
}

.city-coverage__note {
  text-align: center;
  color: var(--text-muted);
  margin: 0 0 1.25rem;
  max-width: 540px;
  margin-inline: auto;
}

.city-coverage .coverage__inner {
  text-align: center;
}

.city-faq .section__title {
  text-align: center;
  margin-bottom: 2rem;
}

.city-nearby__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-top: 1.5rem;
}

.city-nearby__card {
  display: block;
  padding: 1.25rem 1.5rem;
  background: white;
  border: 1px solid rgba(227, 46, 106, 0.12);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  text-decoration: none;
  color: var(--text-muted);
  font-size: 0.95rem;
  transition: border-color 0.2s, color 0.2s;
}

.city-nearby__card:hover {
  border-color: var(--primary);
  color: var(--text);
}

.city-nearby__card strong {
  color: var(--primary);
}

@media (max-width: 900px) {
  .city-hub__grid {
    grid-template-columns: 1fr;
  }

  .city-content__grid {
    grid-template-columns: 1fr;
  }

  .city-aside {
    position: static;
  }

  .city-nearby__grid {
    grid-template-columns: 1fr;
  }

  .city-hero__ctas {
    flex-direction: column;
  }

  .city-hero__ctas .btn {
    width: 100%;
    text-align: center;
  }
}

/* ========== Trabalhe Conosco ========== */
.utility-card--active {
  border-color: rgba(227, 46, 106, 0.35);
  background: rgba(227, 46, 106, 0.04);
}

.careers-page-hero {
  padding-bottom: 2rem;
}

.careers {
  background: var(--bg-soft);
}

.careers__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
}

.careers__info p {
  color: var(--text-muted);
  margin-bottom: 1.5rem;
}

.careers__benefits {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.careers__benefits li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.95rem;
  color: var(--secondary);
  font-weight: 600;
}

.careers__benefits svg {
  width: 20px;
  height: 20px;
  color: var(--primary);
  flex-shrink: 0;
}

.careers__note {
  font-size: 0.9rem;
  color: var(--text-muted);
  padding: 1rem 1.25rem;
  background: white;
  border-radius: var(--radius);
  border-left: 3px solid var(--primary);
}

.file-upload {
  position: relative;
}

.file-upload__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.file-upload__zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 2rem 1.5rem;
  border: 2px dashed rgba(227, 46, 106, 0.35);
  border-radius: var(--radius);
  background: var(--bg-soft);
  cursor: pointer;
  text-align: center;
  transition: var(--transition);
}

.file-upload__zone:hover,
.file-upload__zone.is-dragover {
  border-color: var(--primary);
  background: rgba(227, 46, 106, 0.04);
}

.file-upload__zone svg {
  width: 32px;
  height: 32px;
  color: var(--primary);
}

.file-upload__zone p {
  margin: 0;
  font-size: 0.9rem;
  color: var(--text-muted);
}

.file-upload__zone strong {
  color: var(--primary);
}

.file-upload__hint {
  font-size: 0.78rem;
  color: var(--text-muted);
}

.file-upload__selected {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: var(--bg-soft);
  border: 1px solid rgba(227, 46, 106, 0.2);
  border-radius: var(--radius);
}

.file-upload__selected svg {
  width: 22px;
  height: 22px;
  color: var(--primary);
  flex-shrink: 0;
}

.file-upload__name {
  flex: 1;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--secondary);
  word-break: break-all;
}

.file-upload__remove {
  border: none;
  background: transparent;
  color: var(--primary);
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  padding: 0.25rem 0.5rem;
}

.file-upload__remove:hover {
  text-decoration: underline;
}

@media (max-width: 900px) {
  .careers__inner {
    grid-template-columns: 1fr;
  }
}

/* ========== Página institucional (Trabalhe Conosco) ========== */
.top-bar__switches {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: 0.15rem;
}

.top-bar__switch--ghost {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.28);
}

.page-institucional .nav--institutional .nav__inner {
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.15rem 0.35rem;
}

.page-institucional .nav--institutional .nav__link svg {
  width: 16px;
  height: 16px;
}

.careers-contact {
  background: white;
  padding-top: 2rem;
  padding-bottom: 4rem;
}

.careers-contact__inner {
  max-width: 820px;
  margin: 0 auto;
  text-align: center;
}

.careers-contact__lead {
  color: var(--text-muted);
  margin: 0 auto 2rem;
  max-width: 520px;
}

.careers-contact__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.careers-contact__card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.15rem 1.25rem;
  border-radius: var(--radius);
  background: var(--bg-soft);
  border: 1px solid rgba(3, 5, 65, 0.08);
  text-decoration: none;
  color: inherit;
  transition: var(--transition);
}

.careers-contact__card:hover {
  border-color: rgba(227, 46, 106, 0.25);
  transform: translateY(-2px);
  box-shadow: var(--shadow-sm);
}

.careers-contact__card strong {
  font-size: 0.95rem;
  color: var(--secondary);
}

.careers-contact__card span {
  font-size: 0.82rem;
  color: var(--text-muted);
}

.careers-contact__card--wa:hover {
  border-color: rgba(37, 211, 102, 0.35);
}

@media (max-width: 640px) {
  .top-bar__switches {
    display: none;
  }

  .careers-contact__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .page-institucional .nav--institutional .nav__inner {
    justify-content: flex-start;
  }
}

/* ========== Portal Landing (index.html) ========== */
.portal-page {
  background: var(--secondary);
  min-height: 100vh;
}

.portal-page .header--portal {
  position: relative;
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.portal-page .header--portal .logo__img {
  filter: brightness(0) invert(1);
}

.portal-page main.portal {
  min-height: calc(100vh - 140px);
  display: flex;
  flex-direction: column;
}

.portal-page .portal__hero {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  padding: 3rem 0 4rem;
  overflow: hidden;
}

.portal-page .portal__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.portal-page .portal__gradient {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 20% 40%, rgba(59, 130, 246, 0.15) 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 85% 70%, rgba(139, 92, 246, 0.1) 0%, transparent 50%),
    linear-gradient(165deg, #0a0f1a 0%, #111827 45%, #0d1526 100%);
}

.portal-page .portal__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 56rem;
  margin: 0 auto;
  grid-template-columns: unset;
  gap: 0;
}

.portal-page .portal__tag {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.65);
  margin-bottom: 1rem;
}

.portal-page .portal__title {
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 800;
  color: white;
  line-height: 1.15;
  margin-bottom: 1rem;
}

.portal-page .portal__title span {
  background: linear-gradient(135deg, var(--primary-light) 0%, #93c5fd 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-page .portal__lead {
  font-size: 1.05rem;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.65;
  max-width: 42rem;
  margin: 0 auto 2.5rem;
}

.portal-page .portal__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  width: 100%;
  max-width: 52rem;
  text-align: left;
}

.portal-card {
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: calc(var(--radius) + 4px);
  padding: 2rem;
  color: white;
  transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
  text-decoration: none;
}

.portal-card:hover {
  transform: translateY(-6px);
  border-color: rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.09);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
}

.portal-card--residencial:hover {
  border-color: rgba(59, 130, 246, 0.45);
}

.portal-card--empresas:hover {
  border-color: rgba(139, 92, 246, 0.45);
}

.portal-card__icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
}

.portal-card--residencial .portal-card__icon {
  background: rgba(59, 130, 246, 0.18);
  color: #93c5fd;
}

.portal-card--empresas .portal-card__icon {
  background: rgba(139, 92, 246, 0.18);
  color: #c4b5fd;
}

.portal-card__icon svg {
  width: 26px;
  height: 26px;
}

.portal-card__title {
  font-size: 1.35rem;
  font-weight: 800;
  margin-bottom: 0.65rem;
  color: white;
}

.portal-card__desc {
  font-size: 0.92rem;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.6;
  margin-bottom: 1.25rem;
  flex: 1;
}

.portal-card__list {
  list-style: none;
  margin: 0 0 1.5rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.portal-card__list li {
  position: relative;
  padding-left: 1.25rem;
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.85);
}

.portal-card__list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--primary-light);
  font-weight: 700;
}

.portal-card__cta {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--primary-light);
  margin-top: auto;
}

.portal-card--empresas .portal-card__cta {
  color: #c4b5fd;
}

.footer--portal {
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 1.5rem 0;
}

.footer--portal .footer__bottom p {
  color: rgba(255, 255, 255, 0.45);
  font-size: 0.85rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 768px) {
  .portal-page .portal__hero {
    padding: 2rem 0 5.5rem;
  }

  .portal-page .portal__cards {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .portal-card {
    padding: 1.5rem;
  }
}

/* ========== Portal Landing v2 — Split Screen ========== */
.portal-page--v2 {
  background: var(--logo-black);
  min-height: 100vh;
}

.portal-page--v2 .header--portal-v2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.72) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v2 .header--portal-v2 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-split {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
}

.portal-split__panel {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 100vh;
  overflow: hidden;
  color: white;
  text-decoration: none;
  transition: flex-grow 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-split__media {
  position: absolute;
  inset: 0;
}

.portal-split__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-split__overlay {
  position: absolute;
  inset: 0;
  transition: opacity 0.35s ease;
}

.portal-split__panel--res .portal-split__overlay {
  background:
    linear-gradient(0deg, rgba(10, 10, 10, 0.92) 0%, rgba(10, 10, 10, 0.35) 55%, rgba(10, 10, 10, 0.15) 100%),
    linear-gradient(135deg, rgba(199, 32, 123, 0.55) 0%, rgba(227, 46, 106, 0.35) 100%);
}

.portal-split__panel--emp .portal-split__overlay {
  background:
    linear-gradient(0deg, rgba(10, 10, 10, 0.92) 0%, rgba(10, 10, 10, 0.35) 55%, rgba(10, 10, 10, 0.15) 100%),
    linear-gradient(135deg, rgba(30, 58, 95, 0.65) 0%, rgba(15, 23, 42, 0.5) 100%);
}

.portal-split__panel:hover .portal-split__media img,
.portal-split__panel:focus-visible .portal-split__media img {
  transform: scale(1.06);
}

.portal-split__panel:hover .portal-split__overlay,
.portal-split__panel:focus-visible .portal-split__overlay {
  opacity: 0.88;
}

.portal-split__panel:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
}

.portal-split__content {
  position: relative;
  z-index: 2;
  padding: 2.5rem 2.75rem 3rem;
  max-width: 28rem;
}

.portal-split__icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
  margin-bottom: 1.25rem;
}

.portal-split__icon svg {
  width: 24px;
  height: 24px;
}

.portal-split__label {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.65);
  margin-bottom: 0.5rem;
}

.portal-split__title {
  font-size: clamp(1.75rem, 3.5vw, 2.35rem);
  font-weight: 800;
  line-height: 1.15;
  margin-bottom: 0.75rem;
}

.portal-split__desc {
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.6;
  margin-bottom: 1.25rem;
}

.portal-split__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.75rem;
  list-style: none;
  padding: 0;
}

.portal-split__tags li {
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.portal-split__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: white;
  transition: gap 0.25s ease;
}

.portal-split__cta svg {
  width: 20px;
  height: 20px;
  transition: transform 0.25s ease;
}

.portal-split__panel:hover .portal-split__cta svg,
.portal-split__panel:focus-visible .portal-split__cta svg {
  transform: translateX(4px);
}

.portal-split__badge {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  pointer-events: none;
}

.portal-split__badge-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
  justify-content: center;
  padding: 0.75rem;
}

.portal-split__badge-inner img {
  width: 52px;
  height: auto;
  object-fit: contain;
}

.portal-split__badge-inner span {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}

.portal-strip {
  background: white;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 1.25rem 0;
}

.portal-strip__inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

.portal-strip__item {
  text-align: center;
}

.portal-strip__item strong {
  display: block;
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.15rem;
}

.portal-strip__item span {
  font-size: 0.78rem;
  color: var(--text-muted);
}

.footer--portal-v2 {
  background: white;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 1rem 0;
}

.footer--portal-v2 .footer__bottom p {
  color: var(--text-muted);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 1100px) {
  .portal-page--v2 {
    padding-bottom: 72px;
  }

  .portal-split {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .portal-split__panel {
    min-height: 52vh;
  }

  .portal-split__badge {
    display: none;
  }

  .portal-split__content {
    padding: 2rem 1.5rem 2.5rem;
    max-width: none;
  }

  .portal-strip__inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }
}

@media (max-width: 480px) {
  .portal-split__panel {
    min-height: 46vh;
  }

  .portal-strip__inner {
    grid-template-columns: 1fr;
    gap: 0.85rem;
  }

  .portal-strip__item {
    text-align: left;
  }
}

/* ========== Portal Landing v3 — Gateway Light ========== */
.portal-page--v3 {
  background: var(--bg-soft);
  min-height: 100vh;
  color: var(--text);
}

.portal-page--v3 .header--portal-v3 {
  position: relative;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-page--v3 .header--portal-v3 .logo__img {
  filter: none;
}

.portal-gateway {
  position: relative;
  padding: 2.5rem 0 3.5rem;
  overflow: hidden;
}

.portal-gateway__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.portal-gateway__orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.45;
}

.portal-gateway__orb--1 {
  width: 420px;
  height: 420px;
  top: -120px;
  right: -80px;
  background: rgba(227, 46, 106, 0.18);
}

.portal-gateway__orb--2 {
  width: 320px;
  height: 320px;
  bottom: 10%;
  left: -100px;
  background: rgba(199, 32, 123, 0.12);
}

.portal-gateway__orb--3 {
  width: 260px;
  height: 260px;
  top: 40%;
  left: 45%;
  background: rgba(255, 61, 96, 0.08);
}

.portal-gateway__wrap {
  position: relative;
  z-index: 1;
  max-width: 820px;
}

.portal-gateway__intro {
  text-align: center;
  margin-bottom: 2.5rem;
}

.portal-gateway__eyebrow {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: 0.85rem;
}

.portal-gateway__title {
  font-size: clamp(2rem, 5vw, 2.75rem);
  font-weight: 900;
  line-height: 1.12;
  color: var(--secondary);
  margin-bottom: 0.85rem;
}

.portal-gateway__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-gateway__lead {
  font-size: 1.02rem;
  color: var(--text-muted);
  line-height: 1.65;
  max-width: 36rem;
  margin: 0 auto 1.25rem;
}

.portal-gateway__pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
}

.portal-gateway__pills li {
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.4rem 0.85rem;
  border-radius: 999px;
  background: white;
  color: var(--text-muted);
  border: 1px solid rgba(0, 0, 0, 0.07);
  box-shadow: var(--shadow-sm);
}

.portal-gateway__routes {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.portal-route {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1.25rem;
  padding: 1.5rem 1.5rem 1.5rem 1.75rem;
  background: white;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: var(--shadow-sm);
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.portal-route:hover,
.portal-route:focus-visible {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
  border-color: rgba(227, 46, 106, 0.2);
}

.portal-route:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
}

.portal-route__accent {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
}

.portal-route--res .portal-route__accent {
  background: var(--gradient-brand);
}

.portal-route--emp .portal-route__accent {
  background: linear-gradient(180deg, #1e3a5f 0%, #0f172a 100%);
}

.portal-route__icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.portal-route--res .portal-route__icon {
  background: rgba(227, 46, 106, 0.1);
  color: var(--primary);
}

.portal-route--emp .portal-route__icon {
  background: rgba(30, 58, 95, 0.1);
  color: #1e3a5f;
}

.portal-route__icon svg {
  width: 28px;
  height: 28px;
}

.portal-route__body {
  min-width: 0;
}

.portal-route__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 0.25rem;
}

.portal-route__title {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.35rem;
  line-height: 1.25;
}

.portal-route__desc {
  font-size: 0.88rem;
  color: var(--text-muted);
  line-height: 1.55;
  margin-bottom: 0.75rem;
}

.portal-route__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.portal-route__chips span {
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.25rem 0.6rem;
  border-radius: 6px;
  background: var(--bg-soft);
  color: var(--text-muted);
}

.portal-route__action {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  transition: background 0.25s ease, color 0.25s ease;
}

.portal-route--res .portal-route__action {
  background: rgba(227, 46, 106, 0.08);
  color: var(--primary);
}

.portal-route--emp .portal-route__action {
  background: rgba(30, 58, 95, 0.08);
  color: #1e3a5f;
}

.portal-route__action svg {
  width: 22px;
  height: 22px;
  transition: transform 0.25s ease;
}

.portal-route:hover .portal-route__action svg,
.portal-route:focus-visible .portal-route__action svg {
  transform: translateX(3px);
}

.portal-route--res:hover .portal-route__action,
.portal-route--res:focus-visible .portal-route__action {
  background: var(--gradient-brand);
  color: white;
}

.portal-route--emp:hover .portal-route__action,
.portal-route--emp:focus-visible .portal-route__action {
  background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%);
  color: white;
}

.footer--portal-v3 {
  background: transparent;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 1.25rem 0;
}

.footer--portal-v3 .footer__bottom p {
  color: var(--text-muted);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v3 {
    padding-bottom: 72px;
  }
}

@media (max-width: 640px) {
  .portal-gateway {
    padding: 1.75rem 0 2.5rem;
  }

  .portal-gateway__intro {
    margin-bottom: 1.75rem;
    text-align: left;
  }

  .portal-gateway__lead {
    margin-left: 0;
    margin-right: 0;
  }

  .portal-gateway__pills {
    justify-content: flex-start;
  }

  .portal-route {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    gap: 1rem;
    padding: 1.25rem;
  }

  .portal-route__action {
    grid-column: 1 / -1;
    flex-direction: row;
    width: 100%;
    height: auto;
    border-radius: var(--radius-sm);
    padding: 0.75rem 1rem;
    justify-content: center;
  }

  .portal-route__action span {
    font-size: 0.85rem;
  }
}

/* ========== Portal Landing v4 — Neon Dark ========== */
.portal-page--v4 {
  background: #060608;
  min-height: 100vh;
  color: white;
}

.portal-page--v4 .header--portal-v4 {
  position: relative;
  z-index: 20;
  background: rgba(6, 6, 8, 0.8);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-page--v4 .header--portal-v4 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-neon {
  position: relative;
  padding: 2rem 0 3rem;
  min-height: calc(100vh - 120px);
  display: flex;
  align-items: center;
  overflow: hidden;
}

.portal-neon__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, black 20%, transparent 75%);
}

.portal-neon__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
}

.portal-neon__glow--left {
  width: 480px;
  height: 480px;
  top: 10%;
  left: -120px;
  background: rgba(227, 46, 106, 0.22);
}

.portal-neon__glow--right {
  width: 420px;
  height: 420px;
  bottom: 5%;
  right: -100px;
  background: rgba(59, 130, 246, 0.15);
}

.portal-neon__wrap {
  position: relative;
  z-index: 2;
}

.portal-neon__head {
  text-align: center;
  margin-bottom: 2.5rem;
}

.portal-neon__eyebrow {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  margin-bottom: 0.75rem;
}

.portal-neon__title {
  font-size: clamp(2.1rem, 5.5vw, 3.2rem);
  font-weight: 900;
  line-height: 1.1;
  margin-bottom: 0.85rem;
}

.portal-neon__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-neon__lead {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.65;
  max-width: 32rem;
  margin: 0 auto;
}

.portal-neon__choices {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.portal-neon__choice {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 280px;
  padding: 1.75rem;
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}

.portal-neon__choice:hover,
.portal-neon__choice:focus-visible {
  transform: translateY(-6px);
  background: rgba(255, 255, 255, 0.05);
}

.portal-neon__choice--res:hover,
.portal-neon__choice--res:focus-visible {
  border-color: rgba(227, 46, 106, 0.55);
  box-shadow: 0 0 40px rgba(227, 46, 106, 0.18), 0 20px 40px rgba(0, 0, 0, 0.4);
}

.portal-neon__choice--emp:hover,
.portal-neon__choice--emp:focus-visible {
  border-color: rgba(96, 165, 250, 0.45);
  box-shadow: 0 0 40px rgba(59, 130, 246, 0.15), 0 20px 40px rgba(0, 0, 0, 0.4);
}

.portal-neon__choice:focus-visible {
  outline: 2px solid white;
  outline-offset: 3px;
}

.portal-neon__num {
  position: absolute;
  top: -0.15em;
  right: 0.5rem;
  font-size: clamp(5rem, 12vw, 7rem);
  font-weight: 900;
  line-height: 1;
  color: rgba(255, 255, 255, 0.04);
  pointer-events: none;
  user-select: none;
}

.portal-neon__choice-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.portal-neon__icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.portal-neon__choice--res .portal-neon__icon {
  background: rgba(227, 46, 106, 0.15);
  color: var(--primary-light);
}

.portal-neon__choice--emp .portal-neon__icon {
  background: rgba(59, 130, 246, 0.15);
  color: #93c5fd;
}

.portal-neon__icon svg {
  width: 24px;
  height: 24px;
}

.portal-neon__stat {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.7);
}

.portal-neon__choice-title {
  font-size: 1.65rem;
  font-weight: 800;
  margin-bottom: 0.5rem;
}

.portal-neon__choice-desc {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.6;
  flex: 1;
  margin-bottom: 1.5rem;
}

.portal-neon__go {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.88rem;
  font-weight: 700;
  margin-top: auto;
  transition: gap 0.25s ease;
}

.portal-neon__choice--res .portal-neon__go {
  color: var(--primary-light);
}

.portal-neon__choice--emp .portal-neon__go {
  color: #93c5fd;
}

.portal-neon__go svg {
  width: 18px;
  height: 18px;
  transition: transform 0.25s ease;
}

.portal-neon__choice:hover .portal-neon__go svg,
.portal-neon__choice:focus-visible .portal-neon__go svg {
  transform: translateX(4px);
}

.portal-neon__trust {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  list-style: none;
  padding: 1.25rem 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-neon__trust li {
  text-align: center;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.45);
}

.portal-neon__trust strong {
  display: block;
  font-size: 1.1rem;
  font-weight: 800;
  color: white;
  margin-bottom: 0.1rem;
}

.footer--portal-v4 {
  position: relative;
  z-index: 2;
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 1.25rem 0;
}

.footer--portal-v4 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v4 {
    padding-bottom: 72px;
  }
}

@media (max-width: 768px) {
  .portal-neon {
    padding: 1.5rem 0 2rem;
    min-height: auto;
    align-items: flex-start;
  }

  .portal-neon__head {
    text-align: left;
    margin-bottom: 1.75rem;
  }

  .portal-neon__lead {
    margin-left: 0;
    margin-right: 0;
  }

  .portal-neon__choices {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .portal-neon__choice {
    min-height: auto;
    padding: 1.35rem;
  }

  .portal-neon__trust {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}

@media (max-width: 400px) {
  .portal-neon__trust {
    grid-template-columns: 1fr 1fr;
  }
}

/* ========== Portal Landing v5 — Tab Picker ========== */
.portal-page--v5 {
  background: #eef0f4;
  min-height: 100vh;
}

.portal-page--v5 .header--portal-v5 {
  background: white;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-page--v5 .header--portal-v5 .logo__img {
  filter: none;
}

.portal-picker {
  padding: 2.5rem 0 3rem;
  min-height: calc(100vh - 130px);
  display: flex;
  align-items: center;
}

.portal-picker__wrap {
  max-width: 720px;
}

.portal-picker__intro {
  text-align: center;
  margin-bottom: 1.75rem;
}

.portal-picker__title {
  font-size: clamp(1.85rem, 4.5vw, 2.5rem);
  font-weight: 900;
  color: var(--secondary);
  margin-bottom: 0.5rem;
}

.portal-picker__lead {
  font-size: 0.98rem;
  color: var(--text-muted);
  line-height: 1.6;
  max-width: 30rem;
  margin: 0 auto;
}

.portal-picker__widget {
  background: white;
  border-radius: calc(var(--radius-lg) + 4px);
  box-shadow: 0 4px 24px rgba(10, 10, 10, 0.08), 0 1px 3px rgba(10, 10, 10, 0.04);
  padding: 0.5rem;
  overflow: hidden;
}

.portal-picker__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.portal-picker__tabs {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.35rem;
  padding: 0.35rem;
  background: #eef0f4;
  border-radius: var(--radius);
  margin-bottom: 0.5rem;
}

.portal-picker__indicator {
  position: absolute;
  top: 0.35rem;
  left: 0.35rem;
  width: calc(50% - 0.525rem);
  height: calc(100% - 0.7rem);
  background: white;
  border-radius: calc(var(--radius) - 4px);
  box-shadow: 0 2px 8px rgba(10, 10, 10, 0.08);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}

#profile-emp:checked ~ .portal-picker__tabs .portal-picker__indicator {
  transform: translateX(calc(100% + 0.35rem));
}

.portal-picker__tab {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.85rem 1rem;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: calc(var(--radius) - 4px);
  transition: color 0.25s ease;
  user-select: none;
}

.portal-picker__tab svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

#profile-res:checked ~ .portal-picker__tabs .portal-picker__tab[for="profile-res"],
#profile-emp:checked ~ .portal-picker__tabs .portal-picker__tab[for="profile-emp"] {
  color: var(--secondary);
}

.portal-picker__panel {
  display: none;
  grid-template-columns: 1fr 1.1fr;
  gap: 0;
  animation: portalPickerFade 0.35s ease;
}

#profile-res:checked ~ .portal-picker__panel--res,
#profile-emp:checked ~ .portal-picker__panel--emp {
  display: grid;
}

@keyframes portalPickerFade {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.portal-picker__visual {
  display: flex;
  align-items: flex-end;
  min-height: 280px;
  padding: 1.5rem;
  border-radius: var(--radius);
  margin: 0.5rem 0 0.5rem 0.5rem;
}

.portal-picker__visual--res {
  background:
    linear-gradient(160deg, rgba(199, 32, 123, 0.85) 0%, rgba(227, 46, 106, 0.75) 50%, rgba(255, 61, 96, 0.8) 100%),
    url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=600&q=80') center / cover no-repeat;
  background-blend-mode: multiply;
}

.portal-picker__visual--emp {
  background:
    linear-gradient(160deg, rgba(15, 23, 42, 0.88) 0%, rgba(30, 58, 95, 0.82) 100%),
    url('https://images.unsplash.com/photo-1497366216548-37526070297c?w=600&q=80') center / cover no-repeat;
  background-blend-mode: multiply;
}

.portal-picker__speed {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: white;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(6px);
}

.portal-picker__content {
  padding: 1.75rem 1.75rem 1.75rem 1.25rem;
  display: flex;
  flex-direction: column;
}

.portal-picker__content h2 {
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--secondary);
  margin-bottom: 0.5rem;
}

.portal-picker__content > p {
  font-size: 0.88rem;
  color: var(--text-muted);
  line-height: 1.6;
  margin-bottom: 1rem;
}

.portal-picker__features {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  flex: 1;
}

.portal-picker__features li {
  position: relative;
  padding-left: 1.35rem;
  font-size: 0.85rem;
  color: var(--text);
  margin-bottom: 0.45rem;
}

.portal-picker__features li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gradient-brand);
}

.portal-picker__cta {
  margin-top: auto;
}

.portal-picker__cta--emp {
  background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%);
}

.portal-picker__cta--emp:hover {
  background: linear-gradient(135deg, #254875 0%, #1a2744 100%);
}

.portal-picker__note {
  text-align: center;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted);
  margin-top: 1.25rem;
  letter-spacing: 0.02em;
}

.footer--portal-v5 {
  background: transparent;
  padding: 1rem 0 1.25rem;
}

.footer--portal-v5 .footer__bottom p {
  color: var(--text-muted);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v5 {
    padding-bottom: 72px;
  }
}

@media (max-width: 640px) {
  .portal-picker {
    padding: 1.5rem 0 2rem;
    min-height: auto;
    align-items: flex-start;
  }

  .portal-picker__intro {
    text-align: left;
  }

  .portal-picker__lead {
    margin-left: 0;
    margin-right: 0;
  }

  .portal-picker__tab {
    font-size: 0.78rem;
    padding: 0.75rem 0.5rem;
    flex-direction: column;
    gap: 0.25rem;
  }

  .portal-picker__tab svg {
    width: 20px;
    height: 20px;
  }

  .portal-picker__panel {
    grid-template-columns: 1fr;
  }

  .portal-picker__visual {
    min-height: 160px;
    margin: 0.5rem 0.5rem 0;
  }

  .portal-picker__content {
    padding: 1.25rem;
  }
}

/* ========== Portal Landing v6 — Stacked Lanes ========== */
.portal-page--v6 {
  background: var(--logo-black);
  min-height: 100vh;
}

.portal-page--v6 .header--portal-v6 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.75) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v6 .header--portal-v6 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-lanes {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-lanes__intro {
  position: absolute;
  top: 88px;
  left: 0;
  right: 0;
  z-index: 10;
  text-align: center;
  pointer-events: none;
}

.portal-lanes__tag {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
  padding: 0.4rem 1rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.portal-lane {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  min-height: 38vh;
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition: flex 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-lane:hover,
.portal-lane:focus-visible {
  flex: 1.35;
}

.portal-lane:focus-visible {
  outline: 3px solid white;
  outline-offset: -4px;
  z-index: 5;
}

.portal-lane__bg {
  position: absolute;
  inset: 0;
  transition: transform 0.5s ease;
}

.portal-lane--res .portal-lane__bg {
  background:
    linear-gradient(105deg, rgba(199, 32, 123, 0.92) 0%, rgba(227, 46, 106, 0.88) 45%, rgba(255, 61, 96, 0.85) 100%),
    url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=1400&q=80') center / cover no-repeat;
}

.portal-lane--emp .portal-lane__bg {
  background:
    linear-gradient(105deg, rgba(15, 23, 42, 0.94) 0%, rgba(30, 58, 95, 0.9) 50%, rgba(15, 23, 42, 0.95) 100%),
    url('https://images.unsplash.com/photo-1497366216548-37526070297c?w=1400&q=80') center / cover no-repeat;
}

.portal-lane:hover .portal-lane__bg,
.portal-lane:focus-visible .portal-lane__bg {
  transform: scale(1.04);
}

.portal-lane__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.portal-lane__left {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  min-width: 0;
}

.portal-lane__icon {
  width: 56px;
  height: 56px;
  flex-shrink: 0;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(8px);
}

.portal-lane__icon svg {
  width: 28px;
  height: 28px;
}

.portal-lane__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.65);
  margin-bottom: 0.2rem;
}

.portal-lane__title {
  font-size: clamp(1.35rem, 3.5vw, 2rem);
  font-weight: 800;
  line-height: 1.15;
  margin-bottom: 0.35rem;
}

.portal-lane__desc {
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.5;
}

.portal-lane__action {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.85rem 1.35rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(8px);
  transition: background 0.25s ease, transform 0.25s ease;
}

.portal-lane__action svg {
  width: 20px;
  height: 20px;
  transition: transform 0.25s ease;
}

.portal-lane:hover .portal-lane__action,
.portal-lane:focus-visible .portal-lane__action {
  background: rgba(255, 255, 255, 0.22);
}

.portal-lane:hover .portal-lane__action svg,
.portal-lane:focus-visible .portal-lane__action svg {
  transform: translateX(4px);
}

.portal-lanes__divider {
  position: relative;
  z-index: 15;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 0;
  margin: -18px 0;
  pointer-events: none;
}

.portal-lanes__divider span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
  background: var(--logo-black);
  border: 2px solid rgba(255, 255, 255, 0.15);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

.footer--portal-v6 {
  position: relative;
  z-index: 10;
  background: var(--logo-black);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v6 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v6 {
    padding-bottom: 72px;
  }

  .portal-lanes {
    padding-top: 64px;
    min-height: calc(100vh - 72px);
  }

  .portal-lanes__intro {
    top: 76px;
  }

  .portal-lane {
    min-height: 32vh;
  }

  .portal-lane:hover,
  .portal-lane:focus-visible {
    flex: 1.2;
  }
}

@media (max-width: 640px) {
  .portal-lanes__intro {
    position: relative;
    top: auto;
    padding: 0.75rem 1rem 0;
  }

  .portal-lane__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }

  .portal-lane__action {
    width: 100%;
    justify-content: center;
  }

  .portal-lane__left {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }

  .portal-lane {
    min-height: 28vh;
  }
}

/* ========== Portal Landing v7 — Bento Grid ========== */
.portal-page--v7 {
  background: #f5f6f8;
  min-height: 100vh;
}

.portal-page--v7 .header--portal-v7 {
  background: white;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-page--v7 .header--portal-v7 .logo__img {
  filter: none;
}

.portal-bento {
  padding: 2.5rem 0 3rem;
  min-height: calc(100vh - 120px);
  display: flex;
  align-items: center;
}

.portal-bento__wrap {
  max-width: 980px;
}

.portal-bento__head {
  text-align: center;
  margin-bottom: 2rem;
}

.portal-bento__title {
  font-size: clamp(1.85rem, 4vw, 2.65rem);
  font-weight: 900;
  color: var(--secondary);
  line-height: 1.12;
  margin-bottom: 0.6rem;
}

.portal-bento__lead {
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.6;
  max-width: 32rem;
  margin: 0 auto;
}

.portal-bento__grid {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  grid-template-rows: 1fr auto;
  gap: 1rem;
  min-height: 420px;
}

.portal-bento__tile {
  position: relative;
  border-radius: calc(var(--radius-lg) + 2px);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

a.portal-bento__tile:hover,
a.portal-bento__tile:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 20px 48px rgba(10, 10, 10, 0.14);
}

a.portal-bento__tile:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 3px;
}

.portal-bento__tile--res {
  grid-row: 1 / 3;
  color: white;
}

.portal-bento__tile--emp {
  color: white;
  min-height: 200px;
}

.portal-bento__tile--info {
  display: flex;
  align-items: stretch;
  gap: 0.75rem;
  background: white;
  border: 1px solid rgba(0, 0, 0, 0.06);
  padding: 1rem;
  box-shadow: var(--shadow-sm);
}

.portal-bento__tile-bg {
  position: absolute;
  inset: 0;
  transition: transform 0.5s ease;
}

.portal-bento__tile--res .portal-bento__tile-bg {
  background:
    linear-gradient(155deg, rgba(199, 32, 123, 0.88) 0%, rgba(227, 46, 106, 0.82) 50%, rgba(255, 61, 96, 0.85) 100%),
    url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=900&q=80') center / cover no-repeat;
}

.portal-bento__tile--emp .portal-bento__tile-bg {
  background:
    linear-gradient(155deg, rgba(15, 23, 42, 0.92) 0%, rgba(30, 58, 95, 0.88) 100%),
    url('https://images.unsplash.com/photo-1497366216548-37526070297c?w=700&q=80') center / cover no-repeat;
}

a.portal-bento__tile:hover .portal-bento__tile-bg,
a.portal-bento__tile:focus-visible .portal-bento__tile-bg {
  transform: scale(1.05);
}

.portal-bento__tile-body {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 1.75rem;
}

.portal-bento__badge {
  display: inline-block;
  align-self: flex-start;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.22);
  margin-bottom: 0.85rem;
}

.portal-bento__tile-body h2 {
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 0.5rem;
}

.portal-bento__tile-body > p {
  font-size: 0.88rem;
  line-height: 1.6;
  opacity: 0.88;
  margin-bottom: 1rem;
  flex: 1;
}

.portal-bento__list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.portal-bento__list li {
  position: relative;
  padding-left: 1.15rem;
  font-size: 0.82rem;
  font-weight: 600;
  opacity: 0.92;
}

.portal-bento__list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  font-weight: 800;
}

.portal-bento__link {
  font-size: 0.88rem;
  font-weight: 700;
  margin-top: auto;
  opacity: 0.95;
}

.portal-bento__stat {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0.5rem;
  border-radius: var(--radius-sm);
  background: var(--bg-soft);
}

.portal-bento__stat strong {
  display: block;
  font-size: 1.35rem;
  font-weight: 900;
  color: var(--secondary);
  line-height: 1.1;
}

.portal-bento__stat span {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-muted);
  margin-top: 0.15rem;
}

.footer--portal-v7 {
  background: transparent;
  padding: 1rem 0 1.25rem;
}

.footer--portal-v7 .footer__bottom p {
  color: var(--text-muted);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v7 {
    padding-bottom: 72px;
  }
}

@media (max-width: 768px) {
  .portal-bento {
    padding: 1.5rem 0 2rem;
    min-height: auto;
    align-items: flex-start;
  }

  .portal-bento__head {
    text-align: left;
    margin-bottom: 1.5rem;
  }

  .portal-bento__lead {
    margin-left: 0;
    margin-right: 0;
  }

  .portal-bento__grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    min-height: auto;
  }

  .portal-bento__tile--res {
    grid-row: auto;
    min-height: 300px;
  }

  .portal-bento__tile--emp {
    min-height: 220px;
  }

  .portal-bento__tile--info {
    flex-direction: column;
  }

  .portal-bento__stat {
    flex-direction: row;
    justify-content: flex-start;
    gap: 0.75rem;
    text-align: left;
    padding: 0.85rem 1rem;
  }

  .portal-bento__stat strong {
    font-size: 1.1rem;
    min-width: 3rem;
  }
}

/* ========== Portal Landing v8 — Glass Gradient ========== */
.portal-page--v8 {
  position: relative;
  min-height: 100vh;
  color: white;
  overflow-x: hidden;
}

.portal-glass__mesh {
  position: fixed;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(ellipse 70% 60% at 20% 30%, rgba(255, 61, 96, 0.55) 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 80% 70%, rgba(199, 32, 123, 0.5) 0%, transparent 50%),
    radial-gradient(ellipse 50% 40% at 60% 20%, rgba(227, 46, 106, 0.4) 0%, transparent 45%),
    linear-gradient(145deg, #1a0812 0%, #2d0f22 35%, #1a1028 70%, #0a0610 100%);
  animation: portalMeshShift 14s ease-in-out infinite alternate;
}

@keyframes portalMeshShift {
  0% {
    filter: hue-rotate(0deg) brightness(1);
  }
  100% {
    filter: hue-rotate(12deg) brightness(1.08);
  }
}

.portal-page--v8 .header--portal-v8 {
  position: relative;
  z-index: 20;
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.portal-page--v8 .header--portal-v8 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-glass {
  position: relative;
  z-index: 1;
  min-height: calc(100vh - 130px);
  display: flex;
  align-items: center;
  padding: 2.5rem 0 3rem;
}

.portal-glass__wrap {
  max-width: 880px;
}

.portal-glass__hero {
  text-align: center;
  margin-bottom: 2.5rem;
}

.portal-glass__eyebrow {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
  margin-bottom: 0.85rem;
}

.portal-glass__title {
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 900;
  line-height: 1.12;
  margin-bottom: 0.85rem;
}

.portal-glass__title span {
  background: linear-gradient(135deg, #ffb3c6 0%, #ffffff 50%, #ffb3c6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-glass__lead {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.6;
  max-width: 28rem;
  margin: 0 auto;
}

.portal-glass__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.portal-glass__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 2rem;
  border-radius: calc(var(--radius-lg) + 4px);
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  text-decoration: none;
  color: white;
  transition: transform 0.3s ease, background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.portal-glass__card:hover,
.portal-glass__card:focus-visible {
  transform: translateY(-6px);
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.3);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.portal-glass__card:focus-visible {
  outline: 2px solid white;
  outline-offset: 3px;
}

.portal-glass__card-icon {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.15);
  margin-bottom: 1.25rem;
}

.portal-glass__card-icon svg {
  width: 26px;
  height: 26px;
}

.portal-glass__card h2 {
  font-size: 1.35rem;
  font-weight: 800;
  margin-bottom: 0.45rem;
}

.portal-glass__card p {
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.55;
  margin-bottom: 1.5rem;
  flex: 1;
}

.portal-glass__card-btn {
  display: inline-flex;
  align-items: center;
  font-size: 0.85rem;
  font-weight: 700;
  padding: 0.65rem 1.25rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  transition: background 0.25s ease;
}

.portal-glass__card:hover .portal-glass__card-btn,
.portal-glass__card:focus-visible .portal-glass__card-btn {
  background: rgba(255, 255, 255, 0.28);
}

.portal-glass__trust {
  text-align: center;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.45);
}

.footer--portal-v8 {
  position: relative;
  z-index: 1;
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 1rem 0 1.25rem;
}

.footer--portal-v8 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v8 {
    padding-bottom: 72px;
  }
}

@media (max-width: 640px) {
  .portal-glass {
    padding: 1.5rem 0 2rem;
    min-height: auto;
    align-items: flex-start;
  }

  .portal-glass__hero {
    text-align: left;
    margin-bottom: 1.75rem;
  }

  .portal-glass__lead {
    margin-left: 0;
    margin-right: 0;
  }

  .portal-glass__cards {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .portal-glass__card {
    padding: 1.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-glass__mesh {
    animation: none;
  }
}

/* ========== Portal Landing v9 — Minimal Wayfinding ========== */
.portal-page--v9 {
  background: #ffffff;
  min-height: 100vh;
}

.portal-page--v9 .header--portal-v9 {
  background: white;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-page--v9 .header--portal-v9 .logo__img {
  filter: none;
}

.portal-minimal {
  min-height: calc(100vh - 130px);
  display: flex;
  align-items: center;
  padding: 2.5rem 0 3rem;
}

.portal-minimal__wrap {
  max-width: 640px;
}

.portal-minimal__head {
  margin-bottom: 2rem;
}

.portal-minimal__title {
  font-size: clamp(2.25rem, 6vw, 3.25rem);
  font-weight: 900;
  color: var(--secondary);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-bottom: 0.5rem;
}

.portal-minimal__lead {
  font-size: 1.02rem;
  color: var(--text-muted);
  line-height: 1.55;
}

.portal-minimal__nav {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-bottom: 2rem;
}

.portal-minimal__item {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1.15rem;
  padding: 1.35rem 1.5rem;
  border-radius: var(--radius-lg);
  border: 2px solid rgba(0, 0, 0, 0.08);
  background: white;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.portal-minimal__item:hover,
.portal-minimal__item:focus-visible {
  transform: translateX(6px);
  box-shadow: var(--shadow-md);
}

.portal-minimal__item--res:hover,
.portal-minimal__item--res:focus-visible {
  border-color: var(--primary);
  background: rgba(227, 46, 106, 0.03);
}

.portal-minimal__item--emp:hover,
.portal-minimal__item--emp:focus-visible {
  border-color: #1e3a5f;
  background: rgba(30, 58, 95, 0.04);
}

.portal-minimal__item:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
}

.portal-minimal__marker {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  transform: scaleY(0);
  transform-origin: center;
  transition: transform 0.25s ease;
}

.portal-minimal__item--res .portal-minimal__marker {
  background: var(--gradient-brand);
}

.portal-minimal__item--emp .portal-minimal__marker {
  background: linear-gradient(180deg, #1e3a5f 0%, #0f172a 100%);
}

.portal-minimal__item:hover .portal-minimal__marker,
.portal-minimal__item:focus-visible .portal-minimal__marker {
  transform: scaleY(1);
}

.portal-minimal__icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.portal-minimal__item--res .portal-minimal__icon {
  background: rgba(227, 46, 106, 0.08);
  color: var(--primary);
}

.portal-minimal__item--emp .portal-minimal__icon {
  background: rgba(30, 58, 95, 0.08);
  color: #1e3a5f;
}

.portal-minimal__icon svg {
  width: 24px;
  height: 24px;
}

.portal-minimal__text {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.portal-minimal__text strong {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--secondary);
}

.portal-minimal__text small {
  font-size: 0.82rem;
  color: var(--text-muted);
  line-height: 1.45;
}

.portal-minimal__arrow {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--bg-soft);
  color: var(--text-muted);
  transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.portal-minimal__arrow svg {
  width: 20px;
  height: 20px;
}

.portal-minimal__item--res:hover .portal-minimal__arrow,
.portal-minimal__item--res:focus-visible .portal-minimal__arrow {
  background: var(--gradient-brand);
  color: white;
  transform: translateX(3px);
}

.portal-minimal__item--emp:hover .portal-minimal__arrow,
.portal-minimal__item--emp:focus-visible .portal-minimal__arrow {
  background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%);
  color: white;
  transform: translateX(3px);
}

.portal-minimal__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  list-style: none;
  padding: 1.25rem 0 0;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-minimal__meta li {
  position: relative;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted);
  padding-left: 0.85rem;
}

.portal-minimal__meta li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--primary);
}

.footer--portal-v9 {
  background: white;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 1rem 0 1.25rem;
}

.footer--portal-v9 .footer__bottom p {
  color: var(--text-muted);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v9 {
    padding-bottom: 72px;
  }
}

@media (max-width: 640px) {
  .portal-minimal {
    padding: 1.5rem 0 2rem;
    min-height: auto;
    align-items: flex-start;
  }

  .portal-minimal__item {
    grid-template-columns: auto 1fr;
    gap: 1rem;
    padding: 1.15rem;
  }

  .portal-minimal__arrow {
    grid-column: 2;
    justify-self: end;
    width: 36px;
    height: 36px;
  }

  .portal-minimal__item:hover,
  .portal-minimal__item:focus-visible {
    transform: none;
  }

  .portal-minimal__meta {
    flex-direction: column;
    gap: 0.5rem;
  }
}

/* ========== Portal Landing v10 — Typographic Split ========== */
.portal-page--v10 {
  background: var(--logo-black);
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v10 .header--portal-v10 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.7) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v10 .header--portal-v10 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-type {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-type__half {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 72px);
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-type__half--res {
  background: var(--gradient-brand);
}

.portal-type__half--emp {
  background: linear-gradient(160deg, #0f172a 0%, #1e3a5f 50%, #0f172a 100%);
}

.portal-type__half:hover,
.portal-type__half:focus-visible {
  flex: 1.4;
}

.portal-type__half:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
  z-index: 5;
}

.portal-type__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem;
  max-width: 22rem;
}

.portal-type__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.75;
  margin-bottom: 0.5rem;
}

.portal-type__word {
  display: block;
  font-size: clamp(3.5rem, 10vw, 6.5rem);
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.03em;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
}

.portal-type__half--res .portal-type__word {
  text-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
}

.portal-type__half--emp .portal-type__word {
  background: linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, 0.7) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-type__hint {
  font-size: 0.88rem;
  opacity: 0.8;
  line-height: 1.5;
  margin-bottom: 1.5rem;
}

.portal-type__enter {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.6rem 1.25rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.1);
  transition: background 0.25s ease, transform 0.25s ease;
}

.portal-type__half:hover .portal-type__enter,
.portal-type__half:focus-visible .portal-type__enter {
  background: rgba(255, 255, 255, 0.22);
  transform: scale(1.04);
}

.portal-type__center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.35);
  justify-content: center;
  padding: 0.75rem;
  pointer-events: none;
}

.portal-type__center img {
  width: 48px;
  height: auto;
  object-fit: contain;
}

.portal-type__center span {
  font-size: 0.55rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  text-align: center;
  line-height: 1.2;
}

.footer--portal-v10 {
  position: relative;
  z-index: 10;
  background: var(--logo-black);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v10 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v10 {
    padding-bottom: 72px;
  }

  .portal-type {
    flex-direction: column;
    padding-top: 64px;
  }

  .portal-type__half {
    min-height: 42vh;
  }

  .portal-type__half:hover,
  .portal-type__half:focus-visible {
    flex: 1.2;
  }

  .portal-type__center {
    width: 80px;
    height: 80px;
  }

  .portal-type__center img {
    width: 38px;
  }

  .portal-type__center span {
    font-size: 0.5rem;
  }
}

@media (max-width: 480px) {
  .portal-type__word {
    font-size: clamp(2.75rem, 14vw, 4rem);
  }

  .portal-type__half {
    min-height: 36vh;
  }
}

/* ========== Portal Landing v11 — Circular Orbit Hub ========== */
.portal-page--v11 {
  background: #08080c;
  min-height: 100vh;
  color: white;
}

.portal-page--v11 .header--portal-v11 {
  position: relative;
  z-index: 30;
  background: rgba(8, 8, 12, 0.85);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-page--v11 .header--portal-v11 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-orbit {
  position: relative;
  min-height: calc(100vh - 130px);
  display: flex;
  align-items: center;
  padding: 2rem 0 3rem;
  overflow: hidden;
}

.portal-orbit__bg {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.portal-orbit__ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-orbit__ring--1 {
  width: min(90vw, 520px);
  height: min(90vw, 520px);
}

.portal-orbit__ring--2 {
  width: min(75vw, 400px);
  height: min(75vw, 400px);
  border-color: rgba(227, 46, 106, 0.12);
}

.portal-orbit__ring--3 {
  width: min(55vw, 280px);
  height: min(55vw, 280px);
  border-color: rgba(96, 165, 250, 0.1);
}

.portal-orbit__stage {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
}

.portal-orbit__core {
  margin-bottom: 2rem;
}

.portal-orbit__logo {
  width: 88px;
  height: auto;
  margin: 0 auto 1rem;
  filter: drop-shadow(0 4px 20px rgba(227, 46, 106, 0.3));
}

.portal-orbit__title {
  font-size: clamp(1.65rem, 4vw, 2.25rem);
  font-weight: 900;
  margin-bottom: 0.45rem;
}

.portal-orbit__lead {
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.55;
  max-width: 24rem;
  margin: 0 auto;
}

.portal-orbit__lines {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -20%);
  width: min(100%, 640px);
  height: auto;
  pointer-events: none;
  opacity: 0.8;
}

.portal-orbit__nodes {
  position: relative;
  display: flex;
  justify-content: center;
  gap: clamp(2rem, 12vw, 8rem);
  width: 100%;
  margin-bottom: 2rem;
}

.portal-orbit__node {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: clamp(140px, 22vw, 180px);
  height: clamp(140px, 22vw, 180px);
  border-radius: 50%;
  text-decoration: none;
  color: white;
  background: rgba(255, 255, 255, 0.04);
  border: 2px solid rgba(255, 255, 255, 0.1);
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, background 0.35s ease;
}

.portal-orbit__node-ring {
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 2px solid transparent;
  transition: border-color 0.35s ease, inset 0.35s ease;
}

.portal-orbit__node--res .portal-orbit__node-ring {
  border-color: rgba(227, 46, 106, 0.4);
}

.portal-orbit__node--emp .portal-orbit__node-ring {
  border-color: rgba(96, 165, 250, 0.4);
}

.portal-orbit__node:hover,
.portal-orbit__node:focus-visible {
  transform: scale(1.08);
  background: rgba(255, 255, 255, 0.08);
}

.portal-orbit__node--res:hover,
.portal-orbit__node--res:focus-visible {
  border-color: var(--primary);
  box-shadow: 0 0 40px rgba(227, 46, 106, 0.35);
}

.portal-orbit__node--emp:hover,
.portal-orbit__node--emp:focus-visible {
  border-color: #60a5fa;
  box-shadow: 0 0 40px rgba(59, 130, 246, 0.3);
}

.portal-orbit__node:focus-visible {
  outline: 2px solid white;
  outline-offset: 4px;
}

.portal-orbit__node-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.5rem;
}

.portal-orbit__node--res .portal-orbit__node-icon {
  color: var(--primary-light);
}

.portal-orbit__node--emp .portal-orbit__node-icon {
  color: #93c5fd;
}

.portal-orbit__node-icon svg {
  width: 32px;
  height: 32px;
}

.portal-orbit__node-label {
  font-size: 0.9rem;
  font-weight: 800;
  margin-bottom: 0.15rem;
}

.portal-orbit__node-desc {
  font-size: 0.68rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.55);
  letter-spacing: 0.02em;
}

.portal-orbit__trust {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.04em;
}

.footer--portal-v11 {
  position: relative;
  z-index: 2;
  background: #08080c;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 1rem 0 1.25rem;
}

.footer--portal-v11 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v11 {
    padding-bottom: 72px;
  }
}

@media (max-width: 640px) {
  .portal-orbit {
    padding: 1.5rem 0 2rem;
    min-height: auto;
  }

  .portal-orbit__lines {
    display: none;
  }

  .portal-orbit__nodes {
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
  }

  .portal-orbit__node {
    width: 160px;
    height: 160px;
  }

  .portal-orbit__core {
    margin-bottom: 1.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-orbit__node:hover,
  .portal-orbit__node:focus-visible {
    transform: none;
  }
}

/* ========== Portal Landing v12 — Diagonal Split ========== */
.portal-page--v12 {
  background: var(--logo-black);
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v12 .header--portal-v12 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.8) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v12 .header--portal-v12 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-diag {
  position: relative;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-diag__zone {
  position: absolute;
  inset: 72px 0 48px;
  display: flex;
  align-items: center;
  text-decoration: none;
  color: white;
  transition: filter 0.35s ease, transform 0.35s ease;
}

.portal-diag__zone--res {
  clip-path: polygon(0 0, 100% 0, 0 100%);
  background: var(--gradient-brand);
  justify-content: flex-start;
  padding-left: clamp(1.5rem, 8vw, 6rem);
  z-index: 2;
}

.portal-diag__zone--emp {
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
  background: linear-gradient(145deg, #0f172a 0%, #1e3a5f 50%, #0f172a 100%);
  justify-content: flex-end;
  padding-right: clamp(1.5rem, 8vw, 6rem);
  z-index: 1;
}

.portal-diag__zone:hover,
.portal-diag__zone:focus-visible {
  filter: brightness(1.12);
  z-index: 3;
}

.portal-diag__zone:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
}

.portal-diag__content {
  max-width: 18rem;
  text-align: left;
}

.portal-diag__zone--emp .portal-diag__content {
  text-align: right;
  margin-left: auto;
}

.portal-diag__icon {
  width: 40px;
  height: 40px;
  margin-bottom: 1rem;
  opacity: 0.9;
}

.portal-diag__zone--emp .portal-diag__icon {
  margin-left: auto;
  display: block;
}

.portal-diag__content h2 {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 900;
  line-height: 1.1;
  margin-bottom: 0.5rem;
}

.portal-diag__content p {
  font-size: 0.9rem;
  opacity: 0.85;
  line-height: 1.55;
  margin-bottom: 1.25rem;
}

.portal-diag__cta {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.55rem 1.1rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: rgba(255, 255, 255, 0.1);
  transition: background 0.25s ease;
}

.portal-diag__zone:hover .portal-diag__cta,
.portal-diag__zone:focus-visible .portal-diag__cta {
  background: rgba(255, 255, 255, 0.22);
}

.portal-diag__badge {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

.portal-diag__badge img {
  width: 48px;
  height: auto;
  object-fit: contain;
}

.footer--portal-v12 {
  position: relative;
  z-index: 20;
  background: var(--logo-black);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.75rem 0;
}

.footer--portal-v12 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v12 {
    padding-bottom: 72px;
  }

  .portal-diag {
    padding-top: 64px;
  }

  .portal-diag__zone {
    inset: 64px 0 40px;
  }
}

@media (max-width: 768px) {
  .portal-diag {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 64px);
    padding-top: 64px;
  }

  .portal-diag__zone {
    position: relative;
    inset: auto;
    flex: 1;
    clip-path: none;
    min-height: 38vh;
    padding: 2rem 1.5rem;
    justify-content: center;
  }

  .portal-diag__zone--res {
    padding-left: 1.5rem;
  }

  .portal-diag__zone--emp {
    padding-right: 1.5rem;
  }

  .portal-diag__content,
  .portal-diag__zone--emp .portal-diag__content {
    text-align: left;
    margin: 0;
    max-width: none;
  }

  .portal-diag__zone--emp .portal-diag__icon {
    margin-left: 0;
  }

  .portal-diag__badge {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    margin: -44px auto;
    z-index: 15;
  }
}

/* ========== Portal Landing v13 — Profile Picker ========== */
.portal-page--v13 {
  background: #121214;
  min-height: 100vh;
  color: white;
}

.portal-page--v13 .header--portal-v13 {
  background: rgba(18, 18, 20, 0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-page--v13 .header--portal-v13 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-profiles {
  min-height: calc(100vh - 130px);
  display: flex;
  align-items: center;
  padding: 2.5rem 0 3rem;
}

.portal-profiles__wrap {
  max-width: 560px;
  margin: 0 auto;
  text-align: center;
}

.portal-profiles__head {
  margin-bottom: 2.5rem;
}

.portal-profiles__logo {
  width: 72px;
  height: auto;
  margin: 0 auto 1.25rem;
  opacity: 0.95;
}

.portal-profiles__title {
  font-size: clamp(1.65rem, 4.5vw, 2.35rem);
  font-weight: 800;
  margin-bottom: 0.45rem;
  letter-spacing: -0.01em;
}

.portal-profiles__lead {
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.5);
}

.portal-profiles__grid {
  display: flex;
  justify-content: center;
  gap: clamp(1.5rem, 8vw, 3.5rem);
  margin-bottom: 2.5rem;
}

.portal-profiles__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  text-decoration: none;
  color: rgba(255, 255, 255, 0.55);
  transition: color 0.25s ease;
  max-width: 160px;
}

.portal-profiles__item:hover,
.portal-profiles__item:focus-visible {
  color: white;
}

.portal-profiles__item:focus-visible {
  outline: none;
}

.portal-profiles__item:focus-visible .portal-profiles__avatar {
  outline: 3px solid white;
  outline-offset: 4px;
}

.portal-profiles__avatar {
  width: clamp(120px, 22vw, 150px);
  height: clamp(120px, 22vw, 150px);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #2a2a2e 0%, #1a1a1e 100%);
  border: 3px solid transparent;
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}

.portal-profiles__avatar svg {
  width: 52px;
  height: 52px;
  opacity: 0.85;
  transition: opacity 0.25s ease;
}

.portal-profiles__item--res:hover .portal-profiles__avatar,
.portal-profiles__item--res:focus-visible .portal-profiles__avatar {
  transform: scale(1.06);
  border-color: var(--primary);
  box-shadow: 0 0 0 1px var(--primary), 0 12px 32px rgba(227, 46, 106, 0.25);
  background: linear-gradient(145deg, #3a1a28 0%, #2a1520 100%);
}

.portal-profiles__item--emp:hover .portal-profiles__avatar,
.portal-profiles__item--emp:focus-visible .portal-profiles__avatar {
  transform: scale(1.06);
  border-color: #60a5fa;
  box-shadow: 0 0 0 1px #60a5fa, 0 12px 32px rgba(59, 130, 246, 0.22);
  background: linear-gradient(145deg, #1a2840 0%, #121e32 100%);
}

.portal-profiles__item:hover .portal-profiles__avatar svg,
.portal-profiles__item:focus-visible .portal-profiles__avatar svg {
  opacity: 1;
}

.portal-profiles__name {
  font-size: 1.05rem;
  font-weight: 700;
  color: inherit;
}

.portal-profiles__tag {
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.02em;
}

.portal-profiles__item:hover .portal-profiles__tag,
.portal-profiles__item:focus-visible .portal-profiles__tag {
  color: rgba(255, 255, 255, 0.65);
}

.portal-profiles__foot {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.35);
  letter-spacing: 0.03em;
}

.footer--portal-v13 {
  background: #121214;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 1rem 0 1.25rem;
}

.footer--portal-v13 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v13 {
    padding-bottom: 72px;
  }
}

@media (max-width: 480px) {
  .portal-profiles {
    padding: 1.5rem 0 2rem;
    min-height: auto;
  }

  .portal-profiles__grid {
    gap: 1.25rem;
  }

  .portal-profiles__item {
    max-width: 130px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-profiles__item:hover .portal-profiles__avatar,
  .portal-profiles__item:focus-visible .portal-profiles__avatar {
    transform: none;
  }
}

/* ========== Portal Landing v14 — 3D Flip Cards ========== */
.portal-page--v14 {
  background: linear-gradient(180deg, #f8f6f7 0%, #eee8eb 100%);
  min-height: 100vh;
}

.portal-page--v14 .header--portal-v14 {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-page--v14 .header--portal-v14 .logo__img {
  filter: none;
}

.portal-flip {
  min-height: calc(100vh - 130px);
  display: flex;
  align-items: center;
  padding: 2.5rem 0 3rem;
}

.portal-flip__wrap {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.portal-flip__head {
  margin-bottom: 2.5rem;
}

.portal-flip__title {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 900;
  color: var(--secondary);
  margin-bottom: 0.5rem;
}

.portal-flip__lead {
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.55;
}

.portal-flip__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-bottom: 2rem;
  perspective: 1200px;
}

.portal-flip__card {
  display: block;
  height: 280px;
  text-decoration: none;
  outline: none;
}

.portal-flip__inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.65s cubic-bezier(0.4, 0, 0.2, 1);
  transform-style: preserve-3d;
}

.portal-flip__card:hover .portal-flip__inner,
.portal-flip__card:focus-visible .portal-flip__inner,
.portal-flip__card:focus-within .portal-flip__inner {
  transform: rotateY(180deg);
}

.portal-flip__face {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  border-radius: calc(var(--radius-lg) + 2px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.75rem;
  box-shadow: var(--shadow-md);
}

.portal-flip__face--front {
  color: white;
}

.portal-flip__card--res .portal-flip__face--front {
  background: var(--gradient-brand);
}

.portal-flip__card--emp .portal-flip__face--front {
  background: linear-gradient(145deg, #1e3a5f 0%, #0f172a 100%);
}

.portal-flip__face--front svg {
  width: 48px;
  height: 48px;
  margin-bottom: 1rem;
  opacity: 0.95;
}

.portal-flip__face--front h2 {
  font-size: 1.45rem;
  font-weight: 800;
  margin-bottom: 0.35rem;
}

.portal-flip__face--front p {
  font-size: 0.88rem;
  opacity: 0.88;
}

.portal-flip__face--back {
  transform: rotateY(180deg);
  background: white;
  color: var(--secondary);
  border: 2px solid rgba(0, 0, 0, 0.06);
  text-align: left;
  align-items: flex-start;
}

.portal-flip__card--res .portal-flip__face--back {
  border-color: rgba(227, 46, 106, 0.2);
}

.portal-flip__card--emp .portal-flip__face--back {
  border-color: rgba(30, 58, 95, 0.2);
}

.portal-flip__back-label {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 0.75rem;
}

.portal-flip__face--back ul {
  list-style: none;
  padding: 0;
  margin: 0 0 auto;
  width: 100%;
}

.portal-flip__face--back li {
  position: relative;
  padding-left: 1.1rem;
  font-size: 0.88rem;
  font-weight: 600;
  margin-bottom: 0.4rem;
  color: var(--text);
}

.portal-flip__face--back li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--primary);
  font-weight: 800;
}

.portal-flip__card--emp .portal-flip__face--back li::before {
  color: #1e3a5f;
}

.portal-flip__enter {
  display: inline-block;
  margin-top: 1rem;
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--primary);
}

.portal-flip__card--emp .portal-flip__enter {
  color: #1e3a5f;
}

.portal-flip__card:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 4px;
  border-radius: calc(var(--radius-lg) + 2px);
}

.portal-flip__trust {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted);
}

.footer--portal-v14 {
  background: transparent;
  padding: 1rem 0 1.25rem;
}

.footer--portal-v14 .footer__bottom p {
  color: var(--text-muted);
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v14 {
    padding-bottom: 72px;
  }
}

@media (max-width: 640px) {
  .portal-flip {
    padding: 1.5rem 0 2rem;
    min-height: auto;
  }

  .portal-flip__grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .portal-flip__card {
    height: 260px;
  }

  /* Mobile: show back on tap via :focus-within after tap */
  .portal-flip__card:active .portal-flip__inner {
    transform: rotateY(180deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-flip__inner {
    transition: none;
  }

  .portal-flip__card:hover .portal-flip__inner,
  .portal-flip__card:focus-visible .portal-flip__inner,
  .portal-flip__card:focus-within .portal-flip__inner,
  .portal-flip__card:active .portal-flip__inner {
    transform: none;
  }

  /* Show back content below front for reduced motion - optional stack */
  .portal-flip__face--back {
    position: relative;
    transform: none;
    backface-visibility: visible;
    margin-top: 0.5rem;
    height: auto;
    min-height: 140px;
  }

  .portal-flip__card {
    height: auto;
  }

  .portal-flip__inner {
    display: flex;
    flex-direction: column;
    gap: 0;
    height: auto;
  }

  .portal-flip__face--front {
    position: relative;
    height: 200px;
  }
}

/* ========== Portal Landing v15 — Cinematic Hero ========== */
.portal-page--v15 {
  background: #0a0a0c;
  min-height: 100vh;
  color: white;
}

.portal-page--v15 .header--portal-v15 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(10, 10, 12, 0.85) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v15 .header--portal-v15 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-cine {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding: 6rem 0 4rem;
  overflow: hidden;
}

.portal-cine__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.portal-cine__shine {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(227, 46, 106, 0.25) 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 80% 80%, rgba(199, 32, 123, 0.15) 0%, transparent 50%),
    linear-gradient(180deg, #0a0a0c 0%, #121018 50%, #0a0a0c 100%);
}

.portal-cine__dots {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 20%, transparent 70%);
  opacity: 0.5;
}

.portal-cine__content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 680px;
  margin: 0 auto;
}

.portal-cine__eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  margin-bottom: 1rem;
}

.portal-cine__title {
  font-size: clamp(2.1rem, 6vw, 3.5rem);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin-bottom: 0.85rem;
}

.portal-cine__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-cine__lead {
  font-size: 1.02rem;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.6;
  margin-bottom: 2.5rem;
}

.portal-cine__actions {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 2rem;
}

.portal-cine__btn {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1rem;
  padding: 1.15rem 1.35rem;
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: white;
  text-align: left;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(8px);
  transition: transform 0.28s ease, border-color 0.28s ease, background 0.28s ease, box-shadow 0.28s ease;
}

.portal-cine__btn:hover,
.portal-cine__btn:focus-visible {
  transform: translateY(-3px);
}

.portal-cine__btn--res:hover,
.portal-cine__btn--res:focus-visible {
  border-color: rgba(227, 46, 106, 0.5);
  background: rgba(227, 46, 106, 0.12);
  box-shadow: 0 12px 40px rgba(227, 46, 106, 0.2);
}

.portal-cine__btn--emp:hover,
.portal-cine__btn--emp:focus-visible {
  border-color: rgba(96, 165, 250, 0.45);
  background: rgba(59, 130, 246, 0.1);
  box-shadow: 0 12px 40px rgba(59, 130, 246, 0.15);
}

.portal-cine__btn:focus-visible {
  outline: 2px solid white;
  outline-offset: 3px;
}

.portal-cine__btn-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.portal-cine__btn--res .portal-cine__btn-icon {
  background: rgba(227, 46, 106, 0.2);
  color: var(--primary-light);
}

.portal-cine__btn--emp .portal-cine__btn-icon {
  background: rgba(59, 130, 246, 0.2);
  color: #93c5fd;
}

.portal-cine__btn-icon svg {
  width: 26px;
  height: 26px;
}

.portal-cine__btn-text {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}

.portal-cine__btn-text strong {
  font-size: 1.05rem;
  font-weight: 800;
}

.portal-cine__btn-text small {
  font-size: 0.8rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.55);
}

.portal-cine__btn-arrow {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  opacity: 0.6;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.portal-cine__btn:hover .portal-cine__btn-arrow,
.portal-cine__btn:focus-visible .portal-cine__btn-arrow {
  transform: translateX(4px);
  opacity: 1;
}

.portal-cine__trust {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  list-style: none;
  padding: 0;
}

.portal-cine__trust li {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.03em;
}

.footer--portal-v15 {
  position: relative;
  z-index: 2;
  background: #0a0a0c;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v15 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v15 {
    padding-bottom: 72px;
  }

  .portal-cine {
    padding-bottom: 5rem;
  }
}

@media (min-width: 640px) {
  .portal-cine__actions {
    flex-direction: row;
  }

  .portal-cine__btn {
    flex: 1;
    grid-template-columns: auto 1fr;
    padding: 1.35rem;
  }

  .portal-cine__btn-arrow {
    display: none;
  }

  .portal-cine__btn-text {
    text-align: center;
    align-items: center;
  }
}

@media (max-width: 639px) {
  .portal-cine {
    padding-top: 5rem;
    align-items: flex-start;
  }
}

/* ========== Portal Landing v16 — Fiber Fork ========== */
.portal-page--v16 {
  background: #f4f6fb;
  min-height: 100vh;
  color: var(--text-dark, #1a1a2e);
}

.portal-page--v16 .header--portal-v16 {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(244, 246, 251, 0.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-fork {
  position: relative;
  min-height: calc(100vh - 120px);
  padding: 2.5rem 0 3rem;
  overflow: hidden;
}

.portal-fork__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(227, 46, 106, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(227, 46, 106, 0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, black 10%, transparent 75%);
  pointer-events: none;
}

.portal-fork__inner {
  position: relative;
  z-index: 2;
  max-width: 920px;
}

.portal-fork__intro {
  text-align: center;
  margin-bottom: 1.5rem;
}

.portal-fork__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-muted, #6b7280);
  margin-bottom: 0.75rem;
}

.portal-fork__title {
  font-size: clamp(1.85rem, 5vw, 2.75rem);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: #111827;
  margin-bottom: 0.65rem;
}

.portal-fork__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-fork__lead {
  font-size: 0.98rem;
  color: #6b7280;
  line-height: 1.55;
  max-width: 420px;
  margin: 0 auto;
}

.portal-fork__scene {
  position: relative;
  height: 100px;
  margin-bottom: -0.5rem;
}

.portal-fork__lines {
  width: 100%;
  max-width: 520px;
  height: 100px;
  display: block;
  margin: 0 auto;
}

.portal-fork__line {
  stroke-dasharray: 8 6;
  animation: portalForkDash 1.2s linear infinite;
}

.portal-fork__line--emp {
  animation-direction: reverse;
}

@keyframes portalForkDash {
  to { stroke-dashoffset: -28; }
}

.portal-fork__node {
  fill: white;
  stroke: var(--primary, #e32e6a);
  stroke-width: 3;
}

.portal-fork__hub {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
  display: flex;
  align-items: center;
  justify-content: center;
}

.portal-fork__hub-ring {
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 2px solid rgba(227, 46, 106, 0.25);
  animation: portalForkPulse 2.4s ease-out infinite;
}

.portal-fork__hub-ring--2 {
  animation-delay: 1.2s;
}

@keyframes portalForkPulse {
  0% { transform: scale(0.85); opacity: 0.8; }
  100% { transform: scale(1.35); opacity: 0; }
}

.portal-fork__hub-logo {
  width: 56px;
  height: auto;
  position: relative;
  z-index: 1;
}

.portal-fork__paths {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-bottom: 2rem;
}

.portal-fork__card {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto auto auto;
  gap: 0.5rem 1rem;
  padding: 1.35rem 1.25rem;
  border-radius: var(--radius-lg, 16px);
  background: white;
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.portal-fork__card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  border-radius: var(--radius-lg, 16px) var(--radius-lg, 16px) 0 0;
}

.portal-fork__card--res::before {
  background: linear-gradient(90deg, #e32e6a, #c7207b);
}

.portal-fork__card--emp::before {
  background: linear-gradient(90deg, #3b82f6, #1d4ed8);
}

.portal-fork__card:hover,
.portal-fork__card:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
}

.portal-fork__card--res:hover,
.portal-fork__card--res:focus-visible {
  border-color: rgba(227, 46, 106, 0.25);
}

.portal-fork__card--emp:hover,
.portal-fork__card--emp:focus-visible {
  border-color: rgba(59, 130, 246, 0.25);
}

.portal-fork__card:focus-visible {
  outline: 2px solid var(--primary, #e32e6a);
  outline-offset: 3px;
}

.portal-fork__card-num {
  grid-row: 1 / 3;
  font-size: 2.5rem;
  font-weight: 900;
  line-height: 1;
  opacity: 0.08;
  align-self: center;
  user-select: none;
}

.portal-fork__card--res .portal-fork__card-num { color: #e32e6a; opacity: 0.12; }
.portal-fork__card--emp .portal-fork__card-num { color: #3b82f6; opacity: 0.12; }

.portal-fork__card-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  margin-top: 0.15rem;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.portal-fork__card--res .portal-fork__card-icon {
  background: rgba(227, 46, 106, 0.1);
  color: #e32e6a;
}

.portal-fork__card--emp .portal-fork__card-icon {
  background: rgba(59, 130, 246, 0.1);
  color: #2563eb;
}

.portal-fork__card-icon svg {
  width: 24px;
  height: 24px;
}

.portal-fork__card-body {
  grid-column: 2;
  grid-row: 1 / 3;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.portal-fork__card-body strong {
  font-size: 1.1rem;
  font-weight: 800;
  color: #111827;
}

.portal-fork__card-body span {
  font-size: 0.82rem;
  line-height: 1.45;
  color: #6b7280;
}

.portal-fork__card-tags {
  grid-column: 1 / 4;
  grid-row: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.portal-fork__card-tags em {
  font-style: normal;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  background: #f3f4f6;
  color: #4b5563;
}

.portal-fork__card--res .portal-fork__card-tags em:first-child {
  background: rgba(227, 46, 106, 0.1);
  color: #c7207b;
}

.portal-fork__card--emp .portal-fork__card-tags em:first-child {
  background: rgba(59, 130, 246, 0.1);
  color: #1d4ed8;
}

.portal-fork__card-arrow {
  grid-column: 3;
  grid-row: 1 / 4;
  align-self: center;
  width: 22px;
  height: 22px;
  color: #9ca3af;
  transition: transform 0.25s ease, color 0.25s ease;
}

.portal-fork__card:hover .portal-fork__card-arrow,
.portal-fork__card:focus-visible .portal-fork__card-arrow {
  transform: translateX(4px);
  color: inherit;
}

.portal-fork__trust {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.4rem 1.25rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.portal-fork__trust li {
  font-size: 0.75rem;
  font-weight: 600;
  color: #9ca3af;
}

.portal-fork__trust li:not(:last-child)::after {
  content: "·";
  margin-left: 1.25rem;
  color: #d1d5db;
}

.footer--portal-v16 {
  background: #f4f6fb;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v16 .footer__bottom p {
  color: #9ca3af;
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v16 {
    padding-bottom: 72px;
  }
}

@media (min-width: 720px) {
  .portal-fork__paths {
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
  }

  .portal-fork__card {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    text-align: center;
    padding: 1.75rem 1.5rem 1.5rem;
  }

  .portal-fork__card-num {
    grid-row: 1;
    font-size: 3rem;
    margin-bottom: 0.25rem;
  }

  .portal-fork__card-icon {
    grid-column: 1;
    grid-row: 2;
    margin: 0 auto 0.5rem;
  }

  .portal-fork__card-body {
    grid-column: 1;
    grid-row: 3;
    align-items: center;
  }

  .portal-fork__card-tags {
    grid-column: 1;
    grid-row: 4;
    justify-content: center;
    margin-top: 0.5rem;
  }

  .portal-fork__card-arrow {
    display: none;
  }
}

@media (max-width: 719px) {
  .portal-fork__card-num {
    display: none;
  }

  .portal-fork__scene {
    height: 80px;
    margin-bottom: 0.5rem;
  }

  .portal-fork__lines {
    max-width: 360px;
    height: 80px;
  }
}

/* ========== Portal Landing v17 — Neon Arcade ========== */
.portal-page--v17 {
  background: #0a0a10;
  min-height: 100vh;
  color: white;
}

.portal-page--v17 .header--portal-v17 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(10, 10, 16, 0.9) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v17 .header--portal-v17 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-arcade {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding: 5.5rem 0 3.5rem;
  overflow: hidden;
}

.portal-arcade__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.portal-arcade__grid-floor {
  position: absolute;
  left: -50%;
  right: -50%;
  bottom: -20%;
  height: 70%;
  background-image:
    linear-gradient(rgba(227, 46, 106, 0.15) 1px, transparent 1px),
    linear-gradient(90deg, rgba(227, 46, 106, 0.15) 1px, transparent 1px);
  background-size: 56px 56px;
  transform: perspective(500px) rotateX(68deg);
  transform-origin: center bottom;
  mask-image: linear-gradient(to top, black 30%, transparent 85%);
  opacity: 0.35;
}

.portal-arcade__glow {
  position: absolute;
  width: 50%;
  height: 60%;
  top: 20%;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.35;
}

.portal-arcade__glow--left {
  left: -10%;
  background: radial-gradient(circle, rgba(227, 46, 106, 0.5) 0%, transparent 70%);
}

.portal-arcade__glow--right {
  right: -10%;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.45) 0%, transparent 70%);
}

.portal-arcade__scanlines {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.03) 2px,
    rgba(0, 0, 0, 0.03) 4px
  );
  opacity: 0.4;
  pointer-events: none;
}

.portal-arcade__inner {
  position: relative;
  z-index: 2;
  max-width: 880px;
}

.portal-arcade__head {
  text-align: center;
  margin-bottom: 2.5rem;
}

.portal-arcade__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 0.85rem;
}

.portal-arcade__title {
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 0.75rem;
}

.portal-arcade__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-arcade__lead {
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.55;
  max-width: 400px;
  margin: 0 auto;
}

.portal-arcade__tiles {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.portal-arcade__tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 2rem 1.5rem 1.75rem;
  border-radius: 20px;
  text-decoration: none;
  color: white;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.portal-arcade__tile-frame {
  position: absolute;
  inset: -1px;
  border-radius: 20px;
  padding: 2px;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0.5;
  transition: opacity 0.3s ease;
}

.portal-arcade__tile--res .portal-arcade__tile-frame {
  background: linear-gradient(135deg, #e32e6a, transparent 50%, #c7207b);
}

.portal-arcade__tile--emp .portal-arcade__tile-frame {
  background: linear-gradient(135deg, #3b82f6, transparent 50%, #1d4ed8);
}

.portal-arcade__tile:hover,
.portal-arcade__tile:focus-visible {
  transform: translateY(-6px) scale(1.02);
}

.portal-arcade__tile--res:hover,
.portal-arcade__tile--res:focus-visible {
  box-shadow: 0 0 40px rgba(227, 46, 106, 0.35), 0 20px 50px rgba(0, 0, 0, 0.4);
  border-color: rgba(227, 46, 106, 0.4);
}

.portal-arcade__tile--emp:hover,
.portal-arcade__tile--emp:focus-visible {
  box-shadow: 0 0 40px rgba(59, 130, 246, 0.35), 0 20px 50px rgba(0, 0, 0, 0.4);
  border-color: rgba(59, 130, 246, 0.4);
}

.portal-arcade__tile:hover .portal-arcade__tile-frame,
.portal-arcade__tile:focus-visible .portal-arcade__tile-frame {
  opacity: 1;
}

.portal-arcade__tile:focus-visible {
  outline: 2px solid white;
  outline-offset: 4px;
}

.portal-arcade__tile-icon {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  transition: transform 0.3s ease;
}

.portal-arcade__tile--res .portal-arcade__tile-icon {
  background: rgba(227, 46, 106, 0.15);
  color: #f472b6;
  box-shadow: 0 0 24px rgba(227, 46, 106, 0.2);
}

.portal-arcade__tile--emp .portal-arcade__tile-icon {
  background: rgba(59, 130, 246, 0.15);
  color: #93c5fd;
  box-shadow: 0 0 24px rgba(59, 130, 246, 0.2);
}

.portal-arcade__tile-icon svg {
  width: 36px;
  height: 36px;
}

.portal-arcade__tile:hover .portal-arcade__tile-icon,
.portal-arcade__tile:focus-visible .portal-arcade__tile-icon {
  transform: scale(1.08);
}

.portal-arcade__tile-label {
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  margin-bottom: 0.35rem;
}

.portal-arcade__tile-spec {
  font-size: 0.82rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 1.25rem;
}

.portal-arcade__tile-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.55rem 1.1rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.05);
  transition: background 0.25s ease, border-color 0.25s ease;
}

.portal-arcade__tile-cta svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s ease;
}

.portal-arcade__tile--res:hover .portal-arcade__tile-cta,
.portal-arcade__tile--res:focus-visible .portal-arcade__tile-cta {
  background: rgba(227, 46, 106, 0.2);
  border-color: rgba(227, 46, 106, 0.5);
}

.portal-arcade__tile--emp:hover .portal-arcade__tile-cta,
.portal-arcade__tile--emp:focus-visible .portal-arcade__tile-cta {
  background: rgba(59, 130, 246, 0.2);
  border-color: rgba(59, 130, 246, 0.5);
}

.portal-arcade__tile:hover .portal-arcade__tile-cta svg,
.portal-arcade__tile:focus-visible .portal-arcade__tile-cta svg {
  transform: translateX(3px);
}

.portal-arcade__trust {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.portal-arcade__trust li {
  font-size: 0.75rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.35);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.footer--portal-v17 {
  position: relative;
  z-index: 2;
  background: #0a0a10;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v17 .footer__bottom p {
  color: rgba(255, 255, 255, 0.3);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v17 {
    padding-bottom: 72px;
  }
}

@media (min-width: 640px) {
  .portal-arcade__tiles {
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
  }

  .portal-arcade__tile {
    min-height: 320px;
    justify-content: center;
  }
}

@media (max-width: 639px) {
  .portal-arcade {
    padding-top: 4.5rem;
    align-items: flex-start;
  }
}

/* ========== Portal Landing v18 — Boarding Pass ========== */
.portal-page--v18 {
  background: #f5f0e8;
  min-height: 100vh;
  color: #1c1917;
}

.portal-page--v18 .header--portal-v18 {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(245, 240, 232, 0.94);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-board {
  padding: 2.5rem 0 3rem;
  min-height: calc(100vh - 120px);
}

.portal-board__inner {
  max-width: 720px;
}

.portal-board__intro {
  text-align: center;
  margin-bottom: 2rem;
}

.portal-board__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #78716c;
  margin-bottom: 0.75rem;
}

.portal-board__title {
  font-size: clamp(1.85rem, 5vw, 2.65rem);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: #1c1917;
  margin-bottom: 0.65rem;
}

.portal-board__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-board__lead {
  font-size: 0.95rem;
  color: #78716c;
  line-height: 1.55;
  max-width: 380px;
  margin: 0 auto;
}

.portal-board__passes {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.portal-board__pass {
  position: relative;
  display: flex;
  align-items: stretch;
  min-height: 140px;
  background: #fffef9;
  border-radius: 14px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.04);
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.portal-board__pass::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
}

.portal-board__pass--res::before {
  background: linear-gradient(90deg, #e32e6a, #c7207b);
}

.portal-board__pass--emp::before {
  background: linear-gradient(90deg, #2563eb, #1d4ed8);
}

.portal-board__pass:hover,
.portal-board__pass:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.05);
}

.portal-board__pass:focus-visible {
  outline: 2px solid var(--primary, #e32e6a);
  outline-offset: 3px;
}

.portal-board__stub {
  flex: 0 0 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 1rem 0.5rem;
  background: #fafaf9;
  border-right: none;
}

.portal-board__stub-code {
  font-size: 1.1rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.portal-board__pass--res .portal-board__stub-code { color: #c7207b; }
.portal-board__pass--emp .portal-board__stub-code { color: #1d4ed8; }

.portal-board__stub-brand {
  font-size: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  color: #a8a29e;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.portal-board__tear {
  position: relative;
  flex: 0 0 0;
  width: 0;
  border-left: 2px dashed #d6d3d1;
  margin: 12px 0;
}

.portal-board__tear::before,
.portal-board__tear::after {
  content: "";
  position: absolute;
  left: -9px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #f5f0e8;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
}

.portal-board__tear::before { top: -20px; }
.portal-board__tear::after { bottom: -20px; }

.portal-board__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1.15rem 1.25rem 1rem;
  min-width: 0;
}

.portal-board__row {
  display: flex;
  gap: 1rem;
  align-items: flex-end;
}

.portal-board__row + .portal-board__row {
  margin-top: 0.65rem;
}

.portal-board__field {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  flex: 1;
  min-width: 0;
}

.portal-board__field small {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #a8a29e;
}

.portal-board__field strong {
  font-size: 0.95rem;
  font-weight: 800;
  color: #1c1917;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-board__field--barcode {
  flex: 0 0 72px;
  height: 36px;
  background: repeating-linear-gradient(
    90deg,
    #1c1917 0,
    #1c1917 2px,
    transparent 2px,
    transparent 5px
  );
  opacity: 0.15;
  border-radius: 2px;
  align-self: center;
}

.portal-board__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px dashed #e7e5e4;
}

.portal-board__stamp {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.35rem 0.75rem;
  border: 2px solid currentColor;
  border-radius: 4px;
  transform: rotate(-2deg);
  transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease;
}

.portal-board__pass--res .portal-board__stamp {
  color: #c7207b;
  border-color: #c7207b;
}

.portal-board__pass--emp .portal-board__stamp {
  color: #1d4ed8;
  border-color: #1d4ed8;
}

.portal-board__pass:hover .portal-board__stamp,
.portal-board__pass:focus-visible .portal-board__stamp {
  transform: rotate(0deg) scale(1.05);
}

.portal-board__pass--res:hover .portal-board__stamp,
.portal-board__pass--res:focus-visible .portal-board__stamp {
  background: #c7207b;
  color: white;
}

.portal-board__pass--emp:hover .portal-board__stamp,
.portal-board__pass--emp:focus-visible .portal-board__stamp {
  background: #1d4ed8;
  color: white;
}

.portal-board__arrow {
  width: 22px;
  height: 22px;
  color: #a8a29e;
  transition: transform 0.25s ease, color 0.25s ease;
}

.portal-board__pass:hover .portal-board__arrow,
.portal-board__pass:focus-visible .portal-board__arrow {
  transform: translateX(4px);
  color: inherit;
}

.portal-board__trust {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.4rem 1.25rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.portal-board__trust li {
  font-size: 0.75rem;
  font-weight: 600;
  color: #a8a29e;
}

.footer--portal-v18 {
  background: #f5f0e8;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v18 .footer__bottom p {
  color: #a8a29e;
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v18 {
    padding-bottom: 72px;
  }
}

@media (min-width: 640px) {
  .portal-board__passes {
    gap: 1.5rem;
  }

  .portal-board__stub {
    flex: 0 0 88px;
  }

  .portal-board__body {
    padding: 1.35rem 1.5rem 1.15rem;
  }

  .portal-board__field strong {
    font-size: 1.05rem;
  }
}

@media (max-width: 480px) {
  .portal-board__row {
    flex-wrap: wrap;
  }

  .portal-board__field--barcode {
    display: none;
  }

  .portal-board__stub {
    flex: 0 0 56px;
  }

  .portal-board__stub-code {
    font-size: 0.95rem;
  }
}

/* ========== Portal Landing v19 — Brutalist Gate ========== */
.portal-page--v19 {
  background: #fff;
  min-height: 100vh;
  color: #0a0a0a;
}

.portal-page--v19 .header--portal-v19 {
  position: sticky;
  top: 0;
  z-index: 50;
  background: #fff;
  border-bottom: 3px solid #0a0a0a;
}

.portal-brut {
  padding: 2.5rem 0 3rem;
  min-height: calc(100vh - 120px);
}

.portal-brut__inner {
  max-width: 960px;
}

.portal-brut__head {
  margin-bottom: 2.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 3px solid #0a0a0a;
}

.portal-brut__eyebrow {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #737373;
  margin-bottom: 0.75rem;
}

.portal-brut__title {
  font-size: clamp(2.5rem, 8vw, 4.5rem);
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

.portal-brut__lead {
  font-size: 0.95rem;
  font-weight: 600;
  color: #525252;
  max-width: 320px;
}

.portal-brut__gates {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border: 3px solid #0a0a0a;
  margin-bottom: 2rem;
}

.portal-brut__gate {
  position: relative;
  display: block;
  min-height: 200px;
  padding: 1.75rem 1.5rem;
  text-decoration: none;
  color: #0a0a0a;
  background: #fff;
  overflow: hidden;
  transition: background 0.25s ease, color 0.25s ease;
}

.portal-brut__gate + .portal-brut__gate {
  border-top: 3px solid #0a0a0a;
}

.portal-brut__mega {
  position: absolute;
  right: -0.05em;
  bottom: -0.15em;
  font-size: clamp(5rem, 18vw, 10rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.06em;
  color: #0a0a0a;
  opacity: 0.06;
  pointer-events: none;
  user-select: none;
  transition: opacity 0.25s ease, color 0.25s ease;
}

.portal-brut__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-width: 280px;
}

.portal-brut__index {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.portal-brut__name {
  font-size: 1.5rem;
  font-weight: 900;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

.portal-brut__spec {
  font-size: 0.82rem;
  font-weight: 600;
  color: #525252;
  transition: color 0.25s ease;
}

.portal-brut__go {
  margin-top: 0.75rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.portal-brut__gate--res:hover,
.portal-brut__gate--res:focus-visible {
  background: #0a0a0a;
  color: #fff;
}

.portal-brut__gate--res:hover .portal-brut__spec,
.portal-brut__gate--res:focus-visible .portal-brut__spec {
  color: rgba(255, 255, 255, 0.65);
}

.portal-brut__gate--res:hover .portal-brut__mega,
.portal-brut__gate--res:focus-visible .portal-brut__mega {
  color: #e32e6a;
  opacity: 0.25;
}

.portal-brut__gate--res:hover .portal-brut__go,
.portal-brut__gate--res:focus-visible .portal-brut__go {
  opacity: 1;
  transform: translateY(0);
  color: #f472b6;
}

.portal-brut__gate--emp:hover,
.portal-brut__gate--emp:focus-visible {
  background: #0a0a0a;
  color: #fff;
}

.portal-brut__gate--emp:hover .portal-brut__spec,
.portal-brut__gate--emp:focus-visible .portal-brut__spec {
  color: rgba(255, 255, 255, 0.65);
}

.portal-brut__gate--emp:hover .portal-brut__mega,
.portal-brut__gate--emp:focus-visible .portal-brut__mega {
  color: #3b82f6;
  opacity: 0.25;
}

.portal-brut__gate--emp:hover .portal-brut__go,
.portal-brut__gate--emp:focus-visible .portal-brut__go {
  opacity: 1;
  transform: translateY(0);
  color: #93c5fd;
}

.portal-brut__gate:focus-visible {
  outline: 3px solid #e32e6a;
  outline-offset: -6px;
}

.portal-brut__gate--res:focus-visible {
  outline-color: #e32e6a;
}

.portal-brut__gate--emp:focus-visible {
  outline-color: #3b82f6;
}

.portal-brut__trust {
  display: flex;
  gap: 2rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.portal-brut__trust li {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #a3a3a3;
}

.footer--portal-v19 {
  background: #fff;
  border-top: 3px solid #0a0a0a;
  padding: 0.85rem 0;
}

.footer--portal-v19 .footer__bottom p {
  color: #737373;
  font-size: 0.8rem;
  text-align: left;
  margin: 0;
  font-weight: 600;
}

@media (max-width: 1100px) {
  .portal-page--v19 {
    padding-bottom: 72px;
  }
}

@media (min-width: 640px) {
  .portal-brut__gates {
    grid-template-columns: 1fr 1fr;
  }

  .portal-brut__gate + .portal-brut__gate {
    border-top: none;
    border-left: 3px solid #0a0a0a;
  }

  .portal-brut__gate {
    min-height: 280px;
    padding: 2rem;
  }

  .portal-brut__name {
    font-size: 1.75rem;
  }
}

@media (max-width: 639px) {
  .portal-brut__go {
    opacity: 1;
    transform: none;
    color: #737373;
  }

  .portal-brut__gate--res .portal-brut__go { color: #c7207b; }
  .portal-brut__gate--emp .portal-brut__go { color: #1d4ed8; }
}

/* ========== Portal Landing v20 — Hybrid Hub (Best Practice) ========== */
.portal-page--v20 {
  background: #f8fafc;
  min-height: 100vh;
  color: #0f172a;
}

.portal-page--v20 .header--portal-v20 {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
}

.portal-hub__nav {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: auto;
  margin-right: 0.5rem;
}

.portal-hub__nav a {
  font-size: 0.82rem;
  font-weight: 700;
  color: #475569;
  text-decoration: none;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.portal-hub__nav a:hover,
.portal-hub__nav a:focus-visible {
  color: var(--primary, #e32e6a);
  background: rgba(227, 46, 106, 0.06);
  border-color: rgba(227, 46, 106, 0.15);
}

.portal-hub__nav a:focus-visible {
  outline: 2px solid var(--primary, #e32e6a);
  outline-offset: 2px;
}

.portal-hub__trust-bar {
  background: linear-gradient(90deg, #1e1b2e 0%, #2d1f3d 50%, #1e1b2e 100%);
  color: rgba(255, 255, 255, 0.88);
  padding: 0.65rem 0;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.portal-hub__trust-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem 0.75rem;
  text-align: center;
}

.portal-hub__trust-sep {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.35);
  flex-shrink: 0;
}

.portal-hub {
  padding: 2.5rem 0 3rem;
}

.portal-hub__inner {
  max-width: 960px;
}

.portal-hub__hero {
  text-align: center;
  margin-bottom: 2.25rem;
}

.portal-hub__title {
  font-size: clamp(1.75rem, 4.5vw, 2.5rem);
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #0f172a;
  margin-bottom: 0.85rem;
}

.portal-hub__lead {
  font-size: 1rem;
  line-height: 1.65;
  color: #64748b;
  max-width: 620px;
  margin: 0 auto;
}

.portal-hub__lead strong {
  color: #334155;
  font-weight: 700;
}

.portal-hub__paths {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.portal-hub__card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--radius-lg, 16px);
  border: 1px solid #e2e8f0;
  padding: 1.5rem;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
  transition: box-shadow 0.28s ease, border-color 0.28s ease, transform 0.28s ease;
}

.portal-hub__card:hover {
  box-shadow: 0 12px 36px rgba(15, 23, 42, 0.08);
  transform: translateY(-2px);
}

.portal-hub__card--res:hover {
  border-color: rgba(227, 46, 106, 0.25);
}

.portal-hub__card--emp:hover {
  border-color: rgba(37, 99, 235, 0.25);
}

.portal-hub__card-head {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.15rem;
}

.portal-hub__icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.portal-hub__card--res .portal-hub__icon {
  background: rgba(227, 46, 106, 0.1);
  color: #c7207b;
}

.portal-hub__card--emp .portal-hub__icon {
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
}

.portal-hub__icon svg {
  width: 26px;
  height: 26px;
}

.portal-hub__card-title {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #0f172a;
  margin: 0 0 0.2rem;
}

.portal-hub__card-sub {
  font-size: 0.85rem;
  font-weight: 600;
  color: #64748b;
  margin: 0;
}

.portal-hub__benefits {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.portal-hub__benefits li {
  position: relative;
  padding-left: 1.35rem;
  font-size: 0.88rem;
  line-height: 1.45;
  color: #334155;
}

.portal-hub__benefits li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.portal-hub__card--res .portal-hub__benefits li::before {
  background: #e32e6a;
}

.portal-hub__card--emp .portal-hub__benefits li::before {
  background: #2563eb;
}

.portal-hub__preview {
  font-size: 0.78rem;
  line-height: 1.5;
  color: #94a3b8;
  margin: 0 0 1.15rem;
  padding: 0.65rem 0.75rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 3px solid #e2e8f0;
}

.portal-hub__card--res .portal-hub__preview {
  border-left-color: rgba(227, 46, 106, 0.35);
}

.portal-hub__card--emp .portal-hub__preview {
  border-left-color: rgba(37, 99, 235, 0.35);
}

.portal-hub__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: auto;
  padding: 0.85rem 1.25rem;
  border-radius: var(--radius-md, 10px);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
  text-align: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.portal-hub__cta--res {
  background: var(--gradient-brand);
  color: #fff;
  box-shadow: 0 4px 16px rgba(227, 46, 106, 0.25);
}

.portal-hub__cta--res:hover,
.portal-hub__cta--res:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(227, 46, 106, 0.35);
}

.portal-hub__cta--emp {
  background: #1e40af;
  color: #fff;
  box-shadow: 0 4px 16px rgba(30, 64, 175, 0.25);
}

.portal-hub__cta--emp:hover,
.portal-hub__cta--emp:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(30, 64, 175, 0.35);
  background: #1d4ed8;
}

.portal-hub__cta:focus-visible {
  outline: 2px solid #0f172a;
  outline-offset: 3px;
}

.portal-hub__help {
  text-align: center;
  padding: 1.25rem 1rem;
  background: #fff;
  border: 1px dashed #cbd5e1;
  border-radius: var(--radius-lg, 16px);
}

.portal-hub__help p {
  margin: 0;
  font-size: 0.9rem;
  color: #64748b;
}

.portal-hub__help p + p {
  margin-top: 0.35rem;
}

.portal-hub__help-actions a {
  font-weight: 700;
  color: var(--primary, #e32e6a);
  text-decoration: none;
}

.portal-hub__help-actions a:hover,
.portal-hub__help-actions a:focus-visible {
  text-decoration: underline;
}

.footer--portal-v20 {
  background: #fff;
  border-top: 1px solid #e2e8f0;
  padding: 0.85rem 0;
}

.footer--portal-v20 .footer__bottom p {
  color: #94a3b8;
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v20 {
    padding-bottom: 72px;
  }

  .portal-hub__nav {
    display: none;
  }
}

@media (min-width: 720px) {
  .portal-hub__paths {
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    align-items: stretch;
  }

  .portal-hub__card {
    padding: 1.75rem;
  }
}

@media (max-width: 639px) {
  .portal-hub__trust-sep {
    display: none;
  }

  .portal-hub__trust-inner {
    flex-direction: column;
    gap: 0.25rem;
  }

  .portal-hub {
    padding-top: 1.75rem;
  }
}

/* ========== Portal Landing v21 — Split Typo (based on v10) ========== */
.portal-page--v21 {
  background: var(--logo-black, #0a0a0a);
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v21 .header--portal-v21 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.88) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v21 .header--portal-v21 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-page--v21 .header--portal-v21 .utility-card {
  color: rgba(255, 255, 255, 0.82);
}

.portal-page--v21 .header--portal-v21 .utility-card:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.portal-duo {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding-top: 72px;
  padding-bottom: 2.75rem;
  isolation: isolate;
}

.portal-duo__grain {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: 0.22;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at center, #000, transparent 78%);
}

.portal-duo__seam {
  position: absolute;
  top: 0;
  bottom: 2.75rem;
  left: 50%;
  z-index: 18;
  width: 3px;
  transform: translateX(-50%) skewX(-6deg);
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(255, 255, 255, 0.15) 18%,
    rgba(227, 46, 106, 0.85) 42%,
    rgba(255, 255, 255, 0.95) 50%,
    rgba(59, 130, 246, 0.85) 58%,
    rgba(255, 255, 255, 0.15) 82%,
    transparent 100%
  );
  box-shadow:
    0 0 18px rgba(227, 46, 106, 0.35),
    0 0 18px rgba(59, 130, 246, 0.35);
  animation: portalDuoSeamGlow 4s ease-in-out infinite;
}

@keyframes portalDuoSeamGlow {
  0%, 100% { opacity: 0.72; filter: blur(0); }
  50% { opacity: 1; filter: blur(0.5px); }
}

.portal-duo__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 72px - 2.75rem);
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition:
    flex 0.55s cubic-bezier(0.4, 0, 0.2, 1),
    filter 0.45s ease,
    clip-path 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-duo__half--res {
  background:
    radial-gradient(circle at 22% 38%, rgba(255, 255, 255, 0.16) 0%, transparent 42%),
    var(--gradient-brand);
}

.portal-duo__half--emp {
  background:
    radial-gradient(circle at 78% 62%, rgba(96, 165, 250, 0.18) 0%, transparent 46%),
    linear-gradient(155deg, #0f172a 0%, #1e3a5f 45%, #0c1929 100%);
}

.portal-duo__veil {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.38);
  opacity: 0;
  transition: opacity 0.45s ease;
  pointer-events: none;
}

.portal-duo:has(.portal-duo__half--res:hover) .portal-duo__half--emp .portal-duo__veil,
.portal-duo:has(.portal-duo__half--res:focus-visible) .portal-duo__half--emp .portal-duo__veil,
.portal-duo:has(.portal-duo__half--emp:hover) .portal-duo__half--res .portal-duo__veil,
.portal-duo:has(.portal-duo__half--emp:focus-visible) .portal-duo__half--res .portal-duo__veil {
  opacity: 1;
}

.portal-duo__half:hover,
.portal-duo__half:focus-visible {
  flex: 1.48;
  z-index: 6;
}

.portal-duo__half:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
}

.portal-duo__ghost {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: clamp(7rem, 22vw, 15rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.14);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  transition:
    opacity 0.4s ease,
    transform 0.55s cubic-bezier(0.4, 0, 0.2, 1),
    -webkit-text-stroke-color 0.4s ease;
}

.portal-duo__half--res .portal-duo__ghost {
  -webkit-text-stroke-color: rgba(255, 255, 255, 0.16);
}

.portal-duo__half--emp .portal-duo__ghost {
  -webkit-text-stroke-color: rgba(147, 197, 253, 0.18);
}

.portal-duo__half:hover .portal-duo__ghost,
.portal-duo__half:focus-visible .portal-duo__ghost {
  transform: translate(-50%, -54%) scale(1.05);
  -webkit-text-stroke-color: rgba(255, 255, 255, 0.28);
}

.portal-duo__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem 1.5rem;
  max-width: 24rem;
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-duo__half:hover .portal-duo__content,
.portal-duo__half:focus-visible .portal-duo__content {
  transform: translateY(-8px);
}

.portal-duo__label {
  display: inline-block;
  margin-bottom: 0.65rem;
  padding: 0.38rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.06);
}

.portal-duo__word {
  display: block;
  font-size: clamp(3.75rem, 10vw, 7rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: -0.04em;
  margin-bottom: 0.85rem;
  text-transform: uppercase;
  transition: transform 0.4s ease, text-shadow 0.4s ease;
}

.portal-duo__half--res .portal-duo__word {
  text-shadow: 0 6px 32px rgba(0, 0, 0, 0.22);
}

.portal-duo__half--emp .portal-duo__word {
  background: linear-gradient(180deg, #ffffff 0%, rgba(191, 219, 254, 0.82) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-duo__half:hover .portal-duo__word,
.portal-duo__half:focus-visible .portal-duo__word {
  transform: scale(1.04);
}

.portal-duo__half--res:hover .portal-duo__word,
.portal-duo__half--res:focus-visible .portal-duo__word {
  text-shadow: 0 8px 40px rgba(0, 0, 0, 0.28);
}

.portal-duo__hint {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.55;
  margin: 0 0 1.35rem;
}

.portal-duo__enter {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.7rem 1.4rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.1);
  opacity: 0.72;
  transform: translateY(0.2rem);
  transition:
    background 0.25s ease,
    transform 0.25s ease,
    border-color 0.25s ease,
    opacity 0.25s ease,
    box-shadow 0.25s ease;
}

.portal-duo__enter svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s ease;
}

.portal-duo__half:hover .portal-duo__enter,
.portal-duo__half:focus-visible .portal-duo__enter {
  opacity: 1;
  transform: translateY(0);
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.62);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
}

.portal-duo__half--res:hover .portal-duo__enter,
.portal-duo__half--res:focus-visible .portal-duo__enter {
  background: rgba(255, 255, 255, 0.96);
  color: #e32e6a;
  border-color: transparent;
}

.portal-duo__half--emp:hover .portal-duo__enter,
.portal-duo__half--emp:focus-visible .portal-duo__enter {
  background: #2563eb;
  border-color: transparent;
}

.portal-duo__half:hover .portal-duo__enter svg,
.portal-duo__half:focus-visible .portal-duo__enter svg {
  transform: translateX(4px);
}

.portal-duo__seal {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 22;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.38rem;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.96);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.4),
    0 12px 52px rgba(0, 0, 0, 0.45);
  padding: 0.9rem;
  pointer-events: none;
}

.portal-duo__seal-orbit {
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  background: conic-gradient(from 0deg, #e32e6a, #ffffff, #3b82f6, #e32e6a);
  animation: portalDuoOrbit 6s linear infinite;
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
}

@keyframes portalDuoOrbit {
  to { transform: rotate(360deg); }
}

.portal-duo__seal-ring {
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 2px solid rgba(227, 46, 106, 0.35);
  animation: portalDuoPulse 2.8s ease-out infinite;
}

.portal-duo__seal-ring--2 {
  animation-delay: 1.4s;
  border-color: rgba(59, 130, 246, 0.3);
}

@keyframes portalDuoPulse {
  0% { transform: scale(0.9); opacity: 0.75; }
  100% { transform: scale(1.32); opacity: 0; }
}

.portal-duo__seal img {
  width: 54px;
  height: auto;
  object-fit: contain;
  position: relative;
  z-index: 1;
}

.portal-duo__seal-text {
  font-size: 0.52rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted, #6b7280);
  text-align: center;
  line-height: 1.25;
  position: relative;
  z-index: 1;
}

.portal-duo__bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 25;
  padding: 0.75rem 1rem;
  background: rgba(0, 0, 0, 0.62);
  backdrop-filter: blur(12px);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  pointer-events: none;
}

.portal-duo__bar p {
  margin: 0;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: rgba(255, 255, 255, 0.58);
  text-align: center;
  line-height: 1.45;
}

.footer--portal-v21 {
  position: relative;
  z-index: 10;
  background: var(--logo-black, #0a0a0a);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v21 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (min-width: 901px) {
  .portal-duo__half--res {
    clip-path: polygon(0 0, 100% 0, calc(100% - 5vw) 100%, 0 100%);
    margin-right: -2vw;
  }

  .portal-duo__half--emp {
    clip-path: polygon(5vw 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -2vw;
  }

  .portal-duo:has(.portal-duo__half--res:hover) .portal-duo__half--res,
  .portal-duo:has(.portal-duo__half--res:focus-visible) .portal-duo__half--res {
    clip-path: polygon(0 0, 100% 0, calc(100% - 3vw) 100%, 0 100%);
  }

  .portal-duo:has(.portal-duo__half--emp:hover) .portal-duo__half--emp,
  .portal-duo:has(.portal-duo__half--emp:focus-visible) .portal-duo__half--emp {
    clip-path: polygon(3vw 0, 100% 0, 100% 100%, 0 100%);
  }
}

@media (max-width: 1100px) {
  .portal-page--v21 {
    padding-bottom: 72px;
  }

  .portal-duo {
    flex-direction: column;
    padding-top: 64px;
    padding-bottom: 3rem;
  }

  .portal-duo__seam {
    top: 50%;
    bottom: auto;
    left: 0;
    right: 0;
    width: auto;
    height: 3px;
    transform: translateY(-50%) skewY(-3deg);
    background: linear-gradient(
      90deg,
      transparent 0%,
      rgba(227, 46, 106, 0.85) 42%,
      rgba(255, 255, 255, 0.95) 50%,
      rgba(59, 130, 246, 0.85) 58%,
      transparent 100%
    );
  }

  .portal-duo__half {
    min-height: 42vh;
    margin: 0 !important;
    clip-path: none !important;
  }

  .portal-duo__half:hover,
  .portal-duo__half:focus-visible {
    flex: 1.28;
  }

  .portal-duo__seal {
    width: 92px;
    height: 92px;
  }

  .portal-duo__seal img {
    width: 44px;
  }

  .portal-duo__seal-text {
    font-size: 0.48rem;
  }
}

@media (max-width: 480px) {
  .portal-duo__word {
    font-size: clamp(2.75rem, 14vw, 4rem);
  }

  .portal-duo__half {
    min-height: 36vh;
  }

  .portal-duo__ghost {
    font-size: clamp(5rem, 28vw, 8rem);
  }

  .portal-duo__bar p {
    font-size: 0.62rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-duo__seam,
  .portal-duo__seal-orbit,
  .portal-duo__seal-ring {
    animation: none;
  }

  .portal-duo__half,
  .portal-duo__ghost,
  .portal-duo__content,
  .portal-duo__enter,
  .portal-duo__veil {
    transition: none;
  }
}

/* ========== Portal Landing v22 — Wave Horizon ========== */
.portal-page--v22 {
  background: #0f172a;
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v22 .header--portal-v22 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v22 .header--portal-v22 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-wave {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-wave__zone {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(50vh - 36px);
  text-decoration: none;
  color: white;
  position: relative;
  overflow: hidden;
  transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-wave__zone--res {
  background: linear-gradient(165deg, #c7207b 0%, #e32e6a 40%, #a61d5a 100%);
}

.portal-wave__zone--emp {
  background: linear-gradient(195deg, #0f172a 0%, #1e3a5f 50%, #0c1929 100%);
}

.portal-wave__zone--res::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 25% 30%, rgba(255, 255, 255, 0.15) 0%, transparent 50%);
  pointer-events: none;
}

.portal-wave__zone--emp::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 75% 70%, rgba(96, 165, 250, 0.12) 0%, transparent 45%);
  pointer-events: none;
}

.portal-wave__zone:hover,
.portal-wave__zone:focus-visible {
  flex: 1.35;
}

.portal-wave__zone:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
  z-index: 4;
}

.portal-wave__zone-inner {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem 1.5rem;
  max-width: 24rem;
  transition: transform 0.4s ease;
}

.portal-wave__zone:hover .portal-wave__zone-inner,
.portal-wave__zone:focus-visible .portal-wave__zone-inner {
  transform: scale(1.04);
}

.portal-wave__tag {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  margin-bottom: 1rem;
}

.portal-wave__title {
  display: block;
  font-size: clamp(2rem, 6vw, 3.25rem);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-bottom: 0.65rem;
}

.portal-wave__desc {
  font-size: 0.9rem;
  opacity: 0.85;
  line-height: 1.5;
  margin: 0 0 1.25rem;
}

.portal-wave__cta {
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.6rem 1.2rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.35);
  transition: background 0.25s ease, transform 0.25s ease;
}

.portal-wave__zone:hover .portal-wave__cta,
.portal-wave__zone:focus-visible .portal-wave__cta {
  background: rgba(255, 255, 255, 0.28);
  transform: translateY(-2px);
}

.portal-wave__curve {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  z-index: 10;
  height: 80px;
  pointer-events: none;
  line-height: 0;
}

.portal-wave__svg {
  width: 100%;
  height: 80px;
  display: block;
}

.portal-wave__path {
  fill: white;
  filter: drop-shadow(0 -4px 12px rgba(0, 0, 0, 0.15));
}

.portal-wave__badge {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 15;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  padding: 0.85rem 1.1rem;
  background: white;
  border-radius: 999px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.25);
  pointer-events: none;
}

.portal-wave__badge img {
  width: 56px;
  height: auto;
}

.portal-wave__badge span {
  font-size: 0.52rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
  white-space: nowrap;
}

.footer--portal-v22 {
  position: relative;
  z-index: 5;
  background: #0f172a;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v22 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v22 {
    padding-bottom: 72px;
  }

  .portal-wave {
    padding-top: 64px;
  }

  .portal-wave__zone {
    min-height: 38vh;
  }

  .portal-wave__zone:hover,
  .portal-wave__zone:focus-visible {
    flex: 1.2;
  }

  .portal-wave__badge {
    padding: 0.7rem 0.95rem;
  }

  .portal-wave__badge img {
    width: 48px;
  }
}

@media (min-width: 901px) {
  .portal-wave {
    flex-direction: row;
    padding-top: 72px;
  }

  .portal-wave__zone {
    min-height: calc(100vh - 72px);
  }

  .portal-wave__curve {
    top: 0;
    bottom: 0;
    left: 50%;
    right: auto;
    width: 6px;
    height: auto;
    transform: translateX(-50%);
    background: white;
    box-shadow: 0 0 24px rgba(0, 0, 0, 0.2);
  }

  .portal-wave__svg {
    display: none;
  }

  .portal-wave__zone-inner {
    max-width: 20rem;
  }

  .portal-wave__zone--res .portal-wave__zone-inner {
    margin-right: 1.5rem;
  }

  .portal-wave__zone--emp .portal-wave__zone-inner {
    margin-left: 1.5rem;
  }
}

@media (max-width: 480px) {
  .portal-wave__title {
    font-size: clamp(1.75rem, 8vw, 2.25rem);
  }

  .portal-wave__badge span {
    font-size: 0.48rem;
  }
}

/* ========== Portal Landing v23 — Bento Grid ========== */
.portal-page--v23 {
  background: #eef2f6;
  min-height: 100vh;
  color: #0f172a;
}

.portal-page--v23 .header--portal-v23 {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(238, 242, 246, 0.94);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.portal-bento {
  padding: 2.25rem 0 3rem;
  min-height: calc(100vh - 80px);
}

.portal-bento__wrap {
  max-width: 980px;
}

.portal-bento__intro {
  text-align: center;
  margin-bottom: 2rem;
}

.portal-bento__title {
  font-size: clamp(1.85rem, 5vw, 2.75rem);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin-bottom: 0.65rem;
}

.portal-bento__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.portal-bento__lead {
  font-size: 0.95rem;
  color: #64748b;
  margin: 0;
}

.portal-bento__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}

.portal-bento__cell {
  border-radius: 18px;
  overflow: hidden;
  min-height: 100px;
}

.portal-bento__cell--main {
  grid-column: 1 / -1;
  grid-row: span 2;
  min-height: 220px;
}

.portal-bento__cell--wide {
  grid-column: 1 / -1;
  min-height: 180px;
}

a.portal-bento__cell {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.35rem;
  text-decoration: none;
  color: white;
  position: relative;
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

a.portal-bento__cell:hover,
a.portal-bento__cell:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12);
}

a.portal-bento__cell:focus-visible {
  outline: 2px solid var(--primary, #e32e6a);
  outline-offset: 3px;
}

.portal-bento__cell--res {
  background: linear-gradient(145deg, #e32e6a 0%, #c7207b 55%, #a61d5a 100%);
}

.portal-bento__cell--emp {
  background: linear-gradient(145deg, #1e40af 0%, #1e3a5f 55%, #0f172a 100%);
}

.portal-bento__cell-icon {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.9;
}

.portal-bento__cell-icon svg {
  width: 24px;
  height: 24px;
}

.portal-bento__cell-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.85;
  margin-bottom: 0.35rem;
}

.portal-bento__cell-headline {
  font-size: clamp(1.35rem, 4vw, 1.85rem);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 0.35rem;
}

.portal-bento__cell-spec {
  font-size: 0.82rem;
  opacity: 0.85;
  margin-bottom: 0.75rem;
}

.portal-bento__cell-go {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  align-self: flex-start;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.3);
  transition: background 0.2s ease;
}

a.portal-bento__cell:hover .portal-bento__cell-go,
a.portal-bento__cell:focus-visible .portal-bento__cell-go {
  background: rgba(255, 255, 255, 0.28);
}

.portal-bento__cell--chip {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 1rem 0.75rem;
  gap: 0.15rem;
}

.portal-bento__cell--chip strong {
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.02em;
}

.portal-bento__cell--chip span {
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.75;
}

.portal-bento__cell--chip-pink {
  background: #fce7f3;
  color: #9d174d;
}

.portal-bento__cell--chip-dark {
  background: #1e293b;
  color: white;
}

.portal-bento__cell--chip-blue {
  background: #dbeafe;
  color: #1e40af;
}

.portal-bento__cell--chip-muted {
  background: white;
  color: #475569;
  border: 1px solid #e2e8f0;
}

.footer--portal-v23 {
  background: #eef2f6;
  border-top: 1px solid #e2e8f0;
  padding: 0.85rem 0;
}

.footer--portal-v23 .footer__bottom p {
  color: #94a3b8;
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v23 {
    padding-bottom: 72px;
  }
}

@media (min-width: 720px) {
  .portal-bento__grid {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto auto auto;
    gap: 1rem;
  }

  .portal-bento__cell--main {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
    min-height: 280px;
  }

  .portal-bento__cell--wide {
    grid-column: 3 / 5;
    grid-row: 2 / 4;
    min-height: 240px;
  }

  .portal-bento__grid .portal-bento__cell:nth-child(2) {
    grid-column: 3;
    grid-row: 1;
  }

  .portal-bento__grid .portal-bento__cell:nth-child(3) {
    grid-column: 4;
    grid-row: 1;
  }

  .portal-bento__grid .portal-bento__cell:nth-child(5) {
    grid-column: 4;
    grid-row: 3;
  }

  .portal-bento__grid .portal-bento__cell:nth-child(6) {
    grid-column: 1;
    grid-row: 3;
  }

  .portal-bento__grid .portal-bento__cell:nth-child(7) {
    grid-column: 2;
    grid-row: 3;
  }
}

@media (max-width: 719px) {
  .portal-bento__cell--main {
    min-height: 200px;
  }

  .portal-bento__cell--wide {
    min-height: 170px;
  }
}

/* ========== Portal Landing v24 — Vertical Edge Split (v10 variant) ========== */
.portal-page--v24 {
  background: #050508;
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v24 .header--portal-v24 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(5, 5, 8, 0.85) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v24 .header--portal-v24 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-edge {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-edge__side {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 72px);
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-edge__side--res {
  background: #0a0a0a;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-edge__side--res::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 0% 50%, rgba(227, 46, 106, 0.35) 0%, transparent 65%);
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.portal-edge__side--emp {
  background: #0a0a0a;
  border-left: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-edge__side--emp::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 100% 50%, rgba(59, 130, 246, 0.3) 0%, transparent 65%);
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.portal-edge__side:hover,
.portal-edge__side:focus-visible {
  flex: 1.5;
}

.portal-edge__side:hover::before,
.portal-edge__side:focus-visible::before {
  filter: brightness(1.25);
}

.portal-edge__side:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
  z-index: 5;
}

.portal-edge__vert {
  position: absolute;
  top: 50%;
  font-size: clamp(5rem, 14vw, 11rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  -webkit-text-stroke: 2px rgba(255, 255, 255, 0.2);
  color: transparent;
  transition: -webkit-text-stroke-color 0.4s ease, color 0.4s ease, transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-edge__side--res .portal-edge__vert {
  left: 8%;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: center center;
}

.portal-edge__side--emp .portal-edge__vert {
  right: 8%;
  transform: translateY(-50%) rotate(90deg);
  transform-origin: center center;
}

.portal-edge__side--res:hover .portal-edge__vert,
.portal-edge__side--res:focus-visible .portal-edge__vert {
  -webkit-text-stroke-color: rgba(244, 114, 182, 0.6);
  color: rgba(227, 46, 106, 0.15);
}

.portal-edge__side--emp:hover .portal-edge__vert,
.portal-edge__side--emp:focus-visible .portal-edge__vert {
  -webkit-text-stroke-color: rgba(147, 197, 253, 0.6);
  color: rgba(59, 130, 246, 0.12);
}

.portal-edge__panel {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem 1.5rem;
  max-width: 16rem;
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-edge__side:hover .portal-edge__panel,
.portal-edge__side:focus-visible .portal-edge__panel {
  transform: scale(1.05);
}

.portal-edge__num {
  display: block;
  font-size: 3.5rem;
  font-weight: 900;
  line-height: 1;
  opacity: 0.12;
  margin-bottom: -0.5rem;
}

.portal-edge__side--res .portal-edge__num {
  color: #e32e6a;
}

.portal-edge__side--emp .portal-edge__num {
  color: #3b82f6;
}

.portal-edge__name {
  display: block;
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

.portal-edge__hint {
  font-size: 0.85rem;
  opacity: 0.65;
  line-height: 1.5;
  margin: 0 0 1.25rem;
}

.portal-edge__enter {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.55rem 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.06);
  transition: background 0.25s ease, border-color 0.25s ease;
}

.portal-edge__side--res:hover .portal-edge__enter,
.portal-edge__side--res:focus-visible .portal-edge__enter {
  background: rgba(227, 46, 106, 0.25);
  border-color: rgba(227, 46, 106, 0.5);
}

.portal-edge__side--emp:hover .portal-edge__enter,
.portal-edge__side--emp:focus-visible .portal-edge__enter {
  background: rgba(59, 130, 246, 0.25);
  border-color: rgba(59, 130, 246, 0.5);
}

.portal-edge__mid {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  pointer-events: none;
}

.portal-edge__mid-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  padding: 1rem 1.15rem;
  background: white;
  border-radius: 4px;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.5);
  min-width: 100px;
}

.portal-edge__mid-box img {
  width: 52px;
  height: auto;
}

.portal-edge__mid-box > span:not(.portal-edge__mid-year) {
  font-size: 0.58rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #1e293b;
}

.portal-edge__mid-year {
  font-size: 0.5rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #94a3b8;
}

.footer--portal-v24 {
  position: relative;
  z-index: 10;
  background: #050508;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v24 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v24 {
    padding-bottom: 72px;
  }

  .portal-edge {
    flex-direction: column;
    padding-top: 64px;
  }

  .portal-edge__side {
    min-height: 42vh;
    border-right: none;
    border-left: none;
  }

  .portal-edge__side--res {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }

  .portal-edge__side:hover,
  .portal-edge__side:focus-visible {
    flex: 1.3;
  }

  .portal-edge__vert {
    font-size: clamp(4rem, 20vw, 7rem);
  }

  .portal-edge__side--res .portal-edge__vert {
    left: 50%;
    top: 12%;
    transform: translateX(-50%) rotate(0deg);
  }

  .portal-edge__side--emp .portal-edge__vert {
    right: auto;
    left: 50%;
    top: 12%;
    transform: translateX(-50%) rotate(0deg);
  }

  .portal-edge__panel {
    margin-top: 2.5rem;
  }

  .portal-edge__mid-box {
    padding: 0.75rem 0.95rem;
    min-width: 88px;
  }

  .portal-edge__mid-box img {
    width: 42px;
  }
}

@media (max-width: 480px) {
  .portal-edge__side {
    min-height: 38vh;
  }

  .portal-edge__name {
    font-size: 1.15rem;
  }

  .portal-edge__num {
    font-size: 2.75rem;
  }
}

/* ========== Portal Landing v25 — Glass Light Split (v10 variant) ========== */
.portal-page--v25 {
  background: #f1f5f9;
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v25 .header--portal-v25 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(241, 245, 249, 0.95) 0%, transparent 100%);
  border-bottom: none;
}

.portal-glass {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-glass__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 72px);
  text-decoration: none;
  color: #0f172a;
  overflow: hidden;
  transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-glass__half--res {
  background: linear-gradient(160deg, #fff1f2 0%, #fce7f3 45%, #fbcfe8 100%);
}

.portal-glass__half--emp {
  background: linear-gradient(200deg, #eff6ff 0%, #dbeafe 45%, #bfdbfe 100%);
}

.portal-glass__half:hover,
.portal-glass__half:focus-visible {
  flex: 1.4;
}

.portal-glass__half:focus-visible {
  outline: 3px solid var(--primary, #e32e6a);
  outline-offset: -6px;
  z-index: 5;
}

.portal-glass__word {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-12deg);
  font-size: clamp(4.5rem, 16vw, 10rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
}

.portal-glass__half--res .portal-glass__word {
  color: rgba(225, 29, 72, 0.08);
}

.portal-glass__half--emp .portal-glass__word {
  color: rgba(30, 64, 175, 0.08);
}

.portal-glass__half:hover .portal-glass__word,
.portal-glass__half:focus-visible .portal-glass__word {
  transform: translate(-50%, -52%) rotate(-8deg) scale(1.05);
}

.portal-glass__card {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem 1.75rem;
  max-width: 20rem;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 32px rgba(15, 23, 42, 0.08), 0 0 0 1px rgba(15, 23, 42, 0.04);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.portal-glass__half:hover .portal-glass__card,
.portal-glass__half:focus-visible .portal-glass__card {
  transform: translateY(-8px);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(15, 23, 42, 0.05);
}

.portal-glass__half--res:hover .portal-glass__card,
.portal-glass__half--res:focus-visible .portal-glass__card {
  box-shadow: 0 20px 48px rgba(225, 29, 72, 0.15), 0 0 0 1px rgba(225, 29, 72, 0.1);
}

.portal-glass__half--emp:hover .portal-glass__card,
.portal-glass__half--emp:focus-visible .portal-glass__card {
  box-shadow: 0 20px 48px rgba(30, 64, 175, 0.15), 0 0 0 1px rgba(30, 64, 175, 0.1);
}

.portal-glass__label {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 0.5rem;
}

.portal-glass__title {
  display: block;
  font-size: 1.65rem;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin-bottom: 0.5rem;
  color: #0f172a;
}

.portal-glass__half--res .portal-glass__title {
  color: #9d174d;
}

.portal-glass__half--emp .portal-glass__title {
  color: #1e40af;
}

.portal-glass__hint {
  font-size: 0.85rem;
  color: #64748b;
  line-height: 1.5;
  margin: 0 0 1.25rem;
}

.portal-glass__enter {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.55rem 1.15rem;
  border-radius: 999px;
  color: white;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.portal-glass__half--res .portal-glass__enter {
  background: var(--gradient-brand);
  box-shadow: 0 4px 14px rgba(227, 46, 106, 0.3);
}

.portal-glass__half--emp .portal-glass__enter {
  background: linear-gradient(135deg, #2563eb, #1e40af);
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3);
}

.portal-glass__half:hover .portal-glass__enter,
.portal-glass__half:focus-visible .portal-glass__enter {
  transform: scale(1.04);
}

.portal-glass__center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  pointer-events: none;
}

.portal-glass__center-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  padding: 0.9rem 1.1rem;
  background: #0f172a;
  border-radius: 999px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.35);
}

.portal-glass__center-inner img {
  width: 56px;
  height: auto;
  filter: brightness(0) invert(1);
}

.portal-glass__center-inner span {
  font-size: 0.5rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.55);
}

.footer--portal-v25 {
  position: relative;
  z-index: 10;
  background: #f1f5f9;
  border-top: 1px solid #e2e8f0;
  padding: 0.85rem 0;
}

.footer--portal-v25 .footer__bottom p {
  color: #94a3b8;
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v25 {
    padding-bottom: 72px;
  }

  .portal-glass {
    flex-direction: column;
    padding-top: 64px;
  }

  .portal-glass__half {
    min-height: 42vh;
  }

  .portal-glass__half:hover,
  .portal-glass__half:focus-visible {
    flex: 1.25;
  }

  .portal-glass__word {
    font-size: clamp(3.5rem, 18vw, 6rem);
    transform: translate(-50%, -50%) rotate(-8deg);
  }

  .portal-glass__center-inner {
    padding: 0.75rem 0.95rem;
  }

  .portal-glass__center-inner img {
    width: 48px;
  }
}

@media (max-width: 480px) {
  .portal-glass__half {
    min-height: 36vh;
  }

  .portal-glass__card {
    padding: 1.5rem 1.25rem;
    max-width: 17rem;
  }

  .portal-glass__title {
    font-size: 1.35rem;
  }
}

/* ========== Portal Landing v26 — 3D Doors ========== */
.portal-page--v26 {
  background: #121218;
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v26 .header--portal-v26 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(18, 18, 24, 0.9) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v26 .header--portal-v26 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-doors {
  min-height: 100vh;
  padding: 5rem 1rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.portal-doors__intro {
  text-align: center;
  margin-bottom: 2rem;
}

.portal-doors__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 0.5rem;
}

.portal-doors__lead {
  font-size: clamp(1.25rem, 4vw, 1.75rem);
  font-weight: 800;
  color: white;
  margin: 0;
  letter-spacing: -0.02em;
}

.portal-doors__hall {
  position: relative;
  display: flex;
  gap: 0;
  width: 100%;
  max-width: 720px;
  height: min(420px, 55vh);
  perspective: 1200px;
  perspective-origin: center center;
}

.portal-doors__glow {
  position: absolute;
  top: 10%;
  bottom: 10%;
  width: 40%;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
  z-index: 0;
}

.portal-doors__glow--res {
  left: 5%;
  background: rgba(227, 46, 106, 0.5);
}

.portal-doors__glow--emp {
  right: 5%;
  background: rgba(59, 130, 246, 0.45);
}

.portal-doors__hall:has(.portal-doors__door--res:hover) .portal-doors__glow--res,
.portal-doors__hall:has(.portal-doors__door--res:focus-visible) .portal-doors__glow--res {
  opacity: 0.7;
}

.portal-doors__hall:has(.portal-doors__door--emp:hover) .portal-doors__glow--emp,
.portal-doors__hall:has(.portal-doors__door--emp:focus-visible) .portal-doors__glow--emp {
  opacity: 0.7;
}

.portal-doors__door {
  flex: 1;
  position: relative;
  z-index: 1;
  text-decoration: none;
  color: white;
  transform-style: preserve-3d;
}

.portal-doors__panel {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 1.5rem;
  background: linear-gradient(180deg, #2a2a32 0%, #1e1e26 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 32px rgba(0, 0, 0, 0.4);
  transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s ease;
  backface-visibility: hidden;
}

.portal-doors__door--res .portal-doors__panel {
  border-radius: 8px 0 0 8px;
  border-right: 2px solid rgba(0, 0, 0, 0.3);
  transform-origin: left center;
}

.portal-doors__door--emp .portal-doors__panel {
  border-radius: 0 8px 8px 0;
  border-left: 2px solid rgba(0, 0, 0, 0.3);
  transform-origin: right center;
}

.portal-doors__door--res:hover .portal-doors__panel,
.portal-doors__door--res:focus-visible .portal-doors__panel {
  transform: rotateY(-28deg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), -12px 8px 40px rgba(227, 46, 106, 0.25);
}

.portal-doors__door--emp:hover .portal-doors__panel,
.portal-doors__door--emp:focus-visible .portal-doors__panel {
  transform: rotateY(28deg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 12px 8px 40px rgba(59, 130, 246, 0.25);
}

.portal-doors__door:focus-visible .portal-doors__panel {
  outline: 2px solid white;
  outline-offset: 2px;
}

.portal-doors__knob {
  position: absolute;
  top: 50%;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: linear-gradient(135deg, #d4d4d8, #71717a);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
  transform: translateY(-50%);
}

.portal-doors__door--res .portal-doors__knob {
  right: 1.25rem;
}

.portal-doors__door--emp .portal-doors__knob {
  left: 1.25rem;
}

.portal-doors__label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  opacity: 0.45;
  margin-bottom: 0.5rem;
}

.portal-doors__name {
  font-size: clamp(2rem, 6vw, 2.75rem);
  font-weight: 900;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  line-height: 1;
  margin-bottom: 0.25rem;
}

.portal-doors__door--res .portal-doors__name {
  color: #f9a8d4;
}

.portal-doors__door--emp .portal-doors__name {
  color: #93c5fd;
}

.portal-doors__sub {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.55;
  margin-bottom: 0.75rem;
}

.portal-doors__spec {
  font-size: 0.75rem;
  opacity: 0.45;
}

.portal-doors__floor {
  margin-top: 2rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.portal-doors__floor img {
  width: 64px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.7;
}

.portal-doors__floor span {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.35);
  text-transform: uppercase;
}

.footer--portal-v26 {
  background: #121218;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v26 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v26 {
    padding-bottom: 72px;
  }
}

@media (max-width: 640px) {
  .portal-doors__hall {
    flex-direction: column;
    height: auto;
    max-width: 320px;
    perspective: none;
  }

  .portal-doors__door--res .portal-doors__panel,
  .portal-doors__door--emp .portal-doors__panel {
    border-radius: 8px;
    min-height: 180px;
    transform-origin: center top;
    border: 1px solid rgba(255, 255, 255, 0.08);
  }

  .portal-doors__door--res {
    margin-bottom: 0.75rem;
  }

  .portal-doors__door--res:hover .portal-doors__panel,
  .portal-doors__door--res:focus-visible .portal-doors__panel {
    transform: rotateX(-8deg);
  }

  .portal-doors__door--emp:hover .portal-doors__panel,
  .portal-doors__door--emp:focus-visible .portal-doors__panel {
    transform: rotateX(8deg);
  }

  .portal-doors__glow {
    display: none;
  }

  .portal-doors__knob {
    display: none;
  }
}

/* ========== Portal Landing v27 — Neon Split (v10 variant) ========== */
.portal-page--v27 {
  background: #0c0c10;
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v27 .header--portal-v27 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(12, 12, 16, 0.9) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v27 .header--portal-v27 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-neon {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-neon__wall {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 50%, rgba(227, 46, 106, 0.06) 0%, transparent 45%),
    radial-gradient(circle at 80% 50%, rgba(59, 130, 246, 0.06) 0%, transparent 45%),
    repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255, 255, 255, 0.015) 2px, rgba(255, 255, 255, 0.015) 4px);
  pointer-events: none;
}

.portal-neon__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 72px);
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-neon__half--res {
  background: rgba(227, 46, 106, 0.04);
  border-right: 1px solid rgba(255, 255, 255, 0.04);
}

.portal-neon__half--emp {
  background: rgba(59, 130, 246, 0.04);
  border-left: 1px solid rgba(255, 255, 255, 0.04);
}

.portal-neon__half:hover,
.portal-neon__half:focus-visible {
  flex: 1.45;
}

.portal-neon__half:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
  z-index: 5;
}

.portal-neon__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem 1.5rem;
  max-width: 22rem;
}

.portal-neon__label {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  margin-bottom: 0.75rem;
}

.portal-neon__sign {
  display: block;
  font-size: clamp(3.5rem, 11vw, 7rem);
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  margin-bottom: 0.85rem;
  animation: portalNeonFlicker 4s ease-in-out infinite;
}

.portal-neon__half--res .portal-neon__sign {
  color: #fff;
  text-shadow:
    0 0 8px #fff,
    0 0 20px #e32e6a,
    0 0 40px #e32e6a,
    0 0 80px rgba(227, 46, 106, 0.6);
}

.portal-neon__half--emp .portal-neon__sign {
  color: #fff;
  text-shadow:
    0 0 8px #fff,
    0 0 20px #3b82f6,
    0 0 40px #3b82f6,
    0 0 80px rgba(59, 130, 246, 0.55);
  animation-delay: 2s;
}

.portal-neon__half:hover .portal-neon__sign,
.portal-neon__half:focus-visible .portal-neon__sign {
  animation: portalNeonBright 0.4s ease forwards;
}

@keyframes portalNeonFlicker {
  0%, 100% { opacity: 1; }
  92% { opacity: 1; }
  93% { opacity: 0.85; }
  94% { opacity: 1; }
  96% { opacity: 0.9; }
  97% { opacity: 1; }
}

@keyframes portalNeonBright {
  to {
    filter: brightness(1.15);
  }
}

.portal-neon__hint {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.5;
  margin: 0 0 1.25rem;
}

.portal-neon__enter {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.55rem 1.15rem;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.8);
  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.portal-neon__half--res:hover .portal-neon__enter,
.portal-neon__half--res:focus-visible .portal-neon__enter {
  background: rgba(227, 46, 106, 0.2);
  border-color: rgba(227, 46, 106, 0.6);
  box-shadow: 0 0 20px rgba(227, 46, 106, 0.35);
}

.portal-neon__half--emp:hover .portal-neon__enter,
.portal-neon__half--emp:focus-visible .portal-neon__enter {
  background: rgba(59, 130, 246, 0.2);
  border-color: rgba(59, 130, 246, 0.6);
  box-shadow: 0 0 20px rgba(59, 130, 246, 0.35);
}

.portal-neon__center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding: 0.85rem 1.25rem;
  background: rgba(12, 12, 16, 0.92);
  border: 2px solid rgba(255, 255, 255, 0.12);
  border-radius: 4px;
  box-shadow:
    0 0 20px rgba(255, 255, 255, 0.05),
    inset 0 0 20px rgba(255, 255, 255, 0.03);
  pointer-events: none;
}

.portal-neon__brand {
  font-size: 1.1rem;
  font-weight: 900;
  letter-spacing: 0.2em;
  color: #fff;
  text-shadow:
    0 0 6px #fff,
    0 0 16px var(--primary, #e32e6a),
    0 0 32px rgba(227, 46, 106, 0.5);
  animation: portalNeonFlicker 3s ease-in-out infinite;
}

.portal-neon__since {
  font-size: 0.48rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
}

.footer--portal-v27 {
  position: relative;
  z-index: 10;
  background: #0c0c10;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v27 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v27 {
    padding-bottom: 72px;
  }

  .portal-neon {
    flex-direction: column;
    padding-top: 64px;
  }

  .portal-neon__half {
    min-height: 42vh;
    border-right: none;
    border-left: none;
  }

  .portal-neon__half--res {
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  }

  .portal-neon__half:hover,
  .portal-neon__half:focus-visible {
    flex: 1.25;
  }

  .portal-neon__sign {
    font-size: clamp(2.75rem, 14vw, 4.5rem);
  }

  .portal-neon__center {
    padding: 0.65rem 1rem;
  }

  .portal-neon__brand {
    font-size: 0.95rem;
  }
}

@media (max-width: 480px) {
  .portal-neon__half {
    min-height: 36vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-neon__sign,
  .portal-neon__brand {
    animation: none;
  }
}

/* ========== Portal Landing v28 — Editorial Crop Split (v10 variant) ========== */
.portal-page--v28 {
  background: #111114;
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v28 .header--portal-v28 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(17, 17, 20, 0.9) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v28 .header--portal-v28 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-crop {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-crop__half {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: calc(100vh - 72px);
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-crop__half--res {
  background: linear-gradient(180deg, #1a1018 0%, #111114 60%);
}

.portal-crop__half--res::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 4px;
  background: var(--gradient-brand);
  opacity: 0.6;
  transition: opacity 0.3s ease, width 0.3s ease;
}

.portal-crop__half--emp {
  background: linear-gradient(180deg, #0f1520 0%, #111114 60%);
}

.portal-crop__half--emp::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 4px;
  background: linear-gradient(180deg, #3b82f6, #1e40af);
  opacity: 0.6;
  transition: opacity 0.3s ease, width 0.3s ease;
}

.portal-crop__half:hover,
.portal-crop__half:focus-visible {
  flex: 1.5;
}

.portal-crop__half:hover::after,
.portal-crop__half:focus-visible::after {
  opacity: 1;
  width: 6px;
}

.portal-crop__half:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
  z-index: 5;
}

.portal-crop__word {
  position: absolute;
  top: 50%;
  font-size: clamp(5rem, 18vw, 13rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-crop__half--res .portal-crop__word {
  right: -0.08em;
  transform: translateY(-55%);
  color: rgba(227, 46, 106, 0.12);
}

.portal-crop__half--emp .portal-crop__word {
  left: -0.08em;
  transform: translateY(-55%);
  color: rgba(59, 130, 246, 0.12);
}

.portal-crop__half:hover .portal-crop__word,
.portal-crop__half:focus-visible .portal-crop__word {
  transform: translateY(-58%) scale(1.04);
}

.portal-crop__half--res:hover .portal-crop__word,
.portal-crop__half--res:focus-visible .portal-crop__word {
  color: rgba(227, 46, 106, 0.18);
}

.portal-crop__half--emp:hover .portal-crop__word,
.portal-crop__half--emp:focus-visible .portal-crop__word {
  color: rgba(59, 130, 246, 0.18);
}

.portal-crop__info {
  position: relative;
  z-index: 2;
  padding: 2rem 1.75rem 2.5rem;
  max-width: 20rem;
}

.portal-crop__half--res .portal-crop__info {
  margin-left: auto;
  text-align: right;
}

.portal-crop__half--emp .portal-crop__info {
  text-align: left;
}

.portal-crop__label {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  margin-bottom: 0.5rem;
}

.portal-crop__hint {
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.5;
  margin: 0 0 1rem;
}

.portal-crop__enter {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.5rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  transition: background 0.25s ease, border-color 0.25s ease;
}

.portal-crop__half--res:hover .portal-crop__enter,
.portal-crop__half--res:focus-visible .portal-crop__enter {
  background: rgba(227, 46, 106, 0.2);
  border-color: rgba(227, 46, 106, 0.5);
}

.portal-crop__half--emp:hover .portal-crop__enter,
.portal-crop__half--emp:focus-visible .portal-crop__enter {
  background: rgba(59, 130, 246, 0.2);
  border-color: rgba(59, 130, 246, 0.5);
}

.portal-crop__seam {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  pointer-events: none;
}

.portal-crop__seam-line {
  position: absolute;
  top: -40vh;
  bottom: -40vh;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.15) 20%, rgba(255, 255, 255, 0.15) 80%, transparent);
}

.portal-crop__seam-logo {
  position: relative;
  z-index: 1;
  width: 48px;
  height: auto;
  padding: 0.65rem;
  background: #111114;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}

.portal-crop__seam-text {
  position: relative;
  z-index: 1;
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.35);
  background: #111114;
  padding: 0.2rem 0.5rem;
}

.footer--portal-v28 {
  position: relative;
  z-index: 10;
  background: #111114;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v28 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v28 {
    padding-bottom: 72px;
  }

  .portal-crop {
    flex-direction: column;
    padding-top: 64px;
  }

  .portal-crop__half {
    min-height: 42vh;
    justify-content: center;
  }

  .portal-crop__half--res::after {
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: 4px;
  }

  .portal-crop__half--emp::after {
    top: 0;
    left: 0;
    right: 0;
    bottom: auto;
    width: auto;
    height: 4px;
  }

  .portal-crop__half:hover::after,
  .portal-crop__half:focus-visible::after {
    height: 6px;
    width: auto;
  }

  .portal-crop__word {
    font-size: clamp(4rem, 22vw, 8rem);
    top: 28%;
  }

  .portal-crop__half--res .portal-crop__word {
    right: auto;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .portal-crop__half--emp .portal-crop__word {
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .portal-crop__half--res .portal-crop__info,
  .portal-crop__half--emp .portal-crop__info {
    margin: 0 auto;
    text-align: center;
    padding-top: 4rem;
  }

  .portal-crop__seam-line {
    display: none;
  }
}

@media (max-width: 480px) {
  .portal-crop__half {
    min-height: 38vh;
  }

  .portal-crop__info {
    padding: 1.5rem 1.25rem 2rem;
  }
}

/* ========== Portal Landing v29 — VHS Retro Split (v10 variant) ========== */
.portal-page--v29 {
  background: #0e0e12;
  min-height: 100vh;
  overflow-x: hidden;
}

.portal-page--v29 .header--portal-v29 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(14, 14, 18, 0.92) 0%, transparent 100%);
  border-bottom: none;
}

.portal-page--v29 .header--portal-v29 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-vhs {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding-top: 72px;
}

.portal-vhs__fx {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 30;
}

.portal-vhs__scan {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.12) 2px,
    rgba(0, 0, 0, 0.12) 4px
  );
  opacity: 0.35;
}

.portal-vhs__rec {
  position: absolute;
  top: 5.5rem;
  left: 1.25rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #ef4444;
  animation: portalVhsBlink 1.5s step-end infinite;
}

.portal-vhs__time {
  position: absolute;
  top: 5.5rem;
  right: 1.25rem;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.45);
  font-variant-numeric: tabular-nums;
}

@keyframes portalVhsBlink {
  50% { opacity: 0; }
}

.portal-vhs__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 72px);
  text-decoration: none;
  color: white;
  overflow: hidden;
  transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-vhs__half--res {
  background:
    linear-gradient(135deg, rgba(227, 46, 106, 0.35) 0%, transparent 55%),
    linear-gradient(180deg, #1a1220 0%, #0e0e12 100%);
}

.portal-vhs__half--emp {
  background:
    linear-gradient(225deg, rgba(59, 130, 246, 0.3) 0%, transparent 55%),
    linear-gradient(180deg, #121820 0%, #0e0e12 100%);
}

.portal-vhs__half:hover,
.portal-vhs__half:focus-visible {
  flex: 1.45;
}

.portal-vhs__half:focus-visible {
  outline: 3px solid white;
  outline-offset: -6px;
  z-index: 5;
}

.portal-vhs__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem 1.5rem;
  max-width: 22rem;
}

.portal-vhs__label {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 0.65rem;
}

.portal-vhs__word {
  display: block;
  font-size: clamp(3.25rem, 10vw, 6.5rem);
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
  transition: text-shadow 0.3s ease, transform 0.4s ease;
}

.portal-vhs__half--res .portal-vhs__word {
  color: #fff;
  text-shadow:
    2px 0 #e32e6a,
    -2px 0 #06b6d4,
    0 0 30px rgba(227, 46, 106, 0.3);
}

.portal-vhs__half--emp .portal-vhs__word {
  color: #fff;
  text-shadow:
    2px 0 #3b82f6,
    -2px 0 #f472b6,
    0 0 30px rgba(59, 130, 246, 0.3);
}

.portal-vhs__half:hover .portal-vhs__word,
.portal-vhs__half:focus-visible .portal-vhs__word {
  transform: scale(1.03);
}

.portal-vhs__half--res:hover .portal-vhs__word,
.portal-vhs__half--res:focus-visible .portal-vhs__word {
  text-shadow:
    3px 0 #e32e6a,
    -3px 0 #06b6d4,
    0 0 40px rgba(227, 46, 106, 0.5);
}

.portal-vhs__half--emp:hover .portal-vhs__word,
.portal-vhs__half--emp:focus-visible .portal-vhs__word {
  text-shadow:
    3px 0 #3b82f6,
    -3px 0 #f472b6,
    0 0 40px rgba(59, 130, 246, 0.5);
}

.portal-vhs__hint {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.5;
  margin: 0 0 1.25rem;
}

.portal-vhs__enter {
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.55rem 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(0, 0, 0, 0.35);
  font-family: ui-monospace, monospace;
  transition: background 0.25s ease, border-color 0.25s ease;
}

.portal-vhs__half:hover .portal-vhs__enter,
.portal-vhs__half:focus-visible .portal-vhs__enter {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.45);
}

.portal-vhs__center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 25;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  padding: 0.85rem 1rem;
  background: rgba(14, 14, 18, 0.9);
  border: 2px solid rgba(255, 255, 255, 0.15);
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.5);
  pointer-events: none;
}

.portal-vhs__center img {
  width: 52px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

.portal-vhs__center span {
  font-size: 0.48rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
}

.footer--portal-v29 {
  position: relative;
  z-index: 10;
  background: #0e0e12;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.85rem 0;
}

.footer--portal-v29 .footer__bottom p {
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

@media (max-width: 1100px) {
  .portal-page--v29 {
    padding-bottom: 72px;
  }

  .portal-vhs {
    flex-direction: column;
    padding-top: 64px;
  }

  .portal-vhs__half {
    min-height: 42vh;
  }

  .portal-vhs__half:hover,
  .portal-vhs__half:focus-visible {
    flex: 1.25;
  }

  .portal-vhs__rec {
    top: 4.75rem;
    left: 1rem;
  }

  .portal-vhs__time {
    top: 4.75rem;
    right: 1rem;
  }

  .portal-vhs__word {
    font-size: clamp(2.5rem, 14vw, 4rem);
  }

  .portal-vhs__center {
    padding: 0.65rem 0.85rem;
  }

  .portal-vhs__center img {
    width: 44px;
  }
}

@media (max-width: 480px) {
  .portal-vhs__half {
    min-height: 36vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-vhs__rec {
    animation: none;
  }
}

/* ========== Portal Landing v30 — Negative Space Flip (v10 variant) ========== */

/*
  Conceito: metade esquerda BRANCA (texto escuro), metade direita ESCURA (texto claro).
  No hover, a cor da marca inunda toda a metade e inverte texto para branco.
  Hover também expande a metade (flex), igual à v10 original.
*/

.portal-page--v30 {
  background: #f5f5f5;
  min-height: 100vh;
  overflow-x: hidden;
}

/* Header: fundo transparente, texto escuro (sobre metade branca) */
.portal-page--v30 .header--portal-v30 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: transparent;
  border-bottom: none;
}

.portal-page--v30 .header--portal-v30 .utility-card {
  color: #111;
}

.portal-page--v30 .header--portal-v30 .utility-card:hover {
  background: rgba(0, 0, 0, 0.06);
}

/* Main split container */
.portal-flip {
  position: relative;
  display: flex;
  min-height: 100vh;
}

/* Individual half */
.portal-flip__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  text-decoration: none;
  overflow: hidden;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-flip__half:hover,
.portal-flip__half:focus-visible {
  flex: 1.5;
}

.portal-flip__half:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: -6px;
  z-index: 5;
}

/* Flood-fill background layer */
.portal-flip__bg {
  position: absolute;
  inset: 0;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-flip__half--emp .portal-flip__bg {
  transform-origin: right center;
}

.portal-flip__half:hover .portal-flip__bg,
.portal-flip__half:focus-visible .portal-flip__bg {
  transform: scaleX(1);
}

/* Residencial: branco base → flood rosa */
.portal-flip__half--res {
  background: #ffffff;
  color: #111827;
}

.portal-flip__half--res .portal-flip__bg {
  background: #e32e6a;
}

/* Empresarial: escuro base → flood azul */
.portal-flip__half--emp {
  background: #0f172a;
  color: #f8fafc;
}

.portal-flip__half--emp .portal-flip__bg {
  background: #1d4ed8;
}

/* Content sits above the flood layer */
.portal-flip__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 8rem 2rem 4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.portal-flip__eyebrow {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.45;
  margin-bottom: 0.5rem;
  transition: opacity 0.3s ease;
}

.portal-flip__half:hover .portal-flip__eyebrow,
.portal-flip__half:focus-visible .portal-flip__eyebrow {
  opacity: 0.75;
  color: #fff;
}

/* The hero word */
.portal-flip__word {
  display: block;
  font-size: clamp(4rem, 11vw, 8rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
  transition: color 0.35s ease;
}

.portal-flip__half:hover .portal-flip__word,
.portal-flip__half:focus-visible .portal-flip__word {
  color: #fff;
}

/* Feature list */
.portal-flip__features {
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.portal-flip__features li {
  font-size: 0.88rem;
  font-weight: 500;
  opacity: 0.55;
  transition: opacity 0.3s ease, color 0.35s ease;
}

.portal-flip__features li::before {
  content: "— ";
  opacity: 0.5;
}

.portal-flip__half:hover .portal-flip__features li,
.portal-flip__half:focus-visible .portal-flip__features li {
  opacity: 0.85;
  color: #fff;
}

/* CTA pill */
.portal-flip__cta {
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.65rem 1.75rem;
  border: 2px solid currentColor;
  border-radius: 2rem;
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity 0.35s ease 0.08s,
    transform 0.35s ease 0.08s,
    background 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease;
}

.portal-flip__half:hover .portal-flip__cta,
.portal-flip__half:focus-visible .portal-flip__cta {
  opacity: 1;
  transform: translateY(0);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.6);
}

.portal-flip__cta:hover {
  background: rgba(255, 255, 255, 0.15);
}

/* Center spine with logo */
.portal-flip__spine {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 40;
  width: 2px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  pointer-events: none;
}

.portal-flip__spine::before,
.portal-flip__spine::after {
  content: "";
  display: block;
  width: 1px;
  height: 30vh;
  background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.18), transparent);
}

.portal-flip__spine img {
  display: block;
  width: 44px;
  height: auto;
  margin: 0.5rem 0;
  mix-blend-mode: multiply;
  opacity: 0.5;
}

/* Footer */
.footer--portal-v30 {
  position: relative;
  z-index: 10;
  background: #ffffff;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding: 0.85rem 0;
}

.footer--portal-v30 .footer__bottom p {
  color: rgba(0, 0, 0, 0.35);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

/* Responsive */
@media (max-width: 1100px) {
  .portal-page--v30 {
    padding-bottom: 72px;
  }

  .portal-flip {
    flex-direction: column;
  }

  .portal-flip__half {
    min-height: 44vh;
    flex: 1 1 auto;
  }

  .portal-flip__half:hover,
  .portal-flip__half:focus-visible {
    flex: 1.3 1 auto;
  }

  .portal-flip__bg {
    transform-origin: center top;
    transform: scaleY(0);
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .portal-flip__half--emp .portal-flip__bg {
    transform-origin: center bottom;
  }

  .portal-flip__half:hover .portal-flip__bg,
  .portal-flip__half:focus-visible .portal-flip__bg {
    transform: scaleY(1);
  }

  .portal-flip__content {
    padding: 4rem 1.5rem 2.5rem;
  }

  .portal-flip__word {
    font-size: clamp(3rem, 18vw, 5rem);
  }

  .portal-flip__spine {
    top: auto;
    bottom: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(90deg);
  }
}

@media (max-width: 480px) {
  .portal-flip__half {
    min-height: 38vh;
  }

  .portal-flip__content {
    padding: 3.5rem 1.25rem 2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-flip__half,
  .portal-flip__bg,
  .portal-flip__word,
  .portal-flip__cta {
    transition: none;
  }
}

/* ========== Portal Landing v31 — Diagonal Slice (v10 variant) ========== */

/*
  Dois painéis sobrepostos em fullscreen. Cada um tem um clip-path diagonal oposto.
  Residencial: canto sup-esq até ~60% da largura — fundo creme/rosa quente.
  Empresarial: canto inf-dir — fundo índigo frio.
  O logo flutua no ponto de cruzamento da diagonal.
  Hover: a diagonal se abre (clip-path transiciona) e o painel ativo ocupa +espaço.
*/

.portal-page--v31 {
  background: #0f172a;
  min-height: 100vh;
  overflow: hidden;
}

.portal-page--v31 .header--portal-v31 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: transparent;
  border-bottom: none;
}

/* Make header utilities legible on both backgrounds */
.portal-page--v31 .header--portal-v31 .utility-card {
  color: rgba(255,255,255,0.75);
  text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

.portal-page--v31 .header--portal-v31 .utility-card:hover {
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.portal-page--v31 .header--portal-v31 .logo__img {
  filter: brightness(0) invert(1);
}

/* ---- layout ---- */
.portal-slice {
  position: relative;
  width: 100%;
  min-height: 100vh;
}

.portal-slice__panel {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: clip-path 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Residencial ocupa o triângulo esquerdo/superior via clip-path */
.portal-slice__panel--res {
  background: linear-gradient(145deg, #fff5f7 0%, #fce7ef 50%, #f9c8d9 100%);
  color: #1a0a0f;
  /* diagonal: top-left → bottom-right, corte em ~58% horizontal */
  clip-path: polygon(0 0, 100% 0, 58% 100%, 0 100%);
}

/* Empresarial ocupa o triângulo direito/inferior */
.portal-slice__panel--emp {
  background: linear-gradient(145deg, #0f172a 0%, #1e3a5f 60%, #1d4ed8 100%);
  color: #f0f6ff;
  clip-path: polygon(58% 0, 100% 0, 100% 100%, 0 100%);
}

/* Hover: expande o painel ativo deslocando a diagonal */
.portal-slice__panel--res:hover,
.portal-slice__panel--res:focus-visible {
  clip-path: polygon(0 0, 100% 0, 72% 100%, 0 100%);
  z-index: 2;
}

.portal-slice__panel--emp:hover,
.portal-slice__panel--emp:focus-visible {
  clip-path: polygon(44% 0, 100% 0, 100% 100%, 0 100%);
  z-index: 2;
}

.portal-slice__panel:focus-visible {
  outline: 3px solid rgba(255,255,255,0.6);
  outline-offset: -6px;
}

/* ---- content ---- */
.portal-slice__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 8rem 3rem 4rem;
  max-width: 28rem;
  gap: 0;
}

/* Residencial content desloca para a esquerda, Empresarial para a direita */
.portal-slice__panel--res .portal-slice__inner {
  margin-right: 18%;
}

.portal-slice__panel--emp .portal-slice__inner {
  margin-left: 18%;
}

.portal-slice__tag {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.5;
  margin-bottom: 0.6rem;
}

.portal-slice__word {
  display: block;
  font-size: clamp(4.5rem, 10vw, 8.5rem);
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  margin-bottom: 1rem;
  transition: transform 0.4s ease;
}

.portal-slice__panel:hover .portal-slice__word,
.portal-slice__panel:focus-visible .portal-slice__word {
  transform: scale(1.05);
}

.portal-slice__sub {
  font-size: 0.88rem;
  font-weight: 500;
  opacity: 0.55;
  line-height: 1.6;
  margin: 0 0 1.5rem;
}

.portal-slice__arrow {
  font-size: 1.6rem;
  font-weight: 300;
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 0.3s ease 0.1s, transform 0.3s ease 0.1s;
}

.portal-slice__panel:hover .portal-slice__arrow,
.portal-slice__panel:focus-visible .portal-slice__arrow {
  opacity: 0.7;
  transform: translateX(0);
}

/* ---- divider logo ---- */
.portal-slice__divider {
  position: absolute;
  /* posicionado no ponto de cruzamento da diagonal: ~58% X, 50% Y */
  top: 50%;
  left: 58%;
  transform: translate(-50%, -50%);
  z-index: 20;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.portal-slice__divider::before,
.portal-slice__divider::after {
  content: "";
  display: block;
  width: 1px;
  height: 25vh;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.25), transparent);
}

.portal-slice__divider img {
  display: block;
  width: 40px;
  height: auto;
  margin: 0.6rem 0;
  filter: brightness(0) invert(1);
  opacity: 0.6;
}

/* ---- footer ---- */
.footer--portal-v31 {
  position: relative;
  z-index: 10;
  background: #0a0f1e;
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: 0.85rem 0;
}

.footer--portal-v31 .footer__bottom p {
  color: rgba(255,255,255,0.3);
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
}

/* ---- responsive ---- */
@media (max-width: 1100px) {
  .portal-page--v31 {
    padding-bottom: 72px;
  }

  .portal-slice {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }

  .portal-slice__panel {
    position: relative;
    inset: auto;
    flex: 1;
    min-height: 45vh;
    clip-path: none !important;
    justify-content: center;
  }

  .portal-slice__panel--res {
    border-bottom: 3px solid #e32e6a;
  }

  .portal-slice__panel--emp {
    border-top: 3px solid #1d4ed8;
  }

  .portal-slice__inner {
    padding: 4rem 1.5rem 2.5rem;
    margin: 0 !important;
  }

  .portal-slice__word {
    font-size: clamp(3rem, 18vw, 5rem);
  }

  .portal-slice__divider {
    display: none;
  }
}

@media (max-width: 480px) {
  .portal-slice__panel {
    min-height: 38vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-slice__panel,
  .portal-slice__word,
  .portal-slice__arrow {
    transition: none;
  }
}

/* ========== Portal Landing v32 — Signal Rings (v10 variant) ========== */
.portal-page--v32 {
  min-height: 100vh;
  background: #07111f;
  overflow-x: hidden;
}

.portal-page--v32 .header--portal-v32 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: linear-gradient(180deg, rgba(7, 17, 31, 0.9), rgba(7, 17, 31, 0));
  border-bottom: none;
}

.portal-page--v32 .header--portal-v32 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-page--v32 .header--portal-v32 .utility-card {
  color: rgba(255, 255, 255, 0.82);
}

.portal-page--v32 .header--portal-v32 .utility-card:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.portal-rings {
  position: relative;
  display: flex;
  min-height: 100vh;
  isolation: isolate;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.08), transparent 18rem),
    linear-gradient(90deg, #160716 0%, #07111f 50%, #061322 100%);
}

.portal-rings::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent calc(50% - 1px), rgba(255, 255, 255, 0.22) 50%, transparent calc(50% + 1px)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 120px);
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
}

.portal-rings__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 8rem 2rem 4rem;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-rings__half:hover,
.portal-rings__half:focus-visible {
  flex: 1.45;
}

.portal-rings__half:focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.8);
  outline-offset: -7px;
  z-index: 8;
}

.portal-rings__half--res {
  background:
    radial-gradient(circle at 52% 50%, rgba(227, 46, 106, 0.22), transparent 30rem),
    linear-gradient(135deg, rgba(227, 46, 106, 0.18), rgba(7, 17, 31, 0));
}

.portal-rings__half--emp {
  background:
    radial-gradient(circle at 48% 50%, rgba(59, 130, 246, 0.26), transparent 31rem),
    linear-gradient(225deg, rgba(59, 130, 246, 0.22), rgba(7, 17, 31, 0));
}

.portal-rings__signal {
  position: absolute;
  width: min(54vw, 42rem);
  aspect-ratio: 1;
  border-radius: 50%;
  opacity: 0.85;
  transform: scale(0.92);
  transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.35s ease;
}

.portal-rings__half--res .portal-rings__signal {
  right: -11rem;
  background:
    repeating-radial-gradient(circle, rgba(227, 46, 106, 0.34) 0 2px, transparent 2px 58px),
    radial-gradient(circle, rgba(227, 46, 106, 0.3), transparent 60%);
}

.portal-rings__half--emp .portal-rings__signal {
  left: -11rem;
  background:
    repeating-radial-gradient(circle, rgba(96, 165, 250, 0.34) 0 2px, transparent 2px 58px),
    radial-gradient(circle, rgba(37, 99, 235, 0.32), transparent 60%);
}

.portal-rings__half:hover .portal-rings__signal,
.portal-rings__half:focus-visible .portal-rings__signal {
  opacity: 1;
  transform: scale(1.08);
}

.portal-rings__grain {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  background-size: 34px 34px;
  opacity: 0.28;
}

.portal-rings__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 28rem;
  text-align: center;
}

.portal-rings__kicker {
  display: block;
  margin-bottom: 0.55rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.48);
}

.portal-rings__word {
  display: block;
  margin-bottom: 1rem;
  font-size: clamp(4.4rem, 10vw, 8.8rem);
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: -0.055em;
  text-transform: uppercase;
  transition: transform 0.45s ease, text-shadow 0.45s ease;
}

.portal-rings__half--res .portal-rings__word {
  text-shadow: 0 0 44px rgba(227, 46, 106, 0.45);
}

.portal-rings__half--emp .portal-rings__word {
  text-shadow: 0 0 44px rgba(59, 130, 246, 0.48);
}

.portal-rings__half:hover .portal-rings__word,
.portal-rings__half:focus-visible .portal-rings__word {
  transform: translateY(-0.18rem) scale(1.04);
}

.portal-rings__sub {
  max-width: 22rem;
  margin: 0 0 0.75rem;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.98rem;
  line-height: 1.6;
}

.portal-rings__meta {
  display: block;
  margin-bottom: 1.45rem;
  color: rgba(255, 255, 255, 0.44);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-rings__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 11rem;
  padding: 0.72rem 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transform: translateY(0.4rem);
  opacity: 0;
  transition: opacity 0.32s ease, transform 0.32s ease, background 0.25s ease;
}

.portal-rings__half:hover .portal-rings__cta,
.portal-rings__half:focus-visible .portal-rings__cta {
  transform: translateY(0);
  opacity: 1;
  background: rgba(255, 255, 255, 0.12);
}

.portal-rings__core {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 12;
  display: grid;
  place-items: center;
  gap: 0.4rem;
  width: 8.25rem;
  height: 8.25rem;
  padding: 1.2rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(255, 255, 255, 0.13), rgba(7, 17, 31, 0.9) 68%),
    rgba(7, 17, 31, 0.86);
  box-shadow:
    0 0 0 1rem rgba(255, 255, 255, 0.035),
    0 1.5rem 4rem rgba(0, 0, 0, 0.45);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.portal-rings__core img {
  width: 54px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

.portal-rings__core span {
  color: rgba(255, 255, 255, 0.45);
  font-size: 0.54rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-align: center;
  text-transform: uppercase;
}

.footer--portal-v32 {
  position: relative;
  z-index: 10;
  padding: 0.85rem 0;
  background: #07111f;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer--portal-v32 .footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.34);
  font-size: 0.8rem;
  text-align: center;
}

@media (max-width: 1100px) {
  .portal-page--v32 {
    padding-bottom: 72px;
  }

  .portal-rings {
    flex-direction: column;
  }

  .portal-rings::before {
    background:
      linear-gradient(0deg, transparent calc(50% - 1px), rgba(255, 255, 255, 0.22) 50%, transparent calc(50% + 1px)),
      repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 96px);
  }

  .portal-rings__half {
    min-height: 44vh;
    padding: 5rem 1.5rem 3rem;
  }

  .portal-rings__half:hover,
  .portal-rings__half:focus-visible {
    flex: 1.25;
  }

  .portal-rings__signal {
    width: 34rem;
  }

  .portal-rings__half--res .portal-rings__signal {
    right: auto;
    bottom: -18rem;
  }

  .portal-rings__half--emp .portal-rings__signal {
    left: auto;
    top: -18rem;
  }

  .portal-rings__word {
    font-size: clamp(3.2rem, 17vw, 5.2rem);
  }

  .portal-rings__core {
    width: 6.4rem;
    height: 6.4rem;
  }

  .portal-rings__core span {
    display: none;
  }
}

@media (max-width: 480px) {
  .portal-rings__half {
    min-height: 39vh;
    padding-inline: 1.15rem;
  }

  .portal-rings__sub {
    font-size: 0.88rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-rings__half,
  .portal-rings__signal,
  .portal-rings__word,
  .portal-rings__cta {
    transition: none;
  }
}

/* ========== Portal Landing v33 — Premium Cards (v10 variant) ========== */
.portal-page--v33 {
  min-height: 100vh;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 22% 52%, rgba(227, 46, 106, 0.28), transparent 25rem),
    radial-gradient(circle at 78% 48%, rgba(59, 130, 246, 0.3), transparent 27rem),
    linear-gradient(135deg, #080912 0%, #0f172a 50%, #050814 100%);
}

.portal-page--v33 .header--portal-v33 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: linear-gradient(180deg, rgba(8, 9, 18, 0.92), rgba(8, 9, 18, 0));
  border-bottom: none;
}

.portal-page--v33 .header--portal-v33 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-page--v33 .header--portal-v33 .utility-card {
  color: rgba(255, 255, 255, 0.82);
}

.portal-page--v33 .header--portal-v33 .utility-card:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.portal-cards {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding: 7.5rem clamp(1.25rem, 3vw, 3rem) 3.5rem;
  gap: clamp(1rem, 2vw, 2rem);
  isolation: isolate;
}

.portal-cards::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(circle at center, #000, transparent 72%);
}

.portal-cards__panel {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 11rem);
  color: #fff;
  text-decoration: none;
  border-radius: 2.25rem;
  overflow: hidden;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1), transform 0.35s ease;
}

.portal-cards__panel:hover,
.portal-cards__panel:focus-visible {
  flex: 1.35;
  transform: translateY(-0.35rem);
}

.portal-cards__panel:focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.8);
  outline-offset: 4px;
  z-index: 10;
}

.portal-cards__panel--res {
  background:
    linear-gradient(145deg, rgba(227, 46, 106, 0.22), rgba(255, 255, 255, 0.03)),
    rgba(255, 255, 255, 0.07);
}

.portal-cards__panel--emp {
  background:
    linear-gradient(215deg, rgba(59, 130, 246, 0.24), rgba(255, 255, 255, 0.03)),
    rgba(255, 255, 255, 0.07);
}

.portal-cards__panel::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: inherit;
  pointer-events: none;
}

.portal-cards__panel::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: calc(2.25rem - 1px);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 26%),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
  pointer-events: none;
}

.portal-cards__aura {
  position: absolute;
  width: min(36vw, 31rem);
  aspect-ratio: 1;
  border-radius: 50%;
  filter: blur(8px);
  opacity: 0.78;
  transition: transform 0.55s ease, opacity 0.35s ease;
}

.portal-cards__panel--res .portal-cards__aura {
  right: -12rem;
  bottom: -11rem;
  background: radial-gradient(circle, rgba(227, 46, 106, 0.68), transparent 68%);
}

.portal-cards__panel--emp .portal-cards__aura {
  left: -12rem;
  top: -10rem;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.72), transparent 68%);
}

.portal-cards__panel:hover .portal-cards__aura,
.portal-cards__panel:focus-visible .portal-cards__aura {
  opacity: 1;
  transform: scale(1.16);
}

.portal-cards__card {
  position: relative;
  z-index: 2;
  width: min(100%, 34rem);
  padding: clamp(2rem, 5vw, 4rem);
  text-align: center;
}

.portal-cards__number {
  position: absolute;
  top: clamp(1.25rem, 3vw, 2rem);
  left: clamp(1.25rem, 3vw, 2rem);
  color: rgba(255, 255, 255, 0.28);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.18em;
}

.portal-cards__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.85rem;
  padding: 0.45rem 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.portal-cards__word {
  display: block;
  margin-bottom: 1.1rem;
  font-size: clamp(4.25rem, 10vw, 8.25rem);
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: -0.055em;
  text-transform: uppercase;
  transition: transform 0.4s ease, letter-spacing 0.4s ease;
}

.portal-cards__panel:hover .portal-cards__word,
.portal-cards__panel:focus-visible .portal-cards__word {
  transform: scale(1.04);
  letter-spacing: -0.07em;
}

.portal-cards__text {
  max-width: 24rem;
  margin: 0 auto 1rem;
  color: rgba(255, 255, 255, 0.7);
  font-size: 1rem;
  line-height: 1.65;
}

.portal-cards__line {
  display: block;
  margin-bottom: 1.55rem;
  color: rgba(255, 255, 255, 0.42);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.portal-cards__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 11rem;
  padding: 0.8rem 1.25rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 0.82rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(0.6rem);
  transition: opacity 0.3s ease, transform 0.3s ease, background 0.25s ease;
}

.portal-cards__panel:hover .portal-cards__cta,
.portal-cards__panel:focus-visible .portal-cards__cta {
  opacity: 1;
  transform: translateY(0);
}

.portal-cards__panel--res:hover .portal-cards__cta,
.portal-cards__panel--res:focus-visible .portal-cards__cta {
  background: #e32e6a;
}

.portal-cards__panel--emp:hover .portal-cards__cta,
.portal-cards__panel--emp:focus-visible .portal-cards__cta {
  background: #2563eb;
}

.portal-cards__seal {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 20;
  display: grid;
  place-items: center;
  gap: 0.36rem;
  width: 8rem;
  height: 8rem;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  background: rgba(8, 9, 18, 0.78);
  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(18px);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.portal-cards__seal img {
  width: 56px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.95;
}

.portal-cards__seal span {
  color: rgba(255, 255, 255, 0.48);
  font-size: 0.52rem;
  font-weight: 900;
  letter-spacing: 0.15em;
  text-align: center;
  text-transform: uppercase;
}

.footer--portal-v33 {
  position: relative;
  z-index: 10;
  padding: 0.85rem 0;
  background: #080912;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer--portal-v33 .footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.34);
  font-size: 0.8rem;
  text-align: center;
}

@media (max-width: 1100px) {
  .portal-page--v33 {
    padding-bottom: 72px;
  }

  .portal-cards {
    flex-direction: column;
    min-height: 100vh;
    padding: 5.25rem 1rem 1rem;
  }

  .portal-cards__panel {
    min-height: 41vh;
    border-radius: 1.5rem;
  }

  .portal-cards__panel:hover,
  .portal-cards__panel:focus-visible {
    flex: 1.18;
    transform: none;
  }

  .portal-cards__card {
    padding: 2.25rem 1.5rem;
  }

  .portal-cards__word {
    font-size: clamp(3.1rem, 17vw, 5.1rem);
  }

  .portal-cards__seal {
    width: 6rem;
    height: 6rem;
  }

  .portal-cards__seal span {
    display: none;
  }

  .portal-cards__aura {
    width: 24rem;
  }
}

@media (max-width: 480px) {
  .portal-cards__panel {
    min-height: 38vh;
  }

  .portal-cards__text {
    font-size: 0.88rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-cards__panel,
  .portal-cards__aura,
  .portal-cards__word,
  .portal-cards__cta {
    transition: none;
  }
}

/* ========== Portal Landing v34 — Echo Frost (v21 variant) ========== */
.portal-page--v34 {
  min-height: 100vh;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 18% 50%, rgba(227, 46, 106, 0.1), transparent 28rem),
    radial-gradient(circle at 82% 50%, rgba(37, 99, 235, 0.1), transparent 28rem),
    linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}

.portal-page--v34 .header--portal-v34 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.95), rgba(248, 250, 252, 0));
  border-bottom: none;
}

.portal-page--v34 .header--portal-v34 .utility-card {
  color: #1e293b;
}

.portal-page--v34 .header--portal-v34 .utility-card:hover {
  background: rgba(15, 23, 42, 0.06);
}

.portal-echo {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding: 7.5rem clamp(1rem, 2.5vw, 2.5rem) 3.5rem;
  gap: clamp(0.75rem, 1.5vw, 1.25rem);
  isolation: isolate;
}

.portal-echo__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 11rem);
  text-decoration: none;
  color: #0f172a;
  overflow: hidden;
  border-radius: 2rem;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s ease, box-shadow 0.4s ease;
}

.portal-echo__half:hover,
.portal-echo__half:focus-visible {
  flex: 1.42;
  transform: translateY(-0.35rem);
  z-index: 8;
}

.portal-echo__half:focus-visible {
  outline: 3px solid #0f172a;
  outline-offset: 4px;
}

.portal-echo__half--res {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(255, 245, 248, 0.88)),
    rgba(255, 255, 255, 0.75);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 24px 60px rgba(227, 46, 106, 0.12);
}

.portal-echo__half--emp {
  background:
    linear-gradient(215deg, rgba(255, 255, 255, 0.92), rgba(239, 246, 255, 0.88)),
    rgba(255, 255, 255, 0.75);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 24px 60px rgba(37, 99, 235, 0.12);
}

.portal-echo__half:hover,
.portal-echo__half:focus-visible {
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 32px 72px rgba(15, 23, 42, 0.14);
}

.portal-echo__half--res:hover,
.portal-echo__half--res:focus-visible {
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 32px 72px rgba(227, 46, 106, 0.2);
}

.portal-echo__half--emp:hover,
.portal-echo__half--emp:focus-visible {
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 32px 72px rgba(37, 99, 235, 0.2);
}

.portal-echo:has(.portal-echo__half--res:hover) .portal-echo__half--emp,
.portal-echo:has(.portal-echo__half--res:focus-visible) .portal-echo__half--emp,
.portal-echo:has(.portal-echo__half--emp:hover) .portal-echo__half--res,
.portal-echo:has(.portal-echo__half--emp:focus-visible) .portal-echo__half--res {
  opacity: 0.72;
  filter: saturate(0.85);
}

.portal-echo__ghosts {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  pointer-events: none;
  user-select: none;
}

.portal-echo__ghosts span {
  font-size: clamp(4.5rem, 12vw, 9rem);
  font-weight: 900;
  line-height: 0.82;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: transparent;
  transition: transform 0.55s ease, -webkit-text-stroke-color 0.4s ease;
}

.portal-echo__half--res .portal-echo__ghosts span {
  -webkit-text-stroke: 1px rgba(227, 46, 106, 0.14);
}

.portal-echo__half--emp .portal-echo__ghosts span {
  -webkit-text-stroke: 1px rgba(37, 99, 235, 0.14);
}

.portal-echo__ghosts span:nth-child(1) {
  transform: translateY(-2.2rem);
  opacity: 0.35;
}

.portal-echo__ghosts span:nth-child(2) {
  transform: translateY(0);
  opacity: 0.55;
  font-size: clamp(5rem, 14vw, 10.5rem);
}

.portal-echo__ghosts span:nth-child(3) {
  transform: translateY(2.2rem);
  opacity: 0.25;
}

.portal-echo__half:hover .portal-echo__ghosts span:nth-child(1),
.portal-echo__half:focus-visible .portal-echo__ghosts span:nth-child(1) {
  transform: translateY(-2.8rem) scale(1.02);
}

.portal-echo__half:hover .portal-echo__ghosts span:nth-child(2),
.portal-echo__half:focus-visible .portal-echo__ghosts span:nth-child(2) {
  transform: translateY(-0.2rem) scale(1.04);
}

.portal-echo__half:hover .portal-echo__ghosts span:nth-child(3),
.portal-echo__half:focus-visible .portal-echo__ghosts span:nth-child(3) {
  transform: translateY(2.8rem) scale(1.02);
}

.portal-echo__panel {
  position: relative;
  z-index: 2;
  width: min(100%, 26rem);
  padding: clamp(2rem, 4vw, 3rem);
  text-align: center;
  border-radius: 1.5rem;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(16px);
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.06);
  transition: transform 0.45s ease, background 0.35s ease;
}

.portal-echo__half:hover .portal-echo__panel,
.portal-echo__half:focus-visible .portal-echo__panel {
  transform: translateY(-6px);
  background: rgba(255, 255, 255, 0.72);
}

.portal-echo__label {
  display: inline-block;
  margin-bottom: 0.65rem;
  padding: 0.38rem 0.85rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.05);
  color: #64748b;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.portal-echo__word {
  display: block;
  margin-bottom: 0.85rem;
  font-size: clamp(3.5rem, 9vw, 6.5rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: -0.045em;
  text-transform: uppercase;
  transition: transform 0.4s ease;
}

.portal-echo__half--res .portal-echo__word {
  color: #e32e6a;
}

.portal-echo__half--emp .portal-echo__word {
  color: #1d4ed8;
}

.portal-echo__half:hover .portal-echo__word,
.portal-echo__half:focus-visible .portal-echo__word {
  transform: scale(1.04);
}

.portal-echo__hint {
  margin: 0 0 1.25rem;
  color: #64748b;
  font-size: 0.92rem;
  line-height: 1.55;
}

.portal-echo__enter {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.7rem 1.35rem;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.85);
  color: #0f172a;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.85;
  transition: opacity 0.3s ease, transform 0.3s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.portal-echo__enter svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s ease;
}

.portal-echo__half:hover .portal-echo__enter,
.portal-echo__half:focus-visible .portal-echo__enter {
  opacity: 1;
}

.portal-echo__half--res:hover .portal-echo__enter,
.portal-echo__half--res:focus-visible .portal-echo__enter {
  background: #e32e6a;
  border-color: #e32e6a;
  color: #fff;
}

.portal-echo__half--emp:hover .portal-echo__enter,
.portal-echo__half--emp:focus-visible .portal-echo__enter {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #fff;
}

.portal-echo__half:hover .portal-echo__enter svg,
.portal-echo__half:focus-visible .portal-echo__enter svg {
  transform: translateX(4px);
}

.portal-echo__seal {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 20;
  display: grid;
  place-items: center;
  gap: 0.35rem;
  width: 7.5rem;
  height: 7.5rem;
  padding: 1rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.95);
  box-shadow:
    0 0 0 1px rgba(15, 23, 42, 0.06),
    0 20px 50px rgba(15, 23, 42, 0.12);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.portal-echo__seal-ring {
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 2px solid rgba(227, 46, 106, 0.22);
  animation: portalEchoPulse 2.8s ease-out infinite;
}

.portal-echo__seal-ring--2 {
  animation-delay: 1.4s;
  border-color: rgba(37, 99, 235, 0.2);
}

@keyframes portalEchoPulse {
  0% { transform: scale(0.92); opacity: 0.8; }
  100% { transform: scale(1.28); opacity: 0; }
}

.portal-echo__seal img {
  width: 52px;
  height: auto;
  position: relative;
  z-index: 1;
}

.portal-echo__seal span {
  position: relative;
  z-index: 1;
  color: #94a3b8;
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-align: center;
  text-transform: uppercase;
}

.portal-echo__bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 15;
  padding: 0.75rem 1rem;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(12px);
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  pointer-events: none;
}

.portal-echo__bar p {
  margin: 0;
  color: #64748b;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-align: center;
  line-height: 1.45;
}

.footer--portal-v34 {
  position: relative;
  z-index: 10;
  padding: 0.85rem 0;
  background: #eef2f7;
  border-top: 1px solid rgba(15, 23, 42, 0.06);
}

.footer--portal-v34 .footer__bottom p {
  margin: 0;
  color: #94a3b8;
  font-size: 0.8rem;
  text-align: center;
}

@media (min-width: 901px) {
  .portal-echo__half--res {
    clip-path: polygon(0 0, 100% 0, calc(100% - 4vw) 100%, 0 100%);
    margin-right: -1.5vw;
  }

  .portal-echo__half--emp {
    clip-path: polygon(4vw 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -1.5vw;
  }
}

@media (max-width: 1100px) {
  .portal-page--v34 {
    padding-bottom: 72px;
  }

  .portal-echo {
    flex-direction: column;
    padding: 5.25rem 1rem 3rem;
  }

  .portal-echo__half {
    min-height: 41vh;
    margin: 0 !important;
    clip-path: none !important;
  }

  .portal-echo__half:hover,
  .portal-echo__half:focus-visible {
    flex: 1.25;
  }

  .portal-echo__word {
    font-size: clamp(2.8rem, 16vw, 4.5rem);
  }

  .portal-echo__ghosts span {
    font-size: clamp(3.5rem, 18vw, 6rem);
  }

  .portal-echo__ghosts span:nth-child(2) {
    font-size: clamp(4rem, 20vw, 7rem);
  }

  .portal-echo__seal {
    width: 6rem;
    height: 6rem;
  }

  .portal-echo__seal span {
    display: none;
  }
}

@media (max-width: 480px) {
  .portal-echo__half {
    min-height: 38vh;
    border-radius: 1.25rem;
  }

  .portal-echo__panel {
    padding: 1.75rem 1.25rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-echo__seal-ring {
    animation: none;
  }

  .portal-echo__half,
  .portal-echo__ghosts span,
  .portal-echo__panel,
  .portal-echo__word,
  .portal-echo__enter {
    transition: none;
  }
}

/* ========== Portal Landing v35 — Spotlight Noir (v21 variant) ========== */
.portal-page--v35 {
  min-height: 100vh;
  overflow-x: hidden;
  background: #030303;
}

.portal-page--v35 .header--portal-v35 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: linear-gradient(180deg, rgba(3, 3, 3, 0.92), transparent);
  border-bottom: none;
}

.portal-page--v35 .header--portal-v35 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-page--v35 .header--portal-v35 .utility-card {
  color: rgba(255, 255, 255, 0.78);
}

.portal-page--v35 .header--portal-v35 .utility-card:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.portal-spot {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding: 5.5rem 0 3rem;
  isolation: isolate;
  background: #030303;
}

.portal-spot__letterbox {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 30;
  height: clamp(2.5rem, 6vh, 4.5rem);
  background: #000;
  pointer-events: none;
}

.portal-spot__letterbox--top {
  top: 0;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.8);
}

.portal-spot__letterbox--bottom {
  bottom: 2.75rem;
  box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.8);
}

.portal-spot__seam {
  position: absolute;
  top: clamp(2.5rem, 6vh, 4.5rem);
  bottom: calc(2.75rem + clamp(2.5rem, 6vh, 4.5rem));
  left: 50%;
  z-index: 18;
  width: 2px;
  transform: translateX(-50%) skewX(-5deg);
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent,
    rgba(227, 46, 106, 0.5) 30%,
    rgba(255, 255, 255, 0.7) 50%,
    rgba(59, 130, 246, 0.5) 70%,
    transparent
  );
  opacity: 0.65;
}

.portal-spot__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: calc(100vh - 5.5rem - 3rem);
  padding: 0 2rem 12vh;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  background: #030303;
  transition:
    flex 0.55s cubic-bezier(0.4, 0, 0.2, 1),
    filter 0.45s ease;
}

.portal-spot__half--res {
  background: #030303;
}

.portal-spot__half--emp {
  background: #030303;
}

.portal-spot__beam {
  position: absolute;
  top: -10%;
  left: 50%;
  width: 140%;
  height: 85%;
  transform: translateX(-50%);
  pointer-events: none;
  opacity: 0.55;
  transition: opacity 0.5s ease, transform 0.55s ease;
  mask-image: radial-gradient(ellipse 55% 70% at 50% 0%, #000 20%, transparent 72%);
}

.portal-spot__half--res .portal-spot__beam {
  background: radial-gradient(ellipse 60% 80% at 50% 0%, rgba(227, 46, 106, 0.55), transparent 68%);
}

.portal-spot__half--emp .portal-spot__beam {
  background: radial-gradient(ellipse 60% 80% at 50% 0%, rgba(59, 130, 246, 0.55), transparent 68%);
}

.portal-spot__half:hover .portal-spot__beam,
.portal-spot__half:focus-visible .portal-spot__beam {
  opacity: 1;
  transform: translateX(-50%) scale(1.08);
}

.portal-spot__ghost {
  position: absolute;
  top: 42%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: clamp(6.5rem, 20vw, 14rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.08);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.9) 0%, transparent 85%);
  transition: transform 0.55s ease, -webkit-text-stroke-color 0.4s ease;
}

.portal-spot__half--res .portal-spot__ghost {
  -webkit-text-stroke-color: rgba(227, 46, 106, 0.12);
}

.portal-spot__half--emp .portal-spot__ghost {
  -webkit-text-stroke-color: rgba(59, 130, 246, 0.12);
}

.portal-spot__half:hover .portal-spot__ghost,
.portal-spot__half:focus-visible .portal-spot__ghost {
  transform: translate(-50%, -54%) scale(1.04);
  -webkit-text-stroke-color: rgba(255, 255, 255, 0.18);
}

.portal-spot__veil {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  opacity: 0;
  transition: opacity 0.45s ease;
  pointer-events: none;
}

.portal-spot:has(.portal-spot__half--res:hover) .portal-spot__half--emp .portal-spot__veil,
.portal-spot:has(.portal-spot__half--res:focus-visible) .portal-spot__half--emp .portal-spot__veil,
.portal-spot:has(.portal-spot__half--emp:hover) .portal-spot__half--res .portal-spot__veil,
.portal-spot:has(.portal-spot__half--emp:focus-visible) .portal-spot__half--res .portal-spot__veil {
  opacity: 1;
}

.portal-spot__half:hover,
.portal-spot__half:focus-visible {
  flex: 1.5;
  z-index: 8;
}

.portal-spot__half:focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.75);
  outline-offset: -6px;
}

.portal-spot__content {
  position: relative;
  z-index: 4;
  max-width: 24rem;
  text-align: center;
  transition: transform 0.45s ease;
}

.portal-spot__half:hover .portal-spot__content,
.portal-spot__half:focus-visible .portal-spot__content {
  transform: translateY(-0.5rem);
}

.portal-spot__label {
  display: block;
  margin-bottom: 0.45rem;
  color: rgba(255, 255, 255, 0.42);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.portal-spot__kicker {
  display: block;
  margin-bottom: 0.1rem;
  color: rgba(255, 255, 255, 0.68);
  font-size: clamp(0.92rem, 2vw, 1.08rem);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

.portal-spot__half--res .portal-spot__kicker {
  color: rgba(255, 220, 232, 0.82);
}

.portal-spot__half--emp .portal-spot__kicker {
  color: rgba(210, 228, 255, 0.82);
}

.portal-spot__word {
  display: block;
  margin-bottom: 0.75rem;
  font-size: clamp(3.5rem, 9vw, 6.75rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: -0.045em;
  text-transform: uppercase;
  transition: transform 0.4s ease, text-shadow 0.4s ease;
}

.portal-spot__half--res .portal-spot__word {
  text-shadow: 0 0 48px rgba(227, 46, 106, 0.45);
}

.portal-spot__half--emp .portal-spot__word {
  text-shadow: 0 0 48px rgba(59, 130, 246, 0.45);
}

.portal-spot__half:hover .portal-spot__word,
.portal-spot__half:focus-visible .portal-spot__word {
  transform: scale(1.04);
}

.portal-spot__hint {
  margin: 0 0 1.25rem;
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.88rem;
  line-height: 1.55;
}

.portal-spot__enter {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.68rem 1.3rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.65;
  transition: opacity 0.3s ease, background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

.portal-spot__enter svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s ease;
}

.portal-spot__half:hover .portal-spot__enter,
.portal-spot__half:focus-visible .portal-spot__enter {
  opacity: 1;
}

.portal-spot__half--res:hover .portal-spot__enter,
.portal-spot__half--res:focus-visible .portal-spot__enter {
  background: #e32e6a;
  border-color: #e32e6a;
  color: #fff;
}

.portal-spot__half--emp:hover .portal-spot__enter,
.portal-spot__half--emp:focus-visible .portal-spot__enter {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

.portal-spot__half:hover .portal-spot__enter svg,
.portal-spot__half:focus-visible .portal-spot__enter svg {
  transform: translateX(4px);
}

.portal-spot__seal {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 22;
  display: grid;
  place-items: center;
  gap: 0.32rem;
  width: 6.5rem;
  height: 6.5rem;
  padding: 0.85rem;
  border-radius: 50%;
  background: rgba(8, 8, 8, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.5);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.portal-spot__seal-ring {
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 1px solid rgba(227, 46, 106, 0.35);
  animation: portalSpotPulse 3s ease-out infinite;
}

.portal-spot__seal-ring--2 {
  animation-delay: 1.5s;
  border-color: rgba(59, 130, 246, 0.3);
}

@keyframes portalSpotPulse {
  0% { transform: scale(0.94); opacity: 0.7; }
  100% { transform: scale(1.35); opacity: 0; }
}

.portal-spot__seal img {
  width: 48px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.88;
  position: relative;
  z-index: 1;
}

.portal-spot__seal span {
  position: relative;
  z-index: 1;
  color: rgba(255, 255, 255, 0.38);
  font-size: 0.48rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-align: center;
  text-transform: uppercase;
}

.portal-spot__bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 25;
  padding: 0.7rem 1rem;
  background: rgba(0, 0, 0, 0.88);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  pointer-events: none;
}

.portal-spot__bar p {
  margin: 0;
  color: rgba(255, 255, 255, 0.38);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-align: center;
  line-height: 1.45;
}

.footer--portal-v35 {
  position: relative;
  z-index: 10;
  padding: 0.85rem 0;
  background: #030303;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.footer--portal-v35 .footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.32);
  font-size: 0.8rem;
  text-align: center;
}

@media (min-width: 901px) {
  .portal-spot__half--res {
    clip-path: polygon(0 0, 100% 0, calc(100% - 4.5vw) 100%, 0 100%);
    margin-right: -1.75vw;
  }

  .portal-spot__half--emp {
    clip-path: polygon(4.5vw 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -1.75vw;
  }
}

@media (max-width: 1100px) {
  .portal-page--v35 {
    padding-bottom: 72px;
  }

  .portal-spot {
    flex-direction: column;
    padding-top: 4.5rem;
  }

  .portal-spot__letterbox {
    height: 2rem;
  }

  .portal-spot__letterbox--bottom {
    bottom: 2.75rem;
  }

  .portal-spot__seam {
    top: 2rem;
    bottom: calc(2.75rem + 2rem);
    left: 0;
    right: 0;
    width: auto;
    height: 2px;
    transform: translateY(-50%) skewY(-2deg);
    background: linear-gradient(
      90deg,
      transparent,
      rgba(227, 46, 106, 0.5) 42%,
      rgba(255, 255, 255, 0.7) 50%,
      rgba(59, 130, 246, 0.5) 58%,
      transparent
    );
  }

  .portal-spot__half {
    min-height: 40vh;
    padding: 2rem 1.5rem 10vh;
    margin: 0 !important;
    clip-path: none !important;
    align-items: center;
  }

  .portal-spot__half:hover,
  .portal-spot__half:focus-visible {
    flex: 1.28;
  }

  .portal-spot__ghost {
    top: 46%;
    font-size: clamp(4.5rem, 22vw, 8rem);
  }

  .portal-spot__word {
    font-size: clamp(2.75rem, 15vw, 4.25rem);
  }

  .portal-spot__seal {
    width: 5.5rem;
    height: 5.5rem;
  }

  .portal-spot__seal span {
    display: none;
  }
}

@media (max-width: 480px) {
  .portal-spot__half {
    min-height: 36vh;
    padding-bottom: 8vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-spot__seal-ring {
    animation: none;
  }

  .portal-spot__half,
  .portal-spot__beam,
  .portal-spot__ghost,
  .portal-spot__content,
  .portal-spot__word,
  .portal-spot__enter,
  .portal-spot__veil {
    transition: none;
  }
}

/* ========== Portal Landing v36 — Halftone Pop (v21 variant) ========== */
.portal-page--v36 {
  min-height: 100vh;
  overflow-x: hidden;
  background: #fffdf5;
}

.portal-page--v36 .header--portal-v36 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: linear-gradient(180deg, rgba(255, 253, 245, 0.96), rgba(255, 253, 245, 0));
  border-bottom: none;
}

.portal-page--v36 .header--portal-v36 .utility-card {
  color: #111827;
}

.portal-page--v36 .header--portal-v36 .utility-card:hover {
  background: rgba(0, 0, 0, 0.06);
}

.portal-pop {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding: 7rem 0 3rem;
  isolation: isolate;
  background: #fffdf5;
}

.portal-pop__dots {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0.35;
  background-image: radial-gradient(circle, #111 1px, transparent 1px);
  background-size: 14px 14px;
  mask-image: radial-gradient(circle at center, #000, transparent 75%);
}

.portal-pop__seam {
  position: absolute;
  top: 7rem;
  bottom: 3rem;
  left: 50%;
  z-index: 18;
  width: 6px;
  transform: translateX(-50%) skewX(-6deg);
  pointer-events: none;
  background: #111;
  box-shadow:
    3px 0 0 #e32e6a,
    -3px 0 0 #2563eb;
}

.portal-pop__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 10rem);
  padding: 2rem;
  text-decoration: none;
  color: #111;
  overflow: hidden;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-pop__half--res {
  background:
    radial-gradient(circle at 30% 40%, rgba(227, 46, 106, 0.14), transparent 45%),
    #fff0f5;
}

.portal-pop__half--emp {
  background:
    radial-gradient(circle at 70% 60%, rgba(37, 99, 235, 0.14), transparent 45%),
    #eff6ff;
}

.portal-pop__ghost {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: clamp(6.5rem, 20vw, 13rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 3px rgba(17, 17, 17, 0.08);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  transition: transform 0.5s ease, -webkit-text-stroke-color 0.4s ease;
}

.portal-pop__half--res .portal-pop__ghost {
  -webkit-text-stroke-color: rgba(227, 46, 106, 0.12);
}

.portal-pop__half--emp .portal-pop__ghost {
  -webkit-text-stroke-color: rgba(37, 99, 235, 0.12);
}

.portal-pop__half:hover .portal-pop__ghost,
.portal-pop__half:focus-visible .portal-pop__ghost {
  transform: translate(-50%, -52%) scale(1.05) rotate(-1deg);
}

.portal-pop__veil {
  position: absolute;
  inset: 0;
  background: rgba(255, 253, 245, 0.55);
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

.portal-pop:has(.portal-pop__half--res:hover) .portal-pop__half--emp .portal-pop__veil,
.portal-pop:has(.portal-pop__half--res:focus-visible) .portal-pop__half--emp .portal-pop__veil,
.portal-pop:has(.portal-pop__half--emp:hover) .portal-pop__half--res .portal-pop__veil,
.portal-pop:has(.portal-pop__half--emp:focus-visible) .portal-pop__half--res .portal-pop__veil {
  opacity: 1;
}

.portal-pop__half:hover,
.portal-pop__half:focus-visible {
  flex: 1.45;
  z-index: 8;
}

.portal-pop__half:focus-visible {
  outline: 4px solid #111;
  outline-offset: -8px;
}

.portal-pop__card {
  position: relative;
  z-index: 3;
  width: min(100%, 25rem);
  padding: clamp(1.75rem, 4vw, 2.5rem);
  text-align: center;
  background: #fff;
  border: 4px solid #111;
  box-shadow: 8px 8px 0 #111;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.portal-pop__half--res .portal-pop__card {
  box-shadow: 8px 8px 0 #e32e6a;
}

.portal-pop__half--emp .portal-pop__card {
  box-shadow: 8px 8px 0 #2563eb;
}

.portal-pop__half:hover .portal-pop__card,
.portal-pop__half:focus-visible .portal-pop__card {
  transform: translate(-4px, -4px);
}

.portal-pop__half--res:hover .portal-pop__card,
.portal-pop__half--res:focus-visible .portal-pop__card {
  box-shadow: 12px 12px 0 #e32e6a;
}

.portal-pop__half--emp:hover .portal-pop__card,
.portal-pop__half--emp:focus-visible .portal-pop__card {
  box-shadow: 12px 12px 0 #2563eb;
}

.portal-pop__badge {
  display: inline-block;
  margin-bottom: 0.75rem;
  padding: 0.35rem 0.75rem;
  background: #111;
  color: #fff;
  font-size: 0.65rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.portal-pop__half--res .portal-pop__badge {
  background: #e32e6a;
}

.portal-pop__half--emp .portal-pop__badge {
  background: #2563eb;
}

.portal-pop__word {
  display: block;
  margin-bottom: 0.75rem;
  font-size: clamp(3.25rem, 9vw, 6rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  transition: transform 0.35s ease;
}

.portal-pop__half--res .portal-pop__word {
  color: #e32e6a;
}

.portal-pop__half--emp .portal-pop__word {
  color: #1d4ed8;
}

.portal-pop__half:hover .portal-pop__word,
.portal-pop__half:focus-visible .portal-pop__word {
  transform: scale(1.04) rotate(-1deg);
}

.portal-pop__hint {
  margin: 0 0 1.15rem;
  color: #4b5563;
  font-size: 0.88rem;
  line-height: 1.55;
}

.portal-pop__enter {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.65rem 1.25rem;
  border: 3px solid #111;
  background: #fff;
  color: #111;
  font-size: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.portal-pop__enter svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s ease;
}

.portal-pop__half--res:hover .portal-pop__enter,
.portal-pop__half--res:focus-visible .portal-pop__enter {
  background: #e32e6a;
  border-color: #e32e6a;
  color: #fff;
}

.portal-pop__half--emp:hover .portal-pop__enter,
.portal-pop__half--emp:focus-visible .portal-pop__enter {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

.portal-pop__half:hover .portal-pop__enter svg,
.portal-pop__half:focus-visible .portal-pop__enter svg {
  transform: translateX(4px);
}

.portal-pop__seal {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 22;
  display: grid;
  place-items: center;
  gap: 0.3rem;
  width: 7rem;
  height: 7rem;
  padding: 0.85rem;
  border: 4px solid #111;
  border-radius: 50%;
  background: #fff;
  box-shadow: 6px 6px 0 #111;
  transform: translate(-50%, -50%) rotate(-3deg);
  pointer-events: none;
}

.portal-pop__seal-burst {
  position: absolute;
  inset: -14px;
  background:
    conic-gradient(from 0deg, #e32e6a 0 8%, transparent 8% 16%, #2563eb 16% 24%, transparent 24% 32%, #e32e6a 32% 40%, transparent 40% 48%, #2563eb 48% 56%, transparent 56% 64%, #e32e6a 64% 72%, transparent 72% 80%, #2563eb 80% 88%, transparent 88% 100%);
  border-radius: 50%;
  opacity: 0.35;
  animation: portalPopSpin 12s linear infinite;
}

@keyframes portalPopSpin {
  to { transform: rotate(360deg); }
}

.portal-pop__seal img {
  position: relative;
  z-index: 1;
  width: 50px;
  height: auto;
}

.portal-pop__seal span {
  position: relative;
  z-index: 1;
  color: #6b7280;
  font-size: 0.48rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.portal-pop__bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 20;
  padding: 0.7rem 1rem;
  background: #111;
  pointer-events: none;
}

.portal-pop__bar p {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  line-height: 1.45;
}

.footer--portal-v36 {
  position: relative;
  z-index: 10;
  padding: 0.85rem 0;
  background: #fffdf5;
  border-top: 4px solid #111;
}

.footer--portal-v36 .footer__bottom p {
  margin: 0;
  color: #6b7280;
  font-size: 0.8rem;
  text-align: center;
}

@media (min-width: 901px) {
  .portal-pop__half--res {
    clip-path: polygon(0 0, 100% 0, calc(100% - 4vw) 100%, 0 100%);
    margin-right: -1.5vw;
  }

  .portal-pop__half--emp {
    clip-path: polygon(4vw 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -1.5vw;
  }
}

@media (max-width: 1100px) {
  .portal-page--v36 {
    padding-bottom: 72px;
  }

  .portal-pop {
    flex-direction: column;
    padding-top: 5.5rem;
  }

  .portal-pop__seam {
    top: 50%;
    bottom: auto;
    left: 0;
    right: 0;
    width: auto;
    height: 6px;
    transform: translateY(-50%) skewY(-2deg);
    box-shadow:
      0 3px 0 #e32e6a,
      0 -3px 0 #2563eb;
  }

  .portal-pop__half {
    min-height: 41vh;
    margin: 0 !important;
    clip-path: none !important;
  }

  .portal-pop__half:hover,
  .portal-pop__half:focus-visible {
    flex: 1.28;
  }

  .portal-pop__ghost {
    font-size: clamp(4.5rem, 22vw, 8rem);
  }

  .portal-pop__word {
    font-size: clamp(2.75rem, 15vw, 4.25rem);
  }

  .portal-pop__seal {
    width: 5.75rem;
    height: 5.75rem;
  }

  .portal-pop__seal span {
    display: none;
  }
}

@media (max-width: 480px) {
  .portal-pop__half {
    min-height: 38vh;
    padding: 1.25rem;
  }

  .portal-pop__card {
    padding: 1.5rem 1.15rem;
    box-shadow: 6px 6px 0 #111;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-pop__seal-burst {
    animation: none;
  }

  .portal-pop__half,
  .portal-pop__ghost,
  .portal-pop__card,
  .portal-pop__word,
  .portal-pop__enter,
  .portal-pop__veil {
    transition: none;
  }
}

/* ========== Portal Landing v37 — Anamorphic Flare (v35 variant) ========== */
.portal-page--v37 {
  min-height: 100vh;
  overflow-x: hidden;
  background: #000;
}

.portal-page--v37 .header--portal-v37 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.94), transparent);
  border-bottom: none;
}

.portal-page--v37 .header--portal-v37 .logo__img {
  filter: brightness(0) invert(1);
}

.portal-page--v37 .header--portal-v37 .utility-card {
  color: rgba(255, 255, 255, 0.78);
}

.portal-page--v37 .header--portal-v37 .utility-card:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.portal-cine {
  position: relative;
  display: flex;
  min-height: 100vh;
  padding: clamp(3.5rem, 8vh, 5.5rem) 0 3rem;
  isolation: isolate;
  background: #000;
}

.portal-cine__letterbox {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 30;
  height: clamp(3.25rem, 9vh, 6rem);
  background: #000;
  pointer-events: none;
}

.portal-cine__letterbox--top {
  top: 0;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.9);
}

.portal-cine__letterbox--top::after,
.portal-cine__letterbox--bottom::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 8px;
  background: repeating-linear-gradient(90deg, #111 0 10px, #222 10px 20px);
  opacity: 0.5;
}

.portal-cine__letterbox--top::after {
  bottom: 0;
}

.portal-cine__letterbox--bottom {
  bottom: 2.75rem;
  box-shadow: 0 -16px 48px rgba(0, 0, 0, 0.9);
}

.portal-cine__letterbox--bottom::before {
  top: 0;
}

.portal-cine__grain {
  position: absolute;
  inset: 0;
  z-index: 28;
  pointer-events: none;
  opacity: 0.18;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.06) 0 1px, transparent 1px),
    radial-gradient(circle at 70% 60%, rgba(255, 255, 255, 0.05) 0 1px, transparent 1px),
    radial-gradient(circle at 40% 80%, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px);
  background-size: 3px 3px, 4px 4px, 5px 5px;
  mix-blend-mode: overlay;
}

.portal-cine__flare {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 19;
  width: min(90vw, 36rem);
  height: 3px;
  transform: translate(-50%, -50%) rotate(-8deg);
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(227, 46, 106, 0.5), #fff, rgba(59, 130, 246, 0.5), transparent);
  filter: blur(1px);
  opacity: 0.55;
  animation: portalCineFlare 5s ease-in-out infinite;
}

@keyframes portalCineFlare {
  0%, 100% { opacity: 0.4; transform: translate(-50%, -50%) rotate(-8deg) scaleX(0.92); }
  50% { opacity: 0.75; transform: translate(-50%, -50%) rotate(-8deg) scaleX(1.05); }
}

.portal-cine__seam {
  position: absolute;
  top: clamp(3.25rem, 9vh, 6rem);
  bottom: calc(2.75rem + clamp(3.25rem, 9vh, 6rem));
  left: 50%;
  z-index: 18;
  width: 1px;
  transform: translateX(-50%) skewX(-5deg);
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.35) 50%, transparent);
}

.portal-cine__half {
  position: relative;
  flex: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: calc(100vh - clamp(3.5rem, 8vh, 5.5rem) - 3rem);
  padding: 0 2rem 11vh;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  background: #000;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.portal-cine__half::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 80% 60% at 50% 50%, transparent 30%, rgba(0, 0, 0, 0.65) 100%);
}

.portal-cine__beam {
  position: absolute;
  top: -5%;
  left: 50%;
  width: 120%;
  height: 80%;
  transform: translateX(-50%);
  pointer-events: none;
  opacity: 0.6;
  transition: opacity 0.5s ease, transform 0.55s ease;
  mask-image: radial-gradient(ellipse 48% 75% at 50% 0%, #000 15%, transparent 70%);
}

.portal-cine__half--res .portal-cine__beam {
  background: radial-gradient(ellipse 55% 85% at 50% 0%, rgba(227, 46, 106, 0.65), transparent 68%);
}

.portal-cine__half--emp .portal-cine__beam {
  background: radial-gradient(ellipse 55% 85% at 50% 0%, rgba(59, 130, 246, 0.65), transparent 68%);
}

.portal-cine__rim {
  position: absolute;
  top: 0;
  left: 50%;
  width: 80%;
  height: 55%;
  transform: translateX(-50%);
  pointer-events: none;
  opacity: 0.35;
  transition: opacity 0.45s ease;
  mask-image: radial-gradient(ellipse 40% 60% at 50% 0%, transparent 55%, #000 75%);
}

.portal-cine__half--res .portal-cine__rim {
  background: radial-gradient(ellipse 50% 70% at 50% 0%, rgba(255, 120, 160, 0.4), transparent 65%);
}

.portal-cine__half--emp .portal-cine__rim {
  background: radial-gradient(ellipse 50% 70% at 50% 0%, rgba(120, 180, 255, 0.4), transparent 65%);
}

.portal-cine__half:hover .portal-cine__beam,
.portal-cine__half:focus-visible .portal-cine__beam {
  opacity: 1;
  transform: translateX(-50%) scale(1.06);
}

.portal-cine__half:hover .portal-cine__rim,
.portal-cine__half:focus-visible .portal-cine__rim {
  opacity: 0.65;
}

.portal-cine__ghost {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: clamp(6rem, 19vw, 13.5rem);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: transparent;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.85) 0%, transparent 88%);
  transition: transform 0.55s ease;
}

.portal-cine__half--res .portal-cine__ghost {
  -webkit-text-stroke: 1px rgba(227, 46, 106, 0.2);
  text-shadow: 3px 0 rgba(227, 46, 106, 0.15), -3px 0 rgba(6, 182, 212, 0.12);
}

.portal-cine__half--emp .portal-cine__ghost {
  -webkit-text-stroke: 1px rgba(59, 130, 246, 0.2);
  text-shadow: 3px 0 rgba(59, 130, 246, 0.15), -3px 0 rgba(244, 114, 182, 0.12);
}

.portal-cine__half:hover .portal-cine__ghost,
.portal-cine__half:focus-visible .portal-cine__ghost {
  transform: translate(-50%, -54%) scale(1.03);
}

.portal-cine__veil {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.62);
  opacity: 0;
  transition: opacity 0.45s ease;
  pointer-events: none;
}

.portal-cine:has(.portal-cine__half--res:hover) .portal-cine__half--emp .portal-cine__veil,
.portal-cine:has(.portal-cine__half--res:focus-visible) .portal-cine__half--emp .portal-cine__veil,
.portal-cine:has(.portal-cine__half--emp:hover) .portal-cine__half--res .portal-cine__veil,
.portal-cine:has(.portal-cine__half--emp:focus-visible) .portal-cine__half--res .portal-cine__veil {
  opacity: 1;
}

.portal-cine__half:hover,
.portal-cine__half:focus-visible {
  flex: 1.52;
  z-index: 8;
}

.portal-cine__half:focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.75);
  outline-offset: -6px;
}

.portal-cine__content {
  position: relative;
  z-index: 4;
  max-width: 24rem;
  text-align: center;
  transition: transform 0.45s ease;
}

.portal-cine__half:hover .portal-cine__content,
.portal-cine__half:focus-visible .portal-cine__content {
  transform: translateY(-0.65rem);
}

.portal-cine__label {
  display: block;
  margin-bottom: 0.5rem;
  color: rgba(255, 255, 255, 0.38);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.portal-cine__word {
  display: block;
  margin-bottom: 0.7rem;
  font-size: clamp(3.25rem, 8.5vw, 6.25rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: -0.045em;
  text-transform: uppercase;
  transition: transform 0.4s ease, text-shadow 0.4s ease;
}

.portal-cine__half--res .portal-cine__word {
  text-shadow: 0 0 52px rgba(227, 46, 106, 0.55);
}

.portal-cine__half--emp .portal-cine__word {
  text-shadow: 0 0 52px rgba(59, 130, 246, 0.55);
}

.portal-cine__half:hover .portal-cine__word,
.portal-cine__half:focus-visible .portal-cine__word {
  transform: scale(1.04);
}

.portal-cine__hint {
  margin: 0 0 1.15rem;
  color: rgba(255, 255, 255, 0.52);
  font-size: 0.86rem;
  line-height: 1.55;
}

.portal-cine__enter {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.65rem 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.6;
  transition: opacity 0.3s ease, background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

.portal-cine__enter svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s ease;
}

.portal-cine__half:hover .portal-cine__enter,
.portal-cine__half:focus-visible .portal-cine__enter {
  opacity: 1;
}

.portal-cine__half--res:hover .portal-cine__enter,
.portal-cine__half--res:focus-visible .portal-cine__enter {
  background: #e32e6a;
  border-color: #e32e6a;
  color: #fff;
}

.portal-cine__half--emp:hover .portal-cine__enter,
.portal-cine__half--emp:focus-visible .portal-cine__enter {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

.portal-cine__half:hover .portal-cine__enter svg,
.portal-cine__half:focus-visible .portal-cine__enter svg {
  transform: translateX(4px);
}

.portal-cine__seal {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 24;
  display: grid;
  place-items: center;
  gap: 0.3rem;
  width: 6.75rem;
  height: 6.75rem;
  padding: 0.8rem;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.16);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.portal-cine__seal-glow {
  position: absolute;
  inset: -20px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.18), transparent 65%);
  animation: portalCineGlow 4s ease-in-out infinite;
}

@keyframes portalCineGlow {
  0%, 100% { opacity: 0.5; transform: scale(0.95); }
  50% { opacity: 1; transform: scale(1.08); }
}

.portal-cine__seal-ring {
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 1px solid rgba(227, 46, 106, 0.35);
  animation: portalCinePulse 3s ease-out infinite;
}

.portal-cine__seal-ring--2 {
  animation-delay: 1.5s;
  border-color: rgba(59, 130, 246, 0.3);
}

@keyframes portalCinePulse {
  0% { transform: scale(0.92); opacity: 0.75; }
  100% { transform: scale(1.38); opacity: 0; }
}

.portal-cine__seal img {
  position: relative;
  z-index: 1;
  width: 48px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.88;
}

.portal-cine__seal span {
  position: relative;
  z-index: 1;
  color: rgba(255, 255, 255, 0.35);
  font-size: 0.46rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.portal-cine__bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 26;
  padding: 0.65rem 1rem;
  background: rgba(0, 0, 0, 0.92);
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  pointer-events: none;
}

.portal-cine__bar p {
  margin: 0;
  color: rgba(255, 255, 255, 0.32);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-align: center;
  line-height: 1.45;
}

.footer--portal-v37 {
  position: relative;
  z-index: 10;
  padding: 0.85rem 0;
  background: #000;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.footer--portal-v37 .footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.28);
  font-size: 0.8rem;
  text-align: center;
}

@media (min-width: 901px) {
  .portal-cine__half--res {
    clip-path: polygon(0 0, 100% 0, calc(100% - 4.5vw) 100%, 0 100%);
    margin-right: -1.75vw;
  }

  .portal-cine__half--emp {
    clip-path: polygon(4.5vw 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -1.75vw;
  }
}

@media (max-width: 1100px) {
  .portal-page--v37 {
    padding-bottom: 72px;
  }

  .portal-cine {
    flex-direction: column;
    padding-top: 4rem;
  }

  .portal-cine__letterbox {
    height: 2.5rem;
  }

  .portal-cine__letterbox--bottom {
    bottom: 2.75rem;
  }

  .portal-cine__flare {
    width: 70vw;
    transform: translate(-50%, -50%) rotate(-4deg);
  }

  .portal-cine__seam {
    top: 2.5rem;
    bottom: calc(2.75rem + 2.5rem);
    left: 0;
    right: 0;
    width: auto;
    height: 1px;
    transform: translateY(-50%) skewY(-2deg);
  }

  .portal-cine__half {
    min-height: 39vh;
    padding: 2rem 1.5rem 9vh;
    margin: 0 !important;
    clip-path: none !important;
    align-items: center;
  }

  .portal-cine__half:hover,
  .portal-cine__half:focus-visible {
    flex: 1.28;
  }

  .portal-cine__ghost {
    top: 44%;
    font-size: clamp(4rem, 20vw, 7.5rem);
  }

  .portal-cine__word {
    font-size: clamp(2.5rem, 14vw, 4rem);
  }

  .portal-cine__seal {
    width: 5.5rem;
    height: 5.5rem;
  }

  .portal-cine__seal span {
    display: none;
  }
}

@media (max-width: 480px) {
  .portal-cine__half {
    min-height: 36vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-cine__flare,
  .portal-cine__seal-glow,
  .portal-cine__seal-ring {
    animation: none;
  }

  .portal-cine__half,
  .portal-cine__beam,
  .portal-cine__rim,
  .portal-cine__ghost,
  .portal-cine__content,
  .portal-cine__word,
  .portal-cine__enter,
  .portal-cine__veil {
    transition: none;
  }
}

/* ========== Portal Landing v38 — Spotlight Clean (v35, chromeless) ========== */
/*
  Desktop: sem header/menu superior — utilitários ficam em residencial/empresarial.
  Mobile: sem dock inferior e sem tarja superior com logo (header removido do HTML).
*/

.portal-page--v38 {
  min-height: 100vh;
  overflow-x: hidden;
  background: #030303;
  display: flex;
  flex-direction: column;
}

.portal-page--v38 > .top-bar {
  flex-shrink: 0;
  position: relative;
  z-index: 50;
}

.portal-page--v38 > .top-bar .top-bar__tagline {
  font-size: clamp(0.68rem, 1.6vw, 0.8rem);
}

.portal-page--v38 > .top-bar .top-bar__connect {
  color: rgba(255, 255, 255, 0.42);
}

@media (max-width: 640px) {
  .portal-page--v38 > .top-bar .top-bar__connect {
    display: none;
  }

  .portal-page--v38 > .top-bar .top-bar__tagline {
    font-size: 0.68rem;
  }
}

.portal-page--v38 .portal-spot {
  flex: 1;
  padding: 0;
  min-height: 0;
}

.portal-page--v38 .portal-spot__half {
  min-height: 100%;
}

.portal-page--v38 .portal-spot__letterbox--bottom {
  bottom: 0;
}

.portal-page--v38 .portal-spot__seam {
  top: clamp(0.75rem, 2.5vh, 1.25rem);
  bottom: clamp(2.5rem, 6vh, 4.5rem);
}

.footer--portal-v38 {
  position: relative;
  z-index: 10;
  padding: 0.85rem 0;
  background: #030303;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.footer--portal-v38 .footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.32);
  font-size: 0.8rem;
  text-align: center;
}

.portal-page--v38 > .footer {
  flex-shrink: 0;
}

@media (max-width: 1100px) {
  body.portal-page--v38,
  body.portal-page--v38.has-cookie-banner {
    padding-bottom: 0;
  }

  .portal-page--v38 {
    padding-bottom: 0;
  }

  .portal-page--v38 .portal-spot {
    flex-direction: column;
    padding-top: 0;
    min-height: 0;
  }

  .portal-page--v38 .portal-spot__letterbox {
    height: clamp(1.75rem, 5vh, 2.5rem);
  }

  .portal-page--v38 .portal-spot__letterbox--bottom {
    bottom: 0;
  }

  .portal-page--v38 .portal-spot__seam {
    top: clamp(0.5rem, 2vh, 1rem);
    bottom: clamp(1.75rem, 5vh, 2.5rem);
  }

  .portal-page--v38 .portal-spot__half {
    min-height: calc(50% - 0.5rem);
    padding: 2rem 1.5rem 10vh;
    margin: 0 !important;
    clip-path: none !important;
    align-items: center;
  }

  .portal-page--v38 .footer--portal-v38 {
    padding: 0.65rem 0;
  }

  .portal-page--v38 .footer--portal-v38 .footer__bottom p {
    font-size: 0.72rem;
  }
}

@media (max-width: 480px) {
  .portal-page--v38 .portal-spot__half {
    min-height: calc(50% - 0.5rem);
    padding-bottom: 8vh;
  }
}

/* Section scenes — neutraliza fundos legados para transições suaves */
.section.section-scene {
  background: transparent;
}

.section.section-scene::before {
  content: none;
}

.section.section-scene.wlan-steps,
.section.section-scene.wlan-features {
  background: transparent;
}

.section.section-scene.gamer,
.section.section-scene.differentials,
.section.section-scene.features,
.section.section-scene.plans,
.section.section-scene.telefonia,
.section.section-scene.tv-teaser,
.section.section-scene.coverage,
.section.section-scene.portal {
  overflow: visible;
}

.section.section-scene.referral.section-scene--solid-edges {
  background: var(--gradient);
  overflow: hidden;
}

.section.section-scene.emp-chatbot::before {
  content: none;
}

.section.section-scene.emp-chatbot {
  overflow: visible;
}