/* OriginAR — styles propres à la page contact.
   Généré par build.py depuis mockups-src/. Ne pas éditer ici. */

h1,h2,h3{ font-weight:300; margin:0; }

p{ margin:0; }

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:8px;
  border-radius:var(--radius-pill);
  padding:14px 24px;
  font-size:15px;
  font-weight:500;
  border:none;
  cursor:pointer;
  transition:transform 150ms var(--ease-out), background 150ms var(--ease-out), box-shadow 150ms var(--ease-out);
  white-space:normal;
  max-width:100%;
}

@media (min-width:480px){ .btn{ padding:16px 30px; font-size:16px; white-space:nowrap; } }

.btn-primary{ background:var(--gold); color:var(--obsidian); position:relative; overflow:hidden; }

.btn-primary:hover{ background:#c6913f; transform:scale(1.02); }

.btn-primary:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

.btn-sm{ padding:9px 18px; font-size:13px; }

@media (min-width:480px){ .btn-sm{ padding:10px 22px; font-size:14px; } }

.btn-lg{ padding:14px 24px; font-size:15px; }

@media (min-width:480px){ .btn-lg{ padding:18px 36px; font-size:17px; } }

.btn-primary::after{
  content:"";
  position:absolute; top:0; left:-60%;
  width:40%; height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,0.6), transparent);
  transform:skewX(-20deg);
  transition:left 550ms ease;
  pointer-events:none;
}

.btn-primary:hover::after{ left:130%; }

.reveal-on-scroll{
  opacity:0;
  transform:translateY(24px);
  transition:opacity 700ms var(--ease-out), transform 700ms var(--ease-out);
}

.reveal-on-scroll.is-visible{ opacity:1; transform:translateY(0); }

.stagger-1{ transition-delay:0ms; }

.stagger-2{ transition-delay:90ms; }

@media (prefers-reduced-motion: reduce){
  .reveal-on-scroll{ opacity:1 !important; transform:none !important; transition:none !important; }
  .btn-primary::after{ display:none; }
}

.nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  background:rgba(244,241,235,0.86);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--hairline-light);
}

.nav-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:76px;
}

.nav-logo img{ height:42px; width:auto; }

@media (min-width:768px){ .nav-logo img{ height:50px; } }

.nav-links{
  display:none;
  gap:36px;
  font-size:15px;
  font-weight:500;
}

@media (min-width:768px){ .nav-links{ display:flex; } }

.nav-links a{ opacity:0.85; transition:opacity 150ms; color:var(--obsidian); }

.nav-links a:hover{ opacity:1; }

.nav-links a.is-current{ opacity:1; color:var(--gold-ink); }

.nav-right{ display:flex; align-items:center; gap:12px; }

@media (min-width:768px){ .nav-right{ gap:20px; } }

.nav-burger{
  display:flex;
  width:44px; height:44px;
  align-items:center; justify-content:center;
  background:none; border:none; cursor:pointer;
  flex-shrink:0;
  color:var(--obsidian);
}

@media (min-width:768px){ .nav-burger{ display:none; } }

.burger-icon{ display:block; width:22px; height:16px; position:relative; }

.burger-icon i{
  position:absolute; left:0; right:0; height:2px;
  background:currentColor; border-radius:2px;
  transition:transform 200ms var(--ease-out), opacity 200ms;
}

.burger-icon i:nth-child(1){ top:0; }

.burger-icon i:nth-child(2){ top:7px; }

.burger-icon i:nth-child(3){ top:14px; }

.nav-burger.is-active .burger-icon i:nth-child(1){ transform:translateY(7px) rotate(45deg); }

.nav-burger.is-active .burger-icon i:nth-child(2){ opacity:0; }

.nav-burger.is-active .burger-icon i:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-menu{
  display:flex;
  position:fixed; inset:0;
  background:var(--ivory);
  z-index:99;
  padding:110px 32px 32px;
  flex-direction:column;
  gap:28px;
  font-size:22px;
  font-weight:300;
  transform:translateY(-8px);
  opacity:0;
  pointer-events:none;
  transition:opacity 220ms var(--ease-out), transform 220ms var(--ease-out);
}

.mobile-menu.is-open{ opacity:1; transform:translateY(0); pointer-events:auto; }

.mobile-menu a{ border-bottom:1px solid var(--hairline-light); padding-bottom:16px; }

.mobile-menu a.is-current{ color:var(--gold-ink); }

.mobile-menu .btn{ align-self:flex-start; margin-top:8px; }

.page-intro{ padding:152px 0 56px; }

@media (min-width:768px){ .page-intro{ padding:176px 0 64px; } }

@media (min-width:1024px){ .page-intro{ padding:192px 0 72px; } }

.page-intro-inner{
  max-width:640px;
  margin:0 auto;
  text-align:center;
}

.page-intro-inner h1{
  font-size:clamp(2rem, 6vw, 3rem);
  line-height:1.15;
  margin-bottom:16px;
  text-wrap:balance;
}

.page-intro-inner .section-lede{ margin-left:auto; margin-right:auto; }

section{ padding:56px 0; }

@media (min-width:768px){ section{ padding:80px 0; } }

@media (min-width:1024px){ section{ padding:100px 0; } }

.section-head{ max-width:640px; margin-bottom:40px; }

@media (min-width:768px){ .section-head{ margin-bottom:48px; } }

.section-head h2{
  font-size:clamp(1.6rem, 6vw, 2.4rem);
  line-height:1.18;
  overflow-wrap:break-word;
  text-wrap:balance;
}

.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

.section-lede{
  font-size:15.5px;
  line-height:1.6;
  color:var(--ivory-dim);
  max-width:520px;
  margin-top:12px;
}

@media (min-width:768px){ .section-lede{ font-size:16px; } }

.reasons{ padding-top:0; }

.reasons-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}

@media (min-width:768px){ .reasons-grid{ grid-template-columns:1fr 1fr; gap:24px; } }

.feature-card{
  background:var(--ivory-card);
  border:1px solid var(--hairline-light);
  border-radius:var(--radius-md);
  padding:28px 24px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  transition:transform 200ms var(--ease-out), box-shadow 200ms var(--ease-out);
}

@media (min-width:768px){ .feature-card{ padding:32px; } }

.feature-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 40px -20px rgba(17,17,17,0.18);
}

.feature-card .icon{
  width:48px; height:48px;
  border-radius:50%;
  background:var(--ivory);
  border:1px solid var(--hairline-light);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}

.feature-card .icon svg{ width:22px; height:22px; stroke:var(--obsidian); }

.feature-card h3{ font-size:19px; font-weight:500; }

.feature-card p{ font-size:14.5px; line-height:1.6; color:var(--ivory-dim); }

.reason-link{
  margin-top:auto;
  padding-top:6px;
  font-size:14px;
  font-weight:500;
  color:var(--gold-ink);
}

.partnerships-section{
  background:var(--ivory-card);
  border-top:1px solid var(--hairline-light);
  border-bottom:1px solid var(--hairline-light);
}

.contact-form{
  max-width:640px;
}

.form-row{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
}

@media (min-width:600px){
  .form-row{ grid-template-columns:1fr 1fr; gap:0 16px; }
}

.form-field{
  margin-bottom:20px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.form-field label{
  font-size:14px;
  font-weight:500;
  color:var(--obsidian);
}

.form-field .optional{
  font-weight:500;
  color:var(--ivory-faint);
  text-transform:none;
  letter-spacing:0;
}

.form-field input,
.form-field select,
.form-field textarea{
  font-family:inherit;
  font-size:15.5px;
  color:var(--obsidian);
  background:var(--ivory-card);
  border:1.5px solid var(--hairline-light);
  border-radius:var(--radius-sm);
  padding:13px 16px;
  transition:border-color 150ms var(--ease-out), box-shadow 150ms var(--ease-out);
  width:100%;
}

.partnerships-section .form-field input,
.partnerships-section .form-field select,
.partnerships-section .form-field textarea{
  /* `background-color` et non le raccourci `background` : ce dernier
     réinitialise `background-image`, ce qui effaçait le chevron du menu
     déroulant. Le sélecteur étant plus spécifique (0,2,1) que le
     `.form-field select` qui pose le chevron (0,1,1), l'ordre des règles ne
     rattrapait pas la chose : la flèche disparaissait du seul formulaire
     Partnerships. Corrigé le 10/09/2026, signalé par Xavier. */
  background-color:var(--ivory);
}

.form-field input::placeholder,
.form-field textarea::placeholder{ color:var(--ivory-faint); }

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(212,162,76,0.18);
}

.form-field textarea{ resize:vertical; min-height:120px; }

.form-field select{
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:16px;
  padding-right:42px;
}

.form-field select:invalid{ color:var(--ivory-faint); }

.form-success{
  display:none;
  max-width:640px;
  align-items:flex-start;
  flex-direction:column;
  gap:12px;
  padding:32px;
  background:var(--ivory-card);
  border:1px solid var(--hairline-light);
  border-radius:var(--radius-md);
  opacity:0;
  transform:translateY(12px);
  transition:opacity 500ms var(--ease-out), transform 500ms var(--ease-out);
}

.partnerships-section .form-success{ background:var(--ivory); }

.form-success.is-visible{ display:flex; opacity:1; transform:translateY(0); }

.form-success-icon{
  width:52px; height:52px;
  border-radius:50%;
  background:var(--ivory);
  border:1px solid var(--hairline-light);
  display:flex; align-items:center; justify-content:center;
  color:var(--gold-ink);
}

.partnerships-section .form-success-icon{ background:var(--ivory-card); }

.form-success-icon svg{ width:22px; height:22px; }

.form-success h3{ font-size:19px; font-weight:500; }

.form-success p{ font-size:15px; line-height:1.6; color:var(--ivory-dim); }

.form-error{
  background:var(--ivory-card);
  border:1px solid var(--hairline-light);
  border-radius:var(--radius-sm);
  padding:14px 16px;
  margin-bottom:20px;
  font-size:14.5px;
  line-height:1.55;
  color:var(--obsidian);
}

.btn:disabled{ opacity:0.55; pointer-events:none; }
