/* Mise en page image-first locale, en conservant les composants natifs du site. */
#cek-facade .c27-color{padding:34px 0 0;scroll-margin-top:24px}
#cek-facade .c27-first-heading .s-head{margin:0 0 16px}
#cek-facade .c27-first-heading h1{font-size:clamp(30px,4vw,48px);line-height:1.08;margin:0 0 8px;color:var(--ink)}
#cek-facade .c27-first-heading h2{font-size:clamp(22px,2.5vw,32px);line-height:1.15;margin:0;color:var(--ink)}
#cek-facade .c27-color-heading .s-head{margin:0 0 14px}
#cek-facade .c27-color-heading h2{margin:0}
#cek-facade .c27-color-intro h2{font-size:18px;line-height:1.2;margin:0 0 12px}
#cek-facade .c27-color-photo{position:relative;display:block;width:100vw;margin:0 0 0 calc(50% - 50vw);aspect-ratio:3/2;overflow:hidden;background:var(--mist)}
#cek-facade .c27-color-photo picture{display:block;width:100%;height:100%}
#cek-facade .c27-color-photo img{display:block;width:100%;height:100%;object-fit:contain!important;object-position:center}
#cek-facade .c27-color-card{position:absolute;z-index:3;bottom:16px;display:grid;grid-template-columns:80px minmax(0,1fr);align-items:start;gap:8px 12px;width:min(320px,calc(100vw - 32px));padding:14px;background:rgba(255,255,255,.96);border:1px solid rgba(29,29,31,.10);border-radius:12px;box-shadow:0 8px 30px rgba(29,29,31,.12);color:var(--ink)}
#cek-facade .c27-color-card--intro{opacity:0;transition:opacity .8s ease}
#cek-facade .c27-color-card--intro.is-ready{opacity:1}
#cek-facade .c27-card--right{right:16px}
#cek-facade .c27-card--left{left:16px}
#cek-facade .c27-card-copy{min-width:0}
#cek-facade .c27-card-h1,#cek-facade .c27-card-h2,#cek-facade .c27-card-head,#cek-facade .c27-card-body{grid-column:1/-1}
#cek-facade .c27-card-h1{margin:0;font-size:22px;line-height:1.08;font-weight:600;color:var(--ink)}
#cek-facade .c27-card-lead{grid-column:1/-1;margin:0;font-size:13px;line-height:1.35;color:var(--muted)}
#cek-facade .c27-card-h2,#cek-facade .c27-card-head h2{margin:0;font-size:18px;line-height:1.15;font-weight:600;color:var(--ink)}
#cek-facade .c27-card-head{display:flex;flex-direction:column;gap:3px}
#cek-facade .c27-card-finish{font-size:11px;line-height:1.2;color:var(--muted)}
#cek-facade .c27-card-body{display:grid;grid-template-columns:80px minmax(0,1fr);align-items:start;gap:12px}
#cek-facade .c27-brand-signature{grid-column:1/-1;display:grid;grid-template-columns:64px minmax(0,1fr);align-items:start;gap:10px;margin-top:2px;padding-top:8px;border-top:1px solid rgba(29,29,31,.10);font-size:12px;line-height:1.3}
#cek-facade .c27-brand-signature img{display:block;flex:0 0 64px;width:64px!important;height:64px!important;min-width:64px;min-height:64px;max-width:64px;max-height:64px;object-fit:contain}
#cek-facade .c27-brand-signature img.c27-flamingo--flip{transform:scaleX(-1)}
#cek-facade .c27-brand-copy{min-width:0}
#cek-facade .c27-advice-label{display:block;font-size:12px;line-height:1.2;font-weight:600;color:var(--muted)}
#cek-facade .c27-flamingo-advice{margin:2px 0 4px;font-size:13px;line-height:1.3;font-weight:500;color:#62656a}
#cek-facade .c27-brand-name{display:block;font-size:10px;line-height:1.2;font-weight:650;letter-spacing:.06em;color:var(--ink)}
#cek-facade .c27-brand-name small{font-size:9px;font-weight:500;letter-spacing:.03em;color:var(--muted)}
#cek-facade .c27-color-paragraph{margin:0;font-size:14px;line-height:1.38;color:var(--ink)}
#cek-facade .c27-coming{margin:7px 0 0;font-size:12px;line-height:1.2;font-weight:600;color:var(--blue-link)}
#cek-facade .c27-swatch{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;background:#fff;border:1px solid rgba(29,29,31,.18);border-radius:4px;vertical-align:middle;flex:0 0 auto;overflow:hidden}
#cek-facade .c27-swatch img{display:block;width:100%;height:100%;object-fit:contain!important;background:#fff}
#cek-facade .c27-swatch--large{width:80px;height:80px}
#cek-facade .c27-caption{position:absolute;z-index:4;bottom:16px;padding:5px 9px;background:#f5f1e8;border-radius:6px;font-size:12px;line-height:1.2;color:#4c4944}
#cek-facade .c27-caption--left{left:16px}
#cek-facade .c27-caption--right{right:16px}
#cek-facade .c27-trailer{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#fff;background:rgba(0,0,0,.16);text-align:center;text-shadow:0 2px 18px rgba(0,0,0,.62);pointer-events:none;opacity:1;transform:scale(1);transition:opacity .8s ease,transform .8s ease}
#cek-facade .c27-trailer span{font-size:clamp(80px,15vw,180px);font-weight:700;letter-spacing:.08em;line-height:1}
#cek-facade .c27-trailer small{font-size:clamp(12px,1.4vw,16px);letter-spacing:.08em;text-transform:none}
#cek-facade .c27-trailer.is-fading{opacity:0;transform:scale(1.035)}
#cek-facade .c27-scene-area{padding-top:18px}
#cek-facade .c27-scene-buttons{display:flex;flex-wrap:wrap;gap:8px}
#cek-facade .c27-scene-button{min-height:42px;font-size:14px;padding:0 17px;background:#fff;color:var(--blue-link);border:1px solid var(--blue)}
#cek-facade .c27-scene-button.is-active{background:var(--blue);color:#fff}
#cek-facade .c27-scene-button.is-active,#cek-facade .c27-scene-button.is-active span,#cek-facade .c27-scene-button.is-active:hover,#cek-facade .c27-scene-button.is-active:focus-visible{color:#fff!important}
/* 22/10/2026 : au survol, fond bleu et texte blanc, comme le bouton sélectionné */
#cek-facade .c27-scene-button:hover{background:var(--blue)!important;border-color:var(--blue)}
#cek-facade .c27-scene-button:hover,#cek-facade .c27-scene-button:hover span{color:#fff!important}
#cek-facade .c27-companion{margin:10px 0 0;font-size:13px;color:var(--muted)}
#cek-facade .c27-nav{padding:42px 0 0}
#cek-facade .c27-color-nav{display:flex;flex-wrap:nowrap;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding-bottom:4px}
#cek-facade .c27-color-nav>.c27-color-link{flex:0 0 auto;white-space:nowrap;scroll-snap-align:start}
#cek-facade .c27-color-link{min-height:44px;background:var(--mist);color:var(--ink);border:1px solid var(--line);padding:5px 16px 5px 8px;font-size:14px;gap:9px}
#cek-facade .c27-color-link:hover,#cek-facade .c27-color-link:focus-visible{background:#eaf3ff;color:var(--blue-link)}
#cek-facade .c27-color-link .c27-swatch{width:26px;height:26px;flex:0 0 26px}
#cek-facade .c27-screen-note,#cek-facade .c27-pricing-note{font-size:13px;color:var(--muted);margin-top:14px}
#cek-facade .c27-color-nav a{scroll-margin-top:80px}
#cek-facade .final .btn:not(.light):not(.ghost),#cek-facade .final .btn:not(.light):not(.ghost) span,#cek-facade .final .btn:not(.light):not(.ghost):hover,#cek-facade .final .btn:not(.light):not(.ghost):focus-visible,#cek-facade .final .btn:not(.light):not(.ghost):hover span,#cek-facade .final .btn:not(.light):not(.ghost):focus-visible span{color:#fff!important}
#cek-facade strong{font-family:inherit!important}
@media(max-width:900px){
 #cek-facade .c27-color-photo{position:relative;display:flex;flex-direction:column;width:100vw;height:auto;margin:0 0 0 calc(50% - 50vw);aspect-ratio:auto;overflow:visible}
 #cek-facade .c27-color-photo picture{position:relative;display:block;width:100%;height:auto;aspect-ratio:3/2;flex:0 0 auto}
 #cek-facade .c27-color-photo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain!important}
 #cek-facade .c27-color-card{position:relative;bottom:auto;left:auto;right:auto;z-index:3;align-self:stretch;width:calc(100% - 32px);margin:-16px 16px 0}
 #cek-facade .c27-color-card.c27-card--left{align-self:stretch;margin:-16px 16px 0}
 #cek-facade .c27-trailer{inset:0 0 auto;height:66.667vw}
 #cek-facade .c27-caption{top:calc(66.667vw - 27px);bottom:auto}
}
@media(max-width:760px){
 #cek-facade .c27-color{padding-top:26px}
 #cek-facade .c27-first-heading .s-head{margin-bottom:12px}
 #cek-facade .c27-first-heading h1{font-size:clamp(28px,8vw,36px)}
 #cek-facade .c27-first-heading h2{font-size:23px}
 #cek-facade .c27-color-card{bottom:10px;display:block;width:min(210px,calc(100vw - 20px));padding:10px;border-radius:9px}
 #cek-facade .c27-card--right{right:10px}
 #cek-facade .c27-card--left{left:10px}
 #cek-facade .c27-card-h1{font-size:17px}
 #cek-facade .c27-card-lead{font-size:12px}
 #cek-facade .c27-card-h2,#cek-facade .c27-card-head h2{font-size:16px}
 #cek-facade .c27-card-finish{font-size:10px}
 #cek-facade .c27-card-body{display:block}
 #cek-facade .c27-color-card .c27-swatch--large{float:left;width:54px;height:54px;margin:0 8px 6px 0}
 #cek-facade .c27-color-card .c27-coming{clear:both;padding-top:5px}
 #cek-facade .c27-color-paragraph{font-size:12.5px;line-height:1.3}
 #cek-facade .c27-brand-signature{clear:both;font-size:11px}
 #cek-facade .c27-brand-signature img{width:64px;height:64px}
 #cek-facade .c27-coming{font-size:11px;margin-top:5px}
 #cek-facade .c27-caption{top:calc(66.667vw - 27px);bottom:auto;height:max-content;padding:4px 7px;font-size:10px}
 #cek-facade .c27-caption--left{left:10px}
 #cek-facade .c27-caption--right{right:10px}
 #cek-facade .c27-nav{padding-top:22px}
 #cek-facade .c27-color-intro h2{font-size:18px;line-height:1.2;margin-bottom:10px}
 #cek-facade .c27-color-nav{display:flex;flex-wrap:nowrap;gap:7px;overflow-x:auto;touch-action:pan-x;scrollbar-width:thin}
 #cek-facade .c27-color-link{justify-content:flex-start;min-height:42px;height:auto;padding:5px 8px;font-size:11px;white-space:nowrap}
 #cek-facade .c27-screen-note{font-size:11px;margin-top:8px}
 #cek-facade .c27-color-link .c27-swatch{width:22px;height:22px;flex-basis:22px}
 #cek-facade .c27-scene-buttons{gap:6px}
 #cek-facade .c27-scene-button{flex:1 1 auto;padding:0 10px;font-size:12px}
 #cek-facade .c27-color-card{width:calc(100% - 32px);margin:-16px 16px 0;align-self:stretch}
 #cek-facade .c27-color-card.c27-card--left{margin:-16px 16px 0;align-self:stretch}
}
@media(max-width:560px){
 #cek-facade .c27-color-photo{position:relative;display:flex;flex-direction:column;width:100vw;height:auto;margin:0 0 0 calc(50% - 50vw);aspect-ratio:auto;overflow:visible}
 #cek-facade .c27-color-photo picture{position:relative;display:block;width:100%;height:auto;aspect-ratio:3/2;flex:0 0 auto}
 #cek-facade .c27-color-photo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain!important}
 #cek-facade .c27-color-card{position:relative;bottom:auto;left:auto;right:auto;z-index:3;align-self:stretch;width:calc(100% - 20px);margin:0 10px}
 #cek-facade .c27-color-card.c27-card--left{align-self:stretch;width:calc(100% - 20px);margin:0 10px}
 #cek-facade .c27-color-card--intro{opacity:0}
 #cek-facade .c27-color-card--intro.is-ready{opacity:1}
 #cek-facade .c27-trailer{inset:0 0 auto;height:66.667vw;z-index:10}
 #cek-facade .c27-brand-signature{grid-template-columns:52px minmax(0,1fr);gap:8px}
 #cek-facade .c27-brand-signature img{flex-basis:52px;width:52px!important;height:52px!important;min-width:52px;min-height:52px;max-width:52px;max-height:52px}
 #cek-facade .c27-flamingo-advice{font-size:12px;line-height:1.28}
 #cek-facade .c27-nav{padding-top:16px}
 #cek-facade .c27-color-intro h2{font-size:18px;line-height:1.2;margin:0 0 8px}
 #cek-facade .c27-color-nav{display:flex;flex-wrap:nowrap;gap:7px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;scrollbar-width:thin;padding-bottom:4px}
 #cek-facade .c27-color-link{flex:0 0 auto;justify-content:flex-start;min-height:42px;height:auto;padding:5px 8px;font-size:11px;white-space:nowrap}
 #cek-facade .c27-screen-note{font-size:11px;line-height:1.3;margin-top:6px}
}
@media(max-width:380px){#cek-facade .c27-color-card{width:calc(100% - 20px);grid-template-columns:46px minmax(0,1fr);gap:7px;padding:8px}#cek-facade .c27-color-card .c27-swatch--large{width:46px;height:46px}#cek-facade .c27-color-paragraph{font-size:12px}}
@media(prefers-reduced-motion:reduce){#cek-facade .c27-trailer{transition:none!important}#cek-facade .c27-color-nav a{scroll-behavior:auto!important}}

/* Lien boutique compact sous chaque coloris annonce. */
#cek-facade .c27-color-card a.c27-shop-link{display:inline-flex;align-items:center;min-height:44px;margin-top:2px;padding:0 2px;color:#1769aa;font-size:12px;font-weight:650;line-height:1.2;text-decoration:underline;text-underline-offset:2px;border-radius:3px}
#cek-facade .c27-color-card a.c27-shop-link:hover{color:#0b4f87;text-decoration-thickness:2px}
#cek-facade .c27-color-card a.c27-shop-link:focus-visible{outline:2px solid currentColor;outline-offset:2px}
@media(min-width:861px){#cek-facade .c27-color-card a.c27-shop-link{min-height:32px}}

/* Vues de cuisine a hauteur constante sur desktop. */
@media(min-width:1101px){
 #cek-facade .c27-color-photo{height:90vh;aspect-ratio:auto}
 #cek-facade .c27-color-photo picture{height:100%}
 #cek-facade .c27-color-photo picture img{width:100%;height:100%;object-fit:cover!important;object-position:center bottom}
}
