:root{--bg:#f4f1eb;--surface:rgba(255,255,255,.68);--text:#292824;--soft:#514e48;--muted:#77736b;--line:#d8d2c8;--ink:#28363a;--art:#b46f45;--est:#d49a35;--lecture:#527f98;--sent:#a85f6a;--green:#7b9367}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}
.site-header{width:min(1380px,calc(100% - 64px));margin:auto;padding:20px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:30px}.brand{display:flex;flex-direction:column}.brand small,.eyebrow{font-size:.66rem;letter-spacing:.18em;font-weight:700;color:var(--muted)}.brand span{font:1.2rem Georgia,serif}.brand em,h2 em{font-style:italic}.nav,.site-header nav{display:flex;gap:26px;font-size:.78rem;color:var(--soft)}

/* --- ESPACEMENTS RÉDUITS ENTRE LES BLOCS --- */
.hero{width:min(1380px,calc(100% - 64px));min-height:auto;margin:auto;padding:50px 0 65px;display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:50px}.hero h1{font:400 clamp(3rem,5.5vw,5.5rem)/.97 Georgia,serif;letter-spacing:-.045em;margin:12px 0 20px}.hero h1 i{color:var(--lecture)}.lead{max-width:650px;font-size:1.02rem;color:var(--soft)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.btn{padding:10px 18px;border:1px solid var(--line);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.btn.dark{background:var(--ink);color:white;border-color:var(--ink)}.note{display:flex;gap:18px;max-width:470px;margin-top:30px;padding-top:12px;border-top:1px solid var(--line);font:.95rem Georgia,serif}.note b{font:700 .7rem Inter;color:var(--muted)}

.phone-area{height:540px;position:relative}.phone{position:absolute;width:260px;height:520px;padding:9px;border-radius:36px;background:#252727;box-shadow:0 20px 50px #0002}.phone.back{top:15px;right:55px;transform:rotate(7deg);opacity:.8}.phone.front{z-index:2;top:40px;right:160px;transform:rotate(-5deg)}.screen{height:100%;border-radius:27px;padding:30px 18px;background:#e8e5dc}.screen small{font-size:.58rem;letter-spacing:.16em;color:var(--muted);font-weight:700}.abstract{display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(150deg,#b8d7d3,#ead9bf)}.abstract strong{font:2rem/1 Georgia,serif}.photo-demo{height:185px;margin:12px 0;background:linear-gradient(#91c5c4 0 53%,#d5c09c 53%)}.screen h3{font:1.25rem Georgia,serif;margin:0}.screen p{font-size:.65rem;line-height:1.4;color:var(--soft)}.score{display:flex;justify-content:space-between;border-top:1px solid #28363a22;padding:5px 0;font-size:.62rem}.score b{color:var(--lecture)}.notch{position:absolute;z-index:3;top:15px;left:50%;width:75px;height:18px;transform:translateX(-50%);border-radius:20px;background:#252727}

/* --- SECTION PADDING COMPACT --- */
.section{width:min(1380px,calc(100% - 64px));margin:auto;padding:65px 0;border-top:1px solid var(--line)}h2{font:400 clamp(2.2rem,3.5vw,3.8rem)/1.03 Georgia,serif;letter-spacing:-.035em;margin:8px 0 16px}.intro{color:var(--muted)}

/* --- ICÔNES ET BADGES COLORÉS --- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}.cards article{padding:28px;background:var(--surface);border:1px solid var(--line);min-height:230px}.cards .art{border-top:4px solid var(--art)}.cards .aesthetic{border-top:4px solid var(--est)}.cards .emotion{border-top:4px solid var(--sent)}

.icon-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  font-size: 1.2rem;
  margin-bottom: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.cards .art .icon-badge { background: linear-gradient(135deg, #fceade, #f5c6ad); color: var(--art); }
.cards .aesthetic .icon-badge { background: linear-gradient(135deg, #fef4df, #f3d699); color: #b87c12; }
.cards .emotion .icon-badge { background: linear-gradient(135deg, #faeaea, #efb8b8); color: var(--sent); }

.principles article .icon-badge { background: linear-gradient(135deg, rgba(255,255,255,0.15), rgba(255,255,255,0.05)); color: #76d0c7; }
.audience-cards .num-badge { background: linear-gradient(135deg, #e3ede8, #c4ded2); color: #2e624c; font-weight: 700; font-size: 0.9rem; }

.cards h3,.features h3,.timeline h3,.principles h3{font:400 1.35rem Georgia,serif}.cards p,.features p,.timeline p,.principles p{font-size:.85rem;color:var(--soft)}

.features{display:grid;grid-template-columns:1fr 1fr;margin-top:30px;border-top:1px solid var(--line)}.features article{display:grid;grid-template-columns:40px 1fr;gap:15px;padding:22px 25px 22px 0;border-bottom:1px solid var(--line)}.features article:nth-child(even){padding-left:25px;border-left:1px solid var(--line)}.features article>b{font-size:.7rem;color:var(--muted);letter-spacing:.12em}.features h3{margin:0 0 5px;font-size:1.15rem}.features p{margin:0}

.ai{background:var(--ink);color:#f5f1e9}.ai .section{border:0;padding:65px 0}.ai .eyebrow{color:#b9c9c7}.ai-text{max-width:680px;color:#cbd2d0}.pipeline{display:grid;grid-template-columns:1fr 35px 1fr 35px 1fr 35px 1fr;align-items:center;margin-top:40px}.pipeline strong{display:block;font:1.2rem Georgia,serif}.pipeline b{color:#76d0c7;font-size:.7rem}.pipeline p{color:#bdc8c5;font-size:.75rem}.pipeline i{height:1px;background:#fff3}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}.principles article{border:1px solid #fff2;padding:22px;border-radius:8px}.principles h3{margin-top:10px;color:#fff}.principles p{color:#c2cbc9}

.center{text-align:center}.timeline{display:grid;grid-template-columns:repeat(5,1fr);margin-top:35px;border-top:1px solid var(--line)}.timeline>div{padding:22px 18px 25px 0;border-bottom:1px solid var(--line)}.timeline>div+div{padding-left:18px;border-left:1px solid var(--line)}.timeline b{font-size:.7rem;color:var(--muted)}.timeline h3{margin-top:25px}.audience-cards article{min-height:190px}.audience-cards h3{margin-top:20px}

.cta{max-width:1180px;margin:auto;padding:75px 30px;text-align:center;border-top:1px solid var(--line)}.cta>p:not(.eyebrow){max-width:650px;margin:auto;color:var(--muted)}.stores{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:25px}.stores a{background:var(--ink);color:white;padding:10px 18px;min-width:175px;text-align:left;font-size:.58rem;letter-spacing:.08em}.stores strong{font:1.1rem Georgia,serif}

footer{padding:25px max(32px,calc((100vw - 1380px)/2));border-top:1px solid var(--line);background:#eeeae2}.footer-top,.footer-bottom{display:flex;justify-content:space-between;gap:25px;align-items:center}.footer-top>a{font:1.1rem Georgia,serif}.footer-top div{display:flex;gap:22px;align-items:center;font-size:.7rem}.footer-top div a:nth-last-child(-n+2){font-size:1.2rem}.footer-bottom{border-top:1px solid var(--line);margin-top:15px;padding-top:12px;color:var(--muted);font-size:.63rem;letter-spacing:.05em}

@media(max-width:980px){.site-header nav{display:none}.hero{grid-template-columns:1fr}.phone-area{max-width:620px;width:100%;margin:auto}.cards,.principles{grid-template-columns:1fr}.features{grid-template-columns:1fr}.features article:nth-child(even){padding-left:0;border-left:0}.pipeline{grid-template-columns:1fr;gap:18px}.pipeline i{display:none}.timeline{grid-template-columns:1fr}.timeline>div+div{padding-left:0;border-left:0}.timeline h3{margin-top:15px}}
@media(max-width:620px){.site-header,.hero,.section{width:calc(100% - 34px)}.hero{padding:40px 0 50px}.hero h1{font-size:clamp(2.6rem,12vw,4rem)}.phone-area{transform:scale(.75);transform-origin:center top;height:430px;margin-bottom:-60px}.phone.front{right:50%;transform:translateX(20%) rotate(-5deg)}.phone.back{right:0}.section{padding:50px 0}.features article{padding:20px 0}.footer-top,.footer-bottom{flex-direction:column;align-items:flex-start}.footer-top div{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* --- FOOTER STYLING --- */
.site-footer {
  background-color: var(--card, #f9f9f9); /* S'adapte à votre variable de fond de carte ou clair */
  border-top: 1px solid var(--line);
  padding: 60px 5% 30px 5%;
  color: var(--ink);
  font-size: 0.9rem;
}

.footer-container {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr;
  gap: 40px;
  margin-bottom: 40px;
  align-items: start; /* <--- C'est cette ligne qu'il faut ajouter pour aligner tout le monde en haut */
}

.footer-col h4 {
  font: 500 1rem Georgia, serif;
  margin-bottom: 16px;
  color: var(--ink);
  letter-spacing: 0.5px;
}

.footer-brand {
  font-family: Georgia, serif;
  font-size: 1.15rem;
  font-weight: bold;
  text-decoration: none;
  color: var(--ink);
  display: block;
  margin-bottom: 8px;
}

.footer-tagline {
  color: var(--soft);
  font-size: 0.85rem;
  line-height: 1.5;
}

.footer-col a:not(.footer-brand) {
  display: block;
  color: var(--soft);
  text-decoration: none;
  margin-bottom: 10px;
  transition: color 0.2s ease;
}

.footer-col a:not(.footer-brand):hover {
  color: var(--ink);
}

/* SOCIAL ICONE */

.social-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 40px;
}

.social-title {
  font-size: 16px;
  font-weight: 700;
  color: #94A3B8;
}

.social-links {
  display: flex;
  gap: 16px;
}

.social-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.2s ease;
}

.social-btn svg {
  width: 20px;
  height: 20px;
}

.social-btn:hover {
  background: var(--accent-purple);
  transform: translateY(-3px);
}



/* Footer bottom bar */
.footer-bottom {
  max-width: 1200px;
  margin: 0 auto;
  padding-top: 25px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--soft);
  font-size: 0.8rem;
}

/* --- RESPONSIVE MOBILE --- */
@media (max-width: 768px) {
  .site-footer {
    padding: 40px 20px 20px 20px;
  }
  
  .footer-container {
    grid-template-columns: 1fr; /* Passage en colonne unique sur mobile */
    gap: 30px;
  }

  .footer-bottom {
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }
}