/* Sales details borrowed from Apple/Tesla patterns (13 Oct 2026): sticky product bar, "from" prices on product cards,
   what-happens-next timeline beside the quote form's send button. Linked in <body> after the hero, so it never blocks first paint.
   The hero fact row (.aa-facts) is above the fold, so its CSS lives in each page's <head> styles instead. */

/* Sticky product bar (product pages): name + section links + price + quote button, under the sticky header */
.aa-pbar{position:sticky;top:68px;z-index:55;background:#fffffff0;border-bottom:1px solid #0000001a}
@supports (backdrop-filter:blur(1px)){.aa-pbar{background:#ffffffd1;backdrop-filter:saturate(1.8) blur(18px)}}
.aa-pbar-in{display:flex;align-items:center;gap:24px;max-width:var(--maxw,1440px);height:52px;margin:0 auto;padding:0 clamp(16px,3vw,40px)}
.aa-pbar-name{margin-right:auto;font-size:19px;font-weight:600;letter-spacing:-.01em;color:#1d1d1f;white-space:nowrap}
.aa-pbar-links{display:flex;gap:22px}
.aa-pbar-links a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;color:#424245;text-decoration:none;white-space:nowrap;transition:color .2s}
.aa-pbar-links a:hover{color:var(--primary,#3e6ae1)}
.aa-pbar-price{font-size:13px;color:#6e6e73;white-space:nowrap}
.aa-pbar-price b{color:#1d1d1f;font-weight:600}
.aa-pbar-btn{display:inline-flex;align-items:center;height:32px;padding:0 16px;border-radius:99px;background:var(--primary,#3e6ae1);color:#fff;font-size:13px;font-weight:500;text-decoration:none;white-space:nowrap;transition:background-color .2s}
.aa-pbar-btn:hover{background:var(--primary-hover,#2d5be3)}
.aa-pbar a:focus-visible{outline:2px solid var(--primary,#3e6ae1);outline-offset:2px;border-radius:6px}
:root:has(.aa-pbar){scroll-padding-top:136px}
/* With the product bar, scroll-padding alone sets the jump offset; zero the generic section margins so they do not stack on top of it */
:root:has(.aa-pbar) :where(section,[id]),:root:has(.aa-pbar) :is(#google-reviews,#fa-tandc){scroll-margin-top:0}
/* The floating WhatsApp button steps aside while the product bar, still resting under the hero, crosses its corner
   (aa-motion.js sets .aa-wa-off; opacity only, it comes back as soon as the bar has moved on). Package 16, 16 Oct 2026 */
:root:has(.aa-pbar) .aa-wa-btn{transition:opacity .2s,visibility .2s,transform .2s,box-shadow .2s}
.aa-wa-btn.aa-wa-off{opacity:0;visibility:hidden;pointer-events:none}
/* Tablets: the section links stay, the name goes (round three 20, 14 Oct 2026) */
@media(max-width:860px){.aa-pbar-name{display:none}.aa-pbar-links{margin-right:auto}}
/* Phones: the bottom action bar already carries "Get a quote", so the bar is just the section links, spread across one
   row that scrolls sideways if it ever runs out of room */
@media(max-width:700px){.aa-pbar{top:60px}.aa-pbar-in{height:44px;gap:0}:is(.aa-pbar-price,.aa-pbar-btn){display:none}
.aa-pbar-links{flex:1;justify-content:space-between;gap:14px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.aa-pbar-links::-webkit-scrollbar{display:none}
.aa-pbar-links a{font-size:14px}
.aa-pbar-links a:focus-visible{outline-offset:-2px}
:root:has(.aa-pbar){scroll-padding-top:116px}}

/* "From" price on product cards */
.product-card-price{margin:-6px 0 16px;font-size:14px;line-height:1.4;color:#6e6e73}
.product-card-price b{color:#1d1d1f;font-weight:600}

/* What happens next, beside the send button */
.quote-next{display:flex;flex-wrap:wrap;gap:8px 0;margin:24px 0 0;padding:0;list-style:none;font-size:13px;line-height:1.35;color:#6e6e73}
.quote-next li{display:flex;align-items:center}
.quote-next li+li::before{content:"";width:14px;height:1px;margin:0 10px;background:#c7c7cc}
.quote-next b{margin-right:4px;color:#1d1d1f;font-weight:600}
@media(max-width:900px){.quote-next{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}.quote-next li{display:block}.quote-next li+li::before{display:none}}

/* Quote card: the timeline and the no-obligation line show from step 1 (13 Oct 2026).
   Desktop: beside the form (homepage left column) or under the intro (louvre). Phones: the compact copy near Send. */
.quote-fine{margin:16px 0 0;font-size:12px;line-height:1.45;color:#6e6e73}
.quote-fine a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.quote-inner .quote-next--side{display:block;margin:32px 0 0;font-size:14px;line-height:1.4}
.quote-inner .quote-next--side li{display:flex;align-items:baseline;padding:12px 0;border-top:1px solid #00000014}
.quote-inner .quote-next--side li:last-child{border-bottom:1px solid #00000014}
.quote-inner .quote-next--side li+li::before{display:none}
.quote-inner .quote-next--side b{flex:0 0 84px;margin-right:12px}
.cta-inner .quote-next--side{justify-content:center;margin:-8px 0 0}
.cta-inner .quote-fine--side{text-align:center;margin:12px 0 0}
@media(min-width:901px){.quote-card .quote-next,:is(.quote-inner,.cta-inner) .quote-card .quote-fine{display:none}}
@media(max-width:900px){:is(.quote-inner,.cta-inner) .quote-next--side,.quote-fine--side{display:none}}
/* Sideways phones: the header scrolls away (aa-chrome.css), so the product bar sticks to the very top */
@media(max-height:500px) and (pointer:coarse){.aa-pbar{top:0}:root:has(.aa-pbar){scroll-padding-top:60px}}
