/* Référence visuelle fournie : cette feuille n'est chargée qu'à 800px maximum. */
body.reno-reference-mobile { background:#101110; }
.reno-reference-mobile .hero,
.reno-reference-mobile .contact-hero,
.reno-reference-mobile #accueil.hero-redesign { background:radial-gradient(circle at 12% 35%,#1c1e1c 0%,#101110 65%); padding-bottom:24px; }
.reno-reference-mobile .contact-hero { padding-top:18px; }
.reno-reference-mobile .reno-service-intro,
.reno-reference-mobile #accueil .reno-mobile-intro { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); }
.reno-reference-mobile .reno-service-slideshow,
.reno-reference-mobile #accueil .hero-image { aspect-ratio:1.25; border:1px solid rgba(197,166,74,.55)!important; border-radius:8px!important; box-shadow:none!important; }
.reno-reference-mobile .reno-service-nav a,
.reno-reference-mobile #accueil .side-nav > a { font-family:Arial,Helvetica,sans-serif; font-size:10.5px; font-weight:700; letter-spacing:1.2px; }
.reno-reference-mobile .reno-service-nav a::before,
.reno-reference-mobile #accueil .side-nav > a::before { content:none!important; }
.reno-reference-mobile .reno-service-actions .btn,
.reno-reference-mobile #accueil .actions .cta { font-size:11px; font-weight:500; min-height:48px; background:linear-gradient(120deg,#f0d585,#ffe37a)!important; box-shadow:0 3px 13px rgba(197,166,74,.12)!important; }
.reno-reference-mobile .reno-service-google,
.reno-reference-mobile #accueil .google-premium { border-radius:8px; background:linear-gradient(135deg,#1c1e1c,#101110); min-height:72px; box-shadow:none; }
.reno-reference-mobile .reno-service-google .g,
.reno-reference-mobile #accueil .google-premium .g { background:#fff; color:#4285f4; border:2px solid #c5a64a; box-shadow:0 0 0 3px rgba(197,166,74,.18); }
.reno-reference-mobile #accueil .slide-counter,
.reno-reference-mobile .reno-service-counter { display:none; }
.reno-reference-mobile .hero-title h1 { font-size:clamp(27px,7.7vw,34px); line-height:1.14; }
/* Accueil : photos, titres et boutons séparés, comme dans la référence. */
.reno-reference-mobile #prestations .services { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px 8px; }
.reno-reference-mobile #prestations .services .service { border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; overflow:visible; transform:none; }
.reno-reference-mobile #prestations .services .service > img { width:100%!important; height:auto!important; aspect-ratio:1.1; object-fit:cover!important; clip-path:none; margin-bottom:0; border-radius:7px; }
.reno-reference-mobile #prestations .services .service[href="serrurerie.html"] > img { aspect-ratio:.99; clip-path:inset(0 0 10% 0); margin-bottom:-10.10101%; }
.reno-reference-mobile #prestations .services .service > div { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(34px,1fr) 36px; min-height:0!important; padding:5px 0 0!important; gap:5px; background:transparent!important; border:0; backdrop-filter:none; }
.reno-reference-mobile #prestations .v55-icon { display:none; }
.reno-reference-mobile #prestations .services .service h3 { font:600 12px/1.25 Arial,sans-serif!important; color:#f7f0e3!important; }
.reno-reference-mobile #prestations .services .v56-discover { width:100%; min-height:36px; padding:6px 2px; font:700 8.5px/1.2 Arial,sans-serif; letter-spacing:.1px; border-radius:4px; background:transparent; }
.reno-reference-mobile #prestations .services .service:hover .v56-discover,
.reno-reference-mobile #prestations .services .service:focus-visible .v56-discover { background:#e4ca79; color:#171612; }
.reno-reference-mobile #prestations .service:hover > img { box-shadow:0 0 16px rgba(197,166,74,.35); }
.reno-reference-mobile #prestations .heading { margin-bottom:18px; }
.reno-reference-mobile #prestations .heading h2 { font-size:30px; }
.reno-reference-mobile #prestations .heading p { font-size:13px; }
.reno-reference-mobile .reno-reference-intro { padding-top:24px; text-align:center; }
.reno-reference-mobile .reno-reference-intro .eyebrow { font-size:9px; letter-spacing:1.5px; }
.reno-reference-mobile .reno-reference-intro p { font-size:13px; line-height:1.5; }
.reno-reference-mobile #main > .section,
.reno-reference-mobile main.reno-compact .section,
.reno-reference-mobile main.reno-compact .paint-section { background:#101110; padding-top:24px; padding-bottom:24px; border-top:1px solid rgba(197,166,74,.18); }
.reno-reference-mobile #main h2 { font-size:28px; }
.reno-reference-mobile #main .benefits { grid-template-columns:repeat(2,minmax(0,1fr)); }
.reno-reference-mobile #main .benefit { padding:16px 10px; }
.reno-reference-mobile #main .benefit h3 { font-size:17px; }
.reno-reference-mobile #main .gallery { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:none; }
.reno-reference-mobile #main .gallery img,
.reno-reference-mobile #main .gallery .tall { grid-column:auto; grid-row:auto; width:100%; height:auto; aspect-ratio:1.05; object-fit:cover; }
/* Trois points de savoir-faire ouverts et séparés par de fins traits verticaux. */
.reno-reference-mobile main.reno-compact .reno-summary-cards { gap:0; margin:0; padding:4px 0 14px; }
.reno-reference-mobile main.reno-compact .reno-summary-card { display:flex; flex-direction:column; align-items:center; padding:0 9px; border:0; border-right:1px solid rgba(197,166,74,.25); border-radius:0; background:none; box-shadow:none!important; text-align:center; transform:none; }
.reno-reference-mobile main.reno-compact .reno-summary-card:last-child { border-right:0; }
.reno-reference-mobile main.reno-compact .reno-summary-mark { display:none; }
.reno-reference-mobile .reno-reference-icon { display:block; width:30px; height:30px; margin:0 0 10px; color:#C5A64A; }
.reno-reference-mobile .reno-reference-icon svg { width:100%; height:100%; }
.reno-reference-mobile main.reno-compact .reno-summary-card h3 { min-height:0; margin:0 0 6px; font:700 13.5px/1.25 Arial,sans-serif; color:#f7f0e3; }
.reno-reference-mobile main.reno-compact .reno-summary-card p { font-size:12.5px; line-height:1.4; color:#f7f0e3; }
.reno-reference-mobile .reno-reference-details { margin-top:8px; font-size:12px; color:#b4b1a9; }
.reno-reference-mobile .reno-reference-details summary { cursor:pointer; padding:8px 0; }
.reno-reference-mobile .reno-reference-details .center { padding:8px 0; }
.reno-reference-mobile main.reno-compact .gallery a,
.reno-reference-mobile main.reno-compact #galerie .gallery a { aspect-ratio:1.05; border-radius:7px!important; }
.reno-reference-mobile .reno-reference-extra { display:none!important; }
.reno-reference-mobile .reno-reference-expanded > .reno-reference-extra { display:block!important; }
.reno-reference-mobile .reno-reference-more { appearance:none; display:flex; align-items:center; justify-content:center; width:calc(100% - 20px); min-height:46px; margin:22px auto 0; padding:12px 16px; font:500 12px/1.4 Arial,sans-serif; color:#251d0a; background:linear-gradient(120deg,#f0d585,#ffe37a); border:1px solid #ffe37a; border-radius:7px; box-shadow:0 3px 13px rgba(197,166,74,.12); cursor:pointer; }
.reno-reference-mobile main.reno-compact #galerie > .wrap > .center > .eyebrow { display:none; }
.reno-reference-mobile main.reno-compact #galerie > .wrap > .center > h2 { font:700 11px/1.5 Arial,sans-serif; letter-spacing:1.8px; text-transform:uppercase; color:#C5A64A; margin:0 0 10px; }
/* Contact et À propos : même langage visuel, avec leur contenu et formulaire. */
.reno-reference-mobile .about-intro,
.reno-reference-mobile .about-panels,
.reno-reference-mobile .about-cta,
.reno-reference-mobile .contact-main,
.reno-reference-mobile .contact-google,
.reno-reference-mobile .contact-heading { padding-top:28px; padding-bottom:28px; background:#101110; }
.reno-reference-mobile .about-title h1 { font-size:30px; }
.reno-reference-mobile .about-panels h2,
.reno-reference-mobile .about-cta h2,
.reno-reference-mobile .contact-info h2,
.reno-reference-mobile .contact-form-wrap h2 { font-size:27px; }
.reno-reference-mobile .contact-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.reno-reference-mobile .contact-gallery a,
.reno-reference-mobile .contact-gallery a:first-child { grid-column:auto; height:auto; aspect-ratio:1.05; }
.reno-reference-mobile .contact-field input,
.reno-reference-mobile .contact-field textarea,
.reno-reference-mobile .contact-field select { font-size:16px; }
