/* Page chrome: nav, footer, section shells, grids */

/* NAV */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  backdrop-filter:saturate(140%) blur(14px);
  background:rgba(10,10,10,.55);
  border-bottom:1px solid var(--line);
  color:#fff;
  transition:background .3s ease;
}
.nav-inner{
  max-width:var(--max);margin:0 auto;padding:14px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.brand{display:flex;align-items:center;gap:10px}
.brand img{height:auto !important;width:auto !important;max-height:22px !important;filter:brightness(0) invert(1)}
@media(max-width:560px){.brand img{max-height:18px !important}}
.nav-links{display:flex;gap:32px;font-size:13px}
.nav-links a{opacity:.78;transition:opacity .2s,color .2s}
.nav-links a:hover{opacity:1;color:var(--accent)}
.nav-cta{
  display:inline-flex;align-items:center;gap:8px;
  padding:11px 20px;background:var(--accent);color:var(--ink);
  border:1px solid var(--accent);
  border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.01em;
  box-shadow:0 8px 24px -8px rgba(36,201,226,.55);
  transition:transform .15s ease,background .2s,box-shadow .2s;
}
.nav-cta:hover{background:var(--accent-2);border-color:var(--accent-2);transform:translateY(-1px);box-shadow:0 10px 28px -6px rgba(77,178,236,.65)}

/* Social icons in nav */
.nav-socials{display:flex;align-items:center;gap:6px}
.nav-socials a{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;
  color:#fff;opacity:.6;
  transition:opacity .2s,color .2s,background .2s,transform .15s;
}
.nav-socials a:hover{opacity:1;color:var(--accent);background:rgba(36,201,226,.1);transform:translateY(-1px)}

.burger{display:none;background:none;border:0;color:#fff;font-size:22px;cursor:pointer}

/* "Me contacter" inside burger menu — mobile only */
.nav-cta-mobile{display:none}

@media(max-width:900px){
  .nav-links,.nav-cta,.nav-socials{display:none}
  .burger{display:block}
  .nav-links.open{
    display:flex;flex-direction:column;gap:18px;
    position:absolute;top:100%;left:0;right:0;
    background:#0a0a0a;padding:24px 28px;border-bottom:1px solid var(--line);
  }
  .nav-links.open .nav-cta-mobile{
    display:inline-flex;align-items:center;gap:8px;
    align-self:flex-start;
    margin-top:8px;
    padding:12px 22px;
    background:var(--accent);color:var(--ink) !important;
    border:1px solid var(--accent);
    border-radius:999px;
    font-size:14px;font-weight:600;letter-spacing:.01em;
    opacity:1;
    box-shadow:0 8px 24px -8px rgba(36,201,226,.55);
  }
}

/* SECTION SHELLS */
section.block{padding:120px 0;position:relative}
section.block.dark{background:#0a0a0a;color:#fff}
section.block.cream{background:var(--paper-2)}
.section-head{display:flex;flex-direction:column;gap:16px;margin-bottom:64px;max-width:760px}
.section-head h2{font-size:clamp(34px,4.5vw,56px)}
.section-head h2 em{
  font-style:italic;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.section-head p{color:#555;font-size:17px;max-width:60ch}
section.dark .section-head p{color:#bdbdbd}

/* GRIDS */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media(max-width:820px){.grid-2{grid-template-columns:1fr}}

/* FOOTER */
footer{
  background:#0a0a0a;color:#9a9a9a;padding:60px 0 40px;
  border-top:1px solid var(--line);
}
.foot{
  max-width:var(--max);margin:0 auto;padding:0 28px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;
  font-size:13px;
}
.foot a{color:#bdbdbd;margin-left:18px;transition:color .2s}
.foot a:hover{color:var(--accent)}