/* Pages éditoriales : philosophie, blog, conseils, FAQ, contact. */

/* ══ Philosophie ══ */
/* ─── Philosophie page (public) ─────────────────────────── */
#view-philosophy { background:var(--bg1); min-height:60vh; }
.phil-page { max-width:1100px; margin:0 auto; padding:4rem 2.5rem; }
.phil-page-title { font-family:var(--serif); font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:300; letter-spacing:.06em; text-align:center; margin-bottom:.6rem; color:var(--text); }
.phil-page-sub { text-align:center; font-size:.85rem; color:var(--text-dim); letter-spacing:.08em; text-transform:uppercase; margin-bottom:3.5rem; }
.phil-rule { width:44px; height:1px; background:var(--accent); margin:.8rem auto 2.5rem; opacity:.7; }
.phil-block { display:flex; gap:3.5rem; align-items:center; margin-bottom:4rem; }
.phil-block.reverse { flex-direction:row-reverse; }
.phil-block-img { flex:0 0 38%; max-width:420px; border-radius:var(--r2); overflow:hidden; }
.phil-block-img img { width:100%; height:320px; object-fit:cover; display:block; }
.phil-block-text { flex:1; }
.phil-block-title { font-family:var(--serif); font-size:1.25rem; font-weight:300; letter-spacing:.04em; color:var(--accent2); margin-bottom:1rem; }
.phil-block-body { font-size:.88rem; line-height:2; color:var(--text-mid); white-space:pre-wrap; }
.phil-back { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-dim); cursor:pointer; margin-bottom:2.5rem; transition:color var(--t); }
.phil-back:hover { color:var(--accent); }
@media(max-width:700px) { .phil-block, .phil-block.reverse { flex-direction:column; } .phil-block-img { max-width:100%; flex:none; width:100%; } }

/* ══ Blog ══ */
/* ─── Blog page (public) ─────────────────────────────────── */
#view-blog { background:var(--bg1); min-height:60vh; }
.blog-page { max-width:860px; margin:0 auto; padding:4rem 2.5rem; }
.blog-page-title { font-family:var(--serif); font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:300; letter-spacing:.06em; text-align:center; margin-bottom:.6rem; }
.blog-rule { width:44px; height:1px; background:var(--accent); margin:.8rem auto 3rem; opacity:.7; }
.blog-post { background:var(--bg2); border:1px solid var(--border); border-radius:var(--r2); padding:2.2rem 2.5rem; margin-bottom:2.5rem; }
.blog-post-meta { display:flex; align-items:baseline; gap:1rem; margin-bottom:1.2rem; }
.blog-post-title { font-family:var(--serif); font-size:1.3rem; font-weight:300; letter-spacing:.03em; color:var(--text); }
.blog-post-date { font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); opacity:.8; white-space:nowrap; }
.blog-post-body { font-size:.88rem; line-height:2; color:var(--text-mid); white-space:pre-wrap; margin-bottom:1.4rem; }
.blog-post-images { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:.7rem; margin-top:1.2rem; }
.blog-post-images img { width:100%; height:160px; object-fit:cover; border-radius:var(--r); cursor:pointer; transition:opacity var(--t); }
.blog-post-images img:hover { opacity:.85; }
.blog-back { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-dim); cursor:pointer; margin-bottom:2.5rem; transition:color var(--t); }
.blog-back:hover { color:var(--accent); }

/* ══ Conseils ══ */
/* ─── Conseils page (public) ────────────────────────────── */
#view-conseils { background:var(--bg1); min-height:60vh; }
.cons-page { max-width:860px; margin:0 auto; padding:4rem 2.5rem; }
.cons-page-title { font-family:var(--serif); font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:300; letter-spacing:.06em; text-align:center; margin-bottom:.6rem; }
.cons-rule { width:44px; height:1px; background:var(--accent); margin:.8rem auto 3rem; opacity:.7; }
.cons-back { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-dim); cursor:pointer; margin-bottom:2.5rem; transition:color var(--t); }
.cons-back:hover { color:var(--accent); }
.cons-card { background:var(--bg2); border:1px solid var(--border); border-radius:var(--r2); margin-bottom:2.5rem; display:flex; align-items:stretch; overflow:hidden; }
.cons-card--even { flex-direction:row-reverse; }
.cons-text-wrap { flex:1; padding:2.2rem 2.5rem; min-width:0; }
.cons-img-side { width:55%; min-width:220px; max-width:560px; flex-shrink:0; display:flex; flex-direction:column; gap:3px; }
.cons-img-side img { width:100%; height:auto; display:block; cursor:pointer; transition:opacity var(--t); }
.cons-img-side img:hover { opacity:.85; }
@media(max-width:640px) { .cons-card, .cons-card--even { flex-direction:column !important; } .cons-img-side { width:100%; max-width:none; min-width:0; } }
.cons-num { font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; color:var(--accent); opacity:.7; margin-bottom:.5rem; }
.cons-title { font-family:var(--serif); font-size:1.3rem; font-weight:300; letter-spacing:.03em; color:var(--text); margin-bottom:1.2rem; }
.cons-body { font-size:.88rem; line-height:2; color:var(--text-mid); white-space:pre-wrap; margin-bottom:.8rem; }
.cons-images { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:.7rem; margin-top:1.2rem; }
.cons-images img { width:100%; height:160px; object-fit:cover; border-radius:var(--r); cursor:pointer; transition:opacity var(--t); }
.cons-images img:hover { opacity:.85; }
.cons-gamma-wrap { margin-top:1.4rem; border-radius:var(--r); overflow:hidden; border:1px solid var(--border); }
.cons-gamma-wrap iframe { width:100%; height:400px; border:none; display:block; }

/* ══ FAQ ══ */
/* ─── FAQ page (public) ──────────────────────────────────── */
#view-faq { background:var(--bg1); min-height:60vh; }
.faq-page { max-width:760px; margin:0 auto; padding:4rem 2.5rem; }
.faq-page-title { font-family:var(--serif); font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:300; letter-spacing:.06em; text-align:center; margin-bottom:.6rem; }
.faq-rule { width:44px; height:1px; background:var(--accent); margin:.8rem auto 3rem; opacity:.7; }
.faq-item { border:1px solid var(--border); border-radius:var(--r2); margin-bottom:.8rem; overflow:hidden; background:var(--bg2); }
.faq-question { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.1rem 1.4rem; cursor:pointer; user-select:none; transition:background var(--t); }
.faq-question:hover { background:var(--bg3); }
.faq-question-text { font-family:var(--serif); font-size:.98rem; font-weight:400; letter-spacing:.02em; color:var(--text); }
.faq-arrow { flex-shrink:0; width:18px; height:18px; color:var(--accent); transition:transform .3s ease; }
.faq-item.open .faq-arrow { transform:rotate(180deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .35s ease, padding .35s ease; padding:0 1.4rem; }
.faq-item.open .faq-answer { max-height:800px; padding:.2rem 1.4rem 1.2rem; }
.faq-answer-body { font-size:.87rem; line-height:2; color:var(--text-mid); white-space:pre-wrap; border-top:1px solid var(--border); padding-top:.9rem; }
.faq-back { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-dim); cursor:pointer; margin-bottom:2.5rem; transition:color var(--t); }
.faq-back:hover { color:var(--accent); }

/* ══ Contact ══ */
/* ─── Contact page ───────────────────────────────────────── */
#view-contact { background:var(--bg1); min-height:60vh; }
.contact-page { max-width:860px; margin:0 auto; padding:4rem 2.5rem; }
.contact-page-title { font-family:var(--serif); font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:300; letter-spacing:.06em; text-align:center; margin-bottom:.6rem; }
.contact-rule { width:44px; height:1px; background:var(--accent); margin:.8rem auto 3rem; opacity:.7; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-bottom:3.5rem; }
@media(max-width:600px) { .contact-grid { grid-template-columns:1fr; } }
.contact-card { background:var(--bg2); border:1px solid var(--border); border-radius:var(--r2); padding:1.8rem 2rem; }
.contact-card-role { font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:.7rem; }
.contact-card-name { font-family:var(--serif); font-size:1.1rem; font-weight:300; color:var(--text); margin-bottom:.9rem; }
.contact-card-line { font-size:.84rem; color:var(--text-mid); line-height:1.9; display:flex; align-items:baseline; gap:.4rem; }
.contact-card-line a { color:var(--accent); text-decoration:none; }
.contact-card-line a:hover { text-decoration:underline; }
.contact-form-wrap { background:var(--bg2); border:1px solid var(--border); border-radius:var(--r2); padding:2rem 2.5rem; }
.contact-form-title { font-family:var(--serif); font-size:1.15rem; font-weight:300; letter-spacing:.04em; margin-bottom:1.5rem; color:var(--text); }
.contact-back { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-dim); cursor:pointer; margin-bottom:2.5rem; transition:color var(--t); }
.contact-back:hover { color:var(--accent); }

/* ══ FAQ — pièces jointes ══ */
/* ─── FAQ pièces jointes ─────────────────────────────────── */
.faq-attach-grid { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:.5rem; }
.faq-attach-item { position:relative; }
.faq-attach-item img  { width:80px; height:65px; object-fit:cover; border-radius:var(--r); display:block; border:1px solid var(--border); }
.faq-attach-pdf-badge { width:80px; height:65px; border-radius:var(--r); border:1px solid var(--border); background:var(--bg3); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.25rem; font-size:.6rem; color:var(--text-dim); letter-spacing:.04em; text-transform:uppercase; }
.faq-attach-pdf-badge svg { color:var(--accent); }
.faq-attach-remove { position:absolute; top:-6px; right:-6px; background:var(--error); color:var(--on-error); border:none; border-radius:50%; width:18px; height:18px; font-size:.65rem; cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1; }
/* public */
.faq-answer-attachments { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.8rem; }
.faq-attach-img-pub { width:120px; height:90px; object-fit:cover; border-radius:var(--r); cursor:pointer; border:1px solid var(--border); transition:opacity var(--t); }
.faq-attach-img-pub:hover { opacity:.8; }
.faq-attach-pdf-pub { display:inline-flex; align-items:center; gap:.35rem; font-size:.78rem; color:var(--accent); text-decoration:underline; padding:.3rem .6rem; border:1px solid var(--border); border-radius:var(--r); background:var(--bg3); transition:background var(--t); }
.faq-attach-pdf-pub:hover { background:var(--bg2); }
.faq-item.open .faq-answer { max-height:4000px; padding:.2rem 1.4rem 1.2rem; }
