.mq--coiffure {
  --plum: #24152b; --plum-2: #3a2444; --lilac: #cdb8f0; --peach: #ffb38a; --chrome: #f4f1f7; --ink: #1b1220; --muted: #6b5d72;
  background: var(--chrome); color: var(--ink);
  font: 400 17px/1.6 "Manrope", system-ui, sans-serif;
}
:where(.mq--coiffure) :where(h1, h2, h3) { margin: 0; font-family: "Syne", system-ui, sans-serif; font-weight: 800; letter-spacing: -0.02em; line-height: 1; }
:where(.mq--coiffure) :where(p) { margin: 0; }
.c-wrap { width: min(1180px, 100% - 40px); margin: 0 auto; }

.c-nav { position: sticky; top: 44px; z-index: 50; background: var(--plum); color: #fff; }
.c-nav__in { display: flex; align-items: center; justify-content: space-between; height: 70px; }
.c-logo { font: 600 22px/1 "Syne", sans-serif; letter-spacing: -0.03em; color: #fff; text-decoration: none; }
.c-logo b { font-weight: 800; color: var(--lilac); }
.c-menu { display: flex; align-items: center; gap: 26px; }
.c-menu a { color: #e9e1f1; text-decoration: none; font-weight: 600; font-size: 15px; }
.c-menu a:not(.c-btn):hover { color: var(--peach); }
.c-burger { display: none; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; }
.c-burger i { display: block; width: 22px; height: 2px; margin: 5px auto; background: #fff; }

.c-btn { display: inline-flex; align-items: center; justify-content: center; height: 54px; padding: 0 28px; border: 0; border-radius: 4px; background: var(--peach); color: var(--plum); font: 700 16px/1 "Manrope", sans-serif; text-decoration: none; cursor: pointer; transition: transform .25s, background .25s; }
.c-btn:hover, .c-btn:focus-visible { background: #ffc6a6; transform: translateY(-2px); }
.c-btn--small { height: 42px; padding: 0 18px; font-size: 14px; color: var(--plum) !important; }
.c-btn--light { background: #fff; width: 100%; }
.c-ghost { display: inline-flex; align-items: center; height: 54px; padding: 0 24px; border: 1.5px solid rgba(255,255,255,.35); border-radius: 4px; color: #fff; font-weight: 700; text-decoration: none; }
.c-ghost:hover { border-color: var(--lilac); color: var(--lilac); }
.mq--coiffure a:focus-visible, .mq--coiffure button:focus-visible, .mq--coiffure input:focus-visible { outline: 3px solid var(--peach); outline-offset: 3px; }

.c-hero { position: relative; overflow: hidden; padding: clamp(56px, 8vw, 110px) 0 clamp(64px, 9vw, 120px); background: var(--plum); color: #fff; }
.c-waves { position: absolute; inset: 0; width: 100%; height: 100%; }
.c-waves path { fill: none; stroke: var(--lilac); stroke-width: 2; opacity: .35; }
.c-waves path:nth-child(2) { stroke: var(--peach); opacity: .3; }
.mq-js .c-waves path { stroke-dasharray: 1600; stroke-dashoffset: 1600; animation: c-draw 3s cubic-bezier(.65,0,.35,1) forwards; }
.mq-js .c-waves path:nth-child(2) { animation-delay: .25s; }
.mq-js .c-waves path:nth-child(3) { animation-delay: .5s; }
@keyframes c-draw { to { stroke-dashoffset: 0; } }
.c-hero__in { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: end; }
.c-tag { display: inline-block; padding: 6px 12px; border: 1px solid rgba(205, 184, 240, .5); border-radius: 999px; color: var(--lilac); font-size: 13px; font-weight: 600; letter-spacing: .04em; }
.c-hero h1 { margin-top: 26px; font-size: clamp(28px, 8.2vw, 86px); line-height: .9; text-transform: uppercase; letter-spacing: -0.045em; }
.c-hero h1 span { display: block; }
.c-accent { color: var(--peach); }
.c-lead { margin-top: 28px; max-width: 32em; font-size: 18px; color: #d9cfe2; }
.c-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.c-slot { padding: 24px; border-radius: 6px; background: var(--plum-2); border: 1px solid rgba(205, 184, 240, .25); }
.c-slot__label { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--lilac); }
.c-slot__time { margin-top: 10px; font: 800 26px/1.15 "Syne", sans-serif; }
.c-slot__who { margin: 6px 0 18px; color: #cbbfd6; font-size: 15px; }

.c-services, .c-team { padding: clamp(64px, 9vw, 120px) 0; }
.c-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 36px; }
.c-head h2 { font-size: clamp(26px, 7.2vw, 72px); text-transform: uppercase; letter-spacing: -0.04em; color: var(--plum); }
.c-head h2 span { color: #9b7fd1; }
.c-head p { max-width: 26em; color: var(--muted); }
.c-services__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.c-card { padding: 24px 22px; background: #fff; border-radius: 6px; border-top: 5px solid var(--lilac); }
.c-card:nth-child(2) { border-top-color: var(--peach); }
.c-card:nth-child(3) { border-top-color: var(--plum); }
.c-card:nth-child(4) { border-top-color: #9b7fd1; }
.c-card h3 { font-size: 24px; text-transform: uppercase; color: var(--plum); }
.c-card ul { margin: 16px 0 0; padding: 0; list-style: none; }
.c-card li { display: flex; justify-content: space-between; gap: 10px; padding: 12px 0; border-top: 1px solid #eee8f3; }
.c-card li span { font-weight: 600; }
.c-card small { display: block; font-weight: 500; font-size: 13px; color: var(--muted); }
.c-card b { white-space: nowrap; font-weight: 700; color: var(--plum); font-size: 15px; }

.c-rdv { padding: clamp(64px, 9vw, 110px) 0; background: var(--lilac); }
.c-rdv__in { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(28px, 5vw, 64px); align-items: start; }
.c-rdv h2 { font-size: clamp(26px, 6.4vw, 46px); color: var(--plum); text-transform: uppercase; letter-spacing: -0.04em; }
.c-rdv__copy p { margin-top: 18px; color: var(--plum-2); }
.c-summary { display: inline-block; padding: 12px 16px; border-radius: 4px; background: var(--plum); color: #fff !important; font-weight: 700; }
.c-book { display: grid; gap: 20px; padding: clamp(22px, 3vw, 32px); background: #fff; border-radius: 6px; }
.c-book fieldset { margin: 0; padding: 0; border: 0; }
.c-book legend { margin-bottom: 10px; font: 800 16px/1 "Syne", sans-serif; text-transform: uppercase; color: var(--plum); }
.c-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.c-chip { min-height: 42px; padding: 0 16px; border: 1.5px solid #dccff0; border-radius: 999px; background: #fff; color: var(--plum); font: 600 15px "Manrope", sans-serif; cursor: pointer; transition: background .2s, border-color .2s, color .2s; }
.c-chip:hover { border-color: var(--plum); }
.c-chip[aria-pressed="true"] { background: var(--plum); border-color: var(--plum); color: #fff; }
.c-chip--day, .c-chip--time { border-radius: 4px; }
.c-book__who { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.c-book label { display: grid; gap: 6px; font-size: 14px; font-weight: 700; color: var(--plum); }
.c-book input { min-height: 48px; padding: 0 14px; border: 1.5px solid #dccff0; border-radius: 4px; font: 500 16px "Manrope", sans-serif; color: var(--ink); }
.c-book .c-btn { justify-self: start; background: var(--plum); color: #fff; }
.c-book .c-btn:hover { background: var(--plum-2); }

.c-team__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.c-person { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 16px; align-items: center; padding: 22px; background: #fff; border-radius: 6px; }
.c-mono { grid-row: 1 / 3; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--lilac); color: var(--plum); font: 800 20px "Syne", sans-serif; }
.c-mono--1 { background: var(--peach); }
.c-mono--2 { background: var(--plum); color: var(--lilac); }
.c-person h3 { font-size: 22px; color: var(--plum); }
.c-person p { color: var(--muted); font-size: 15px; }
.c-gallery { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 12px; margin-top: 16px; }
.c-tile { position: relative; margin: 0; min-height: 240px; border-radius: 6px; overflow: hidden; }
.c-tile::before { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 90% at 30% 20%, rgba(255,255,255,.35), transparent 60%), repeating-linear-gradient(115deg, rgba(255,255,255,.12) 0 2px, transparent 2px 14px); }
.c-tile--0 { background: linear-gradient(160deg, #e7b778, #9a5b2c); }
.c-tile--1 { background: linear-gradient(160deg, #3b2a22, #1a120e); }
.c-tile--2 { background: linear-gradient(160deg, #b9a7d8, #5b3d7d); }
.c-tile--3 { background: linear-gradient(160deg, #f1c3a7, #b36a4c); }
.c-tile figcaption { position: absolute; left: 14px; bottom: 12px; padding: 6px 10px; border-radius: 4px; background: rgba(36, 21, 43, .82); color: #fff; font-size: 13px; font-weight: 700; }

.c-infos { padding: clamp(56px, 8vw, 90px) 0; background: var(--plum); color: #e9e1f1; }
.c-infos__in { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 28px; align-items: start; }
.c-infos h2 { font-size: clamp(26px, 6.4vw, 48px); text-transform: uppercase; color: #fff; letter-spacing: -0.04em; }
.c-label { margin-bottom: 6px !important; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--lilac); }
.c-foot { padding: 30px 0; background: #160c1b; color: #b8aac3; font-size: 14px; }
.c-foot__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }

@media (max-width: 980px) {
  .c-hero__in, .c-rdv__in { grid-template-columns: 1fr; }
  .c-services__grid { grid-template-columns: 1fr 1fr; }
  .c-team__grid { grid-template-columns: 1fr; }
  .c-gallery { grid-template-columns: 1fr 1fr; }
  .c-infos__in { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .c-burger { display: block; }
  .c-menu { position: absolute; top: 70px; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 20px 20px; background: var(--plum); }
  .c-menu.is-open { display: flex; }
  .c-menu a { padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.1); }
  .c-menu .c-btn { margin-top: 14px; border-bottom: 0; }
  .c-services__grid, .c-infos__in, .c-book__who { grid-template-columns: 1fr; }
  .c-tile { min-height: 160px; }
}

@media (min-width: 981px) { .c-hero h1 { font-size: clamp(42px, 5.8vw, 86px); } }
