/* page.css — Styles communs aux pages intérieures */

/* ── Kinésiologie ────────────────────────────────────────────────────────── */
.kine-intro-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: var(--space-2xl);
    align-items: center;
}
.kine-intro-content h2 { margin-bottom: var(--space-md); }

.kine-quote-card {
    background: var(--color-primary-dark);
    color: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--space-xl);
    position: relative;
}
.kine-quote-card::before {
    content: '"';
    font-family: var(--font-display);
    font-size: 6rem;
    color: rgba(255,255,255,0.1);
    position: absolute;
    top: -1rem;
    left: 1.5rem;
    line-height: 1;
}
.kine-quote-card blockquote {
    font-family: var(--font-display);
    font-style: italic;
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: var(--space-md);
    position: relative;
    z-index: 1;
}
.kine-quote-card cite {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--color-accent-light);
}

@media (max-width: 900px) {
    .kine-intro-grid { grid-template-columns: 1fr; }
}

/* ── Steps ───────────────────────────────────────────────────────────────── */
.steps-list {
    max-width: 820px;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.step-item {
    display: grid;
    grid-template-columns: 48px 52px 1fr;
    gap: var(--space-md);
    align-items: start;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
}

.step-number {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-primary-soft);
    line-height: 1;
    padding-top: 4px;
}

.step-icon {
    width: 48px;
    height: 48px;
    background: var(--color-primary-soft);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    font-size: 1.4rem;
    flex-shrink: 0;
}

.step-title {
    font-size: 1.05rem;
    margin-bottom: var(--space-xs);
}
.step-desc { font-size: 0.92rem; color: var(--color-text-muted); line-height: 1.6; margin-bottom: 0; }

@media (max-width: 600px) {
    .step-item { grid-template-columns: 36px 1fr; }
    .step-number { font-size: 1.5rem; }
    .step-icon { display: none; }
}

/* ── Service blocks ──────────────────────────────────────────────────────── */
.service-block { padding-block: var(--space-xl); }
.service-divider { border: none; border-top: 1px solid var(--color-border); margin: 0; }

.service-block-header {
    display: flex;
    align-items: flex-start;
    gap: var(--space-md);
    margin-bottom: var(--space-lg);
}

.service-block-icon {
    width: 60px;
    height: 60px;
    background: var(--color-primary-soft);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    font-size: 1.8rem;
    flex-shrink: 0;
}

.service-block-title {
    font-size: clamp(1.3rem, 3vw, 1.8rem);
    margin-bottom: 0;
}

.service-block-body {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: var(--space-2xl);
    align-items: start;
}

.service-block-desc p { font-size: 1rem; color: var(--color-text-muted); }

.service-block-tarifs { background: var(--color-sand-light); border-radius: var(--radius-lg); padding: var(--space-lg); }
.tarifs-heading { font-size: 0.88rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted); margin-bottom: var(--space-md); }

.tarif-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    padding-block: var(--space-sm);
    border-bottom: 1px solid var(--color-sand-dark);
}
.tarif-line:last-of-type { border-bottom: none; }
.tarif-line--global .tarif-line-label { font-weight: 600; }

.tarif-line-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.88rem;
    color: var(--color-text-muted);
}
.tarif-line-label .ti { color: var(--color-primary); }

.tarif-note { font-size: 0.78rem; color: var(--color-text-muted); margin-top: var(--space-xs); font-style: italic; }

@media (max-width: 900px) {
    .service-block-body { grid-template-columns: 1fr; }
}

/* ── Formations détail ───────────────────────────────────────────────────── */
.instructor-banner {
    display: flex;
    gap: var(--space-lg);
    align-items: flex-start;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-xl);
}
.instructor-icon {
    width: 64px; height: 64px;
    background: var(--color-primary-soft);
    border-radius: var(--radius-lg);
    display: flex; align-items: center; justify-content: center;
    color: var(--color-primary); font-size: 2rem;
    flex-shrink: 0;
}
.instructor-content h2 { margin-bottom: var(--space-sm); }
.instructor-badges { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-md); }

.formation-detail { padding-block: var(--space-xl); }
.formation-detail-header {
    display: flex; gap: var(--space-lg); align-items: flex-start;
    margin-bottom: var(--space-lg);
}
.formation-detail-icon {
    width: 64px; height: 64px;
    background: var(--color-primary-soft);
    border-radius: var(--radius-lg);
    display: flex; align-items: center; justify-content: center;
    color: var(--color-primary); font-size: 2rem;
    flex-shrink: 0;
}
.formation-detail-title { font-size: clamp(1.4rem, 3vw, 2rem); margin-bottom: var(--space-xs); }
.formation-detail-duree {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 0.85rem; font-weight: 600; color: var(--color-accent);
}
.formation-detail-body {
    display: grid; grid-template-columns: 1.5fr 1fr; gap: var(--space-xl);
    margin-bottom: var(--space-lg);
}
.formation-detail-desc p { color: var(--color-text-muted); }
.formation-detail-desc h3 { font-size: 1rem; margin: var(--space-md) 0 var(--space-sm); }
.formation-objectives { display: flex; flex-direction: column; gap: var(--space-xs); }
.formation-objectives li { display: flex; align-items: flex-start; gap: var(--space-xs); font-size: 0.92rem; color: var(--color-text-muted); }
.formation-objectives li .ti { color: var(--color-primary); margin-top: 3px; }
.formation-detail-public { background: var(--color-primary-soft); border-radius: var(--radius-md); padding: var(--space-md); }
.formation-detail-public h3 { font-size: 0.88rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted); margin-bottom: var(--space-sm); }
.formation-public-text { display: flex; align-items: center; gap: var(--space-xs); margin: 0; font-size: 0.92rem; }
.formation-public-text .ti { color: var(--color-primary); }

@media (max-width: 900px) {
    .instructor-banner { flex-direction: column; }
    .formation-detail-body { grid-template-columns: 1fr; }
}

/* ── À propos ────────────────────────────────────────────────────────────── */
.about-grid {
    display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--space-2xl); align-items: start;
}
.about-photo-wrap {
    border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 4/5;
    background: var(--color-primary-soft);
}
.about-photo-wrap img { width: 100%; height: 100%; object-fit: cover; }
.about-photo-placeholder {
    width: 100%; height: 100%;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: var(--space-sm); color: var(--color-primary-light); font-size: 0.9rem;
}
.about-photo-placeholder .ti { font-size: 5rem; }

.about-certs-list {
    margin-top: var(--space-md);
    display: flex; flex-direction: column; gap: var(--space-xs);
}
.about-cert-line {
    display: flex; gap: var(--space-sm); align-items: center;
    font-size: 0.88rem; padding: 0.5rem 0;
    border-bottom: 1px solid var(--color-border);
}
.about-cert-year { font-weight: 700; color: var(--color-accent); min-width: 2.5rem; }
.about-cert-name { color: var(--color-text-muted); }

.about-content h2 { margin-bottom: var(--space-md); }

.about-accreditations { margin-top: var(--space-xl); }
.about-accreditations h3 { font-size: 1rem; margin-bottom: var(--space-md); }
.about-accred-grid { display: flex; flex-direction: column; gap: var(--space-sm); margin-bottom: var(--space-md); }
.about-accred-item {
    display: flex; gap: var(--space-sm); align-items: flex-start;
    background: var(--color-primary-soft); border-radius: var(--radius-md); padding: var(--space-sm) var(--space-md);
}
.about-accred-item .ti { color: var(--color-primary); font-size: 1.3rem; margin-top: 2px; }
.about-accred-item div { display: flex; flex-direction: column; }
.about-accred-item strong { font-size: 0.95rem; color: var(--color-primary-dark); }
.about-accred-item span { font-size: 0.82rem; color: var(--color-text-muted); }
.about-accred-note { font-size: 0.82rem; color: var(--color-text-muted); display: flex; align-items: flex-start; gap: 6px; }
.about-accred-note .ti { color: var(--color-accent); flex-shrink: 0; margin-top: 2px; }

@media (max-width: 900px) {
    .about-grid { grid-template-columns: 1fr; }
    .about-photo { max-width: 400px; margin-inline: auto; }
}

/* ── Cabinets ────────────────────────────────────────────────────────────── */
.cabinet-block { padding-block: var(--space-xl); }

.cabinet-block-header {
    display: flex; gap: var(--space-md); align-items: flex-start;
    margin-bottom: var(--space-lg);
}
.cabinet-block-num {
    font-family: var(--font-display); font-size: 3rem; font-weight: 700;
    color: var(--color-primary-soft); line-height: 1;
}
.cabinet-block-city { font-size: clamp(1.6rem, 4vw, 2.2rem); margin-bottom: 4px; }
.cabinet-block-country { font-size: 0.82rem; color: var(--color-text-muted); margin-right: var(--space-sm); }
.cabinet-freq-badge {
    display: inline-flex; align-items: center; gap: 4px;
    background: var(--color-sand); border: 1px solid var(--color-sand-dark);
    border-radius: var(--radius-full); padding: 0.2rem 0.7rem;
    font-size: 0.78rem; font-weight: 600; color: var(--color-accent);
}

.cabinet-block-body {
    display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-xl); align-items: start;
}

.cabinet-info-list { display: flex; flex-direction: column; gap: var(--space-md); margin-bottom: var(--space-lg); }
.cabinet-info-item { display: flex; gap: var(--space-sm); align-items: flex-start; }
.cabinet-info-item .ti { color: var(--color-primary); font-size: 1.2rem; margin-top: 2px; flex-shrink: 0; }
.cabinet-info-item div { display: flex; flex-direction: column; }
.cabinet-info-item strong { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-text-muted); }
.cabinet-info-item span, .cabinet-info-item a { font-size: 0.95rem; color: var(--color-text); }

.cabinet-desc { color: var(--color-text-muted); margin-bottom: var(--space-lg); }

.cabinet-horaires { margin-top: var(--space-lg); }
.cabinet-horaires h3 { font-size: 0.88rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted); margin-bottom: var(--space-sm); }
.horaires-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.25rem 1rem; }
.horaire-jour { font-size: 0.88rem; font-weight: 600; color: var(--color-text); }
.horaire-heure { font-size: 0.88rem; color: var(--color-text-muted); }
.horaire-closed { color: var(--color-text-light); }
.horaire-note { font-size: 0.88rem; color: var(--color-text-muted); display: flex; align-items: center; gap: 6px; margin: 0; }
.horaire-note .ti { color: var(--color-primary); }

.cabinet-map-col { display: flex; flex-direction: column; gap: var(--space-sm); }
.map-container { height: 320px; }
.map-external-link {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 0.82rem; font-weight: 600; color: var(--color-primary);
}

@media (max-width: 900px) {
    .cabinet-block-body { grid-template-columns: 1fr; }
}

/* ── Online banner ───────────────────────────────────────────────────────── */
.online-banner {
    display: flex; gap: var(--space-xl); align-items: center;
    background: var(--color-white); border: 1px solid var(--color-border);
    border-radius: var(--radius-lg); padding: var(--space-xl);
}
.online-banner-icon {
    width: 80px; height: 80px;
    background: var(--color-primary-soft); border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--color-primary); font-size: 2.5rem; flex-shrink: 0;
}
.online-banner h2 { margin-bottom: var(--space-sm); }
.online-banner p { color: var(--color-text-muted); margin-bottom: 0; }

@media (max-width: 700px) {
    .online-banner { flex-direction: column; text-align: center; }
}

/* ── Online section services ─────────────────────────────────────────────── */
.online-grid {
    display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-2xl); align-items: center;
}
.online-features { display: flex; flex-direction: column; gap: var(--space-sm); margin-top: var(--space-md); }
.online-features li { display: flex; align-items: flex-start; gap: var(--space-sm); font-size: 0.95rem; }
.online-features li .ti { color: var(--color-primary); margin-top: 3px; flex-shrink: 0; }
.online-visual { display: flex; flex-direction: column; gap: var(--space-lg); align-items: center; }
.online-icon-wrap {
    width: 120px; height: 120px;
    background: var(--color-primary); border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--color-white); font-size: 3.5rem;
}
.online-info-card {
    background: var(--color-white); border: 1px solid var(--color-border);
    border-radius: var(--radius-md); padding: var(--space-md);
    display: flex; gap: var(--space-sm); align-items: flex-start; width: 100%;
}
.online-info-card .ti { color: var(--color-primary); font-size: 1.4rem; flex-shrink: 0; }
.online-info-card div { display: flex; flex-direction: column; }
.online-info-card strong { font-size: 0.88rem; }
.online-info-card span { font-size: 0.82rem; color: var(--color-text-muted); }

@media (max-width: 900px) {
    .online-grid { grid-template-columns: 1fr; }
}

/* ── FAQ spécifique ──────────────────────────────────────────────────────── */
.faq-container { max-width: 800px; margin-inline: auto; }
.faq-cta-box {
    max-width: 800px; margin: var(--space-xl) auto 0;
    display: flex; gap: var(--space-lg); align-items: center;
    background: var(--color-primary-soft); border-radius: var(--radius-lg); padding: var(--space-xl);
}
.faq-cta-box > .ti { font-size: 2.5rem; color: var(--color-primary); flex-shrink: 0; }
.faq-cta-box h3 { margin-bottom: var(--space-xs); }
.faq-cta-box p { color: var(--color-text-muted); margin-bottom: 0; }
.faq-cta-box .btn { flex-shrink: 0; margin-left: auto; }

@media (max-width: 700px) {
    .faq-cta-box { flex-direction: column; text-align: center; }
    .faq-cta-box .btn { margin-left: 0; }
}

/* ── Contact ─────────────────────────────────────────────────────────────── */
.contact-grid {
    display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--space-2xl); align-items: start;
}
.contact-form-col h2, .contact-info-col h2 { margin-bottom: var(--space-xs); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }

.contact-info-item {
    display: flex; gap: var(--space-md); align-items: flex-start;
    padding-block: var(--space-md); border-bottom: 1px solid var(--color-border);
}
.contact-info-icon {
    width: 44px; height: 44px;
    background: var(--color-primary-soft); border-radius: var(--radius-sm);
    display: flex; align-items: center; justify-content: center;
    color: var(--color-primary); font-size: 1.3rem; flex-shrink: 0;
}
.contact-info-item div { display: flex; flex-direction: column; }
.contact-info-item strong { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-text-muted); }
.contact-info-item a, .contact-info-item span { font-size: 0.95rem; color: var(--color-text); }

.contact-cabinets { margin-top: var(--space-lg); }
.contact-cabinets h3 { font-size: 0.88rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted); margin-bottom: var(--space-sm); }

.contact-cabinet-link {
    display: flex; align-items: center; gap: var(--space-sm);
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border); border-radius: var(--radius-md);
    margin-bottom: var(--space-xs); color: var(--color-text);
    transition: all var(--transition);
}
.contact-cabinet-link:hover { border-color: var(--color-primary); background: var(--color-primary-soft); color: var(--color-text); }
.contact-cabinet-link > .ti:first-child { color: var(--color-primary); flex-shrink: 0; }
.contact-cabinet-link div { flex: 1; display: flex; flex-direction: column; }
.contact-cabinet-link strong { font-size: 0.92rem; }
.contact-cabinet-link span { font-size: 0.78rem; color: var(--color-text-muted); }
.contact-cabinet-link > .ti:last-child { color: var(--color-text-light); }

.contact-insurance-note {
    margin-top: var(--space-lg); display: flex; gap: var(--space-sm); align-items: flex-start;
    background: var(--color-sand); border-radius: var(--radius-md); padding: var(--space-md);
    font-size: 0.82rem; color: var(--color-text-muted);
}
.contact-insurance-note .ti { color: var(--color-primary); flex-shrink: 0; }

@media (max-width: 900px) {
    .contact-grid { grid-template-columns: 1fr; }
    .form-row { grid-template-columns: 1fr; }
}

/* ── Actus / Article ─────────────────────────────────────────────────────── */
.article-wrap { max-width: 800px; margin-inline: auto; }
.article-image { border-radius: var(--radius-lg); overflow: hidden; margin-bottom: var(--space-xl); }
.article-image img { width: 100%; }
.article-body { line-height: 1.8; color: var(--color-text-muted); }
.article-body h2, .article-body h3 { color: var(--color-text); margin-block: var(--space-lg) var(--space-sm); }
.article-body p { margin-bottom: var(--space-md); }
.article-back { margin-top: var(--space-xl); }

/* ── Légal ───────────────────────────────────────────────────────────────── */
.legal-content { max-width: 800px; margin-inline: auto; }
.legal-content h2 { font-size: 1.3rem; margin: var(--space-xl) 0 var(--space-sm); color: var(--color-primary-dark); }
.legal-content h2:first-child { margin-top: 0; }
.legal-content p { color: var(--color-text-muted); }
.cookie-table-wrap { overflow-x: auto; margin-block: var(--space-md); }
.cookie-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.cookie-table th, .cookie-table td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid var(--color-border); }
.cookie-table th { background: var(--color-sand); font-weight: 600; color: var(--color-text); }
.cookie-table code { background: var(--color-primary-soft); color: var(--color-primary-dark); padding: 0.15rem 0.4rem; border-radius: 4px; font-size: 0.85rem; }

/* ── CTA section (toutes pages) ──────────────────────────────────────────── */
.cta-section {
    background: linear-gradient(135deg, var(--color-primary-dark) 0%, #1E4A40 100%);
}
.cta-section h2 { color: var(--color-white); margin-bottom: var(--space-md); }
.cta-subtitle { color: rgba(255,255,255,0.75); font-size: 1.05rem; margin-bottom: var(--space-lg); }
