/* Page d'offre « site + fiche Google » : en-tête réduit, maquettes en appareils, appels à l'action. */
.landing-header { position: sticky; top: 0; z-index: 50; background: rgba(14, 14, 16, .82); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
.landing-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 68px; }
.landing-logo { width: 140px; height: auto; }

.offer-hero { position: relative; padding: clamp(28px, 6vw, 80px) 0 clamp(40px, 6vw, 90px); overflow: hidden; }
.offer-hero::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(var(--line) 1.2px, transparent 1.2px); background-size: 28px 28px; -webkit-mask-image: radial-gradient(ellipse at 75% 45%, #000, transparent 70%); mask-image: radial-gradient(ellipse at 75% 45%, #000, transparent 70%); pointer-events: none; }
.offer-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.offer-hero h1 { font-size: clamp(2.3rem, 1.2rem + 4.6vw, 5rem); max-width: 12ch; margin-bottom: .45em; }
.offer-hero h1 .pin-dot { display: inline-block; width: .42em; height: .52em; margin-left: .08em; vertical-align: -.02em; }
.offer-hero .section-kicker .icon { width: 1.1em; height: 1.1em; }
.offer-facts { list-style: none; padding: 0; margin: 0 0 30px; display: flex; flex-wrap: wrap; gap: 10px; }
.offer-facts li { display: inline-flex; align-items: center; gap: 8px; padding: 9px 15px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line-strong); font-weight: 600; font-size: .95rem; }
.offer-facts .icon { color: var(--accent); }
.offer-actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 920px) { .offer-hero-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .offer-actions .btn { width: 100%; } }

/* Appareils ----------------------------------------------------------- */
.offer-stage { position: relative; padding: 4% 14% 8% 0; }
.device-laptop { position: relative; }
.device-screen { position: relative; padding: 2.4% 2.4% 2.4%; background: #0B0B0D; border: 1.5px solid var(--line-strong); border-radius: 18px 18px 6px 6px; box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .9); }
.device-screen img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; border-radius: 6px; }
.device-base { height: 0; padding-bottom: 3.2%; margin: 0 -6%; background: linear-gradient(#2A2A31, #1B1B20); border-radius: 0 0 22px 22px; position: relative; }
.device-base::after { content: ""; position: absolute; left: 42%; right: 42%; top: 0; height: 30%; background: #0E0E10; border-radius: 0 0 10px 10px; }
.device-phone { position: absolute; right: 0; bottom: 0; width: 30%; padding: 2.2%; background: #0B0B0D; border: 1.5px solid var(--line-strong); border-radius: 26px; box-shadow: -20px 30px 60px -24px rgba(0, 0, 0, .9); }
.device-phone img { width: 100%; height: auto; aspect-ratio: 390 / 844; object-fit: cover; object-position: top; border-radius: 18px; }
.fc-offer { left: -2%; bottom: 2%; }
@media (max-width: 560px) { .fc-offer { font-size: .78rem; padding: 9px 12px; left: 0; bottom: -2%; } }

/* Inclus -------------------------------------------------------------- */
.offer-included { margin-top: 8px; }
.included-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px 40px; flex-wrap: wrap; margin-bottom: clamp(24px, 4vw, 44px); }
.included-head h2 { margin: 0; max-width: 14ch; font-size: clamp(1.8rem, 1.1rem + 2.6vw, 3.2rem); }
.included-price { margin: 0; font-family: var(--font-display); font-weight: 800; font-size: clamp(3rem, 2rem + 5vw, 6rem); letter-spacing: -0.05em; line-height: .95; color: var(--ink) !important; }
.included-price small { display: block; font-family: var(--font-ui); font-size: 1rem; font-weight: 600; letter-spacing: 0; color: var(--ink-muted); margin-top: 8px; }
.included-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.included-list li { grid-column: span 2; padding: 26px; border-radius: var(--r-l); background: #FFFFFF; border: 1px solid #E2DCD0; }
.included-list li.is-main { grid-column: span 3; background: var(--ink); border-color: var(--ink); }
.included-list li.is-main h3 { color: var(--cream); }
.included-list li.is-main p { color: #C9C4BA; }
.included-list h3 { font-size: 1.15rem; margin: 16px 0 8px; }
.included-list p { margin: 0; }
.inc-icon { width: 46px !important; height: 46px !important; padding: 11px; border-radius: 14px; background: var(--accent); color: var(--on-accent); }
@media (max-width: 900px) { .included-list { grid-template-columns: 1fr 1fr; } .included-list li, .included-list li.is-main { grid-column: span 1; } .included-list li.is-main { grid-column: span 2; } }
@media (max-width: 560px) { .included-list { grid-template-columns: 1fr; } .included-list li.is-main { grid-column: span 1; } }

/* Autres offres ------------------------------------------------------- */
.offer-others { padding-top: clamp(40px, 6vw, 72px); }
.offer-sub { font-size: clamp(1.25rem, 1rem + 1vw, 1.7rem); margin-bottom: 18px; }
.other-offers { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.other-offers li { display: flex; flex-direction: column; padding: 22px; border-radius: var(--r-l); background: var(--surface); border: 1px solid var(--line); transition: border-color .25s, transform .3s var(--ease); }
.other-offers li:hover { border-color: var(--line-strong); transform: translateY(-4px); }
.other-offers h3 { font-family: var(--font-ui); font-size: 1.02rem; letter-spacing: 0; margin: 0 0 6px; }
.other-offers .oo-price { font-family: var(--font-display); font-weight: 700; font-size: 1.6rem; letter-spacing: -0.04em; color: var(--accent); margin: 0 0 8px; }
.other-offers p { color: var(--muted); font-size: .93rem; }
.other-offers .more { margin-top: auto; font-size: .92rem; }
@media (max-width: 900px) { .other-offers { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .other-offers { grid-template-columns: 1fr; } }

/* Exemples ------------------------------------------------------------ */
.demo-note { max-width: 44ch; color: var(--muted); font-size: .93rem; margin: 0; }
.demo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.demo-item { margin: 0; display: flex; flex-direction: column; gap: 18px; padding: clamp(18px, 3vw, 28px); border-radius: var(--r-xl); background: var(--surface); border: 1px solid var(--line); }
.demo-devices { position: relative; padding: 0 14% 8% 0; }
.demo-devices .device-phone { width: 28%; }
.demo-item figcaption { display: flex; flex-direction: column; gap: 4px; }
.demo-item figcaption strong { font-family: var(--font-display); font-size: 1.15rem; letter-spacing: -0.02em; }
.demo-item figcaption > span:not(.demo-badge) { color: var(--muted); font-size: .95rem; }
.demo-item .more { margin-top: 6px; }
.demo-badge { align-self: flex-start; padding: 3px 10px; border-radius: 999px; border: 1px dashed var(--line-strong); color: var(--muted); font-size: .78rem; font-weight: 650; margin-bottom: 6px; }
@media (max-width: 820px) { .demo-grid { grid-template-columns: 1fr; } }

/* Fiche Google stylisée (illustration, pas une capture) ---------------- */
.demo-gbp { justify-content: space-between; }
.gbp-card { max-width: 380px; width: 100%; margin: 0 auto; border-radius: 22px; overflow: hidden; background: #FFFFFF; color: #1F1F1F; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .9); font-family: Arial, Helvetica, sans-serif; }
.gbp-map svg { display: block; width: 100%; height: 130px; }
.gbp-body { padding: 16px 18px 18px; }
.gbp-name { font-size: 20px; margin: 0 0 2px; color: #1F1F1F; }
.gbp-cat { font-size: 13px; color: #5F6368; margin: 0 0 4px; }
.gbp-open { font-size: 13px; color: #5F6368; margin: 0 0 14px; }
.gbp-open span { color: #137333; font-weight: 700; }
.gbp-actions { list-style: none; margin: 0 0 14px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.gbp-actions li { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 12px; color: #9A3A12; }
.gbp-actions .icon { width: 38px; height: 38px; padding: 9px; border-radius: 50%; background: #FDE7DD; }
.gbp-tags { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.gbp-tags li { font-size: 12px; padding: 4px 10px; border-radius: 999px; border: 1px solid #DADCE0; color: #3C4043; }
.gbp-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 12px; }
.gbp-photos span { display: grid; place-items: center; aspect-ratio: 1; border-radius: 10px; background: #F1EEE8; color: #8A857C; }
.gbp-photos span:nth-child(2) { background: #E6EEF7; }
.gbp-photos span:nth-child(3) { background: #F7E9E1; }
.gbp-photos .icon { width: 26px; height: 26px; }
.gbp-reviews { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; color: #3C4043; margin: 0; padding-top: 12px; border-top: 1px solid #E8EAED; }
.gbp-reviews .icon { color: #9A3A12; flex: none; }

/* Étapes, FAQ, demande ------------------------------------------------- */
.offer-steps, .offer-faq { padding-top: clamp(32px, 5vw, 64px); }
.steps-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) { .steps-3 { grid-template-columns: 1fr; } }
.offer-faq .faq { margin-top: 10px; max-width: 860px; }
.offer-final { padding-top: clamp(32px, 5vw, 64px); padding-bottom: clamp(48px, 7vw, 96px); }
.offer-final-box { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 56px); padding: clamp(24px, 5vw, 56px); border-radius: var(--r-xl); background: var(--accent); color: var(--on-accent); }
.offer-final-box h2 { color: var(--on-accent); font-size: clamp(2rem, 1.2rem + 3vw, 3.6rem); }
.offer-final-text p { color: rgba(14, 14, 16, .82); font-size: 1.08rem; max-width: 40ch; }
.offer-final .btn-light { --btn-bg: var(--ink); --btn-fg: var(--cream); --btn-bd: var(--ink); }
.offer-form { background: var(--bg); color: var(--text); border-radius: var(--r-l); padding: clamp(20px, 3vw, 30px); }
@media (max-width: 920px) { .offer-final-box { grid-template-columns: 1fr; } }

/* Pied de page réduit et barre mobile ------------------------------- */
.landing-footer { border-top: 1px solid var(--line); padding: 32px 0 110px; color: var(--muted); font-size: .9rem; }
.landing-footer img { margin-bottom: 14px; }
.landing-footer p { margin: 0 0 8px; }
.landing-footer a { color: var(--muted); }
.landing-footer a:hover { color: var(--text); }
.landing-legal { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .84rem; }
.landing-more { margin-left: auto; }
.sticky-cta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: none; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(14, 14, 16, .9); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid var(--line); }
.sticky-cta .btn { flex: 1; min-height: 50px; }
@media (max-width: 760px) { .sticky-cta { display: flex; } .landing-more { margin-left: 0; } }
@media (min-width: 761px) { .landing-footer { padding-bottom: 40px; } }
.landing-footer a { text-decoration: none; }
.landing-footer a:hover { text-decoration: underline; }
.js .sticky-cta { transform: translateY(110%); transition: transform .35s var(--ease); }
.js .sticky-cta.is-visible { transform: none; }
