/* =========================================================
   ELENCO — SPECTRUM
   Light premium, disciplined per-public accents, rich motion.
   ========================================================= */

:root{
  /* base — warm light, never sterile white */
  --bg:        #f6f7f9;
  --bg-2:      #eef0f4;
  --surface:   #ffffff;
  --surface-2: #fbfcfe;
  --ink:       #0e1518;
  --ink-2:     #2b3a40;
  --muted:     #5c6b72;
  --muted-2:   #85939a;
  --line:      rgba(14,21,24,.08);
  --line-2:    rgba(14,21,24,.05);

  /* brand green (from app) */
  --brand:     #12a866;
  --brand-700: #0c8a52;
  --brand-300: #57d29b;

  /* SPECTRUM — one accent per public/frente (disciplined, not rainbow) */
  --c-builder: #12a866;  /* empreendedor — green */
  --c-creator: #e0792b;  /* criador — amber/terracotta */
  --c-market:  #c6447e;  /* marketing — magenta-rose */
  --c-dev:     #3f6ee0;  /* dev — indigo-blue */
  --c-team:    #0f9a9a;  /* pequena empresa — teal */
  --c-curious: #7a5cd6;  /* curioso — violet (single, controlled) */

  --radius:   18px;
  --radius-lg:26px;
  --radius-sm:12px;

  --shadow-sm: 0 1px 2px rgba(16,28,32,.05), 0 2px 6px rgba(16,28,32,.04);
  --shadow:    0 12px 30px -12px rgba(16,28,32,.18), 0 6px 14px -8px rgba(16,28,32,.10);
  --shadow-lg: 0 40px 80px -32px rgba(16,28,32,.30), 0 16px 40px -20px rgba(16,28,32,.18);

  --ease: cubic-bezier(.22,.61,.27,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --maxw: 1200px;
  --accent: var(--c-builder);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,system-ui,sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }

.container{ width:min(var(--maxw),92vw); margin-inline:auto; }

/* =========================================================
   AMBIENT FIELD
   ========================================================= */
.ambient{ position:fixed; inset:0; z-index:-2; overflow:hidden; pointer-events:none; }
.ambient__mesh{
  position:absolute; inset:-20%;
  background:
    radial-gradient(48% 38% at 18% 12%, rgba(18,168,102,.12), transparent 60%),
    radial-gradient(42% 36% at 84% 8%,  rgba(63,110,224,.10), transparent 62%),
    radial-gradient(46% 40% at 92% 70%, rgba(198,68,126,.08), transparent 64%),
    radial-gradient(50% 42% at 8% 84%,  rgba(15,154,154,.10), transparent 64%);
  filter:saturate(1.05);
}
.ambient__aurora{
  position:absolute; border-radius:50%;
  filter:blur(80px); opacity:.55; mix-blend-mode:multiply;
  will-change:transform;
}
.a1{ width:42vw; height:42vw; left:-8vw; top:-6vw;
  background:radial-gradient(circle, rgba(18,168,102,.40), transparent 70%);
  animation:drift1 26s var(--ease) infinite alternate; }
.a2{ width:38vw; height:38vw; right:-6vw; top:6vw;
  background:radial-gradient(circle, rgba(63,110,224,.32), transparent 70%);
  animation:drift2 32s var(--ease) infinite alternate; }
.a3{ width:46vw; height:46vw; left:30vw; top:60vh;
  background:radial-gradient(circle, rgba(15,154,154,.28), transparent 70%);
  animation:drift3 30s var(--ease) infinite alternate; }
@keyframes drift1{ to{ transform:translate(8vw,6vh) scale(1.12); } }
@keyframes drift2{ to{ transform:translate(-6vw,8vh) scale(1.08); } }
@keyframes drift3{ to{ transform:translate(4vw,-8vh) scale(1.14); } }
.ambient__grain{
  position:absolute; inset:0; opacity:.4; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

/* =========================================================
   ICONS (inline css-mask, phosphor-ish line)
   ========================================================= */
.ic{ display:inline-block; width:1em; height:1em; background:currentColor;
  -webkit-mask-size:contain; mask-size:contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center; mask-position:center; vertical-align:-.12em; flex:none; }
.ic-shield{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.5-3 7.7-7 9-4-1.3-7-4.5-7-9V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.5-3 7.7-7 9-4-1.3-7-4.5-7-9V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E"); }
.ic-users{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 20a6 6 0 0112 0'/%3E%3Cpath d='M16 6a3 3 0 010 6'/%3E%3Cpath d='M17 14a6 6 0 014 6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 20a6 6 0 0112 0'/%3E%3Cpath d='M16 6a3 3 0 010 6'/%3E%3Cpath d='M17 14a6 6 0 014 6'/%3E%3C/svg%3E"); }
.ic-spark{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v4M12 17v4M3 12h4M17 12h4M6 6l2.5 2.5M15.5 15.5L18 18M18 6l-2.5 2.5M8.5 15.5L6 18'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v4M12 17v4M3 12h4M17 12h4M6 6l2.5 2.5M15.5 15.5L18 18M18 6l-2.5 2.5M8.5 15.5L6 18'/%3E%3C/svg%3E"); }
.ic-check{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12l5 5L20 6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12l5 5L20 6'/%3E%3C/svg%3E"); }
.ic-rocket{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 15c-1 2-1 4-1 4s2 0 4-1m-3-3c0-5 3-10 9-11 0 6-5 9-10 9zm6-6a2 2 0 100-4 2 2 0 000 4z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 15c-1 2-1 4-1 4s2 0 4-1m-3-3c0-5 3-10 9-11 0 6-5 9-10 9zm6-6a2 2 0 100-4 2 2 0 000 4z'/%3E%3C/svg%3E"); }
.ic-pen{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20l4-1L19 8a2 2 0 00-3-3L5 16z'/%3E%3Cpath d='M14 7l3 3'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20l4-1L19 8a2 2 0 00-3-3L5 16z'/%3E%3Cpath d='M14 7l3 3'/%3E%3C/svg%3E"); }
.ic-mega{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11v2a2 2 0 002 2h2l8 4V5L7 9H5a2 2 0 00-2 2z'/%3E%3Cpath d='M19 9a3 3 0 010 6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11v2a2 2 0 002 2h2l8 4V5L7 9H5a2 2 0 00-2 2z'/%3E%3Cpath d='M19 9a3 3 0 010 6'/%3E%3C/svg%3E"); }
.ic-code{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8l-4 4 4 4M16 8l4 4-4 4M13 6l-2 12'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8l-4 4 4 4M16 8l4 4-4 4M13 6l-2 12'/%3E%3C/svg%3E"); }
.ic-building{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='16' rx='1'/%3E%3Cpath d='M9 8h2M13 8h2M9 12h2M13 12h2M10 20v-3h4v3'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='16' rx='1'/%3E%3Cpath d='M9 8h2M13 8h2M9 12h2M13 12h2M10 20v-3h4v3'/%3E%3C/svg%3E"); }
.ic-compass{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.5 8.5l-2 5-5 2 2-5z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.5 8.5l-2 5-5 2 2-5z'/%3E%3C/svg%3E"); }
.ic-copy{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V5a2 2 0 012-2h8'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V5a2 2 0 012-2h8'/%3E%3C/svg%3E"); }
.ic-power{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v8'/%3E%3Cpath d='M7 7a7 7 0 109 0'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v8'/%3E%3Cpath d='M7 7a7 7 0 109 0'/%3E%3C/svg%3E"); }
.ic-plus{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E"); }

/* =========================================================
   NAV
   ========================================================= */
.nav{ position:fixed; top:0; left:0; right:0; z-index:50; transition:transform .4s var(--ease); }
.nav__inner{
  width:min(var(--maxw),94vw); margin:14px auto 0; padding:10px 12px 10px 16px;
  display:flex; align-items:center; gap:18px;
  background:rgba(255,255,255,.62);
  backdrop-filter:blur(18px) saturate(1.4); -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:var(--shadow-sm), inset 0 1px 0 rgba(255,255,255,.8);
  border-radius:999px;
  transition:box-shadow .3s var(--ease), background .3s var(--ease), margin .3s var(--ease);
}
.nav.scrolled .nav__inner{ background:rgba(255,255,255,.82); box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.9); margin-top:8px; }

.brand{ display:inline-flex; align-items:center; gap:9px; font-weight:800; letter-spacing:-.02em; }
.brand__mark svg{ display:block; }
.bm-bg{ fill:#fff; stroke:rgba(14,21,24,.10); stroke-width:1.4; }
.brand__mark .bm-b1{ fill:#a7b7af; }
.brand__mark .bm-b2{ fill:var(--brand); transform-origin:center; }
.brand__mark .bm-b3{ fill:#c3d0c9; }
.brand:hover .bm-b2{ animation:pulseBar 1.1s var(--ease) infinite; }
.brand:hover .bm-b1{ animation:pulseBar 1.1s var(--ease) infinite .12s; }
.brand:hover .bm-b3{ animation:pulseBar 1.1s var(--ease) infinite .24s; }
@keyframes pulseBar{ 50%{ transform:scaleY(1.18); } }
.brand__word{ font-size:1.18rem; }

.nav__links{ display:flex; gap:4px; margin-left:6px; }
.nav__links a{ position:relative; padding:8px 12px; font-size:.92rem; font-weight:550; color:var(--ink-2); border-radius:999px; transition:color .2s, background .2s; }
.nav__links a::after{ content:""; position:absolute; left:12px; right:12px; bottom:5px; height:2px; background:var(--brand); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease-out); }
.nav__links a:hover{ color:var(--ink); }
.nav__links a:hover::after{ transform:scaleX(1); }

.nav__cta{ margin-left:auto; display:flex; gap:8px; align-items:center; }
.nav__burger{ display:none; margin-left:auto; width:42px; height:42px; border-radius:12px; border:1px solid var(--line); background:var(--surface); flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.nav__burger span{ width:18px; height:2px; background:var(--ink); border-radius:2px; transition:.3s; }

/* =========================================================
   BUTTONS
   ========================================================= */
.btn{ display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:999px; font-weight:650; font-size:.93rem; border:1px solid transparent; transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s; white-space:nowrap; }
.btn:active{ transform:translateY(1px) scale(.99); }
.btn--lg{ padding:14px 24px; font-size:1rem; }

.btn--solid{ position:relative; color:#fff; background:linear-gradient(180deg,#19b873,var(--brand) 60%,var(--brand-700)); box-shadow:0 8px 20px -8px rgba(18,168,102,.55), inset 0 1px 0 rgba(255,255,255,.35); overflow:hidden; }
.btn--solid::before{ content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.45) 50%,transparent 80%); transform:translateX(-130%); transition:transform .7s var(--ease); }
.btn--solid:hover{ transform:translateY(-2px); box-shadow:0 16px 34px -10px rgba(18,168,102,.6), inset 0 1px 0 rgba(255,255,255,.4); }
.btn--solid:hover::before{ transform:translateX(130%); }
.btn--solid svg{ transition:transform .3s var(--ease); }
.btn--solid:hover svg{ transform:translateX(3px); }

.btn--ghost{ color:var(--ink-2); background:rgba(14,21,24,.04); }
.btn--ghost:hover{ background:rgba(14,21,24,.08); color:var(--ink); }
.btn--line{ color:var(--ink); background:var(--surface); border-color:var(--line); box-shadow:var(--shadow-sm); }
.btn--line:hover{ transform:translateY(-2px); box-shadow:var(--shadow); border-color:rgba(18,168,102,.35); }

/* =========================================================
   HERO
   ========================================================= */
.hero{ padding:148px 0 0; position:relative; }
.hero__inner{ width:min(var(--maxw),92vw); margin-inline:auto; display:grid; grid-template-columns:1.05fr .95fr; gap:54px; align-items:center; }

.eyebrow{ display:inline-flex; align-items:center; gap:9px; padding:7px 14px 7px 11px; border-radius:999px; font-size:.82rem; font-weight:600; color:var(--brand-700); background:rgba(18,168,102,.09); border:1px solid rgba(18,168,102,.2); margin-bottom:22px; transition:transform .25s var(--ease), background .25s; }
.eyebrow:hover{ transform:translateY(-1px); background:rgba(18,168,102,.14); }
.eyebrow__dot{ width:8px; height:8px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 0 rgba(18,168,102,.6); animation:pulseDot 2s infinite; }
@keyframes pulseDot{ 0%{ box-shadow:0 0 0 0 rgba(18,168,102,.5);} 70%{ box-shadow:0 0 0 8px rgba(18,168,102,0);} 100%{ box-shadow:0 0 0 0 rgba(18,168,102,0);} }

.hero__title{ font-size:clamp(2.4rem,5vw,3.9rem); line-height:1.04; letter-spacing:-.03em; font-weight:830; color:var(--ink); }
.grad-word{ background:linear-gradient(100deg,var(--brand) 0%,#0f9a9a 45%,#3f6ee0 100%); -webkit-background-clip:text; background-clip:text; color:transparent; background-size:200% auto; animation:hue 8s ease infinite; }
@keyframes hue{ 50%{ background-position:right center; } }

.hero__sub{ margin-top:22px; font-size:1.12rem; color:var(--ink-2); max-width:38ch; }
.hero__actions{ margin-top:30px; display:flex; gap:12px; flex-wrap:wrap; }
.hero__chips{ list-style:none; display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:30px; }
.hero__chips li{ display:inline-flex; align-items:center; gap:8px; font-size:.9rem; color:var(--muted); font-weight:550; }
.hero__chips .ic{ font-size:1.05rem; color:var(--brand); }

/* hero stage */
.hero__stage{ position:relative; }
.stage__glow{ position:absolute; inset:-12% -8%; background:radial-gradient(60% 50% at 60% 40%, rgba(18,168,102,.18), transparent 70%); filter:blur(20px); z-index:-1; }

.frame{ position:relative; border-radius:var(--radius-lg); background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.7)); border:1px solid rgba(255,255,255,.8); box-shadow:var(--shadow-lg); overflow:hidden; backdrop-filter:blur(6px); transition:transform .4s var(--ease); will-change:transform; }
.frame--app{ transform:perspective(1400px) rotateY(-7deg) rotateX(3deg); }
.frame__bar{ display:flex; align-items:center; gap:7px; padding:11px 14px; background:linear-gradient(180deg,#fbfcfe,#f1f3f7); border-bottom:1px solid var(--line); }
.dot{ width:11px; height:11px; border-radius:50%; }
.dot.r{ background:#ff6159; } .dot.y{ background:#ffbd2e; } .dot.g{ background:#28c840; }
.frame__title{ margin-left:8px; font-size:.82rem; color:var(--muted); font-weight:600; }
.frame__pill{ margin-left:auto; display:inline-flex; align-items:center; gap:6px; font-size:.74rem; color:var(--brand-700); background:rgba(18,168,102,.1); padding:4px 9px; border-radius:999px; font-weight:600; }
.live{ width:7px; height:7px; border-radius:50%; background:var(--brand); animation:pulseDot 1.8s infinite; }
.frame__shot{ position:relative; }
.frame__shot img{ width:100%; }
.frame__shot::after{ content:""; position:absolute; inset:0; background:linear-gradient(135deg, rgba(255,255,255,.18), transparent 40%); pointer-events:none; }

.float-card{ position:absolute; display:flex; align-items:center; gap:11px; padding:11px 14px; background:rgba(255,255,255,.86); backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.85); border-radius:14px; box-shadow:var(--shadow); }
.float-card strong{ display:block; font-size:.84rem; }
.float-card span{ display:block; font-size:.76rem; color:var(--muted); }
.fc-1{ left:-28px; top:24%; animation:floaty 5.5s var(--ease) infinite; }
.fc-2{ right:-22px; bottom:14%; animation:floaty 6.2s var(--ease) infinite .8s; }
@keyframes floaty{ 50%{ transform:translateY(-12px); } }
.fc__avatar{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center; font-size:.72rem; font-weight:800; color:#fff; background:var(--c); }
.fc__check{ width:30px; height:30px; border-radius:9px; display:grid; place-items:center; color:#fff; background:linear-gradient(180deg,#19b873,var(--brand)); }

/* marquee */
.marquee{ margin-top:84px; padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.marquee__track{ display:flex; align-items:center; gap:26px; white-space:nowrap; width:max-content; animation:scrollx 38s linear infinite; }
.marquee__track span{ font-weight:600; color:var(--ink-2); font-size:1rem; }
.marquee__track i{ color:var(--brand); font-style:normal; }
@keyframes scrollx{ to{ transform:translateX(-50%); } }

/* =========================================================
   SECTION SHELL
   ========================================================= */
.section{ padding:104px 0; position:relative; }
.sec-head{ max-width:60ch; margin:0 auto 52px; text-align:center; }
.sec-head--left{ margin-inline:0; text-align:left; }
.kicker{ --accent:var(--brand); display:inline-block; font-size:.78rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); padding:5px 12px; border-radius:999px; background:color-mix(in srgb, var(--accent) 10%, transparent); border:1px solid color-mix(in srgb, var(--accent) 22%, transparent); margin-bottom:18px; }
.sec-title{ font-size:clamp(1.9rem,3.6vw,2.85rem); line-height:1.1; letter-spacing:-.025em; font-weight:800; color:var(--ink); }
.sec-lead{ margin-top:16px; font-size:1.1rem; color:var(--ink-2); }
.muted{ color:var(--muted); }

/* =========================================================
   FRENTES
   ========================================================= */
.frentes__grid{ display:grid; grid-template-columns:330px 1fr; gap:24px; align-items:start; }
.fsel{ display:flex; flex-direction:column; gap:8px; position:sticky; top:96px; }
.fsel__btn{ --accent:var(--brand); display:flex; align-items:center; gap:13px; text-align:left; padding:15px 16px; border-radius:14px; border:1px solid var(--line); background:var(--surface); color:var(--ink-2); font-weight:600; font-size:.96rem; box-shadow:var(--shadow-sm); transition:transform .25s var(--ease), box-shadow .25s var(--ease), color .2s, border-color .2s; }
.fsel__btn .ic{ font-size:1.25rem; color:var(--accent); width:38px; height:38px; display:grid; place-items:center; border-radius:11px; background:color-mix(in srgb,var(--accent) 12%,transparent); flex:none; }
.fsel__btn:hover{ transform:translateX(4px); box-shadow:var(--shadow); color:var(--ink); }
.fsel__btn.is-active{ border-color:color-mix(in srgb,var(--accent) 45%,transparent); color:var(--ink); box-shadow:0 14px 30px -16px color-mix(in srgb,var(--accent) 60%,transparent); background:color-mix(in srgb,var(--accent) 5%,var(--surface)); }
.fsel__btn.is-active .ic{ background:var(--accent); color:#fff; }

.fpanels{ position:relative; min-height:380px; }
.fpanel{ --accent:var(--brand); position:absolute; inset:0; padding:42px; border-radius:var(--radius-lg); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow); overflow:hidden; opacity:0; visibility:hidden; transform:translateY(14px) scale(.99); transition:opacity .5s var(--ease), transform .5s var(--ease); }
.fpanel.is-active{ opacity:1; visibility:visible; transform:none; position:relative; }
.fpanel__glow{ position:absolute; inset:-40% -10% auto auto; width:60%; height:120%; background:radial-gradient(circle at 70% 20%, color-mix(in srgb,var(--accent) 26%,transparent), transparent 60%); filter:blur(8px); pointer-events:none; }
.fpanel__tag{ display:inline-flex; align-items:center; gap:9px; font-size:.84rem; font-weight:700; color:var(--accent); padding:6px 13px; border-radius:999px; background:color-mix(in srgb,var(--accent) 11%,transparent); border:1px solid color-mix(in srgb,var(--accent) 25%,transparent); margin-bottom:20px; }
.fpanel h3{ font-size:clamp(1.4rem,2.4vw,1.85rem); letter-spacing:-.02em; line-height:1.18; color:var(--ink); max-width:24ch; }
.fpanel > p{ margin-top:14px; font-size:1.08rem; color:var(--ink-2); max-width:50ch; }
.fpanel__ex{ list-style:none; margin-top:28px; display:grid; gap:12px; }
.fpanel__ex li{ position:relative; padding:14px 16px 14px 46px; border-radius:13px; background:color-mix(in srgb,var(--accent) 5%,var(--surface-2)); border:1px solid var(--line-2); color:var(--ink-2); font-weight:520; transition:transform .25s var(--ease), background .25s; }
.fpanel__ex li::before{ content:""; position:absolute; left:15px; top:50%; transform:translateY(-50%); width:20px; height:20px; border-radius:6px; background:var(--accent); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/14px no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/14px no-repeat; }
.fpanel__ex li:hover{ transform:translateX(5px); background:color-mix(in srgb,var(--accent) 9%,var(--surface-2)); }

/* =========================================================
   CRIAR
   ========================================================= */
.criar{ background:linear-gradient(180deg,transparent, rgba(224,121,43,.04), transparent); }
.criar__inner{ display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:center; }
.trait-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.trait{ padding:8px 15px; border-radius:999px; font-size:.88rem; font-weight:600; color:var(--ink-2); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm); transition:transform .2s var(--ease), color .2s, border-color .2s; }
.trait:hover{ transform:translateY(-2px); color:var(--c-creator); border-color:color-mix(in srgb,var(--c-creator) 40%,transparent); }

.builder{ padding:26px; border-radius:var(--radius-lg); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-lg); position:relative; overflow:hidden; }
.builder::before{ content:""; position:absolute; inset:-40% auto auto -20%; width:60%; height:60%; background:radial-gradient(circle,var(--c-creator),transparent 70%); opacity:.12; filter:blur(20px); }
.builder__head{ display:flex; align-items:center; gap:13px; padding-bottom:18px; border-bottom:1px solid var(--line); margin-bottom:20px; }
.builder__avatar{ width:48px; height:48px; border-radius:13px; display:grid; place-items:center; font-weight:800; color:#fff; background:var(--c); box-shadow:0 8px 18px -8px var(--c); transition:background .4s; }
.builder__head strong{ display:block; font-size:1.02rem; }
.builder__head > div span{ font-size:.84rem; color:var(--muted); }
.builder__live{ margin-left:auto; display:inline-flex; align-items:center; gap:6px; font-size:.74rem; color:var(--c-creator); background:color-mix(in srgb,var(--c-creator) 12%,transparent); padding:5px 10px; border-radius:999px; font-weight:600; }
.builder__live .live{ background:var(--c-creator); }
.builder__field{ margin-bottom:18px; }
.builder__field > label{ display:block; font-size:.82rem; font-weight:650; color:var(--muted); margin-bottom:9px; }
.seg{ display:flex; gap:6px; background:var(--bg-2); padding:5px; border-radius:12px; }
.seg__b{ flex:1; padding:9px 8px; border-radius:9px; border:none; background:transparent; color:var(--ink-2); font-size:.84rem; font-weight:600; transition:.25s var(--ease); }
.seg__b:hover{ color:var(--ink); }
.seg__b.is-active{ background:var(--surface); color:var(--ink); box-shadow:var(--shadow-sm); }
.range{ display:flex; align-items:center; gap:14px; }
.range input[type=range]{ flex:1; -webkit-appearance:none; appearance:none; height:6px; border-radius:6px; background:linear-gradient(90deg,var(--c-creator),var(--c-creator)) no-repeat; background-size:var(--p,20%) 100%; background-color:var(--bg-2); }
.range input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; width:20px; height:20px; border-radius:50%; background:#fff; border:2px solid var(--c-creator); box-shadow:var(--shadow-sm); cursor:pointer; transition:transform .2s; }
.range input[type=range]::-webkit-slider-thumb:hover{ transform:scale(1.15); }
.range__val{ font-size:.84rem; font-weight:650; color:var(--c-creator); min-width:80px; }
.builder__cta{ width:100%; margin-top:8px; padding:13px; border-radius:13px; border:none; background:linear-gradient(180deg,#f08d3e,var(--c-creator)); color:#fff; font-weight:700; display:inline-flex; align-items:center; justify-content:center; gap:9px; box-shadow:0 10px 24px -10px var(--c-creator); transition:transform .25s var(--ease), box-shadow .25s; }
.builder__cta:hover{ transform:translateY(-2px); box-shadow:0 16px 32px -12px var(--c-creator); }

/* =========================================================
   COLAB
   ========================================================= */
.colab__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:30px; align-items:start; }
.chatcard{ border-radius:var(--radius-lg); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-lg); overflow:hidden; }
.chatcard__head{ display:flex; align-items:center; gap:9px; padding:14px 20px; font-size:.84rem; font-weight:600; color:var(--muted); border-bottom:1px solid var(--line); background:var(--surface-2); }
.chat{ list-style:none; padding:20px; display:flex; flex-direction:column; gap:16px; }
.msg{ --c:var(--brand); display:flex; gap:12px; opacity:0; transform:translateY(10px); animation:msgIn .6s var(--ease) forwards; }
.chat .msg:nth-child(1){ animation-delay:.1s; }
.chat .msg:nth-child(2){ animation-delay:.9s; }
.chat .msg:nth-child(3){ animation-delay:1.7s; }
.chat .msg:nth-child(4){ animation-delay:2.5s; }
@keyframes msgIn{ to{ opacity:1; transform:none; } }
.msg__av{ width:38px; height:38px; border-radius:11px; flex:none; display:grid; place-items:center; font-size:.78rem; font-weight:800; color:#fff; background:var(--c); box-shadow:0 6px 14px -8px var(--c); }
.msg__body{ background:color-mix(in srgb,var(--c) 6%,var(--surface-2)); border:1px solid color-mix(in srgb,var(--c) 16%,transparent); border-radius:4px 14px 14px 14px; padding:11px 15px; }
.msg__who{ display:block; font-size:.82rem; font-weight:700; color:var(--ink); margin-bottom:3px; }
.msg__who em{ font-style:normal; font-weight:600; color:var(--c); font-size:.74rem; margin-left:6px; }
.msg__body p{ font-size:.94rem; color:var(--ink-2); }
.typing{ display:inline-flex; gap:5px; padding:4px 0; }
.typing span{ width:7px; height:7px; border-radius:50%; background:var(--c); opacity:.5; animation:typing 1.2s infinite; }
.typing span:nth-child(2){ animation-delay:.2s; }
.typing span:nth-child(3){ animation-delay:.4s; }
@keyframes typing{ 0%,60%,100%{ transform:translateY(0); opacity:.4; } 30%{ transform:translateY(-5px); opacity:1; } }

.flow{ list-style:none; display:flex; flex-direction:column; gap:6px; }
.flow li{ display:flex; gap:16px; padding:18px 20px; border-radius:16px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm); position:relative; transition:transform .25s var(--ease), box-shadow .25s; }
.flow li:hover{ transform:translateX(5px); box-shadow:var(--shadow); }
.flow li:not(:last-child)::after{ content:""; position:absolute; left:36px; top:60px; bottom:-6px; width:2px; background:linear-gradient(var(--brand),transparent); opacity:.3; }
.flow__n{ width:34px; height:34px; flex:none; border-radius:11px; display:grid; place-items:center; font-weight:800; color:#fff; background:linear-gradient(180deg,#19b873,var(--brand)); box-shadow:0 6px 14px -8px var(--brand); }
.flow li strong{ display:block; font-size:1rem; }
.flow li p{ font-size:.9rem; color:var(--muted); }

/* =========================================================
   CLONAR
   ========================================================= */
.clonar__demo{ display:grid; grid-template-columns:300px 1fr; gap:26px; align-items:start; }
.empcard{ --c:var(--brand); position:relative; padding:24px; border-radius:var(--radius); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow); text-align:center; transition:transform .35s var(--ease), box-shadow .35s, opacity .35s; overflow:hidden; }
.empcard::before{ content:""; position:absolute; inset:0 0 auto 0; height:5px; background:var(--c); }
.empcard__av{ width:60px; height:60px; margin:6px auto 14px; border-radius:16px; display:grid; place-items:center; font-weight:800; font-size:1.1rem; color:#fff; background:var(--c); box-shadow:0 10px 22px -10px var(--c); }
.empcard strong{ display:block; font-size:1.08rem; }
.empcard__role{ display:block; font-size:.84rem; color:var(--c); font-weight:600; margin-top:2px; }
.empcard__note{ font-size:.88rem; color:var(--muted); margin:12px 0 18px; }
.empcard__actions{ display:flex; gap:8px; }
.mini-btn{ flex:1; padding:9px; border-radius:10px; border:1px solid var(--line); background:var(--surface-2); font-size:.82rem; font-weight:650; color:var(--ink-2); display:inline-flex; align-items:center; justify-content:center; gap:6px; transition:.2s var(--ease); }
.mini-btn:hover{ border-color:color-mix(in srgb,var(--c) 45%,transparent); color:var(--c); transform:translateY(-1px); }
.mini-btn--ghost:hover{ color:#d4574f; border-color:rgba(212,87,79,.4); }
.empcard.is-off{ opacity:.42; filter:grayscale(.6); transform:scale(.97); }

.clonar__out{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; align-content:start; }
.clonar__hint{ grid-column:1/-1; display:flex; gap:12px; align-items:center; padding:16px 20px; border-radius:14px; background:color-mix(in srgb,var(--brand) 5%,var(--surface)); border:1px solid var(--line); color:var(--muted); font-size:.92rem; }
.clonar__hint strong{ color:var(--ink); }
.clonar__hint .ic{ font-size:1.4rem; color:var(--brand); flex:none; }
.clone{ padding:18px; border-radius:14px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm); text-align:center; animation:cloneIn .5s var(--ease) backwards; }
@keyframes cloneIn{ from{ opacity:0; transform:scale(.8) translateY(10px); } }
.clone__av{ width:42px; height:42px; margin:0 auto 8px; border-radius:11px; display:grid; place-items:center; font-weight:800; color:#fff; background:var(--c-creator); font-size:.8rem; }
.clone strong{ display:block; font-size:.86rem; }
.clone span{ font-size:.74rem; color:var(--muted); }

/* =========================================================
   SHOWCASE
   ========================================================= */
.showcase__grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.frame--wide{ transform:none; }
.frame--wide:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }

/* =========================================================
   EQUIPE
   ========================================================= */
.team-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.tcard{ --c:var(--brand); position:relative; padding:20px; border-radius:var(--radius); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm); overflow:hidden; transition:transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.tcard::after{ content:""; position:absolute; inset:0; background:radial-gradient(70% 60% at 50% -10%, color-mix(in srgb,var(--c) 16%,transparent), transparent 70%); opacity:0; transition:opacity .4s; pointer-events:none; }
.tcard:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:color-mix(in srgb,var(--c) 40%,transparent); }
.tcard:hover::after{ opacity:1; }
.tcard__top{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.tcard__av{ width:46px; height:46px; border-radius:13px; flex:none; display:grid; place-items:center; font-weight:800; color:#fff; background:var(--c); box-shadow:0 8px 18px -10px var(--c); }
.tcard__name{ font-size:1rem; font-weight:750; letter-spacing:-.01em; }
.tcard__role{ font-size:.8rem; color:var(--c); font-weight:600; }
.tcard__mission{ font-size:.86rem; color:var(--muted); line-height:1.5; }
.tcard__sr{ margin-top:13px; display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:650; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-2); padding:4px 9px; border-radius:999px; background:var(--bg-2); }
.tcard__dot{ width:6px; height:6px; border-radius:50%; background:var(--c); }

/* =========================================================
   STEPS
   ========================================================= */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.step{ --accent:var(--brand); position:relative; padding:28px 24px; border-radius:var(--radius); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm); overflow:hidden; transition:transform .3s var(--ease), box-shadow .3s; }
.step::before{ content:""; position:absolute; inset:auto auto -30% -10%; width:50%; height:60%; background:radial-gradient(circle,var(--accent),transparent 70%); opacity:.1; }
.step:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.step__n{ display:inline-grid; place-items:center; width:40px; height:40px; border-radius:12px; font-weight:800; color:#fff; background:var(--accent); margin-bottom:16px; box-shadow:0 8px 18px -10px var(--accent); }
.step h3{ font-size:1.1rem; margin-bottom:8px; }
.step p{ font-size:.92rem; color:var(--muted); }

/* =========================================================
   BENTO
   ========================================================= */
.bento{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:1fr; gap:18px; }
.bcard{ --accent:var(--brand); position:relative; grid-column:span 2; padding:26px; border-radius:var(--radius-lg); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm); overflow:hidden; transition:transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.bcard::after{ content:""; position:absolute; inset:0; background:radial-gradient(60% 50% at 20% 0%, color-mix(in srgb,var(--accent) 14%,transparent), transparent 70%); opacity:0; transition:opacity .4s; pointer-events:none; }
.bcard:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:color-mix(in srgb,var(--accent) 35%,transparent); }
.bcard:hover::after{ opacity:1; }
.bcard--lg{ grid-column:span 3; grid-row:span 2; }
.bcard__ic{ font-size:1.7rem; color:var(--accent); width:52px; height:52px; display:grid; place-items:center; border-radius:14px; background:color-mix(in srgb,var(--accent) 12%,transparent); margin-bottom:16px; }
.bcard h3{ font-size:1.18rem; margin-bottom:8px; }
.bcard p{ font-size:.94rem; color:var(--muted); }
.bcard:nth-child(2),.bcard:nth-child(3){ grid-column:span 3; }
.grow-bars{ display:flex; align-items:flex-end; gap:8px; height:64px; margin-top:24px; }
.grow-bars span{ flex:1; border-radius:6px 6px 0 0; background:linear-gradient(180deg,var(--accent),color-mix(in srgb,var(--accent) 30%,transparent)); transform-origin:bottom; animation:grow 3s var(--ease) infinite alternate; }
.grow-bars span:nth-child(1){ height:30%; animation-delay:0s; }
.grow-bars span:nth-child(2){ height:48%; animation-delay:.2s; }
.grow-bars span:nth-child(3){ height:40%; animation-delay:.4s; }
.grow-bars span:nth-child(4){ height:66%; animation-delay:.6s; }
.grow-bars span:nth-child(5){ height:84%; animation-delay:.8s; }
.grow-bars span:nth-child(6){ height:100%; animation-delay:1s; }
@keyframes grow{ from{ transform:scaleY(.8); } to{ transform:scaleY(1); } }

/* =========================================================
   BETA
   ========================================================= */
.beta__card{ position:relative; padding:64px 48px; border-radius:var(--radius-lg); background:linear-gradient(180deg,#0f1c17,#0a1411); color:#eaf3ee; text-align:center; box-shadow:var(--shadow-lg); overflow:hidden; }
.beta__aurora{ position:absolute; inset:0; background:radial-gradient(50% 60% at 20% 0%, rgba(18,168,102,.4), transparent 60%), radial-gradient(45% 55% at 85% 100%, rgba(63,110,224,.3), transparent 60%); opacity:.7; }
.beta__card .kicker{ position:relative; color:var(--brand-300); background:rgba(18,168,102,.16); border-color:rgba(18,168,102,.3); }
.beta__card .sec-title{ position:relative; color:#fff; max-width:22ch; margin-inline:auto; }
.beta__card .sec-lead{ position:relative; color:rgba(234,243,238,.78); max-width:48ch; margin-inline:auto; }
.beta__form{ position:relative; display:flex; gap:10px; max-width:480px; margin:30px auto 0; }
.beta__form input{ flex:1; padding:14px 18px; border-radius:999px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.06); color:#fff; font-size:1rem; outline:none; transition:border-color .25s, background .25s; }
.beta__form input::placeholder{ color:rgba(234,243,238,.5); }
.beta__form input:focus{ border-color:var(--brand-300); background:rgba(255,255,255,.1); }
.beta__ok{ position:relative; margin-top:16px; color:var(--brand-300); font-weight:600; }
.beta__meta{ position:relative; list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:10px 26px; margin-top:30px; }
.beta__meta li{ display:inline-flex; align-items:center; gap:8px; font-size:.9rem; color:rgba(234,243,238,.82); }
.beta__meta .ic{ color:var(--brand-300); }

/* =========================================================
   FAQ
   ========================================================= */
.faq__inner{ display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; align-items:start; }
.faq .sec-head{ position:sticky; top:110px; }
.faq__list{ display:flex; flex-direction:column; gap:12px; }
.qa{ border-radius:16px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm); overflow:hidden; transition:box-shadow .3s, border-color .3s; }
.qa[open]{ box-shadow:var(--shadow); border-color:rgba(18,168,102,.25); }
.qa summary{ list-style:none; cursor:pointer; padding:20px 22px; font-weight:650; font-size:1.02rem; display:flex; align-items:center; justify-content:space-between; gap:16px; color:var(--ink); }
.qa summary::-webkit-details-marker{ display:none; }
.qa summary .ic{ font-size:1.15rem; color:var(--brand); transition:transform .3s var(--ease); flex:none; }
.qa[open] summary .ic{ transform:rotate(135deg); }
.qa p{ padding:0 22px 22px; color:var(--muted); font-size:.96rem; max-width:60ch; }

/* =========================================================
   FOOTER
   ========================================================= */
.footer{ margin-top:40px; padding-top:64px; border-top:1px solid var(--line); background:linear-gradient(180deg,transparent,rgba(18,168,102,.03)); }
.footer__inner{ display:grid; grid-template-columns:1.4fr 2fr; gap:48px; padding-bottom:48px; }
.footer__brand p{ margin-top:16px; color:var(--muted); font-size:.94rem; max-width:40ch; }
.footer__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.footer__cols h4{ font-size:.84rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-2); margin-bottom:14px; }
.footer__cols a{ display:block; padding:6px 0; color:var(--muted); font-size:.92rem; transition:color .2s, transform .2s; }
.footer__cols a:hover{ color:var(--brand-700); transform:translateX(3px); }
.footer__bar{ display:flex; justify-content:space-between; padding:22px 0; border-top:1px solid var(--line); width:min(var(--maxw),92vw); margin-inline:auto; color:var(--muted); font-size:.86rem; }

/* =========================================================
   REVEAL
   ========================================================= */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
  .reveal{ opacity:1; transform:none; }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1080px){
  .nav__links{ display:none; }
  .nav__burger{ display:flex; }
  .hero__inner{ grid-template-columns:1fr; gap:48px; }
  .hero__stage{ max-width:560px; }
  .frame--app{ transform:none; }
  .float-card{ display:none; }
  .frentes__grid{ grid-template-columns:1fr; }
  .fsel{ position:static; flex-direction:row; flex-wrap:wrap; }
  .fsel__btn{ flex:1 1 calc(50% - 8px); }
  .criar__inner,.colab__grid,.clonar__demo,.faq__inner,.showcase__grid{ grid-template-columns:1fr; }
  .clonar__demo{ gap:20px; }
  .team-grid{ grid-template-columns:repeat(2,1fr); }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .bcard,.bcard--lg,.bcard:nth-child(2),.bcard:nth-child(3){ grid-column:span 6; grid-row:auto; }
  .footer__inner{ grid-template-columns:1fr; }
}
@media (max-width:600px){
  .nav__cta .btn--ghost{ display:none; }
  .hero{ padding-top:120px; }
  .section{ padding:72px 0; }
  .fsel__btn{ flex:1 1 100%; }
  .fpanel{ padding:28px 22px; }
  .team-grid{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .beta__card{ padding:44px 24px; }
  .beta__form{ flex-direction:column; }
  .footer__cols{ grid-template-columns:1fr; }
  .footer__bar{ flex-direction:column; gap:8px; text-align:center; }
}