/* Mobileria Vali — Palette B « Pierre & noyer » — load after styles.css + pages.css */
:root{
 --r-sm:18px;--r-md:28px;--r-lg:36px;
 --ink:#2B2927;          /* anthracite: dark bg + text (on off-white 12.76) */
 --cream:#F4F0EA;        /* off-white */
 --section:#D8D0C4;      /* greige; anthracite text 9.48 */
 --accent-on-dark:#C8B49B;  /* noyer clair on anthracite 7.22 */
 --accent-on-light:#5C3F2C; /* noyer: off-white 8.40, greige 6.24 */
 --red:var(--accent-on-light);
 --sage:#6E7A6C;         /* sauge-gris: filets/décor only (3.97 ≥ 3:1 non-text) */
 --muted-aa:#5E564E;     /* off-white 5.69+, greige 4.71 */
 --soft-on-dark:#B9B0A5; /* on anthracite 6.77 */
 --line:rgba(43,41,39,.16);--line-dark:#45413D;
 --band:#5C3F2C;--band-fg:#F4F0EA; /* 8.40 */
 --btn-bg:#5C3F2C;--btn-fg:#F4F0EA;--btn-hover:#4D3424; /* 8.40 */
 --btn-dark-bg:#C8B49B;--btn-dark-fg:#2B2927;          /* 7.22 */
 --wa:var(--btn-bg);--viber:var(--btn-bg)}
.material-strip,.showroom-detail{border-color:var(--sage)}
.eyebrow-line{background:var(--sage)}
/* ---- shared rules (A & B) — loaded LAST ---- */
body{background:var(--cream);color:var(--ink)}
/* Logo VALI: only place red lives — red pastille, white letters (6.18:1) */
.brand-mark{background:#C0162E;color:#FFFFFF!important;padding:6px 8px 4px 6px;letter-spacing:-.08em;line-height:1}
.brand-mark span{color:#FFFFFF!important}
/* dark contexts use the light accent */
.announcement,.site-header,.hero,.statement,.page-hero,.steps,.mobile-menu,.site-footer,.mobile-contact,.dark{--red:var(--accent-on-dark)}
.announcement{background:var(--band);color:var(--band-fg)}.announcement-dot{background:var(--accent-on-dark)}
.site-header,.page-hero,.steps,.statement,.site-footer,.mobile-menu{background-color:var(--ink)}
.statement-bg{background:linear-gradient(90deg,var(--ink) 0%,color-mix(in srgb,var(--ink) 88%,transparent) 48%,color-mix(in srgb,var(--ink) 35%,transparent) 100%),url('assets/img/kuzhine-e-erret-me-ndricim-1090.webp') center/cover}
.hero{background:var(--ink)}
/* light text colours */
.intro-copy>p:not(.lead),.showroom-copy>p,.contact-right p{color:var(--muted-aa)}
.collection-meta,.section-kicker,.gallery-note,.showroom-detail small,.contact-right small{color:var(--muted-aa)}
.steps .section-kicker,.foot-col h2,.foot-tag,.copyright a,.footer-links a,.copyright{color:var(--soft-on-dark)}
.showroom,.gallery{background:var(--section)}
.mosaic figure{background:var(--section)}
/* buttons: one system for every CTA incl. WhatsApp / Viber */
.button-red,.button-wa,.button-viber,.contact-message{background:var(--btn-bg);color:var(--btn-fg)}
.button-red:hover,.button-wa:hover,.button-viber:hover{background:var(--btn-hover)}
.hero .button-red,.statement .button-red,.page-hero .button-red,.page-hero .button-wa,.page-hero .button-viber,.steps .button-red{background:var(--btn-dark-bg);color:var(--btn-dark-fg)}
.button-outline{border-color:var(--ink)}
.button-ghost{border-color:var(--accent-on-dark)}
.button-wa::before,.button-viber::before,.mobile-wa::before,.mobile-viber::before{content:"";width:16px;height:16px;flex:none;margin-right:8px;background:currentColor;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
.button-wa,.mobile-wa{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.2s-1 .3-3.5-.7-4-3.6-4.2-3.8-1-1.3-1-2.5.6-1.8.9-2.1.5-.3.7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .5l-.4.6-.4.4c-.1.2-.3.3-.1.6s.8 1.3 1.7 2.1c1.2 1 2.1 1.3 2.4 1.5s.5.1.6-.1l.9-1c.2-.3.4-.2.6-.1l2 .9c.3.1.4.2.5.3s.1.8-.1 1.4z'/%3E%3C/svg%3E")}
.button-viber,.mobile-viber{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.4 1C7 1.1 3 2.6 2.4 7.6 2 10.5 2 14 3.3 16.8c.6 1.3 1.6 2 2.7 2.4V23l3.3-3.3c2.6.3 5.2.1 7.7-.7 4-1.4 4.7-5 4.8-8.7.1-3.3-.4-6.3-3.3-8.1C16.9 1.3 14.2 1 11.4 1zm4.2 14.2c-.6.6-1.5 1-2.3.6-3-1.3-5.5-3.6-6.9-6.6-.4-.9 0-1.8.6-2.4.4-.4 1-.4 1.4 0l1.1 1.4c.3.4.3 1-.1 1.3l-.4.3c.6 1.6 1.8 2.8 3.4 3.4l.3-.4c.3-.4.9-.5 1.3-.1l1.4 1.1c.5.4.5 1 .2 1.4zM12 4.5a6.6 6.6 0 0 1 6.5 6.6h-1.2A5.4 5.4 0 0 0 12 5.7z'/%3E%3C/svg%3E")}
.mobile-contact{background:color-mix(in srgb,var(--ink) 96%,transparent);border-color:var(--line-dark)}
.mobile-wa,.mobile-viber{background:var(--btn-dark-bg)!important;color:var(--btn-dark-fg)!important}
.mobile-call{border-color:var(--line-dark);color:var(--cream)}
.mobile-menu>a,.step-row,.step-row div,.mobile-menu .menu-lang a{border-color:var(--line-dark)}
.copyright{border-color:var(--line-dark)}
::selection{background:var(--accent-on-light);color:var(--cream)}
/* ---- Ajustements Vali (site-v2) ---- */
/* 1) Fond foncé : boutons et barre mobile clairs ; #C8B49B réservé au mot accentué et aux liens */
:root{--btn-dark-bg:#F4F0EA;--btn-dark-fg:#2B2927;--btn-dark-hover:#E6DFD5}
.hero .button-red,.statement .button-red,.page-hero .button-red,.page-hero .button-wa,.page-hero .button-viber,.steps .button-red,.contact .button-red,.header-cta{background:var(--btn-dark-bg)!important;color:var(--btn-dark-fg)!important}
.hero .button-red:hover,.statement .button-red:hover,.page-hero .button-red:hover,.page-hero .button-wa:hover,.page-hero .button-viber:hover,.steps .button-red:hover,.header-cta:hover{background:var(--btn-dark-hover)!important}
.mobile-wa,.mobile-viber{background:var(--btn-dark-bg)!important;color:var(--btn-dark-fg)!important}
.mobile-wa:hover,.mobile-viber:hover{background:var(--btn-dark-hover)!important}
.page-hero .button-ghost{border-color:#F4F0EA;color:#F4F0EA}
.site-header a:not(.header-cta):not(.brand),.page-hero .crumbs a,.site-footer a,.mobile-menu a,.statement a:not(.button){color:var(--accent-on-dark)}
.hero p.display em,.page-hero p.display em,.page-hero h1 em,.hero h1 em,.statement h2 span{color:var(--accent-on-dark)}
.ed-display em,.ed-h2 em{color:var(--accent-on-light)}
.ed-proc .ed-h2 em,.ed-proc .ed-display em{color:var(--accent-on-dark)}
/* 2) Hero mobile accueil : recadrage pour masquer le tapis rouge et le texte incrusté en bas à droite */
@media(max-width:650px){.hero-image{background-size:auto 138%;background-position:28% 18%}}