/* Price section styles copied from the current home page, scoped to this section. */
#offre {font-size:16px;line-height:normal}

#offre .wrap {width: min(1280px, 100% - 100px); margin: auto;}
#offre .label {font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.13em; line-height: 1.6;}
#offre h2, #offre h3, #offre p {margin: 0px;}
#offre h2 {font-size: clamp(46px, 5.3vw, 76px); font-weight: 500; line-height: 1.02; letter-spacing: -0.055em;}
#offre h2 em {font-family: var(--serif); font-weight: 400; letter-spacing: -0.025em;}
#offre p {line-height: 1.6;}
#offre .btn {display: inline-flex; align-items: center; justify-content: space-between; gap: 36px; padding: 19px 25px; background: var(--deep); color: white; text-decoration: none; border: 1px solid var(--deep); border-radius: 5px; font-size: 15px; font-weight: 700; transition: background 0.2s, transform 0.2s;}
#offre .btn:hover {background: var(--ink); transform: translateY(-2px);}
#offre .steps {margin-top: 25px;}
#offre .step {padding: 18px 0px; border-top: 1px solid rgba(36, 78, 56, 0.208); display: flex; gap: 20px; align-items: flex-start;}
#offre .step > span {font-family: var(--serif); font-style: italic; font-size: 23px; line-height: 1.25;}
#offre .step p {font-size: 14px;}
#offre .step strong {font-weight: 800;}
#offre {padding: 90px 0px; background: rgb(233, 238, 230); border-top: 1px solid var(--line);}
#offre .offer-grid {display: grid; grid-template-columns: 1.2fr 1fr; gap: 100px;}
#offre h2 {margin-top: 23px;}
#offre .offer-intro {font-size: 17px; color: var(--muted); margin-top: 25px; max-width: 440px;}
#offre .price-card {padding: 38px 40px; background: var(--paper); border: 1px solid rgb(203, 216, 199);}
#offre .price-top {display: flex; justify-content: space-between; align-items: center;}
#offre .price {font-size: 90px; letter-spacing: -0.07em; font-weight: 500; line-height: 1; margin: 28px 0px 12px;}
#offre .price span {font-size: 18px; letter-spacing: -0.03em; color: var(--muted);}
#offre .price-card .price {margin-bottom: 30px;}
#offre .price-card .btn {width: 100%;}
@media (max-width: 1100px) {
#offre .wrap {width: calc(100% - 64px);}
#offre .offer-grid {gap: 50px;}
}
@media (max-width: 800px) {
#offre .wrap {width: calc(100% - 40px);}
#offre {padding: 65px 0px;}
#offre .offer-grid {grid-template-columns: 1fr; gap: 35px;}
#offre .offer-intro {max-width: 600px;}
#offre .price-card {max-width: 600px; width: 100%;}
}
@media (max-width: 420px) {
#offre .price-card {padding: 28px 25px;}
#offre .price {font-size: 80px;}
}
#offre h2, #offre h3 {text-wrap: balance;}
#offre p {text-wrap: pretty;}
#offre .offer-grid > div {min-width: 0px;}
@media (prefers-reduced-motion: no-preference) {
#offre .btn, #offre .price-card {transition: transform 0.3s, translate 0.3s, box-shadow 0.3s, background 0.3s, border-color 0.3s, color 0.3s;}
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
#offre .btn:hover > span {transform: translate(3px, -3px);}
}
#offre .guarantee {display: flex; align-items: center; gap: 17px; margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line);}
#offre .guarantee-mark {flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 61px; height: 68px; border: 1px solid rgb(155, 179, 153); border-radius: 30px 30px 9px 9px; color: var(--deep); font-family: var(--serif); font-size: 30px; line-height: 1;}
#offre .guarantee-mark span {font-family: var(--sans); font-size: 10px; letter-spacing: 0.05em; margin-top: 3px;}
#offre .guarantee strong {font-size: 14px; color: var(--deep);}
#offre .guarantee p {font-size: 12px; line-height: 1.5; margin-top: 6px; color: var(--muted);}
#offre .btn {justify-content: center;}
#offre .btn {max-width: 100%; min-height: 44px; white-space: normal; overflow-wrap: break-word; text-wrap-style: balance;}
@media (max-width: 800px) {
#offre .price {font-size: clamp(60px, 15vw, 84px);}
}
@media (max-width: 540px) {
#offre h2 {font-size: clamp(34px, 9.6vw, 48px);}
#offre .price-card {padding: 28px 22px;}
#offre .guarantee {gap: 13px;}
#offre .guarantee p {font-size: 13px;}
}
@media (max-width: 360px) {
#offre .wrap {width: calc(100% - 32px);}
#offre .guarantee-mark {width: 52px; height: 62px;}
#offre .price {font-size: 62px;}
#offre .price span {font-size: 16px;}
}
@media (hover: none) {
#offre .btn:hover {transform: none; box-shadow: none;}
}
#offre .onboarding {margin-top: 36px; max-width: 500px;}
#offre .onboarding h3 {font-size: 23px; line-height: 1.2; text-wrap: balance;}
#offre .onboarding .steps {margin-top: 18px;}
#offre .offer-grid {align-items: start;}
@media (min-width: 801px) {
#offre .price-card {position: sticky; top: 120px; align-self: start;}
}
#offre .step p {font-size: 17px; line-height: 1.65;}
#offre .step {padding: 22px 0px;}
#offre .step > span {flex-shrink: 0;}
#offre .guarantee p {font-size: 15px; line-height: 1.6;}
#offre .guarantee strong {font-size: 18px; line-height: 1.5;}
@media (max-width: 600px) {
#offre .step p {font-size: 16px;}
#offre .step {gap: 14px; padding: 20px 0px;}
}