/* CERCLE.BF — landing de pré-lancement (partagé) */
:root{
  --ink-900:#0A1530; --ink-700:#25324A; --ink-500:#51607A; --ink-300:#8693AB;
  --line:#E4E9F4; --blue:#0339B9;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:var(--ink-900); line-height:1.6;
  background:
    radial-gradient(1100px 560px at 50% -8%, var(--accent-soft), transparent 60%),
    linear-gradient(180deg,#ffffff 0%, #F5F8FF 100%);
  background-attachment:fixed;
  display:flex; flex-direction:column; min-height:100vh;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

.lp-header{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:16px 24px; border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.82); backdrop-filter:saturate(180%) blur(10px);
  position:sticky; top:0; z-index:10;
}
.lp-brand{display:flex; align-items:center; gap:10px; font-family:'Space Grotesk',sans-serif;
  font-weight:700; font-size:18px; color:var(--blue)}
.lp-brand img{width:36px;height:36px}
.lp-brand .bf{color:var(--accent)}
.lp-badge{
  font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--accent);
  background:var(--accent-soft); padding:7px 14px; border-radius:999px;
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
}
.lp-badge::before{
  content:''; width:8px;height:8px;border-radius:50%; background:var(--accent);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 25%, transparent);
  animation:pulse 1.8s infinite;
}
@keyframes pulse{50%{box-shadow:0 0 0 9px color-mix(in srgb, var(--accent) 0%, transparent)}}

.lp-main{flex:1; display:flex; align-items:center; justify-content:center; padding:48px 20px}
.lp-card{
  width:100%; max-width:640px; background:#fff;
  border:1px solid var(--line); border-radius:24px;
  box-shadow:0 30px 70px -30px rgba(3,36,143,.32);
  padding:44px 40px; text-align:center;
}
.lp-icon{
  width:104px;height:104px; margin:0 auto 22px; border-radius:26px;
  background:var(--accent-soft); display:grid; place-items:center;
  box-shadow:0 16px 40px -16px color-mix(in srgb, var(--accent) 55%, transparent);
}
.lp-icon img{width:84px;height:84px;object-fit:contain}
.lp-eyebrow{
  display:inline-block; font-size:12.5px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--accent); margin-bottom:10px;
}
.lp-card h1{font-family:'Space Grotesk',sans-serif; font-size:34px; font-weight:700;
  margin-bottom:10px; letter-spacing:-.01em}
.lp-tag{font-size:17px; color:var(--ink-700); font-weight:600; margin-bottom:12px}
.lp-desc{font-size:15px; color:var(--ink-500); margin-bottom:22px}

.lp-feats{display:flex; flex-direction:column; gap:10px; text-align:left;
  max-width:420px; margin:0 auto 30px}
.lp-feats li{display:flex; align-items:center; gap:10px; font-size:14.5px; color:var(--ink-700)}
.lp-feats li::before{
  content:''; flex:0 0 auto; width:20px;height:20px;border-radius:50%; background:var(--accent);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center;
}

.lp-form-wrap{background:var(--accent-soft); border-radius:18px; padding:26px 24px; text-align:left}
.lp-form-wrap h2{font-family:'Space Grotesk',sans-serif; font-size:20px; margin-bottom:6px; color:var(--ink-900)}
.lp-form-sub{font-size:13.5px; color:var(--ink-500); margin-bottom:16px}
.lp-form{display:flex; flex-direction:column; gap:12px}
.lp-form label{display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:600; color:var(--ink-700)}
.lp-form input,.lp-form select{
  width:100%; padding:11px 13px; border:1.5px solid var(--line); border-radius:11px;
  font:inherit; font-size:14px; font-weight:400; color:var(--ink-900); background:#fff;
}
.lp-form input:focus,.lp-form select:focus{
  outline:none; border-color:var(--accent);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 15%, transparent);
}
.lp-btn{
  margin-top:4px; padding:13px; border:none; border-radius:12px; cursor:pointer;
  font:inherit; font-weight:700; font-size:15px; color:#fff;
  background:linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 75%, #03248F));
  box-shadow:0 12px 26px -10px color-mix(in srgb, var(--accent) 60%, transparent);
  transition:transform .15s;
}
.lp-btn:hover{transform:translateY(-1px)}
.lp-btn:disabled{opacity:.7; cursor:default; transform:none}
.lp-sent{
  margin-top:6px; padding:12px 14px; border-radius:11px;
  background:#fff; color:var(--accent); font-weight:600; font-size:14px;
  border:1.5px solid var(--accent);
}

.lp-footer{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
  padding:18px 24px; font-size:13px; color:var(--ink-500); border-top:1px solid var(--line);
}
.lp-footer a{color:var(--blue); font-weight:600}

@media (max-width:560px){
  .lp-card{padding:32px 22px}
  .lp-card h1{font-size:27px}
  .lp-header{padding:14px 18px}
}
