
:root{
  --blue-900:#0b2a55; /* proche bleu foncé */
  --blue-800:#0f356b;
  --blue-700:#134080;
  --blue-600:#1e3a8a;
  --blue-500:#2563eb;
  --blue-400:#38bdf8;
  --ink:#0b1220;
  --muted:#7b8aa0;
  --bg:#f7f9fc;
  --white:#ffffff;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;color:var(--ink);background:var(--bg);scroll-behavior:smooth}
img{max-width:100%;display:block}
a{color:var(--blue-500);text-decoration:none}
a:hover{text-decoration:underline}

.nav{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:14px 22px;background:linear-gradient(to bottom,rgba(10,24,48,.9),rgba(10,24,48,.5),transparent);z-index:50}
.nav .brand{font-weight:800;font-size:1.1rem;color:#e8f1ff;letter-spacing:.2px}
.nav nav a{margin:0 10px;color:#e6eeff;font-weight:600;opacity:.9}
.nav .btn{margin-left:8px}

.panel{position:relative;min-height:80vh;background-position:center;background-size:cover;background-attachment:fixed;display:grid;place-items:center;text-align:center;color:#e6eeff}
.panel .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,20,40,.5),rgba(8,20,40,.6))}
.panel .midline{position:relative;z-index:1;font-size:clamp(1.8rem,3.2vw,3rem);font-weight:800;letter-spacing:.2px;text-shadow:0 2px 16px rgba(0,0,0,.35)}

.hero {background-image: url('https://images.unsplash.com/photo-1517336714731-489689fd1ca8?q=80&w=1920&auto=format&fit=crop');}
.hero .hero-inner{position:relative;z-index:1;padding-inline:18px}
.title{font-size:clamp(2.2rem,6vw,4rem);line-height:1.05;margin:0 0 12px;font-weight:800;color:#e6f2ff;text-shadow:0 20px 60px rgba(0,0,0,.35)}
.subtitle{font-size:clamp(1rem,2.2vw,1.4rem);opacity:.95;margin:0 0 24px;color:#dbeafe}

.section{padding:72px 20px;max-width:1200px;margin:0 auto}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.card{background:var(--white);border-radius:18px;padding:22px 20px;box-shadow:0 10px 30px rgba(8,20,40,.08);border:1px solid rgba(10,30,60,.06)}
.card h3{margin:6px 0 6px;font-size:1.1rem}
.card p{margin:0;color:#41546e}
.icon{width:28px;height:28px;color:var(--blue-600)}

.mid{background-image:url('https://images.pexels.com/photos/3182781/pexels-photo-3182781.jpeg?auto=compress&cs=tinysrgb&w=1920');min-height:60vh}
.mountain{background-image:url('https://images.unsplash.com/photo-1519681393784-d120267933ba?q=80&w=1920&auto=format&fit=crop');min-height:65vh}

.services h2,.works h2,.ai h2,.contact h2{font-size:clamp(1.6rem,3vw,2rem);margin:0 0 18px;color:var(--blue-800)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 24px}
.chip{border:1px solid rgba(10,30,60,.15);background:#fff;border-radius:999px;padding:10px 14px;font-weight:600;cursor:pointer;transition:.2s}
.chip:hover{border-color:var(--blue-400);transform:translateY(-1px)}

.work{display:block;border-radius:16px;overflow:hidden;border:1px solid rgba(10,30,60,.06);box-shadow:0 10px 30px rgba(8,20,40,.07)}
.work img{width:100%;height:220px;object-fit:cover}
.work span{display:block;padding:12px 14px;font-weight:600;color:#24364f;background:#fff}

.ai p{color:#425a78}
#ai-form{display:flex;gap:10px;flex-wrap:wrap}
#ai-input{flex:1;min-width:260px;padding:12px 14px;border:1px solid rgba(10,30,60,.15);border-radius:12px;font-size:1rem}
.ideas{margin-top:18px;display:grid;gap:12px}
.idea{background:#fff;border:1px solid rgba(10,30,60,.1);border-radius:14px;padding:14px 16px}
.idea h4{margin:0 0 8px;color:var(--blue-700)}

.contact p{color:#425a78}
.contact-form .row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.contact-form input,.contact-form textarea{width:100%;padding:12px 14px;border:1px solid rgba(10,30,60,.15);border-radius:12px;font-size:1rem}
.contact-form textarea{resize:vertical}
.footer{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;padding:20px;background:linear-gradient(180deg,rgba(8,20,40,.02),rgba(8,20,40,.06));border-top:1px solid rgba(10,30,60,.08)}
.footer a{color:var(--blue-600);font-weight:700}
.to-top{padding:6px 10px;border:1px solid rgba(10,30,60,.15);border-radius:10px}

.btn{display:inline-block;border-radius:12px;padding:12px 16px;border:1px solid transparent;font-weight:800;letter-spacing:.2px;box-shadow:0 10px 24px rgba(37,99,235,.2);transition:.25s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(90deg,var(--blue-600),var(--blue-500));color:#fff}
.btn-small{padding:8px 12px;background:rgba(255,255,255,.1);color:#e6eeff;border:1px solid rgba(255,255,255,.2)}

.credit{position:absolute;bottom:8px;right:12px;font-size:12px;opacity:.7}
.credit a{color:#cfe3ff}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media (max-width:900px){
  .grid-3{grid-template-columns:1fr}
  .panel{background-attachment:scroll}
}
