/* Gabarit « Azulejo » (l'intention : azulejo.js). Aucune couleur hors des jetons. */
@font-face{font-family:"Ibarra Real Nova";font-weight:400 700;font-display:swap;src:url(/fonts/azulejo-1.woff2) format("woff2")}
@font-face{font-family:"Ibarra Real Nova";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/azulejo-2.woff2) format("woff2")}
@font-face{font-family:"Figtree";font-weight:400 700;font-display:swap;src:url(/fonts/azulejo-3.woff2) format("woff2")}
/* La couleur de la MAISON, en deux tons : le trait (--a, AA sur l'émail) et son lavis (--b). */
.r--g-azulejo,.r--g-azulejo.r--ardoise{--a:#1D3E94;--b:#A8BCE8}
.r--g-azulejo.r--rouge{--a:#A3271C;--b:#F0B9A8}
.r--g-azulejo.r--or{--a:#8C5A10;--b:#EDCB7C}
.r--g-azulejo.r--olive{--a:#476626;--b:#C8D8A2}
/* L'émail (plaques, carreaux), le fond, l'encre, le gris (texte second), les filets, les joints. */
.r--g-azulejo{--email:#FFFFFF;--fond:#F6F6F2;--encre:#1A2030;--gris:#4A5163;--filet:#D9DCE3;--joint:#DDE1E8;
--romain:"Ibarra Real Nova",Georgia,serif;--lineale:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
--marge:1rem;--pas:4.5rem;--large:min(76rem,100% - 2*var(--marge));
margin:0;background:var(--fond);color:var(--encre);overflow-x:clip;overflow-wrap:break-word;
font:400 1.0625rem/1.6 var(--lineale);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (min-width:40rem){.r--g-azulejo{--marge:2rem;--pas:6rem}}
@media (min-width:64rem){.r--g-azulejo{--marge:clamp(2.5rem,4vw,4rem);--pas:clamp(6.5rem,8vw,8rem);font-size:1.125rem}}
:where(.r--g-azulejo) *{box-sizing:border-box}
:where(.r--g-azulejo) :is(p,ul,ol,h1,h2,h3,figure){margin:0}
:where(.r--g-azulejo) :is(ul,ol){padding:0;list-style:none}
:where(.r--g-azulejo) img{display:block;max-width:100%;height:auto}
:where(.r--g-azulejo) a{color:inherit;text-underline-offset:.22em}
.r--g-azulejo :focus-visible{outline:2px solid var(--a);outline-offset:3px}
:is(.az-rub--plaque,.az-marche--auj,.az-pied) :focus-visible{outline-color:var(--email)}
.az-appel :focus-visible{outline:2px solid var(--email);outline-offset:-5px}
/* Une colonne jamais plus large que la page. */
:where(.az-mur,.az-rdv,.az-rdv__lignes,.az-texte,.az-marche,.az-boutique,.az-adresse,.az-info,.az-services,.az-reseaux,.az-pied,.az-breves){grid-template-columns:minmax(0,1fr)}
.az-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* LE MUR : des carreaux de --t, peints en CSS, centrés sur l'axe de la page ;
   une rangée entière en haut et en bas (round). De haut en bas : les quatre
   pétales de la fleur, le disque de chaque coin (un cercle avec ses trois
   voisins), les joints, le coeur et le cercle qui blanchit le reste du
   carreau, les quatre feuilles au lavis. */
.az-mur::before,.az-contact::before,.az-rub--ecart-haut::before,.az-rub--ecart-bas::after,.az-rub--illus::after{content:"";--d:calc(var(--t)/2);--p:var(--a) 0 96%,#0000;
background:radial-gradient(9% 18% at 50% 26%,var(--p)),radial-gradient(9% 18% at 50% 74%,var(--p)),radial-gradient(18% 9% at 26% 50%,var(--p)),radial-gradient(18% 9% at 74% 50%,var(--p)),
radial-gradient(circle,var(--a) 0 17%,var(--email) 18% 21%,var(--b) 22% 26%,#0000 27%),
linear-gradient(90deg,var(--joint) 1px,#0000 0),linear-gradient(var(--joint) 1px,#0000 0),
radial-gradient(circle,var(--email) 0 6%,var(--a) 7% 11%,#0000 12% 35%,var(--email) 36%),
repeating-conic-gradient(from 22deg,#0000,var(--b) 2deg 44deg,#0000 46deg 90deg) var(--email);
background-size:var(--t) var(--t);background-position:50% 0,50% 0,50% 0,50% 0,calc(50% + var(--d)) var(--d),50% 0;background-repeat:repeat round}
/* Le mur peint sur un calque derrière les plaques (il se découvre au chargement, plus bas) ; le panneau derrière une illustration n'existe qu'à l'ordinateur. */
.az-mur::before,.az-contact::before{position:absolute;inset:0;z-index:0}
.az-rub--illus::after{display:none}
/* Les frises : un bandeau sur chaque titre, d'un motif qui change d'une rubrique à l'autre ;
   et, de bord à bord, au milieu de l'écart (40 % d'écran, LE CONTRAT) entre la galerie
   et les illustrations. Le masque est l'encre : la couleur de la maison le peint, ses deux
   tons sont les deux opacités du dessin. */
.az-rub{--fr:url(/gabarits/azulejo-frise-chaine.svg)}
.az-rub:nth-of-type(4n+2){--fr:url(/gabarits/azulejo-frise-fleur.svg)}
.az-rub:nth-of-type(4n+3){--fr:url(/gabarits/azulejo-frise-etoile.svg)}
.az-rub:nth-of-type(4n){--fr:url(/gabarits/azulejo-frise-entrelacs.svg)}
.az-rub:not(.az-rub--breve)>.az-titre::before,.az-pied::before{content:"";display:block;width:min(100%,25rem);height:1.75rem;margin:0 auto 1.1rem;background:var(--a);mask:var(--fr,url(/gabarits/azulejo-frise-fleur.svg)) 50% 50%/auto 100% round no-repeat}
.az-rub--plaque>.az-titre::before,.az-pied::before{background:var(--email)}
.az-rub--ecart-haut::before,.az-rub--ecart-bas::after{display:block;--t:2.5rem;width:100vw;height:var(--t);margin:var(--e) calc(50% - 50vw);border-block:3px solid var(--a)}
.az-rub--ecart-haut{padding-top:0}
.az-rub--ecart-haut::before{--e:max(2rem,21svh - 3rem)}
.az-rub--ecart-bas::after{--e:max(1rem,21svh - var(--pas)/2 - 3rem)}
/* LE CARREAU : l'émail cerné de la couleur ; à chaque coin, le disque du mur
   (--k, le trait ; --f, le fond ; --c, le rayon), anneau blanc et anneau au lavis. */
:where(.az-carreau,.az-plaque,.az-illus,.az-rdv,.az-avis,.az-rub--breve,.az-sem__j){--k:var(--a);--f:var(--email);--c:.75rem;
--q:var(--k) var(--c),var(--email) calc(var(--c) + 1px) calc(var(--c) + 2px),var(--b) calc(var(--c) + 3px) calc(var(--c) + 5px),#0000 calc(var(--c) + 6px);border:1px solid var(--k);
background:radial-gradient(circle at 0 0,var(--q)),radial-gradient(circle at 100% 0,var(--q)),radial-gradient(circle at 0 100%,var(--q)),radial-gradient(circle at 100% 100%,var(--q)) var(--f)}
/* Le double filet des cartouches : posés l'un contre l'autre, ils font une bande blanche. */
:is(.az-plaque,.az-couv,.az-menu,.az-avis,.az-rdv){box-shadow:0 0 0 .3rem var(--email),0 0 0 calc(.3rem + 1px) var(--a)}
/* Les étiquettes, les liens, les boutons */
.az-etiquette{font:700 .8125rem/1.35 var(--lineale);letter-spacing:.14em;text-transform:uppercase;color:var(--a)}
.az-ord{text-transform:none}
.az-auj{display:inline-block;margin-left:.4em;padding:.2em .6em .15em;background:var(--a);color:var(--email);font:700 .6875rem/1.3 var(--lineale);letter-spacing:.1em;vertical-align:.12em}
.az-lien{display:inline-flex;align-items:center;min-height:2.75rem;max-width:100%;font-weight:600;overflow-wrap:anywhere;text-decoration:underline 2px var(--a)}
.az-lien:hover{color:var(--a)}
.az-marche--auj .az-lien:hover{color:inherit;text-decoration-thickness:3px}
.az-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.625rem}
.az-btn{flex:1 1 100%;display:inline-flex;align-items:center;justify-content:center;min-height:3rem;padding:.6rem 1.4rem;border:1px solid var(--a);border-radius:2px;background:var(--email);
font:700 .9375rem/1.2 var(--lineale);letter-spacing:.06em;text-transform:uppercase;text-align:center;text-decoration:none;color:var(--a);transition:background-color .25s,color .25s}
.az-btn:hover,.r--g-azulejo .az-btn--plein{background:var(--a);color:var(--email)}
.az-btn--plein:hover{background:var(--encre);border-color:var(--encre)}
/* L'en-tête : la barre blanche, puis le mur. Au téléphone et sur tablette,
   huit et dix carreaux de large : une demi-fleur dans chaque marge. */
.az-barre{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 1.5rem;min-height:3rem;padding:.25rem var(--marge);background:var(--email)}
.az-barre__metier{overflow-wrap:anywhere;font:700 .8125rem/1.3 var(--lineale);letter-spacing:.16em;text-transform:uppercase;color:var(--gris)}
.az-barre__ville{color:var(--a)}
.az-barre__ville::before{content:"";display:inline-block;width:.45em;height:.45em;margin:0 .7em .12em .5em;background:var(--a);rotate:45deg}
.az-nav{display:none;gap:0 1.75rem}
.az-nav__lien{display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;min-height:2.75rem;font-weight:600;text-decoration:none}
.az-nav__lien:hover{color:var(--a);text-decoration:underline 2px}
.az-mur,.az-contact{--t:12.5vw;--d:calc(var(--t)/2);position:relative;border-block:3px solid var(--a);padding:calc(var(--t) + .3rem + 1px) calc(var(--d) + .3rem + 1px)}
.az-mur{display:grid;gap:calc(.6rem + 1px)}
.az-plaque{container-type:inline-size;padding:2.4rem 1.25rem 2rem;text-align:center}
.az-logo{width:fit-content;margin:0 auto 1.25rem;line-height:0}
.az-logo img{width:auto;max-width:min(15rem,70cqi);max-height:min(6.5rem,18vw);
filter:drop-shadow(.6px 0 0 var(--encre)) drop-shadow(-.6px 0 0 var(--encre)) drop-shadow(0 .6px 0 var(--encre)) drop-shadow(0 -.6px 0 var(--encre))}
:is(.az-logo--paysage,.az-logo--large) img{max-height:4.5rem}
.az-logo--inconnu img{width:6.5rem;aspect-ratio:1;object-fit:contain}
.az-nom{font:600 var(--n)/1.06 var(--romain);letter-spacing:-.005em;color:var(--a);text-wrap:balance}
.az-nom--xl{--n:min(19cqi,5.5rem)}
.az-nom--l{--n:min(14.5cqi,4.75rem)}
.az-nom--m{--n:min(11.5cqi,3.75rem)}
.az-nom--s{--n:min(9.25cqi,3rem)}
.az-nom--xs{--n:min(7cqi,2.5rem);overflow-wrap:anywhere}
/* Le fleuron : un carreau sur la pointe entre deux filets. */
.az-fleuron{display:flex;align-items:center;justify-content:center;gap:.75rem;margin:1.1rem 0 1rem}
.az-fleuron::before,.az-fleuron::after{content:"";width:3.5rem;height:1px;background:var(--a)}
.az-fleuron span{width:.8rem;height:.8rem;border:1px solid var(--a);background:var(--b);rotate:45deg}
.az-accroche{max-width:30em;margin:0 auto;font:italic 400 clamp(1.25rem,1.1rem + .7vw,1.5rem)/1.45 var(--romain);text-wrap:pretty}
.az-tete .az-actions{margin-top:1.5rem}
.az-note{margin-top:1rem;font:italic 1rem/1.4 var(--romain);color:var(--gris)}
/* La couverture, un tableau dans son cadre : elle garde sa place avant d'être chargée. */
.az-couv{padding:.5rem;background:var(--email);border:1px solid var(--a)}
.az-couv img{width:100%;aspect-ratio:4/5;max-height:72svh;object-fit:cover}
.az-couv--carre img{aspect-ratio:1}
:is(.az-couv--paysage,.az-couv--large) img{aspect-ratio:5/4}
.az-rdv{--c:.6rem;display:grid;gap:.35rem;padding:1.25rem 1.5rem .5rem;text-align:center}
.az-rdv__lignes{display:grid;gap:.5rem}
.az-rdv__ou{font:600 clamp(1.5rem,1.3rem + 1vw,1.875rem)/1.15 var(--romain);color:var(--a)}
.az-rdv__h{display:block;margin-top:.15rem;font-weight:600}
/* Les rubriques : chaque titre centré sous sa frise */
.az-rub{width:var(--large);margin-inline:auto;padding-top:var(--pas)}
.az-titre{font:600 clamp(1.875rem,1.4rem + 2vw,2.75rem)/1.12 var(--romain);color:var(--a);text-wrap:balance}
.az-rub>.az-titre{margin-bottom:clamp(2rem,4vw,3rem);text-align:center}
.az-texte{display:grid;gap:1em;max-width:40em;text-wrap:pretty}
.az-texte--grand{font-size:clamp(1.1875rem,1.05rem + .5vw,1.375rem);line-height:1.55}
:is(.az-rub--texte,.az-rub--maison,.az-rub--plaque):not(.az-rub--illus) .az-rub__corps{max-width:40rem;margin-inline:auto}
.az-rub > .az-rub__corps > .az-actions{margin-top:2rem}
/* Le message du moment : une plaque */
.az-avis{--c:.6rem;width:min(46rem,100% - 2*var(--marge) - .7rem);margin:var(--pas) auto 0;padding:1.75rem 1.5rem 1.5rem;text-align:center}
.az-avis__texte{margin:.75rem auto 0;font:400 clamp(1.1875rem,1.05rem + .6vw,1.375rem)/1.5 var(--romain)}
.az-avis__date{margin-top:.75rem;font-weight:600;color:var(--a)}
/* Les marchés : la frise des sept jours, puis un carreau par marché, chaque rangée centrée */
.az-sem{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;max-width:24rem;margin:0 auto 2rem}
.az-sem__j{--c:.2rem;display:grid;place-items:center;aspect-ratio:1;font:600 1.25rem/1 var(--romain);color:var(--a)}
.az-sem .az-sem__j--oui{--k:var(--email);--f:var(--a);color:var(--email)}
.az-sem__j--auj{outline:2px solid var(--a);outline-offset:3px}
.az-marches{display:flex;flex-wrap:wrap;justify-content:center;gap:1.25rem}
.az-marche{flex:1 1 15rem;min-width:0;display:grid;gap:.3rem;align-content:start;padding:1.6rem 1.25rem .6rem;text-align:center}
.az-marche__commune{font:600 clamp(1.625rem,1.4rem + 1vw,2rem)/1.1 var(--romain);color:var(--a)}
.az-marche__heures{font-weight:600}
.az-marche__lieu{font:italic 1.0625rem/1.4 var(--romain);color:var(--gris)}
.az-marche--auj{--k:var(--email);--f:var(--a);color:var(--email)}
.az-marche--auj :is(.az-etiquette,.az-marche__commune,.az-marche__lieu){color:inherit}
.az-marche--auj .az-auj{background:var(--email);color:var(--a)}
.az-marche--auj .az-lien{text-decoration-color:currentColor}
/* La boutique */
.az-boutique{display:grid;gap:2.5rem;max-width:62rem;margin-inline:auto}
.az-adresse{display:grid;gap:.4rem;align-content:center;justify-items:center;text-align:center}
.az-adresse__ligne{max-width:14em;font:600 clamp(1.625rem,1.3rem + 1.4vw,2.25rem)/1.2 var(--romain);color:var(--a)}
.az-heures{padding:1.5rem 1.5rem 1rem}
.az-heures .az-etiquette{text-align:center;margin-bottom:.5rem}
.az-horaire{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.2rem 1rem;padding:.6rem 0;border-bottom:1px solid var(--filet)}
.az-horaire:last-child{border-bottom:0}
.az-horaire__h{margin-left:auto;text-align:right}
.az-horaire--ferme{color:var(--gris)}
.az-horaire--auj{font-weight:700}
/* La carte, dans son grand cartouche ; une catégorie courte ne se coupe pas entre deux colonnes */
.az-menu{--c:1.25rem;max-width:42rem;margin-inline:auto;padding:clamp(2.6rem,5vw,3.25rem) clamp(1.5rem,5vw,3.5rem)}
.az-groupe{padding-bottom:2rem}
.az-groupe:last-child{padding-bottom:0}
.az-groupe--entier{break-inside:avoid}
.az-cat{display:flex;align-items:center;gap:.7rem;margin-bottom:.35rem;font:italic 400 clamp(1.5rem,1.3rem + .8vw,1.875rem)/1.2 var(--romain);color:var(--a);break-after:avoid}
.az-cat::before{content:"";flex:none;width:.6rem;height:.6rem;border:1px solid var(--a);background:var(--b);rotate:45deg}
.az-plat{padding:.9rem 0;border-bottom:1px solid var(--filet);break-inside:avoid}
.az-plat:last-child{border-bottom:0}
.az-plat__ligne{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.az-plat__nom{min-width:0;font-weight:600;overflow-wrap:anywhere}
.az-plat__prix{flex:none;white-space:nowrap;font:600 1.25rem/1.25 var(--romain);font-variant-numeric:lining-nums;color:var(--a)}
.az-plat__desc{margin-top:.15rem;font:italic 1.0625rem/1.45 var(--romain);color:var(--gris)}
.az-plat__allergenes{margin-top:.2rem;font-size:.875rem;color:var(--gris)}
/* Qui nous sommes : la lettrine en carreau */
.az-maison>p:first-child::first-letter{float:left;margin:.35rem .75rem 0 0;padding:.14em .2em .04em;border:4px double var(--fond);background:var(--a);color:var(--email);font:600 3.6em/.85 var(--romain)}
/* Les photos qui restent, posées comme des carreaux, jointes d'un filet */
.az-galerie{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;max-width:66rem;margin-inline:auto;padding:4px;background:var(--joint);border:1px solid var(--a)}
.az-ph{background:var(--email)}
.az-ph img{width:100%;aspect-ratio:1;object-fit:cover}
:is(.az-galerie--1,.az-galerie--3,.az-galerie--5)>.az-ph:last-child{grid-column:1/-1}
:is(.az-galerie--3,.az-galerie--5)>.az-ph:last-child img{aspect-ratio:2}
.az-galerie--1{max-width:40rem}
.az-galerie--1 img{aspect-ratio:3/2}
/* L'illustration : une photo d'appoint, dans son petit cadre à coins ronds */
.az-illus{--c:.5rem;margin:0 0 2rem;padding:.6rem}
.az-rub--bas>.az-illus{margin:2.5rem 0 0}
.az-illus img{width:100%;aspect-ratio:3/2;max-height:40svh;object-fit:cover}
/* Le traiteur : la plaque pleine de la couleur, émail dessus */
.az-rub.az-rub--plaque{width:min(76rem,100%);margin-top:var(--pas);padding:clamp(3rem,7vw,5rem) var(--marge);background:var(--a);color:var(--email)}
.az-rub--plaque>.az-titre{color:inherit}
.az-rub--plaque .az-btn{background:var(--a);border-color:var(--email);color:var(--email)}
.r--g-azulejo .az-rub--plaque .az-btn--plein,.az-rub--plaque .az-btn:hover{background:var(--email);color:var(--a)}
/* Les brèves, chacune sur son carreau */
.az-breves{display:grid;gap:1.25rem;width:var(--large);margin:var(--pas) auto 0}
.az-breves>.az-rub{width:auto;padding:2rem 1.5rem 1.75rem}
.az-rub--breve .az-titre{margin-bottom:1rem;font-size:clamp(1.5rem,1.3rem + .8vw,1.875rem);text-align:center}
.az-rub--breve .az-texte{margin-inline:auto}
/* Le contact : le mur, et dessus la plaque */
.az-contact{margin-top:var(--pas)}
.az-plaque--contact{max-width:50rem;margin-inline:auto;padding:2.5rem 1.25rem 2rem}
.az-contact__tel{margin:.75rem 0 1.25rem}
.az-contact__num{font:600 min(14cqi,5rem)/1 var(--romain);font-variant-numeric:lining-nums;color:var(--a);text-decoration:none;overflow-wrap:anywhere}
.az-contact__tel--long .az-contact__num{font-size:min(10.5cqi,4rem)}
.az-contact__num:hover{text-decoration:underline 2px}
.az-contact__tel--vide{font:italic min(9cqi,3rem)/1.1 var(--romain);color:var(--gris)}
.az-infos{display:grid;gap:1.75rem 2rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));margin-top:2rem;padding-top:1.75rem;border-top:1px solid var(--filet)}
.az-info{display:grid;gap:.4rem;align-content:start;justify-items:center}
.az-services{display:grid;gap:.2rem}
.az-reseaux{display:grid}
/* Le pied, plein de la couleur */
.az-pied{display:grid;gap:.5rem;justify-items:center;padding:2.75rem var(--marge) 2.5rem;background:var(--a);color:var(--email);text-align:center;font-size:.9375rem;line-height:1.5}
.az-pied__nom{font:600 clamp(1.625rem,1.3rem + 1.5vw,2.25rem)/1.15 var(--romain);text-wrap:balance}
.az-pied .az-etiquette{color:var(--email)}
.az-pied a{display:inline-flex;align-items:center;min-height:2.75rem}
.az-pied--appel{padding-bottom:calc(5.5rem + env(safe-area-inset-bottom))}
/* La barre d'appel ; l'en-tête et le contact n'en répètent pas les boutons (az-btn--barre). */
.az-appel{position:fixed;inset:auto 0 0;z-index:10;display:flex;padding-bottom:env(safe-area-inset-bottom);background:var(--a);color:var(--email);box-shadow:0 -3px 0 var(--email),0 -4px 0 var(--a)}
.az-appel a{flex:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:0 .5em;min-width:0;min-height:3.5rem;padding:.4rem var(--marge);font:700 .9375rem/1.2 var(--lineale);letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.az-appel__num{font:600 1.375rem/1 var(--romain);letter-spacing:0}
.az-appel>a+a{flex:none;border-left:1px solid var(--email)}
@media screen and (max-width:63.99rem){:root:has(.az-appel){scroll-padding-bottom:calc(5rem + env(safe-area-inset-bottom))}
.az-btn--barre,.az-actions--barre{display:none}
}
/* Tablette */
@media (min-width:40rem){
.az-btn{flex:none;min-width:13rem}
.az-nav{display:flex}
.az-mur,.az-contact{--t:10vw}
.az-plaque{padding:3rem 2.5rem 2.5rem}
.az-boutique{grid-template-columns:repeat(auto-fit,minmax(17rem,1fr))}
.az-marche{max-width:17rem}
.az-breves--2,.az-breves--3{grid-template-columns:repeat(2,minmax(0,1fr))}
.az-galerie--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.az-galerie--4>.az-ph:last-child{grid-column:auto}
}
/* Ordinateur : une illustration à côté de son titre et de son contenu, au tiers au plus */
@media (min-width:64rem){
.az-appel{display:none}
.az-pied--appel{padding-bottom:2.5rem}
.az-mur{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:calc(.6rem + 1px) clamp(2.5rem,5vw,4.5rem);padding-inline:max(var(--marge),(100% - 76rem)/2)}
.az-mur,.az-contact{--t:5.5rem}
.az-tete--cote .az-couv{grid-column:2;grid-row:1/span 2}
.az-couv img{max-height:calc(100svh - 10rem)}
.az-tete--bandeau .az-mur{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.az-tete--bandeau .az-rdv{grid-area:1/2;align-self:center}
.az-tete--bandeau .az-mur:not(:has(.az-rdv)) .az-plaque{grid-column:1/-1;justify-self:center;width:min(100%,46rem)}
.az-tete--bandeau .az-couv{grid-column:1/-1}
.az-tete--nu .az-mur{--t:7rem;grid-template-columns:minmax(0,46rem);justify-content:center}
.az-rub--illus{display:grid;grid-template-columns:minmax(0,1fr) min(32%,24rem);align-items:start;column-gap:clamp(2.5rem,5vw,4.5rem)}
.az-rub--illus>.az-rub__corps{grid-row:2}
.az-rub--illus>.az-illus{grid-area:2/2;align-self:center;margin:0}
.az-rub--longue>.az-illus{align-self:start}
.az-rub--gauche{grid-template-columns:min(32%,24rem) minmax(0,1fr)}
.az-rub--gauche>*{grid-column:2}
.az-rub--gauche>.az-illus{grid-column:1}
.az-rub--illus>.az-illus img{aspect-ratio:1;max-height:none}
.az-rub.az-rub--bas>.az-illus{align-self:end;margin:max(4rem,40svh - 9rem) 0 0}
.az-rub--bas>.az-illus img{aspect-ratio:3/2}
.az-rub.az-rub--plaque{width:min(76rem,100% - 2*var(--marge))}
.az-menu--colonnes{max-width:62rem;columns:2;column-gap:clamp(3rem,6vw,5rem)}
.az-rub--illus .az-menu{columns:1}
/* Un panneau de faïence derrière chaque illustration : le mur continue au milieu de la page et la photo s'y accroche. */
.az-rub--illus::after{display:block;--t:3.4rem;grid-area:2/2/span 9;align-self:center;height:min(100%,32rem);order:-1;margin-inline:-1.1rem;border:1px solid var(--a);box-shadow:0 0 0 .3rem var(--email),0 0 0 calc(.3rem + 1px) var(--a)}
.az-rub--gauche::after{grid-area:2/1/span 9;--t:4.6rem}
.az-rub--longue::after{align-self:start}
.az-rub--bas::after{align-self:end}
.az-rub--plaque.az-rub--illus::after{display:none}
.az-rub.az-rub--illus>.az-illus{margin-inline:1.2rem}
.az-breves--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.az-galerie{grid-template-columns:repeat(3,minmax(0,1fr));max-width:56rem}
.az-galerie--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:44rem}
.az-galerie--1{max-width:36rem}
.az-galerie--4{grid-template-columns:repeat(4,minmax(0,1fr));max-width:64rem}
.az-tete--bandeau .az-couv img{aspect-ratio:16/9}
.az-galerie--3>.az-ph:last-child{grid-column:auto}
.az-galerie--3>.az-ph:last-child img{aspect-ratio:1}
.az-galerie--5{grid-template-columns:repeat(6,minmax(0,1fr))}
.az-galerie--5>.az-ph{grid-column:span 2}
.az-galerie--5>.az-ph:nth-child(n+4){grid-column:span 3}
.az-galerie--5>.az-ph:nth-child(n+4) img{aspect-ratio:3/2}
}
@media (min-width:80rem){.az-rub--illus .az-marche{flex:0 0 calc((100% - 2.5rem)/3);max-width:none}.az-rub--illus .az-marche:nth-child(3n+2){--i:2}.az-rub--illus .az-marche:nth-child(3n){--i:4}}
/* Le click & collect (commande-site.css) : tout est centré sous les titres, comme le reste du gabarit ; le tampon carré, au trait de la maison ; sur le carreau « aujourd'hui », le bouton s'inverse. */
.r--g-azulejo .cc-haut{justify-content:center;margin-top:1.25rem}
.r--g-azulejo .cc-tampon{border-radius:2px;color:var(--a);rotate:none}
.r--g-azulejo :is(.cc-mot,.cc-sous){font-family:var(--romain)}
.r--g-azulejo .cc-etape{color:var(--a);font-family:var(--lineale);letter-spacing:.14em}
.az-rub>:is(.cc-etape,.cc-sous){text-align:center}
.az-rub>.cc-choix{margin-inline:auto}
.az-rub>.cc-suite{text-align:center}
.az-marche .cc-marche{margin-bottom:.9rem}
.az-marche .cc-ligne{justify-content:center}
.az-marche .cc-point{display:none}
.az-marche .cc-ligne--retrait{padding-left:0}
.az-marche .cc-choisir{justify-self:center}
.az-marche--auj{--cc-bouton:var(--email);--cc-sur-bouton:var(--a);--cc-papier:var(--a)}
.r--g-azulejo :is(.cc-choisir,.cc-pas button){border-radius:2px}
.az-appel>.cc-masque+a{flex:1;border-left:0}
@media (min-width:40rem){.az-marche:has(.cc-marche){max-width:19rem}}
@media (min-width:64rem){
.az-rub--illus>.cc-etape{grid-row:2}
.az-rub--illus>.cc-sous{grid-row:3}
.az-rub--illus>.cc-choix{grid-row:4}
.az-rub--illus:has(>.cc-etape)>:is(.az-rub__corps,.az-illus){grid-row:5}
.az-rub--illus>.cc-suite{grid-column:1/-1}
}

/* L'impression : encre noire sur blanc, ni mur, ni frise, ni barre, ni matière (reflets, ombres, craquelure) ; aucun texte blanc. */
@media print{
.r--g-azulejo.r--g-azulejo{--a:#000000;--b:#BBBBBB;--fond:#FFFFFF;--joint:#FFFFFF;--gris:#333333;font-size:11pt}
.az-appel,.az-nav,.az-sem,.az-rub::before,.az-rub::after,.r--g-azulejo .az-rub>.az-titre::before,.az-pied::before,.az-barre::after,.az-tete::after,
:is(.az-mur,.az-contact,.az-plaque,.az-couv,.az-menu,.az-avis,.az-rdv,.az-carreau,.az-illus,.az-rub--breve)::before,
:is(.az-mur,.az-contact,.az-plaque,.az-couv,.az-menu,.az-avis,.az-rdv,.az-carreau,.az-illus,.az-rub--breve)::after{display:none}
.r--g-azulejo,.r--g-azulejo *{text-shadow:none}
.az-mur,.az-contact{background:none;border:0;padding-inline:0}
.r--g-azulejo img{max-height:9cm;width:auto!important}
.az-logo img{max-height:3cm}
:is(.az-couv,.az-illus){width:fit-content;margin-inline:auto}
.r--g-azulejo :is(.az-rub--plaque,.az-pied,.az-marche--auj,.az-btn,.az-auj),.az-pied .az-etiquette,.az-maison>p:first-child::first-letter{background:none;color:var(--encre)}
:is(.az-couv,.az-illus,.az-ph,.az-marche,.az-plat,.az-info,.az-heures,.az-rdv,.az-plaque,.az-avis,.az-galerie,.az-rub--breve,.az-actions){break-inside:avoid}
.az-illus{break-after:avoid}
.az-rub--bas>.az-illus{break-after:auto;break-before:avoid}
.az-titre,.az-cat{break-after:avoid}
}
/* L'ÉMAIL (09/10/2026, puis 26/10/2026). Une lumière rasante traverse le mur, les cartouches sont posés en saillie (l'épaisseur du carreau, l'ombre) et l'émail
   s'amasse au bord comme sur un carreau cuit : un lavis le long du filet, un reflet qui glisse (au défilement, puis au survol), les nuances de la cuisson
   (azulejo-email.svg, sur le mur et les aplats), une craquelure très fine (azulejo-craquele.svg, sur les cartouches), des festons aux quatre coins
   (azulejo-coin-*.svg, à l'encre de la maison) et, au milieu du haut des grandes plaques, une coquille festonnée (azulejo-fronton.svg). Sur un cartouche plein, le reflet se tait : le texte blanc garde son contraste. Le mur se creuse en haut et en bas. Rien pour l'impression. */
@property --sx{syntax:"<percentage>";inherits:false;initial-value:45%}
@property --hx{syntax:"<percentage>";inherits:false;initial-value:0%}
@property --on{syntax:"<number>";inherits:false;initial-value:1}
@property --ir{syntax:"<number>";inherits:false;initial-value:1}
@media screen{
.r--g-azulejo{--ombre:color-mix(in srgb,var(--a) 45%,#000);--epais:color-mix(in srgb,var(--a) 22%,#fff);--bord:color-mix(in srgb,var(--b) 60%,#0000);--teinte:color-mix(in srgb,var(--b) 14%,#0000)}
.az-mur,.az-contact{isolation:isolate}
.az-mur::after,.az-contact::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;box-shadow:inset 0 1.5rem 1.7rem -1.2rem #0000003D,inset 0 -1.5rem 1.7rem -1.2rem #0000003D;
background:linear-gradient(112deg,#FFFFFF00 28%,#FFFFFF80 46%,#FFFFFF00 64%) 42% 0/260% 100% no-repeat,radial-gradient(130% 90% at 50% 0,#FFFFFF66,#FFFFFF00 62%),url(/gabarits/azulejo-email.svg) 0 0/30rem 20rem}
.az-mur>*,.az-contact>*{position:relative;z-index:1}
:is(.az-plaque,.az-couv,.az-menu,.az-avis,.az-rdv,.az-carreau,.az-illus,.az-rub--breve){position:relative;isolation:isolate}
:is(.az-plaque,.az-couv,.az-menu,.az-avis,.az-rdv,.az-carreau,.az-illus,.az-rub--breve)::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
background:linear-gradient(105deg,#0000 42%,#FFFFFFE6 50%,#0000 58%) var(--hx) 0/260% 100% no-repeat,linear-gradient(118deg,#0000 14%,var(--teinte) 36%,#FFFFFFE6 45%,#0000 53%) var(--sx) 0/250% 100% no-repeat,url(/gabarits/azulejo-craquele.svg) 0 0/24rem 16rem}
:is(.az-plaque,.az-couv,.az-menu,.az-avis,.az-rdv){box-shadow:inset 0 0 .9rem -.1rem var(--bord),0 0 0 .3rem var(--email),0 0 0 calc(.3rem + 1px) var(--a),0 calc(.3rem + 1px + .5rem) 0 -.02rem var(--epais),0 2rem 2.2rem -1.1rem color-mix(in srgb,var(--ombre) 70%,#0000)}
:where(.az-carreau,.az-illus,.az-rub--breve){box-shadow:inset 0 0 .8rem -.1rem var(--bord),0 .45rem 0 -.05rem var(--epais),0 1.3rem 1.6rem -.9rem color-mix(in srgb,var(--ombre) 65%,#0000)}
.az-marche--auj{box-shadow:0 .45rem 0 -.05rem var(--epais),0 1.3rem 1.6rem -.9rem color-mix(in srgb,var(--ombre) 65%,#0000)}
/* Les festons des cartouches de texte ; les photos, elles, ont une frise au-dessus et au-dessous. */
:is(.az-plaque,.az-menu,.az-avis,.az-rdv,.az-carreau,.az-rub--breve)::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;--co:min(calc(var(--c)*5),3.75rem);--coins:url(/gabarits/azulejo-coin-hg.svg) 0 0/var(--co) var(--co) no-repeat,url(/gabarits/azulejo-coin-hd.svg) 100% 0/var(--co) var(--co) no-repeat,url(/gabarits/azulejo-coin-bg.svg) 0 100%/var(--co) var(--co) no-repeat,url(/gabarits/azulejo-coin-bd.svg) 100% 100%/var(--co) var(--co) no-repeat;background:var(--a);mask:var(--coins)}
.az-plaque::after{mask:var(--coins),url(/gabarits/azulejo-fronton.svg) 50% .3rem/auto 1.6rem no-repeat}
.az-marche--auj::after{background:var(--email)}
.az-marche--auj::before{background:linear-gradient(160deg,#FFFFFF14,#0000 55%),url(/gabarits/azulejo-craquele.svg) 0 0/24rem 16rem}
:is(.az-couv,.az-illus){padding-block:1.75rem}
.az-galerie{position:relative;padding-block:1.9rem;background:linear-gradient(var(--email),var(--email)) 0 0/100% 1.55rem no-repeat,linear-gradient(var(--email),var(--email)) 0 100%/100% 1.55rem no-repeat,var(--joint)}
:is(.az-couv,.az-illus,.az-galerie)::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--a);mask:var(--fr) 50% .35rem/auto 1.1rem round no-repeat,var(--fr) 50% calc(100% - .35rem)/auto 1.1rem round no-repeat}
/* L'en-tête : un bandeau au pied de la barre et sous le mur, comme les frises qui bordent un panneau de faïence. */
.az-tete{--fr:url(/gabarits/azulejo-frise-entrelacs.svg)}
.az-barre{position:relative;padding-bottom:1.5rem}
.az-barre::after,.az-tete::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.1rem;background:var(--a);mask:var(--fr) 50% 100%/auto 100% repeat-x}
.az-tete::after{position:static;display:block;height:3rem;margin-top:.9rem;mask:url(/gabarits/azulejo-frise-albarrada.svg) 50% 100%/auto 100% repeat-x}
/* Le traiteur et le pied : le même aplat, un treillis de losanges à peine lisible, et des frises blanches. */
.az-rub.az-rub--plaque,.az-pied{background-image:repeating-linear-gradient(45deg,#FFFFFF24 0 1px,#0000 2px 2.4rem),repeating-linear-gradient(-45deg,#FFFFFF24 0 1px,#0000 2px 2.4rem),url(/gabarits/azulejo-email.svg);background-size:auto,auto,30rem 20rem;background-position:0 0,0 0,0 0}
.az-rub.az-rub--plaque{position:relative;outline:1px solid var(--email);outline-offset:-.8rem}
.az-rub--plaque::before{content:"";position:absolute;inset:0 1.5rem;pointer-events:none;background:var(--email);mask:var(--fr) 50% 1.1rem/auto 1.2rem repeat-x,var(--fr) 50% calc(100% - 1.1rem)/auto 1.2rem repeat-x}
.az-rub.az-rub--plaque>.az-titre::before{display:none}
.az-btn{box-shadow:0 .2rem 0 color-mix(in srgb,var(--a) 70%,#000)}
}

/* LE MOUVEMENT, posé comme un carreleur ; tout est visible sans lui. Au chargement : le mur se découvre carreau après carreau (une vague en diagonale, chaque
   carreau s'ouvre en rosace), les plaques se redressent dessus, le fleuron tourne d'un quart de tour, la couverture se développe, le bandeau du haut se
   trace depuis le milieu. Au défilement (sous @supports animation-timeline: view()) : les cartouches se redressent et leur reflet glisse, les photos se
   découvrent, les frises des titres et le bandeau d'albarradas se tracent depuis le milieu, le mur du contact se pose et les panneaux de faïence se redressent. Au survol : un reflet d'émail traverse
   le cartouche, qui se soulève. Aucune boucle. */
@media screen and (prefers-reduced-motion:no-preference){
.az-mur::before{mask:radial-gradient(circle,#000 calc(var(--ir)*100%),#0000 calc(var(--ir)*100% + 1px)) 50% 0/var(--t) var(--t) repeat round,linear-gradient(112deg,#000 calc(var(--on)*150% - 50%),#0000 calc(var(--on)*150%));mask-composite:intersect;animation:az-cascade 2s cubic-bezier(.45,.1,.3,1) .1s both}
.az-mur>*{animation:az-redresse 1.1s cubic-bezier(.2,.8,.2,1) both}
.az-mur>:nth-child(2){animation-delay:.15s}
.az-mur>:nth-child(3){animation-delay:.3s}
.az-mur::after,.az-contact::after{animation:az-lustre 3.4s ease-out .8s both}
.az-fleuron span{animation:az-tourne 1.1s cubic-bezier(.2,.7,.2,1) .5s both}
.az-couv img{animation:az-developpe 2.2s ease .3s both}
.az-barre::after{animation:az-trace 1.6s cubic-bezier(.3,.6,.2,1) .35s both}
.az-btn{transition:translate .15s,box-shadow .15s,background-color .25s,color .25s}
.az-btn:hover{translate:0 .12rem;box-shadow:0 .08rem 0 color-mix(in srgb,var(--a) 70%,#000)}
.az-btn:active{translate:0 .2rem;box-shadow:none}
@media (hover:hover){
.az-carreau,.az-illus,.az-ph,.az-rub--breve{transition:translate .4s cubic-bezier(.2,.7,.2,1)}
.az-carreau:hover,.az-illus:hover,.az-ph:hover,.az-rub--breve:hover{translate:0 -.35rem}
:is(.az-plaque,.az-couv,.az-menu,.az-avis,.az-rdv,.az-carreau,.az-illus,.az-rub--breve):hover::before{--hx:100%;transition:--hx 1.1s cubic-bezier(.25,.6,.2,1)}
}
@supports (animation-timeline:view()){
:is(.az-rub>.az-titre,.az-texte,.az-adresse,.az-plaque--contact){animation:az-pose linear both;animation-timeline:view(block 0 4rem);animation-range:entry 0 entry 8rem}
:is(.az-carreau,.az-avis,.az-rub--breve,.az-sem__j){animation:az-redresse linear both;animation-timeline:view(block 0 4rem);animation-range:entry calc(var(--i,0)*1.1rem) entry calc(8rem + var(--i,0)*1.1rem)}
.az-sem__j:nth-child(2){--i:1}.az-sem__j:nth-child(3){--i:2}.az-sem__j:nth-child(4){--i:3}.az-sem__j:nth-child(5){--i:4}.az-sem__j:nth-child(6){--i:5}.az-sem__j:nth-child(7){--i:6}
:is(.az-illus,.az-ph){animation:az-redresse linear both;animation-timeline:view();animation-range:entry 0 entry 85%}
:is(.az-illus,.az-ph) img{animation:az-voile linear both,az-glisse linear both;animation-timeline:view(),view();animation-range:entry 0 cover 30%,cover 0% cover 100%}
.az-couv img{animation:az-developpe 2.2s ease .3s both,az-derive linear both;animation-timeline:auto,scroll(root);animation-range:normal,0 90svh}
.az-rub:not(.az-rub--breve)>.az-titre::before{animation:az-trace linear both;animation-timeline:view(block 0 4rem);animation-range:entry 0 entry 12rem}
.az-tete::after{animation:az-trace linear both;animation-timeline:view();animation-range:entry 0 entry 100%}
.az-contact::before{animation:az-pose linear both;animation-timeline:view();animation-range:entry 0 entry 85%}
.az-rub--illus::after{animation:az-redresse linear both;animation-timeline:view();animation-range:entry 0 entry 85%}
:is(.az-plaque,.az-menu,.az-avis,.az-rdv,.az-carreau,.az-rub--breve)::before{animation:az-reflet linear both;animation-timeline:view();animation-range:cover}
}
}
@keyframes az-pose{from{opacity:0;translate:0 1.25rem}}
@keyframes az-tourne{from{opacity:0;rotate:-135deg}}
@keyframes az-voile{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
@keyframes az-redresse{from{opacity:0;transform:perspective(70rem) rotateX(26deg) translateY(1.4rem);transform-origin:50% 100%}}
@keyframes az-lustre{from{background-position:130% 0,0 0,0 0}}
@keyframes az-developpe{from{filter:saturate(.15) brightness(1.3) contrast(.8)}}
@keyframes az-glisse{from{object-position:50% 25%}to{object-position:50% 75%}}
@keyframes az-derive{to{object-position:50% 72%}}
@keyframes az-cascade{from{--on:0;--ir:0}}
@keyframes az-trace{from{clip-path:inset(0 50% 0 50%)}to{clip-path:inset(0)}}
@keyframes az-reflet{from{--sx:0%}to{--sx:100%}}

/* L'aperçu */
:root:has(> body.r--apercu){scrollbar-width:none}
:root:has(> body.r--apercu)::-webkit-scrollbar{display:none}

/* CADRAGE DES PHOTOS : data-cx et data-cy, le point de la photo que le cadre garde visible (outils-dev/cadrage-css.mjs) */
img[data-cx],img[data-cy]{object-position:var(--cx,50%) var(--cy,50%)!important}img[data-cx="0"]{--cx:0%}img[data-cx="5"]{--cx:5%}img[data-cx="10"]{--cx:10%}img[data-cx="15"]{--cx:15%}img[data-cx="20"]{--cx:20%}img[data-cx="25"]{--cx:25%}img[data-cx="30"]{--cx:30%}img[data-cx="35"]{--cx:35%}img[data-cx="40"]{--cx:40%}img[data-cx="45"]{--cx:45%}img[data-cx="50"]{--cx:50%}img[data-cx="55"]{--cx:55%}img[data-cx="60"]{--cx:60%}img[data-cx="65"]{--cx:65%}img[data-cx="70"]{--cx:70%}img[data-cx="75"]{--cx:75%}img[data-cx="80"]{--cx:80%}img[data-cx="85"]{--cx:85%}img[data-cx="90"]{--cx:90%}img[data-cx="95"]{--cx:95%}img[data-cx="100"]{--cx:100%}img[data-cy="0"]{--cy:0%}img[data-cy="5"]{--cy:5%}img[data-cy="10"]{--cy:10%}img[data-cy="15"]{--cy:15%}img[data-cy="20"]{--cy:20%}img[data-cy="25"]{--cy:25%}img[data-cy="30"]{--cy:30%}img[data-cy="35"]{--cy:35%}img[data-cy="40"]{--cy:40%}img[data-cy="45"]{--cy:45%}img[data-cy="50"]{--cy:50%}img[data-cy="55"]{--cy:55%}img[data-cy="60"]{--cy:60%}img[data-cy="65"]{--cy:65%}img[data-cy="70"]{--cy:70%}img[data-cy="75"]{--cy:75%}img[data-cy="80"]{--cy:80%}img[data-cy="85"]{--cy:85%}img[data-cy="90"]{--cy:90%}img[data-cy="95"]{--cy:95%}img[data-cy="100"]{--cy:100%}
/* FIN DU CADRAGE DES PHOTOS */