/* Website offers share the homepage's type, colour and spacing tokens. */
.pp-offers [hidden], .pp-delivery [hidden] { display: none !important; }
.pp-explorer__tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.pp-explorer__tabs button { display: flex; align-items: center; gap: 12px; min-height: 78px; padding: 20px 24px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--soft-sage); font: 500 var(--type-body-large)/1.3 var(--ui); cursor: pointer; transition: color .2s, background .2s, border-color .2s; }
.pp-explorer__tabs button:hover { background: color-mix(in srgb, var(--quantum-teal) 8%, transparent); color: var(--human-parchment); }
.pp-explorer__tabs button[aria-selected="true"] { color: var(--accent-text); border-bottom-color: var(--accent-text); background: color-mix(in srgb, var(--quantum-teal) 10%, transparent); }
.pp-explorer__number { font-size: 12px; font-variant-numeric: tabular-nums; }
.pp-explorer__tabs svg { width: 18px; height: 18px; margin-left: auto; opacity: .5; }
.pp-explorer__tabs [aria-selected="true"] svg { opacity: 1; transform: rotate(45deg); }
.pp-explorer__panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 90px); align-items: center; padding-block: 52px 24px; }
.pp-explorer__panel + .pp-explorer__panel { border-top: 1px solid var(--line); }
.is-enhanced .pp-explorer__panel { border-top: 0; }
.pp-explorer__visual { position: relative; min-height: 480px; display: grid; place-items: center; overflow: hidden; isolation: isolate; border-radius: 50% 50% 16px 16px; background: radial-gradient(ellipse at 50% 55%, color-mix(in srgb, var(--quantum-teal) 20%, transparent), transparent 65%); }
.pp-explorer__art { display: block; position: relative; width: min(100%, 580px); height: auto; filter: drop-shadow(0 28px 20px rgba(16, 61, 51, .12)); }
.pp-explorer__art-float { position: relative; display: grid; place-items: center; width: min(100%, 580px); }
/* A separate wrapper keeps the bounce independent of GSAP's image entrance. */
@keyframes pp-art-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(var(--pp-art-lift, -18px)); }
}
@media (prefers-reduced-motion: no-preference) {
    .pp-explorer__panel:not([hidden]) .pp-explorer__art-float {
        animation: pp-art-bounce 3.2s ease-in-out infinite;
    }
}
.pp-explorer__orbit { position: absolute; width: 84%; aspect-ratio: 1; border: 1px solid color-mix(in srgb, var(--accent-text) 18%, transparent); border-radius: 50%; transform: rotate(-30deg); }
.pp-explorer__orbit::before { content: ''; position: absolute; width: 10px; height: 10px; border-radius: 50%; top: 15%; left: 13%; background: var(--accent-text); }
.pp-explorer__art-number { position: absolute; top: 12%; left: 9%; color: var(--accent-text); font: 500 14px/1 var(--ui); }
.pp-explorer__signal { position: absolute; bottom: 18px; display: flex; align-items: center; gap: 10px; padding: 12px 18px; border: 1px solid var(--line); border-radius: 30px; background: var(--neural-ink); color: var(--human-parchment); font: 500 var(--type-small)/1.5 var(--ui); }
.pp-explorer__signal > span { width: 7px; height: 7px; border-radius: 50%; background: var(--accent-text); }
.pp-explorer__copy { min-width: 0; }
.pp-explorer__copy > .ds-eyebrow { margin-bottom: 14px; }
.pp-explorer__intro { max-width: 42ch; margin: 18px 0 26px; }
.pp-feature { border-top: 1px solid var(--line); }
.pp-feature:last-child { border-bottom: 1px solid var(--line); }
.pp-feature summary { display: flex; align-items: center; gap: 12px; padding: 16px 0; min-height: 54px; color: var(--human-parchment); font: 500 var(--type-body)/1.4 var(--ui); cursor: pointer; list-style: none; }
.pp-feature summary::-webkit-details-marker, .pp-care-option summary::-webkit-details-marker { display: none; }
.pp-feature[open] summary { color: var(--accent-text); }
.pp-feature p { margin: 0; padding: 0 32px 20px 0; max-width: 55ch; }
.pp-feature__optional { margin-left: auto; color: var(--soft-sage); font-size: 12px; font-weight: 400; }
.pp-disclosure-icon { width: 18px; height: 18px; position: relative; flex: 0 0 18px; margin-left: auto; }
.pp-disclosure-icon::before, .pp-disclosure-icon::after { content: ''; position: absolute; background: currentColor; top: 8px; left: 3px; width: 12px; height: 1.5px; transition: transform .2s; }
.pp-disclosure-icon::after { transform: rotate(90deg); }
details[open] > summary .pp-disclosure-icon::after { transform: rotate(0); }
.pp-explorer__action { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 28px; }
.pp-explorer__action > span, .pp-explorer__scope, .pp-offers__note { color: var(--soft-sage); }
.pp-explorer__scope { margin: 18px 0 0; max-width: 55ch; }
.pp-offers__note { margin: 30px 0 0; padding-top: 24px; border-top: 1px solid var(--line); text-align: center; }
.pp-offers__note a { color: var(--accent-text); display: inline-flex; gap: 5px; align-items: center; }
.pp-offers__note svg, .pp-maintenance svg, .pp-reading svg { width: 18px; height: 18px; }
.pp-maintenance { background: color-mix(in srgb, var(--cognitive-graphite) 55%, var(--neural-ink)); }
.pp-maintenance__layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 8vw, 140px); }
.pp-maintenance__intro > p.ds-body { margin: 24px 0; max-width: 36ch; }
.pp-maintenance .ds-text-link, .pp-reading .ds-text-link { display: inline-flex; align-items: center; gap: 10px; }
.pp-care-option { border-top: 1px solid var(--line); }
.pp-care-option:last-child { border-bottom: 1px solid var(--line); }
.pp-care-option summary { display: grid; grid-template-columns: 28px minmax(0, 1fr) 18px; align-items: center; gap: 16px; list-style: none; padding: 27px 0; cursor: pointer; }
.pp-care-option summary:hover, .pp-care-option[open] summary { color: var(--accent-text); }
.pp-care-option__number { color: var(--accent-text); align-self: start; padding-top: 4px; }
.pp-care-option__for { display: block; color: var(--soft-sage); margin-top: 10px; max-width: 46ch; }
.pp-care-option__body { padding: 0 0 28px 44px; }
.pp-care-option__body ul { margin: 0 0 24px; padding-left: 18px; }
.pp-care-option__body li + li { margin-top: 8px; }
.pp-care-option__action { display: flex; flex-direction: column; align-items: start; gap: 12px; }
.pp-care-option__action > span { color: var(--soft-sage); }
.pp-steps { max-width: 1100px; margin-inline: auto; }
.pp-steps__nav { position: relative; isolation: isolate; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; padding: 0; margin: 0; }
.pp-steps__nav li { position: relative; }
.pp-steps__nav li:not(:last-child)::after { content: ''; position: absolute; height: 1px; width: 100%; left: 50%; top: 25px; background: var(--line); z-index: -1; }
.pp-steps__nav h3 { margin: 0; }
.pp-steps__nav button { display: flex; flex-direction: column; align-items: center; gap: 16px; width: 100%; padding: 0 4px 8px; border: 0; background: transparent; color: var(--soft-sage); font: 500 var(--type-body)/1.4 var(--ui); cursor: pointer; }
.pp-steps__dot { display: grid; place-items: center; height: 50px; width: 50px; border: 1px solid var(--line); border-radius: 50%; background: var(--neural-ink); font-size: 13px; transition: background .25s, color .25s, border-color .25s; }
.pp-steps__nav [aria-selected="true"] { color: var(--accent-text); }
.pp-steps__nav [aria-selected="true"] .pp-steps__dot { color: var(--on-accent); background: var(--quantum-teal); border-color: var(--quantum-teal); }
.pp-steps__nav button:hover .pp-steps__dot { border-color: var(--accent-text); }
.pp-steps__panel { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 40px; align-items: center; min-height: 230px; padding: 38px 48px; margin-top: 36px; background: color-mix(in srgb, var(--quantum-teal) 7%, var(--neural-ink)); border-radius: 16px; }
.pp-steps__index { font: 500 clamp(64px, 7vw, 100px)/1 var(--display); letter-spacing: -.06em; color: var(--accent-text); }
.pp-steps__panel .ds-intro { margin: 0; max-width: 48ch; }
.pp-steps__output { color: var(--accent-text); margin: 18px 0 0; }
.is-enhanced .pp-steps__label { display: none; }
.pp-reading__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 6vw, 100px); }
.pp-reading__image { margin: 0; border-radius: 16px; overflow: hidden; }
.pp-reading__image img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; transition: transform .6s; }
.pp-reading__layout:hover img { transform: scale(1.035); }
.pp-reading__copy > .ds-body { margin: 24px 0; max-width: 45ch; }
.pp-explorer :is(button, summary):focus-visible, .pp-maintenance summary:focus-visible, .pp-steps button:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 4px; border-radius: 3px; }
.pp-explorer [role="tabpanel"]:focus-visible, .pp-steps [role="tabpanel"]:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 8px; }
@media (max-width: 1050px) {
    .pp-explorer__panel { gap: 28px; }
    .pp-explorer__visual { min-height: 360px; }
    .pp-explorer__tabs button { padding-inline: 16px; }
    .pp-explorer__signal { font-size: 12px; padding-inline: 12px; }
    .pp-maintenance__layout { gap: 40px; }
}
@media (max-width: 760px) {
    .pp-explorer__tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pp-explorer__tabs button { min-height: 58px; padding: 15px 12px; font-size: 16px; }
    .pp-explorer__panel { grid-template-columns: 1fr; padding-top: 20px; gap: 28px; }
    .pp-explorer__visual { min-height: 0; height: 260px; border-radius: 16px; }
    .pp-explorer__art { width: 260px; }
    .pp-explorer__art-float { --pp-art-lift: -10px; }
    .pp-explorer__orbit { width: 230px; }
    .pp-explorer__art-number { left: 12%; top: 15%; }
    .pp-explorer__signal { bottom: 4px; }
    .pp-explorer__intro { margin-bottom: 22px; }
    .pp-explorer__action { align-items: start; flex-direction: column; gap: 12px; }
    .pp-explorer__scope { margin-top: 16px; }
    .pp-offers__note { text-align: left; }
    .pp-maintenance__layout, .pp-reading__layout { grid-template-columns: 1fr; }
    .pp-care-option summary { gap: 12px; grid-template-columns: 22px minmax(0, 1fr) 18px; padding-block: 24px; }
    .pp-care-option__body { padding-left: 34px; }
    .pp-steps__nav button { font-size: 12px; gap: 12px; }
    .pp-steps__dot { width: 42px; height: 42px; font-size: 12px; }
    .pp-steps__nav li:not(:last-child)::after { top: 21px; }
    .pp-steps__panel { grid-template-columns: 48px minmax(0, 1fr); padding: 24px 20px; gap: 18px; align-items: start; min-height: 265px; margin-top: 24px; }
    .pp-steps__index { font-size: 48px; }
    .pp-reading__image img { aspect-ratio: 16/10; }
}
@media (prefers-reduced-motion: reduce) {
    .pp-offers *, .pp-maintenance *, .pp-delivery *, .pp-reading * { transition: none !important; }
    .pp-reading__layout:hover img { transform: none; }
}