/* ==========================================================================
   wk-beaute-02 · Ébène & Laiton
   Barberie d'artisan : bois sombre, laiton patiné, capitales d'enseigne
   (Big Shoulders), filets doubles de peintre en lettres et un ticket de
   rendez-vous crème aux couleurs du poteau de barbier (bordeaux et crème).
   ========================================================================== */

body.wk {
    --brass: #CFA862;
    --brass-soft: rgba(207, 168, 98, .32);
    --oxblood: #8F3A2C;
    --cream: #F3EBDC;
    --wk-backdrop: #0C0A08;
    --wk-tint: rgba(207, 168, 98, .1);
    --wk-tint-strong: rgba(207, 168, 98, .18);
}

/* --- Filet de laiton double, réutilisé partout ----------------------------- */

.wk .wk-card { background: var(--wk-bg); }

/* --- En-tête --------------------------------------------------------------- */

.wk[data-hero="split"] .wk-hero__cover {
    height: 176px;
    background: #15110D;
}
.wk[data-hero="split"] .wk-hero__cover::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 5px;
    border-top: 1px solid var(--brass);
    border-bottom: 1px solid var(--brass-soft);
    z-index: 1;
}
.wk[data-cover="photo"] .wk-hero__veil { background: linear-gradient(180deg, rgba(21,17,13,.1), rgba(21,17,13,.55)); }
/* photo de couverture : légèrement réchauffée, accordée au laiton */
.wk[data-cover="photo"] .wk-hero__media { filter: sepia(.22) saturate(.85) brightness(.92); }

.wk[data-hero="split"] .wk-avatar {
    width: 108px;
    height: 108px;
    margin-top: -54px;
    border: 4px solid var(--wk-bg);
    box-shadow: 0 0 0 1px var(--brass), 0 0 0 7px var(--wk-bg), 0 0 0 8px var(--brass-soft), 0 18px 40px rgba(0,0,0,.5);
}
.wk .wk-avatar__initials {
    font-size: 40px;
    letter-spacing: .04em;
    background: radial-gradient(circle at 35% 30%, #E4C78E, #B88F48 70%);
    color: #1A140D;
    box-shadow: inset 0 0 0 4px rgba(26, 20, 13, .35), inset 0 0 0 5px rgba(243, 235, 220, .45);
}

.wk[data-hero="split"] .wk-identity { margin-top: 22px; }
.wk .wk-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .3em;
    color: var(--brass);
    margin-bottom: 8px;
}
.wk .wk-eyebrow::before,
.wk .wk-eyebrow::after {
    content: "";
    width: 6px;
    height: 6px;
    background: var(--brass);
    transform: rotate(45deg);
    flex-shrink: 0;
}
.wk .wk-eyebrow::after { display: none; }

.wk .wk-name {
    font-size: clamp(40px, 12.4vw, 54px);
    line-height: .92;
    letter-spacing: .015em;
    text-transform: uppercase;
    color: var(--cream);
}
.wk .wk-role {
    margin-top: 12px;
    font-size: 15px;
    letter-spacing: .02em;
}
.wk .wk-role__sep { color: var(--brass); opacity: 1; }
.wk .wk-role__company { color: var(--cream); font-weight: 600; }

.wk .wk-socials { gap: 10px; margin-top: 20px; }
.wk .wk-socials a {
    width: 42px;
    height: 42px;
    background: transparent;
    border: 1px solid var(--brass-soft);
    color: var(--brass);
}
.wk .wk-socials a:hover { background: var(--brass); color: #1A140D; border-color: var(--brass); }

.wk .wk-about {
    margin-top: 20px;
    font-size: 15.5px;
    color: var(--wk-muted);
}

/* --- Actions : médaillons de laiton --------------------------------------- */

.wk[data-quick="icons"] .wk-actions {
    justify-content: flex-start;
    gap: 12px;
    padding-top: 26px;
}
.wk[data-quick="icons"] .wk-action {
    width: 58px;
    min-height: 58px;
    background: transparent;
    border: 1px solid var(--brass);
    box-shadow: inset 0 0 0 3px var(--wk-bg), inset 0 0 0 4px var(--brass-soft);
}
.wk .wk-action :is(i, svg) { color: var(--brass); font-size: 20px; }
.wk[data-quick="icons"] .wk-action:hover { background: var(--brass); transform: none; }
.wk[data-quick="icons"] .wk-action:hover :is(i, svg) { color: #1A140D; }

.wk .wk-btn {
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-size: 13.5px;
}
.wk .wk-btn:hover { filter: brightness(1.06); transform: none; }
.wk .wk-save { padding-top: 16px; }
.wk .wk-save .wk-btn {
    min-height: 56px;
    font-size: 14px;
    box-shadow: inset 0 0 0 3px var(--brass), inset 0 0 0 4px rgba(26, 20, 13, .55);
}

/* --- Titres : capitales d'enseigne, losange et double filet ------------------ */

.wk .wk-section { padding-top: 46px; }
.wk .wk-section--links { padding-top: 22px; }
.wk[data-heading="left-rule"] .wk-heading { gap: 12px; margin-bottom: 20px; }
.wk[data-heading="left-rule"] .wk-heading::before {
    content: "";
    width: 7px;
    height: 7px;
    flex-shrink: 0;
    background: var(--brass);
    transform: rotate(45deg);
}
.wk[data-heading="left-rule"] .wk-heading::after {
    height: 5px;
    background: none;
    border-top: 1px solid var(--brass);
    border-bottom: 1px solid var(--brass-soft);
}
.wk .wk-section-title {
    font-size: 28px;
    line-height: 1;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--cream);
}

/* --- Surfaces : panneaux de bois, filet intérieur ---------------------------- */

.wk[data-cards="flat"] .wk-surface {
    background: var(--wk-surface);
    border: 1px solid var(--wk-border);
    box-shadow: inset 0 0 0 4px var(--wk-surface), inset 0 0 0 5px rgba(207, 168, 98, .1);
}

/* --- Tarifs ---------------------------------------------------------------- */

.wk .wk-services { gap: 10px; }
.wk .wk-service { padding: 18px; gap: 16px; }
.wk .wk-service__icon {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid var(--brass);
    color: var(--brass);
    font-size: 17px;
}
.wk .wk-service__media { border-radius: 3px; }
.wk .wk-service__title {
    font-family: var(--wk-font-display);
    font-weight: 700;
    font-size: 22px;
    line-height: 1.05;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--cream);
}
.wk .wk-service__text { margin-top: 6px; font-size: 14.5px; }

/* --- Rendez-vous : un ticket crème, bordé du poteau de barbier -------------- */

.wk .wk-booking,
.wk[data-cards="flat"] .wk-booking {
    --wk-text: #1A140D;
    --wk-muted: #5E4E3C;
    --wk-border: #CDBC9C;
    --wk-bg: #FBF6EC;
    --wk-surface: #FBF6EC;
    --wk-primary: #7E3024;
    --wk-on-primary: #FBF6EC;
    --notch: 30px;
    position: relative;
    padding: 24px 22px calc(var(--notch) + 34px);
    gap: 14px;
    border: 0;
    border-radius: 4px;
    color: var(--wk-text);
    background:
        radial-gradient(circle at 0 calc(100% - var(--notch)), transparent 10px, var(--cream) 11px) left / 51% 100% no-repeat,
        radial-gradient(circle at 100% calc(100% - var(--notch)), transparent 10px, var(--cream) 11px) right / 51% 100% no-repeat;
    box-shadow: none;
}
/* talon détachable : pointillés de découpe, puis rayures du poteau */
.wk .wk-booking::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 12px;
    border-radius: 0 0 4px 4px;
    background: repeating-linear-gradient(-45deg, var(--oxblood) 0 7px, var(--cream) 7px 12px, #23314A 12px 19px, var(--cream) 19px 24px);
}
.wk .wk-booking::after {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: var(--notch);
    border-top: 1.5px dashed #BBA67F;
    pointer-events: none;
}
.wk .wk-booking__date {
    position: relative;
    min-height: 56px;
    border-radius: 3px;
    border: 1.5px solid #1A140D;
    background: #FBF6EC;
    color: var(--oxblood);
    font-weight: 600;
}
.wk .wk-booking__date input { font-weight: 600; cursor: pointer; }
.wk .wk-booking__date input::placeholder { color: #5E4E3C; opacity: 1; }
.wk .wk-booking__date::after {
    content: "\f078";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 12px;
    color: #1A140D;
}
.wk .wk-slots .time-slot {
    min-height: 44px;
    display: grid;
    place-items: center;
    padding: 8px 4px;
    border-radius: 3px;
    border: 1px solid #CDBC9C;
    background: #FFFDF8;
    font-size: 12.5px;
    line-height: 1.25;
    font-variant-numeric: tabular-nums;
}
.wk .wk-booking .wk-btn { min-height: 54px; }

/* --- Horaires : tableau d'enseigne, points de conduite ---------------------- */

.wk .wk-hours { padding: 10px 20px; }
.wk .wk-hours__row {
    align-items: baseline;
    border-bottom: 0;
    padding: 9px 0;
    font-size: 15px;
}
.wk .wk-hours__day {
    flex: 1;
    display: flex;
    align-items: baseline;
    gap: 10px;
    font-weight: 600;
    letter-spacing: .02em;
}
.wk .wk-hours__day::after {
    content: "";
    flex: 1;
    border-bottom: 1.5px dotted rgba(207, 168, 98, .35);
    transform: translateY(-4px);
}
.wk .wk-hours__time { color: var(--cream); }
.wk .wk-hours__row.is-closed .wk-hours__time { color: var(--wk-muted); opacity: 1; }
.wk .wk-hours__row.is-today {
    margin: 0;
    padding-inline: 0;
    background: none;
}
.wk .wk-hours__row.is-today .wk-hours__day,
.wk .wk-hours__row.is-today .wk-hours__time { color: var(--brass); }
.wk .wk-hours__row.is-today .wk-hours__day::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-inline-start: -14px;
    background: var(--brass);
    transform: rotate(45deg) translateY(-2px);
    flex-shrink: 0;
}

/* --- Avis -------------------------------------------------------------------- */

.wk .wk-quote { padding: 26px 22px 22px; }
.wk .wk-quote::before {
    content: "\201C";
    position: static;
    display: block;
    height: 34px;
    font-size: 70px;
    line-height: .9;
    color: var(--brass);
    opacity: 1;
}
.wk .wk-quote__text { font-size: 16px; line-height: 1.6; color: var(--cream); }
.wk .wk-quote__avatar { background: transparent; border: 1px solid var(--brass); color: var(--brass); }
.wk .wk-quote__name { letter-spacing: .08em; text-transform: uppercase; font-size: 13px; color: var(--brass); }
.wk .wk-slider .slick-dots li button::before { background: var(--cream); opacity: .25; }
.wk .wk-slider .slick-dots li.slick-active button::before { background: var(--brass); opacity: 1; }

/* --- Coordonnées, liens, divers -------------------------------------------- */

.wk .wk-contact__icon {
    border-radius: 50%;
    background: transparent;
    border: 1px solid var(--brass-soft);
    color: var(--brass);
}
.wk .wk-contact__label { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.wk .wk-contact__value { color: var(--cream); }

.wk .wk-link {
    border-radius: 3px;
    border: 1px solid var(--brass-soft);
    background: var(--wk-surface);
    color: var(--cream);
    letter-spacing: .04em;
}
.wk .wk-link :is(i, svg) { color: var(--brass); }
.wk .wk-link--button { background: var(--brass); border-color: var(--brass); color: #1A140D !important; }
.wk .wk-link--button :is(i, svg) { color: inherit; }

.wk .wk-gallery__item { border-radius: 3px; border: 1px solid var(--wk-border); }
.wk .wk-product__title,
.wk .wk-post__title,
.wk .wk-paylink__title {
    font-family: var(--wk-font-display);
    font-weight: 700;
    font-size: 19px;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--cream);
}
.wk .wk-product__price { font-size: 22px; color: var(--brass); }
.wk .wk-paylink__icon { border-radius: 50%; border: 1px solid var(--brass-soft); background: transparent; }
.wk .wk-more { color: var(--brass); text-transform: uppercase; letter-spacing: .14em; font-size: 12.5px; }
.wk .wk-tab { background: transparent; border-color: var(--wk-border); color: var(--cream); }
.wk .wk-tab.active { color: #1A140D; }

.wk .wk-qr__text h3 { font-family: var(--wk-font-display); font-size: 21px; letter-spacing: .03em; text-transform: uppercase; color: var(--cream); }
.wk .wk-map__address :is(i, svg) { color: var(--brass); }

.wk .wk-input { border-radius: 3px; border-width: 1px; }
.wk .wk-input:focus { border-color: var(--brass); }
.wk .wk-form .wk-btn { min-height: 54px; }

.wk .wk-footer {
    margin-top: 10px;
    font-size: 11px;
    letter-spacing: .2em;
    text-transform: uppercase;
}

.wk .wk-dock__toggle {
    color: #1A140D !important;
    box-shadow: inset 0 0 0 3px var(--brass), inset 0 0 0 4px rgba(26, 20, 13, .5), 0 10px 26px rgba(0, 0, 0, .55);
}
.wk .wk-dock__btn { background: var(--wk-surface-alt); border: 1px solid var(--brass-soft); }
.wk .wk-dock__wa { background: var(--wk-surface-alt); }
.wk .modal-content { border: 1px solid var(--wk-border); }
.wk .wk-share__item { background: var(--wk-surface-alt); color: var(--cream); }

/* noms longs */
.wk .wk-name { overflow-wrap: break-word; hyphens: auto; }