/* Artisan Bony — V3 : même site que la V2, couleurs du logo (blanc, orange #FD5A01, noir #1F1F1F). 21/10/2026.
   Ce fichier se charge APRÈS style.css et pages.css et ne fait que recolorer. */
:root {
  --bg: #ffffff; --ink: #1a1a1a; --ink-2: rgba(26,26,26,.72); --ink-3: rgba(26,26,26,.5);
  --gold: #fd5a01; --gold-2: #e65000; --line: rgba(26,26,26,.13);
  --orange: #fd5a01; --orange-d: #d94c00; --noir: #1f1f1f;
}
::selection { background: rgba(253,90,1,.25); }
html { background: #fff; }

/* fond derrière la scène 3D : blanc chaud, plus de photo sombre */
.bg { background: radial-gradient(120% 95% at 62% 38%, #ffffff 0%, #f5f3ef 55%, #e9e6e1 100%); }
.bg picture, .bg img, .bg-veil { display: none; }
@media (max-width: 820px) { .bg { background: radial-gradient(140% 80% at 50% 30%, #ffffff 0%, #f4f2ee 60%, #e8e5e0 100%); } }

/* logo */
.brand-logo { gap: 12px; }
.brand-logo img { height: 44px; width: auto; display: block; }
.brand-logo b { font-family: 'Oswald', var(--sans); font-weight: 700; font-size: 19px; letter-spacing: .06em; color: var(--noir); }
.brand-logo b em { font-style: normal; color: var(--orange); }
.brand-logo small { color: var(--ink-3); }
#loader .loader-logo { width: 150px; height: auto; display: block; }
#loader b { display: none; }
.foot-logo { width: 120px; height: auto; display: block; margin-bottom: 16px; }

/* barre du haut, menu */
.top::after { background: linear-gradient(90deg, rgba(26,26,26,.16), rgba(26,26,26,.04)); }
.top.solid, body.past-3d .top { background: rgba(255,255,255,.92); box-shadow: 0 1px 0 rgba(26,26,26,.08); }
.film, .call { border-color: rgba(26,26,26,.22); background: rgba(255,255,255,.7); color: var(--noir); }
.film:hover, .call:hover { border-color: var(--orange); }
.burger { border-color: rgba(26,26,26,.22); background: rgba(255,255,255,.7); }
.menu { background: rgba(255,255,255,.98); }
.menu > a { color: var(--noir); }

/* boutons */
.btn-primary { background: var(--noir); color: #fff; border-color: var(--noir); }
.btn-primary:hover { background: var(--orange); border-color: var(--orange); color: #fff; }
.btn-ghost { border-color: rgba(26,26,26,.26); color: var(--noir); background: rgba(255,255,255,.65); }
.btn-ghost:hover { border-color: var(--orange); color: var(--orange-d); }

/* scène 3D : panneaux, curseurs */
.title em, .s-hero h1 em, .sec-title em { color: var(--orange); }
.lead strong { color: var(--noir); font-weight: 500; }
.slider input::-webkit-slider-thumb { background: var(--noir); }
.rail button { background: rgba(26,26,26,.22); }
.rail button.is-on { background: var(--orange); box-shadow: 0 0 0 3px rgba(253,90,1,.2); }
.sw i { box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), inset -6px -8px 14px rgba(0,0,0,.18); }
@media (max-width: 820px) {
  .panel::before { background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.82) 30%, rgba(255,255,255,.97) 100%); }
}

/* formulaires */
.form input, .form select, .form textarea { border-bottom-color: rgba(26,26,26,.25); }
.form select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23fd5a01' stroke-width='1.5'/%3E%3C/svg%3E"); }
.tel, .contact .tel { color: var(--orange); }
.modal-close { background: rgba(0,0,0,.45); }

/* sections de contenu */
#contenu::before { background: linear-gradient(180deg, rgba(255,255,255,0), #fff); }
.ba-tab.is-on { background: var(--noir); color: #fff; border-color: var(--noir); }
.compare, .vid, .work { background: #ece9e4; }
.compare .knob svg { stroke: var(--noir); }
.compare .lab { background: rgba(26,26,26,.6); }
.stats b { color: var(--orange); }
.svc { background: #2a2a2a; }
.svc::after { background: linear-gradient(180deg, rgba(20,20,20,.02) 30%, rgba(20,20,20,.88) 100%); }
.svc i, .svc .go { color: #ff8a47; }
.towns li.main { border-color: var(--orange); }
.why { background: rgba(253,90,1,.06); border-left-color: var(--orange); }
.points li::before, .steps li::before { color: var(--orange); }
.steps li { border-top-color: var(--orange); }
.faq summary::after { color: var(--orange); }

/* sections sur photo ou vidéo : texte clair conservé */
.dm, .dm-stage { --ink: #ffffff; --ink-2: rgba(255,255,255,.85); --ink-3: rgba(255,255,255,.6); --line: rgba(255,255,255,.2); color: #fff; }
.dm .sec-title em { color: #ff8a47; }
.dm .kicker { color: #ff8a47; } .dm .kicker::before { background: #ff8a47; }
.dm-stage .sec-title { color: #fff; }

/* pages services : héros photo avec voile blanc, texte noir */
.s-hero:not(.is-3d)::after { background: linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.15) 26%, rgba(255,255,255,.88) 56%, #fff 100%); }
@media (min-width: 821px) {
  .s-hero:not(.is-3d)::after { background: linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.82) 42%, rgba(255,255,255,.1) 100%), linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,0) 30%); }
}
.s-hero .lead { color: var(--ink-2); }
.crumbs a { color: var(--ink-2); }

/* urgence : orange du logo */
.urgence { background: linear-gradient(90deg, var(--orange-d), var(--orange)); box-shadow: 0 10px 30px -12px rgba(253,90,1,.65); }
.urg-nav { background: var(--orange); }
.foot-urg { color: #ff8a47; }

/* pied de page noir, barre mobile blanche */
.foot { background: #151515; color: rgba(255,255,255,.6); --ink: #ffffff; --ink-2: rgba(255,255,255,.75); --ink-3: rgba(255,255,255,.5); --line: rgba(255,255,255,.14); }
.foot a { color: rgba(255,255,255,.8); }
.foot a:hover { color: var(--orange); }
.mbar { background: rgba(255,255,255,.92); border-color: rgba(26,26,26,.12); box-shadow: 0 10px 30px -10px rgba(0,0,0,.25); }
.mbar .call { background: var(--noir); color: #fff; }
.mbar .call-in small { color: #ff8a47; }
.mbar .quote { border-color: rgba(26,26,26,.25); color: var(--noir); }

@media (max-width: 820px) {
  .brand-logo { gap: 8px; }
  .brand-logo img { height: 28px; }
  .brand-logo b { font-size: 15px; letter-spacing: .05em; white-space: nowrap; }
  .film { white-space: nowrap; }
}
@media (max-width: 370px) { .brand-logo b { font-size: 13px; } .brand-logo img { height: 24px; } }
