
:root{--orange:#e27831;--olive:#6d783c;--ink:#292b27;--muted:#6d7069;--cream:#f7f5ee;--line:#e5e1d7}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;color:var(--ink);line-height:1.55}a{text-decoration:none;color:inherit}.wrap{width:min(1160px,calc(100% - 40px));margin:auto}
header{position:sticky;top:0;z-index:20;background:#fffffff2;border-bottom:1px solid var(--line)}.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between}.nav nav{display:flex;align-items:center;gap:24px;font-weight:700;font-size:14px}.menu{display:none}
.logo{display:inline-flex!important;align-items:baseline!important;white-space:nowrap;font-size:30px;font-weight:900}.fa{color:var(--orange)}.so{color:var(--olive)}.olive-o{position:relative;display:inline-block!important;width:.48em;height:.57em;border:.105em solid var(--olive);border-radius:48% 52% 49% 51%/45% 44% 56% 55%;margin-left:.02em}.olive-o:before{content:"";position:absolute;width:.27em;height:.12em;right:-.13em;top:-.15em;background:var(--olive);border-radius:100% 8% 100% 8%;transform:rotate(-24deg)}
.hero,.product-hero{padding:85px 0;background:var(--cream)}.hero-grid,.split,.demo-grid,.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.kicker{font-size:11px;letter-spacing:2px;font-weight:900;color:var(--olive)}h1,h2,h3{line-height:1.08}h1{font-size:clamp(52px,7vw,86px);letter-spacing:-3px;margin:15px 0}.product-hero h1{color:var(--orange)}h2{font-size:clamp(34px,4vw,54px)}.lead{font-size:19px;color:var(--muted)}.pill{display:inline-flex;padding:13px 18px;border-radius:12px;font-weight:800;border:1px solid var(--line);margin:5px}.orange{background:var(--orange);color:white}.dark{background:var(--ink);color:white}.whatsapp{background:#edf1df;color:#4f5b28}.actions{margin-top:25px}
.section{padding:80px 0}.cream{background:var(--cream)}.cards,.feature-grid,.role-grid,.values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card,.feature-grid article,.role,.contact-card{border:1px solid var(--line);border-radius:20px;padding:25px;background:white}.card.main{background:#fff7f1}.tag{display:inline-block;padding:6px 9px;border-radius:99px;background:#ffe9da;color:#b85e22;font-size:10px;font-weight:900}.tag.green{background:#edf1df;color:#4f5b28}.tag.gray{background:#eee}.proof{border-block:1px solid var(--line)}.four{display:grid;grid-template-columns:repeat(4,1fr)}.four div{padding:22px}.four b,.four span{display:block}.four span,.card p,.feature-grid p,.role p{color:var(--muted)}
.ecosystem{background:white;padding:22px;border:1px solid var(--line);border-radius:25px}.eco{display:block;padding:18px;margin-top:10px;border-radius:15px}.edu{background:#fff0e5}.track{background:#eef1e3}.market{background:#f0f0ed}.eco b,.eco span{display:block}.symbol,.dark-section{background:var(--ink);color:white;padding:70px 0}.lightcopy,.symbol p{color:#d5d6d2}.biglogo{font-size:80px;font-weight:900;color:var(--orange)}
.problem-grid,.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.problem-grid div,.steps div{border:1px solid var(--line);padding:20px;border-radius:16px}.faq details{padding:16px;background:white;border:1px solid var(--line);border-radius:12px;margin:10px 0}
.phone-frame{width:210px;margin:auto;background:#171813;padding:8px;border-radius:28px;box-shadow:0 20px 50px #0002}.phone-frame img{display:block;width:100%;border-radius:21px}.device-stage,.role-device{background:#f3f1e9;border:1px solid var(--line);border-radius:24px;padding:25px;text-align:center}.role-device .phone-frame{width:180px}.device-caption{margin-top:12px}.device-caption b,.device-caption span{display:block}
.demo form{background:var(--cream);padding:25px;border-radius:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.demo label{font-size:12px;font-weight:800}.demo input,.demo textarea,.demo select{width:100%;padding:12px;margin-top:5px;border:1px solid var(--line);border-radius:9px;background:white}.submit{border:0;width:100%}
footer{background:#20221e;color:white;padding:45px 0 20px}.foot{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.foot a,.foot span,.foot p{display:block;color:#bbb;font-size:13px}.foot .logo span,.foot .logo .olive-o{display:inline-block!important}.copyright{border-top:1px solid #3a3c36;margin-top:30px;padding-top:18px;color:#999;font-size:12px}.page-title{font-size:clamp(44px,6vw,70px)}.contact-card>*{display:block;margin-bottom:12px}.legal{max-width:820px}.legal p{color:var(--muted)}
@media(max-width:900px){.nav nav{display:none}.hero-grid,.split,.demo-grid,.contact-grid{grid-template-columns:1fr}.cards,.feature-grid,.role-grid{grid-template-columns:1fr}.four{grid-template-columns:1fr 1fr}.foot{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}}

.product-logo{display:block;max-width:210px;max-height:115px;object-fit:contain;margin:18px 0 12px}
.product-title{font-size:clamp(46px,6vw,74px);letter-spacing:-2.5px}
.product-brand-panel{min-height:420px;background:white;border:1px solid var(--line);border-radius:28px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:45px;box-shadow:0 20px 55px rgba(41,43,39,.08)}
.product-brand-panel img{max-width:78%;max-height:240px;object-fit:contain}.product-brand-panel span{margin-top:25px;color:var(--muted);font-weight:700}
.card-logo{display:block;width:auto;height:58px;max-width:150px;object-fit:contain;margin-bottom:15px}
.product-link{display:block;margin-top:16px;color:var(--orange);font-weight:850}
.disabled-pill{background:#eee;color:#777;cursor:default}

.falages-page-logo{display:block;max-width:310px;max-height:145px;object-fit:contain;object-position:left center;margin-bottom:18px}
.card-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:16px}
.card-actions .product-link{margin-top:0}
.store-link{font-size:13px;font-weight:800;color:var(--olive);border-bottom:1px solid currentColor}
.eco strong{display:block;margin-top:8px;font-size:12px}

/* V8.2 — logo produit FalaGeS */
.falages-page-logo{
  display:block;
  width:min(330px,72%);
  max-height:150px;
  object-fit:contain;
  object-position:left center;
  margin:0 0 22px 0;
}

/* V8.3 — le logo FalaGeS remplace le titre texte */
.falages-logo-title{
  margin:18px 0 12px;
  line-height:1;
}
.falages-logo-title img{
  display:block;
  width:min(390px,82%);
  max-height:165px;
  object-fit:contain;
  object-position:left center;
}

/* V8.4 — logo FalaGeS plus visible */
.falages-logo-title{margin:24px 0 20px;width:100%;}
.falages-logo-title img{display:block;width:min(620px,100%);height:auto;max-height:none;object-fit:contain;object-position:left center;}
@media(max-width:700px){.falages-logo-title img{width:min(500px,100%);}}

/* V8.5 — harmonisation visuelle des logos produits sur l'accueil */
.card-logo{
  display:block;
  width:auto;
  height:72px;
  max-width:180px;
  object-fit:contain;
  object-position:left center;
  margin-bottom:18px;
}
.card img[src$="logo-falages.png"].card-logo{
  height:auto;
  width:250px;
  max-width:100%;
  max-height:105px;
  object-fit:contain;
  object-position:left center;
  margin-top:-8px;
  margin-bottom:10px;
}
.card img[src$="logo-falatrack.png"].card-logo,
.card img[src$="logo-falahabou.png"].card-logo{
  height:72px;
  width:auto;
  max-width:180px;
}
@media(max-width:700px){
  .card img[src$="logo-falages.png"].card-logo{
    width:230px;
  }
}

/* V8.7 — navigation mobile */
.mobile-menu-toggle{
  display:none;
  width:44px;
  height:44px;
  padding:10px;
  border:1px solid rgba(41,43,39,.14);
  border-radius:12px;
  background:#fff;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
}
.mobile-menu-toggle span{
  display:block;
  width:22px;
  height:2px;
  border-radius:2px;
  background:#292B27;
  transition:transform .2s ease, opacity .2s ease;
}

@media(max-width:820px){
  header .container,
  header .nav-wrap,
  .site-header .container{
    position:relative;
  }
  .mobile-menu-toggle{
    display:flex;
    margin-left:auto;
    flex:0 0 auto;
  }
  header nav{
    display:none !important;
    position:absolute;
    top:calc(100% + 10px);
    left:16px;
    right:16px;
    z-index:1000;
    padding:12px;
    border:1px solid rgba(41,43,39,.12);
    border-radius:16px;
    background:#fff;
    box-shadow:0 18px 45px rgba(41,43,39,.14);
    flex-direction:column;
    align-items:stretch;
    gap:4px;
  }
  body.mobile-menu-open header nav{
    display:flex !important;
  }
  header nav a{
    display:block;
    width:100%;
    padding:11px 12px;
    border-radius:10px;
  }
  header nav a:hover{
    background:#F7F5EE;
  }
  body.mobile-menu-open .mobile-menu-toggle span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }
  body.mobile-menu-open .mobile-menu-toggle span:nth-child(2){
    opacity:0;
  }
  body.mobile-menu-open .mobile-menu-toggle span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }
}
