/* ============================================================
   focow — sistema de estilo
   Paleta: cromado sobre azul profundo (referência: logo)
   ============================================================ */

:root{
  --navy-950:#050f26;
  --navy-900:#0a1f4d;
  --navy-800:#0f2c6b;
  --blue-600:#1a4fd6;
  --blue-400:#3d7bff;
  --ice-200:#dce8ff;
  --ice-100:#f3f7ff;
  --chrome:#aecbff;
  --white:#ffffff;
  --ink-900:#0b1730;
  --ink-600:#3a4763;
  --ink-400:#6b7690;
  --line:#d6e0f5;
  --radius:14px;
  --font-display: -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --font-body: -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:var(--font-body);
  color:var(--ink-900);
  background:var(--ice-100);
  -webkit-font-smoothing:antialiased;
}
a{ color:var(--blue-600); }
a:focus-visible,button:focus-visible{ outline:3px solid var(--blue-400); outline-offset:3px; }

/* ---------- Header (usado nas páginas legais) ---------- */
.site-header{
  display:flex;
  align-items:center;
  gap:14px;
  padding:22px 28px;
  background:var(--navy-950);
  border-bottom:1px solid var(--navy-800);
}
.site-header img{
  height:38px;
  width:auto;
  display:block;
}
.site-header .brand-text{
  color:var(--ice-200);
  font-weight:700;
  letter-spacing:.02em;
  font-size:15px;
}
.site-header a.home-link{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}

/* ---------- Legal pages ---------- */
.legal-wrap{
  max-width:760px;
  margin:0 auto;
  padding:48px 24px 96px;
}
.legal-wrap .eyebrow{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:12px;
  font-weight:700;
  color:var(--blue-600);
  margin:0 0 8px;
}
.legal-wrap h1{
  font-family:var(--font-display);
  font-size:clamp(28px,4vw,38px);
  line-height:1.15;
  margin:0 0 6px;
  color:var(--ink-900);
}
.legal-wrap .updated{
  color:var(--ink-400);
  font-size:14px;
  margin:0 0 40px;
}
.legal-wrap h2{
  font-size:20px;
  margin:40px 0 12px;
  color:var(--ink-900);
  border-left:3px solid var(--blue-400);
  padding-left:12px;
}
.legal-wrap h3{
  font-size:17px;
  margin:28px 0 10px;
  color:var(--ink-900);
}
.legal-wrap p{
  font-size:15.5px;
  line-height:1.7;
  color:var(--ink-600);
  margin:0 0 16px;
}
.legal-wrap ul,.legal-wrap ol{
  color:var(--ink-600);
  font-size:15.5px;
  line-height:1.7;
  padding-left:22px;
  margin:0 0 16px;
}
.legal-wrap li{ margin-bottom:8px; }
.legal-wrap a{ color:var(--blue-600); text-decoration:underline; }

.site-footer{
  text-align:center;
  padding:28px 20px 40px;
  font-size:13px;
  color:var(--ink-400);
}
.site-footer a{ color:var(--ink-600); margin:0 8px; }

/* ---------- Home / em construção ---------- */
.hero{
  min-height:100svh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:32px 20px;
  background:
    radial-gradient(circle at 50% 32%, var(--blue-600) 0%, var(--navy-900) 46%, var(--navy-950) 78%);
  position:relative;
  overflow:hidden;
}
.hero .ring{
  position:absolute;
  width:min(70vw,560px);
  height:min(70vw,560px);
  border:1px solid rgba(174,203,255,.18);
  border-radius:50%;
  animation:spin 40s linear infinite;
}
.hero .ring.ring-2{
  width:min(88vw,700px);
  height:min(88vw,700px);
  border-color:rgba(174,203,255,.10);
  animation-duration:60s;
  animation-direction:reverse;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){
  .hero .ring{ animation:none; }
}

.hero .logo{
  position:relative;
  width:min(58vw,220px);
  height:auto;
  margin-bottom:28px;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.35));
}
.hero h1{
  position:relative;
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(22px,4.4vw,34px);
  letter-spacing:.01em;
  color:var(--white);
  margin:0 0 10px;
}
.hero p.tagline{
  position:relative;
  color:var(--chrome);
  font-size:clamp(13px,2vw,15px);
  letter-spacing:.2em;
  text-transform:uppercase;
  margin:0 0 40px;
}
.hero .status{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 20px;
  border:1px solid rgba(174,203,255,.35);
  border-radius:999px;
  color:var(--ice-200);
  font-size:13.5px;
  margin-bottom:44px;
}
.hero .status .dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--blue-400);
  box-shadow:0 0 0 4px rgba(61,123,255,.25);
}
.hero nav.legal-links{
  position:relative;
  display:flex;
  gap:28px;
  flex-wrap:wrap;
  justify-content:center;
}
.hero nav.legal-links a{
  color:var(--ice-200);
  font-size:13.5px;
  text-decoration:none;
  border-bottom:1px solid rgba(220,232,255,.35);
  padding-bottom:2px;
  transition:border-color .2s ease, color .2s ease;
}
.hero nav.legal-links a:hover{
  color:var(--white);
  border-color:var(--white);
}
.hero .foot-note{
  position:relative;
  margin-top:56px;
  color:rgba(220,232,255,.45);
  font-size:12px;
}