/*
 * Collect MD — inner pages.
 * Loaded on every page except the homepage. Uses the homepage tokens from collectmd.css
 * (--ink, --white, --accent, --font, .display, .eyebrow, .button, .wrap, .logo).
 * Scroll effects are switched on by class names from the Collect MD block patterns.
 */

.collectmd-inner { --pad-x: 4.5vw; --sec-y: clamp(90px, 12vw, 170px); --line: rgba(245, 248, 239, .14); }
.collectmd-inner .cursor-glow { left: 0; top: 0; will-change: transform; }
.cmp-main { position: relative; display: block; }
.cmp-main :focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 4px; }
.cmp-main img { max-width: 100%; height: auto; }

/* ---------------------------------------------------------------- Hero
 * Breadcrumb + page name only. Same ink as the page — no panel, no image. */
.cmp-hero { padding: clamp(150px, 21vh, 220px) 0 clamp(48px, 6vw, 90px); border-bottom: 1px solid var(--line); }
.cmp-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; font: 500 10px/1.4 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; color: #9ba49e; }
.cmp-crumbs ol::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 15px var(--accent); margin-right: 4px; }
.cmp-crumbs li { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.cmp-crumbs li + li::before { content: '/'; color: #56605a; }
.cmp-crumbs a { color: #c7ccc3; transition: color .25s; }
.cmp-crumbs a:hover { color: var(--accent); }
.cmp-crumbs [aria-current] { color: var(--white); max-width: 46ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmp-title { margin-top: 34px; font-size: clamp(54px, 10.4vw, 176px); line-height: .84; text-transform: uppercase; overflow-wrap: anywhere; hyphens: auto; }
.cmp-title__clip { display: block; overflow: hidden; padding-bottom: .1em; }
.cmp-title__text { display: block; animation: cmpRise 1.35s cubic-bezier(.16, 1, .3, 1) .08s both; }
.cmp-hero__meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 26px; font: 500 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; color: #9ba49e; animation: cmpFade .9s ease .55s both; }
.cmp-hero__meta p { margin: 0; text-transform: none; letter-spacing: 0; font: 400 17px/1.7 Manrope, Arial, sans-serif; color: #c9d1ca; max-width: 60ch; }
@keyframes cmpRise { from { transform: translate3d(0, 106%, 0); } to { transform: none; } }
@keyframes cmpFade { from { opacity: 0; transform: translate3d(0, 14px, 0); } to { opacity: 1; transform: none; } }

/* ---------------------------------------------------------------- Prose (any normal page / post content) */
.cmp-content { padding: clamp(60px, 8vw, 110px) 0 0; }
.cmp-content:has(> .cmp-section:first-child) { padding-top: 0; }
.cmp-content > :where(:not(.cmp-section):not(.cmp-scene):not(.alignfull):not(.alignwide)) { width: min(760px, calc(100% - 42px)); margin-left: auto; margin-right: auto; }
.cmp-content > .alignwide { width: min(1180px, calc(100% - 42px)); margin-left: auto; margin-right: auto; }
.cmp-content > .alignfull { width: 100%; }
.cmp-content > :where(:not(.cmp-section):not(.cmp-scene)) + :where(:not(.cmp-section):not(.cmp-scene)) { margin-top: 1.4em; }
.cmp-content > :where(:not(.cmp-section):not(.cmp-scene)):last-child { margin-bottom: clamp(70px, 9vw, 130px); }
:where(.cmp-content) :where(p, li) { font-size: 18px; line-height: 1.75; color: #c9d1ca; }
:where(.cmp-content) :where(h2, h3, h4) { font-family: var(--font); color: var(--white); letter-spacing: -.045em; line-height: 1.02; margin-top: 2em; margin-bottom: .5em; }
.cmp-content > :where(h2) { font-size: clamp(32px, 4vw, 54px); }
.cmp-content > :where(h3) { font-size: clamp(24px, 2.6vw, 34px); }
:where(.cmp-content) :where(p a, li a, td a) { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
:where(.cmp-content) :where(strong) { color: var(--white); }
:where(.cmp-content) :where(blockquote) { margin-left: auto; margin-right: auto; padding: 6px 0 6px 28px; border-left: 2px solid var(--accent); font: 600 clamp(22px, 2.4vw, 30px)/1.3 var(--font); letter-spacing: -.03em; color: var(--white); }
:where(.cmp-content) :where(blockquote p) { font: inherit; color: inherit; }
:where(.cmp-content) :where(code, kbd) { font: 14px 'DM Mono', monospace; background: #172120; border: 1px solid var(--line); border-radius: 6px; padding: 2px 6px; }
:where(.cmp-content) :where(pre) { overflow-x: auto; background: #111a1b; border: 1px solid var(--line); border-radius: 14px; padding: 22px; }
:where(.cmp-content) :where(table) { width: 100%; border-collapse: collapse; font-size: 15px; }
:where(.cmp-content) :where(th, td) { border-bottom: 1px solid var(--line); padding: 12px 10px; text-align: left; }
:where(.cmp-content) :where(figure) { margin-left: auto; margin-right: auto; }
:where(.cmp-content) :where(figcaption) { font: 500 10px 'DM Mono', monospace; letter-spacing: .1em; text-transform: uppercase; color: #9ba49e; margin-top: 10px; }
:where(.cmp-content) :where(img) { border-radius: 16px; }
:where(.cmp-content) :where(hr) { border: 0; border-top: 1px solid var(--line); margin: 3em auto; }
.cmp-content .wp-block-table { overflow-x: auto; }

/* Core buttons → the homepage pill button */
.cmp-main .wp-block-button__link { display: inline-flex; align-items: center; gap: 22px; padding: 17px 24px; border-radius: 80px; background: var(--accent); color: var(--ink); font: 800 12px Manrope, Arial, sans-serif; letter-spacing: .02em; text-decoration: none; transition: transform .3s, background .3s; }
.cmp-main .wp-block-button__link:hover { transform: translateY(-4px); background: #e6ffae; }
.cmp-main .is-style-outline .wp-block-button__link { background: transparent; color: var(--white); border: 1px solid #6f756d; }

/* ---------------------------------------------------------------- Chapters (pattern sections) */
.cmp-main .cmp-section { position: relative; margin: 0; padding: var(--sec-y) 0; }
.cmp-main .cmp-section > * { width: min(1460px, calc(100% - 9vw)); margin-left: auto; margin-right: auto; }
.cmp-main .cmp-section > * + * { margin-top: 0; }
.cmp-main .cmp-section em { font-style: normal; color: var(--accent); }
.cmp-main .cmp-section .eyebrow { margin: 0 auto 34px; }
.cmp-main .cmp-h2 { font-size: clamp(52px, 7.4vw, 132px); text-transform: uppercase; margin-bottom: 0; }
.cmp-main .cmp-section + .cmp-section:not(.cmp-band):not(.cmp-paper) { border-top: 1px solid var(--line); }
.cmp-main .cmp-band + .cmp-section, .cmp-main .cmp-paper + .cmp-section { border-top: 0; }

/* Statement — words light up as you scroll */
.cmp-main .cmp-words { margin-top: 0; max-width: 1250px; font: 700 clamp(34px, 5.1vw, 86px)/1.03 var(--font); letter-spacing: -.055em; color: var(--white); }
.cmp-js .cmp-words .cmp-w { color: #2c3532; transition: color .45s ease; }
.cmp-js .cmp-words .cmp-w.is-lit { color: var(--white); }

/* Marquee band — same treatment as the homepage marquee */
.cmp-main .cmp-band { padding: 21px 0; background: var(--accent); color: var(--ink); overflow: hidden; }
.cmp-main .cmp-band > .cmp-marquee { width: max-content; max-width: none; margin: 0; display: flex; white-space: nowrap; font: 700 clamp(23px, 3.7vw, 54px)/1.1 var(--font); letter-spacing: -.05em; }
.cmp-marquee > span { padding-right: 42px; }
.cmp-js .cmp-marquee.is-running { animation: cmpMarquee 26s linear infinite; }
@keyframes cmpMarquee { to { transform: translate3d(-50%, 0, 0); } }

/* Horizontal story — pinned on desktop, swipeable on touch */
.cmp-main .cmp-hscroll { padding: var(--sec-y) 0; }
.cmp-main .cmp-hscroll > .cmp-hscroll__stick { width: 100%; }
.cmp-hscroll__head { width: min(1460px, calc(100% - 9vw)); margin: 0 auto clamp(40px, 6vh, 70px); }
.cmp-main .cmp-hscroll__track { display: flex; gap: clamp(16px, 2vw, 28px); width: auto; margin: 0; padding: 0 var(--pad-x) 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.cmp-hscroll__track::-webkit-scrollbar { display: none; }
.cmp-main .cmp-panel { position: relative; flex: 0 0 min(80vw, 520px); min-height: min(56vh, 440px); margin: 0; padding: clamp(26px, 3vw, 40px); display: flex; flex-direction: column; justify-content: flex-end; border: 1px solid var(--line); border-radius: 26px; background: linear-gradient(160deg, #142021 0%, #0c1214 70%); overflow: hidden; scroll-snap-align: start; }
.cmp-panel::before { content: ''; position: absolute; right: -18%; top: -26%; width: 70%; aspect-ratio: 1; border-radius: 50%; border: 1px solid #c4fb5b36; box-shadow: inset 0 0 80px #c4fb5b0d; }
.cmp-panel::after { content: ''; position: absolute; right: 8%; top: 9%; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 18px var(--accent); }
.cmp-main .cmp-panel h3 { margin: 0 0 18px; font: 700 clamp(30px, 3.3vw, 54px)/.97 var(--font); letter-spacing: -.055em; color: var(--white); }
.cmp-main .cmp-panel p { margin: 0; max-width: 40ch; font-size: 16px; line-height: 1.7; color: #bfc8c1; }
.cmp-hscroll.is-pinned { padding: 0; }
.cmp-hscroll.is-pinned .cmp-hscroll__stick { position: sticky; top: 0; height: 100vh; height: 100svh; display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
.cmp-hscroll.is-pinned .cmp-hscroll__track { width: max-content; overflow: visible; will-change: transform; scroll-snap-type: none; }
.cmp-hscroll.is-pinned .cmp-hscroll__stick::after { content: ''; position: absolute; left: var(--pad-x); bottom: 7%; width: 150px; height: 2px; background: linear-gradient(90deg, var(--accent) calc(var(--p, 0) * 100%), #ffffff3a 0); }

/* Light chapter (mirrors the homepage "Great care" chapter) */
.cmp-main .cmp-paper { background: var(--white); color: var(--ink); overflow: hidden; }
.cmp-main .cmp-paper .eyebrow { color: #37463d; }
.cmp-main .cmp-paper .cmp-h2 { color: var(--ink); }
.cmp-main .cmp-trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 3vw, 48px); margin-top: clamp(60px, 7vw, 100px); }
.cmp-main .cmp-trio > .wp-block-column { margin: 0; padding-top: 26px; border-top: 1px solid #10171a33; }
.cmp-main .cmp-trio h3 { margin: 0 0 14px; font: 700 clamp(24px, 2.2vw, 32px)/1.05 var(--font); letter-spacing: -.045em; color: var(--ink); }
.cmp-main .cmp-trio p { margin: 0; font-size: 16px; line-height: 1.7; color: #455147; }
.cmp-drift { transform: translate3d(calc((.5 - var(--p, .5)) * 14vw), 0, 0); will-change: transform; }

/* Scaling statement */
.cmp-main .cmp-scale-wrap { min-height: 100vh; min-height: 100svh; display: grid; place-content: center; text-align: center; overflow: hidden; }
.cmp-main .cmp-scale { font-size: clamp(60px, 11vw, 200px); text-transform: uppercase; transform: scale(calc(.84 + var(--p, .5) * .32)); will-change: transform; }
.cmp-main .cmp-scale__copy { max-width: 520px; margin-top: 46px; font-size: 18px; line-height: 1.75; color: #c9d1ca; }

/* Stacking service cards */
.cmp-main .cmp-stack__intro { margin-bottom: clamp(50px, 7vw, 90px); }
.cmp-main .cmp-stack__intro > p:last-child { max-width: 460px; margin-top: 34px; color: #bfc8c1; font-size: 16px; line-height: 1.75; }
.cmp-main .cmp-stack { display: grid; gap: 6vh; padding-bottom: 4vh; }
.cmp-main .cmp-stack__card { --bg: #131c1d; --fg: var(--white); --soft: #bfc8c1; position: sticky; top: calc(96px + var(--i, 0) * 20px); min-height: min(66vh, 560px); margin: 0; padding: clamp(26px, 4vw, 58px); display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto 1fr auto; gap: 26px clamp(24px, 4vw, 70px); border-radius: 30px; border: 1px solid var(--line); background: var(--bg); color: var(--fg); transform: scale(var(--s, 1)); transform-origin: 50% 0; box-shadow: 0 -20px 60px #0007; overflow: hidden; }
.cmp-stack__card::after { content: ''; position: absolute; inset: 0; background: #05080a; opacity: var(--dim, 0); pointer-events: none; border-radius: inherit; }
.cmp-main .cmp-stack__card:nth-child(5n+2) { --bg: var(--white); --fg: var(--ink); --soft: #455147; border-color: transparent; }
.cmp-main .cmp-stack__card:nth-child(5n+3) { --bg: var(--accent); --fg: var(--ink); --soft: #2b3a1c; border-color: transparent; }
.cmp-main .cmp-stack__card:nth-child(5n+4) { --bg: #1b2725; }
.cmp-main .cmp-stack__card:nth-child(5n+5) { --bg: #e3e9dc; --fg: var(--ink); --soft: #455147; border-color: transparent; }
.cmp-main .cmp-stack__card > * { margin: 0; }
.cmp-main .cmp-stack__num { grid-column: 1 / -1; font: 500 10px 'DM Mono', monospace; letter-spacing: .13em; color: var(--soft); }
.cmp-main .cmp-stack__card h3 { grid-column: 1 / -1; align-self: center; font: 700 clamp(42px, 6.4vw, 112px)/.9 var(--font); letter-spacing: -.07em; text-transform: uppercase; color: var(--fg); max-width: 12ch; }
.cmp-main .cmp-stack__card p:not(.cmp-stack__num) { align-self: end; font-size: clamp(16px, 1.4vw, 20px); line-height: 1.6; color: var(--fg); max-width: 42ch; }
.cmp-main .cmp-stack__card .cmp-stack__incl { font-size: 14px; color: var(--soft); padding-top: 16px; border-top: 1px solid currentColor; border-top-color: color-mix(in srgb, var(--fg) 22%, transparent); }

/* Scroll-drawn timeline */
.cmp-main .cmp-timeline__head { margin-bottom: clamp(60px, 8vw, 110px); }
.cmp-main .cmp-timeline { --tl-pad: clamp(46px, 9vw, 150px); --tl-line: clamp(10px, 3vw, 52px); position: relative; padding-left: var(--tl-pad); }
.cmp-timeline::before, .cmp-timeline::after { content: ''; position: absolute; left: var(--tl-line); top: 8px; bottom: 0; width: 2px; background: var(--line); }
.cmp-timeline::after { background: var(--accent); box-shadow: 0 0 14px #c4fb5b88; transform: scaleY(var(--p, 1)); transform-origin: 50% 0; }
.cmp-main .cmp-step { position: relative; margin: 0; padding-bottom: clamp(60px, 9vh, 120px); max-width: 820px; transition: opacity .5s ease; }
.cmp-main .cmp-step:last-child { padding-bottom: 0; }
.cmp-step::before { content: ''; position: absolute; z-index: 1; left: calc(var(--tl-line) - var(--tl-pad) - 6px); top: 6px; width: 14px; height: 14px; border-radius: 50%; background: var(--ink); border: 2px solid #56605a; transition: background .4s, border-color .4s, box-shadow .4s; }
.cmp-js .cmp-step { opacity: .3; }
.cmp-js .cmp-step.is-on { opacity: 1; }
.cmp-step.is-on::before { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 7px #c4fb5b22, 0 0 22px var(--accent); }
.cmp-main .cmp-step > * { margin: 0; }
.cmp-main .cmp-step__when { font: 500 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; color: var(--accent); }
.cmp-main .cmp-step h3 { margin-top: 12px; font: 700 clamp(40px, 5.4vw, 92px)/.92 var(--font); letter-spacing: -.065em; text-transform: uppercase; color: var(--white); }
.cmp-main .cmp-step h3 + p { margin-top: 18px; max-width: 48ch; font-size: 17px; line-height: 1.75; color: #bfc8c1; }

/* Questions */
.cmp-main .cmp-faq__cols { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(40px, 6vw, 110px); }
.cmp-main .cmp-faq__cols > .wp-block-column { margin: 0; }
.cmp-main .cmp-faq__item { border-top: 1px solid var(--line); padding: 0; margin: 0; }
.cmp-main .cmp-faq__item:last-of-type { border-bottom: 1px solid var(--line); }
.cmp-faq__item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 26px 0; font: 600 clamp(19px, 1.8vw, 25px)/1.2 var(--font); letter-spacing: -.035em; color: var(--white); }
.cmp-faq__item summary::-webkit-details-marker { display: none; }
.cmp-faq__item summary::after { content: '+'; flex: 0 0 38px; height: 38px; display: grid; place-items: center; border: 1px solid #ffffff40; border-radius: 50%; font: 400 22px/1 Manrope, Arial, sans-serif; color: var(--accent); transition: transform .35s, background .35s, color .35s; }
.cmp-faq__item[open] summary::after { transform: rotate(45deg); background: var(--accent); color: var(--ink); }
.cmp-faq__item summary:hover { color: var(--accent); }
.cmp-main .cmp-faq__item p { margin: 0 0 26px; max-width: 58ch; font-size: 16px; line-height: 1.75; color: #bfc8c1; }
.cmp-main .cmp-faq .wp-block-buttons { margin-top: 36px; }

/* Contact */
.cmp-main .cmp-contact__cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 110px); align-items: start; }
.cmp-main .cmp-contact__cols > .wp-block-column { margin: 0; }
.cmp-main .cmp-contact .cmp-h2 { font-size: clamp(50px, 6.4vw, 112px); }
.cmp-main .cmp-contact .cmp-h2 + p { margin-top: 34px; max-width: 46ch; font-size: 17px; line-height: 1.75; color: #bfc8c1; }
.cmp-main .cmp-contact__details { margin-top: 46px; display: grid; grid-template-columns: auto 1fr; gap: 14px 30px; padding-top: 28px; border-top: 1px solid var(--line); }
.cmp-main .cmp-contact__details p { margin: 0; font-size: 15px; color: var(--white); }
.cmp-main .cmp-contact__details .cmp-contact__label { font: 500 10px/2.2 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; color: #9ba49e; }

.cmp-form { position: relative; padding: clamp(24px, 3vw, 42px); border: 1px solid var(--line); border-radius: 26px; background: linear-gradient(170deg, #131d1e, #0d1416); scroll-margin-top: 110px; }
.cmp-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.cmp-form label { display: grid; gap: 9px; min-width: 0; }
.cmp-form label > span { font: 500 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; color: #9ba49e; }
.cmp-form__full { grid-column: 1 / -1; }
.cmp-form :is(input, select, textarea) { width: 100%; min-height: 52px; padding: 14px 16px; border: 1px solid #ffffff2e; border-radius: 14px; background: #0a1012; color: var(--white); font-size: 16px; transition: border-color .25s, box-shadow .25s; }
.cmp-form textarea { min-height: 140px; resize: vertical; line-height: 1.6; }
.cmp-form select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--accent) 50%), linear-gradient(135deg, var(--accent) 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 44px; }
.cmp-form :is(input, select, textarea):focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px #c4fb5b26; }
.cmp-form :is(input, textarea):user-invalid { border-color: #ff9280; }
.cmp-form__privacy { margin: 20px 0 22px; font-size: 13px; line-height: 1.6; color: #9ba49e; }
.cmp-form .button { border: 0; }
.cmp-form__notice { margin: 0 0 22px; padding: 14px 18px; border-radius: 14px; font-size: 15px; line-height: 1.5; border: 1px solid #ff928066; background: #ff92801a; color: #ffd8d0; }
.cmp-form__notice--sent { border-color: #c4fb5b66; background: #c4fb5b1a; color: #e9ffc2; }
.cmp-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------------------------------------------------------------- Listings, single posts, search, 404 */
.cmp-list { padding: clamp(60px, 7vw, 100px) 0 clamp(80px, 9vw, 140px); }
.cmp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: clamp(16px, 2vw, 28px); }
.cmp-card { margin: 0; }
.cmp-card__link { height: 100%; display: flex; flex-direction: column; gap: 14px; padding: 18px 18px 26px; border: 1px solid var(--line); border-radius: 24px; background: #0d1416; transition: border-color .3s, transform .3s; }
.cmp-card__link:hover { border-color: #c4fb5b80; transform: translateY(-4px); }
.cmp-card__media { display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 16px; background: #172120; }
.cmp-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.16, 1, .3, 1); }
.cmp-card__link:hover .cmp-card__media img { transform: scale(1.04); }
.cmp-card__meta { display: flex; gap: 16px; color: #9ba49e; padding: 8px 8px 0; }
.cmp-card__title { margin: 0; padding: 0 8px; font: 700 clamp(24px, 2.2vw, 30px)/1.05 var(--font); letter-spacing: -.045em; color: var(--white); }
.cmp-card__excerpt { padding: 0 8px; font-size: 15px; line-height: 1.65; color: #bfc8c1; }
.cmp-card__more { margin-top: auto; padding: 8px 8px 0; color: var(--accent); }
.cmp-list .navigation.pagination { margin-top: 60px; }
.cmp-list .nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.cmp-list .page-numbers { min-width: 46px; height: 46px; padding: 0 16px; display: inline-grid; place-items: center; border: 1px solid #ffffff35; border-radius: 40px; font: 500 11px 'DM Mono', monospace; letter-spacing: .1em; }
.cmp-list .page-numbers.current, .cmp-list a.page-numbers:hover { background: var(--accent); border-color: var(--accent); color: var(--ink); }

.search-form { display: flex; gap: 10px; max-width: 620px; }
.search-form label { flex: 1; }
.search-form .search-field { width: 100%; min-height: 54px; padding: 14px 20px; border: 1px solid #ffffff35; border-radius: 40px; background: #0a1012; color: var(--white); font-size: 16px; }
.search-form .search-field:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px #c4fb5b26; }
.search-form .search-submit { min-height: 54px; padding: 0 24px; border: 0; border-radius: 40px; background: var(--accent); color: var(--ink); font-weight: 800; font-size: 12px; }
.cmp-search { margin-bottom: 50px; }
.cmp-empty { padding: clamp(60px, 8vw, 120px) 0 clamp(80px, 10vw, 150px); }
.cmp-empty h2 { font-size: clamp(42px, 6vw, 96px); text-transform: uppercase; max-width: 14ch; }
.cmp-empty p { max-width: 52ch; margin: 26px 0 30px; font-size: 17px; line-height: 1.75; color: #bfc8c1; }

.cmp-feature { margin: clamp(40px, 5vw, 70px) auto 0; }
.cmp-feature img { width: 100%; max-height: 74vh; object-fit: cover; border-radius: 26px; }
.cmp-post-foot { padding: 40px 0 clamp(70px, 9vw, 120px); max-width: 760px; }
.cmp-tags { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 0 0 40px; }
.cmp-tags a { display: inline-block; padding: 8px 14px; border: 1px solid #ffffff35; border-radius: 30px; font: 500 10px 'DM Mono', monospace; letter-spacing: .1em; text-transform: uppercase; }
.cmp-tags a:hover { border-color: var(--accent); color: var(--accent); }
.cmp-post-foot .nav-links { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cmp-post-foot .nav-links a { display: grid; gap: 8px; height: 100%; padding: 20px; border: 1px solid var(--line); border-radius: 18px; }
.cmp-post-foot .nav-links a:hover { border-color: #c4fb5b80; }
.cmp-post-foot .nav-links .mono { color: #9ba49e; }
.cmp-post-foot .nav-links b { font: 600 18px/1.2 var(--font); letter-spacing: -.03em; }
.cmp-post-foot .nav-next { text-align: right; }

.cmp-comments { max-width: 760px; padding-bottom: clamp(70px, 9vw, 120px); }
.cmp-comments__title { font: 700 32px var(--font); letter-spacing: -.045em; }
.cmp-comment-list { list-style: none; padding: 0; }
.cmp-comment-list .comment-body { padding: 22px 0; border-bottom: 1px solid var(--line); }
.cmp-comment-list .avatar { border-radius: 50%; vertical-align: middle; margin-right: 10px; }
.cmp-comments :is(input[type=text], input[type=email], input[type=url], textarea) { width: 100%; padding: 14px 16px; border: 1px solid #ffffff2e; border-radius: 14px; background: #0a1012; color: var(--white); }
.cmp-comments label { display: block; margin-bottom: 8px; font: 500 10px 'DM Mono', monospace; letter-spacing: .12em; text-transform: uppercase; color: #9ba49e; }
.cmp-comments .button { border: 0; }
.cmp-pages { display: flex; gap: 8px; margin-top: 40px; font: 500 11px 'DM Mono', monospace; }

/* ---------------------------------------------------------------- Closing chapter + footer */
.cmp-closer { padding: var(--sec-y) 0 0; border-top: 1px solid var(--line); overflow: hidden; }
.cmp-closer__title { margin-top: 30px; font-size: clamp(56px, 10vw, 180px); text-transform: uppercase; }
.cmp-closer__title span { color: var(--accent); }
.cmp-closer__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 30px; margin-top: clamp(50px, 6vw, 80px); }
.cmp-closer__row p { max-width: 460px; margin: 0; font-size: 17px; line-height: 1.75; color: #bfc8c1; }
.cmp-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 22px 40px; margin-top: clamp(80px, 10vw, 140px); padding: 34px 0 40px; border-top: 1px solid var(--line); font-size: 12px; color: #9ba49e; }
.cmp-footer__menu { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 26px; margin: 0; padding: 0; }
.cmp-footer__menu a, .cmp-footer__top { font: 500 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; color: #c7ccc3; }
.cmp-footer__menu a:hover, .cmp-footer__top:hover { color: var(--accent); }

.single .cmp-title, .search .cmp-title { font-size: clamp(42px, 6.6vw, 112px); line-height: .9; }

/* Current page in the header */
.collectmd-inner .nav-mid a.is-current { color: var(--accent); }
.collectmd-inner .cmd-drawer-links a[aria-current] { color: var(--accent); }


/* ================================================================ Pinned scenes (recreated homepage chapters)
 * pages.js sets --p (0→1 scroll progress) on .cmp-scene and toggles .is-active / .is-on.
 * Everything else below is pure CSS math on --p. */
.cmp-scene { position: relative; margin: 0; color: var(--white); }
.cmp-scene__stick { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
.cmp-claims { height: 430vh; background: #0b1114; }
.cmp-pipe { height: 470vh; }
.cmp-pay { height: 440vh; background: radial-gradient(circle at 60% 55%, #17251d 0%, #090d12 60%); }
.cmp-scene .eyebrow { margin: 0; }
.cmp-scene h2, .cmp-scene h3, .cmp-scene p { margin: 0; }
.cmp-scene__items { display: grid; }
.cmp-scene__item { grid-area: 1 / 1; opacity: 0; transform: translate3d(0, 26px, 0); transition: opacity .45s ease, transform .7s cubic-bezier(.16, 1, .3, 1); }
.cmp-scene__item.is-active { opacity: 1; transform: none; }
.cmp-swap { display: none; }
.cmp-swap.is-active { display: inline; }
.cmp-scene__meter { width: 150px; height: 2px; background: #ffffff3a; }
.cmp-scene__meter i { display: block; height: 100%; width: calc(var(--p, 0) * 100%); background: var(--accent); }
.cmp-scene__count { color: #aebcae; }
.cmp-scene__stick::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .12; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.11' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* --- The claim and its four frictions */
.cmp-claims .cmp-scene__copy { position: absolute; z-index: 3; left: var(--pad-x); top: 13%; width: min(40%, 560px); display: grid; gap: 28px; }
.cmp-claims .cmp-scene__item h2 { font-size: clamp(52px, 5.8vw, 106px); text-transform: uppercase; line-height: .9; }
.cmp-claims .cmp-scene__item p { margin-top: 26px; max-width: 430px; font-size: 15px; line-height: 1.8; color: #bfc8c1; }
.cmp-claims .cmp-scene__visual { position: absolute; right: 4%; top: 13%; width: 56%; height: 74%; display: grid; place-items: center; }
.cmp-radar { position: absolute; width: min(92%, 640px); aspect-ratio: 1; border-radius: 50%; border: 1px solid #a8ff6130; background: radial-gradient(circle, #b2ff4310, transparent 65%); transform: rotate(calc(var(--p, 0) * 70deg)) scale(calc(1 + var(--p, 0) * .35)); }
.cmp-radar::after { content: ''; position: absolute; inset: 16%; border: 1px dashed #a6d07833; border-radius: 50%; }
.cmp-claim { position: relative; z-index: 2; width: min(54%, 400px); padding: 32px; border-radius: 11px; background: #ecf2e8; color: #102018; box-shadow: 0 50px 100px #0008; transform: rotate(calc(-8deg + var(--p, 0) * 22deg)) scale(calc(1 - var(--p, 0) * .16)); }
.cmp-claim__top { display: flex; justify-content: space-between; align-items: center; padding-bottom: 20px; border-bottom: 1px solid #34423530; }
.cmp-claim__top b { font-size: 21px; letter-spacing: -.07em; }
.cmp-claim__top b span { color: #5a8446; }
.cmp-claim__top .cmd-medical-mark { width: .7em; height: .7em; vertical-align: super; }
.cmp-claim__top small { font-size: 9px; color: #526454; }
.cmp-claim__label { margin: 35px 0 6px; font-size: 10px; color: #506554; }
.cmp-claim__value { font: 700 clamp(40px, 4vw, 57px)/1 var(--font); letter-spacing: -.08em; }
.cmp-claim__value span { color: #8da38f; font-size: .4em; }
.cmp-claim__line { display: flex; justify-content: space-between; gap: 12px; margin-top: 12px; padding: 13px 0; border-bottom: 1px solid #1727162a; font-size: 11px; }
.cmp-claim__line > span { color: #6e7c71; }
.cmp-claim__pill { display: inline-block; margin-top: 22px; padding: 8px 11px; border-radius: 40px; background: #e6d9c7; color: #7c3b26; font-size: 9px; }
.cmp-alert { --q: clamp(0, calc((var(--p, 0) - var(--a) * .21) * 5), 1); --dir: 1; position: absolute; z-index: 4; display: flex; gap: 14px; align-items: center; max-width: 260px; padding: 17px; border-radius: 12px; border: 1px solid #ff8e805c; background: #191e21e8; box-shadow: 0 16px 45px #0008; opacity: var(--q); transform: scale(calc(.6 + var(--q) * .4)) rotate(calc((1 - var(--q)) * 12deg * var(--dir))); }
.cmp-alert:nth-of-type(odd) { --dir: -1; }
.cmp-alert__icon { flex: 0 0 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; background: #fc82731d; color: #ff9280; font-size: 18px; }
.cmp-alert b { font-size: 12px; }
.cmp-alert p { margin-top: 6px !important; font-size: 10px; line-height: 1.4; color: #a7b2ae; }
.cmp-alert--0 { top: 8%; left: 1%; } .cmp-alert--1 { top: 30%; right: 0; } .cmp-alert--2 { bottom: 12%; left: 2%; } .cmp-alert--3 { bottom: 6%; right: 8%; }
.cmp-scene__caption { position: absolute; right: 5%; bottom: 4%; z-index: 5; color: #8d9a90; }

/* --- The five-step pipeline */
.cmp-pipe .cmp-scene__stick { display: flex; flex-direction: column; justify-content: center; gap: clamp(30px, 6vh, 70px); padding: 90px var(--pad-x) 40px; }
.cmp-pipe__top { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.cmp-pipe__rail { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); align-items: center; }
.cmp-pipe__line, .cmp-pipe__fill { position: absolute; left: 10%; top: 55px; height: 2px; }
.cmp-pipe__line { right: 10%; background: #ffffff22; }
.cmp-pipe__fill { width: calc(var(--p, 0) * 80%); background: var(--accent); box-shadow: 0 0 16px var(--accent); }
.cmp-node { position: relative; z-index: 1; display: grid; justify-items: center; gap: 16px; color: #6f7a73; transition: color .4s, transform .5s cubic-bezier(.16, 1, .3, 1); }
.cmp-node svg { width: 110px; height: 110px; padding: 30px; border-radius: 50%; border: 1px solid #ffffff2a; background: #0c1315; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: border-color .4s, box-shadow .4s, background .4s; }
.cmp-node strong { font: 500 11px 'DM Mono', monospace; letter-spacing: .16em; }
.cmp-node.is-on { color: var(--accent); }
.cmp-node.is-on svg { border-color: #c4fb5b88; }
.cmp-node.is-current { transform: translateY(-10px) scale(1.12); }
.cmp-node.is-current svg { background: #142012; box-shadow: 0 0 0 8px #c4fb5b14, 0 0 40px #c4fb5b55; }
.cmp-pipe__copy { max-width: 820px; }
.cmp-pipe__copy .mono { color: var(--accent); }
.cmp-pipe__copy h3 { margin-top: 16px; font: 700 clamp(34px, 4.4vw, 74px)/.95 var(--font); letter-spacing: -.06em; }
.cmp-pipe__copy p { margin-top: 20px; max-width: 54ch; font-size: 17px; line-height: 1.75; color: #bfc8c1; }

/* --- The moving payment */
.cmp-pay__top { position: absolute; z-index: 4; top: 120px; left: var(--pad-x); right: var(--pad-x); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 18px; }
.cmp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cmp-chips span { padding: 9px 14px; border: 1px solid #ffffff2e; border-radius: 40px; color: #8d9a90; transition: background .4s, color .4s, border-color .4s; }
.cmp-chips span.is-on { background: var(--accent); border-color: var(--accent); color: var(--ink); }
.cmp-pay__world { --e: clamp(0, calc(var(--p, 0) * 4), 1); --ci: clamp(0, calc((var(--p, 0) - .06) * 6), 1); --t: clamp(0, calc((var(--p, 0) - .27) * 4), 1); --s: clamp(0, calc((var(--p, 0) - .68) * 5), 1); position: absolute; left: 50%; top: 56%; width: min(960px, 92vw); height: min(540px, 62vh); transform: translate(-50%, -50%); }
.cmp-pay__halo { position: absolute; left: 50%; top: 50%; width: min(560px, 70vw); aspect-ratio: 1; border-radius: 50%; border: 1px dashed #c4fb5b40; box-shadow: inset 0 0 120px #c4fb5b10; transform: translate(-50%, -50%) rotate(calc(var(--p, 0) * 100deg)) scale(calc(1 + var(--p, 0) * .25)); }
.cmp-phone { position: absolute; right: 12%; top: 50%; width: 250px; height: 500px; padding: 12px; border-radius: 38px; background: #10191a; border: 1px solid #ffffff2a; box-shadow: 0 40px 90px #000a; opacity: calc(.3 + var(--e) * .7); transform: translateY(calc(-50% + 100px - var(--e) * 150px)) rotate(calc(9deg - var(--p, 0) * 10deg)) scale(calc(.8 + var(--e) * .25)); }
.cmp-phone__screen { height: 100%; padding: 22px 18px; border-radius: 28px; background: linear-gradient(180deg, #0c1414, #111d1c); display: flex; flex-direction: column; gap: 10px; font-size: 10px; }
.cmp-phone__line { display: flex; justify-content: space-between; font-size: 9px; letter-spacing: .1em; }
.cmp-phone__line span { color: var(--accent); }
.cmp-phone__label { margin-top: 16px; color: #8d9a90; font-size: 8px; }
.cmp-phone__amount { font: 700 34px/1 var(--font); letter-spacing: -.06em; color: var(--accent); font-variant-numeric: tabular-nums; }
.cmp-phone__acct { color: #8d9a90; font-size: 9px; }
.cmp-phone__chart { display: flex; align-items: end; gap: 6px; height: 90px; margin: 8px 0; }
.cmp-phone__chart i { flex: 1; height: var(--h); border-radius: 4px 4px 0 0; background: linear-gradient(180deg, var(--accent), #c4fb5b22); }
.cmp-phone__row { display: flex; justify-content: space-between; padding: 8px 0; border-top: 1px solid #ffffff14; font-size: 9px; color: #aebcae; }
.cmp-phone__row b { color: var(--white); font-size: 8px; letter-spacing: .08em; }
.cmp-phone__btn { margin-top: auto; padding: 12px; border-radius: 30px; background: var(--accent); color: var(--ink); text-align: center; font-size: 9px; font-weight: 800; }
.cmp-paycard { position: absolute; left: 12%; top: 50%; width: 300px; height: 188px; padding: 22px; border-radius: 18px; background: linear-gradient(135deg, #dfff9c, #9bd43a 55%, #5d8a2a); color: #102018; display: flex; flex-direction: column; justify-content: space-between; box-shadow: 0 30px 70px #0009; opacity: calc(.2 + var(--ci) * .8); transform: translate(calc(-180px + var(--ci) * 220px + var(--t) * 160px), calc(-50% - var(--t) * 80px)) rotate(calc(-30deg + var(--t) * 30deg)) scale(calc(.78 + var(--ci) * .2 - var(--s) * .11)); }
.cmp-paycard__top { display: flex; justify-content: space-between; font: 700 12px var(--font); letter-spacing: .04em; }
.cmp-paycard__top .cmd-medical-mark { width: 16px; height: 16px; }
.cmp-paycard__chip { width: 44px; height: 32px; border-radius: 7px; background: linear-gradient(135deg, #f4f0c8, #c5b468); }
.cmp-paycard__bottom { display: flex; justify-content: space-between; align-items: end; font: 500 14px 'DM Mono', monospace; }
.cmp-paycard__bottom small { font-size: 7px; text-align: right; line-height: 1.3; }
.cmp-coin { position: absolute; left: 36%; top: 50%; width: 58px; height: 58px; margin-top: -29px; display: grid; place-items: center; border-radius: 50%; background: var(--accent); color: var(--ink); font: 700 26px var(--font); box-shadow: 0 0 40px #c4fb5b99; opacity: calc(clamp(0, calc((var(--p, 0) - .27) * 15), 1) * (1 - var(--s))); transform: translate(calc(-110px + var(--t) * 360px), calc(100px - var(--t) * (1 - var(--t)) * 620px)) scale(calc(.6 + var(--t) * .5)); }
.cmp-pay__beam { position: absolute; left: 30%; right: 32%; top: 50%; height: 2px; background: linear-gradient(90deg, transparent, var(--accent), transparent); transform-origin: 0 50%; opacity: calc(clamp(0, calc((var(--p, 0) - .34) * 12), 1) * (1 - var(--s))); transform: scaleX(calc(.2 + var(--t))); }
.cmp-toast { position: absolute; left: 50%; bottom: 2%; z-index: 3; display: flex; gap: 14px; align-items: center; padding: 16px 22px 16px 16px; border-radius: 16px; background: #ecf2e8; color: #102018; box-shadow: 0 30px 60px #0009; white-space: nowrap; opacity: var(--s); transform: translate(-50%, calc(60px - var(--s) * 60px)) scale(calc(.8 + var(--s) * .2)); }
.cmp-toast__check { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--accent); font-weight: 800; }
.cmp-toast strong { display: block; font: 700 12px var(--font); letter-spacing: .06em; }
.cmp-toast span { font-size: 11px; color: #526454; }
.cmp-pay__foot { position: absolute; z-index: 4; left: var(--pad-x); bottom: 6%; display: grid; gap: 12px; }
.cmp-pay__foot .cmp-scene__item { font: 600 clamp(18px, 1.8vw, 24px)/1.2 var(--font); letter-spacing: -.03em; }

/* No JS or reduced motion: scenes become normal, fully visible sections */
html:not(.cmp-js) .cmp-scene, .cmp-scene.is-static { height: auto; }
html:not(.cmp-js) .cmp-scene__stick, .cmp-scene.is-static .cmp-scene__stick { position: relative; height: auto; min-height: 100svh; padding-bottom: 60px; }
html:not(.cmp-js) .cmp-scene__item, .cmp-scene.is-static .cmp-scene__item { grid-area: auto; opacity: 1; transform: none; margin-bottom: 28px; }
html:not(.cmp-js) .cmp-swap[data-step^="0"] { display: inline; }
.cmp-scene.is-static .cmp-scene__copy { position: relative; left: auto; top: auto; width: auto; padding: 120px var(--pad-x) 0; }
.cmp-scene.is-static .cmp-scene__visual { position: relative; right: auto; top: auto; width: 100%; height: 70vh; }

/* ================================================================ Friction tiles */
.cmp-main .cmp-tiles__head { margin-bottom: clamp(50px, 6vw, 80px); }
.cmp-main .cmp-tiles__head > p:last-child { max-width: 520px; margin-top: 30px; font-size: 16px; line-height: 1.75; color: #bfc8c1; }
.cmp-main .cmp-grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 1.6vw, 22px); }
.cmp-main .cmp-tile { margin: 0; padding: clamp(24px, 2.4vw, 32px); display: flex; flex-direction: column; gap: 16px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(170deg, #121b1c, #0b1214); transition: border-color .3s, transform .3s; }
.cmp-main .cmp-tile:hover { border-color: #ff928066; transform: translateY(-4px); }
.cmp-main .cmp-tile > * { margin: 0; }
.cmp-main .cmp-tile__tag { display: inline-flex; align-items: center; gap: 10px; font: 500 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; color: #ff9280; }
.cmp-main .cmp-tile__tag::before { content: '!'; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: #fc82731d; font: 700 13px Manrope, sans-serif; }
.cmp-main .cmp-tile h3 { font: 700 clamp(24px, 2vw, 30px)/1.02 var(--font); letter-spacing: -.045em; color: var(--white); }
.cmp-main .cmp-tile p { font-size: 15px; line-height: 1.7; color: #bfc8c1; }
.cmp-main .cmp-tile .cmp-tile__signs { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--line); font-size: 13px; color: #9ba49e; }

/* ================================================================ Lime break ("That's where we come in") */
.cmp-main .cmp-break { min-height: 100vh; min-height: 100svh; display: grid; place-content: center; justify-items: center; text-align: center; background: var(--accent); color: var(--ink); overflow: hidden; }
.cmp-main .cmp-break > * { width: auto; }
.cmp-main .cmp-break .cmp-scale { font-size: clamp(70px, 11.5vw, 200px); color: var(--ink); }
.cmp-main .cmp-break .cmp-break__copy { max-width: 520px; margin: 40px auto 0; font-size: 17px; line-height: 1.7; color: #2b3a1c; }
.cmp-main .cmp-break .wp-block-buttons { justify-content: center; margin-top: 34px; }
.cmp-main .cmp-break .wp-block-button__link { background: var(--ink); color: var(--accent); }
.cmp-main .cmp-break .wp-block-button__link:hover { background: #1c2a22; }

/* ================================================================ Next chapter */
.cmp-next { border-top: 1px solid var(--line); }
.cmp-next__link { display: block; padding: clamp(80px, 10vw, 150px) 0; }
.cmp-next__link .eyebrow { margin-bottom: 26px; }
.cmp-next__title { display: block; font-size: clamp(54px, 9.4vw, 168px); text-transform: uppercase; transition: color .35s; }
.cmp-next__title b { color: var(--accent); font-weight: 400; display: inline-block; transition: transform .45s cubic-bezier(.16, 1, .3, 1); }
.cmp-next__link:hover .cmp-next__title { color: var(--accent); }
.cmp-next__link:hover .cmp-next__title b { transform: translate(10px, -10px); }
.nav .nav-cta[aria-current] { background: var(--accent); color: var(--ink); border-color: var(--accent); }

@media (max-width: 1000px) {
	.cmp-main .cmp-grid4 { grid-template-columns: repeat(2, 1fr); }
	.cmp-phone { right: 2%; }
	.cmp-paycard { left: 2%; }
}
@media (max-width: 800px) {
	.cmp-claims .cmp-scene__copy { left: 21px; right: 21px; top: 96px; width: auto; gap: 16px; }
	.cmp-claims .cmp-scene__item h2 { font-size: clamp(38px, 11vw, 60px); }
	.cmp-claims .cmp-scene__item p { margin-top: 14px; font-size: 14px; line-height: 1.6; }
	.cmp-claims .cmp-scene__visual { left: 0; right: 0; top: auto; bottom: 3%; width: 100%; height: 50%; }
	.cmp-claim { width: 60%; padding: 18px; }
	.cmp-claim__label { margin-top: 16px; }
	.cmp-claim__line { margin-top: 4px; padding: 8px 0; font-size: 9px; }
	.cmp-claim__pill { margin-top: 12px; }
	.cmp-alert { max-width: 168px; padding: 10px; gap: 9px; }
	.cmp-alert__icon { flex-basis: 24px; height: 24px; font-size: 13px; }
	.cmp-alert b { font-size: 10px; } .cmp-alert p { font-size: 9px; }
	.cmp-scene__caption { display: none; }
	.cmp-claims .cmp-scene__meter, .cmp-claims .cmp-scene__count { display: none; }
	.cmp-pipe .cmp-scene__stick { padding-top: 100px; gap: 34px; }
	.cmp-pipe__line, .cmp-pipe__fill { top: 27px; }
	.cmp-node svg { width: 54px; height: 54px; padding: 13px; }
	.cmp-node strong { font-size: 8px; letter-spacing: .08em; }
	.cmp-pipe__copy h3 { font-size: clamp(30px, 8.6vw, 44px); }
	.cmp-pipe__copy p { font-size: 15px; }
	.cmp-pay__top { top: 92px; left: 21px; right: 21px; }
	.cmp-chips span { padding: 6px 9px; font-size: 8px; }
	.cmp-pay__world { top: 55%; width: 640px; transform: translate(-50%, -50%) scale(.56); }
	.cmp-pay__foot { left: 21px; right: 21px; bottom: 4%; }
}
@media (max-width: 600px) {
	.cmp-main .cmp-grid4 { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.cmp-scene__item, .cmp-node, .cmp-tile, .cmp-next__title b { transition: none; }
}

/* ---------------------------------------------------------------- Responsive */
@media (max-width: 1000px) {
	.cmp-main .cmp-trio { grid-template-columns: 1fr; }
	.cmp-main .cmp-faq__cols, .cmp-main .cmp-contact__cols { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
	.collectmd-inner { --pad-x: 21px; }
	.cmp-main .cmp-section > *, .cmp-hscroll__head { width: calc(100% - 42px); }
	.cmp-hero { padding-top: 130px; }
	.cmp-title { margin-top: 26px; }
	.cmp-crumbs [aria-current] { max-width: 26ch; }
	.cmp-main .cmp-stack__card { grid-template-columns: 1fr; top: calc(84px + var(--i, 0) * 12px); min-height: 0; padding: 26px 22px; gap: 18px; }
	.cmp-main .cmp-stack__card h3 { padding: 30px 0 10px; }
	.cmp-form__grid { grid-template-columns: 1fr; }
	.cmp-post-foot .nav-links { grid-template-columns: 1fr; }
	.cmp-post-foot .nav-next { text-align: left; }
	.search-form { flex-direction: column; }
	.cmp-footer { flex-direction: column; align-items: flex-start; }
}

/* ---------------------------------------------------------------- Reduced motion: everything readable, nothing moves */
@media (prefers-reduced-motion: reduce) {
	.cmp-title__text, .cmp-hero__meta { animation: none; }
	.cmp-js .cmp-words .cmp-w { color: var(--white); transition: none; }
	.cmp-js .cmp-marquee.is-running { animation: none; }
	.cmp-drift, .cmp-main .cmp-scale, .cmp-main .cmp-stack__card { transform: none; }
	.cmp-stack__card::after { opacity: 0; }
	.cmp-js .cmp-step { opacity: 1; }
	.cmp-timeline::after { transform: none; }
	.cmp-card__link, .cmp-card__media img, .cmp-main .wp-block-button__link { transition: none; }
}

/* Tuning */
.cmp-next__title.cmp-drift { transform: translate3d(calc((1 - var(--p, 1)) * 10vw), 0, 0); }
@media (min-width: 801px) { .cmp-claims .cmp-scene__visual { right: 2%; width: 52%; } }
@media (min-width: 801px) {
	.cmp-pipe .cmp-scene__stick { gap: clamp(40px, 8vh, 90px); }
	.cmp-node svg { width: clamp(96px, 9vw, 136px); height: clamp(96px, 9vw, 136px); padding: clamp(26px, 2.6vw, 38px); }
	.cmp-pipe__line, .cmp-pipe__fill { top: clamp(48px, 4.5vw, 68px); }
	.cmp-pipe__copy { max-width: 980px; }
	.cmp-pipe__copy h3 { font-size: clamp(40px, 5.4vw, 92px); text-transform: uppercase; line-height: .9; }
	.cmp-pipe__copy p { font-size: 18px; }
}
.cmp-main .cmp-band .cmp-marquee { color: var(--ink); }
.cmp-main .cmp-toast strong { color: #102018; }
.cmp-main .cmp-scene strong, .cmp-main .cmp-claim b { color: inherit; }

/* ================================================================ Light chapters (balance: dark / light / dark)
 * Add the class "cmp-light" to any Collect MD section group to switch it to the light tone. */
.cmp-main .cmp-light { --soft-ink: #455147; --green: #44701c; background: var(--white); color: var(--ink); }
.cmp-main .cmp-light .eyebrow { color: #37463d; }
.cmp-main .cmp-light :is(h2, h3, .cmp-h2) { color: var(--ink); }
.cmp-main .cmp-light p { color: var(--soft-ink); }
.cmp-main .cmp-light em { color: var(--green); }
.cmp-main .cmp-section + .cmp-light, .cmp-main .cmp-light + .cmp-section { border-top: 0; }

/* Statement words: grey → ink */
.cmp-main .cmp-light .cmp-words { color: var(--ink); }
.cmp-js .cmp-main .cmp-light .cmp-words .cmp-w { color: #c8cec3; }
.cmp-js .cmp-main .cmp-light .cmp-words .cmp-w.is-lit { color: var(--ink); }

/* Timeline */
.cmp-light .cmp-timeline::before { background: #10171a1f; }
.cmp-light .cmp-timeline::after { background: var(--green); box-shadow: none; }
.cmp-light .cmp-step::before { background: var(--white); border-color: #b4bbb0; }
.cmp-light .cmp-step.is-on::before { background: var(--accent); border-color: var(--green); box-shadow: 0 0 0 7px #44701c18; }
.cmp-main .cmp-light .cmp-step__when { color: var(--green); }
.cmp-main .cmp-light .cmp-step h3 { color: var(--ink); }
.cmp-main .cmp-light .cmp-step h3 + p { color: var(--soft-ink); }
.cmp-js .cmp-light .cmp-step { opacity: .38; }
.cmp-js .cmp-light .cmp-step.is-on { opacity: 1; }

/* Friction tiles */
.cmp-main .cmp-light .cmp-tile { background: #fff; border-color: #10171a14; box-shadow: 0 24px 60px #0b120f10; }
.cmp-main .cmp-light .cmp-tile:hover { border-color: #b5432c55; }
.cmp-main .cmp-light .cmp-tile__tag { color: #b5432c; }
.cmp-main .cmp-light .cmp-tile__tag::before { background: #b5432c14; }
.cmp-main .cmp-light .cmp-tile .cmp-tile__signs { color: #59635b; border-top-color: #10171a14; }

/* Stacking cards on a light chapter */
.cmp-main .cmp-light .cmp-stack__card { box-shadow: 0 -18px 50px #0b120f1f; }
.cmp-main .cmp-light .cmp-stack__card:nth-child(5n+2), .cmp-main .cmp-light .cmp-stack__card:nth-child(5n+5) { border-color: #10171a1c; }
.cmp-main .cmp-light .cmp-stack__card:nth-child(5n+2) { --bg: #ffffff; }
.cmp-main .cmp-light .cmp-stack__card :is(h3, p) { color: var(--fg); }
.cmp-main .cmp-light .cmp-stack__card .cmp-stack__num, .cmp-main .cmp-light .cmp-stack__card .cmp-stack__incl { color: var(--soft); }
.cmp-light .cmp-stack__card::after { background: #e9ede4; }

/* FAQ */
.cmp-main .cmp-light .cmp-faq__item { border-color: #10171a1f; }
.cmp-light .cmp-faq__item summary { color: var(--ink); }
.cmp-light .cmp-faq__item summary:hover { color: var(--green); }
.cmp-light .cmp-faq__item summary::after { border-color: #10171a33; color: var(--green); }
.cmp-light .cmp-faq__item[open] summary::after { background: var(--ink); color: var(--accent); }

/* Contact: light chapter, the form stays a dark card for focus */
.cmp-main .cmp-light .cmp-contact__details { border-top-color: #10171a1f; }
.cmp-main .cmp-light .cmp-contact__details p { color: var(--ink); }
.cmp-main .cmp-light .cmp-contact__details .cmp-contact__label { color: #59635b; }
.cmp-main .cmp-light .cmp-form { box-shadow: 0 40px 90px #0b120f2e; }
.cmp-main .cmp-light .cmp-form p.cmp-form__privacy { color: #9ba49e; }
.cmp-main .cmp-light .cmp-form__notice { color: #ffd8d0; }
.cmp-main .cmp-light .cmp-form__notice--sent { color: #e9ffc2; }

/* Three-column chapters on dark (previously light-only) */
.cmp-main .cmp-columns .cmp-trio > .wp-block-column { border-top-color: var(--line); }
.cmp-main .cmp-columns .cmp-trio h3 { color: var(--white); }
.cmp-main .cmp-columns .cmp-trio p { color: #bfc8c1; }
.cmp-main .cmp-columns { overflow: hidden; }

/* Next chapter: light band before the dark footer */
.cmp-next { background: var(--white); color: var(--ink); border-top: 0; }
.cmp-next .eyebrow { color: #37463d; }
.cmp-next__title b { color: #44701c; }
.cmp-next__link:hover .cmp-next__title { color: #44701c; }
.cmp-next + .cmp-closer { border-top: 0; }
.cmp-main .cmp-light :is(.cmp-tiles__head, .cmp-stack__intro, .cmp-timeline__head, .wp-block-column) > p:not(.eyebrow):not(.cmp-contact__label),
.cmp-main .cmp-light.cmp-contact .cmp-h2 + p,
.cmp-main .cmp-light .cmp-faq__item p,
.cmp-main .cmp-light .cmp-scale__copy { color: var(--soft-ink); }
@media (max-width: 700px) { .cmp-drift, .cmp-next__title.cmp-drift { transform: none; } }

/* ================================================================ v6.3 — reversed rhythm: light first, long scenes light */

/* Light hero + header on inner pages (simple page name + breadcrumb, still no image or panel) */
.collectmd-inner .cmp-hero { background: var(--white); color: var(--ink); border-bottom: 1px solid #10171a1a; }
.collectmd-inner .cmp-crumbs ol { color: #59635b; }
.collectmd-inner .cmp-crumbs ol::before { background: #44701c; box-shadow: none; }
.collectmd-inner .cmp-crumbs li + li::before { color: #b4bbb0; }
.collectmd-inner .cmp-crumbs a { color: #455147; }
.collectmd-inner .cmp-crumbs a:hover { color: #44701c; }
.collectmd-inner .cmp-crumbs [aria-current] { color: var(--ink); }
.collectmd-inner .cmp-hero__meta { color: #59635b; }
.collectmd-inner .cmp-hero__meta p { color: #455147; }
.collectmd-inner .nav { color: var(--ink); border-bottom-color: #10171a1a; }
.collectmd-inner .nav .logo { color: var(--ink); }
.collectmd-inner .nav .logo i { color: #44701c; }
.collectmd-inner .nav-mid a { color: #2f3a34; }
.collectmd-inner .nav-mid a:hover, .collectmd-inner .nav-mid a.is-current { color: #44701c; }
.collectmd-inner .nav .nav-cta { color: var(--ink); border-color: #10171a99; background: transparent; box-shadow: none; }
.collectmd-inner .nav .nav-cta:hover, .collectmd-inner .nav .nav-cta[aria-current] { background: var(--ink); border-color: var(--ink); color: var(--accent); }
.collectmd-inner .menu { color: var(--ink); }

/* Shared: light pinned scenes */
.cmp-main .cmp-scene.cmp-light { background: var(--white); color: var(--ink); }
.cmp-scene.cmp-light .cmp-scene__stick::after { opacity: .05; }
.cmp-main .cmp-scene.cmp-light h2, .cmp-main .cmp-scene.cmp-light .cmp-pipe__copy h3 { color: var(--ink); }
.cmp-main .cmp-scene.cmp-light .cmp-scene__item p, .cmp-main .cmp-scene.cmp-light .cmp-pipe__copy p { color: #455147; }
.cmp-scene.cmp-light .cmp-scene__meter { background: #10171a22; }
.cmp-scene.cmp-light .cmp-scene__meter i { background: #44701c; }
.cmp-main .cmp-scene.cmp-light .cmp-scene__count, .cmp-main .cmp-scene.cmp-light .cmp-scene__caption { color: #59635b; }

/* Claim scene on light */
.cmp-light .cmp-radar { border-color: #44701c33; background: radial-gradient(circle, #c4fb5b26, transparent 65%); }
.cmp-light .cmp-radar::after { border-color: #44701c30; }
.cmp-light .cmp-claim { background: #fff; border: 1px solid #10171a12; box-shadow: 0 50px 100px #0b120f26; }
.cmp-main .cmp-light .cmp-alert p { color: #a7b2ae; }

/* Pipeline on light */
.cmp-light .cmp-pipe__line { background: #10171a1a; }
.cmp-light .cmp-pipe__fill { background: #44701c; box-shadow: 0 0 12px #c4fb5b; }
.cmp-light .cmp-node { color: #8a948c; }
.cmp-light .cmp-node svg { background: #fff; border-color: #10171a1f; box-shadow: 0 12px 30px #0b120f0f; }
.cmp-light .cmp-node.is-on { color: #44701c; }
.cmp-light .cmp-node.is-on svg { border-color: #44701c99; }
.cmp-light .cmp-node.is-current { color: var(--ink); }
.cmp-light .cmp-node.is-current svg { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 8px #c4fb5b33, 0 20px 40px #44701c33; }
.cmp-main .cmp-light .cmp-pipe__copy .mono { color: #44701c; }

/* Payment scene on light (the phone stays a dark device for contrast) */
.cmp-main .cmp-pay.cmp-light { background: radial-gradient(circle at 60% 55%, #e6f2d2 0%, var(--white) 62%); }
.cmp-light .cmp-chips span { border-color: #10171a26; color: #59635b; }
.cmp-light .cmp-chips span.is-on { background: var(--ink); border-color: var(--ink); color: var(--accent); }
.cmp-light .cmp-pay__halo { border-color: #44701c44; box-shadow: inset 0 0 120px #c4fb5b22; }
.cmp-light .cmp-phone { box-shadow: 0 40px 90px #0b120f40; }
.cmp-light .cmp-paycard { box-shadow: 0 30px 70px #44701c40; }
.cmp-light .cmp-toast { background: #fff; border: 1px solid #10171a12; box-shadow: 0 30px 60px #0b120f26; }
.cmp-main .cmp-light .cmp-pay__foot .cmp-scene__item { color: var(--ink); }

/* Horizontal habits story on light */
.cmp-main .cmp-light .cmp-panel { background: #fff; border-color: #10171a14; box-shadow: 0 24px 60px #0b120f12; }
.cmp-light .cmp-panel::before { border-color: #44701c30; box-shadow: inset 0 0 80px #c4fb5b1f; }
.cmp-light .cmp-panel::after { background: #44701c; box-shadow: 0 0 14px #c4fb5b; }
.cmp-main .cmp-light .cmp-panel h3 { color: var(--ink); }
.cmp-main .cmp-light .cmp-panel p { color: #455147; }
.cmp-hscroll.is-pinned.cmp-light .cmp-hscroll__stick::after { background: linear-gradient(90deg, #44701c calc(var(--p, 0) * 100%), #10171a22 0); }

/* Scaling statement on light */
.cmp-main .cmp-scale-wrap.cmp-light .cmp-scale { color: var(--ink); }
.cmp-main .cmp-scale-wrap.cmp-light .cmp-scale em { color: #44701c; }

/* Next chapter: back to dark, flowing straight into the dark footer */
.cmp-next { background: transparent; color: var(--white); border-top: 0; }
.cmp-next .eyebrow { color: #bdc8bd; }
.cmp-next__title b { color: var(--accent); }
.cmp-next__link:hover .cmp-next__title { color: var(--accent); }
.cmp-next + .cmp-closer { border-top: 1px solid var(--line); }

/* Dark devices/cards inside light scenes keep light text */
.cmp-light .cmp-phone, .cmp-light .cmp-alert { color: var(--white); }
.cmp-light .cmp-toast, .cmp-light .cmp-claim, .cmp-light .cmp-paycard { color: #102018; }

/* ================================================================ v6.4 — tighter spacing, no numbered labels */
.collectmd-inner { --sec-y: clamp(80px, 9vw, 140px); }
.cmp-main .cmp-break, .cmp-main .cmp-scale-wrap { min-height: 0; padding: clamp(100px, 12vw, 170px) 0; }
.cmp-footer { margin-top: clamp(50px, 7vw, 100px); }
.cmp-closer--bare { padding-top: 0; border-top: 0; }
.cmp-closer--bare .cmp-footer { margin-top: 0; }
.cmp-next__link { padding: clamp(64px, 8vw, 120px) 0; }
.cmp-hero { padding-bottom: clamp(40px, 5vw, 76px); }

/* Stack cards without the number row */
.cmp-main .cmp-stack__card { grid-template-rows: 1fr auto; }
.cmp-main .cmp-stack__card h3 { align-self: start; }

/* Drawer links without numbers */
.cmd-drawer-links a { gap: 0; }

@media (max-width: 700px) {
	.collectmd-inner { --sec-y: 64px; }
	.cmp-main .cmp-break, .cmp-main .cmp-scale-wrap { padding: 80px 0; }
	.cmp-main .cmp-break .cmp-break__copy, .cmp-main .cmp-scale__copy { margin-top: 24px; }
	.cmp-hero { padding-top: 116px; padding-bottom: 36px; }
	.cmp-next__link { padding: 56px 0; }
	.cmp-closer { padding-top: 64px; }
	.cmp-closer--bare { padding-top: 0; }
	.cmp-footer { margin-top: 40px; padding: 28px 0 32px; }
	.cmp-main .cmp-stack__card { min-height: 0; }
	.cmp-main .cmp-stack__card h3 { padding: 6px 0 4px; }
	.cmp-main .cmp-tiles__head, .cmp-main .cmp-stack__intro, .cmp-main .cmp-timeline__head { margin-bottom: 40px; }
	.cmp-main .cmp-trio { margin-top: 44px; }
	.cmp-main .cmp-step { padding-bottom: 52px; }

	/* Pipeline on phones: vertical rail that fills the pinned screen instead of floating in the middle */
	.cmp-pipe .cmp-scene__stick { justify-content: flex-start; gap: 26px; padding: 96px 21px 28px; }
	.cmp-pipe__rail { grid-template-columns: 1fr; gap: 12px; justify-items: start; }
	.cmp-pipe__line, .cmp-pipe__fill { left: 26px; right: auto; top: 26px; width: 2px; height: auto; }
	.cmp-pipe__line { bottom: 26px; }
	.cmp-pipe__fill { height: calc(var(--p, 0) * (100% - 52px)); }
	.cmp-node { grid-template-columns: auto 1fr; grid-auto-flow: column; justify-items: start; align-items: center; gap: 16px; }
	.cmp-node svg { width: 54px; height: 54px; padding: 14px; }
	.cmp-node strong { font-size: 11px; letter-spacing: .14em; }
	.cmp-node.is-current { transform: translateX(6px) scale(1.04); }
	.cmp-pipe__copy h3 { font-size: clamp(28px, 8vw, 38px); }
	.cmp-pipe__copy p { margin-top: 12px; font-size: 15px; line-height: 1.65; }
}
@media (max-width: 700px) { .cmp-pipe .cmp-scene__stick { justify-content: center; padding-top: 80px; gap: 30px; } .cmp-node svg { width: 58px; height: 58px; padding: 15px; } .cmp-pipe__rail { gap: 14px; } .cmp-pipe__line, .cmp-pipe__fill { left: 28px; top: 28px; } .cmp-pipe__line { bottom: 28px; } }
@media (prefers-reduced-motion: reduce) { .cmp-js .cmp-light .cmp-step { opacity: 1; } }
