/* ===== Bundle (Base + Theme Redesign) ===== */
/* ======================================================
   Base CSS — Theme-Ready Core
   Version: 1.1
   Author: https://en-vy.me
   (Provides core layout & components; themes will override layout)
====================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
:root{
  --font-sans: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji",sans-serif;
  --font-serif: Georgia,"Times New Roman",Times,serif;
  --font-mono: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;

  --bg:#ffffff; --text:#111827; --muted:#6b7280;
  --card:#ffffff; --elev:#ffffff; --border:#e5e7eb;

  --primary:#2563eb; --primary-contrast:#ffffff;
  --secondary:#9333ea; --success:#16a34a; --error:#dc2626;

  --glass-bg:rgba(255,255,255,.65);
  --backdrop-blur:12px;

  --radius-xs:10px; --radius:14px; --radius-lg:22px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.06);
  --shadow-md:0 8px 24px rgba(0,0,0,.08);
  --shadow-lg:0 12px 40px rgba(0,0,0,.12);

  --container:min(1120px,92vw); --grid-gap:32px; --line:1.5;
  --focus-ring:0 0 0 3px rgba(37,99,235,.3);
  --nav-height:72px; --order-btn-size:56px;
}
body{margin:0;font:16px/var(--line) var(--font-sans);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--primary);text-decoration:none} a:hover{text-decoration:underline}
img{max-width:100%;display:block}
.container{width:var(--container);margin-inline:auto;padding-inline:16px}
.site-header{position:sticky;top:0;z-index:40;background:var(--glass-bg);backdrop-filter:blur(var(--backdrop-blur));border-bottom:1px solid var(--border)}
.header-inner{height:var(--nav-height);display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:16px}
.brand{font-weight:800;letter-spacing:.2px;display:flex;align-items:center;gap:.25rem;color:var(--text)}
.blinking-dot{color:var(--primary);animation:blink 1.6s infinite}
@keyframes blink{0%,70%,100%{opacity:1}80%{opacity:.1}}
.icon-btn,.nav-contact,.theme-icon,.btn{border:1px solid var(--border);background:var(--card);border-radius:var(--radius-xs);padding:10px 12px;display:inline-flex;align-items:center;gap:8px;box-shadow:var(--shadow-sm)}
.icon-btn{cursor:pointer}
.icon-btn:focus-visible,.nav-contact:focus-visible,.btn:focus-visible,.contact-link:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.nav{display:flex}.nav-list{display:flex;list-style:none;margin:0;padding:0;gap:16px}
.nav-list a{color:var(--text);padding:8px 10px;border-radius:8px}
.nav-list a:hover{background:color-mix(in srgb,var(--primary) 8%,transparent);text-decoration:none}
.nav-contact{background:var(--primary);color:var(--primary-contrast);border-color:transparent}
.nav-contact:hover{filter:brightness(.95);text-decoration:none}
.theme-switcher{display:flex;gap:6px;align-items:center}
.theme-icon{cursor:pointer;width:36px;height:36px;justify-content:center}
.theme-icon[aria-pressed="true"]{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--card))}
#menu-toggle{display:none}
@media (max-width:860px){
  .header-inner{grid-template-columns:auto auto 1fr auto}
  .nav{position:absolute;top:calc(var(--nav-height) + 8px);right:12px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px;box-shadow:var(--shadow-lg);display:none}
  #menu-toggle{display:inline-flex}
  #menu-toggle[aria-expanded="true"] ~ .nav{display:block}
}
.success-banner,.error-banner{position:sticky;top:0;z-index:50;padding:10px 0;border-bottom:1px solid var(--border)}
.success-banner{background:color-mix(in srgb,var(--success) 10%,var(--bg))}
.error-banner{background:color-mix(in srgb,var(--error) 10%,var(--bg))}
.success-content,.error-content{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
.btn-close-banner{background:transparent;border-color:transparent}
.site-container{padding:clamp(24px,3vw,48px) 0}
.content-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--grid-gap);align-items:start}
@media (max-width:980px){.content-grid{grid-template-columns:1fr}}
.image-container{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-md)}
.image-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;opacity:0;transition:.25s ease;text-shadow:0 2px 12px rgba(0,0,0,.4);background:linear-gradient(to bottom,rgba(0,0,0,.05),rgba(0,0,0,.25))}
.image-container:hover .image-overlay{opacity:1}
.content-wrapper{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(20px,2.4vw,32px);box-shadow:var(--shadow-md)}
.header-content h1{font-size:clamp(28px,4vw,48px);line-height:1.1;margin:0 0 8px}
.header-content h2{font-size:clamp(18px,2.6vw,24px);color:var(--muted);font-weight:500;margin:0 0 18px}
.services-content{margin:16px 0 24px}
.editable-wysiwyg p{margin:0 0 12px}
.editable-wysiwyg ul{margin:0 0 12px 1.1em}
.contact-content{border-top:1px dashed var(--border);padding-top:16px;display:grid;gap:18px}
.contact-info{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;align-items:start}
@media (max-width:720px){.contact-info{grid-template-columns:1fr}}
.contact-links{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}
.contact-link{border:1px dashed var(--border);padding:10px 12px;border-radius:999px;display:inline-flex;align-items:center;gap:8px;color:var(--text);text-decoration:none}
.contact-link.phone{background:color-mix(in srgb,var(--primary) 8%,transparent)}
.contact-link.email{background:color-mix(in srgb,var(--secondary) 8%,transparent)}
.company-number{color:var(--muted);font-size:.95rem}
.credits a{color:inherit;text-decoration:underline dotted}
.btn{cursor:pointer}
.btn-primary{background:var(--primary);color:var(--primary-contrast);border-color:transparent}
.btn-primary:hover{filter:brightness(.96)}
.btn-secondary{background:var(--card)}
.btn-success{background:var(--success);color:#fff;border-color:transparent}
.btn-admin-access{background:linear-gradient(135deg,var(--primary),color-mix(in srgb,var(--primary) 60%,black));color:#fff;border:none}
.order-button{position:fixed;z-index:45;right:clamp(12px,2vw,24px);bottom:clamp(12px,2vw,24px);height:var(--order-btn-size);padding-inline:18px;border-radius:999px;background:var(--primary);color:var(--primary-contrast);border:none;box-shadow:var(--shadow-lg)}
.order-button:hover{transform:translateY(-1px)} .order-button:active{transform:translateY(0)}
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:24px;background:color-mix(in srgb,#000 35%,transparent);z-index:60}
.modal.open{display:flex}
.modal-content{width:min(720px,96vw);background:var(--card);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-lg)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--border)}
.modal-close{background:transparent;border:none;cursor:pointer}
.order-form{padding:18px;display:grid;gap:16px}
.form-group label{display:block;font-weight:600;margin-bottom:6px}
.form-group input,.form-group textarea,.form-group select{width:100%;border:1px solid var(--border);border-radius:10px;padding:12px;background:var(--elev);color:var(--text)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:640px){.form-row{grid-template-columns:1fr}}
.form-note{color:var(--muted);font-size:.9rem}
.domain-container{display:flex;gap:8px;align-items:center}
.domain-result{margin-top:6px;padding:8px 10px;border-radius:8px;border:1px dashed var(--border);background:color-mix(in srgb,var(--primary) 6%,transparent)}
.admin-account-section{border:1px dashed var(--border);border-radius:12px;padding:12px;background:color-mix(in srgb,var(--primary) 3%,transparent)}
.section-info{color:var(--muted);margin:0 0 8px}
.account-benefits{display:flex;flex-wrap:wrap;gap:10px}
.benefit-item{display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;border:1px solid var(--border);background:var(--card)}
.form-actions{display:flex;justify-content:end;gap:10px}
.save-panel{position:fixed;left:50%;transform:translateX(-50%);bottom:12px;z-index:55;display:none;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:999px;padding:8px;box-shadow:var(--shadow-lg)}
.save-panel.visible{display:flex}
.nav-toggle,.edit-toggle{position:fixed;left:12px;z-index:45;border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-md);border-radius:999px;padding:10px 12px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.nav-toggle{bottom:12px}.edit-toggle{bottom:72px}
[contenteditable="true"],.editable-text[contenteditable="true"],.editable-wysiwyg[contenteditable="true"]{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 50%,transparent) inset;border-radius:6px;padding-inline:2px}
.material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 500,'GRAD' 0,'opsz' 24}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ======================================================
   Theme — Photo Focus (full-bleed image header)
   Version: 1.3
   Author: https://en-vy.me
   Concept: image plein-largeur en tête; contenu en colonnes sous l'image.
====================================================== */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;700;800&display=swap');
:root{
  --font-sans:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;
  --bg:#0a0a0a; --text:#eaeaea; --muted:#b3b3b3;
  --card:#111; --elev:#0e0e0e; --border:#222;
  --primary:#ffffff; --primary-contrast:#0a0a0a; --secondary:#7dd3fc;
  --radius:8px; --radius-lg:10px; --shadow-md:0 0 0 rgba(0,0,0,0);
}
.content-grid{grid-template-areas:"img img" "content content";grid-template-columns:1fr 1fr;gap:28px}
.image-section{grid-area:img}
.content-section{grid-area:content}
.image-container{height:46vh;border-radius:0;border:none;box-shadow:none}
.image-container img{object-fit:cover;width:100%;height:100%}
.content-wrapper{background:transparent;border:none;padding-top:0}
.services-content{column-width:380px;column-gap:32px}
.nav-contact{background:#fff;color:#000;border-color:#fff}
.order-button{background:#fff;color:#000;border:1px solid #222}
