/* ═══════════════════════════════════════════
       WEBKYLSTUDIO — INDEX PREMIUM
    ═══════════════════════════════════════════ */
    :root {
      --ink:     #0d0d12;
      --ink2:    #52526b;
      --white:   #ffffff;
      --bg:      #eef0f8;
      --violet:  #6366f1;
      --rose:    #ec4899;
      --accent:  #10b981;
      --grad:    linear-gradient(135deg,#6366f1,#ec4899);
      --r:       14px;
      --ease:    cubic-bezier(.22,.68,0,1.2);
    }
    *,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
    html{scroll-behavior:smooth;overflow-x:hidden;}
    body{font-family:'DM Sans',sans-serif;background:linear-gradient(160deg, #eef0f8 0%, #f0edf8 40%, #f5eef4 70%, #eef3f0 100%);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden;}

    /* ── NAV ── */
    nav {
      position:fixed;top:0;left:0;right:0;z-index:1000;
      display:flex;align-items:center;justify-content:space-between;
      padding:0 5%;height:72px;
      background:rgba(247,246,243,.88);
      backdrop-filter:blur(20px);
      border-bottom:1px solid rgba(0,0,0,.07);
      transition:box-shadow .3s;
    }
    nav.scrolled{box-shadow:0 2px 24px rgba(0,0,0,.08);}
    .nav-logo{font-family:'Archivo Black',sans-serif;font-size:1.25rem;color:var(--ink);text-decoration:none;letter-spacing:-.5px;}
    .nav-logo span{color:var(--violet);}
    .nav-links{display:flex;align-items:center;gap:2.5rem;list-style:none;}
    .nav-links a{color:var(--ink2);text-decoration:none;font-size:.9rem;font-weight:400;transition:color .2s;}
    .nav-links a:hover{color:var(--ink);}
    .nav-cta{
      background:var(--ink);color:var(--white);
      padding:.65rem 1.4rem;border-radius:100px;
      font-size:.85rem;font-weight:500;text-decoration:none;
      transition:background .25s,transform .25s;
      white-space:nowrap;
    }
    .nav-cta:hover{background:var(--violet);transform:translateY(-1px);}
    .menu-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;}
    .menu-toggle span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:all .3s;}

    /* ── HERO ── */
    .hero {
      min-height:100svh;
      display:flex;flex-direction:column;
      align-items:center;justify-content:center;
      text-align:center;
      padding:120px 5% 80px;
      position:relative;overflow:hidden;
    }

    /* Fond mesh animé */
    .hero-mesh{
      position:absolute;inset:0;z-index:0;
      background:
        radial-gradient(ellipse 55% 45% at 15% 25%, rgba(99,102,241,.18) 0%, transparent 55%),
        radial-gradient(ellipse 45% 55% at 85% 75%, rgba(236,72,153,.14) 0%, transparent 55%),
        radial-gradient(ellipse 60% 40% at 50% 50%, rgba(16,185,129,.08) 0%, transparent 60%),
        radial-gradient(ellipse 35% 35% at 70% 20%, rgba(139,92,246,.12) 0%, transparent 50%);
      animation:meshMove 10s ease-in-out infinite alternate;
    }
    @keyframes meshMove{
      0%{opacity:.7;transform:scale(1) rotate(0deg);}
      33%{opacity:1;transform:scale(1.05) rotate(1deg);}
      66%{opacity:.85;transform:scale(.98) rotate(-1deg);}
      100%{opacity:1;transform:scale(1.03) rotate(.5deg);}
    }

    /* Grain texture */
    .hero::after{
      content:'';position:absolute;inset:0;z-index:1;
      background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
      pointer-events:none;
    }

    .hero-inner{position:relative;z-index:2;max-width:900px;}

    .hero-badge {
      display:inline-flex;align-items:center;gap:8px;
      background:rgba(99,102,241,.08);
      border:1px solid rgba(99,102,241,.2);
      padding:6px 16px;border-radius:100px;
      font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
      color:var(--violet);font-weight:600;
      margin-bottom:32px;
      animation:fadeUp .8s var(--ease) both;
    }
    .hero-badge::before{content:'✦';font-size:.6rem;}

    .hero-h1 {
      font-family:'Archivo Black',sans-serif;
      font-size:clamp(3.2rem,8vw,7.5rem);
      line-height:.92;letter-spacing:-.04em;
      color:var(--ink);
      margin-bottom:28px;
      animation:fadeUp .8s var(--ease) .1s both;
    }
    .hero-h1 em{
      font-style:italic;font-family:Georgia,serif;font-weight:400;
      background:var(--grad);
      -webkit-background-clip:text;background-clip:text;
      -webkit-text-fill-color:transparent;
    }

    .hero-sub {
      font-size:clamp(1rem,2vw,1.25rem);
      color:var(--ink2);font-weight:300;line-height:1.75;
      max-width:580px;margin:0 auto 48px;
      animation:fadeUp .8s var(--ease) .2s both;
    }

    .hero-btns {
      display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
      animation:fadeUp .8s var(--ease) .3s both;
    }
    .btn-main {
      display:inline-flex;align-items:center;gap:8px;
      background:var(--ink);color:var(--white);
      padding:1rem 2rem;border-radius:100px;
      font-size:.9rem;font-weight:500;text-decoration:none;
      transition:background .25s,transform .25s,box-shadow .25s;
    }
    .btn-main:hover{background:var(--violet);transform:translateY(-2px);box-shadow:0 12px 32px rgba(99,102,241,.3);}
    .btn-main::after{content:'→';}
    .btn-ghost {
      display:inline-flex;align-items:center;gap:8px;
      background:transparent;color:var(--ink);
      padding:1rem 2rem;border-radius:100px;
      border:1.5px solid rgba(0,0,0,.15);
      font-size:.9rem;font-weight:500;text-decoration:none;
      transition:border-color .25s,background .25s,transform .25s;
    }
    .btn-ghost:hover{border-color:var(--ink);background:rgba(0,0,0,.04);transform:translateY(-2px);}

    /* Stats sous le hero */
    .hero-stats {
      display:flex;align-items:center;justify-content:center;gap:40px;
      margin-top:72px;
      animation:fadeUp .8s var(--ease) .45s both;
    }
    .stat{text-align:center;}
    .stat-num{font-family:'Archivo Black',sans-serif;font-size:1.8rem;color:var(--ink);letter-spacing:-.03em;}
    .stat-lbl{font-size:.78rem;color:var(--ink2);text-transform:uppercase;letter-spacing:.1em;margin-top:2px;}
    .stat-sep{width:1px;height:40px;background:rgba(0,0,0,.12);}

    /* ── MARQUEE ── */
    .marquee-wrap{
      overflow:hidden;border-top:1px solid rgba(0,0,0,.07);border-bottom:1px solid rgba(0,0,0,.07);
      padding:18px 0;background:var(--white);
    }
    .marquee-track{
      display:flex;gap:60px;width:max-content;
      animation:marquee 20s linear infinite;
    }
    .marquee-track:hover{animation-play-state:paused;}
    @keyframes marquee{to{transform:translateX(-50%);}}
    .marquee-item{
      font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
      color:var(--ink2);font-weight:500;white-space:nowrap;
      display:flex;align-items:center;gap:12px;
    }
    .marquee-item span{color:var(--violet);}

    /* ── SERVICES ── */
    .services-section{padding:100px 5%;}
    .section-label{
      font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
      color:var(--rose);font-weight:600;margin-bottom:14px;display:block;
    }
    .section-title{
      font-family:'Archivo Black',sans-serif;
      font-size:clamp(2rem,4vw,3.2rem);
      color:var(--ink);letter-spacing:-.03em;line-height:1.05;
      margin-bottom:60px;
    }
    .section-title em{font-style:italic;font-family:Georgia,serif;font-weight:400;color:var(--violet);}

    .services-grid{
      display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px;
      background:rgba(0,0,0,.08);border:1px solid rgba(0,0,0,.08);
      border-radius:var(--r);overflow:hidden;
      max-width:1100px;
    }
    .srv{
      background:var(--white);padding:40px 36px;
      transition:background .25s;position:relative;overflow:hidden;
    }
    .srv:hover{background:#fafaff;}
    .srv::before{
      content:'';position:absolute;top:0;left:0;right:0;height:2px;
      background:var(--grad);transform:scaleX(0);transform-origin:left;
      transition:transform .35s var(--ease);
    }
    .srv:hover::before{transform:scaleX(1);}
    .srv-icon{font-size:2.2rem;margin-bottom:20px;display:block;}
    .srv-title{font-family:'Archivo Black',sans-serif;font-size:1.15rem;color:var(--ink);margin-bottom:10px;letter-spacing:-.02em;}
    .srv-desc{font-size:.88rem;color:var(--ink2);line-height:1.7;}

    /* ── PROCESS ── */
    .process-section{padding:100px 5%;background:var(--white);}
    .process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;max-width:1100px;margin-top:60px;}
    .proc{position:relative;padding:36px 28px;border:1px solid rgba(0,0,0,.08);border-radius:var(--r);background:var(--bg);transition:transform .3s,box-shadow .3s;}
    .proc:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(0,0,0,.08);}
    .proc-num{font-family:'Archivo Black',sans-serif;font-size:3.5rem;color:transparent;-webkit-text-stroke:1.5px rgba(99,102,241,.2);line-height:1;margin-bottom:16px;}
    .proc-title{font-family:'Archivo Black',sans-serif;font-size:1rem;color:var(--ink);margin-bottom:8px;}
    .proc-desc{font-size:.84rem;color:var(--ink2);line-height:1.65;}
    .proc-line{position:absolute;top:50%;right:-1rem;width:2rem;height:1px;background:rgba(0,0,0,.12);}
    .proc:last-child .proc-line{display:none;}

    /* ── EXEMPLES ── */
    .exemples-section{padding:100px 5%;}
    .exemples-grid{
      display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
      max-width:1100px;margin-top:60px;
    }
    .ex-card{
      position:relative;border-radius:var(--r);overflow:hidden;
      border:1px solid rgba(0,0,0,.08);background:var(--white);
      text-decoration:none;display:block;
      transition:transform .35s var(--ease),box-shadow .35s;
    }
    .ex-card:hover{transform:translateY(-6px);box-shadow:0 20px 56px rgba(0,0,0,.1);}
    .ex-card::before{
      content:'';position:absolute;top:0;left:0;right:0;height:3px;
      background:var(--grad);transform:scaleX(0);transform-origin:left;
      transition:transform .35s var(--ease);z-index:4;
    }
    .ex-card:hover::before{transform:scaleX(1);}
    .ex-img{height:180px;background-size:cover;background-position:center;filter:brightness(.88);transition:filter .5s,transform .7s;}
    .ex-card:hover .ex-img{filter:brightness(.72);transform:scale(1.04);}
    .ex-overlay{position:absolute;top:0;left:0;right:0;height:180px;background:linear-gradient(180deg,transparent 40%,rgba(13,13,18,.5));}
    .ex-body{padding:16px 20px 20px;background:var(--white);}
    .ex-tag{
      position:absolute;top:148px;left:16px;
      background:rgba(255,255,255,.92);backdrop-filter:blur(8px);
      border:1px solid rgba(0,0,0,.08);padding:3px 10px;border-radius:100px;
      font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);font-weight:600;
    }
    .ex-sector{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--violet);font-weight:600;margin-bottom:4px;}
    .ex-name{font-family:'Archivo Black',sans-serif;font-size:1rem;color:var(--ink);letter-spacing:-.02em;margin-bottom:3px;}
    .ex-tagline{font-size:.8rem;color:var(--ink2);font-style:italic;}
    .ex-arrow{position:absolute;bottom:18px;right:18px;font-size:.7rem;font-weight:700;color:var(--violet);opacity:0;transform:translateX(4px);transition:opacity .25s,transform .25s;}
    .ex-card:hover .ex-arrow{opacity:1;transform:translateX(0);}
    .ex-voir{
      display:inline-flex;align-items:center;gap:8px;
      background:var(--ink);color:var(--white);
      padding:.9rem 2rem;border-radius:100px;
      font-size:.85rem;font-weight:500;text-decoration:none;
      margin-top:40px;transition:background .25s,transform .25s;
    }
    .ex-voir:hover{background:var(--violet);transform:translateY(-2px);}
    .ex-voir::after{content:'→';}

    /* ── CTA FINAL ── */
    .cta-section{padding:100px 5%;text-align:center;}
    .cta-box{
      max-width:800px;margin:0 auto;
      padding:80px 60px;
      background:var(--ink);
      border-radius:24px;
      position:relative;overflow:hidden;
    }
    .cta-glow{
      position:absolute;inset:0;
      background:radial-gradient(ellipse 70% 60% at 30% 40%,rgba(99,102,241,.35) 0%,transparent 60%),
                 radial-gradient(ellipse 50% 50% at 80% 70%,rgba(236,72,153,.25) 0%,transparent 60%);
      pointer-events:none;
    }
    .cta-box h2{
      font-family:'Archivo Black',sans-serif;
      font-size:clamp(2rem,4vw,3rem);
      color:var(--white);letter-spacing:-.03em;
      margin-bottom:16px;position:relative;z-index:1;
    }
    .cta-box p{font-size:1rem;color:rgba(255,255,255,.6);margin-bottom:40px;position:relative;z-index:1;line-height:1.75;}
    .cta-btn{
      display:inline-flex;align-items:center;gap:8px;
      background:var(--white);color:var(--ink);
      padding:1.1rem 2.4rem;border-radius:100px;
      font-size:.9rem;font-weight:500;text-decoration:none;
      transition:background .25s,color .25s,transform .25s;
      position:relative;z-index:1;
    }
    .cta-btn:hover{background:var(--violet);color:var(--white);transform:translateY(-2px);}
    .cta-btn::after{content:'→';}

    /* ── FOOTER ── */
    footer{
      padding:40px 5%;border-top:1px solid rgba(0,0,0,.07);
      display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;
    }
    .footer-logo{font-family:'Archivo Black',sans-serif;font-size:1rem;color:var(--ink);text-decoration:none;}
    .footer-logo span{color:var(--violet);}
    footer p{font-size:.82rem;color:var(--ink2);}
    .footer-links{display:flex;gap:24px;}
    .footer-links a{font-size:.82rem;color:var(--ink2);text-decoration:none;transition:color .2s;}
    .footer-links a:hover{color:var(--ink);}

    /* ── ANIMATIONS ── */
    @keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
    .reveal{opacity:0;transform:translateY(32px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
    .reveal.visible{opacity:1;transform:translateY(0);}

    /* ── RESPONSIVE ── */
    @media(max-width:900px){
      .services-grid{grid-template-columns:1fr 1fr;}
      .process-grid{grid-template-columns:1fr 1fr;}
      .exemples-grid{grid-template-columns:1fr 1fr;}
      .proc-line{display:none;}
    }
    @media(max-width:768px){
      nav{padding:0 5%;height:64px;}
      .nav-links{
        position:fixed;top:0;left:-100%;width:100%;height:100vh;
        background:#ffffff;flex-direction:column;justify-content:center;align-items:center;
        gap:2.5rem;transition:left .35s var(--ease);z-index:9999;
      }
      .nav-links.active{left:0;}
      .nav-links a{font-size:1.1rem;}
      .nav-cta{display:none;}
      .menu-toggle{display:flex;z-index:10001;}
      .menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(7px,7px);}
      .menu-toggle.active span:nth-child(2){opacity:0;}
      .menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px);}
      .hero{padding:100px 5% 60px;}
      .hero-stats{gap:24px;flex-wrap:wrap;}
      .stat-sep{display:none;}
      .services-grid{grid-template-columns:1fr;}
      .process-grid{grid-template-columns:1fr;}
      .exemples-grid{grid-template-columns:1fr;}
      .cta-box{padding:52px 28px;}
      footer{flex-direction:column;text-align:center;}
      .footer-links{justify-content:center;}
    }
  

/* ── PAGE CONTACT ── */
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--violet);transition:width .25s;}
.nav-links a.active,.nav-links a:hover{color:var(--ink);}
.nav-links a.active::after,.nav-links a:hover::after{width:100%;}
.nav-cta::after{display:none!important;}
.page-hero{padding:140px 5% 80px;background:linear-gradient(180deg,rgba(99,102,241,.1) 0%,transparent 100%);position:relative;overflow:hidden;}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 90% 40%,rgba(236,72,153,.07) 0%,transparent 60%);pointer-events:none;}
.page-label{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--rose);font-weight:600;margin-bottom:14px;display:block;}
.page-hero h1{font-family:'Archivo Black',sans-serif;font-size:clamp(2.8rem,6vw,5rem);color:var(--ink);letter-spacing:-.04em;line-height:.95;margin-bottom:20px;position:relative;z-index:1;}
.page-hero h1 em{font-style:italic;font-family:Georgia,serif;font-weight:400;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.page-hero p{font-size:1.1rem;color:var(--ink2);font-weight:300;line-height:1.75;max-width:540px;position:relative;z-index:1;}
.contact-section{padding:80px 5%;}
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:60px;max-width:1100px;align-items:start;}
.contact-left h2{font-family:'Archivo Black',sans-serif;font-size:1.8rem;color:var(--ink);letter-spacing:-.03em;margin-bottom:12px;}
.contact-left>p{font-size:.95rem;color:var(--ink2);line-height:1.75;margin-bottom:40px;}
.info-cards{display:flex;flex-direction:column;gap:16px;}
.info-card{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:var(--r);padding:20px 24px;display:flex;align-items:center;gap:16px;transition:transform .25s,box-shadow .25s;}
.info-card:hover{transform:translateX(4px);box-shadow:0 8px 28px rgba(0,0,0,.07);}
.info-icon{width:48px;height:48px;background:linear-gradient(135deg,var(--violet),var(--rose));border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0;}
.info-content h3{font-family:'Archivo Black',sans-serif;font-size:.95rem;color:var(--ink);margin-bottom:4px;}
.info-content p,.info-content a{font-size:.88rem;color:var(--ink2);text-decoration:none;line-height:1.6;}
.info-content a:hover{color:var(--violet);}
.contact-form{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:20px;padding:48px 40px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-group{margin-bottom:20px;}
.form-group label{display:block;font-size:.82rem;font-weight:500;color:var(--ink);margin-bottom:6px;letter-spacing:.02em;}
.form-group input,.form-group textarea{width:100%;padding:.85rem 1rem;border:1.5px solid rgba(0,0,0,.1);border-radius:10px;font-family:'DM Sans',sans-serif;font-size:.92rem;background:var(--bg);color:var(--ink);transition:border-color .25s,background .25s;outline:none;}
.form-group input:focus,.form-group textarea:focus{border-color:var(--violet);background:var(--white);}
.form-group textarea{min-height:140px;resize:vertical;}
.btn-submit{width:100%;padding:1.1rem;background:var(--ink);color:var(--white);border:none;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:.95rem;font-weight:500;cursor:pointer;transition:background .25s,transform .25s;display:flex;align-items:center;justify-content:center;gap:8px;}
.btn-submit:hover{background:var(--violet);transform:translateY(-1px);}
.confirm-msg{display:none;text-align:center;padding:2rem;background:#f0fdf4;border:1px solid rgba(16,185,129,.2);border-radius:12px;margin-top:1rem;}
.confirm-msg h3{color:var(--accent);font-family:'Archivo Black',sans-serif;margin-bottom:6px;}
.confirm-msg p{font-size:.88rem;color:var(--ink2);}

/* ── PAGE PROCESS ── */
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:rgba(0,0,0,.07);border:1px solid rgba(0,0,0,.07);border-radius:20px;overflow:hidden;max-width:1100px;margin-bottom:80px;}
.step-card{background:var(--white);padding:44px 32px;position:relative;transition:background .25s;}
.step-card:hover{background:#fafaff;}
.step-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);}
.step-card:hover::before{transform:scaleX(1);}
.step-num{font-family:'Archivo Black',sans-serif;font-size:4rem;color:transparent;-webkit-text-stroke:1.5px rgba(99,102,241,.18);line-height:1;margin-bottom:20px;}
.step-title{font-family:'Archivo Black',sans-serif;font-size:1.1rem;color:var(--ink);margin-bottom:10px;letter-spacing:-.02em;}
.step-desc{font-size:.87rem;color:var(--ink2);line-height:1.7;}
.timeline{display:flex;flex-direction:column;gap:2px;max-width:800px;}
.tl-item{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:var(--r);padding:32px 36px;display:grid;grid-template-columns:80px 1fr;gap:24px;align-items:start;transition:transform .25s,box-shadow .25s;}
.tl-item:hover{transform:translateX(6px);box-shadow:0 8px 28px rgba(0,0,0,.07);}
.tl-step{font-family:'Archivo Black',sans-serif;font-size:2.5rem;color:transparent;-webkit-text-stroke:1.5px var(--violet);opacity:.3;line-height:1;}
.tl-content h3{font-family:'Archivo Black',sans-serif;font-size:1.1rem;color:var(--ink);margin-bottom:8px;letter-spacing:-.02em;}
.tl-content p{font-size:.88rem;color:var(--ink2);line-height:1.7;}
.tl-badge{display:inline-block;background:rgba(99,102,241,.08);color:var(--violet);border:1px solid rgba(99,102,241,.15);padding:3px 10px;border-radius:100px;font-size:.7rem;font-weight:600;letter-spacing:.08em;margin-top:10px;}

/* ── PAGE PORTFOLIO ── */
.portfolio-section{padding:80px 5%;}
.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:24px;max-width:1100px;margin-bottom:80px;}
.project-card{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:20px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s;display:flex;flex-direction:column;}
.project-card:hover{transform:translateY(-6px);box-shadow:0 20px 56px rgba(0,0,0,.1);}
.project-thumb{height:220px;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:5rem;position:relative;overflow:hidden;}
.project-thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(13,13,18,.3));}
.project-body{padding:28px 28px 32px;flex:1;display:flex;flex-direction:column;}
.proj-cat{display:inline-block;background:rgba(99,102,241,.08);color:var(--violet);border:1px solid rgba(99,102,241,.15);padding:3px 12px;border-radius:100px;font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;width:fit-content;}
.project-body h3{font-family:'Archivo Black',sans-serif;font-size:1.2rem;color:var(--ink);letter-spacing:-.02em;margin-bottom:8px;}
.project-body p{font-size:.88rem;color:var(--ink2);line-height:1.7;flex:1;margin-bottom:20px;}
.proj-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:20px;}
.proj-tag{background:var(--bg);color:var(--ink2);border:1px solid rgba(0,0,0,.08);padding:3px 10px;border-radius:100px;font-size:.72rem;}
.proj-link{display:inline-flex;align-items:center;gap:6px;background:var(--ink);color:var(--white);padding:.75rem 1.4rem;border-radius:100px;font-size:.82rem;font-weight:500;text-decoration:none;transition:background .25s,transform .25s;width:fit-content;}
.proj-link:hover{background:var(--violet);transform:translateY(-1px);}
.ex-voir-btn{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:var(--white);padding:.85rem 1.8rem;border-radius:100px;font-size:.85rem;font-weight:500;text-decoration:none;margin-top:36px;transition:background .25s,transform .25s;}
.ex-voir-btn:hover{background:var(--violet);transform:translateY(-2px);}

/* ── PAGE ADMIN ── */
.login-overlay{position:fixed;inset:0;background:rgba(13,13,18,.92);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:9999;}
.login-box{background:var(--white);border-radius:20px;padding:48px 40px;max-width:400px;width:90%;box-shadow:0 32px 80px rgba(0,0,0,.2);}
.login-box h2{font-family:'Archivo Black',sans-serif;font-size:1.6rem;color:var(--ink);letter-spacing:-.03em;margin-bottom:8px;}
.login-box>p{font-size:.88rem;color:var(--ink2);margin-bottom:32px;}
.field-label{display:block;font-size:.8rem;font-weight:500;color:var(--ink);margin-bottom:6px;}
.field-input{width:100%;padding:.85rem 1rem;border:1.5px solid rgba(0,0,0,.1);border-radius:10px;font-family:'DM Sans',sans-serif;font-size:.92rem;background:var(--bg);color:var(--ink);transition:border-color .25s;outline:none;margin-bottom:20px;}
.field-input:focus{border-color:var(--violet);background:var(--white);}
.btn-login{width:100%;padding:1rem;background:var(--ink);color:var(--white);border:none;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:.95rem;font-weight:500;cursor:pointer;transition:background .25s;}
.btn-login:hover{background:var(--violet);}
.error-msg{color:var(--danger);font-size:.85rem;margin-top:12px;display:none;}
.nav-actions{display:flex;gap:10px;align-items:center;}
.btn{display:inline-flex;align-items:center;gap:6px;padding:.6rem 1.1rem;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:.82rem;font-weight:500;cursor:pointer;border:none;transition:all .2s;text-decoration:none;white-space:nowrap;}
.btn-primary{background:var(--violet);color:var(--white);}
.btn-primary:hover{background:#4f46e5;transform:translateY(-1px);}
.btn-success{background:var(--accent);color:var(--white);}
.btn-success:hover{background:#059669;}
.btn-outline{background:transparent;color:var(--ink);border:1.5px solid rgba(0,0,0,.12);}
.btn-outline:hover{border-color:var(--ink);background:rgba(0,0,0,.04);}
.btn-danger{background:var(--danger);color:var(--white);}
.btn-danger:hover{background:#dc2626;}
.btn-sm{padding:.45rem .9rem;font-size:.78rem;}
.admin-wrap{max-width:1100px;margin:0 auto;padding:40px 5%;}
.admin-banner{background:linear-gradient(135deg,var(--violet),var(--rose));border-radius:16px;padding:32px 36px;color:var(--white);margin-bottom:28px;position:relative;overflow:hidden;}
.admin-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 80% 50%,rgba(255,255,255,.12) 0%,transparent 60%);pointer-events:none;}
.admin-banner h1{font-family:'Archivo Black',sans-serif;font-size:1.6rem;letter-spacing:-.03em;margin-bottom:4px;position:relative;z-index:1;}
.admin-banner p{font-size:.9rem;opacity:.8;position:relative;z-index:1;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px;}
.stat-card{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:var(--r);padding:20px 24px;}
.stat-card .val{font-family:'Archivo Black',sans-serif;font-size:2rem;color:var(--ink);letter-spacing:-.03em;line-height:1;}
.stat-card .lbl{font-size:.78rem;color:var(--ink2);margin-top:4px;text-transform:uppercase;letter-spacing:.08em;}
.stat-card.s-revenue .val{color:var(--accent);}
.stat-card.s-pending .val{color:var(--warn);}
.stat-card.s-paid .val{color:var(--violet);}
.section-card{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:28px 32px;margin-bottom:20px;}
.section-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px;}
.section-card-header h2{font-family:'Archivo Black',sans-serif;font-size:1.2rem;color:var(--ink);letter-spacing:-.02em;}
.section-card-actions{display:flex;gap:8px;flex-wrap:wrap;}
.invoice-card{border:1px solid rgba(0,0,0,.08);border-radius:var(--r);padding:18px 20px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:border-color .25s,box-shadow .25s;background:var(--bg);}
.invoice-card:hover{border-color:rgba(99,102,241,.3);box-shadow:0 4px 16px rgba(0,0,0,.06);}
.inv-info h4{font-family:'Archivo Black',sans-serif;font-size:.95rem;color:var(--ink);margin-bottom:4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.inv-info p{font-size:.8rem;color:var(--ink2);line-height:1.5;}
.inv-amount{font-family:'Archivo Black',sans-serif;font-size:1.1rem;color:var(--violet);margin-top:6px;}
.invoice-actions{display:flex;gap:6px;flex-wrap:wrap;flex-shrink:0;}
.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:100px;font-size:.68rem;font-weight:600;letter-spacing:.06em;}
.badge-auto{background:#dbeafe;color:#1e40af;}
.badge-manual{background:#fef3c7;color:#92400e;}
.badge-paid{background:#d1fae5;color:#065f46;}
.badge-pending{background:#fef3c7;color:#92400e;}
.empty-state{text-align:center;padding:48px 20px;color:var(--ink2);font-size:.9rem;}
.modal{display:none;position:fixed;inset:0;background:rgba(13,13,18,.6);backdrop-filter:blur(6px);z-index:1000;align-items:center;justify-content:center;}
.modal.active{display:flex;}
.modal-box{background:var(--white);border-radius:20px;padding:36px 40px;max-width:580px;width:90%;max-height:88vh;overflow-y:auto;position:relative;}
.modal-box h2{font-family:'Archivo Black',sans-serif;font-size:1.4rem;color:var(--ink);letter-spacing:-.03em;margin-bottom:24px;}
.close-modal{position:absolute;top:20px;right:24px;background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--ink2);}
.close-modal:hover{color:var(--ink);}
.form-group input,.form-group select{width:100%;padding:.75rem .9rem;border:1.5px solid rgba(0,0,0,.1);border-radius:8px;font-family:'DM Sans',sans-serif;font-size:.9rem;background:var(--bg);color:var(--ink);outline:none;transition:border-color .2s;}
.form-group input:focus{border-color:var(--violet);background:var(--white);}
.option-row{display:grid;grid-template-columns:2fr 80px 100px 40px;gap:8px;margin-bottom:8px;align-items:end;}
.modal-footer{display:flex;gap:10px;margin-top:24px;}

/* ── PAGE COMMANDE ── */
.logo{font-family:'Archivo Black',sans-serif;font-size:1.4rem;color:var(--dark);text-decoration:none;letter-spacing:-1px;}
.logo span{color:var(--primary);}
.back-link{font-size:.85rem;color:var(--gray);text-decoration:none;font-weight:500;padding:.5rem 1rem;border:1px solid #E5E7EB;border-radius:20px;transition:all .25s;}
.back-link:hover{color:var(--primary);border-color:var(--primary);}
.hero h1{font-family:'Archivo Black',sans-serif;font-size:clamp(2rem,5vw,3.5rem);margin-bottom:.5rem;letter-spacing:-2px;color:var(--dark);}
.hero p{color:var(--gray);font-size:1.1rem;}
.price{font-family:'Archivo Black',sans-serif;font-size:clamp(2.5rem,6vw,4rem);color:var(--primary);margin:1rem 0;letter-spacing:-2px;}
.commande-grid{max-width:1200px;margin:0 auto;padding:2rem 5% 4rem;display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;}
.pack-info{background:var(--card-bg);padding:2.5rem;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1.5rem;}
.pack-info h2{font-family:'Archivo Black',sans-serif;font-size:1.4rem;margin-bottom:1.5rem;color:var(--primary);}
.features-list{list-style:none;}
.features-list li{padding:.75rem 0 .75rem 2rem;position:relative;font-size:.95rem;border-bottom:1px solid #F3F4F6;color:var(--dark);}
.features-list li::before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:700;font-size:1.1rem;}
.features-list li:last-child{border-bottom:none;}
.client-info{background:var(--card-bg);padding:2rem;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1.5rem;}
.client-info h3{font-family:'Archivo Black',sans-serif;font-size:1.2rem;margin-bottom:1.5rem;color:var(--primary);}
.options-section{background:var(--card-bg);padding:2rem;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1.5rem;}
.options-section h2{font-family:'Archivo Black',sans-serif;font-size:1.4rem;margin-bottom:.5rem;color:var(--primary);}
.options-section>p{color:var(--gray);font-size:.9rem;margin-bottom:1.5rem;}
.option-card{border:2px solid #E5E7EB;border-radius:12px;padding:1.25rem;margin-bottom:1rem;cursor:pointer;transition:all .25s;}
.option-card:hover{border-color:var(--primary);box-shadow:0 4px 16px rgba(99,102,241,.1);}
.option-card.selected{border-color:var(--primary);background:rgba(99,102,241,.04);}
.option-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem;}
.option-title{font-weight:600;font-size:.95rem;display:flex;align-items:center;gap:.5rem;}
.option-title input[type="checkbox"]{width:18px;height:18px;cursor:pointer;accent-color:var(--primary);}
.option-price{font-family:'Archivo Black',sans-serif;font-size:1rem;color:var(--primary);}
.option-description{color:var(--gray);font-size:.85rem;line-height:1.5;}
.option-quantity{margin-top:.75rem;display:flex;align-items:center;gap:.75rem;font-size:.88rem;}
.quantity-input{width:70px;padding:.45rem;border:2px solid #000000;border-radius:8px;font-size:.95rem;text-align:center;font-family:'Work Sans',sans-serif;}
.summary{background:var(--gradient);padding:2rem;border-radius:var(--radius);color:rgb(0, 0, 0);position:sticky;top:90px;}
.summary h3{font-family:'Archivo Black',sans-serif;font-size:1.3rem;margin-bottom:1.5rem;}
.summary-item{display:flex;justify-content:space-between;padding:.7rem 0;border-bottom:1px solid rgba(255,255,255,.2);font-size:.92rem;}
.summary-total{display:flex;justify-content:space-between;padding:1.2rem 0 .8rem;font-size:1.4rem;font-weight:700;border-top:2px solid white;margin-top:.5rem;}
.btn-order{display:block;width:100%;padding:1.2rem;background:white;color:var(--primary);border:none;border-radius:12px;font-family:'Work Sans',sans-serif;font-size:1rem;font-weight:700;cursor:pointer;text-decoration:none;text-align:center;margin-top:1.2rem;transition:all .25s;}
.btn-order:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.18);}
.secure-note{text-align:center;font-size:.8rem;margin-top:.8rem;opacity:.85;}
@media(max-width:400px){.price{font-size:2.4rem;}.back-link{display:none;}}

/* ── PRICING SLIDER — SERVICES ── */
:root {
  --sl-white: #ffffff;
  --sl-w70:   rgba(255,255,255,.70);
  --sl-w45:   rgb(0, 0, 0);
  --sl-w20:   rgba(255,255,255,.20);
  --sl-w12:   rgba(255,255,255,.12);
  --sl-radius: 20px;
  --sl-ease:   cubic-bezier(.22,.68,0,1.2) .5s;
}

.pricing-page{font-family:'Work Sans',sans-serif;min-height:100svh;overflow-x:hidden;-webkit-font-smoothing:antialiased;background:#1a1230 !important;}
.pricing-page .sl-bg-wrap{position:fixed;inset:0;z-index:0;}
.sl-bg-wrap{position:fixed;inset:0;z-index:0;}
.sl-bg{position:absolute;inset:0;opacity:0;transition:opacity 1.4s ease-in-out;}
.sl-bg.visible{opacity:1;}
.sl-bg-0{background:radial-gradient(ellipse 90% 80% at 70% 50%, #c4b8f8 0%, #9b8ef0 40%, #7c6fe8 100%);}
.sl-bg-1{background:radial-gradient(ellipse 90% 80% at 70% 50%, #f9c5e0 0%, #f0a0cb 40%, #e07aaf 100%);}
.sl-bg-2{background:radial-gradient(ellipse 90% 80% at 70% 50%, #b8c8f8 0%, #8aaaf0 40%, #6088e0 100%);}
.sl-bg-3{background:radial-gradient(ellipse 90% 80% at 70% 50%, #616161 0%, #494949 40%, #2b2b2bcc 100%);}
.sl-page{position:relative;z-index:1;min-height:100svh;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;}
.sl-header{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:28px 52px;}
.sl-logo{font-family:'Archivo Black',sans-serif;font-size:1.15rem;color:var(--sl-white);letter-spacing:.02em;text-decoration:none;}
.sl-logo span{opacity:.5;}
.sl-nav{display:flex;align-items:center;gap:2rem;}
.sl-nav-link{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sl-w45);text-decoration:none;font-weight:500;transition:color .25s;min-height:44px;display:inline-flex;align-items:center;}
.sl-nav-link:hover{color:var(--sl-white);}
.sl-header-cta{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sl-w70);text-decoration:none;font-weight:600;border-bottom:1px solid var(--sl-w45);padding-bottom:2px;min-height:44px;display:inline-flex;align-items:flex-end;transition:color .25s,border-color .25s;}
.sl-header-cta:hover{color:var(--sl-white);border-color:var(--sl-white);}
.sl-content{padding:20px 52px 40px;display:flex;flex-direction:column;justify-content:center;}
.sl-tag{display:inline-flex;align-items:center;gap:8px;background:var(--sl-w12);border:1px solid var(--sl-w20);backdrop-filter:blur(6px);padding:6px 16px;border-radius:100px;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--sl-white);font-weight:600;width:fit-content;margin-bottom:22px;}
.sl-name{font-family:'Archivo Black',sans-serif;font-size:clamp(2.8rem,4.5vw,5rem);color:var(--sl-white);line-height:.92;letter-spacing:-.03em;margin-bottom:14px;}
.sl-price{display:flex;align-items:baseline;gap:10px;margin-bottom:22px;}
.sl-price-val{font-family:'Archivo Black',sans-serif;font-size:clamp(2rem,3.5vw,3.2rem);color:var(--sl-white);letter-spacing:-.04em;}
.sl-price-note{font-size:.88rem;color:var(--sl-w70);font-weight:300;}
.sl-desc{font-size:clamp(.88rem,1.1vw,1rem);color:var(--sl-w70);line-height:1.75;font-weight:300;margin-bottom:26px;max-width:420px;}
.sl-features{display:flex;flex-direction:column;gap:10px;margin-bottom:36px;}
.sl-feat{display:flex;align-items:center;gap:10px;font-size:clamp(.82rem,1vw,.92rem);color:rgba(255,255,255,.88);font-weight:400;line-height:1.4;}
.sl-feat-check{width:22px;height:22px;border-radius:50%;background:var(--sl-w20);display:flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:700;color:var(--sl-white);flex-shrink:0;}
.sl-cta-row{display:flex;align-items:center;flex-wrap:wrap;gap:14px;}
.sl-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--sl-white);color:#1a1230;padding:16px 32px;font-family:'Archivo Black',sans-serif;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-radius:8px;width:fit-content;min-height:52px;transition:transform .25s,box-shadow .25s;-webkit-tap-highlight-color:transparent;border:none;cursor:pointer;}
.sl-btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(0,0,0,.22);}
.sl-btn-primary:active{transform:scale(.97);}
.sl-btn-primary::after{content:' →';}
.sl-btn-secondary{display:inline-flex;align-items:center;gap:8px;color:var(--sl-w70);font-size:.82rem;text-decoration:none;font-weight:600;border-bottom:1px solid var(--sl-w45);padding-bottom:2px;min-height:44px;transition:color .25s,border-color .25s;-webkit-tap-highlight-color:transparent;}
.sl-btn-secondary:hover{color:var(--sl-white);border-color:var(--sl-white);}
.sl-anim{transition:opacity .3s ease,transform .3s ease;}
.sl-anim.sl-out{opacity:0;transform:translateY(10px);}
.sl-card-col{display:flex;align-items:center;justify-content:center;padding:40px 52px 40px 20px;}
.sl-scene{position:relative;width:320px;height:440px;}
.sl-card{position:absolute;inset:0;background:var(--sl-w12);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);border:1px solid rgba(255,255,255,.25);border-radius:var(--sl-radius);padding:36px 32px;transition:all var(--sl-ease);box-shadow:0 24px 64px rgba(0,0,0,.18);will-change:transform,opacity,filter;}
.sl-card.active{opacity:1;transform:translateX(0) translateY(0) scale(1) rotate(0deg);z-index:3;filter:blur(0);}
.sl-card.next{opacity:.5;transform:translateX(52px) translateY(36px) scale(.78) rotate(5deg);z-index:2;filter:blur(2px);}
.sl-card.previous{opacity:.5;transform:translateX(52px) translateY(-36px) scale(.78) rotate(-5deg);z-index:2;filter:blur(2px);}
.sl-card.inactive{opacity:0;transform:translateX(100px) scale(.55);z-index:1;pointer-events:none;}
.sl-card-emoji{font-size:2.6rem;margin-bottom:18px;}
.sl-card-name{font-family:'Archivo Black',sans-serif;font-size:1.5rem;color:var(--sl-white);letter-spacing:-.02em;margin-bottom:4px;}
.sl-card-sub{font-size:.72rem;color:var(--sl-w45);text-transform:uppercase;letter-spacing:.13em;margin-bottom:24px;}
.sl-card-line{width:100%;height:1px;background:var(--sl-w20);margin-bottom:22px;}
.sl-card-price{font-family:'Archivo Black',sans-serif;font-size:2.6rem;color:var(--sl-white);letter-spacing:-.04em;line-height:1;margin-bottom:4px;}
.sl-card-note{font-size:.72rem;color:var(--sl-w45);margin-bottom:24px;}
.sl-card-feats{display:flex;flex-direction:column;gap:9px;}
.sl-card-feat{font-size:.78rem;color:rgba(255,255,255,.75);display:flex;gap:8px;align-items:flex-start;line-height:1.4;}
.sl-card-feat::before{content:'✦';color:var(--sl-w45);font-size:.6rem;margin-top:3px;flex-shrink:0;}
.sl-footer{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:24px 52px 36px;}
.sl-dots{display:flex;align-items:center;gap:4px;}
.sl-dot{background:none;border:none;cursor:pointer;padding:12px 8px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;}
.sl-dot::after{content:'';width:8px;height:8px;border-radius:100px;background:var(--sl-w45);transition:all .4s;display:block;}
.sl-dot.active::after{width:28px;background:var(--sl-white);}
.sl-arrows{display:flex;gap:10px;}
.sl-arrow{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--sl-w45);background:var(--sl-w12);backdrop-filter:blur(8px);color:var(--sl-white);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .25s;-webkit-tap-highlight-color:transparent;}
.sl-arrow:hover{background:var(--sl-w20);border-color:var(--sl-white);}
.sl-arrow:active{transform:scale(.92);}

/* ── MENU BURGER — PAGE SERVICES ── */
.sl-menu-toggle{
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  padding:8px;
  background:none;
  border:none;
  z-index:10002;
}
.sl-menu-toggle span{
  width:22px;
  height:2px;
  background:var(--sl-white);
  border-radius:2px;
  transition:all .3s;
  display:block;
}
.sl-menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(7px,7px);}
.sl-menu-toggle.active span:nth-child(2){opacity:0;}
.sl-menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px);}

.sl-mobile-nav{
  display:none;
  position:fixed;
  inset:0;
  background:#ffffff;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:2.5rem;
  z-index:10001;
  animation:fadeIn .25s ease;
}
.sl-mobile-nav.active{display:flex;}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.sl-mobile-nav-close{
  position:absolute;
  top:24px;
  right:24px;
  background:none;
  border:none;
  font-size:1.8rem;
  cursor:pointer;
  color:#0d0d12;
  line-height:1;
  padding:8px;
}
.sl-mobile-nav a{
  font-family:'Archivo Black',sans-serif;
  font-size:1.4rem;
  color:#0d0d12;
  text-decoration:none;
  transition:color .2s;
}
.sl-mobile-nav a:hover{color:#6366f1;}
.sl-mobile-nav-cta{
  background:#6366f1 !important;
  color:#ffffff !important;
  padding:.9rem 2.2rem;
  border-radius:100px;
  font-size:1rem !important;
}
.sl-mobile-nav-cta:hover{background:#4f46e5 !important;}

/* ── RESPONSIVE GLOBAL ── */
@media (max-width:968px) {
  .contact-container{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
}

@media (max-width:768px) {
  nav{padding:1.5rem 5%;}
  .nav-links{position:fixed;top:0;left:-100%;width:100%;height:100vh;background:#ffffff;flex-direction:column;justify-content:center;align-items:center;gap:3rem;transition:left .3s;z-index:9999;}
  .nav-links.active{left:0;}
  .menu-toggle{display:flex;z-index:10001;}
  .menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(8px,8px);}
  .menu-toggle.active span:nth-child(2){opacity:0;}
  .menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px);}
  .hero{padding-top:6rem;}
  .cta-buttons{flex-direction:column;}
  .btn{text-align:center;}
  .services-grid,.process-steps,.grid-2,.grid-3{grid-template-columns:1fr;}
  .portfolio-grid{grid-template-columns:1fr;}
  .stats-grid{gap:2rem;grid-template-columns:repeat(2,1fr);}
  .cta-box{padding:3rem 2rem;}
  .back-link{font-size:.75rem;padding:.4rem .8rem;}
  .hero.commande-hero{padding:5rem 1.2rem 2rem;}
  .price{font-size:2.8rem;}
  .commande-grid{grid-template-columns:1fr;gap:1.2rem;padding:1.2rem 1rem 3rem;}
  .pack-info{padding:1.5rem;}
  .pack-info h2{font-size:1.2rem;}
  .client-info{padding:1.5rem;}
  .options-section{padding:1.5rem;}
  .summary{position:static;padding:1.5rem;}
  .summary-total{font-size:1.2rem;}
  .exemples-grid{grid-template-columns:repeat(2,1fr);gap:1rem;}
  .exemples-hd{flex-direction:column;align-items:flex-start;gap:12px;}
  .exemples-cta-wrap{flex-direction:column;gap:1.5rem;align-items:flex-start;}
  .exemples-title{font-size:1.7rem;}
  .sl-page{display:flex;flex-direction:column;min-height:100svh;}
  .sl-header{padding:18px 20px;position:sticky;top:0;z-index:100;background:rgba(0,0,0,.15);backdrop-filter:blur(18px);border-bottom:1px solid var(--sl-w12);}
  .sl-logo{font-size:1rem;}
  .sl-nav{display:none;}
  .sl-header-cta{display:none;}
  .sl-menu-toggle{display:flex;}
  .sl-content{padding:28px 22px 16px;flex:1;justify-content:center;}
  .sl-name{font-size:clamp(2.6rem,9vw,3.8rem);}
  .sl-desc{max-width:100%;font-size:.95rem;}
  .sl-features{gap:8px;margin-bottom:28px;}
  .sl-feat{font-size:.88rem;}
  .sl-card-col{display:none;}
  .sl-cta-row{flex-direction:column;width:100%;gap:10px;}
  .sl-btn-primary{width:100%;justify-content:center;padding:18px 24px;font-size:.88rem;}
  .sl-btn-secondary{justify-content:center;width:100%;padding:14px 0;}
  .sl-footer{padding:16px 22px 28px;}
}

@media (max-width:560px) {
  .exemples-grid{grid-template-columns:1fr;}
}

@media (max-width:1024px) and (min-width:769px) {
  .sl-header,.sl-footer{padding-left:32px;padding-right:32px;}
  .sl-content{padding:20px 32px 30px;}
  .sl-card-col{padding:30px 32px 30px 16px;}
  .sl-scene{width:280px;height:400px;}
  .sl-card{padding:28px 26px;}
  .sl-card-price{font-size:2.2rem;}
  .sl-name{font-size:3rem;}
}

@media (max-width:400px) {
  .price{font-size:2.4rem;}
  .back-link{display:none;}
}