/* ===== ILIS — landing (custom sobre Bootstrap 5) =====
   Tema claro (branco + verde) por padrão; escuro via [data-bs-theme="dark"]. */

:root{
  /* neutros (claro) */
  --ink:#13211c; --muted:#566b62; --faint:#8a978f;
  --line:#e5ece9; --surface:#ffffff; --surface-2:#f5f9f7;
  --card:#ffffff; --card-line:#e7ede9;
  /* marca (verde) */
  --brand:#10a774; --brand-2:#17b98a;
  --grad-from:#0e9e6d; --grad-to:#16b8a6;
  /* acentos (usados nos chips/pontos) — família verde/água + azul/âmbar do sistema */
  --emerald:#0ea371; --cyan:#0aa79a; --violet:#12a774; --amber:#c67f0a; --pink:#0f9e83; --blue:#2f7ef0;
  /* sombra dos prints */
  --shot-shadow:0 16px 40px rgba(16,60,44,.16);
  --btn-ink:#04231a;
}
[data-bs-theme="dark"]{
  --ink:#eaf5ef; --muted:#9db1a8; --faint:#6f857b;
  --line:rgba(255,255,255,.10); --surface:rgba(255,255,255,.05); --surface-2:rgba(255,255,255,.04);
  --card:rgba(255,255,255,.045); --card-line:rgba(255,255,255,.10);
  --brand:#34d399; --brand-2:#6ee7b7;
  --grad-from:#34d399; --grad-to:#6ee7b7;
  --emerald:#34d399; --cyan:#2dd4bf; --violet:#4ade80; --amber:#fbbf24; --pink:#5eead4; --blue:#60a5fa;
  --shot-shadow:0 22px 46px rgba(0,0,0,.55);
  --btn-ink:#04231a;
}

html{ scroll-behavior:smooth; }
body{
  color:var(--ink);
  font-family:"Inter",system-ui,"Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(1100px 700px at 90% -12%, rgba(23,185,138,.10), transparent 60%),
    radial-gradient(1000px 800px at -6% 6%, rgba(16,167,116,.08), transparent 55%),
    #ffffff;
  background-attachment:fixed;
}
[data-bs-theme="dark"] body{
  background:
    radial-gradient(1100px 700px at 90% -12%, rgba(52,211,153,.14), transparent 60%),
    radial-gradient(1000px 800px at -6% 6%, rgba(20,120,90,.16), transparent 55%),
    linear-gradient(180deg, #081411, #0b1a14 60%, #0a1712);
}
section{ scroll-margin-top:80px; }

/* top hairline */
.hairline{ height:4px; background:linear-gradient(90deg,var(--grad-from),var(--grad-to)); }

/* text helpers */
.text-muted-2{ color:var(--muted)!important; }
.text-faint{ color:var(--faint)!important; }
.eyebrow{ font-size:.8rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--brand); }
.grad{ background:linear-gradient(90deg,var(--grad-from),var(--grad-to)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.display-hero{ font-weight:800; letter-spacing:-.02em; line-height:1.05; }
.lead-2{ color:var(--muted); font-size:1.12rem; line-height:1.6; }

/* navbar */
.navbar{ background:color-mix(in srgb, var(--surface) 82%, transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.navbar .navbar-brand{ font-weight:800; letter-spacing:.02em; color:var(--ink); }
.navbar .nav-link{ color:var(--muted); font-weight:500; }
.navbar .nav-link:hover, .navbar .nav-link:focus{ color:var(--ink); }
.brand-mark{ width:30px; height:30px; border-radius:8px; }
.theme-toggle{ color:var(--muted); border:1px solid var(--line); background:transparent; width:38px; height:38px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; }
.theme-toggle:hover{ color:var(--ink); background:var(--surface-2); }
.theme-toggle .bi-sun-fill{ display:none; }
[data-bs-theme="dark"] .theme-toggle .bi-sun-fill{ display:inline; }
[data-bs-theme="dark"] .theme-toggle .bi-moon-stars{ display:none; }

/* buttons */
.btn-brand{ background-image:linear-gradient(90deg,var(--grad-from),var(--grad-to)); color:var(--btn-ink); border:0; font-weight:700; }
.btn-brand:hover{ filter:brightness(1.05); color:var(--btn-ink); }
.btn-ghost{ color:var(--ink); border:1px solid var(--line); background:var(--surface); font-weight:600; }
.btn-ghost:hover{ color:var(--ink); background:var(--surface-2); }

/* glass / card */
.glass{ background:var(--card); border:1px solid var(--card-line); border-radius:16px; box-shadow:0 1px 2px rgba(16,40,30,.04); }
[data-bs-theme="dark"] .glass{ box-shadow:none; }
.glass:hover{ border-color:color-mix(in srgb, var(--brand) 40%, var(--card-line)); }
.chip{ width:46px; height:46px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; font-size:1.25rem; }
.t-cyan{ background:color-mix(in srgb,var(--cyan) 13%, transparent); color:var(--cyan); }
.t-violet{ background:color-mix(in srgb,var(--violet) 13%, transparent); color:var(--violet); }
.t-emerald{ background:color-mix(in srgb,var(--emerald) 13%, transparent); color:var(--emerald); }
.t-amber{ background:color-mix(in srgb,var(--amber) 14%, transparent); color:var(--amber); }
.t-pink{ background:color-mix(in srgb,var(--pink) 13%, transparent); color:var(--pink); }
.t-blue{ background:color-mix(in srgb,var(--blue) 13%, transparent); color:var(--blue); }

/* pills */
.pill{ display:inline-flex; align-items:center; gap:.5rem; font-size:.85rem; color:var(--muted);
  background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:.4rem .8rem; font-weight:500; }
.dot{ width:7px; height:7px; border-radius:50%; display:inline-block; }

/* step (flow) */
.step .num, .num{ font-weight:800; color:var(--brand); letter-spacing:.08em; }

/* screenshots */
.shot{ width:100%; height:auto; filter:drop-shadow(var(--shot-shadow)); }

/* feature */
.feature{ padding:3.2rem 0; }
.feature .feat-ico{ width:40px; height:40px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; font-size:1.05rem; flex:0 0 40px; }

/* CTA band */
.cta-band{ background:linear-gradient(180deg, color-mix(in srgb,var(--brand) 8%, transparent), color-mix(in srgb,var(--brand-2) 8%, transparent));
  border:1px solid var(--line); border-radius:22px; }

/* footer */
footer{ border-top:1px solid var(--line); color:var(--faint); }

/* misc */
.section-pad{ padding-top:4.5rem; padding-bottom:1.5rem; }