:root {
  --gutter: clamp(22px, 6.5vw, 106px);
  --content-max: 1440px;
  --section-y: clamp(80px, 8vw, 128px);
  --cluster: clamp(40px, 4.5vw, 56px);
  --focus-ring: var(--ink);
}

:where(a, button):focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 4px;
}

.section-dark { --focus-ring: var(--signal); }
.contact-inner { --focus-ring: var(--ink); }

.site-header,
.hero,
.section-pad,
.contact,
.site-footer {
  padding-inline: max(var(--gutter), calc((100vw - var(--content-max)) / 2));
}

.hero {
  padding-top: clamp(138px, 11vw, 166px);
  padding-bottom: 40px;
}

.hero h1 {
  font-size: clamp(3.7rem, 7vw, 7.2rem);
  line-height: .96;
  letter-spacing: -.05em;
  text-wrap: balance;
}

.section-pad {
  padding-block: var(--section-y);
}

.section-pad h2 {
  line-height: 1;
  letter-spacing: -.045em;
  text-wrap: balance;
}

.section-label { margin-bottom: var(--cluster); }
.manifesto-content > p { margin: 40px 0 0 clamp(0px, 12vw, 160px); max-width: 680px; }
.products { padding-top: 0; }
.section-heading { margin-bottom: var(--cluster); }
.product-card { padding-block: 48px; }
.product-logo { margin-bottom: 38px; }
.product-details { align-self: start; padding-top: 84px; }
.product-details li { font-size: .9375rem; line-height: 1.5; }
.limit { font-size: .875rem; line-height: 1.6; }
.method-grid { margin-top: clamp(64px, 7vw, 88px); }
.method-grid article { min-height: 208px; }
.method-grid h3 { margin-top: 40px; }
.method blockquote { margin-top: clamp(72px, 8vw, 96px); }
.about-grid { gap: clamp(56px, 7vw, 88px); }
.about-copy .about-conclusion { margin-top: 36px; }
.contact { padding-bottom: var(--section-y); }
.contact-inner { padding: clamp(56px, 7vw, 88px); }
.footer-top { padding-bottom: 56px; }
.footer-bottom { font-size: .8125rem; }
.eyebrow, .section-label, .detail-title, .method-grid span, .hero-proof span { font-size: .75rem; line-height: 1.45; }

/* Le contenu reste toujours visible : aucun espace fantôme pendant le scroll. */
[data-reveal], [data-reveal].visible {
  opacity: 1;
  transform: none;
  transition: none;
}

body.menu-open { overflow: hidden; }

@media (max-width: 1100px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-mark { position: absolute; right: var(--gutter); top: 180px; width: 170px; opacity: .18; }
  .hero-mark .frame { height: 90px; border-width: 8px; }
  .hero-mark .diamond { width: 34px; height: 34px; }
  .hero-mark p { display: none; }
}

@media (max-width: 900px) {
  .method-grid { grid-template-columns: 1fr; margin-top: 64px; }
  .method-grid article,
  .method-grid article + article { min-height: 0; padding: 28px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.2); }
  .method-grid h3 { margin: 24px 0 12px; }
  .method blockquote { margin-top: 80px; }
}

@media (max-width: 768px) {
  .menu-button { display: block; }
  .main-nav { display: none; position: absolute; top: 70px; left: 0; right: 0; background: var(--canvas); padding: 26px 22px 34px; border-bottom: 1px solid var(--line); align-items: stretch; flex-direction: column; gap: 0; }
  .main-nav.open { display: flex; }
  .main-nav a { font-size: 1.05rem; padding: 14px 0; }
  .main-nav .nav-cta { margin-top: 12px; padding: 14px; }
  .section-pad { padding-block: 72px; }
  .section-label { margin-bottom: 36px; }
  .products { padding-top: 64px; }
  .section-heading { margin-bottom: 44px; }
  .hero h1 { font-size: clamp(3.05rem, 13vw, 4.2rem); }
  .hero .button { width: 100%; }
  .product-card { gap: 22px; padding-block: 36px; }
  .product-details { padding-top: 0; }
  .product-logo { margin-bottom: 24px; }
  .product-main > p { margin-block: 22px; }
  .product-details ul { margin: 18px 0 26px; }
  .product-details li { padding-block: 12px; }
  .method blockquote { margin-top: 64px; }
  .contact { padding-bottom: 0; }
  .site-footer { padding-top: 48px; }
  .footer-top { gap: 24px; padding-bottom: 40px; }
  .footer-bottom { gap: 18px; }
}

@media (max-width: 390px) {
  .hero h1 { font-size: clamp(3.05rem, 13vw, 4.2rem); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
