/* Bandeau de suggestion de langue (voir langHint dans build.mjs) */
.lang-hint { position: fixed; left: 50%; top: 88px; z-index: 60; display: flex; align-items: center; gap: 14px; max-width: calc(100% - 32px); padding: 10px 12px 10px 20px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 15px; transform: translateX(-50%); box-shadow: 0 10px 30px rgba(6,26,61,0.25); }
.lang-hint[hidden] { display: none; }
.lang-hint a { font-weight: 600; text-decoration: underline; white-space: nowrap; }
.lang-hint button { padding: 4px 8px; border: 0; background: none; color: inherit; font-size: 15px; cursor: pointer; opacity: 0.7; }
.lang-hint button:hover { opacity: 1; }
@media (max-width: 600px) { .lang-hint { flex-wrap: wrap; border-radius: 24px; } }

/* Pages secondaires */
.page-hero { padding: 170px 0 60px; text-align: center; }
.page-hero h1 { margin: 20px auto 0; max-width: 960px; font-size: clamp(38px, 6vw, 84px); }
.page-hero .lead { max-width: 640px; margin: 22px auto 0; }
.banner { position: relative; height: 460px; margin-top: 30px; border-radius: 32px; overflow: hidden; background: linear-gradient(#8fbbec, #d6e7f7 60%, #eaf3fb); }

/* Contact */
.contact { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; padding: 170px 0 90px; align-items: center; }
.contact h1 { font-size: clamp(38px, 5.6vw, 80px); }
.contact .lead { margin: 22px 0 26px; }
.form { position: relative; overflow: hidden; padding: 40px 40px 190px; border-radius: 32px; background: var(--soft); }
.form .g { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 30px; }
.form label { display: grid; gap: 10px; font-weight: 500; color: var(--muted); }
.form label.full { grid-column: 1 / -1; }
.form input, .form textarea { width: 100%; padding: 14px 18px; border: 1px solid var(--line); border-radius: 16px; background: #fff; outline: none; transition: border-color 0.2s, box-shadow 0.2s; }
.form input:focus, .form textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(59,130,246,0.18); }
.form textarea { min-height: 140px; resize: vertical; }
.form button { position: relative; z-index: 2; margin-top: 26px; padding: 16px 36px; border: 0; border-radius: 999px; background: var(--ink); color: #fff; font-weight: 600; font-size: 17px; cursor: pointer; transition: transform 0.3s var(--ease); }
.form button:hover { transform: translateY(-2px); }
.form .hills { z-index: 1; }

/* À propos */
.values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.val { padding: 34px; border-radius: 32px; background: var(--soft); transition: transform 0.5s var(--ease); }
.val:hover { transform: translateY(-6px); }
.val .n { display: block; margin-bottom: 40px; font-size: 14px; font-weight: 600; color: var(--blue-2); }
.val p { margin-top: 8px; color: var(--muted); }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.split h2 { margin: 16px 0 20px; }
.split p + p { margin-top: 14px; }

/* Fonctionnalités */
.feat { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; padding: 50px 0; }
.feat:nth-child(even) .ft { order: 2; }
.feat h2, .feat .h2 { font-size: clamp(28px, 3.6vw, 44px); margin: 14px 0 16px; }
.feat .vis { display: grid; place-items: center; min-height: 340px; border-radius: 32px; background: var(--soft); font-size: 88px; overflow: hidden; }
.feat .vis.blue { background: linear-gradient(#9cc3ee, #d9e9f8); }
.feat .vis.black { background: #000; }

/* FAQ page */
.faq-page { max-width: 860px; margin-inline: auto; }

/* Nouveautés */
.log { display: grid; gap: 70px; max-width: 800px; margin: 20px auto 0; }
.ver { position: relative; padding: 30px; border: 1px solid var(--line); border-radius: 32px; }
.ver .tabv { position: absolute; top: -22px; left: 46px; padding: 6px 22px; background: #fff; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
.ver .tabv small { margin-left: 10px; font-size: 15px; font-weight: 400; color: var(--muted); }
.ver .inner { padding: 30px; border-radius: 24px; background: var(--soft); }
.ver h3 { margin-bottom: 14px; }
.ver li { position: relative; padding: 5px 0 5px 22px; color: var(--muted); }
.ver li::before { content: "›"; position: absolute; left: 0; color: var(--green); font-weight: 700; }

/* 404 */
.e404 { padding: 150px 0 60px; }
.e404 .card { position: relative; overflow: hidden; padding: 90px 20px 210px; border-radius: 32px; background: var(--soft); text-align: center; }
.e404 .big { margin: 14px 0 0; font-size: clamp(110px, 20vw, 240px); font-weight: 700; letter-spacing: -0.06em; line-height: 0.95; }
.e404 h2 { font-size: clamp(30px, 4vw, 46px); }
.e404 p { margin: 12px 0 30px; color: var(--muted); }
.e404 .btn { position: relative; z-index: 2; }
.e404 .hills { z-index: 1; }

/* Documents légaux */
.doc { max-width: 860px; padding: 150px 0 20px; }
.doc h1 { margin: 16px 0 12px; font-size: clamp(34px, 5vw, 56px); }
.doc h2 { margin: 42px 0 12px; font-size: 24px; letter-spacing: -0.02em; }
.doc p { margin: 10px 0; color: var(--muted); }
.doc ul { margin: 10px 0 10px 20px; list-style: disc; color: var(--muted); }

/* Guides (articles, voir pages/guides/) : reprennent la mise en page .doc */
.doc.article { padding-bottom: 40px; }
.doc .lead { margin: 18px 0 8px; color: var(--ink); }
.doc time { font-size: 14px; }
.doc h3 { margin: 28px 0 8px; font-size: 19px; }
.doc ol { margin: 10px 0 10px 22px; list-style: decimal; color: var(--muted); }
.doc li { margin: 6px 0; }
.doc strong { color: var(--ink); }
.doc p a, .doc li a { color: var(--ink); text-decoration: underline; }
.doc table { width: 100%; margin: 18px 0; border-collapse: collapse; font-size: 15px; }
.doc th, .doc td { padding: 12px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.doc td { color: var(--muted); }
.doc .table-scroll { overflow-x: auto; }
.doc .cta-box { margin: 48px 0 10px; padding: 34px; border-radius: 32px; background: var(--soft); }
.doc .cta-box h2 { margin-top: 0; }
.doc .cta-box .btn { margin-top: 18px; }
.guide-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 30px; }
.guide-list a { display: block; padding: 28px; border-radius: 24px; background: var(--soft); transition: transform 0.4s var(--ease); }
.guide-list a:hover { transform: translateY(-4px); }
.guide-list h2 { margin: 0 0 8px; font-size: 21px; }
.guide-list p { margin: 0; }
@media (max-width: 700px) { .guide-list { grid-template-columns: 1fr; } .doc .cta-box { padding: 24px; } }
.final-foot { padding-top: 150px; background: linear-gradient(#fff, #cfe2f6 55%, #9cc3ee); }

@media (max-width: 900px) {
  .contact, .split, .feat, .values { grid-template-columns: 1fr; }
  .contact { padding-top: 130px; }
  .form { padding: 26px 22px 170px; } .form .g { grid-template-columns: 1fr; }
  .feat:nth-child(even) .ft { order: 0; }
  .banner { height: 300px; }
}
.e404 .big { color: var(--ink); }