/*
Theme Name: ESMÉE
Theme URI: https://esmee-app.fr
Author: ESMÉE
Description: Thème du site vitrine ESMÉE — le carnet doux et intelligent pour suivre les premiers moments de bébé, partagé entre parents et nounou. Palette terracotta / crème / sauge, typographie Nunito et Cormorant Garamond.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: Propriétaire — tous droits réservés
Text Domain: esmee
Tags: landing-page, one-column, custom-menu, translation-ready
*/

/* ------------------------------------------------------------------
   Le design est porté par des styles en ligne dans les gabarits :
   cette feuille ne contient que ce qui ne peut pas l'être
   (réinitialisations, polices, animations, points de rupture).
   ------------------------------------------------------------------ */

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 96px;
}

body {
  margin: 0;
  background: #FCFAF7;
  color: #2A2D31;
  font-family: 'Nunito', ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; height: auto; }

a { color: #CC6E4F; text-decoration: none; }
a:hover { color: #E08566; }

::selection { background: #F2C879; color: #2A2D31; }

/* --- Animations ------------------------------------------------- */

@keyframes esmFloaty {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

@keyframes esmFloatySlow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-20px); }
}

@keyframes esmAurora {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); opacity: .9; }
  33% { transform: translate3d(3%, -4%, 0) scale(1.08); opacity: 1; }
  66% { transform: translate3d(-3%, 3%, 0) scale(.95); opacity: .78; }
}

@keyframes esmShine { to { background-position: 200% center; } }

@keyframes esmGlow {
  0%, 100% { opacity: .45; transform: scale(1); }
  50% { opacity: .8; transform: scale(1.07); }
}

@keyframes esmBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: .4; }
}

@keyframes esmIn {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: none; }
}

/* --- Navigation : bascule bureau / mobile ----------------------- */

[data-desktop-only] { display: flex; }
[data-navtoggle] { display: none; }

@media (max-width: 900px) {
  [data-desktop-only] { display: none !important; }
  [data-navtoggle] { display: inline-flex !important; }
}

/* --- Grain très léger, pour éviter les aplats trop lisses ------- */

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 90;
  pointer-events: none;
  opacity: .04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 140px 140px;
}

@media (max-width: 640px) {
  body::after { display: none; }
}

/* --- Accessibilité --------------------------------------------- */

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

/* Lien d'évitement, visible seulement au clavier. */
.esmee-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  padding: 12px 20px;
  background: #fff;
  color: #CC6E4F;
  font-weight: 800;
  border-radius: 0 0 14px 0;
  box-shadow: 0 12px 30px -14px rgba(42, 45, 49, .35);
}

.esmee-skip-link:focus {
  left: 0;
}

/* --- Menu WordPress (si un menu est assigné à l'emplacement) ---- */

.esmee-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 30px;
}

.esmee-nav a {
  color: #2A2D31;
  font-weight: 700;
  font-size: 15px;
}

.esmee-nav a:hover,
.esmee-nav .current-menu-item > a {
  color: #CC6E4F;
}

.esmee-nav-mobile ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.esmee-nav-mobile a {
  display: block;
  color: #2A2D31;
  font-weight: 700;
  font-size: 16px;
  padding: 13px 14px;
  border-radius: 14px;
}

.esmee-nav-mobile a:hover {
  background: #FCF6F1;
  color: #CC6E4F;
}

/* --- Contenu d'article / page classique (pages hors gabarits) --- */

.esmee-prose {
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(40px, 6vw, 76px) 24px;
}

.esmee-prose h1 {
  font-size: clamp(30px, 4.4vw, 44px);
  font-weight: 900;
  letter-spacing: -.025em;
  line-height: 1.1;
  color: #2A2D31;
  margin: 0 0 20px;
}

.esmee-prose h2 {
  font-size: clamp(21px, 2.4vw, 27px);
  font-weight: 900;
  color: #2A2D31;
  margin: 34px 0 12px;
}

.esmee-prose p,
.esmee-prose li {
  font-size: 16px;
  line-height: 1.72;
  color: #4a5560;
}

.esmee-prose img { border-radius: 20px; }


/* ------------------------------------------------------------------ *
 * Formulaires (contact, liste d'attente)
 * ------------------------------------------------------------------ */
.esmee-input:focus {
	border-color: #E08566;
	background: #fff;
	box-shadow: 0 0 0 4px rgba(224, 133, 102, .14);
}

.esmee-input-clair:focus {
	border-color: #fff;
	box-shadow: 0 0 0 4px rgba(255, 255, 255, .28);
}

.esmee-bouton:hover {
	transform: translateY(-1px);
}

.esmee-bouton[data-submit]:hover {
	box-shadow: 0 22px 46px -16px rgba(224, 133, 102, .7);
}

[data-objet]:hover {
	border-color: rgba(224, 133, 102, .5);
}
