/* PROP DE TOURNAGE — Livret Luxembourgeois (version desktop) */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
:root{
  --paper:#ffffff; --paper-2:#f7fafd; --ink:#0a1a2e; --ink-2:#1a2b44;
  --muted:#5a6b7e; --rule:#d4dde6; --rule-2:#e6edf4;
  --accent:#ED2939; --accent-2:#c41e2c; --blue:#00A1DE; --blue-2:#0086b8;
  --gold:#d9b96b; --maxw:1240px;
}
html{font-size:16px;}
body{
  font-family:"Inter",sans-serif;background:var(--paper-2);color:var(--ink);
  min-height:100vh;-webkit-font-smoothing:antialiased;line-height:1.5;
}

/* === Urgence === */
.urgency-bar{
  background:linear-gradient(180deg,#fbf5ee 0%,#f5ebdd 100%);
  color:#6b4a18;padding:13px 24px;text-align:center;
  font-size:14px;font-weight:600;letter-spacing:.02em;
  border-bottom:1px solid #e6d3b3;
  display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
}
.urgency-bar strong{color:#ED2939;font-weight:800;}
.countdown{display:inline-flex;gap:4px;font-variant-numeric:tabular-nums;font-family:"Fraunces",serif;font-weight:700;color:#ED2939;background:#fff;border:1px solid #e6d3b3;padding:3px 10px;border-radius:5px;font-size:15px;}

/* === Header === */
.header{
  max-width:var(--maxw);margin:0 auto;
  padding:20px 32px;display:flex;justify-content:space-between;align-items:center;
}
.logo{font-family:"Fraunces",serif;font-size:24px;font-weight:600;letter-spacing:-.01em;}
.logo em{font-style:italic;color:var(--accent);}
.header-right{display:flex;align-items:center;gap:24px;}
.header-nav{display:flex;gap:24px;}
.header-nav a{font-size:14px;color:var(--ink-2);text-decoration:none;font-weight:500;}
.header-nav a:hover{color:var(--accent);}
.ssl{font-size:12px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-weight:700;display:flex;align-items:center;gap:7px;}
.ssl svg{width:15px;height:15px;color:#0f9b6e;}

/* === Authority strip === */
.auth-strip{border-top:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2);background:#fff;}
.auth-inner{max-width:var(--maxw);margin:0 auto;padding:16px 32px;display:flex;align-items:center;justify-content:center;gap:32px;flex-wrap:wrap;}
.auth-lbl{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}
.auth-logos{display:flex;align-items:center;gap:32px;flex-wrap:wrap;}
.auth-logo{font-family:"Fraunces",serif;font-weight:700;font-size:17px;color:var(--ink);opacity:.5;letter-spacing:-.01em;}
.auth-logo.echos{font-style:italic;}
.auth-logo.amf{font-family:"Inter",sans-serif;font-weight:800;letter-spacing:.06em;font-size:15px;}
.auth-logo.capital{font-family:"Inter",sans-serif;font-weight:800;text-transform:uppercase;font-size:14px;letter-spacing:.04em;}

/* === Main grid === */
.main{max-width:var(--maxw);margin:0 auto;padding:48px 32px 56px;
  display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start;}

/* Left column */
.badge-offre{
  display:inline-block;background:linear-gradient(135deg,#ED2939,#ff5a68);
  color:#fff;padding:9px 20px;border-radius:99px;
  font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:22px;line-height:1;box-shadow:0 6px 18px -6px rgba(237,41,57,.5);
}
h1.title{font-family:"Fraunces",serif;font-size:54px;font-weight:600;line-height:1.08;letter-spacing:-.025em;margin-bottom:22px;text-wrap:balance;}
h1.title em{font-style:italic;background:linear-gradient(180deg,#8a0f18,#ED2939 50%,#ff5a68);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700;}
.deck{font-size:19px;color:var(--ink-2);max-width:560px;margin-bottom:28px;line-height:1.6;}
.deck strong{color:var(--accent-2);font-weight:700;}

.social-proof{display:inline-flex;align-items:center;gap:11px;padding:12px 18px;background:#fff;border:1px solid var(--rule);border-left:3px solid var(--accent);border-radius:7px;font-size:14px;color:var(--ink-2);margin-bottom:36px;}
.sp-dot{flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:var(--accent);animation:spPulse 2s ease-in-out infinite;}
@keyframes spPulse{0%,100%{box-shadow:0 0 0 0 rgba(237,41,57,.5);}50%{box-shadow:0 0 0 7px rgba(237,41,57,0);}}
.sp-text strong{color:var(--ink);font-weight:700;}

/* Perks */
.perks{display:grid;grid-template-columns:1fr 1fr;gap:14px 28px;margin-top:8px;}
.perk{display:flex;align-items:flex-start;gap:13px;padding:16px 0;border-top:1px solid var(--rule-2);}
.perk-ic{flex:0 0 42px;width:42px;height:42px;border-radius:11px;background:linear-gradient(135deg,rgba(237,41,57,.08),rgba(0,161,222,.08));border:1px solid rgba(237,41,57,.18);color:var(--accent);display:grid;place-items:center;}
.perk-ic svg{width:21px;height:21px;}
.perk strong{display:block;margin:0 0 3px;font-size:15px;color:var(--ink);font-weight:700;}
.perk span{display:block;color:var(--muted);font-size:13.5px;line-height:1.5;}

/* Right column — sticky purchase card */
.buy-col{position:sticky;top:28px;}
.deposit-card{background:#fff;border:1px solid var(--rule);border-radius:16px;padding:28px;box-shadow:0 20px 50px -20px rgba(10,22,40,.22);}
.card-head{font-family:"Inter",sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);margin-bottom:18px;}
.deposit-row{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--rule-2);}
.deposit-row.total{padding-top:16px;border-top:2px solid var(--ink);border-bottom:none;}
.deposit-label{font-size:15px;color:var(--ink-2);font-weight:500;}
.deposit-label.highlight{color:var(--accent);font-weight:700;}
.deposit-label.strong{font-weight:700;color:var(--ink);}
.deposit-val{font-family:"Fraunces",serif;font-size:24px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.01em;}
.deposit-val.bonus{color:var(--accent);}
.deposit-val.total-val{font-size:32px;background:linear-gradient(180deg,#8a0f18,#ED2939 50%,#ff5a68);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700;}
.deposit-note{font-size:12px;color:var(--muted);font-style:italic;margin-top:14px;text-align:center;}

.guard-seals{margin-top:18px;display:flex;flex-direction:column;gap:10px;}
.seal{display:flex;align-items:center;gap:13px;padding:13px 15px;background:#fff;border:1px solid var(--rule);border-radius:12px;}
.seal-ic{flex:0 0 40px;width:40px;height:40px;border-radius:10px;background:rgba(237,41,57,.09);color:var(--accent);display:grid;place-items:center;}
.seal-ic.blue{background:rgba(0,161,222,.1);color:var(--blue-2);}
.seal-ic svg{width:21px;height:21px;}
.seal-txt strong{display:block;font-size:14px;font-weight:700;color:var(--ink);line-height:1.25;margin-bottom:2px;}
.seal-txt span{display:block;font-size:11.5px;color:var(--muted);letter-spacing:.01em;}

.cta{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;margin-top:20px;padding:20px 24px;border-radius:10px;background:linear-gradient(135deg,#c41e2c,#ED2939 50%,#ff5a68);color:#fff;text-decoration:none;border:0;font-family:"Inter",sans-serif;font-weight:700;font-size:16px;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 -1px 0 rgba(0,0,0,.2) inset,0 12px 32px -8px rgba(237,41,57,.55);transition:transform .15s ease,box-shadow .15s ease,background .15s ease;position:relative;overflow:hidden;}
.cta:hover{transform:translateY(-1px);background:linear-gradient(135deg,#ED2939,#ff5a68 50%,#ff7a86);box-shadow:0 1px 0 rgba(255,255,255,.28) inset,0 -1px 0 rgba(0,0,0,.22) inset,0 18px 42px -8px rgba(237,41,57,.7);}
.cta::after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:30%;background:linear-gradient(110deg,transparent,rgba(255,255,255,.35) 50%,transparent);animation:sweep 4s ease-in-out infinite;pointer-events:none;}
@keyframes sweep{0%,60%{left:-30%;}100%{left:120%;}}
.cta-arrow{font-family:"Fraunces",serif;font-size:23px;font-style:italic;}
.cta-sub{text-align:center;font-size:12px;color:var(--muted);margin-top:12px;letter-spacing:.02em;}

.guarantee{margin-top:16px;padding:14px 16px;display:flex;gap:12px;align-items:center;background:var(--paper-2);border:1px solid var(--rule);border-radius:10px;}
.guar-ic{flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:rgba(237,41,57,.1);color:var(--accent);display:grid;place-items:center;}
.guar-text{font-size:13px;line-height:1.5;color:var(--ink-2);}
.guar-text strong{color:var(--ink);font-weight:700;}

/* === Trust strip === */
.trust{display:flex;justify-content:center;align-items:center;gap:36px;padding:26px 32px;border-top:1px solid var(--rule-2);background:#fff;flex-wrap:wrap;}
.trust-item{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:7px;font-weight:600;letter-spacing:.03em;}
.trust-item svg{width:17px;height:17px;color:var(--accent);}

/* === Footer === */
.footer{max-width:var(--maxw);margin:0 auto;padding:28px 32px 44px;text-align:center;font-size:12px;color:var(--muted);line-height:1.7;}
.footer a{color:var(--accent);text-decoration:none;}
.footer a:hover{text-decoration:underline;}

/* === Modal === */
.modal-bg{position:fixed;inset:0;background:rgba(10,22,40,.6);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;z-index:100;padding:24px;overflow-y:auto;}
.modal-bg.show{display:flex;}
.modal{background:#fff;max-width:460px;width:100%;border-radius:16px;margin:auto;padding:30px;box-shadow:0 24px 60px -20px rgba(10,22,40,.4);animation:slideUp .35s cubic-bezier(.2,.7,.2,1);position:relative;}
@keyframes slideUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:none;}}
.modal-close{position:absolute;top:16px;right:16px;background:none;border:0;width:34px;height:34px;border-radius:50%;cursor:pointer;display:grid;place-items:center;color:var(--muted);font-size:21px;transition:background .15s;}
.modal-close:hover{background:var(--paper-2);color:var(--ink);}
.modal-header{margin-bottom:20px;text-align:center;}
.modal-title{font-family:"Fraunces",serif;font-size:25px;font-weight:600;letter-spacing:-.01em;margin-bottom:7px;}
.modal-sub{font-size:14px;color:var(--muted);}
.modal-deposit{background:var(--paper-2);border-radius:10px;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}
.modal-deposit-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700;}
.modal-deposit-hint{font-size:11.5px;color:var(--accent);margin-top:3px;font-weight:600;}
.modal-deposit-val{font-family:"Fraunces",serif;font-size:24px;font-weight:700;background:linear-gradient(180deg,#8a0f18,#ED2939);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.field{margin-bottom:15px;}
.field label{display:block;font-size:11px;font-weight:700;color:var(--ink-2);letter-spacing:.06em;text-transform:uppercase;margin-bottom:7px;}
.field input{width:100%;padding:14px 15px;font-size:16px;font-family:"Inter",sans-serif;background:#fff;border:1px solid var(--rule);border-radius:8px;color:var(--ink);transition:border-color .15s,box-shadow .15s;font-variant-numeric:tabular-nums;}
.field input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px rgba(237,41,57,.12);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.card-input-wrap{position:relative;}
.card-brand{position:absolute;right:13px;top:50%;transform:translateY(-50%);display:flex;gap:6px;opacity:.55;}
.card-brand svg{height:20px;}
.prop-tag{font-size:10.5px;color:var(--muted);text-align:center;margin:-4px 0 14px;letter-spacing:.04em;}
.modal-submit{width:100%;padding:17px;margin-top:8px;background:linear-gradient(135deg,#c41e2c,#ED2939 50%,#ff5a68);color:#fff;border:0;border-radius:10px;cursor:pointer;font-family:"Inter",sans-serif;font-weight:700;font-size:15px;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 8px 22px -8px rgba(237,41,57,.5);transition:transform .15s,box-shadow .15s;}
.modal-submit:hover{transform:translateY(-1px);box-shadow:0 12px 28px -8px rgba(237,41,57,.65);}
.modal-submit:disabled{opacity:.7;cursor:not-allowed;transform:none;}
.modal-trust{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:16px;font-size:11.5px;color:var(--muted);flex-wrap:wrap;}
.modal-trust span{display:flex;align-items:center;gap:5px;}
.err{display:none;padding:11px 13px;background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.3);border-radius:8px;font-size:12.5px;color:#b91c1c;margin-bottom:14px;}
.err.show{display:block;}

/* Confirmation factice */
.confirm{display:none;text-align:center;padding:8px 4px 4px;}
.confirm.show{display:block;}
.confirm-ic{width:64px;height:64px;border-radius:50%;background:rgba(15,155,110,.12);color:#0f9b6e;display:grid;place-items:center;margin:0 auto 18px;}
.confirm-ic svg{width:32px;height:32px;}
.confirm h3{font-family:"Fraunces",serif;font-size:24px;font-weight:600;margin-bottom:8px;}
.confirm p{font-size:14px;color:var(--muted);line-height:1.6;max-width:340px;margin:0 auto 18px;}
.confirm-amount{font-family:"Fraunces",serif;font-size:38px;font-weight:700;background:linear-gradient(180deg,#054833,#0f9b6e);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:6px;}

@media(max-width:980px){
  .main{grid-template-columns:1fr;gap:36px;}
  .buy-col{position:static;}
  h1.title{font-size:42px;}
}
