@charset "UTF-8";
@import url(main.css);
.instagramMiroir-div { margin: 30px 0; }

.animated-border-button { color: #45291e; font-size: 1.2rem !important; }

.animated-border-button:after { background-color: #B44751; }

a.klb-btn.klb-btn--social { width: 52px; font-size: 1.5rem !important; padding: 12px 5px 12px 8px !important; justify-content: center; background: transparent; color: #84503D !important; border: 1.5px solid #84503D; }

.klb-btn--social::before { background: #B44751; }

a.klb-btn.klb-btn--social:hover { color: #F6F4F0 !important; border-color: #B44751 !important; box-shadow: 0 10px 32px rgba(180, 71, 81, 0.35); }

/*-------------------------------------------------------------------------Boutons réservation-------------------------------------------------------------*/
#phone-analytics-tag-reservation-iframe { position: fixed !important; z-index: 99999; }

#phone-analytics-tag-reservation-iframe p { margin-bottom: 0 !important; }

/*------------------------------------------------------------------------------Bannière d'accueil------------------------------------------------------------------*/
/* ════════════════════════════════════════════════ BOUTONS  ════════════════════════════════════════════════ */
a.button_header, a.button_homepageScreen, a.button_homepageDoubleScreen, a.phone-number-button, .klb-btn { font-size: 1rem !important; letter-spacing: 0.1em !important; text-transform: uppercase; text-decoration: none !important; display: inline-flex; align-items: center; gap: 10px; padding: 0 16px !important; height: 52px; border-radius: 100px; position: relative; overflow: hidden; transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.3s ease, color 0.3s ease; z-index: 0; width: fit-content; }

/* Sliding fill commun */
a.button_header::before, a.button_homepageScreen::before, a.button_homepageDoubleScreen::before, a.phone-number-button::before, .klb-btn::before { content: ''; position: absolute; inset: 0; border-radius: 100px; transform: scaleX(0); transform-origin: left center; transition: transform 0.4s cubic-bezier(0.76, 0, 0.24, 1); z-index: -1; }

a.button_header:hover::before, a.button_homepageScreen:hover::before, a.button_homepageDoubleScreen:hover::before, a.phone-number-button:hover::before, .klb-btn:hover::before { transform: scaleX(1); }

a.button_header:hover, a.button_homepageScreen:hover, a.button_homepageDoubleScreen:hover, a.phone-number-button:hover, .klb-btn:hover { transform: translateY(-3px); }

/* button_header — outline terracotta, se remplit en vert */
a.button_header { background: transparent; color: #84503D !important; border: 1.5px solid #84503D; }

a.button_header::before { background: #19623E; }

a.button_header:hover { color: #F6F4F0 !important; border-color: #19623E !important; box-shadow: 0 10px 32px rgba(25, 98, 62, 0.35); }

/* button_homepageScreen + homepageDoubleScreen — rouge plein, se remplit en vert */
a.button_homepageScreen, a.button_homepageDoubleScreen { background: #B44751; color: #F6F4F0 !important; border: 1.5px solid #B44751; box-shadow: 0 4px 20px rgba(180, 71, 81, 0.4); }

a.button_homepageScreen::before, a.button_homepageDoubleScreen::before { background: #19623E; }

a.button_homepageScreen:hover, a.button_homepageDoubleScreen:hover { color: #F6F4F0 !important; border-color: #19623E !important; box-shadow: 0 10px 32px rgba(25, 98, 62, 0.4); }

/* phone-number-button — outline crème (contexte fond sombre), se remplit en crème */
a.phone-number-button { background: transparent; color: #F6F4F0 !important; border: 1.5px solid rgba(246, 244, 240, 0.5); backdrop-filter: blur(6px); }

a.phone-number-button::before { background: #F6F4F0; }

a.phone-number-button:hover { color: #84503D !important; border-color: #F6F4F0 !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); }

/* klb-btn--carte — outline crème hero, se remplit en crème */
.klb-btn--carte { background: transparent; color: #F6F4F0 !important; border: 1.5px solid rgba(246, 244, 240, 0.55); backdrop-filter: blur(6px); }

.klb-btn--carte::before { background: #F6F4F0; }

.klb-btn--carte:hover { color: #84503D !important; border-color: #F6F4F0 !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); }

/* klb-btn--reserver — rouge plein, se remplit en vert */
.klb-btn--reserver { background: #B44751; color: #F6F4F0 !important; border: 1.5px solid #B44751; box-shadow: 0 4px 20px rgba(180, 71, 81, 0.45); }

.klb-btn--reserver::before { background: #19623E; }

.klb-btn--reserver:hover { color: #F6F4F0 !important; border-color: #19623E !important; box-shadow: 0 10px 32px rgba(25, 98, 62, 0.4); }

/* Flèche décorative dans les klb-btn */
.klb-btn__arrow { width: 12px; height: 12px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); flex-shrink: 0; transition: transform 0.25s ease; }

.klb-btn:hover .klb-btn__arrow { transform: rotate(45deg) translate(2px, -2px); }

/* ════════════════════════════════════════════════ HERO ════════════════════════════════════════════════ */
.klb-hero { position: relative; width: 100%; height: 100vh; min-height: 640px; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }

.klb-hero__bg { position: absolute; inset: 0; background-image: url("https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FNcmhUOPoLUcyhuszW7bal9s3l9b2%2Fimages%2Frestaurant_le_kleber_rennes_2d57.webp"); background-size: 110%; background-position: right top; animation: klbZoom 14s ease-out forwards; }

@keyframes klbZoom { from { transform: scale(1.07); }
  to { transform: scale(1); } }

.klb-hero__overlay { position: absolute; inset: 0; background: linear-gradient(to top, #6e4225e0 0%, #3c23129e 50%, #0805030d 100%); }

.klb-hero__grain { position: absolute; inset: 0; opacity: 0.035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: 180px 180px; pointer-events: none; }

/* Personnages hero — fixes, droits, simple fade in */
.klb-char img { display: block; filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.35)); }

.klb-char--2 img { height: clamp(38px, 5vw, 110px); margin: auto; }

/* Contenu central */
.klb-hero__content { position: relative; z-index: 6; text-align: center; margin: auto; width: 100%; max-width: 860px; }

.klb-eyebrow { font-size: clamp(1.1rem, 1.4vw, 1.1rem); letter-spacing: 0.3em; text-transform: uppercase; color: #f6f4f0; font-weight: 600; font-family: 'Poppins'; margin-bottom: 16px; opacity: 0; animation: klbFadeUp 0.9s 0.8s ease forwards; }

.klb-h1 { font-size: clamp(2.8rem, 7.5vw, 5.6rem); line-height: 0.95; color: #F6F4F0; margin-top: 50px; margin-bottom: 8px; opacity: 0; animation: klbFadeUp 1s 1s ease forwards; text-shadow: 0 4px 40px rgba(0, 0, 0, 0.2); }

.klb-h1-sub { display: block; font-size: clamp(1.3rem, 2.5vw, 1.9rem); letter-spacing: 0.05em; color: #ddc5a8; margin-top: 12px; line-height: 1.3; opacity: 0; animation: klbFadeUp 1s 1.15s ease forwards; }

.klb-tagline { font-size: clamp(0.86rem, 1.5vw, 1.02rem); color: #f6f4f0; font-family: 'Poppins'; max-width: 500px; margin: 22px auto 36px; line-height: 1.8; font-style: italic; opacity: 0; animation: klbFadeUp 1s 1.3s ease forwards; }

.klb-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; opacity: 0; animation: klbFadeUp 1s 1.5s ease forwards; }

/* Courbe de transition */
.klb-curve { position: absolute; bottom: -2px; left: 0; right: 0; z-index: 5; line-height: 0; }

.klb-curve svg { display: block; width: 100%; }

/* ════════════════════════════════════════════════ TEASER ════════════════════════════════════════════════ */
.klb-teaser { background: #F6F4F0; position: relative; z-index: 2; padding: 72px 24px 90px; text-align: center; overflow: hidden; }

.klb-teaser__char { position: absolute; pointer-events: none; opacity: 0.18; }

.klb-teaser__char--left { left: -20px; bottom: 10px; transform: rotate(-12deg) scaleX(-1); }

.klb-teaser__char--right { right: -10px; top: 20px; transform: rotate(8deg); }

.klb-teaser__char img { height: clamp(100px, 14vw, 180px); }

.klb-teaser__label { font-size: 0.7rem; letter-spacing: 0.3em; text-transform: uppercase; color: #B44751; margin-bottom: 18px; }

.klb-teaser__h2 { font-size: clamp(1.6rem, 4vw, 3rem); color: #84503D; line-height: 1.1; max-width: 1200px; margin: 0 auto 22px; }

.klb-teaser__text { font-size: clamp(0.9rem, 1.4vw, 1.04rem); color: #5e3f32; line-height: 1.88; max-width: 660px; margin: 0 auto; font-style: italic; font-family: 'Poppins'; }

.klb-divider { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 32px; opacity: 0.3; }

.klb-divider__line { width: 100px; height: 1px; background: #84503D; }

.klb-divider__dot { width: 5px; height: 5px; border-radius: 50%; background: #B44751; }

/* ════════════════════════════════════════════════ KEYFRAMES ════════════════════════════════════════════════ */
@keyframes klbFadeUp { from { opacity: 0;
    transform: translateY(20px); }
  to { opacity: 1;
    transform: translateY(0); } }

@keyframes klbFadeDown { from { opacity: 0;
    transform: translateY(-14px); }
  to { opacity: 1;
    transform: translateY(0); } }

@media (max-width: 576px) { .klb-char--3 { display: none; } .klb-char--1 { top: 15%; left: 1%; } .klb-char--2 { right: 1%; } .klb-hero__content { padding-bottom: 76px; } .klb-teaser__char--left, .klb-teaser__char--right { display: none; } }

@media (max-width: 1200px) { .klb-hero__bg { background-size: cover; } }

/*---------------------------------------------------------------------------------------PRESENTATION----------------------------------------------------------------------------------------------*/
.klb-about { background: #F6F4F0; padding: 90px 0; overflow: hidden; }

.klb-carousel { position: relative; border-radius: 4px; overflow: hidden; aspect-ratio: 3/4; }

.klb-carousel__track { display: flex; height: 100%; transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1); }

.klb-carousel__slide { min-width: 100%; height: 100%; }

.klb-carousel__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }

.klb-carousel__dots { display: none; }

.klb-about__text-col { display: flex; flex-direction: column; justify-content: center; padding-left: 60px !important; }

.klb-about__body { font-size: clamp(0.9rem, 1.3vw, 1.02rem); color: #5e3f32; line-height: 1.85; margin-bottom: 36px; }

.klb-about__body p + p { margin-top: 1.2em; }

@media (max-width: 768px) { .klb-about__text-col { padding-left: 0; padding-top: 40px; } .klb-carousel { aspect-ratio: 4/3; } }

/*-----------------------------------------------------------------------------------------------------BLOC MAPS-----------------------------------------------------------*/
.klb-maps { background: #F6F4F0; padding: 90px 0; text-align: center; overflow: hidden; position: relative; }

.klb-maps__char { position: absolute; pointer-events: none; opacity: 0.14; }

.klb-maps__char--left { left: -10px; top: 40px; transform: rotate(10deg); }

.klb-maps__char--right { right: -10px; bottom: 30px; transform: rotate(-8deg) scaleX(-1); }

.klb-maps__char img { height: clamp(90px, 12vw, 160px); }

.klb-maps__frame { border-radius: 8px; overflow: hidden; box-shadow: 0 12px 48px rgba(132, 80, 61, 0.18); line-height: 0; margin-top: 40px; }

.klb-maps__frame iframe { width: 100%; height: 420px; border: 0; display: block; filter: sepia(20%) saturate(0.85); }

.klb-maps__address { font-family: 'Poppins', sans-serif; font-size: 0.85rem; letter-spacing: 0.12em; color: #84503D; margin-top: 20px; opacity: 0.75; }

/*----------------------------------------------------------------------------------INFOS PRATIQUES-------------------------------------------------*/
.klb-info { position: relative; overflow: hidden; padding: 160px 0; }

.klb-info__bg { position: absolute; inset: 0; background-image: url("https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FNcmhUOPoLUcyhuszW7bal9s3l9b2%2Fimages%2Frestaurant_le_kleber_rennes_2d57.webp"); background-size: cover; background-position: center; }

.klb-info__overlay { position: absolute; inset: 0; background: linear-gradient(to top, #6e4225e0 0%, #3c23129e 50%, #0805030d 100%); }

.klb-info__curve-top, .klb-info__curve-bot { position: absolute; left: 0; right: 0; z-index: 3; line-height: 0; }

.klb-info__curve-top { top: -2px; }

.klb-info__curve-bot { bottom: -2px; }

.klb-info__curve-top svg, .klb-info__curve-bot svg { display: block; width: 100%; }

.klb-info__content { position: relative; z-index: 2; }

/* Centrage vertical colonne gauche */
.klb-info__left-col { display: flex; flex-direction: column; justify-content: center; height: 100%; padding-left: 32px; padding-top: 50px; }

.klb-info__hours { list-style: none; padding: 0; margin: 20px 0 32px; }

.klb-info__hours li { font-family: 'Poppins', sans-serif; font-size: 0.95rem; color: #ddc5a8; padding: 10px 0; border-bottom: 1px solid rgba(246, 244, 240, 0.15); display: flex; justify-content: space-between; gap: 16px; }

.klb-info__hours li:first-child { border-top: 1px solid rgba(246, 244, 240, 0.15); }

.klb-info__hours span { color: #F6F4F0; font-style: italic; }

/* Images carte */
.klb-info__carte-stack { display: flex; flex-direction: column; gap: 20px; }

.klb-info__carte-link { display: block; cursor: zoom-in; }

.klb-info__carte-img { display: block; width: 100%; border-radius: 4px; transition: transform 0.35s ease, box-shadow 0.35s ease; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35); }

.klb-info__carte-img:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5); }

/* Lightbox */
.klb-lightbox { display: none; position: fixed; inset: 0; z-index: 9999; background: rgba(10, 6, 3, 0.92); align-items: center; justify-content: center; padding: 24px; backdrop-filter: blur(6px); }

.klb-lightbox.active { display: flex; }

.klb-lightbox__img { max-width: 90vw; max-height: 90vh; border-radius: 4px; box-shadow: 0 24px 80px rgba(0, 0, 0, 0.7); object-fit: contain; }

.klb-lightbox__close { position: fixed; top: 24px; right: 28px; width: 44px; height: 44px; cursor: pointer; display: flex; align-items: center; justify-content: center; background: rgba(246, 244, 240, 0.1); border-radius: 50%; border: 1.5px solid rgba(246, 244, 240, 0.3); transition: background 0.2s ease, transform 0.2s ease; }

.klb-lightbox__close:hover { background: rgba(246, 244, 240, 0.2); transform: rotate(90deg); }

.klb-lightbox__close::before, .klb-lightbox__close::after { content: ''; position: absolute; width: 18px; height: 1.5px; background: #F6F4F0; border-radius: 2px; }

.klb-lightbox__close::before { transform: rotate(45deg); }

.klb-lightbox__close::after { transform: rotate(-45deg); }

@media (max-width: 768px) { .klb-info__carte-stack { padding-left: 0; margin-top: 48px; } }

/*# sourceMappingURL=custom.css.map */