
/* ── SKIP LINKS ── */

.skip-links{position:absolute;top:0;left:0;z-index:9999}

.skip-link{

  display:inline-block;

  padding:.75rem 1.25rem;

  background:#C7FF3A;

  color:#000;

  font-weight:700;

  font-size:.9rem;

  border-radius:0 0 .5rem 0;

  transform:translateY(-100%);

  transition:transform .2s ease;

  text-decoration:none;

}

.skip-link:focus{transform:translateY(0)}

</style>

<div class="skip-links" role="navigation" aria-label="Links de acessibilidade rápida">

  <a class="skip-link" href="#conteudo-principal">Pular para o conteúdo principal</a>

  <a class="skip-link" href="#navegacao-principal">Pular para a navegação</a>

  <a class="skip-link" href="#contato">Pular para o contato</a>

</div>



<!-- Região aria-live para anúncio de seção ao navegar via scroll/âncora -->

<div id="section-announcer"

     role="status"

     aria-live="assertive"

     aria-atomic="true"

     style="position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0"></div>



<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

<link href="https://api.fontshare.com/v2/css?f[]=clash-display@700&display=swap" rel="stylesheet">

<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.js"></script>



<style>

.sr-only{

  position:absolute;width:1px;height:1px;

  padding:0;margin:-1px;overflow:hidden;

  clip:rect(0,0,0,0);white-space:nowrap;border:0;

}



/* ── SCROLL PADDING — evita que header fixo cubra elemento focado (WCAG 2.4.11) ── */

html{

  scroll-padding-top:80px;

}



/* ── FOCUS VISIBLE GLOBAL ── */

*:focus-visible{

  outline:3px solid #C7FF3A !important;

  outline-offset:3px !important;

  border-radius:4px;

}



/* ── FOCUS nos cards com overflow:hidden — outline interno com offset negativo ── */

.svc-card:focus-visible,

.proj-card:focus-visible,

.testi-card:focus-visible,

.carousel-card:focus-visible,

.extra-testi-card:focus-visible{

  outline:3px solid #C7FF3A !important;

  outline-offset:-3px !important;

}



/* Mantém overflow:visible no :focus-within para elementos internos */

.svc-card:focus-within,

.proj-card:focus-within,

.testi-card:focus-within{overflow:visible}

</style>



<style>

/* ── PREFERÊNCIA DE MOVIMENTO REDUZIDO ── */

@media (prefers-reduced-motion: reduce) {

  *,::before,::after{

    animation-duration:.01ms !important;

    animation-iteration-count:1 !important;

    transition-duration:.01ms !important;

    scroll-behavior:auto !important;

  }

  .ticker-track{ animation:none !important; }

}



/* ── prefers-contrast: more ── */

@media (prefers-contrast: more) {

  :root {

    --border: rgba(0,0,0,.7) !important;

    --muted: rgba(0,0,0,1) !important;

    --muted-2: rgba(0,0,0,.95) !important;

  }

  html.dark {

    --border: rgba(255,255,255,.85) !important;

    --muted: rgba(255,255,255,1) !important;

    --muted-2: rgba(255,255,255,.95) !important;

  }

  .svc-card,

  .proj-card,

  .step-body,

  .testi-card,

  .extra-testi-card,

  .stat-box,

  .about-stat-card { border-width: 2px !important; }

  .shiny-cta { border-width: 3px !important; }

  .nav-links a::after { height: 3px; }

}



/* ── forced-colors (Windows High Contrast Mode) ── */

@media (forced-colors: active) {

  .stat-box { border: 2px solid ButtonText !important; }

  .shiny-cta { border: 2px solid ButtonText !important; }

  .btn-primary-cta { border: 2px solid ButtonText !important; }

  /* Preserva cor do accent-word */

  .accent-word { forced-color-adjust: none; color: #C7FF3A !important; }

  /* SVGs decorativos ficam visíveis */

  .svc-icon svg, .about-stat-icon svg { stroke: ButtonText !important; }

  /* Bordas gradient ficam visíveis */

  .border-gradient::before { display: none; }

  .svc-card, .proj-card, .step-body, .testi-card { border: 2px solid ButtonText !important; }

}



/* ── INVERTER COR DA LOGO NO MODO ESCURO ── */

html.dark .nav-logo img,

html.dark .footer-brand img {

  filter: invert(1) brightness(200%);

}



/* ── CORREÇÕES MODO ESCURO ── */

html.dark .hero h1,

html.dark .hero h1 .line {

  color: #ffffff !important;

}

html.dark .hero h1 .line-muted {

  color: rgba(255,255,255,0.85) !important;

}

html.dark .hero-sub,

html.dark .hero-stats {

  color: rgba(255,255,255,0.9) !important;

}

html.dark .hero::before {

  background: linear-gradient(180deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.95) 100%) !important;

}

html.dark .carousel-section {

  background:

    linear-gradient(180deg, #000000 0%, rgba(10,10,10,0.95) 45%, #000000 100%),

    radial-gradient(circle at 12% 18%, rgba(199,255,58,0.12), transparent 28%),

    radial-gradient(circle at 88% 55%, rgba(199,255,58,0.08), transparent 32%) !important;

}

html.dark .mn-section__title {

  color: #ffffff !important;

}



.carousel-section::after {

  content: "";

  position: absolute;

  inset: 0;

  pointer-events: none;

  background-image:

    linear-gradient(rgba(17,17,17,.025) 1px, transparent 1px),

    linear-gradient(90deg, rgba(17,17,17,.025) 1px, transparent 1px);

  background-size: 42px 42px;

  mask-image: linear-gradient(180deg,transparent 0%,#000 18%,#000 78%,transparent 100%);

  z-index: 0;

}

.carousel-section > * { position: relative; z-index: 1; }

.carousel-section {

  position: relative;

  overflow: hidden;

  background:

    linear-gradient(180deg,rgba(246,247,242,1) 0%,rgba(246,247,242,.92) 45%,rgba(246,247,242,1) 100%),

    radial-gradient(circle at 12% 18%, rgba(199,255,58,.28), transparent 28%),

    radial-gradient(circle at 88% 55%, rgba(199,255,58,.18), transparent 32%);

}



body {

  background:

    radial-gradient(circle at 8% 18%, rgba(199,255,58,.18), transparent 24%),

    radial-gradient(circle at 92% 42%, rgba(199,255,58,.12), transparent 26%),

    radial-gradient(circle at 50% 78%, rgba(199,255,58,.08), transparent 30%),

    var(--bg);

}



.carousel-section,

.about-section,

.services-section,

.process-section,

.projects-section,

.testimonials-section,

.stats-section {

  position: relative;

  isolation: isolate;

}



.carousel-section::before {

  content: "";

  position: absolute;

  inset: 0;

  pointer-events: none;

  background:

    radial-gradient(circle at 18% 28%, rgba(199,255,58,.22), transparent 18%),

    radial-gradient(circle at 76% 72%, rgba(199,255,58,.14), transparent 22%);

  filter: blur(18px);

  opacity: .9;

  z-index: 0;

}

.services-section::before,

.projects-section::before,

.testimonials-section::before {

  content: "";

  position: absolute;

  inset: 0;

  z-index: -1;

  pointer-events: none;

  background:

    radial-gradient(circle at 12% 20%, rgba(199,255,58,.13), transparent 22%),

    radial-gradient(circle at 88% 70%, rgba(199,255,58,.10), transparent 24%);

}



.about-section,

.process-section,

.stats-section {

  background:

    linear-gradient(180deg,rgba(199,255,58,.045) 0%,rgba(255,255,255,.0) 42%,rgba(199,255,58,.035) 100%);

}



/* ── CARDS — bordas com contraste suficiente ── */

.svc-card,

.step-body,

.proj-card,

.about-stat-card,

.carousel-card,

.stat-box,

.testi-card,

.extra-testi-card {

  border: 1px solid rgba(199,255,58,.42) !important;

  box-shadow: 0 22px 55px rgba(17,17,17,.08), 0 0 0 1px rgba(199,255,58,.12);

}

.carousel-card:hover {

  border-color: rgba(199,255,58,.9) !important;

  box-shadow: 0 28px 70px rgba(17,17,17,.12), 0 0 36px rgba(199,255,58,.18);

}

.svc-card:hover,

.step-body:hover,

.proj-card:hover,

.about-stat-card:hover,

.testi-card:hover,

.extra-testi-card:hover {

  border-color: rgba(199,255,58,.65) !important;

  box-shadow: 0 20px 50px rgba(0,0,0,.06), 0 0 0 1px rgba(199,255,58,.16);

}



html.dark body {

  background:

    radial-gradient(circle at 8% 18%, rgba(199,255,58,.12), transparent 24%),

    radial-gradient(circle at 92% 42%, rgba(199,255,58,.08), transparent 26%),

    radial-gradient(circle at 50% 78%, rgba(199,255,58,.06), transparent 30%),

    var(--bg);

}

html.dark .about-section,

html.dark .process-section,

html.dark .stats-section {

  background:

    linear-gradient(180deg,rgba(199,255,58,.055) 0%,rgba(0,0,0,0) 42%,rgba(199,255,58,.035) 100%);

}



.mn-section__title {

  position: relative;

  display: inline-block;

}

.mn-section__title::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: -12px;

  width: 0;

  height: 4px;

  background: #C7FF3A;

  border-radius: 2px;

  transition: width .4s ease;

}

.mn-section__title:hover::after { width: 100%; }



.carousel-card:hover img { transform: scale(1.08); }

.carousel-card img { transition: transform .6s ease; }

.carousel-track { display: flex; gap: 24px; }

.carousel-card {

  flex: 1;

  position: relative;

  transition: all .4s cubic-bezier(.22,.61,.36,1);

  transform: scale(.96);

  opacity: 1;

  cursor: pointer;

}

.carousel-card:hover { transform: scale(1.05); opacity: 1; z-index: 5; }

.carousel-track .carousel-card:hover { opacity: 1; }



/* ── CSS VARIABLES ── */

:root{

  --bg:#f6f7f2;

  --bg-soft:#ffffff;

  --text:#111;

  --muted:rgba(0,0,0,.75);

  --muted-2:rgba(0,0,0,.60);

  --card:rgba(255,255,255,.72);

  --card-hover:rgba(255,255,255,.9);

  --border:rgba(0,0,0,.15);

  --header:rgba(246,247,242,.72);

  --accent:#C7FF3A;

  --touch-min:44px;

}

html.dark{

  --bg:#000;

  --bg-soft:#050505;

  --text:#fff;

  --muted:rgba(255,255,255,.82);

  --muted-2:rgba(255,255,255,.65);

  --card:rgba(255,255,255,.05);

  --card-hover:rgba(255,255,255,.08);

  --border:rgba(255,255,255,.15);

  --header:rgba(0,0,0,.5);

}



/* ── RESETS ── */

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

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body {

  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

  background: var(--bg);

  color: var(--text);

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  overflow-x: hidden;

  line-height: 1.6;

}

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

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

button{cursor:pointer;font-family:inherit}



/* ── KEYFRAMES ── */

@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(30px);filter:blur(8px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}

@keyframes titleEmergence{0%{opacity:0;transform:translateY(60px) scale(.96);filter:blur(12px)}60%{opacity:1;filter:blur(0)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}

@keyframes portraitFall{0%{opacity:0;transform:translateY(-60px) rotate(-8deg) scale(.8)}to{opacity:1;transform:translateY(0) rotate(0) scale(1)}}

@keyframes badge{0%{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}

@keyframes borderSpin{to{--gradient-angle:360deg}}

@keyframes shimmer{to{transform:translate(-50%,-50%) rotate(360deg)}}

@keyframes tickerMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@keyframes waPop{0%,to{box-shadow:0 8px 32px rgba(37,211,102,.4)}50%{box-shadow:0 8px 32px rgba(37,211,102,.4),0 0 0 10px rgba(37,211,102,.08)}}

@property --gradient-angle{syntax:"<angle>";initial-value:0deg;inherits:false}



/* ── GRADIENT BLUR ── */

.gradient-blur{position:fixed;z-index:5;inset:0 0 auto 0;height:10%;pointer-events:none}

.gradient-blur>div,.gradient-blur::before,.gradient-blur::after{position:absolute;top:0;right:0;bottom:0;left:0}

.gradient-blur::before{content:"";z-index:1;backdrop-filter:blur(.5px);mask:linear-gradient(to top,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 12.5%,rgba(0,0,0,1) 25%,rgba(0,0,0,0) 37.5%)}

.gradient-blur>div:nth-of-type(1){z-index:2;backdrop-filter:blur(1px);mask:linear-gradient(to top,rgba(0,0,0,0) 12.5%,rgba(0,0,0,1) 25%,rgba(0,0,0,1) 37.5%,rgba(0,0,0,0) 50%)}

.gradient-blur>div:nth-of-type(2){z-index:3;backdrop-filter:blur(2px);mask:linear-gradient(to top,rgba(0,0,0,0) 25%,rgba(0,0,0,1) 37.5%,rgba(0,0,0,1) 50%,rgba(0,0,0,0) 62.5%)}

.gradient-blur>div:nth-of-type(3){z-index:4;backdrop-filter:blur(4px);mask:linear-gradient(to top,rgba(0,0,0,0) 37.5%,rgba(0,0,0,1) 50%,rgba(0,0,0,1) 62.5%,rgba(0,0,0,0) 75%)}

.gradient-blur>div:nth-of-type(4){z-index:5;backdrop-filter:blur(8px);mask:linear-gradient(to top,rgba(0,0,0,0) 50%,rgba(0,0,0,1) 62.5%,rgba(0,0,0,1) 75%,rgba(0,0,0,0) 87.5%)}

.gradient-blur::after{content:"";z-index:8;backdrop-filter:blur(64px);mask:linear-gradient(to top,rgba(0,0,0,0) 87.5%,rgba(0,0,0,1) 100%)}



/* ── BORDER-GRADIENT ── */

.border-gradient{position:relative}

.border-gradient::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,.04) 50%,rgba(255,255,255,.10) 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:1}



/* ── SECTION TRANSITIONS ── */

section{transition:filter .6s ease,opacity .6s ease}

section.section-visible{filter:blur(0);opacity:1}

section.section-exiting{filter:blur(0);opacity:1}

.animate-on-scroll:not([style*="animation"]){opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}

.animate-on-scroll.animate{opacity:1;transform:translateY(0)}

.animate-on-scroll{animation-play-state:paused!important}

.animate-on-scroll.animate{animation-play-state:running!important}



/* ── TYPE-WORDS ANIMATION ── */

.type-words .w{display:inline-block;opacity:0;filter:blur(6px);transform:translateY(8px);transition:opacity calc(var(--dur) * .4) calc(var(--delay) + var(--i) * var(--stagger)) var(--ease),filter calc(var(--dur) * .4) calc(var(--delay) + var(--i) * var(--stagger)) var(--ease),transform calc(var(--dur) * .4) calc(var(--delay) + var(--i) * var(--stagger)) var(--ease)}

.type-words.is-in .w{opacity:1;filter:blur(0);transform:translateY(0)}



/* ── UTILITIES ── */

.max-w-7xl{max-width:80rem}

.mx-auto{margin-left:auto;margin-right:auto}

.px-6{padding-left:1.5rem;padding-right:1.5rem}

.lg\:px-8{padding-left:2rem;padding-right:2rem}

@media(min-width:1024px){.lg\:px-8{padding-left:2rem;padding-right:2rem}}



/* ── SHINY CTA BUTTON ── */

.shiny-cta {

  --gradient-angle: 0deg;

  position: relative;

  overflow: hidden;

  border-radius: 9999px;

  padding: .85rem 1.6rem;

  font-size: .95rem;

  font-weight: 700;

  color: #000;

  background: linear-gradient(135deg, #C7FF3A 0%, #a8e62a 100%);

  border: 2px solid rgba(0,0,0,.2);

  box-shadow: 0 10px 30px rgba(199,255,58,.25), inset 0 0 0 1px rgba(0,0,0,.1);

  transition: all .25s ease;

  min-height: var(--touch-min);

  min-width: var(--touch-min);

  display: inline-flex;

  align-items: center;

  justify-content: center;

}

.shiny-cta:hover {

  transform: translateY(-2px) scale(1.03);

  box-shadow: 0 20px 60px rgba(199,255,58,.35), 0 0 0 2px rgba(199,255,58,.25);

}

.shiny-cta::after { display: none; }



/* ── NAV ── */

header{position:fixed;z-index:20;background:var(--header);width:100%;top:0;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);animation:fadeSlideIn .5s ease-in-out .1s both}

.nav-inner{max-width:80rem;margin:0 auto;padding:0 1.5rem}

@media(min-width:1024px){.nav-inner{padding:0 2rem}}

.nav-bar{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 0;border-bottom:1px solid rgba(255,255,255,.06)}

.nav-logo{display:flex;align-items:center;gap:.75rem;font-size:1.1rem;font-weight:600;letter-spacing:-.02em}

.nav-logo img{height:60px;width:auto}

.nav-links{display:none;align-items:center;gap:1.25rem;font-size:.875rem;color:rgba(255,255,255,.82)}

@media(min-width:1024px){.nav-links{display:flex}}



.nav-links a {

  position: relative;

  display: inline-flex;

  align-items: center;

  white-space: nowrap;

  min-height: var(--touch-min);

  padding: 0 .25rem;

  transition: color .2s;

}

.nav-links a::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: -6px;

  width: 0;

  height: 2px;

  background: var(--accent);

  border-radius: 2px;

  transition: width .3s ease;

}

.nav-links a:hover::after,

.nav-links a[aria-current="page"]::after { width: 100%; }

.nav-links a:hover { color: #fff; }



.nav-cta{display:none;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:rgba(255,255,255,.9);letter-spacing:-.01em;background:rgba(255,255,255,.05);border-radius:9999px;padding:.75rem 1.25rem;transition:all .3s;min-height:var(--touch-min)}

@media(min-width:768px){.nav-cta{display:inline-flex}}

.nav-cta:hover{transform:translateY(-2px) scale(1.04);color:#fff}



.mobile-btn{

  display:flex;align-items:center;justify-content:center;

  width:var(--touch-min);height:var(--touch-min);

  border-radius:.5rem;

  background:rgba(255,255,255,.05);

  border:1px solid rgba(255,255,255,.15);

  color:#fff;

}

@media(min-width:1024px){.mobile-btn{display:none}}

.mobile-menu{position:absolute;top:100%;left:0;right:0;background:rgba(0,0,0,.95);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.1);overflow:hidden;max-height:0;transition:max-height .3s ease-in-out}



.mobile-menu a{display:flex;align-items:center;padding:.875rem 1.5rem;min-height:var(--touch-min);font-size:1rem;color:rgba(255,255,255,.82)}

.mobile-menu a:hover{color:#fff}



/* ── HERO ── */

.hero{min-height:100vh;display:flex;flex-direction:column;text-align:center;padding:0 1.5rem 6rem;position:relative;align-items:center;justify-content:center}

.hero-badge{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;background:rgba(255,255,255,.08);padding:.5rem 1rem;backdrop-filter:blur(8px);color:rgba(255,255,255,.9);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);animation:badge .6s ease .3s both;font-size:.875rem}



.hero-badge .live-dot{

  width:8px;height:8px;border-radius:50%;

  background:#C7FF3A;

  border:1px solid rgba(0,0,0,.3);

}



.hero h1{

  line-height:1.02;font-weight:800;

  color:#fff !important;

  letter-spacing:-0.045em;

  margin:0 auto 1.5rem;

  padding-top:7rem;padding-bottom:1.5rem;

  max-width:1050px;

  animation:titleEmergence 1.8s ease-out both;

  font-family:'Plus Jakarta Sans',system-ui,sans-serif;

  text-shadow:0 12px 40px rgba(0,0,0,.55);

}

.hero h1 .line{display:block;font-size:clamp(2.7rem,5.2vw,4.8rem);font-weight:800;line-height:1.02}

.hero h1 .line-muted{color:rgba(255,255,255,.9)}



.hero-portrait{width:clamp(60px,9vw,90px);height:clamp(60px,9vw,90px);border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.2);box-shadow:0 20px 60px rgba(0,0,0,.5);display:inline-block;vertical-align:middle;margin-right:.5rem;animation:portraitFall 1.2s cubic-bezier(.34,1.56,.64,1) .8s both}

.hero-sub{max-width:54rem;margin:1.5rem auto 0;font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:400;color:rgba(255,255,255,.95)!important;line-height:1.6}

.hero-actions{margin-top:3rem;display:flex;align-items:center;justify-content:center;gap:1.25rem;flex-wrap:wrap}

.hero-ghost-btn{

  display:inline-flex;align-items:center;gap:.5rem;

  font-size:.875rem;font-weight:500;

  color:rgba(255,255,255,.9);

  letter-spacing:-.01em;

  background:rgba(255,255,255,.05);

  border-radius:9999px;

  padding:.75rem 1.25rem;

  border:none;position:relative;

  transition:all .3s;

  min-height:var(--touch-min);

}

.hero-ghost-btn:hover{transform:translateY(-2px) scale(1.04);color:#fff}

.hero-ghost-btn::after{content:"";transition:opacity .3s;position:absolute;bottom:0;left:50%;transform:translateX(-50%);z-index:0;height:6px;width:70%;background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);border-radius:999px;opacity:.08}

.hero-ghost-btn:hover::after{opacity:.6}

.hero-stats{display:flex;flex-wrap:wrap;gap:2rem 4rem;align-items:center;justify-content:center;margin-top:5rem;padding:2rem 0;font-size:1.05rem;font-weight:500;color:rgba(255,255,255,.95)!important;animation:fadeSlideIn .5s ease-in-out .5s both}

.hero-stat{display:inline-flex;align-items:center;gap:.75rem}

.hero-stat svg{width:22px;height:22px;color:var(--accent)}



/* ── CAROUSEL ── */

.carousel-header > div{display:flex;flex-direction:column;align-items:flex-start;gap:12px}

.carousel-section{padding:4rem 0 6rem;position:relative}

.carousel-header{max-width:80rem;margin:0 auto;padding:0 1.5rem}

@media(min-width:1024px){.carousel-header{padding:0 2rem}}

.carousel-card{transform:scale(.96);opacity:1;background:transparent}

.carousel-card.active{transform:scale(1);opacity:1;z-index:2}

.carousel-track{display:flex;gap:1.5rem;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:1.5rem 2rem 1.5rem;scroll-snap-type:x mandatory}

.carousel-track::-webkit-scrollbar{display:none}

.carousel-card{flex-shrink:0;width:33.333%;flex:0 0 33.333%;aspect-ratio:16/10;border-radius:1rem;overflow:hidden;position:relative;background:rgba(20,20,20,.4);scroll-snap-align:center;transition:transform .4s cubic-bezier(.2,.8,.2,1),opacity .4s ease;border:1px solid rgba(255,255,255,.1)}

.carousel-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

.carousel-card .c-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.34) 42%,rgba(0,0,0,.04) 100%)}

.carousel-card .c-content{position:absolute;inset:auto 0 0;padding:1.4rem 1.5rem;z-index:2}

.carousel-card .c-tag{color:rgba(255,255,255,.95);font-size:.72rem;font-weight:700;text-shadow:0 2px 10px rgba(0,0,0,.55)}

.c-tag-dot{display:inline-flex;width:20px;height:20px;align-items:center;justify-content:center;border-radius:50%;background:rgba(199,255,58,.15);box-shadow:inset 0 0 0 1px rgba(199,255,58,.3)}

.carousel-card h3{color:#fff!important;font-size:1.55rem;font-weight:800;line-height:1.05;text-shadow:0 3px 14px rgba(0,0,0,.65)}

@media(min-width:1024px){.carousel-card h3{font-size:1.75rem}}

.carousel-card .c-sub{color:rgba(255,255,255,.95);font-size:.92rem;font-weight:500;text-shadow:0 2px 10px rgba(0,0,0,.65)}

.c-link{display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);padding:.5rem .875rem;backdrop-filter:blur(8px);transition:.2s;min-height:var(--touch-min);min-width:var(--touch-min)}

.c-link:hover{background:rgba(255,255,255,.18)}

.carousel-edge-l{pointer-events:none;position:absolute;left:0;top:0;bottom:0;width:8rem;background:linear-gradient(to right,var(--bg),transparent);z-index:10}

.carousel-edge-r{pointer-events:none;position:absolute;right:0;top:0;bottom:0;width:8rem;background:linear-gradient(to left,var(--bg),transparent);z-index:10}



/* ── ABOUT ── */

.about-section{padding:4rem 0;position:relative}

.about-grid{display:grid;gap:2.5rem;align-items:start}

@media(min-width:1024px){.about-grid{grid-template-columns:5fr 7fr}}

.about-img-wrap{position:relative;border-radius:1rem;overflow:hidden;height:600px}

.about-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .6s ease,transform .6s ease}

.about-image.active{opacity:1;transform:translateY(0)}

.about-image:not(.active){opacity:0;transform:translateY(-24px)}

.about-scroller{height:600px;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;padding-right:.25rem}

.about-scroller::-webkit-scrollbar{display:none}

.about-slide{scroll-snap-align:start;min-height:600px;display:flex;align-items:center}

.about-tag{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;border:none;background:rgba(255,255,255,.05);padding:.375rem .75rem;backdrop-filter:blur(8px);font-size:.75rem;color:rgba(255,255,255,.82)}

.about-slide h2{margin-top:1.25rem;font-size:clamp(2rem,5vw,3.5rem);font-weight:600;color:#fff;letter-spacing:-.04em;line-height:1.05}

.about-slide p{font-size:1rem;color:rgba(255,255,255,.82);margin-top:1.5rem;line-height:1.7}

@media(min-width:768px){.about-slide p{font-size:1.1rem}}

.about-stats{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2rem}

.about-stat-card{border-radius:.75rem;background:rgba(255,255,255,.05);padding:1.5rem;position:relative;overflow:hidden}

.about-stat-icon{width:40px;height:40px;border-radius:.5rem;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}

.about-stat-card h3{font-size:1.1rem;font-weight:600;margin-bottom:.25rem}

.about-stat-card p{font-size:.8rem;color:rgba(255,255,255,.7);line-height:1.5}



/* ── SERVICES ── */

.services-section{padding:6rem 0}

.section-badge{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.05);backdrop-filter:blur(8px);border-radius:9999px;padding:.5rem 1rem;margin-bottom:1.5rem;font-size:.75rem;color:rgba(255,255,255,.82)}

.section-title{font-size:clamp(2rem,5vw,3.5rem);font-weight:600;letter-spacing:-.04em;line-height:1.05}

.services-grid{display:grid;grid-template-columns:1fr;gap:1.5rem;margin-top:3rem}

@media(min-width:640px){.services-grid{grid-template-columns:1fr 1fr}}

@media(min-width:1024px){.services-grid{grid-template-columns:repeat(3,1fr)}}

.svc-card{border-radius:1rem;background:rgba(255,255,255,.05);padding:1.5rem;backdrop-filter:blur(20px);position:relative;overflow:hidden;transition:.3s}

.svc-card:hover{background:rgba(255,255,255,.08);transform:translateY(-4px)}

.svc-icon{width:48px;height:48px;border-radius:.5rem;display:flex;align-items:center;justify-content:center;margin-bottom:1rem}

.svc-card h3{font-size:1.15rem;font-weight:600;color:#fff;letter-spacing:-.02em;margin-bottom:.5rem}

.svc-card p{font-size:.875rem;color:rgba(255,255,255,.82);line-height:1.65}

.svc-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}

.svc-tag{font-size:.7rem;padding:.25rem .625rem;border-radius:9999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.75)}



/* ── PROCESS ── */

.process-section{padding:6rem 0 2rem}

.process-line{position:absolute;left:1.25rem;top:3rem;bottom:3rem;width:1px;background:linear-gradient(to bottom,rgba(199,255,58,.8),rgba(199,255,58,.0));display:none}

@media(min-width:768px){.process-line{display:block}}

.process-steps{position:relative;display:flex;flex-direction:column;gap:1.5rem}

.step{display:flex;gap:1.25rem;align-items:flex-start}

.step-num{flex-shrink:0;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(199,255,58,.9),rgba(80,180,80,.9));display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;color:#000;position:relative;z-index:1}

.step-body{flex:1;border-radius:1rem;background:rgba(255,255,255,.05);backdrop-filter:blur(20px);padding:1.5rem;position:relative;overflow:hidden}

.step-body h3{font-size:1.1rem;font-weight:600;letter-spacing:-.02em;margin-bottom:.5rem}

.step-body p{font-size:.875rem;color:rgba(255,255,255,.75);line-height:1.65}



/* ── STATS BANNER ── */

.stats-section{padding:3rem 0}

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

@media(min-width:768px){.stats-row{grid-template-columns:repeat(4,1fr)}}

.stat-box{

  padding:2rem 1rem;border-radius:1rem;

  background:linear-gradient(135deg,rgba(199,255,58,1),rgba(150,210,30,1))!important;

  text-align:center;display:flex;flex-direction:column;justify-content:center;

  border:2px solid rgba(0,0,0,.15)!important;

  box-shadow:0 15px 35px rgba(199,255,58,.25)!important;

}

.stat-number{font-size:clamp(2rem,4vw,2.8rem);font-weight:700;color:#000!important;line-height:1;margin-bottom:.5rem;letter-spacing:-0.02em}

.stat-label{font-size:.875rem;color:rgba(0,0,0,.8)!important;font-weight:600}



/* ── TESTIMONIALS ── */

.testimonials-section{padding:6rem 0}

.testi-track{display:flex;gap:1.5rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:1rem 0 2rem;scrollbar-width:none}

.testi-track::-webkit-scrollbar{display:none}

.testi-card{flex:0 0 85%;scroll-snap-align:center;border-radius:1.25rem;padding:2.5rem;background:rgba(255,255,255,.03);display:flex;flex-direction:column;justify-content:space-between;gap:2rem;border:1px solid rgba(255,255,255,.08);transition:transform .3s,border-color .3s,background .3s;backdrop-filter:blur(12px)}

@media(min-width:768px){.testi-card{flex:0 0 45%}}

@media(min-width:1024px){.testi-card{flex:0 0 32%}}

.testi-card.featured-card{flex:0 0 85%}

@media(min-width:768px){.testi-card.featured-card{flex:0 0 65%}}

.testi-text{font-size:1rem;line-height:1.7;color:rgba(255,255,255,.88);font-style:italic}

.testi-author{display:flex;flex-direction:column;gap:.25rem;border-top:1px solid rgba(255,255,255,.1);padding-top:1.5rem}

.testi-name{font-weight:600;font-size:1.05rem;color:#fff;letter-spacing:-0.01em}

.testi-role{font-size:.85rem;color:rgba(199,255,58,.95);line-height:1.4;text-decoration-line:underline;text-decoration-style:dotted;text-underline-offset:3px}

.quote-icon{color:rgba(199,255,58,.4);margin-bottom:.5rem;width:32px;height:32px}



/* ── EXTRA TESTIMONIALS ── */

.extra-testi-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-top:2rem;max-height:0;overflow:hidden;transition:max-height .6s cubic-bezier(.25,1,.5,1),opacity .6s ease;opacity:0}

.extra-testi-grid.expanded{max-height:2500px;opacity:1}

@media(min-width:640px){.extra-testi-grid{grid-template-columns:1fr 1fr}}

@media(min-width:1024px){.extra-testi-grid{grid-template-columns:repeat(3,1fr)}}

.extra-testi-card{padding:1.5rem;background:rgba(255,255,255,.04);border-radius:1rem;border:1px solid rgba(255,255,255,.08);font-size:.875rem;color:rgba(255,255,255,.8);display:flex;flex-direction:column;justify-content:space-between;gap:1rem}

.extra-author{font-size:.8rem;color:rgba(199,255,58,.9);font-weight:500;text-decoration-line:underline;text-decoration-style:dotted;text-underline-offset:3px}



/* ── TICKER ── */

.ticker-section{padding:2rem 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06);overflow:hidden;position:relative}

.ticker-track{display:flex;gap:0;animation:tickerMove 30s linear infinite;white-space:nowrap}

.ticker-track.paused{animation-play-state:paused}

.ticker-item{display:inline-flex;align-items:center;gap:.75rem;padding:0 2.5rem;font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}

.ticker-sep{color:rgba(199,255,58,.6);font-size:.5rem}

.ticker-pause-btn{

  position:absolute;right:1rem;top:50%;transform:translateY(-50%);

  z-index:10;

  background:rgba(0,0,0,.6);

  border:1px solid rgba(255,255,255,.2);

  border-radius:50%;

  width:32px;height:32px;

  display:flex;align-items:center;justify-content:center;

  color:#fff;

  font-size:.75rem;

  transition:.2s;

  min-height:var(--touch-min);

  min-width:var(--touch-min);

}

.ticker-pause-btn:hover{background:rgba(0,0,0,.85);border-color:rgba(199,255,58,.5)}



/* ── PROJECTS ── */

.projects-section{padding:6rem 0}

.projects-grid{display:grid;grid-template-columns:1fr;gap:1.25rem;margin-top:3rem}

@media(min-width:640px){.projects-grid{grid-template-columns:1fr 1fr}}

@media(min-width:1024px){.projects-grid{grid-template-columns:repeat(3,1fr)}}

.proj-card{border-radius:1rem;background:rgba(255,255,255,.05);padding:1.5rem;backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);transition:.3s;position:relative;overflow:hidden;display:block;text-decoration:none}

.proj-card::after{content:"";position:absolute;inset-x:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,rgba(199,255,58,.6),transparent);transform:scaleX(0);transform-origin:center;transition:.4s}

.proj-card:hover::after{transform:scaleX(1)}

.proj-card:hover{transform:translateY(-4px);border-color:rgba(199,255,58,.2);background:rgba(255,255,255,.07)}

.proj-logo{width:60px;height:60px;border-radius:.875rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:1rem;transition:.2s}

.proj-logo img{max-width:40px;max-height:40px;object-fit:contain}

.proj-card:hover .proj-logo{border-color:rgba(199,255,58,.3);background:rgba(199,255,58,.06)}

.proj-card h3{font-size:1.15rem;font-weight:600;color:#fff;margin-bottom:.375rem;letter-spacing:-.02em}

.proj-card p{font-size:.875rem;color:rgba(255,255,255,.75);line-height:1.65}

.proj-arrow{position:absolute;top:1.25rem;right:1.25rem;width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.3);font-size:.8rem;transition:.2s;opacity:0;transform:translateY(4px)}

.proj-card:hover .proj-arrow{opacity:1;transform:translateY(0);border-color:rgba(199,255,58,.5);color:rgba(199,255,58,.8)}



/* ── CTA / CONTACT ── */

.cta-section{padding:8rem 1.5rem;background:center/cover no-repeat url('https://albinojr.com/wp-content/uploads/2025/10/MesaRedondaIA_EricaFernanda-25-1024x683-1.jpg');position:relative}

.cta-section::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.82)}

.cta-inner{position:relative;z-index:1;max-width:56rem;margin:0 auto;text-align:center;border-radius:1.5rem;background:rgba(255,255,255,.05);padding:3rem 2rem;backdrop-filter:blur(24px)}

@media(min-width:768px){.cta-inner{padding:3.5rem}}

.cta-section h2{font-size:clamp(1.8rem,4vw,3.2rem);font-weight:600;letter-spacing:-.04em;color:#fff;margin-bottom:1rem}

.cta-section p{font-size:1rem;color:rgba(255,255,255,.85);max-width:36rem;margin:0 auto 2rem}

@media(min-width:768px){.cta-section p{font-size:1.1rem}}

.cta-btns{display:flex;flex-direction:column;gap:.75rem;align-items:center;justify-content:center;margin-bottom:2rem}

@media(min-width:640px){.cta-btns{flex-direction:row}}

.btn-primary-cta{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;padding:.75rem 1.5rem;font-size:.875rem;font-weight:700;color:#000;background:linear-gradient(135deg,rgba(199,255,58,1),rgba(140,220,30,1));transition:.2s;box-shadow:0 0 0 2px rgba(199,255,58,.4),0 40px 80px rgba(199,255,58,.12);min-height:var(--touch-min);border:2px solid rgba(0,0,0,.15)}

.btn-primary-cta:hover{opacity:.9;transform:translateY(-1px)}

.btn-ghost-cta{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;padding:.75rem 1.5rem;font-size:.875rem;font-weight:500;color:rgba(255,255,255,.9);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.2);transition:.2s;min-height:var(--touch-min)}

.btn-ghost-cta:hover{background:rgba(255,255,255,.12);color:#fff}

.cta-socials{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1.5rem;font-size:.875rem;color:rgba(255,255,255,.75);border-top:1px solid rgba(255,255,255,.1);padding-top:1.5rem}

.cta-socials a{display:inline-flex;align-items:center;gap:.5rem;transition:.2s;min-height:var(--touch-min)}

.cta-socials a:hover{color:#fff}



/* ── FOOTER ── */

footer{background:var(--header);border-top:1px solid rgba(255,255,255,.06);padding:4rem 0 1.5rem}

.footer-grid{display:grid;gap:3rem;margin-bottom:3rem}

@media(min-width:768px){.footer-grid{grid-template-columns:2fr 1fr 1fr 1fr}}

.footer-brand img{height:22px;margin-bottom:1rem}

.footer-brand p{font-size:.875rem;color:rgba(255,255,255,.65);line-height:1.7;max-width:240px}

.footer-social{display:flex;gap:.625rem;margin-top:1.25rem}

.footer-social a{width:var(--touch-min);height:var(--touch-min);border-radius:.5rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);transition:.2s}

.footer-social a:hover{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.2)}

.footer-col h3{font-size:.875rem;font-weight:600;color:#fff;margin-bottom:1rem}

.footer-col ul{list-style:none}

.footer-col ul li{margin-bottom:.75rem}

.footer-col ul li a,.footer-col ul li span{font-size:.875rem;color:rgba(255,255,255,.65);transition:.2s}

.footer-col ul li a:hover{color:#fff}

.footer-col .contact-item{display:flex;align-items:flex-start;gap:.5rem}

.footer-bottom{border-top:1px solid rgba(255,255,255,.06);padding-top:1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:1rem;text-align:center}

@media(min-width:768px){.footer-bottom{flex-direction:row;text-align:left}}

.footer-bottom p{font-size:.75rem;color:rgba(255,255,255,.55)}

.footer-bottom-links{display:flex;align-items:center;gap:1.5rem}

.footer-bottom-links a{font-size:.75rem;color:rgba(255,255,255,.55);transition:.2s;min-height:var(--touch-min);display:inline-flex;align-items:center}

.footer-bottom-links a:hover{color:rgba(255,255,255,.8)}



/* ── WHATSAPP FLOAT ── */

.wa-btn{

  position:fixed;bottom:1.75rem;right:1.75rem;z-index:9000;

  width:56px;height:56px;

  background:#25D366;border-radius:50%;

  display:flex;align-items:center;justify-content:center;

  box-shadow:0 8px 32px rgba(37,211,102,.4);

  transition:.25s;

  min-width:var(--touch-min);min-height:var(--touch-min);

}

.wa-btn:hover{transform:scale(1.1)}



/* ── RESPONSIVE ── */

@media(max-width:767px){

  .hero{padding:0 1rem 4rem}

  .cta-inner{padding:2rem 1.25rem}

  .footer-grid{grid-template-columns:1fr}

  .footer-brand p{max-width:100%}

}



/* ── MODO CLARO — CORREÇÕES DE CONTRASTE ── */

html:not(.dark) .hero h1,

html:not(.dark) .hero h1 .line,

html:not(.dark) .hero h1 .line-muted,

html:not(.dark) .section-title,

html:not(.dark) .about-slide h2,

html:not(.dark) .svc-card h3,

html:not(.dark) .step-body h3,

html:not(.dark) .proj-card h3,

html:not(.dark) .footer-col h3,

html:not(.dark) .testi-name,

html:not(.dark) .stat-number{color:#111!important}



html:not(.dark) .hero-sub,

html:not(.dark) .hero-stats,

html:not(.dark) .about-slide p,

html:not(.dark) .svc-card p,

html:not(.dark) .step-body p,

html:not(.dark) .proj-card p,

html:not(.dark) .section-badge,

html:not(.dark) .about-tag,

html:not(.dark) .hero-badge,

html:not(.dark) .nav-links,

html:not(.dark) .nav-cta,

html:not(.dark) .hero-ghost-btn,

html:not(.dark) .footer-brand p,

html:not(.dark) .footer-col ul li a,

html:not(.dark) .footer-col ul li span,

html:not(.dark) .footer-bottom p,

html:not(.dark) .footer-bottom-links a,

html:not(.dark) .ticker-item,

html:not(.dark) .testi-text,

html:not(.dark) .extra-testi-card,

html:not(.dark) .stat-label{color:rgba(0,0,0,.75)!important}



html:not(.dark) .section-badge,

html:not(.dark) .about-tag,

html:not(.dark) .hero-badge,

html:not(.dark) .hero-ghost-btn,

html:not(.dark) .nav-cta,

html:not(.dark) .svc-card,

html:not(.dark) .step-body,

html:not(.dark) .proj-card,

html:not(.dark) .about-stat-card,

html:not(.dark) .testi-card,

html:not(.dark) .extra-testi-card{background:rgba(255,255,255,.85)!important;border-color:rgba(0,0,0,.15)!important}



html:not(.dark) .testi-role,

html:not(.dark) .extra-author{color:#3d6600!important}



html:not(.dark) .border-gradient::before{background:linear-gradient(135deg,rgba(0,0,0,.16) 0%,rgba(0,0,0,.04) 50%,rgba(0,0,0,.10) 100%)!important}



html:not(.dark) .carousel-header h2,

html:not(.dark) .carousel-header p,

html:not(.dark) .projects-section h2,

html:not(.dark) .projects-section p,

html:not(.dark) .services-section h2,

html:not(.dark) .services-section p,

html:not(.dark) .process-section h2,

html:not(.dark) .process-section p,

html:not(.dark) .testimonials-section h2,

html:not(.dark) .testimonials-section p{color:#111!important}



html:not(.dark) [style*="color:#fff"],

html:not(.dark) [style*="color: #fff"]{color:#111!important}

html:not(.dark) [style*="rgba(255,255,255,.7)"],

html:not(.dark) [style*="rgba(255,255,255,.8)"],

html:not(.dark) [style*="rgba(255, 255, 255, .7)"],

html:not(.dark) [style*="rgba(255, 255, 255, .8)"]{color:rgba(0,0,0,.75)!important}



/* ── REVEAL ── */

.reveal{opacity:0;transform:translateY(48px);filter:blur(10px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),filter .9s cubic-bezier(.16,1,.3,1)}

.reveal.is-visible{opacity:1;transform:translateY(0);filter:blur(0)}

.reveal-delay-1{transition-delay:.1s}

.reveal-delay-2{transition-delay:.2s}

.reveal-delay-3{transition-delay:.3s}



/* ── TIPOGRAFIA PREMIUM ── */

h1,h2,h3,.section-title{letter-spacing:-0.04em!important}

.hero h1 .line{font-weight:800!important;text-shadow:0 10px 30px rgba(0,0,0,0.6)}

.hero-sub{font-weight:500!important;letter-spacing:-0.01em;text-shadow:0 4px 15px rgba(0,0,0,0.5)}



/* ── HERO FINAL ── */

.hero::before,.hero::after{display:none!important}

.hero{min-height:100vh!important;align-items:flex-start!important;justify-content:center!important;text-align:left!important;padding:8rem 0 4rem 6vw!important;overflow:hidden!important}

.hero-title{max-width:760px!important;margin:0 0 2rem 0!important;padding:0!important;color:#fff!important;font-family:'Plus Jakarta Sans',system-ui,sans-serif!important;font-weight:800!important;letter-spacing:-0.055em!important;line-height:.93!important;text-shadow:0 16px 42px rgba(0,0,0,.65)!important}

.hero-title .line,.hero h1 .line{display:block!important;font-size:clamp(3.4rem,5.25vw,5.8rem)!important;font-weight:800!important;line-height:.93!important}

.accent-word{color:#C7FF3A!important}

.hero-sub{max-width:430px!important;margin:0 0 2.2rem 0!important;color:rgba(255,255,255,.92)!important;font-size:clamp(1rem,1.25vw,1.25rem)!important;font-weight:500!important;line-height:1.45!important;text-shadow:0 8px 22px rgba(0,0,0,.55)!important}

.hero-actions{margin-top:0!important;justify-content:flex-start!important}

.shiny-cta{background:#C7FF3A!important;color:#000!important;border:2px solid rgba(0,0,0,.15)!important;padding:1rem 1.7rem!important;font-weight:800!important;box-shadow:0 18px 46px rgba(199,255,58,.32)!important}

.hero-stats{margin-top:4.8rem!important;padding:0!important;justify-content:flex-start!important;gap:2.4rem!important;color:#fff!important}

.hero-stat{color:#fff!important;font-weight:600!important}

.hero-stat svg{color:#C7FF3A!important}

html:not(.dark) .hero h1,html:not(.dark) .hero h1 .line,html:not(.dark) .hero h1 .line-muted,html:not(.dark) .hero-sub,html:not(.dark) .hero-stats{color:#fff!important;text-shadow:0 14px 40px rgba(0,0,0,.5)!important}



/* Header */

header{background:rgba(0,0,0,.78)!important;backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important;border-bottom:1px solid rgba(255,255,255,.1)!important}

.nav-links a,.nav-cta,.theme-toggle{color:#fff!important}

.nav-logo img{filter:invert(1) brightness(200%)!important}



/* Theme toggle */

.theme-toggle{position:relative;z-index:50;display:inline-flex;align-items:center;gap:.5rem;border:1px solid rgba(255,255,255,.2);border-radius:9999px;padding:.75rem 1.1rem;background:var(--card);color:var(--text);font-size:.875rem;font-weight:500;min-height:var(--touch-min);white-space:nowrap}

.theme-toggle:hover{transform:translateY(-2px)}



@media(max-width:767px){

  .hero{padding:7rem 1.25rem 4rem!important}

  .hero-title .line{font-size:clamp(2.45rem,12vw,4rem)!important}

  .hero-stats{flex-direction:column!important;align-items:flex-start!important;gap:1rem!important;margin-top:3rem!important}

}



/* ── ABOUT ANIMATION ── */

.about-image{transition:opacity .9s cubic-bezier(.25,1,.5,1),transform .9s cubic-bezier(.25,1,.5,1)!important}

.about-image.active{opacity:1!important;transform:scale(1) translateY(0)!important;z-index:2}

.about-image:not(.active){opacity:0!important;transform:scale(1.04) translateY(-8px)!important;z-index:1}

.about-slide > div{opacity:.15;transform:translateY(24px) scale(.98);transition:opacity .8s cubic-bezier(.25,1,.5,1),transform .8s cubic-bezier(.25,1,.5,1)}

.about-slide.active-text > div{opacity:1;transform:translateY(0) scale(1)}



/* ── CAROUSEL CARD FOCUSED (teclado) ── */

.carousel-card:focus{

  outline:3px solid #C7FF3A!important;

  outline-offset:-3px!important;

  transform:scale(1.03);

}

