/* ==========================================================================
   MARTORANO Architecture : site.css (Nicolam Studio)
   Un registre éditorial, sobre et haut de gamme : fond crème, grandes images, beaucoup de vide,
   un rouge profond qui n'intervient que sur les actions. Les rendus 3D portent la couleur.
   Aucune bibliothèque CSS chargée : tout le style du site vit dans cette feuille.
   ========================================================================== */

/* ---------- Polices hébergées sur le site (aucun appel à Google Fonts) : Bodoni Moda 700, Inter 400 et 500, latin ---------- */
@font-face{ font-family:"Bodoni Moda"; font-style:normal; font-weight:700; font-display:swap; src:url("assets/fonts/bodoni-moda-700-latin.woff2") format("woff2"); }
@font-face{ font-family:"Inter"; font-style:normal; font-weight:400; font-display:swap; src:url("assets/fonts/inter-400-latin.woff2") format("woff2"); }
@font-face{ font-family:"Inter"; font-style:normal; font-weight:500; font-display:swap; src:url("assets/fonts/inter-500-latin.woff2") format("woff2"); }

/* ---------- Tokens (Invariants du prompt) ---------- */
:root{
  /* Couleurs : deux teintes par couleur */
  --fond:#FAF7F4;               /* A : crème, jamais blanc pur ; footer uni */
  --B:#F2E1DF;                  /* B : l'accent en faible opacité sur le crème (teinte claire) : fonds, placeholders, mer de la carte */
  --accent:#A30001;             /* CTA, liens actifs, sur-titres (prélevé sur le logo) */
  --accent-soutenu:#6E0000;     /* second point du dégradé signature */
  --texte:#1A1512;              /* quasi-noir chaud */
  --secondaire:#8A817B;         /* filets et bordures */
  --ink-2:#6B635E;              /* texte secondaire : le gris chaud assombri, même teinte (5,5:1 sur A, 4,65:1 sur B) */
  --or:#F2B01E;                 /* UN seul or, celui des étoiles Google, uniquement pour la note Google */
  --card:#FFFDFA;               /* surface des cartes, distincte du fond de section */
  --grad:linear-gradient(90deg,#A30001,#6E0000);   /* dégradé signature, en touches seulement */
  --note:#A30001; --suggestion:#9A6512; --suggestion-txt:#875810;
  --error:#B42318;
  --hairline:rgba(26,21,18,.14);
  /* Espacements : échelle unique */
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:48px; --s6:64px; --s7:96px; --s8:128px;
  /* Rayons : registre architectural */
  --radius:2px; --r-pill:999px;
  /* Conteneurs */
  --container:1200px; --container-header:1320px; --faq-max:760px; --pad:24px;
  /* Barre d'annonce + header */
  --ann-h:40px; --hdr-h:88px; --stack-h:calc(var(--ann-h) + var(--hdr-h));
  /* Typographie */
  --f-title:"Bodoni Moda",Didot,Georgia,serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fs-h1-home:clamp(2.5rem,5.4vw,4.5rem);
  --fs-h1:clamp(2.125rem,4.4vw,3.5rem);
  --fs-h2:clamp(1.875rem,3.4vw,2.75rem);
  --fs-h3:clamp(1.25rem,1.9vw,1.5rem);
  --fs-lead:clamp(1.0625rem,1.3vw,1.25rem);
  --fs-body:1rem;
  --fs-over:.75rem;
  --fs-stat:clamp(2rem,3.4vw,2.75rem);
  --fs-caption:.875rem;
  /* Ombre : une seule pour tout le site, brun chaud, niveau discret */
  --sh-card:0 1px 2px rgba(74,44,34,.06),0 4px 12px rgba(74,44,34,.07),inset 0 1px 0 rgba(255,252,247,.7);
  --sh-soft:0 1px 2px rgba(74,44,34,.05),0 2px 8px rgba(74,44,34,.05);
  /* Mouvement : ease-in-out partout ; 0,4 s est le minimum (états .6 s, apparition .9 s, dépliage du header .5 s, FAQ .4 s) */
  --ease:ease-in-out; --dur:.6s; --dur-in:.9s; --dur-open:.5s; --dur-faq:.4s;
  /* Tickers : exactement les mêmes réglages pour les deux (barre d'annonce, avis) */
  --tk-lead:96px; --tk-gap:24px; --tk-fade:24px;
}
@media (max-width:1023px){ :root{ --hdr-h:76px; } }
@media (max-width:767px){ :root{ --pad:16px; --tk-fade:16px; --tk-gap:16px; --hdr-h:68px; } }

/* ---------- Base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; -webkit-tap-highlight-color:transparent; scroll-behavior:smooth; scroll-padding-top:calc(var(--hdr-h) + 24px); }
body{ margin:0; background:var(--fond); color:var(--texte); overflow-x:clip; font-family:var(--f-body);
  font-size:var(--fs-body); line-height:1.6; -webkit-font-smoothing:antialiased; }
img{ max-width:100%; height:auto; display:block; }
svg{ display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; letter-spacing:inherit; color:inherit; background:transparent; border:0; padding:0; margin:0; cursor:pointer; }
h1,h2,h3,h4,p,ul,ol,figure{ margin:0; }
ul,ol{ padding:0; }
p{ text-wrap:pretty; }
[hidden]{ display:none !important; }
::selection{ background:var(--accent); color:var(--fond); }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }
.visually-hidden{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.nw{ white-space:nowrap; }

/* Titres en Bodoni Moda 700 (la graisse 700 tient sur le crème) ; aligné à gauche : pretty ; balance seulement sur un titre centré */
h1,h2,h3{ font-family:var(--f-title); font-weight:700; color:var(--texte); text-wrap:pretty; letter-spacing:-.02em; }
.center h2,.hero h1,.phero h1,.ctafull h2{ text-wrap:balance; }
h1{ font-size:var(--fs-h1); line-height:1.12; }
h2{ font-size:var(--fs-h2); line-height:1.2; }
h3{ font-size:var(--fs-h3); line-height:1.25; letter-spacing:-.01em; }
h4{ font-family:var(--f-body); font-weight:500; }
.eyebrow{ display:inline-block; font-family:var(--f-body); font-weight:500; font-size:var(--fs-over); line-height:1.4;
  letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
.lead{ font-size:var(--fs-lead); line-height:1.6; color:var(--ink-2); }

/* ---------- Layout ---------- */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--pad); }
.section{ position:relative; isolation:isolate; padding:96px 0; }
.section > .container{ position:relative; z-index:1; }
/* grain 3 % sur les fonds de section uniquement ; les composants restent lisses au-dessus */
.section::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.section.is-tight{ padding-top:48px; }   /* deux sections d'un même thème se lisent comme un tout */
@media (max-width:767px){ .section{ padding-block:64px; } .section.is-tight{ padding-top:32px; } }
/* flux des fonds : A = #FAF7F4, B = #F2E1DF (attribués par flow() au build, bords calés) */
.bg-ab{ background:linear-gradient(180deg,#FAF7F4,#F2E1DF); }
.bg-ba{ background:linear-gradient(180deg,#F2E1DF,#FAF7F4); }
.bg-aba{ background:linear-gradient(180deg,#FAF7F4,#F2E1DF 50%,#FAF7F4); }
.bg-bab{ background:linear-gradient(180deg,#F2E1DF,#FAF7F4 50%,#F2E1DF); }

.shead{ display:flex; flex-direction:column; align-items:flex-start; gap:16px; margin-bottom:48px; }
.shead .lead{ max-width:none; }
.shead.center{ align-items:center; text-align:center; }
.shead.center .lead{ max-width:62rem; margin-inline:auto; text-wrap:balance; }
@media (max-width:767px){ .shead{ margin-bottom:32px; } }

/* ---------- Icônes ---------- */
.ic{ width:20px; height:20px; flex:0 0 auto; }

/* ---------- Boutons : deux niveaux (plein, ghost bordé), jamais de bouton sans bordure ; coins nets 2px, icône à droite dans la couleur du libellé ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; padding:12px 24px;
  border-radius:var(--radius); border:1.5px solid transparent; white-space:nowrap; font-family:var(--f-body);
  font-weight:500; font-size:1rem; line-height:1.2; cursor:pointer;
  transition:transform var(--dur) var(--ease),background-color var(--dur) var(--ease),
    box-shadow var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease); }
.btn .ic{ width:18px; height:18px; transition:transform var(--dur) var(--ease); }
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0) scale(.985); }
.btn--primary{ background:var(--accent); color:var(--fond); box-shadow:0 1px 2px rgba(74,44,34,.12); }
.btn--primary:hover{ background:#8C0001; box-shadow:0 6px 16px rgba(110,0,0,.22); }   /* un cran plus bas dans l'échelle de l'accent */
.btn--primary:active{ background:#7A0000; }
.btn--ghost{ color:var(--accent); border-color:var(--accent); background:transparent; }   /* bordure 1,5px franche */
.btn--ghost:hover{ background:rgba(163,0,1,.06); }
.btn--ghost:active{ background:rgba(163,0,1,.1); }

/* ---------- Barre d'annonce : dégradé vertical de l'accent (haut plus clair → bas plus foncé), opaque, sans lien ---------- */
.annonce{ position:relative; z-index:51; height:var(--ann-h); display:flex; align-items:center; overflow:hidden;
  background:linear-gradient(180deg,#B8191A 0%,#A30001 55%,#8E0001 100%); color:var(--fond); }
.annonce__in{ width:100%; max-width:var(--container-header); margin-inline:auto; padding-inline:var(--pad); overflow:hidden; }
.annonce .tk{ justify-content:center; }
.annonce__set{ list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:var(--tk-gap); flex:0 0 auto; }
.annonce li{ display:inline-flex; align-items:center; gap:8px; font-size:.875rem; font-weight:500; line-height:1; white-space:nowrap; }
.annonce li .ic{ width:16px; height:16px; }
.annonce li.sep{ opacity:.7; }
.annonce .tk > .annonce__set[aria-hidden]{ display:none; }
@media (max-width:679px){   /* bascule mesurée sur la ligne réelle (676px nécessaires, voir site.js BP_ANN) : en dessous, ticker, vide de lecture devant CHAQUE copie */
  .annonce__in{ padding-inline:0;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--tk-fade),#000 calc(100% - var(--tk-fade)),transparent);
    mask-image:linear-gradient(90deg,transparent,#000 var(--tk-fade),#000 calc(100% - var(--tk-fade)),transparent); }
  .annonce .tk{ justify-content:flex-start; width:max-content; }
  .annonce .tk > .annonce__set[aria-hidden]{ display:flex; }
  .annonce__set{ padding-left:var(--tk-lead); }
}

/* ---------- Ticker (mécanique commune) ---------- */
.tk{ display:flex; }
.tk.run{ animation:tk var(--tk-dur,30s) linear infinite; will-change:transform; }
.tk.paused{ animation-play-state:paused; }
@keyframes tk{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.tk__set{ display:flex; gap:var(--tk-gap); padding-left:var(--tk-lead); flex:0 0 auto; }
.tk-mask{ -webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--tk-fade),#000 calc(100% - var(--tk-fade)),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 var(--tk-fade),#000 calc(100% - var(--tk-fade)),transparent); }

/* ---------- Header : verre crème densifié, un seul état, séparation par l'ombre seule ---------- */
.hdr{ position:sticky; top:0; z-index:50; }
.hdr__bar{ position:relative; height:var(--hdr-h);
  background:linear-gradient(180deg,rgba(250,247,244,.94),rgba(250,247,244,.78));
  -webkit-backdrop-filter:blur(14px) saturate(1.2); backdrop-filter:blur(14px) saturate(1.2);
  box-shadow:0 1px 2px rgba(74,44,34,.06),0 8px 22px rgba(74,44,34,.07); }
.hdr__bar::after{ content:""; position:absolute; inset:0; background:var(--fond); opacity:0; pointer-events:none;
  transition:opacity var(--dur-open) var(--ease); }
.hdr.is-open .hdr__bar::after{ opacity:1; }
.hdr__bar > .container{ max-width:var(--container-header); height:100%; display:flex; align-items:center; gap:24px;
  flex-wrap:nowrap; position:relative; z-index:1; }
.hdr__logo{ flex:0 0 auto; display:flex; align-items:center; min-height:44px; transition:opacity var(--dur) var(--ease); }
.hdr__logo:hover{ opacity:.85; }
.hdr__img{ width:auto; height:60px; border-radius:var(--radius); }
.nav{ display:flex; align-items:center; gap:4px; margin-inline:auto; flex-wrap:nowrap; }
.nav__link{ display:inline-flex; align-items:center; gap:6px; flex:0 0 auto; white-space:nowrap; min-height:44px;
  padding:10px 16px; border-radius:var(--radius); font-weight:500; font-size:1rem; color:var(--texte); position:relative;
  transition:color var(--dur) var(--ease),background-color var(--dur) var(--ease); }
.nav__link:hover{ background:rgba(163,0,1,.06); color:var(--accent); }
/* lien actif : en accent et souligné d'un filet, jamais par la couleur seule */
.nav__link[aria-current="page"],.nav__toggle[data-current]{ color:var(--accent); }
.nav__link::after{ content:""; position:absolute; left:16px; right:16px; bottom:6px; height:1.5px; background:var(--accent);
  transform:scaleX(0); transition:transform var(--dur) var(--ease); }
.nav__link[aria-current="page"]::after,.nav__toggle[data-current]::after{ transform:scaleX(1); }
.nav__toggle[data-current]::after{ right:38px; }
.nav__link .ic{ width:16px; height:16px; transition:transform var(--dur) var(--ease); }
.nav__has{ position:relative; }
.nav__toggle[aria-expanded="true"] .ic{ transform:rotate(180deg); }
/* overlay desktop : fond plein, titre + description empilés, aucune icône devant les sous-liens */
.submenu{ position:absolute; top:calc(50% + var(--hdr-h) / 2 + 8px); left:50%; min-width:400px; padding:8px; display:flex; flex-direction:column; gap:2px;
  background:var(--fond); border-radius:var(--radius); box-shadow:var(--sh-card);
  opacity:0; visibility:hidden; transform:translate(-50%,6px);
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease),visibility var(--dur) var(--ease); }
.submenu::before{ content:""; position:absolute; left:0; right:0; top:-40px; height:40px; }
.nav__has:hover .submenu,.submenu.is-open{ opacity:1; visibility:visible; transform:translate(-50%,0); }
.submenu a{ display:block; padding:12px 16px; border-radius:var(--radius); color:var(--texte);
  transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease); }
.submenu a:hover,.submenu a[aria-current]{ background:var(--B); }
.submenu a:hover .submenu__t,.submenu a[aria-current] .submenu__t{ color:var(--accent); }
.submenu__t{ display:block; font-weight:500; font-size:1rem; line-height:1.35; white-space:nowrap; transition:color var(--dur) var(--ease); }
.submenu__d{ display:block; margin-top:2px; font-size:var(--fs-caption); line-height:1.45; color:var(--ink-2); white-space:nowrap; }
.hdr__cta{ flex:0 0 auto; }
.burger{ display:none; flex:0 0 auto; margin-left:auto; width:44px; height:44px; border-radius:var(--radius);
  border:1.5px solid rgba(26,21,18,.22); align-items:center; justify-content:center; color:var(--texte);
  transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease); }
.burger:hover{ background:rgba(163,0,1,.06); border-color:var(--accent); color:var(--accent); }
.burger .ic{ width:22px; height:22px; }
.burger .ic-x,.hdr.is-open .burger .ic-menu{ display:none; }
.hdr.is-open .burger .ic-x{ display:block; }
.hdr__panel{ display:none; }
@media (max-width:1023px){ .hdr__img{ height:52px; } }
@media (max-width:767px){ .hdr__img{ height:46px; } }
@media (max-width:989px){   /* bascule burger mesurée sur le contenu réel du header : 980px nécessaires (logo + nav + CTA + gouttières), voir site.js BP_NAV */
  .nav,.hdr__cta{ display:none; }
  .burger{ display:inline-flex; }
  /* le panneau se déplie et se replie à sa hauteur exacte (grid-template-rows 0fr → 1fr) */
  .hdr__panel{ display:grid; grid-template-rows:0fr; position:absolute; top:100%; left:0; right:0; z-index:2; background:var(--fond);
    box-shadow:0 12px 24px rgba(74,44,34,.10); visibility:hidden;
    transition:grid-template-rows var(--dur-open) var(--ease),visibility 0s linear var(--dur-open); }
  .hdr.is-open .hdr__panel{ grid-template-rows:1fr; visibility:visible; transition:grid-template-rows var(--dur-open) var(--ease),visibility 0s; }
  .hdr__scroll{ min-height:0; max-height:calc(100svh - var(--stack-h)); overflow:hidden; }
  .hdr.is-open .hdr__scroll{ overflow-y:auto; }
  .hdr__panel .container{ display:flex; flex-direction:column; gap:4px; padding-block:16px 32px; }
  .hdr__panel a:not(.btn),.macc__btn{ display:flex; align-items:center; min-height:48px; padding:12px 8px; border-radius:var(--radius);
    font-weight:500; font-size:1.0625rem; color:var(--texte); text-align:left;
    transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),padding-left var(--dur) var(--ease); }
  .hdr__panel a:not(.btn):hover,.macc__btn:hover{ background:var(--B); color:var(--accent); padding-left:14px; }
  .hdr__panel a[aria-current]:not(.btn),.macc__btn[data-current]{ color:var(--accent); }
  .macc__btn{ width:100%; justify-content:space-between; }
  .macc__btn .ic{ width:18px; height:18px; transition:transform var(--dur-open) var(--ease); }
  .macc.is-open .macc__btn .ic{ transform:rotate(180deg); }
  .macc__panel{ display:grid; grid-template-rows:0fr; visibility:hidden;
    transition:grid-template-rows var(--dur-open) var(--ease),visibility var(--dur-open) var(--ease); }
  .macc.is-open .macc__panel{ grid-template-rows:1fr; visibility:visible; }
  .macc__in{ overflow:hidden; min-height:0; display:flex; flex-direction:column; }
  /* sous-liens alignés à gauche comme les liens de premier niveau, en retrait ; le titre seul, sans description */
  .hdr__panel .macc__in a:not(.btn){ padding-left:24px; font-size:1rem; }
  .hdr__panel .macc__in a:not(.btn):hover{ padding-left:30px; }
  .hdr__panel .hdr__tel{ font-variant-numeric:tabular-nums; }
  .hdr__panel .btn{ margin-top:16px; align-self:stretch; }
}

/* ---------- Hero d'accueil : vraie image en plein cadre, voile sombre chaud ancré au centre, contenu centré ---------- */
.hero{ position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center; justify-content:center;
  text-align:center; min-height:calc(100svh - var(--stack-h)); padding:96px var(--pad); color:var(--fond); }
.hero__media{ position:absolute; inset:0; z-index:-2; background:#2A221D; }
.hero__media picture{ position:absolute; inset:0; }
.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:center; }
/* voile tiré du texte #1A1512 : plus dense au centre, derrière le texte ; contraste du texte mesuré sur les vrais pixels */
.hero__veil{ position:absolute; inset:0; z-index:-1;
  background:radial-gradient(70% 62% at 50% 50%,rgba(26,21,18,.78),rgba(26,21,18,.6) 70%,rgba(26,21,18,.48)),
             linear-gradient(180deg,rgba(26,21,18,.18) 0%,rgba(26,21,18,.38) 100%); }
.hero__in{ width:100%; max-width:var(--container); display:flex; flex-direction:column; align-items:center; gap:24px; }
.hero h1{ font-size:var(--fs-h1-home); line-height:1.1; color:var(--fond); text-shadow:0 2px 24px rgba(26,21,18,.45); }
.hero__tag{ font-size:var(--fs-lead); line-height:1.55; color:rgba(250,247,244,.96); text-shadow:0 1px 14px rgba(26,21,18,.5); max-width:100%; }
.hero__cta{ display:flex; flex-wrap:wrap; justify-content:center; gap:16px; margin-top:8px; }
/* sur l'image : primaire rempli ; ghost à bordure claire très marquée */
.hero .btn--ghost,.ctafull .btn--ghost{ color:var(--fond); border-color:rgba(250,247,244,.9); }
.hero .btn--ghost:hover,.ctafull .btn--ghost:hover{ background:rgba(250,247,244,.14); }
.hero .btn--primary:hover,.ctafull .btn--primary:hover{ box-shadow:0 6px 18px rgba(0,0,0,.3); }
.hero :focus-visible,.ctafull :focus-visible{ outline-color:var(--fond); }
/* Pastille Google, version foncée (sur image) : verre sombre, une seule ligne, s'arrête aux étoiles */
.gpill{ display:inline-flex; align-items:center; gap:10px; padding:8px 16px 8px 12px; border-radius:var(--r-pill);
  background:rgba(26,21,18,.38); -webkit-backdrop-filter:blur(10px) saturate(1.2); backdrop-filter:blur(10px) saturate(1.2);
  border:1px solid rgba(250,247,244,.22); white-space:nowrap; }
.gpill .g-g{ width:20px; height:20px; flex:0 0 auto; }
.gpill__n{ font-family:var(--f-body); font-weight:500; font-size:1rem; line-height:1; color:var(--or); font-variant-numeric:tabular-nums lining-nums; }
.stars{ --sz:18px; display:inline-flex; align-items:center; gap:2px; }
.stars .star{ width:var(--sz); height:var(--sz); flex:0 0 auto; color:var(--or); }
.gpill .stars{ --sz:16px; }
@media (max-width:767px){
  .hero{ padding-block:64px; }
  .gpill{ padding:6px 12px 6px 10px; gap:8px; }
  .gpill .g-g{ width:16px; height:16px; }
  .gpill__n{ font-size:.875rem; }
  .gpill .stars{ --sz:13px; }
}
@media (max-width:479px){ .hero__cta{ flex-direction:column; align-self:stretch; } .hero__cta .btn{ width:100%; } }
@supports (height:100lvh){
  .hero{ min-height:calc(100lvh - var(--stack-h)); padding-bottom:calc(96px + 100lvh - 100svh); }
  @media (max-width:767px){ .hero{ padding-bottom:calc(64px + 100lvh - 100svh); } }
}

/* ---------- Placeholder image : logo du client en filigrane, radial clair, légende en pastille ---------- */
.ph{ position:relative; overflow:hidden; background:radial-gradient(80% 80% at 50% 50%,#FAF7F4 0%,#F2E1DF 100%); }
.ph::before{ content:""; position:absolute; inset:0; opacity:.16;
  background:url("assets/img/martorano-logo-aplat.webp") no-repeat center 50% / min(30%,180px) auto; }
.ph__cap{ position:absolute; left:16px; bottom:16px; z-index:1; width:max-content; max-width:calc(100% - 32px);
  padding:6px 12px; border-radius:var(--r-pill); background:rgba(250,247,244,.94); color:var(--ink-2);
  font-size:var(--fs-caption); line-height:1.4; box-shadow:var(--sh-soft); }
@media (max-width:767px){ .ph__cap{ left:12px; bottom:12px; max-width:calc(100% - 24px); } }

/* ---------- Hero de page : radial clair + logo, H1 + tagline seuls ; la section suivante démarre sur le centre (#FAF7F4) ---------- */
.phero{ position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center; justify-content:center;
  text-align:center; min-height:calc((100svh - var(--stack-h)) * .6); padding:96px var(--pad);
  background:radial-gradient(75% 95% at 50% 50%,#FAF7F4 0%,#FAF7F4 26%,#F2E1DF 100%); }
@supports (height:100lvh){ .phero{ min-height:calc((100lvh - var(--stack-h)) * .6); } }
.phero::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:.05;
  background:url("assets/img/martorano-logo-aplat.webp") no-repeat center / min(30vh,260px) auto; }
.phero__in{ width:100%; max-width:var(--container); display:flex; flex-direction:column; align-items:center; gap:16px; }
.phero__tag{ font-size:var(--fs-lead); line-height:1.55; color:var(--ink-2); max-width:100%; text-wrap:balance; }
@media (max-width:767px){ .phero{ padding-block:64px; } .phero::before{ background-size:min(56%,200px) auto; } }

/* ---------- Notes de maquette : Note = carmin + info-circle, Suggestion = ambre + bulb ---------- */
.note-wrap{ margin-top:48px; }
.note-wrap .mnote{ margin-inline:auto; }
.mnote{ display:flex; gap:16px; align-items:flex-start; max-width:720px; padding:16px 24px; border-radius:var(--radius); border:1px solid;
  color:var(--note); border-color:rgba(163,0,1,.32); background:linear-gradient(rgba(163,0,1,.05),rgba(163,0,1,.05)),var(--fond); }
.mnote--suggestion{ color:var(--suggestion-txt); border-color:rgba(154,101,18,.4); background:linear-gradient(rgba(154,101,18,.07),rgba(154,101,18,.07)),var(--fond); }
.mnote--suggestion .ic{ color:var(--suggestion); }
.mnote .ic{ width:22px; height:22px; margin-top:1px; }
.mnote__label{ display:block; font-family:var(--f-body); font-weight:500; font-size:var(--fs-over); letter-spacing:.14em; text-transform:uppercase; margin-bottom:4px; line-height:1.4; }
.mnote p{ font-size:1rem; line-height:1.55; color:inherit; text-wrap:wrap; }
.sec-note .mnote{ margin-inline:auto; }
@media (max-width:767px){ .note-wrap{ margin-top:32px; } .mnote{ padding:16px; gap:12px; } }

/* ---------- A2 Projets en plein cadre : une rangée par projet, non cliquable ---------- */
.prows{ display:flex; flex-direction:column; gap:96px; }
.prow{ display:flex; flex-direction:column; gap:24px; color:var(--texte); }
.prow__img{ position:relative; overflow:hidden; border-radius:var(--radius); box-shadow:var(--sh-card); }
.prow__img::before{ content:""; display:block; padding-top:56.25%; }   /* 16/9 */
.prow__img .ph{ position:absolute; inset:0; }
.prow__cap{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.prow__t{ min-height:1.25em; }
.prow__cat{ font-weight:500; font-size:var(--fs-over); line-height:1.4; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
.prow__loc{ display:flex; align-items:center; gap:8px; font-size:1rem; line-height:1.5; color:var(--ink-2); }
.prow__loc .ic{ width:18px; height:18px; color:var(--accent); }
.prow__loc .is-ph{ color:var(--ink-2); opacity:.8; }   /* commune inconnue : la ligne reste, en écriture placeholder */
.after-rows{ display:flex; justify-content:flex-start; margin-top:96px; }
@media (max-width:1023px){ .prows{ gap:64px; } .prow__img::before{ padding-top:66.667%; } .after-rows{ margin-top:64px; } }   /* 3/2 */
@media (max-width:767px){ .prows{ gap:48px; } .prow{ gap:16px; } .prow__img::before{ padding-top:75%; } .after-rows{ margin-top:48px; } }   /* 4/3 */

/* ---------- A3 Prestations : bento asymétrique, 10 colonnes (4 + 3 + 3), puis le Métré en bandeau ---------- */
.sec-prest .container{ container-type:inline-size; }
.bento{ display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:24px;
  --tile-img:calc(((100cqw - 216px) * .3 + 48px) / 1.5);   /* hauteur d'image = largeur de la petite tuile ÷ 1,5 (3/2), reprise par toutes */
  --dom-w:calc((100cqw - 216px) * .4 + 72px); }             /* largeur exacte de la dominante */
.t-dom{ grid-column:span 4; }
.t-sm{ grid-column:span 3; }
.t-band{ grid-column:1 / -1; }
.tile{ display:flex; flex-direction:column; border-radius:var(--radius); background:var(--card);
  box-shadow:var(--sh-card); color:var(--texte); cursor:pointer;
  transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease); }
.tile:hover{ box-shadow:0 1px 2px rgba(74,44,34,.06),0 10px 24px rgba(74,44,34,.10),inset 0 1px 0 rgba(255,252,247,.7); }
.tile__img{ position:relative; height:var(--tile-img); flex:0 0 auto; }   /* hauteur FIXE, identique pour toutes les tuiles */
.tile__clip{ position:absolute; inset:0; overflow:hidden; border-radius:var(--radius) var(--radius) 0 0; }
.tile__clip .ph{ position:absolute; inset:0; transition:transform 1.2s var(--ease); }
.tile:hover .tile__clip .ph,.tile:focus-visible .tile__clip .ph{ transform:scale(1.03); }
.tile__body{ flex:1 1 auto; display:flex; flex-direction:column; padding:32px; }
.tile__txt{ display:flex; flex-direction:column; gap:8px; margin-block:auto; }   /* le texte occupe le reste, centré dans le panneau */
.tile__txt p{ color:var(--ink-2); }
.tile__more{ display:inline-flex; align-items:center; gap:8px; align-self:flex-end; padding-top:24px; font-weight:500; color:var(--accent); }
.tile__more .ic{ width:18px; height:18px; transition:transform var(--dur) var(--ease); }
.tile:hover .tile__more .ic,.tile:focus-visible .tile__more .ic{ transform:translateX(4px); }
/* bandeau (desktop) : image à gauche à la largeur exacte de la dominante, texte à droite, indicateur en bas à droite */
@media (min-width:1024px){
  .t-band{ flex-direction:row; }
  .t-band .tile__img{ width:var(--dom-w); height:auto; min-height:var(--tile-img); }
  .t-band .tile__clip{ border-radius:var(--radius) 0 0 var(--radius); }
  .t-band .tile__body{ flex:1 1 0; min-width:0; justify-content:center; }
  .t-band .tile__txt{ max-width:62ch; }
}
.erp{ display:flex; align-items:flex-start; justify-content:center; gap:12px; margin-top:32px; text-align:left; color:var(--texte); }
.erp .ic{ width:22px; height:22px; color:var(--accent); }
@media (max-width:1023px){
  .bento{ grid-template-columns:repeat(2,minmax(0,1fr)); --tile-img:calc((100cqw - 24px) / 2 / 1.5); }
  .t-dom,.t-band{ grid-column:1 / -1; }
  .t-sm{ grid-column:auto; }
}
@media (max-width:767px){
  .bento{ grid-template-columns:minmax(0,1fr); --tile-img:calc(100cqw / 1.5); gap:16px; }
  .t-dom,.t-sm,.t-band{ grid-column:auto; }
  .tile__body{ padding:24px; }
  .erp{ justify-content:flex-start; }
}

/* ---------- A4 Méthode : frise numérotée, repère en chiffre nu ---------- */
.frise{ position:relative; }
.frise__line{ position:absolute; left:0; top:0; width:0; height:2px; pointer-events:none; }
.frise__fill{ position:absolute; inset:0; background:var(--grad); transform-origin:left center; transform:scaleX(0); }
.frise.is-drawn .frise__fill{ transform:none; transition:transform 1.5s var(--ease); }
.frise.is-static .frise__fill{ transform:none; }
.steps{ list-style:none; margin:0; padding:0; position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:32px; }
.step{ display:flex; flex-direction:column; align-items:flex-start; min-width:0; }
.step__n{ font-family:var(--f-body); font-weight:500; font-size:clamp(3.5rem,5.4vw,4.75rem); line-height:1; letter-spacing:-.03em;
  color:rgba(163,0,1,.26); font-variant-numeric:tabular-nums lining-nums; }   /* teinte claire de l'accent */
.step__dot{ position:relative; z-index:1; width:12px; height:12px; border-radius:50%; margin:24px 0; background:var(--accent); }
.step:nth-child(2) .step__dot{ background:#960001; }
.step:nth-child(3) .step__dot{ background:#820000; }
.step:nth-child(4) .step__dot{ background:var(--accent-soutenu); }   /* le point suit la ligne : première couleur au premier, seconde au dernier */
.step__txt{ display:flex; flex-direction:column; gap:8px; }
.step__txt p{ color:var(--ink-2); }
@media (max-width:1023px){
  .frise__line{ width:2px; height:0; }
  .frise__fill{ background:linear-gradient(180deg,#A30001,#6E0000); transform-origin:center top; transform:scaleY(0); }
  .steps{ grid-template-columns:minmax(0,1fr); row-gap:48px; }
  .step{ display:grid; grid-template-columns:12px minmax(0,1fr); grid-template-areas:"dot n" ".   txt"; column-gap:24px; row-gap:12px; align-items:center; }
  .step__n{ grid-area:n; font-size:clamp(2.75rem,7vw,3.5rem); }
  .step__dot{ grid-area:dot; margin:0; }
  .step__txt{ grid-area:txt; }
}
@media (max-width:767px){ .steps{ row-gap:40px; } .step{ column-gap:20px; } }

/* ---------- A5 Particuliers / professionnels : sélecteur segmenté + panneau en split, posé sur la section ---------- */
.seg-wrap{ display:flex; justify-content:center; margin-bottom:48px; }
.seg{ position:relative; display:grid; grid-template-columns:1fr 1fr; padding:4px; border-radius:4px; background:rgba(163,0,1,.07); }
.seg__pill{ position:absolute; top:4px; bottom:4px; left:4px; width:calc(50% - 4px); border-radius:var(--radius); background:var(--accent);
  box-shadow:0 2px 8px rgba(110,0,0,.2); transition:transform var(--dur) var(--ease); pointer-events:none; }
.seg[data-sel="1"] .seg__pill{ transform:translateX(100%); }
.seg__btn{ position:relative; z-index:1; min-width:200px; min-height:48px; padding:10px 24px; border-radius:var(--radius);
  font-weight:500; font-size:1rem; color:var(--ink-2); transition:color var(--dur) var(--ease); }
.seg__btn:hover{ color:var(--accent); }
.seg__btn[aria-selected="true"],.seg__btn[aria-selected="true"]:hover{ color:var(--fond); }
.seg__btn:focus-visible{ outline-offset:-4px; outline-color:var(--texte); }
.seg-pans{ display:grid; }
.seg-pan{ grid-area:1 / 1; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center;
  opacity:0; visibility:hidden; transform:translateY(8px);
  /* sortie : le profil s'efface seul (0,4 s), avec une légère descente, puis disparaît ; jamais en même temps que l'entrée */
  transition:opacity .4s var(--ease),transform .4s var(--ease),visibility 0s linear .4s; }
/* entrée : le nouveau profil n'apparaît qu'une fois l'ancien effacé (retard 0,4 s), fondu + légère montée */
.seg-pan.is-on{ opacity:1; visibility:visible; transform:none;
  transition:opacity .5s var(--ease) .4s,transform .5s var(--ease) .4s,visibility 0s linear .4s; }
.seg-pan.is-out{ transform:translateY(8px); }
.seg-pan__img{ position:relative; overflow:hidden; border-radius:var(--radius); box-shadow:var(--sh-card); }
.seg-pan__img::before{ content:""; display:block; padding-top:75%; }   /* 4/3 */
.seg-pan__img .ph{ position:absolute; inset:0; }
.seg-pan__p{ font-size:var(--fs-lead); line-height:1.6; color:var(--texte); margin-bottom:24px; }
.irows{ list-style:none; margin:0; padding:0; }
.irow{ position:relative; display:flex; align-items:center; gap:16px; min-height:56px; padding-block:14px; font-weight:500; font-size:1.0625rem; line-height:1.4; color:var(--texte); }
.irow .ic{ width:24px; height:24px; color:var(--accent); }
.irow + .irow::before{ content:""; position:absolute; top:0; left:40px; right:0; height:1px; background:var(--hairline); }   /* filet inséré à l'aplomb du titre */
@media (max-width:1023px){
  .seg-pan{ grid-template-columns:minmax(0,1fr); gap:32px; align-items:start; }
}
@media (max-width:767px){
  .seg-wrap{ margin-bottom:32px; }
  .seg{ width:100%; max-width:420px; }
  .seg__btn{ min-width:0; padding-inline:12px; }
  .seg-pan{ gap:24px; }
  .irow{ font-size:1rem; }
  .irow .ic{ width:22px; height:22px; }
  .irow + .irow::before{ left:38px; }
}

/* ---------- A6 Présentation : split avec chevauchement (panneau sur le portrait, portrait à droite) + bande de stats nue ---------- */
.about{ display:grid; grid-template-columns:minmax(0,33.75fr) minmax(0,11.25fr) minmax(0,55fr); align-items:stretch; }
.about__img{ grid-column:2 / 4; grid-row:1; position:relative; min-height:600px; border-radius:var(--radius); overflow:hidden; box-shadow:var(--sh-card); }
.about__img .ph{ position:absolute; inset:0; }
.about__img .ph__cap{ top:16px; bottom:auto; left:auto; right:16px; }   /* légende en haut à droite : le panneau recouvre la gauche (ordinateur) et le bas (tablette, mobile) */
/* le panneau mord d'un quart de sa largeur sur le portrait (11,25 / 45) ; il se détache par son fond plein et l'ombre du site */
.about__panel{ grid-column:1 / 3; grid-row:1; align-self:center; position:relative; z-index:1; margin-block:64px;
  display:flex; flex-direction:column; align-items:flex-start; gap:16px; padding:48px; background:var(--fond); border-radius:var(--radius); box-shadow:var(--sh-card); }
.about__panel h2{ margin-bottom:8px; }
.about__panel p{ color:var(--ink-2); }
.about__panel .btn{ margin-top:8px; }
@media (max-width:1023px){
  .about{ grid-template-columns:minmax(0,1fr); }
  .about__img{ grid-column:1; min-height:0; height:520px; }   /* hauteur explicite, photo réduite */
  .about__panel{ grid-column:1; grid-row:2; margin:-96px 48px 0; }   /* le panneau remonte sur le bas du portrait, retrait latéral gardé */
}
@media (max-width:767px){
  .about__img{ height:auto; }
  .about__img::before{ content:""; display:block; padding-top:110%; }   /* hauteur réservée en flux */
  .about__panel{ margin:-48px 16px 0; padding:32px 24px; }   /* recouvrement réduit de moitié, marges négatives verticales seulement */
  .about__img .ph__cap{ right:12px; top:12px; }
}
@media (max-width:389px){ .about__panel h2{ font-size:1.8125rem; } }
/* bande de stats nue : chiffres posés sur le fond de section, sans cellule ni filet, centrés */
.stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; margin-top:64px; }
.stat{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; min-width:0; }
.stat__n{ font-family:var(--f-body); font-weight:500; font-size:var(--fs-stat); line-height:1; letter-spacing:-.02em;
  color:var(--accent); font-variant-numeric:tabular-nums lining-nums; white-space:nowrap; }
.stat__n--gold{ display:inline-flex; align-items:center; gap:10px; color:var(--or); }
.stars--stat{ --sz:clamp(16px,1.7vw,22px); }
.stat__l{ font-size:.9375rem; line-height:1.4; color:var(--ink-2); white-space:nowrap; }
@media (max-width:767px){
  .stats{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:32px; column-gap:16px; margin-top:48px; }
  .stat__n--gold{ gap:8px; }
  .stars--stat{ --sz:14px; }   /* la note et ses étoiles tiennent dans la demi-colonne dès 320px */
}

/* ---------- A7 Zone d'intervention : carte de localisation stylisée + liste des communes, carte à gauche ---------- */
.zone{ display:grid; grid-template-columns:minmax(0,55fr) minmax(0,45fr); grid-template-rows:1fr auto auto 1fr; column-gap:64px; }
.zone__head{ grid-column:2; grid-row:2; margin-bottom:32px; }
.zone__map{ grid-column:1; grid-row:1 / -1; }
.zone__list{ grid-column:2; grid-row:3; }
.zone__list h3{ margin-bottom:8px; }
@media (max-width:1023px){
  .zone{ grid-template-columns:minmax(0,1fr); grid-template-rows:none; }
  .zone__head,.zone__map,.zone__list{ grid-column:1; grid-row:auto; }
  .zone__head{ margin-bottom:48px; }
  .zone__map{ margin-bottom:48px; }
}
@media (max-width:767px){ .zone__head,.zone__map{ margin-bottom:32px; } }
.crows{ list-style:none; margin:0; padding:0; }
.crow{ position:relative; display:flex; align-items:center; gap:12px; min-height:48px; padding-block:10px; line-height:1.4; }
.crow .ic{ width:20px; height:20px; flex:none; color:var(--accent); }
.crow__n{ font-weight:500; color:var(--texte); }
.crow + .crow::before{ content:""; position:absolute; top:0; left:32px; right:0; height:1px; background:var(--hairline); }   /* filet inséré à l'aplomb du nom */
/* carte : vrais contours, terre découpée par le trait de côte, frontières intérieures seulement ; étiquettes en HTML à l'échelle de la carte */
.zmap{ position:relative; border-radius:var(--radius); overflow:hidden; box-shadow:var(--sh-card); background:#EACDC9; container-type:inline-size; }
.zmap::before{ content:""; display:block; padding-top:125%; }   /* cadre 4:5, toute la Gironde avec de la marge */
.zmap svg{ position:absolute; inset:0; width:100%; height:100%; }
.zmap .sea{ fill:#EACDC9; }                     /* mer : teinte de l'accent appuyée, distincte de la terre d'un coup d'œil */
.zmap .hatch{ stroke:rgba(163,0,1,.2); stroke-width:1.6; }   /* hachures fines : la palette n'a pas de bleu, la mer se lit par la trame */
.zmap .land{ fill:var(--fond); }                /* terre : couleur de fond */
.zmap .dep-l{ fill:none; stroke:rgba(26,21,18,.2); stroke-width:1; vector-effect:non-scaling-stroke; }
.zmap .coast{ fill:none; stroke:rgba(163,0,1,.45); stroke-width:1; vector-effect:non-scaling-stroke; }
.mpt{ position:absolute; left:var(--x); top:var(--y); width:0; height:0; z-index:1; font-size:clamp(12px,2.6cqw,.9375rem); }   /* 15px sur la carte de 598px */
.mpt--main{ z-index:2; --pin:clamp(7px,2.4cqw,12.5px); }
/* points un cran sous le standard : Bordeaux, Bègles et Mérignac sont à 3-5 km l'un de l'autre à l'échelle de toute la Gironde */
.mpt i{ position:absolute; left:-.25em; top:-.25em; width:.5em; height:.5em; border-radius:50%; background:var(--texte);
  box-shadow:0 0 0 .16em rgba(250,247,244,.95); }
/* pin du siège à sa propre échelle (base --pin) : la pointe sur l'ancre */
.mpt .pin{ position:absolute; width:calc(var(--pin) * 3.2); height:calc(var(--pin) * 3.2); left:calc(var(--pin) * -1.6); top:calc(var(--pin) * -2.93);
  fill:var(--accent); stroke:var(--fond); stroke-width:1.5; filter:drop-shadow(0 3px 5px rgba(74,44,34,.3)); }
.mpt .pin circle{ fill:var(--fond); stroke:none; }
.lbl{ position:absolute; white-space:nowrap; line-height:1; border-radius:var(--r-pill); padding:.3846em .6923em;
  font-size:1em; font-weight:500; color:var(--texte); background:rgba(250,247,244,.96); box-shadow:var(--sh-soft); }
.mpt--main .lbl{ font-size:1.07em; color:var(--accent); }
.lbl[data-d="right"]{ left:.85em; top:0; transform:translateY(-50%); }
.lbl[data-d="left"]{ right:.85em; top:0; transform:translateY(-50%); }
.lbl[data-d="below"]{ left:0; top:.75em; transform:translateX(-50%); }
.lbl[data-d="above"]{ left:0; bottom:.75em; transform:translateX(-50%); }
.lbl[data-d="abovel"]{ left:0; bottom:2.2em; transform:translateX(-62%); }   /* Andernos : au-dessus, décalée vers l'ouest, au-delà du point de Saint-Jean-d'Illac */
.lbl[data-d="rightup"]{ left:.85em; bottom:.1em; }                           /* Bordeaux : à droite, relevée au-dessus du point de Bègles */
.mpt--main .lbl[data-d="above"]{ bottom:calc(var(--pin) * 3.1); }   /* au-dessus du pin, jamais sur lui */
@media (max-width:1023px){
  .zmap::before{ padding-top:100%; }   /* carré, viewBox recadré sur la Gironde par le JS (data-vbm) */
  .mpt{ left:var(--xm); top:var(--ym); font-size:clamp(12px,3.9cqw,.9375rem); }   /* 13,4px sur le carré de 343px */
  .lbl[data-d]{ left:auto; right:auto; top:auto; bottom:auto; transform:none; }
  .lbl[data-m="right"]{ left:.85em; top:0; transform:translateY(-50%); }
  .lbl[data-m="left"]{ right:.85em; top:0; transform:translateY(-50%); }
  .lbl[data-m="below"]{ left:0; top:.75em; transform:translateX(-50%); }
  .lbl[data-m="above"]{ left:0; bottom:.75em; transform:translateX(-50%); }
  .lbl[data-m="abovel"]{ left:0; bottom:2.6em; transform:translateX(-44%); }   /* réglage cherché sur 320-1023px : 3px d'air au minimum */
  .mpt i{ box-shadow:0 0 0 .12em rgba(250,247,244,.95); }   /* carré : halo réduit, les points du groupe de Bordeaux restent séparés */
  .lbl[data-m="rightup"]{ left:.85em; bottom:.1em; }
  .mpt--main .lbl[data-m="above"]{ bottom:calc(var(--pin) * 3.1); }
}

/* ---------- A8 Avis : en-tête + bloc note, ticker d'une rangée sur toute la largeur de l'écran ---------- */
.avis__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:48px; }
.avis__head .shead{ margin-bottom:0; }
.rating{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; flex:0 0 auto; }
.rating__l1{ display:flex; align-items:center; gap:12px; }
.rating__n{ font-family:var(--f-body); font-weight:500; font-size:2.75rem; line-height:1; letter-spacing:-.02em;
  color:var(--or); font-variant-numeric:tabular-nums lining-nums; }
.rating .stars{ --sz:24px; }
.rating__l2{ display:flex; align-items:center; gap:10px; }
.rating__c{ font-weight:500; font-size:1rem; line-height:1; color:var(--texte); }
.g-word{ height:24px; width:auto; }
.rtk{ position:relative; overflow:hidden; padding-block:14px 36px; margin-top:-14px; }
.rtk .tk{ width:max-content; }
.rv{ flex:0 0 auto; width:360px; height:var(--rv-h,auto); display:flex; flex-direction:column; gap:16px; padding:28px;
  background:var(--card); color:var(--texte); border-radius:var(--radius); box-shadow:var(--sh-card); }
.rv__head{ display:flex; align-items:flex-start; gap:12px; }
.rv__av{ width:44px; height:44px; flex:0 0 auto; border-radius:50%; background:linear-gradient(135deg,#A30001,#6E0000); color:var(--fond);
  display:flex; align-items:center; justify-content:center; font-family:var(--f-title); font-weight:700; font-size:1.125rem; }
.rv__who{ display:flex; flex-direction:column; gap:4px; flex:1 1 auto; min-width:0; }
.rv__name{ font-weight:500; font-size:1rem; line-height:22px; color:var(--texte); }
.stars--sm{ --sz:15px; }
.rv__g{ flex:0 0 auto; margin-top:2px; line-height:0; }   /* le G seul, calé sur le haut de l'en-tête */
.rv__g .g-g{ width:20px; height:20px; }
.rv__txt{ color:var(--texte); line-height:1.6; }
.rv-cta{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:12px; }   /* le padding bas du ticker (36px) + 12px = 48px */
@media (max-width:1023px){ .rv{ width:340px; } }
@media (max-width:767px){
  .avis__head{ flex-direction:column; align-items:flex-start; gap:24px; margin-bottom:32px; }
  .rating__n{ font-size:2.25rem; }
  .rating .stars{ --sz:20px; }
  .rv{ width:300px; padding:24px; }
  .rv__g .g-g{ width:30px; height:30px; }
  .rv-cta{ flex-direction:column; align-items:flex-start; }
}
/* tablette et mobile : jamais de défilement horizontal pour un ticker de section, il passe en vertical (fenêtre de 85svh) ;
   tablette : deux colonnes en sens opposés ; mobile : une colonne à la largeur du conteneur, qui monte */
.tk[data-dir="up"].run{ animation-name:tkv-up; }
.tk[data-dir="down"].run{ animation-name:tkv-down; }
@keyframes tkv-up{ from{ transform:translateY(0); } to{ transform:translateY(-50%); } }
@keyframes tkv-down{ from{ transform:translateY(-50%); } to{ transform:translateY(0); } }
@media (max-width:1023px){
  .rtk.is-v{ max-width:var(--container); height:85svh; margin:0 auto; padding:0 var(--pad); overflow:hidden;
    -webkit-mask-image:linear-gradient(180deg,transparent,#000 var(--tk-fade),#000 calc(100% - var(--tk-fade)),transparent);
    mask-image:linear-gradient(180deg,transparent,#000 var(--tk-fade),#000 calc(100% - var(--tk-fade)),transparent); }
  .rvc{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:var(--tk-gap); align-items:start; }
  .rvc__col{ min-width:0; }
  .rtk.is-v .tk{ flex-direction:column; width:auto; }
  .rtk.is-v .tk__set{ flex-direction:column; padding-left:0; padding-top:var(--tk-lead); }   /* vide de lecture en tête de chaque copie, à la verticale */
  .rtk.is-v .rv{ width:auto; height:auto; }
  .rtk.is-v + .container .rv-cta{ margin-top:48px; }
  /* sans JS : les avis en simple pile, sans défilement horizontal */
  html:not(.js) .rtk{ max-width:var(--container); margin-inline:auto; padding-inline:var(--pad); }
  html:not(.js) .rtk .tk__set{ flex-direction:column; padding-left:0; }
  html:not(.js) .rtk .tk__set[aria-hidden]{ display:none; }
  html:not(.js) .rtk .rv{ width:auto; height:auto; }
}
@media (max-width:767px){
  .rvc{ grid-template-columns:minmax(0,1fr); }
  .rtk.is-v + .container .rv-cta{ margin-top:32px; }
}

/* ---------- A9 FAQ : accordéon à filets ---------- */
.faq{ max-width:var(--faq-max); margin-inline:auto; }
.faq__item{ position:relative; }
.faq__item + .faq__item::before{ content:""; position:absolute; top:0; left:16px; right:16px; height:1px; background:var(--hairline); }
.faq__h{ font-size:inherit; letter-spacing:0; }
.faq__q{ width:100%; display:flex; align-items:flex-start; justify-content:space-between; gap:16px; min-height:44px;
  padding:24px 16px; text-align:left; font-family:var(--f-title); font-weight:700; font-size:clamp(1.125rem,1.5vw,1.25rem); line-height:1.35; letter-spacing:-.01em;
  color:var(--texte); border-radius:var(--radius); transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease); }
.faq__q:hover{ background:rgba(163,0,1,.05); color:var(--accent); }
.faq__q .ic{ width:22px; height:22px; margin-top:2px; color:var(--accent); transition:transform var(--dur-faq) var(--ease); }
.faq__item.is-open .faq__q .ic{ transform:rotate(180deg); }
.faq__a{ display:grid; grid-template-rows:0fr; visibility:hidden;
  transition:grid-template-rows var(--dur-faq) var(--ease),visibility var(--dur-faq) var(--ease); }
.faq__a > div{ overflow:hidden; min-height:0; }
.faq__a p{ color:var(--ink-2); padding:0 54px 24px 16px; }   /* la réponse s'aligne sur la question et s'arrête au niveau du chevron */
.faq__item.is-open .faq__a{ grid-template-rows:1fr; visibility:visible; }
@media (max-width:767px){ .faq__q{ padding:16px 8px; } .faq__a p{ padding:0 8px 16px; } .faq__item + .faq__item::before{ left:8px; right:8px; } }

/* ---------- B4 Section CTA pleine page : placeholder bord à bord (motif logo) sous un voile sombre chaud ---------- */
.ctafull{ position:relative; isolation:isolate; overflow:hidden; padding:160px 0; color:var(--fond); text-align:center; }
.ctafull__bg{ position:absolute; inset:0; z-index:-1; background:radial-gradient(80% 90% at 50% 50%,#FAF7F4 0%,#F2E1DF 100%); }
.ctafull__bg::before{ content:""; position:absolute; inset:0; opacity:.1;
  background:url("assets/img/martorano-logo-aplat.webp") no-repeat center / min(40vh,340px) auto; }
/* voile tiré du texte #1A1512 ; opacité réglée sur le contraste mesuré dans la zone du texte */
.ctafull__bg::after{ content:""; position:absolute; inset:0; background:rgba(26,21,18,.8); }
.ctafull__bg .ph__cap{ z-index:2; left:24px; bottom:24px; background:rgba(250,247,244,.9); }
.ctafull__in{ max-width:var(--container); margin-inline:auto; display:flex; flex-direction:column; align-items:center; gap:24px; }
.ctafull h2{ color:var(--fond); text-shadow:0 2px 20px rgba(26,21,18,.4); }
.ctafull__lead{ font-size:var(--fs-lead); line-height:1.55; color:rgba(250,247,244,.92); max-width:46rem; text-wrap:balance; }
.ctafull__btns{ display:flex; flex-wrap:wrap; justify-content:center; gap:16px; margin-top:8px; }
@media (max-width:767px){
  .ctafull{ padding:112px 0 128px; }
  .ctafull__bg .ph__cap{ left:16px; bottom:16px; }
  .ctafull__btns{ flex-direction:column; align-self:stretch; align-items:stretch; }
  .ctafull__btns .btn{ width:100%; }
}

/* ---------- Contact : formulaire posé sur la section, avec coordonnées (7 / 5) ---------- */
.cgrid{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:48px; align-items:start; }
.form-body{ display:flex; flex-direction:column; gap:24px; }
.field{ display:flex; flex-direction:column; gap:8px; }
.field label{ font-weight:500; font-size:1rem; line-height:1.4; color:var(--texte); }
.field .opt{ font-weight:400; color:var(--ink-2); margin-left:6px; }
.field input,.field select,.field textarea{ width:100%; min-height:48px; padding:12px 14px; font:inherit; font-size:1rem; line-height:1.5;
  color:var(--texte); background:var(--card); border:1px solid rgba(26,21,18,.4); border-radius:var(--radius); margin:0;
  transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease); }
.field textarea{ resize:vertical; min-height:150px; }
.field ::placeholder{ color:#7A716B; opacity:1; }
.field input:hover,.field select:hover,.field textarea:hover{ border-color:var(--accent); }
.field input:focus,.field select:focus,.field textarea:focus{ outline:2px solid var(--accent); outline-offset:3px; border-color:var(--accent); }
.field select{ appearance:none; -webkit-appearance:none; padding-right:44px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1512' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M6 9l6 6l6 -6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:18px; }
.field select:invalid{ color:#7A716B; }
.field select option{ color:var(--texte); }
.err{ display:none; font-size:var(--fs-caption); font-weight:500; line-height:1.4; color:var(--error); }
.field.is-err .err{ display:block; }
.field.is-err input,.field.is-err select,.field.is-err textarea{ border-color:var(--error); }
.form-send{ margin-top:32px; display:flex; flex-direction:column; align-items:flex-start; gap:16px; }
.form.is-busy .form-send .btn--primary{ opacity:.7; pointer-events:none; }
.form-ko{ font-weight:500; color:var(--error); }
.form-foot{ margin-top:16px; font-size:var(--fs-caption); line-height:1.5; color:var(--ink-2); }
.form-foot a{ color:var(--accent); text-decoration:underline; text-underline-offset:3px; transition:color var(--dur) var(--ease); }
.form-foot a:hover{ color:var(--accent-soutenu); }
.form-ok{ padding:24px; border-radius:var(--radius); background:var(--card); box-shadow:var(--sh-card); color:var(--texte); font-weight:500; }
.form-ok:focus{ outline:none; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.icards{ display:flex; flex-direction:column; gap:24px; }
.icards .mnote{ margin-top:8px; }
.icard{ padding:32px; background:var(--card); border-radius:var(--radius); box-shadow:var(--sh-card); }
.icard h3{ margin-bottom:16px; }
.icard__h{ display:flex; align-items:center; gap:12px; }
.icard__h .ic{ width:24px; height:24px; margin-top:0; color:var(--accent); }
.icard__rows{ display:flex; flex-direction:column; gap:12px; }
.icard .row{ display:flex; align-items:flex-start; gap:12px; }
.icard .ic{ color:var(--accent); margin-top:2px; }
.icard a{ cursor:pointer; display:inline-block; padding-block:10px; margin-block:-10px; overflow-wrap:anywhere; transition:color var(--dur) var(--ease); }
.icard a:hover{ color:var(--accent); }
.hrow{ position:relative; display:flex; justify-content:space-between; align-items:baseline; gap:16px; }
.hrow + .hrow{ padding-top:12px; }
.hrow + .hrow::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:var(--hairline); }
.hrow > span:first-child{ white-space:nowrap; font-weight:500; }
.hrow .d{ text-align:right; color:var(--ink-2); }
@media (max-width:1023px){ .cgrid{ grid-template-columns:minmax(0,1fr); gap:48px; } }
@media (max-width:767px){
  .icard{ padding:32px 24px; }
  .form-send{ align-items:stretch; }
  .form-send .btn{ width:100%; }
}

/* ---------- Footer ---------- */
.foot{ background:var(--fond); color:var(--texte); }
.foot__map{ position:relative; height:360px; background:var(--B); }
.foot__map iframe{ position:absolute; inset:0; display:block; width:100%; height:100%; border:0; }
.foot__id{ padding-top:48px; }
.foot__grid{ display:grid; grid-template-columns:repeat(3,max-content); justify-content:space-between; column-gap:48px; }
.foot__grid > *{ min-width:0; }
.foot__logolink{ display:inline-flex; margin-bottom:16px; transition:opacity var(--dur) var(--ease); }
.foot__logolink:hover{ opacity:.85; }
.foot__logo{ width:auto; height:60px; border-radius:var(--radius); }   /* même taille que dans le header */
.foot__name{ font-size:1.375rem; line-height:1.25; letter-spacing:-.01em; }
.foot__pos{ display:block; font-family:var(--f-body); font-size:1rem; font-weight:500; letter-spacing:0; color:var(--accent); margin-top:6px; }
.foot__tag{ color:var(--ink-2); margin-top:12px; }
.foot__tag > span{ display:block; }
.foot__col{ padding-top:76px; }   /* première ligne au niveau du nom, pas du logo (60 + 16) */
.foot__h{ font-family:var(--f-body); font-weight:500; font-size:var(--fs-over); line-height:1.4; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent); margin-bottom:12px; }
.foot__h--legal{ margin-top:32px; }
.foot__links{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.foot__links a,.foot__info a{ cursor:pointer; display:inline-block; padding-block:9px; margin-block:-9px; transition:color var(--dur) var(--ease),transform var(--dur) var(--ease); }
.foot__links a:hover,.foot__info a:hover{ color:var(--accent); transform:translateX(3px); }
.foot__parent{ color:var(--texte); }
.foot__sub{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; padding-left:16px; }
.foot__info{ display:flex; flex-direction:column; gap:12px; }
.foot__info .row{ display:flex; align-items:flex-start; gap:10px; }
.foot__info .ic{ width:18px; height:18px; margin-top:3px; color:var(--accent); }
.foot__sep{ height:1px; background:var(--hairline); margin-top:32px; }
.foot__sep--m{ display:none; }
.foot__bar{ display:flex; justify-content:space-between; gap:16px; padding-block:32px; font-size:var(--fs-caption); color:var(--ink-2); }

@media (max-width:1023px){ .foot__logo{ height:52px; } }
@media (max-width:767px){ .foot__map{ height:280px; } .foot__logo{ height:46px; } }
/* Trois colonnes seulement quand l'air entre deux colonnes, mesuré sur les lettres, atteint 64px (dès 1060px, mesuré).
   En dessous, tablette comprise, le footer passe dans sa configuration mobile : une colonne. */
@media (max-width:1059px){
  .foot__id{ padding-top:44px; }
  .foot__grid{ grid-template-columns:minmax(0,1fr); gap:0; }
  .foot__tag > span{ display:inline; }
  .foot__col{ padding-top:0; }
  .foot__col + .foot__col{ margin-top:32px; }
  .foot__sep--m{ display:block; margin-block:32px 0; }
  .foot__sep--m + .foot__col{ padding-top:32px; }
  .foot__bar{ flex-direction:column; align-items:flex-start; gap:8px; padding-bottom:calc(32px + env(safe-area-inset-bottom)); }
}
@media (min-width:1060px){ .foot__info .row--fold > span{ flex:1 1 0; contain:inline-size; } .foot__grid{ column-gap:64px; } }
/* ordinateur : le footer prend la largeur du header (1320px) */
@media (min-width:1024px){ .foot > .container{ max-width:var(--container-header); } }

/* ==========================================================================
   Effets : montés en dernier (Phase finale)
   ========================================================================== */
html.js-ready [data-reveal]{ opacity:0; transform:translateY(30px);
  transition:opacity var(--dur-in) var(--ease),transform var(--dur-in) var(--ease); }
html.js-ready [data-reveal].is-in{ opacity:1; transform:none; }
.hero--pin{ position:sticky; top:0; z-index:0; }
.page-flow{ position:relative; z-index:2; background:var(--fond); }

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ transition-duration:.001ms !important; transition-delay:0s !important; animation-duration:.001ms !important;
    animation-iteration-count:1 !important; scroll-behavior:auto !important; }
  html{ scroll-behavior:auto; }
  .tk.run{ animation:none !important; }
  html.js-ready [data-reveal]{ opacity:1 !important; transform:none !important; }
  .rtk,.annonce__in{ overflow-x:auto; }
  .rtk.is-v{ overflow-x:hidden; overflow-y:auto; -webkit-mask-image:none; mask-image:none; }
  .tk-mask{ -webkit-mask-image:none; mask-image:none; }
  .tk > .tk__set[aria-hidden],.annonce .tk > .annonce__set[aria-hidden]{ display:none !important; }
  .annonce__in{ -webkit-mask-image:none; mask-image:none; }
  .annonce__set{ padding-inline:var(--pad) !important; }
  .frise__fill{ transform:none !important; }
  .tile__clip .ph{ transform:none !important; }
  .seg-pan{ transform:none !important; }
}