/* ======================================================================
   Coreare Trust — Home (Glass matte, zero asset esterni)
   ====================================================================== */

:root{
  --bg-0:#07080b; --bg-1:#0b0f16; --txt:#e9edf3; --muted:#a8b3c2;
  --accent:#6aa2ff; --accent-2:#9f7fff;
  --glass-rgba:255,255,255; --glass-alpha:.18; --glass-border:.22; --glass-blur:28px;
  --grain: rgba(255,255,255,.03);
  --card-shadow:0 30px 80px rgba(0,0,0,.45), 0 1px 0 rgba(255,255,255,.03) inset;
  --ok:#34d399; --near:#60a5fa; --maybe:#fbbf24; --no:#f87171;
  color-scheme: dark light;
}

*{box-sizing:border-box}
html,body{height:100%}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji";
  line-height:1.45; letter-spacing:.2px; color:var(--txt);
  background:
    radial-gradient(1200px 700px at 80% -10%, #2a3960 0%, transparent 60%),
    radial-gradient(1000px 600px at -10% 20%, #3a285f 0%, transparent 60%),
    linear-gradient(180deg, var(--bg-1), var(--bg-0));
  overflow-x:hidden;
}

/* Scena */
.scene{position:fixed; inset:0; pointer-events:none; z-index:0}
.orb{position:absolute; border-radius:50%; filter: blur(40px); opacity:.9}
.orb-1{width:420px;height:420px;left:-80px;top:-80px;background:radial-gradient(circle at 30% 30%, #6aa2ff, #2e3e6e 60%, transparent 70%)}
.orb-2{width:520px;height:520px;right:-140px;top:10%;background:radial-gradient(circle at 60% 40%, #9f7fff, #3b2e6c 60%, transparent 70%)}
.orb-3{width:380px;height:380px;right:20%;bottom:-140px;background:radial-gradient(circle at 40% 60%, #3bd5ff, #185361 55%, transparent 70%)}
.ring{position:absolute;border-radius:50%;border:2px solid rgba(255,255,255,.06);filter:blur(1px)}
.ring-1{width:680px;height:680px;right:-180px;bottom:-120px;transform:rotate(12deg)}
.ring-2{width:520px;height:520px;left:-120px;bottom:18%;transform:rotate(-18deg)}

/* Layout */
.site-header,.site-footer,.wrap{position:relative; z-index:1}
.site-header{display:flex;align-items:center;justify-content:space-between;padding:18px clamp(18px,3vw,36px)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--txt)}
.brand-mark{width:14px;height:14px;display:inline-block;border-radius:50%;
  background: radial-gradient(circle at 30% 30%, var(--accent), #1c2b47);
  box-shadow:0 0 24px rgba(106,162,255,.6),0 0 2px rgba(255,255,255,.6) inset}
.brand-text{font-weight:700;letter-spacing:.3px}


/* NAV allineata verticalmente */

.main-nav ul{display:flex;align-items:center;gap:14px;margin:0;padding:0;list-style:none}
.main-nav li{display:flex;align-items:center}
.main-nav a{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 12px;border-radius:10px;text-decoration:none;color:var(--muted); line-height:1;}
.main-nav a:hover{color:var(--txt);background:rgba(255,255,255,.035)}
.main-nav a.btn{height:38px;padding:0 14px} /* bottone login allineato alla link */

.wrap{padding: clamp(24px, 4vw, 40px)}

/* HERO */
.hero{display:grid;place-items:center;min-height: clamp(520px, 72vh, 820px)}
.hero-card{
  max-width:1100px;width:min(92vw,1100px);
  padding: clamp(28px, 5vw, 56px);
  box-shadow:var(--card-shadow);
  text-align:center;               /* <<< CENTRA TUTTO NELLA CARD */
}
h1{font-size:clamp(32px,5vw,56px);margin:0 0 14px}
.lead{font-size:clamp(16px,1.8vw,18px);color:var(--muted);margin:0 0 22px}
.accent{background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}

.cta{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 8px;justify-content:center} /* <<< */
.btn{display:inline-block;border-radius:20px;padding:12px 16px;text-decoration:none;font-weight:600;letter-spacing:.2px;line-height:1;border:1px solid rgba(36, 33, 33, 0.22);color:var(--txt)}
.btn-solid{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.04))}
.btn-outline{background:rgba(255,255,255,.02)}
.btn-ghost{background:transparent;border-color:rgba(15, 11, 11, 0.18)}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

/* Glass matte */
.glass{
  position:relative;border-radius:28px;overflow:hidden;
  background: rgba(var(--glass-rgba), var(--glass-alpha));
  border:1px solid rgba(var(--glass-rgba), var(--glass-border));
  backdrop-filter: blur(var(--glass-blur)) saturate(1.15) contrast(1.02);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.15) contrast(1.02);
}
.glass::before{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), transparent 40%),
    repeating-linear-gradient(0deg, transparent, transparent 2px, var(--grain) 3px);
  pointer-events:none;
}
.matte{box-shadow:var(--card-shadow)}

/* Badges */
.badges{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 6px;justify-content:center} /* <<< */
.pill{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:180px;height:52px;border-radius:999px;font-weight:900;letter-spacing:.6px;
  border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.06);
  box-shadow:0 6px 20px rgba(0,0,0,.25);
}
.b-verified{color:var(--ok)}
.b-vsimilar{color:var(--near)}
.b-similar{color:var(--maybe)}
.b-nv{color:var(--no)}
.center{text-align:center}
.micro{font-size:12px}

/* Feature grid */
.features{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin: clamp(24px, 6vw, 56px) auto;max-width:1200px}
.feature{grid-column:span 6;padding:22px 22px 24px;min-height:140px}
.feature h3{margin:0 0 8px;font-size:18px;text-align:center} /* <<< centra titoli */
.feature p{margin:0 0 10px;color:var(--muted)}
@media (max-width: 860px){ .feature{grid-column:span 12} }

/* Legend (badge piccoli) */
.legend{list-style:none;margin:.3rem 0 0;padding:0;display:grid;gap:10px}
.badge{
  display:inline-block; min-width:8ch; text-align:center; font-weight:800;
  font-size:12px; padding:6px 10px; border-radius:999px; letter-spacing:.3px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18);
}
.badge.b-verified{color:var(--ok)}
.badge.b-vsimilar{color:var(--near)}
.badge.b-similar{color:var(--maybe)}
.badge.b-nv{color:var(--no)}

/* How it works */
.how{max-width:1200px;margin: clamp(24px, 6vw, 56px) auto;padding:20px 22px}
.how h2{margin:0 0 8px;text-align:center} /* <<< */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
.step{padding:16px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);text-align:center} /* <<< */
.step h4{margin:0 0 6px}
.step p{margin:0;color:var(--muted)}
@media (max-width: 900px){ .steps{grid-template-columns:1fr} }

/* Two-up */
.two{max-width:1200px;margin: clamp(20px, 5vw, 48px) auto;padding:18px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.two .col{padding:12px;text-align:center} /* <<< */
@media (max-width: 900px){ .two{grid-template-columns:1fr} }

/* Plans */
.plans{max-width:1200px;margin: clamp(24px, 6vw, 56px) auto}
.plans-head{padding:20px 22px 0;text-align:center} /* <<< */
.plans-head h2{margin:0 0 6px}
.plans-head .muted{color:var(--muted);margin:0}
.plan-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding:18px}
.plan{border-radius:22px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);padding:18px}
.plan h3{margin:0 0 8px;text-align:center} /* <<< */
.bullets{margin:.2rem 0 0; padding-left:18px; color:var(--muted)}
.bullets li{margin:.28rem 0}
@media (max-width: 900px){ .plan-grid{grid-template-columns:1fr} }

/* Actions */
.actions{max-width:1200px;margin: clamp(20px, 5vw, 48px) auto}
.actions-inner{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:18px}
.action{padding:16px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);text-align:center} /* <<< */
.action h4{margin:0 0 6px}
.action p{margin:0 0 12px;color:var(--muted)}
@media (max-width: 900px){ .actions-inner{grid-template-columns:1fr} }

/* Footer */
.site-footer{display:flex;justify-content:center;padding:24px;color:var(--muted);font-size:14px}
.site-footer a{color:var(--txt);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.15)}
.site-footer a:hover{border-color:rgba(255,255,255,.35)}

/* Focus & motion */
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:12px}
@media (prefers-reduced-motion: reduce){ *{animation:none !important;transition:none !important} }

/* Light mode */
@media (prefers-color-scheme: light){
  :root{
    --bg-0:#f3f6fb; --bg-1:#eaf0fb; --txt:#0b1220; --muted:#3a4456;
    --glass-alpha:.55; --glass-border:.28;
  }
  body{
    background:
      radial-gradient(1200px 700px at 90% -10%, #e0e9ff 0%, transparent 55%),
      radial-gradient(900px 600px at -10% 25%, #ffe0ff 0%, transparent 60%),
      linear-gradient(180deg, #eef3ff, #f7faff);
  }
  .main-nav a:hover{background:rgba(0,0,0,.05)}
  .plan,.action{background:rgba(255,255,255,.75)}
}