/* NEXXOR — design system compartilhado (extraído de index.html para cache entre páginas) */
:root{
  --navy:#091D39;
  --navy-2:#0D2748;
  --navy-3:#061325;
  --cyan:#20C4D7;
  --cyan-2:#5BE3EF;
  --cyan-deep:#0E8F9D;
  --graphite:#111827;
  --ice:#F5F8FC;
  --steel:#8799AA;
  --green:#28C58C;
  --gold:#D8A23B;
  --maxw:1180px;
  --serif:-apple-system,BlinkMacSystemFont,'Inter',"Segoe UI",sans-serif;
  --sans:-apple-system,BlinkMacSystemFont,'Inter',"Segoe UI",sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.22,.68,0,1);
  --ease-bounce:cubic-bezier(.34,1.56,.64,1);
  --shadow-sm:0 2px 10px rgba(9,29,57,.06);
  --shadow-md:0 16px 40px rgba(9,29,57,.12);
  --shadow-lg:0 30px 70px rgba(5,16,32,.4);
  --shadow-glow:0 10px 32px rgba(32,196,215,.28);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:2px;}
::selection{background:var(--cyan);color:var(--navy);}
body{
  font-family:var(--sans);
  background:linear-gradient(180deg,#0b2341 0%,var(--navy) 14%,var(--navy) 60%,var(--navy-3) 100%);
  color:#fff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  position:relative;
}
/* subtle film-grain texture for depth across the whole site, dark & light sections alike.
   `position:absolute` (spanning the full document height via `inset:0` on this positioned
   body) instead of `position:fixed` — iOS Safari has a well-known compositor bug where a
   `position:fixed` + `mix-blend-mode` layer gets smeared into a wide, wrong-colored band
   across whatever is on screen during active scrolling/dragging (fixes a report of a thick
   orange/gold streak cutting across the stats + photo-banner section while dragging on an
   iPhone). Visually identical in every browser — same opacity, blend mode and coverage. */
body::before{
  content:"";position:absolute;inset:0;z-index:9999;pointer-events:none;
  opacity:.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
/* ambient glow layer, fixed to the viewport so the whole site keeps breathing
   color behind every section instead of a flat dark slab */
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(460px 460px at var(--spot-x,50%) var(--spot-y,50%), rgba(32,196,215,.16), transparent 72%),
    radial-gradient(720px 580px at 10% 12%, rgba(32,196,215,.19), transparent 60%),
    radial-gradient(620px 500px at 92% 8%, rgba(216,162,59,.15), transparent 58%),
    radial-gradient(800px 620px at 85% 92%, rgba(91,227,239,.16), transparent 60%),
    radial-gradient(620px 520px at 6% 94%, rgba(216,162,59,.12), transparent 58%),
    radial-gradient(540px 540px at 50% 50%, rgba(14,143,157,.08), transparent 65%);
  filter:saturate(125%);
  animation:ambientBreathe 14s ease-in-out infinite;
  will-change:transform,opacity;
}
@keyframes ambientBreathe{0%,100%{opacity:.85;transform:scale(1);}50%{opacity:1;transform:scale(1.06);}}
@media (prefers-reduced-motion:reduce){body::after{animation:none;}}
::-webkit-scrollbar{width:11px;}
::-webkit-scrollbar-track{background:var(--navy);}
::-webkit-scrollbar-thumb{background:#1c3a5e;border-radius:10px;border:2px solid var(--navy);}
::-webkit-scrollbar-thumb:hover{background:var(--cyan-deep);}
img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;position:relative;z-index:1;}
.sr-only{position:absolute;left:-9999px;}

/* ---------- typography helpers ---------- */
h1,h2,h3{font-weight:800;letter-spacing:-0.03em;line-height:1.05;}
h1,h2{font-family:var(--serif);font-weight:700;letter-spacing:-0.02em;}
.eyebrow{
  font-size:12.5px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--cyan);margin-bottom:16px;display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:currentColor;opacity:.6;}
.lead{font-size:19px;line-height:1.65;color:var(--steel);font-weight:400;}
.section{padding:128px 0;position:relative;overflow:hidden;}
@media (max-width:768px){.section{padding:76px 0;}}
.section.light{background:var(--ice);color:var(--graphite);position:relative;}
.section.light .lead{color:#4b5a6b;}
.section.light .eyebrow{color:#0e8f9d;}

/* every section gets its own soft glow + a couple of floating dots, alternating
   cyan/gold left-to-right so the page never reads as one flat slab of color */
.section::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(165deg, rgba(32,196,215,.10) 0%, transparent 35%, transparent 65%, rgba(216,162,59,.08) 100%),
    radial-gradient(620px 420px at 88% 0%, rgba(32,196,215,.14), transparent 62%),
    radial-gradient(520px 400px at 2% 100%, rgba(216,162,59,.10), transparent 62%);
}
.section:nth-of-type(even)::before{
  background:
    linear-gradient(195deg, rgba(216,162,59,.09) 0%, transparent 35%, transparent 65%, rgba(32,196,215,.09) 100%),
    radial-gradient(620px 420px at 6% 4%, rgba(216,162,59,.12), transparent 62%),
    radial-gradient(540px 420px at 96% 96%, rgba(32,196,215,.13), transparent 62%);
}
/* light sections get their own richer, pastel-tuned wash instead of just a
   dimmed copy of the dark-section glow — plus a faint dot-grid texture so the
   "digital ecosystem" language from the hero carries through the whole site */
.section.light::before{
  opacity:1;
  background:
    linear-gradient(165deg, rgba(32,196,215,.07) 0%, transparent 35%, transparent 65%, rgba(216,162,59,.06) 100%),
    radial-gradient(640px 440px at 90% -4%, rgba(32,196,215,.16), transparent 60%),
    radial-gradient(560px 420px at -4% 8%, rgba(216,162,59,.13), transparent 58%),
    radial-gradient(680px 520px at 50% 108%, rgba(91,227,239,.14), transparent 62%),
    radial-gradient(520px 420px at 102% 96%, rgba(216,162,59,.10), transparent 58%);
}
.section.light:nth-of-type(even)::before{
  background:
    linear-gradient(195deg, rgba(216,162,59,.07) 0%, transparent 35%, transparent 65%, rgba(32,196,215,.07) 100%),
    radial-gradient(640px 440px at -4% -4%, rgba(216,162,59,.15), transparent 60%),
    radial-gradient(560px 420px at 104% 10%, rgba(32,196,215,.15), transparent 58%),
    radial-gradient(680px 520px at 50% 108%, rgba(91,227,239,.13), transparent 62%);
}
.section::after{
  content:"";position:absolute;z-index:0;pointer-events:none;border-radius:50%;
  width:10px;height:10px;background:radial-gradient(circle,rgba(32,196,215,.9),transparent 70%);
  top:18%;right:9%;box-shadow:
    -140px 60px 0 -2px rgba(216,162,59,.6),
    60px 220px 0 -3px rgba(32,196,215,.55),
    -220px 300px 0 -4px rgba(216,162,59,.4);
  animation:dotFloat 9s ease-in-out infinite;
}
/* light sections swap the floating dots for a faint dot-grid texture instead —
   keeps the "digital ecosystem" language from the hero without cluttering a
   white background with extra moving accents */
.section.light::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  width:auto;height:auto;border-radius:0;box-shadow:none;background:
    radial-gradient(rgba(9,29,57,.09) 1px,transparent 1px);
  background-size:26px 26px;
  mask-image:radial-gradient(ellipse 70% 60% at 50% 20%,#000 0%,transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 20%,#000 0%,transparent 75%);
  animation:none;
}
@keyframes dotFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-18px);}}
@media (max-width:860px){.section::after{display:none;}}
@media (prefers-reduced-motion:reduce){.section::after{animation:none;}}

/* ---------- shooting stars (white/light sections) ---------- *
   small blue comet streaks drifting across .section.light blocks — injected
   as .star-shoot spans by main.js, ONLY inside the blank side margins
   (outside the centered .wrap), so they never cross behind the readable
   text column. Each travels further toward its own edge (via --sdx/--sdy,
   set per star in JS) rather than drifting inward. .star-left is added for
   stars on the left margin so the tail flips to trail correctly. */
.star-shoot{
  position:absolute;z-index:0;pointer-events:none;
  width:4px;height:4px;border-radius:50%;background:#dff6f9;
  box-shadow:
    0 0 0 5px rgba(32,196,215,.22),
    0 0 0 11px rgba(32,196,215,.12),
    0 0 22px 2px rgba(14,143,157,.95);
  opacity:0;
  animation:starShoot var(--sdur,4.5s) ease-in infinite;
  animation-delay:var(--sdelay,0s);
  will-change:transform,opacity;
}
.star-shoot::before{
  content:"";position:absolute;top:calc(50% - 1px);right:0;height:2.5px;width:120px;
  background:linear-gradient(-45deg, rgba(14,143,157,.95), transparent);
  border-radius:100%;
  transform-origin:right center;transform:scaleX(0);
  animation:starTail var(--sdur,4.5s) ease-in infinite;
  animation-delay:var(--sdelay,0s);
  will-change:transform,opacity;
}
.star-shoot.star-left::before{
  right:auto;left:0;
  background:linear-gradient(135deg, rgba(14,143,157,.95), transparent);
  transform-origin:left center;
}
@keyframes starShoot{
  0%{transform:translate(0,0);opacity:0;}
  8%{opacity:1;}
  55%{opacity:1;}
  100%{transform:translate(var(--sdx,220px),var(--sdy,140px));opacity:0;}
}
/* tail length is animated with transform:scaleX (compositor-only) instead of the
   `width` property — animating width forces a layout recalc every frame, and with
   several of these running per section at once that was a real source of jank */
@keyframes starTail{
  0%{transform:scaleX(0);opacity:0;}
  10%{opacity:1;}
  32%{transform:scaleX(1);}
  100%{transform:scaleX(0);opacity:0;}
}
@media (max-width:860px){.star-shoot{display:none;}}
@media (prefers-reduced-motion:reduce){.star-shoot{display:none;}}

/* ---------- reveal animation ---------- */
.reveal{opacity:0;transform:translateY(28px) scale(.97);transition:opacity .7s var(--ease), transform .7s var(--ease-bounce);}
.reveal.in{opacity:1;transform:translateY(0) scale(1);}

/* ---------- header ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(9,29,57,0.6);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid transparent;
  transition:border-color .35s var(--ease), background .35s var(--ease), box-shadow .35s var(--ease);
}
header::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(32,196,215,.5),transparent);
  opacity:0;transition:opacity .35s ease;
}
header.scrolled{background:rgba(9,29,57,0.86);border-bottom-color:rgba(255,255,255,0.08);box-shadow:0 10px 30px rgba(3,10,20,.3);}
header.scrolled::before{opacity:1;}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px;}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;letter-spacing:-0.01em;transition:opacity .2s;}
.brand:hover{opacity:.82;}
.brand .xx{width:34px;transition:transform .6s var(--ease-bounce);}
.brand:hover .xx{transform:rotate(90deg) scale(1.12);}
/* brand lockup: NEXXOR with GROUP as a small subordinate line underneath,
   per Brand Book signature — never redesigning the XX glyph itself */
.brand-word{display:flex;flex-direction:column;line-height:1;gap:3px;}
.brand-group{font-size:9px;font-weight:700;letter-spacing:.28em;color:var(--cyan);opacity:.85;}
.footer-brand .brand-word{align-items:flex-start;}
.footer-brand .brand-group{color:var(--cyan);}
.navlinks{display:flex;align-items:center;gap:20px;font-size:13.5px;font-weight:500;white-space:nowrap;flex-shrink:0;}
.hdr-cta .cta-btn{padding:9px 16px;font-size:12.5px;white-space:nowrap;}
.navlinks a{opacity:.82;transition:opacity .2s,color .2s;position:relative;}
.navlinks a:hover{opacity:1;color:var(--cyan);}
.navlinks a.active-link{opacity:1;color:var(--cyan);}
.navlinks a.active-link::after{
  content:"";position:absolute;left:0;right:0;bottom:-24px;height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--cyan-2));
  border-radius:2px;box-shadow:0 0 10px rgba(32,196,215,.6);
}
.navdd{position:relative;}
.navdd-panel{
  position:absolute;top:40px;left:50%;transform:translate(-50%,8px);
  background:linear-gradient(165deg,#0f2d52,#0a1f3c);border:1px solid rgba(255,255,255,0.1);
  border-radius:14px;padding:10px;min-width:224px;
  opacity:0;visibility:hidden;
  transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;
  box-shadow:var(--shadow-lg);
}
.navdd:hover .navdd-panel{opacity:1;visibility:visible;transform:translate(-50%,0);}
.navdd-panel a{display:block;padding:10px 13px;border-radius:9px;font-size:13.5px;transition:background .2s,color .2s,padding-left .2s;}
.navdd-panel a:hover{background:rgba(32,196,215,0.12);color:var(--cyan);padding-left:16px;}
.navdd-panel a.current{color:var(--cyan);background:rgba(32,196,215,0.08);}
.cta-btn{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--cyan-2),var(--cyan) 60%,var(--cyan-deep));
  color:var(--navy);font-weight:700;font-size:13.5px;
  padding:10px 20px;border-radius:999px;transition:transform .45s var(--ease-bounce), box-shadow .3s var(--ease);
  display:inline-block;box-shadow:0 4px 14px rgba(32,196,215,.25);
}
.cta-btn::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(90px circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.45), transparent 70%);
  opacity:0;transition:opacity .3s;
}
.cta-btn:hover::before{opacity:1;}
.cta-btn::after{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.55) 40%,transparent 60%);
  transform:translateX(-120%);transition:transform .6s var(--ease);
}
.cta-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow);}
.cta-btn:hover::after{transform:translateX(120%);}
.cta-btn:active{transform:translateY(0) scale(.97);}
.cta-ghost{
  position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,0.25);font-weight:600;font-size:13.5px;
  padding:10px 20px;border-radius:999px;transition:border-color .25s,background .25s,transform .45s var(--ease-bounce);display:inline-block;
  backdrop-filter:blur(6px);
}
.cta-ghost::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(90px circle at var(--mx,50%) var(--my,50%), rgba(32,196,215,.3), transparent 70%);
  opacity:0;transition:opacity .3s;
}
.cta-ghost:hover::before{opacity:1;}
.cta-ghost:hover{border-color:var(--cyan);background:rgba(32,196,215,.1);transform:translateY(-2px);}
.cta-ghost:active{transform:translateY(0) scale(.97);}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:22px;cursor:pointer;}
@media (max-width:860px){
  .navlinks{display:none;}
  .menu-toggle{display:block;}
  .hdr-cta{display:none;}
}
.mobile-panel{
  display:none;flex-direction:column;gap:4px;padding:10px 24px 20px;
  background:rgba(9,29,57,0.98);border-top:1px solid rgba(255,255,255,.08);
}
.mobile-panel.open{display:flex;}
.mobile-panel a{padding:12px 4px;font-size:15px;border-bottom:1px solid rgba(255,255,255,.06);}

/* ---------- hero ---------- */
.hero{
  min-height:100vh;display:flex;flex-direction:column;justify-content:center;
  padding-top:140px;padding-bottom:80px;position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse 1100px 620px at 82% -8%, rgba(32,196,215,0.32), transparent 58%),
    radial-gradient(ellipse 1300px 900px at -5% 105%, rgba(91,227,239,0.22), transparent 65%),
    radial-gradient(ellipse 960px 740px at 50% 40%, rgba(14,143,157,.26), transparent 70%),
    radial-gradient(ellipse 680px 480px at 96% 96%, rgba(216,162,59,.16), transparent 60%),
    radial-gradient(ellipse 900px 900px at 0% 45%, rgba(32,196,215,.20), transparent 68%),
    linear-gradient(100deg, rgba(20,80,130,.22) 0%, transparent 45%),
    linear-gradient(175deg,#0d2a52 0%,var(--navy) 42%,var(--navy-3) 100%);
}
/* big, saturated, slow-drifting aurora blobs with a living hue shift — the
   main upgrade that makes the hero read as an actual "mesh gradient" wall of
   color instead of a flat navy slab with a couple of decorations */
.hero-aurora{
  position:absolute;inset:-35% -160px -25% -160px;z-index:0;pointer-events:none;opacity:1;
  background:
    radial-gradient(38% 38% at 20% 26%, rgba(32,196,215,.50), transparent 70%),
    radial-gradient(34% 34% at 84% 14%, rgba(216,162,59,.34), transparent 70%),
    radial-gradient(42% 42% at 66% 80%, rgba(91,227,239,.34), transparent 70%),
    radial-gradient(30% 30% at 8% 88%, rgba(14,143,157,.38), transparent 70%),
    radial-gradient(26% 26% at 48% 46%, rgba(216,162,59,.14), transparent 72%);
  filter:blur(80px) saturate(135%);
  animation:auroraDrift 22s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes auroraDrift{
  0%{transform:translate(0,0) scale(1);}
  50%{transform:translate(-3%,2.5%) scale(1.1);}
  100%{transform:translate(2.5%,-2.5%) scale(1.03);}
}
@media (prefers-reduced-motion:reduce){.hero-aurora{animation:none;}}
/* soft halo blooming behind the XX glyphs + headline so they still pop
   now that the aurora behind them is much richer — filter stays static
   (just blur) and only opacity is animated, since animating `filter` itself
   forces a full repaint of this huge blurred area every frame */
.hero .wrap::before{
  content:"";position:absolute;top:-160px;left:-620px;width:1500px;max-width:190vw;height:700px;
  background:radial-gradient(ellipse at 55% 35%, rgba(145,236,244,.4), transparent 55%);
  filter:blur(110px);pointer-events:none;z-index:-1;
  animation:glowPulse 6s ease-in-out infinite;
}
@keyframes glowPulse{0%,100%{opacity:.78;}50%{opacity:1;}}
@media (prefers-reduced-motion:reduce){.hero .wrap::before{animation:none;}}
/* perspective "digital floor" grid converging toward a glowing horizon line —
   gives the hero real depth instead of a flat tiled grid */
.hero-floor{
  position:absolute;left:0;right:0;bottom:0;height:18%;z-index:0;pointer-events:none;
  overflow:hidden;perspective:500px;perspective-origin:50% 100%;
}
.hero-floor::before{
  content:"";position:absolute;left:-30%;right:-30%;bottom:-20%;height:170%;
  background-image:
    linear-gradient(rgba(91,227,239,.28) 1px,transparent 1px),
    linear-gradient(90deg,rgba(91,227,239,.28) 1px,transparent 1px);
  background-size:64px 64px;
  transform:rotateX(80deg);transform-origin:bottom;
  mask-image:linear-gradient(180deg,transparent 0%, #000 35%, #000 72%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg,transparent 0%, #000 35%, #000 72%, transparent 100%);
}
.hero-floor::after{
  content:"";position:absolute;left:14%;right:14%;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(145,236,244,.85),transparent);
  box-shadow:0 0 30px 6px rgba(32,196,215,.5);
}
/* scattered twinkling dots, reusing the sitewide dotFloat keyframe so it
   feels consistent with the rest of the page, not a new effect */
.hero-dots{
  position:absolute;z-index:0;pointer-events:none;width:3px;height:3px;border-radius:50%;
  top:24%;left:14%;background:#fff;opacity:.55;
  box-shadow:
    120px 60px 0 -0.5px rgba(255,255,255,.55),
    260px 210px 0 -0.5px rgba(32,196,215,.8),
    60px 340px 0 -0.5px rgba(255,255,255,.4),
    420px 40px 0 -0.5px rgba(216,162,59,.65),
    560px 260px 0 -0.5px rgba(255,255,255,.5),
    720px 140px 0 -0.5px rgba(91,227,239,.7),
    840px 360px 0 -0.5px rgba(255,255,255,.4),
    980px 90px 0 -0.5px rgba(32,196,215,.55),
    180px 460px 0 -0.5px rgba(216,162,59,.4);
  animation:dotFloat 11s ease-in-out infinite;
}
@media (max-width:860px){.hero-dots{display:none;}}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.4;z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 85% 65% at 50% 15%,#000 0%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 85% 65% at 50% 15%,#000 0%,transparent 78%);
}
.hero::after{
  content:"";position:absolute;inset:auto 0 0 0;height:45%;pointer-events:none;z-index:0;
  background:linear-gradient(0deg, var(--navy) 0%, transparent 100%);
}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.85;pointer-events:none;}
.hero-rings{display:none;}
.hring{
  position:absolute;right:-14%;top:50%;transform:translateY(-50%);border-radius:50%;
  border:1px solid rgba(32,196,215,.16);
}
.hring.r1{width:560px;height:560px;animation:ringSpin 90s linear infinite;}
.hring.r1::after{
  content:"";position:absolute;top:-3px;left:50%;transform:translateX(-50%);
  width:7px;height:7px;border-radius:50%;background:var(--cyan-2);
  box-shadow:0 0 16px 5px rgba(91,227,239,.75);
}
.hring.r2{width:760px;height:760px;border-color:rgba(32,196,215,.1);animation:ringSpin 130s linear infinite reverse;}
.hring.r2::after{
  content:"";position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);
  width:5px;height:5px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 12px 4px rgba(216,162,59,.65);
}
.hring.r3{width:960px;height:960px;border-color:rgba(32,196,215,.06);border-style:dashed;animation:ringSpin 200s linear infinite;}
.hring.r4{width:380px;height:380px;border-color:rgba(91,227,239,.22);animation:ringSpin 60s linear infinite reverse;}
@keyframes ringSpin{from{transform:translateY(-50%) rotate(0deg);}to{transform:translateY(-50%) rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.hring{animation:none;}}
.hero .wrap{z-index:1;}
.hero-xx{width:min(560px,86vw);margin-bottom:28px;filter:drop-shadow(0 0 36px rgba(32,196,215,.22));animation:xxGlow 6s ease-in-out infinite;}
@keyframes xxGlow{0%,100%{filter:drop-shadow(0 0 30px rgba(32,196,215,.18));}50%{filter:drop-shadow(0 0 48px rgba(32,196,215,.36));}}
.hero h1{font-size:clamp(40px,7vw,88px);margin-bottom:24px;}
.hero h1 .accent{color:var(--cyan);text-shadow:0 0 36px rgba(32,196,215,.5);}
.hero .lead{max-width:640px;font-size:clamp(17px,2vw,21px);margin-bottom:38px;}
.hero-ctas{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:56px;}
.hero-tagline{font-size:14px;color:var(--steel);letter-spacing:.02em;display:flex;align-items:center;gap:10px;}
.hero-tagline::before{content:"";width:28px;height:1px;background:var(--cyan);opacity:.6;}
.hero-tagline b{color:#fff;font-weight:600;}

/* ---------- stats strip ---------- */
.stats-strip{position:relative;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:44px 0;}
@media (max-width:860px){.stats-grid{grid-template-columns:repeat(2,1fr);}}
.stats-grid.cols-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:640px){.stats-grid.cols-3{grid-template-columns:1fr;gap:28px;}}
.stat{text-align:center;position:relative;padding:4px 10px;}
.stat:not(:last-child)::after{content:"";position:absolute;right:-12px;top:50%;transform:translateY(-50%);width:1px;height:34px;background:rgba(255,255,255,.08);}
@media (max-width:860px){.stat:nth-child(2n)::after{display:none;}}
.stat .num{
  font-family:var(--serif);font-size:clamp(28px,3.2vw,40px);font-weight:600;letter-spacing:-0.02em;
  background:linear-gradient(135deg,#fff,var(--cyan-2));-webkit-background-clip:text;background-clip:text;color:transparent;
  transition:transform .3s var(--ease);display:inline-block;
}
.stat:hover .num{transform:translateY(-2px) scale(1.04);}
.stat .lbl{font-size:12.5px;color:var(--steel);margin-top:8px;text-transform:uppercase;letter-spacing:.07em;font-weight:600;}

/* ---------- media / photo sections ---------- */
.photo-banner{
  position:relative;height:clamp(320px,46vw,560px);overflow:hidden;
  background-size:cover;background-position:center;background-color:#0D2748;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
.photo-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(9,29,57,.1) 30%, rgba(9,29,57,.85));}
.photo-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.photo-caption{position:absolute;left:0;right:0;bottom:0;padding:32px;z-index:2;}
.photo-caption .wrap{padding:0 32px;}
.photo-caption p{font-size:13px;color:#cfe9ed;font-weight:600;letter-spacing:.03em;}
.img-card{border-radius:22px;overflow:hidden;background:#0D2748;position:relative;box-shadow:var(--shadow-md), inset 0 0 0 1px rgba(255,255,255,.06);transition:box-shadow .4s var(--ease), transform .4s var(--ease);}
.img-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg), inset 0 0 0 1px rgba(255,255,255,.1);}
.img-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease);}
.img-card:hover img{transform:scale(1.035);}
/* this section is two full-bleed photos with no empty background to decorate —
   the sitewide floating ambient dot (.section::after, see above) was landing
   on top of the photos at common desktop widths (1024px, 1440px), showing up
   as a small drifting cyan/gold glow over the people's/apartment's faces —
   so it's turned off here specifically, same idea as confining the shooting
   stars to the side margins elsewhere. */
.photo-row::after{display:none;}

/* ---------- founder photo ---------- */
.founder-photo{
  position:relative;border-radius:24px;overflow:hidden;aspect-ratio:5/4;
  box-shadow:var(--shadow-lg), inset 0 0 0 1px rgba(255,255,255,.08);
  transition:transform .5s var(--ease-bounce), box-shadow .4s var(--ease);
}
.founder-photo:hover{transform:translateY(-5px) rotate(-.4deg);box-shadow:0 36px 70px rgba(5,16,32,.45), inset 0 0 0 1px rgba(255,255,255,.12);}
.founder-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform .8s var(--ease);}
.founder-photo:hover img{transform:scale(1.045);}
.founder-photo::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(190deg,transparent 55%,rgba(6,19,37,.6) 100%);}
.founder-photo::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(32,196,215,.25);}
.founder-badge{
  position:absolute;left:20px;bottom:20px;z-index:2;display:flex;align-items:center;gap:12px;
  background:rgba(9,29,57,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(32,196,215,.35);border-radius:16px;padding:12px 18px;
  box-shadow:var(--shadow-md);animation:badgeFloat 5s ease-in-out infinite;
}
.founder-badge strong{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--cyan-2);line-height:1;}
.founder-badge span{font-size:11px;letter-spacing:.03em;line-height:1.3;max-width:108px;color:#dbe4ee;font-weight:600;}
@keyframes badgeFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
@media (max-width:640px){.founder-photo{aspect-ratio:4/5;}}
.founder-social{
  display:inline-flex;align-items:center;gap:9px;margin-top:22px;
  padding:9px 18px 9px 14px;border-radius:999px;border:1px solid rgba(14,30,51,.14);
  color:#28435c;font-size:13.5px;font-weight:600;background:rgba(32,196,215,.05);
  transition:border-color .25s,background .25s,transform .35s var(--ease-bounce),color .25s;
}
.founder-social svg{flex-shrink:0;transition:transform .35s var(--ease-bounce);}
.founder-social:hover{border-color:var(--cyan);background:rgba(32,196,215,.12);color:var(--cyan-deep);transform:translateY(-2px);}
.founder-social:hover svg{transform:rotate(-8deg) scale(1.08);}

/* ---------- manifesto ---------- */
.manifesto-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:start;}
@media (max-width:860px){.manifesto-grid{grid-template-columns:1fr;gap:40px;}}
.manifesto h2{font-size:clamp(30px,4vw,48px);margin-bottom:26px;}
.pillars{display:grid;gap:18px;}
.pillar-card{
  background:linear-gradient(160deg,rgba(255,255,255,0.055),rgba(255,255,255,0.02));
  border:1px solid rgba(255,255,255,0.09);
  border-radius:18px;padding:26px 28px;position:relative;overflow:hidden;
  transition:transform .5s var(--ease-bounce), border-color .35s, box-shadow .35s var(--ease);
}
.pillar-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--cyan),transparent);opacity:.7;}
.pillar-card:hover{transform:translateY(-4px);border-color:rgba(32,196,215,.35);box-shadow:0 20px 44px rgba(3,10,20,.35);}
.pillar-card h3{font-size:13.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--cyan);margin-bottom:10px;font-weight:700;}
.pillar-card p{font-size:15.5px;color:#dbe4ee;line-height:1.6;}

/* ---------- método NEXXOR (4 passos) ---------- */
.metodo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:44px;}
@media (max-width:980px){.metodo-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.metodo-grid{grid-template-columns:1fr;}}
.metodo-step{
  background:linear-gradient(160deg,rgba(255,255,255,0.055),rgba(255,255,255,0.02));
  border:1px solid rgba(255,255,255,0.09);border-radius:18px;padding:26px 24px;position:relative;
  transition:transform .4s var(--ease-bounce), border-color .3s;
}
.metodo-step:hover{transform:translateY(-4px);border-color:rgba(32,196,215,.35);}
.metodo-step .num{font-size:13px;font-weight:800;color:var(--cyan);letter-spacing:.06em;margin-bottom:12px;}
.metodo-step h3{font-size:16.5px;font-weight:700;margin-bottom:8px;letter-spacing:-0.01em;}
.metodo-step p{font-size:14.5px;color:var(--steel);line-height:1.6;}
.section.light .metodo-step{background:#fff;border-color:rgba(9,29,57,.08);}
.section.light .metodo-step p{color:#55657a;}
.pullquote{
  margin-top:56px;border-left:3px solid var(--cyan);padding:6px 0 6px 28px;
  font-family:var(--serif);font-style:italic;
  font-size:clamp(20px,2.6vw,29px);font-weight:500;letter-spacing:-0.01em;line-height:1.35;
}

/* cycle strip */
.cycle{margin-top:64px;}
.cycle-title{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);margin-bottom:22px;}
.cycle-steps{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.cycle-step{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  border-radius:999px;padding:10px 18px;font-size:14px;font-weight:600;white-space:nowrap;
  transition:background .25s,border-color .25s,transform .25s var(--ease);
}
.cycle-step:hover{border-color:rgba(32,196,215,.45);transform:translateY(-2px);}
.cycle-step.current{background:linear-gradient(135deg,var(--cyan-2),var(--cyan));color:var(--navy);border-color:var(--cyan);box-shadow:0 6px 18px rgba(32,196,215,.3);}
.cycle-arrow{color:var(--cyan);font-size:16px;opacity:.7;}

/* ---------- ecosystem ---------- */
.eco-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px;}
@media (max-width:980px){.eco-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:620px){.eco-grid{grid-template-columns:1fr;}}
.visual-row-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;}
@media (max-width:700px){.visual-row-grid{grid-template-columns:1fr;}}
.eco-card{
  background:#fff;border:1px solid #e9eef3;border-radius:20px;padding:30px 28px;
  transition:transform .5s var(--ease-bounce), box-shadow .35s var(--ease), border-color .35s;
  display:block;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);
}
.eco-card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;border-radius:20px 20px 0 0;
  background:linear-gradient(90deg,var(--cyan),var(--cyan-2));
  transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);
}
.eco-card:hover{transform:translateY(-6px);box-shadow:0 26px 48px rgba(9,29,57,.14);border-color:rgba(32,196,215,.3);}
.eco-card:hover::before{transform:scaleX(1);}
.eco-card .tag{
  display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:#0e8f9d;background:#e7fafc;
  padding:6px 11px;border-radius:999px;margin-bottom:16px;
}
.eco-card h3{font-size:20px;margin-bottom:9px;color:var(--navy);font-weight:700;font-family:var(--serif);letter-spacing:-0.01em;}
.eco-card p{font-size:14.5px;color:#55657a;line-height:1.6;}
.eco-note{
  margin-top:40px;font-size:13.5px;color:#55657a;max-width:760px;line-height:1.6;
  border-top:1px solid #e3e9f1;padding-top:22px;
}

/* ---------- academy: course catalog cards ---------- */
.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px;}
@media (max-width:980px){.course-grid{grid-template-columns:1fr;}}
.course-card{
  background:#fff;border:1px solid #e9eef3;border-radius:20px;padding:30px 28px;
  box-shadow:var(--shadow-sm);transition:transform .5s var(--ease-bounce),box-shadow .35s var(--ease);
  position:relative;
}
.course-card:hover{transform:translateY(-6px);box-shadow:0 26px 48px rgba(9,29,57,.14);}
.course-tag{
  display:inline-flex;align-items:center;font-size:10.5px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:#9a6d0e;background:#fdf1dc;padding:5px 10px;border-radius:999px;margin-bottom:14px;
}
.course-card h3{font-family:var(--serif);font-size:18px;font-weight:700;color:var(--navy);margin-bottom:9px;letter-spacing:-0.01em;}
.course-card p{font-size:14px;color:#55657a;line-height:1.6;margin-bottom:14px;}
.course-meta{font-size:12px;color:#8799aa;letter-spacing:.01em;}

/* ---------- academy: netflix-style plan cards ---------- */
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px;align-items:stretch;}
@media (max-width:980px){.plans-grid{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto;}}
.plan-card{
  position:relative;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:36px 30px;
  display:flex;flex-direction:column;transition:transform .45s var(--ease-bounce),border-color .35s,box-shadow .35s;
}
.plan-card:hover{transform:translateY(-6px);border-color:rgba(32,196,215,.3);}
.plan-card.featured{
  border-color:rgba(32,196,215,.5);background:linear-gradient(180deg,rgba(32,196,215,.1),rgba(32,196,215,.02));
  box-shadow:0 30px 60px rgba(5,16,32,.35);
}
@media (min-width:981px){.plan-card.featured{transform:scale(1.045);}.plan-card.featured:hover{transform:scale(1.045) translateY(-6px);}}
.plan-badge{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);white-space:nowrap;
  background:linear-gradient(135deg,var(--cyan-2),var(--cyan));color:var(--navy);
  font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:6px 16px;border-radius:999px;box-shadow:0 8px 20px rgba(32,196,215,.35);
}
.plan-name{font-family:var(--serif);font-size:20px;font-weight:600;color:#fff;margin-bottom:14px;}
.plan-price{display:flex;align-items:baseline;gap:3px;color:#fff;}
.plan-currency{font-size:16px;font-weight:600;color:var(--cyan-2);}
.plan-amount{font-family:var(--serif);font-size:40px;font-weight:600;letter-spacing:-0.01em;}
.plan-period{font-size:13.5px;color:var(--steel);}
.plan-note{font-size:12px;color:var(--steel);margin:4px 0 22px;font-style:italic;}
.plan-features{list-style:none;margin:0 0 28px;padding:0;flex:1;display:flex;flex-direction:column;gap:11px;}
.plan-features li{font-size:14px;color:#dbe4ee;padding-left:24px;position:relative;line-height:1.4;}
.plan-features li::before{
  content:"✓";position:absolute;left:0;top:0;color:var(--cyan-2);font-weight:700;
}
.plan-cta{width:100%;text-align:center;}

/* ---------- audiences ---------- */
.aud-tabs{display:flex;gap:10px;margin-bottom:40px;flex-wrap:wrap;}
.aud-tab{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);
  border-radius:999px;padding:10px 20px;font-size:14px;font-weight:600;cursor:pointer;
  color:#cfd8e3;transition:all .25s var(--ease);
}
.aud-tab:hover{border-color:rgba(32,196,215,.4);color:#fff;}
.aud-tab.active{background:linear-gradient(135deg,var(--cyan-2),var(--cyan));color:var(--navy);border-color:var(--cyan);box-shadow:0 8px 20px rgba(32,196,215,.25);}
.aud-panels{position:relative;}
.aud-panel{display:none;}
.aud-panel.active{display:block;animation:fadeUp .5s var(--ease);}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.aud-card{
  background:linear-gradient(135deg, rgba(32,196,215,0.09), rgba(255,255,255,0.025));
  border:1px solid rgba(255,255,255,.1);border-radius:26px;padding:50px;
  position:relative;overflow:hidden;box-shadow:var(--shadow-lg);
}
.aud-card::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(32,196,215,.18),transparent 70%);}
@media (max-width:640px){.aud-card{padding:32px 24px;}}
.aud-slogan{font-family:var(--serif);font-size:clamp(24px,3vw,36px);font-weight:600;color:var(--cyan);margin-bottom:20px;letter-spacing:-0.01em;}
.aud-card p.lead{margin-bottom:26px;}
.aud-points{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:10px;}
@media (max-width:640px){.aud-points{grid-template-columns:1fr;}}
.aud-point{
  background:rgba(255,255,255,.045);border-radius:14px;padding:17px 19px;font-size:14.5px;
  color:#dbe4ee;border:1px solid rgba(255,255,255,.07);transition:background .25s,border-color .25s,transform .25s var(--ease);
}
.aud-point:hover{background:rgba(32,196,215,.06);border-color:rgba(32,196,215,.25);transform:translateY(-2px);}
.aud-point b{display:block;color:#fff;font-weight:600;margin-bottom:5px;font-size:14px;}

/* ---------- career ---------- */
.career-ladder{display:flex;flex-wrap:wrap;gap:12px;margin:40px 0 44px;}
.rung{
  background:#fff;border:1px solid #e3e9f1;border-radius:999px;padding:11px 20px;
  font-size:14px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:8px;
  transition:transform .4s var(--ease-bounce), box-shadow .25s var(--ease), border-color .25s;
}
.rung:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:rgba(32,196,215,.4);}
.rung .n{
  width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;font-size:11px;
  display:flex;align-items:center;justify-content:center;font-weight:700;
}
.rung.highlight{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:0 10px 24px rgba(9,29,57,.25);}
.rung.highlight .n{background:var(--cyan);color:var(--navy);}
.career-quote{
  background:linear-gradient(155deg,var(--navy),var(--navy-3));color:#fff;border-radius:22px;padding:42px 46px;
  font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:clamp(18px,2.2vw,25px);line-height:1.45;max-width:820px;
  box-shadow:var(--shadow-lg);position:relative;overflow:hidden;
}
.career-quote::before{content:"“";position:absolute;top:-6px;left:18px;font-size:120px;color:rgba(32,196,215,.12);font-family:var(--serif);line-height:1;}
.career-quote span{color:var(--cyan);}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr;gap:40px;}}
.contact-info h2{font-size:clamp(28px,3.6vw,44px);margin-bottom:18px;}
.contact-list{margin-top:32px;display:grid;gap:18px;}
.contact-item{display:flex;gap:14px;align-items:flex-start;font-size:15px;color:#cfd8e3;}
.contact-item b{display:block;color:#fff;font-weight:600;margin-bottom:2px;}
form.card{
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.1);
  border-radius:22px;padding:38px;box-shadow:var(--shadow-lg);
}
.field{margin-bottom:19px;}
.field label{display:block;font-size:13px;color:var(--steel);margin-bottom:7px;font-weight:600;}
.field input, .field select, .field textarea{
  width:100%;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.14);
  border-radius:11px;padding:13px 15px;color:#fff;font-family:inherit;font-size:14.5px;
  transition:border-color .25s,background .25s,box-shadow .25s;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;border-color:var(--cyan);background:rgba(255,255,255,.08);
  box-shadow:0 0 0 4px rgba(32,196,215,.14);
}
.field textarea{resize:vertical;min-height:100px;}
.field input::placeholder, .field textarea::placeholder{color:#7f8da0;}
.hp{position:absolute;left:-9999px;opacity:0;}
.submit-btn{
  position:relative;overflow:hidden;width:100%;
  background:linear-gradient(135deg,var(--cyan-2),var(--cyan) 60%,var(--cyan-deep));
  color:var(--navy);font-weight:700;font-size:15px;
  padding:15px;border:0;border-radius:11px;cursor:pointer;transition:transform .45s var(--ease-bounce),box-shadow .3s var(--ease);
  box-shadow:0 6px 18px rgba(32,196,215,.25);
}
.submit-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow);}
.submit-btn:active{transform:translateY(0) scale(.98);}
.form-note{font-size:12.5px;color:var(--steel);margin-top:12px;text-align:center;}
.form-success{display:none;color:var(--green);font-size:14px;margin-top:14px;font-weight:600;}

/* ---------- example/placeholder badge ---------- */
.example-badge{
  display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:#d88a2b;background:rgba(216,138,43,0.12);
  border:1px solid rgba(216,138,43,0.35);padding:5px 11px;border-radius:999px;
}
.example-note{font-size:12.5px;color:var(--steel);margin-top:6px;}
.section.light .example-note{color:#6b7a8f;}

/* ---------- depoimentos ---------- */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px;}
@media (max-width:900px){.testi-grid{grid-template-columns:1fr;}}
.testi-card{
  background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  border:1px solid rgba(255,255,255,.1);border-radius:20px;
  padding:30px;display:flex;flex-direction:column;gap:18px;position:relative;
  transition:transform .5s var(--ease-bounce), border-color .35s, box-shadow .35s var(--ease);
}
.testi-card::before{content:"“";position:absolute;top:14px;right:22px;font-family:var(--serif);font-size:56px;color:rgba(32,196,215,.14);line-height:1;}
.testi-card:hover{transform:translateY(-5px);border-color:rgba(32,196,215,.3);box-shadow:0 24px 46px rgba(3,10,20,.35);}
.testi-quote{font-size:15px;line-height:1.65;color:#dbe4ee;}
.testi-who{display:flex;align-items:center;gap:12px;margin-top:auto;}
.testi-avatar{
  width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--cyan),#0e8f9d);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:var(--navy);flex-shrink:0;
  box-shadow:0 4px 12px rgba(32,196,215,.3);
}
.testi-name{font-size:13.5px;font-weight:700;color:#fff;}
.testi-role{font-size:12px;color:var(--steel);}

/* ---------- portfolio ---------- */
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px;}
@media (max-width:900px){.portfolio-grid{grid-template-columns:1fr;}}
.listing-card{background:#fff;border:1px solid #e9eef3;border-radius:20px;overflow:hidden;transition:transform .5s var(--ease-bounce),box-shadow .35s var(--ease);box-shadow:var(--shadow-sm);}
.listing-card:hover{transform:translateY(-6px);box-shadow:0 26px 48px rgba(9,29,57,.14);}
.listing-photo{
  aspect-ratio:4/3;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:linear-gradient(135deg,#0D2748,#133a63 45%,#0e5f6b);
}
.listing-photo::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 20%,rgba(32,196,215,.22),transparent 60%);}
.listing-photo .mark{width:46px;opacity:.55;transition:transform .4s var(--ease);position:relative;z-index:1;}
.listing-card:hover .listing-photo .mark{transform:scale(1.1) rotate(8deg);}
.listing-photo .tag{
  position:absolute;top:12px;left:12px;background:rgba(9,29,57,.85);color:#fff;font-size:10.5px;
  font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:5px 10px;border-radius:999px;z-index:1;
}
.listing-body{padding:22px 24px;}
.listing-body h3{font-size:17px;color:var(--navy);margin-bottom:5px;font-weight:700;font-family:var(--serif);}
.listing-body .loc{font-size:13px;color:#6b7a8f;margin-bottom:14px;}
.listing-meta{display:flex;gap:14px;font-size:12.5px;color:#55657a;border-top:1px solid #e3e9f1;padding-top:13px;}

/* ---------- FAQ ---------- */
.faq-list{margin-top:40px;display:grid;gap:12px;max-width:820px;}
.faq-item{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;transition:border-color .25s,background .25s;}
.faq-item:hover{border-color:rgba(32,196,215,.25);}
.faq-item.open{background:rgba(32,196,215,.05);border-color:rgba(32,196,215,.3);}
.faq-q{
  width:100%;text-align:left;background:none;border:0;color:#fff;font-family:inherit;font-weight:600;
  font-size:15.5px;padding:21px 24px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;
}
.faq-q .ic{color:var(--cyan);font-size:20px;flex-shrink:0;transition:transform .35s var(--ease);}
.faq-item.open .faq-q .ic{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease);}
.faq-item.open .faq-a{max-height:300px;}
.faq-a p{padding:0 24px 22px;font-size:14.5px;color:#cfd8e3;line-height:1.65;}
/* the FAQ section sits on the light background (.section.light) — the base
   faq-q/faq-a colors above were tuned for dark sections and read as
   near-invisible white-on-white here, so override for legibility */
.section.light .faq-item{background:rgba(9,29,57,.035);border-color:rgba(9,29,57,.12);}
.section.light .faq-item:hover{border-color:rgba(32,196,215,.4);}
.section.light .faq-item.open{background:rgba(32,196,215,.07);border-color:rgba(32,196,215,.4);}
.section.light .faq-q{color:var(--graphite);}
.section.light .faq-a p{color:#4b5a6b;}

/* ---------- carreira diagrama ---------- */
.career-flow{display:flex;flex-wrap:wrap;gap:0;margin:40px 0 44px;counter-reset:step;}
.flow-node{
  display:flex;flex-direction:column;align-items:center;text-align:center;width:110px;position:relative;
}
.flow-node .dot{
  width:54px;height:54px;border-radius:50%;background:#fff;border:2px solid var(--navy);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:var(--navy);
  margin-bottom:12px;transition:transform .3s var(--ease),background .3s,color .3s,box-shadow .3s;
  box-shadow:var(--shadow-sm);
}
.flow-node.highlight .dot{background:linear-gradient(135deg,var(--navy),var(--navy-3));color:var(--cyan);border-color:var(--navy);box-shadow:0 10px 22px rgba(9,29,57,.3);}
.flow-node:hover .dot{transform:scale(1.1) translateY(-2px);box-shadow:0 14px 26px rgba(9,29,57,.2);}
.flow-node .lbl{font-size:12.5px;font-weight:600;color:var(--navy);}
.flow-line{flex:1;height:2px;background:repeating-linear-gradient(90deg,#c7d2de 0 6px,transparent 6px 12px);margin-top:27px;min-width:16px;}
@media (max-width:860px){.career-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 8px;}.flow-line{display:none;}}

/* ---------- breadcrumb (páginas internas) ---------- */
.breadcrumb{font-size:13px;color:var(--steel);margin-bottom:24px;display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.breadcrumb a{color:var(--steel);transition:color .2s;}
.breadcrumb a:hover{color:var(--cyan);}
.breadcrumb .sep{opacity:.5;}
.breadcrumb .current{color:#fff;font-weight:600;}
.section.light .breadcrumb .current{color:var(--navy);}
.section.light .breadcrumb a{color:#6b7a8f;}

/* ---------- páginas de frente do ecossistema ---------- */
.frente-hero{
  padding:152px 0 78px;position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse 820px 480px at 85% -10%, rgba(32,196,215,.26), transparent 60%),
    radial-gradient(ellipse 760px 560px at -8% 100%, rgba(91,227,239,.16), transparent 65%),
    radial-gradient(ellipse 620px 520px at 50% 30%, rgba(14,143,157,.18), transparent 70%);
}
.frente-hero::before{
  content:"";position:absolute;right:-10%;top:-30%;width:60%;height:140%;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse at center,rgba(32,196,215,.14),transparent 65%);
}
/* same "aurora" atmosphere as the home hero (.hero-aurora), scaled down for the shorter
   .frente-hero box used on every other page — reuses the existing auroraDrift keyframe,
   pure CSS, no HTML/text changes needed on any of the pages that use .frente-hero.
   filter is static (no hue animation) so this large blurred layer isn't re-rasterized
   every frame — only the cheap transform-based drift animates. */
.frente-hero::after{
  content:"";position:absolute;inset:-30% -80px -20% -80px;z-index:0;pointer-events:none;
  background:
    radial-gradient(32% 55% at 14% 30%, rgba(32,196,215,.30), transparent 70%),
    radial-gradient(28% 50% at 86% 70%, rgba(216,162,59,.18), transparent 70%),
    radial-gradient(26% 46% at 55% 90%, rgba(91,227,239,.20), transparent 72%);
  filter:blur(60px) saturate(130%);
  animation:auroraDrift 22s ease-in-out infinite alternate;
  will-change:transform;
}
.frente-hero .wrap{position:relative;z-index:1;}
@media (prefers-reduced-motion:reduce){.frente-hero::after{animation:none;}}
.frente-hero .tag{
  display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--cyan);background:rgba(32,196,215,0.1);
  border:1px solid rgba(32,196,215,.3);padding:6px 13px;border-radius:999px;margin-bottom:20px;
}
.frente-hero h1{font-size:clamp(34px,5.4vw,60px);margin-bottom:20px;}
.frente-hero .lead{max-width:680px;}
.frente-highlights{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:42px;}
@media (max-width:760px){.frente-highlights{grid-template-columns:1fr;}}
.frente-highlight{
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);border-radius:16px;
  padding:19px 21px;font-size:14.5px;color:#dbe4ee;font-weight:600;line-height:1.45;
  transition:transform .3s var(--ease),border-color .3s;
}
.frente-highlight:hover{transform:translateY(-3px);border-color:rgba(32,196,215,.3);}
/* .frente-highlight was tuned for a dark .hero/.frente-hero background (light text on
   translucent white) — but it's also used inside .section.light (the "O que é"/"Como
   funciona" blocks on business-school.html, academy.html and the ecosystem pages), where
   that light text on a near-white card reads as washed out. Same card treatment as
   .eco-card/.course-card there instead. */
.section.light .frente-highlight{
  background:#fff;border-color:#e9eef3;color:#28435c;box-shadow:var(--shadow-sm);
}
.section.light .frente-highlight:hover{border-color:rgba(32,196,215,.35);box-shadow:var(--shadow-md);}
.frente-cta-row{display:flex;gap:16px;flex-wrap:wrap;margin-top:38px;}

/* ---------- prefers-reduced-motion ---------- */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;}
}

/* ---------- whatsapp float ---------- */
.wa-float{
  position:fixed;right:24px;bottom:24px;z-index:1050;
  display:flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,#2fe07a,#25D366);color:#06281a;font-weight:700;font-size:14px;
  padding:14px 20px 14px 16px;border-radius:999px;
  box-shadow:0 10px 30px rgba(0,0,0,.4), 0 0 0 0 rgba(37,211,102,.5);
  transition:transform .3s var(--ease), bottom .3s ease, box-shadow .3s var(--ease);
  animation:waPulse 3.2s ease-in-out infinite;
}
@keyframes waPulse{0%,100%{box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 0 0 rgba(37,211,102,.35);}50%{box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 0 9px rgba(37,211,102,0);}}
body.cookie-banner-open .wa-float{bottom:calc(var(--cookie-banner-h, 90px) + 20px);}
.wa-float:hover{transform:translateY(-3px) scale(1.03);}
.wa-float svg{width:24px;height:24px;flex-shrink:0;}
.wa-float span{white-space:nowrap;}
@media (max-width:640px){
  .wa-float span{display:none;}
  .wa-float{padding:14px;}
}

/* ---------- footer ---------- */
footer{background:linear-gradient(180deg,#060F20,#040a16);padding:68px 0 32px;font-size:13.5px;color:#7f8da0;position:relative;}
footer::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(32,196,215,.35),transparent);}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;margin-bottom:44px;}
.footer-brand{display:flex;align-items:center;gap:10px;font-weight:800;color:#fff;font-size:17px;font-family:var(--serif);}
.footer-brand .xx{width:30px;}
.footer-cols{display:flex;gap:56px;flex-wrap:wrap;}
.footer-col h4{color:#fff;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:16px;font-weight:700;}
.footer-col a{display:block;margin-bottom:11px;color:#9aa7ba;transition:color .2s,transform .2s;}
.footer-col a:hover{color:var(--cyan);transform:translateX(3px);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:26px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.footer-disclaimer{max-width:760px;color:#5c6b80;font-size:12px;line-height:1.6;margin-top:18px;}

/* ---------- cookie consent banner ---------- */
.cookie-banner{
  position:fixed;left:0;right:0;bottom:0;z-index:1000;
  background:rgba(9,29,57,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:#fff;padding:18px 24px;box-shadow:0 -12px 40px rgba(0,0,0,.35);border-top:1px solid rgba(32,196,215,.2);
  transform:translateY(110%);transition:transform .5s var(--ease);
}
.cookie-banner.visible{transform:translateY(0);}
.cookie-banner-inner{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;}
.cookie-banner-inner p{margin:0;font-size:14px;line-height:1.55;color:rgba(255,255,255,.82);flex:1 1 420px;}
.cookie-banner-inner a{color:var(--cyan);text-decoration:underline;}
.cookie-banner-actions{display:flex;gap:10px;flex-shrink:0;flex-wrap:wrap;}
.cookie-btn{border-radius:9px;padding:11px 20px;font-size:14px;font-weight:700;cursor:pointer;border:1px solid transparent;font-family:inherit;transition:transform .25s var(--ease),opacity .2s,background .2s;}
.cookie-btn-accept{background:linear-gradient(135deg,var(--cyan-2),var(--cyan));color:var(--navy);border-color:var(--cyan);}
.cookie-btn-accept:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(32,196,215,.3);}
.cookie-btn-reject{background:transparent;color:#fff;border-color:rgba(255,255,255,.35);}
.cookie-btn-reject:hover{background:rgba(255,255,255,.08);}
@media (max-width:640px){.cookie-banner-inner{flex-direction:column;align-items:stretch;}.cookie-banner-actions{justify-content:flex-end;}}
@media (prefers-reduced-motion:reduce){.cookie-banner{transition:none;}}

/* ---------- studio: gate de senha ---------- */
.studio-gate{
  position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 30% 20%,#0d2748,var(--navy-3) 70%);padding:24px;
}
.studio-gate[hidden]{display:none;}
.studio-gate-card{
  max-width:400px;width:100%;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:40px 34px;box-shadow:var(--shadow-lg);text-align:center;
}
.studio-gate-card .xx{width:38px;margin:0 auto 18px;display:block;}
.studio-gate-card h1{font-size:22px;margin-bottom:10px;}
.studio-gate-card p{font-size:13.5px;color:var(--steel);line-height:1.6;margin-bottom:24px;}
.studio-gate-card .field{text-align:left;margin-bottom:14px;}
.studio-gate-err{display:none;color:#ff8a8a;font-size:13px;margin-top:12px;font-weight:600;}
.studio-gate-note{margin-top:22px;font-size:11.5px;color:#5c6b80;line-height:1.5;border-top:1px solid rgba(255,255,255,.08);padding-top:16px;}

/* ---------- studio: conteúdo (visível só após o gate; [hidden] já some via padrão do navegador) ---------- */
.studio-topbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-bottom:8px;}
.studio-logout{background:none;border:1px solid rgba(255,255,255,.18);color:var(--steel);font-size:12.5px;font-weight:600;padding:8px 16px;border-radius:999px;cursor:pointer;transition:border-color .25s,color .25s;}
.studio-logout:hover{border-color:rgba(255,255,255,.4);color:#fff;}

/* studio tabs — reaproveita .aud-tab/.aud-panel (já estilizados e com toggle em main.js) */

/* ---------- studio: visualização estilo netflix ---------- */
.studio-hero{
  position:relative;border-radius:24px;overflow:hidden;padding:52px 40px;margin-top:28px;min-height:220px;
  background:linear-gradient(135deg,rgba(32,196,215,.16),rgba(9,29,57,.4)),linear-gradient(180deg,#143355,#0a1d38);
  border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow-lg);
}
.studio-hero-tag{display:inline-flex;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--navy);background:var(--cyan-2);padding:5px 12px;border-radius:999px;margin-bottom:16px;}
.studio-hero h2{font-size:clamp(24px,3.2vw,36px);color:#fff;margin-bottom:12px;max-width:620px;}
.studio-hero p{font-size:14.5px;color:#cfd8e3;line-height:1.6;max-width:600px;}
.studio-hero-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;font-size:12.5px;color:var(--steel);}
.studio-hero-empty{color:var(--steel);font-size:14.5px;}

.studio-row{margin-top:40px;}
.studio-row h3{font-size:17px;color:#fff;margin-bottom:16px;font-family:var(--serif);font-weight:600;}
.studio-row-track{display:flex;gap:16px;overflow-x:auto;padding-bottom:10px;scrollbar-width:thin;}
.ep-card{
  flex:0 0 220px;background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px 16px;transition:transform .35s var(--ease-bounce),border-color .3s;
}
.ep-card:hover{transform:translateY(-4px);border-color:rgba(32,196,215,.4);}
.ep-card-thumb{
  height:110px;border-radius:11px;margin-bottom:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--cyan-2),var(--navy-2));color:rgba(255,255,255,.65);font-size:26px;
}
.ep-card h4{font-size:14px;color:#fff;margin-bottom:6px;line-height:1.35;}
.ep-card p{font-size:12.5px;color:var(--steel);line-height:1.5;margin-bottom:8px;}
.ep-card-dur{font-size:11.5px;color:var(--cyan-2);font-weight:600;}
.studio-empty-note{margin-top:32px;font-size:13.5px;color:var(--steel);background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.15);border-radius:14px;padding:22px;text-align:center;}

/* ---------- studio: painel de montagem ---------- */
.builder-grid{display:grid;grid-template-columns:1fr;gap:28px;margin-top:28px;}
.builder-card{
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:30px 28px;
}
.builder-card h3{font-size:16px;color:#fff;margin-bottom:18px;font-family:var(--serif);}
.builder-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;}
.builder-row .field{flex:1;min-width:160px;margin-bottom:0;}
.builder-add-btn{
  background:rgba(32,196,215,.14);border:1px solid rgba(32,196,215,.4);color:var(--cyan-2);
  font-weight:700;font-size:13px;padding:12px 18px;border-radius:11px;cursor:pointer;white-space:nowrap;
  transition:background .25s,transform .25s var(--ease-bounce);
}
.builder-add-btn:hover{background:rgba(32,196,215,.24);transform:translateY(-2px);}
.module-list{margin-top:24px;display:flex;flex-direction:column;gap:16px;}
.module-block{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:20px 20px 16px;}
.module-block-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;}
.module-block-head h4{font-size:14.5px;color:#fff;}
.module-block-head span{font-size:12px;color:var(--steel);}
.lesson-row{display:flex;gap:10px;align-items:center;padding:10px 0;border-top:1px solid rgba(255,255,255,.06);font-size:13.5px;color:#dbe4ee;}
.lesson-row:first-of-type{border-top:none;}
.lesson-row b{color:#fff;font-weight:600;flex:1;}
.lesson-row span{color:var(--steel);font-size:12px;white-space:nowrap;}
.icon-btn{background:none;border:none;color:#8799aa;cursor:pointer;font-size:15px;padding:4px 7px;border-radius:7px;transition:color .2s,background .2s;}
.icon-btn:hover{color:#ff8a8a;background:rgba(255,255,255,.06);}
.builder-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px;}
.builder-save-note{font-size:12px;color:var(--steel);margin-top:4px;}
.builder-save-note.saved{color:var(--green);}
@media (max-width:700px){.builder-row{flex-direction:column;align-items:stretch;}.builder-row .field{min-width:0;}}

/* ---------- business school: portal do aluno (gate embutido, não fullscreen) ---------- */
.portal-card{
  max-width:440px;margin:0 auto;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:40px 36px;box-shadow:var(--shadow-lg);text-align:center;
}
.portal-card h3{font-size:20px;color:#fff;margin-bottom:10px;}
.portal-card p{font-size:13.5px;color:var(--steel);line-height:1.6;margin-bottom:22px;}
.portal-card .field{text-align:left;margin-bottom:14px;}
.portal-err{display:none;color:#ff8a8a;font-size:13px;margin-top:10px;font-weight:600;}
.portal-note{margin-top:22px;font-size:11.5px;color:#5c6b80;line-height:1.5;border-top:1px solid rgba(255,255,255,.08);padding-top:16px;text-align:left;}
.portal-logged{max-width:980px;margin:0 auto;}
.portal-logged[hidden]{display:none;}
.portal-topbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:24px;}
.portal-topbar p{margin:0;font-size:13.5px;color:var(--steel);}

/* ---------- auth real (Supabase): login/cadastro ---------- */
.auth-toggle{display:flex;gap:8px;margin-bottom:22px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:4px;}
.auth-toggle button{
  flex:1;background:none;border:0;color:var(--steel);font-size:12.5px;font-weight:700;
  padding:9px 10px;border-radius:999px;cursor:pointer;transition:background .25s,color .25s;
}
.auth-toggle button.active{background:linear-gradient(135deg,var(--cyan-2),var(--cyan));color:var(--navy);}
.inline-msg{font-size:13px;margin-top:10px;font-weight:600;display:none;}
.inline-msg.show{display:block;}
.inline-msg.err{color:#ff8a8a;}
.inline-msg.ok{color:var(--green);}
.studio-denied{max-width:440px;margin:0 auto;text-align:center;}
.studio-denied h3{font-size:19px;color:#fff;margin-bottom:10px;}
.studio-denied p{font-size:13.5px;color:var(--steel);line-height:1.6;margin-bottom:18px;}

/* ---------- studio: lista de cursos (reaproveita .course-card do Academy) ---------- */
.studio-course-list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:28px 0;}
@media (max-width:900px){.studio-course-list{grid-template-columns:1fr;}}
.course-card{cursor:pointer;}
.course-card.selected{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(32,196,215,.25),0 26px 48px rgba(9,29,57,.14);}
.course-card-new{
  border:1.5px dashed #c7d2db;border-radius:20px;padding:30px 28px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:8px;cursor:pointer;color:#55657a;font-weight:700;font-size:14.5px;
  transition:border-color .25s,color .25s,background .25s;min-height:150px;text-align:center;
}
.course-card-new:hover{border-color:var(--cyan);color:var(--cyan-deep);background:rgba(32,196,215,.05);}
.studio-back-link{
  display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:var(--cyan-2);
  font-size:13px;font-weight:700;cursor:pointer;margin-bottom:22px;padding:0;
}
.studio-back-link:hover{color:var(--cyan);}

/* #courseEditorView, #tab-enroll and #portalLogged sit inside a ".section.light" (white) page
   section so the course-list cards (.course-card, reused from Academy) render correctly — but
   .builder-card/.module-block/.lesson-row/.icon-btn are dark-glass components designed to sit on
   a dark navy background. This wrapper gives them that background back so white text stays
   legible, without turning the whole section dark (which would break the light .course-card grid). */
.studio-dark-panel{
  background:linear-gradient(175deg,#0d2a52 0%,var(--navy) 55%,var(--navy-3) 100%);
  border-radius:28px;padding:36px;margin-top:8px;
}
@media (max-width:700px){.studio-dark-panel{padding:24px 18px;border-radius:20px;}}

/* ---------- studio: matricular alunos ---------- */
.enroll-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;}
.enroll-row .field{flex:1;min-width:200px;margin-bottom:0;}
.enroll-list{margin-top:22px;display:flex;flex-direction:column;gap:0;}
.enroll-empty{color:var(--steel);font-size:13.5px;margin-top:18px;}

/* Submenus: a seção ativa (scrollspy) destaca só o item do menu principal.
   Itens do submenu que apontam para a mesma âncora não recebem o sublinhado nem a cor de ativo. */
.navdd-panel a.active-link{color:inherit;opacity:.82;}
.navdd-panel a.active-link::after{content:none;display:none;}
.navdd-panel a.active-link:hover{color:var(--cyan);opacity:1;}

/* Botão Entrar no cabeçalho (02/nov/2026, pedido do cliente): Corretores e ADM abrem o NexxorLead; Parceiros vão para o contato. */
.login-ic{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}
.login-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.22);font-size:12.5px;font-weight:600;white-space:nowrap;transition:border-color .25s,background .25s,color .2s,transform .45s var(--ease-bounce);}
.login-btn:hover,.navdd-login.open .login-btn{border-color:var(--cyan);background:rgba(32,196,215,.1);color:var(--cyan);}
.login-btn:active{transform:scale(.97);}
@media (min-width:861px){.hdr-cta{display:flex;align-items:center;gap:10px;}}
.navdd-login .navdd-panel{left:auto;right:0;top:calc(100% + 10px);transform:translate(0,8px);min-width:290px;padding:8px;z-index:60;}
.navdd-login .navdd-panel::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px;}
.navdd-login:hover .navdd-panel,.navdd-login.open .navdd-panel,.navdd-login:focus-within .navdd-panel{opacity:1;visibility:visible;transform:translate(0,0);}
.navdd-login .navdd-panel a b{display:block;font-size:14px;font-weight:700;}
.navdd-login .navdd-panel a small{display:block;font-size:12px;opacity:.68;margin-top:2px;font-weight:400;white-space:normal;}
.login-title{margin:6px 13px 6px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);font-weight:700;}
.login-note{margin:6px 13px 6px;padding-top:9px;border-top:1px solid rgba(255,255,255,.08);font-size:11.5px;opacity:.6;white-space:normal;line-height:1.45;}
.login-toggle{display:none;}
@media (max-width:860px){
  .login-toggle{display:inline-flex;align-items:center;gap:6px;margin-left:auto;margin-right:12px;padding:7px 13px;border-radius:999px;border:1px solid rgba(32,196,215,.55);background:rgba(32,196,215,.1);color:var(--cyan-2);font:inherit;font-size:13px;font-weight:600;cursor:pointer;}
  .mp-login{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:8px 0 14px;margin-bottom:4px;border-bottom:1px solid rgba(255,255,255,.08);}
  .mp-login-title{grid-column:1/-1;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);font-weight:700;padding-top:4px;}
  .mobile-panel .mp-login a{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;padding:11px 6px;border:1px solid rgba(255,255,255,.14);border-radius:12px;font-size:13px;}
  .mp-login a b{font-size:14px;}
  .mp-login a small{font-size:11px;opacity:.65;}
  .mp-login.pulse a{animation:loginPulse 1.1s var(--ease) 1;}
}
@keyframes loginPulse{0%{box-shadow:0 0 0 0 rgba(32,196,215,.55);border-color:var(--cyan);}100%{box-shadow:0 0 0 12px rgba(32,196,215,0);}}
@media (min-width:861px) and (max-width:1080px){
  .navlinks{gap:14px;font-size:13px;}
  .hdr-cta{gap:8px;}
  .hdr-cta .cta-btn{padding:9px 12px;}
  .login-btn{padding:8px 9px;}
  .login-btn .login-txt{display:none;}
}