diff --git a/contact.html b/contact.html index b67a084..7a589a8 100644 --- a/contact.html +++ b/contact.html @@ -211,23 +211,23 @@ - - -
-

- Rappel tarifaire -

- -
+ +
+

+ Rappel tarifaire +

+ +
+
diff --git a/css/style.css b/css/style.css index 28638a6..9e53f93 100644 --- a/css/style.css +++ b/css/style.css @@ -680,6 +680,57 @@ p { .step-card { z-index: 1; } } +/* --- Rappel tarifaire (page Contact, bloc centré) --- */ +.price-reminder { + max-width: 720px; + margin: var(--space-xxl) auto 0; + background: var(--light-gray); + border-radius: var(--radius-md); + padding: var(--space-lg) var(--space-xl); + border-left: 4px solid var(--gold); + box-shadow: 0 4px 16px rgba(26, 26, 62, 0.05); +} + +.price-reminder h4 { + display: flex; + align-items: center; + justify-content: center; + gap: 10px; + margin-bottom: var(--space-md); + color: var(--navy); + font-size: 1.15rem; +} + +.price-reminder ul { + list-style: none; + padding: 0; + margin: 0; + display: grid; + grid-template-columns: 1fr; + gap: 8px; + font-size: 0.95rem; + color: var(--text-light); +} + +.price-reminder ul li { + display: flex; + align-items: center; + gap: 10px; + padding: 4px 0; +} + +.price-reminder ul li i { + color: var(--green); + flex-shrink: 0; +} + +@media (min-width: 600px) { + .price-reminder ul { + grid-template-columns: 1fr 1fr; + column-gap: var(--space-xl); + } +} + /* --- About section preview --- */ .about-preview { display: grid;