/**
 * RCG Theme - Custom component styles
 *
 * Only custom/component styles live here.
 * All Tailwind utility classes are auto-generated by the build.
 */

/* === Variables CSS === */
:root {
    --rcg-primary: #CC151B;
    --rcg-primary-hover: #B91C1C;
    --rcg-dark: #0A0A0A;
    --rcg-surface: #1C1C1C;
    --rcg-light: #FFFFFF;
    --rcg-gray-100: #F3F4F6;
    --rcg-gray-500: #6B7280;
    --rcg-section-bg: #F4F4F4;
}

/* === Prose (contenu editeur) === */
.prose {
    color: #374151;
    max-width: 65ch;
}
.prose p {
    margin-top: 1.25em;
    margin-bottom: 1.25em;
}
.prose h2 {
    color: #0A0A0A;
    font-weight: 900;
    font-size: 1.5em;
    margin-top: 2em;
    margin-bottom: 1em;
    line-height: 1.333;
    text-transform: uppercase;
}
.prose h3 {
    color: #0A0A0A;
    font-weight: 700;
    font-size: 1.25em;
    margin-top: 1.6em;
    margin-bottom: 0.6em;
    line-height: 1.6;
}
.prose a {
    color: #CC151B;
    text-decoration: underline;
    font-weight: 500;
}
.prose a:hover {
    color: #B91C1C;
}
.prose strong {
    color: #0A0A0A;
    font-weight: 700;
}
.prose ul {
    list-style-type: disc;
    margin-top: 1.25em;
    margin-bottom: 1.25em;
    padding-left: 1.625em;
}
.prose ol {
    list-style-type: decimal;
    margin-top: 1.25em;
    margin-bottom: 1.25em;
    padding-left: 1.625em;
}
.prose li {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}
.prose blockquote {
    font-style: italic;
    color: #6B7280;
    border-left: 4px solid #CC151B;
    padding-left: 1em;
    margin-top: 1.6em;
    margin-bottom: 1.6em;
}
.prose img {
    margin-top: 2em;
    margin-bottom: 2em;
}
.prose-lg {
    font-size: 1.125rem;
    line-height: 1.777;
}

/* ============================================
   Page Expertises - Styles custom
   ============================================ */

/* Eyebrow : petit label de section */
.eyebrow {
    display: block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #CC151B;
}

/* Line accent : filet decoratif rouge */
.line-accent {
    width: 48px;
    height: 3px;
    background-color: #CC151B;
}

/* Tag pill : pastille/badge avec bordure */
.tag-pill {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 6px 14px;
    border: 1px solid;
    transition: all 150ms ease;
}

/* Quote bar : citation avec bordure gauche rouge */
.quote-bar {
    padding-left: 1rem;
    border-left: 3px solid #CC151B;
}

/* Nav active : lien de navigation actif */
.nav-active {
    color: #CC151B !important;
}

/* Process step : etapes de processus (timeline) */
.process-step {
    position: relative;
}
.process-step + .process-step::before {
    content: '';
    position: absolute;
    left: 19px;
    top: -8px;
    width: 2px;
    height: calc(100%);
    background: rgb(204 21 27 / 0.2);
    z-index: 0;
}

/* Exp img wrap : conteneur d'image expertise */
.exp-img-wrap img {
    transition: transform 700ms ease, filter 700ms ease;
}
.exp-img-wrap:hover img {
    transform: scale(1.05);
}

/* Reveal animation */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Pulsing red dot for crisis */
.crisis-dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: #CC151B;
    border-radius: 50%;
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ============================================
   Page Realisations - Styles custom
   ============================================ */

/* Filter buttons */
.filter-btn {
    cursor: pointer;
    transition: all 200ms ease;
}
.filter-btn.active,
.filter-btn:hover {
    background-color: #CC151B;
    color: #fff;
    border-color: #CC151B;
}

/* Case cards */
.case-card {
    transition: transform 350ms ease, box-shadow 350ms ease;
}
.case-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.12);
}
.case-card .case-img img {
    transition: filter 500ms ease, transform 500ms ease;
    filter: grayscale(60%);
}
.case-card:hover .case-img img {
    filter: grayscale(0%);
    transform: scale(1.05);
}

/* Stat left border */
.stat-left {
    position: relative;
    padding-left: 1.25rem;
}
.stat-left::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: #CC151B;
}

/* Timeline items */
.timeline-item {
    position: relative;
    padding-left: 2.5rem;
}
.timeline-item::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 28px;
    bottom: -28px;
    width: 1px;
    background: linear-gradient(to bottom, rgb(204 21 27 / 0.4), transparent);
}
.timeline-item:last-child::before {
    display: none;
}

/* Sector cards */
.sector-card {
    transition: all 300ms ease;
}
.sector-card:hover {
    background-color: #CC151B;
    color: #fff;
}
.sector-card:hover .material-symbols-outlined,
.sector-card:hover span {
    color: #fff;
}

/* Case item hidden for filtering */
.case-item.hidden-card {
    display: none;
}

/* Lora font for quotes */
.font-lora { font-family: 'Lora', serif; }

/* ============================================
   Page A Propos - Styles custom
   ============================================ */

/* Hero image slow zoom-out */
.hero-img {
    transition: transform 12s ease;
    transform: scale(1.05);
}
header:hover .hero-img {
    transform: scale(1.0);
}

/* Timeline nodes (A Propos page) */
.timeline-node {
    position: relative;
    padding-left: 3rem;
}
.timeline-node::before {
    content: '';
    position: absolute;
    left: 19px;
    top: 40px;
    bottom: -10px;
    width: 1px;
    background: linear-gradient(to bottom, rgb(204 21 27 / 0.4), transparent);
}
.timeline-node:last-child::before {
    display: none;
}

/* Pillar cards (5 piliers ADN) */
.pillar-card {
    position: relative;
    border-top: 3px solid transparent;
    transition: all 300ms ease;
    overflow: hidden;
}
.pillar-card:hover {
    border-top-color: #CC151B;
    background-color: #202020;
}
.pillar-card:hover .pillar-letter {
    color: rgb(204 21 27 / 0.15);
}
.pillar-card:hover h3 {
    color: #CC151B;
}
.pillar-letter {
    transition: color 300ms ease;
}

/* Value rows (Valeurs section) */
.value-row {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    transition: background-color 200ms ease;
}
.value-row:hover {
    background-color: rgb(204 21 27 / 0.04);
}

/* Dot ping animation (bureau locations) */
@keyframes ping-slow {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.8); opacity: 0; }
}
.dot-ping {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    animation: ping-slow 2s cubic-bezier(0, 0, 0.2, 1) infinite;
}

/* ============================================
   Page Insights - Styles custom
   ============================================ */

/* Ticker / Marquee */
@keyframes ticker {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.ticker-inner {
    display: flex;
    white-space: nowrap;
    animation: ticker 30s linear infinite;
}
.ticker-inner:hover {
    animation-play-state: paused;
}

/* Article cards */
.article-card {
    display: block;
    position: relative;
    overflow: hidden;
    transition: transform 350ms ease, box-shadow 350ms ease;
}
.article-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.article-card img {
    transition: filter 600ms ease, transform 600ms ease;
    filter: grayscale(80%);
}
.article-card:hover img {
    filter: grayscale(0%);
    transform: scale(1.04);
}

/* Article ghost number */
.article-num {
    position: absolute;
    bottom: -10px;
    right: 10px;
    font-size: 120px;
    font-weight: 900;
    line-height: 1;
    color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.05);
    pointer-events: none;
    user-select: none;
}
.article-num--light {
    -webkit-text-stroke: 1px rgba(0, 0, 0, 0.05);
}

/* Category tag */
.cat-tag {
    display: inline-block;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding: 3px 9px;
    border: 1px solid;
}

/* Read time badge */
.read-time {
    display: inline-block;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    background-color: rgba(204, 21, 27, 0.08);
    color: #CC151B;
    padding: 2px 8px;
}

/* Feature link (hero CTA) */
.feature-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #CC151B;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    transition: gap 300ms ease;
}
.feature-link:hover {
    gap: 12px;
}

/* Newsletter band */
.newsletter-band {
    background: linear-gradient(135deg, #0a0a0a 0%, #1c1c1c 100%);
}

/* Filter tab active/hover */
.filter-tab {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding: 16px 20px;
    border-bottom: 2px solid transparent;
    transition: all 200ms ease;
    white-space: nowrap;
    cursor: pointer;
    color: #9CA3AF;
}
.filter-tab:hover,
.filter-tab.active {
    color: #CC151B;
    border-bottom-color: #CC151B;
}
.filter-tab.active {
    font-weight: 700;
}

/* Thematic dossier cards */
.dossier-card {
    transition: all 300ms ease;
}
.dossier-card .dossier-bar {
    width: 0;
    transition: width 500ms ease;
}
.dossier-card:hover .dossier-bar {
    width: 100%;
}

/* Opinion/Report accent semantic classes */
.text-accent-opinion { color: #13549E; }
.border-accent-opinion\/30 { border-color: rgb(19 84 158 / 0.3); }
.text-accent-rapport { color: #88B526; }
.border-accent-rapport\/40 { border-color: rgb(136 181 38 / 0.4); }

/* ============================================
   Page Equipe - Styles custom
   ============================================ */

/* Member card with overlay reveal */
.member-card {
    position: relative;
    overflow: hidden;
    transition: transform 400ms ease, box-shadow 400ms ease;
}
.member-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
}
.member-card img {
    transition: transform 700ms ease;
}
.member-card:hover img {
    transform: scale(1.05);
}

/* Member overlay gradient */
.member-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10, 10, 10, 0.9) 0%, rgba(10, 10, 10, 0.3) 50%, transparent 100%);
    z-index: 5;
    transition: opacity 400ms ease;
}

/* Member social bar (reveal on hover) */
.member-social {
    opacity: 0;
    transform: translateY(10px);
    transition: all 350ms ease;
}
.member-card:hover .member-social {
    opacity: 1;
    transform: translateY(0);
}

/* Leader line decorative element */
.leader-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: linear-gradient(to bottom, #CC151B, transparent);
}

/* Section separator */
.section-sep {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 3rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* Manifesto quote */
.manifesto-quote {
    font-family: 'Lora', serif;
    font-style: italic;
}

/* Pole item hover indent */
.pole-item {
    transition: padding-left 300ms ease;
}
.pole-item:hover {
    padding-left: 1rem;
}

/* ============================================
   Page Contact - Styles custom
   ============================================ */

/* Contact form inputs */
.contact-form input,
.contact-form select,
.contact-form textarea {
    padding: 0.875rem;
    border: 1px solid #E5E7EB;
    font-size: 0.875rem;
    outline: none;
    border-radius: 0;
    transition: border-color 200ms ease;
    width: 100%;
    background-color: #fff;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
    border-color: #CC151B;
}
.contact-form select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
}
.contact-form label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6B7280;
    margin-bottom: 0.5rem;
    display: block;
}

/* Contact info card */
.contact-info-card {
    background-color: #1C1C1C;
    color: #fff;
}

/* Map placeholder */
.map-placeholder {
    background-color: #F4F4F4;
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ============================================
   Pagination WordPress
   ============================================ */
.nav-links {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
}
.nav-links .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid #E5E7EB;
    color: #6B7280;
    transition: all 200ms ease;
}
.nav-links .page-numbers:hover {
    border-color: #CC151B;
    color: #CC151B;
}
.nav-links .page-numbers.current {
    background-color: #CC151B;
    border-color: #CC151B;
    color: #fff;
}
.nav-links .page-numbers.dots {
    border: none;
    pointer-events: none;
}
.nav-links .prev,
.nav-links .next {
    width: auto;
    padding: 0 16px;
    font-size: 11px;
    letter-spacing: 0.1em;
}

/* ============================================
   Extra
   ============================================ */

/* Google Maps iframe responsive */
section iframe {
    width: 100%;
    height: 100%;
    border: 0;
}