/* ============================================
   HME 3D — Apple-style design system
   Shared by: index, services, materiaux, support
   ============================================ */

:root{
  --bg:#fbfbfd;
  --bg-2:#f5f5f7;
  --ink:#1d1d1f;
  --gray-1:#86868b;
  --gray-2:#6e6e73;
  --gray-3:#d2d2d7;
  --line:rgba(0,0,0,.07);
  --line-soft:rgba(0,0,0,.04);
  --green:#3a7d44;
  --green-d:#2d6438;
  --green-soft:rgba(58,125,68,.08);
  --green-light:#e8f2ea;
  --red:#dc2626;
  --red-soft:rgba(220,38,38,.08);
  --amber:#f59e0b;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font);
  background:white;
  color:var(--ink);
  font-weight:400;
  line-height:1.47;
  overflow-x:hidden;
  letter-spacing:-.003em;
}
::selection{background:var(--green);color:white;}

/* === NAV === */
nav.topnav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  height:56px;display:flex;align-items:center;justify-content:center;
  transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .35s;
}
nav.topnav.hidden{transform:translateY(-100%);opacity:0;}
.nav-bg{
  position:absolute;inset:0;
  background:rgba(255,255,255,.85);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.06);
  z-index:-1;
}
.nav-inner{
  width:100%;max-width:1200px;padding:0 32px;
  display:grid;grid-template-columns:140px 1fr 140px;align-items:center;
}
.nav-logo img{height:30px;display:block;}
.nav-links{display:flex;align-items:center;justify-content:center;gap:0;position:relative;}
.nav-indicator{
  position:absolute;bottom:-1px;height:2px;
  background:var(--green);border-radius:1px;
  transition:left .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1);
}
.nav-link{
  padding:8px 15px;font-size:13px;font-weight:500;
  color:var(--gray-2);text-decoration:none;
  transition:color .15s;white-space:nowrap;
}
.nav-link:hover,.nav-link.active{color:var(--ink);}
.nav-link.active{font-weight:600;}

.lang-sw{
  display:flex;gap:1px;background:rgba(0,0,0,.06);
  border-radius:6px;padding:2px;
  position:fixed;top:14px;left:24px;z-index:300;
  transition:all .3s;
}
.lang-sw.hidden{transform:translateY(-140%);opacity:0;}
.lang-sw .lang-btn{
  padding:4px 9px;border-radius:4px;cursor:pointer;
  color:var(--gray-2);border:none;background:none;
  font-family:var(--font);font-size:11px;font-weight:600;
  transition:all .15s;
}
.lang-sw .lang-btn.on{
  background:white;color:var(--ink);
  box-shadow:0 1px 3px rgba(0,0,0,.12);
}
.nav-espace{
  position:fixed;top:12px;right:24px;z-index:300;
  padding:8px 18px;background:var(--ink);color:white;
  font-size:13px;font-weight:600;border-radius:20px;
  text-decoration:none;transition:all .3s;font-family:var(--font);
}
.nav-espace:hover{background:var(--green);}
.nav-espace.hidden{transform:translateY(-140%);opacity:0;}

/* === Typography helpers === */
.h-headline{
  font-size:clamp(40px,6vw,80px);
  font-weight:700;line-height:1.05;letter-spacing:-.04em;
  color:var(--ink);
}
.h-headline .lt{font-weight:300;color:var(--gray-2);}
.h-section{
  font-size:clamp(36px,5vw,58px);
  font-weight:700;line-height:1.08;letter-spacing:-.03em;
  color:var(--ink);
}
.h-section .lt{font-weight:300;color:var(--gray-2);}
.lead{
  font-size:clamp(17px,2vw,21px);
  font-weight:400;line-height:1.45;
  color:var(--gray-2);letter-spacing:-.012em;
}
.eyebrow{
  display:inline-block;
  font-size:13px;font-weight:600;
  color:var(--green);
  margin-bottom:14px;
  letter-spacing:.01em;
}

/* === Sections === */
section{padding:120px 22px;position:relative;background:white;}
.section-alt{background:var(--bg-2);}
.section-wrap{max-width:1080px;margin:0 auto;}
.section-h{text-align:center;margin-bottom:64px;}
.section-h .lead{max-width:640px;margin:14px auto 0;}

/* === Buttons === */
.btn-p{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--green);color:white;
  padding:12px 28px;border-radius:99px;
  font-size:15px;font-weight:500;text-decoration:none;
  transition:transform .2s,background .2s;
  letter-spacing:-.005em;
  border:none;cursor:pointer;font-family:inherit;
}
.btn-p:hover{background:var(--green-d);transform:scale(1.02);}
.btn-p svg{width:13px;height:13px;transition:transform .25s;}
.btn-p:hover svg{transform:translateX(3px);}
.btn-p.dark{background:var(--ink);}
.btn-p.dark:hover{background:var(--green);}
.btn-g{
  display:inline-flex;align-items:center;gap:6px;
  background:white;color:var(--ink);
  padding:12px 24px;border-radius:99px;
  font-size:15px;font-weight:500;text-decoration:none;
  border:1px solid var(--gray-3);
  transition:all .2s;font-family:inherit;cursor:pointer;
}
.btn-g:hover{background:var(--bg-2);border-color:var(--ink);}
.btn-ghost{
  display:inline-flex;align-items:center;gap:6px;
  background:transparent;color:var(--ink);
  padding:12px 24px;
  font-size:15px;font-weight:500;text-decoration:none;
  transition:opacity .2s;letter-spacing:-.005em;
}
.btn-ghost:hover{opacity:.6;}

/* === Form fields === */
.field{margin-bottom:20px;}
.field label{
  display:block;font-size:13px;font-weight:500;
  color:var(--gray-2);margin-bottom:8px;letter-spacing:-.005em;
}
.input,.textarea,.select{
  width:100%;
  padding:12px 16px;
  border:1px solid var(--gray-3);
  border-radius:12px;
  font-size:15px;
  font-family:inherit;
  background:white;
  color:var(--ink);
  transition:border-color .2s,box-shadow .2s;
  letter-spacing:-.005em;
}
.input:focus,.textarea:focus,.select:focus{
  outline:none;border-color:var(--green);
  box-shadow:0 0 0 4px var(--green-soft);
}
.textarea{resize:vertical;min-height:120px;font-family:inherit;}
.select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2.5'><polyline points='6 9 12 15 18 9'/></svg>");background-repeat:no-repeat;background-position:right 14px center;padding-right:42px;cursor:pointer;}

/* === Animations on scroll === */
[data-anim]{opacity:0;transform:translateY(20px);transition:opacity .9s cubic-bezier(.4,0,.2,1),transform .9s cubic-bezier(.4,0,.2,1);}
[data-anim].in{opacity:1;transform:none;}
[data-anim-delay="1"]{transition-delay:.08s;}
[data-anim-delay="2"]{transition-delay:.16s;}
[data-anim-delay="3"]{transition-delay:.24s;}
[data-anim-delay="4"]{transition-delay:.32s;}

/* === FOOTER === */
footer.apple-footer{
  border-top:1px solid var(--line);
  padding:40px 22px 28px;
  background:white;
}
.footer-wrap{
  max-width:1080px;margin:0 auto;
  display:flex;justify-content:space-between;
  align-items:center;gap:24px;flex-wrap:wrap;
  font-size:12px;color:var(--gray-1);
}
.footer-links{display:flex;gap:24px;flex-wrap:wrap;}
.footer-links a{color:var(--gray-1);text-decoration:none;transition:color .15s;}
.footer-links a:hover{color:var(--ink);}

/* === Admin FAB === */
.admin-fab{
  position:fixed;bottom:24px;right:24px;z-index:200;
  width:44px;height:44px;border-radius:50%;
  background:linear-gradient(135deg,#1d1d1f 0%,#3a3a3c 100%);
  color:white;display:flex;align-items:center;justify-content:center;
  text-decoration:none;
  box-shadow:0 4px 16px rgba(0,0,0,.18), 0 2px 4px rgba(0,0,0,.08);
  opacity:0;pointer-events:none;
  transform:translateY(20px) scale(.85);
  transition:opacity .35s cubic-bezier(.4,0,.2,1),transform .35s cubic-bezier(.4,0,.2,1),background .25s,box-shadow .25s;
}
.admin-fab.visible{opacity:1;pointer-events:auto;transform:translateY(0) scale(1);}
.admin-fab:hover{
  background:linear-gradient(135deg,var(--green) 0%,#2d6438 100%);
  box-shadow:0 6px 20px rgba(58,125,68,.35);
  transform:translateY(-2px) scale(1.05);
}
.admin-fab svg{transition:transform .25s;}
.admin-fab:hover svg{transform:rotate(45deg);}

/* === Card === */
.card{
  background:white;
  border:1px solid var(--line);
  border-radius:22px;
  padding:32px;
}

/* === Responsive === */
@media(max-width:680px){
  .nav-link{display:none;}
  section{padding:80px 22px;}
}