/* Styles spécifiques aux pages — complété par les tâches 2 à 6. */

.rb-page-intro { text-align: center; max-width: 720px; margin: 0 auto var(--space-7); }

.rb-hero {
    background: linear-gradient(135deg, #01204E 0%, #023E58 30%, #028391 60%, #03A5A5 100%);
    border-radius: var(--radius-lg);
    padding: 64px 32px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
    min-height: 420px;
}
.rb-hero-eyebrow { color: var(--peach); }
.rb-hero h1 { color: #fff; font-size: clamp(32px, 5vw, 52px); line-height: 1.15; max-width: 740px; margin: 0 auto 24px; }
.rb-hero h1 em { color: var(--peach); font-style: normal; }
.rb-hero p { color: rgba(255,255,255,0.85); font-size: 17px; max-width: 560px; margin: 0 auto 36px; }
.rb-hero-preview {
    max-width: 900px;
    margin: 0 auto;
    background: #fff;
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -4px 12px rgba(0,0,0,0.08), 0 -20px 60px rgba(0,0,0,0.22);
    overflow: hidden;
    text-align: left;
}
.rb-hero-preview-bar { background: #F8F8F8; padding: 12px 16px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.rb-hero-preview-dots { display: flex; gap: 6px; }
.rb-hero-preview-dots span { width: 10px; height: 10px; border-radius: 50%; display: block; }
.rb-hero-preview-url { background: #EFEFEF; border-radius: 6px; padding: 5px 16px; font-size: 12px; color: #999; margin-left: 12px; }
.rb-hero-preview-body { padding: 24px; display: flex; gap: 16px; min-height: 200px; flex-wrap: wrap; }
.rb-hero-sidebar { width: 150px; flex-shrink: 0; border-right: 1px solid var(--line); padding-right: 16px; font-size: 12px; color: #9CA3AF; }
.rb-hero-sidebar div { padding: 6px 10px; }
.rb-hero-sidebar div.active { background: rgba(2,131,145,0.06); border-radius: 6px; color: var(--teal); font-weight: 500; }
.rb-hero-stats { flex: 1; min-width: 240px; }
.rb-hero-stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.rb-hero-stat { background: #FAFAFA; border-radius: 10px; padding: 14px; }
.rb-hero-stat .num { font-size: 22px; font-weight: 700; }
.rb-trust-bar { text-align: center; padding-block: var(--space-6); }
.rb-trust-bar-label { font-size: 13px; color: #9CA3AF; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; margin-bottom: var(--space-5); }
.rb-trust-icons { display: flex; align-items: center; justify-content: center; gap: 40px; flex-wrap: wrap; }
.rb-trust-icons > div { display: flex; align-items: center; gap: 8px; opacity: 0.4; }
.rb-feature-grid, .rb-audience-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.rb-steps-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-6); max-width: 940px; margin: 0 auto; text-align: center; }
.rb-steps-grid .rb-step-no { font-family: 'Quicksand', sans-serif; font-size: 44px; font-weight: 700; margin-bottom: var(--space-2); }
.rb-pricing-teaser-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; max-width: 1100px; margin: 0 auto; }
.rb-pricing-teaser-grid .price { font-size: 30px; font-weight: 700; }
.rb-guarantee-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 20px; max-width: 860px; margin: 0 auto; }
.rb-guarantee-item { display: flex; gap: 16px; align-items: flex-start; }
.rb-final-cta { text-align: center; }

.rb-tarifs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; max-width: 1100px; margin: 32px auto; }
.rb-tarifs-grid .price { font-size: 32px; font-weight: 700; margin-bottom: 4px; }
.rb-tarifs-grid .rb-plan-feature-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; font-size: 13px; }

.rb-compare-table { width: 100%; border-collapse: collapse; margin: 24px 0 40px; font-size: 14px; }
.rb-compare-table th, .rb-compare-table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.rb-compare-table thead th { background: var(--navy); color: #fff; }
.rb-compare-table tbody tr:first-child { background: rgba(2,131,145,0.06); }
.rb-facegrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin: 20px 0 36px; }

.rb-matrix-table { width: 100%; border-collapse: collapse; margin: 24px 0 40px; font-size: 14px; }
.rb-matrix-table th, .rb-matrix-table td { padding: 12px 14px; border-bottom: 1px solid var(--line); }
.rb-matrix-table th:first-child, .rb-matrix-table td:first-child { text-align: left; }
.rb-matrix-table thead th { background: var(--navy); color: #fff; text-align: center; }
.rb-matrix-table thead th:first-child { text-align: left; }
.rb-matrix-table tbody tr:nth-child(odd) { background: rgba(2,131,145,0.04); }
.rb-matrix-table td.rb-matrix-cell { text-align: center; }
.rb-matrix-table td.rb-matrix-roubird { background: rgba(2,131,145,0.09); font-weight: 600; }
.rb-matrix-table svg { display: inline-block; vertical-align: middle; }
.rb-matrix-legend { display: flex; gap: 20px; flex-wrap: wrap; font-size: 13px; color: var(--gray); margin-bottom: 12px; }
.rb-matrix-legend span { display: inline-flex; align-items: center; gap: 6px; }

.rb-blog-layout { display:grid; grid-template-columns: 1fr 280px; gap:32px; align-items:start; }
.rb-blog-layout .rb-blog-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.rb-blog-sidebar { display:flex; flex-direction:column; gap:20px; position:sticky; top:24px; }
.rb-blog-sidebar-box { background:#fff; border-radius:var(--radius-md); padding:20px; box-shadow:0 8px 24px rgba(1,32,78,0.06); }
.rb-blog-sidebar-box h4 { font-size:14px; margin-bottom:12px; }
.rb-blog-sidebar-box ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; font-size:13.5px; }
.rb-blog-sidebar-box .search-form { display:flex; gap:8px; }
.rb-blog-sidebar-box .search-form label { flex:1; min-width:0; display:block; }
.rb-blog-sidebar-box .search-form .search-field { width:100%; box-sizing:border-box; border:1px solid var(--line); border-radius:var(--radius-sm); padding:8px 10px; font-family:inherit; }
.rb-blog-sidebar-box .search-form .search-submit { border:none; background:var(--teal); color:#fff; border-radius:var(--radius-sm); padding:8px 12px; font-family:inherit; cursor:pointer; flex-shrink:0; }
@media (max-width: 900px) {
    .rb-blog-layout { grid-template-columns: 1fr; }
    .rb-blog-sidebar { position:static; }
}

.rb-blog-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.rb-blog-card { border-radius: var(--radius-md); overflow: hidden; box-shadow: 0 12px 30px rgba(1,32,78,0.1); background: #fff; }
.rb-blog-card img { aspect-ratio: 16/10; object-fit: cover; }
.rb-blog-card-body { padding: var(--space-4); }
.rb-blog-card-body .cat { color: var(--teal); font-size: 12px; font-weight: 600; text-transform: uppercase; }
.rb-blog-card-body h2 { font-size: 18px; margin: var(--space-2) 0; }
.rb-blog-card-body .date { font-size: 12px; color: var(--gray); }
.pagination .nav-links { display: flex; justify-content: center; gap: 20px; margin-top: var(--space-6); font-weight: 600; }
.pagination .nav-links .current { color: var(--navy); }

.rb-contact-layout { display:grid; grid-template-columns: 1fr 260px; gap:40px; align-items:start; }
.rb-contact-form { display:flex; flex-direction:column; gap:16px; }
.rb-contact-form label { display:flex; flex-direction:column; gap:6px; font-size:13.5px; font-weight:600; color:var(--navy); }
.rb-contact-form input[type="text"], .rb-contact-form input[type="email"], .rb-contact-form textarea { font-family:inherit; font-size:14.5px; font-weight:400; color:#1a1a1a; border:1px solid var(--line); border-radius:var(--radius-sm); padding:11px 14px; resize:vertical; }
.rb-contact-form input:focus, .rb-contact-form textarea:focus { outline:2px solid var(--teal); outline-offset:1px; }
.rb-contact-form button { align-self:flex-start; border:none; cursor:pointer; margin-top:6px; }
.rb-form-honeypot { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.rb-contact-notice { border-radius:var(--radius-sm); padding:12px 16px; font-size:14px; margin-bottom:20px; }
.rb-contact-notice--ok { background:rgba(2,131,145,0.1); color:var(--teal); }
.rb-contact-notice--error { background:rgba(248,85,37,0.1); color:var(--orange); }
@media (max-width: 720px) {
    .rb-contact-layout { grid-template-columns: 1fr; }
}
.rank-math-block { display:flex; flex-direction:column; gap:16px; }
.rank-math-block .rank-math-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; }
.rank-math-block .rank-math-list-item { background:#fff; border-radius:var(--radius-md); padding:22px 26px; box-shadow:0 8px 24px rgba(1,32,78,0.06); }
.rank-math-block .rank-math-question { font-size:17px; margin:0; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.rank-math-block .rank-math-question::after { content:'+'; font-size:22px; font-weight:400; color:var(--teal); flex-shrink:0; transition:transform 0.2s ease; }
.rank-math-block .rank-math-list-item.is-open .rank-math-question::after { transform:rotate(45deg); }
.rank-math-block .rank-math-answer { overflow:hidden; max-height:0; transition:max-height 0.3s ease; }
.rank-math-block .rank-math-list-item.is-open .rank-math-answer { margin-top:14px; }
.rank-math-block .rank-math-answer p { font-size:14.5px; color:var(--gray); margin:0; }
.rb-band--navy .rank-math-answer p, .rb-band--dark .rank-math-answer p { color:rgba(255,255,255,0.85); }

.rb-solutions-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:20px; }
.rb-solutions-card { display:flex; flex-direction:column; text-decoration:none; color:inherit; position:relative; }
.rb-solutions-read { margin-top:auto; padding-top:14px; color:var(--teal); font-weight:600; font-size:13.5px; }
.rb-badge-soon { position:absolute; top:20px; right:20px; background:var(--peach); color:var(--navy); font-size:11px; font-weight:700; letter-spacing:0.5px; text-transform:uppercase; padding:4px 10px; border-radius:999px; }

.rb-single-meta { font-size: 13px; color: var(--gray); margin-bottom: var(--space-5); display: flex; align-items: center; gap: 8px; }
.rb-single-meta-dot { color: var(--peach); }
.rb-single-article img.rb-featured { width: 100%; border-radius: var(--radius-md); margin-bottom: var(--space-5); box-shadow: 0 16px 40px rgba(1,32,78,0.14); }
.rb-answer-block { background: #fff; border-left: 4px solid var(--teal); border-radius: 4px 14px 14px 4px; padding: 18px 22px; margin: 20px 0 32px; box-shadow: 0 1px 8px rgba(0,0,0,0.03); }
.rb-pull { font-family: 'Quicksand', sans-serif; font-style: italic; font-size: 19px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 16px 0; margin: 24px 0; }