/* Direction visuelle des maquettes Qui Garde Bébé ? */
html:not([data-theme="dark"]) {
  --bg: #faf6ef;
  --card: #fffcf7;
  --ink: #183125;
  --ink-2: #435449;
  --mute: #58665c;
  --line: #dedbd0;
  --night: #173b2b;
  --night-2: #e8ebda;
  --violet: #a84225;
  --violet-2: #963b23;
  --violet-tint: #f8e6da;
  --sage: #668455;
  --sage-2: #315b40;
  --sage-tint: #e9eddd;
  --blush: linear-gradient(125deg, #f7eddf, #e9eddd);
  --lime: #f1e5b4;
  --mint-tint: #e9eddd;
  --r: 20px;
}

html:not([data-theme="dark"]) body,
html:not([data-theme="dark"]) .page-main { background: var(--bg); color: var(--ink); }
html:not([data-theme="dark"]) body > header {
  background: var(--card);
  color: var(--ink);
  border-bottom: 1px solid var(--line);
}
html:not([data-theme="dark"]) .nav a { color: var(--ink); }
html:not([data-theme="dark"]) .nav a:hover,
html:not([data-theme="dark"]) .nav a[aria-current="page"] { background: var(--sage-tint); }
html:not([data-theme="dark"]) .nav a.cta,
html:not([data-theme="dark"]) .btn2:not(.ghost) { color: #fff; background: var(--sage-2); }
html:not([data-theme="dark"]) .btn2.ghost { color: var(--ink); background: var(--card); }
html:not([data-theme="dark"]) body > footer {
  background: #173b2b;
  border-top: 0;
  color: #fdf7ec;
}
html:not([data-theme="dark"]) footer :is(h2,h3,h4,p,a,small,li,.fcopy,.fbrand,.fabout,.ia-note) {
  color: inherit;
}
html:not([data-theme="dark"]) footer .f-indep {
  background: #e9eddd;
  color: #183125;
}
html:not([data-theme="dark"]) :is(.page-hero,.art-hero) {
  background: var(--blush);
  color: var(--ink);
}
:is(.page-hero,.art-hero).qgb-photo-hero { padding: clamp(20px, 3.6vw, 48px) 0; }
.qgb-photo-hero.has-ill .ph-grid {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: clamp(20px, 4vw, 64px);
  align-items: center;
}
.qgb-photo-hero .ph-img {
  width: 100%;
  max-width: none;
  max-height: none;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 24px;
  margin: 0;
  animation: none;
}
.qgb-photo-hero .ph-txt { padding: 10px 0; }
.qgb-photo-hero h1 { text-wrap: pretty; }
.qgb-home-photo {
  position: relative;
  display: grid;
  align-items: center;
  isolation: isolate;
  min-height: clamp(440px, 40vw, 630px);
  padding: 36px 0;
}
.qgb-home-photo > .wrap { width: 100%; }
.qgb-home-photo::before,
.qgb-home-photo > .qgb-banner {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.qgb-home-photo > .qgb-banner { object-fit: cover; object-position: 70% center; }
.qgb-home-photo::before {
  content: "";
  z-index: 0;
  background: linear-gradient(90deg, #15291ee0, #15291ea6 44%, transparent 76%);
  pointer-events: none;
}
.qgb-home-photo .ht-grid { position: relative; grid-template-columns: minmax(0, 1fr); }
.qgb-home-photo .ht-grid > div { max-width: 570px; }
.intro.qgb-home-photo h1,
.intro.qgb-home-photo .lead,
.intro.qgb-home-photo .trust { color: #fff; }
.qgb-home-photo .trust span { color: inherit; }
.qgb-home-photo h1 { max-width: 19ch; }
.qgb-home-photo .btn2:not(.ghost) { border: 1px solid #f6f3e7; }
.qgb-card-photo {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2.45 / 1;
  object-fit: cover;
  border-radius: 14px;
}
.qgb-catalog .tool:has(.qgb-card-photo) { position: relative; }
.qgb-catalog .tool .new { z-index: 1; }
.qgb-catalog .tool .qgb-card-photo { margin-bottom: 10px; }
.qgb-catalog .g-img img.qgb-editorial-thumb { object-fit: cover; width: 100%; height: 100%; }
html:not([data-theme="dark"]) .qgb-catalog :is(.tool,.guide,.lcard) {
  border: 1px solid var(--line);
  background: var(--card);
}
@media (max-width: 680px) {
  .qgb-photo-hero.has-ill .ph-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .qgb-photo-hero .ph-img { order: 0; aspect-ratio: 2 / 1; }
  .qgb-home-photo { min-height: 520px; }
  .qgb-home-photo::before { background: linear-gradient(0deg, #15291ef5, #15291ea6 61%, #15291e15); }
  .qgb-home-photo > .qgb-banner { object-position: 72% center; }
  .qgb-home-photo .ht-grid { padding-top: 70px; }
}
@media print {
  .qgb-banner, .qgb-card-photo, .qgb-photo-hero .ph-img { display: none !important; }
  .qgb-home-photo { min-height: 0; }
  .qgb-home-photo::before { content: none; }
  .intro.qgb-home-photo :is(h1,.lead,.trust) { color: #000; }
}

.qgb-faq-topics,
.qgb-pro-grid {
  display: grid;
  gap: 12px;
  margin: 22px 0 30px;
}
.qgb-faq-topics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.qgb-faq-topics a,
.qgb-pro-group {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
}
.qgb-faq-topics a {
  display: flex;
  align-items: center;
  min-height: 54px;
  padding: 10px 16px;
  font-weight: 700;
  text-decoration: none;
}
.qgb-faq-topics a:hover { background: var(--sage-tint); color: var(--sage-2); }
.fq-g[id] { scroll-margin-top: 90px; }
.qgb-pro-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
.qgb-pro-group { overflow: hidden; }
.qgb-pro-group > h3 { padding: 18px; background: var(--sage-tint); color: var(--sage-2); }
.qgb-pro-group > .tool { border-radius: 0; box-shadow: none; }
.qgb-pro-group > .tool:hover { transform: none; }
.qgb-catalog .tool .tool-new { z-index: 1; }

/* Lisibilité et interactions — révision éditoriale */
.qgb-catalog .guides { gap:24px; }
.qgb-catalog .guide { border:1px solid var(--line); border-radius:20px; box-shadow:none; overflow:hidden; }
.qgb-catalog .guide .g-img { height:auto; aspect-ratio:3/2; border-radius:18px 18px 0 0; }
.qgb-catalog .guide .g-img img { object-position:center; }
.qgb-catalog .guide h3 { line-height:1.3; letter-spacing:-.025em; }
.qgb-catalog .guide p { line-height:1.6; }
.qgb-catalog .guide .more { margin-top:auto; padding-top:8px; }
html :is(a,button,input,select,textarea):focus-visible { outline:3px solid #a84225; outline-offset:4px; }
html .btn2 { min-height:46px; }
#creches #map { background:#e9eddd; position:relative; }
.qgb-map-status { position:absolute; z-index:800; left:14px; right:14px; bottom:34px; padding:14px 18px; border-radius:12px; background:#fffcf7; color:#183125; box-shadow:0 4px 20px #18312520; font:500 14px/1.5 sans-serif; }
.qgb-map-status[hidden] { display:none; }
#creches .qgb-directions { display:block; width:fit-content; margin-top:10px; padding:8px 0; color:#315b40; font-weight:700; text-underline-offset:4px; }
#creches .cr:focus-visible { outline:3px solid #a84225; outline-offset:-3px; }
#creches .list { scrollbar-gutter:stable; overscroll-behavior:contain; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .qgb-catalog .guide, .qgb-catalog .tool { transition:transform 180ms ease, box-shadow 180ms ease; }
  .qgb-catalog .guide:hover, .qgb-catalog .tool:hover { transform:translateY(-3px); box-shadow:0 10px 24px #18312512; }
}
@media (max-width:860px) {
  #creches .geo { gap:16px; }
  #creches #map { height:340px; }
  #creches .list { max-height:none; height:auto; overflow:visible; }
  #creches .search { gap:10px; flex-wrap:wrap; }
  #creches .search input, #creches .search select { min-width:0; max-width:100%; }
  .qgb-catalog .guides { gap:18px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto !important; }
  *, *::before, *::after { animation:none !important; transition:none !important; }
}
