/* Structure */
.container { width: 100%; max-width: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
.container--narrow { max-width: calc(860px + 2 * var(--gutter)); }
.section { padding-block: var(--section); }
.section--tight { padding-block: calc(var(--section) * 0.55); }
/* Sections en blocs arrondis, décollés des bords */
.section--canvas, .section--sky, .section--navy { margin-inline: clamp(8px, 1.2vw, 16px); border-radius: var(--r-xl); }
.section--canvas { background: var(--ice); }
.section--sky { background: var(--sky); }
.section--navy { position: relative; overflow: hidden; background: var(--night); color: #C9D8F2; isolation: isolate; }
.section--navy::before { content: ""; position: absolute; z-index: -1; width: 70vw; height: 70vw; max-width: 900px; max-height: 900px; right: -20%; top: -40%; background: radial-gradient(circle, rgba(35, 116, 237, 0.45), transparent 62%); }
.section--navy h2, .section--navy h3, .section--navy strong { color: #fff; }
.section--navy h2 em { color: var(--sun); }

/* En-tête flottant */
.site-header { position: sticky; top: 0; z-index: 50; padding: 12px clamp(8px, 1.2vw, 16px) 0; pointer-events: none; }
.site-header__bar { pointer-events: auto; display: flex; align-items: center; gap: clamp(12px, 2vw, 28px); max-width: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; height: 72px; padding: 0 10px 0 24px; background: rgba(255, 255, 255, 0.94); border-radius: 999px; box-shadow: 0 10px 40px -18px rgba(22, 43, 85, 0.35); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.brand { flex: none; width: 124px; }
.brand img { display: block; width: 100%; height: auto; transform: translateY(-10%); }
.main-nav { margin-left: auto; }
.main-nav__list { display: flex; gap: 4px; }
.main-nav__list a { display: block; padding: 10px 14px; border-radius: 999px; font-size: 0.9375rem; font-weight: 600; text-decoration: none; color: var(--ink); white-space: nowrap; transition: background 0.2s, color 0.2s; }
.main-nav__list a:hover { background: var(--ice); }
.main-nav__list a[aria-current="page"] { background: var(--sky); color: var(--navy); }
.main-nav__mobile-extra { display: none; }
.site-header__cart { position: relative; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: var(--ink); background: var(--ice); }
.site-header__cart:hover { background: var(--sky); }
.site-header__count { position: absolute; top: -2px; right: -2px; display: grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--sun); color: var(--navy); font-size: 0.72rem; font-weight: 700; }
.site-header__count[hidden] { display: none; }
.menu-toggle { display: none; }

@media (max-width: 1260px) {
  .main-nav__list a { padding: 10px 10px; font-size: 0.875rem; }
}
@media (max-width: 1140px) {
  .site-header__bar { height: 64px; padding-left: 18px; }
  .brand { width: 108px; }
  .site-header .site-header__cta { display: none; }
  .site-header__cart { margin-left: auto; }
  .menu-toggle { display: grid; place-content: center; gap: 5px; width: 48px; height: 48px; border: 0; border-radius: 50%; background: var(--blue); cursor: pointer; }
  .menu-toggle span { display: block; width: 20px; height: 2px; border-radius: 2px; background: #fff; transition: transform 0.35s var(--ease-out), opacity 0.2s; }
  .menu-open .menu-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
  .menu-open .menu-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .menu-open .site-header__bar { backdrop-filter: none; -webkit-backdrop-filter: none; background: #fff; }
  .main-nav { position: fixed; inset: 0; z-index: -1; margin: 0; padding: 100px var(--gutter) 40px; background: var(--blue); overflow-y: auto; clip-path: circle(0 at calc(100% - 44px) 44px); transition: clip-path 0.6s var(--ease-out); pointer-events: none; }
  .menu-open .main-nav { clip-path: circle(150% at calc(100% - 44px) 44px); pointer-events: auto; }
  .menu-open body { overflow: hidden; }
  .main-nav__list { flex-direction: column; gap: 2px; }
  .main-nav__list a { padding: 8px 0; border-radius: 0; font-family: var(--font-display); font-size: clamp(1.6rem, 7.2vw, 3rem); font-weight: 800; text-transform: uppercase; line-height: 1.05; color: #fff; }
  .main-nav__list a:hover, .main-nav__list a[aria-current="page"] { background: none; color: var(--sun); }
  .main-nav__mobile-extra { display: grid; gap: 14px; margin-top: 36px; }
  .main-nav__meta { color: var(--sky); font-weight: 600; }
}

/* En-tête de page intérieure : bloc bleu arrondi */
.page-head { position: relative; overflow: hidden; margin: -84px clamp(8px, 1.2vw, 16px) 0; padding: calc(84px + clamp(48px, 7vw, 104px)) 0 clamp(48px, 6vw, 88px); background: var(--blue); color: #fff; border-radius: 0 0 var(--r-xl) var(--r-xl); isolation: isolate; }
.page-head::after { content: ""; position: absolute; z-index: -1; right: -6vw; bottom: -16vw; width: 38vw; height: 38vw; border-radius: var(--drop); background: var(--blue-3); opacity: 0.55; transform: rotate(-45deg); }
.page-head__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: end; }
.page-head__title { grid-column: 1 / span 8; }
.page-head__lead { grid-column: 9 / span 4; font-size: 1.15rem; color: #DCEBFF; }
.page-head h1 { margin-top: 18px; color: #fff; }
.page-head h1 em { color: var(--sun); }
.page-head .eyebrow { background: rgba(255, 255, 255, 0.14); color: #fff; }
.page-head .crumbs { color: #DCEBFF; }
@media (max-width: 900px) { .page-head__title, .page-head__lead { grid-column: 1 / -1; } .page-head { margin-top: -76px; padding-top: calc(76px + 48px); } }

.crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: var(--fs-small); font-weight: 600; color: var(--muted); }
.crumbs a { text-decoration: none; }

/* Pied de page */
.site-footer { margin: var(--section) clamp(8px, 1.2vw, 16px) 0; border-radius: var(--r-xl) var(--r-xl) 0 0; overflow: hidden; background: var(--navy); color: #AFC3E6; font-size: 0.9375rem; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--sun); }
.site-footer__cta { position: relative; overflow: hidden; padding: clamp(56px, 8vw, 112px) var(--gutter); background: var(--blue); border-radius: 0 0 var(--r-xl) var(--r-xl); color: #fff; isolation: isolate; }
.site-footer__cta-inner { max-width: calc(var(--container)); margin-inline: auto; display: grid; gap: 28px; justify-items: start; }
.site-footer__kicker { font-weight: 700; color: var(--sky); }
.site-footer__claim { font-family: var(--font-display); font-size: var(--fs-mega); font-weight: 900; line-height: 0.86; text-transform: uppercase; letter-spacing: -0.02em; }
.site-footer__claim sup { font-size: 0.4em; }
.site-footer__drop { position: absolute; z-index: -1; right: clamp(-60px, -2vw, 0px); bottom: -18%; width: clamp(200px, 30vw, 420px); opacity: 0.18; filter: brightness(3) saturate(0); }
.site-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 40px; padding-block: 64px 48px; }
.site-footer__brand img { width: 190px; margin-bottom: 18px; }
.site-footer__brand p { max-width: 32ch; }
.site-footer__title { margin-bottom: 14px; font-family: var(--font); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sun); }
.site-footer ul { list-style: none; padding: 0; display: grid; gap: 8px; }
.site-footer address { font-style: normal; margin-bottom: 12px; color: #fff; }
.site-footer .social { display: flex; gap: 10px; margin-top: 20px; }
.site-footer .social a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(190, 225, 255, 0.12); color: #fff; }
.site-footer .social a:hover { background: var(--sun); color: var(--navy); }
.site-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-block: 24px 32px; border-top: 1px solid rgba(190, 225, 255, 0.15); font-size: 0.8125rem; color: #7F95BE; }
@media (max-width: 960px) { .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .site-footer__grid { grid-template-columns: 1fr; } }

/* Barre d'action mobile */
.mobile-bar { display: none; }
@media (max-width: 760px) {
  .mobile-bar { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 45; display: flex; gap: 8px; padding: 8px; background: var(--navy); border-radius: 999px; box-shadow: var(--shadow); }
  .mobile-bar .btn { flex: 1; min-height: 48px; }
  .mobile-bar__call { display: grid; place-items: center; width: 48px; height: 48px; flex: none; border-radius: 50%; background: rgba(190, 225, 255, 0.16); color: #fff; }
  .mobile-bar__ai { display: grid; place-items: center; width: 48px; height: 48px; flex: none; padding: 0; border: 0; border-radius: 50%; background: rgba(190, 225, 255, 0.16); color: var(--sun); cursor: pointer; }
  .mobile-bar__ai .icon { width: 26px; height: 26px; fill: currentColor; stroke: none; }
  .site-footer__bottom { padding-bottom: 100px; }
}
