/* Fulfillment presentation. Shared brand, hero and navigation remain in their owners. */
.page-fulfillment .ff-section { padding: clamp(4rem,7vw,7rem) 0; scroll-margin-top: 6rem; }
.page-fulfillment .ff-section h2 { font-size: clamp(2rem,3.8vw,3.2rem); font-weight: 800; line-height: 1.12; letter-spacing: -.045em; text-wrap: balance; margin: 1rem 0 1.5rem; }
.page-fulfillment .ff-section h3 { font-size: 1.18rem; line-height: 1.35; font-weight: 700; letter-spacing: -.025em; }
.page-fulfillment .ff-section p { color: var(--ntc-text-gray); line-height: 1.8; font-size: 1rem; max-width: 65ch; text-wrap: pretty; }
.page-fulfillment .ff-section .eyebrow { color: var(--ntc-charcoal); border-left: 2px solid var(--ntc-red); padding-left: .85rem; }
.page-fulfillment .ff-split { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(2rem,5vw,5rem); align-items: center; }
.page-fulfillment .ff-heading { max-width: 43rem; margin-bottom: 3rem; }
.page-fulfillment .ff-heading-split { display: grid; grid-template-columns: 1.1fr 1fr; gap: 4rem; align-items: end; max-width: none; }
.page-fulfillment .ff-heading-split h2 { margin-bottom: 0; }
.page-fulfillment figure { margin: 0; position: relative; }
.page-fulfillment figure picture { display: block; }
.page-fulfillment figure img { display: block; width: 100%; object-fit: cover; }
.page-fulfillment figure figcaption { font-size: .8rem; line-height: 1.6; }
.page-fulfillment .ff-delivery-photo figcaption,
.page-fulfillment .ff-team-photo figcaption { position: absolute; inset: auto 0 0; padding: 3.5rem 1.5rem 1.5rem; color: #fff; background: linear-gradient(transparent,rgba(32,33,36,.86)); border-radius: 0 0 var(--ntc-radius-surface) var(--ntc-radius-surface); }
.page-fulfillment .ff-link { color: var(--ntc-charcoal); font-size: .9rem; font-weight: 700; display: inline-flex; align-items: center; gap: 1.5rem; padding: .8rem 0; border-bottom: 1px solid var(--ntc-border-gray); text-decoration: none; transition: color .2s,border-color .2s; }
.page-fulfillment .ff-link:hover { color: var(--ntc-red-hover); border-color: currentColor; }
.page-fulfillment .ff-link:focus-visible,
.page-fulfillment .ff-section-nav a:focus-visible,
.page-fulfillment summary:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.page-fulfillment .ff-section-nav { border-bottom: 1px solid var(--ntc-border-gray); background: #fff; }
.page-fulfillment .ff-section-nav .container { display: flex; gap: clamp(1.5rem,4vw,4rem); flex-wrap: wrap; padding-top: 1rem; padding-bottom: 1rem; }
.page-fulfillment .ff-section-nav a { color: var(--ntc-charcoal); font-size: .85rem; font-weight: 700; text-decoration: none; padding: .4rem 0; }
.page-fulfillment .ff-section-nav a:hover { color: var(--ntc-red-hover); text-decoration: underline; text-underline-offset: .3rem; }
.page-fulfillment .ff-process { background: var(--ntc-charcoal); color: #fff; }
.page-fulfillment .ff-overview { background: linear-gradient(135deg,#f3f5f7,#fff); }
.page-fulfillment .ff-process-list,
.page-fulfillment .ff-start-list { list-style: none; padding: 0; margin: 0; }
.page-fulfillment .ff-process-list li,
.page-fulfillment .ff-client-list article { display: grid; grid-template-columns: 2rem minmax(0,1fr); gap: 1.25rem; padding: 1.7rem 0; border-bottom: 1px solid var(--ntc-border-gray); }
.page-fulfillment .ff-process-list li:first-child { padding-top: 0; }
.page-fulfillment .ff-process-list p,
.page-fulfillment .ff-client-list p { font-size: .92rem; margin: .55rem 0 0; }
.page-fulfillment .ff-number { font-variant-numeric: tabular-nums; font-size: .75rem; font-weight: 700; color: var(--ntc-text-gray); display: block; padding-top: .2rem; }
.page-fulfillment .ff-scope-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 2px solid var(--ntc-charcoal); gap: 2.5rem; }
.page-fulfillment .ff-scope-grid article { padding-top: 1.5rem; }
.page-fulfillment .ff-scope-grid h3 { margin: 1.3rem 0 .75rem; }
.page-fulfillment .ff-scope-grid p { font-size: .9rem; }
.page-fulfillment .ff-scope-note { margin: 2.5rem 0 0; font-size: .85rem !important; max-width: none !important; padding-top: 1.25rem; border-top: 1px solid var(--ntc-border-gray); }
.page-fulfillment .ff-portal,
.page-fulfillment .ff-quote { background: var(--ntc-charcoal); color: #fff; }
.page-fulfillment .ff-portal h2,
.page-fulfillment .ff-quote h2,
.page-fulfillment .ff-quote h3 { color: #fff; }
.page-fulfillment .ff-portal p,
.page-fulfillment .ff-quote p { color: #dce3e9; }
.page-fulfillment .ff-portal .eyebrow,
.page-fulfillment .ff-quote .eyebrow { color: #fff; }
.page-fulfillment .ff-portal .ff-link { color: #fff; border-color: #ffffff50; }
.page-fulfillment .ff-data-outputs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .7rem; margin: 1.5rem 0; }
.page-fulfillment .ff-data-outputs span { padding: .85rem .5rem; text-align: center; border: 1px solid #ffffff40; border-radius: var(--ntc-radius-surface); font-size: .75rem; font-weight: 600; }
.page-fulfillment .ff-data-visual p { font-size: .8rem; margin: 0; }
.page-fulfillment .ff-delivery-photo img { aspect-ratio: 1/1; border-radius: var(--ntc-radius-surface); }
.page-fulfillment .ff-return-note { margin: 2rem 0 1rem; border-top: 1px solid var(--ntc-border-gray); padding-top: 1.5rem; }
.page-fulfillment .ff-return-note p { font-size: .92rem; }
.page-fulfillment .ff-clients { background: var(--ntc-charcoal); color: #fff; }
.page-fulfillment .ff-clients .ff-split,
.page-fulfillment .ff-faq .ff-split { align-items: start; }
.page-fulfillment .ff-client-list article:first-child { padding-top: 0; }
.page-fulfillment .ff-start-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 2.5rem; border-top: 1px solid var(--ntc-border-gray); }
.page-fulfillment .ff-start-list li { padding: 1.5rem 0; }
.page-fulfillment .ff-start-list h3 { margin-top: 1.3rem; }
.page-fulfillment .ff-start-list p { font-size: .9rem; }
.page-fulfillment .ff-team-photo { margin-top: 2rem; }
.page-fulfillment .ff-team-photo img { aspect-ratio: 21/8; border-radius: var(--ntc-radius-surface); }
.page-fulfillment .ff-faq { background: var(--ntc-light-gray); }
.page-fulfillment .ff-faq-list { border-top: 1px solid var(--ntc-border-gray); }
.page-fulfillment .ff-faq-list details { border-bottom: 1px solid var(--ntc-border-gray); }
.page-fulfillment .ff-faq-list summary { display: flex; justify-content: space-between; gap: 1.5rem; font-size: .95rem; line-height: 1.5; font-weight: 700; padding: 1.5rem 0; cursor: pointer; list-style: none; }
.page-fulfillment .ff-faq-list summary::-webkit-details-marker { display: none; }
.page-fulfillment .ff-faq-list summary span { font-size: 1.4rem; line-height: 1; flex: 0 0 auto; transition: transform .2s; }
.page-fulfillment .ff-faq-list details[open] summary span { transform: rotate(45deg); }
.page-fulfillment .ff-faq-list details p { font-size: .9rem; margin: 0 0 1.5rem; }
.page-fulfillment .ff-enquiry-info { border-left: 1px solid #ffffff40; padding: 1rem 0 1rem clamp(2rem,4vw,4rem); }
.page-fulfillment .ff-enquiry-info ul { list-style: none; margin: 1.5rem 0 0; padding: 0; }
.page-fulfillment .ff-enquiry-info li { padding: .8rem 0; border-bottom: 1px solid #ffffff25; font-size: .9rem; color: #dce3e9; }
.page-fulfillment .ff-phone { display: block; color: #fff; margin-top: 1.5rem; font-size: 1rem; font-weight: 600; }
.page-fulfillment .ff-quote .btn { white-space: normal; }

.page-fulfillment .ff-story-media { height: 36rem; position: relative; }
.page-fulfillment .ff-story-main { position: absolute; inset: 0 8% 12% 0; overflow: hidden; border-radius: var(--ntc-radius-surface); }
.page-fulfillment .ff-story-main picture,
.page-fulfillment .ff-story-main img,
.page-fulfillment .ff-story-inset picture,
.page-fulfillment .ff-story-inset img { width: 100%; height: 100%; }
.page-fulfillment .ff-story-main figcaption { position: absolute; bottom: 0; left: 0; right: 0; padding: 3rem 1.5rem 1.5rem; color: #fff; background: linear-gradient(transparent,rgba(32,33,36,.9)); }
.page-fulfillment .ff-story-inset { position: absolute; right: 0; bottom: 0; width: 47%; height: 38%; border: 6px solid #fff; border-radius: var(--ntc-radius-surface); overflow: hidden; box-shadow: 0 16px 36px #20212414; }
.page-fulfillment .ff-story-label { position: absolute; top: 2rem; left: -1.3rem; z-index: 1; background: #fff; border-left: 3px solid var(--ntc-red); padding: 1.2rem 1.4rem; border-radius: var(--ntc-radius-surface); box-shadow: 0 12px 30px #20212412; }
.page-fulfillment .ff-story-label small { display: block; font-size: .65rem; letter-spacing: .1em; font-weight: 700; margin-bottom: .65rem; }
.page-fulfillment .ff-story-label strong { display: block; font-size: 1.7rem; line-height: 1.1; font-weight: 800; letter-spacing: -.04em; }
.page-fulfillment .ff-story-label span { display: block; font-size: .65rem; color: var(--ntc-text-gray); margin-top: .7rem; }
.page-fulfillment .ff-process h2,
.page-fulfillment .ff-process h3,
.page-fulfillment .ff-process h4,
.page-fulfillment .ff-clients h2,
.page-fulfillment .ff-clients h3 { color: #fff; }
.page-fulfillment .ff-process .eyebrow,
.page-fulfillment .ff-clients .eyebrow { color: #fff; }
.page-fulfillment .ff-process p,
.page-fulfillment .ff-clients p,
.page-fulfillment .ff-process .ff-number,
.page-fulfillment .ff-clients .ff-number { color: #dce3e9; }
.page-fulfillment .ff-process-list li,
.page-fulfillment .ff-client-list article { border-color: #ffffff30; }
.page-fulfillment .ff-chapters { display: grid; gap: 5rem; margin-top: 4rem; }
.page-fulfillment .ff-chapter { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem,5vw,5rem); align-items: center; }
.page-fulfillment .ff-chapter:nth-child(even) .ff-chapter-media { order: 2; }
.page-fulfillment .ff-chapter-media { height: 32rem; position: relative; }
.page-fulfillment .ff-chapter-main { position: absolute; inset: 0 7% 13% 0; border-radius: var(--ntc-radius-surface); overflow: hidden; }
.page-fulfillment .ff-chapter-main picture,
.page-fulfillment .ff-chapter-main img,
.page-fulfillment .ff-chapter-detail picture,
.page-fulfillment .ff-chapter-detail img { width: 100%; height: 100%; }
.page-fulfillment .ff-chapter-main figcaption { position: absolute; bottom: 0; left: 0; right: 0; padding: 3rem 1.5rem 1.5rem; color: #fff; background: linear-gradient(transparent,rgba(32,33,36,.9)); }
.page-fulfillment .ff-chapter-detail { position: absolute; bottom: 0; right: 0; width: 47%; height: 37%; border: 6px solid var(--ntc-charcoal); border-radius: var(--ntc-radius-surface); overflow: hidden; }
.page-fulfillment .ff-chapter-media--single .ff-chapter-main { inset: 0; }
.page-fulfillment .ff-chapter-copy > h3 { font-size: clamp(1.8rem,3vw,2.5rem); font-weight: 800; margin: 1rem 0 1.75rem; }
.page-fulfillment .ff-chapter-index { display: block; font-size: .75rem; font-weight: 700; letter-spacing: .12em; border-left: 2px solid var(--ntc-red); padding-left: .8rem; }
.page-fulfillment .ff-chapter-copy h4 { font-size: 1.05rem; font-weight: 700; }
.page-fulfillment .ff-data-visual > picture { border-radius: var(--ntc-radius-surface); overflow: hidden; }
.page-fulfillment .ff-data-visual > picture img { aspect-ratio: 4/3; }
.page-fulfillment .ff-data-visual > figcaption { position: relative; margin: -2rem 0 0 auto; width: 92%; background: #2d3033; border-top: 2px solid var(--ntc-red); padding: 1.75rem; border-radius: var(--ntc-radius-surface); }
.page-fulfillment .ff-data-visual figcaption > strong { display: block; font-size: 1.8rem; font-weight: 800; line-height: 1.15; margin-top: 1rem; letter-spacing: -.04em; }
.page-fulfillment .ff-client-photo { margin-top: 2rem; }
.page-fulfillment .ff-client-photo img { aspect-ratio: 16/9; border-radius: var(--ntc-radius-surface); }
@media (max-width: 991.98px) {
 .page-fulfillment .ff-scope-grid,
 .page-fulfillment .ff-start-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .page-fulfillment .ff-heading-split { gap: 2rem; }
 .page-fulfillment .ff-story-media { height: 29rem; }
 .page-fulfillment .ff-chapter-media { height: 27rem; }
}
@media (max-width: 767.98px) {
 .page-fulfillment .ff-split,
 .page-fulfillment .ff-heading-split { grid-template-columns: minmax(0,1fr); gap: 2rem; }
 .page-fulfillment .ff-section-nav .container { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .4rem 1.5rem; }
 .page-fulfillment .ff-heading { margin-bottom: 2rem; }
 .page-fulfillment .ff-heading-split h2 { margin-bottom: 1rem; }
 .page-fulfillment .ff-heading-split p { margin-bottom: 0; }
 .page-fulfillment .ff-team-photo img { aspect-ratio: 4/3; }
 .page-fulfillment .ff-enquiry-info { border-left: 0; border-top: 1px solid #ffffff40; padding: 2rem 0 0; }
 .page-fulfillment .ff-scope-grid,
 .page-fulfillment .ff-start-list { gap: 1.5rem; }
 .page-fulfillment .ff-story-media { height: 30rem; }
 .page-fulfillment .ff-story-label { top: 1.5rem; left: .8rem; padding: 1rem; }
 .page-fulfillment .ff-story-label strong { font-size: 1.4rem; }
 .page-fulfillment .ff-chapter { grid-template-columns: minmax(0,1fr); gap: 2rem; }
 .page-fulfillment .ff-chapter:nth-child(even) .ff-chapter-media { order: 0; }
 .page-fulfillment .ff-chapters { gap: 4rem; margin-top: 2.5rem; }
 .page-fulfillment .ff-chapter-media { height: 26rem; }
 .page-fulfillment .ff-data-visual > figcaption { padding: 1.5rem; }
}
@media (max-width: 399.98px) {
 .page-fulfillment .ff-scope-grid,
 .page-fulfillment .ff-start-list { grid-template-columns: minmax(0,1fr); gap: .5rem; }
 .page-fulfillment .ff-data-outputs { grid-template-columns: minmax(0,1fr); gap: .5rem; }
 .page-fulfillment .ff-story-media { height: 27rem; }
 .page-fulfillment .ff-chapter-media { height: 23rem; }
}
@media (prefers-reduced-motion: reduce) {
 .page-fulfillment .ff-faq-list summary span,
 .page-fulfillment .ff-link { transition: none; }
}