 /* ============================================================
   TOKENS DA MARCA — paleta inteira controlada aqui
   ============================================================ */
 :root {
     --green: #6BE957;
     /* verde real da logo */
     --green-hi: #9DFF85;
     /* highlight / glow   */
     --green-deep: #4EAC3E;
     /* dobra / sombra     */
     --green-dark: #2E7F26;
     /* profundidade       */
     --bg: #000000;
     --surface: #0A0A0A;
     --txt: #FFFFFF;
     --txt-2: #B3B3B3;
 }

 html {
     background: var(--bg);
 }

 body {
     background: var(--bg);
     color: var(--txt);
     font-family: 'Inter', system-ui, sans-serif;
     overflow-x: hidden;
     -webkit-font-smoothing: antialiased;
 }

 html.lenis,
 html.lenis body {
     height: auto;
 }

 .lenis.lenis-smooth {
     scroll-behavior: auto !important;
 }

 ::selection {
     background: var(--green);
     color: #000;
 }

 ::-webkit-scrollbar {
     width: 10px;
 }

 ::-webkit-scrollbar-track {
     background: #000;
 }

 ::-webkit-scrollbar-thumb {
     background: #1c1c1c;
     border-radius: 6px;
 }

 ::-webkit-scrollbar-thumb:hover {
     background: var(--green-deep);
 }

 h1,
 h2,
 h3,
 .display {
     font-family: 'Gabarito', system-ui, sans-serif;
 }

 /* Partes da logo animáveis a partir do próprio centro */
 .logo-svg .part {
     transform-box: fill-box;
     transform-origin: center;
 }

 .text-glow {
     text-shadow: 0 0 32px rgba(107, 233, 87, .45);
 }

 /* Navbar glass — mais leve que a v1 */
 .glass {
     background: rgba(0, 0, 0, .38);
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     border-bottom: 1px solid rgba(107, 233, 87, .06);
 }

 .nav-link {
     position: relative;
     color: var(--txt-2);
     transition: color .25s;
 }

 .nav-link::after {
     content: '';
     position: absolute;
     left: 0;
     bottom: -6px;
     height: 1.5px;
     width: 100%;
     background: var(--green);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform .35s cubic-bezier(.22, 1, .36, 1);
 }

 .nav-link:hover {
     color: #fff;
 }

 .nav-link:hover::after {
     transform: scaleX(1);
 }

 .btn-primary {
     background: var(--green);
     color: #000;
     font-weight: 700;
     transition: box-shadow .35s, transform .35s;
 }

 .btn-primary:hover {
     box-shadow: 0 0 30px -4px var(--green), 0 0 80px -20px var(--green);
     transform: translateY(-2px);
 }

 .btn-ghost {
     border: 1px solid rgba(255, 255, 255, .18);
     color: #fff;
     transition: border-color .3s, background .3s, transform .35s;
 }

 .btn-ghost:hover {
     border-color: var(--green);
     background: rgba(107, 233, 87, .06);
     transform: translateY(-2px);
 }

 .eyebrow {
     font-family: 'Gabarito';
     font-weight: 600;
     letter-spacing: .34em;
     font-size: .7rem;
     text-transform: uppercase;
     color: var(--green);
 }

 /* Cards dos Braços */
 .arm-card {
     border: 1px solid rgba(107, 233, 87, .14);
     background: linear-gradient(165deg, rgba(107, 233, 87, .045), rgba(0, 0, 0, 0) 50%), var(--surface);
     transition: border-color .35s, box-shadow .45s;
     will-change: transform;
     max-width: 380px;
     width: 100%;
 }

 .arm-card:hover {
     border-color: rgba(107, 233, 87, .45);
     box-shadow: 0 14px 50px -22px rgba(107, 233, 87, .45);
 }

 .arm-link {
     color: var(--green);
     font-size: .8rem;
     font-weight: 600;
     letter-spacing: .06em;
     display: inline-flex;
     align-items: center;
     gap: .45rem;
 }

 .arm-link svg {
     transition: transform .3s;
 }

 .arm-card:hover .arm-link svg {
     transform: translate(3px, -3px);
 }

 /* Cards de depoimento — tilt 3D */
 .tilt-card {
     border: 1px solid rgba(255, 255, 255, .08);
     background: var(--surface);
     transform-style: preserve-3d;
     will-change: transform;
     transition: border-color .4s, box-shadow .4s;
 }

 .tilt-card:hover {
     border-color: rgba(107, 233, 87, .4);
     box-shadow: 0 0 40px -16px rgba(107, 233, 87, .35);
 }

 /* Controles do playground */
 .play-btn {
     border: 1px solid rgba(255, 255, 255, .12);
     color: #fff;
     font-family: 'Gabarito';
     font-weight: 600;
     letter-spacing: .05em;
     transition: all .3s;
 }

 .play-btn:hover {
     border-color: var(--green);
     color: var(--green);
 }

 .play-btn.active {
     background: var(--green);
     color: #000;
     border-color: var(--green);
     box-shadow: 0 0 24px -6px var(--green);
 }

 input[type=range] {
     -webkit-appearance: none;
     appearance: none;
     width: 100%;
     height: 3px;
     background: #1d1d1d;
     border-radius: 2px;
     outline: none;
 }

 input[type=range]::-webkit-slider-thumb {
     -webkit-appearance: none;
     width: 18px;
     height: 18px;
     border-radius: 50%;
     background: var(--green);
     cursor: pointer;
     box-shadow: 0 0 16px rgba(107, 233, 87, .7);
     transition: transform .2s;
 }

 input[type=range]::-webkit-slider-thumb:hover {
     transform: scale(1.25);
 }

 input[type=range]::-moz-range-thumb {
     width: 18px;
     height: 18px;
     border-radius: 50%;
     border: none;
     background: var(--green);
     cursor: pointer;
     box-shadow: 0 0 16px rgba(107, 233, 87, .7);
 }

 /* Formulário */
 .field {
     background: transparent;
     border: 0;
     border-bottom: 1px solid rgba(255, 255, 255, .15);
     padding: .9rem .1rem;
     width: 100%;
     color: #fff;
     outline: none;
     transition: border-color .3s;
 }

 .field:focus {
     border-color: var(--green);
 }

 .field::placeholder {
     color: #5d5d5d;
 }

 select.field {
     appearance: none;
     cursor: pointer;
 }

 select.field option {
     background: #0A0A0A;
     color: #fff;
 }

 .field-label {
     display: block;
     font-size: .72rem;
     letter-spacing: .18em;
     text-transform: uppercase;
     color: #777;
     margin-bottom: .15rem;
 }

 a:focus-visible,
 button:focus-visible,
 input:focus-visible,
 textarea:focus-visible,
 select:focus-visible {
     outline: 2px solid var(--green);
     outline-offset: 3px;
     border-radius: 4px;
 }

 /* Moldura dos sócios */
 .partner-frame {
     border: 1px solid rgba(107, 233, 87, .25);
     background: var(--surface);
     transition: border-color .4s, box-shadow .5s;
 }

 .partner-frame:hover {
     border-color: rgba(107, 233, 87, .6);
     box-shadow: 0 0 60px -20px rgba(107, 233, 87, .5);
 }

 .burger span {
     display: block;
     width: 26px;
     height: 2px;
     background: #fff;
     margin: 5px 0;
     transition: .3s;
 }

 @media (prefers-reduced-motion: reduce) {
     * {
         animation: none !important;
         transition: none !important;
     }
 }