/* ── RESET & BASE ── */
html { scroll-behavior: smooth; }
body { background: var(--white); color: var(--black); font-family: "Space Mono", monospace; overflow-x: hidden; }
/* ── NAV ── */
.nav-links { display: flex; gap: 1.4rem; list-style: none; flex-wrap: wrap; }
.nav-links a { color: var(--gray); text-decoration: none; font-size: 0.58rem; letter-spacing: 0.14em; text-transform: uppercase; transition: color 0.2s; }
.nav-links a:hover { color: var(--white); }
/* ── HERO ── */
.hero { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 7rem 2rem 4rem; position: relative; overflow: hidden; background: var(--white); }
.hero::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: radial-gradient(ellipse at center top, #EDEDEA 0%, var(--white) 70%); pointer-events: none; }
.hero::after { display: none; }
.hero-logo-wrap { position: relative; z-index: 1; margin-bottom: 1.5rem; display: flex; justify-content: center; }
.hero-logo-img { height: 520px; width: auto; max-width: 85vw; display: block; margin: 0 auto; }
.hero-tag { font-size: 0.6rem; letter-spacing: 0.35em; text-transform: uppercase; color: var(--mid); margin-bottom: 1rem; display: flex; align-items: center; gap: 1rem; position: relative; z-index: 1; justify-content: center; }
.hero-tag::before { content: ""; display: block; width: 35px; height: 1px; background: var(--gray); }
.hero-title { display: none; }
.hero-sub { font-size: 0.72rem; color: var(--gray); letter-spacing: 0.08em; max-width: 480px; line-height: 1.9; margin-bottom: 2.5rem; position: relative; z-index: 1; text-align: center; }
.hero-cta { display: inline-flex; align-items: center; gap: 1rem; background: var(--white); color: var(--black); text-decoration: none; font-family: "Bebas Neue", sans-serif; font-size: 1rem; letter-spacing: 0.18em; padding: 0.9rem 2.2rem; transition: all 0.25s; position: relative; z-index: 1; width: fit-content; margin: 0 auto; }
.hero-cta:hover { background: var(--accent); gap: 1.5rem; }
.waveform { display: none; }
.wave-bar { width: 3px; background: var(--mid); border-radius: 2px; animation: wave 1.2s ease-in-out infinite; }
@keyframes wave { 0%,100%{transform:scaleY(0.2)} 50%{transform:scaleY(1)} }
/* ── SECTIONS ── */
section { padding: 5rem 4rem; }
.section-tag { font-size: 0.56rem; letter-spacing: 0.35em; text-transform: uppercase; color: var(--mid); margin-bottom: 0.8rem; display: flex; align-items: center; gap: 1rem; }
.section-tag::before { content: ""; display: block; width: 28px; height: 1px; background: var(--gray); }
.section-title { font-family: "Bebas Neue", sans-serif; font-size: clamp(2rem, 4vw, 3.8rem); line-height: 1; margin-bottom: 2.5rem; letter-spacing: 0.03em; color: var(--white); }
/* ── SERVICES ── */
#services { background: var(--dark); }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px,1fr)); gap: 1px; background: var(--dark-gray); border: 1px solid var(--dark-gray); }
.service-card { background: var(--dark); padding: 2rem 1.6rem; transition: background 0.3s; cursor: default; }
.service-card:hover { background: var(--dark2); }
.service-number { font-family: "Bebas Neue", sans-serif; font-size: 2.2rem; color: var(--dark-gray); line-height: 1; margin-bottom: 0.6rem; transition: color 0.3s; }
.service-card:hover .service-number { color: var(--gray); }
.service-name { font-family: "Bebas Neue", sans-serif; font-size: 1.2rem; letter-spacing: 0.05em; margin-bottom: 0.5rem; color: var(--white); }
.service-desc { font-size: 0.63rem; color: var(--gray); line-height: 1.85; }
/* ── TARIFS ── */
#tarifs { background: var(--black); }
.tarifs-block { margin-bottom: 2.5rem; }
.tarifs-block-title { font-family: "Bebas Neue", sans-serif; font-size: 1rem; letter-spacing: 0.12em; color: var(--mid); margin-bottom: 0.8rem; border-bottom: 1px solid var(--dark-gray); padding-bottom: 0.4rem; }
.tarifs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px,1fr)); gap: 1px; background: var(--dark-gray); border: 1px solid var(--dark-gray); }
.tarif-card { background: var(--black); padding: 1.8rem 1.5rem; transition: background 0.3s; position: relative; overflow: hidden; }
.tarif-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--dark-gray); transition: background 0.3s; }
.tarif-card:hover { background: var(--dark); }
.tarif-card:hover::before { background: var(--mid); }
.tarif-icon { font-size: 1.1rem; margin-bottom: 0.6rem; }
.tarif-label { font-size: 0.53rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gray); margin-bottom: 0.3rem; }
.tarif-hours { font-family: "Bebas Neue", sans-serif; font-size: 1rem; color: var(--mid); margin-bottom: 0.8rem; }
.tarif-price { font-family: "Bebas Neue", sans-serif; font-size: 2.5rem; color: var(--white); line-height: 1; }
.tarif-price span { font-size: 0.82rem; color: var(--gray); font-family: "Space Mono", monospace; font-weight: 400; }
.tarif-tva { font-size: 0.53rem; color: var(--gray); margin-top: 0.3rem; }
.tarif-note { font-size: 0.58rem; color: var(--gray); margin-top: 0.7rem; line-height: 1.6; }
/* ── VTC ── */
#vtc { background: var(--dark); }
.vtc-box { border: 1px solid var(--dark-gray); padding: 2.5rem; max-width: 620px; position: relative; }
.vtc-box::before { content: ""; position: absolute; top: -6px; left: -6px; right: 6px; bottom: 6px; border: 1px solid rgba(255,255,255,0.04); pointer-events: none; }
.vtc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: 1.5rem; }
.vtc-item-label { font-size: 0.56rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gray); margin-bottom: 0.3rem; }
.vtc-item-price { font-family: "Bebas Neue", sans-serif; font-size: 2.2rem; color: var(--white); line-height: 1; }
.vtc-item-price span { font-size: 0.82rem; color: var(--gray); font-family: "Space Mono", monospace; }
.vtc-item-tva { font-size: 0.53rem; color: var(--gray); margin-top: 0.2rem; }
.vtc-note { font-size: 0.63rem; color: var(--gray); line-height: 1.85; margin-top: 1.2rem; border-top: 1px solid var(--dark-gray); padding-top: 1rem; }
/* ── RÉSERVATION ── */
#reservation { background: var(--dark2); }
.resa-tabs { display: flex; gap: 1px; margin-bottom: 2.5rem; background: var(--dark-gray); border: 1px solid var(--dark-gray); width: fit-content; }
.resa-tab { background: var(--dark2); border: none; color: var(--gray); font-family: "Space Mono", monospace; font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; padding: 0.8rem 1.4rem; cursor: pointer; transition: all 0.2s; }
.resa-tab:hover { color: var(--white); background: var(--dark); }
.resa-tab.active { background: var(--dark-gray); color: var(--white); }
.onglet { max-width: 680px; }
/* Steps */
.steps { display: flex; align-items: center; margin-bottom: 2.5rem; }
.step { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; }
.step-num { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--dark-gray); display: flex; align-items: center; justify-content: center; font-size: 0.75rem; color: var(--gray); transition: all 0.3s; background: var(--dark2); }
.step.active .step-num { border-color: var(--white); color: var(--white); background: rgba(240,239,232,0.05); }
.step.done .step-num { background: var(--white); border-color: var(--white); color: var(--black); }
.step-label { font-size: 0.55rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gray); }
.step.active .step-label { color: var(--white); }
.step-line { flex: 1; height: 1px; background: var(--dark-gray); margin: 0 0.5rem; margin-bottom: 1.4rem; }
.step-line.done { background: var(--mid); }
.step-section-label { font-size: 0.58rem; letter-spacing: 0.32em; text-transform: uppercase; color: var(--mid); margin-bottom: 0.5rem; }
.step-section-title { font-family: "Bebas Neue", sans-serif; font-size: 1.9rem; letter-spacing: 0.06em; margin-bottom: 1.5rem; color: var(--white); }
.step-field-label { font-size: 0.58rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); margin-bottom: 0.5rem; }
/* Tarif selector */
.tarif-selector { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.5rem; }
.tarif-card { background: var(--dark); border: 1px solid var(--dark-gray); padding: 1.5rem; cursor: pointer; transition: all 0.3s; position: relative; overflow: hidden; }
.tarif-card::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--mid); transform: scaleX(0); transform-origin: left; transition: transform 0.3s; }
.tarif-card.active { border-color: var(--mid); }
.tarif-card.active::after { transform: scaleX(1); }
.tarif-card:hover { border-color: var(--gray); }
.tarif-card-icon { font-size: 1.3rem; margin-bottom: 0.8rem; color: var(--mid); }
.tarif-card-name { font-family: "Bebas Neue", sans-serif; font-size: 1.3rem; letter-spacing: 0.05em; margin-bottom: 0.3rem; color: var(--white); }
.tarif-card-price { font-size: 1.8rem; color: var(--mid); font-family: "Bebas Neue", sans-serif; }
.tarif-card-detail { font-size: 0.68rem; color: var(--gray); margin-top: 0.3rem; line-height: 1.5; }
.tarif-badge { position: absolute; top: 0.8rem; right: 0.8rem; background: var(--mid); color: var(--black); font-size: 0.52rem; letter-spacing: 0.15em; text-transform: uppercase; padding: 0.2rem 0.6rem; }
/* Toggle nuit */
.mode-toggle { display: flex; align-items: center; gap: 1rem; padding: 0.9rem; background: var(--dark); border: 1px solid var(--dark-gray); margin-bottom: 1rem; cursor: pointer; }
.toggle-switch { width: 40px; height: 20px; background: var(--dark-gray); border-radius: 10px; position: relative; transition: background 0.3s; flex-shrink: 0; }
.toggle-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: var(--gray); transition: all 0.3s; }
.mode-toggle.night-on .toggle-switch { background: var(--mid); }
.mode-toggle.night-on .toggle-switch::after { left: 23px; background: var(--black); }
.mode-toggle-label strong { color: var(--white); display: block; font-size: 0.78rem; }
.mode-toggle-label span { font-size: 0.66rem; color: var(--gray); }
/* Hours / session */
.hours-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 0.5rem; margin-bottom: 1.5rem; }
.hour-btn { background: var(--dark); border: 1px solid var(--dark-gray); color: var(--gray); padding: 0.65rem 0.4rem; cursor: pointer; text-align: center; transition: all 0.25s; font-family: "Space Mono", monospace; font-size: 0.82rem; }
.hour-btn.active { border-color: var(--white); color: var(--white); background: rgba(240,239,232,0.04); }
.hour-btn:hover { border-color: var(--gray); color: var(--white); }
.session-types { display: grid; grid-template-columns: repeat(3,1fr); gap: 0.7rem; margin-bottom: 1.5rem; }
.session-btn { background: var(--dark); border: 1px solid var(--dark-gray); padding: 0.8rem; text-align: center; cursor: pointer; font-size: 0.76rem; color: var(--gray); transition: all 0.25s; }
.session-btn.active { border-color: var(--mid); color: var(--white); background: rgba(240,239,232,0.03); }
.session-btn:hover { border-color: var(--gray); color: var(--white); }
/* Info box */
.step-info-box { background: rgba(138,138,132,0.06); border-left: 2px solid var(--mid); padding: 0.8rem 1rem; margin-bottom: 1rem; font-size: 0.7rem; color: var(--gray); line-height: 1.75; }
.contract-box { border: 1px solid var(--mid); background: rgba(255,255,255,0.02); padding: 1.5rem; margin-top: 1rem; }
.contract-intro { font-size: 0.75rem; color: var(--gray); line-height: 1.8; margin-bottom: 1.2rem; }
.contract-clause { padding: 0.9rem 0; border-bottom: 1px solid rgba(138,138,132,0.15); }
.contract-clause:last-of-type { border-bottom: none; }
.contract-check { display: flex; align-items: flex-start; gap: 0.7rem; font-size: 0.68rem; color: var(--gray); line-height: 1.75; cursor: pointer; }
.contract-check input[type="checkbox"] { margin-top: 0.25rem; flex-shrink: 0; width: 15px; height: 15px; accent-color: var(--accent); cursor: pointer; }
.contract-check strong { color: var(--white); }
.contract-final { background: rgba(201,162,74,0.06); margin-top: 0.5rem; padding: 1rem; border: 1px solid rgba(201,162,74,0.25); }
.step-info-box strong { color: var(--white); }
/* Price box */
.price-box { background: var(--dark); border: 1px solid var(--dark-gray); padding: 1.5rem; margin: 1.5rem 0; }
.price-box-title { font-size: 0.58rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gray); margin-bottom: 1rem; }
.price-line { display: flex; justify-content: space-between; padding: 0.45rem 0; font-size: 0.8rem; }
.price-line .pl-label { color: var(--gray); }
.price-line .pl-value { color: var(--white); }
.price-line.total { border-top: 1px solid var(--dark-gray); margin-top: 0.5rem; padding-top: 0.9rem; }
.price-line.total .pl-value { font-family: "Bebas Neue", sans-serif; font-size: 1.4rem; color: var(--mid); }
.price-ttc { font-size: 0.65rem; color: var(--gray); margin-top: 0.3rem; }
/* Payment */
.payment-amount-box { text-align: center; padding: 1.5rem; background: var(--dark); border: 1px solid var(--dark-gray); margin-bottom: 1.5rem; }
.payment-amount-box p { font-size: 0.65rem; color: var(--gray); letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 0.3rem; }
.pay-amount-big { font-family: "Bebas Neue", sans-serif; font-size: 3rem; color: var(--white); }
.pay-amount-sub { font-size: 0.7rem; color: var(--gray); margin-top: 0.2rem; }
.paypalme-btn { display: flex; align-items: center; justify-content: center; gap: 0.8rem; background: #003087; color: #fff; text-decoration: none; padding: 1rem 1.5rem; font-family: "Space Mono", monospace; font-size: 0.78rem; letter-spacing: 0.08em; margin: 1rem 0 0.5rem; transition: background 0.2s; }
.paypalme-btn:hover { background: #005ea6; }
.paypalme-notice { font-size: 0.58rem; color: var(--gray); line-height: 1.6; text-align: center; letter-spacing: 0.05em; }
/* Buttons */
.btn-step { background: var(--white); color: var(--black); border: none; padding: 1rem 2rem; font-family: "Space Mono", monospace; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer; width: 100%; transition: all 0.3s; margin-top: 0.5rem; }
.btn-step:hover { background: var(--accent); }
.btn-step-ghost { background: transparent; color: var(--gray); border: 1px solid var(--dark-gray); padding: 0.8rem 2rem; font-family: "Space Mono", monospace; font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer; width: 100%; transition: all 0.3s; margin-top: 0.5rem; }
.btn-step-ghost:hover { border-color: var(--gray); color: var(--white); }
/* Forms */
.form-group { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.8rem; }
.form-label { font-size: 0.56rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); }
.form-input, .form-select { background: var(--dark); border: 1px solid var(--dark-gray); color: var(--white); font-family: "Space Mono", monospace; font-size: 0.68rem; padding: 0.7rem 0.9rem; width: 100%; transition: border-color 0.2s; outline: none; }
.form-input:focus, .form-select:focus { border-color: var(--mid); }
.form-select { appearance: none; cursor: pointer; }
.form-hint { font-size: 0.56rem; color: var(--gray); line-height: 1.6; }
.form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
/* Success */
.success-icon { width: 66px; height: 66px; border-radius: 50%; background: rgba(138,138,132,0.08); border: 1px solid var(--mid); display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem; font-size: 1.7rem; color: var(--mid); }
.success-ref { color: var(--mid); font-family: "Bebas Neue", sans-serif; font-size: 1.4rem; letter-spacing: 0.1em; margin: 1rem 0; }
/* Retouche / VTC boxes */
.retouche-box { background: var(--dark); border-left: 2px solid var(--mid); padding: 1rem; margin-bottom: 1.5rem; font-size: 0.7rem; color: var(--gray); line-height: 1.75; }
.retouche-box strong { color: var(--white); }
.vtc-notice-box { background: var(--dark); border: 1px solid var(--dark-gray); padding: 1rem; font-size: 0.7rem; color: var(--gray); line-height: 1.75; margin-bottom: 1.5rem; }
.vtc-notice-box strong { color: var(--white); }
.vtc-section-title { font-family: "Bebas Neue", sans-serif; font-size: 0.9rem; color: var(--mid); letter-spacing: 0.1em; margin: 1rem 0 0.8rem; border-bottom: 1px solid var(--dark-gray); padding-bottom: 0.4rem; }
/* Radio */
.radio-group { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.radio-option { display: none; }
.radio-label { padding: 0.4rem 0.9rem; border: 1px solid var(--dark-gray); font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gray); cursor: pointer; transition: all 0.2s; }
.radio-option:checked + .radio-label { border-color: var(--mid); color: var(--white); background: var(--dark-gray); }
/* CONDITIONS */
#conditions { background: var(--dark2); }
.conditions-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: 1px; background: var(--dark-gray); border: 1px solid var(--dark-gray); }
.cond-card { background: var(--dark2); padding: 1.8rem 1.5rem; }
.cond-icon { font-size: 1.4rem; margin-bottom: 0.8rem; }
.cond-title { font-family: "Bebas Neue", sans-serif; font-size: 1rem; color: var(--white); margin-bottom: 0.6rem; letter-spacing: 0.05em; }
.cond-text { font-size: 0.62rem; color: var(--gray); line-height: 1.85; }
.cond-text strong { color: var(--mid); }
/* ABOUT */
#about { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; background: var(--dark); padding: 5rem 4rem; }
.about-box { background: var(--black); border: 1px solid var(--dark-gray); padding: 2.5rem; position: relative; }
.about-box::before { content: ""; position: absolute; top: -6px; left: -6px; right: 6px; bottom: 6px; border: 1px solid rgba(255,255,255,0.03); pointer-events: none; }
.about-stat { margin-bottom: 1.5rem; }
.about-stat-num { font-family: "Bebas Neue", sans-serif; font-size: 2.5rem; color: var(--white); line-height: 1; }
.about-stat-label { font-size: 0.58rem; letter-spacing: 0.15em; color: var(--gray); text-transform: uppercase; }
.about-text { font-size: 0.72rem; color: var(--gray); line-height: 2; margin-bottom: 1.2rem; }
/* UNIVERS */
#univers { background: var(--dark2); }
.tags-cloud { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 1.5rem; }
.tag { padding: 0.42rem 0.9rem; border: 1px solid var(--dark-gray); font-size: 0.58rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gray); transition: all 0.2s; cursor: default; }
.tag:hover, .tag.highlight { border-color: var(--mid); color: var(--white); background: rgba(138,138,132,0.08); }
/* CONTACT */
#contact { background: var(--black); }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.contact-form { display: flex; flex-direction: column; gap: 0.8rem; }
.contact-socials { display: flex; flex-direction: column; gap: 1rem; justify-content: center; }
.social-link { display: flex; align-items: center; gap: 1rem; text-decoration: none; padding: 1rem 1.2rem; border: 1px solid var(--dark-gray); transition: all 0.2s; }
.social-link:hover { border-color: var(--mid); background: var(--dark); }
.social-icon { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; font-size: 1rem; color: var(--gray); flex-shrink: 0; }
.social-link:hover .social-icon { color: var(--white); }
.social-info-name { font-family: "Bebas Neue", sans-serif; font-size: 1rem; letter-spacing: 0.08em; color: var(--white); }
.social-info-handle { font-size: 0.56rem; color: var(--gray); letter-spacing: 0.08em; }
.submit-btn { background: var(--white); color: var(--black); border: none; font-family: "Bebas Neue", sans-serif; font-size: 1rem; letter-spacing: 0.15em; padding: 0.9rem 2rem; cursor: pointer; transition: background 0.2s; }
.submit-btn:hover { background: var(--accent); }
/* FICHIERS */
#files { background: var(--dark); }
.files-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
.files-info { display: flex; flex-direction: column; gap: 1rem; }
.files-info-item { border-left: 2px solid var(--dark-gray); padding-left: 1rem; }
.files-info-item-title { font-family: "Bebas Neue", sans-serif; font-size: 0.9rem; color: var(--mid); letter-spacing: 0.05em; margin-bottom: 0.3rem; }
.files-info-item-text { font-size: 0.62rem; color: var(--gray); line-height: 1.75; }
.file-form { display: flex; flex-direction: column; gap: 0.8rem; }
.radio-group { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.radio-option { display: none; }
.radio-label { padding: 0.4rem 0.9rem; border: 1px solid var(--dark-gray); font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gray); cursor: pointer; transition: all 0.2s; }
.radio-option:checked + .radio-label { border-color: var(--mid); color: var(--white); background: var(--dark-gray); }
/* FOOTER */
footer { border-top: 1px solid var(--dark-gray); padding: 1.5rem 4rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.5rem; background: var(--black); }
.footer-left { display: flex; flex-direction: column; gap: 0.4rem; }
.footer-logo { height: 80px; width: auto; }
.footer-entity { font-size: 0.52rem; letter-spacing: 0.14em; color: var(--gray); text-transform: uppercase; }
.footer-copy { font-size: 0.56rem; letter-spacing: 0.1em; color: var(--gray); }
/* MISC */
.mini-cal-nav, .mini-cal, .mini-cal-header, .mini-cal-day, .date-selected-display, .time-sublabel, .time-range, .time-arrow { display: none !important; }
.price-display, .prestation-cards, .retouche-info, .payment-section, .acompte-box, .pay-btn { display: none !important; }
.resa-info, .resa-grid, .info-block, .info-block-title { display: none !important; }
.calendly-wrapper { display: none !important; }
@media(max-width:700px) {
section { padding: 4rem 1.5rem; }
.hero { padding: 6rem 1.5rem 3rem; }
nav { padding: 0.8rem 1.5rem; }
footer { padding: 1.5rem; }
#about { grid-template-columns: 1fr; gap: 2rem; padding: 4rem 1.5rem; }
.contact-grid, .files-grid, .form-row-2 { grid-template-columns: 1fr; }
.tarif-selector, .hours-grid { grid-template-columns: 1fr 1fr; }
.session-types { grid-template-columns: 1fr 1fr; }
.hero::after { display: none; }
.waveform { display: none; }
}
/* ── SÉPARATEURS DE SECTIONS ── */
section { position: relative; }
/* Ligne d'accent en haut de chaque section */
section::before {
content: "";
position: absolute;
top: 0; left: 4rem; right: 4rem;
height: 1px;
background: linear-gradient(to right, transparent, var(--dark-gray), transparent);
}
/* Label de section flottant */
.section-anchor {
position: absolute;
top: 1.5rem;
right: 4rem;
font-size: 0.48rem;
letter-spacing: 0.3em;
text-transform: uppercase;
color: var(--dark-gray);
font-family: "Space Mono", monospace;
}
/* Alternance de fonds plus marquée */
#services { background: var(--dark); }
#tarifs { background: var(--black); }
#vtc { background: var(--dark2); }
#files { background: var(--dark); }
#reservation{ background: var(--black); }
#conditions { background: var(--dark2); }
#about { background: var(--dark); }
#univers { background: var(--black); }
#contact { background: var(--dark2); }
/* Numéro de section en filigrane */
.section-num {
font-family: "Bebas Neue", sans-serif;
font-size: 6rem;
color: rgba(255,255,255,0.025);
position: absolute;
top: 1rem;
left: 4rem;
line-height: 1;
pointer-events: none;
letter-spacing: 0.05em;
}
/* Titre de section avec barre latérale */
.section-title {
font-family: "Bebas Neue", sans-serif;
font-size: clamp(2rem, 4vw, 3.8rem);
line-height: 1;
margin-bottom: 2.5rem;
letter-spacing: 0.03em;
color: var(--white);
padding-left: 1rem;
border-left: 3px solid var(--gray);
}
/* Tag de section */
.section-tag {
font-size: 0.56rem;
letter-spacing: 0.35em;
text-transform: uppercase;
color: var(--mid);
margin-bottom: 0.6rem;
display: flex;
align-items: center;
gap: 1rem;
}
.section-tag::before {
content: "";
display: block;
width: 28px;
height: 1px;
background: var(--gray);
}
/* ══ DÉMARCATION FORTE DES SECTIONS ══ */
/* Chaque section a une bordure top visible */
section {
position: relative;
border-top: 1px solid var(--dark-gray);
}
/* Bande colorée en haut de chaque section */
section::before {
content: "";
position: absolute;
top: 0; left: 0; right: 0;
height: 3px;
background: linear-gradient(to right, var(--gray), var(--mid), transparent);
}
/* Fonds bien contrastés */
.hero { background: var(--black); border-top: none; }
.hero::before { display: none; }
#services { background: #111110; }
#tarifs { background: #0A0908; }
#vtc { background: #131311; }
#files { background: #0D0D0B; }
#reservation { background: #111110; }
#conditions { background: #0A0908; }
#about { background: #131311; }
#univers { background: #0D0D0B; }
#contact { background: #111110; }
/* Padding interne généreux pour l'aération */
section { padding: 6rem 4rem 5rem; }
/* Titre avec démarcation forte */
.section-title {
font-family: "Bebas Neue", sans-serif;
font-size: clamp(2.2rem, 4vw, 4rem);
line-height: 1;
margin-bottom: 2.5rem;
letter-spacing: 0.04em;
color: var(--white);
padding-bottom: 1rem;
border-bottom: 1px solid var(--dark-gray);
display: flex;
align-items: center;
gap: 1rem;
}
/* Numéro inline dans le titre */
.section-title .sec-num {
font-size: 0.9rem;
color: var(--gray);
font-family: "Space Mono", monospace;
letter-spacing: 0.1em;
padding: 0.2rem 0.6rem;
border: 1px solid var(--dark-gray);
vertical-align: middle;
}
/* Filigrane de section bien visible */
.section-num {
font-family: "Bebas Neue", sans-serif;
font-size: 8rem;
color: rgba(255,255,255,0.03);
position: absolute;
top: 0.5rem;
right: 2rem;
line-height: 1;
pointer-events: none;
letter-spacing: 0.05em;
}
/* Anchor label */
.section-anchor {
position: absolute;
top: 1.2rem;
right: 4rem;
font-size: 0.46rem;
letter-spacing: 0.35em;
text-transform: uppercase;
color: var(--gray);
font-family: "Space Mono", monospace;
background: var(--dark-gray);
padding: 0.25rem 0.7rem;
}
/* ── SÉPARATION DES SECTIONS ── */
#services { background: #0F0F0D; border-top: 2px solid #1E1E1C; }
#tarifs { background: #080807; border-top: 2px solid #1E1E1C; }
#vtc { background: #131312; border-top: 2px solid #1E1E1C; }
#files { background: #0F0F0D; border-top: 2px solid #1E1E1C; }
#reservation { background: #080807; border-top: 2px solid #1E1E1C; }
#conditions { background: #131312; border-top: 2px solid #1E1E1C; }
#about { background: #0F0F0D; border-top: 2px solid #1E1E1C; }
#univers { background: #080807; border-top: 2px solid #1E1E1C; }
#contact { background: #131312; border-top: 2px solid #1E1E1C; }
footer { border-top: 2px solid #1E1E1C; background: #080807; }
/* Trait lumineux subtil en haut de chaque section */
#services::before, #tarifs::before, #vtc::before, #files::before,
#reservation::before, #conditions::before, #about::before,
#univers::before, #contact::before {
content: "";
display: block;
width: 60px;
height: 2px;
background: var(--mid);
margin-bottom: 3rem;
}
/* Titres de section clairs et bien lisibles */
.section-title {
font-family: "Bebas Neue", sans-serif;
font-size: clamp(2.2rem, 4vw, 4rem);
line-height: 1;
margin-bottom: 2.5rem;
letter-spacing: 0.04em;
color: var(--white);
border-left: 3px solid var(--mid);
padding-left: 1rem;
}
/* Reset tous les ajouts foireux */
.section-num { display: none; }
.section-anchor { display: none; }
.sec-num { display: none; }
section::before { content: none; }
#services::before, #tarifs::before, #vtc::before, #files::before,
#reservation::before, #conditions::before, #about::before,
#univers::before, #contact::before {
content: "";
}
/* ── FONDS CLAIRS PAR SECTION ── */
#services { background: #F0EFF9 !important; border-top: 2px solid #DDDCDA !important; }
#tarifs { background: #F8F8F5 !important; border-top: 2px solid #DDDCDA !important; }
#vtc { background: #F2F1EE !important; border-top: 2px solid #DDDCDA !important; }
#files { background: #F8F8F5 !important; border-top: 2px solid #DDDCDA !important; }
#reservation { background: #F0EFF9 !important; border-top: 2px solid #DDDCDA !important; }
#conditions { background: #F8F8F5 !important; border-top: 2px solid #DDDCDA !important; }
#about { background: #F2F1EE !important; border-top: 2px solid #DDDCDA !important; }
#univers { background: #F8F8F5 !important; border-top: 2px solid #DDDCDA !important; }
#contact { background: #F0EFF9 !important; border-top: 2px solid #DDDCDA !important; }
footer { background: #1A1A18 !important; border-top: 2px solid #DDDCDA !important; }
/* Nav - blanc avec ombre légère */
nav { background: rgba(248,248,245,0.97) !important; border-bottom: 1px solid #DDDCDA !important; }
.nav-links a { color: #888884 !important; }
.nav-links a:hover { color: #1A1A18 !important; }
/* Textes sur fond clair */
.section-title { color: var(--black) !important; border-left-color: #888884 !important; }
.section-tag { color: #555552 !important; }
.section-tag::before { background: #888884 !important; }
.hero-tag { color: #555552 !important; }
.hero-tag::before { background: #888884 !important; }
.hero-sub { color: #555552 !important; }
/* Cards et blocs sur fond clair */
.service-card { background: #FFFFFF !important; border: 1px solid #E0DFDB !important; }
.service-card:hover { background: #F0EFF9 !important; }
.service-name { color: #1A1A18 !important; }
.service-desc { color: #888884 !important; }
.service-number { color: #E0DFDB !important; }
.service-card:hover .service-number { color: #C0BFBA !important; }
.tarif-card { background: #FFFFFF !important; border: 1px solid #E0DFDB !important; }
.tarif-card:hover { background: #F8F7F4 !important; }
.tarif-price { color: #1A1A18 !important; }
.tarif-price span { color: #888884 !important; }
.tarif-label { color: #888884 !important; }
.tarif-hours { color: #555552 !important; }
.tarif-tva { color: #AAAAAA !important; }
.tarifs-grid { background: #E0DFDB !important; border-color: #E0DFDB !important; }
.tarifs-block-title { color: #555552 !important; border-bottom-color: #E0DFDB !important; }
.price-box { background: #FFFFFF !important; border-color: #E0DFDB !important; }
.price-box-title { color: #AAAAAA !important; }
.price-line .pl-label { color: #888884 !important; }
.price-line .pl-value { color: #1A1A18 !important; }
.price-line.total { border-top-color: #E0DFDB !important; }
.price-line.total .pl-value { color: #555552 !important; }
.price-ttc { color: #AAAAAA !important; }
.payment-amount-box { background: #FFFFFF !important; border-color: #E0DFDB !important; }
.payment-amount-box p { color: #888884 !important; }
.pay-amount-big { color: #1A1A18 !important; }
.pay-amount-sub { color: #888884 !important; }
.step-num { background: #FFFFFF !important; border-color: #E0DFDB !important; color: #888884 !important; }
.step.active .step-num { border-color: #1A1A18 !important; color: #1A1A18 !important; background: #F0EFF9 !important; }
.step.done .step-num { background: #1A1A18 !important; border-color: #1A1A18 !important; color: #FFFFFF !important; }
.step-label { color: #AAAAAA !important; }
.step.active .step-label { color: #1A1A18 !important; }
.step-line { background: #E0DFDB !important; }
.step-line.done { background: #888884 !important; }
.step-section-title { color: #1A1A18 !important; }
.step-section-label { color: #888884 !important; }
.tarif-selector .tarif-card { background: #FFFFFF !important; border-color: #E0DFDB !important; }
.tarif-selector .tarif-card.active { border-color: #555552 !important; }
.tarif-card-name { color: #1A1A18 !important; }
.tarif-card-price { color: #555552 !important; }
.tarif-card-detail { color: #888884 !important; }
.tarif-badge { background: #555552 !important; color: #FFFFFF !important; }
.hour-btn { background: #FFFFFF !important; border-color: #E0DFDB !important; color: #888884 !important; }
.hour-btn.active { border-color: #1A1A18 !important; color: #1A1A18 !important; background: #F0EFF9 !important; }
.session-btn { background: #FFFFFF !important; border-color: #E0DFDB !important; color: #888884 !important; }
.session-btn.active { border-color: #555552 !important; color: #1A1A18 !important; background: #F0EFF9 !important; }
.step-info-box { background: #F0EFF9 !important; border-left-color: #888884 !important; color: #555552 !important; }
.step-info-box strong { color: #1A1A18 !important; }
.retouche-box { background: #F0EFF9 !important; border-left-color: #888884 !important; color: #555552 !important; }
.retouche-box strong { color: #1A1A18 !important; }
.vtc-notice-box { background: #F0EFF9 !important; border-color: #E0DFDB !important; color: #555552 !important; }
.form-input, .form-select { background: #FFFFFF !important; border-color: #E0DFDB !important; color: #1A1A18 !important; }
.form-input:focus, .form-select:focus { border-color: #555552 !important; }
.form-label { color: #888884 !important; }
.form-hint { color: #AAAAAA !important; }
.btn-step { background: #1A1A18 !important; color: #F8F8F5 !important; }
.btn-step:hover { background: #2C2C2A !important; }
.btn-step-ghost { border-color: #E0DFDB !important; color: #888884 !important; }
.btn-step-ghost:hover { border-color: #888884 !important; color: #1A1A18 !important; }
.cond-card { background: #FFFFFF !important; }
.cond-title { color: #1A1A18 !important; }
.cond-text { color: #888884 !important; }
.cond-text strong { color: #555552 !important; }
.conditions-grid { background: #E0DFDB !important; border-color: #E0DFDB !important; }
.about-box { background: #FFFFFF !important; border-color: #E0DFDB !important; }
.about-stat-num { color: #1A1A18 !important; }
.about-stat-label { color: #AAAAAA !important; }
.about-text { color: #888884 !important; }
.tag { border-color: #E0DFDB !important; color: #888884 !important; }
.tag:hover, .tag.highlight { border-color: #555552 !important; color: #1A1A18 !important; background: #F0EFF9 !important; }
.contact-form .form-input, .contact-form .form-select { background: #FFFFFF !important; }
.submit-btn { background: #1A1A18 !important; color: #F8F8F5 !important; }
.submit-btn:hover { background: #2C2C2A !important; }
.social-link { border-color: #E0DFDB !important; }
.social-link:hover { background: #F0EFF9 !important; border-color: #888884 !important; }
.social-info-name { color: #1A1A18 !important; }
.social-info-handle { color: #888884 !important; }
.vtc-box { border-color: #E0DFDB !important; }
.vtc-item-price { color: #1A1A18 !important; }
.vtc-item-label { color: #888884 !important; }
.vtc-item-tva { color: #AAAAAA !important; }
.vtc-note { color: #888884 !important; border-top-color: #E0DFDB !important; }
.resa-tabs { background: #E0DFDB !important; border-color: #E0DFDB !important; }
.resa-tab { background: #F8F8F5 !important; color: #888884 !important; }
.resa-tab:hover { color: #1A1A18 !important; background: #EEEDEA !important; }
.resa-tab.active { background: #1A1A18 !important; color: #F8F8F5 !important; }
.success-icon { background: #F0EFF9 !important; border-color: #888884 !important; color: #555552 !important; }
.success-ref { color: #555552 !important; }
.section-title { border-left-color: #888884 !important; }
#services::before, #tarifs::before, #vtc::before, #files::before,
#reservation::before, #conditions::before, #about::before,
#univers::before, #contact::before { background: #888884 !important; }
/* Hero CTA */
.hero-cta { background: #1A1A18 !important; color: #F8F8F5 !important; }
.hero-cta:hover { background: #2C2C2A !important; }
/* Footer reste sombre pour le contraste final */
footer { color: #888884 !important; }
.footer-entity { color: #555552 !important; }
.footer-copy { color: #555552 !important; }
.footer-logo { filter: none !important; }
/* Services grid separator */
.services-grid { background: #E0DFDB !important; border-color: #E0DFDB !important; }
/* Files section */
.files-info-item { border-left-color: #E0DFDB !important; }
.files-info-item-title { color: #555552 !important; }
.files-info-item-text { color: #888884 !important; }
/* Acompte box */
.acompte-box { background: #FFFFFF !important; border-color: #E0DFDB !important; }
.acompte-label { color: #888884 !important; }
.acompte-amount { color: #1A1A18 !important; }
.acompte-note { color: #AAAAAA !important; }
/* VTC section title */
.vtc-section-title { color: #555552 !important; border-bottom-color: #E0DFDB !important; }
/* Radio */
.radio-label { border-color: #E0DFDB !important; color: #888884 !important; }
.radio-option:checked + .radio-label { border-color: #555552 !important; color: #1A1A18 !important; background: #F0EFF9 !important; }
/* ── ARTISTES ── */
.artists-grid { display:flex; flex-wrap:wrap; gap:0.8rem; }
.artist-tag {
padding:0.6rem 1.2rem;
border:1px solid #4A4A48;
font-size:0.68rem;
letter-spacing:0.12em;
text-transform:uppercase;
color:#C4C3BC;
transition:all 0.2s;
cursor:default;
background:#2A2A28;
}
.artist-tag:hover { border-color:#AEADA8; color:#F0EFE8; background:#333330; }
.artist-tag.highlight {
border-color:#AEADA8;
color:#F0EFE8;
background:#333330;
font-weight:600;
}
.artist-note {
font-size:0.54rem;
color:#AEADA8;
letter-spacing:0.08em;
margin-left:0.4rem;
font-weight:normal;
text-transform:none;
}
.artist-tag.highlight .artist-note { color:#C4C3BC; }
/* ── AUTOCOMPLETE ── */
.autocomplete-wrap { position: relative; }
.autocomplete-list {
position: absolute;
top: 100%;
left: 0; right: 0;
background: #1A1918;
border: 1px solid #4A4A48;
border-top: none;
z-index: 100;
max-height: 200px;
overflow-y: auto;
}
.autocomplete-item {
padding: 0.6rem 0.9rem;
font-size: 0.68rem;
color: #C4C3BC;
cursor: pointer;
border-bottom: 1px solid #2A2A28;
transition: background 0.15s;
font-family: "Space Mono", monospace;
}
.autocomplete-item:hover { background: #2A2A28; color: #F0EFE8; }
.autocomplete-item:last-child { border-bottom: none; }
/* ── MENTIONS LÉGALES POPUP ── */
.ml-overlay {
display: none;
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0,0,0,0.75);
z-index: 9999;
justify-content: center;
align-items: flex-start;
padding: 40px 20px;
overflow-y: auto;
}
.ml-overlay.open { display: flex; }
.ml-modal {
background: #ffffff;
max-width: 700px;
width: 100%;
border-radius: 2px;
overflow: hidden;
font-family: 'Space Mono', monospace;
box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}
.ml-header {
background: #0A0908;
padding: 20px 28px;
display: flex;
justify-content: space-between;
align-items: center;
}
.ml-header h2 {
font-size: 1rem;
font-weight: 700;
letter-spacing: 0.2em;
color: #ffffff;
margin: 0;
}
.ml-header h2 span { color: #C0141C; }
.ml-close {
background: none;
border: none;
color: #AEADA8;
font-size: 1.2rem;
cursor: pointer;
line-height: 1;
padding: 0;
transition: color 0.2s;
}
.ml-close:hover { color: #ffffff; }
.ml-intro {
background: #f5f5f5;
border-left: 3px solid #1a1aff;
padding: 14px 20px;
margin: 24px 28px 20px;
font-size: 0.65rem;
line-height: 1.9;
color: #555555;
}
.ml-section {
padding: 0 28px 20px;
}
.ml-section-title {
font-size: 0.52rem;
letter-spacing: 0.3em;
text-transform: uppercase;
color: #1a1aff;
font-weight: 700;
border-bottom: 1px solid #e0e0e0;
padding-bottom: 8px;
margin-bottom: 12px;
}
.ml-table { width: 100%; border-collapse: collapse; margin-bottom: 8px; }
.ml-table tr td {
padding: 8px 0;
font-size: 0.63rem;
line-height: 1.8;
border-bottom: 1px solid #f0f0f0;
vertical-align: top;
}
.ml-table tr:last-child td { border-bottom: none; }
.ml-table td:first-child {
color: #999999;
font-size: 0.55rem;
letter-spacing: 0.12em;
text-transform: uppercase;
width: 38%;
padding-right: 16px;
}
.ml-table td:last-child { color: #333333; }
.ml-footer-note {
background: #f5f5f5;
padding: 14px 28px;
font-size: 0.58rem;
color: #999999;
line-height: 1.7;
border-top: 1px solid #e8e8e8;
text-align: center;
letter-spacing: 0.08em;
}
footer {
background: #0A0908 !important;
border-top: 1px solid #1E1E1C !important;
padding: 3rem 2rem !important;
display: block !important;
text-align: center !important;
}
footer * {
text-align: center !important;
}
.footer-left, .footer-right, .footer-entity, .footer-copy {
display: none !important;
}