/* ============================================================
   Souvenirs.photo — Galerie Pro (vitrine)
   Feuille de style autonome. DA crème & terracotta.
   Tailwind sert de base utilitaire ; ce fichier porte la DA
   et les composants spécifiques à la vitrine galerie.
   ============================================================ */

:root {
    --cream:      #faf6f0;
    --cream-deep: #f3ebe0;
    --sand:       #e9ddcc;
    --terra:      #c6603f;
    --terra-deep: #a84e30;
    --terra-soft: #e8a78b;
    --clay-bg:    #f6ede3;
    --ink:        #2b2018;
    --brown:      #5e4d3b;
    --brown-soft: #877256;
    --line:       #e6dac9;
    --white:      #ffffff;

    --serif: 'Fraunces', Georgia, serif;
    --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --radius: 18px;
    --shadow-sm: 0 1px 3px rgba(74,52,32,.06);
    --shadow:    0 18px 50px rgba(74,52,32,.12);
    --shadow-lg: 0 50px 90px rgba(74,52,32,.18);
    --maxw: 1240px;
}

/* Reset minimal scoped à la galerie (le body est partagé, on ne casse rien) */
.galerie-page { margin: 0; }
.galerie-page *, .galerie-page *::before, .galerie-page *::after { box-sizing: border-box; }
.galerie-page {
    font-family: var(--sans);
    color: var(--ink);
    background: var(--cream);
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    overflow-x: clip;
}
.galerie-page a { color: inherit; text-decoration: none; }
.galerie-page img { max-width: 100%; display: block; }
.galerie-page .container { max-width: var(--maxw); margin: 0 auto; padding: 0 28px; }

/* ===== Header minimal ===== */
.g-header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 50;
    padding: 18px 0;
    background: rgba(250,246,240,.85);
    backdrop-filter: saturate(180%) blur(16px);
    border-bottom: 1px solid transparent;
    transition: padding .3s, box-shadow .3s, border-color .3s, background .3s;
}
.g-header-inner {
    padding: 0 36px;
    display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px;
}
.g-header-inner .g-brand { justify-self: start; }
.g-header-inner .g-header-nav { justify-self: center; }
.g-header-inner .g-header-right { justify-self: end; }
.g-header.scrolled {
    padding: 12px 0;
    background: rgba(250,246,240,.95);
    border-bottom-color: var(--line);
    box-shadow: 0 6px 24px rgba(74,52,32,.06);
}
.g-brand {
    display: flex; align-items: center; gap: 11px;
    font-family: var(--serif); font-size: 22px; font-weight: 600; color: var(--ink);
    letter-spacing: -0.01em;
}
.g-brand-dot {
    width: 30px; height: 30px; border-radius: 50%;
    background: var(--terra); display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 13px;
}
.g-header-nav { display: flex; align-items: center; gap: 30px; }
.g-header-right { display: flex; align-items: center; gap: 22px; }
.g-header-link { font-size: 15px; font-weight: 500; color: var(--ink); transition: color .15s; }
.g-header-link:hover { color: var(--terra); }
.g-header-link-muted { color: var(--brown-soft); font-size: 14px; }

/* ===== Menu burger mobile ===== */
.g-burger {
    display: none; /* masqué en desktop, affiché en mobile via media query */
    flex-direction: column; justify-content: center; gap: 5px;
    width: 44px; height: 44px; padding: 0; margin-left: 4px;
    background: transparent; border: 0; cursor: pointer;
}
.g-burger span {
    display: block; width: 24px; height: 2px; margin: 0 auto;
    background: var(--ink); border-radius: 2px;
    transition: transform .25s ease, opacity .2s ease;
}
.g-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.g-burger.is-open span:nth-child(2) { opacity: 0; }
.g-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.g-mobile-menu {
    position: fixed; top: 0; left: 0; right: 0; z-index: 49;
    display: flex; flex-direction: column; gap: 4px;
    padding: 84px 22px 26px;
    background: rgba(250,246,240,.98);
    backdrop-filter: saturate(180%) blur(16px);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 12px 30px rgba(74,52,32,.10);
    transform: translateY(-14px); opacity: 0; visibility: hidden; pointer-events: none;
    transition: transform .26s ease, opacity .22s ease, visibility .26s;
}
.g-mobile-menu.is-open { transform: translateY(0); opacity: 1; visibility: visible; pointer-events: auto; }
.g-mobile-link {
    font-family: var(--serif); font-size: 20px; font-weight: 500; color: var(--ink);
    padding: 14px 6px; border-bottom: 1px solid var(--line);
}
.g-mobile-link:active { color: var(--terra); }
.g-mobile-link-cnx { color: var(--terra); font-weight: 600; }
.g-mobile-cta { margin-top: 16px; width: 100%; }
body.g-menu-open { overflow: hidden; }

/* ===== Boutons ===== */
.g-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 9px;
    font-family: var(--sans); font-size: 15px; font-weight: 600;
    padding: 12px 26px; border-radius: 100px; cursor: pointer;
    border: 1.5px solid transparent; transition: all .18s; white-space: nowrap;
    color: var(--ink); background: transparent; text-decoration: none;
}
/* Bouton plein terracotta → texte TOUJOURS blanc */
.g-btn-primary, .g-btn-primary:link, .g-btn-primary:visited { background: var(--terra); color: #fff; border-color: var(--terra); }
.g-btn-primary:hover { background: var(--terra-deep); border-color: var(--terra-deep); color: #fff; transform: translateY(-1px); box-shadow: var(--shadow); }
/* Bouton foncé → texte crème */
.g-btn-dark, .g-btn-dark:link, .g-btn-dark:visited { background: var(--ink); color: var(--cream); border-color: var(--ink); }
.g-btn-dark:hover { color: var(--cream); transform: translateY(-1px); box-shadow: var(--shadow); }
/* Bouton fantôme → texte sombre sur fond clair */
.g-btn-ghost { color: var(--ink); background: transparent; }
.g-btn-ghost:hover { color: var(--terra); }
/* Bouton contour → texte sombre, bordure */
.g-btn-outline { background: transparent; color: var(--ink); border-color: var(--sand); }
.g-btn-outline:hover { border-color: var(--terra); color: var(--terra); }
.g-btn-lg { padding: 17px 38px; font-size: 17px; }
.g-btn-xl { padding: 21px 50px; font-size: 18px; }
/* Bouton danger (suppression) */
.g-btn-danger, .g-btn-danger:link, .g-btn-danger:visited { background: transparent; color: #c0392b; border-color: #e3b3ab; }
.g-btn-danger:hover { background: #c0392b; color: #fff; border-color: #c0392b; }

/* ===== Hero plein écran avec mot animé ===== */
.g-hero {
    min-height: 100dvh; display: flex; align-items: center; position: relative;
    padding: 140px 0 90px;
}
.g-hero-inner { display: grid; grid-template-columns: 1.02fr 0.98fr; gap: 60px; align-items: center; width: 100%; }
.g-hero-inner > div:first-child { align-self: center; }
.g-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 13px; font-weight: 600; color: var(--terra-deep);
    background: var(--white); border: 1px solid var(--line);
    padding: 8px 16px; border-radius: 100px; margin-bottom: 26px;
    box-shadow: var(--shadow-sm);
}
.g-hero h1 {
    font-family: var(--serif); font-weight: 500;
    font-size: 56px; line-height: 1.05; letter-spacing: -0.025em;
    color: var(--ink); margin-bottom: 18px;
}
.g-hero h1 em { font-style: italic; color: var(--terra); }
/* Sous-titre avec mot animé */
.g-hero-sub { font-family: var(--serif); font-size: 23px; color: var(--brown); margin-bottom: 22px; font-weight: 400; }
.g-rotator { display: inline-block; position: relative; color: var(--terra); font-style: italic; font-weight: 500; min-width: 5.7em; text-align: left; }
.g-rotator-word { display: inline-block; transition: opacity .4s ease, transform .4s ease; }
.g-rotator-word.out { opacity: 0; transform: translateY(-8px); }
.g-rotator-word.in  { opacity: 1; transform: translateY(0); }
.g-hero-lead { font-size: 19px; color: var(--brown); max-width: 500px; margin-bottom: 36px; }
.g-hero-cta { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.g-hero-note { font-size: 14px; color: var(--brown-soft); margin-top: 22px; }
.g-hero-note strong { color: var(--brown); }

/* ===== Aperçu interactif : sélecteur de style de galerie ===== */
.g-hero-visual { position: relative; padding: 18px; }
.g-preview {
    background: var(--white); border: 1px solid var(--line); border-radius: 22px;
    box-shadow: var(--shadow-lg); overflow: hidden;
}
.g-preview-bar {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px; border-bottom: 1px solid var(--line); background: var(--cream-deep);
}
.g-preview-dots { display: flex; gap: 6px; }
.g-preview-dots i { width: 10px; height: 10px; border-radius: 50%; background: var(--sand); display: block; }
.g-preview-url { font-size: 12px; color: var(--brown-soft); font-weight: 500; }

/* Hauteur FIXE quel que soit le layout → plus de saut au changement d'onglet */
.g-preview-stage { padding: 18px; display: grid; gap: 10px; height: 380px; transition: opacity .25s; }
.g-pcell { border-radius: 11px; background: linear-gradient(150deg, var(--terra-soft), var(--terra)); position: relative; overflow: hidden; }
.g-pcell::after { content:''; position:absolute; inset:0; background: linear-gradient(160deg, rgba(255,255,255,.18), transparent 60%); }
.g-pcell:nth-child(2) { background: linear-gradient(150deg,#edd2bd,#cf9a72); }
.g-pcell:nth-child(3) { background: linear-gradient(150deg,#e0b095,#bd7a56); }
.g-pcell:nth-child(4) { background: linear-gradient(150deg,#e8c8ad,#c88f63); }
.g-pcell:nth-child(5) { background: linear-gradient(150deg,#dcae90,#b87a55); }
.g-pcell:nth-child(6) { background: linear-gradient(150deg,#e5c4a6,#c2855e); }

/* Layout "Carré" : grille régulière 1:1, 2 rangées */
.g-preview-stage[data-layout="grid"] { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); }

/* Layout "Aligné" : lignes paysage régulières, 3 rangées */
.g-preview-stage[data-layout="rows"] { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(3, 1fr); }

/* Layout "Adapté" : mosaïque, ratios variés mais hauteur totale identique */
.g-preview-stage[data-layout="masonry"] { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(6, 1fr); }
.g-preview-stage[data-layout="masonry"] .g-pcell:nth-child(1) { grid-row: span 4; }
.g-preview-stage[data-layout="masonry"] .g-pcell:nth-child(2) { grid-row: span 2; }
.g-preview-stage[data-layout="masonry"] .g-pcell:nth-child(3) { grid-row: span 3; }
.g-preview-stage[data-layout="masonry"] .g-pcell:nth-child(4) { grid-row: span 2; }
.g-preview-stage[data-layout="masonry"] .g-pcell:nth-child(5) { grid-row: span 4; }
.g-preview-stage[data-layout="masonry"] .g-pcell:nth-child(6) { grid-row: span 3; }

.g-float {
    position: absolute; background: #fff; border-radius: 14px; box-shadow: var(--shadow-lg);
    padding: 12px 16px; display: flex; align-items: center; gap: 10px;
    font-size: 13px; font-weight: 600; color: var(--ink);
}
.g-float .ic { width: 30px; height: 30px; border-radius: 9px; background: var(--clay-bg); color: var(--terra); display: flex; align-items: center; justify-content: center; font-size: 14px; }
.g-float.f1 { bottom: 6px; right: 6px; }

/* ===== Sélecteur de style (section dédiée, gros) ===== */
.g-styler-section { background: var(--clay-bg); }
.g-styler { max-width: 1040px; margin: 0 auto; }

/* Onglets layout — gros, avec mini-icône schématique */
.g-styler-tabs { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-bottom: 32px; }
.g-styler-tab {
    display: flex; flex-direction: column; align-items: center; gap: 10px;
    font-family: var(--sans); font-size: 15px; font-weight: 600; color: var(--brown);
    background: var(--white); border: 2px solid var(--line); border-radius: 16px;
    padding: 18px 26px; cursor: pointer; transition: all .2s; min-width: 110px;
}
.g-styler-tab:hover { border-color: var(--terra-soft); transform: translateY(-2px); }
.g-styler-tab.active { border-color: var(--terra); color: var(--terra); box-shadow: var(--shadow); }
/* Mini-icône schématique du layout */
.g-styler-ico { display: grid; gap: 3px; width: 34px; height: 26px; }
.g-styler-ico i { background: var(--sand); border-radius: 2px; display: block; }
.g-styler-tab.active .g-styler-ico i { background: var(--terra-soft); }
.g-styler-ico { grid-template-columns: 1fr 1fr; }                 /* Carré : 4 carrés */
.g-styler-ico.rows { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr 1fr; } /* Aligné : 3 bandes */
.g-styler-ico.mas { grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; }
.g-styler-ico.mas i:nth-child(1) { grid-row: span 2; }            /* Mosaïque */
.g-styler-ico.mag { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; }
.g-styler-ico.mag i:nth-child(1) { grid-row: span 2; }            /* Magazine : 1 grande + 2 */
.g-styler-ico.hero { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 2fr 1fr; }
.g-styler-ico.hero i:nth-child(1) { grid-column: span 3; }        /* Plein écran : 1 grande + bande */

/* Scène : hauteur fixe, fond commutable clair/sombre */
.g-styler-stage {
    --sgap: 10px; --sbg: var(--white);
    background: var(--sbg); border: 1px solid var(--line); border-radius: 20px;
    box-shadow: var(--shadow); padding: 22px; display: grid; gap: var(--sgap);
    height: 440px; transition: background .3s, gap .3s;
}
.g-styler-stage[data-bg="dark"] { --sbg: #241a13; border-color: #241a13; }
.g-styler-stage[data-gap="tight"]  { --sgap: 5px; }
.g-styler-stage[data-gap="normal"] { --sgap: 12px; }
.g-styler-stage[data-gap="wide"]   { --sgap: 22px; }

.g-scell { border-radius: 12px; overflow: hidden; position: relative; background: linear-gradient(150deg, var(--terra-soft), var(--terra)); }
.g-scell::after { content:''; position:absolute; inset:0; background: linear-gradient(160deg, rgba(255,255,255,.16), transparent 62%); }
.g-scell:nth-child(2) { background: linear-gradient(150deg,#edd2bd,#cf9a72); }
.g-scell:nth-child(3) { background: linear-gradient(150deg,#e0b095,#bd7a56); }
.g-scell:nth-child(4) { background: linear-gradient(150deg,#e8c8ad,#c88f63); }
.g-scell:nth-child(5) { background: linear-gradient(150deg,#dcae90,#b87a55); }
.g-scell:nth-child(6) { background: linear-gradient(150deg,#e5c4a6,#c2855e); }
.g-scell:nth-child(7) { background: linear-gradient(150deg,#e2b99c,#c5835d); }
.g-scell:nth-child(8) { background: linear-gradient(150deg,#ecd0b9,#caa078); }
.g-scell:nth-child(9) { background: linear-gradient(150deg,#ddb295,#ba7c58); }

/* Carré : grille 3x3 régulière */
.g-styler-stage[data-layout="grid"] { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); }

/* Aligné : 3 lignes justifiées (largeurs variables) */
.g-styler-stage[data-layout="rows"] { grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(3, 1fr); }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(1) { grid-column: span 2; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(2) { grid-column: span 3; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(3) { grid-column: span 1; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(4) { grid-column: span 3; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(5) { grid-column: span 1; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(6) { grid-column: span 2; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(7) { grid-column: span 1; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(8) { grid-column: span 2; }
.g-styler-stage[data-layout="rows"] .g-scell:nth-child(9) { grid-column: span 3; }

/* Mosaïque : briques verticales */
.g-styler-stage[data-layout="masonry"] { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(8, 1fr); }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(1) { grid-row: span 3; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(2) { grid-row: span 2; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(3) { grid-row: span 3; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(4) { grid-row: span 3; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(5) { grid-row: span 3; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(6) { grid-row: span 2; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(7) { grid-row: span 2; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(8) { grid-row: span 3; }
.g-styler-stage[data-layout="masonry"] .g-scell:nth-child(9) { grid-row: span 3; }

/* Magazine : 1 photo phare + remplissage éditorial */
.g-styler-stage[data-layout="magazine"] { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 1fr); }
.g-styler-stage[data-layout="magazine"] .g-scell:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.g-styler-stage[data-layout="magazine"] .g-scell:nth-child(6) { grid-column: span 2; }
.g-styler-stage[data-layout="magazine"] .g-scell:nth-child(9) { grid-column: span 2; }

/* Plein écran : 1 photo dominante + bande de vignettes */
.g-styler-stage[data-layout="hero"] { grid-template-columns: repeat(5, 1fr); grid-template-rows: 3fr 1fr; }
.g-styler-stage[data-layout="hero"] .g-scell:nth-child(1) { grid-column: 1 / -1; }
.g-styler-stage[data-layout="hero"] .g-scell:nth-child(n+7) { display: none; }

/* Options secondaires (ambiance, espacement) */
.g-styler-options { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.g-styler-opt-label { font-size: 14px; font-weight: 600; color: var(--brown); }
.g-styler-toggle { display: inline-flex; background: var(--white); border: 1px solid var(--line); border-radius: 100px; padding: 4px; gap: 2px; }
.g-styler-toggle button {
    font-family: var(--sans); font-size: 13px; font-weight: 600; color: var(--brown);
    border: none; background: transparent; padding: 8px 16px; border-radius: 100px;
    cursor: pointer; transition: all .18s;
}
.g-styler-toggle button:hover { color: var(--terra); }
.g-styler-toggle button.active { background: var(--terra); color: #fff; }

/* ===== Chips séances (élégant, sobre) ===== */
.g-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; max-width: 820px; margin: 0 auto; }
.g-chip {
    font-family: var(--serif); font-size: 19px; font-style: italic; color: var(--brown);
    background: var(--white); border: 1px solid var(--line);
    padding: 11px 24px; border-radius: 100px; transition: all .2s; cursor: default;
    box-shadow: var(--shadow-sm);
}
.g-chip:hover { color: #fff; background: var(--terra); border-color: var(--terra); transform: translateY(-2px); }

/* ===== Sections ===== */
.g-section { padding: 100px 0; }
.g-section-head { max-width: 660px; margin: 0 auto 60px; text-align: center; }
.g-section-head .g-eyebrow { margin-bottom: 18px; }
.g-section-head h2 { font-family: var(--serif); font-weight: 500; font-size: 44px; line-height: 1.1; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 16px; }
.g-section-head h2 em { font-style: italic; color: var(--terra); }
.g-section-head p { font-size: 18px; color: var(--brown); }

/* Features — disposition alternée, pas la grille 3 col du scolaire */
.g-feature-row { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; margin-bottom: 110px; }
.g-feature-row:last-child { margin-bottom: 0; }
.g-feature-row.reverse .g-feature-text { order: 2; }
.g-feature-num { font-family: var(--serif); font-size: 15px; color: var(--terra); font-weight: 600; letter-spacing: .04em; margin-bottom: 14px; display: block; }
.g-feature-text h3 { font-family: var(--serif); font-weight: 500; font-size: 32px; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 16px; line-height: 1.15; }
.g-feature-text p { font-size: 17px; color: var(--brown); }
.g-feature-visual {
    aspect-ratio: 5/4; border-radius: 22px; box-shadow: var(--shadow); overflow: hidden;
    display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.5); font-size: 64px;
}
.g-fv1 { background: linear-gradient(150deg,#e0b49a,#c07d5b); }
.g-fv2 { background: linear-gradient(150deg,#e8cdb4,#caa078); }
.g-fv3 { background: linear-gradient(150deg,#d9a98c,#b87a5a); }

.g-seances-bg { background: var(--clay-bg); }

/* Pricing */
.g-pricing { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; max-width: 1000px; margin: 0 auto; }
.g-plan { background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 36px 30px; position: relative; box-shadow: var(--shadow-sm); }
.g-plan.featured { border-color: var(--terra); box-shadow: var(--shadow); transform: scale(1.04); }
.g-plan-tag { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); background: var(--terra); color: #fff; font-size: 12px; font-weight: 600; padding: 6px 16px; border-radius: 100px; white-space: nowrap; }
.g-plan h3 { font-size: 18px; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
.g-plan .price { font-family: var(--serif); font-size: 44px; color: var(--ink); margin: 12px 0 4px; }
.g-plan .price small { font-family: var(--sans); font-size: 15px; color: var(--brown-soft); font-weight: 500; }
.g-plan .price-desc { font-size: 14px; color: var(--brown-soft); margin-bottom: 24px; }
.g-plan ul { list-style: none; margin-bottom: 28px; padding: 0; }
.g-plan li { font-size: 14px; color: var(--brown); padding: 9px 0; display: flex; gap: 11px; }
.g-plan li::before { content: '✓'; color: var(--terra); font-weight: 700; }
.g-plan .g-btn { width: 100%; }

/* FAQ */
.g-faq { max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
.g-faq-item { background: #fff; border: 1px solid var(--line); border-radius: 16px; transition: border-color .2s, box-shadow .25s; }
.g-faq-item.is-open { border-color: var(--terra-soft); box-shadow: 0 14px 36px -18px rgba(74,52,32,.28); }
.g-faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 21px 26px; background: none; border: 0; cursor: pointer; text-align: left; font-family: var(--serif); font-size: 18px; font-weight: 500; color: var(--ink); transition: color .15s; }
.g-faq-q:hover { color: var(--terra); }
.g-faq-icon { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: var(--clay-bg); color: var(--ink); display: flex; align-items: center; justify-content: center; transition: transform .3s ease, background .25s, color .25s; }
.g-faq-item.is-open .g-faq-icon { background: var(--terra); color: #fff; transform: rotate(180deg); }
.g-faq-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s ease; }
.g-faq-item.is-open .g-faq-a { grid-template-rows: 1fr; }
.g-faq-a-inner { overflow: hidden; min-height: 0; }
.g-faq-a-inner p { padding: 2px 26px 24px; font-size: 15px; line-height: 1.65; color: var(--brown); margin: 0; }

/* CTA final */
.g-cta-final { background: linear-gradient(140deg, var(--terra), var(--terra-deep)); border-radius: 28px; padding: 76px 40px; text-align: center; color: #fff; position: relative; overflow: hidden; }
.g-cta-final::before { content:'◍'; position:absolute; font-size: 380px; opacity:.06; top:-90px; right:-40px; line-height:1; }
.g-cta-final h2 { font-family: var(--serif); font-weight: 500; font-size: 46px; letter-spacing: -0.02em; margin-bottom: 16px; position: relative; }
.g-cta-final p { font-size: 19px; color: rgba(255,255,255,.88); max-width: 500px; margin: 0 auto 32px; position: relative; }

/* ===== Footer ===== */
.g-footer { background: var(--ink); color: #cdbfae; padding: 64px 0 38px; }
.g-footer-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; padding-bottom: 44px; border-bottom: 1px solid rgba(255,255,255,.09); flex-wrap: wrap; }
.g-footer-big { font-family: var(--serif); font-weight: 500; font-size: 38px; color: #fff; letter-spacing: -0.02em; max-width: 480px; line-height: 1.15; }
.g-footer-big em { font-style: italic; color: var(--terra-soft); }
.g-footer-links { display: flex; gap: 40px; flex-wrap: wrap; }
.g-footer-links a { font-size: 15px; color: #cdbfae; transition: color .15s; }
.g-footer-links a:hover { color: #fff; }
.g-footer-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 28px; font-size: 13px; color: #a08e7c; flex-wrap: wrap; gap: 12px; }

/* ===== Responsive ===== */
@media (max-width: 860px) {
    .g-hero-inner, .g-feature-row, .g-feature-row.reverse .g-feature-text { grid-template-columns: 1fr; gap: 44px; }
    .g-feature-row.reverse .g-feature-text { order: 0; }
    .g-hero h1 { font-size: 40px; }
    .g-pricing { grid-template-columns: 1fr; }
    .g-chip { font-size: 16px; padding: 9px 18px; }
    .g-styler-tab { min-width: 0; flex: 1 1 40%; padding: 14px 12px; font-size: 13px; }
    .g-styler-stage { height: 320px; padding: 14px; }
    .g-plan.featured { transform: none; }
    .g-section-head h2 { font-size: 32px; }
    .g-hero-visual { max-width: 440px; margin: 0 auto; }
    .g-footer-big { font-size: 28px; }

    /* CTA final : évite que le gros bouton déborde et soit coupé */
    .g-cta-final { padding: 54px 22px; border-radius: 22px; }
    .g-cta-final h2 { font-size: 34px; }
    .g-cta-final p { font-size: 17px; }
    .g-cta-final::before { font-size: 240px; top: -50px; right: -30px; }
    .g-btn-xl { padding: 18px 24px; font-size: 16px; }
    /* Sécurité : aucun bouton ne dépasse la largeur de l'écran, le texte peut passer sur 2 lignes */
    .g-btn { max-width: 100%; white-space: normal; }
}
@media (max-width: 1000px) {
    .g-header-nav { display: none; }
}
/* Très petits écrans (≤ 380px) : on met le hero visuel à l'échelle */
@media (max-width: 380px) {
    .g-hero h1 { font-size: 33px; }
    .g-hero-sub { font-size: 20px; }
    .g-hero-visual { max-width: 100%; padding: 10px; }
    .g-preview-stage { height: 300px; }
}
/* Mobile : la nav, le lien Connexion et le bouton passent dans le menu burger */
@media (max-width: 860px) {
    .g-header-inner { grid-template-columns: 1fr auto; }
    .g-header-right .g-header-link,
    .g-header-right .g-btn-primary { display: none; }
    .g-burger { display: flex; }
}
@media (max-width: 760px) {
    .g-header { padding: 14px 0; }
    .g-header-inner { padding: 0 20px; }
}

/* ===== Pages simples (auth, recherche, contact, intérieures) ===== */
.g-page { padding: 150px 0 90px; min-height: 70vh; }
.g-page-narrow { max-width: 540px; margin: 0 auto; }
.g-page-head { text-align: center; margin-bottom: 40px; }
.g-page-head .g-eyebrow { margin-bottom: 16px; }
.g-page-head h1 { font-family: var(--serif); font-weight: 500; font-size: 42px; letter-spacing: -0.02em; color: var(--ink); line-height: 1.1; margin-bottom: 14px; }
.g-page-head h1 em { font-style: italic; color: var(--terra); }
.g-page-head p { font-size: 18px; color: var(--brown); }

/* Alertes formulaire */
.g-alert { border-radius: 12px; padding: 13px 16px; font-size: 14px; margin-bottom: 18px; }
.g-alert-error { background: #fdecea; border: 1px solid #f5c6c0; color: #a8341f; }
.g-alert-success { background: #eaf6ec; border: 1px solid #bfe3c6; color: #2e6b3a; }

/* Carte formulaire */
.g-card { background: var(--white); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); padding: 40px; }
.g-field { margin-bottom: 18px; }
.g-field label { display: block; font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 7px; }
.g-input {
    width: 100%; font-family: var(--sans); font-size: 15px; color: var(--ink);
    background: var(--cream); border: 1.5px solid var(--line); border-radius: 12px;
    padding: 13px 16px; transition: border-color .18s, background .18s;
}
.g-input::placeholder { color: var(--brown-soft); }
.g-input:focus { outline: none; border-color: var(--terra); background: #fff; }
.g-input-error { border-color: #c0392b; background: #fdecea; }
.g-field-row { display: flex; gap: 14px; }
.g-field-row .g-field { flex: 1; }
.g-form-foot { font-size: 14px; color: var(--brown); text-align: center; margin-top: 20px; }
.g-form-foot a { color: var(--terra); font-weight: 600; }
.g-form-aside { font-size: 13px; color: var(--brown-soft); margin-top: 8px; }
.g-divider { display: flex; align-items: center; gap: 14px; margin: 24px 0; color: var(--brown-soft); font-size: 13px; }
.g-divider::before, .g-divider::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.g-checkbox { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: var(--brown); }
.g-checkbox input { margin-top: 3px; accent-color: var(--terra); }

/* Recherche d'album */
.g-search-box { display: flex; gap: 10px; }
.g-search-box .g-input { flex: 1; }
.g-search-help { background: var(--clay-bg); border-radius: 16px; padding: 22px 24px; margin-top: 28px; }
.g-search-help h4 { font-size: 15px; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
.g-search-help p { font-size: 14px; color: var(--brown); }

/* Exemples */
.g-examples-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.g-example {
    border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm);
    background: var(--white); border: 1px solid var(--line); transition: transform .2s, box-shadow .2s;
}
.g-example:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.g-example-cover { aspect-ratio: 4/3; position: relative; }
.g-example-meta { padding: 16px 18px; }
.g-example-meta h3 { font-family: var(--serif); font-size: 19px; font-weight: 500; color: var(--ink); margin-bottom: 3px; }
.g-example-meta span { font-size: 13px; color: var(--brown-soft); }

/* Labo */
.g-labo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 10px; }
.g-labo-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 30px 26px; box-shadow: var(--shadow-sm); }
.g-labo-ic { width: 50px; height: 50px; border-radius: 14px; background: var(--clay-bg); color: var(--terra); display: flex; align-items: center; justify-content: center; font-size: 21px; margin-bottom: 18px; }
.g-labo-card h3 { font-size: 18px; font-weight: 600; color: var(--ink); margin-bottom: 9px; }
.g-labo-card p { font-size: 15px; color: var(--brown); }

@media (max-width: 860px) {
    .g-examples-grid, .g-labo-grid { grid-template-columns: 1fr; }
    .g-page { padding: 120px 0 70px; }
    .g-page-head h1 { font-size: 32px; }
    .g-card { padding: 28px 22px; }
    .g-field-row { flex-direction: column; gap: 0; }
}

/* ============================================================
   ESPACE PHOTOGRAPHE (dashboard) — layout sidebar
   ============================================================ */
.g-espace { display: flex; min-height: 100vh; background: var(--cream); }

.g-side {
    width: 264px; flex-shrink: 0; background: var(--white); border-right: 1px solid var(--line);
    display: flex; flex-direction: column; padding: 24px 18px; position: sticky; top: 0; height: 100vh;
}
.g-side-brand { font-family: var(--serif); font-size: 19px; font-weight: 600; color: var(--ink); display: flex; align-items: center; gap: 9px; margin-bottom: 22px; padding: 0 8px; }

/* Carte profil photographe */
.g-side-me { display: flex; align-items: center; gap: 11px; padding: 11px 12px; margin-bottom: 0; text-decoration:none; background: linear-gradient(135deg, var(--cream) 0%, var(--clay-bg) 100%); border: 1px solid var(--line); border-radius: 14px; }
.g-side-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: none; display: flex; align-items: center; justify-content: center; background: var(--white); box-shadow: 0 1px 3px rgba(43,32,24,.08); }
.g-side-avatar--initials { background: linear-gradient(140deg, var(--terra-soft), var(--terra)); color: #fff; font-family: var(--serif); font-weight: 600; font-size: 17px; }
.g-side-me-txt { min-width: 0; line-height: 1.25; }
.g-side-me-txt strong { display: block; font-size: 14px; color: var(--ink); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-side-me-txt span { font-size: 12px; color: var(--brown-soft); }
.g-side-me:hover { border-color: var(--terra-soft); }
.g-side-me.is-active { border-color: var(--terra); }

.g-side-nav { display: flex; flex-direction: column; gap: 3px; flex: 1; }
.g-side-label { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--brown-soft); padding: 0 12px; margin: 16px 0 7px; }
.g-side-label:first-child { margin-top: 0; }
.g-side-link { position: relative; display: flex; align-items: center; gap: 11px; font-size: 14.5px; font-weight: 500; color: var(--brown); padding: 10px 13px; border-radius: 11px; transition: background .15s, color .15s; }
.g-side-link svg { flex: none; opacity: .65; transition: opacity .15s; }
.g-side-link:hover { background: var(--clay-bg); color: var(--ink); }
.g-side-link:hover svg { opacity: 1; }
.g-side-link.active { background: var(--clay-bg); color: var(--terra); font-weight: 600; }
.g-side-link.active svg { opacity: 1; color: var(--terra); }

.g-side-foot { display: flex; flex-direction: column; gap: 12px; padding-top: 18px; margin-top: 10px; border-top: 1px solid var(--line); }
.g-side-cta { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; }
.g-side-plan { margin-bottom:22px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 13px; border:1px solid var(--line); border-radius:11px; font-size:13px; color:var(--brown); background:var(--cream); transition:border-color .15s; }
.g-side-plan:hover { border-color:var(--terra-soft); }
.g-side-plan strong { color:var(--ink); }
.g-side-plan-up { color:var(--terra); font-weight:700; white-space:nowrap; }

/* Badge d'offre (plan) */
.g-plan-badge { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:700; padding:6px 14px; border-radius:100px; text-decoration:none; margin-bottom:12px; letter-spacing:.02em; transition:opacity .15s; }
.g-plan-badge:hover { opacity:.82; }
.g-plan-decouverte { background:var(--cream-deep); color:var(--brown); }
.g-plan-pro { background:var(--clay-bg); color:var(--terra); }
.g-plan-prestige { background:linear-gradient(135deg, var(--terra), var(--terra-deep)); color:#fff; }
.g-side-plan.g-plan-pro, .g-side-plan.g-plan-prestige { border:none; }
.g-side-plan.g-plan-prestige, .g-side-plan.g-plan-prestige strong, .g-side-plan.g-plan-prestige span { color:#fff !important; }
.g-side-logout { font-size: 13.5px; color: var(--brown-soft); text-align: center; transition: color .15s; }
.g-side-logout:hover { color: var(--terra); }

.g-main { flex: 1; padding: 44px 56px; min-width: 0; }
.g-espace-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 38px; flex-wrap: wrap; }
.g-espace-head h1 { font-family: var(--serif); font-weight: 500; font-size: 36px; letter-spacing: -0.02em; color: var(--ink); }
.g-espace-head p { font-size: 16px; color: var(--brown); margin-top: 4px; }

/* Stats */
.g-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 52px; }
.g-stat { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 26px 28px; }
.g-stat-label { display: block; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--brown-soft); margin-bottom: 14px; }
.g-stat-val { display: block; font-family: var(--serif); font-size: 38px; color: var(--ink); line-height: 1; margin-bottom: 10px; }
.g-stat-sub { font-size: 13px; color: var(--brown-soft); }
.g-stat-bar { display: block; height: 5px; margin-top: 8px; border-radius: 99px; background: rgba(0,0,0,.07); overflow: hidden; }
.g-stat-bar-fill { display: block; height: 100%; border-radius: 99px; background: var(--brown, #8a6d4b); transition: width .3s; }
.g-stat-bar-fill.is-danger { background: #d64545; }
.g-stat-pct { font-weight: 600; }
.g-stat-danger, .g-stat-danger .g-stat-pct { color: #d64545; }
/* Tooltip au survol (affiche les Mo) */
.g-tip { position: relative; cursor: help; }
.g-tip::after {
    content: attr(data-tip);
    position: absolute; left: 0; bottom: calc(100% + 6px);
    background: #2b2b2b; color: #fff; font-size: 12px; font-weight: 500;
    padding: 5px 9px; border-radius: 6px; white-space: nowrap;
    opacity: 0; visibility: hidden; transform: translateY(4px); transition: .15s; z-index: 20;
    pointer-events: none; box-shadow: 0 4px 14px rgba(0,0,0,.18);
}
.g-tip:hover::after { opacity: 1; visibility: visible; transform: translateY(0); }

.g-espace-section { margin-top: 16px; }
.g-section-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }
.g-section-link { font-size: 14px; font-weight: 600; color: var(--terra); transition: color .15s; white-space: nowrap; }
.g-section-link:hover { color: var(--terra-deep); }

/* ---- Filtres + recherche sur la page Mes galeries ---- */
.g-gal-filters { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; background: var(--white); border: 1px solid var(--line); border-radius: 13px; padding: 12px 14px; }
.g-filter-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.g-filter-tab { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 600; color: var(--brown); padding: 8px 14px; border-radius: 10px; border: 1.5px solid var(--line); transition: all .15s; }
.g-filter-tab:hover { border-color: var(--terra-soft); color: var(--ink); }
.g-filter-tab.is-active { background: var(--clay-bg); border-color: var(--terra); color: var(--terra); }
.g-filter-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; font-size: 12px; font-weight: 700; border-radius: 999px; background: var(--cream-deep); color: var(--brown-soft); }
.g-filter-tab.is-active .g-filter-count { background: var(--terra); color: #fff; }
.g-gal-search { position: relative; display: flex; align-items: center; }
.g-gal-search > svg { position: absolute; left: 13px; color: var(--brown-soft); pointer-events: none; }
.g-gal-search .g-input { padding-left: 38px; padding-right: 32px; min-width: 240px; height: 40px; }
.g-gal-search-clear { position: absolute; right: 12px; font-size: 20px; line-height: 1; color: var(--brown-soft); text-decoration: none; }
.g-gal-search-clear:hover { color: var(--terra); }

/* ---- Pagination ---- */
.g-pagination { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 32px; flex-wrap: wrap; }
.g-page-nums { display: flex; gap: 4px; }
.g-page-btn { font-size: 14px; font-weight: 600; color: var(--brown); padding: 8px 14px; border-radius: 10px; border: 1.5px solid var(--line); transition: all .15s; }
.g-page-btn:hover { border-color: var(--terra-soft); color: var(--terra); }
.g-page-btn.is-disabled { opacity: .4; pointer-events: none; }
.g-page-num { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; font-size: 14px; font-weight: 600; color: var(--brown); border-radius: 10px; transition: all .15s; }
.g-page-num:hover { background: var(--clay-bg); color: var(--terra); }
.g-page-num.is-active { background: var(--terra); color: #fff; }

/* État vide réduit (aucun résultat de filtre) */
.g-empty-sm { padding: 40px 20px; }
.g-empty-sm h3 { margin-bottom: 6px; }
.g-espace-section h2 { font-family: var(--serif); font-weight: 500; font-size: 26px; color: var(--ink); }

/* État vide */
.g-empty { text-align: center; background: var(--white); border: 1px dashed var(--sand); border-radius: 20px; padding: 64px 30px; }
.g-empty svg { margin: 0 auto 18px; display: block; }
.g-empty-ic { font-size: 44px; margin-bottom: 16px; }
.g-empty h3 { font-family: var(--serif); font-weight: 500; font-size: 22px; color: var(--ink); margin-bottom: 8px; }
.g-empty p { font-size: 15px; color: var(--brown); margin-bottom: 24px; }

/* Grille galeries */
.g-gal-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
.g-gal-card { background: var(--white); border: 1px solid var(--line); border-radius: 13px; overflow: hidden; transition: transform .2s, box-shadow .2s; }
.g-gal-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.g-gal-cover { aspect-ratio: 4/3; position: relative; background: var(--clay-bg); }
.g-gal-cover img { width: 100%; height: 100%; object-fit: cover; }
.g-gal-cover-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--brown-soft); font-size: 14px; }
.g-gal-badge { position: absolute; top: 9px; left: 9px; font-size: 10px; font-weight: 600; padding: 4px 9px; border-radius: 100px; background: #fff; }
.g-gal-badge-publiee { background: #eaf6ec; color: #2e6b3a; }
.g-gal-badge-brouillon { background: var(--clay-bg); color: var(--brown); }
.g-gal-badge-archivee { background: #f1ece6; color: var(--brown-soft); }
.g-gal-meta { padding: 11px 13px; }
.g-gal-meta h3 { font-family: var(--serif); font-size: 15px; font-weight: 500; color: var(--ink); margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-gal-meta span { font-size: 12px; color: var(--brown-soft); }

/* Formulaire large (création) */
.g-form-wide { display: flex; flex-direction: column; gap: 22px; max-width: 760px; }
.g-card-title { font-family: var(--serif); font-weight: 500; font-size: 20px; color: var(--ink); margin-bottom: 20px; }

/* ===== Wizard (création en étapes) ===== */
.g-steps { display: flex; align-items: center; gap: 12px; max-width: 680px; margin: 0 0 36px; }
.g-step { display: flex; align-items: center; gap: 12px; }
.g-step-num {
    width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 15px; border: 2px solid var(--line);
    color: var(--brown-soft); background: var(--white); transition: all .2s;
}
.g-step-label { font-size: 14px; font-weight: 600; color: var(--brown-soft); white-space: nowrap; transition: color .2s; }
.g-step.active .g-step-num { border-color: var(--terra); background: var(--terra); color: #fff; }
.g-step.active .g-step-label { color: var(--ink); }
.g-step.done .g-step-num { border-color: var(--terra); background: var(--clay-bg); color: var(--terra); }
.g-step.done .g-step-label { color: var(--brown); }
.g-step.done { cursor: pointer; }
.g-step-line { flex: 1; height: 2px; background: var(--line); min-width: 24px; }

/* Choix de durée — état actif via :has (pas de dépendance JS) */
.g-duree-choices { display: flex; gap: 12px; flex-wrap: wrap; }
.g-duree-choice { border: 1.5px solid var(--line); border-radius: 12px; padding: 13px 22px; cursor: pointer; font-size: 15px; font-weight: 600; color: var(--brown); transition: all .15s; }
.g-duree-choice:hover { border-color: var(--terra-soft); }
.g-duree-choice:has(input:checked) { border-color: var(--terra); color: var(--terra); background: var(--clay-bg); }
.g-duree-choice:focus-within { outline: 2px solid var(--terra); outline-offset: 2px; }
.g-duree-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.g-duree-choice em { font-style: normal; font-weight: 500; color: var(--brown-soft); font-size: 13px; }
.g-duree-choice:has(input:checked) em { color: var(--terra); }

/* Wizard — pleine page (largeur confortable, pas 100% brut pour la lisibilité) */
.g-wizard { max-width: 1080px; }
.g-wizard-panel { display: none; gap: 22px; }
.g-wizard-panel.active { display: flex; flex-direction: column; animation: gFade .25s ease; }
/* Étape 2 : 3 cartes sur 2 colonnes pour exploiter la largeur */
.g-wizard-panel[data-panel="1"].active,
.g-wizard-panel[data-panel="2"].active,
.g-wizard-panel[data-panel="3"].active,
.g-wizard-panel[data-panel="5"].active { display: grid; grid-template-columns: 1fr 1fr; align-items: start; }
.g-wizard-panel[data-panel="1"] .g-wizard-nav,
.g-wizard-panel[data-panel="2"] .g-wizard-nav,
.g-wizard-panel[data-panel="3"] .g-wizard-nav,
.g-wizard-panel[data-panel="5"] .g-wizard-nav { grid-column: 1 / -1; }
/* Carte d'aide latérale du wizard */
.g-wizard-aside { background: var(--clay-bg); border: 1px solid var(--terra-soft); border-radius: 18px; padding: 26px; }
.g-wizard-aside h3 { font-family: var(--serif); font-weight: 500; font-size: 18px; color: var(--ink); margin: 0 0 12px; }
.g-wizard-aside ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 11px; }
.g-wizard-aside li { display: flex; gap: 9px; font-size: 13.5px; color: var(--brown); line-height: 1.5; }
.g-wizard-aside li svg { flex: none; color: var(--terra); margin-top: 2px; }
.g-tip-ic { display: inline-flex; vertical-align: middle; margin-left: 5px; color: var(--brown-soft); cursor: help; }
.g-tip-ic:hover { color: var(--terra); }
@keyframes gFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.g-wizard-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.g-dropzone.drag { border-color: var(--terra); background: var(--clay-bg); }

@media (max-width: 860px) {
    .g-wizard-panel[data-panel="1"].active,
    .g-wizard-panel[data-panel="2"].active,
    .g-wizard-panel[data-panel="3"].active,
    .g-wizard-panel[data-panel="5"].active { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .g-step-label { display: none; }
    .g-steps { gap: 8px; }
    .g-gal-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 1180px) and (min-width: 901px) {
    .g-gal-grid { grid-template-columns: repeat(4, 1fr); }
}
.g-input[type="date"], select.g-input { cursor: pointer; }
select.g-input { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='%23877256' d='M6 8 0 0h12z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; }

/* Radio cards */
.g-radio-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.g-radio-cards.g-radio-stack { grid-template-columns: 1fr; }
.g-radio-card { display: flex; gap: 11px; align-items: flex-start; border: 1.5px solid var(--line); border-radius: 12px; padding: 14px 16px; cursor: pointer; transition: border-color .15s; }
.g-radio-card:has(input:checked) { border-color: var(--terra); background: var(--clay-bg); }
.g-radio-card input { margin-top: 3px; accent-color: var(--terra); }
.g-radio-card strong { display: block; font-size: 15px; color: var(--ink); margin-bottom: 2px; }
.g-radio-card small { font-size: 13px; color: var(--brown-soft); }

/* Choix de layout — état actif via :has, input masqué mais focusable */
.g-layout-choices { display: flex; flex-wrap: wrap; gap: 12px; }
.g-layout-choice { display: flex; flex-direction: column; align-items: center; gap: 9px; border: 1.5px solid var(--line); border-radius: 14px; padding: 16px 20px; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--brown); transition: all .15s; min-width: 88px; flex: 1; }
.g-layout-choice:hover { border-color: var(--terra-soft); }
.g-layout-choice:has(input:checked) { border-color: var(--terra); color: var(--terra); }
.g-layout-choice:focus-within { outline: 2px solid var(--terra); outline-offset: 2px; }
.g-layout-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.g-layout-choice .g-styler-ico { width: 30px; height: 24px; }
.g-layout-choice:has(input:checked) .g-styler-ico i { background: var(--terra-soft); }

/* Dropzone */
.g-dropzone { display: flex; flex-direction: column; align-items: center; gap: 6px; border: 2px dashed var(--sand); border-radius: 16px; padding: 40px; cursor: pointer; text-align: center; transition: all .18s; }
.g-dropzone:hover { border-color: var(--terra); background: var(--clay-bg); }
.g-dropzone.has-files { border-color: var(--terra); background: var(--clay-bg); }
.g-dropzone-ic { display: block; }
.g-dropzone strong { font-size: 16px; color: var(--ink); }
.g-dropzone small { font-size: 13px; color: var(--brown-soft); }
.g-dropzone-count { font-size: 14px; color: var(--terra); font-weight: 600; margin-top: 12px; text-align: center; }

/* Photos d'une galerie */
/* Grille studio : rangees justifiees (meme largeur) */
.g-gal-photos { display: flex; flex-wrap: wrap; gap: 8px; align-content: flex-start; }
.g-gal-photo { height: 165px; flex: var(--rr, 1.3) 1 calc(var(--rr, 1.3) * 130px); border-radius: 10px; overflow: hidden; background: var(--clay-bg); cursor: zoom-in; }
.g-gal-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.g-gal-photos::after { content: ""; flex: 100000 1 0; height: 0; }
/* Lightbox studio : agrandissement plein ecran en pleine resolution */
.g-studio-lb { position: fixed; inset: 0; background: rgba(20,16,14,.93); display: flex; align-items: center; justify-content: center; z-index: 9999; padding: 28px; }
.g-studio-lb[hidden] { display: none; }
.g-studio-lb img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; box-shadow: 0 12px 48px rgba(0,0,0,.55); }
.g-studio-lb-close { position: absolute; top: 14px; right: 22px; background: none; border: none; color: #fff; font-size: 42px; line-height: 1; cursor: pointer; opacity: .85; }
.g-studio-lb-close:hover { opacity: 1; }
.g-studio-lb-spin { position: absolute; width: 34px; height: 34px; border: 3px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: gspin .8s linear infinite; }
@keyframes gspin { to { transform: rotate(360deg); } }

@media (max-width: 900px) {
    .g-espace { flex-direction: column; }
    .g-side { width: 100%; height: auto; position: static; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 12px; }
    .g-side-brand { margin-bottom: 0; }
    .g-side-me { margin-bottom: 0; order: 2; }
    .g-side-nav { flex-direction: row; flex: 1 1 100%; order: 4; flex-wrap: wrap; gap: 6px; }
    .g-side-label { display: none; }
    .g-side-foot { flex-direction: row; border-top: none; padding-top: 0; margin-top: 0; order: 3; }
    .g-side-cta { width: auto; }
    .g-main { padding: 28px 20px; }
    .g-stats { grid-template-columns: 1fr 1fr; }
    .g-gal-grid { grid-template-columns: repeat(3, 1fr); }
    .g-radio-cards { grid-template-columns: 1fr; }
    .g-gal-photo { height: 120px; }
}

/* ===== Page détail galerie (gestion du reportage) ===== */
.g-detail-kicker { font-family: var(--serif); font-style: italic; font-size: 15px; color: var(--terra); margin-bottom: 4px; }
.g-detail-grid { display: grid; grid-template-columns: 1fr 340px; gap: 24px; align-items: start; }
.g-detail-main { display: flex; flex-direction: column; gap: 24px; }
.g-detail-side { display: flex; flex-direction: column; gap: 24px; }

.g-deflist { display: flex; flex-direction: column; }
.g-deflist > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.g-deflist > div:last-child { border-bottom: none; }
.g-deflist dt { font-size: 14px; color: var(--brown-soft); font-weight: 500; }
.g-deflist dd { font-size: 15px; color: var(--ink); font-weight: 600; text-align: right; }
.g-muted { color: var(--brown-soft); font-weight: 400; }

.g-link { color: var(--terra); font-weight: 600; font-size: 14px; }
.g-link:hover { text-decoration: underline; }
.g-link-danger { color: #c0392b; }

.g-copyfield { display: flex; gap: 10px; }
.g-copyfield .g-input { flex: 1; font-size: 14px; color: var(--brown); }

@media (max-width: 1000px) {
    .g-detail-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   CÔTÉ CLIENT (galerie publique vue par les invités)
   ============================================================ */

/* Page d'accès (mot de passe) */
.g-client-acces { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; }
.g-acces-box { background: var(--white); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); padding: 44px 40px; max-width: 420px; width: 100%; text-align: center; }
.g-acces-box h1 { font-family: var(--serif); font-weight: 500; font-size: 28px; color: var(--ink); margin-bottom: 10px; }
.g-acces-sub { font-size: 15px; color: var(--brown); margin-bottom: 26px; }
.g-acces-box .g-alert { text-align: left; }

/* En-tête galerie client */
.g-client { background: var(--cream); -webkit-tap-highlight-color: transparent; }
.g-client-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: nowrap; padding: 14px 40px; position: sticky; top: 0; z-index: 20; background: rgba(250,246,240,.9); backdrop-filter: saturate(180%) blur(14px); border-bottom: 1px solid var(--line); }
.g-client-head .g-client-actions { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; flex: 0 0 auto; }
/* En-tête compact (page panier) */
.g-client-head-slim { padding: 10px 40px; }
/* Nom du photographe : centré sur toute la largeur du header (indépendant du logo/actions) */
.g-head-photographe { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 50%; font-size: 14px; color: var(--brown-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; pointer-events: none; }
.g-head-photographe a, .g-head-photographe strong { pointer-events: auto; }
.g-head-photographe strong { color: var(--ink); font-weight: 600; }
.g-head-tel strong { color: var(--terra); }
.g-client-dark .g-head-photographe { color: #b9a892; }
.g-client-dark .g-head-photographe strong { color: #f3e9dd; }
/* Barre d'actions au-dessus de la grille : filtre favoris (gauche) + télécharger/panier (droite) */
.g-grid-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; margin: 0; padding: 0 24px 18px; flex-wrap: wrap; }
.g-toolbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* Onglets de sections (albums) côté client */
.g-client-tabs { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; width: 100%; margin: 0 0 26px; padding: 0 24px; }
.g-client-tab { font-family: var(--sans); font-size: 14px; font-weight: 600; color: var(--brown); background: transparent; border: 1.5px solid var(--line); padding: 9px 18px; border-radius: 100px; cursor: pointer; transition: all .15s; }
.g-client-tab:hover { border-color: var(--terra-soft); color: var(--terra); }
.g-client-tab.is-active { background: var(--terra); border-color: var(--terra); color: #fff; box-shadow: 0 8px 20px -7px rgba(176, 92, 58, .55); transform: translateY(-1px); }
.g-client-dark .g-client-tab { border-color: #3a2d22; color: #d8c8b6; }
.g-client-dark .g-client-tab.is-active { background: var(--terra); border-color: var(--terra); color: #fff; }
.g-client-hero { text-align: center; padding: 60px 24px 44px; max-width: 760px; margin: 0 auto; }
.g-client-hero h1 { font-family: var(--serif); font-weight: 500; font-size: 46px; letter-spacing: -0.02em; color: var(--ink); line-height: 1.1; overflow-wrap: break-word; hyphens: auto; }
.g-client-date { font-family: var(--serif); font-style: italic; font-size: 17px; color: var(--terra); margin-top: 10px; }
.g-client-desc { font-size: 17px; color: var(--brown); margin-top: 16px; }
.g-client-count { font-size: 13px; text-transform: uppercase; letter-spacing: .08em; color: var(--brown-soft); margin-top: 22px; }
.g-client-empty { text-align: center; color: var(--brown-soft); padding: 60px 0; }

/* Grilles client selon le layout choisi — pleine largeur immersive */
.g-client-grid { padding: 0 24px 64px; gap: 12px; width: 100%; margin: 0; }
/* Espacement personnalisable */
.g-client-grid[data-gap="tight"] { gap: 4px; }
.g-client-grid[data-gap="tight"][data-layout="masonry"] { column-gap: 4px; }
.g-client-grid[data-gap="tight"][data-layout="masonry"] .g-client-cell { margin-bottom: 4px; }
.g-client-grid[data-gap="wide"] { gap: 24px; }
.g-client-grid[data-gap="wide"][data-layout="masonry"] { column-gap: 24px; }
.g-client-grid[data-gap="wide"][data-layout="masonry"] .g-client-cell { margin-bottom: 24px; }

/* Espacement : 4e niveau « Aucun » (photos jointives) */
.g-client-grid[data-gap="none"] { gap: 0; }
.g-client-grid[data-gap="none"][data-layout="masonry"] { column-gap: 0; }
.g-client-grid[data-gap="none"][data-layout="masonry"] .g-client-cell { margin-bottom: 0; }

/* Arrondi des photos (sans / petit / moyen / grand) — surcharge le radius par défaut */
.g-client[data-round="aucun"] .g-client-cell { border-radius: 0; }
.g-client[data-round="petit"] .g-client-cell { border-radius: 8px; }
.g-client[data-round="moyen"] .g-client-cell { border-radius: 16px; }
.g-client[data-round="grand"] .g-client-cell { border-radius: 26px; }

/* Police des titres (5 choix) — appliquée aux H1 (couverture + héro) */
.g-client[data-font="fraunces"]   { --title-font: 'Fraunces', serif; }
.g-client[data-font="playfair"]   { --title-font: 'Playfair Display', serif; }
.g-client[data-font="cormorant"]  { --title-font: 'Cormorant Garamond', serif; }
.g-client[data-font="montserrat"] { --title-font: 'Montserrat', sans-serif; }
.g-client[data-font="dancing"]    { --title-font: 'Dancing Script', cursive; }
.g-client[data-font] h1 { font-family: var(--title-font); }
.g-client[data-font="cormorant"] h1  { font-weight: 600; }
.g-client[data-font="montserrat"] h1 { font-weight: 600; letter-spacing: -0.01em; }
.g-client[data-font="dancing"] h1    { font-weight: 700; }
/* Date sous le titre : même typographie que le titre */
.g-client[data-font] .g-client-date,
.g-client[data-font] .g-client-cover-overlay p { font-family: var(--title-font); }
.g-client[data-font="dancing"] .g-client-date,
.g-client[data-font="dancing"] .g-client-cover-overlay p { font-size: 22px; }

/* Signature du photographe en pied de galerie (logo / nom / téléphone) */
.g-client-signature { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; margin: 0 auto 16px; }
.g-client-signature .g-sign-logo { height: 56px; width: auto; max-width: 200px; object-fit: contain; }
.g-client-signature .g-sign-nom { font-family: var(--serif); font-size: 18px; font-weight: 600; color: var(--ink); }
.g-client-signature .g-sign-tel { font-size: 15px; color: var(--brown-soft); text-decoration: none; }
.g-client-signature .g-sign-tel:hover { color: var(--terra); }

/* Mention « Propulsé avec ♥ par Souvenirs.photo » */
.g-client-made { margin: 6px 0 0; font-size: 13px; color: var(--brown-soft); line-height: 1.5; }
.g-client-made .g-heart { color: #ff5fa2; font-size: 14px; vertical-align: -1px; }
.g-client-made a { color: inherit; font-weight: 600; text-decoration: none; }
.g-client-made a:hover { color: var(--terra); }
.g-client-made .g-made-fr { display: block; opacity: .85; margin-top: 1px; }
.g-client-cell { margin: 0; overflow: hidden; border-radius: 6px; cursor: zoom-in; background: var(--clay-bg); position: relative; }
.g-client-cell img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease, opacity .4s ease; }
/* Zoom au survol uniquement sur appareils avec vrai hover (pas le tactile) */
@media (hover: hover) { .g-client-cell:hover img { transform: scale(1.03); } }

/* Spinner pendant le chargement d'une photo : image masquée, spinner centré */
.g-client-cell.is-loading img { opacity: 0; }
.g-cell-spinner { position: absolute; top: 50%; left: 50%; width: 26px; height: 26px; margin: -13px 0 0 -13px; border: 2.5px solid rgba(0,0,0,.12); border-top-color: var(--terra); border-radius: 50%; animation: gSpin .7s linear infinite; opacity: 0; transition: opacity .2s; pointer-events: none; }
.g-client-cell.is-loading .g-cell-spinner { opacity: 1; }
.g-client-dark .g-cell-spinner { border-color: rgba(255,255,255,.18); border-top-color: var(--terra-soft); }
@keyframes gSpin { to { transform: rotate(360deg); } }

/* Sentinelle de chargement progressif (en bas de grille) */
.g-grid-sentinel { display: flex; align-items: center; justify-content: center; padding: 30px 0 50px; }
.g-spinner-lg { position: static; margin: 0; width: 32px; height: 32px; opacity: 1; }

/* Carré : grille régulière 1:1 */
.g-client-grid[data-layout="grid"] { display: grid; grid-template-columns: repeat(4, 1fr); }
.g-client-grid[data-layout="grid"] .g-client-cell { aspect-ratio: 1; }

/* Aligné : lignes paysage régulières */
.g-client-grid[data-layout="rows"] { display: grid; grid-template-columns: repeat(3, 1fr); }
.g-client-grid[data-layout="rows"] .g-client-cell { aspect-ratio: 3/2; }

/* Mosaïque : colonnes verticales (masonry CSS columns) */
/* Mosaique (style Lumys) : colonnes de meme largeur, hauteur variable selon le ratio,
   placees dans l'ordre de lecture (colonne la plus courte). Positionnement calcule en JS. */
.g-client-grid[data-layout="masonry"] { position: relative; display: block; }
.g-client-grid[data-layout="masonry"] .g-client-cell { position: absolute; margin: 0; aspect-ratio: auto; }
.g-client-grid[data-layout="masonry"] .g-client-cell img { width: 100%; height: 100%; object-fit: cover; }
/* Justifie (rangees egales) : meme principe, positionne en JS */
.g-client-grid[data-layout="justified"] { position: relative; display: block; }
.g-client-grid[data-layout="justified"] .g-client-cell { position: absolute; margin: 0; aspect-ratio: auto; }
.g-client-grid[data-layout="justified"] .g-client-cell img { width: 100%; height: 100%; object-fit: cover; }

/* Magazine : 1 grande tous les 5 + remplissage */
.g-client-grid[data-layout="magazine"] { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-flow: dense; }
.g-client-grid[data-layout="magazine"] .g-client-cell { aspect-ratio: 1; }
.g-client-grid[data-layout="magazine"] .g-client-cell:nth-child(8n+1) { grid-column: span 2; grid-row: span 2; }

/* Plein écran : une photo par ligne, grande (centrée pour rester lisible) */
.g-client-grid[data-layout="hero"] { display: flex; flex-direction: column; gap: 16px; max-width: 1100px; margin: 0 auto; }
.g-client-grid[data-layout="hero"] .g-client-cell { aspect-ratio: 3/2; cursor: zoom-in; }

/* Grands écrans : plus de colonnes pour exploiter la pleine largeur sans agrandir les photos à l'excès */
@media (min-width: 1600px) {
    .g-client-grid[data-layout="grid"] { grid-template-columns: repeat(5, 1fr); }
    .g-client-grid[data-layout="rows"] { grid-template-columns: repeat(4, 1fr); }
    .g-client-grid[data-layout="masonry"] { column-count: 5; }
    .g-client-grid[data-layout="magazine"] { grid-template-columns: repeat(5, 1fr); }
}
@media (min-width: 2100px) {
    .g-client-grid[data-layout="grid"] { grid-template-columns: repeat(6, 1fr); }
    .g-client-grid[data-layout="rows"] { grid-template-columns: repeat(5, 1fr); }
    .g-client-grid[data-layout="masonry"] { column-count: 6; }
    .g-client-grid[data-layout="magazine"] { grid-template-columns: repeat(6, 1fr); }
}

/* Ambiance sombre */
.g-client-dark { background: #1a130d; }
.g-client-dark .g-client-head { background: rgba(26,19,13,.9); border-bottom-color: #2e231a; }
.g-client-dark .g-brand, .g-client-dark .g-client-hero h1 { color: #f3e9dd; }
.g-client-dark .g-client-desc, .g-client-dark .g-client-count { color: #b9a892; }
.g-client-dark .g-client-cell { background: #2e231a; }
.g-client-dark .g-client-footer { color: #b9a892; }

.g-client-footer { text-align: center; padding: 36px; font-size: 13px; color: var(--brown-soft); border-top: 1px solid var(--line); }
.g-client-footer a { color: var(--terra); font-weight: 600; }

/* Actions sur une vignette client (favori, panier) — la cellule est déjà position:relative */
/* Favori : haut à droite */
.g-cell-fav { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border: none; border-radius: 50%; background: rgba(255,255,255,.92); color: #6b5b4d; cursor: pointer; opacity: 0; transition: opacity .15s, transform .12s, background .15s, color .15s; backdrop-filter: blur(2px); }
.g-client-cell:hover .g-cell-fav { opacity: 1; }
.g-cell-fav:hover { transform: scale(1.08); background: #fff; color: #e8568f; }
.g-cell-fav:hover svg path { fill: #e8568f; }
.g-cell-fav.is-fav { opacity: 1; background: #fff; color: #e8568f; animation: gPop .28s ease; }
.g-cell-fav.is-fav svg path { fill: #e8568f; }

/* Boutons au milieu : icônes seules (panier toujours + télécharger si gratuit) avec tooltip */
.g-cell-mid { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 12px; opacity: 0; transition: opacity .15s; pointer-events: none; }
.g-client-cell:hover .g-cell-mid { opacity: 1; }
.g-cell-midbtn { position: relative; pointer-events: auto; width: 46px; height: 46px; display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: 50%; background: rgba(255,255,255,.94); color: var(--ink); cursor: pointer; box-shadow: 0 6px 20px rgba(0,0,0,.18); transition: transform .12s, background .15s, color .15s; backdrop-filter: blur(2px); }
.g-cell-midbtn:hover { transform: translateY(-1px) scale(1.05); background: var(--terra); color: #fff; }
.g-cell-midbtn:hover svg path { stroke: #fff; }
.g-cell-cart.is-in { background: var(--terra); color: #fff; }
.g-cell-cart.is-in svg path { stroke: #fff; }
/* Tooltip au survol du bouton (libellé) */
.g-cell-midbtn[data-tip]::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%) translateY(4px); background: #1a130d; color: #fff; font-size: 12px; font-weight: 500; white-space: nowrap; padding: 5px 10px; border-radius: 7px; opacity: 0; pointer-events: none; transition: opacity .15s, transform .15s; }
.g-cell-midbtn[data-tip]:hover::after { opacity: 1; transform: translateX(-50%) translateY(0); }
@keyframes gPop { 0% { transform: scale(.8); } 55% { transform: scale(1.2); } 100% { transform: scale(1); } }

/* Bouton filtre favoris dans le header */
.g-client-favtoggle { display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 1.5px solid var(--line); color: var(--brown); border-radius: 100px; padding: 8px 14px; font-family: var(--sans); font-weight: 600; font-size: 14px; cursor: pointer; transition: all .15s; }
.g-client-favtoggle:hover { border-color: #f3a9c6; color: #e8568f; }
.g-client-favtoggle.is-on { background: #e8568f; border-color: #e8568f; color: #fff; }
.g-client-favtoggle.is-on svg path { fill: #fff; }
.g-client-dark .g-client-favtoggle { border-color: #3a2d22; color: #d8c8b6; }

/* Pastille compteur panier */
.g-cart-link { position: relative; }
.g-cart-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; margin-left: 4px; border-radius: 100px; background: #fff; color: var(--terra); font-size: 12px; font-weight: 700; }
.g-cart-count[hidden] { display: none; }

/* Lightbox */
.g-lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(20,14,9,.94); display: flex; align-items: center; justify-content: center; }
.g-lightbox[hidden] { display: none; }
.g-lb-stage { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 92vw; }
.g-lightbox img { max-width: 90vw; max-height: 80vh; border-radius: 6px; box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.g-lb-name { color: #f3e9dd; font-size: 13px; font-weight: 500; opacity: .8; max-width: 80vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; }

/* Barre d'icônes en haut de la lightbox (icônes seules + tooltip) */
.g-lb-topbar { position: absolute; top: 18px; right: 22px; display: flex; gap: 8px; z-index: 2; }
.g-lb-ico { position: relative; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); color: #f3e9dd; border-radius: 50%; cursor: pointer; font-size: 26px; line-height: 1; transition: background .15s, color .15s, transform .12s; }
.g-lb-ico:hover { background: rgba(255,255,255,.24); transform: translateY(-1px); }
.g-lb-ico.is-on { background: var(--terra); border-color: var(--terra); color: #fff; }
.g-lb-ico.is-on svg path { fill: #fff; }
#lbFav.is-on { background: #e8568f; border-color: #e8568f; }
.g-lb-ico-warn:hover { background: rgba(192,57,43,.9); border-color: rgba(192,57,43,.9); color: #fff; }
/* Tooltip au survol */
.g-lb-ico[data-tip]::after { content: attr(data-tip); position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%) translateY(4px); background: #1a130d; color: #fff; font-size: 12px; font-weight: 500; white-space: nowrap; padding: 5px 10px; border-radius: 7px; opacity: 0; pointer-events: none; transition: opacity .15s, transform .15s; }
.g-lb-ico[data-tip]:hover::after { opacity: 1; transform: translateX(-50%) translateY(0); }

.g-lb-prev, .g-lb-next { position: absolute; background: rgba(0,0,0,.45); border: none; color: #fff; cursor: pointer; border-radius: 50%; width: 48px; height: 48px; font-size: 26px; line-height: 1; transition: background .15s; z-index: 2; }
.g-lb-prev:hover, .g-lb-next:hover { background: rgba(0,0,0,.7); }
.g-lb-prev { left: 26px; top: 50%; transform: translateY(-50%); }
.g-lb-next { right: 26px; top: 50%; transform: translateY(-50%); }

/* Sélecteur de langue */
.g-lang { position: relative; }
.g-lang-btn { display: inline-flex; align-items: center; gap: 7px; background: transparent; border: 1.5px solid var(--line); color: var(--brown); border-radius: 100px; padding: 7px 12px; font-family: var(--sans); font-weight: 600; font-size: 13px; cursor: pointer; transition: all .15s; }
.g-lang-btn:hover { border-color: var(--terra-soft); color: var(--terra); }
.g-lang-caret { opacity: .6; flex: 0 0 auto; }
.g-lang-menu { position: absolute; top: calc(100% + 6px); right: 0; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); padding: 6px; min-width: 170px; z-index: 50; }
.g-lang-menu[hidden] { display: none; }
.g-lang-item { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 8px; font-size: 14px; color: var(--ink); font-weight: 500; }
.g-lang-item:hover { background: var(--clay-bg); color: var(--terra); }
.g-lang-item.is-active { color: var(--terra); font-weight: 700; }
.g-client-dark .g-lang-btn { border-color: #3a2d22; color: #d8c8b6; }
/* Drapeaux (flag-icons) : taille homogène, coins légèrement arrondis */
.g-flag.fi { width: 22px; height: 15px; border-radius: 3px; line-height: 1; box-shadow: 0 0 0 1px rgba(0,0,0,.06); flex: 0 0 auto; }

/* Bloc photographe en pied de galerie */
.g-photographe { max-width: 900px; margin: 20px auto 0; padding: 0 24px; }
.g-photographe-inner { display: flex; align-items: center; gap: 24px; padding: 28px 30px; background: var(--clay-bg); border-radius: 18px; flex-wrap: wrap; }
.g-photographe-logo { flex: 0 0 auto; }
.g-photographe-logo img { height: 64px; width: auto; max-width: 140px; object-fit: contain; }
.g-photographe-kicker { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--brown-soft); }
.g-photographe-info h3 { font-family: var(--serif); font-weight: 500; font-size: 24px; color: var(--ink); margin: 4px 0 12px; }
.g-photographe-contacts { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.g-photographe-line { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; color: var(--brown); }
.g-photographe-line:hover { color: var(--terra); }
.g-client-dark .g-photographe-inner { background: #2e231a; }
.g-client-dark .g-photographe-info h3 { color: #f3e9dd; }
.g-client-dark .g-photographe-line { color: #c8b8a4; }

/* Toast client */
.g-toast { position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 20px); z-index: 400; background: #2b2018; color: #fff; padding: 13px 22px; border-radius: 12px; font-size: 14px; font-weight: 500; box-shadow: 0 14px 40px rgba(0,0,0,.3); opacity: 0; transition: opacity .3s, transform .3s; max-width: 90vw; text-align: center; }
.g-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* Modale côté client (réutilise .g-modal mais fond clair forcé) */
.g-client-modal .g-modal-box { background: #fff; }

/* Page panier client */
.g-cart-wrap { max-width: 1000px; margin: 0 auto; padding: 40px 24px 60px; }
.g-cart-title { font-family: var(--serif); font-weight: 500; font-size: 34px; color: var(--ink); }
.g-client-dark .g-cart-title { color: #f3e9dd; }
.g-cart-sub { color: var(--brown-soft); margin-top: 4px; margin-bottom: 28px; }
.g-cart-empty { text-align: center; padding: 60px 20px; color: var(--brown-soft); }
.g-cart-empty p { margin-bottom: 18px; }

/* Liste du panier : une ligne par photo (vignette / nom+album / supprimer) */
.g-cart-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.g-cart-row { display: flex; align-items: flex-start; gap: 16px; padding: 16px 4px; border-bottom: 1px solid var(--line); }
/* Miniature au RATIO de la photo (largeur fixe, hauteur libre bornée), sans rognage. */
.g-cart-thumb { width: 72px; height: auto; max-height: 96px; flex: 0 0 auto; object-fit: contain; border-radius: 10px; background: var(--clay-bg); }
.g-cart-meta { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.g-cart-name { font-size: 15px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-cart-album { font-size: 13px; color: var(--brown-soft); }
.g-cart-remove { flex: 0 0 auto; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; background: none; border: 1px solid var(--line); border-radius: 9px; color: #c0392b; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.g-cart-remove:hover { background: #c0392b; border-color: #c0392b; color: #fff; }
.g-client-dark .g-cart-name { color: #f3e9dd; }
.g-client-dark .g-cart-row { border-color: #2e231a; }
.g-client-dark .g-cart-list { border-color: #2e231a; }

/* En-tête de colonnes (style tableau) */
.g-cart-head { display: grid; grid-template-columns: 1fr 90px 90px 40px; gap: 12px; padding: 0 22px; margin-top: 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--brown-soft); }
.g-cart-head-qte, .g-cart-head-prix { text-align: right; }

/* Bloc photo : vignette + nom, puis ses rangées d'articles */
/* Chaque photo = une carte blanche pour aérer le panier */
.g-cart-list { border-top: none; display: flex; flex-direction: column; gap: 14px; margin-top: 8px; }
.g-cart-photo { padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--white); box-shadow: var(--shadow-sm); }
.g-cart-photohead { display: flex; align-items: center; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 6px; }
.g-client-dark .g-cart-photo { background: #241a12; border-color: #3a2d22; }
.g-client-dark .g-cart-photohead { border-color: #3a2d22; }
.g-cart-photoinfo { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.g-cart-subtotal { display: none; }

/* Rangée d'article (un format) en grille tableau */
.g-art-row { display: grid; grid-template-columns: 1fr 90px 90px 40px; gap: 12px; align-items: center; padding: 10px 4px; }
.g-art-row + .g-art-row { border-top: 1px solid var(--line); }
.g-art-article { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.g-art-nom { font-size: 15px; font-weight: 600; color: var(--ink); display: inline-flex; align-items: center; gap: 6px; }
.g-art-size { font-size: 12px; color: var(--brown-soft); }
.g-art-qte { display: flex; justify-content: flex-end; }
/* Stepper quantité : − 1 + */
.g-qty-stepper { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 100px; overflow: hidden; background: var(--white); }
.g-qty-btn { width: 30px; height: 32px; border: none; background: transparent; color: var(--brown); font-size: 17px; line-height: 1; cursor: pointer; transition: background .15s, color .15s; }
.g-qty-btn:hover { background: var(--clay-bg); color: var(--terra); }
.g-qty-val { width: 34px; height: 32px; border: none; border-left: 1px solid var(--line); border-right: 1px solid var(--line); text-align: center; font-family: var(--sans); font-size: 14px; font-weight: 600; color: var(--ink); background: transparent; -moz-appearance: textfield; }
.g-qty-val:focus { outline: none; }
.g-client-dark .g-qty-stepper { background: #2e231a; border-color: #3a2d22; }
.g-client-dark .g-qty-btn { color: #d8c8b6; }
.g-client-dark .g-qty-btn:hover { background: #3a2d22; }
.g-client-dark .g-qty-val { color: #f3e9dd; border-color: #3a2d22; }

/* Options finition / bord (chips) */
.g-art-options { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 10px; }
.g-opt-group { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.g-opt-lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--brown-soft); margin-right: 4px; }
.g-opt-sep { color: var(--line); font-weight: 300; margin: 0 2px; user-select: none; }
.g-client-dark .g-opt-sep { color: #3a2d22; }

/* Bandeau d'info sur la qualité d'impression */
.g-quality-note { display: flex; gap: 12px; align-items: flex-start; background: #fff8ef; border: 1px solid #f0d9b8; border-radius: 12px; padding: 14px 16px; margin-bottom: 20px; }
.g-quality-note svg { color: #b06a1d; flex: 0 0 auto; margin-top: 2px; }
.g-quality-note strong { display: block; font-size: 14px; color: #8a5414; margin-bottom: 2px; }
.g-quality-note p { font-size: 13px; color: var(--brown); margin: 0; line-height: 1.45; }
.g-client-dark .g-quality-note { background: #2a2114; border-color: #4a3a22; }
.g-client-dark .g-quality-note strong { color: #e0b878; }
.g-client-dark .g-quality-note p { color: #c8b8a4; }
.g-opt-chip { font-family: var(--sans); font-size: 12px; font-weight: 600; color: var(--brown); background: var(--white); border: 1px solid var(--line); border-radius: 100px; padding: 4px 12px; cursor: pointer; transition: all .15s; }
.g-opt-chip:hover { border-color: var(--terra-soft); }
.g-opt-chip.is-on { background: var(--terra); border-color: var(--terra); color: #fff; }
.g-client-dark .g-opt-chip { background: #2e231a; border-color: #3a2d22; color: #d8c8b6; }
.g-client-dark .g-opt-chip.is-on { background: var(--terra); border-color: var(--terra); color: #fff; }
.g-art-prix { text-align: right; font-weight: 700; color: var(--ink); white-space: nowrap; }
.g-art-act { text-align: right; }
.g-cart-fmtline-remove { background: none; border: none; color: var(--brown-soft); font-size: 22px; line-height: 1; cursor: pointer; padding: 0 4px; }
.g-cart-fmtline-remove:hover { color: #c0392b; }

/* Fondu de sortie à la suppression (ligne d'article ou carte photo). */
.g-art-row, .g-cart-photo { transition: opacity .25s ease, transform .25s ease; }
.g-art-row.g-removing, .g-cart-photo.g-removing { opacity: 0; transform: translateX(-12px); pointer-events: none; }

/* Fondu d'apparition du panier après une maj AJAX (ajout/retrait de format). */
#cartRoot { transition: opacity .22s ease; }
#cartRoot.g-cart-entering { opacity: 0; }
/* Carte photo : transition d'apparition (maj ciblée). La transition est déjà déclarée plus haut. */
.g-cart-photo.g-cart-entering { opacity: 0; transform: translateY(6px); }

/* Bouton « Commander » désactivé (lien stylé sans href bloqué via JS + pointer-events). */
.g-btn.is-disabled { opacity: .5; pointer-events: none; cursor: default; }

/* Icônes recadrage + qualité (avec tooltip g-tip) */
.g-art-icons { display: inline-flex; align-items: center; gap: 6px; margin-left: 4px; }
.g-art-warn, .g-fmt-opt-warn { color: #d98324; display: inline-flex; }
.g-qual-ico { display: inline-flex; }
.g-qual-excellent { color: #2e7d46; }
.g-qual-bon { color: #d98324; }
.g-qual-faible { color: #c0392b; }

/* Tooltip générique au survol (qualité, recadrage) */
.g-tip { position: relative; cursor: help; }
.g-tip::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%) translateY(4px); background: #1a130d; color: #fff; font-size: 12px; font-weight: 500; line-height: 1.35; white-space: normal; width: max-content; max-width: 240px; padding: 7px 11px; border-radius: 8px; opacity: 0; pointer-events: none; transition: opacity .15s, transform .15s; z-index: 50; box-shadow: 0 6px 20px rgba(0,0,0,.25); }
.g-tip:hover::after { opacity: 1; transform: translateX(-50%) translateY(0); }

/* Zone d'ajout + panneau PLEINE LARGEUR (fondu, formats en grille de colonnes) */
.g-cart-addzone { margin-top: 12px; }
.g-fmt-panel { margin-top: 12px; padding: 16px 18px; background: var(--clay-bg); border: 1px solid var(--line); border-radius: 14px; opacity: 1; transform: translateY(0); transition: opacity .2s ease, transform .2s ease; overflow: hidden; }
.g-fmt-panel[hidden] { display: block; opacity: 0; transform: translateY(-8px); max-height: 0; padding-top: 0; padding-bottom: 0; margin-top: 0; border-width: 0; pointer-events: none; }
.g-fmt-tabs { display: flex; gap: 6px; margin-bottom: 14px; border-bottom: 1px solid var(--line); padding-bottom: 12px; flex-wrap: wrap; }
.g-fmt-tab { font-family: var(--sans); font-size: 13px; font-weight: 600; color: var(--brown); background: var(--white); border: 1px solid var(--line); border-radius: 100px; padding: 6px 16px; cursor: pointer; transition: all .15s; }
.g-fmt-tab:hover { color: var(--terra); border-color: var(--terra-soft); }
.g-fmt-tab.is-active { background: var(--terra); color: #fff; border-color: var(--terra); }
/* Les formats de la catégorie active : grille de colonnes pleine largeur, triés par taille */
/* La famille active = des colonnes par ratio, côte à côte */
.g-fmt-group { display: flex; gap: 20px; flex-wrap: wrap; align-items: flex-start; }
.g-fmt-group[hidden] { display: none; } /* sinon le display:flex annule l'attribut hidden */
.g-fmt-rcol { display: flex; flex-direction: column; gap: 6px; min-width: 150px; flex: 1 1 0; }
.g-fmt-rcol-titre { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--brown-soft); padding-bottom: 4px; border-bottom: 1px solid var(--line); }
.g-client-dark .g-fmt-rcol-titre { color: #b9a892; border-color: #3a2d22; }
.g-fmt-opt { display: flex; align-items: center; gap: 8px; background: var(--white); border: 1px solid var(--line); border-radius: 9px; padding: 8px 11px; cursor: pointer; text-align: left; transition: border-color .15s, background .15s; }
.g-fmt-opt:hover { border-color: var(--terra); }
.g-fmt-opt-nom { font-weight: 600; color: var(--ink); }
.g-fmt-opt-dim { font-size: 12px; color: var(--brown-soft); flex: 1 1 auto; }
.g-fmt-opt-prix { font-weight: 700; color: var(--terra); white-space: nowrap; }
.g-fmt-opt.is-crop { border-style: dashed; }

/* Mode sombre des nouveaux éléments */
.g-client-dark .g-art-nom, .g-client-dark .g-art-prix { color: #f3e9dd; }
.g-client-dark .g-fmt-panel { background: #241a12; border-color: #3a2d22; }
.g-client-dark .g-fmt-tab { background: #2e231a; color: #d8c8b6; }
.g-client-dark .g-fmt-opt { background: #2e231a; border-color: #3a2d22; }
.g-client-dark .g-fmt-opt:hover { background: #3a2d22; }
.g-client-dark .g-fmt-opt-nom { color: #f3e9dd; }
.g-client-dark .g-cart-photo, .g-client-dark .g-cart-head, .g-client-dark .g-art-row + .g-art-row { border-color: #3a2d22; }

/* Barre actions globales du panier */
.g-cart-applyall { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 14px; background: var(--clay-bg); border-radius: 14px; padding: 14px 18px; margin-bottom: 18px; flex-wrap: wrap; }
/* Zone « appliquer à tout » : bouton + panneau déroulant (réutilise .g-fmt-panel) */
.g-applyall-zone { position: static; }
/* Le panneau s'ouvre sur TOUTE la largeur du bandeau (cohérence avec le reste du panier). */
.g-applyall-panel { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 40; }

/* Total */
.g-cart-total-bar { display: flex; justify-content: flex-end; align-items: baseline; gap: 16px; padding: 18px 4px 0; }
.g-cart-total-lbl { font-size: 15px; color: var(--brown); }
.g-cart-total-val { font-family: var(--serif); font-weight: 600; font-size: 26px; color: var(--terra); }

/* Modale « tous les tarifs » en colonnes par famille — même largeur que le panier (1000px).
   Spécificité renforcée car .g-modal-box (max-width:460px) est redéclarée plus bas dans le fichier. */
.g-modal-box.g-modal-box-lg { max-width: 1000px; width: 96vw; }
/* Onglets de la modale tarifs (réutilise le style des onglets de format) */
.g-prices-tabs { margin-bottom: 20px; }
.g-prices-fam { margin-bottom: 8px; }
.g-prices-fam[hidden] { display: none; }
.g-prices-fam-titre { font-family: var(--serif); font-weight: 500; font-size: 22px; color: var(--ink); margin: 0; }
.g-client-dark .g-prices-fam-titre { color: #f3e9dd; }
/* En-tête « vitrine » d'une famille : image d'illustration + description */
.g-prices-intro { display: flex; gap: 18px; align-items: center; margin-bottom: 22px; }
.g-prices-intro-img { flex: 0 0 auto; width: 110px; height: 110px; border-radius: 14px; overflow: hidden; background: var(--clay-bg); border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; }
.g-prices-intro-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.g-prices-intro-ph { color: var(--terra-soft); display: flex; }
.g-prices-intro-txt { flex: 1 1 auto; min-width: 0; }
.g-prices-intro-desc { font-size: 14px; color: var(--brown-soft); line-height: 1.5; margin-top: 6px; }
@media (max-width: 560px) {
    .g-prices-intro { flex-direction: column; align-items: flex-start; gap: 12px; }
    .g-prices-intro-img { width: 84px; height: 84px; }
}
.g-prices-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 20px; }
.g-prices-col-titre { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--terra); margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.g-prices-item { display: flex; align-items: baseline; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.g-prices-nom { font-weight: 600; color: var(--ink); }
.g-prices-dim { font-size: 12px; color: var(--brown-soft); flex: 1 1 auto; }
.g-prices-prix { font-weight: 700; color: var(--terra); white-space: nowrap; }

/* ===== MODE SOMBRE du panier (correction complète) ===== */
.g-client-dark .g-cart-title,
.g-client-dark .g-cart-name,
.g-client-dark .g-cart-subtotal,
.g-client-dark .g-fmt-opt-nom,
.g-client-dark .g-prices-nom { color: #f3e9dd; }
.g-client-dark .g-cart-album,
.g-client-dark .g-cart-total-lbl,
.g-client-dark .g-cart-qtylbl,
.g-client-dark .g-fmt-col-titre,
.g-client-dark .g-fmt-opt-dim,
.g-client-dark .g-prices-dim { color: #b9a892; }
.g-client-dark .g-cart-list,
.g-client-dark .g-cart-row,
.g-client-dark .g-prices-item { border-color: #3a2d22; }
.g-client-dark .g-cart-applyall,
.g-client-dark .g-fmt-panel { background: #241a12; border-color: #3a2d22; }
.g-client-dark .g-fmt-trigger,
.g-client-dark .g-fmt-opt,
.g-client-dark .g-cart-qty,
.g-client-dark .g-cart-applyall-ctrl .g-input { background: #2e231a; border-color: #3a2d22; color: #f3e9dd; }
.g-client-dark .g-fmt-trigger.is-empty { color: #b9a892; }
.g-client-dark .g-cart-thumb { background: #2e231a; }
/* La modale tarifs garde un fond clair (.g-client-modal force déjà #fff) → texte sombre conservé */

.g-cart-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 28px; flex-wrap: wrap; }
.g-cart-foot-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.g-cart-clear { color: #c0392b; }
.g-cart-clear:hover { color: #a02d20; }

@media (max-width: 900px) {
    .g-client-grid[data-layout="grid"], .g-client-grid[data-layout="magazine"] { grid-template-columns: repeat(3, 1fr); }
    .g-client-grid[data-layout="masonry"] { column-count: 3; }
    .g-client-grid[data-layout="hero"] .g-client-cell { aspect-ratio: 4/3; }
}
@media (max-width: 600px) {
    .g-client-head { padding: 10px 14px; }
    .g-client-head-slim { padding: 10px 14px; }
    .g-head-photographe { display: none; } /* trop étroit en mobile, le nom reste visible sur desktop */
    .g-grid-toolbar { padding: 0 12px 14px; }
    .g-client-grid { padding-left: 12px; padding-right: 12px; padding-bottom: 40px; gap: 8px; }
    .g-brand { font-size: 18px; gap: 8px; }
    .g-brand-dot { width: 24px; height: 24px; font-size: 11px; }
    .g-client-actions { gap: 8px; }
    .g-client-actions .g-btn { padding: 9px 14px; font-size: 13px; }
    .g-cart-thumb { width: 56px; height: auto; max-height: 76px; }
    .g-cart-foot-left { width: 100%; }
    .g-cart-foot .g-btn-primary { width: 100%; }
    /* Tableau articles → empilé sur mobile (l'en-tête de colonnes est masqué) */
    .g-cart-head { display: none; }
    .g-art-row { grid-template-columns: 1fr auto; grid-template-areas: "article prix" "qte act"; gap: 8px 10px; align-items: start; }
    .g-art-article { grid-area: article; }
    .g-art-prix { grid-area: prix; }
    .g-art-qte { grid-area: qte; justify-content: flex-start; }
    .g-art-act { grid-area: act; }
    .g-fmt-group { flex-direction: column; gap: 14px; }
    .g-fmt-rcol { min-width: 0; width: 100%; }
    .g-cart-applyall { flex-direction: column; align-items: stretch; }
    .g-applyall-zone { width: 100%; }
    .g-applyall-zone > .g-btn { width: 100%; }
    .g-applyall-panel { position: static; min-width: 0; width: 100%; margin-top: 10px; }
    .g-client-hero { padding: 36px 18px 28px; }
    .g-client-hero h1 { font-size: 29px; }
    .g-client-date, .g-client-desc { font-size: 15px; }
    .g-client-grid[data-layout="grid"], .g-client-grid[data-layout="rows"], .g-client-grid[data-layout="magazine"] { grid-template-columns: repeat(2, 1fr); }
    .g-client-grid[data-layout="masonry"] { column-count: 2; column-gap: 8px; }
    .g-client-grid[data-layout="masonry"] .g-client-cell { margin-bottom: 8px; }
    .g-client-grid[data-layout="magazine"] .g-client-cell:nth-child(8n+1) { grid-column: span 2; grid-row: auto; aspect-ratio: 3/2; }
    /* Lightbox plein écran sur mobile + safe-area iOS */
    .g-lightbox img { max-width: 100vw; max-height: 70vh; border-radius: 0; }
    .g-lb-topbar { top: calc(8px + env(safe-area-inset-top)); right: 10px; gap: 6px; }
    .g-lb-ico { width: 40px; height: 40px; }
    /* Tooltip plus discrète au doigt : on la garde mais sans bloquer */
    .g-lb-prev { left: 8px; width: 44px; height: 44px; } .g-lb-next { right: 8px; width: 44px; height: 44px; }
    .g-acces-box { padding: 32px 24px; }
    /* Mobile : grille épurée, aucune icône sur les vignettes (elles cachaient la photo).
       Le tap ouvre la photo en plein écran (lightbox) où se trouvent favori / panier / téléchargement.
       On garde le coup de cœur visible UNIQUEMENT s'il est déjà actif (repère discret en coin). */
    .g-cell-mid { display: none; }
    .g-cell-fav { opacity: 0; pointer-events: none; }
    .g-cell-fav.is-fav { opacity: 1; pointer-events: auto; top: 8px; right: 8px; width: 30px; height: 30px; }
    .g-lb-name { max-width: 88vw; }
}

/* ===== Popups (modales gestion galerie) ===== */
.g-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; gap: 16px; }
.g-card-danger { border-color: #e3b3ab; }
.g-card-danger .g-card-title { color: #c0392b; }
/* Badge statut inline (page détail) — version non absolue */
.g-badge { display: inline-block; font-size: 12px; font-weight: 600; padding: 5px 13px; border-radius: 100px; }
.g-badge-publiee { background: #eaf6ec; color: #2e6b3a; }
.g-badge-brouillon { background: var(--clay-bg); color: var(--brown); }
.g-badge-archivee { background: #f1ece6; color: var(--brown-soft); }
.g-modal { position: fixed; inset: 0; z-index: 300; background: rgba(43,32,24,.5); display: flex; align-items: center; justify-content: center; padding: 24px; }
.g-modal[hidden] { display: none; }
.g-modal-box { background: var(--white); border-radius: 20px; box-shadow: var(--shadow-lg); width: 100%; max-width: 460px; max-height: 90vh; overflow-y: auto; padding: 28px; animation: gFade .2s ease; }
.g-modal-wide { max-width: 620px; }
.g-modal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }
.g-modal-head h3 { font-family: var(--serif); font-weight: 500; font-size: 22px; color: var(--ink); }
.g-modal-close { background: none; border: none; font-size: 28px; line-height: 1; color: var(--brown-soft); cursor: pointer; padding: 0 4px; }
.g-modal-close:hover { color: var(--terra); }
.g-modal-foot { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; }

@media (max-width: 600px) {
    .g-modal { padding: 14px; align-items: flex-end; }
    .g-modal-box { max-width: 100%; padding: 22px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
    .g-modal-foot { flex-direction: column-reverse; }
    .g-modal-foot .g-btn { width: 100%; }
}

/* ===== Page personnalisation ===== */
.g-perso { display: flex; flex-direction: column; gap: 22px; max-width: 1000px; }
.g-perso-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
.g-perso-block { margin-bottom: 22px; }
.g-perso-block:last-child { margin-bottom: 0; }
.g-perso-label { display: block; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--brown-soft); margin-bottom: 12px; }
.g-perso-preview { position: sticky; top: 20px; }
.g-wizard-panel[data-panel="5"] .g-perso-preview { position: static; }

/* Aperçu live (mini-galerie) */
.g-pv-stage { --pvgap: 8px; --pvbg: var(--white); background: var(--pvbg); border: 1px solid var(--line); border-radius: 14px; padding: 14px; display: grid; gap: var(--pvgap); height: 340px; transition: background .3s, gap .3s; }
.g-pv-stage[data-bg="dark"] { --pvbg: #241a13; border-color: #241a13; }
.g-pv-stage[data-gap="none"] { --pvgap: 0; }
.g-pv-stage[data-gap="tight"] { --pvgap: 4px; }
.g-pv-stage[data-gap="normal"] { --pvgap: 9px; }
.g-pv-stage[data-gap="wide"] { --pvgap: 18px; }
.g-pvc { border-radius: 7px; background: linear-gradient(150deg, var(--terra-soft), var(--terra)); }
.g-pvc:nth-child(2){background:linear-gradient(150deg,#edd2bd,#cf9a72);} .g-pvc:nth-child(3){background:linear-gradient(150deg,#e0b095,#bd7a56);}
.g-pvc:nth-child(4){background:linear-gradient(150deg,#e8c8ad,#c88f63);} .g-pvc:nth-child(5){background:linear-gradient(150deg,#dcae90,#b87a55);}
.g-pvc:nth-child(6){background:linear-gradient(150deg,#e5c4a6,#c2855e);} .g-pvc:nth-child(7){background:linear-gradient(150deg,#e2b99c,#c5835d);}
.g-pvc:nth-child(8){background:linear-gradient(150deg,#ecd0b9,#caa078);} .g-pvc:nth-child(9){background:linear-gradient(150deg,#ddb295,#ba7c58);}
.g-pv-stage[data-layout="grid"] { grid-template-columns: repeat(3,1fr); grid-template-rows: repeat(3,1fr); }
.g-pv-stage[data-layout="rows"] { grid-template-columns: repeat(2,1fr); grid-template-rows: repeat(4,1fr); }
.g-pv-stage[data-layout="rows"] .g-pvc:nth-child(n+7){display:none;}
.g-pv-stage[data-layout="masonry"] { grid-template-columns: repeat(3,1fr); grid-template-rows: repeat(8,1fr); }
.g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(1){grid-row:span 3;} .g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(2){grid-row:span 2;}
.g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(3){grid-row:span 3;} .g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(4){grid-row:span 3;}
.g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(5){grid-row:span 3;} .g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(6){grid-row:span 2;}
.g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(7){grid-row:span 2;} .g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(8){grid-row:span 3;} .g-pv-stage[data-layout="masonry"] .g-pvc:nth-child(9){grid-row:span 3;}
.g-pv-stage[data-layout="justified"] { grid-template-columns: repeat(6,1fr); grid-template-rows: repeat(3,1fr); }
.g-pv-stage[data-layout="justified"] .g-pvc:nth-child(1){grid-column:span 2;} .g-pv-stage[data-layout="justified"] .g-pvc:nth-child(2){grid-column:span 3;} .g-pv-stage[data-layout="justified"] .g-pvc:nth-child(3){grid-column:span 1;}
.g-pv-stage[data-layout="justified"] .g-pvc:nth-child(4){grid-column:span 3;} .g-pv-stage[data-layout="justified"] .g-pvc:nth-child(5){grid-column:span 1;} .g-pv-stage[data-layout="justified"] .g-pvc:nth-child(6){grid-column:span 2;}
.g-pv-stage[data-layout="justified"] .g-pvc:nth-child(7){grid-column:span 2;} .g-pv-stage[data-layout="justified"] .g-pvc:nth-child(8){grid-column:span 2;} .g-pv-stage[data-layout="justified"] .g-pvc:nth-child(9){grid-column:span 2;}
.g-pv-stage[data-layout="justified"] .g-pvc:nth-child(n+10){display:none;}
.g-pv-stage[data-layout="magazine"] { grid-template-columns: repeat(4,1fr); grid-template-rows: repeat(3,1fr); }
.g-pv-stage[data-layout="magazine"] .g-pvc:nth-child(1){grid-column:span 2;grid-row:span 2;}
.g-pv-stage[data-layout="magazine"] .g-pvc:nth-child(9){display:none;}
.g-pv-stage[data-layout="hero"] { grid-template-columns: repeat(5,1fr); grid-template-rows: 3fr 1fr; }
.g-pv-stage[data-layout="hero"] .g-pvc:nth-child(1){grid-column:1/-1;}
.g-pv-stage[data-layout="hero"] .g-pvc:nth-child(n+7){display:none;}

/* Image à la une (édition) */
.g-cover-zone { display: grid; grid-template-columns: 1.4fr 1fr; gap: 22px; align-items: center; }
.g-cover-preview { aspect-ratio: 16/9; border-radius: 14px; background: var(--clay-bg) center/cover no-repeat; border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; }
.g-cover-empty { color: var(--brown-soft); font-size: 14px; }
.g-cover-actions label.g-btn { display: inline-flex; }

/* Couverture côté client */
.g-client-cover { height: 56vh; min-height: 340px; background-size: cover; background-position: center; background-color: var(--clay-bg); position: relative; display: flex; align-items: flex-end; }
.g-client-cover::after { content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(43,32,24,.05), rgba(43,32,24,.55)); }
/* Tant que la couverture charge : fond neutre, gradient masqué, spinner visible */
.g-client-cover.is-loading::after { opacity: 0; }
.g-client-cover.is-loading { background-color: var(--clay-bg); }
.g-cover-spinner { position: absolute; top: 50%; left: 50%; width: 36px; height: 36px; margin: -18px 0 0 -18px; opacity: 1; z-index: 2; }
.g-client-cover:not(.is-loading) .g-cover-spinner { display: none; }
.g-client-dark .g-client-cover, .g-client-dark .g-client-cover.is-loading { background-color: #2e231a; }
.g-client-cover-overlay { position: relative; z-index: 1; padding: 40px; color: #fff; max-width: 800px; }
/* Position du texte sur la couverture (grille 3×3, choisie par le photographe) */
.g-client-cover[data-cover-pos^="haut"]   { align-items: flex-start; }
.g-client-cover[data-cover-pos^="milieu"] { align-items: center; }
.g-client-cover[data-cover-pos="centre"]  { align-items: center; }
.g-client-cover[data-cover-pos^="bas"]    { align-items: flex-end; }
.g-client-cover[data-cover-pos$="gauche"] { justify-content: flex-start; }
.g-client-cover[data-cover-pos$="centre"] { justify-content: center; }
.g-client-cover[data-cover-pos$="droite"] { justify-content: flex-end; }
.g-client-cover[data-cover-pos$="gauche"] .g-client-cover-overlay { text-align: left; }
.g-client-cover[data-cover-pos$="centre"] .g-client-cover-overlay { text-align: center; }
.g-client-cover[data-cover-pos$="droite"] .g-client-cover-overlay { text-align: right; }
.g-client-cover-overlay h1 { font-family: var(--serif); font-weight: 500; font-size: 50px; letter-spacing: -0.02em; line-height: 1.05; }
.g-client-cover-overlay p { font-family: var(--serif); font-style: italic; font-size: 18px; margin-top: 8px; opacity: .92; }

@media (max-width: 860px) {
    .g-perso-grid { grid-template-columns: 1fr; }
    .g-perso-preview { position: static; }
    .g-cover-zone { grid-template-columns: 1fr; }
    .g-client-cover { height: 42vh; min-height: 240px; }
    .g-client-cover-overlay { padding: 24px; }
    .g-client-cover-overlay h1 { font-size: 32px; }
}

/* ===== Page détail v2 : barre de pilotage + onglets ===== */
.g-pilot { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; margin-bottom: 28px; }
.g-pilot-back { font-size: 14px; color: var(--brown-soft); display: inline-block; margin-bottom: 10px; }
.g-pilot-back:hover { color: var(--terra); }
.g-pilot-info h1 { font-family: var(--serif); font-weight: 500; font-size: 32px; letter-spacing: -0.02em; color: var(--ink); display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.g-pilot-meta { font-size: 14px; color: var(--brown-soft); margin-top: 6px; }
.g-pilot-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.g-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 28px; }
.g-tab-btn { font-family: var(--sans); font-size: 15px; font-weight: 600; color: var(--brown-soft); background: none; border: none; padding: 12px 18px; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .15s, border-color .15s; }
.g-tab-btn:hover { color: var(--terra); }
.g-tab-btn.active { color: var(--terra); border-bottom-color: var(--terra); }
.g-tab-panel { display: none; }
.g-tab-panel.active { display: block; animation: gFade .25s ease; }

/* Cartes réglages : titre sobre (sans serif), moins d'ombre, padding réduit */
.g-card-label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--brown-soft); margin-bottom: 16px; }
.g-reglages-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.g-reglages-grid .g-card { padding: 26px; box-shadow: var(--shadow-sm); }
.g-tab-panel[data-panel="acces"] .g-card { padding: 28px; box-shadow: var(--shadow-sm); }
.g-sep { border: none; border-top: 1px solid var(--line); margin: 24px 0; }

/* Sections / dossiers (chips) */
.g-sections-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; position: sticky; top: 0; z-index: 6; background: var(--cream); padding: 12px 0; }
.g-sec-chip { font-family: var(--sans); font-size: 14px; font-weight: 600; color: var(--brown); background: var(--white); border: 1.5px solid var(--line); padding: 8px 16px; border-radius: 100px; cursor: pointer; transition: all .15s; }
.g-sec-chip:hover { border-color: var(--terra-soft); }
.g-sec-chip.active { background: var(--terra); color: #fff; border-color: var(--terra); }
.g-sec-add { color: var(--terra); border-style: dashed; }
.g-sec-add:hover { background: var(--clay-bg); }
.g-sec-manage { display: flex; justify-content: space-between; align-items: center; background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; font-size: 14px; color: var(--ink); }
.g-sec-manage small { color: var(--brown-soft); }
.g-sec-manage form { margin: 0; }

/* Zone de danger isolée */
.g-danger-zone { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 36px; padding: 22px 26px; border: 1px solid #e3b3ab; border-radius: 14px; background: #fdf4f2; flex-wrap: wrap; }
.g-danger-zone strong { font-size: 15px; color: #c0392b; }
.g-danger-zone p { font-size: 13px; color: var(--brown); margin-top: 3px; }

/* Onglet Accès : 2 colonnes */
.g-acces-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.g-acces-grid .g-card { padding: 26px; box-shadow: var(--shadow-sm); }

/* Boutons à code couleur dans la barre de pilotage */
.g-btn-view, .g-btn-view:link, .g-btn-view:visited { background: #fff; color: var(--terra); border-color: var(--terra); }
.g-btn-view:hover { background: var(--clay-bg); color: var(--terra-deep); border-color: var(--terra-deep); }
.g-btn-publish, .g-btn-publish:link, .g-btn-publish:visited { background: #2e7d46; color: #fff; border-color: #2e7d46; }
.g-btn-publish:hover { background: #256138; border-color: #256138; color: #fff; transform: translateY(-1px); box-shadow: var(--shadow); }
.g-btn-offline, .g-btn-offline:link, .g-btn-offline:visited { background: #fff; color: #b06a1d; border-color: #d9b48a; }
.g-btn-offline:hover { background: #fbf3e7; border-color: #b06a1d; color: #b06a1d; }

/* Zone d'ajout de photos */
#addPhotosForm { padding: 24px; box-shadow: var(--shadow-sm); margin-bottom: 24px; }
#addPhotosForm .g-dropzone { margin-top: 4px; }
.g-add-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 14px; flex-wrap: wrap; }
.g-add-foot .g-dropzone-count { margin: 0; }

/* Barre de progression de l'upload */
.g-progress { margin-top: 16px; }
.g-progress-head { display: flex; justify-content: space-between; font-size: 13px; font-weight: 600; color: var(--brown); margin-bottom: 6px; }
.g-progress-track { height: 8px; border-radius: 100px; background: var(--clay-bg); overflow: hidden; }
.g-progress-bar { height: 100%; width: 0; background: linear-gradient(90deg, var(--terra), var(--terra-deep)); border-radius: 100px; transition: width .15s ease; }
.g-progress-bar.indeterminate { width: 38% !important; transition: none; animation: gIndet 1.1s ease-in-out infinite; }
@keyframes gIndet { 0% { margin-left: -40%; } 100% { margin-left: 102%; } }

/* Vignette : sélecteur de section, suppression, drag & drop */
.g-gal-photo { position: relative; }
.g-gal-photo { cursor: grab; }
.g-gal-photo.g-dragging { cursor: grabbing; }
.g-gal-photo.g-dragging { opacity: .4; }
.g-gal-photo.g-moved { animation: gMoved .6s ease; }
@keyframes gMoved { 0% { box-shadow: 0 0 0 3px #2e7d46; } 100% { box-shadow: 0 0 0 0 transparent; } }

.g-photo-sec { position: absolute; left: 8px; right: 8px; bottom: 8px; width: calc(100% - 16px); font-family: var(--sans); font-size: 12px; font-weight: 600; color: var(--ink); background: rgba(255,255,255,.92); border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; cursor: pointer; opacity: 0; transition: opacity .15s; backdrop-filter: blur(2px); }
.g-gal-photo:hover .g-photo-sec, .g-photo-sec:focus { opacity: 1; }
.g-photo-sec.g-saved { border-color: #2e7d46; color: #2e7d46; }

.g-photo-del { position: absolute; top: 8px; right: 8px; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border: none; border-radius: 8px; background: rgba(255,255,255,.92); color: #c0392b; cursor: pointer; opacity: 0; transition: opacity .15s, background .15s; backdrop-filter: blur(2px); }
.g-photo-zoom { position: absolute; top: 8px; left: 8px; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border: none; border-radius: 8px; background: rgba(255,255,255,.92); color: var(--ink); cursor: pointer; opacity: 0; transition: opacity .15s, background .15s, color .15s; backdrop-filter: blur(2px); }
.g-gal-photo:hover .g-photo-zoom { opacity: 1; }
.g-photo-zoom:hover { background: var(--terra); color: #fff; }
.g-gal-photo:hover .g-photo-del { opacity: 1; }
.g-photo-del:hover { background: #c0392b; color: #fff; }

/* Compteur de favoris (vue photographe) */
.g-photo-favcount { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; gap: 3px; background: rgba(255,255,255,.92); color: #e8568f; font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 100px; backdrop-filter: blur(2px); }

/* Pastille sur un onglet + badge inline */
.g-tab-dot { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 4px; border-radius: 100px; background: #c0392b; color: #fff; font-size: 11px; font-weight: 700; vertical-align: 1px; }
.g-inline-badge { display: inline-block; margin-left: 8px; background: #fdecea; color: #c0392b; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 100px; text-transform: none; letter-spacing: 0; }
.g-btn-sm { padding: 7px 13px; font-size: 13px; }

/* Liste des demandes de retrait */
.g-demandes { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.g-demande { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); flex-wrap: wrap; }
.g-demande.is-done { opacity: .6; }
.g-demande-info strong { font-size: 14px; color: var(--ink); }
.g-demande-meta { display: block; font-size: 12px; color: var(--brown-soft); margin-top: 2px; }
.g-demande-motif { font-size: 13px; color: var(--brown); font-style: italic; margin-top: 6px; }
.g-demande-actions { display: flex; align-items: center; gap: 12px; }
.g-demande-actions form { margin: 0; }
.g-demande-status { font-size: 12px; font-weight: 700; color: #b06a1d; }
.g-demande-status-done { color: #2e7d46; }

.g-drag-hint { font-size: 13px; color: var(--brown-soft); margin: -14px 0 22px; }

/* Chip cible de drop pendant un drag */
.g-sec-chip.g-drop-over { border-color: var(--terra); background: var(--clay-bg); color: var(--terra); border-style: dashed; transform: scale(1.08); box-shadow: 0 4px 14px -4px rgba(176, 92, 58, .5); }

@media (max-width: 860px) {
    .g-reglages-grid { grid-template-columns: 1fr; }
    .g-acces-grid { grid-template-columns: 1fr; }
    .g-pilot-actions { width: 100%; }
    .g-pilot-actions .g-btn { flex: 1; }
    .g-photo-sec, .g-photo-del, .g-photo-zoom { opacity: 1; }
}

/* ===== Page Tarifs (vitrine) ===== */
.g-tarifs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: start; max-width: 1000px; margin: 0 auto; }
.g-tarif { position: relative; background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 32px 28px; display: flex; flex-direction: column; gap: 14px; }
.g-tarif-featured { border-color: var(--terra); box-shadow: var(--shadow); }
.g-tarif-tag { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); background: var(--terra); color: #fff; font-size: 12px; font-weight: 600; padding: 6px 16px; border-radius: 100px; white-space: nowrap; }
.g-tarif-nom { font-family: var(--serif); font-size: 22px; font-weight: 500; color: var(--ink); }
.g-tarif-prix { display: flex; align-items: baseline; gap: 8px; }
.g-tarif-montant { font-family: var(--serif); font-size: 38px; font-weight: 600; color: var(--terra); }
.g-tarif-unite { font-size: 14px; color: var(--brown-soft); }
.g-tarif-desc { font-size: 14px; color: var(--brown); margin: 0; }
.g-tarif-list { list-style: none; padding: 0; margin: 4px 0 8px; display: flex; flex-direction: column; gap: 10px; }
.g-tarif-list li { position: relative; padding-left: 26px; font-size: 14px; color: var(--ink); }
.g-tarif-list li::before { content: '✓'; position: absolute; left: 0; color: var(--terra); font-weight: 700; }
.g-tarif .g-btn { margin-top: auto; }

@media (max-width: 860px) {
    .g-tarifs-grid { grid-template-columns: 1fr; max-width: 420px; }
}

/* ===== Espace photographe : table des tarifs de tirages ===== */
.g-tarif-cat-titre { font-family: var(--serif); font-weight: 500; font-size: 22px; color: var(--ink); margin: 0 0 4px; }
.g-tarif-table { width: 100%; border-collapse: collapse; font-size: 14px; margin-bottom: 8px; }
.g-tarif-table thead th { text-align: left; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--brown-soft); padding: 8px 12px; border-bottom: 1px solid var(--line); }
.g-tarif-table tbody td { padding: 10px 12px; border-bottom: 1px solid var(--line); color: var(--ink); vertical-align: middle; }
.g-tarif-table tbody tr:last-child td { border-bottom: none; }
.g-tarif-nom { font-weight: 600; }
.g-tarif-prix-input { display: inline-flex; align-items: center; gap: 6px; }
.g-tarif-prix-input input { width: 90px; border: 1.5px solid var(--line); border-radius: 8px; padding: 7px 10px; font-family: var(--sans); font-size: 14px; }
.g-tarif-prix-input input:focus { outline: none; border-color: var(--terra); }
.g-tarif-marge { font-weight: 600; }
.g-tarif-conseil { background: var(--clay-bg); border: 1px solid var(--line); border-radius: 7px; padding: 4px 9px; font-size: 13px; font-weight: 600; color: var(--terra); cursor: pointer; transition: background .15s; }
.g-tarif-conseil:hover { background: var(--terra); color: #fff; border-color: var(--terra); }
.g-tarif-pct { font-weight: 600; }

/* Barre d'application de marge en masse */
.g-marge-bar { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 20px; flex-wrap: wrap; }
.g-marge-choices { display: flex; gap: 8px; flex-wrap: wrap; }
.g-marge-btn { font-family: var(--sans); font-size: 14px; font-weight: 600; color: var(--brown); background: var(--white); border: 1.5px solid var(--line); padding: 9px 16px; border-radius: 100px; cursor: pointer; transition: all .15s; }
.g-marge-btn:hover { border-color: var(--terra-soft); color: var(--terra); }
.g-marge-btn.is-active { background: var(--terra); border-color: var(--terra); color: #fff; }

/* Onglet Ventes & tarifs (page détail galerie) */
.g-ventes-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 22px; }
.g-vente-stat { background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 20px; text-align: center; box-shadow: var(--shadow-sm); }
.g-vente-stat-val { display: block; font-family: var(--serif); font-weight: 500; font-size: 28px; color: var(--ink); }
.g-vente-stat-lbl { display: block; font-size: 13px; color: var(--brown-soft); margin-top: 4px; }
.g-ventes-empty { text-align: center; padding: 44px 24px; }
.g-ventes-empty svg { margin-bottom: 14px; }
.g-ventes-empty h3 { font-family: var(--serif); font-weight: 500; font-size: 22px; color: var(--ink); margin-bottom: 8px; }
.g-ventes-empty p { font-size: 14px; color: var(--brown-soft); max-width: 420px; margin: 0 auto; }
@media (max-width: 760px) { .g-ventes-stats { grid-template-columns: 1fr 1fr; } }

/* Liste des grilles tarifaires */
.g-grilles-list { display: flex; flex-direction: column; gap: 12px; }
.g-grille-card { display: flex; justify-content: space-between; align-items: center; gap: 16px; background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 18px 22px; flex-wrap: wrap; box-shadow: var(--shadow-sm); }
.g-grille-info h3 { font-family: var(--serif); font-weight: 500; font-size: 20px; color: var(--ink); display: flex; align-items: center; gap: 10px; }
.g-grille-info p { font-size: 13px; color: var(--brown-soft); margin-top: 3px; }
.g-grille-badge { display: inline-block; background: #eaf6ec; color: #2e6b3a; font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 100px; }
.g-grille-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.g-grille-actions form { margin: 0; }
@media (max-width: 760px) {
    .g-tarif-table { font-size: 13px; }
    .g-tarif-table thead { display: none; }
    .g-tarif-table tbody td { display: flex; justify-content: space-between; gap: 12px; padding: 7px 12px; border: none; }
    .g-tarif-table tbody tr { display: block; border: 1px solid var(--line); border-radius: 12px; padding: 8px 0; margin-bottom: 12px; }
    .g-tarif-table tbody td::before { content: attr(data-label); font-weight: 600; color: var(--brown-soft); }
}

/* ---- Bouton « recadrer » : bouton texte inline dans les options de la ligne ---- */
.g-art-act { display: inline-flex; align-items: center; gap: 4px; }
.g-art-crop-btn {
    background: none; border: 1px solid var(--line); border-radius: 100px;
    color: var(--brown-soft); cursor: pointer; padding: 5px 12px;
    display: inline-flex; align-items: center; gap: 6px;
    font-family: var(--sans); font-size: 12.5px; font-weight: 600; line-height: 1;
    transition: color .15s, border-color .15s, background .15s;
}
.g-art-crop-btn svg { flex: 0 0 auto; }
.g-art-crop-btn:hover { color: var(--terra); border-color: var(--terra-soft); }
.g-art-crop-btn.is-set { color: var(--terra); border-color: var(--terra-soft); background: var(--clay-bg); }

/* ---- Modale de recadrage (Cropper.js) ---- */
.g-crop-box { max-width: 680px; width: 96vw; max-height: 94vh; display: flex; flex-direction: column; }
.g-crop-fmt { font-family: var(--sans); font-size: 14px; font-weight: 600; color: var(--terra); margin-left: 6px; }
.g-crop-help { font-size: 13px; color: var(--brown-soft); margin: -10px 0 14px; line-height: 1.45; }
/* Sélecteur de mode : Remplir / Garder toute l'image */
.g-crop-modes { display: inline-flex; background: var(--clay-bg); border: 1px solid var(--line); border-radius: 100px; padding: 4px; gap: 2px; margin-bottom: 8px; }
.g-crop-mode { border: none; background: transparent; color: var(--brown-soft); font-family: var(--sans); font-size: 13px; font-weight: 600; padding: 7px 16px; border-radius: 100px; cursor: pointer; transition: all .15s; }
.g-crop-mode:hover { color: var(--terra); }
.g-crop-mode.is-on { background: var(--white); color: var(--ink); box-shadow: var(--shadow-sm); }
.g-crop-mode-info { font-size: 12.5px; color: var(--brown-soft); margin: 0 0 14px; line-height: 1.45; }
/* Le stage prend en JS le RATIO de la photo (ajusterStageAuRatioPhoto) → image plein cadre.
   PAS de padding ni de border-radius ici : ils rogneraient les poignées/bordures de la zone
   de recadrage dans les coins (bug « le sélecteur passe derrière le coin »).
   La hauteur ici n'est qu'un fallback avant calcul. */
.g-crop-stage { background: var(--cream-deep, #f3ece0); border-radius: 14px; min-height: 160px; max-height: 58vh; flex: 1 1 auto; width: 100%; max-width: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: center; overflow: hidden; }
/* Avant l'init Cropper, l'image brute reste bornée. */
.g-crop-stage > #cropImg { display: block; max-width: 100%; max-height: 58vh; margin: 0 auto; }
/* Cropper crée .cropper-container : il occupe tout le stage. On ne met pas overflow:hidden
   sur le stage (sinon les poignées de la crop box sont coupées) ; c'est Cropper qui borne sa zone. */
.g-crop-stage .cropper-container { max-width: 100% !important; max-height: 58vh !important; border-radius: 14px; }
/* Cadre net + poignées de la zone de recadrage (rendu soigné). */
.g-crop-stage .cropper-view-box { outline: 2px solid #fff; outline-color: rgba(255,255,255,.95); }
.g-crop-stage .cropper-line { background-color: rgba(255,255,255,.5); }
.g-crop-stage .cropper-point { background-color: #fff; width: 8px; height: 8px; opacity: 1; box-shadow: 0 0 0 1px rgba(43,32,24,.25); }
.g-crop-stage .cropper-dashed { border-color: rgba(255,255,255,.6); }
.g-crop-stage .cropper-bg { background-image: none; background: #2b2018; }
/* Mode « Garder toute l'image » : cadre au ratio du tirage, fond blanc = on voit les bandes blanches. */
.g-crop-fit-preview { background: #fff; box-shadow: 0 2px 14px rgba(43,32,24,.18); display: flex; align-items: center; justify-content: center; overflow: hidden; max-width: 100%; }
.g-crop-fit-preview[hidden] { display: none; }
.g-crop-fit-preview img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.g-crop-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 18px; }
.g-crop-actions-right { display: flex; gap: 12px; }

@media (max-width: 560px) {
    .g-crop-actions { flex-direction: column; align-items: stretch; }
    .g-crop-actions-right { flex-direction: column-reverse; }
    .g-crop-actions .g-btn, .g-crop-actions-right .g-btn { width: 100%; }
}

/* ---- Page commande (formulaire + récap) ---- */
.g-order-wrap { max-width: 1040px; margin: 0 auto; padding: 40px 22px 80px; }
.g-order-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 32px; align-items: start; margin-top: 24px; }
.g-order-sec-titre { font-family: var(--serif); font-weight: 500; font-size: 22px; color: var(--ink); margin-bottom: 18px; }
.g-order-form { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 28px; box-shadow: var(--shadow-sm); }
.g-order-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.g-field-cp { max-width: 160px; }
.g-input.is-error { border-color: #c0392b; }
.g-field-err { display: block; font-size: 12px; color: #c0392b; margin-top: 4px; }
.g-order-submit { width: 100%; margin-top: 8px; }

.g-order-recap { background: var(--clay-bg); border: 1px solid var(--line); border-radius: 18px; padding: 24px; position: sticky; top: 24px; }
.g-order-items { display: flex; flex-direction: column; gap: 14px; }
.g-order-item { display: grid; grid-template-columns: 48px 1fr auto auto; align-items: center; gap: 12px; }
/* Miniature récap au RATIO de la photo (largeur fixe, hauteur libre bornée), sans rognage. */
.g-order-thumb { width: 48px; height: auto; max-height: 64px; object-fit: contain; border-radius: 8px; background: var(--clay-bg); }
.g-order-item-info { display: flex; flex-direction: column; min-width: 0; }
.g-order-item-fmt { font-weight: 600; font-size: 14px; color: var(--ink); }
.g-order-item-meta { font-size: 12px; color: var(--brown-soft); }
.g-order-item-qte { font-size: 13px; color: var(--brown-soft); }
.g-order-item-prix { font-weight: 600; font-size: 14px; color: var(--ink); white-space: nowrap; }
.g-order-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 15px; color: var(--ink); }
.g-order-total-val { font-family: var(--serif); font-size: 26px; color: var(--terra); }

/* ---- Page de confirmation ---- */
.g-confirm-wrap { max-width: 620px; margin: 0 auto; padding: 56px 22px 80px; }
.g-confirm-card { background: var(--white); border: 1px solid var(--line); border-radius: 22px; padding: 40px; box-shadow: var(--shadow); text-align: center; }
.g-confirm-ico { display: inline-flex; color: #2e9e5b; margin-bottom: 14px; }
.g-confirm-titre { font-family: var(--serif); font-weight: 500; font-size: 28px; color: var(--ink); line-height: 1.2; margin-bottom: 12px; }
.g-confirm-ref { font-size: 15px; color: var(--ink); margin-bottom: 8px; }
.g-confirm-ref strong { font-family: var(--serif); color: var(--terra); letter-spacing: .5px; }
.g-confirm-text { font-size: 14px; color: var(--brown-soft); line-height: 1.55; margin-bottom: 24px; }
.g-confirm-items { text-align: left; margin: 22px 0; }
.g-confirm-back { margin-top: 24px; }

@media (max-width: 820px) {
    .g-order-grid { grid-template-columns: 1fr; }
    .g-order-recap { position: static; order: -1; }
}
@media (max-width: 520px) {
    .g-order-row { grid-template-columns: 1fr; }
    .g-field-cp { max-width: none; }
}

/* ===== Commandes (espace photographe) ===== */
/* Badges de statut de commande */
.g-badge-cmd-en_attente   { background: #fdf3e3; color: #9a6a1c; }
.g-badge-cmd-payee        { background: #eaf6ec; color: #2e6b3a; }
.g-badge-cmd-en_production{ background: #e8f0fb; color: #2b5b9a; }
.g-badge-cmd-expediee     { background: #e9f7f4; color: #1f7a68; }
.g-badge-cmd-annulee      { background: #fbeaea; color: #9a2e2e; }

/* Détail commande : 2 colonnes (bon de production / client+statut) */
.g-cmd-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 20px; align-items: start; margin-top: 20px; }
.g-cmd-side { display: block; }

.g-cmd-lignes { display: flex; flex-direction: column; gap: 14px; }
.g-cmd-ligne { display: grid; grid-template-columns: 56px 1fr auto auto; align-items: center; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.g-cmd-ligne:last-child { border-bottom: none; padding-bottom: 0; }
.g-cmd-thumb { width: 56px; height: auto; max-height: 72px; object-fit: contain; border-radius: 8px; background: var(--clay-bg); }
.g-cmd-ligne-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.g-cmd-ligne-fmt { font-weight: 600; color: var(--ink); }
.g-cmd-ligne-meta { font-size: 13px; color: var(--brown-soft); }
.g-cmd-ligne-crop { font-size: 11px; color: var(--brown-soft); opacity: .8; font-variant-numeric: tabular-nums; }
.g-cmd-ligne-qte { font-size: 14px; color: var(--brown-soft); white-space: nowrap; }
.g-cmd-ligne-prix { text-align: right; white-space: nowrap; }
.g-cmd-prix-vente { display: block; font-weight: 700; color: var(--ink); }
.g-cmd-prix-labo { display: block; font-size: 12px; color: var(--brown-soft); }
.g-cmd-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 16px; padding-top: 14px; border-top: 2px solid var(--line); font-size: 15px; color: var(--ink); }
.g-cmd-total-val { font-family: var(--serif); font-size: 24px; color: var(--terra); }
.g-cmd-note { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.g-cmd-note p { font-size: 14px; color: var(--ink); margin-top: 6px; line-height: 1.5; }
.g-cmd-client { font-size: 14px; color: var(--ink); line-height: 1.55; margin-top: 6px; }
.g-cmd-statut-form { display: flex; gap: 10px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.g-cmd-statut-form .g-input { flex: 1 1 auto; min-width: 0; }

@media (max-width: 860px) {
    .g-cmd-grid { grid-template-columns: 1fr; }
    .g-cmd-ligne { grid-template-columns: 48px 1fr auto; }
    .g-cmd-ligne-prix { grid-column: 2 / -1; text-align: left; }
}

/* Lightbox : affichage progressif flou -> net */
#lbImg, #studioLbImg { transition: filter .35s ease; max-width: none; max-height: none; }
.g-lb-loading { filter: blur(6px); }

/* Spinner lightbox (pendant le chargement de la version nette) */
.g-lb-spin { position: fixed; top: 50%; left: 50%; width: 38px; height: 38px; margin: -19px 0 0 -19px; border: 3px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: gspin .8s linear infinite; pointer-events: none; z-index: 210; }
.g-lb-spin[hidden] { display: none; }

/* ===== Filigrane : aperçu (page Protection des photos) ===== */
.g-wm-preview { position:relative; aspect-ratio:3/2; border-radius:12px; overflow:hidden; background:#1a1a1a; }
.g-wm-preview.g-wm-mini { border-radius:10px; }
.g-wm-photo { position:absolute; inset:0; background:linear-gradient(135deg,#7d99b6 0%,#46627e 36%,#2b3a4d 70%,#b08763 100%); }
.g-wm-photo::after { content:''; position:absolute; inset:0; background:
    radial-gradient(circle at 24% 28%, rgba(255,255,255,.30), transparent 42%),
    radial-gradient(circle at 80% 78%, rgba(0,0,0,.32), transparent 48%); }
.g-wm-layer { position:absolute; inset:0; pointer-events:none; }
.g-wm-text { font-weight:800; letter-spacing:.06em; white-space:nowrap; opacity:var(--wm-op,.38); display:inline-block; font-size:calc(var(--wm-scale,80) * 0.55px); }
.g-wm-img  { opacity:var(--wm-op,.38); filter:drop-shadow(0 2px 6px rgba(0,0,0,.4)); display:block; width:calc(var(--wm-scale,80) * 0.85%); }
.g-wm-col-clair  .g-wm-text { color:#fff;     text-shadow:0 2px 6px rgba(0,0,0,.5); }
.g-wm-col-sombre .g-wm-text { color:#15110d; text-shadow:0 1px 4px rgba(255,255,255,.45); }

/* disposition simple : un wrapper placé, texte/image tourné à l'intérieur */
.g-wm-disp-simple .g-wm-tiles { display:none; }
.g-wm-single { position:absolute; }
.g-wm-single .g-wm-text, .g-wm-single .g-wm-img { transform:rotate(var(--wm-rot,-30deg)); transform-origin:center; }
.g-wm-place-centre      .g-wm-single { left:50%; top:50%; transform:translate(-50%,-50%); }
.g-wm-place-haut-gauche .g-wm-single { left:6%;  top:9%; }
.g-wm-place-haut-droite .g-wm-single { right:6%; top:9%; }
.g-wm-place-bas-gauche  .g-wm-single { left:6%;  bottom:9%; }
.g-wm-place-bas-droite  .g-wm-single { right:6%; bottom:9%; }

/* disposition mosaïque : tuiles répétées, rotation portée par le conteneur */
.g-wm-disp-mosaique .g-wm-single { display:none; }
.g-wm-disp-mosaique .g-wm-tiles { position:absolute; inset:-40%; display:flex; flex-wrap:wrap; align-content:center; justify-content:center; transform:rotate(var(--wm-rot,-30deg)); gap:calc(var(--wm-gap,35) * 0.5px) calc(var(--wm-gap,35) * 1.3px); }
.g-wm-disp-mosaique .g-wm-tiles .g-wm-text { transform:none; font-size:calc(var(--wm-scale,80) * 0.3px); }

/* ===== Interrupteur (switch) — global espace ===== */
label.g-switch { display:inline-flex; align-items:center; gap:11px; cursor:pointer; font-size:14px; font-weight:500; color:var(--brown); width:fit-content; position:relative; user-select:none; margin-bottom:0; }
.g-switch input { position:absolute; opacity:0; width:0; height:0; margin:0; pointer-events:none; }
.g-switch-track { display:block; flex:0 0 auto; width:42px; height:24px; border-radius:999px; background:var(--cream-deep); border:1px solid var(--line); position:relative; transition:background .2s; }
.g-switch-track::after { content:''; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(43,32,24,.3); transition:transform .2s; }
.g-switch input:checked + .g-switch-track { background:var(--terra); border-color:var(--terra); }
.g-switch input:checked + .g-switch-track::after { transform:translateX(18px); }
.g-switch input:focus-visible + .g-switch-track { outline:2px solid var(--terra); outline-offset:2px; }

/* Explication de la durée d'hébergement (wizard) */
.g-duree-info { margin-top: 16px; background: var(--cream); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; }
.g-duree-info-head { font-weight: 600; color: var(--ink); font-size: 14px; margin: 0 0 12px; }
.g-duree-info ul { list-style: none; padding: 0; margin: 0 0 12px; display: grid; gap: 11px; }
.g-duree-info li { display: flex; gap: 10px; font-size: 13px; line-height: 1.5; color: var(--brown); }
.g-duree-info li svg { flex: none; color: var(--terra); margin-top: 1px; }
.g-duree-info li strong { color: var(--ink); font-weight: 600; }

/* ===== Aperçu wizard étape 5 : vraie galerie masonry + filigrane par photo ===== */
.g-pv2-wrap { background:#f2eadf; border-radius:16px; padding:16px; }
.g-pv2-wrap[data-bg="dark"] { background:#1a1410; }
.g-pv2-head { display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:12px; }
.g-pv2-title { font-family:var(--serif); font-weight:500; font-size:18px; color:var(--ink); }
.g-pv2-wrap[data-bg="dark"] .g-pv2-title { color:#f3e9dd; }
.g-pv2-date { font-size:12px; color:var(--brown-soft); white-space:nowrap; }
.g-pv2 { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.g-pv2[data-gap="none"] { gap:0; } .g-pv2[data-gap="tight"] { gap:4px; } .g-pv2[data-gap="wide"] { gap:14px; }
.g-pv2-item { position:relative; overflow:hidden; line-height:0; }
.g-pv2-item img { width:100%; height:100%; object-fit:cover; display:block; }
/* grid : carrés réguliers */
.g-pv2[data-layout="grid"] .g-pv2-item { aspect-ratio:1; }
/* rows : format paysage régulier */
.g-pv2[data-layout="rows"] .g-pv2-item { aspect-ratio:3 / 2; }
/* masonry : colonnes Pinterest, ratios naturels */
.g-pv2[data-layout="masonry"] { display:block; column-count:3; column-gap:8px; }
.g-pv2[data-layout="masonry"][data-gap="none"] { column-gap:0; } .g-pv2[data-layout="masonry"][data-gap="tight"] { column-gap:4px; } .g-pv2[data-layout="masonry"][data-gap="wide"] { column-gap:14px; }
.g-pv2[data-layout="masonry"] .g-pv2-item { break-inside:avoid; -webkit-column-break-inside:avoid; margin-bottom:8px; }
.g-pv2[data-layout="masonry"][data-gap="none"] .g-pv2-item { margin-bottom:0; } .g-pv2[data-layout="masonry"][data-gap="tight"] .g-pv2-item { margin-bottom:4px; } .g-pv2[data-layout="masonry"][data-gap="wide"] .g-pv2-item { margin-bottom:14px; }
.g-pv2[data-layout="masonry"] .g-pv2-item img { height:auto; }
/* justified : lignes ajustées (hauteur fixe, largeur selon ratio) */
.g-pv2[data-layout="justified"] { display:flex; flex-wrap:wrap; }
.g-pv2[data-layout="justified"] .g-pv2-item { height:72px; flex:var(--rr,1.4) 1 calc(var(--rr,1.4) * 72px); }
/* magazine : grille dense, 1re photo en grand */
.g-pv2[data-layout="magazine"] { grid-template-columns:repeat(3,1fr); grid-auto-flow:dense; }
.g-pv2[data-layout="magazine"] .g-pv2-item { aspect-ratio:1; }
.g-pv2[data-layout="magazine"] .g-pv2-item:first-child { grid-column:span 2; grid-row:span 2; }
/* hero : une grande photo par ligne */
.g-pv2[data-layout="hero"] { grid-template-columns:1fr; }
.g-pv2[data-layout="hero"] .g-pv2-item { aspect-ratio:16 / 10; }
.g-pv2[data-round="petit"] .g-pv2-item { border-radius:6px; } .g-pv2[data-round="moyen"] .g-pv2-item { border-radius:11px; } .g-pv2[data-round="grand"] .g-pv2-item { border-radius:18px; }
.g-pv2-wm { position:absolute; inset:-25%; display:flex; flex-wrap:wrap; align-content:center; justify-content:center; gap:9px 20px; transform:rotate(-24deg); pointer-events:none; }
.g-pv2-wm b { font-size:9.5px; font-weight:800; color:rgba(255,255,255,.72); letter-spacing:.04em; white-space:nowrap; text-shadow:0 1px 2px rgba(0,0,0,.55); }
.g-pv2-empty { font-size:13px; color:var(--brown-soft); text-align:center; padding:28px 0; margin:0; }
.g-pv2-wmnote { display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--brown); margin:12px 0 0; }
.g-pv2-wmnote svg { color:var(--terra); flex:none; }
.g-dropzone-err { border-color:#c0392b !important; background:#fdf3f1; }
.g-photo-err { color:#c0392b; font-weight:600; }
.g-state-ic { width: 86px; height: 86px; margin: 0 auto 18px; display:flex; align-items:center; justify-content:center; background:#f6efe4; border-radius:50%; color:var(--brown); }
.g-acces-back { display:inline-block; margin-top:14px; font-size:13.5px; color:var(--brown-soft); text-decoration:none; }
.g-acces-back:hover { color:var(--terra); text-decoration:underline; }
.g-client-tab.is-locked { color: var(--brown-soft); }
.g-client-tab.is-locked:hover { color: var(--terra); border-color: var(--terra-soft); }
.g-tab-lock { flex: none; }
.g-tab-lock { vertical-align:-1px; margin-left:4px; opacity:.7; }
.g-chap-panel { background: var(--white); border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; margin-bottom: 22px; }
.g-chap-panel-head { display:flex; flex-direction:column; gap:2px; margin-bottom:12px; }
.g-chap-panel-title { font-family: var(--serif); font-weight:500; font-size:17px; color: var(--ink); }
.g-chap-panel-head small { font-size:12.5px; color: var(--brown-soft); }
.g-chap-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(252px, 1fr)); gap:12px; }
.g-chap-manage { display:flex; align-items:center; gap:12px; border:1px solid var(--line); border-radius:14px; padding:10px; background:var(--white); transition: border-color .15s, transform .15s, box-shadow .15s; }
.g-chap-manage:hover { border-color:var(--terra-soft); box-shadow:0 8px 20px -12px rgba(0,0,0,.3); transform:translateY(-1px); }
.g-chap-cover { flex:none; width:52px; height:52px; border-radius:10px; overflow:hidden; background:var(--cream-deep); display:flex; align-items:center; justify-content:center; color:var(--brown-soft); }
.g-chap-cover img { width:100%; height:100%; object-fit:cover; display:block; }
.g-chap-info { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.g-chap-name { font-weight:700; color:var(--ink); font-size:14.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.g-chap-sub { display:flex; align-items:center; gap:5px; font-size:12.5px; color:var(--brown-soft); }
.g-chap-pad { display:inline-flex; align-items:center; color:var(--brown-soft); }
.g-chap-pad.is-locked { color:var(--terra); }
.g-chap-count { font-weight:700; color:var(--brown); }
.g-chap-edit { flex:none; width:34px; height:34px; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:9px; background:var(--white); color:var(--brown); cursor:pointer; transition:all .15s; }
.g-chap-edit:hover { border-color:var(--terra); color:#fff; background:var(--terra); }
.g-suppr-ic { width:54px; height:54px; margin:0 auto 10px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#fbeae6; color:#c0392b; }
.g-btn-danger { background:#c0392b; color:#fff; border:1px solid #c0392b; }
.g-btn-danger:hover { background:#a93226; border-color:#a93226; }
.g-chap-manage.g-drop-over { border-color: var(--terra); border-style: dashed; background: var(--clay-bg); transform: scale(1.03); box-shadow: 0 6px 18px -6px rgba(176,92,58,.5); }
.g-btn-sm { padding:7px 14px; font-size:13px; }
.g-drag-ghost { position: fixed; z-index: 9999; pointer-events: none; width: 96px; height: 96px; opacity: .92; border-radius: 10px; overflow: hidden; box-shadow: 0 14px 32px rgba(0,0,0,.42); transform: translate(-50%, -50%); }
.g-drag-ghost img { width:100%; height:100%; object-fit: cover; }
.g-drag-ghost .g-photo-del, .g-drag-ghost .g-photo-sec, .g-drag-ghost .g-photo-favcount, .g-drag-ghost .g-photo-zoom { display:none !important; }
.g-cartp-list { display:flex; flex-direction:column; gap:14px; }
.g-cartp-photo { display:flex; gap:14px; background:var(--white); border:1px solid var(--line); border-radius:14px; padding:12px; }
.g-cartp-thumb { width:90px; height:90px; object-fit:cover; border-radius:10px; flex:none; }
.g-cartp-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:8px; }
.g-cartp-name { font-weight:600; color:var(--ink); font-size:14px; }
.g-cartp-line { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.g-cartp-prod { flex:1; min-width:120px; font-size:14px; color:var(--brown); }
.g-cartp-prod small { color:var(--brown-soft); }
.g-cartp-crop { font-size:11px; color:var(--terra); border:1px solid var(--terra-soft); border-radius:100px; padding:1px 7px; }
.g-cartp-qty { display:flex; align-items:center; gap:8px; }
.g-cartp-qty button { width:26px; height:26px; border:1px solid var(--line); background:var(--white); border-radius:7px; cursor:pointer; font-size:15px; }
.g-cartp-prix { font-weight:700; color:var(--ink); min-width:70px; text-align:right; }
.g-cartp-del { border:none; background:none; color:var(--brown-soft); font-size:18px; cursor:pointer; line-height:1; }
.g-cartp-del:hover { color:#c0392b; }
.g-cartp-foot { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:22px; padding-top:18px; border-top:1px solid var(--line); flex-wrap:wrap; }
.g-cartp-total { font-size:17px; color:var(--brown); }
.g-pickprod-cat { margin-bottom:16px; }
.g-pickprod-cattitle { font-weight:700; color:var(--ink); font-size:14px; margin-bottom:8px; }
.g-pickprod-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(140px,1fr)); gap:10px; }
.g-pickprod { display:flex; flex-direction:column; align-items:flex-start; gap:3px; text-align:left; border:1px solid var(--line); border-radius:11px; background:var(--white); padding:10px; cursor:pointer; transition:border-color .15s, box-shadow .15s; }
.g-pickprod:hover { border-color:var(--terra); box-shadow:0 6px 16px -10px rgba(0,0,0,.3); }
.g-pickprod-img { width:100%; height:80px; object-fit:cover; border-radius:7px; margin-bottom:4px; }
.g-pickprod-nom { font-weight:600; font-size:13.5px; color:var(--ink); }
.g-pickprod-dim { font-size:11.5px; color:var(--brown-soft); }
.g-pickprod-prix { font-weight:700; color:var(--terra); font-size:14px; }
.g-cartp-totals { display:flex; flex-direction:column; gap:5px; min-width:220px; }
.g-cartp-tline { display:flex; justify-content:space-between; gap:24px; font-size:14px; color:var(--brown); }
.g-cartp-tgrand { font-size:17px; font-weight:700; color:var(--ink); border-top:1px solid var(--line); padding-top:7px; margin-top:3px; }
.g-order-subline { display:flex; justify-content:space-between; gap:16px; font-size:13.5px; color:var(--brown); padding:3px 0; }


/* ===== Indicateurs de paiement (espace photographe) ===== */
.g-cmd-pay{display:flex;align-items:center;gap:8px;font-size:14px;margin:2px 0 4px;}
.g-cmd-pay svg{flex:0 0 auto;}
.g-cmd-pay-ok{color:#2e7d46;}
.g-cmd-pay-wait{color:#b9722a;}
.g-cmd-pay-ko{color:#c0392b;}
.g-pay-dot{font-size:10px;margin-left:6px;vertical-align:middle;line-height:1;}
.g-pay-dot-ok{color:#2e7d46;}
.g-pay-dot-wait{color:#d39a3e;}

.g-sec-fav-export{margin-left:auto;display:inline-flex;align-items:center;gap:5px;text-decoration:none;border-color:var(--terra);color:var(--terra);}
.g-sec-fav-export:hover{background:var(--terra);color:#fff;}


/* ===== Affichage client « par chapitre » : dossiers ===== */
.g-albums{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;padding:14px 24px 8px;max-width:1080px;margin:0 auto;}
.g-album{width:230px;max-width:46vw;}
.g-album{display:flex;flex-direction:column;text-align:left;background:none;border:none;padding:0;cursor:pointer;font:inherit;color:inherit;}
.g-album-cover{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:#ece7e1;box-shadow:0 2px 10px rgba(0,0,0,.07);transition:transform .18s ease,box-shadow .18s ease;}
.g-album:hover .g-album-cover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(0,0,0,.14);}
/* photo entière (ratio respecté, aucune coupe) sur fond flou de la même image */
.g-album-blur{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;filter:blur(16px) brightness(.9);transform:scale(1.12);z-index:0;}
.g-album-cover img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;display:block;}
.g-album-lock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(28,24,20,.45);color:#fff;backdrop-filter:blur(2px);}
/* Badge nombre de favoris de l'album (haut-droite de la vignette) */
.g-album-fav{position:absolute;top:10px;right:10px;z-index:3;display:inline-flex;align-items:center;gap:4px;padding:4px 9px;border-radius:100px;background:rgba(43,32,24,.62);backdrop-filter:blur(4px);color:#fff;font-size:12.5px;font-weight:600;line-height:1;box-shadow:0 2px 8px rgba(0,0,0,.18);}
.g-album-fav svg{width:13px;height:13px;color:#ff6b6b;flex:0 0 auto;}
.g-album-fav[hidden]{display:none;}
.g-album.is-locked .g-album-cover{background:#d9d2ca;}
.g-album-meta{display:flex;flex-direction:column;gap:2px;padding:10px 4px 0;}
.g-album-name{font-family:'Fraunces',serif;font-size:17px;font-weight:500;color:var(--ink,#1c1814);}
.g-album-count{font-size:12.5px;color:#998f84;}
.g-chap-head{display:flex;align-items:center;gap:16px;margin:6px 0 14px;padding:0 24px;}
.g-chap-head[hidden]{display:none;}
.g-chap-back{display:inline-flex;align-items:center;gap:5px;background:none;border:1px solid var(--line,#e5ded6);border-radius:999px;padding:7px 14px;font:inherit;font-size:14px;color:var(--ink,#1c1814);cursor:pointer;transition:background .15s ease;}
.g-chap-back:hover{background:#f3efe9;}
.g-chap-head-title{font-family:'Fraunces',serif;font-weight:500;font-size:22px;margin:0;color:var(--ink,#1c1814);}

/* ===== Sélecteur de couverture (espace photographe) ===== */
.g-cover-pick{display:flex;align-items:center;gap:10px;}
.g-cover-prev{flex:0 0 auto;width:54px;height:40px;border-radius:8px;overflow:hidden;background:#ece7e1;display:flex;align-items:center;justify-content:center;color:#b3a99d;}
.g-cover-prev img{width:100%;height:100%;object-fit:cover;display:block;}
.g-cover-pick .g-input{flex:1;}

.g-chap-cover{position:relative;border:none;padding:0;cursor:pointer;}
.g-chap-cover:hover{filter:brightness(.95);}
.g-chap-cover-add{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);white-space:nowrap;font-size:10.5px;font-weight:600;color:#fff;background:var(--terra);border-radius:999px;padding:2px 8px;box-shadow:0 1px 4px rgba(0,0,0,.25);}

/* Espace garanti sous la grille avant le pied de page (la hauteur est figée en JS en justified/masonry). */
.g-client-grid{margin-bottom:40px;}
@media (max-width: 680px){ .g-chap-head{padding:0 12px;} .g-albums{padding-left:12px;padding-right:12px;} .g-client-grid{margin-bottom:28px;} }
