:root{--ink:#211457;--pink:#ff2f86;--pink2:#ff6aa6;--purple:#7b3ff2;--orange:#ffad32;--yellow:#ffe36b;--cream:#fff8ee;--soft:#fff0f7;--line:#f3ddea;--muted:#655b85;--shadow:0 20px 60px rgba(64,28,92,.14);--radius:24px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:#fffdf9;line-height:1.45}a{color:inherit;text-decoration:none}.container{width:min(1180px,calc(100% - 40px));margin-inline:auto}.narrow{width:min(820px,calc(100% - 40px))}.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);border-bottom:1px solid #ffe1ed}.nav-wrap{height:76px;display:flex;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:10px;font-size:22px;line-height:.95}.brand-icon{width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--pink),#ff85c0);color:white;font-weight:900;box-shadow:0 10px 25px rgba(255,47,134,.28)}.brand strong{display:block}.brand em{display:block;font-style:normal;color:var(--pink);font-weight:900}.main-nav{display:flex;gap:22px;align-items:center;margin-left:auto;font-size:14px;font-weight:700}.nav-link{padding:8px 0;border-bottom:2px solid transparent}.nav-link.active,.nav-link:hover{color:var(--pink);border-color:var(--pink)}.header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;border:0;font-weight:900;cursor:pointer;transition:.18s ease;white-space:nowrap}.header-cta{background:var(--pink);color:#fff;padding:13px 24px;box-shadow:0 10px 30px rgba(255,47,134,.25)}.btn{padding:15px 26px}.btn.primary{background:linear-gradient(135deg,var(--pink),#ff3fa1);color:white;box-shadow:0 12px 28px rgba(255,47,134,.28)}.btn.secondary{background:white;color:var(--ink);border:2px solid #ded5f6}.btn.yellow{background:var(--yellow);color:var(--ink);box-shadow:0 10px 20px rgba(255,173,50,.25)}.btn.full{width:100%}.btn:hover,.header-cta:hover{transform:translateY(-2px)}.menu-toggle{display:none;margin-left:auto;background:white;border:1px solid var(--line);border-radius:12px;padding:10px}.menu-toggle span{display:block;width:24px;height:3px;background:var(--ink);margin:4px;border-radius:4px}.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 66% 30%,#ffd0e4 0 18%,transparent 35%),linear-gradient(180deg,#fff8ee,#fff);border-bottom:1px solid #ffe1ed}.hero-grid{display:grid;grid-template-columns:1.05fr .85fr 280px;gap:24px;align-items:center;min-height:360px;padding:22px 0}.hero h1{font-size:clamp(34px,4.2vw,56px);line-height:1.02;margin:10px 0 14px;letter-spacing:-.04em}.hero h1 span{display:block;color:var(--pink)}.hero-lead{font-size:16px;color:#33256b;max-width:540px}.breadcrumb-pill{display:inline-flex;background:white;border:1px solid #f4dbe8;border-radius:999px;padding:9px 14px;font-weight:800;color:#44346f;box-shadow:0 8px 20px rgba(64,28,92,.06)}.hero-actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px}.hero-art{height:300px;position:relative;display:grid;place-items:center}.gift-box{width:200px;height:170px;background:linear-gradient(135deg,var(--purple),#ff5b93);border-radius:25px;position:relative;box-shadow:var(--shadow);display:grid;place-items:center}.gift-lid{position:absolute;top:-34px;width:230px;height:54px;background:linear-gradient(135deg,#6d37e6,#ff4e98);border-radius:20px;transform:rotate(-8deg)}.song-card{background:#ffdf55;border-radius:12px;padding:18px;text-align:center;font-weight:900;transform:rotate(-3deg);box-shadow:0 12px 25px rgba(0,0,0,.1)}.song-card span{display:block;color:var(--pink);font-size:32px}.floating-player{position:absolute;bottom:18px;left:0;right:0;margin:auto;width:min(390px,100%);background:white;border-radius:22px;box-shadow:var(--shadow);padding:14px;display:flex;align-items:center;gap:14px}.floating-player button,.audio-row button{width:46px;height:46px;border-radius:50%;border:0;background:#38239b;color:#fff;font-weight:900}.wave{height:16px;flex:1;background:repeating-linear-gradient(90deg,#8f6bf4 0 3px,transparent 3px 8px);mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}.wave.big{height:28px;margin-top:6px}.reassurance-card{background:rgba(255,255,255,.92);border:1px solid #f2d8e5;border-radius:24px;box-shadow:var(--shadow);padding:18px;display:grid;gap:10px}.reassurance-card div{display:flex;gap:13px;align-items:center}.reassurance-card span{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff0f7}.reassurance-card p{margin:0}.reassurance-card small{display:block;color:var(--muted)}.bubble,.note{position:absolute;pointer-events:none}.bubble{border-radius:50%;background:linear-gradient(135deg,rgba(255,47,134,.35),rgba(255,227,107,.35))}.b1{width:220px;height:220px;left:-80px;bottom:-70px}.b2{width:170px;height:170px;right:-60px;bottom:30px}.note{color:var(--pink);font-size:36px;font-weight:900}.n1{top:95px;left:7%}.n2{right:6%;top:125px;color:var(--orange)}.section{padding:60px 0}.section.compact{padding:28px 0}.soft-bg{background:linear-gradient(180deg,#fff,#fff4f8)}.section-title h2{font-size:34px;margin:8px 0 24px}.section-title span{color:var(--pink);font-weight:900}.occasion-grid,.category-tabs{display:grid;grid-template-columns:repeat(9,1fr);gap:14px}.occasion-card,.category-tabs a{background:white;border:1px solid #f0dce6;border-radius:18px;min-height:132px;padding:16px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(64,28,92,.06);transition:.18s}.occasion-card:hover,.category-tabs a:hover{transform:translateY(-4px);border-color:#ffc1d8}.occasion-card span,.category-tabs span{font-size:40px;display:block;margin-bottom:8px}.occasion-card small{color:var(--muted);font-size:12px}.dashboard-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.info-card,.price-card,.cta-card{background:white;border:1px solid #f0dce6;border-radius:var(--radius);box-shadow:0 12px 38px rgba(64,28,92,.08);padding:24px}.info-card h2,.price-card h2,.cta-card h2{margin-top:0}.price-card{border:3px solid #ffc329;text-align:center}.price{font-size:64px;font-weight:1000;color:var(--pink);line-height:1;margin:14px 0}.check-list{list-style:none;margin:18px 0;padding:0;text-align:left}.check-list li{margin:8px 0}.check-list li:before{content:'✓';color:var(--pink);font-weight:1000;margin-right:9px}.icon-list{list-style:none;padding:0;margin:0;display:grid;gap:16px}.icon-list li{display:grid;grid-template-columns:44px 1fr;gap:12px}.icon-list span{grid-row:span 2;width:44px;height:44px;background:#fff0f7;border-radius:50%;display:grid;place-items:center}.icon-list small{color:var(--muted)}.audio-list{display:grid;gap:10px}.audio-row{display:grid;grid-template-columns:40px 1fr 48px;align-items:center;gap:10px;background:#faf6ff;border:1px solid #ece1ff;border-radius:14px;padding:9px}.audio-row button{width:36px;height:36px}.audio-row .wave{grid-column:2/4;width:100%}.review{background:#fffafa;border:1px solid #f4dbe8;border-radius:16px;padding:14px;margin-bottom:10px}.review span{color:#ffb800}.faq-mini details,.faq-list details{background:#fff;border:1px solid #f0dce6;border-radius:15px;margin-bottom:12px;padding:16px}.faq-mini summary,.faq-list summary{cursor:pointer;font-weight:900}.cta-band{background:linear-gradient(135deg,var(--pink),var(--purple));color:white;padding:34px 0}.cta-band .container{display:flex;align-items:center;justify-content:space-between;gap:20px}.cta-band h2{margin:0;font-size:32px}.cta-band p{margin:6px 0 0}.site-footer{background:#170f3d;color:white;padding:50px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}.site-footer a{display:block;color:#f7eafe;margin:8px 0}.footer-brand{color:white}.footer-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:22px;padding-top:20px;color:#d9cfff}.page-hero{background:linear-gradient(135deg,#fff6ed,#fff0f8);padding:70px 0;text-align:center;border-bottom:1px solid #ffe1ed}.page-hero h1{font-size:clamp(40px,5vw,64px);line-height:1.05;margin:12px 0}.category-hero .hero-grid{min-height:350px}.category-hero h1{font-size:clamp(34px,4.2vw,54px)}.character-card{width:270px;height:230px;background:radial-gradient(circle at 50% 20%,#ffe0ef,#f2e4ff);border-radius:40px;display:grid;place-items:center;text-align:center;font-size:64px;font-weight:900;box-shadow:var(--shadow)}.character-card span{display:block;font-size:18px;background:white;border-radius:999px;padding:12px 20px}.category-content-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.process-line{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;text-align:center}.process-line span,.step-card span{margin:auto;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#efe6ff;color:var(--purple);font-weight:1000}.chips{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.chips span{background:#fff8fb;border:1px solid #f0dce6;border-radius:14px;padding:16px;font-weight:800}.review-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.wide{grid-column:span 2}.cta-card{background:linear-gradient(135deg,#8b4cf6,#ff3f92);color:white;text-align:center}.price-page-grid{display:grid;grid-template-columns:420px 1fr;gap:24px}.price-card.big{padding:34px}.step-grid,.examples-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step-card{background:white;border:1px solid #f0dce6;border-radius:24px;padding:26px;box-shadow:0 12px 38px rgba(64,28,92,.08);text-align:center}.form-layout{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}.song-form{background:white;border:1px solid #f0dce6;border-radius:28px;box-shadow:var(--shadow);padding:28px;display:grid;gap:16px}.form-note{background:#fff0f7;border:1px solid #ffd3e4;padding:14px;border-radius:16px;text-align:center}.song-form label{display:grid;gap:8px;font-weight:900}.song-form input,.song-form select,.song-form textarea{width:100%;border:1px solid #ead6e3;border-radius:14px;padding:14px 15px;font:inherit;color:var(--ink);background:#fffdfc}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.success-message{background:#e9fff1;color:#126b32;border:1px solid #b7f0ca;border-radius:14px;padding:14px;font-weight:800}.form-side{position:sticky;top:100px}@media (max-width:1050px){.main-nav,.header-cta{display:none}.menu-toggle{display:block}.main-nav.open{display:flex;position:absolute;left:20px;right:20px;top:76px;background:white;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:20px;flex-direction:column;align-items:flex-start}.hero-grid{grid-template-columns:1fr;min-height:auto}.hero-art{height:280px}.reassurance-card{grid-template-columns:repeat(2,1fr)}.occasion-grid,.category-tabs{grid-template-columns:repeat(3,1fr)}.dashboard-grid,.category-content-grid,.step-grid,.examples-grid{grid-template-columns:1fr 1fr}.price-page-grid,.form-layout{grid-template-columns:1fr}.wide{grid-column:span 1}.cta-band .container{flex-direction:column;text-align:center}.footer-grid{grid-template-columns:1fr 1fr}}@media (max-width:640px){.container{width:min(100% - 24px,1180px)}.nav-wrap{height:66px}.brand{font-size:18px}.brand-icon{width:36px;height:36px}.hero h1,.page-hero h1{font-size:38px}.hero-grid{padding:22px 0}.hero-actions{display:grid}.btn{width:100%;padding:14px 18px}.hero-art{height:230px}.gift-box{width:190px;height:160px}.gift-lid{width:220px}.floating-player{position:relative;bottom:auto;margin-top:10px}.reassurance-card,.occasion-grid,.category-tabs,.dashboard-grid,.category-content-grid,.step-grid,.examples-grid,.footer-grid,.review-row,.form-row{grid-template-columns:1fr}.category-tabs a,.occasion-card{min-height:110px}.section{padding:38px 0}.price{font-size:52px}.process-line{grid-template-columns:1fr 1fr}.chips{grid-template-columns:1fr}.page-hero{padding:46px 0}.info-card,.price-card,.cta-card,.song-form{padding:20px}}

/* --- Générateur de paroles intégré --- */
.generator-section{background:linear-gradient(180deg,#fff,#fff6fb);padding:52px 0}
.generator-box{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start;background:white;border:1px solid #f0dce6;border-radius:30px;box-shadow:var(--shadow);padding:24px}
.generator-intro h2{margin:0 0 8px;font-size:32px}
.generator-intro p{color:var(--muted);margin:0 0 18px}
.inline-song-form{display:grid;gap:13px}
.inline-song-form label{display:grid;gap:7px;font-weight:900}
.inline-song-form input,.inline-song-form select,.inline-song-form textarea{width:100%;border:1px solid #ead6e3;border-radius:14px;padding:13px 14px;font:inherit;color:var(--ink);background:#fffdfc}
.inline-song-form textarea{min-height:110px;resize:vertical}
.preview-panel{background:linear-gradient(135deg,#fff8ee,#fff0f7);border:1px solid #f1d7e5;border-radius:24px;padding:22px;position:sticky;top:96px}
.preview-panel h3{margin:0 0 8px}
.preview-panel p{color:var(--muted)}
.lyrics-preview{background:white;border:1px dashed #e4cfe0;border-radius:18px;padding:18px;min-height:210px;white-space:pre-line;color:#34236a;box-shadow:0 8px 22px rgba(64,28,92,.06)}
.lyrics-preview[contenteditable="true"]{border-style:solid;outline:0}
.lyrics-preview[contenteditable="true"]:focus{border-color:var(--pink);box-shadow:0 0 0 4px rgba(255,47,134,.12),0 8px 22px rgba(64,28,92,.06)}
.preview-actions{display:grid;gap:10px;margin-top:14px}
.pay-after-preview[aria-disabled="true"]{opacity:.55;cursor:not-allowed;filter:saturate(.7)}
.success-message.is-loading{background:#fff8e5;color:#7a4b00;border-color:#ffe29a}
.success-message.is-error{background:#fff0f0;color:#8a1522;border-color:#ffc6ce}
.success-message.is-success{background:#e9fff1;color:#126b32;border-color:#b7f0ca}
.locked-payment{font-size:13px;color:var(--muted);text-align:center}
.review-count-badge{display:inline-flex;align-items:center;gap:8px;background:white;border:1px solid #f0dce6;border-radius:999px;padding:10px 14px;font-weight:900;color:var(--pink);box-shadow:0 8px 22px rgba(64,28,92,.06);margin-bottom:14px}

/* --- Avis en rotation --- */
.reviews-strip{overflow:hidden;position:relative;margin-top:18px;border-radius:24px;background:rgba(255,255,255,.7);border:1px solid #f0dce6;padding:18px}
.reviews-strip:before,.reviews-strip:after{content:'';position:absolute;top:0;width:80px;height:100%;z-index:2;pointer-events:none}
.reviews-strip:before{left:0;background:linear-gradient(90deg,#fff6fb,transparent)}
.reviews-strip:after{right:0;background:linear-gradient(270deg,#fff6fb,transparent)}
.review-track{display:flex;gap:14px;width:max-content;animation:reviewScroll 34s linear infinite}
.reviews-strip:hover .review-track{animation-play-state:paused}
.review-pill{width:310px;flex:0 0 auto;background:white;border:1px solid #f0dce6;border-radius:20px;padding:16px;box-shadow:0 10px 28px rgba(64,28,92,.07)}
.review-pill strong{display:flex;justify-content:space-between;gap:10px}
.review-pill span{color:#ffb800;white-space:nowrap}
.review-pill p{margin:8px 0 0;color:#4e4378;font-size:14px}
@keyframes reviewScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:1050px){.generator-box{grid-template-columns:1fr}.preview-panel{position:static}.review-pill{width:280px}}
@media (max-width:640px){.generator-section{padding:36px 0}.generator-box{padding:18px;border-radius:22px}.generator-intro h2{font-size:26px}.reviews-strip{padding:12px}.review-pill{width:250px}}

/* --- Ajustements pages catégories v7 --- */
.category-inline-cta{padding:0 0 44px;background:linear-gradient(180deg,#fff,#fff4f8)}
.category-inline-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:22px;background:linear-gradient(135deg,#8b4cf6,#ff3f92);color:white;border-radius:26px;padding:24px 28px;box-shadow:var(--shadow)}
.category-inline-cta h2{margin:0 0 6px;font-size:28px}
.category-inline-cta p{margin:0;color:rgba(255,255,255,.88)}
.category-inline-cta .btn{flex:0 0 auto}
.category-page .category-content-grid{grid-template-columns:repeat(3,1fr)}
.category-page .reviews-strip{margin-bottom:34px}
.category-page .generator-section{padding-top:22px}
@media (max-width:1050px){.category-inline-cta-inner{flex-direction:column;text-align:center}.category-page .category-content-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.category-page .category-content-grid{grid-template-columns:1fr}.category-inline-cta-inner{padding:22px 18px}.category-inline-cta h2{font-size:24px}}

/* --- Bloc Comment ça marche amélioré v8 --- */
.steps-card{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 15% 10%, rgba(255,227,107,.55), transparent 22%),
    radial-gradient(circle at 85% 15%, rgba(255,47,134,.16), transparent 24%),
    linear-gradient(135deg,#ffffff,#fff6fb);
}
.steps-card:before{
  content:'';
  position:absolute;
  inset:18px auto 18px 45px;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--pink),var(--purple),var(--orange));
  opacity:.25;
}
.steps-card h2{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:30px;
}
.steps-card h2:before{
  content:'✨';
  width:42px;
  height:42px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#ffe36b,#ffad32);
  box-shadow:0 10px 24px rgba(255,173,50,.22);
}
.steps-card .icon-list{
  position:relative;
  gap:14px;
}
.steps-card .icon-list li{
  position:relative;
  background:rgba(255,255,255,.82);
  border:1px solid #f2d8e5;
  border-radius:18px;
  padding:14px;
  box-shadow:0 10px 24px rgba(64,28,92,.06);
  transition:.18s ease;
}
.steps-card .icon-list li:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(64,28,92,.09);
}
.steps-card .icon-list span{
  background:linear-gradient(135deg,#fff0f7,#efe6ff);
  border:1px solid #efd8ff;
  box-shadow:0 8px 18px rgba(123,63,242,.12);
}
.steps-card .icon-list b{
  font-size:16px;
}
.steps-card .btn{
  margin-top:18px;
}

/* Variante pleine largeur pour la page Comment ça marche */
.process-showcase{
  background:linear-gradient(135deg,#fff6ed,#fff0f8);
  border:1px solid #f0dce6;
  border-radius:30px;
  padding:28px;
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.process-showcase:after{
  content:'♪';
  position:absolute;
  right:28px;
  top:18px;
  font-size:90px;
  color:rgba(255,47,134,.10);
  font-weight:900;
}
.process-showcase .process-line{
  position:relative;
  z-index:1;
}
.process-showcase .process-line > div{
  background:white;
  border:1px solid #f0dce6;
  border-radius:22px;
  padding:18px;
  box-shadow:0 10px 28px rgba(64,28,92,.06);
}
.process-showcase .process-line span{
  width:56px;
  height:56px;
  margin-bottom:12px;
  background:linear-gradient(135deg,#ff2f86,#7b3ff2);
  color:white;
  box-shadow:0 10px 22px rgba(123,63,242,.18);
}
@media (max-width:640px){
  .steps-card:before{display:none}
  .steps-card h2{font-size:25px}
  .steps-card h2:before{width:36px;height:36px;border-radius:13px}
  .process-showcase{padding:18px;border-radius:22px}
}


/* --- Bloc process vertical coloré v9 --- */
.info-card.process{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#fff,#fff7fb);
}
.info-card.process h2{
  margin-bottom:18px;
  font-size:30px;
}
.info-card.process .process-line{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  position:relative;
}
.info-card.process .process-line:before{
  content:"";
  position:absolute;
  left:27px;
  top:10px;
  bottom:10px;
  width:4px;
  border-radius:999px;
  background:linear-gradient(180deg,#ff5fa0,#a06bff,#ffbf55);
  opacity:.22;
}
.info-card.process .process-line > div{
  position:relative;
  display:grid;
  grid-template-columns:56px 1fr;
  align-items:center;
  gap:14px;
  padding:16px 16px 16px 14px;
  border-radius:20px;
  background:white;
  border:1px solid #f0dce6;
  box-shadow:0 10px 24px rgba(64,28,92,.06);
}
.info-card.process .process-line > div span{
  width:42px;
  height:42px;
  margin:0 auto;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-weight:1000;
  color:white;
  box-shadow:0 8px 18px rgba(64,28,92,.14);
}
.info-card.process .process-line > div b,
.info-card.process .process-line > div small{
  grid-column:2;
}
.info-card.process .process-line > div b{
  display:block;
  font-size:20px;
  line-height:1.05;
  margin-bottom:4px;
}
.info-card.process .process-line > div small{
  display:block;
  color:var(--muted);
  font-size:14px;
}
.info-card.process .process-line > div:nth-child(1){background:linear-gradient(135deg,#fff4f9,#ffffff);border-color:#ffd5e6}
.info-card.process .process-line > div:nth-child(1) span{background:linear-gradient(135deg,#ff4f96,#ff7caf)}
.info-card.process .process-line > div:nth-child(2){background:linear-gradient(135deg,#faf5ff,#ffffff);border-color:#e7dbff}
.info-card.process .process-line > div:nth-child(2) span{background:linear-gradient(135deg,#8f6bf4,#6a46ea)}
.info-card.process .process-line > div:nth-child(3){background:linear-gradient(135deg,#fff7ef,#ffffff);border-color:#ffe2bf}
.info-card.process .process-line > div:nth-child(3) span{background:linear-gradient(135deg,#ffb84d,#ff9e19)}
.info-card.process .process-line > div:nth-child(4){background:linear-gradient(135deg,#f3fffb,#ffffff);border-color:#cbf4e7}
.info-card.process .process-line > div:nth-child(4) span{background:linear-gradient(135deg,#33c7a3,#1eaf8f)}
.info-card.process .process-line > div:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(64,28,92,.09)}

/* Page comment-ca-marche : présentation plus élégante */
.step-grid.timeline-grid{display:grid;grid-template-columns:1fr;gap:16px}
.step-grid.timeline-grid .step-card{
  display:grid;
  grid-template-columns:72px 1fr;
  align-items:center;
  text-align:left;
  border-radius:24px;
  padding:20px 22px;
}
.step-grid.timeline-grid .step-card span{
  width:54px;height:54px;margin:0;
  background:linear-gradient(135deg,#ff2f86,#7b3ff2);
  color:white;
}
.step-grid.timeline-grid .step-card h2,
.step-grid.timeline-grid .step-card p{grid-column:2;margin:0}
.step-grid.timeline-grid .step-card h2{margin-bottom:6px;font-size:24px}
.step-grid.timeline-grid .step-card p{color:var(--muted)}
.step-grid.timeline-grid .step-card:nth-child(2) span{background:linear-gradient(135deg,#8f6bf4,#5a39d7)}
.step-grid.timeline-grid .step-card:nth-child(3) span{background:linear-gradient(135deg,#ffb84d,#ff8e32)}
.step-grid.timeline-grid .step-card:nth-child(4) span{background:linear-gradient(135deg,#35c9a4,#19a988)}

/* --- Images hero pleine largeur par categorie --- */
.category-hero-bg{
  isolation:isolate;
  background:#fffdf9;
}
.category-hero-bg:before,
.category-hero-bg:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.category-hero-bg:before{
  z-index:0;
  background-image:var(--hero-bg);
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  transform:scale(1.01);
}
.category-hero-bg:after{
  z-index:0;
  background:
    linear-gradient(90deg,rgba(255,253,249,.84) 0%,rgba(255,253,249,.62) 42%,rgba(255,253,249,.18) 72%,rgba(255,253,249,.38) 100%);
}
.hero-bg-amour{--hero-bg:url("../img/hero-categories/hero-amour.jpg")}
.hero-bg-anniversaire{--hero-bg:url("../img/hero-categories/hero-anniversaire.jpg")}
.hero-bg-bebe{--hero-bg:url("../img/hero-categories/hero-bebe.jpg")}
.hero-bg-enfant{--hero-bg:url("../img/hero-categories/hero-enfant.jpg")}
.hero-bg-famille{--hero-bg:url("../img/hero-categories/hero-famille.jpg")}
.hero-bg-hommage{--hero-bg:url("../img/hero-categories/hero-hommage.jpg")}
.hero-bg-mariage{--hero-bg:url("../img/hero-categories/hero-mariage.jpg")}
.hero-bg-remerciement{--hero-bg:url("../img/hero-categories/hero-remerciement.jpg")}
.hero-bg-styles-musicaux{--hero-bg:url("../img/hero-categories/hero-styles-musicaux.jpg")}
.hero-home-bg{
  isolation:isolate;
  background:#fffdf9;
}
.hero-home-bg:before,
.hero-home-bg:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.hero-home-bg:before{
  z-index:0;
  background-image:url("../img/hero-home.jpg");
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  transform:scale(1.01);
}
.hero-home-bg:after{
  z-index:0;
  background:linear-gradient(90deg,rgba(255,253,249,.86) 0%,rgba(255,253,249,.66) 42%,rgba(255,253,249,.2) 72%,rgba(255,253,249,.42) 100%);
}
.hero-home-bg .bubble,
.hero-home-bg .note{
  z-index:1;
}
.hero-home-bg .hero-grid{
  min-height:500px;
  padding:64px 0;
  position:relative;
  z-index:2;
}
.hero-home-bg .hero-copy,
.hero-home-bg .hero-art,
.hero-home-bg .reassurance-card{
  position:relative;
  z-index:2;
}
.hero-home-bg .hero-art{
  height:auto;
  min-height:180px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.hero-home-bg .hero-art .floating-player{
  position:relative;
  inset:auto;
  width:min(390px,100%);
  margin:0;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(10px);
}
.category-hero-bg .bubble,
.category-hero-bg .note{
  z-index:1;
}
.category-hero-bg .hero-grid{
  min-height:470px;
  padding:58px 0;
  position:relative;
  z-index:2;
}
.category-hero-bg .hero-copy,
.category-hero-bg .category-art,
.category-hero-bg .reassurance-card{
  position:relative;
  z-index:2;
}
.category-hero-bg .category-art{
  height:auto;
  min-height:180px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.category-hero-bg .category-art .floating-player{
  position:relative;
  inset:auto;
  width:min(390px,100%);
  margin:0;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(10px);
}

@media (max-width:1050px){
  .category-hero-bg:before{
    background-position:center top;
  }
  .hero-home-bg:before{
    background-position:center top;
  }
  .hero-home-bg:after{
    background:linear-gradient(180deg,rgba(255,253,249,.9) 0%,rgba(255,253,249,.64) 52%,rgba(255,253,249,.88) 100%);
  }
  .hero-home-bg .hero-grid{
    min-height:auto;
    padding:46px 0;
  }
  .hero-home-bg .hero-art{
    min-height:auto;
    justify-content:flex-start;
  }
  .hero-home-bg .hero-art .floating-player{
    width:min(430px,100%);
  }
  .category-hero-bg:after{
    background:linear-gradient(180deg,rgba(255,253,249,.88) 0%,rgba(255,253,249,.62) 52%,rgba(255,253,249,.86) 100%);
  }
  .category-hero-bg .hero-grid{
    min-height:auto;
    padding:46px 0;
  }
  .category-hero-bg .category-art{
    min-height:auto;
    justify-content:flex-start;
  }
  .category-hero-bg .category-art .floating-player{
    width:min(430px,100%);
  }
}

@media (max-width:640px){
  .category-hero-bg .hero-grid{
    padding:38px 0;
  }
  .hero-home-bg .hero-grid{
    padding:38px 0;
  }
  .category-hero-bg .category-art .floating-player{
    width:100%;
  }
  .hero-home-bg .hero-art .floating-player{
    width:100%;
  }
}

@media (max-width:640px){
  .info-card.process h2{font-size:26px}
  .info-card.process .process-line > div{grid-template-columns:48px 1fr;padding:14px}
  .info-card.process .process-line:before{left:23px}
  .info-card.process .process-line > div b{font-size:18px}
  .step-grid.timeline-grid .step-card{grid-template-columns:58px 1fr;padding:16px}
  .step-grid.timeline-grid .step-card h2{font-size:20px}
  .step-grid.timeline-grid .step-card span{width:46px;height:46px}
}

/* --- Correction v10 : étapes sur une seule ligne lisible --- */
.info-card.process .process-line > div{
  grid-template-columns:54px 1fr;
}
.info-card.process .process-line > div b{
  grid-column:2;
  margin:0;
  line-height:1.18;
}
.info-card.process .process-line > div small{
  display:none;
}
@media (min-width:1051px){
  .info-card.process .process-line > div b{
    white-space:nowrap;
    font-size:18px;
  }
}

/* --- Hero homepage version maquette --- */
.hero-home-mockup{
  min-height:360px;
  isolation:isolate;
  background:
    radial-gradient(circle at -2% 78%, rgba(255,227,107,.58) 0 88px, transparent 90px),
    radial-gradient(circle at 98% 82%, rgba(255,47,134,.18) 0 92px, transparent 94px),
    linear-gradient(180deg,#fffaf1 0%,#fffdf9 100%);
}
.hero-home-mockup:before,
.hero-home-mockup:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.hero-home-mockup:before{
  z-index:0;
  background-image:url("../img/hero-home-banner.jpg");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.hero-home-mockup:after{
  z-index:1;
  background:
    linear-gradient(90deg,rgba(255,250,241,.96) 0%,rgba(255,250,241,.9) 26%,rgba(255,250,241,.36) 48%,rgba(255,250,241,.18) 68%,rgba(255,250,241,.58) 100%);
}
.hero-home-mockup .container{
  width:min(1120px,calc(100% - 48px));
}
.hero-home-mockup .hero-grid{
  grid-template-columns:minmax(380px,540px) minmax(260px,1fr) 258px;
  min-height:360px;
  padding:22px 0;
  gap:18px;
  position:relative;
  z-index:3;
}
.hero-home-mockup .bubble,
.hero-home-mockup .note{
  z-index:2;
}
.hero-home-mockup .hero-copy,
.hero-home-mockup .hero-art,
.hero-home-mockup .reassurance-card{
  position:relative;
  z-index:3;
}
.hero-home-mockup h1{
  max-width:590px;
  font-size:clamp(40px,4vw,56px);
  letter-spacing:0;
}
.hero-home-mockup h1 .hero-title-keep{
  display:inline;
  color:inherit;
  white-space:nowrap;
}
.hero-home-mockup .hero-lead{
  max-width:480px;
}
.hero-home-mockup .hero-art{
  height:100%;
  min-height:0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:visible;
}
.hero-visual-picture{
  display:none;
}
.hero-home-mockup .hero-player{
  position:absolute;
  left:50%;
  right:auto;
  bottom:18px;
  z-index:2;
  width:min(430px,94%);
  margin:0;
  transform:translateX(-50%);
  background:rgba(255,255,255,.94);
  border:1px solid rgba(238,219,246,.88);
  backdrop-filter:blur(10px);
}
.hero-home-mockup .reassurance-card{
  align-self:center;
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
}

@media (max-width:1050px){
  .hero-home-mockup:before{
    background-position:58% center;
  }
  .hero-home-mockup:after{
    background:linear-gradient(180deg,rgba(255,250,241,.92) 0%,rgba(255,250,241,.58) 46%,rgba(255,250,241,.9) 100%);
  }
  .hero-home-mockup .hero-grid{
    grid-template-columns:1fr;
    min-height:auto;
    padding:30px 0;
  }
  .hero-home-mockup .hero-art{
    width:min(640px,100%);
    height:96px;
    margin:auto;
  }
  .hero-home-mockup .reassurance-card{
    width:min(640px,100%);
    margin:auto;
  }
}
@media (max-width:640px){
  .hero-home-mockup .container{
    width:min(100% - 24px,1180px);
  }
  .hero-home-mockup h1{
    font-size:36px;
  }
  .hero-home-mockup .hero-art{
    height:88px;
  }
  .hero-home-mockup .hero-player{
    width:96%;
    font-size:12px;
  }
  .hero-home-mockup .hero-player span{
    display:none;
  }
}
@media (max-width:400px){
  .hero-home-mockup h1 .hero-title-keep{
    white-space:normal;
  }
}

/* --- Onglets de categories a 10 entrees --- */
.category-tabs{
  grid-template-columns:repeat(10,minmax(0,1fr));
}
.category-tabs a{
  min-height:118px;
  padding:13px 10px;
}
.category-tabs strong{
  font-size:13px;
  line-height:1.18;
}
.category-tabs span{
  font-size:34px;
}
@media (max-width:1050px){
  .category-tabs{
    grid-template-columns:repeat(3,1fr);
  }
}
@media (max-width:640px){
  .category-tabs{
    grid-template-columns:1fr;
  }
}

/* --- Formulaire type machansonanniversaire.be --- */
.generator-box-form{
  grid-template-columns:.9fr 1.1fr;
}
.generator-benefits{
  list-style:none;
  margin:18px 0 0;
  padding:0;
  display:grid;
  gap:10px;
}
.generator-benefits li{
  position:relative;
  padding-left:24px;
  color:#3f336d;
  font-weight:800;
}
.generator-benefits li:before{
  content:'✓';
  position:absolute;
  left:0;
  color:var(--pink);
  font-weight:1000;
}
.order-form{
  background:#fff;
  border:1px solid #f0dce6;
  border-radius:24px;
  box-shadow:0 12px 38px rgba(64,28,92,.08);
  padding:24px;
  display:grid;
  gap:15px;
}
.order-form .form-row{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.order-form .form-row.two-cols{
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.order-form label{
  font-weight:900;
  color:var(--ink);
}
.order-form input,
.order-form select,
.order-form textarea{
  width:100%;
  border:1px solid #ead6e3;
  border-radius:14px;
  padding:13px 14px;
  font:inherit;
  color:var(--ink);
  background:#fffdfc;
}
.order-form textarea{
  min-height:120px;
  resize:vertical;
}
.order-form input:focus,
.order-form select:focus,
.order-form textarea:focus{
  outline:0;
  border-color:var(--pink);
  box-shadow:0 0 0 4px rgba(255,47,134,.12);
}
.personalization-tip{
  display:grid;
  gap:4px;
  background:#fff8ee;
  border:1px solid #ffe1b5;
  border-radius:16px;
  padding:14px;
  color:#5b3b15;
}
.personalization-tip span{
  color:#6e5c42;
  font-size:14px;
}
.hp-field{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.form-note.is-loading{
  background:#fff8e5;
  color:#7a4b00;
  border-color:#ffe29a;
}
.form-note.is-success{
  background:#e9fff1;
  color:#126b32;
  border-color:#b7f0ca;
}
.form-note.is-error{
  background:#fff0f0;
  color:#8a1522;
  border-color:#ffc6ce;
}
.lyrics-result{
  display:grid;
  gap:14px;
  background:linear-gradient(135deg,#fff8ee,#fff0f7);
  border:1px solid #f1d7e5;
  border-radius:22px;
  padding:18px;
}
.lyrics-result[hidden]{
  display:none;
}
.lyrics-result-header{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  font-weight:900;
}
.lyrics-result-header span{
  color:var(--pink);
}
.lyrics-result #paroles{
  min-height:260px;
  line-height:1.55;
  white-space:pre-wrap;
}
.lyrics-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.lyrics-actions .btn{
  flex:1 1 220px;
}

/* --- Extraits de paroles sur les pages categories --- */
.info-card.lyric-lines-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#fff,#fff8ed);
}
.info-card.lyric-lines-card:before{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  right:-70px;
  top:-70px;
  border-radius:50%;
  background:rgba(255,47,134,.09);
}
.info-card.lyric-lines-card h2{
  position:relative;
  margin-bottom:18px;
}
.lyric-lines{
  position:relative;
  display:grid;
  gap:12px;
}
.lyric-lines p{
  margin:0;
  padding:16px 18px 16px 46px;
  border:1px solid #f0dce6;
  border-radius:18px;
  background:white;
  color:#2d1b69;
  font-weight:800;
  line-height:1.42;
  box-shadow:0 10px 24px rgba(64,28,92,.06);
  position:relative;
}
.lyric-lines p:before{
  content:"♪";
  position:absolute;
  left:16px;
  top:15px;
  width:22px;
  height:22px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#fff0f7;
  color:var(--pink);
  font-weight:1000;
}
.lyric-lines p:nth-child(2):before{
  background:#f3edff;
  color:var(--purple);
}
.lyric-lines p:nth-child(3):before{
  background:#fff4df;
  color:#d88600;
}
@media (max-width:1050px){
  .generator-box-form{
    grid-template-columns:1fr;
  }
}
@media (max-width:640px){
  .order-form{
    padding:18px;
    border-radius:20px;
  }
  .order-form .form-row.two-cols{
    grid-template-columns:1fr;
  }
  .lyrics-result-header{
    display:grid;
  }
}

/* --- Footer sur une seule ligne en desktop --- */
.site-footer .footer-grid{
  grid-template-columns:minmax(220px,1.45fr) repeat(4,minmax(120px,1fr));
  gap:24px;
  align-items:start;
}
.site-footer .footer-grid > div{
  min-width:0;
}
.site-footer .footer-grid h3{
  margin-top:0;
}
@media (max-width:1050px){
  .site-footer .footer-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .site-footer .footer-grid > div:first-child{
    grid-column:1 / -1;
  }
}
@media (max-width:640px){
  .site-footer .footer-grid{
    grid-template-columns:1fr;
  }
  .site-footer .footer-grid > div:first-child{
    grid-column:auto;
  }
}

/* --- Pages legales --- */
.legal-content{
  display:block;
}
.legal-content h2{
  margin:26px 0 10px;
  font-size:24px;
}
.legal-content h2:first-child{
  margin-top:0;
}
.legal-content p{
  color:#44346f;
  line-height:1.72;
}
.legal-content ul{
  margin:10px 0 22px;
  padding-left:22px;
  color:#44346f;
  line-height:1.7;
}
.legal-content a{
  color:var(--pink);
  font-weight:800;
}