/* ElioLyp — Feuille de style v1.0 */
/* Optimisée pour hébergement mutualisé Ionos */

:root {
  --pu:#6B2D8B;--pud:#4A1A6A;--pum:#9B5DC8;--pul:#F3E5F5;
  --go:#E8C840;--god:#7a5a00;--gol:#FFFDE7;
  --gr:#4CAF50;--grd:#2E7D32;--grl:#E8F5E9;
  --bl:#1BA8C8;--bld:#0277BD;--bll:#E3F2FD;
  --re:#E63946;--rel:#FFEBEE;
  --or:#F4880C;--orl:#FFF3E0;--ord:#E65100;
  --nv:#3F51B5;--nvl:#E8EAF6;
  --lv:#F8F4FC;--wh:#fff;--tx:#1A1A1A;--t2:#444;--t3:#888;--bd:#E0D4ED;
  --f:'Montserrat',Arial,sans-serif;--r:12px;--rs:8px;--max:1100px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--f);color:var(--tx);background:#fff;line-height:1.6}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.rb{height:5px;display:flex}.rb span{flex:1}
.globe{border-radius:50%;overflow:hidden;background:#fff;flex-shrink:0}
.gs{width:100%;height:100%;display:flex;flex-direction:column;padding:2px;gap:1px}
.gs span{flex:1;border-radius:1px}

/* NAV */
nav{background:var(--pu);padding:.7rem 1.5rem;display:flex;align-items:center;gap:1rem;position:sticky;top:0;z-index:100;box-shadow:0 2px 16px rgba(0,0,0,.15)}
.nav-logo{display:flex;align-items:center;gap:9px}
.nav-brand{font-size:15px;font-weight:900;color:#fff}.nav-brand span{color:var(--go)}
.nav-menu{display:flex;gap:1.25rem;margin-left:auto;align-items:center;flex-wrap:wrap}
.nav-menu a{font-size:11px;font-weight:700;color:rgba(255,255,255,.82);transition:color .2s}
.nav-menu a:hover{color:#fff}
.nav-cta{background:var(--go);color:var(--tx)!important;padding:5px 14px;border-radius:20px;font-weight:800!important}
.nav-back{background:rgba(255,255,255,.12);color:#fff!important;padding:5px 12px;border-radius:20px;font-size:11px!important}
.nav-hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;margin-left:auto}
.nav-hamburger span{width:22px;height:2px;background:#fff;border-radius:1px}

/* HERO */
.hero{background:var(--pud);padding:5rem 1.5rem 0;overflow:hidden;position:relative}
.hero::before{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0,rgba(255,255,255,.02) 1px,transparent 1px,transparent 24px)}
.hero-inner{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;position:relative;z-index:1}
.globe-xl{width:84px;height:84px;border:3px solid rgba(255,255,255,.25);margin-bottom:.7rem}
.gs-xl{padding:6px;gap:2.5px}
.app-name{font-size:clamp(42px,6vw,68px);font-weight:900;color:#fff;letter-spacing:-2px;line-height:1;margin-bottom:.2rem}
.app-name span{color:var(--go)}
.app-by{font-size:11px;color:rgba(255,255,255,.52);font-weight:600;text-transform:uppercase;letter-spacing:3px;margin-bottom:1.1rem}
.hero h1{font-size:clamp(20px,2.8vw,30px);font-weight:700;color:#fff;line-height:1.3;margin-bottom:.75rem}
.hero h1 em{color:var(--go);font-style:normal}
.hero-desc{font-size:13px;color:rgba(255,255,255,.74);line-height:1.75;margin-bottom:1.4rem;max-width:480px}
.hero-pills{display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:1.6rem}
.pill{padding:4px 12px;border-radius:20px;font-size:11px;font-weight:700;border:1.5px solid rgba(255,255,255,.22);color:rgba(255,255,255,.88)}
.hero-btns{display:flex;gap:.85rem;flex-wrap:wrap;margin-bottom:3rem}

/* BTNS */
.btn{padding:10px 24px;border-radius:24px;font-size:13px;font-weight:800;cursor:pointer;border:none;font-family:var(--f);transition:all .2s;display:inline-block}
.btn-go{background:var(--go);color:var(--tx)}.btn-go:hover{opacity:.9;transform:translateY(-1px)}
.btn-wh{background:rgba(255,255,255,.12);color:#fff;border:2px solid rgba(255,255,255,.4)}.btn-wh:hover{background:rgba(255,255,255,.2)}
.btn-pu{background:var(--pu);color:#fff}.btn-pu:hover{background:var(--pud)}
.btn-gr{background:var(--gr);color:#fff}.btn-gr:hover{background:var(--grd)}
.btn-bl{background:var(--bl);color:#fff}
.btn-fw{width:100%;display:block;text-align:center}

/* PHONE MOCKUP */
.ph-wrap{display:flex;justify-content:center}
.ph{width:252px;background:var(--pu);border-radius:28px 28px 0 0;overflow:hidden;box-shadow:0 20px 52px rgba(0,0,0,.32);border:5px solid rgba(255,255,255,.15)}
.ph-notch{height:24px;background:var(--pud);display:flex;align-items:center;justify-content:center}
.ph-notch-d{width:64px;height:10px;background:rgba(0,0,0,.4);border-radius:10px}
.ph-scr{background:var(--lv);padding:.7rem}
.ph-hd{background:var(--pu);border-radius:7px;padding:.55rem .7rem;margin-bottom:.45rem;display:flex;align-items:center;gap:5px}
.ph-br{font-size:11px;font-weight:800;color:#fff}.ph-br span{color:var(--go)}
.ph-card{background:#fff;border-radius:7px;padding:.55rem .7rem;margin-bottom:.35rem;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--bd)}
.ph-val{font-size:15px;font-weight:900}.ph-lbl{font-size:9px;color:var(--t3)}
.ph-badge{font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px}

/* STATS */
.stats-bar{background:var(--pu);padding:2rem 1.5rem}
.stats-grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;text-align:center}
.stat-num{font-size:32px;font-weight:900;color:var(--go);line-height:1}
.stat-lbl{font-size:11px;color:rgba(255,255,255,.7);margin-top:3px;font-weight:600}

/* SECTIONS */
.section{padding:4.5rem 1.5rem}
.section-lv{background:var(--lv)}
.section-pu{background:var(--pud)}
.cnt{max-width:var(--max);margin:0 auto}
.stag{display:inline-block;font-size:10px;font-weight:800;padding:3px 13px;border-radius:20px;margin-bottom:.6rem;letter-spacing:.5px;text-transform:uppercase}
h2{font-size:clamp(21px,3vw,34px);font-weight:900;line-height:1.2;margin-bottom:.65rem}
.sdesc{font-size:13px;color:var(--t2);line-height:1.75;max-width:600px;margin-bottom:2.5rem}
.tc{text-align:center}.tc .sdesc{margin:0 auto 2.5rem}

/* GRIDS */
.g2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}

/* FEAT CARDS */
.feat-c{border-radius:var(--r);padding:1.4rem;border:1px solid var(--bd);background:#fff;transition:transform .2s,box-shadow .2s}
.feat-c:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(107,45,139,.1)}
.feat-ico{width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:25px;margin-bottom:.85rem}
.feat-t{font-size:15px;font-weight:800;margin-bottom:.45rem}
.feat-d{font-size:12px;color:var(--t2);line-height:1.65}
.uniq{display:inline-block;font-size:10px;font-weight:700;padding:2px 9px;border-radius:20px;background:var(--rel);color:var(--re);margin-top:.6rem}

/* PORTALS */
.portal{border-radius:var(--r);overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.07)}
.portal-hd{padding:1.4rem 1.5rem}
.portal-body{background:#fff;padding:1.4rem 1.5rem}
.portal-list{list-style:none}
.portal-list li{display:flex;align-items:flex-start;gap:.6rem;padding:.45rem 0;border-bottom:.5px solid var(--bd);font-size:12px;color:var(--t2)}
.portal-list li:last-child{border-bottom:none}
.portal-list li::before{content:'✓';font-weight:800;flex-shrink:0;margin-top:1px}

/* TARIFS */
.tarif-g{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem}
.tarif-c{border-radius:var(--r);border:1.5px solid var(--bd);padding:1.2rem;text-align:center;background:#fff;transition:all .2s}
.tarif-c.feat{border-color:var(--pu);background:var(--pul)}
.tarif-c:hover{border-color:var(--pu);transform:translateY(-2px)}
.tarif-lbl{font-size:10px;font-weight:700;padding:2px 10px;border-radius:20px;display:inline-block;margin-bottom:.55rem}
.tarif-price{font-size:27px;font-weight:900;color:var(--pu);margin-bottom:.2rem}
.tarif-per{font-size:11px;color:var(--t3);margin-bottom:.7rem}
.tarif-list{font-size:11px;color:var(--t2);line-height:2;text-align:left;list-style:none}
.tarif-list li::before{content:'✓ ';color:var(--gr);font-weight:700}

/* ESCROW */
.escrow-col{display:flex;flex-direction:column;gap:.45rem}
.ef-step{padding:.75rem;border-radius:var(--rs);text-align:center;font-size:11px;font-weight:700;border:1.5px solid var(--bd)}
.ef-arr{text-align:center;font-size:17px;color:var(--pu);font-weight:900}

/* SECTORS */
.sec-g{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.sec-i{display:flex;align-items:center;gap:.7rem;padding:.8rem;border-radius:var(--rs);border:1px solid var(--bd);background:#fff}
.sec-ico{font-size:22px;flex-shrink:0}
.sec-name{font-size:12px;font-weight:700;color:var(--tx);margin-bottom:.15rem}
.sec-desc{font-size:10px;color:var(--t3)}

/* TECH */
.tech-g{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}
.tech-i{background:var(--lv);border-radius:var(--rs);padding:.85rem;text-align:center;border:1px solid var(--bd)}
.tech-n{font-size:12px;font-weight:700;color:var(--pu);margin-bottom:.2rem}
.tech-d{font-size:10px;color:var(--t3)}

/* CTA BAND */
.cta-band{background:var(--pu);padding:4rem 1.5rem;text-align:center}

/* CONTACT */
.con-sec{background:var(--pud);padding:4rem 1.5rem}
.con-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
.con-form{background:#fff;border-radius:var(--r);padding:1.75rem}
.fg{margin-bottom:.85rem}
.fg label{display:block;font-size:10px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.3rem}
.fg input,.fg select,.fg textarea{width:100%;padding:9px 12px;border:1.5px solid var(--bd);border-radius:var(--rs);font-size:12px;font-family:var(--f);color:var(--tx);background:#fff;transition:border .2s}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--pu)}
.fg textarea{height:80px;resize:none}
.fr2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.cd{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}
.cd-ico{width:36px;height:36px;border-radius:9px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.cd-lbl{font-size:10px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.05em}
.cd-val{font-size:13px;color:#fff;font-weight:600}
.sl-btn{padding:7px 14px;border-radius:18px;font-size:11px;font-weight:700;cursor:pointer;border:none;font-family:var(--f);transition:opacity .2s}
.sl-btn:hover{opacity:.9}

/* RGPD */
.rgpd-sec{background:var(--lv);padding:3rem 1.5rem}
.rgpd-c{padding:.9rem;background:#fff;border-radius:var(--rs);border:1px solid var(--bd)}

/* COOKIE */
.cookie{background:var(--pud);padding:.85rem 1.5rem;border-top:3px solid var(--go)}
.ck-in{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}
.ck-txt{font-size:11px;color:rgba(255,255,255,.8);flex:1}
.ck-txt a{color:var(--go);text-decoration:underline}
.ckb{padding:6px 14px;border-radius:18px;font-size:11px;font-weight:700;cursor:pointer;border:none;font-family:var(--f)}
.ckb-a{background:var(--go);color:var(--tx)}
.ckb-r{background:transparent;color:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.25)}

/* FOOTER */
footer{background:var(--pud);padding:2.5rem 1.5rem 1.25rem}
.footer-in{max-width:var(--max);margin:0 auto}
.footer-g{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem;padding-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.08)}
.fc h4{font-size:10px;font-weight:800;color:rgba(255,255,255,.85);text-transform:uppercase;letter-spacing:.07em;margin-bottom:.85rem}
.fc a{display:block;font-size:11px;color:rgba(255,255,255,.5);margin-bottom:.4rem;transition:color .2s}
.fc a:hover{color:#fff}
.fbot{padding-top:1.25rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.75rem}
.fleg{font-size:10px;color:rgba(255,255,255,.4);line-height:1.6}
.fleg a{color:rgba(255,255,255,.55);margin:0 .35rem}
.fbadge{display:inline-flex;align-items:center;gap:.3rem;background:rgba(255,255,255,.06);padding:3px 10px;border-radius:20px;font-size:9px;font-weight:700;color:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.1)}
.fbadges{display:flex;gap:.4rem;flex-wrap:wrap}

@media(max-width:900px){
  .hero-inner,.con-in{grid-template-columns:1fr}
  .ph-wrap{display:none}
  .stats-grid{grid-template-columns:1fr 1fr}
  .g3{grid-template-columns:1fr 1fr}
  .tarif-g,.tech-g{grid-template-columns:repeat(2,1fr)}
  .footer-g{grid-template-columns:1fr 1fr}
  .nav-menu{display:none}
  .nav-hamburger{display:flex}
}
@media(max-width:580px){
  .g2,.g3,.g4,.sec-g,.footer-g,.fr2{grid-template-columns:1fr}
  .tarif-g,.tech-g{grid-template-columns:1fr 1fr}
  .stats-grid{grid-template-columns:1fr 1fr}
  .section{padding:3rem 1.25rem}
  .fbot{flex-direction:column;text-align:center}
}