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

    :root {
      --red-500: #b4534a;
      --red-50: #fbf3f1;
      --danger: var(--red-500);
      --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
      --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
      --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
      --space-2xs: 6px;
      --space-xs: 10px;
      --space-sm: 14px;
      --space-md: 20px;
      --space-lg: 28px;
      --space-xl: 40px;
      --space-2xl: 64px;
      --section-y: clamp(52px, 8vw, 88px);
      --page-x: clamp(20px, 5vw, 36px);
      --text-caption: 12px;
      --text-small: 13px;
      --text-body: 16px;
      --text-lead: 17px;
      --text-subhead: 20px;
      --text-heading: 52px;
      --text-display: 60px;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      background: var(--cream);
      color: var(--ink);
      font-family: var(--font-sans);
      font-weight: 400;
      line-height: 1.6;
      overflow-x: hidden;
      font-size: 100%;
      -webkit-font-smoothing: antialiased;
      font-kerning: normal;
      text-rendering: optimizeLegibility;
    }

    .serif {
      font-family: var(--serif);
    }

    /* TICKER */
    .ticker-wrap {
      background: var(--g-dd);
      overflow: hidden;
      border-bottom: 1px solid rgba(255, 255, 255, 0.04);
      padding: 10px 0;
      position: relative;
      z-index: 1;
    }

    .ticker {
      display: flex;
      white-space: nowrap;
      animation: ticker 22s linear infinite;
    }

    .ticker-item {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.02em;
      text-transform: none;
      color: rgba(255, 255, 255, 0.4);
      padding: 0 36px;
    }

    .ticker-item span {
      color: var(--g);
      opacity: 0.35;
      margin: 0 10px;
    }

    @keyframes ticker {
      0% {
        transform: translateX(0);
      }

      100% {
        transform: translateX(-50%);
      }
    }

    /* HERO */
    .hero {
      background: #202019;
      position: relative;
      overflow: hidden;
      min-height: 100svh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 0;
    }

    .hero-bg {
      position: absolute;
      inset: 0;
      z-index: 0;
    }

    .hero-bg-noise {
      position: absolute;
      inset: 0;
      opacity: 0.024;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
      background-size: 128px 128px;
    }

    .hero-bg-glow {
      position: absolute;
      top: -120px;
      right: -80px;
      width: 480px;
      height: 480px;
      background: radial-gradient(circle,
          rgba(107, 124, 78, 0.11),
          transparent 65%);
      animation: heroFloat 8s var(--ease-out-quart) infinite;
    }

    .hero-bg-glow-2 {
      position: absolute;
      bottom: -100px;
      left: -60px;
      width: 360px;
      height: 360px;
      background: radial-gradient(circle,
          rgba(184, 160, 106, 0.05),
          transparent 65%);
      animation: heroFloat 10s var(--ease-out-quart) infinite reverse;
    }

    .hero-bg-grid {
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(rgba(255, 255, 255, 0.012) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.012) 1px, transparent 1px);
      background-size: 60px 60px;
      mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black, transparent);
      -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black, transparent);
    }

    .hero-content {
      position: relative;
      z-index: 1;
      padding: clamp(88px, 14svh, 128px) var(--page-x) clamp(56px, 8svh, 84px);
      max-width: 640px;
      margin: 0 auto;
      width: 100%;
    }

    .hero-eyebrow {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 28px;
      opacity: 0;
      transform: translateY(12px);
      animation: heroFadeUp 0.6s var(--ease-out-quint) forwards 0.1s;
    }

    .hero-agency {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--g);
    }

    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(255, 255, 255, 0.045);
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 100px;
      padding: 8px 16px;
      margin-bottom: 24px;
      opacity: 0;
      transform: translateY(12px);
      animation: heroFadeUp 0.6s var(--ease-out-quint) forwards 0.1s;
    }

    .hero-badge-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--g-d);
      opacity: 0.78;
    }

    .hero-badge-text {
      font-size: var(--text-caption);
      font-weight: 500;
      letter-spacing: 0.02em;
      text-transform: none;
      color: rgba(255, 255, 255, 0.5);
    }

    @keyframes heroPulse {

      0%,
      100% {
        opacity: 1;
      }

      50% {
        opacity: 0.4;
      }
    }

    .hero-title {
      font-family: var(--serif);
      font-size: var(--text-display);
      font-weight: 600;
      color: var(--white);
      line-height: 0.98;
      letter-spacing: -2.5px;
      margin-bottom: 24px;
      text-wrap: balance;
      opacity: 0;
      transform: translateY(20px);
      animation: heroFadeUp 0.8s var(--ease-out-expo) forwards 0.2s;
    }

    .hero-title em {
      font-style: italic;
      font-weight: 400;
      color: var(--g);
      display: block;
      margin-top: 8px;
      letter-spacing: -1.5px;
    }

    .hero-divider {
      width: 40px;
      height: 1px;
      background: rgba(163, 177, 138, 0.45);
      margin-bottom: 24px;
      border-radius: 2px;
      opacity: 0;
      animation: heroFadeUp 0.5s var(--ease-out-quint) forwards 0.4s;
    }

    .hero-sub {
      font-size: var(--text-lead);
      font-weight: 400;
      color: rgba(255, 255, 255, 0.5);
      line-height: 1.72;
      max-width: 34rem;
      text-wrap: pretty;
      opacity: 0;
      transform: translateY(12px);
      animation: heroFadeUp 0.6s var(--ease-out-quint) forwards 0.5s;
    }

    .hero-scroll {
      position: absolute;
      bottom: 32px;
      left: 32px;
      display: flex;
      align-items: center;
      gap: 12px;
      opacity: 0;
      animation: heroFadeUp 0.6s var(--ease-out-quint) forwards 1.2s;
    }

    .hero-scroll-line {
      width: 24px;
      height: 1px;
      background: rgba(255, 255, 255, 0.15);
    }

    .hero-scroll-text {
      font-size: var(--text-caption);
      font-weight: 500;
      letter-spacing: 0.02em;
      text-transform: none;
      color: rgba(255, 255, 255, 0.35);
    }

    .hero-scroll-arrow {
      width: 16px;
      height: 16px;
      border-right: 1.5px solid rgba(255, 255, 255, 0.3);
      border-bottom: 1.5px solid rgba(255, 255, 255, 0.3);
      transform: rotate(45deg);
      animation: heroScrollBounce 2s var(--ease-out-quart) infinite;
    }

    @keyframes heroScrollBounce {
      0%, 100% { transform: rotate(45deg) translateY(0); }
      50% { transform: rotate(45deg) translateY(4px); }
    }

    .hero-stats {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      border-top: 1px solid rgba(255, 255, 255, 0.06);
      background: rgba(0, 0, 0, 0.2);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      opacity: 0;
      animation: heroFadeUp 0.6s var(--ease-out-quint) forwards 0.95s;
    }

    .hero-stat {
      padding: 22px 24px;
      border-right: 1px solid rgba(255, 255, 255, 0.06);
      text-align: center;
      transition: background-color 0.3s var(--ease-out-quart);
    }

    .hero-stat:hover {
      background: rgba(255, 255, 255, 0.03);
    }

    .hero-stat:last-child {
      border-right: none;
    }

    .hero-stat-val {
      font-size: 22px;
      font-weight: 700;
      color: var(--g);
      display: block;
      line-height: 1;
      margin-bottom: 6px;
    }

    .hero-stat-label {
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.02em;
      text-transform: none;
      color: rgba(255, 255, 255, 0.4);
    }

    @keyframes heroFloat {

      0%,
      100% {
        transform: translateY(0);
      }

      50% {
        transform: translateY(-10px);
      }
    }

    @keyframes heroFadeUp {
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    /* WARNING */
    .warning {
      max-width: 680px;
      margin: 0 auto;
      position: relative;
      z-index: 2;
      background: var(--gold-l);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid rgba(184, 160, 106, 0.24);
      border-radius: 16px;
      padding: 22px 24px;
      display: flex;
      align-items: flex-start;
      gap: 14px;
      box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.06),
        0 1px 3px rgba(0, 0, 0, 0.04);
    }

    .warn-icon {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      background: var(--gold-l);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      flex-shrink: 0;
    }

    .warn-title {
      font-size: 12px;
      font-weight: 700;
      color: var(--g-dd);
      letter-spacing: 0.02em;
      text-transform: none;
      margin-bottom: 6px;
    }

    .warn-text {
      font-size: 13px;
      font-weight: 400;
      color: var(--ink-2);
      line-height: 1.65;
    }

    /* TOP NAV */
    .top-nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 200;
      min-height: 56px;
      padding: 14px 32px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: rgba(245, 245, 243, 0.92);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-bottom: 1px solid var(--line);
      transition:
        background-color 0.3s var(--ease-out-quart),
        border-color 0.3s var(--ease-out-quart),
        box-shadow 0.3s var(--ease-out-quart);
    }

    .top-nav.scrolled {
      background: rgba(245, 245, 243, 0.96);
      box-shadow: 0 1px 12px rgba(0, 0, 0, 0.06);
    }

    .top-nav-brand {
      font-size: 17px;
      font-weight: 700;
      color: var(--ink);
      letter-spacing: -0.3px;
      transition: color 0.3s var(--ease-out-quart);
    }

    .top-nav-brand span {
      color: var(--g);
      transition: color 0.3s var(--ease-out-quart);
    }

    .top-nav.scrolled .top-nav-brand {
      color: var(--ink);
    }

    .top-nav.scrolled .top-nav-brand span {
      color: var(--g);
    }

    .top-nav-label {
      font-size: 13px;
      font-weight: 500;
      color: var(--ink-3);
      transition: color 0.3s var(--ease-out-quart);
    }

    .top-nav.scrolled .top-nav-label {
      color: var(--ink-3);
    }

    .mobile-nav-toggle {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      border-radius: 10px;
      border: 1px solid var(--line-2);
      background: var(--g-l);
      cursor: pointer;
      transition:
        background-color 0.2s var(--ease-out-quart),
        border-color 0.2s var(--ease-out-quart),
        color 0.2s var(--ease-out-quart),
        transform 0.2s var(--ease-out-quart);
      color: var(--g-d);
    }

    .mobile-nav-toggle:hover {
      background: rgba(107, 124, 78, 0.14);
      transform: translateY(-1px);
    }

    .mobile-nav-toggle:active {
      transform: scale(0.96);
    }

    .top-nav.scrolled .mobile-nav-toggle {
      border-color: var(--line-2);
      background: var(--g-l);
      color: var(--g-d);
    }

    /* SIDEBAR / DRAWER */
    .sidebar {
      position: fixed;
      top: 56px;
      right: 0;
      width: min(280px, calc(100vw - 48px));
      height: calc(100dvh - 56px);
      padding: 18px 14px 28px;
      display: flex;
      flex-direction: column;
      z-index: 150;
      background: var(--white);
      box-shadow: var(--shadow-lg);
      border-left: 1px solid var(--line);
      overflow-y: auto;
      transform: translateX(100%);
      visibility: hidden;
      transition:
        transform 0.32s var(--ease-out-quint),
        visibility 0.32s var(--ease-out-quint);
    }

    .sidebar.open {
      transform: translateX(0);
      visibility: visible;
    }

    .sidebar .nav-link {
      opacity: 0;
      transform: translateX(10px);
    }

    .sidebar.open .nav-link {
      opacity: 1;
      transform: translateX(0);
    }

    .sidebar.open .nav-link:nth-child(1) { transition-delay: 0.04s; }
    .sidebar.open .nav-link:nth-child(2) { transition-delay: 0.07s; }
    .sidebar.open .nav-link:nth-child(3) { transition-delay: 0.1s; }
    .sidebar.open .nav-link:nth-child(4) { transition-delay: 0.13s; }
    .sidebar.open .nav-link:nth-child(5) { transition-delay: 0.16s; }
    .sidebar.open .nav-link:nth-child(6) { transition-delay: 0.19s; }
    .sidebar.open .nav-link:nth-child(7) { transition-delay: 0.22s; }
    .sidebar.open .nav-link:nth-child(8) { transition-delay: 0.25s; }
    .sidebar.open .nav-link:nth-child(9) { transition-delay: 0.28s; }
    .sidebar.open .nav-link:nth-child(10) { transition-delay: 0.31s; }
    .sidebar.open .nav-link:nth-child(11) { transition-delay: 0.34s; }
    .sidebar.open .nav-link:nth-child(12) { transition-delay: 0.37s; }
    .sidebar.open .nav-link:nth-child(13) { transition-delay: 0.4s; }
    .sidebar.open .nav-link:nth-child(14) { transition-delay: 0.43s; }
    .sidebar.open .nav-link:nth-child(15) { transition-delay: 0.46s; }
    .sidebar.open .nav-link:nth-child(16) { transition-delay: 0.49s; }

    .sidebar-head {
      padding: 6px 8px 14px;
      border-bottom: 1px solid var(--line);
      margin-bottom: 8px;
    }

    .sidebar-brand {
      font-size: 15px;
      font-weight: 700;
      color: var(--ink);
      letter-spacing: -0.3px;
    }

    .sidebar-brand span {
      color: var(--g);
    }

    .sidebar-brand-sub {
      font-size: 12px;
      font-weight: 500;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--ink-3);
      margin-top: 3px;
    }

    .sidebar-links {
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 2px;
      flex: 1;
    }

    .sidebar-footer {
      padding: 16px 8px 0;
      border-top: 1px solid var(--line);
      font-size: 12px;
      color: var(--ink-3);
      line-height: 1.5;
    }

    .sidebar-label {
      display: none;
    }

    .nav-link {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 12px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 500;
      color: var(--ink-2);
      text-decoration: none;
      transition:
        background-color 0.18s var(--ease-out-quart),
        border-color 0.18s var(--ease-out-quart),
        color 0.18s var(--ease-out-quart),
        transform 0.18s var(--ease-out-quart);
      position: relative;
      min-height: 44px;
      overflow-wrap: anywhere;
    }

    .nav-link:hover {
      background: var(--g-l);
      color: var(--ink-2);
      transform: none;
    }

    .nav-link.active {
      background: var(--g-l);
      font-weight: 600;
      color: var(--g-dd);
      box-shadow: inset 0 0 0 1px rgba(107, 124, 78, 0.16);
    }

    .nav-link.active::before {
      display: none;
    }

    .nav-num {
      font-family: var(--font-sans);
      font-style: normal;
      font-size: 12px;
      color: var(--ink-3);
      min-width: 18px;
      line-height: 1;
      font-weight: 700;
    }

    .nav-link.active .nav-num {
      color: var(--g-d);
    }

    /* MOBILE OVERLAY */
    .mobile-overlay {
      position: fixed;
      inset: 0;
      z-index: 140;
      background: rgba(0, 0, 0, 0.3);
      backdrop-filter: blur(4px);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.28s var(--ease-out-quart);
    }

    .mobile-overlay.open {
      opacity: 1;
      pointer-events: auto;
    }

    /* SECTIONS */
    .section {
      padding: var(--section-y) var(--page-x);
      max-width: min(680px, 100%);
      margin: 0 auto;
      scroll-margin-top: 64px;
    }

    .section.bg-white {
      background: var(--white);
      padding: var(--section-y) var(--page-x);
      max-width: 100%;
    }

    .section.bg-white .inner {
      max-width: min(680px, 100%);
      margin: 0 auto;
    }

    .section.bg-dark {
      background: var(--ink);
      max-width: 100%;
      padding: var(--section-y) var(--page-x);
    }

    .section.bg-dark .inner {
      max-width: min(680px, 100%);
      margin: 0 auto;
    }

    .sec-title {
      font-family: var(--serif);
      font-size: var(--text-heading);
      font-weight: 600;
      line-height: 1.08;
      letter-spacing: -1.5px;
      margin-bottom: var(--space-md);
      color: var(--ink);
      text-wrap: balance;
    }

    .sec-title em {
      font-style: italic;
      color: var(--g);
      font-weight: 500;
      letter-spacing: -1px;
    }

    .sec-body {
      font-size: var(--text-body);
      font-weight: 400;
      color: var(--ink);
      line-height: 1.72;
      margin-bottom: var(--space-md);
      max-width: 64ch;
      text-wrap: pretty;
    }

    .sec-body-dark {
      color: rgba(255, 255, 255, 0.5);
    }

    .sec-body strong {
      font-weight: 600;
      color: var(--ink);
    }

    .sec-body-dark strong {
      color: rgba(255, 255, 255, 0.85);
    }

    /* DECO */
    .deco {
      width: 28px;
      height: 1px;
      background: var(--line);
      margin-bottom: 16px;
    }

    .deco-dark {
      background: rgba(255, 255, 255, 0.15);
    }

    .divider {
      width: 100%;
      height: 1px;
      background: var(--line);
      margin: 20px 0;
    }

    .divider-dark {
      background: rgba(255, 255, 255, 0.07);
    }

    /* STEPS */
    .steps {
      display: flex;
      flex-direction: column;
      gap: 0;
      margin-top: var(--space-lg);
      border-top: 1px solid var(--line);
    }

    .step-row {
      display: flex;
      align-items: flex-start;
      gap: var(--space-md);
      padding: 16px 0;
      border-bottom: 1px solid var(--line);
    }

    .step-row > div {
      min-width: 0;
      flex: 1;
    }

    .step-n {
      font-size: 1.5rem;
      font-weight: 600;
      color: var(--line);
      min-width: 28px;
      line-height: 1;
      margin-top: 2px;
      font-variant-numeric: tabular-nums;
    }

    .step-title {
      font-size: 0.9375rem;
      font-weight: 600;
      color: var(--ink);
      display: block;
      line-height: 1.45;
      overflow-wrap: anywhere;
    }

    .step-desc {
      font-size: var(--text-small);
      font-weight: 400;
      color: var(--ink-2);
      display: block;
      margin-top: 3px;
      line-height: 1.62;
      overflow-wrap: anywhere;
    }

    /* LISTS */
    .check-list {
      list-style: none;
      margin-top: 16px;
      border-top: 1px solid var(--line);
    }

    .check-list li {
      padding: 12px 0;
      border-bottom: 1px solid var(--line);
      font-size: 0.9375rem;
      font-weight: 400;
      color: var(--ink-2);
      display: flex;
      align-items: flex-start;
      gap: 12px;
      line-height: 1.6;
    }

    .check-list li::before {
      content: "—";
      color: var(--line);
      flex-shrink: 0;
      margin-top: 1px;
    }

    .no-list li::before {
      content: "✕";
      color: var(--danger);
      font-size: var(--text-caption);
      font-weight: 600;
    }

    .dark-list {
      border-top-color: rgba(255, 255, 255, 0.1);
    }

    .dark-list li {
      border-bottom-color: rgba(255, 255, 255, 0.1);
      color: rgba(255, 255, 255, 0.5);
    }

    .dark-list li::before {
      color: rgba(255, 255, 255, 0.4);
    }

    .dark-list.no-list li::before {
      color: var(--danger);
    }

    /* CARDS */
    .cards-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
      gap: var(--space-sm);
      margin-top: var(--space-lg);
    }

    .card {
      padding: 20px;
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      background: var(--white);
      box-shadow: none;
    }

    .card-dark {
      background: rgba(255, 255, 255, 0.04);
      border-color: rgba(255, 255, 255, 0.1);
    }

    .card-label {
      font-size: var(--text-caption);
      font-weight: 500;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--ink-3);
      display: block;
      margin-bottom: 6px;
    }

    .card-label-dark {
      color: rgba(255, 255, 255, 0.5);
    }

    .card-val {
      font-family:
        var(--font-sans);
      font-size: 1.625rem;
      font-weight: 700;
      color: var(--ink);
      line-height: 1;
      display: block;
    }

    .card-val-dark {
      color: var(--white);
    }

    .card-sub {
      font-size: 0.75rem;
      font-weight: 400;
      color: var(--ink-2);
      margin-top: 4px;
      display: block;
    }

    .card-sub-dark {
      color: rgba(255, 255, 255, 0.55);
    }

    /* CALL CARDS */
    .call-cards {
      display: flex;
      flex-direction: column;
      gap: var(--space-sm);
      margin-top: var(--space-lg);
    }

    .call-card {
      padding: clamp(18px, 3.2vw, 24px);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      background: var(--white);
      box-shadow: none;
    }

    .call-name {
      font-family:
        var(--font-sans);
      font-size: var(--text-subhead);
      font-weight: 600;
      color: var(--ink);
      margin-bottom: 4px;
    }

    .call-name-dark {
      color: var(--white);
    }

    .badge {
      display: inline-block;
      font-size: var(--text-caption);
      font-weight: 500;
      letter-spacing: 0.02em;
      text-transform: none;
      padding: 4px 12px;
      border-radius: 100px;
      margin-bottom: 10px;
    }

    .badge-sim {
      background: rgba(107, 124, 78, 0.1);
      color: var(--g-d);
    }

    .badge-nao {
      background: rgba(180, 83, 74, 0.09);
      color: #8f463f;
    }

    .call-desc {
      font-size: 0.9375rem;
      font-weight: 400;
      color: var(--ink-2);
      line-height: 1.68;
      max-width: 62ch;
    }

    .call-desc-dark {
      color: rgba(255, 255, 255, 0.45);
    }

    /* TABLE */
    .table-wrap {
      overflow-x: auto;
      margin-top: 16px;
    }

    table {
      width: 100%;
      border-collapse: collapse;
      font-size: 13px;
    }

    th {
      background: transparent;
      color: rgba(255, 255, 255, 0.55);
      font-weight: 500;
      font-size: 12px;
      letter-spacing: 0.02em;
      text-transform: none;
      padding: 10px 12px;
      text-align: left;
      border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    }

    td {
      padding: 10px 12px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.06);
      color: rgba(255, 255, 255, 0.7);
      font-weight: 400;
    }

    tr:last-child td {
      border-bottom: none;
    }

    .table-note {
      font-size: 12px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.45);
      margin-top: 10px;
      font-style: italic;
    }

    /* PUNISHMENT */
    .punish-list {
      display: flex;
      flex-direction: column;
      gap: var(--space-xs);
      margin-top: var(--space-md);
    }

    .punish-item {
      display: flex;
      align-items: center;
      gap: var(--space-sm);
      padding: 16px 18px;
      border-radius: var(--radius-lg);
      background: var(--white);
      border: 1px solid var(--line);
      box-shadow: none;
    }

    .punish-num {
      font-family:
        var(--font-sans);
      font-size: var(--text-small);
      font-weight: 600;
      color: var(--ink-3);
      min-width: 60px;
      letter-spacing: 0.02em;
      font-variant-numeric: tabular-nums;
    }

    .punish-pct {
      font-family:
        var(--font-sans);
      font-size: 1.375rem;
      font-weight: 600;
      color: var(--danger);
      min-width: 56px;
      font-variant-numeric: tabular-nums;
    }

    .punish-desc {
      font-size: var(--text-small);
      font-weight: 400;
      color: var(--ink-2);
    }

    /* INFO BOX */
    .info-box {
      margin-top: var(--space-md);
      padding: 18px 20px;
      border-radius: var(--radius-lg);
      background: var(--white);
      border: 1px solid var(--line);
      box-shadow: none;
    }

    .info-box-dark {
      border-left-color: rgba(255, 255, 255, 0.15);
      background: rgba(255, 255, 255, 0.04);
    }

    .info-box p {
      font-size: 0.9375rem;
      font-weight: 400;
      color: var(--ink-2);
      line-height: 1.7;
      max-width: 62ch;
    }

    .info-box-dark p {
      color: rgba(255, 255, 255, 0.45);
    }

    .info-box strong {
      font-weight: 500;
      color: var(--ink);
    }

    .info-box-dark strong {
      color: rgba(255, 255, 255, 0.8);
    }

    /* ALERT BOX — informação importante que não pode passar batida */
    .alert-box {
      margin-top: var(--space-md);
      padding: 18px 20px;
      border-radius: var(--radius-lg);
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }

    .alert-box.alert-warn {
      background: rgba(245, 240, 226, 0.68);
      border: 1px solid rgba(184, 160, 106, 0.2);
    }

    .alert-box.alert-danger {
      background: rgba(251, 243, 241, 0.78);
      border: 1px solid rgba(180, 83, 74, 0.16);
    }

    .alert-box.alert-tip {
      background: rgba(237, 238, 230, 0.76);
      border: 1px solid var(--line);
    }

    .alert-icon {
      font-size: 16px;
      flex-shrink: 0;
      margin-top: 1px;
    }

    .alert-box p {
      font-size: 0.9375rem;
      font-weight: 400;
      line-height: 1.68;
      max-width: 62ch;
    }

    .alert-box.alert-warn p {
      color: var(--g-dd);
    }

    .alert-box.alert-danger p {
      color: var(--danger);
    }

    .alert-box.alert-tip p {
      color: var(--g-dd);
    }

    .alert-box strong {
      font-weight: 600;
    }

    /* FUNC GRID */
    .func-grid {
      display: flex;
      flex-direction: column;
      gap: var(--space-sm);
      margin-top: var(--space-lg);
    }

    .func-item {
      display: flex;
      align-items: flex-start;
      gap: var(--space-sm);
      padding: 18px 20px;
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      background: var(--white);
      box-shadow: none;
    }

    .func-icon {
      font-size: 20px;
      flex-shrink: 0;
      margin-top: 2px;
    }

    .func-title {
      font-size: 0.9375rem;
      font-weight: 600;
      color: var(--ink);
      display: block;
      margin-bottom: 3px;
    }

    .func-desc {
      font-size: var(--text-small);
      font-weight: 400;
      color: var(--ink-2);
      line-height: 1.62;
      max-width: 60ch;
    }

    /* SUBSTITUTES */
    .sub-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
      gap: var(--space-xs);
      margin-top: var(--space-md);
    }

    .sub-item {
      padding: 12px 14px;
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: 12px;
      display: flex;
      align-items: center;
      gap: var(--space-xs);
      min-width: 0;
    }

    .sub-from {
      font-size: var(--text-small);
      font-weight: 400;
      color: var(--danger);
      text-decoration: line-through;
    }

    .sub-arrow {
      color: var(--line);
      font-size: 0.75rem;
    }

    .sub-to {
      font-size: var(--text-small);
      font-weight: 400;
      color: var(--ink);
    }

    /* FINAL */
    .final {
      background: var(--ink);
      padding: var(--section-y) var(--page-x) clamp(48px, 7vw, 72px);
      text-align: center;
    }

    .final-inner {
      max-width: 480px;
      margin: 0 auto;
    }

    .final-title {
      font-size: clamp(1.75rem, 5vw, 2rem);
      font-weight: 700;
      color: var(--white);
      line-height: 1.2;
      letter-spacing: 0;
      margin-bottom: 16px;
      text-wrap: balance;
    }

    .final-title em {
      font-style: normal;
      color: var(--g);
    }

    .final-sub {
      font-size: var(--text-small);
      font-weight: 400;
      color: rgba(255, 255, 255, 0.4);
      margin-bottom: 28px;
      line-height: 1.7;
      max-width: 360px;
      margin-left: auto;
      margin-right: auto;
    }

    .wa-btn {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      background: var(--g-d);
      color: var(--white);
      font-family:
        var(--font-sans);
      font-size: var(--text-small);
      font-weight: 500;
      padding: 16px 32px;
      border-radius: 100px;
      text-decoration: none;
      margin-top: 0;
      transition:
        background-color 0.2s var(--ease-out-quart),
        box-shadow 0.2s var(--ease-out-quart),
        transform 0.2s var(--ease-out-quart);
      letter-spacing: 0.3px;
    }

    .wa-btn:hover {
      background: var(--g-dd);
      transform: translateY(-1px);
      box-shadow: 0 5px 16px rgba(107, 124, 78, 0.18);
    }

    .wa-btn:active {
      transform: translateY(0);
    }

    .fade-up {
      opacity: 0;
      transform: translateY(20px);
      transition:
        opacity 0.6s var(--ease-out-quart),
        transform 0.6s var(--ease-out-quart);
    }

    .fade-up.visible {
      opacity: 1;
      transform: translateY(0);
    }

    /* STAGGER — filhos aparecem em sequência */
    .stagger>* {
      opacity: 0;
      transform: translateY(24px);
      transition:
        opacity 0.5s var(--ease-out-quart),
        transform 0.5s var(--ease-out-quart);
    }

    .stagger.visible>* {
      opacity: 1;
      transform: translateY(0);
    }

    .stagger.visible>*:nth-child(1) {
      transition-delay: 0.1s;
    }

    .stagger.visible>*:nth-child(2) {
      transition-delay: 0.22s;
    }

    .stagger.visible>*:nth-child(3) {
      transition-delay: 0.34s;
    }

    .stagger.visible>*:nth-child(4) {
      transition-delay: 0.46s;
    }

    .stagger.visible>*:nth-child(5) {
      transition-delay: 0.58s;
    }

    .stagger.visible>*:nth-child(6) {
      transition-delay: 0.7s;
    }

    .stagger.visible>*:nth-child(7) {
      transition-delay: 0.82s;
    }

    .stagger.visible>*:nth-child(8) {
      transition-delay: 0.94s;
    }

    /* HOVER sutil nos cards interativos */
    .func-item {
      transition:
        transform 0.25s var(--ease-out-quart),
        box-shadow 0.25s var(--ease-out-quart),
        border-color 0.25s var(--ease-out-quart);
    }

    .func-item:hover {
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.035);
      border-color: var(--line-2);
    }

    .func-item:active {
      transform: translateY(0);
    }

    .punish-item {
      transition:
        transform 0.25s var(--ease-out-quart),
        box-shadow 0.25s var(--ease-out-quart),
        border-color 0.25s var(--ease-out-quart);
    }

    .punish-item:hover {
      transform: translateY(-1px);
      box-shadow: 0 3px 10px rgba(0, 0, 0, 0.035);
      border-color: var(--line-2);
    }

    /* CALL MOCKUP — simulação da tela do app */
    .call-mockup {
      width: 100%;
      max-width: 280px;
      margin: 16px auto 0;
      border-radius: 20px;
      padding: 36px 20px 28px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .call-mockup-lupa {
      background: linear-gradient(160deg, #22242b 0%, #1b2026 100%);
    }

    .call-mockup-amigo {
      background: linear-gradient(160deg, #242420 0%, #1b1c19 100%);
    }

    .call-mockup-deusa {
      background: linear-gradient(160deg, #3a3043 0%, #51425f 100%);
    }

    .call-mockup-avatar {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      margin: 0 auto 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
    }

    .call-mockup-lupa .call-mockup-avatar {
      background: #2ec4b6;
      color: var(--white);
      font-size: 20px;
      font-weight: 600;
    }

    .call-mockup-amigo .call-mockup-avatar {
      background: #2ec4b6;
      color: var(--white);
      font-size: 20px;
      font-weight: 600;
    }

    .call-mockup-deusa .call-mockup-avatar {
      background: transparent;
      font-size: 36px;
    }

    .call-mockup-name {
      font-size: 13px;
      font-weight: 600;
      color: var(--white);
      margin-bottom: 2px;
    }

    .call-mockup-info {
      font-size: 12px;
      color: rgba(255, 255, 255, 0.5);
      margin-bottom: 6px;
    }

    .call-mockup-status {
      font-size: 12px;
      color: rgba(255, 255, 255, 0.4);
      margin-bottom: 28px;
    }

    .call-mockup-earn {
      font-size: 13px;
      font-weight: 700;
      color: var(--white);
    }

    .call-mockup-earn span {
      color: var(--gold);
    }

    .call-mockup-type {
      font-size: 9px;
      color: rgba(255, 255, 255, 0.55);
      margin-top: 4px;
      letter-spacing: 0.02em;
    }

    .call-mockup-nopay {
      font-size: 12px;
      font-weight: 600;
      color: rgba(255, 255, 255, 0.5);
      margin-top: 10px;
      letter-spacing: 0.02em;
    }

    .call-mockup-header {
      font-size: 12px;
      font-weight: 700;
      color: var(--white);
      margin-bottom: 16px;
      letter-spacing: 0.3px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
    }

    .call-mockup-header svg,
    .call-mockup-info svg {
      vertical-align: middle;
    }

    .call-mockup-buttons {
      display: flex;
      justify-content: center;
      gap: 40px;
      margin-top: 24px;
    }

    .call-mockup-btn {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      transition:
        transform 0.18s var(--ease-out-quart),
        box-shadow 0.18s var(--ease-out-quart);
    }

    .call-mockup-btn:hover {
      transform: translateY(-1px);
      box-shadow: 0 5px 12px rgba(0, 0, 0, 0.12);
    }

    .call-mockup-btn-red {
      background: #b85b52;
    }

    .call-mockup-btn-green {
      background: #5f7f55;
    }

    /* MODAL */
    .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.75);
      z-index: 999;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.28s var(--ease-out-quart);
    }

    .modal-overlay.open {
      opacity: 1;
      pointer-events: all;
    }

    .modal-box {
      position: relative;
      width: 90%;
      max-width: 380px;
      aspect-ratio: 9/16;
      background: #000;
      border-radius: 16px;
      overflow: hidden;
      opacity: 0;
      transform: translateY(18px) scale(0.96);
      transition:
        opacity 0.32s var(--ease-out-quart),
        transform 0.32s var(--ease-out-quart);
    }

    .modal-overlay.open .modal-box {
      opacity: 1;
      transform: translateY(0) scale(1);
    }

    .modal-box iframe {
      width: 100%;
      height: 100%;
      border: none;
    }

    .modal-close {
      position: absolute;
      top: -36px;
      right: 0;
      background: none;
      border: none;
      color: var(--white);
      font-size: 13px;
      font-weight: 400;
      letter-spacing: 0.02em;
      cursor: pointer;
      font-family:
        var(--font-sans);
      opacity: 0.7;
    }

    .modal-close:hover {
      opacity: 1;
    }

    /* VIDEO BUTTON */
    .video-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-top: 16px;
      font-size: 12px;
      font-weight: 500;
      color: var(--ink);
      letter-spacing: 0.02em;
      cursor: pointer;
      background: none;
      border: none;
      padding: 0;
      font-family:
        var(--font-sans);
      text-decoration: underline;
      text-decoration-color: var(--line);
      text-underline-offset: 3px;
      transition:
        color 0.18s var(--ease-out-quart),
        text-decoration-color 0.18s var(--ease-out-quart),
        transform 0.18s var(--ease-out-quart);
    }

    .video-btn:hover {
      text-decoration-color: var(--ink);
      transform: translateX(2px);
    }

    .video-btn:active {
      transform: translateX(2px) scale(0.98);
    }

    .video-btn svg {
      flex-shrink: 0;
    }

    .chat-toggle {
      position: fixed;
      bottom: 24px;
      right: 24px;
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: var(--g-d);
      color: var(--white);
      border: none;
      cursor: pointer;
      box-shadow: 0 3px 12px rgba(107, 124, 78, 0.15);
      z-index: 300;
      font-size: 22px;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      transform: translateY(8px) scale(0.96);
      transition:
        opacity 0.25s var(--ease-out-quart),
        transform 0.25s var(--ease-out-quart),
        box-shadow 0.25s var(--ease-out-quart);
    }

    .chat-toggle.visible {
      opacity: 1;
      pointer-events: all;
      transform: translateY(0) scale(1);
    }

    .chat-toggle:hover {
      transform: translateY(-1px);
      box-shadow: 0 5px 16px rgba(107, 124, 78, 0.18);
    }

    .chat-box {
      position: fixed;
      bottom: calc(96px + env(safe-area-inset-bottom));
      right: 24px;
      width: 360px;
      max-height: 520px;
      background: var(--bg);
      border-radius: 24px;
      box-shadow: 0 12px 34px rgba(0, 0, 0, 0.12);
      z-index: 300;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      opacity: 0;
      pointer-events: none;
      transform: translateY(14px) scale(0.98);
      transform-origin: bottom right;
      transition:
        opacity 0.28s var(--ease-out-quart),
        transform 0.28s var(--ease-out-quart);
    }

    .chat-box.open {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0) scale(1);
    }

    .chat-header {
      background: var(--g-d);
      color: var(--white);
      padding: 18px 20px;
      font-size: 0.9375rem;
      font-weight: 600;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-radius: 24px 24px 0 0;
    }

    .chat-header button {
      background: rgba(255, 255, 255, 0.2);
      border: none;
      color: var(--white);
      font-size: 18px;
      cursor: pointer;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .chat-messages {
      overflow-y: auto;
      padding: 20px 16px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      max-height: 200px;
      background: var(--bg);
      -webkit-overflow-scrolling: touch;
      position: relative;
    }

    .chat-messages::-webkit-scrollbar {
      width: 4px;
    }

    .chat-messages::-webkit-scrollbar-thumb {
      background: var(--cream-2);
      border-radius: 4px;
    }

    .chat-msg {
      max-width: 82%;
      padding: 12px 16px;
      font-size: var(--text-small);
      line-height: 1.62;
      font-weight: 400;
    }

    .chat-msg.bot {
      background: var(--white);
      color: var(--ink);
      align-self: flex-start;
      border-radius: 18px 18px 18px 4px;
      box-shadow: none;
    }

    .chat-msg.user {
      background: var(--g-d);
      color: var(--white);
      align-self: flex-end;
      border-radius: 18px 18px 4px 18px;
      font-weight: 500;
    }

    .chat-options {
      padding: 16px;
      background: var(--bg);
      border-top: 1px solid var(--line);
      box-shadow: none;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      max-height: 200px;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }

    .chat-options::-webkit-scrollbar {
      width: 4px;
    }

    .chat-options::-webkit-scrollbar-thumb {
      background: var(--line);
      border-radius: 4px;
    }

    .chat-opt {
      background: var(--g-l);
      border: none;
      color: var(--g-dd);
      padding: 8px 16px;
      border-radius: 50px;
      font-size: var(--text-small);
      font-weight: 600;
      cursor: pointer;
      transition:
        background-color 0.18s var(--ease-out-quart),
        color 0.18s var(--ease-out-quart),
        transform 0.18s var(--ease-out-quart);
      font-family: var(--font-sans);
      white-space: nowrap;
    }

    .chat-opt:hover {
      background: var(--g-d);
      color: var(--white);
      transform: none;
    }

    .chat-opt:active {
      transform: scale(0.97);
    }

    .chat-wa-link {
      display: inline-block;
      background: #25d366;
      color: var(--white);
      padding: 10px 20px;
      border-radius: 50px;
      text-decoration: none;
      font-weight: 600;
      font-size: var(--text-small);
    }

    .chat-scroll-hint {
      text-align: center;
      font-size: 12px;
      font-weight: 500;
      color: var(--g);
      padding: 6px 0 0;
      background: var(--bg);
      border-top: 2px solid var(--line);
      animation: hintPulse 1.5s var(--ease-out-quart) infinite;
    }

    @keyframes hintPulse {

      0%,
      100% {
        opacity: 1;
      }

      50% {
        opacity: 0.5;
      }
    }

    /* WEEK TIMELINE */
    .week-timeline {
      display: flex;
      gap: var(--space-2xs);
      margin: 24px 0 0;
      position: relative;
      overflow-x: auto;
      padding-bottom: var(--space-2xs);
      scrollbar-width: thin;
    }

    .week-day {
      flex: 1;
      min-width: 48px;
      text-align: center;
      padding: 8px 2px;
      position: relative;
    }

    .week-day-name {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--ink-3);
      display: block;
      margin-bottom: 6px;
    }

    .week-day-dot {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      margin: 0 auto 4px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      transform: scale(1);
      transition: transform 0.22s var(--ease-out-quart);
    }

    .week-day:hover .week-day-dot {
      transform: translateY(-2px) scale(1.05);
    }

    .fade-up.visible .week-day-dot {
      animation: timelineDotIn 0.42s var(--ease-out-quart) both;
    }

    .fade-up.visible .week-day:nth-child(1) .week-day-dot { animation-delay: 0.08s; }
    .fade-up.visible .week-day:nth-child(2) .week-day-dot { animation-delay: 0.13s; }
    .fade-up.visible .week-day:nth-child(3) .week-day-dot { animation-delay: 0.18s; }
    .fade-up.visible .week-day:nth-child(4) .week-day-dot { animation-delay: 0.23s; }
    .fade-up.visible .week-day:nth-child(5) .week-day-dot { animation-delay: 0.28s; }
    .fade-up.visible .week-day:nth-child(6) .week-day-dot { animation-delay: 0.33s; }
    .fade-up.visible .week-day:nth-child(7) .week-day-dot { animation-delay: 0.38s; }
    .fade-up.visible .week-day:nth-child(8) .week-day-dot { animation-delay: 0.43s; }

    @keyframes timelineDotIn {
      from {
        opacity: 0;
        transform: translateY(8px) scale(0.86);
      }

      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    .week-day-dot--moedas {
      background: var(--g-l);
      border: 2px solid var(--g);
    }

    .week-day-dot--planilha {
      background: var(--gold-l);
      border: 2px solid var(--gold);
    }

    .week-day-dot--pix {
      background: var(--g-l);
      border: 2px solid var(--g);
    }

    .week-day-dot--off {
      background: var(--bg);
      border: 2px solid var(--line-2);
    }

    .week-day-label {
      font-size: 8px;
      font-weight: 500;
      color: var(--ink-2);
      display: block;
      line-height: 1.3;
    }

    .week-legend {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 16px;
    }

    .week-legend-item {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      font-weight: 500;
      color: var(--ink-2);
    }

    .week-legend-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    /* BACK TO TOP */

    .dicas-card-wrap {
      position: relative;
      max-width: 560px;
      margin: 0 auto;
      border-radius: var(--radius-lg);
      background: var(--white);
      border: 1px solid var(--line);
      box-shadow: var(--shadow-sm);
      overflow: hidden;
    }

    .dicas-card-wrap a {
      display: flex;
      flex-direction: row;
      background: var(--bg);
      border: 1px solid rgba(107, 124, 78, 0.14);
      overflow: hidden;
      text-decoration: none;
      transition:
        box-shadow 0.3s var(--ease-out-quart),
        transform 0.3s var(--ease-out-quart);
    }

    .dicas-card-wrap:hover a {
      transform: translateY(-2px);
      box-shadow: var(--shadow-sm);
    }

    .dicas-card-text {
      flex: 1;
      padding: 28px 28px;
    }

    .dicas-card-img {
      width: 220px;
      flex-shrink: 0;
      overflow: hidden;
      position: relative;
    }

    .dicas-card-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 20%;
      display: block;
    }

    .dicas-card-badge {
      position: absolute;
      bottom: 12px;
      left: 12px;
      background: rgba(255, 255, 255, 0.7);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      border-radius: 100px;
      padding: 4px 10px;
      display: flex;
      align-items: center;
      gap: 4px;
      box-shadow: var(--shadow-sm);
      white-space: nowrap;
    }

    .dicas-card-badge svg {
      flex-shrink: 0;
      opacity: 0.7;
    }

    .dicas-card-badge span {
      font-family: var(--font-sans);
      font-size: 9px;
      font-weight: 500;
      color: var(--ink-2);
      letter-spacing: 0.2px;
    }

    .dicas-card-kicker {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--g);
      margin-bottom: 8px;
    }

    .dicas-card-title {
      font-size: 18px;
      font-weight: 700;
      color: var(--ink);
      line-height: 1.3;
      margin-bottom: 6px;
      letter-spacing: -0.3px;
    }

    .dicas-card-title span,
    .dicas-card-link {
      color: var(--g);
    }

    .dicas-card-desc {
      font-size: 13px;
      color: var(--ink-2);
      line-height: 1.6;
      margin-bottom: 16px;
    }

    .dicas-card-link {
      font-family: var(--font-sans);
      font-size: 13px;
      font-weight: 600;
    }

    @media (max-width: 900px) {
      .dicas-card-wrap a {
        flex-direction: column;
      }

      .dicas-card-img {
        width: 100%;
        height: 280px;
      }
    }

    .back-to-top {
      position: fixed;
      bottom: 24px;
      left: 24px;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: var(--white);
      border: 1px solid var(--line);
      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
      color: var(--ink-2);
      cursor: pointer;
      z-index: 300;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      transform: translateY(8px) scale(0.96);
      transition:
        opacity 0.25s var(--ease-out-quart),
        transform 0.25s var(--ease-out-quart),
        background-color 0.2s var(--ease-out-quart),
        border-color 0.2s var(--ease-out-quart),
        color 0.2s var(--ease-out-quart);
    }

    .back-to-top.visible {
      opacity: 1;
      pointer-events: all;
      transform: translateY(0) scale(1);
    }

    .back-to-top:hover {
      background: var(--bg);
      color: var(--g-d);
      border-color: var(--line);
      transform: translateY(-1px);
    }

    .back-to-top:active {
      transform: scale(0.96);
    }

    /* PROGRESS BAR */
    .progress-wrap {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 3px;
      background: var(--bg);
    }

    .progress-bar {
      height: 100%;
      width: 0%;
      background: linear-gradient(90deg, var(--g), var(--g-d));
      transition: width 0.15s linear;
    }

    @media (max-width: 900px) {
      .hero {
        min-height: 52vh;
      }

      .hero-content {
        padding: 32px 24px 40px !important;
        margin: 0 auto;
  width: 100%;
}

      .hero-title {
        font-size: 42px;
        letter-spacing: -1.5px;
      }

      .hero-stats {
        grid-template-columns: 1fr 1fr 1fr;
      }

      .hero-stat {
        padding: 16px 12px;
      }

      .hero-stat-val {
        font-size: var(--text-body);
      }

      .section {
        padding: 64px 24px;
      }

      .section.bg-white {
        padding: 64px 24px;
      }

      .section.bg-dark {
        padding: 64px 24px;
      }

      .sec-title {
        font-size: 28px;
        letter-spacing: -0.8px;
      }

      .cards-grid {
        grid-template-columns: 1fr;
        gap: 8px;
      }

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

      .final {
        padding: 64px 24px 48px;
      }

      .final-title {
        font-size: 26px;
      }

      .chat-box {
        width: calc(100vw - 32px);
        right: 16px;
        bottom: calc(92px + env(safe-area-inset-bottom));
        max-height: 70vh;
      }

      .chat-box.open {
        display: flex;
      }

      .chat-toggle {
        bottom: 20px;
        right: 16px;
        width: 48px;
        height: 48px;
        font-size: 20px;
      }

      .back-to-top {
        bottom: 20px;
        left: 16px;
        width: 40px;
        height: 40px;
      }
    }

    /* APP POPUP SIMULATION */
    .app-popup {
      background: var(--white);
      border-radius: 16px;
      border: 1px solid var(--line);
      box-shadow: 0 8px 22px rgba(0, 0, 0, 0.055);
      padding: 28px 24px;
      text-align: center;
      max-width: 340px;
      margin: 8px auto 0;
    }

    .app-popup-label {
      font-size: var(--text-caption);
      font-weight: 600;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--ink-3);
      display: block;
      text-align: center;
    }

    .app-popup-title {
      font-size: 1.125rem;
      font-weight: 600;
      color: var(--danger);
      margin-bottom: 12px;
    }

    .app-popup-text {
      font-size: var(--text-small);
      font-weight: 400;
      color: var(--ink-2);
      line-height: 1.62;
      margin-bottom: 16px;
    }

    .app-popup-text strong {
      color: var(--danger);
      font-weight: 600;
    }

    .app-popup-btn {
      display: inline-block;
      background: #7c5cfc;
      color: var(--white);
      font-size: 14px;
      font-weight: 600;
      padding: 12px 48px;
      border-radius: 100px;
      border: none;
      letter-spacing: 0.3px;
      pointer-events: none;
    }

    .inline-app-btn {
      display: inline-block;
      background: #7c5cfc;
      color: var(--white);
      font-size: 12px;
      font-weight: 600;
      padding: 3px 12px;
      border-radius: 100px;
      letter-spacing: 0.2px;
      vertical-align: middle;
    }

    /* APP STATUS TOGGLE SIMULATION */
    .app-status-cards {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin: 20px 0;
      max-width: 300px;
    }

    .app-status-card {
      border-radius: 12px;
      padding: 14px 18px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .app-status-card--dark {
      background: #4a4a4a;
    }

    .app-status-card--red {
      background: #6b1a1a;
    }

    .app-status-name {
      font-size: 14px;
      font-weight: 500;
      color: var(--white);
      display: block;
      line-height: 1.3;
    }

    .app-status-sub {
      font-size: 12px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.5);
      display: block;
    }

    .app-toggle {
      width: 44px;
      height: 26px;
      border-radius: 13px;
      background: rgba(120, 120, 120, 0.4);
      position: relative;
      flex-shrink: 0;
    }

    .app-toggle-knob {
      width: 22px;
      height: 22px;
      border-radius: 50%;
      background: #e0e0e0;
      position: absolute;
      top: 2px;
      left: 2px;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    }

    .glass-card {
      background: rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      border: 1px solid rgba(255, 255, 255, 0.15);
      border-radius: 14px;
      padding: 16px 18px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .glass-card-name {
      font-size: 14px;
      font-weight: 500;
      color: rgba(255, 255, 255, 0.85);
      display: block;
      line-height: 1.3;
    }

    .glass-card-sub {
      font-size: 12px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.4);
      display: block;
    }

    .glass-card-device {
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--cream-2);
      display: block;
      margin-bottom: 6px;
      text-align: center;
    }

    /* APP BUTTON SIMULATIONS */
    .app-btn-sim {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .app-btn-sim--purple {
      background: #6c5ce7;
      color: var(--white);
    }

    .app-btn-sim--gray {
      background: rgba(0, 0, 0, 0.06);
      border: 1.5px solid rgba(0, 0, 0, 0.12);
      color: var(--ink-2);
    }

    .app-blur-sim {
      display: flex;
      align-items: center;
      gap: 8px;
      background: rgba(0, 0, 0, 0.08);
      border-radius: 100px;
      padding: 4px 6px 4px 14px;
      flex-shrink: 0;
    }

    .app-blur-sim-label {
      font-size: 13px;
      font-weight: 500;
      color: var(--ink-2);
    }

    .app-blur-sim-toggle {
      width: 36px;
      height: 22px;
      border-radius: 11px;
      background: rgba(0, 0, 0, 0.12);
      position: relative;
    }

    .app-blur-sim-knob {
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: var(--white);
      position: absolute;
      top: 2px;
      left: 2px;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    }
    /* FONT OVERRIDE — kit.css consistency */
    .step-n, .card-val, .call-name, .punish-num, .punish-pct, .wa-btn, .chat-input, .chat-send {
      font-family: var(--font-sans);
    }
    .sec-title, .hero-title, .final-title {
      font-family: var(--serif);
    }

    .hero-pill-item {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 14px;
      border-radius: 999px;
      font-size: 0.75rem;
      font-weight: 500;
      color: rgba(255,255,255,0.55);
      border: 1px solid rgba(255,255,255,0.1);
      background: rgba(255,255,255,0.04);
    }
    .hero-pill-dark {
      background: var(--g-dd);
      border-color: rgba(255,255,255,0.08);
      color: rgba(255,255,255,0.7);
    }
    .hero-pill-dot {
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: var(--g);
      flex-shrink: 0;
    }

    .hero-actions {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 24px;
      opacity: 0;
      transform: translateY(12px);
      animation: heroFadeUp 0.6s var(--ease-out-quint) forwards 0.68s;
    }

    .hero-cta {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 44px;
      padding: 12px 20px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.06);
      color: rgba(255, 255, 255, 0.82);
      border: 1px solid rgba(255, 255, 255, 0.14);
      font-size: 12px;
      font-weight: 600;
      text-decoration: none;
      letter-spacing: 0.02em;
      text-transform: none;
      transition:
        background-color 0.18s var(--ease-out-quart),
        border-color 0.18s var(--ease-out-quart),
        box-shadow 0.18s var(--ease-out-quart),
        transform 0.18s var(--ease-out-quart);
    }

    .hero-cta:hover {
      background: rgba(107, 124, 78, 0.22);
      box-shadow: var(--shadow-sm);
      transform: translateY(-1px);
    }

    .hero-cta:active {
      transform: scale(0.98);
    }

    .hero-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 16px;
      opacity: 0;
      transform: translateY(12px);
      animation: heroFadeUp 0.6s var(--ease-out-quint) forwards 0.78s;
    }

    .hero-mark-line {
      width: 20px;
      height: 1px;
      background: var(--g);
      opacity: 0.6;
      display: inline-block;
    }

    .hero-meta-divider {
      height: 1px;
      background: rgba(255, 255, 255, 0.07);
      margin: 20px 0;
    }

    .hero-meta {
      display: flex;
      gap: 16px 24px;
      flex-wrap: wrap;
    }

    .hero-meta-item {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: var(--text-caption);
      color: rgba(255, 255, 255, 0.35);
    }

    .hero-meta-item--wide {
      max-width: 100%;
    }

    .hero-meta-dot {
      width: 4px;
      height: 4px;
      border-radius: 50%;
      background: var(--g);
      flex-shrink: 0;
    }

    .top-nav-actions {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .coin-list {
      gap: 8px;
    }

    .coin-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: var(--space-sm);
      padding: 14px 18px;
    }

    .coin-label {
      font-size: 0.875rem;
      color: var(--ink-2);
      min-width: 0;
    }

    .coin-value {
      font-size: var(--text-body);
      font-weight: 700;
      color: var(--g-d);
      flex-shrink: 0;
    }

    .guide-block {
      margin: 20px 0;
    }

    .guide-block-lg {
      margin-top: 28px;
    }

    .platform-block {
      margin-top: var(--space-xl);
    }

    .platform-block + .platform-block {
      margin-top: var(--space-xl);
    }

    .platform-label {
      margin-bottom: 8px;
    }

    .app-sim-wrap {
      max-width: 300px;
      margin: 0 auto 16px;
    }

    .glass-card-light {
      background: rgba(255, 255, 255, 0.82);
      border-color: rgba(0, 0, 0, 0.08);
    }

    .glass-card-light .glass-card-name {
      color: var(--ink);
    }

    .glass-card-light .glass-card-sub {
      color: var(--ink-3);
    }

    .app-toggle-muted {
      background: rgba(0, 0, 0, 0.1);
    }

    .app-toggle-knob-light {
      background: var(--white);
    }

    .app-popup--kyc {
      text-align: center;
      padding: 28px 24px 24px;
    }

    .app-popup-title--neutral {
      color: var(--ink);
      font-size: 1.0625rem;
    }

    .app-popup-text--kyc {
      color: var(--ink-2);
      font-size: var(--text-small);
      line-height: 1.62;
      margin-bottom: 20px;
    }

    .app-popup-btn--block,
    .app-popup-secondary {
      display: block;
      width: 100%;
      text-align: center;
      font-size: 0.9375rem;
    }

    .app-popup-btn--block {
      padding: 14px;
      margin-bottom: 10px;
    }

    .app-popup-secondary {
      padding: 12px;
      font-weight: 500;
      color: var(--ink-2);
      border: 1px solid var(--line);
      border-radius: 100px;
    }

    .guide-img-sm {
      max-width: 140px;
      border-radius: 10px;
      border: 1px solid var(--line);
      box-shadow: var(--shadow-sm);
    }

    .pix-field-list {
      display: flex;
      flex-direction: column;
      gap: var(--space-sm);
      margin-top: var(--space-sm);
    }

    .pix-field {
      padding: 14px 16px;
      background: var(--bg);
      border-radius: 10px;
      border: 1px solid rgba(107, 124, 78, 0.14);
    }

    .pix-field-label {
      font-size: var(--text-caption);
      font-weight: 700;
      letter-spacing: 0.02em;
      text-transform: none;
      color: var(--g);
      margin-bottom: 4px;
    }

    .pix-field-text {
      font-size: var(--text-small);
      color: var(--ink-2);
      line-height: 1.58;
    }

    .attention-wrap {
      padding: 28px 32px 0;
    }

    .attention-card {
      max-width: 680px;
      margin: 0 auto;
      padding: 18px 22px;
      border-radius: var(--radius-lg);
      background: var(--gold-l);
      border: 1px solid rgba(184, 160, 106, 0.28);
      box-shadow: var(--shadow-sm);
    }

    .attention-card p {
      font-size: 0.9375rem;
      line-height: 1.68;
      color: var(--ink-2);
    }

    .attention-card strong {
      color: var(--g-dd);
      font-weight: 700;
    }

    .guide-head {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px;
      margin-bottom: 16px;
    }

    .guide-head::before {
      content: "";
      display: inline-flex;
      align-items: center;
      min-height: 26px;
      padding: 5px 10px;
      border-radius: 999px;
      background: var(--g-l);
      border: 1px solid rgba(107, 124, 78, 0.18);
      color: var(--g-d);
      font-size: var(--text-caption);
      font-weight: 700;
      letter-spacing: 0.02em;
      line-height: 1;
      text-transform: none;
    }

    .guide-tag {
      border-left: 1px solid var(--line);
      color: var(--ink-3);
      font-size: var(--text-caption);
      font-weight: 700;
      letter-spacing: 0.02em;
      padding-left: 12px;
      text-transform: none;
    }

    .sec-tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--ink-3);
      font-size: var(--text-caption);
      font-weight: 700;
      letter-spacing: 0.02em;
      line-height: 1.4;
      text-transform: none;
    }

    .sec-tag-dark {
      color: rgba(255, 255, 255, 0.45);
    }

    #perfil .guide-head::before { content: "passo 1 de 15"; }
    #kyc .guide-head::before { content: "passo 2 de 15"; }
    #pix .guide-head::before { content: "passo 3 de 15"; }
    #chamadas .guide-head::before { content: "passo 4 de 15"; }
    #valores .guide-head::before { content: "passo 5 de 15"; }
    #pagamento .guide-head::before { content: "passo 6 de 15"; }
    #niveis .guide-head::before { content: "passo 7 de 15"; }
    #ganhos .guide-head::before { content: "passo 8 de 15"; }
    #funcionalidades .guide-head::before { content: "passo 9 de 15"; }
    #stories .guide-head::before { content: "passo 10 de 15"; }
    #regras .guide-head::before { content: "passo 11 de 15"; }
    #chat .guide-head::before { content: "passo 12 de 15"; }
    #seguranca .guide-head::before { content: "passo 13 de 15"; }
    #punicoes .guide-head::before { content: "passo 14 de 15"; }
    #bloqueios .guide-head::before { content: "passo 15 de 15"; }

    #chamadas .guide-head::before {
      background: rgba(255, 255, 255, 0.06);
      border-color: rgba(255, 255, 255, 0.14);
      color: rgba(255, 255, 255, 0.72);
    }

    #chamadas .guide-tag {
      border-left-color: rgba(255, 255, 255, 0.12);
      color: rgba(255, 255, 255, 0.42);
    }

    #pagamento .section,
    #regras .section,
    #bloqueios .section {
      border-top: 1px solid rgba(184, 160, 106, 0.14);
      border-bottom: 1px solid rgba(184, 160, 106, 0.1);
      background:
        linear-gradient(180deg, rgba(245, 240, 226, 0.42), var(--white));
    }

    #punicoes .section {
      border-top: 1px solid rgba(184, 160, 106, 0.14);
      border-bottom: 1px solid rgba(184, 160, 106, 0.1);
      background:
        linear-gradient(180deg, rgba(245, 240, 226, 0.42), var(--cream));
    }

    #pagamento .card {
      border-color: rgba(107, 124, 78, 0.16);
      box-shadow: none;
    }

    #pagamento .card-dark {
      background: var(--g-d) !important;
      border-color: rgba(107, 124, 78, 0.2) !important;
    }

    #valores .call-card,
    #ganhos .info-box,
    #niveis .info-box {
      border: 1px solid rgba(107, 124, 78, 0.12);
      box-shadow: none;
    }

    #regras .check-list,
    #chat .check-list {
      background: rgba(255, 255, 255, 0.58);
      border: 1px solid rgba(0, 0, 0, 0.055);
      border-radius: 14px;
      overflow: hidden;
      padding: 0 16px;
    }

    #regras .no-list,
    #chat .no-list {
      background: rgba(251, 243, 241, 0.55);
      border-color: rgba(180, 83, 74, 0.12);
    }

    #punicoes .punish-item,
    #bloqueios .punish-item {
      border: 1px solid rgba(180, 83, 74, 0.12);
      box-shadow: none;
    }

    #punicoes .punish-item:last-child,
    #bloqueios .punish-item {
      background: var(--white);
      border-color: rgba(180, 83, 74, 0.16);
    }

    #bloqueios .app-popup {
      border-color: rgba(180, 83, 74, 0.14);
      box-shadow: 0 10px 24px rgba(127, 29, 29, 0.055);
    }

    #contato .sec-tag::before {
      content: "suporte";
      display: inline-flex;
      align-items: center;
      min-height: 26px;
      padding: 5px 10px;
      margin-right: 8px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(255, 255, 255, 0.14);
      color: rgba(255, 255, 255, 0.72);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.02em;
      text-transform: none;
      vertical-align: middle;
    }

    .sec-title {
      margin-bottom: 24px;
    }

    .sec-body + .cards-grid,
    .sec-body + .steps,
    .sec-body + .call-cards,
    .sec-body + .func-grid {
      margin-top: 24px;
    }

    @media (max-width: 900px) {
      .hero-content {
        padding-bottom: 30px !important;
        margin: 0 auto;
  width: 100%;
}

      .hero-actions {
        margin-top: 24px;
      }

      .hero-cta {
        width: 100%;
      }

      .hero-pills {
        gap: 8px;
      }

      .attention-wrap {
        padding: 24px 24px 0;
      }

      .attention-card {
        padding: 17px 18px;
        border-radius: 14px;
      }

      .attention-card p {
        font-size: 13px;
      }

      .section,
      .section.bg-white,
      .section.bg-dark {
        padding-top: 48px;
        padding-bottom: 48px;
      }

      .guide-head {
        gap: 8px;
        margin-bottom: 12px;
      }

      .guide-head::before {
        font-size: 9px;
        min-height: 24px;
        padding: 4px 9px;
      }

      #contato .sec-tag::before {
        font-size: 9px;
        margin-right: 8px;
        min-height: 24px;
        padding: 4px 9px;
      }

      .call-card,
      .card,
      .info-box,
      .alert-box,
      .punish-item,
      .func-item {
        border-radius: 12px;
      }
    }

/* Accessibility & Hitboxes */
.hero-cta, #chatToggle { min-width: 44px; min-height: 44px; }
.chat-close { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; }

    @media (max-width: 768px) {
      .hero-scroll {
        display: none !important;
      }
    }

    @media (max-width: 900px) {
      :root {
        --section-y: 56px;
        --page-x: 24px;
      }

      .hero {
        min-height: 88svh;
      }

      .hero-content {
        padding: 88px var(--page-x) 42px !important;
        width: 100%;
      }

      .hero-title {
        font-size: 42px;
        letter-spacing: -1.5px;
      }

      .section,
      .section.bg-white,
      .section.bg-dark {
        padding-left: var(--page-x);
        padding-right: var(--page-x);
      }

      .section.bg-white .inner,
      .section.bg-dark .inner {
        max-width: 680px;
      }
    }

    @media (max-width: 640px) {
      :root {
        --section-y: 48px;
        --page-x: 20px;
      }

      .hero {
        min-height: 92svh;
      }

      .hero-content {
        padding-top: 82px !important;
      }

      .hero-title {
        font-size: 42px;
        letter-spacing: -1.5px;
      }

      .hero-sub {
        max-width: 100%;
      }

      .guide-head {
        align-items: flex-start;
      }

      .step-row {
        gap: 12px;
        padding: 16px 0;
      }

      .step-n {
        min-width: 32px;
      }

      .coin-row {
        align-items: flex-start;
      }

      .punish-item {
        flex-wrap: wrap;
        gap: 6px 12px;
      }

      .punish-desc {
        flex-basis: 100%;
        padding-left: 72px;
      }

      .sub-item {
        flex-wrap: wrap;
      }

      .app-popup {
        max-width: 100%;
      }

      .final-sub br {
        display: none;
      }
    }

    /* Quieter pass: keep the training clear without making it feel harsh. */
    .ticker-item,
    .hero-agency,
    .hero-badge-text,
    .hero-scroll-text,
    .hero-meta-item,
    .sidebar-brand-sub,
    .guide-tag,
    .sec-tag,
    .dicas-card-kicker,
    .level-label,
    .level-badge,
    .pix-field-label,
    .app-menu-item,
    #contato .sec-tag::before,
    [style*="text-transform: uppercase"] {
      text-transform: none !important;
      letter-spacing: 0.02em !important;
    }

    .ticker-item,
    .hero-badge-text,
    .hero-scroll-text,
    .hero-agency,
    .sidebar-brand-sub,
    .guide-tag,
    .sec-tag,
    #contato .sec-tag::before,
    [style*="font-size: 8px"],
    [style*="font-size: 9px"],
    [style*="font-size: 10px"] {
      font-size: 0.75rem !important;
    }

    .hero,
    .section.bg-dark,
    .final {
      background: var(--g-dd);
    }

    .hero-bg-glow,
    .hero-bg-glow-2,
    .hero-bg-grid {
      opacity: 0.45;
    }

    .hero-badge {
      background: rgba(245, 245, 243, 0.055);
      border-color: rgba(245, 245, 243, 0.1);
    }

    .hero-badge-text,
    .hero-scroll-text,
    .sec-tag-dark,
    #chamadas .guide-tag {
      color: rgba(245, 245, 243, 0.58);
    }

    .ticker-item,
    .hero-meta-item,
    .info-box-dark p,
    .final-sub {
      color: rgba(245, 245, 243, 0.64);
    }

    .pix-field,
    .info-box,
    .alert-box {
      border-left: 1px solid var(--line) !important;
      box-shadow: none !important;
    }

    .pix-field {
      background: rgba(237, 238, 230, 0.56);
      border: 1px solid rgba(107, 124, 78, 0.14) !important;
    }

    .pix-field-label {
      color: var(--g-d);
      font-weight: 600;
    }

    .modal-box {
      background: var(--ink);
    }

    /* Hero readability pass: lighter reading, stronger metadata, shorter mobile fold. */
    .hero {
      min-height: min(94svh, 740px);
    }

    .hero-content {
      padding-top: clamp(92px, 13svh, 118px);
      padding-bottom: clamp(52px, 8svh, 76px);
    }

    .hero-badge {
      background: rgba(245, 245, 243, 0.08);
      border-color: rgba(245, 245, 243, 0.16);
    }

    .hero-badge-text {
      color: rgba(245, 245, 243, 0.72);
      font-weight: 600;
    }

    .hero-title {
      max-width: 9.5ch;
      margin-bottom: 24px;
    }

    .hero-title em {
      color: rgba(163, 177, 138, 0.92);
    }

    .hero-divider {
      background: rgba(163, 177, 138, 0.56);
      margin-bottom: 22px;
    }

    .hero-sub {
      color: rgba(245, 245, 243, 0.68);
      line-height: 1.78;
      max-width: 32rem;
    }

    .hero-actions {
      margin-top: 28px;
    }

    .hero-pills {
      gap: 9px;
      margin-top: 18px;
    }

    .hero-pill-item {
      color: rgba(245, 245, 243, 0.68);
      background: rgba(245, 245, 243, 0.045);
      border-color: rgba(245, 245, 243, 0.11);
      font-weight: 600;
    }

    .hero-pill-dark {
      background: rgba(163, 177, 138, 0.13);
      border-color: rgba(163, 177, 138, 0.2);
      color: rgba(245, 245, 243, 0.76);
    }

    .hero-meta-divider {
      margin: 22px 0 18px;
      background: rgba(245, 245, 243, 0.11);
    }

    .hero-meta-item {
      color: rgba(245, 245, 243, 0.66);
      line-height: 1.55;
      max-width: 34rem;
    }

    @media (max-width: 900px) {
      .hero {
        min-height: min(82svh, 620px);
      }

      .hero-content {
        padding-top: 76px !important;
        padding-bottom: 46px !important;
      }
    }

    @media (max-width: 640px) {
      .hero {
        min-height: auto;
      }

      .hero-content {
        padding-top: 70px !important;
        padding-bottom: 44px !important;
      }

      .hero-badge {
        max-width: 100%;
        margin-bottom: 24px;
        padding: 7px 12px;
      }

      .hero-title {
        max-width: none;
        font-size: clamp(2rem, 8.6vw, 2.35rem);
        line-height: 1.02;
        letter-spacing: -0.04em;
        margin-bottom: 22px;
      }

      .hero-divider {
        width: 32px;
        margin-bottom: 22px;
      }

      .hero-sub {
        font-size: 1rem;
        color: rgba(245, 245, 243, 0.69);
        line-height: 1.7;
      }

      .hero-cta {
        min-height: 52px;
        box-shadow: none;
      }

      .hero-meta-divider {
        margin-top: 20px;
      }

      .hero-meta-item {
        color: rgba(245, 245, 243, 0.64);
      }
    }

    /* Density pass: long training blocks need clearer hierarchy and more breathing room. */
    .section .inner > .guide-head {
      margin-bottom: clamp(18px, 3vw, 24px);
    }

    .sec-title {
      font-size: clamp(2rem, 5vw, 3.5rem);
      line-height: 1.02;
      margin-bottom: clamp(22px, 3vw, 34px);
    }

    .sec-body {
      font-size: 1rem;
      line-height: 1.78;
      color: var(--ink-2);
      max-width: 68ch;
    }

    .sec-body-dark {
      color: rgba(245, 245, 243, 0.7);
    }

    .call-cards {
      gap: clamp(18px, 3vw, 28px);
      margin-top: clamp(28px, 5vw, 44px);
    }

    .call-card {
      padding: clamp(22px, 4vw, 32px);
    }

    .call-name {
      font-size: clamp(1.15rem, 2.6vw, 1.35rem);
      line-height: 1.22;
      margin-bottom: 10px;
    }

    .badge {
      display: inline-flex;
      align-items: center;
      min-height: 28px;
      padding: 5px 12px;
      margin-bottom: 16px;
      font-size: 0.75rem;
      font-weight: 700;
      line-height: 1;
    }

    #chamadas .badge-sim {
      background: rgba(237, 238, 230, 0.18);
      border: 1px solid rgba(237, 238, 230, 0.28);
      color: rgba(245, 245, 243, 0.92);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
    }

    #chamadas .badge-nao {
      background: rgba(251, 243, 241, 0.16);
      border: 1px solid rgba(251, 243, 241, 0.22);
      color: rgba(245, 245, 243, 0.82);
    }

    .call-desc {
      font-size: 1rem;
      line-height: 1.78;
    }

    .call-desc-dark {
      color: rgba(245, 245, 243, 0.68);
    }

    .call-desc-dark strong {
      color: rgba(245, 245, 243, 0.95) !important;
      font-weight: 700;
    }

    #chamadas .call-card {
      border-color: rgba(245, 245, 243, 0.14) !important;
    }

    #chamadas .call-mockup {
      margin-top: 22px;
    }

    @media (max-width: 900px) {
      .sec-title {
        font-size: clamp(1.85rem, 8vw, 2.6rem);
        line-height: 1.06;
      }

      .call-cards {
        gap: 16px;
      }
    }

    /* CTA consistency pass: match the site-wide primary button shape. */
    .hero-cta,
    .wa-btn,
    .chat-wa-link {
      min-height: 48px;
      border-radius: var(--radius) !important;
      font-family: var(--font-sans);
      font-size: 14px;
      font-weight: 600;
      letter-spacing: -0.01em;
      text-decoration: none;
      transition:
        background-color 0.28s var(--ease-out-quint),
        border-color 0.28s var(--ease-out-quint),
        box-shadow 0.28s var(--ease-out-quint),
        color 0.28s var(--ease-out-quint),
        transform 0.28s var(--ease-out-quint);
    }

    .hero-cta,
    .wa-btn {
      background: var(--g);
      color: var(--white);
      border: 1px solid transparent;
      box-shadow: 0 16px 34px rgba(58, 69, 40, 0.18);
    }

    .hero-cta:hover,
    .wa-btn:hover {
      background: var(--g-d);
      color: var(--white);
      transform: translateY(-2px);
      box-shadow: 0 18px 40px rgba(58, 69, 40, 0.2);
    }

    .hero-cta:active,
    .wa-btn:active,
    .chat-wa-link:active {
      transform: translateY(0) scale(0.98);
    }

    .hero-cta svg,
    .wa-btn svg {
      transition: transform 0.28s var(--ease-out-quint);
    }

    .hero-cta:hover svg,
    .wa-btn:hover svg {
      transform: translateX(2px);
    }

    .chat-wa-link {
      background: var(--g);
      box-shadow: 0 10px 24px rgba(58, 69, 40, 0.16);
    }

    /* Chat consistency pass: match the calmer component used on dicas.html. */
    .chat-toggle {
      bottom: 24px;
      right: 24px;
      width: 52px;
      height: 52px;
      background: var(--white);
      color: var(--g-dd);
      border: 1px solid var(--line-2);
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.09);
      opacity: 1;
      pointer-events: auto;
      transform: none;
      transition:
        transform 0.22s var(--ease-out-quint),
        background-color 0.22s var(--ease-out-quint);
    }

    .chat-toggle.visible {
      transform: none;
    }

    .chat-toggle:hover {
      background: var(--g-l);
      transform: translateY(-1px);
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.09);
    }

    .chat-box {
      bottom: 96px;
      right: 24px;
      width: 360px;
      min-width: 0;
      max-height: 520px;
      background: var(--bg);
      border: 1px solid var(--line-2);
      border-radius: 14px;
      box-shadow: 0 10px 32px rgba(0, 0, 0, 0.13);
      display: none;
      opacity: 1;
      pointer-events: auto;
      transform: none;
    }

    .chat-box.open {
      display: flex;
      transform: none;
    }

    .chat-header {
      background: var(--g-l);
      color: var(--g-dd);
      padding: 14px 18px;
      font-size: 14px;
      border-radius: 14px 14px 0 0;
    }

    .chat-header button {
      width: 44px;
      height: 44px;
      background: rgba(107, 124, 78, 0.1);
      color: var(--g-dd);
    }

    .chat-msg {
      font-size: 14px;
      line-height: 1.6;
      overflow-wrap: anywhere;
    }

    .chat-msg.bot {
      border: 1px solid var(--line);
    }

    .chat-options {
      background: var(--g-l);
      border-top: 1px solid var(--line);
      box-shadow: none;
    }

    .chat-opt {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 40px;
      background: transparent;
      border: 1px solid rgba(107, 124, 78, 0.18);
      color: var(--g-dd);
      font-weight: 500;
      transform: none;
    }

    .chat-opt:hover {
      background: rgba(107, 124, 78, 0.12);
      color: var(--g-dd);
      border-color: rgba(107, 124, 78, 0.24);
    }

    .chat-opt:active {
      transform: scale(0.98);
    }

    @media (max-width: 900px) {
      .chat-box {
        width: calc(100vw - 32px);
        right: 16px;
        bottom: 92px;
        max-height: 70dvh;
      }

      .chat-messages {
        max-height: min(32dvh, 220px);
      }

      .chat-toggle {
        bottom: 20px;
        right: 16px;
        width: 54px;
        height: 54px;
        font-size: 24px;
      }

      .chat-opt {
        width: 100%;
        justify-content: center;
        white-space: normal;
        min-height: 44px;
      }
    }

    @media (max-width: 420px) {
      .chat-box {
        width: calc(100vw - 16px);
        right: 8px;
        bottom: 86px;
        max-height: 72dvh;
      }

      .chat-options {
        padding: 12px;
      }

      .chat-toggle {
        right: 12px;
      }
    }

    /* Back-to-top consistency pass: match dicas.html. */
    .back-to-top {
      bottom: 24px;
      left: 24px;
      width: 44px;
      height: 44px;
      background: var(--white);
      border: 1px solid var(--line-2);
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
      color: var(--ink-2);
      transform: none;
      transition:
        opacity 0.3s var(--ease-out-quart),
        background-color 0.2s var(--ease-out-quart),
        border-color 0.2s var(--ease-out-quart),
        color 0.2s var(--ease-out-quart);
    }

    .back-to-top.visible {
      transform: none;
    }

    .back-to-top:hover {
      background: var(--bg);
      color: var(--g-d);
      border-color: var(--g);
      transform: none;
    }

    .back-to-top:active {
      transform: scale(0.98);
    }

    @media (max-width: 900px) {
      .back-to-top {
        bottom: 20px;
        left: 16px;
        width: 44px;
        height: 44px;
      }
    }

    @media (max-width: 420px) {
      .back-to-top {
        left: 12px;
      }
    }

    /* Final mobile hero layout lock: keep the first screen intentional after all overrides. */
    @media (max-width: 640px) {
      .top-nav-label {
        display: none !important;
      }

      .top-nav-actions {
        gap: 0 !important;
      }

      .hero {
        min-height: auto !important;
      }

      .hero-content {
        max-width: none !important;
        padding: 104px var(--page-x) 44px !important;
      }

      .hero-badge {
        max-width: 100%;
        margin-bottom: 24px !important;
        padding: 7px 12px;
      }

      .hero-title {
        max-width: none !important;
        margin-bottom: 22px !important;
        font-size: clamp(2rem, 8.6vw, 2.35rem) !important;
        line-height: 1.02 !important;
        letter-spacing: -0.04em;
      }

      .hero-title em {
        display: block;
        margin-top: 4px;
      }

      .hero-divider {
        width: 32px !important;
        margin-bottom: 22px !important;
      }

      .hero-sub {
        max-width: 32rem;
        margin-bottom: 24px !important;
        font-size: 1rem !important;
        line-height: 1.68 !important;
        color: rgba(245, 245, 243, 0.72) !important;
      }

      .hero-cta {
        min-height: 52px !important;
        box-shadow: none !important;
      }

      .hero-pills {
        gap: 10px !important;
        margin-top: 18px !important;
      }

      .hero-meta-divider {
        margin: 20px 0 18px !important;
      }
    }

    /* Final mobile-first training pass: dense guide content should read comfortably on phones. */
    @media (max-width: 640px) {
      :root {
        --page-x: 20px;
        --section-y: 48px;
      }

      .top-nav {
        min-height: 58px;
        padding: 10px 18px;
      }

      .hero-content {
        padding: 104px var(--page-x) 42px !important;
      }

      .hero-title {
        font-size: clamp(2.25rem, 10vw, 2.85rem) !important;
        line-height: 1.04 !important;
      }

      .hero-sub,
      .sec-body,
      .call-desc,
      .info-box,
      .alert-box,
      .check-list li,
      .step-text {
        font-size: 1rem;
        line-height: 1.72;
      }

      .section,
      .section.bg-white,
      .section.bg-dark {
        padding: 48px var(--page-x);
      }

      .sec-title {
        font-size: clamp(2rem, 8.5vw, 2.6rem);
        line-height: 1.08;
        letter-spacing: -0.03em;
      }

      .cards-grid,
      .call-cards,
      .func-grid,
      .punish-grid {
        grid-template-columns: 1fr;
        gap: 14px;
      }

      .call-card,
      .card,
      .info-box,
      .alert-box,
      .punish-item,
      .func-item,
      .app-popup {
        padding: 18px;
        border-radius: var(--radius);
      }

      .punish-desc {
        padding-left: 0;
      }

      .hero-cta,
      .wa-btn,
      .chat-wa-link {
        width: 100%;
        min-height: 50px !important;
        justify-content: center;
      }

      .chat-box {
        width: calc(100vw - 24px);
        right: 12px;
        bottom: 84px;
        max-height: min(72dvh, 520px);
      }
    }

    /* Compact page CTAs on phones: keep CTAs touch-friendly without making them bars. */
    @media (max-width: 640px) {
      .hero-cta,
      .wa-btn,
      .chat-wa-link {
        width: auto;
        min-width: min(100%, 214px);
        max-width: min(100%, 284px);
        padding-inline: 24px;
        justify-content: center;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      html {
        scroll-behavior: auto;
      }

      *,
      *::before,
      *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
      }

      .fade-up,
      .stagger > *,
      .hero-badge,
      .hero-title,
      .hero-divider,
      .hero-sub,
      .hero-actions,
      .hero-pills,
      .hero-scroll,
      .hero-stats,
      .sidebar .nav-link,
      .modal-box,
      .chat-box {
        opacity: 1 !important;
        transform: none !important;
      }
    }
