/* ── VARIABLES ── */
:root{
  --red:#E63027;
  --red2:#c4241b;
  --blue:#0D1B2A;
  --blue2:#162436;
  --white:#FFFFFF;
  --off:#F4F4F2;
  --black:#0A0A0A;
  --gray:#6B7280;
  --border:rgba(230,48,39,0.15);
  --t:.3s cubic-bezier(.4,0,.2,1);
  --r:8px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:'Outfit',sans-serif;background:var(--white);color:var(--black);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}

/* ── CURSOR GLOW ── */
.cursor-glow{position:fixed;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(230,48,39,.06) 0%,transparent 70%);pointer-events:none;transform:translate(-50%,-50%);transition:opacity .3s;z-index:0}

/* ── SCROLL PROGRESS BAR ── */
#progress-bar{position:fixed;top:0;left:0;height:3px;background:var(--red);z-index:999;width:0%;transition:width .1s linear}

/* ── NAVBAR ── */
#navbar{position:fixed;top:0;left:0;right:0;z-index:50;border-bottom:1px solid transparent;transition:background .4s,border-color .4s,box-shadow .4s}
#navbar.scrolled{background:rgba(13,27,42,.97);backdrop-filter:blur(20px);border-color:rgba(255,255,255,.06);box-shadow:0 4px 30px rgba(0,0,0,.3)}
.nav-link{font-size:.83rem;font-weight:500;color:rgba(255,255,255,.75);letter-spacing:.04em;position:relative;transition:color var(--t)}
.nav-link::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--red);border-radius:2px;transition:width var(--t)}
.nav-link:hover{color:#fff}
.nav-link:hover::after,.nav-link.active::after{width:100%}
.nav-link.active{color:#fff}
.btn-red{padding:.55rem 1.4rem;background:var(--red);color:#fff;font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:var(--r);border:2px solid var(--red);cursor:pointer;transition:background var(--t),transform var(--t),box-shadow var(--t)}
.btn-red:hover{background:var(--red2);transform:translateY(-2px);box-shadow:0 8px 24px rgba(230,48,39,.35)}
.btn-outline{padding:.55rem 1.4rem;background:transparent;color:#fff;font-size:.8rem;font-weight:600;letter-spacing:.04em;border:1.5px solid rgba(255,255,255,.3);border-radius:var(--r);cursor:pointer;transition:border-color var(--t),color var(--t),transform var(--t)}
.btn-outline:hover{border-color:#fff;transform:translateY(-2px)}

/* Logo */
.logo-mark{display:flex;gap:2px}
.logo-mark span{width:17px;height:21px;background:var(--red);color:#fff;font-family:'Bebas Neue',sans-serif;font-size:12px;display:flex;align-items:center;justify-content:center}
.logo-mark span:first-child{border-radius:4px 0 0 4px}
.logo-mark span:last-child{border-radius:0 4px 4px 0}

/* Hamburger */
.ham-line{display:block;height:2px;background:#fff;transition:var(--t);border-radius:2px}
.ham-line:nth-child(1){width:24px}
.ham-line:nth-child(2){width:24px}
.ham-line:nth-child(3){width:16px}
#hamburger.open .ham-line:nth-child(1){transform:translateY(7px) rotate(45deg)}
#hamburger.open .ham-line:nth-child(2){opacity:0;transform:scaleX(0)}
#hamburger.open .ham-line:nth-child(3){width:24px;transform:translateY(-7px) rotate(-45deg)}

/* Mobile menu */
#mobile-menu{position:fixed;inset:0;z-index:40;background:var(--blue);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;transform:translateX(100%);transition:transform .45s cubic-bezier(.77,0,.175,1)}
#mobile-menu.open{transform:translateX(0)}
.mobile-link{font-family:'Bebas Neue',sans-serif;font-size:3rem;letter-spacing:.1em;color:#fff;position:relative;transition:color var(--t)}
.mobile-link::after{content:'';position:absolute;bottom:0;left:0;width:0;height:3px;background:var(--red);transition:width .4s}
.mobile-link:hover{color:var(--red)}
.mobile-link:hover::after{width:100%}

/* ── HERO ── */
#hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--blue)}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(13,27,42,.92) 0%,rgba(13,27,42,.75) 50%,rgba(230,48,39,.15) 100%)}
/* animated grid */
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:50px 50px;animation:gridMove 20s linear infinite;z-index:1}
@keyframes gridMove{0%{background-position:0 0}100%{background-position:50px 50px}}
/* floating shapes */
.hero-shape{position:absolute;border-radius:50%;filter:blur(60px);animation:pulse-shape 6s ease-in-out infinite;z-index:1}
.hero-shape-1{width:400px;height:400px;background:rgba(230,48,39,.12);top:-10%;right:-5%;animation-delay:0s}
.hero-shape-2{width:300px;height:300px;background:rgba(13,27,42,.8);bottom:10%;left:-5%;animation-delay:2s}
@keyframes pulse-shape{0%,100%{transform:scale(1) translate(0,0)}50%{transform:scale(1.1) translate(10px,-10px)}}

.hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem 1rem;background:rgba(230,48,39,.15);border:1px solid rgba(230,48,39,.4);border-radius:99px;font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.8);margin-bottom:1.5rem}
.badge-dot{width:6px;height:6px;border-radius:50%;background:var(--red);animation:blink 1.5s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}

.hero-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(3.5rem,9vw,7rem);letter-spacing:.06em;line-height:1;color:#fff}
.hero-title .outline{-webkit-text-stroke:2px rgba(255,255,255,.4);color:transparent}
.hero-sub{font-size:clamp(.9rem,2vw,1.05rem);color:rgba(255,255,255,.65);font-weight:300;line-height:1.8;max-width:520px}

/* Stats */
.stats-row{display:flex;gap:0;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--r);overflow:hidden;margin-top:2.5rem}
.stat-b{flex:1;padding:1.2rem 1rem;text-align:center;border-right:1px solid rgba(255,255,255,.06);transition:background var(--t)}
.stat-b:last-child{border-right:none}
.stat-b:hover{background:rgba(230,48,39,.08)}
.stat-b strong{display:block;font-family:'Bebas Neue',sans-serif;font-size:2rem;color:var(--red);line-height:1}
.stat-b span{font-family:'DM Mono',monospace;font-size:.6rem;color:rgba(255,255,255,.4);letter-spacing:.12em;text-transform:uppercase}

/* Scroll arrow */
.scroll-arrow{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.3rem;cursor:pointer}
.arrow-line{width:1px;height:40px;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.4));animation:arrowPulse 2s ease-in-out infinite}
.arrow-v{width:8px;height:8px;border-right:1.5px solid rgba(255,255,255,.5);border-bottom:1.5px solid rgba(255,255,255,.5);transform:rotate(45deg);animation:arrowPulse 2s ease-in-out infinite .3s}
@keyframes arrowPulse{0%,100%{opacity:.3}50%{opacity:1}}

/* ── SECTION COMMONS ── */
.section-label{display:inline-flex;align-items:center;gap:.6rem;font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:1rem}
.section-label::before{content:'';width:24px;height:2px;background:var(--red);border-radius:2px}
.section-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.2rem,4.5vw,3.5rem);letter-spacing:.04em;line-height:1.05;color:var(--black)}
.section-title.light{color:#fff}
.body-text{font-size:.93rem;color:var(--gray);font-weight:300;line-height:1.85}

/* ── À PROPOS ── */
#apropos{background:var(--white);padding:7rem 1.5rem}
.about-img-wrap{position:relative}
.about-img-placeholder{width:100%;aspect-ratio:4/3;background:linear-gradient(135deg,var(--blue) 0%,var(--blue2) 100%);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative}
.about-img-placeholder::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0,rgba(255,255,255,.02) 1px,transparent 1px,transparent 12px)}
.about-badge{position:absolute;bottom:-1.2rem;right:-1.2rem;background:var(--red);color:#fff;padding:1rem 1.4rem;border-radius:var(--r);text-align:center;box-shadow:0 8px 24px rgba(230,48,39,.3)}
.about-badge strong{display:block;font-family:'Bebas Neue',sans-serif;font-size:2rem;line-height:1}
.about-badge small{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.1em;opacity:.85}
.values-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.7rem;margin-top:1.8rem}
.val-chip{display:flex;align-items:center;gap:.5rem;padding:.65rem .9rem;background:var(--off);border:1px solid #e5e7eb;border-radius:var(--r);font-size:.8rem;font-weight:500;color:#374151;transition:all var(--t);cursor:default}
.val-chip:hover{background:var(--blue);color:#fff;border-color:var(--blue);transform:translateY(-2px)}
.val-chip:hover .val-icon{filter:none}

/* ── SERVICES ── */
#services{background:var(--blue);padding:7rem 1.5rem}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:3.5rem}
.s-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:12px;overflow:hidden;position:relative;transition:transform var(--t),border-color var(--t),box-shadow var(--t)}
.s-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .4s}
.s-card:hover{transform:translateY(-6px);border-color:rgba(230,48,39,.4);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.s-card:hover::before{transform:scaleX(1)}
.s-img{height:150px;background:linear-gradient(135deg,rgba(255,255,255,.05),rgba(255,255,255,.02));display:flex;flex-direction:column;align-items:center;justify-content:center;border-bottom:1px solid rgba(255,255,255,.06);transition:background var(--t);position:relative;overflow:hidden}
.s-img::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.015) 0,rgba(255,255,255,.015) 1px,transparent 1px,transparent 10px)}
.s-card:hover .s-img{background:linear-gradient(135deg,rgba(230,48,39,.12),rgba(230,48,39,.05))}
.s-icon{font-size:2.8rem;transition:transform .4s}
.s-card:hover .s-icon{transform:scale(1.15) rotate(-5deg)}
.s-body{padding:1.4rem}
.s-num{font-family:'DM Mono',monospace;font-size:.65rem;color:var(--red);letter-spacing:.2em;margin-bottom:.4rem}
.s-title{font-family:'Bebas Neue',sans-serif;font-size:1.2rem;letter-spacing:.04em;color:#fff;margin-bottom:.6rem}
.s-desc{font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.75;margin-bottom:1rem}
.s-link{font-size:.75rem;font-weight:600;color:var(--red);letter-spacing:.04em;display:inline-flex;align-items:center;gap:.3rem;transition:gap var(--t)}
.s-link:hover{gap:.6rem}

/* ── PROJETS ── */
#projets{background:var(--off);padding:7rem 1.5rem}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:auto auto;gap:.9rem;margin-top:3rem}
.g-item{border-radius:10px;overflow:hidden;position:relative;cursor:pointer}
.g-item--big{grid-column:span 2;grid-row:span 2}
.g-placeholder{width:100%;aspect-ratio:4/3;background:linear-gradient(135deg,var(--blue),var(--blue2));display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .5s;position:relative;overflow:hidden}
.g-item--big .g-placeholder{aspect-ratio:1/1.05}
.g-placeholder::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0,rgba(255,255,255,.02) 1px,transparent 1px,transparent 12px)}
.g-item:hover .g-placeholder{transform:scale(1.04)}
.g-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,27,42,.9) 0%,transparent 60%);opacity:0;transition:opacity var(--t);display:flex;align-items:flex-end;padding:1.2rem}
.g-item:hover .g-overlay{opacity:1}
.g-caption{font-family:'DM Mono',monospace;font-size:.65rem;color:#fff;letter-spacing:.1em;text-transform:uppercase}

/* ── ÉQUIPE ── */
#equipe{background:var(--white);padding:7rem 1.5rem}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;margin-top:3rem}
.t-card{background:var(--off);border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;transition:transform var(--t),box-shadow var(--t),border-color var(--t)}
.t-card:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(0,0,0,.1);border-color:rgba(230,48,39,.3)}
.t-photo{width:100%;aspect-ratio:1/1;background:linear-gradient(135deg,var(--blue),var(--blue2));display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}
.t-photo::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0,rgba(255,255,255,.02) 1px,transparent 1px,transparent 12px)}
.t-bar{height:3px;background:linear-gradient(90deg,var(--red),transparent)}
.t-info{padding:1.2rem}
.t-name{font-family:'Bebas Neue',sans-serif;font-size:1.15rem;letter-spacing:.04em;color:var(--black);margin-bottom:.25rem}
.t-role{font-family:'DM Mono',monospace;font-size:.6rem;color:var(--red);letter-spacing:.15em;text-transform:uppercase;display:block;margin-bottom:.7rem}
.t-bio{font-size:.78rem;color:var(--gray);line-height:1.7}

/* ── CTA BAND ── */
.cta-band{background:var(--red);padding:5rem 1.5rem;position:relative;overflow:hidden}
.cta-band::before{content:'FSP';position:absolute;right:-1rem;top:50%;transform:translateY(-50%);font-family:'Bebas Neue',sans-serif;font-size:16rem;color:rgba(0,0,0,.12);pointer-events:none;letter-spacing:.05em}
.cta-band h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.5rem,5vw,4rem);letter-spacing:.04em;color:#fff;line-height:1.1}
.btn-white{padding:.75rem 2rem;background:#fff;color:var(--red);font-size:.85rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:var(--r);border:2px solid #fff;cursor:pointer;transition:all var(--t);display:inline-flex;align-items:center;gap:.5rem}
.btn-white:hover{background:transparent;color:#fff;transform:translateY(-2px)}

/* ── CONTACT ── */
#contact{background:var(--blue);padding:7rem 1.5rem}
.c-item{display:flex;align-items:center;gap:1rem;padding:.9rem 1.1rem;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);transition:border-color var(--t),transform var(--t)}
.c-item:hover{border-color:rgba(230,48,39,.4);transform:translateX(4px)}
.c-icon{width:38px;height:38px;background:rgba(230,48,39,.15);border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}
.c-label{font-family:'DM Mono',monospace;font-size:.6rem;color:rgba(255,255,255,.35);letter-spacing:.15em;text-transform:uppercase;display:block;margin-bottom:.2rem}
.c-val{font-size:.88rem;color:#fff}
.c-form{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:2rem}
.f-group{margin-bottom:1.1rem}
.f-group label{display:block;font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:.45rem}
.f-group input,.f-group select,.f-group textarea{width:100%;padding:.75rem 1rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);color:#fff;font-family:'Outfit',sans-serif;font-size:.88rem;outline:none;transition:border-color var(--t),background var(--t);appearance:none}
.f-group input:focus,.f-group select:focus,.f-group textarea:focus{border-color:var(--red);background:rgba(255,255,255,.07)}
.f-group input::placeholder,.f-group textarea::placeholder{color:rgba(255,255,255,.25)}
.f-group select option{background:var(--blue);color:#fff}
.f-group textarea{resize:vertical;min-height:110px}
#form-ok{display:none;text-align:center;font-family:'DM Mono',monospace;font-size:.8rem;color:var(--red);margin-top:.8rem;letter-spacing:.05em}

/* ── FOOTER ── */
footer{background:rgba(0,0,0,.6);border-top:1px solid rgba(255,255,255,.06);padding:2.5rem 1.5rem;position:relative;z-index:1}
footer::before{display:none}
.foot-link{font-family:'DM Mono',monospace;font-size:.72rem;color:rgba(255,255,255,.3);letter-spacing:.05em;transition:color var(--t)}
.foot-link:hover{color:var(--red)}

/* ── REVEAL ANIMATIONS ── */
.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-40px);transition:opacity .7s ease,transform .7s ease}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(40px);transition:opacity .7s ease,transform .7s ease}
.reveal-right.visible{opacity:1;transform:translateX(0)}
.d1{transition-delay:.1s}
.d2{transition-delay:.2s}
.d3{transition-delay:.3s}
.d4{transition-delay:.4s}

/* ── COUNTER ── */
.counting{display:inline-block}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .services-grid{grid-template-columns:1fr 1fr}
  .team-grid{grid-template-columns:1fr 1fr}
  .gallery-grid{grid-template-columns:1fr 1fr}
  .g-item--big{grid-column:span 2}
  .values-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .services-grid{grid-template-columns:1fr}
  .team-grid{grid-template-columns:1fr 1fr}
  .gallery-grid{grid-template-columns:1fr 1fr}
  .g-item--big{grid-column:span 2}
  .stats-row{flex-wrap:wrap}
  .stat-b{min-width:50%;border-right:none;border-bottom:1px solid rgba(255,255,255,.06)}
}
@media(max-width:480px){
  .team-grid{grid-template-columns:1fr}
  .values-grid{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:1fr}
  .g-item--big{grid-column:span 1}
}