/* Probeck design system. Bootstrap owns the grid, forms and utility classes.
   Custom CSS adds brand tokens, typography and editorial section patterns. */
:root {
    --bs-primary: #2e4c99;
    --bs-primary-rgb: 46, 76, 153;
    --bs-secondary: #f18925;
    --bs-secondary-rgb: 241, 137, 37;
    --pb-ink: #1c2939;
    --pb-muted: #526174;
    --pb-blue: #2e4c99;
    --pb-orange: #f18925;
    --pb-paper: #f8f5ef;
    --pb-mist: #eef2f8;
    --pb-line: #d8dee6;
    --pb-radius: .5rem;
    --bs-body-font-family: "Segoe UI", Arial, sans-serif;
    --bs-body-color: var(--pb-ink);
    --bs-body-bg: #fff;
    --bs-link-color: var(--pb-blue);
    --bs-link-hover-color: #203873;
}
html { scroll-behavior: smooth; scroll-padding-top: 6rem; }
body { font-size: 1rem; line-height: 1.65; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { color: var(--pb-ink); font-weight: 700; line-height: 1.13; letter-spacing: -.035em; text-wrap: balance; }
h1 { font-size: clamp(2.55rem, 4.2vw, 3.8rem); margin-bottom: 1.4rem; }
h2 { font-size: clamp(2rem, 3.15vw, 2.8rem); margin-bottom: .75rem; }
h3 { font-size: 1.35rem; }
p { color: var(--pb-muted); }
a { text-underline-offset: .22em; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #bf5900; outline-offset: 5px; }
#main-content:focus { outline: none; }
[hidden] { display: none !important; }
section[id], [id="apps"], [id="websites"], #about, #planned-pages { scroll-margin-top: 6rem; }
/* Font Awesome icons inherit the surrounding text colour. */
.icon { display: inline-block; width: 1em; height: 1em; flex-shrink: 0; line-height: 1; text-align: center; vertical-align: -.125em; }
.support-icon { display: block; font-size: 1.5rem; width: 1.5rem; height: 1.5rem; color: var(--pb-blue); margin-bottom: .75rem; }
.quote-mark .icon { font-size: .65em; }
.text-brand { color: var(--pb-blue); }
.text-apricot { color: #ffb66f; }
.section-space { padding-block: clamp(3.5rem, 6vw, 6rem); }
.section-heading { margin-bottom: 2.5rem; }
.section-intro { font-size: 1.17rem; line-height: 1.6; }
.section-paper { background: var(--pb-paper); }
.section-mist { background: var(--pb-mist); }
.eyebrow { color: var(--pb-blue); font-size: .74rem; font-weight: 700; letter-spacing: .105em; text-transform: uppercase; margin-bottom: 1.2rem; }
.accent-dash { display: inline-block; width: 1.5rem; height: 3px; background: var(--pb-orange); vertical-align: middle; margin-right: .4rem; }
.btn { --bs-btn-border-radius: .35rem; --bs-btn-padding-x: 1.25rem; --bs-btn-padding-y: .85rem; --bs-btn-font-weight: 600; font-size: .93rem; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 1rem; }
.btn-primary { --bs-btn-bg: var(--pb-blue); --bs-btn-border-color: var(--pb-blue); --bs-btn-hover-bg: #243c7a; --bs-btn-hover-border-color: #243c7a; --bs-btn-active-bg: #1b3066; --bs-btn-active-border-color: #1b3066; --bs-btn-focus-shadow-rgb: 46,76,153; }
.btn-outline-primary { --bs-btn-color: var(--pb-blue); --bs-btn-border-color: var(--pb-blue); --bs-btn-hover-bg: var(--pb-blue); --bs-btn-hover-border-color: var(--pb-blue); }
.btn span[aria-hidden] { display: inline-flex; align-items: center; font-size: 1.2rem; line-height: 1; }
.text-link { display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; color: var(--pb-blue); font-weight: 600; font-size: .92rem; background: none; border: 0; padding: 0; text-decoration: underline; text-decoration-thickness: 1px; }
.text-link:hover { color: #162b63; }
.placeholder-label, .planned-note { color: #716047; font-size: .75rem; line-height: 1.5; }
.placeholder-label { display: inline-block; }
.planned-link { display: inline-flex; align-items: center; justify-content: space-between; gap: .65rem; min-height: 44px; font-weight: 600; font-size: .87rem; }
.skip-link { position: fixed; z-index: 1100; top: .5rem; left: 1rem; padding: .75rem 1rem; background: var(--pb-ink); color: #fff; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.site-header { background: #fff; border-bottom: 1px solid var(--pb-line); position: sticky; top: 0; z-index: 100; }
.site-contact-strip { border-top: 3px solid var(--pb-orange); background: var(--pb-ink); color: #fff; }
.site-contact-strip-inner { display: flex; align-items: center; justify-content: flex-end; gap: 1.75rem; min-height: 40px; }
.site-contact-strip a { display: inline-flex; align-items: center; gap: .55rem; color: #fff; font-size: .8rem; font-weight: 600; text-decoration: none; }
.site-contact-strip a:hover, .site-contact-strip a:focus-visible { color: #ffd09f; text-decoration: underline; text-underline-offset: .18em; }
.site-contact-strip .fa-solid { color: var(--pb-orange); font-size: .85rem; }
.contact-detail-short { display: none; }
.site-navigation { display: flex; align-items: center; gap: 2rem; min-height: 88px; }
.brand { display: inline-flex; align-items: center; flex-shrink: 0; padding: .5rem; text-decoration: none; }
.brand img { display: block; width: 180px; height: auto; }
.site-footer .brand img { width: 210px; }
.navigation-links { align-items: center; gap: 1.55rem; margin-left: auto; }
.navigation-links > .nav-link { color: var(--pb-ink); text-decoration: none; font-weight: 600; font-size: .87rem; padding-block: .7rem; }
.navigation-links > .nav-link:hover { color: var(--pb-blue); text-decoration: underline; }
.nav-project { flex-shrink: 0; }
.menu-toggle { border: 0; border-radius: .3rem; width: 44px; height: 44px; padding: .45rem; color: var(--pb-ink); }
.menu-toggle:focus { box-shadow: 0 0 0 .2rem rgba(46,76,153,.22); }
.hero { background: var(--pb-paper); padding-block: 3.6rem 3.2rem; }
.hero:not(.home-hero) { position: relative; isolation: isolate; overflow: hidden; background-color: #101d30; background-image: url('/assets/images/projectsbackground.jpg'); background-position: center; background-size: cover; color: #fff; }
.hero:not(.home-hero)::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(8,18,32,.97), rgba(8,18,32,.86)); }
.hero:not(.home-hero) h1 { color: #fff; text-shadow: 0 3px 24px rgba(0,0,0,.22); }
.hero:not(.home-hero) .text-brand { color: #a9c1ff; }
.hero:not(.home-hero) .eyebrow { color: #f7b26f; }
.hero:not(.home-hero) p, .hero:not(.home-hero) .section-intro { color: #d6dfeb; }
.hero:not(.home-hero) .hero-note { color: #aebdce; }
.hero:not(.home-hero) .btn-primary { --bs-btn-bg: var(--pb-orange); --bs-btn-border-color: var(--pb-orange); --bs-btn-color: #101d30; --bs-btn-hover-bg: #ffad5e; --bs-btn-hover-border-color: #ffad5e; --bs-btn-hover-color: #101d30; }
.hero:not(.home-hero) .text-link, .hero:not(.home-hero) .service-page-nav a, .hero:not(.home-hero) .website-page-links a, .hero:not(.home-hero) .calculator-jump-links a { color: #fff; }
.hero:not(.home-hero) .service-page-nav, .hero:not(.home-hero) .website-page-links, .hero:not(.home-hero) .calculator-jump-links { border-color: rgba(255,255,255,.24); }
.website-page .hero:not(.home-hero) { background-image: url('/assets/images/projectsbackground.jpg'); background-position: center; }
.calculator-page .hero:not(.home-hero) { background-image: url('/assets/images/generated/homepage-technology-hero.jpg'); background-position: center; }
.hosting-page .hero:not(.home-hero) { background-image: url('/assets/images/backgrounds/serverroom.jpg'); }
.about-page .hero:not(.home-hero) { background-image: url('/assets/images/backgrounds/homepagebackground2.jpg'); background-position: center 45%; }
.pricing-page .hero:not(.home-hero) { background-image: url('/assets/images/generated/homepage-technology-hero.jpg'); background-position: center; }
.home-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 39rem; display: flex; align-items: center; background-color: #101d30; background-image: url('/assets/images/generated/homepage-technology-hero-v2.jpg'); background-position: center; background-size: cover; padding-block: clamp(4.5rem, 8vw, 7.5rem); }
.home-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(8,18,32,.98) 0%, rgba(8,18,32,.92) 37%, rgba(8,18,32,.45) 64%, rgba(8,18,32,.22) 100%); }
.home-hero::after { content: ""; position: absolute; z-index: -1; inset: auto 0 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(108,150,255,.65), var(--pb-orange), transparent); }
.home-hero h1 { color: #fff; font-size: clamp(2.8rem, 4.25vw, 3.8rem); max-width: none; text-shadow: 0 3px 28px rgba(0,0,0,.28); }
.home-hero .text-brand { color: #a9c1ff; }
.home-hero .eyebrow { color: #f7b26f; }
.home-hero .hero-description { color: #d6dfeb; }
.home-hero .hero-note { color: #aebdce; }
.home-hero .btn-primary { --bs-btn-bg: var(--pb-orange); --bs-btn-border-color: var(--pb-orange); --bs-btn-color: #101d30; --bs-btn-hover-bg: #ffad5e; --bs-btn-hover-border-color: #ffad5e; --bs-btn-hover-color: #101d30; }
.home-hero .text-link { color: #fff; }
.home-hero .text-link:hover { color: #bdd0ff; }
.home-hero .video-frame { border: 1px solid rgba(255,255,255,.24); box-shadow: 0 30px 80px -35px #000, 0 0 0 10px rgba(11,25,44,.38); }
.home-hero .video-caption { color: #aebdce; }
.home-hero .video-caption > span:first-child { color: #fff; }
.hero-description { font-size: 1.16rem; max-width: 34rem; line-height: 1.65; margin-bottom: 1.6rem; }
.hero .cta-group { column-gap: 1.2rem !important; row-gap: .3rem !important; }
.hero-note { font-size: .82rem; margin: 1.35rem 0 0; max-width: 31rem; }
.video-frame { aspect-ratio: 16/9; position: relative; background: #1c2939; border-radius: var(--pb-radius); box-shadow: 0 20px 40px -25px #17233766; }
.video-frame video { display: block; width: 100%; height: auto; aspect-ratio: 16/9; border-radius: inherit; }
.video-caption { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.1rem; font-size: .74rem; color: var(--pb-muted); }
.video-caption > span:first-child { color: var(--pb-ink); font-weight: 600; }
.trust-strip { padding-block: 1.4rem; background: var(--pb-ink); color: #fff; }
.credential-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; }
.credential { display: flex; flex-direction: column; align-items: center; gap: .65rem; color: #fff; text-decoration: none; text-align: center; }
.credential:hover, .credential:focus-visible { color: #fff; }
a.credential:hover .credential-label, a.credential:focus-visible .credential-label { text-decoration: underline; text-underline-offset: .22em; }
.credential-logo { display: flex; align-items: center; justify-content: center; width: 100%; height: 56px; }
.credential-logo img { display: block; width: auto; height: 100%; max-width: 100%; object-fit: contain; }
.credential-label { font-size: .82rem; font-weight: 600; }
.credential-award-logo { width: min(100%, 160px); }
.service-panel { display: flex; flex-direction: column; padding: clamp(1.4rem, 3vw, 2.6rem); border-radius: var(--pb-radius); border-top: 4px solid var(--pb-blue); background: var(--pb-mist); overflow: hidden; box-shadow: 0 26px 65px -48px #101d30; }
.service-websites { background: var(--pb-paper); border-color: var(--pb-orange); }
.service-number { color: var(--pb-blue); font-size: .77rem; font-weight: 700; letter-spacing: .07em; }
.service-mark { font-size: 2rem; color: var(--pb-blue); line-height: 1; }
.service-panel h3 { font-size: clamp(1.7rem, 2.5vw, 2.1rem); margin-bottom: 1.25rem; }
.service-panel p { font-size: .95rem; }
.service-outcomes { margin: .5rem 0 1.7rem; }
.service-outcomes li { display: flex; align-items: baseline; gap: .75rem; font-size: .9rem; margin-bottom: .6rem; }
.service-outcomes span { color: var(--pb-blue); font-weight: 700; }
.asset-placeholder { background: #e2e8f1; border: 1px dashed #aebbcf; border-radius: .35rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; padding: 1.5rem; text-align: center; color: #4d5d76; }
.asset-placeholder > span:last-child { font-size: .74rem; }
.asset-placeholder strong { color: #344864; font-weight: 600; }
.placeholder-cross { font-size: 1.7rem; font-weight: 300; line-height: 1; margin-bottom: .4rem; }
.app-placeholder, .website-placeholder { min-height: 220px; margin-top: auto; margin-inline: calc(clamp(1.4rem, 3vw, 2.6rem) * -1); border-radius: 0; }
.website-placeholder { background: #ede6dc; border-color: #b8ac9a; color: #665b4b; }
.website-placeholder strong { color: #665b4b; }
.service-panel .service-visual img { aspect-ratio: 16 / 8.25; object-position: center; }
.service-links { margin-top: 1.5rem; border-top: 1px solid #cbd2dd; padding-top: 1rem; }
.service-links .planned-link { margin-right: 1.1rem; }
.section-ink { background: var(--pb-ink); }
.section-ink h2, .section-ink h3 { color: #fff; }
.section-ink p { color: #c5cedb; }
.section-ink .eyebrow { color: #ffb66f; }
.section-ink .service-copy-list { color: #c5cedb; }
.service-page .section-ink .service-copy-list strong { color: #fff; }
.section-ink .btn-primary { --bs-btn-bg: #fff; --bs-btn-border-color: #fff; --bs-btn-color: var(--pb-ink); --bs-btn-hover-bg: #ffe8cd; --bs-btn-hover-border-color: #ffe8cd; --bs-btn-hover-color: var(--pb-ink); }
.problem-list > li { display: flex; align-items: baseline; gap: 1.25rem; border-bottom: 1px solid #45505f; padding: 1.5rem 0; }
.problem-list > li:first-child { padding-top: 0; }
.problem-list > li > span { color: #ffb66f; font-size: .75rem; }
.problem-list h3 { font-size: 1.15rem; letter-spacing: -.015em; margin-bottom: .55rem; }
.problem-list p { font-size: .9rem; margin-bottom: 0; }
.app-types { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1.5rem; }
.app-types span { font-size: .78rem; color: var(--pb-blue); background: var(--pb-mist); border-radius: .25rem; padding: .5rem .75rem; }
.support-band { position: relative; isolation: isolate; overflow: hidden; padding-block: 3rem; background-color: #101d30; background-image: url('/assets/images/backgrounds/serverroom.jpg'); background-position: center; background-size: cover; border-block: 0; color: #fff; }
.support-band::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(9,21,37,.97), rgba(9,21,37,.86)); }
.support-band h2, .support-band h3, .support-band h3 a { color: #fff; }
.support-band p { color: #bdc9d8; }
.support-band .support-icon { color: #f6a451; }
.support-band h2 { font-size: 1.6rem; }
.support-band h3 { font-size: 1.12rem; letter-spacing: -.015em; }
.support-band p { font-size: .9rem; }
.process-list > li { display: grid; grid-template-columns: 64px 1fr; align-items: start; gap: 2rem; border-top: 1px solid var(--pb-line); padding: 1.6rem 0; }
.step-number { font-size: 1.4rem; color: var(--pb-blue); line-height: 1.2; }
.process-list h3 { font-size: 1.2rem; }
.process-list p { font-size: .92rem; margin-bottom: 0; }
.process-footnote { display: flex; justify-content: space-between; gap: 2rem; border-top: 1px solid var(--pb-line); padding-top: 1.5rem; }
.process-footnote p { max-width: 44rem; font-size: .86rem; margin: 0; }
.process-footnote .text-link { flex-shrink: 0; }
.price-grid { border-block: 1px solid #d6cec0; }
.price-column { padding: 2rem; display: flex; flex-direction: column; }
.price-column:first-child { padding-left: 0; }
.price-column:last-child { padding-right: 0; }
.price-column + .price-column { border-left: 1px solid #d6cec0; }
.price-column h3 { font-size: 1.18rem; margin-bottom: 1.2rem; }
.price-caption { margin-bottom: 0; font-size: .82rem; }
.price { color: var(--pb-ink); font-size: 3.1rem; letter-spacing: -.05em; font-weight: 600; margin-bottom: .8rem; line-height: 1.3; }
.price span { font-size: .95rem; letter-spacing: 0; font-weight: 400; }
.price-column > p:not(.price) { font-size: .9rem; }
.price-column .planned-link { margin-top: auto; }
.case-study { border: 1px solid var(--pb-line); border-radius: var(--pb-radius); overflow: hidden; height: 100%; }
.case-image { min-height: 200px; border-radius: 0; border: 0; border-bottom: 1px dashed #aebbcf; background: var(--pb-mist); }
.case-copy { padding: 1.8rem; }
.case-copy .eyebrow { font-size: .65rem; margin-bottom: .8rem; }
.case-copy h3 { font-size: 1.55rem; margin-bottom: 1.5rem; }
.review-section { margin-top: 4rem; padding-top: 3rem; border-top: 1px solid var(--pb-line); }
.review-section h2 { font-size: 2rem; }
.review-placeholder { display: flex; gap: 1.4rem; border: 1px dashed #c6b69d; background: var(--pb-paper); padding: 2rem; border-radius: var(--pb-radius); }
.quote-mark { color: #bc6a23; font-size: 4rem; line-height: 1; font-family: Georgia, serif; }
.review-prompt { font-size: 1.45rem; line-height: 1.3; font-weight: 500; color: var(--pb-ink); }
.review-placeholder p:not(.review-prompt) { font-size: .9rem; }
.review-attribution { display: flex; gap: 1rem; align-items: center; margin-top: 1.5rem; font-size: .82rem; }
.avatar-placeholder { width: 42px; height: 42px; border: 1px dashed #b8ac9a; display: grid; place-items: center; flex-shrink: 0; border-radius: 50%; }
.review-attribution div > span { display: block; font-size: .73rem; color: var(--pb-muted); }
.knowledge-card { display: flex; flex-direction: column; padding: 1.5rem; border: 1px solid #c2cbda; border-radius: var(--pb-radius); background: #fff; }
.knowledge-card h3 { font-size: 1.25rem; line-height: 1.3; margin-bottom: .8rem; }
.knowledge-card p { font-size: .92rem; }
.contact-photograph, .contact-photograph img { display: block; width: 100%; }
.contact-photograph img { height: auto; border-radius: var(--pb-radius); }
.contact-section { border-top: 4px solid var(--pb-orange); }
.contact-preview-note { font-size: .83rem; background: #fff4e7; border-left: 3px solid #e4b680; padding: .8rem 1rem; margin-top: 1.4rem; }
.contact-page-hero { background: radial-gradient(circle at 80% 25%,rgba(60,161,198,.24),transparent 28%),linear-gradient(145deg,#071b30,#123957); }
.contact-page-response { display: grid; gap: .35rem; padding: 1.25rem; border-left: 3px solid var(--pb-orange); color: #e8edf4; background: rgba(255,255,255,.08); }
.contact-page-response strong { color: #fff; }
.contact-option-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; }
.contact-option-card { display: flex; min-width: 0; min-height: 12rem; height: 100%; flex-direction: column; align-items: flex-start; padding: 1.4rem; border: 1px solid #28435f; border-radius: 1rem; color: #fff; background: #17334e; text-decoration: none; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease,background-color .2s ease; }
.contact-option-card:hover,.contact-option-card:focus-visible { color: #fff; border-color: var(--pb-orange); background: #1d4261; box-shadow: 0 .8rem 2rem rgba(7,27,48,.18); transform: translateY(-3px); }
.contact-option-card .icon { margin-bottom: 1.2rem; color: #ffad66; font-size: 1.5rem; }
.contact-option-card > span:not(.visually-hidden) { color: #fff; font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.contact-option-card strong { margin-top: .35rem; overflow-wrap: anywhere; font-size: 1rem; }
.contact-social-card:hover { color: #fff; border-color: #28435f; background: #17334e; box-shadow: none; transform: none; }
.contact-social-links { display: flex; gap: .5rem; margin-top: 1rem; }
.contact-social-links a { display: grid; width: 2.4rem; height: 2.4rem; place-items: center; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; color: #ffad66; text-decoration: none; }
.contact-social-links a:hover,.contact-social-links a:focus-visible { color: #17334e; border-color: #ffad66; background: #ffad66; }
.contact-app-links { display: flex; gap: 1.5rem; align-items: center; justify-content: space-between; margin-top: 1.5rem; padding: 1.25rem 1.4rem; border: 1px solid var(--pb-line); border-radius: 1rem; background: #fff; }
.contact-app-links p { max-width: 32rem; margin: 0; color: var(--pb-muted); }
.contact-app-links p strong { color: var(--pb-ink); }
.contact-app-links > div { display: flex; gap: .75rem; flex-shrink: 0; }
.contact-app-link { display: flex; gap: .65rem; align-items: center; min-height: 3.4rem; padding: .55rem .9rem; border-radius: .65rem; color: #fff; background: var(--pb-ink); text-decoration: none; }
.contact-app-link:hover,.contact-app-link:focus-visible { color: #fff; background: var(--pb-blue); }
.contact-app-link > i { font-size: 1.45rem; }
.contact-app-link span { display: grid; font-weight: 700; line-height: 1.05; }
.contact-app-link small { font-size: .62rem; font-weight: 400; }
.thank-you-page { display: grid; min-height: 65vh; align-items: center; background: var(--pb-mist); }
.thank-you-panel { max-width: 760px; margin-inline: auto; padding: clamp(2rem,6vw,4.5rem); border-top: 4px solid var(--pb-orange); background: #fff; box-shadow: 0 1.5rem 3.5rem rgba(7,27,48,.1); text-align: center; }
.thank-you-icon { display: grid; width: 4rem; height: 4rem; margin: 0 auto 1.5rem; place-items: center; border-radius: 50%; color: #fff; background: var(--pb-blue); font-size: 1.5rem; }
.thank-you-panel h1 { font-size: clamp(2.2rem,5vw,3.5rem); }
.thank-you-panel .section-intro { max-width: 620px; margin: 0 auto 2rem; color: var(--pb-muted); }
.contact-enquiry-section { background: #fff; }
.contact-form-shell { margin-top: 2rem; padding: clamp(1rem,3vw,2rem); border: 1px solid var(--pb-line); border-radius: 1rem; background: var(--pb-mist); }
.contact-privacy-note { margin-top: 1rem; color: var(--pb-muted); font-size: .83rem; }
.contact-call-panel { position: sticky; top: 8rem; padding: clamp(1.5rem,4vw,2.5rem); border-radius: 1rem; color: #fff; background: var(--pb-ink); }
.contact-call-panel h2,.contact-call-panel h3 { color: #fff; }
.contact-call-panel .eyebrow { color: #ffb66f; }
.contact-call-panel > p:not(.eyebrow),.contact-call-panel li,.contact-call-panel .contact-preparation p { color: #dfe7ef; }
.contact-call-panel .btn { margin-block: 1rem 2rem; }
.contact-preparation { padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.2); }
.contact-preparation h3 { font-size: 1.1rem; }
.contact-preparation ul { padding-left: 1.2rem; }
.powered-by { display:none!important; }
.site-footer { background: var(--pb-ink); color: #fff; padding: 3rem 0 1.25rem; }
.site-footer .brand, .site-footer h2 { color: #fff; }
.footer-top { display: flex; gap: 2rem; align-items: center; padding-bottom: 2.5rem; border-bottom: 1px solid #43505f; }
.footer-top p { margin: 0; color: #c5cedb; font-size: .93rem; }
.footer-actions { display: flex; flex-direction: column; align-items: flex-end; gap: .55rem; margin-left: auto; }
.footer-top .btn { margin-left: 0; }
.footer-knowledge-link { min-height: 36px; color: #fff; font-size: .8rem; }
.footer-directory { padding-block: 2.5rem; }
.footer-directory h2 { font-size: .82rem; letter-spacing: .01em; font-weight: 600; margin-bottom: 1rem; }
.footer-directory ul { margin: 0; }
.site-footer a:not(.btn):not(.brand) { color: #c5cedb; text-decoration: none; }
.site-footer a:hover:not(.btn) { color: #fff; text-decoration: underline; }
.footer-directory li a { display: inline-block; min-height: 36px; font-size: .82rem; padding-block: .25rem; overflow-wrap: anywhere; }
.footer-social-links { display: flex; gap: .5rem; margin-top: .65rem; }
.site-footer .footer-social-links a { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border: 1px solid #5a6674; border-radius: 50%; color: #fff; }
.site-footer .footer-social-links a:hover,.site-footer .footer-social-links a:focus-visible { border-color: var(--pb-orange); color: #fff; background: rgba(255,255,255,.08); text-decoration: none; }
.footer-placeholder, .footer-company-details { color: #bfccd9; font-size: .73rem; margin-top: .7rem; line-height: 1.6; }
.footer-preview { border-block: 1px solid #43505f; padding-block: 1rem; color: #c5cedb; font-size: .74rem; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-top: 1rem; }
.footer-bottom small { color: #c5cedb; font-size: .74rem; flex-shrink: 0; }
.footer-legal { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem 1.3rem; }
.footer-legal > a { display: inline-flex; align-items: center; min-height: 36px; font-size: .74rem; }
.footer-legal .planned-link { font-size: .74rem; font-weight: 400; min-height: 36px; }
.footer-legal .planned-note { color: #d6c5ac; font-size: .7rem; }
.planned-dialog { padding: 0; border: 0; border-top: 4px solid var(--pb-orange); border-radius: var(--pb-radius); max-width: 540px; width: calc(100% - 2rem); color: var(--pb-ink); }
.planned-dialog::backdrop { background: #142137b8; }
.planned-dialog h2 { font-size: 1.8rem; }
.dialog-close { position: absolute; right: .5rem; top: .35rem; background: transparent; border: 0; width: 44px; height: 44px; color: var(--pb-ink); font-size: 1.8rem; }
@media (min-width: 1400px) { .container { max-width: 1240px; } }
@media (max-width: 1199.98px) {
    .site-navigation { gap: 1.2rem; }
    .navigation-links { gap: 1rem; }
    .hero .eyebrow { font-size: .66rem; }
    .video-caption { flex-direction: column; gap: .15rem; }
    .process-footnote { flex-direction: column; gap: .6rem; }
}
@media (max-width: 991.98px) {
    .contact-option-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .contact-call-panel { position: static; }
    .site-navigation { min-height: 78px; padding-block: 1rem; gap: 1rem; }
    .brand img { width: 160px; }
    .menu-toggle { margin-left: auto; }
    #primary-navigation { flex-basis: 100%; }
    .navigation-links { align-items: stretch; margin-left: 0; gap: 0; border-top: 1px solid var(--pb-line); padding-top: .6rem; }
    .navigation-links > .nav-link, .services-menu > .dropdown-toggle { padding: .75rem .25rem; }
    .nav-project-mobile { width: 100%; margin-top: .65rem; }
    .hero { padding-block: 2.5rem; }
    .home-hero { min-height: auto; background-position: 66% center; padding-block: 4rem; }
    .home-hero::before { background: linear-gradient(90deg, rgba(8,18,32,.98), rgba(8,18,32,.82)); }
    h1 { font-size: clamp(2.6rem, 6vw, 3.8rem); }
    .hero-description { max-width: 40rem; }
    .hero-media { max-width: 700px; }
    .hero-note { margin-top: .7rem; }
    .video-caption { flex-direction: row; }
    .credential-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; }
    .service-panel h3 br { display: none; }
    .footer-top { flex-wrap: wrap; }
    .footer-top .btn { margin-left: 0; }
}
@media (max-width: 767.98px) {
    .section-heading { margin-bottom: 1.8rem; }
    .process-list > li { grid-template-columns: 42px 1fr; gap: .7rem 1rem; }
    .price-column { padding: 1.7rem 0; }
    .price-column + .price-column { border-left: 0; border-top: 1px solid #d6cec0; }
    .price { font-size: 2.5rem; }
    .review-section { margin-top: 2.5rem; padding-top: 2rem; }
    .review-placeholder { padding: 1.4rem; gap: .75rem; }
    .case-image { min-height: 160px; }
    .case-copy { padding: 1.3rem; }
    .footer-bottom { flex-direction: column; align-items: flex-start; }
    .footer-legal { gap: .25rem 1rem; }
    .contact-app-links { align-items: flex-start; flex-direction: column; }
    .contact-app-links > div { width: 100%; flex-wrap: wrap; }
}

/* Bespoke and e-commerce website service pages */
.bespoke-web-hero { background: radial-gradient(circle at 78% 25%, rgba(57,161,196,.16), transparent 26%), linear-gradient(145deg,#fff,#edf7fa); }
.custom-browser { overflow: hidden; border: 1px solid rgba(4,61,90,.15); border-radius: 1.35rem; background: #fff; box-shadow: 0 1.6rem 3.8rem rgba(2,48,72,.18); transform: perspective(1100px) rotateY(-3deg); }
.custom-browser-bar { display: flex; gap: .4rem; align-items: center; padding: .85rem 1rem; background: #07374f; }.custom-browser-bar i { width: .62rem; height: .62rem; border-radius: 50%; background: #64a8c2; }.custom-browser-bar span { width: 58%; height: .6rem; margin-left: 1rem; border-radius: 1rem; background: rgba(255,255,255,.18); }
.custom-browser-body { display: grid; grid-template-columns: 105px 1fr; min-height: 365px; }.custom-browser-body aside { display: grid; align-content: start; gap: 1rem; padding: 1.3rem; background: #e8f3f7; }.custom-browser-body aside b { width: 3rem; height: 3rem; border-radius: .8rem; background: #0c7198; }.custom-browser-body aside span { height: .7rem; border-radius: 1rem; background: #b4d2df; }.custom-browser-body > div { padding: 1.5rem; }.custom-browser-heading { display: flex; justify-content: space-between; }.custom-browser-heading span { width: 42%; height: 1.2rem; border-radius: 1rem; background: #174d66; }.custom-browser-heading i { width: 5.5rem; height: 2rem; border-radius: .55rem; background: #f1a449; }.custom-browser-panels { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; margin-top: 1.5rem; }.custom-browser-panels span { height: 82px; border-radius: .8rem; background: linear-gradient(145deg,#edf7fa,#c9e3ed); }.custom-browser-table { display: grid; gap: .65rem; margin-top: 1.2rem; padding: 1.1rem; border: 1px solid #d7e6ec; border-radius: .85rem; }.custom-browser-table i { height: 1.15rem; border-radius: 1rem; background: #d9e8ee; }.custom-browser-table i:nth-child(2) { width: 80%; }.custom-browser-table i:nth-child(3) { width: 92%; }.custom-browser-table i:nth-child(4) { width: 70%; }

.website-spectrum { display: grid; gap: .65rem; }.website-spectrum li { display: grid; grid-template-columns: 2rem 2.8rem 1fr; gap: 0 .8rem; align-items: center; padding: .9rem 1rem; border-left: 4px solid #a8cddc; border-radius: 0 .75rem .75rem 0; background: #f4f9fb; }.website-spectrum li:nth-child(3) { border-color: #08799f; background: #e7f5f9; }.website-spectrum li:nth-child(4) { border-color: #053a56; }.website-spectrum li > span { grid-row: span 2; color: #8198a2; font-size: .72rem; font-weight: 800; }.website-spectrum .icon { grid-row: span 2; color: #0b6c94; }.website-spectrum strong,.website-spectrum small { grid-column: 3; }.website-spectrum small { color: #5c727c; }
.bespoke-web-needs { display: grid; grid-template-columns: repeat(4,1fr); gap: .75rem; margin-top: 2.5rem; }.bespoke-web-needs span { display: flex; gap: .7rem; align-items: center; padding: .9rem; border: 1px solid #d1e1e8; border-radius: .75rem; }.bespoke-web-needs .icon { color: #0b6c94; }
.plugin-balance { display: grid; grid-template-columns: 1fr 120px 1fr; gap: 1.2rem; align-items: center; }.plugin-balance article { height: 100%; padding: 2rem; border: 1px solid #d1e1e8; border-radius: 1rem; background: #fff; }.plugin-balance article > .icon { margin-bottom: 1.1rem; color: #0b6c94; font-size: 1.5rem; }.plugin-balance-scale { position: relative; height: 100px; }.plugin-balance-scale b { position: absolute; left: 50%; top: 50%; width: 3px; height: 70px; background: #0b6c94; transform: translate(-50%,-50%); }.plugin-balance-scale::before { content:""; position:absolute; left:10%; right:10%; top:35%; height:3px; background:#0b6c94; transform:rotate(-5deg); }.plugin-balance-scale span { position:absolute; bottom:3px; width:38px; height:38px; border-radius:50%; background:#9fcddd; }.plugin-balance-scale span:first-child { left:12%; }.plugin-balance-scale span:last-child { right:12%; }
.customer-journey-section { background: radial-gradient(circle at 80% 30%,rgba(42,145,182,.23),transparent 28%),#062d42; }.journey-quality-map { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; }.journey-quality-map span { display: grid; min-height: 110px; place-items: center; align-content: center; gap: .55rem; border: 1px solid rgba(255,255,255,.15); border-radius: .8rem; color: #e9f7fb; background: rgba(255,255,255,.06); }.journey-quality-map .icon { color: #71d2ed; }.journey-quality-map strong { grid-column: 1/-1; padding: 1rem; border-radius: .8rem; color: #062d42; background: #bfe9f5; text-align: center; }.journey-quality-map strong .icon { margin-right: .6rem; color: #096486; }
.functionality-console { display: grid; grid-template-columns: 240px 1fr; gap: 1rem; padding: 1rem; border: 1px solid #cbdfe7; border-radius: 1.2rem; background: #edf6f9; }.functionality-primary { display:grid; place-items:center; align-content:center; min-height:330px; padding:1.5rem; border-radius:1rem; color:#fff; background:linear-gradient(145deg,#0b7299,#063b58); text-align:center; }.functionality-primary .icon { margin-bottom:1rem; font-size:2.1rem; }.functionality-primary span { margin-top:.35rem; color:#c7e9f4; font-size:.85rem; }.functionality-groups { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }.functionality-groups section { padding:1.2rem; border-radius:.9rem; background:#fff; }.functionality-groups h3 { font-size:1rem; }.functionality-groups p { display:flex; flex-wrap:wrap; gap:.45rem; margin:0; }.functionality-groups span { padding:.35rem .55rem; border-radius:2rem; color:#315b6e; background:#e2f0f5; font-size:.82rem; }
.website-integration-hub { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; }.website-integration-hub strong { grid-column:1/-1; padding:1.2rem; border-radius:.8rem; color:#fff; background:#073b58; text-align:center; }.website-integration-hub span { display:grid; min-height:95px; place-items:center; align-content:center; gap:.45rem; border:1px solid #cfdee5; border-radius:.75rem; background:#fff; }.website-integration-hub .icon { color:#0b6c94; }
.platform-comparison { display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem; }.platform-comparison article { padding:clamp(1.5rem,3vw,2.4rem); border:1px solid #d0e1e8; border-radius:1rem; }.platform-comparison article:last-child { background:#edf7fa; }.platform-comparison > article > .icon { margin-bottom:1rem; color:#0b6c94; font-size:1.7rem; }.platform-comparison li + li { margin-top:.6rem; }
.bespoke-web-costs,.commerce-costs { display:grid; grid-template-columns:repeat(2,1fr); gap:.65rem; }.bespoke-web-costs span,.commerce-costs span { display:flex; gap:.6rem; align-items:center; padding:.75rem; border-bottom:1px solid #cfe0e7; }.bespoke-web-costs .icon,.commerce-costs .icon { color:#0b779e; }

.ecommerce-hero { background:radial-gradient(circle at 77% 22%,rgba(244,164,66,.18),transparent 28%),linear-gradient(145deg,#fff,#f0f8fa); }.commerce-device { position:relative; padding-bottom:2rem; }.commerce-device > .commerce-device-bar,.commerce-device-body { border-left:1px solid #cedfe6; border-right:1px solid #cedfe6; }.commerce-device-bar { display:flex; gap:.4rem; align-items:center; padding:.85rem 1rem; border-radius:1.25rem 1.25rem 0 0; background:#07374f; }.commerce-device-bar i { width:.62rem;height:.62rem;border-radius:50%;background:#6ba7bd; }.commerce-device-bar span { width:55%;height:.6rem;margin-left:1rem;border-radius:1rem;background:rgba(255,255,255,.18); }.commerce-device-body { display:grid; grid-template-columns:1.6fr 1fr; min-height:350px; border-bottom:1px solid #cedfe6; border-radius:0 0 1.25rem 1.25rem; background:#fff; box-shadow:0 1.4rem 3rem rgba(3,49,72,.16); }.commerce-products { display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem; padding:1.3rem; }.commerce-products b { grid-column:1/-1; height:1rem; width:42%; border-radius:1rem; background:#174d66; }.commerce-products span { min-height:110px; border-radius:.8rem; background:linear-gradient(145deg,#dfeef3,#adcfdc); }.commerce-device-body aside { padding:1.3rem; background:#eef6f8; }.commerce-device-body aside strong { display:block;margin-bottom:1.2rem; }.commerce-device-body aside i { display:block;height:3rem;margin-bottom:.7rem;border-radius:.6rem;background:#d2e5eb; }.commerce-device-body aside b { display:block;height:1px;margin:1rem 0;background:#aec9d4; }.commerce-device-body aside em { display:block;height:2.2rem;border-radius:.55rem;background:#f0a247; }.commerce-order-card { position:absolute; right:-1rem; bottom:0; display:flex; gap:.8rem; align-items:center; width:220px; padding:1rem; border-radius:.85rem; color:#fff; background:#087b62; box-shadow:0 .8rem 1.8rem rgba(0,65,54,.22); }.commerce-order-card span,.commerce-order-card strong,.commerce-order-card small { display:block; }.commerce-order-card small { color:#d8f5eb; }
.commerce-journey { display:grid; grid-template-columns:repeat(5,1fr); position:relative; margin-top:2.5rem; }.commerce-journey::before { content:""; position:absolute; left:8%;right:8%;top:3.8rem;height:2px;background:linear-gradient(90deg,#a7cbd9,#e99c3b); }.commerce-journey li { position:relative;z-index:1;padding:0 .8rem;text-align:center; }.commerce-journey li > span { color:#8198a2;font-size:.72rem;font-weight:800; }.commerce-journey .icon { display:grid;width:4rem;height:4rem;place-items:center;margin:.65rem auto 1rem;border:.4rem solid #fff;border-radius:50%;color:#fff;background:#0a698f;box-shadow:0 .5rem 1.2rem rgba(2,53,77,.16); }.commerce-journey li:nth-child(4) .icon,.commerce-journey li:nth-child(5) .icon { background:#d88727; }.commerce-journey h3 { font-size:1.05rem; }.commerce-journey p { color:#586e78;font-size:.9rem; }
.commerce-capability-section { background:radial-gradient(circle at 20% 20%,rgba(238,157,57,.2),transparent 27%),#062d42; }.store-system-map { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }.store-system-core { grid-column:1/-1; display:flex; gap:.8rem; align-items:center; justify-content:center; padding:1.2rem;border-radius:.8rem;color:#062d42;background:#f1ae59; }.store-system-map section { padding:1rem 1.1rem;border:1px solid rgba(255,255,255,.15);border-radius:.8rem;background:rgba(255,255,255,.06); }.store-system-map h3 { color:#fff;font-size:1rem; }.store-system-map p { margin:0;color:#cfe7ef;font-size:.9rem; }
.checkout-flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; gap:.55rem;align-items:center; }.checkout-flow span { display:grid;min-height:100px;place-items:center;align-content:center;gap:.5rem;border:1px solid #cbdde4;border-radius:.8rem;background:#fff; }.checkout-flow span .icon { color:#0b6c94;font-size:1.25rem; }.checkout-flow > .icon { color:#d88b2e; }
.commerce-admin { overflow:hidden;border:1px solid #cbdde4;border-radius:1.1rem;background:#f4f9fb;box-shadow:0 1rem 2.4rem rgba(3,55,79,.12); }.commerce-admin header { display:flex;justify-content:space-between;padding:1rem 1.2rem;color:#fff;background:#073b58; }.commerce-admin header span { width:4rem;border-radius:.35rem;background:#e7a24e; }.commerce-admin-stats { display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;padding:1rem; }.commerce-admin-stats span { height:80px;border-radius:.7rem;background:#fff;box-shadow:0 .2rem .7rem rgba(3,55,79,.08); }.commerce-admin-stats i { display:block;padding:.7rem;color:#607883;font-size:.75rem;font-style:normal; }.commerce-admin-list { display:grid;gap:.6rem;padding:0 1rem 1rem; }.commerce-admin-list b { height:1.4rem;border-radius:1rem;background:#d7e7ed; }.commerce-choice { display:grid;grid-template-columns:repeat(2,1fr);gap:1rem; }.commerce-choice article { padding:2rem;border:1px solid #d0e1e8;border-radius:1rem;background:#fff; }.commerce-choice article:last-child { background:linear-gradient(145deg,#fff,#edf7fa); }.commerce-choice .icon { margin-bottom:1rem;color:#0b6c94;font-size:1.5rem; }
.commerce-integration-flow { display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem; }.commerce-integration-flow strong { grid-column:1/-1;padding:1.2rem;border-radius:.8rem;color:#fff;background:#d68729;text-align:center; }.commerce-integration-flow span { display:grid;min-height:95px;place-items:center;align-content:center;gap:.5rem;border:1px solid #cfdee5;border-radius:.8rem;background:#fff; }.commerce-integration-flow .icon { color:#0b6c94; }.website-project-process-dark { border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.16); }.website-project-process-dark li { background:#0b3a52; }.website-project-process-dark li::after { border-color:rgba(255,255,255,.16);background:#0b3a52; }.website-project-process-dark h3 { color:#fff; }.website-project-process-dark p { color:#cce4ec; }.website-project-process-dark .website-process-number { color:#78aabd; }

.compliance-business-details { background:linear-gradient(145deg,#fff,#f4f9fb); }.company-details-card { position:relative;padding:2rem;border:1px solid #cbdde4;border-radius:1rem;background:#fff;box-shadow:0 1rem 2.4rem rgba(3,55,79,.1); }.company-details-tab { position:absolute;right:1rem;top:1rem;padding:.35rem .6rem;border-radius:2rem;color:#0b5d7d;background:#e4f2f7;font-size:.72rem;font-weight:800;text-transform:uppercase; }.company-details-card > .icon { display:grid;width:3rem;height:3rem;place-items:center;margin-bottom:1rem;border-radius:.7rem;color:#fff;background:#0b6c94; }.company-details-card > strong { font-size:1.2rem; }.company-details-card dl { margin:1.4rem 0 0; }.company-details-card dl div { display:grid;grid-template-columns:145px 1fr;gap:1rem;padding:.75rem 0;border-top:1px solid #d8e6eb; }.company-details-card dt { color:#174e66; }.company-details-card dd { margin:0;color:#5b707a; }
.footer-review-section { background:radial-gradient(circle at 85% 15%,rgba(45,153,190,.2),transparent 28%),#062d42; }.footer-check-groups { display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:1rem; }.footer-check-groups section { padding:1.5rem;border:1px solid rgba(255,255,255,.15);border-radius:1rem;background:rgba(255,255,255,.06); }.footer-check-label { display:inline-block;margin-bottom:1rem;padding:.35rem .55rem;border-radius:2rem;color:#062d42;background:#bce7f3;font-size:.7rem;font-weight:800;text-transform:uppercase; }.footer-check-groups h3 { color:#fff;font-size:1.05rem; }.footer-check-groups li { display:flex;gap:.65rem;padding:.5rem 0;color:#d7eaf0; }.footer-check-groups li .icon { width:1.2rem;margin-top:.22rem;color:#70d0ec; }.footer-check-caveat { display:flex;gap:.8rem;margin-top:1rem;padding:1rem;border-radius:.8rem;color:#d8ecf2;background:rgba(255,255,255,.07); }.footer-check-caveat .icon { margin-top:.2rem;color:#70d0ec; }.compliance-vat-selling h2 { font-size:clamp(1.6rem,3vw,2.35rem); }

@media (max-width: 991.98px) {
    .bespoke-web-needs { grid-template-columns:repeat(2,1fr); }.plugin-balance { grid-template-columns:1fr; }.plugin-balance-scale { height:70px;transform:rotate(90deg); }.functionality-console { grid-template-columns:1fr; }.functionality-primary { min-height:170px; }.footer-check-groups { grid-template-columns:1fr; }
    .commerce-journey { grid-template-columns:1fr;gap:.75rem; }.commerce-journey::before { left:2rem;right:auto;top:0;bottom:0;width:2px;height:auto; }.commerce-journey li { display:grid;grid-template-columns:4rem 1fr;gap:0 1rem;text-align:left; }.commerce-journey li > span { display:none; }.commerce-journey .icon { grid-row:span 2;margin:0; }.commerce-journey h3 { margin-top:.45rem; }
}
@media (max-width: 767.98px) {
    .custom-browser { transform:none; }.custom-browser-body { grid-template-columns:62px 1fr;min-height:300px; }.custom-browser-body aside { padding:1rem .7rem; }.custom-browser-body > div { padding:1rem; }.custom-browser-panels { grid-template-columns:1fr; }.custom-browser-panels span { height:48px; }
    .bespoke-web-needs,.journey-quality-map,.functionality-groups,.website-integration-hub,.platform-comparison,.bespoke-web-costs,.commerce-costs,.store-system-map,.commerce-choice,.commerce-integration-flow { grid-template-columns:1fr; }.journey-quality-map strong,.website-integration-hub strong,.store-system-core,.commerce-integration-flow strong { grid-column:1; }
    .commerce-device-body { grid-template-columns:1fr; }.commerce-device-body aside { display:none; }.commerce-order-card { right:0; }.checkout-flow { grid-template-columns:1fr; }.checkout-flow > .icon { transform:rotate(90deg); }.commerce-admin-stats { grid-template-columns:1fr; }.commerce-admin-stats span { height:52px; }.company-details-card dl div { grid-template-columns:1fr;gap:.25rem; }
}
@media (max-width: 575.98px) {
    .container { padding-inline: 1.25rem; }
    .site-contact-strip-inner { justify-content: center; gap: clamp(1.5rem, 12vw, 3rem); min-height: 44px; padding-block: .3rem; }
    .site-contact-strip a { min-height: 44px; border: 1px solid var(--pb-orange); border-radius: .3rem; padding-inline: .8rem; font-size: .78rem; }
    .contact-detail-full { display: none; }
    .contact-detail-short { display: inline; }
    .site-navigation { gap: .55rem; padding-block: .85rem; }
    .brand { padding: .35rem; }
    .brand img { width: 110px; }
    .nav-project-mobile { font-size: .82rem; padding: .7rem; gap: .4rem; min-height: 44px; }
    .nav-project-mobile span { font-size: .95rem; }
    .hero { padding-block: 2rem 1.8rem; }
    .home-hero { padding-block: 3rem; background-position: 61% center; }
    .home-hero::before { background: rgba(8,18,32,.9); }
    .hero .eyebrow { font-size: .64rem; letter-spacing: .045em; margin-bottom: 1rem; }
    .accent-dash { width: .8rem; margin-right: .2rem; }
    h1 { font-size: clamp(2.2rem, 8.9vw, 3rem); }
    .hero-description { font-size: 1rem; margin-bottom: 1.1rem; }
    .hero-note { font-size: .75rem; }
    .hero .cta-group { gap: .1rem !important; }
    .hero .cta-group .btn { width: 100%; }
    .hero .cta-group .text-link { font-size: .85rem; }
    .video-caption { flex-direction: column; gap: .1rem; font-size: .72rem; }
    .credential-logo { height: 40px; }
    .credential-label { font-size: .75rem; }
    .credential-award-logo { width: min(100%, 138px); }
    .section-intro { font-size: 1.05rem; }
    .service-panel { padding: 1.35rem; }
    .service-links .planned-link { font-size: .82rem; }
    .service-panel h3 { font-size: 1.8rem; }
    .app-placeholder, .website-placeholder { min-height: 135px; }
    .app-types { gap: .4rem; }
    .app-types span { font-size: .72rem; padding: .4rem .55rem; }
    .contact-section h2 { font-size: 2.2rem; }
    .footer-top { flex-direction: column; align-items: center; gap: 1.2rem; text-align: center; }
    .footer-top p { flex-basis: auto; order: 0; font-size: .85rem; }
    .footer-actions { width: 100%; align-items: flex-start; margin-left: 0; text-align: left; }
    .footer-top .btn { margin-left: 0; font-size: .73rem; padding-inline: .65rem; gap: .35rem; }
}
.portal-interface-row > b { border-radius:.4rem; padding:.5rem .9rem; color:#fff; background:#48519a; font-size:.8rem; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Knowledge Centre: editorial buyer guidance with stable article-indexing hooks. */
.knowledge-article-header { padding-block: clamp(3rem, 6vw, 5.5rem); background: linear-gradient(145deg, #f7fafc 0%, #eef3fa 58%, #fff7ed 100%); }
.knowledge-article-header h1 { max-width: 16ch; }
.knowledge-article-summary { max-width: 760px; color: #31445a; font-size: clamp(1.15rem, 2vw, 1.38rem); line-height: 1.55; }
.knowledge-category-hero { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(3.5rem,7vw,6rem); color: #fff; background: linear-gradient(125deg,#081a2c 0%,#102d49 60%,#173d5c 100%); }
.knowledge-category-hero::before { position: absolute; z-index: -1; width: min(46vw,620px); aspect-ratio: 1; right: -8%; top: -70%; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; background: radial-gradient(circle at 42% 45%,rgba(234,121,30,.23),rgba(234,121,30,0) 64%); box-shadow: 0 0 0 72px rgba(255,255,255,.025),0 0 0 144px rgba(255,255,255,.018); content: ""; }
.knowledge-category-hero h1 { color: #fff; }
.knowledge-category-hero .eyebrow { color: #ffb16f; }
.knowledge-category-hero .knowledge-hero-intro { max-width: 760px; color: #dce9f2; font-size: clamp(1.15rem,2vw,1.38rem); line-height: 1.55; }
.knowledge-category-hero .breadcrumb-item,
.knowledge-category-hero .breadcrumb-item.active,
.knowledge-category-hero .breadcrumb-item::before { color: #b9cad7; }
.knowledge-category-hero .breadcrumb-item a { color: #fff; }
.knowledge-home .knowledge-hero { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(390px, 48vw, 560px); padding-block: clamp(4.5rem, 9vw, 7.5rem); color: #fff; background: linear-gradient(125deg, #081a2c 0%, #102d49 58%, #173d5c 100%); }
.knowledge-home .knowledge-hero::before { position: absolute; z-index: -1; width: min(52vw, 680px); aspect-ratio: 1; right: -8%; top: -42%; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; background: radial-gradient(circle at 40% 45%, rgba(234,121,30,.28), rgba(234,121,30,0) 63%); box-shadow: 0 0 0 80px rgba(255,255,255,.025), 0 0 0 160px rgba(255,255,255,.018); content: ""; }
.knowledge-home .knowledge-hero::after { position: absolute; z-index: -1; inset: 0; opacity: .13; background-image: linear-gradient(rgba(255,255,255,.2) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.2) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg, transparent 35%, #000); content: ""; }
.knowledge-hero-inner { position: relative; }
.knowledge-home .knowledge-hero-copy { max-width: 820px; }
.knowledge-home .knowledge-hero h1 { max-width: 12ch; color: #fff; font-size: clamp(3rem, 7vw, 6.4rem); }
.knowledge-home .knowledge-hero .eyebrow { color: #ffb16f; }
.knowledge-home .knowledge-hero-intro { max-width: 720px; margin: 1.5rem 0 0; color: #e2edf5; font-size: clamp(1.2rem, 2.2vw, 1.55rem); line-height: 1.55; }
.knowledge-future-ask[hidden] { display: none; }
.knowledge-section-heading { max-width: 760px; margin-bottom: 2.5rem; }
.knowledge-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.knowledge-category-card { display: flex; min-height: 270px; flex-direction: column; align-items: flex-start; padding: clamp(1.5rem, 3vw, 2.2rem); color: #fff; background: #17334e; text-decoration: none; transition: transform .2s ease, background-color .2s ease; }
.knowledge-category-card:nth-child(even) { background: #234d6d; }
.knowledge-category-card:hover { color: #fff; background: #0d2942; transform: translateY(-3px); }
.knowledge-category-icon { display: grid; width: 3.25rem; height: 3.25rem; margin-bottom: 2rem; place-items: center; color: #fff; background: var(--pb-orange); }
.knowledge-category-copy strong,
.knowledge-category-copy span { display: block; }
.knowledge-category-copy strong { margin-bottom: .65rem; color: #fff; font-size: 1.45rem; }
.knowledge-category-copy span { color: #d6e2eb; line-height: 1.55; }
.knowledge-category-route { display: flex; gap: .5rem; align-items: center; margin-top: auto; padding-top: 1.5rem; color: #ffc28e; font-size: .78rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.knowledge-editorial-list { border-top: 1px solid #cbd4e0; }
.knowledge-editorial-row { display: grid; grid-template-columns: minmax(220px, .9fr) 1.35fr auto; gap: 1.25rem; align-items: baseline; padding-block: 1.5rem; border-bottom: 1px solid #cbd4e0; }
.knowledge-editorial-row h3,
.knowledge-editorial-row p { margin: 0; }
.knowledge-editorial-row h3 { font-size: 1.18rem; }
.knowledge-question-list { max-width: 980px; margin: 0; padding: 0; border-top: 1px solid var(--pb-line); list-style: none; counter-reset: knowledge-question; }
.knowledge-question-list li { counter-increment: knowledge-question; }
.knowledge-question-list a { display: grid; grid-template-columns: 3.5rem 1fr auto; gap: 1rem; align-items: center; padding: 1.35rem 0; border-bottom: 1px solid var(--pb-line); color: var(--pb-ink); text-align: left; text-decoration: none; }
.knowledge-question-list a::before { content: counter(knowledge-question, decimal-leading-zero); color: #7d8b9b; font-size: .78rem; font-weight: 800; }
.knowledge-question-list span { font-size: clamp(1.05rem, 2vw, 1.25rem); font-weight: 650; }
.knowledge-question-list .icon { color: var(--pb-orange); }
.knowledge-latest-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(1.5rem,3vw,2.5rem); }
.knowledge-latest-article { display: flex; min-width: 0; flex-direction: column; border-top: 3px solid var(--pb-blue); }
.knowledge-latest-image { display: block; aspect-ratio: 16/9; overflow: hidden; background: var(--pb-mist); }
.knowledge-latest-image img { width: 100%; height: 100%; object-fit: cover; }
.knowledge-latest-copy { display: flex; flex: 1; flex-direction: column; padding-top: 1.25rem; }
.knowledge-latest-category { align-self: flex-start; color: var(--pb-blue); font-size: .76rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.knowledge-latest-article h3 { margin-block: .75rem; font-size: 1.3rem; }
.knowledge-latest-article h3 a { color: inherit; }
.knowledge-latest-article p { color: var(--pb-muted); font-size: .94rem; }
.knowledge-latest-article footer { display: flex; justify-content: flex-end; align-items: center; margin-top: auto; padding-top: 1rem; }
.knowledge-latest-article footer > a { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; color: #fff; background: var(--pb-blue); }
.knowledge-category-hero h1 { display: flex; gap: 1rem; align-items: center; max-width: none; }
.knowledge-category-hero h1 > .icon { color: #ff9b45; font-size: .7em; }
.knowledge-category-total { color: #dce9f2; }
.knowledge-category-total strong { display: block; color: #ffad66; font-size: 2.5rem; line-height: 1; }
.knowledge-featured-article { display: grid; grid-template-columns: minmax(260px,.8fr) minmax(0,1.2fr); max-width: 1080px; background: #fff; }
.knowledge-featured-article > div { display: flex; flex-direction: column; justify-content: center; padding: clamp(1.6rem,4vw,3rem); }
.knowledge-featured-article-no-image { grid-template-columns: 1fr; max-width: 880px; border-left: 5px solid var(--pb-orange); }
.knowledge-featured-image { display: block; min-height: 310px; overflow: hidden; background: #dfe6ef; }
.knowledge-featured-image img { width: 100%; height: 100%; object-fit: cover; }
.knowledge-category-page[data-category="case-studies"] .knowledge-featured-image { background: #fff; }
.knowledge-category-page[data-category="case-studies"] .knowledge-featured-image img { padding: 1rem; object-fit: contain; }
.knowledge-featured-article h2 { font-size: clamp(1.8rem,3.2vw,2.5rem); }
.knowledge-featured-article h2 a { color: inherit; }
.knowledge-article-link-row { display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: flex-end; align-items: center; margin-top: 1rem; }
.knowledge-category-article-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: clamp(2rem,5vw,4.5rem); border-top: 1px solid var(--pb-line); }
.knowledge-category-article { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1.25rem; align-items: center; min-height: 220px; padding-block: 1.6rem; border-bottom: 1px solid var(--pb-line); color: var(--pb-ink); text-decoration: none; transition: background-color .2s ease; }
.knowledge-category-article.has-image { grid-template-columns: 120px minmax(0,1fr) auto; }
.knowledge-category-article:hover { color: var(--pb-ink); background: var(--pb-mist); }
.knowledge-category-article-image { display: block; align-self: stretch; min-height: 150px; overflow: hidden; background: var(--pb-mist); }
.knowledge-category-article-image img { width: 100%; height: 100%; object-fit: cover; }
.knowledge-category-page[data-category="case-studies"] .knowledge-category-article-image { background: #fff; }
.knowledge-category-page[data-category="case-studies"] .knowledge-category-article-image img { padding: .5rem; object-fit: contain; }
.knowledge-latest-image-contain { background: #fff; }
.knowledge-latest-image-contain img { padding: .75rem; object-fit: contain; }
.knowledge-category-article-copy { display: flex; min-width: 0; flex-direction: column; }
.knowledge-category-article-copy strong { color: var(--pb-ink); font-size: 1.28rem; line-height: 1.25; }
.knowledge-category-article-copy > span { margin-top: .65rem; color: var(--pb-muted); font-size: .94rem; line-height: 1.55; }
.knowledge-category-article-arrow { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; color: #fff; background: var(--pb-blue); }
.knowledge-empty-state { padding: 2.5rem; border-left: 4px solid var(--pb-orange); background: var(--pb-paper); }
.knowledge-empty-state > .icon { margin-bottom: 1rem; color: var(--pb-blue); font-size: 1.6rem; }
.knowledge-service-strip { padding-block: 2.5rem; border-top: 1px solid var(--pb-line); background: var(--pb-paper); }
.knowledge-service-strip .container { display: flex; gap: 2rem; justify-content: space-between; align-items: center; }
.knowledge-service-strip h2 { margin: 0; font-size: 1.45rem; }
.knowledge-service-strip nav { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.knowledge-service-strip nav a { font-weight: 700; }
.knowledge-reading-width { max-width: 900px; }
.knowledge-article-labels { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 1.25rem; }
.knowledge-article-labels a,
.knowledge-article-labels span,
.knowledge-article-labels strong { padding: .3rem .55rem; color: #42556c; background: #fff; font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.knowledge-article-labels strong { color: #8b4200; background: #fff0dc; }
.knowledge-preview-notice { display: flex; gap: 1rem; margin: 2.5rem 0; padding: 1.2rem 1.35rem; border-left: 4px solid var(--pb-orange); background: #fff5e8; }
.knowledge-preview-notice .icon { margin-top: .25rem; color: #9b4c00; }
.knowledge-preview-notice p { margin: .25rem 0 0; }
.knowledge-article-hero-image { overflow: hidden; margin: clamp(2rem,5vw,3.5rem) 0 2.5rem; aspect-ratio: 16/9; background: var(--pb-mist); }
.knowledge-article-hero-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.knowledge-direct-answer { margin-block: 2.5rem; padding: clamp(1.5rem,4vw,2.5rem); border-top: 4px solid var(--pb-blue); background: var(--pb-mist); }
.knowledge-direct-answer h2 { font-size: 1.65rem; }
.knowledge-direct-answer p:last-child { margin: 0; color: #27394f; font-size: 1.12rem; }
.knowledge-key-takeaways { margin-block: 2.5rem; padding: 1.5rem 1.7rem; border: 1px solid var(--pb-line); }
.knowledge-key-takeaways h2 { font-size: 1.3rem; }
.knowledge-key-takeaways li + li { margin-top: .55rem; }
.knowledge-article-body { padding-block: 1rem 3.5rem; }
.knowledge-article-body > section { margin-block: 2.8rem; }
.knowledge-article-body h2,
.knowledge-references h2 { font-size: clamp(1.65rem,3vw,2.1rem); }
.knowledge-article-body h3 { margin-top: 2rem; }
.knowledge-article-body p,
.knowledge-article-body li { font-size: 1.04rem; line-height: 1.75; }
.knowledge-article-callout { margin-block: 2.5rem; padding: 1.3rem 1.5rem; border-left: 4px solid var(--pb-orange); background: var(--pb-paper); }
.knowledge-article-callout p { margin: .35rem 0 0; }
.knowledge-checklist { padding-left: 0; list-style: none; }
.knowledge-checklist li { position: relative; padding: .7rem 0 .7rem 2rem; border-bottom: 1px solid var(--pb-line); }
.knowledge-checklist li::before { position: absolute; left: 0; color: var(--pb-orange); font-weight: 800; content: "✓"; }
.knowledge-process { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; margin: 1.5rem 0; padding: 0; background: var(--pb-line); list-style: none; counter-reset: knowledge-process; }
.knowledge-process li { padding: 1.25rem; background: #fff; counter-increment: knowledge-process; }
.knowledge-process li::before { display: block; margin-bottom: .75rem; color: var(--pb-orange); font-size: .75rem; font-weight: 800; content: "0" counter(knowledge-process); }
@media (min-width: 992px) {
    .knowledge-article[data-article-slug="app-development-timescale"] .knowledge-process { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .knowledge-article[data-article-slug="integration-vs-bespoke-software"] .knowledge-process { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .knowledge-article[data-article-slug="website-pricing-calculator-cost"] .knowledge-process,
    .knowledge-article[data-article-slug="signs-too-much-manual-admin"] .knowledge-process,
    .knowledge-article[data-article-slug="uk-business-website-legal-pages"] .knowledge-process { grid-template-columns: repeat(6,minmax(0,1fr)); }
    .knowledge-article[data-article-slug="website-pricing-calculator-cost"] .knowledge-process > li,
    .knowledge-article[data-article-slug="signs-too-much-manual-admin"] .knowledge-process > li,
    .knowledge-article[data-article-slug="uk-business-website-legal-pages"] .knowledge-process > li { grid-column: span 2; }
    .knowledge-article[data-article-slug="website-pricing-calculator-cost"] .knowledge-process > li:nth-last-child(-n+2),
    .knowledge-article[data-article-slug="signs-too-much-manual-admin"] .knowledge-process > li:nth-last-child(-n+2),
    .knowledge-article[data-article-slug="uk-business-website-legal-pages"] .knowledge-process > li:nth-last-child(-n+2) { grid-column: span 3; }
}
.knowledge-table-wrap { overflow-x: auto; margin-block: 1.5rem; -webkit-overflow-scrolling: touch; }
.knowledge-table-wrap table { width: 100%; min-width: 620px; border-collapse: collapse; }
.knowledge-table-wrap th,
.knowledge-table-wrap td { padding: .9rem; border: 1px solid var(--pb-line); text-align: left; vertical-align: top; }
.knowledge-table-wrap thead th { color: #fff; background: #243f75; }
.knowledge-table-wrap tbody th { background: var(--pb-mist); }
.knowledge-article[data-article-slug="when-to-replace-spreadsheets"] .spreadsheet-cost-calculator { margin-block: 1.75rem; padding: clamp(1.25rem,4vw,2.25rem); border-top: 4px solid var(--pb-orange); background: var(--pb-ink); color: #fff; }
.spreadsheet-cost-calculator__intro { max-width: 720px; }
.spreadsheet-cost-calculator__intro h3 { margin-top: 0; color: #fff; }
.spreadsheet-cost-calculator__intro .eyebrow { color: #ffb66f; }
.spreadsheet-cost-calculator__intro p:not(.eyebrow),
.spreadsheet-cost-calculator__note { color: #d6deea; }
.spreadsheet-cost-calculator__controls { display: grid; gap: 1.4rem; margin-block: 1.75rem; }
.spreadsheet-cost-calculator__control { padding: 1rem; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.055); }
.spreadsheet-cost-calculator__label,
.spreadsheet-cost-calculator__range { display: flex; justify-content: space-between; gap: 1rem; }
.spreadsheet-cost-calculator__label { align-items: baseline; margin-bottom: .8rem; }
.spreadsheet-cost-calculator__label label { font-weight: 750; }
.spreadsheet-cost-calculator__label output { flex: 0 0 auto; color: #ffb66f; font-weight: 800; }
.spreadsheet-cost-calculator__range { margin-top: .45rem; color: #b9c5d5; font-size: .75rem; }
.spreadsheet-cost-calculator input[type="range"] { --range-progress: 0%; width: 100%; height: 1.5rem; margin: 0; appearance: none; background: transparent; cursor: pointer; }
.spreadsheet-cost-calculator input[type="range"]::-webkit-slider-runnable-track { height: .4rem; border-radius: 999px; background: linear-gradient(90deg,var(--pb-orange) 0 var(--range-progress),#75839a var(--range-progress) 100%); }
.spreadsheet-cost-calculator input[type="range"]::-moz-range-track { height: .4rem; border-radius: 999px; background: #75839a; }
.spreadsheet-cost-calculator input[type="range"]::-moz-range-progress { height: .4rem; border-radius: 999px; background: var(--pb-orange); }
.spreadsheet-cost-calculator input[type="range"]::-webkit-slider-thumb { width: 1.35rem; height: 1.35rem; margin-top: -.47rem; appearance: none; border: 3px solid #fff; border-radius: 50%; background: var(--pb-orange); box-shadow: 0 0 0 1px #192944; }
.spreadsheet-cost-calculator input[type="range"]::-moz-range-thumb { width: 1.05rem; height: 1.05rem; border: 3px solid #fff; border-radius: 50%; background: var(--pb-orange); box-shadow: 0 0 0 1px #192944; }
.spreadsheet-cost-calculator input[type="range"]:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
.spreadsheet-cost-calculator__results { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-block: 1.75rem; background: rgba(255,255,255,.22); }
.spreadsheet-cost-calculator__results div { padding: 1.1rem; background: #263b61; }
.spreadsheet-cost-calculator__results span,
.spreadsheet-cost-calculator__results strong { display: block; }
.spreadsheet-cost-calculator__results span { color: #cbd5e3; font-size: .78rem; font-weight: 750; text-transform: uppercase; }
.spreadsheet-cost-calculator__results strong { margin-top: .35rem; color: #fff; font-size: clamp(1.35rem,3vw,2rem); line-height: 1.2; }
.spreadsheet-cost-calculator__note { margin-bottom: 0; font-size: .9rem !important; }
.knowledge-article[data-article-slug="bespoke-vs-off-the-shelf"] .software-route-tool { margin-block: 1.75rem; padding: clamp(1.25rem,4vw,2.25rem); border-top: 4px solid var(--pb-blue); background: var(--pb-mist); }
.software-route-tool__intro { max-width: 720px; }
.software-route-tool__intro h3 { margin-top: 0; }
.software-route-tool__questions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin-block: 1.5rem; }
.software-route-tool__questions label { display: flex; min-width: 0; flex-direction: column; gap: .5rem; padding: 1rem; border: 1px solid #cdd6e2; background: #fff; color: var(--pb-ink); font-weight: 750; }
.software-route-tool__questions select { width: 100%; min-height: 2.8rem; padding: .55rem 2.2rem .55rem .7rem; border: 1px solid #8290a3; border-radius: 0; background-color: #fff; color: var(--pb-ink); font: inherit; font-weight: 500; }
.software-route-tool__questions select:focus-visible { outline: 3px solid var(--pb-orange); outline-offset: 2px; }
.software-route-tool__result { padding: 1.25rem; border-left: 4px solid #75839a; background: #fff; }
.software-route-tool__result[data-outcome="buy"] { border-left-color: #377e58; }
.software-route-tool__result[data-outcome="hybrid"] { border-left-color: var(--pb-blue); }
.software-route-tool__result[data-outcome="build"] { border-left-color: var(--pb-orange); }
.software-route-tool__result[data-outcome="mixed"] { border-left-color: #8263a8; }
.software-route-tool__result > span { color: var(--pb-muted); font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.software-route-tool__result h4 { margin: .35rem 0 .5rem; font-size: clamp(1.25rem,2.5vw,1.65rem); }
.software-route-tool__result p { margin-bottom: .65rem; }
.software-route-tool__result small { color: var(--pb-muted); }
.software-route-tool__method { margin-top: 1rem; border-top: 1px solid #cdd6e2; }
.software-route-tool__method summary { padding-block: .85rem; cursor: pointer; font-weight: 750; }
.software-route-tool__method p { margin-bottom: 0; font-size: .9rem; }
.knowledge-article[data-article-slug="signs-too-much-manual-admin"] .manual-admin-assessment { margin-block: 1.75rem; padding: clamp(1.25rem,4vw,2.25rem); border-top: 4px solid var(--pb-orange); background: var(--pb-ink); color: #fff; }
.manual-admin-assessment__intro { max-width: 740px; }
.manual-admin-assessment__intro h3 { margin-top: 0; color: #fff; }
.manual-admin-assessment__intro p:not(.eyebrow) { color: #d6deea; }
.manual-admin-assessment__form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.manual-admin-assessment__options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin-block: 1.5rem; background: rgba(255,255,255,.2); }
.manual-admin-assessment__options label { display: flex; gap: .8rem; align-items: flex-start; min-width: 0; padding: 1rem; background: #263b61; color: #fff; cursor: pointer; }
.manual-admin-assessment__options input { flex: 0 0 auto; width: 1.2rem; height: 1.2rem; margin-top: .24rem; accent-color: var(--pb-orange); }
.manual-admin-assessment__options input:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.manual-admin-assessment__result { padding: 1.25rem; border-left: 4px solid #9aa6b8; background: #fff; color: var(--pb-ink); }
.manual-admin-assessment__result[data-outcome="several"] { border-left-color: var(--pb-orange); }
.manual-admin-assessment__result[data-outcome="many"] { border-left-color: #c94d43; }
.manual-admin-assessment__result span,
.manual-admin-assessment__result small { color: var(--pb-muted); font-size: .75rem; font-weight: 750; text-transform: uppercase; }
.manual-admin-assessment__result h4 { margin: .35rem 0; }
.manual-admin-assessment__result p { margin-bottom: .65rem; }
.manual-admin-assessment__result small { display: block; text-transform: none; }
.manual-admin-assessment__method { margin-top: 1rem; border-top: 1px solid rgba(255,255,255,.25); }
.manual-admin-assessment__method summary { padding-block: .85rem; cursor: pointer; font-weight: 750; }
.manual-admin-assessment__method p,
.manual-admin-assessment__next { color: #d6deea; font-size: .9rem !important; }
.manual-admin-assessment__method p { margin-bottom: 0; }
.manual-admin-assessment__next { margin: 1rem 0 0; }
.manual-admin-assessment__next a { color: #ffbd83; }
.knowledge-article[data-article-slug="when-to-automate-business-process"] .automation-priority-matrix { margin-block: 2rem; padding: clamp(1.25rem,4vw,2.25rem); border-top: 4px solid var(--pb-blue); background: var(--pb-mist); }
.automation-priority-matrix__intro { max-width: 760px; }
.automation-priority-matrix__intro h3 { margin-top: 0; }
.automation-priority-matrix__rows { display: grid; gap: .75rem; margin-block: 1.5rem 1rem; }
.automation-priority-matrix__row { display: grid; grid-template-columns: minmax(180px,1.4fr) minmax(150px,1fr) minmax(150px,1fr) auto; gap: .75rem; align-items: end; padding: 1rem; border: 1px solid #cdd6e2; background: #fff; }
.automation-priority-matrix__row label { display: flex; min-width: 0; flex-direction: column; gap: .4rem; color: var(--pb-ink); font-size: .82rem; font-weight: 750; }
.automation-priority-matrix__row input,
.automation-priority-matrix__row select { width: 100%; min-height: 2.75rem; padding: .5rem .65rem; border: 1px solid #8290a3; border-radius: 0; background: #fff; color: var(--pb-ink); font: inherit; font-weight: 500; }
.automation-priority-matrix__row input:focus-visible,
.automation-priority-matrix__row select:focus-visible,
.automation-priority-matrix__remove:focus-visible { outline: 3px solid var(--pb-orange); outline-offset: 2px; }
.automation-priority-matrix__remove { min-height: 2.75rem; border: 1px solid #9da8b6; padding: .5rem .75rem; background: #fff; color: #803d35; font-weight: 750; }
.automation-priority-matrix__remove:disabled { color: #8792a0; cursor: not-allowed; }
.automation-priority-matrix__add { margin-top: 0; }
.automation-priority-matrix__limit { display: inline-block; margin: 0 0 0 .8rem; color: var(--pb-muted); font-size: .85rem !important; }
.automation-priority-matrix__chart { position: relative; height: 430px; margin-top: 2rem; padding: 1rem 1rem 3rem 3.5rem; }
.automation-priority-matrix__quadrants,
.automation-priority-matrix__points { position: absolute; inset: 1rem 1rem 3rem 3.5rem; }
.automation-priority-matrix__quadrants { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: repeat(2,minmax(0,1fr)); gap: 1px; background: #8290a3; }
.automation-priority-matrix__quadrants div { display: flex; flex-direction: column; justify-content: space-between; padding: 1rem; color: #213650; background: #dcecf2; }
.automation-priority-matrix__quadrants div:nth-child(2) { background: #dbe1f3; }
.automation-priority-matrix__quadrants div:nth-child(3) { background: #edf3f5; }
.automation-priority-matrix__quadrants div:nth-child(4) { background: #eee9e3; }
.automation-priority-matrix__quadrants strong { font-size: .9rem; }
.automation-priority-matrix__quadrants span { font-size: .72rem; }
.automation-priority-matrix__points { pointer-events: none; }
.automation-priority-matrix__points > span { position: absolute; left: var(--matrix-x); top: var(--matrix-y); display: grid; width: 2rem; height: 2rem; place-items: center; border: 2px solid #fff; border-radius: 50%; color: #fff; background: var(--pb-orange); box-shadow: 0 2px 8px rgba(7,27,48,.35); font-size: .8rem; font-weight: 800; transform: translate(calc(-50% + var(--matrix-offset-x)),calc(-50% + var(--matrix-offset-y))); }
.automation-priority-matrix__axis { position: absolute; color: #526176; font-size: .7rem; font-weight: 750; text-transform: uppercase; }
.automation-priority-matrix__axis--x { right: 1rem; bottom: .7rem; left: 3.5rem; text-align: center; }
.automation-priority-matrix__axis--y { left: 0; top: 50%; width: 15rem; text-align: center; transform: translate(-44%,-50%) rotate(-90deg); }
.automation-priority-matrix__summary { margin-bottom: 1rem; }
.automation-priority-matrix__summary caption { padding-bottom: .65rem; color: var(--pb-ink); font-weight: 750; text-align: left; }
.automation-priority-matrix__note { margin-bottom: 0; color: var(--pb-muted); font-size: .9rem !important; }
.knowledge-comparison-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin-block: 1.5rem; background: var(--pb-line); }
.knowledge-comparison-grid > section { padding: 1.4rem; background: #fff; }
.knowledge-article-figure { margin-block: 2.5rem; }
.knowledge-article-figure img { display: block; width: 100%; height: auto; }
.knowledge-article-figure figcaption { padding-top: .65rem; color: var(--pb-muted); font-size: .84rem; }
.knowledge-article-faq { margin-block: 2.5rem; border-bottom: 1px solid var(--pb-line); }
.knowledge-article-faq details { border-top: 1px solid var(--pb-line); }
.knowledge-article-faq summary { padding-block: 1rem; cursor: pointer; font-weight: 700; }
.knowledge-case-summary { margin-block: 2.5rem; padding: 1.5rem; background: var(--pb-mist); }
.knowledge-case-summary dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 0; }
.knowledge-case-summary dt { color: var(--pb-muted); font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.knowledge-case-summary dd { margin: .25rem 0 0; }
.knowledge-references { padding-block: 2.5rem; border-top: 1px solid var(--pb-line); }
.knowledge-references li + li { margin-top: .8rem; }
.knowledge-references span { display: block; color: var(--pb-muted); font-size: .83rem; }
.knowledge-article-footer { padding-block: clamp(3rem,5vw,4.5rem); background: #f2f4f8; }
.knowledge-related-links { display: grid; gap: 1px; background: var(--pb-line); }
.knowledge-related-links a { display: grid; grid-template-columns: 100px 1fr auto; gap: 1rem; align-items: center; padding: 1rem 1.1rem; color: var(--pb-ink); background: #fff; text-decoration: none; }
.knowledge-related-links span { color: #6a7788; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.knowledge-related-links .icon { color: var(--pb-orange); }
.knowledge-related-service { padding: 1.5rem; border-top: 4px solid var(--pb-orange); background: #fff; }
.knowledge-related-service h2 { font-size: 1.45rem; }

@media (max-width: 991.98px) {
    .knowledge-category-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .knowledge-editorial-row { grid-template-columns: 1fr auto; }
    .knowledge-editorial-row p { grid-column: 1 / -1; grid-row: 2; }
    .knowledge-latest-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .knowledge-category-article-list { grid-template-columns: 1fr; }
    .knowledge-service-strip .container { align-items: flex-start; flex-direction: column; }
    .knowledge-process { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .knowledge-article[data-article-slug="website-pricing-calculator-cost"] .knowledge-process > li:last-child,
    .knowledge-article[data-article-slug="integration-vs-bespoke-software"] .knowledge-process > li:last-child,
    .knowledge-article[data-article-slug="signs-too-much-manual-admin"] .knowledge-process > li:last-child,
    .knowledge-article[data-article-slug="uk-business-website-legal-pages"] .knowledge-process > li:last-child { grid-column: 1 / -1; }
    .automation-priority-matrix__row { grid-template-columns: 1fr 1fr; }
    .automation-priority-matrix__row label:first-child { grid-column: 1 / -1; }
}
@media (max-width: 767.98px) {
    .knowledge-category-grid,
    .knowledge-comparison-grid,
    .knowledge-case-summary dl { grid-template-columns: 1fr; }
    .knowledge-editorial-row { grid-template-columns: 1fr; gap: .65rem; }
    .knowledge-editorial-row p,
    .knowledge-editorial-row > .text-link { grid-column: 1; }
    .knowledge-latest-grid { grid-template-columns: 1fr; }
    .knowledge-featured-article { grid-template-columns: 1fr; }
    .knowledge-featured-image { min-height: 230px; }
    .spreadsheet-cost-calculator__results { grid-template-columns: 1fr; }
    .software-route-tool__questions { grid-template-columns: 1fr; }
    .manual-admin-assessment__options { grid-template-columns: 1fr; }
    .automation-priority-matrix__row { grid-template-columns: 1fr; }
    .automation-priority-matrix__row label:first-child { grid-column: auto; }
    .automation-priority-matrix__remove { justify-self: start; }
    .automation-priority-matrix__chart { height: 360px; padding-left: 2.5rem; }
    .automation-priority-matrix__quadrants,
    .automation-priority-matrix__points { left: 2.5rem; }
    .automation-priority-matrix__quadrants div { padding: .65rem; }
    .automation-priority-matrix__quadrants strong { font-size: .75rem; }
    .automation-priority-matrix__quadrants span { font-size: .62rem; }
    .automation-priority-matrix__axis--x { left: 2.5rem; }
    .automation-priority-matrix__axis--y { left: -.55rem; }
    .knowledge-related-links a { grid-template-columns: 1fr auto; }
    .knowledge-related-links span { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
    .contact-option-grid { grid-template-columns: 1fr; }
    .contact-option-card { min-height: 10rem; }
    .knowledge-process { grid-template-columns: 1fr; }
    .knowledge-article[data-article-slug="website-pricing-calculator-cost"] .knowledge-process > li:last-child,
    .knowledge-article[data-article-slug="integration-vs-bespoke-software"] .knowledge-process > li:last-child,
    .knowledge-article[data-article-slug="signs-too-much-manual-admin"] .knowledge-process > li:last-child,
    .knowledge-article[data-article-slug="uk-business-website-legal-pages"] .knowledge-process > li:last-child { grid-column: auto; }
    .knowledge-home .knowledge-hero { min-height: 360px; }
    .knowledge-home .knowledge-hero::before { width: 440px; right: -55%; top: -20%; }
    .knowledge-category-card { min-height: 235px; }
    .knowledge-category-icon { width: 2.75rem; height: 2.75rem; margin-bottom: 1.5rem; }
    .knowledge-question-list a { grid-template-columns: 2.5rem 1fr auto; gap: .7rem; }
    .knowledge-category-article.has-image { grid-template-columns: minmax(0,1fr) auto; }
    .knowledge-category-article-image { display: none; }
    .knowledge-category-page[data-category="case-studies"] .knowledge-category-article.has-image { grid-template-columns: 72px minmax(0,1fr) auto; gap: .75rem; }
    .knowledge-category-page[data-category="case-studies"] .knowledge-category-article-image { display: block; align-self: center; min-height: 72px; aspect-ratio: 1; }
    .knowledge-category-article { min-height: 180px; }
    .knowledge-service-strip nav { display: grid; gap: .75rem; }
}

/* Service-page additions reuse the homepage's colours, grid and spacing. */
.service-page .service-page-nav h2 { font-size: 1.5rem; }
.service-page .service-page-nav a { padding-block: .55rem; border-top: 1px solid var(--pb-line); font-size: .92rem; }
.service-page .service-topic { border-top: 2px solid var(--pb-line); padding-top: 1.3rem; }
.service-page .service-topic h3 { font-size: 1.25rem; }
.service-page .service-topic p { font-size: .95rem; }
#website-options .service-topic { padding: 1.5rem; border: 1px solid #c9d7ec; border-top: 4px solid var(--pb-blue); border-radius: .8rem; background: #edf2fb; box-shadow: 0 18px 35px -30px #101d30; }
.service-page .service-copy-list { padding-left: 1.2rem; color: var(--pb-muted); }
.service-page .service-copy-list li { margin-bottom: .65rem; }
.service-page .service-copy-list strong { color: var(--pb-ink); }
.service-page .service-process > li { grid-template-columns: 64px 1fr 1fr; }
.service-page .service-customer-part { border-left: 2px solid #f2ca9e; padding-left: 1.25rem; }
.service-page .service-customer-part strong { display: block; color: var(--pb-ink); margin-bottom: .3rem; }
.service-page .service-resource-links { display: flex; flex-direction: column; align-items: flex-start; border-top: 1px solid #d6cec0; padding-top: 1rem; }
.service-page .service-case-image { min-height: 260px; border: 0; border-radius: 0; }
.service-page .service-case-story dt { margin-top: .75rem; }
.service-page .service-case-story dd { color: var(--pb-muted); }
.service-faq,
.accordion-list { border-bottom: 1px solid var(--pb-line); }
.service-faq details,
.accordion-list details { border-top: 1px solid var(--pb-line); }
.service-faq summary,
.accordion-list summary { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; list-style: none; cursor: pointer; font-weight: 600; padding: 1.2rem .85rem; transition: background-color .2s ease, color .2s ease; }
.service-faq summary::-webkit-details-marker,
.accordion-list summary::-webkit-details-marker { display: none; }
.service-faq summary::after,
.accordion-list summary::after { content: "+"; flex: 0 0 auto; color: var(--pb-blue); font-size: 1.35rem; font-weight: 400; line-height: 1; }
.service-faq summary .icon,
.accordion-list summary .icon { display: none; }
.service-faq summary:hover,
.accordion-list summary:hover,
.service-faq summary:focus-visible,
.accordion-list summary:focus-visible { color: var(--pb-blue); background: rgba(46, 76, 153, .055); }
.service-faq summary:focus-visible,
.accordion-list summary:focus-visible { outline: 3px solid rgba(46, 76, 153, .28); outline-offset: -3px; }
.service-faq details[open] summary,
.accordion-list details[open] summary { color: var(--pb-blue); background: rgba(46, 76, 153, .055); }
.service-faq details[open] summary::after,
.accordion-list details[open] summary::after { content: "\2212"; }
.service-faq details > div,
.accordion-list details > div,
.accordion-list details > p { max-width: 48rem; padding: 0 3rem .9rem .85rem; }
.service-faq details p:last-child,
.accordion-list details p:last-child { margin-bottom: 0; }
@media (max-width: 767.98px) {
    .service-page .service-process > li { grid-template-columns: 42px 1fr; }
    .service-page .service-customer-part { grid-column: 2; }
}

/* Website-service narrative: scoped additions leave existing pages unchanged. */
.website-page .website-hero-copy { max-width: 52rem; margin-bottom: 1.6rem; }
.website-page .website-page-links { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; border-top: 1px solid #d6cec0; padding-top: 1rem; margin-top: 2rem; }
.website-page .website-page-links a { display: inline-flex; align-items: center; min-height: 44px; font-size: .88rem; }
.website-page .website-service-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 2rem; }
.website-page .website-service-list > div { border-top: 1px solid var(--pb-line); padding-top: 1rem; }
.website-page .website-service-list dt { font-size: 1.08rem; margin-bottom: .5rem; }
.website-page .website-service-list dd { color: var(--pb-muted); font-size: .95rem; margin: 0; }
.website-page .website-fit-note { border-top: 1px solid var(--pb-line); padding-top: 1.5rem; margin-top: 1.5rem; }
@media (max-width: 575.98px) {
    .website-page .website-service-list { grid-template-columns: 1fr; }
}

/* Bootstrap dropdowns retain the established service hierarchy and close one another automatically. */
.services-menu { position: relative; }
.services-menu > .dropdown-toggle { color: var(--pb-ink); font-size: .87rem; font-weight: 600; white-space: nowrap; }
.services-menu > .dropdown-toggle:hover, .services-menu > .dropdown-toggle:focus, .services-menu > .dropdown-toggle.show { color: var(--pb-blue); }
.services-menu > .dropdown-toggle::after { transition: transform .2s ease; }
.services-menu > .dropdown-toggle.show::after { transform: rotate(180deg); }
.services-menu-links { position: absolute; top: 100%; left: 0; width: 19rem; padding: .65rem; background: white; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); box-shadow: 0 12px 24px -16px #17233766; }
.services-menu-links a { display: block; padding: .65rem; color: var(--pb-ink); font-size: .9rem; font-weight: 600; text-decoration: none; }
.services-menu-links a:hover { background: var(--pb-mist); text-decoration: underline; }
@media (min-width: 992px) and (max-width: 1399.98px) {
    .site-navigation { gap: 1rem; }
    .navigation-links { gap: .85rem; }
    .navigation-phone { display: none; }
}
@media (max-width: 991.98px) {
    .services-menu { width: 100%; }
    .services-menu-links { position: static !important; width: 100%; box-shadow: none; border: 0; border-left: 2px solid var(--pb-line); border-radius: 0; padding: 0 .5rem; transform: none !important; }
}
/* Pricing Calculators: reuse the service-page system with a working example. */
.calculator-jump-links { display: flex; flex-wrap: wrap; gap: .7rem 1.7rem; border-top: 1px solid var(--pb-line); padding-top: 1.4rem; margin-top: 2rem; font-size: .9rem; }
.calculator-demo-panel { padding: clamp(1.25rem, 3vw, 2rem); background: white; border-top: 4px solid var(--pb-blue); border-radius: var(--pb-radius); }
.calculator-demo-result { border-top: 1px solid var(--pb-line); padding-top: 1rem; }
.calculator-demo-result strong { display: block; font-size: clamp(1.5rem, 3vw, 2.5rem); line-height: 1.3; color: var(--pb-blue); margin-block: .3rem; }
.calculator-error { color: #a32920; font-size: .9rem; }
.calculator-error:empty { display: none; }
.calculator-flow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.5rem; margin-bottom: 0; }
.calculator-flow li { border-top: 2px solid var(--pb-line); padding-top: 1rem; }
.calculator-flow h3 { font-size: 1.1rem; margin-top: .8rem; }
.calculator-flow p { font-size: .92rem; margin-bottom: 0; }
@media (max-width: 991.98px) {
    .calculator-flow { grid-template-columns: 1fr; gap: 1rem; }
    .calculator-flow li { display: grid; grid-template-columns: 3rem 1fr; column-gap: 1rem; }
    .calculator-flow h3 { margin-top: .3rem; }
    .calculator-flow p { grid-column: 2; }
}

/* Visual refinement: image-led compositions and a more varied editorial rhythm. */
.visual-background { position: relative; isolation: isolate; background-position: center; background-size: cover; }
.visual-background::before { content: ""; position: absolute; z-index: -1; inset: 0; background: rgba(18, 31, 48, .9); }
.problems-background { background-image: url('/assets/images/projectsbackground.jpg'); }
.problems-background::before { background: linear-gradient(90deg, rgba(18, 31, 48, .97), rgba(18, 31, 48, .86)); }
.app-problems-background { background-image: url('/assets/images/backgrounds/homepagebackground2.jpg'); background-position: center 44%; }
.app-problems-background::before { background: linear-gradient(90deg, rgba(18, 31, 48, .97), rgba(18, 31, 48, .86)); }
.website-purpose-background { background-image: url('/assets/images/aboutus_discussion.jpg'); background-position: center 58%; }
.website-purpose-background::before { background: linear-gradient(90deg, rgba(18, 31, 48, .96), rgba(18, 31, 48, .84)); }
.calculator-qualification-background { background-image: url('/assets/images/onboarding-questionnaire.jpg'); background-position: center; }
.calculator-qualification-background::before { background: linear-gradient(90deg, rgba(18, 31, 48, .96), rgba(18, 31, 48, .88)); }
.infrastructure-background { background-image: url('/assets/images/backgrounds/serverroom.jpg'); }
.infrastructure-background::before { background: linear-gradient(90deg, rgba(18, 31, 48, .96), rgba(18, 31, 48, .82)); }

.service-visual, .editorial-image, .hero-product-visual, .wide-interface-visual { position: relative; overflow: hidden; background: #dfe5ed; }
.service-visual img, .editorial-image img, .hero-product-visual img, .wide-interface-visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.service-visual { margin-top: auto; min-height: 190px; border-radius: .25rem; box-shadow: 0 18px 34px -26px #152238aa; }
.service-visual img { aspect-ratio: 16 / 9; }
.hero-product-visual { border-radius: .2rem; box-shadow: 0 28px 55px -32px #142137aa; transform: translateY(.4rem); }
.hero-product-visual img { aspect-ratio: 3 / 2; }
.website-hero-visual img { aspect-ratio: 1.36 / 1; }
.editorial-image { border-radius: .2rem; box-shadow: 0 24px 50px -35px #142137aa; }
.editorial-image img { aspect-ratio: 4 / 3; }
.editorial-image-tall img { aspect-ratio: 4 / 5; object-position: 56% center; }
.app-explainer .row { min-height: 30rem; }
.app-explainer-image { width: min(78%, 36rem); margin-top: 2rem; margin-left: auto; }
.app-explainer-image::before { content: ""; position: absolute; inset: 1.5rem -2rem -1.5rem 2rem; z-index: -1; background: var(--pb-mist); }

.support-background { position: relative; isolation: isolate; color: #fff; background: url('/assets/images/backgrounds/serverroom.jpg') center / cover no-repeat; border: 0; padding-block: clamp(2.6rem, 4vw, 4rem); }
.support-background::before { content: ""; position: absolute; z-index: -1; inset: 0; background: rgba(18, 31, 48, .9); }
.support-background h2, .support-background h3 { color: #fff; }
.support-background p { color: #cdd5df; }
.support-background .support-icon { color: #ffb66f; }
.support-background .col-md-4 { border-left: 1px solid rgba(255, 255, 255, .18); padding-left: 1.5rem; }

.process-editorial .process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 5vw, 5rem); counter-reset: steps; }
.process-editorial .process-list > li { grid-template-columns: 3.5rem 1fr; min-height: 10rem; }
.process-editorial .process-list > li:nth-child(-n+2) { border-top: 3px solid var(--pb-blue); }
.process-editorial .step-number { font-size: 2rem; color: rgba(46, 76, 153, .45); }

.service-page-nav-inline { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem 1.4rem; border-top: 1px solid #d6cec0; padding-top: 1.15rem; margin-top: 2.5rem; }
.service-page .service-page-nav-inline > span { color: var(--pb-muted); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.service-page .service-page-nav-inline a { border: 0; min-height: 42px; display: inline-flex; align-items: center; padding: .35rem 0; }
.comparison-split { border-block: 1px solid var(--pb-line); }
.comparison-column { padding: clamp(1.5rem, 3vw, 2.5rem); }
.comparison-split > div:first-child .comparison-column { padding-left: 0; padding-right: clamp(1.5rem, 4vw, 4rem); }
.comparison-split > div + div .comparison-column { border-left: 1px solid var(--pb-line); padding-right: 0; padding-left: clamp(1.5rem, 4vw, 4rem); }
.comparison-label { display: inline-block; margin-bottom: 1rem; padding: .25rem .55rem; background: var(--pb-blue); color: #fff; font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.service-page .service-process { position: relative; }
.service-page .service-process > li { border-top-color: #c7d0dc; }
.service-page .service-process .step-number { font-size: 1.8rem; color: rgba(46, 76, 153, .55); }

/* App development: varied visual treatments built from the existing content. */
.app-types-intro { margin-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.app-types-visual { position: relative; overflow: hidden; background: var(--pb-mist); box-shadow: 1.25rem 1.25rem 0 #e4e9f1; }
.app-types-visual img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.app-type-grid .service-topic { display: grid; grid-template-columns: 1.75rem 1fr; column-gap: .8rem; align-content: start; padding-top: 1.15rem; }
.app-type-grid .service-topic > .icon { grid-row: 1 / span 2; margin-top: .15rem; color: var(--pb-blue); font-size: 1.15rem; }
.app-type-grid .service-topic h3 { font-size: 1.05rem; margin-bottom: .55rem; letter-spacing: -.015em; }
.app-type-grid .service-topic p { grid-column: 2; font-size: .84rem; line-height: 1.55; }
.app-type-links { display: flex; flex-wrap: wrap; gap: .75rem; }
.app-type-links .text-link { gap: .75rem; min-height: 44px; padding: .65rem 1rem; border: 1px solid var(--pb-blue); border-radius: 999px; color: #fff; background: var(--pb-blue); text-decoration: none; }
.app-type-links .text-link:hover { border-color: #243c7a; color: #fff; background: #243c7a; }
.app-type-links .text-link:focus-visible { outline: 3px solid rgba(46,76,153,.3); outline-offset: 2px; }

.app-comparison { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); background: var(--pb-line); border-block: 1px solid var(--pb-line); }
.comparison-option { padding: clamp(1.75rem, 4vw, 3rem); }
.comparison-buy { background: #f7f3ec; }
.comparison-build { background: #e8eef8; }
.comparison-kicker { display: flex; align-items: center; gap: .65rem; color: var(--pb-blue); font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.comparison-kicker .icon { font-size: 1.2rem; }
.comparison-option h3 { max-width: 21ch; font-size: clamp(1.35rem, 2vw, 1.75rem); margin-bottom: 1.5rem; }
.comparison-option ul { margin-bottom: 1.5rem; }
.comparison-option li { display: flex; align-items: flex-start; gap: .7rem; margin-bottom: .8rem; color: var(--pb-muted); font-size: .91rem; }
.comparison-option li .icon { margin-top: .3rem; color: var(--pb-blue); font-size: .82rem; }
.comparison-tradeoff { padding-top: 1rem; border-top: 1px solid rgba(82,97,116,.25); font-size: .84rem; }
.comparison-versus { position: absolute; z-index: 2; left: 50%; top: 3rem; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border: 1px solid var(--pb-line); border-radius: 50%; background: #fff; color: var(--pb-muted); font-size: .72rem; font-weight: 700; transform: translateX(-50%); }
.comparison-middle-option { display: flex; align-items: flex-start; gap: .9rem; max-width: 58rem; margin-top: 1.5rem; padding-top: 1.5rem; color: var(--pb-muted); }
.comparison-middle-option .icon { margin-top: .3rem; color: var(--pb-orange); }

.app-process-timeline { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 0; }
.app-process-timeline > li { position: relative; min-width: 0; padding-right: clamp(.8rem, 1.6vw, 1.5rem); }
.app-process-timeline > li:not(:last-child)::after { content: ""; position: absolute; z-index: 0; top: 1.5rem; left: 3rem; right: 0; height: 2px; background: linear-gradient(90deg, var(--pb-blue), #9fb1d5); }
.process-marker { position: relative; z-index: 1; display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 1.2rem; border: 2px solid var(--pb-blue); border-radius: 50%; background: #fff; color: var(--pb-blue); }
.process-marker > span { position: absolute; top: -.7rem; right: -.45rem; padding: .05rem .25rem; background: #fff; color: var(--pb-muted); font-size: .62rem; font-weight: 700; }
.process-marker .icon { font-size: 1rem; }
.app-process-timeline h3 { min-height: 2.65rem; padding-right: .4rem; font-size: 1rem; letter-spacing: -.01em; }
.app-process-timeline > li > p:not(.process-customer-part) { font-size: .8rem; line-height: 1.55; }
.process-customer-part { margin: 1rem 0 0; padding: .8rem .7rem; border-left: 2px solid #e8b87d; background: var(--pb-paper); font-size: .74rem; line-height: 1.5; }
.process-customer-part strong { display: block; margin-bottom: .3rem; color: var(--pb-ink); font-size: .66rem; letter-spacing: .06em; text-transform: uppercase; }

.cost-summary { position: relative; overflow: hidden; height: 100%; min-height: 23rem; padding: clamp(1.6rem, 3vw, 2.5rem); background: var(--pb-ink); color: #fff; }
.cost-summary::after { content: "£"; position: absolute; right: -1rem; bottom: -3.5rem; color: rgba(255,255,255,.055); font-size: 15rem; font-weight: 700; line-height: 1; }
.cost-summary-icon { display: block; margin-bottom: 3rem; color: #ffb66f; font-size: 2rem; }
.cost-summary .price-caption, .cost-summary .price, .cost-summary .small { position: relative; z-index: 1; color: #fff; }
.cost-summary .placeholder-label, .cost-summary .planned-note { position: relative; z-index: 1; color: #d9c4a8; }
.cost-summary .price { font-size: clamp(3.5rem, 7vw, 5.5rem); }
.cost-details > h3 { margin-bottom: 1.25rem; }
.cost-factor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 2rem; margin-bottom: 1.5rem; }
.cost-factor-grid li { display: grid; grid-template-columns: 1.5rem 1fr; gap: .7rem; padding: 1rem 0; border-top: 1px solid #d6cec0; color: var(--pb-muted); font-size: .87rem; }
.cost-factor-grid li > .icon { margin-top: .25rem; color: var(--pb-orange); }
.cost-factor-grid strong { display: block; color: var(--pb-ink); }
.cost-aftercare { display: grid; grid-template-columns: 2rem 1fr; gap: 1rem; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 2px solid var(--pb-blue); }
.cost-aftercare > .icon { margin-top: .3rem; color: var(--pb-blue); font-size: 1.25rem; }
.cost-aftercare h3 { font-size: 1.15rem; }
.cost-aftercare p { font-size: .88rem; }

.app-aftercare-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.app-aftercare-grid article { padding: 1.2rem; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.07); }
.app-aftercare-grid .icon { margin-bottom: .75rem; color: #ffb66f; font-size: 1.2rem; }
.app-aftercare-grid h3 { color: #fff; font-size: 1.05rem; }
.app-aftercare-grid p { margin: 0; color: #d4deea; font-size: .86rem; }

.content-principles-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.content-principles-grid article { padding: 1.15rem; border-top: 2px solid var(--pb-blue); background: rgba(255,255,255,.7); }
.content-principles-grid h3 { font-size: 1.02rem; }
.content-principles-grid p { margin: 0; font-size: .9rem; }

.app-timescale-section .row { align-items: center; }
.timescale-spectrum { margin-top: 2rem; padding: 1.25rem 0; border-block: 1px solid #c7d0dc; }
.timescale-spectrum > div { display: grid; grid-template-columns: 9rem 1fr; align-items: center; gap: 1rem; margin: .85rem 0; }
.timescale-spectrum span { color: var(--pb-ink); font-size: .76rem; font-weight: 600; }
.timescale-spectrum i { display: block; height: .55rem; border-radius: 1rem; background: linear-gradient(90deg, var(--pb-blue), #7f9ad2); }
.timescale-spectrum > div:nth-child(1) i { width: 38%; }
.timescale-spectrum > div:nth-child(2) i { width: 67%; }
.timescale-spectrum > div:nth-child(3) i { width: 100%; background: linear-gradient(90deg, var(--pb-blue), var(--pb-orange)); }
.resource-list .knowledge-card { border: 0; border-top: 2px solid var(--pb-blue); border-radius: 0; padding: 1.4rem 0; background: transparent; }
.resource-list > div:nth-child(3n+2) .knowledge-card { border-top-color: var(--pb-orange); }
.resource-guide-link { gap: .55rem; text-decoration: none; }
.resource-guide-link > span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .1em; }
.knowledge-editorial .knowledge-card { border: 0; border-top: 2px solid var(--pb-blue); border-radius: 0; padding: 1.4rem 0; background: transparent; }

@media (max-width: 767.98px) {
    .app-aftercare-grid,
    .content-principles-grid { grid-template-columns: 1fr; }
}

.calculator-hero-panel { position: relative; overflow: hidden; padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--pb-ink); color: #fff; box-shadow: 1.25rem 1.25rem 0 #e4e9f1; }
.calculator-hero-panel h2 { color: #fff; font-size: clamp(1.5rem, 2.5vw, 2.1rem); }
.calculator-hero-panel p { color: #c5cedb; }
.calculator-hero-panel .eyebrow { color: #ffb66f; }
.calculator-hero-panel .text-link { color: #fff; }
.calculator-symbol { position: absolute; right: -1rem; top: -1rem; display: grid; place-items: center; width: 6rem; height: 6rem; border-radius: 50%; background: rgba(241, 137, 37, .2); color: #ffb66f; font-size: 2.2rem; }
.calculator-demo-section { background-image: linear-gradient(rgba(46, 76, 153, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(46, 76, 153, .055) 1px, transparent 1px); background-size: 32px 32px; }
.calculator-demo-panel { box-shadow: 0 22px 45px -32px #142137aa; }
.wide-interface-visual { margin: 0 0 3rem; border-radius: .2rem; box-shadow: 0 28px 55px -38px #142137bb; }
.wide-interface-visual img { height: auto; object-fit: contain; }
.calculator-flow { position: relative; }
.calculator-flow::before { content: ""; position: absolute; left: 0; right: 0; top: 1px; height: 2px; background: linear-gradient(90deg, var(--pb-blue), var(--pb-orange)); }
.calculator-flow li { position: relative; border-top: 0; padding-top: 1.5rem; }
.calculator-flow li::before { content: ""; position: absolute; top: -4px; left: 0; width: 10px; height: 10px; border-radius: 50%; background: var(--pb-orange); }

/* Booking systems: connected journeys, operational rules and administration. */
.booking-hero-visual { box-shadow: 1.25rem 1.25rem 0 rgba(169,193,255,.18); }
.booking-hero-visual img { object-position: center; }
.booking-friction-section { background: #142137; }
.booking-friction-section h2 { color: #fff; }
.booking-friction-section p { color: #cbd5e2; }
.booking-friction-section .eyebrow { color: #ffb66f; }
.booking-friction-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-block: 1px solid rgba(255,255,255,.18); }
.booking-friction-grid > div { display: grid; grid-template-columns: 1.6rem 1fr; align-items: center; gap: .75rem; min-height: 4.2rem; padding: .8rem 1rem .8rem 0; border-bottom: 1px solid rgba(255,255,255,.13); color: #f5f7fb; font-size: .9rem; }
.booking-friction-grid > div:nth-child(even) { padding-left: 1.2rem; border-left: 1px solid rgba(255,255,255,.13); }
.booking-friction-grid .icon { color: #ffb66f; }
.booking-friction-answer { margin-top: 1.5rem; padding-left: 1rem; border-left: 3px solid var(--pb-orange); font-size: 1.05rem; }
.booking-capabilities-section { overflow: hidden; }
.booking-capability-map { display: grid; grid-template-columns: minmax(0,1fr) 13rem minmax(0,1fr); align-items: center; gap: 2rem; min-height: 25rem; padding: clamp(1.5rem,4vw,3.5rem); background: linear-gradient(135deg,#f8f5ef,#edf2fa); border: 1px solid var(--pb-line); }
.booking-capability-core { position: relative; z-index: 2; display: grid; place-items: center; align-content: center; width: 13rem; aspect-ratio: 1; padding: 1rem; border: 2px solid var(--pb-blue); border-radius: 50%; background: var(--pb-ink); box-shadow: 0 0 0 1.2rem rgba(46,76,153,.08); color: #fff; text-align: center; }
.booking-capability-core > .icon { margin-bottom: .8rem; color: #ffb66f; font-size: 2rem; }
.booking-capability-core strong { font-size: 1.1rem; }
.booking-capability-core small { max-width: 10rem; margin-top: .35rem; color: #bec9d8; line-height: 1.35; }
.booking-capability-orbit { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem; }
.booking-capability-orbit span { position: relative; display: flex; align-items: center; gap: .6rem; min-height: 3.2rem; padding: .6rem .8rem; background: #fff; border-left: 3px solid var(--pb-blue); box-shadow: 0 8px 25px -22px #142137; color: var(--pb-ink); font-size: .8rem; font-weight: 600; }
.booking-capability-orbit span .icon { color: var(--pb-blue); }
.booking-capability-orbit-b span { border-left-color: var(--pb-orange); }
.booking-capability-orbit-b span .icon { color: #bc6419; }
.booking-journey { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); }
.booking-journey li { position: relative; min-width: 0; text-align: center; }
.booking-journey li:not(:last-child)::after { content: ""; position: absolute; top: 1.7rem; left: calc(50% + 2.2rem); right: calc(-50% + 2.2rem); height: 2px; background: linear-gradient(90deg,var(--pb-blue),#9aaed6); }
.booking-journey li > span { position: relative; z-index: 1; display: grid; place-items: center; width: 3.5rem; height: 3.5rem; margin: 0 auto 1rem; border: 2px solid var(--pb-blue); border-radius: 50%; background: #fff; color: var(--pb-blue); }
.booking-journey strong { display: block; padding-inline: .3rem; font-size: .84rem; }
.booking-payments-section { overflow: hidden; }
.booking-payment-visual { position: relative; display: grid; place-items: center; min-height: 24rem; background: var(--pb-ink); box-shadow: 1.3rem 1.3rem 0 #e2e8f2; }
.booking-payment-visual::before { content: ""; position: absolute; inset: 1.5rem; border: 1px solid rgba(255,255,255,.12); }
.payment-card { position: relative; z-index: 1; display: grid; align-content: space-between; width: 13rem; aspect-ratio: 1.58; padding: 1.3rem; border-radius: .8rem; background: linear-gradient(135deg,#3f63be,#263d78); box-shadow: 0 22px 45px -18px #000; color: #fff; }
.payment-card .icon { color: #ffb66f; font-size: 1.5rem; }
.payment-card b { font-size: .8rem; letter-spacing: .04em; }
.payment-route { display: flex; gap: .45rem; }
.payment-route i { display: block; width: .45rem; height: .45rem; border-radius: 50%; background: #ffb66f; }
.payment-status { position: absolute; z-index: 2; right: 1rem; bottom: 2rem; padding: .75rem 1rem; background: #fff; box-shadow: 0 14px 25px -16px #000; color: var(--pb-ink); font-size: .76rem; font-weight: 700; }
.payment-status .icon { margin-right: .35rem; color: #237550; }
.booking-dashboard { display: grid; grid-template-columns: 3.4rem 1fr 9rem; min-height: 23rem; overflow: hidden; background: #fff; box-shadow: 0 26px 55px -35px #142137aa; border: 1px solid #d9dfe7; }
.booking-dashboard-nav { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding-top: 1.2rem; background: var(--pb-ink); }
.booking-dashboard-nav span { display: block; width: .55rem; height: .55rem; border-radius: 50%; background: #8795a8; }
.booking-dashboard-nav span:first-child { width: 1.2rem; height: 1.2rem; margin-bottom: 1.3rem; background: var(--pb-orange); }
.booking-dashboard-nav i { width: 1.4rem; height: .2rem; margin-top: auto; margin-bottom: 1.5rem; background: #8795a8; }
.booking-dashboard-main { padding: 1.4rem; }
.booking-dashboard-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.2rem; }
.booking-dashboard-top strong { font-size: .9rem; }
.booking-dashboard-top span { padding: .3rem .55rem; background: var(--pb-mist); color: var(--pb-muted); font-size: .6rem; }
.booking-dashboard-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: .65rem; margin-bottom: 1.3rem; }
.booking-dashboard-stats span { padding: .75rem; background: var(--pb-paper); border-top: 2px solid var(--pb-blue); }
.booking-dashboard-stats small, .booking-dashboard-stats b { display: block; }
.booking-dashboard-stats small { color: var(--pb-muted); font-size: .58rem; }
.booking-dashboard-stats b { margin-top: .15rem; color: var(--pb-ink); font-size: 1.15rem; }
.booking-dashboard-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: .4rem; }
.booking-dashboard-grid i { aspect-ratio: 1.4; background: #e5ebf4; border-left: 3px solid #9cafcf; }
.booking-dashboard-grid .is-booked { background: #fce8d5; border-left-color: var(--pb-orange); }
.booking-dashboard-side { padding: 1.4rem 1rem; background: #eef2f8; }
.booking-dashboard-side strong { display: block; margin-bottom: .7rem; font-size: .7rem; }
.booking-dashboard-side > span { display: block; height: .35rem; margin-bottom: .8rem; border-radius: 1rem; background: #d1d9e5; }
.booking-dashboard-side > span i { display: block; width: var(--usage); height: 100%; border-radius: inherit; background: var(--pb-blue); }
.booking-dashboard-side strong:nth-of-type(2) { margin-top: 2rem; }
.booking-dashboard-side em { display: block; width: 100%; height: .4rem; margin-bottom: .7rem; background: #d1d9e5; }
.booking-dashboard-side em:nth-of-type(2) { width: 76%; }
.booking-dashboard-side em:nth-of-type(3) { width: 88%; }
.booking-fit-comparison { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); background: var(--pb-line); gap: 1px; border-block: 1px solid var(--pb-line); }
.booking-fit-comparison article { display: flex; flex-direction: column; padding: clamp(1.5rem,4vw,3rem); background: var(--pb-paper); }
.booking-fit-comparison article + article { background: #e9eff9; }
.booking-fit-comparison h3 { max-width: 24ch; margin-bottom: 1.4rem; }
.booking-fit-comparison article > ul { flex: 1; }
.booking-fit-comparison li { position: relative; margin-bottom: .65rem; padding-left: 1.35rem; color: var(--pb-muted); }
.booking-fit-comparison li::before { content: ""; position: absolute; top: .65rem; left: 0; width: .45rem; height: .45rem; border-radius: 50%; background: var(--pb-orange); }
.booking-fit-comparison article > p:last-child { margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid rgba(82,97,116,.25); font-size: .85rem; }
.booking-integration-section { overflow: hidden; background: #101d30; }
.booking-integration-section h2 { color: #fff; }
.booking-integration-section p { color: #cad4e0; }
.booking-integration-section .eyebrow { color: #ffb66f; }
.booking-integration-map { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; }
.booking-integration-map > * { display: grid; place-items: center; align-content: center; min-height: 6.5rem; padding: .8rem; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.07); color: #fff; text-align: center; font-size: .74rem; }
.booking-integration-map > strong { grid-row: span 2; min-height: auto; background: var(--pb-blue); font-size: .82rem; }
.booking-integration-map .icon { margin-bottom: .55rem; color: #ffb66f; font-size: 1.3rem; }
.booking-price { margin: 1.8rem 0; padding: 1.5rem; background: var(--pb-ink); }
.booking-price span, .booking-price strong, .booking-price small { display: block; }
.booking-price span { color: #cbd5e2; font-size: .75rem; text-transform: uppercase; letter-spacing: .07em; }
.booking-price strong { color: #fff; font-size: clamp(3rem,7vw,5rem); line-height: 1.15; letter-spacing: -.06em; }
.booking-price small { color: #e8bd8d; }
.booking-cost-factors { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 1.25rem 0 1.5rem; border-top: 1px solid #d6cec0; }
.booking-cost-factors span { display: flex; align-items: center; gap: .6rem; min-height: 4rem; padding: .75rem .5rem .75rem 0; border-bottom: 1px solid #d6cec0; color: var(--pb-ink); font-size: .82rem; font-weight: 600; }
.booking-cost-factors .icon { color: var(--pb-blue); }
.booking-process { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); }
.booking-process li { position: relative; padding-right: 1rem; }
.booking-process li > span { color: var(--pb-orange); font-size: .7rem; font-weight: 700; }
.booking-process li > i { display: block; height: 2px; margin: .8rem 0 1.2rem; background: var(--pb-blue); }
.booking-process li:not(:last-child) > i::after { content: ""; position: absolute; right: .65rem; width: .45rem; height: .45rem; margin-top: -.15rem; border-top: 2px solid var(--pb-blue); border-right: 2px solid var(--pb-blue); transform: rotate(45deg); }
.booking-process h3 { font-size: 1rem; }
.booking-process p { margin: 0; font-size: .78rem; line-height: 1.5; }

.compact-cta { position: relative; isolation: isolate; padding-block: clamp(2.5rem, 4vw, 4rem); background: var(--pb-ink); color: #fff; }
.compact-cta h2 { color: #fff; font-size: clamp(1.9rem, 3vw, 2.65rem); }
.compact-cta p { color: #d1d8e2; }
.compact-cta .eyebrow { color: #ffb66f; margin-bottom: .75rem; }
.compact-cta .btn-primary { --bs-btn-bg: #fff; --bs-btn-border-color: #fff; --bs-btn-color: var(--pb-ink); --bs-btn-hover-bg: #ffe8cd; --bs-btn-hover-border-color: #ffe8cd; --bs-btn-hover-color: var(--pb-ink); }
.app-cta-background { background-image: url('/assets/images/projectsbackground.jpg'); background-position: center; background-size: cover; }
.website-cta-background { background-image: url('/assets/images/backgrounds/contactbackground.jpg'); background-position: center 55%; background-size: cover; }
.app-cta-background::before, .website-cta-background::before { background: rgba(18, 31, 48, .91); }
.calculator-cta { background: linear-gradient(115deg, var(--pb-ink) 0 68%, #263f80 68% 100%); }
.not-found-page { display: grid; align-items: center; min-height: 62vh; padding-block: clamp(3rem, 8vw, 7rem); background: var(--pb-paper); }
.not-found-panel { position: relative; overflow: hidden; min-height: 25rem; padding: clamp(2rem, 5vw, 5rem); background: #fff; border-left: 5px solid var(--pb-orange); box-shadow: 0 28px 60px -45px #142137aa; }
.not-found-number { display: block; color: rgba(46, 76, 153, .09); font-size: clamp(8rem, 16vw, 15rem); font-weight: 800; line-height: .8; letter-spacing: -.09em; }

@media (hover: hover) {
    .service-visual img, .hero-product-visual img, .editorial-image img, .wide-interface-visual img { transition: transform .45s ease; }
    .service-visual:hover img, .hero-product-visual:hover img, .editorial-image:hover img, .wide-interface-visual:hover img { transform: scale(1.018); }
}
@media (max-width: 991.98px) {
    .hero-product-visual { max-width: 44rem; transform: none; }
    .app-explainer .row { min-height: 0; }
    .app-explainer-image { width: 100%; max-width: 34rem; margin-left: 0; }
    .support-background .col-md-4 { border-left: 0; }
    .comparison-split > div + div .comparison-column { border-left: 0; border-top: 1px solid var(--pb-line); }
    .comparison-split > div .comparison-column, .comparison-split > div:first-child .comparison-column, .comparison-split > div + div .comparison-column { padding-inline: 0; }
    .calculator-flow::before, .calculator-flow li::before { display: none; }
    .calculator-flow li { border-top: 1px solid var(--pb-line); }
    .booking-capability-map { grid-template-columns: 1fr; }
    .booking-capability-core { grid-row: 1; justify-self: center; }
    .booking-capability-orbit { grid-template-columns: repeat(3,minmax(0,1fr)); width: 100%; }
    .booking-journey { grid-template-columns: repeat(3,1fr); gap: 2rem 0; }
    .booking-journey li:nth-child(3)::after { display: none; }
    .booking-process { grid-template-columns: repeat(3,1fr); gap: 2rem 0; }
    .booking-process li:nth-child(3) > i::after { display: none; }
}
@media (max-width: 767.98px) {
    .process-editorial .process-list { grid-template-columns: 1fr; }
    .process-editorial .process-list > li:nth-child(2) { border-top: 1px solid var(--pb-line); }
    .service-page-nav-inline { gap: .2rem 1rem; margin-top: 1.5rem; }
    .service-page .service-page-nav-inline > span { flex-basis: 100%; }
    .wide-interface-visual { margin-bottom: 2rem; }
    .wide-interface-visual img { object-position: center; }
    .calculator-cta { background: var(--pb-ink); }
    .booking-friction-grid, .booking-fit-comparison { grid-template-columns: 1fr; }
    .booking-friction-grid > div:nth-child(even) { padding-left: 0; border-left: 0; }
    .booking-capability-orbit { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .booking-dashboard { grid-template-columns: 2.7rem 1fr; min-height: 20rem; }
    .booking-dashboard-side { display: none; }
    .booking-cost-factors { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 575.98px) {
    .service-visual { min-height: 145px; }
    .website-hero-visual img { aspect-ratio: 16 / 10; }
    .editorial-image-tall img { aspect-ratio: 4 / 3; }
    .visual-background, .support-background { background-position: center; }
    .compact-cta .btn { width: 100%; }
    .booking-capability-orbit { grid-template-columns: 1fr; }
    .booking-capability-map { padding-inline: 1rem; }
    .booking-journey { grid-template-columns: repeat(2,1fr); }
    .booking-journey li:nth-child(3)::after { display: block; }
    .booking-journey li:nth-child(even)::after { display: none; }
    .booking-payment-visual { min-height: 20rem; }
    .booking-dashboard-main { padding: 1rem; }
    .booking-dashboard-stats { gap: .3rem; }
    .booking-dashboard-stats span { padding: .55rem; }
    .booking-process { grid-template-columns: 1fr; gap: 0; }
    .booking-process li { display: grid; grid-template-columns: 2rem 1fr; column-gap: .8rem; padding-bottom: 1.2rem; }
    .booking-process li > span { grid-row: 1 / span 2; }
    .booking-process li > i { display: none; }
    .booking-process h3 { margin-bottom: .35rem; }
    .booking-process p { grid-column: 2; }
}

/* Previous work: one shared project pattern for major service pages. */
.previous-work { padding-block: clamp(3.2rem, 5vw, 5rem); background: #fff; border-bottom: 1px solid var(--pb-line); }
.previous-work-heading { margin-bottom: 2rem; }
.previous-work-card { display: flex; overflow: hidden; flex-direction: column; background: var(--pb-paper); border-bottom: 3px solid var(--pb-blue); }
.previous-work-media { position: relative; overflow: hidden; aspect-ratio: 4 / 3; background: #dfe5ed; }
.previous-work-media > img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.75); }
.previous-work-placeholder { display: grid; place-items: center; align-content: center; gap: .8rem; width: 100%; height: 100%; color: #607088; background: linear-gradient(145deg, #edf1f6 0 48%, #e1e7ef 48% 52%, #edf1f6 52%); }
.previous-work-placeholder .icon { font-size: 2rem; color: var(--pb-blue); }
.previous-work-placeholder small { font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.previous-work-copy { display: flex; flex: 1; flex-direction: column; padding: 1.25rem; }
.previous-work-category { margin-bottom: .65rem; color: var(--pb-blue); font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.previous-work-card h3 { font-size: 1.18rem; margin-bottom: .7rem; }
.previous-work-card p:not(.previous-work-category) { font-size: .84rem; }
.previous-work-result { padding-top: .75rem; border-top: 1px solid #d6dce4; }
.previous-work-link { display: inline-flex; align-items: center; align-self: flex-start; gap: .5rem; margin-top: auto; color: #6d6559; font-size: .78rem; font-weight: 600; }

/* Managed hosting page. */
.hosting-hero { overflow: hidden; }
.hosting-hero-visual { position: relative; background: var(--pb-ink); box-shadow: 0 28px 55px -34px #142137aa; }
.hosting-hero-visual > img { display: block; width: 100%; min-height: 22rem; object-fit: cover; }
.hosting-hero-visual figcaption { position: absolute; inset: auto 1.25rem 1.25rem; }
.hosting-hero-visual figcaption a { display: flex; align-items: center; gap: 1rem; padding: .8rem 1rem; background: rgba(18,31,48,.92); color: #fff; text-decoration: none; font-size: .75rem; font-weight: 600; }
.hosting-hero-visual figcaption img { width: 8rem; height: auto; }
.hosting-feature-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.7rem 2.5rem; }
.hosting-feature-grid > div { position: relative; padding: 1.1rem 0 0 2.3rem; border-top: 1px solid var(--pb-line); }
.hosting-feature-grid .icon { position: absolute; left: 0; top: 1.3rem; color: var(--pb-blue); }
.hosting-feature-grid h3 { font-size: 1.05rem; margin-bottom: .35rem; }
.hosting-feature-grid p { margin: 0; font-size: .88rem; }
.plan-number { color: var(--pb-orange); font-size: .7rem; font-weight: 700; letter-spacing: .1em; }
.price-on-request { font-size: clamp(1.65rem,3vw,2.5rem); letter-spacing: -.035em; }
.inclusion-list { border-block: 1px solid #d6cec0; }
.inclusion-list > div { display: grid; grid-template-columns: 1.5rem 1fr auto; align-items: center; gap: .8rem; padding: .9rem 0; border-bottom: 1px solid #ded8cf; }
.inclusion-list > div:last-child { border-bottom: 0; }
.inclusion-list .icon { color: var(--pb-orange); }
.inclusion-list strong { color: #716047; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }
.migration-flow, .quote-flow { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1.5rem; }
.migration-flow li { position: relative; padding-top: 1.25rem; border-top: 2px solid var(--pb-blue); }
.migration-flow li + li::before { content: ""; position: absolute; top: -2px; right: calc(100% + .25rem); width: 1rem; border-top: 2px solid var(--pb-orange); }
.migration-flow span { color: var(--pb-orange); font-size: .72rem; font-weight: 700; }
.migration-flow h3 { margin-top: .65rem; font-size: 1.05rem; }
.migration-flow p { margin: 0; font-size: .84rem; }

/* Central pricing page. */
.pricing-hero { background-image: linear-gradient(120deg, var(--pb-paper) 0 72%, #e7edf7 72% 100%); }
.price-hero-statement { padding: clamp(2rem,5vw,4rem); background: var(--pb-ink); box-shadow: 1.25rem 1.25rem 0 #dfe5ef; }
.price-hero-statement span { color: #ffb66f; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.price-hero-statement strong { display: block; color: #fff; font-size: clamp(4rem,8vw,7rem); line-height: 1; letter-spacing: -.08em; }
.price-hero-statement p { margin: 1rem 0 0; color: #c5cedb; }
.pricing-overview-list { border-block: 1px solid var(--pb-line); }
.pricing-overview-list a { display: grid; grid-template-columns: minmax(13rem,1.3fr) minmax(10rem,1fr) auto 1rem; align-items: center; gap: 1rem; min-height: 5.2rem; color: var(--pb-ink); text-decoration: none; border-bottom: 1px solid var(--pb-line); }
.pricing-overview-list a:last-child { border-bottom: 0; }
.pricing-overview-list a:hover span { color: var(--pb-blue); text-decoration: underline; }
.pricing-overview-list span { font-size: 1.15rem; font-weight: 700; }
.pricing-overview-list small { color: var(--pb-muted); }
.pricing-overview-list strong { color: var(--pb-blue); font-size: 1.6rem; }
.scope-label { color: #ffb66f !important; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.scope-spectrum { margin: 0; border-top: 1px solid rgba(255,255,255,.24); }
.scope-spectrum li { padding: .85rem 0; color: #fff; border-bottom: 1px solid rgba(255,255,255,.16); font-size: 1.05rem; }
.scope-spectrum li::before { content: "+"; margin-right: .8rem; color: #ffb66f; }
.service-price-section .price { margin: 1.2rem 0 0; }
.factor-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-block: 1px solid var(--pb-line); }
.factor-grid span { padding: .9rem 1rem .9rem 0; border-bottom: 1px solid var(--pb-line); color: var(--pb-ink); font-size: .9rem; font-weight: 600; }
.factor-grid span:nth-child(even) { padding-left: 1rem; border-left: 1px solid var(--pb-line); }
.ongoing-cost-list { border-top: 1px solid #d6cec0; }
.ongoing-cost-list li { display: grid; grid-template-columns: 1.5rem 1fr auto; align-items: center; gap: .8rem; padding: .85rem 0; border-bottom: 1px solid #d6cec0; }
.ongoing-cost-list .icon { color: var(--pb-blue); }
.ongoing-cost-list small { color: #716047; font-size: .72rem; }
.quote-flow { counter-reset: quote; }
.quote-flow li { position: relative; min-height: 7rem; padding: 1rem; background: #fff; border-top: 3px solid var(--pb-blue); }
.quote-flow li + li::before { content: "\2192"; position: absolute; left: -1.15rem; top: 2.35rem; color: var(--pb-orange); font-weight: 700; }
.quote-flow span { display: block; margin-bottom: 1rem; color: rgba(46,76,153,.55); font-size: 1.5rem; }
.quote-flow strong { font-size: .88rem; }

/* Concise About page. */
.about-image-caption { position: absolute; left: 1rem; bottom: 1rem; padding: .4rem .65rem; background: rgba(255,255,255,.92); color: var(--pb-ink); font-size: .72rem; font-weight: 600; }
.about-service-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: var(--pb-line); }
.about-service-pair a { display: block; padding: clamp(1.5rem,3vw,2.4rem); background: #fff; color: var(--pb-ink); text-decoration: none; }
.about-service-pair a:hover h3 { color: var(--pb-blue); text-decoration: underline; }
.about-service-pair span { color: var(--pb-orange); font-size: .7rem; font-weight: 700; }
.about-service-pair h3 { margin-top: 1rem; }
.about-service-pair p { margin: 0; font-size: .9rem; }
.about-principles { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(1rem,3vw,2.5rem); }
.about-principles li { padding-top: 1rem; border-top: 2px solid var(--pb-blue); }
.about-principles span { color: var(--pb-orange); font-size: .72rem; font-weight: 700; }
.about-principles h3 { margin-top: 1.2rem; font-size: 1.15rem; }
.about-principles p { margin: 0; font-size: .86rem; }
.about-trust { padding-block: clamp(2.5rem,4vw,4rem); }
.about-trust h2 { color: #fff; font-size: clamp(1.6rem,2.5vw,2.2rem); }
.values-line { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border-block: 1px solid var(--pb-line); }
.values-line > div { padding: 1.4rem; }
.values-line > div:first-child { padding-left: 0; }
.values-line > div + div { border-left: 1px solid var(--pb-line); }
.values-line strong { display: block; margin-bottom: .55rem; color: var(--pb-ink); }
.values-line span { display: block; color: var(--pb-muted); font-size: .82rem; }

@media (max-width: 991.98px) {
    .app-types-visual { max-width: 46rem; }
    .app-comparison { grid-template-columns: 1fr; gap: 1px; }
    .comparison-versus { position: static; justify-self: center; margin-block: -1.3rem; transform: none; }
    .app-process-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.25rem 1.5rem; }
    .app-process-timeline > li:not(:last-child)::after { display: none; }
    .app-process-timeline h3 { min-height: 0; }
    .cost-summary { min-height: 0; }
    .cost-summary-icon { margin-bottom: 1.5rem; }
    .hosting-hero-visual > img { min-height: 18rem; }
    .migration-flow, .quote-flow { grid-template-columns: 1fr; gap: .7rem; }
    .migration-flow li { display: grid; grid-template-columns: 2.5rem 10rem 1fr; gap: 1rem; align-items: baseline; min-height: 0; }
    .migration-flow h3 { margin: 0; }
    .migration-flow li + li::before, .quote-flow li + li::before { display: none; }
    .quote-flow li { min-height: 0; }
    .about-principles { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .values-line { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .values-line > div { border-bottom: 1px solid var(--pb-line); }
}
@media (max-width: 767.98px) {
    .app-types-visual { box-shadow: .75rem .75rem 0 #e4e9f1; }
    .app-type-links { display: grid; grid-template-columns: minmax(0,1fr); }
    .app-type-links .text-link { width: 100%; justify-content: space-between; }
    .comparison-option { padding-inline: 1.35rem; }
    .comparison-middle-option { padding-top: 1.25rem; }
    .app-process-timeline { grid-template-columns: 1fr; gap: 0; padding-left: 0; }
    .app-process-timeline::before { content: ""; position: absolute; top: 1.5rem; bottom: 0; left: 1.45rem; width: 2px; background: #c7d2e5; }
    .app-process-timeline > li { min-height: 0; padding: 0 0 2.25rem 4.25rem; }
    .process-marker { position: absolute; left: 0; top: 0; margin: 0; }
    .process-customer-part { margin-top: .75rem; }
    .cost-factor-grid { grid-template-columns: 1fr; }
    .timescale-spectrum > div { grid-template-columns: 7.5rem 1fr; gap: .75rem; }
    .previous-work .row { --bs-gutter-x: .75rem; }
    .hosting-feature-grid, .factor-grid, .about-service-pair, .about-principles, .values-line { grid-template-columns: 1fr; }
    .inclusion-list > div, .ongoing-cost-list li { grid-template-columns: 1.5rem 1fr; }
    .inclusion-list strong, .ongoing-cost-list small { grid-column: 2; }
    .migration-flow li { grid-template-columns: 2.5rem 1fr; }
    .migration-flow p { grid-column: 2; }
    .pricing-overview-list a { grid-template-columns: 1fr auto; padding-block: .8rem; }
    .pricing-overview-list small { grid-column: 1; }
    .pricing-overview-list strong { grid-column: 2; grid-row: 1 / span 2; }
    .pricing-overview-list .icon { display: none; }
    .factor-grid span:nth-child(even) { padding-left: 0; border-left: 0; }
    .values-line > div, .values-line > div:first-child { padding-inline: 0; border-left: 0; }
}

/* Job management systems: operational queues, connected roles and job progress. */
.job-hero::before { background: linear-gradient(90deg,rgba(8,18,32,.98),rgba(14,36,48,.9)); }
.job-hero-board { overflow: hidden; background: #f4f7fa; border: 1px solid rgba(255,255,255,.3); box-shadow: 1.2rem 1.2rem 0 rgba(73,158,153,.18); color: var(--pb-ink); transform: rotate(-.7deg); }
.job-board-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 3.2rem; padding: .65rem 1rem; background: #fff; border-bottom: 1px solid #dbe2e9; }
.job-board-top > span { display: flex; gap: .3rem; }
.job-board-top > span i { width: .5rem; height: .5rem; border-radius: 50%; background: #aeb9c5; }
.job-board-top > span i:first-child { background: #e88327; }
.job-board-top strong { font-size: .76rem; }
.job-board-top em { justify-self: end; padding: .25rem .5rem; background: #e6efef; color: #376e6b; font-size: .58rem; font-style: normal; }
.job-board-columns { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .65rem; min-height: 19rem; padding: 1rem; }
.job-board-columns > div { min-width: 0; padding: .75rem; background: #e8edf2; border-top: 3px solid #6480a0; }
.job-board-columns > div:nth-child(2) { border-top-color: var(--pb-blue); }
.job-board-columns > div:nth-child(3) { border-top-color: #d77a27; }
.job-board-columns > div:nth-child(4) { border-top-color: #3d8985; }
.job-board-columns span { display: flex; align-items: center; gap: .35rem; color: var(--pb-muted); font-size: .57rem; font-weight: 700; }
.job-board-columns strong { display: block; margin: .7rem 0; font-size: 1.7rem; }
.job-board-columns > div > i { display: block; height: 2.7rem; margin-bottom: .5rem; background: #fff; border-left: 3px solid #b1bdc9; box-shadow: 0 7px 16px -14px #142137; }
.job-source-cloud { position: relative; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .8rem; padding: 2rem; background: var(--pb-mist); }
.job-source-cloud span, .job-source-cloud strong { display: flex; align-items: center; gap: .6rem; min-height: 3.5rem; padding: .75rem; background: #fff; color: var(--pb-ink); font-size: .8rem; box-shadow: 0 12px 25px -23px #142137; }
.job-source-cloud span .icon { color: #5d7693; }
.job-source-cloud strong { grid-column: 2; justify-content: flex-start; background: #286f6b; color: #fff; }
.job-source-cloud strong .icon { color: #ffbd7e; }
.job-capabilities-section { background: #142d3b; }
.job-capabilities-section h2 { color: #fff; }
.job-capabilities-section p { color: #c8d5dc; }
.job-capabilities-section .eyebrow { color: #ffb66f; }
.job-capability-console { display: grid; grid-template-columns: 12rem 1fr; align-items: stretch; gap: 1rem; }
.job-capability-core { display: grid; place-items: center; align-content: center; padding: 1.5rem; background: #286f6b; color: #fff; text-align: center; }
.job-capability-core > .icon { margin-bottom: 1rem; color: #ffd1a6; font-size: 2rem; }
.job-capability-core strong, .job-capability-core small { display: block; }
.job-capability-core small { margin-top: .4rem; color: #d2e4e3; }
.job-capability-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; background: rgba(255,255,255,.15); }
.job-capability-list span { display: grid; grid-template-columns: 1.4rem 1fr; align-items: center; gap: .55rem; min-height: 4.5rem; padding: .8rem; background: rgba(255,255,255,.07); color: #f3f7f8; font-size: .78rem; font-weight: 600; }
.job-capability-list .icon { color: #ffb66f; }
.job-workflow { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.job-workflow li { position: relative; text-align: center; }
.job-workflow li:not(:last-child)::after { content: ""; position: absolute; z-index: 0; top: 3.2rem; left: calc(50% + 2rem); right: calc(-50% + 2rem); height: 2px; background: #77a7a3; }
.job-workflow li > span { display: block; margin-bottom: .65rem; color: #327872; font-size: .65rem; font-weight: 700; }
.job-workflow li > div { position: relative; z-index: 1; display: grid; place-items: center; width: 3.8rem; height: 3.8rem; margin: 0 auto 1rem; border: 2px solid #327872; border-radius: 50%; background: #fff; color: #286f6b; }
.job-workflow strong { display: block; padding: 0 .35rem; font-size: .76rem; }
.job-friction-list { border-block: 1px solid #cdd6e1; }
.job-friction-list li { display: grid; grid-template-columns: 1.5rem 1fr 1.5rem minmax(8rem,.8fr); align-items: center; gap: .75rem; min-height: 4rem; border-bottom: 1px solid #d5dde6; color: var(--pb-muted); font-size: .85rem; }
.job-friction-list li:last-child { border-bottom: 0; }
.job-friction-list li > .icon:first-child { color: #bb671e; }
.job-friction-list li > .icon:nth-child(3) { color: #8290a0; }
.job-friction-list strong { color: #286f6b; font-size: .76rem; }
.job-role-composition { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--pb-line); }
.job-role-composition article { position: relative; padding: clamp(1.4rem,3vw,2.4rem); background: var(--pb-paper); }
.job-role-composition article:nth-child(2) { background: #e7f0ef; }
.job-role-composition article:nth-child(3) { background: #e9eef7; }
.job-role-composition article > div { display: grid; place-items: center; width: 3.2rem; height: 3.2rem; margin-bottom: 2rem; border-radius: 50%; background: #286f6b; color: #fff; }
.job-role-composition article:nth-child(3) > div { background: var(--pb-blue); }
.job-role-composition h3 { font-size: 1.15rem; }
.job-role-composition li { padding: .65rem 0; border-bottom: 1px solid rgba(82,97,116,.2); color: var(--pb-muted); font-size: .82rem; }
.job-trigger-list { border-block: 1px solid #d7cec0; }
.job-trigger-list > div { display: grid; grid-template-columns: minmax(7rem,1fr) 2rem minmax(10rem,1.3fr); align-items: center; gap: 1rem; min-height: 4.4rem; border-bottom: 1px solid #ddd5ca; }
.job-trigger-list > div:last-child { border-bottom: 0; }
.job-trigger-list span { color: var(--pb-muted); }
.job-trigger-list .icon { color: var(--pb-orange); }
.job-trigger-list strong { color: #286f6b; }
.job-integration-wheel { position: relative; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; padding: 1rem; background: #e7f0ef; }
.job-integration-wheel > * { display: grid; place-items: center; align-content: center; min-height: 6rem; padding: .7rem; background: #fff; color: var(--pb-ink); text-align: center; font-size: .7rem; }
.job-integration-wheel > strong { grid-row: span 2; background: #286f6b; color: #fff; font-size: .8rem; }
.job-integration-wheel .icon { margin-bottom: .5rem; color: #327872; font-size: 1.2rem; }
.job-integration-wheel strong .icon { color: #ffd1a6; }
.job-fit-split { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: #cfd8df; }
.job-fit-split article { padding: clamp(1.5rem,4vw,3rem); background: #fff; }
.job-fit-split article + article { background: #e7f0ef; }
.job-fit-split article > .icon { margin-bottom: 1.5rem; color: #286f6b; font-size: 1.5rem; }
.job-fit-split h3 { font-size: 1.35rem; }
.job-fit-split ul { margin: 1.4rem 0 0; padding-left: 1.1rem; }
.job-fit-split li { margin-bottom: .65rem; padding-left: .25rem; color: var(--pb-muted); }
.job-price-panel { margin: 1.5rem 0; padding: 1.5rem; background: #16313f; }
.job-price-panel span, .job-price-panel strong, .job-price-panel small { display: block; }
.job-price-panel span { color: #c7d7dc; font-size: .7rem; letter-spacing: .07em; text-transform: uppercase; }
.job-price-panel strong { color: #fff; font-size: clamp(3rem,7vw,5rem); line-height: 1.1; letter-spacing: -.07em; }
.job-price-panel small { color: #ffd1a6; }
.job-cost-spectrum { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 1.3rem 0 1.5rem; border-top: 1px solid #d7cec0; }
.job-cost-spectrum span { display: flex; align-items: center; gap: .6rem; min-height: 4rem; padding: .7rem .4rem .7rem 0; border-bottom: 1px solid #d7cec0; color: var(--pb-ink); font-size: .82rem; font-weight: 600; }
.job-cost-spectrum .icon { color: #327872; }
.job-process { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); border-top: 2px solid #327872; }
.job-process li { position: relative; padding: 1.4rem .8rem 0 0; }
.job-process li:not(:last-child)::after { content: ""; position: absolute; top: -5px; right: .5rem; width: .5rem; height: .5rem; border-top: 2px solid #327872; border-right: 2px solid #327872; transform: rotate(45deg); }
.job-process span, .job-process strong, .job-process small { display: block; }
.job-process span { margin-bottom: 1rem; color: #327872; font-size: .68rem; font-weight: 700; }
.job-process strong { font-size: .85rem; }
.job-process small { margin-top: .35rem; color: var(--pb-muted); line-height: 1.4; }

/* Supporting services: artboard-inspired layouts for real work to replace. */
.supporting-hero { background-image: linear-gradient(120deg,#101d30,#2e2856) !important; }
.supporting-hero::before { background: linear-gradient(90deg,rgba(12,20,35,.94),rgba(37,25,60,.72)); }
.supporting-artboard { position: relative; min-height: 25rem; overflow: hidden; background: linear-gradient(135deg,#f5e9dd,#dce5f7); box-shadow: 1.2rem 1.2rem 0 rgba(255,255,255,.12); }
.supporting-artboard::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(46,76,153,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(46,76,153,.07) 1px,transparent 1px); background-size: 28px 28px; }
.artboard-sheet, .artboard-post, .artboard-swatch { position: absolute; display: block; background: #fff; box-shadow: 0 22px 40px -24px #172337; }
.artboard-sheet { width: 12rem; height: 15rem; padding: 1.2rem; }
.artboard-sheet-a { left: 8%; top: 13%; transform: rotate(-7deg); background: #f18a27; }
.artboard-sheet-a i { display: block; height: 1rem; margin-bottom: .65rem; background: rgba(255,255,255,.9); }
.artboard-sheet-a i:nth-child(1) { width: 48%; height: 5rem; margin-left: auto; }
.artboard-sheet-a i:nth-child(2) { width: 75%; }
.artboard-sheet-a i:nth-child(3) { width: 55%; }
.artboard-sheet-b { right: 9%; top: 8%; transform: rotate(6deg); background: #263d78; color: #fff; }
.artboard-sheet-b b { display: block; margin-bottom: 4rem; font-family: Georgia,serif; font-size: 3.5rem; }
.artboard-sheet-b i { display: block; width: 80%; height: .45rem; margin-top: .6rem; background: #ffb66f; }
.artboard-sheet-b i:last-child { width: 52%; background: rgba(255,255,255,.65); }
.artboard-post { z-index: 2; left: 38%; bottom: 8%; width: 10rem; height: 10rem; padding: 1rem; transform: rotate(2deg); }
.artboard-post > i { display: block; height: 5rem; margin-bottom: .7rem; background: linear-gradient(145deg,#d9e3f5 50%,#f7d9bd 50%); }
.artboard-post b { display: block; width: 80%; height: .35rem; margin-bottom: .35rem; background: #8e9bae; }
.artboard-post b:nth-of-type(2) { width: 55%; }
.artboard-post em { position: absolute; right: .8rem; bottom: .7rem; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: var(--pb-orange); }
.artboard-swatch { right: 5%; bottom: 8%; display: flex; gap: .35rem; padding: .6rem; }
.artboard-swatch i { width: 1.1rem; height: 1.1rem; border-radius: 50%; background: #263d78; }
.artboard-swatch i:nth-child(2) { background: #f18a27; }
.artboard-swatch i:nth-child(3) { background: #8a579b; }
.artboard-swatch i:nth-child(4) { background: #dfbd91; }
.supporting-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-rows: 10rem; gap: .8rem; }
.supporting-gallery > div { display: grid; place-items: center; align-content: center; gap: .7rem; padding: 1rem; background: linear-gradient(145deg,#eef2f8 0 48%,#e4d6e9 48% 52%,#f8f5ef 52%); border: 1px dashed #a4afbd; color: #69788a; text-align: center; }
.supporting-gallery > div:nth-child(3) { background: linear-gradient(145deg,#f8eadc,#e6edf8); }
.supporting-gallery > div:nth-child(5) { background: linear-gradient(145deg,#e1ebfa,#f5dfcb); }
.supporting-gallery .icon { color: #704c80; font-size: 1.7rem; }
.supporting-gallery span { font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.supporting-gallery .support-gallery-wide { grid-column: span 2; }
.supporting-gallery .support-gallery-tall { grid-row: span 2; }
.supporting-social-section { background: #25203e; }
.supporting-social-section h2 { color: #fff; }
.supporting-social-section p { color: #d5cee1; }
.supporting-social-section .eyebrow { color: #ffc38d; }
.social-planner { overflow: hidden; max-width: 34rem; background: #fff; box-shadow: 1.2rem 1.2rem 0 rgba(241,137,37,.18); transform: rotate(-1deg); }
.social-planner > div { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.2rem; border-bottom: 1px solid var(--pb-line); }
.social-planner > div strong { font-size: .85rem; }
.social-planner > div span { padding: .25rem .5rem; background: #f7eadf; color: #92511a; font-size: .6rem; }
.social-planner p { display: grid; grid-template-columns: 1.5rem 1fr 4rem; align-items: center; gap: .7rem; margin: 0; padding: .85rem 1.2rem; border-bottom: 1px solid #e0e5eb; color: var(--pb-ink); font-size: .78rem; }
.social-planner p .icon { color: #704c80; }
.social-planner p b { height: .4rem; border-radius: 1rem; background: #dbe1e9; }
.supporting-together-section { background-image: linear-gradient(120deg,#fff 0 65%,#f3e7f5 65% 100%); }
.supporting-content-flow { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); max-width: 54rem; margin-inline: auto !important; }
.supporting-content-flow li { position: relative; display: grid; place-items: center; align-content: center; min-height: 9rem; background: #fff; border: 1px solid var(--pb-line); }
.supporting-content-flow li + li { border-left: 0; }
.supporting-content-flow li:not(:last-child)::after { content: "+"; position: absolute; z-index: 2; right: -1rem; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: #704c80; color: #fff; font-weight: 700; }
.supporting-content-flow .icon { margin-bottom: .8rem; color: #704c80; font-size: 1.4rem; }
.supporting-content-flow strong { font-size: .85rem; }
.supporting-fit-list { border-block: 1px solid #cad2dc; }
.supporting-fit-list li { padding: .7rem 0 .7rem 1.4rem; border-bottom: 1px solid #d5dce5; color: var(--pb-muted); }
.supporting-fit-list li:last-child { border-bottom: 0; }
.supporting-fit-list li::before { content: ""; display: inline-block; width: .5rem; height: .5rem; margin-left: -1.4rem; margin-right: .85rem; border-radius: 50%; background: #704c80; }
.supporting-price-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: #cdd5df; }
.supporting-price-pair article { padding: 1.4rem; background: #fff; }
.supporting-price-pair .icon { display: block; margin-bottom: 2rem; color: #704c80; font-size: 1.35rem; }
.supporting-price-pair span, .supporting-price-pair strong, .supporting-price-pair small { display: block; }
.supporting-price-pair span { min-height: 2.5rem; font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.supporting-price-pair strong { margin: .5rem 0; color: var(--pb-ink); font-size: 1.65rem; }
.supporting-price-pair small { color: var(--pb-muted); line-height: 1.45; }
.supporting-related-links { border-block: 1px solid var(--pb-line); }
.supporting-related-links a { display: grid; grid-template-columns: 1.5rem 1fr 1rem; align-items: center; gap: .8rem; min-height: 3.8rem; border-bottom: 1px solid var(--pb-line); color: var(--pb-ink); font-weight: 600; text-decoration: none; }
.supporting-related-links a:last-child { border-bottom: 0; }
.supporting-related-links a .icon:first-child { color: #704c80; }
.supporting-related-links a .icon:last-child { color: var(--pb-orange); }
.supporting-related-links a:hover span { color: var(--pb-blue); text-decoration: underline; }
.supporting-cta { background: linear-gradient(115deg,#25203e 0 72%,#704c80 72% 100%); }

@media (max-width: 991.98px) {
    .job-hero-board { max-width: 44rem; transform: none; }
    .job-capability-console { grid-template-columns: 1fr; }
    .job-capability-core { min-height: 10rem; }
    .job-capability-list { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .job-workflow { grid-template-columns: repeat(4,1fr); gap: 2rem 0; }
    .job-workflow li:nth-child(4)::after { display: none; }
    .job-process { grid-template-columns: repeat(4,1fr); gap: 2rem 0; }
    .job-process li:nth-child(4)::after { display: none; }
    .supporting-artboard { max-width: 44rem; }
}
@media (max-width: 767.98px) {
    .job-source-cloud { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 1rem; }
    .job-source-cloud strong { grid-column: auto; }
    .job-capability-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .job-role-composition, .job-fit-split { grid-template-columns: 1fr; }
    .job-cost-spectrum { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .supporting-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .supporting-gallery .support-gallery-wide { grid-column: span 2; }
    .supporting-content-flow { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.5rem; }
    .supporting-content-flow li + li { border-left: 1px solid var(--pb-line); }
    .supporting-content-flow li:not(:last-child)::after { display: none; }
}
@media (max-width: 575.98px) {
    .job-board-columns { grid-template-columns: repeat(2,minmax(0,1fr)); min-height: 0; }
    .job-source-cloud, .job-capability-list { grid-template-columns: 1fr; }
    .job-workflow { grid-template-columns: 1fr; gap: 0; padding-left: .75rem; }
    .job-workflow li { display: grid; grid-template-columns: 3.8rem 1fr; grid-template-rows: auto auto; column-gap: 1rem; align-items: center; min-height: 5.3rem; padding-block: .75rem; text-align: left; }
    .job-workflow li:not(:last-child)::after { display: block; top: 4.55rem; bottom: -.75rem; left: 1.85rem; right: auto; width: 2px; height: auto; }
    .job-workflow li > span { grid-column: 2; grid-row: 1; margin: 0 0 .2rem; }
    .job-workflow li > div { grid-column: 1; grid-row: 1 / span 2; margin: 0; }
    .job-workflow li > strong { grid-column: 2; grid-row: 2; padding: 0; text-align: left; }
    .job-friction-list li { grid-template-columns: 1.5rem 1fr; padding-block: .65rem; }
    .job-friction-list li > .icon:nth-child(3) { grid-column: 1; grid-row: 2; justify-self: center; transform: rotate(90deg); }
    .job-friction-list strong { grid-column: 2; font-weight: 600; }
    .job-trigger-list > div { grid-template-columns: 1fr; gap: .35rem; padding-block: .8rem; }
    .job-trigger-list .icon { transform: rotate(90deg); }
    .job-integration-wheel { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .job-integration-wheel > strong { grid-row: auto; }
    .job-process { grid-template-columns: 1fr; border-top: 0; gap: 0; }
    .job-process li { display: grid; grid-template-columns: 2rem 1fr; padding: .8rem 0; border-top: 1px solid #cdd6df; }
    .job-process li::after { display: none !important; }
    .job-process span { grid-row: 1 / span 2; margin: 0; }
    .job-process small { grid-column: 2; }
    .supporting-artboard { min-height: 20rem; }
    .artboard-sheet { width: 9rem; height: 12rem; }
    .artboard-sheet-b b { margin-bottom: 2rem; font-size: 2.5rem; }
    .artboard-post { left: 32%; width: 8rem; height: 8rem; }
    .artboard-post > i { height: 3.5rem; }
    .artboard-swatch { display: none; }
    .supporting-gallery { grid-template-columns: 1fr; grid-auto-rows: 9rem; }
    .supporting-gallery .support-gallery-wide { grid-column: auto; }
    .supporting-gallery .support-gallery-tall { grid-row: auto; }
    .supporting-content-flow, .supporting-price-pair { grid-template-columns: 1fr; }
    .supporting-cta { background: #25203e; }
}

/* Website compliance: clear documents, choices and practical data flows. */
.compliance-hero { background-image: linear-gradient(125deg,#101d30,#243f43) !important; }
.compliance-hero::before { background: linear-gradient(90deg,rgba(8,18,32,.96),rgba(26,57,59,.78)); }
.compliance-hero-document { position: relative; min-height: 25rem; background: linear-gradient(145deg,#dce9e7,#f6efe5); box-shadow: 1.2rem 1.2rem 0 rgba(112,165,156,.2); }
.compliance-document { position: absolute; left: 8%; top: 10%; width: 58%; height: 78%; padding: 1.5rem; background: #fff; box-shadow: 0 25px 45px -30px #122; color: var(--pb-ink); transform: rotate(-2deg); }
.compliance-document > .icon { display: block; margin-bottom: 1.3rem; color: #32756f; font-size: 1.6rem; }
.compliance-document strong { display: block; margin-bottom: 1.5rem; }
.compliance-document > span { display: block; height: .45rem; margin-bottom: .65rem; background: #d8e0e3; }
.compliance-document > span:nth-of-type(2) { width: 77%; }
.compliance-document > span:nth-of-type(3) { width: 88%; }
.compliance-document em { position: absolute; right: 1.2rem; bottom: 1.2rem; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: #e3f0ed; color: #32756f; }
.compliance-preferences { position: absolute; z-index: 2; right: 5%; bottom: 8%; width: 48%; padding: 1.1rem; background: #173440; box-shadow: 0 20px 38px -24px #000; color: #fff; transform: rotate(2deg); }
.compliance-preferences > strong { display: block; margin-bottom: .75rem; font-size: .78rem; }
.compliance-preferences > span { display: flex; justify-content: space-between; align-items: center; padding: .55rem 0; border-top: 1px solid rgba(255,255,255,.15); color: #d5e0e4; font-size: .68rem; }
.compliance-preferences > span i { position: relative; display: block; width: 2rem; height: 1rem; border-radius: 1rem; background: #60717c; }
.compliance-preferences > span i::after { content: ""; position: absolute; top: .16rem; left: .17rem; width: .68rem; height: .68rem; border-radius: 50%; background: #fff; }
.compliance-preferences > span i.is-on { background: #4b9a8c; }
.compliance-preferences > span i.is-on::after { left: 1.15rem; }
.compliance-preferences > b { display: block; margin-top: .7rem; padding: .55rem; background: #f1a15a; color: #10232b; font-size: .65rem; text-align: center; }
.compliance-law-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin-bottom: 1.4rem; background: var(--pb-line); }
.compliance-law-pair article { position: relative; padding: clamp(1.5rem,4vw,3rem); background: #f8f5ef; }
.compliance-law-pair article + article { background: #e8f0ef; }
.compliance-law-pair article > span { position: absolute; right: 1.5rem; top: 1.2rem; color: rgba(50,117,111,.22); font-size: 2rem; font-weight: 800; }
.compliance-law-pair article > .icon { margin-bottom: 2.2rem; color: #32756f; font-size: 1.7rem; }
.compliance-law-pair h3 { font-size: 1.45rem; }
.compliance-source-note { padding-left: 1rem; border-left: 3px solid #d9853d; font-size: .82rem; }
.privacy-notice-visual { min-height: 26rem; padding: 2rem; background: #173440; box-shadow: 1.2rem 1.2rem 0 #dce6e4; }
.privacy-notice-visual span { display: block; margin-bottom: .65rem; color: #ffbc82; font-size: .7rem; font-weight: 700; }
.privacy-notice-visual i { display: block; width: 100%; height: .55rem; margin-bottom: .7rem; background: rgba(255,255,255,.22); }
.privacy-notice-visual i:nth-of-type(2), .privacy-notice-visual i:nth-of-type(5), .privacy-notice-visual i:nth-of-type(8) { width: 72%; }
.privacy-notice-visual i:nth-of-type(3), .privacy-notice-visual i:nth-of-type(6) { width: 88%; margin-bottom: 2rem; }
.privacy-question-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 1.5rem; margin: 1.4rem 0; border-top: 1px solid #d5cdc1; }
.privacy-question-list span { display: grid; grid-template-columns: 1.3rem 1fr; gap: .55rem; padding: .75rem 0; border-bottom: 1px solid #d5cdc1; color: var(--pb-ink); font-size: .8rem; font-weight: 600; }
.privacy-question-list .icon { margin-top: .25rem; color: #32756f; }
.cookie-choice-flow { display: grid; grid-template-columns: 1fr 2.5rem 1.4fr 2.5rem 1fr; align-items: center; max-width: 62rem; margin: 0 auto 2rem; }
.cookie-choice-flow > div { display: grid; place-items: center; align-content: center; min-height: 10rem; padding: 1rem; border: 1px solid #cad5d4; background: #eef4f3; text-align: center; }
.cookie-choice-flow > div > .icon { margin-bottom: .8rem; color: #32756f; font-size: 1.6rem; }
.cookie-choice-flow > .icon { justify-self: center; color: #d47b2c; }
.cookie-choice-flow .cookie-choice { display: block; background: #173440; color: #fff; text-align: left; }
.cookie-choice > strong { display: block; margin-bottom: .7rem; }
.cookie-choice > span { display: flex; align-items: center; gap: .55rem; padding: .45rem 0; border-top: 1px solid rgba(255,255,255,.13); color: #dbe4e6; font-size: .72rem; }
.cookie-choice > span i { display: block; width: .65rem; height: .65rem; border: 1px solid #ffbc82; border-radius: 50%; }
.cookie-topic-line { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); margin-bottom: 1.6rem; border-block: 1px solid var(--pb-line); }
.cookie-topic-line span { display: grid; place-items: center; align-content: center; min-height: 7rem; padding: .7rem; border-left: 1px solid var(--pb-line); color: var(--pb-ink); font-size: .7rem; font-weight: 600; text-align: center; }
.cookie-topic-line span:first-child { border-left: 0; }
.cookie-topic-line .icon { margin-bottom: .7rem; color: #32756f; font-size: 1.2rem; }
.compliance-credentials-section { background: #102b35; }
.compliance-credentials-section h2 { color: #fff; }
.compliance-credentials-section p { color: #c9d8dc; }
.compliance-credentials-section .eyebrow { color: #ffb66f; }
.compliance-credentials-section .text-link { color: #fff; }
.compliance-partner-badge { display: grid; place-items: center; max-width: 18rem; margin-inline: auto; padding: 1.5rem; background: #fff; color: var(--pb-ink); text-decoration: none; box-shadow: 1rem 1rem 0 rgba(255,255,255,.1); }
.compliance-partner-badge img { display: block; width: 9rem; height: 10rem; object-fit: contain; }
.compliance-partner-badge span { margin-top: .7rem; font-size: .75rem; font-weight: 700; }
.compliance-ico-note { display: grid; grid-template-columns: 10rem 1fr; align-items: center; gap: 2rem; margin-top: 3.5rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.18); }
.compliance-ico-note img { width: 9rem; height: auto; }
.compliance-ico-note strong { color: #fff; }
.compliance-ico-note p { margin: .3rem 0; font-size: .8rem; }
.compliance-ico-note a { color: #fff; font-size: .78rem; }
.compliance-checklist { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 2rem; border-top: 1px solid #cbd5df; }
.compliance-checklist > div { display: grid; grid-template-columns: 1.5rem 1fr 1rem; align-items: center; gap: .7rem; min-height: 4rem; border-bottom: 1px solid #cbd5df; color: var(--pb-ink); font-size: .85rem; font-weight: 600; }
.compliance-checklist > div > .icon:first-child { color: #32756f; }
.compliance-checklist > div > .icon:last-child { color: #b26a2a; font-size: .75rem; }
.compliance-build-map { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; padding: 1rem; background: #e4efed; }
.compliance-build-map span, .compliance-build-map strong { display: grid; place-items: center; align-content: center; min-height: 6rem; padding: .7rem; background: #fff; color: var(--pb-ink); font-size: .72rem; text-align: center; }
.compliance-build-map .icon { margin-bottom: .5rem; color: #32756f; }
.compliance-build-map strong { grid-column: span 2; background: #32756f; color: #fff; }
.compliance-change-track { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.3rem 0 1.5rem; }
.compliance-change-track span { padding: .55rem .8rem; border-left: 3px solid #32756f; background: #fff; color: var(--pb-ink); font-size: .76rem; font-weight: 600; }
.compliance-price-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--pb-line); }
.compliance-price-grid article { padding: clamp(1.4rem,3vw,2.3rem); background: var(--pb-paper); }
.compliance-price-grid article > span { color: #32756f; font-size: .7rem; font-weight: 700; }
.compliance-price-grid h3 { min-height: 3.2rem; margin-top: 1.5rem; font-size: 1.15rem; }
.compliance-price-grid .price { font-size: 2.25rem; }
.compliance-price-grid article > p:last-child { font-size: .82rem; }
.compliance-cta { background: linear-gradient(115deg,#173440 0 72%,#32756f 72% 100%); }

/* Mobile app development: device-led compositions and connected platform layers. */
.mobile-app-hero { background-image: linear-gradient(125deg,#101d30,#282750) !important; }
.mobile-app-hero::before { background: linear-gradient(90deg,rgba(8,18,32,.97),rgba(34,30,72,.78)); }
.mobile-hero-devices { position: relative; min-height: 27rem; }
.mobile-hero-devices figure { position: absolute; inset: 0 13% 0 0; overflow: hidden; margin: 0; border-radius: .3rem; background: #dce4ef; box-shadow: 1.2rem 1.2rem 0 rgba(137,142,222,.18); transform: rotate(-2deg); }
.mobile-hero-devices figure img { width: 100%; height: 100%; object-fit: cover; }
.mobile-device-panel { position: absolute; z-index: 2; right: 0; bottom: 4%; width: 12rem; min-height: 21rem; padding: 1.2rem; border: .55rem solid #121827; border-radius: 1.7rem; background: linear-gradient(160deg,#344d9a,#241e4a); box-shadow: 0 25px 45px -25px #000; color: #fff; }
.mobile-device-panel > span { display: block; width: 2.8rem; height: .35rem; margin: -.65rem auto 2.5rem; border-radius: 1rem; background: #080c14; }
.mobile-device-panel > .icon { color: #ffad63; font-size: 1.6rem; }
.mobile-device-panel strong { display: block; margin: 1rem 0 2rem; font-size: 1rem; line-height: 1.25; }
.mobile-device-panel b { display: block; height: .45rem; margin-bottom: .55rem; background: rgba(255,255,255,.35); }
.mobile-device-panel b:nth-of-type(2) { width: 70%; }
.mobile-device-panel em { position: absolute; left: 1.2rem; right: 1.2rem; bottom: 1.2rem; height: 2rem; border-radius: 1rem; background: #ff9a43; }
.mobile-choice-visual { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--pb-line); }
.mobile-choice-visual article { padding: 1.4rem; background: #f6f3ed; }
.mobile-choice-visual article.is-mobile { background: #e8e9f7; border-top: 4px solid #5756a6; }
.mobile-choice-visual .icon { margin-bottom: 2.3rem; color: #5756a6; font-size: 1.5rem; }
.mobile-choice-visual h3 { font-size: 1rem; }
.mobile-choice-visual p { margin: 0; font-size: .78rem; }
.mobile-capabilities-section { background: #20203e; }
.mobile-capabilities-section h2 { color: #fff; }
.mobile-capabilities-section p { color: #d2d2e3; }
.mobile-capabilities-section .eyebrow { color: #ffb66f; }
.mobile-capability-radar { display: grid; grid-template-columns: 13rem 1fr; gap: 1.5rem; }
.mobile-capability-phone { display: grid; place-items: center; align-content: center; min-height: 23rem; padding: 1.3rem; border: .55rem solid #10101f; border-radius: 2rem; background: linear-gradient(160deg,#4c54a2,#2a2756); color: #fff; text-align: center; }
.mobile-capability-phone > span { position: absolute; }
.mobile-capability-phone > .icon { margin-bottom: 1rem; color: #ffb66f; font-size: 2rem; }
.mobile-capability-phone strong, .mobile-capability-phone small { display: block; }
.mobile-capability-phone small { margin-top: .4rem; color: #c8c9e0; }
.mobile-capability-items { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; background: rgba(255,255,255,.13); }
.mobile-capability-items span { display: grid; place-items: center; align-content: center; min-height: 8rem; padding: .8rem; background: rgba(255,255,255,.06); color: #fff; font-size: .74rem; font-weight: 600; text-align: center; }
.mobile-capability-items .icon { margin-bottom: .8rem; color: #ffb66f; font-size: 1.3rem; }
.mobile-system-section .section-intro { max-width: 48rem; }
.mobile-system-stack { display: grid; grid-template-columns: 1fr 7rem 1fr 7rem 1fr; align-items: stretch; }
.mobile-system-stack > div { display: grid; place-items: center; align-content: center; min-height: 13rem; padding: 1.2rem; background: #e9e9f7; border-top: 4px solid #5756a6; text-align: center; }
.mobile-system-stack > div:nth-of-type(2) { background: #eef2f8; border-top-color: var(--pb-blue); }
.mobile-system-stack > div:nth-of-type(3) { background: #f8f5ef; border-top-color: var(--pb-orange); }
.mobile-system-stack > div .icon { margin-bottom: 1rem; color: #5756a6; font-size: 1.7rem; }
.mobile-system-stack > div strong, .mobile-system-stack > div small { display: block; }
.mobile-system-stack > div small { margin-top: .4rem; color: var(--pb-muted); }
.mobile-system-stack > span { display: grid; grid-template-columns: 1fr auto 1fr; place-items: center; align-content: center; color: #5756a6; }
.mobile-system-stack > span b { margin: .5rem .7rem; font-size: .7rem; }
.mobile-platform-pair { display: flex; justify-content: center; gap: 1rem; }
.mobile-platform-pair span { display: grid; place-items: center; width: 8rem; aspect-ratio: 1; border-radius: 2rem; background: #fff; box-shadow: 0 20px 38px -30px #172337; color: #20203e; transform: rotate(-4deg); }
.mobile-platform-pair span + span { background: #5756a6; color: #fff; transform: rotate(4deg); }
.mobile-platform-pair .icon { font-size: 3rem; }
.mobile-store-flow { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--pb-line); }
.mobile-store-flow li { position: relative; min-height: 9rem; padding: 1.2rem; background: #fff; }
.mobile-store-flow span { position: absolute; right: .8rem; top: .7rem; color: rgba(87,86,166,.28); font-size: 1.2rem; font-weight: 800; }
.mobile-store-flow .icon { display: block; margin-bottom: 2rem; color: #5756a6; font-size: 1.3rem; }
.mobile-store-flow strong { font-size: .78rem; }
.mobile-process { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.mobile-process li { position: relative; padding-right: .8rem; }
.mobile-process span { color: #5756a6; font-size: .65rem; font-weight: 700; }
.mobile-process i { display: block; height: 2px; margin: .8rem 0 1.2rem; background: #5756a6; }
.mobile-process li:not(:last-child) i::after { content: ""; position: absolute; right: .55rem; width: .45rem; height: .45rem; margin-top: -.15rem; border-top: 2px solid #5756a6; border-right: 2px solid #5756a6; transform: rotate(45deg); }
.mobile-process strong { display: block; font-size: .78rem; line-height: 1.4; }
.mobile-price { margin: 1.5rem 0; padding: 1.5rem; background: #20203e; }
.mobile-price span, .mobile-price strong, .mobile-price small { display: block; }
.mobile-price span { color: #d1d1e2; font-size: .7rem; letter-spacing: .07em; text-transform: uppercase; }
.mobile-price strong { color: #fff; font-size: clamp(3rem,7vw,5rem); line-height: 1.1; letter-spacing: -.07em; }
.mobile-price small { color: #ffc28c; }
.mobile-cost-factors { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 1.2rem 0 1.5rem; border-top: 1px solid var(--pb-line); }
.mobile-cost-factors span { display: flex; align-items: center; gap: .6rem; min-height: 4rem; padding: .7rem .4rem .7rem 0; border-bottom: 1px solid var(--pb-line); color: var(--pb-ink); font-size: .8rem; font-weight: 600; }
.mobile-cost-factors .icon { color: #5756a6; }
.mobile-app-cta { background: linear-gradient(115deg,#20203e 0 72%,#5756a6 72% 100%); }

@media (max-width: 991.98px) {
    .compliance-hero-document, .mobile-hero-devices { max-width: 44rem; }
    .cookie-topic-line { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .cookie-topic-line span:nth-child(4) { border-left: 0; }
    .compliance-price-grid { grid-template-columns: 1fr; }
    .compliance-price-grid h3 { min-height: 0; }
    .mobile-capability-radar { grid-template-columns: 1fr; }
    .mobile-capability-phone { justify-self: center; width: 13rem; }
    .mobile-capability-items { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .mobile-process { grid-template-columns: repeat(4,1fr); gap: 2rem 0; }
    .mobile-process li:nth-child(4) i::after { display: none; }
}
@media (max-width: 767.98px) {
    .privacy-question-list, .compliance-checklist, .compliance-law-pair { grid-template-columns: 1fr; }
    .cookie-choice-flow { grid-template-columns: 1fr; gap: .7rem; }
    .cookie-choice-flow > .icon { transform: rotate(90deg); }
    .compliance-ico-note { grid-template-columns: 7rem 1fr; gap: 1rem; }
    .compliance-ico-note img { width: 7rem; }
    .compliance-build-map { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .compliance-build-map strong { grid-column: span 2; }
    .mobile-choice-visual { grid-template-columns: 1fr; }
    .mobile-capability-items { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mobile-system-stack { grid-template-columns: 1fr; gap: .5rem; }
    .mobile-system-stack > span { grid-template-columns: 1fr; min-height: 5rem; }
    .mobile-system-stack > span .icon { transform: rotate(90deg); }
    .mobile-system-stack > span b { margin: .3rem 0; }
    .mobile-store-flow, .mobile-cost-factors { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 575.98px) {
    .compliance-hero-document { min-height: 21rem; }
    .compliance-document { left: 4%; width: 66%; }
    .compliance-preferences { right: 3%; width: 55%; }
    .cookie-topic-line { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cookie-topic-line span:nth-child(3), .cookie-topic-line span:nth-child(5) { border-left: 0; }
    .cookie-topic-line span:nth-child(4) { border-left: 1px solid var(--pb-line); }
    .compliance-ico-note { grid-template-columns: 1fr; }
    .compliance-cta { background: #173440; }
    .mobile-hero-devices { min-height: 22rem; }
    .mobile-hero-devices figure { right: 7%; }
    .mobile-device-panel { width: 9rem; min-height: 17rem; border-width: .4rem; }
    .mobile-device-panel > span { margin-bottom: 1.5rem; }
    .mobile-capability-items, .mobile-store-flow, .mobile-cost-factors { grid-template-columns: 1fr; }
    .mobile-process { grid-template-columns: 1fr; gap: 0; }
    .mobile-process li { display: grid; grid-template-columns: 2rem 1fr; padding: .8rem 0; border-top: 1px solid #d1d1df; }
    .mobile-process li i { display: none; }
    .mobile-process li strong { grid-column: 2; }
    .mobile-app-cta { background: #20203e; }
}
/* Bespoke applications and WordPress service pages */
.bespoke-app-hero {
    background: linear-gradient(135deg, rgba(236, 246, 251, .95), rgba(255, 255, 255, .98) 55%, rgba(229, 242, 248, .9));
}

.bespoke-dashboard {
    position: relative;
    min-height: 410px;
    overflow: hidden;
    border: 1px solid rgba(1, 63, 96, .14);
    border-radius: 1.5rem;
    background: #f7fbfd;
    box-shadow: 0 1.8rem 4rem rgba(1, 42, 64, .16);
    transform: rotate(1deg);
}

.dashboard-bar { display: flex; align-items: center; gap: .45rem; padding: 1rem 1.25rem; color: #d9f3ff; background: #082f45; }
.dashboard-bar span { width: .65rem; height: .65rem; border-radius: 50%; background: #6caac6; }
.dashboard-bar strong { margin-left: auto; font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; }
.dashboard-body { display: grid; grid-template-columns: 78px 1fr; min-height: 352px; }
.dashboard-body aside { display: flex; flex-direction: column; gap: 1.15rem; padding: 1.5rem; background: #e6f2f7; }
.dashboard-body aside i { width: 30px; height: 30px; border-radius: .55rem; background: #a9cedf; }
.dashboard-main { padding: 1.5rem; }
.dashboard-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .85rem; }
.dashboard-stats span { height: 72px; border-radius: .85rem; background: linear-gradient(135deg, #fff, #dceef6); box-shadow: 0 .35rem 1rem rgba(1, 63, 96, .08); }
.dashboard-chart { display: flex; align-items: end; gap: 8%; height: 145px; margin-top: 1.25rem; padding: 1.25rem 1.5rem 0; border-radius: 1rem; background: #fff; }
.dashboard-chart i { flex: 1; border-radius: .35rem .35rem 0 0; background: linear-gradient(#42a8cd, #0b628b); }
.dashboard-chart i:nth-child(1) { height: 45%; }.dashboard-chart i:nth-child(2) { height: 67%; }.dashboard-chart i:nth-child(3) { height: 54%; }.dashboard-chart i:nth-child(4) { height: 88%; }.dashboard-chart i:nth-child(5) { height: 76%; }
.dashboard-rows { display: grid; gap: .65rem; margin-top: 1.25rem; }
.dashboard-rows span { height: 16px; border-radius: 1rem; background: #d8eaf2; }
.dashboard-rows span:nth-child(2) { width: 80%; }.dashboard-rows span:nth-child(3) { width: 91%; }

.friction-progression { display: grid; grid-template-columns: repeat(5, 1fr); position: relative; margin: 3rem 0 0; }
.friction-progression::before { content: ""; position: absolute; top: 4.15rem; left: 8%; right: 8%; height: 2px; background: linear-gradient(90deg, #b7d4e1, #08769f); }
.friction-progression li { position: relative; z-index: 1; padding: 0 1rem; text-align: center; }
.friction-progression .friction-index { display: block; color: #63818f; font: 700 .76rem/1 var(--font-sans); letter-spacing: .12em; }
.friction-progression .icon { display: grid; width: 4.4rem; height: 4.4rem; place-items: center; margin: .8rem auto 1.1rem; border: .45rem solid #fff; border-radius: 50%; color: #fff; background: #0b628b; font-size: 1.2rem; box-shadow: 0 .6rem 1.5rem rgba(1, 63, 96, .15); }
.friction-progression h3 { font-size: 1.05rem; }.friction-progression p { color: #526975; font-size: .92rem; }
.fit-caveat { display: flex; gap: .8rem; max-width: 850px; margin: 2rem auto 0; padding: 1rem 1.2rem; border-radius: .85rem; background: #edf6fa; }
.fit-caveat .icon { margin-top: .2rem; color: #0b628b; }

.bespoke-capabilities { background: radial-gradient(circle at 78% 20%, rgba(45, 151, 190, .22), transparent 28%), #062c41; }
.capability-orbit { display: grid; grid-template-columns: 145px 1fr; gap: 1.4rem; align-items: center; }
.capability-core { display: grid; min-height: 145px; place-items: center; align-content: center; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; color: #fff; background: rgba(33, 143, 184, .23); text-align: center; }
.capability-core .icon { margin-bottom: .7rem; color: #70d0ee; font-size: 1.8rem; }
.capability-orbit ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: .65rem; }
.capability-orbit li { padding: .8rem 1rem; border: 1px solid rgba(255,255,255,.14); border-radius: .65rem; color: #e8f6fb; background: rgba(255,255,255,.06); }
.bespoke-related-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 3rem; }
.bespoke-related-links a { display: flex; gap: 1rem; align-items: flex-start; padding: 1.25rem; border: 1px solid rgba(255,255,255,.17); border-radius: 1rem; color: #fff; background: rgba(255,255,255,.07); text-decoration: none; }
.bespoke-related-links a:hover { background: rgba(255,255,255,.12); }.bespoke-related-links .icon { margin-top: .15rem; color: #70d0ee; font-size: 1.25rem; }.bespoke-related-links strong { display: block; margin-bottom: .3rem; }
.bespoke-related-links .bespoke-related-arrow { align-self: center; flex-shrink: 0; margin: 0 0 0 auto; color: #70d0ee; font-size: 1rem; transition: transform .2s ease; }
.bespoke-related-links a:hover .bespoke-related-arrow { transform: translateX(.2rem); }

.integration-map { display: grid; grid-template-columns: 1fr auto 1.1fr auto 1fr; gap: 1rem; align-items: center; margin-top: 2.5rem; }
.integration-inputs,.integration-outputs { display: grid; gap: .65rem; }
.integration-inputs span,.integration-outputs span { padding: .85rem 1rem; border: 1px solid #ccdee6; border-radius: .7rem; background: #fff; box-shadow: 0 .25rem .8rem rgba(1,63,96,.06); }
.integration-inputs .icon,.integration-outputs .icon { width: 1.5rem; color: #0b6c94; }.integration-arrow { color: #2087ad; font-size: 1.35rem; }
.integration-centre { display: grid; min-height: 220px; place-items: center; align-content: center; padding: 2rem; border-radius: 50%; color: #fff; background: linear-gradient(145deg, #0b6c94, #043d5c); text-align: center; box-shadow: 0 1rem 2rem rgba(1,63,96,.2); }
.integration-centre .icon { margin-bottom: .8rem; font-size: 2rem; }.integration-centre span { color: #c6e8f4; font-size: .85rem; }

.bespoke-decision-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.bespoke-decision-grid article { padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid #cedfe7; border-radius: 1.1rem; background: #fff; }
.bespoke-decision-grid article:last-child { border-color: #83bed3; background: linear-gradient(145deg, #fff, #edf8fb); }
.decision-label { color: #0b6c94; font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.bespoke-decision-grid li + li { margin-top: .7rem; }

.bespoke-process { display: grid; grid-template-columns: repeat(7, 1fr); margin-top: 2.5rem; }
.bespoke-process li { position: relative; padding: 1rem .8rem; border-top: 3px solid #a8d1df; }
.bespoke-process li:nth-child(n+4) { border-color: #258bad; }.bespoke-process span { color: #6c8792; font-size: .72rem; font-weight: 800; }.bespoke-process .icon { position: absolute; z-index: 1; top: 0; right: 0; display: grid; width: 1.75rem; height: 1.75rem; place-items: center; border-radius: 50%; color: #258bad; background: #fff; font-size: .8rem; transform: translate(50%,-50%); }.bespoke-process li:last-child .icon { display: none; }.bespoke-process strong,.bespoke-process small { display: block; }.bespoke-process strong { margin-top: .75rem; }.bespoke-process small { margin-top: .3rem; color: #5e737d; line-height: 1.4; }
.bespoke-cost-factors { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }.bespoke-cost-factors span { display: flex; gap: .7rem; align-items: center; padding: .9rem; border: 1px solid #d3e3e9; border-radius: .65rem; background: #fff; }.bespoke-cost-factors .icon { color: #0b6c94; }

.app-route-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }.app-route-options article { padding: 1.4rem; border: 1px solid #c9dce5; border-radius: 1rem; background: #fff; }.app-route-options .icon { margin-bottom: 1rem; color: #0b6c94; font-size: 1.35rem; }

.website-project-process { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; margin-top: 2.5rem; border: 1px solid #ccdee6; border-radius: 1.2rem; background: #ccdee6; }
.website-project-process li { position: relative; min-height: 235px; padding: 1.6rem; background: #fff; }
.website-project-process li::after { content: ""; position: absolute; right: -.52rem; top: 50%; z-index: 2; width: 1rem; height: 1rem; border-top: 1px solid #ccdee6; border-right: 1px solid #ccdee6; background: #fff; transform: translateY(-50%) rotate(45deg); }
.website-project-process li:nth-child(3n)::after,.website-project-process li:last-child::after { display: none; }
.website-process-number { position: absolute; top: 1.15rem; right: 1.25rem; color: #abc2cc; font-size: .78rem; font-weight: 800; letter-spacing: .1em; }
.website-project-process .icon { display: grid; width: 2.9rem; height: 2.9rem; place-items: center; margin-bottom: 1.2rem; border-radius: .8rem; color: #fff; background: #0b6c94; }
.website-project-process h3 { font-size: 1.08rem; }.website-project-process p { margin-bottom: 0; color: #526975; font-size: .94rem; }
.website-project-process-compact { grid-template-columns: repeat(6, 1fr); }.website-project-process-compact li { min-height: 245px; padding: 1.35rem; }.website-project-process-compact li:nth-child(3n)::after { display: block; }.website-project-process-compact li:last-child::after { display: none; }

.wordpress-hero { background: linear-gradient(155deg, #fff 0%, #f0f8fb 100%); }.wordpress-hero-visual { overflow: hidden; border-radius: 1.4rem; box-shadow: 0 1.4rem 3rem rgba(1,63,96,.16); }.wordpress-hero-visual img { width: 100%; min-height: 340px; object-fit: cover; }
.wordpress-strengths { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }.wordpress-strengths article { padding: 1.35rem; border: 1px solid #d0e1e8; border-radius: 1rem; background: #fff; }.wordpress-strengths .icon { margin-bottom: .9rem; color: #0b6c94; font-size: 1.35rem; }.wordpress-strengths h3 { font-size: 1.08rem; }.wordpress-strengths p { margin-bottom: 0; color: #526975; }
.wordpress-bespoke-section { background: radial-gradient(circle at 15% 10%, rgba(56,161,199,.2), transparent 30%), #062d42; }.wordpress-comparison { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1.2rem; align-items: center; }.wordpress-comparison article { padding: clamp(1.5rem,3vw,2.5rem); border: 1px solid rgba(255,255,255,.17); border-radius: 1.1rem; background: rgba(255,255,255,.07); }.wordpress-comparison article:last-child { background: rgba(36,148,188,.18); }.wordpress-comparison ol { display: grid; gap: .8rem; margin: 1.4rem 0; }.wordpress-comparison li { display: flex; gap: .8rem; align-items: center; }.wordpress-comparison li span { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; color: #062d42; background: #c7ecf7; font-weight: 800; }.wordpress-versus { color: #9dddf2; font-weight: 800; text-transform: uppercase; }
.platform-choice-visual { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); align-items: center; gap: .75rem 1rem; max-width: 410px; padding: 2rem; border-radius: 1.2rem; background: #fff; box-shadow: 0 1rem 2.5rem rgba(1,63,96,.12); }.platform-choice-visual i { display: grid; width: 3.5rem; height: 3.5rem; place-items: center; border-radius: .85rem; color: #fff; background: #0b6c94; font-size: 1.6rem; }.platform-choice-visual span { justify-self: center; text-align: center; font-weight: 750; }.platform-choice-visual b { grid-column: 1 / -1; width: 100%; height: 1px; margin: .5rem 0; background: #d2e2e8; }
.wordpress-cost-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }.wordpress-cost-list span { display: flex; gap: .65rem; padding: .8rem; border-bottom: 1px solid #d2e2e8; }.wordpress-cost-list .icon { margin-top: .25rem; color: #0b789e; }

@media (max-width: 1199.98px) {
    .website-project-process-compact { grid-template-columns: repeat(3, 1fr); }
    .website-project-process-compact li:nth-child(3n)::after { display: none; }
    .bespoke-process { grid-template-columns: repeat(4, 1fr); row-gap: 1rem; }
    .bespoke-process li:nth-child(4n) .icon { display: none; }
}

@media (max-width: 991.98px) {
    .friction-progression { grid-template-columns: 1fr; gap: .8rem; }.friction-progression::before { top: 0; bottom: 0; left: 2.2rem; right: auto; width: 2px; height: auto; }.friction-progression li { display: grid; grid-template-columns: 4.4rem 1fr; gap: 0 1rem; padding: 0; text-align: left; }.friction-progression .friction-index { display: none; }.friction-progression .icon { grid-row: span 2; margin: 0; }.friction-progression h3 { margin-top: .5rem; }
    .integration-map { grid-template-columns: 1fr; }.integration-arrow { transform: rotate(90deg); text-align: center; }.integration-centre { min-height: 190px; border-radius: 1.4rem; }
    .bespoke-related-links,.app-route-options { grid-template-columns: 1fr; }.bespoke-process { grid-template-columns: repeat(2, 1fr); }.bespoke-process li:nth-child(odd):not(:last-child) .icon { display: grid; }.bespoke-process li:nth-child(even) .icon { display: none; }
    .website-project-process { grid-template-columns: repeat(2, 1fr); }.website-project-process li:nth-child(3n)::after { display: block; }.website-project-process li:nth-child(2n)::after { display: none; }
}

@media (max-width: 767.98px) {
    .bespoke-dashboard { min-height: 330px; }.dashboard-body { grid-template-columns: 55px 1fr; min-height: 280px; }.dashboard-body aside { padding: 1rem .75rem; }.dashboard-main { padding: 1rem; }.dashboard-stats span { height: 55px; }.dashboard-chart { height: 110px; }
    .capability-orbit { grid-template-columns: 1fr; }.capability-core { min-height: 120px; border-radius: 1rem; }.capability-orbit ul,.bespoke-decision-grid,.bespoke-cost-factors,.wordpress-strengths,.wordpress-cost-list { grid-template-columns: 1fr; }
    .wordpress-comparison { grid-template-columns: 1fr; }.wordpress-versus { text-align: center; }
    .website-project-process,.website-project-process-compact { grid-template-columns: 1fr; }.website-project-process li { min-height: auto; }.website-project-process li::after { display: none !important; }
}

.section-ink .website-project-process-dark { border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.16); }
.section-ink .website-project-process-dark li { background: #0b3a52; }
.section-ink .website-project-process-dark li::after { border-color: rgba(255,255,255,.16); background: #0b3a52; }
.section-ink .website-project-process-dark h3 { color: #fff; }
.section-ink .website-project-process-dark p { color: #cce4ec; }
.section-ink .website-project-process-dark .website-process-number { color: #78aabd; }

/* Keep process actions aligned when the explanatory copy varies in length. */
.app-process-timeline > li { display: flex; flex-direction: column; }
.app-process-timeline > li > p:not(.process-customer-part) { flex-grow: 1; }
.app-process-timeline .process-customer-part { margin-top: auto; }

/* Final dark-surface contrast rules: placed last so component copy and link rules cannot override them. */
.section-ink,
.compact-cta,
.support-band,
.trust-strip,
.site-footer { color: #f7f9fc; }
.section-ink p,
.section-ink li,
.section-ink dd,
.section-ink small,
.section-ink .section-intro,
.section-ink .text-body-secondary,
.compact-cta p,
.compact-cta .section-intro,
.support-band p,
.trust-strip p,
.site-footer p { color: #dfe7ef; }
.section-ink .text-link,
.compact-cta .text-link,
.support-band .text-link,
.site-footer a { color: #fff; text-decoration-color: rgba(255,255,255,.72); }
.section-ink .text-link:hover,
.section-ink .text-link:focus-visible,
.compact-cta .text-link:hover,
.compact-cta .text-link:focus-visible,
.support-band .text-link:hover,
.support-band .text-link:focus-visible,
.site-footer a:hover,
.site-footer a:focus-visible { color: #ffd09f; text-decoration-color: currentColor; }
.hero:not(.home-hero) .hero-description,
.hero:not(.home-hero) .hero-note { color: #e2e9f1; }
.cost-summary p,
.cost-summary .planned-note,
.calculator-hero-panel p,
.price-hero-statement p,
.booking-price p,
.job-price-panel p { color: #e2e9f1; }

/* Automation, customer portals and website maintenance service pages. */
.automation-hero { background: radial-gradient(circle at 78% 30%, rgba(55,174,206,.26), transparent 28%), linear-gradient(145deg,#052b40,#0b4d68); }
.automation-hero-visual { position: relative; display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; max-width: 36rem; margin-inline: auto; }
.automation-hero-visual::before,.automation-hero-visual::after { content:""; position:absolute; z-index:0; background:rgba(145,219,238,.35); }
.automation-hero-visual::before { left:50%; top:12%; bottom:12%; width:1px; }.automation-hero-visual::after { top:50%; left:12%; right:12%; height:1px; }
.automation-hero-visual span,.automation-hero-visual strong { position:relative; z-index:1; display:grid; min-height:8rem; place-items:center; align-content:center; gap:.7rem; border:1px solid rgba(255,255,255,.18); border-radius:1rem; color:#fff; background:rgba(255,255,255,.08); text-align:center; }
.automation-hero-visual strong { position:absolute; left:50%; top:50%; width:9rem; min-height:9rem; border-radius:50%; color:#062d42; background:#aee7f3; transform:translate(-50%,-50%); }
.automation-hero-visual .icon { color:#ffb66f; font-size:1.4rem; }.automation-hero-visual strong .icon { color:#08779b; font-size:1.8rem; }
.automation-friction-list { border-block:1px solid var(--pb-line); }
.automation-friction-list li { display:grid; grid-template-columns:2rem 1fr; gap:1rem; padding:1rem .5rem; border-top:1px solid var(--pb-line); font-size:clamp(1rem,1.8vw,1.2rem); }
.automation-friction-list li:first-child { border-top:0; }.automation-friction-list .icon { margin-top:.25rem; color:var(--pb-blue); }
.automation-connect-section { background:radial-gradient(circle at 20% 15%,rgba(54,166,204,.2),transparent 27%),#062d42; }
.system-bridge { display:grid; grid-template-columns:1fr 11rem 1fr; gap:1rem; align-items:stretch; max-width:56rem; margin:0 auto 2rem; }
.system-bridge > div { display:grid; min-height:13rem; place-items:center; align-content:center; gap:.5rem; padding:1.5rem; border:1px solid rgba(255,255,255,.17); border-radius:1rem; background:rgba(255,255,255,.07); text-align:center; }
.system-bridge > div .icon { margin-bottom:.7rem; color:#75d3ed; font-size:1.8rem; }.system-bridge > div small { color:#cfe7ef; }
.system-bridge > span { display:grid; grid-template-columns:1fr; place-items:center; align-content:center; gap:.7rem; color:#75d3ed; text-align:center; }.system-bridge > span b { color:#fff; font-size:.78rem; }
.connected-journey { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1.4fr; gap:.7rem; align-items:center; }
.connected-journey span { display:grid; min-height:5rem; place-items:center; padding:.8rem; border-radius:.7rem; color:#062d42; background:#d6f0f6; font-weight:700; text-align:center; }.connected-journey .icon { color:#ffb66f; }
.automation-capability-field { display:grid; grid-template-columns:repeat(5,1fr); border:1px solid var(--pb-line); background:var(--pb-line); gap:1px; }
.automation-capability-field span { display:grid; min-height:8rem; place-items:center; align-content:center; gap:.7rem; padding:.9rem; background:#fff; font-size:.8rem; font-weight:700; text-align:center; }.automation-capability-field .icon { color:#0b789e; font-size:1.35rem; }
.api-doorway { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:2rem; border-radius:1.2rem; background:#fff; box-shadow:0 1rem 2.5rem rgba(1,63,96,.12); }
.api-doorway > span { padding:1.4rem .8rem; border-radius:.7rem; color:#fff; background:#0b6c94; font-weight:700; text-align:center; }.api-doorway > strong { display:grid; min-width:7rem; place-items:center; gap:.4rem; color:#0b6c94; }.api-doorway .icon { font-size:2rem; }
.automation-choice-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.automation-choice-grid article { position:relative; padding:1.5rem; border:1px solid #cbdee6; border-radius:1rem; background:#fff; }.automation-choice-grid article:nth-child(2){background:#edf7fa}.automation-choice-grid article:nth-child(3){color:#fff;background:#073b58}.automation-choice-grid article:nth-child(3) h3,.automation-choice-grid article:nth-child(3) p{color:#fff}.automation-choice-grid article>span{position:absolute;right:1rem;top:.8rem;color:#a3bbc5;font-weight:800}.automation-choice-grid .icon{margin-bottom:2rem;color:#0b789e;font-size:1.5rem}.automation-choice-grid article:nth-child(3) .icon{color:#ffb66f}.automation-choice-grid p{margin:0;font-size:.9rem}
.workflow-ribbon,.compact-process { display:grid; grid-template-columns:repeat(6,1fr); }
.workflow-ribbon li { position:relative; display:grid; min-height:8.5rem; place-items:center; align-content:center; gap:.7rem; padding:1rem; border-block:1px solid #ccdce3; border-left:1px solid #ccdce3; background:#fff; text-align:center; }.workflow-ribbon li:last-child{border-right:1px solid #ccdce3}.workflow-ribbon li:not(:last-child)::after{content:"";position:absolute;z-index:2;right:-.45rem;width:.8rem;height:.8rem;border-top:1px solid #ccdce3;border-right:1px solid #ccdce3;background:#fff;transform:rotate(45deg)}.workflow-ribbon .icon{color:#0b789e}.workflow-ribbon strong{font-size:.76rem}
.compact-process li { position:relative; padding:1rem; border-top:2px solid #258bad; }.compact-process li:not(:last-child)::after{content:"\2192";position:absolute;z-index:1;top:0;right:0;display:grid;width:1.5rem;height:1.5rem;place-items:center;border-radius:50%;color:#258bad;background:#fff;font-size:.75rem;line-height:1;transform:translate(50%,-50%)}.compact-process span{display:block;color:#698591;font-size:.7rem;font-weight:800}.compact-process strong{display:block;margin-top:.8rem;font-size:.86rem}
.factor-chip-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(255,255,255,.14); }.factor-chip-grid span{display:flex;align-items:center;gap:.7rem;min-height:4rem;padding:.8rem 1rem;color:#fff;background:#0b3a52}.factor-chip-grid .icon{color:#75d3ed}.factor-chip-grid-light{background:var(--pb-line)}.factor-chip-grid-light span{color:var(--pb-ink);background:#fff}.factor-chip-grid-light .icon{color:#0b789e}

.portal-hero { background:radial-gradient(circle at 78% 24%,rgba(103,112,201,.27),transparent 30%),linear-gradient(145deg,#171b3d,#353b80); }
.portal-hero-dashboard { overflow:hidden; max-width:38rem; margin:auto; border:1px solid rgba(255,255,255,.16); border-radius:1.2rem; background:#f5f7fc; box-shadow:0 2rem 4rem rgba(4,8,35,.28); transform:rotate(1deg); }.portal-hero-dashboard>header{display:flex;align-items:center;gap:.7rem;padding:1rem 1.2rem;color:#fff;background:#151936}.portal-hero-dashboard>header span{width:5rem;height:.5rem;margin-left:auto;border-radius:1rem;background:#747dcc}.portal-dashboard-body{display:grid;grid-template-columns:4.5rem 1fr;min-height:22rem}.portal-dashboard-body aside{display:grid;align-content:start;gap:1rem;padding:1.2rem;background:#e1e5f2}.portal-dashboard-body aside i{height:2rem;border-radius:.45rem;background:#b9c1dc}.portal-dashboard-body>div{padding:1.5rem}.portal-dashboard-body b{display:block;width:42%;height:1rem;margin-bottom:1.4rem;border-radius:1rem;background:#3f477f}.portal-dashboard-body section{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}.portal-dashboard-body section span{display:grid;height:6rem;place-items:center;border-radius:.7rem;color:#4f589d;background:#e5e8f6}.portal-dashboard-body em{display:block;height:1.1rem;margin-top:1rem;border-radius:1rem;background:#dce1ef}.portal-dashboard-body em:nth-of-type(2){width:82%}.portal-dashboard-body em:nth-of-type(3){width:91%}
.portal-question-stream { display:grid; gap:.7rem; }.portal-question-stream blockquote{margin:0;padding:.85rem 1rem;border-left:3px solid #626ab5;background:#f2f3f9;font-size:1rem}.portal-question-stream blockquote:nth-child(even){margin-left:8%;border-color:#e7943d}.portal-question-stream strong{display:flex;align-items:center;justify-content:center;gap:.8rem;margin-top:.5rem;padding:1.2rem;border-radius:.8rem;color:#fff;background:#30366f;text-align:center}
.portal-features-section{background:radial-gradient(circle at 80% 10%,rgba(113,119,208,.25),transparent 28%),#171b3d}.portal-interface-map{display:grid;grid-template-columns:12rem 1fr;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.15);border-radius:1.2rem;background:#f5f7fc;box-shadow:0 2rem 4rem rgba(0,0,0,.22)}.portal-interface-map>aside{display:grid;align-content:start;gap:.4rem;padding:1.4rem;color:#d9ddf2;background:#222750}.portal-interface-map>aside strong{margin-bottom:1rem;color:#fff}.portal-interface-map>aside span{display:flex;gap:.6rem;padding:.65rem;border-radius:.4rem;font-size:.8rem}.portal-interface-map>aside .active{color:#20254d;background:#cfd4f1}.portal-interface-main{padding:1.5rem}.portal-interface-main>header{display:flex;justify-content:space-between;align-items:center;color:#252b59}.portal-interface-main>header small,.portal-interface-main>header strong{display:block}.portal-interface-main>header .icon{font-size:2rem}.portal-interface-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin:1.5rem 0}.portal-interface-cards article{padding:1rem;border:1px solid #d8dcef;border-radius:.7rem;background:#fff}.portal-interface-cards .icon{display:block;margin-bottom:1.2rem;color:#5962ad}.portal-interface-cards strong,.portal-interface-cards small{display:block}.portal-interface-cards small{margin-top:.25rem;color:#687080}.portal-interface-row{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:.7rem;background:#e8ebf7;color:#252b59}.portal-interface-row span{flex:1}.portal-interface-row strong,.portal-interface-row small{display:block}.portal-interface-row button{border:0;border-radius:.4rem;padding:.5rem .9rem;color:#fff;background:#48519a}.portal-callouts{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem;background:#dfe3f2}.portal-callouts span{padding:.4rem .65rem;border-radius:2rem;color:#30366f;background:#fff;font-size:.75rem;font-weight:700}
.experience-principles{border-block:1px solid var(--pb-line)}.experience-principles li{display:grid;grid-template-columns:3rem 1fr;gap:1rem;padding:1rem 0;border-top:1px solid var(--pb-line)}.experience-principles li:first-child{border-top:0}.experience-principles>li>span{color:#626ab5;font-weight:800}.experience-principles h3{font-size:1rem}.experience-principles p{margin:0;font-size:.9rem}
.portal-two-sides{display:grid;grid-template-columns:1fr 8rem 1fr;align-items:stretch}.portal-two-sides article{position:relative;padding:2rem;border:1px solid #d4d8ea;background:#fff}.portal-two-sides article>.icon{position:absolute;top:2rem;right:2rem;margin:0;color:#555fac;font-size:1.7rem}.portal-two-sides li{padding:.4rem 0;color:var(--pb-muted)}.portal-two-sides>span{display:grid;place-items:center;align-content:center;gap:.7rem;color:#555fac;text-align:center}.portal-two-sides>span b{font-size:.7rem}
.portal-integration-hub{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}.portal-integration-hub strong{grid-column:1/-1;display:grid;place-items:center;align-content:center;gap:.6rem;min-height:6rem;border-radius:.7rem;color:#fff;background:#343b7d}.portal-integration-hub span{display:grid;place-items:center;align-content:center;gap:.5rem;min-height:6rem;border:1px solid #d4d8e8;border-radius:.7rem;background:#fff;font-size:.8rem;font-weight:700}.portal-integration-hub .icon{color:#5962ad}
.security-considerations{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.15)}.security-considerations span{display:grid;min-height:7rem;place-items:center;align-content:center;gap:.6rem;padding:.7rem;color:#fff;background:#0b3a52;font-size:.76rem;font-weight:700;text-align:center}.security-considerations .icon{color:#75d3ed;font-size:1.2rem}
.portal-choice-line{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--pb-line)}.portal-choice-line article{padding:1.3rem;background:#fff}.portal-choice-line .icon{margin-bottom:2rem;color:#5962ad;font-size:1.35rem}.portal-choice-line h3{font-size:1rem}.portal-choice-line p{margin:0;font-size:.84rem}

.maintenance-hero{background:radial-gradient(circle at 78% 24%,rgba(56,171,141,.24),transparent 30%),linear-gradient(145deg,#082f3d,#0d5960)}
.maintenance-status-panel{overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:1.2rem;background:#eff7f5;box-shadow:0 2rem 4rem rgba(2,33,36,.25)}.maintenance-status-panel>header{display:flex;align-items:center;gap:.45rem;padding:1rem 1.2rem;color:#fff;background:#082f3d}.maintenance-status-panel>header span{width:.65rem;height:.65rem;border-radius:50%;background:#70b8ac}.maintenance-status-panel>header strong{margin-left:auto}.maintenance-status-panel>div{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#cfe0dd}.maintenance-status-panel section{display:grid;min-height:10rem;place-items:center;align-content:center;gap:.4rem;padding:1rem;background:#f7fbfa;text-align:center}.maintenance-status-panel section .icon{margin-bottom:.6rem;color:#14826f;font-size:1.5rem}.maintenance-status-panel section strong{color:#082f3d}.maintenance-status-panel section small{color:#60736f}
.support-route-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.support-route-flow article{position:relative;padding:1.5rem;border:1px solid #cddfdb;border-radius:1rem;background:#fff}.support-route-flow article>span{position:absolute;right:1rem;top:.8rem;color:#a0b8b3;font-weight:800}.support-route-flow article>.icon{margin-bottom:2rem;color:#14826f;font-size:1.5rem}.support-route-flow h3{font-size:1.1rem}.support-route-flow p{font-size:.9rem}.support-route-primary{border-top:4px solid #14826f!important;background:#eef8f5!important}.support-channel-note{display:flex;gap:.8rem;margin:1rem 0 0;padding:1rem;border-left:3px solid #14826f;background:#eef8f5}.support-channel-note .icon{margin-top:.2rem;color:#14826f}
.maintenance-help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.14)}.maintenance-help-grid article{min-height:12rem;padding:1.4rem;background:#0b3a52}.maintenance-help-grid .icon{margin-bottom:2rem;color:#74d7c5;font-size:1.4rem}.maintenance-help-grid h3{color:#fff;font-size:1.05rem}.maintenance-help-grid p{margin:0!important;font-size:.87rem}
.maintenance-comparison{display:grid;grid-template-columns:1fr auto 1fr;gap:1.2rem;align-items:center}.maintenance-comparison article{position:relative;height:100%;padding:2rem;border:1px solid #d0e1dd;border-radius:1rem;background:#fff}.maintenance-comparison article>.icon{position:absolute;top:2rem;right:2rem;color:#14826f;font-size:1.7rem}.maintenance-comparison>div{display:grid;width:2.8rem;height:2.8rem;place-items:center;border-radius:50%;color:#fff;background:#14826f;font-size:1.5rem;font-weight:700}
.update-check-visual{overflow:hidden;border-radius:1rem;background:#fff;box-shadow:0 1rem 2.5rem rgba(4,55,49,.12)}.update-check-visual header{display:flex;align-items:center;gap:.8rem;padding:1.2rem;color:#fff;background:#164a4c}.update-check-visual header .fa-wordpress{font-size:1.7rem}.update-check-visual>span{display:flex;align-items:center;gap:.8rem;padding:1rem 1.2rem;border-top:1px solid #d8e5e2}.update-check-visual>span .icon,.update-check-visual>span i{color:#14826f}
.bespoke-support-map{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}.bespoke-support-map span{display:flex;align-items:center;gap:.7rem;min-height:4rem;padding:.8rem 1rem;border:1px solid #d0e1dd;border-radius:.6rem;background:#fff;font-weight:600}.bespoke-support-map .icon{color:#14826f}
.joined-service-formula{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:1rem;align-items:center;max-width:54rem;margin:auto}.joined-service-formula span{display:grid;min-height:9rem;place-items:center;align-content:center;gap:.8rem;border:1px solid rgba(255,255,255,.18);border-radius:1rem;background:rgba(255,255,255,.07)}.joined-service-formula span .icon{color:#74d7c5;font-size:1.6rem}.joined-service-formula>b{color:#ffb66f;font-size:1.5rem}
.service-boundary{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.service-boundary article{padding:1.4rem;border:1px solid #d0e1dd;border-radius:1rem}.service-boundary article:last-child{background:#eef8f5}.service-boundary article>span{color:#14826f;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.service-boundary h3{margin-top:.6rem;font-size:1.05rem}.service-boundary p{margin:0;font-size:.88rem}.commercial-placeholders{margin:1rem 0 0}.commercial-placeholders>div{display:flex;justify-content:space-between;gap:1rem;padding:.65rem 0;border-top:1px solid var(--pb-line)}.commercial-placeholders dd{margin:0;color:var(--pb-muted)}
.maintenance-price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#d1dedb}.maintenance-price-grid article{padding:1.5rem;background:#fff}.maintenance-price-grid span,.maintenance-price-grid strong{display:block}.maintenance-price-grid span{color:#14826f;font-size:.75rem;font-weight:800;text-transform:uppercase}.maintenance-price-grid strong{margin:1rem 0;font-size:1.35rem}.maintenance-price-grid p{margin:0;font-size:.88rem}
.takeover-review{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid var(--pb-line);background:var(--pb-line);gap:1px}.takeover-review li{display:grid;min-height:8rem;place-items:center;align-content:center;gap:.8rem;padding:.8rem;background:#fff;text-align:center}.takeover-review .icon{color:#14826f;font-size:1.3rem}.takeover-review strong{font-size:.8rem}

@media (max-width: 991.98px) {
    .automation-capability-field{grid-template-columns:repeat(3,1fr)}
    .connected-journey{grid-template-columns:1fr}.connected-journey>.icon{transform:rotate(90deg);text-align:center}
    .workflow-ribbon,.compact-process{grid-template-columns:repeat(3,1fr);gap:1px}.workflow-ribbon li{border:1px solid #ccdce3}.workflow-ribbon li::after{display:none}.compact-process li:nth-child(3)::after{display:none}
    .portal-interface-map{grid-template-columns:9rem 1fr}.portal-two-sides{grid-template-columns:1fr}.portal-two-sides>span{grid-template-columns:1fr auto 1fr;min-height:4rem}.portal-choice-line{grid-template-columns:repeat(2,1fr)}
    .security-considerations{grid-template-columns:repeat(3,1fr)}
    .support-route-flow,.maintenance-help-grid,.maintenance-price-grid{grid-template-columns:repeat(2,1fr)}.joined-service-formula{grid-template-columns:1fr}.joined-service-formula>b{text-align:center}.takeover-review{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 767.98px) {
    .automation-hero-visual{max-width:27rem}.automation-hero-visual span{min-height:7rem;font-size:.8rem}.automation-hero-visual strong{width:7rem;min-height:7rem;font-size:.75rem}
    .system-bridge{grid-template-columns:1fr}.system-bridge>span{grid-template-columns:1fr auto 1fr;min-height:3rem}.system-bridge>span .icon{transform:rotate(90deg)}
    .automation-capability-field,.automation-choice-grid,.factor-chip-grid{grid-template-columns:repeat(2,1fr)}.api-doorway{grid-template-columns:1fr;gap:.8rem}.api-doorway>strong{min-height:5rem}
    .portal-interface-map{grid-template-columns:1fr}.portal-interface-map>aside{display:flex;flex-wrap:wrap}.portal-interface-map>aside strong{width:100%}.portal-interface-cards{grid-template-columns:1fr}.portal-two-sides>span .icon{transform:rotate(90deg)}.portal-integration-hub{grid-template-columns:repeat(2,1fr)}.security-considerations{grid-template-columns:repeat(2,1fr)}
    .support-route-flow,.maintenance-help-grid,.service-boundary,.maintenance-price-grid{grid-template-columns:1fr}.maintenance-comparison{grid-template-columns:1fr}.maintenance-comparison>div{margin:auto}.bespoke-support-map{grid-template-columns:1fr}
}
@media (max-width: 575.98px) {
    .automation-capability-field,.automation-choice-grid,.factor-chip-grid,.workflow-ribbon,.compact-process,.portal-choice-line,.security-considerations{grid-template-columns:1fr}.compact-process li:not(:last-child)::after{display:none}.portal-dashboard-body{grid-template-columns:3rem 1fr}.portal-dashboard-body section{grid-template-columns:1fr}.portal-dashboard-body section span{height:3rem}.portal-integration-hub{grid-template-columns:1fr}.support-route-flow,.maintenance-help-grid{grid-template-columns:1fr}.takeover-review{grid-template-columns:repeat(2,1fr)}
}

.legal-hero { background: linear-gradient(145deg,#fff,#edf7fa); }
.legal-layout { max-width: 1040px; }
.legal-content { color: #304f5e; font-size: 1rem; line-height: 1.75; }
.legal-content section + section { margin-top: clamp(2.5rem,6vw,4.5rem); padding-top: clamp(2rem,5vw,3.5rem); border-top: 1px solid #d4e3e9; }
.legal-content h2 { margin-bottom: 1.25rem; color: #073b58; font-size: clamp(1.65rem,3vw,2.35rem); }
.legal-content h3 { margin: 2rem 0 .8rem; color: #174e66; font-size: clamp(1.2rem,2vw,1.45rem); }
.legal-content p, .legal-content li { max-width: 82ch; }
.legal-content li + li { margin-top: .65rem; }
.legal-content a { overflow-wrap: anywhere; }
.legal-definition-list li > p { margin: .35rem 0 0; }
.legal-table-wrap { margin: 1.5rem 0; overflow-x: auto; border: 1px solid #cbdde4; border-radius: .9rem; }
.legal-table-wrap table { width: 100%; min-width: 780px; margin: 0; border-collapse: collapse; background: #fff; }
.legal-table-wrap th, .legal-table-wrap td { padding: 1rem; border-bottom: 1px solid #d8e6eb; vertical-align: top; text-align: left; }
.legal-table-wrap thead th { color: #fff; background: #073b58; }
.legal-table-wrap tbody th { width: 18%; color: #174e66; background: #f1f7f9; }
.legal-table-wrap tbody td:nth-child(2) { width: 24%; }
.legal-table-wrap tr:last-child > * { border-bottom: 0; }
.legal-table-wrap p:last-child, .legal-table-wrap ul:last-child { margin-bottom: 0; }

/* Case studies. Section order is set by each case-study view. */
.case-study-hero { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(3rem,6vw,5.5rem); color: #fff; background: #101d30 url('/assets/images/projectsbackground.jpg') center/cover; }
.case-study-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,rgba(8,18,32,.98),rgba(8,18,32,.89)); }
.case-study-hero h1 { max-width: 15ch; color: #fff; font-size: clamp(2.2rem,3.7vw,3.35rem); }
.case-study-hero p { color: #dfe7ef; }
.case-study-hero .eyebrow { color: #ffb66f; }
.case-study-breadcrumb, .case-study-breadcrumb a { color: #dfe7ef; }
.case-study-breadcrumb .breadcrumb-item.active { color: #aebdce; }
.case-study-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: #8e9bae; }
.case-study-intro { max-width: 50rem; }
.case-study-intro p { font-size: 1.04rem; }
.case-study-intro p:first-child { font-size: 1.18rem; }
.case-study-hero-media { overflow: hidden; border: 1px solid rgba(255,255,255,.22); border-radius: var(--pb-radius); background: #fff; box-shadow: 0 30px 70px -35px #000; }
.case-study-hero-logo { display: block; padding: 1.5rem 2rem; }
.case-study-hero-logo img { display: block; width: min(78%,455px); height: auto; margin-inline: auto; }
.case-study-hero-screenshot { display: block; width: 100%; height: auto; border-top: 1px solid var(--pb-line); }
.case-study-hero-visit { padding: 1rem 1.25rem; border-top: 1px solid var(--pb-line); background: var(--pb-paper); text-align: center; }
.case-study-hero-visit .btn { width: 100%; }
.case-study-image-placeholder { display: grid; min-height: 15rem; place-items: center; align-content: center; gap: .8rem; padding: 2rem; border-top: 1px dashed #aebbcf; color: #53647a; background: linear-gradient(145deg,#edf1f6 0 48%,#e1e7ef 48% 52%,#edf1f6 52%); text-align: center; }
.case-study-image-placeholder .icon { color: var(--pb-blue); font-size: 2rem; }
.case-study-image-placeholder span { max-width: 16rem; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.case-study-results { display: grid; grid-template-columns: repeat(4,1fr); margin-top: clamp(2.5rem,5vw,4.5rem); border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.07); }
.case-study-results > div { min-height: 8.5rem; padding: 1.35rem; border-left: 1px solid rgba(255,255,255,.18); }
.case-study-results > div:first-child { border-left: 0; }
.case-study-results dt { color: #fff; font-size: clamp(1.65rem,3vw,2.5rem); font-weight: 750; line-height: 1.05; }
.case-study-results dd { max-width: 15rem; margin: .7rem 0 0; color: #dfe7ef; font-size: .85rem; }
.case-study-copy-section .case-study-prose { max-width: 52rem; }
.case-study-prose p:last-child { margin-bottom: 0; }
.case-study-emphasis { margin-top: 2rem; padding: 1.5rem; border-left: 4px solid var(--pb-orange); background: var(--pb-paper); }
.case-study-feature-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.17); }
.case-study-feature-grid > div { display: grid; min-height: 8.5rem; place-items: center; align-content: center; gap: .8rem; padding: 1rem; color: #fff; background: #26384f; text-align: center; }
.case-study-feature-grid .icon { color: #ffb66f; font-size: 1.35rem; }
.case-study-feature-grid span { font-size: .82rem; font-weight: 650; }
.case-study-solution-detail { margin-top: 3rem; }
.case-study-app-placeholder { display: grid; min-height: 17rem; place-items: center; align-content: center; gap: .65rem; padding: 2rem; border: 1px dashed rgba(255,255,255,.4); border-radius: var(--pb-radius); background: rgba(255,255,255,.08); text-align: center; }
.case-study-app-placeholder .icon { color: #ffb66f; font-size: 2rem; }
.case-study-app-placeholder strong { color: #fff; }
.case-study-app-placeholder span { color: #dfe7ef; font-size: .75rem; }
.case-study-app-image { overflow: hidden; margin: 0; border: 1px solid rgba(255,255,255,.25); border-radius: var(--pb-radius); background: #fff; }
.case-study-app-image img { display: block; width: 100%; height: auto; }
.case-study-app-image figcaption { padding: .75rem 1rem; color: #dfe7ef; background: #26384f; font-size: .78rem; }
.case-study-service-links { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.2); }
.case-study-service-links a { color: #fff; }
.case-study-recognition { border-block: 1px solid var(--pb-line); }
.case-study-testimonial { border-block: 1px solid #d5deeb; background: radial-gradient(circle at 82% 18%,rgba(46,76,153,.1),transparent 30%),var(--pb-mist); }
.case-study-award { border-top: 4px solid var(--pb-orange); border-bottom: 0; background: radial-gradient(circle at 18% 20%,rgba(46,76,153,.25),transparent 30%),var(--pb-ink); }
.case-study-page .case-study-conclusion { border-bottom: 1px solid var(--pb-line); background: var(--pb-mist); }
.case-study-page .btn-primary {
    --bs-btn-bg: var(--pb-blue);
    --bs-btn-border-color: var(--pb-blue);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: #243c7a;
    --bs-btn-hover-border-color: #243c7a;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #1b3066;
    --bs-btn-active-border-color: #1b3066;
    --bs-btn-active-color: #fff;
}
.case-study-conclusion-copy { max-width: 54rem; }
.case-study-conclusion h2 { max-width: 18ch; }
.testimonial-video-frame { overflow: hidden; aspect-ratio: 16/9; border-radius: var(--pb-radius); background: var(--pb-ink); box-shadow: 0 24px 55px -35px #101d30; }
.testimonial-video-frame video { display: block; width: 100%; height: 100%; object-fit: contain; }
.testimonial-video-placeholder { display: grid; width: 100%; height: 100%; place-items: center; align-content: center; gap: .7rem; padding: 2rem; color: #fff; background: radial-gradient(circle at center,rgba(46,76,153,.34),transparent 35%),linear-gradient(145deg,#101d30,#26384f); text-align: center; }
.testimonial-video-placeholder .icon { display: grid; width: 4rem; height: 4rem; place-items: center; border-radius: 50%; color: var(--pb-ink); background: var(--pb-orange); font-size: 1.25rem; }
.testimonial-video-placeholder strong { margin-top: .5rem; font-size: 1.05rem; }
.testimonial-video-placeholder span { color: #cfd9e5; font-size: .75rem; }
.previous-work-card h3 a { color: inherit; }

/* Primcura Healthcare case study. */
.case-study-page[data-article-slug="primcura-healthcare-recruitment-website"] .case-study-results dt { font-size: clamp(1.25rem,2vw,1.8rem); }
.case-study-page[data-article-slug="primcura-healthcare-recruitment-website"] .case-study-hero-media { background: transparent; }
.primcura-request-card { display: grid; gap: .65rem; padding: 2rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-paper); box-shadow: 1rem 1rem 0 #e7ecf3; }
.primcura-request-card span { color: var(--pb-blue); font-size: .72rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.primcura-request-card strong { color: var(--pb-ink); font-size: 1.12rem; }
.primcura-request-card .icon { margin-block: .5rem; color: var(--pb-orange); font-size: 1.35rem; }
.primcura-decision-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.18); }
.primcura-decision-grid article { display: grid; min-height: 10rem; place-items: center; align-content: center; gap: .55rem; padding: 1.25rem; color: #fff; background: #26384f; text-align: center; }
.primcura-decision-grid .icon { margin-bottom: .3rem; color: #ffb66f; font-size: 1.45rem; }
.primcura-decision-grid span { color: #b9c7d8; font-size: .7rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.primcura-decision-grid strong { max-width: 15rem; }
.primcura-admin-features { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin-top: 2.5rem; background: var(--pb-line); }
.primcura-admin-features span { display: grid; min-height: 7.5rem; place-items: center; align-content: center; gap: .7rem; padding: 1rem; color: var(--pb-ink); background: #fff; font-size: .82rem; font-weight: 700; text-align: center; }
.primcura-admin-features .icon { color: var(--pb-blue); font-size: 1.35rem; }
.primcura-admin-figure { overflow: hidden; margin: 0; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; box-shadow: 0 22px 55px -42px #101d30; }
.primcura-admin-figure img, .primcura-performance-image { display: block; width: 100%; height: auto; }
.primcura-admin-figure figcaption, .primcura-performance-figure figcaption { padding: .85rem 1rem; color: var(--pb-muted); border-top: 1px solid var(--pb-line); font-size: .78rem; }
.primcura-publish-flow { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem; margin: 3rem 0 0; }
.primcura-publish-flow li { position: relative; display: grid; min-height: 12rem; align-content: start; gap: .55rem; padding: 1.35rem; border: 1px solid #ddd4c6; border-radius: var(--pb-radius); background: #fff; }
.primcura-publish-flow li > span { position: absolute; top: .9rem; right: 1rem; color: #99a7b9; font-size: .72rem; font-weight: 750; }
.primcura-publish-flow .icon { margin-bottom: .7rem; color: var(--pb-blue); font-size: 1.4rem; }
.primcura-publish-flow strong { color: var(--pb-ink); line-height: 1.25; }
.primcura-publish-flow small { color: var(--pb-muted); line-height: 1.45; }
.primcura-performance-figure { overflow: hidden; margin: 3rem 0 0; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; box-shadow: 0 22px 55px -42px #101d30; }
.primcura-impact-line { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: .9rem; align-items: center; margin-top: 3rem; }
.primcura-impact-line span { display: grid; min-height: 6rem; place-items: center; padding: 1rem; border: 1px solid rgba(255,255,255,.2); color: #fff; background: #26384f; font-weight: 700; text-align: center; }
.primcura-impact-line .icon { color: #ffb66f; }

/* Arthur's Family Butchers case study. */
.case-study-project-placeholder { display: grid; min-height: 19rem; place-items: center; align-content: center; gap: .7rem; padding: 2rem; border: 1px dashed #9eacbf; border-radius: var(--pb-radius); color: #53647a; background: linear-gradient(145deg,#f4f6f9 0 48%,#e8edf3 48% 52%,#f4f6f9 52%); text-align: center; }
.case-study-project-placeholder .icon { color: var(--pb-blue); font-size: 2rem; }
.case-study-project-placeholder strong { color: var(--pb-ink); }
.case-study-project-placeholder span { max-width: 23rem; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.case-study-project-placeholder-dark { margin-top: 2.5rem; border-color: rgba(255,255,255,.4); color: #dfe7ef; background: linear-gradient(145deg,#26384f 0 48%,#31455e 48% 52%,#26384f 52%); }
.case-study-project-placeholder-dark .icon { color: #ffb66f; }
.case-study-project-placeholder-dark strong { color: #fff; }
.arthurs-paper-count { display: grid; min-height: 25rem; place-items: center; align-content: center; gap: .55rem; padding: 2rem; border: 1px solid #ded5c6; border-radius: var(--pb-radius); color: var(--pb-ink); background: repeating-linear-gradient(#fff 0 2.25rem,#e9edf2 2.25rem calc(2.25rem + 1px)); box-shadow: 1.1rem 1.1rem 0 #ece5da; text-align: center; transform: rotate(1deg); }
.arthurs-paper-count > .icon { color: var(--pb-blue); font-size: 2rem; }
.arthurs-paper-count > span { font-weight: 700; }
.arthurs-paper-count > strong { color: var(--pb-blue); font-size: 3.5rem; line-height: 1; }
.arthurs-paper-count > div { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: 1rem; }
.arthurs-paper-count em { padding: .45rem .7rem; border: 1px solid #dbc6a9; border-radius: 2rem; color: #765f42; background: #fff8ec; font-size: .75rem; font-style: normal; }
.arthurs-product-routes { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.18); }
.arthurs-product-routes span { display: grid; min-height: 7rem; place-items: center; align-content: center; gap: .65rem; padding: 1rem; color: #fff; background: #26384f; text-align: center; }
.arthurs-product-routes .icon { color: #ffb66f; font-size: 1.35rem; }
.arthurs-screenshot-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; }
.arthurs-screenshot-grid figure { display: flex; overflow: hidden; margin: 0; flex-direction: column; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; box-shadow: 0 20px 45px -38px #101d30; }
.arthurs-screenshot-grid img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: top; }
.arthurs-screenshot-grid figcaption { flex: 1; padding: .85rem 1rem; border-top: 1px solid var(--pb-line); color: var(--pb-muted); background: var(--pb-paper); font-size: .8rem; line-height: 1.5; }
.arthurs-collection-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1.35fr; gap: .8rem; align-items: center; }
.arthurs-collection-flow > div, .arthurs-collection-flow > strong { display: grid; min-height: 8rem; place-items: center; align-content: center; gap: .35rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; text-align: center; }
.arthurs-collection-flow > div span { font-weight: 700; }
.arthurs-collection-flow > div small { color: var(--pb-muted); }
.arthurs-collection-flow > strong { color: #fff; background: var(--pb-blue); }
.arthurs-collection-flow > strong .icon { color: #ffd09f; font-size: 1.5rem; }
.arthurs-collection-flow > .icon { color: var(--pb-orange); }
.arthurs-payment-options { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; margin-bottom: 1.5rem; }
.arthurs-payment-options article { padding: 1.5rem; border: 1px solid #ddd4c6; border-radius: var(--pb-radius); background: #fff; }
.arthurs-payment-options .icon { margin-bottom: 1.25rem; color: var(--pb-blue); font-size: 1.5rem; }
.arthurs-payment-options h3 { font-size: 1.15rem; }
.arthurs-payment-options p { margin: 0; }
.arthurs-channel-flow { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.arthurs-channel-flow > span, .arthurs-channel-flow > b { display: grid; min-height: 8rem; place-items: center; align-content: center; gap: .7rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); text-align: center; }
.arthurs-channel-flow > span .icon { color: var(--pb-blue); font-size: 1.5rem; }
.arthurs-channel-flow > .icon { grid-column: 1 / -1; margin: auto; color: var(--pb-orange); }
.arthurs-channel-flow > b { grid-column: 1 / -1; color: #fff; background: var(--pb-ink); }
.arthurs-channel-flow > b .icon { color: #ffb66f; }
.arthurs-checklist { display: grid; gap: .8rem; max-width: 20rem; padding: 1.7rem; border: 1px solid #cbd4e0; border-radius: var(--pb-radius); background: #fff; box-shadow: .75rem .75rem 0 #dfe5ee; }
.arthurs-checklist > .icon { color: var(--pb-blue); font-size: 1.7rem; }
.arthurs-checklist span { height: .65rem; border-radius: 1rem; background: #dbe1e9; }
.arthurs-checklist span:nth-of-type(2) { width: 82%; }
.arthurs-checklist span:nth-of-type(3) { width: 68%; }
.arthurs-checklist b { margin-top: .4rem; color: #28715f; }
.arthurs-stock-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; background: rgba(255,255,255,.16); }
.arthurs-stock-grid article { min-height: 11rem; padding: 1.4rem; background: #26384f; }
.arthurs-stock-grid .icon { margin-bottom: 1.3rem; color: #ffb66f; font-size: 1.35rem; }
.arthurs-stock-grid h3 { color: #fff; font-size: 1.05rem; }
.arthurs-stock-grid p { margin: 0; font-size: .86rem; }
.arthurs-solution .case-study-prose a, .arthurs-inventory p a { color: #fff; text-decoration-color: rgba(255,255,255,.72); }
.arthurs-solution .case-study-prose a:hover, .arthurs-solution .case-study-prose a:focus-visible, .arthurs-inventory p a:hover, .arthurs-inventory p a:focus-visible { color: #ffd09f; text-decoration-color: currentColor; }
.arthurs-result strong { color: #fff; }

/* The Nursery Task App web application case study. */
.case-study-page[data-article-slug="nursery-task-app-web-application"] .case-study-results dt { font-size: clamp(1.05rem,1.8vw,1.5rem); }
.nursery-task-cycle { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; gap: .65rem; align-items: center; }
.nursery-task-cycle > div { display: grid; min-height: 10rem; place-items: center; align-content: center; gap: .5rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-paper); text-align: center; }
.nursery-task-cycle > div .icon { color: var(--pb-blue); font-size: 1.4rem; }
.nursery-task-cycle > div span { color: var(--pb-muted); font-size: .75rem; }
.nursery-task-cycle > .icon { color: var(--pb-orange); }
.nursery-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.17); }
.nursery-steps li { min-height: 16rem; padding: 1.35rem; background: #26384f; }
.nursery-steps li > span { display: block; margin-bottom: 1.45rem; color: #91a0b4; font-size: .7rem; font-weight: 800; letter-spacing: .12em; }
.nursery-steps .icon { margin-bottom: 1rem; color: #ffb66f; font-size: 1.35rem; }
.nursery-steps h3 { color: #fff; font-size: 1rem; }
.nursery-steps p { margin: 0; color: #dfe7ef; font-size: .82rem; }
.nursery-image-row { margin-top: clamp(3rem,6vw,5rem); }
.nursery-image-row .case-study-project-placeholder-dark { margin-top: 0; }
.nursery-compliance-note { padding: 1.15rem 1.25rem; border-left: 4px solid var(--pb-orange); background: var(--pb-paper); font-size: .88rem; }
.nursery-screenshot-grid { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); gap: 1.25rem; margin-top: clamp(3rem,6vw,5rem); }
.nursery-screenshot-grid figure { display: flex; overflow: hidden; margin: 0; flex-direction: column; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; box-shadow: 0 20px 45px -38px #101d30; }
.nursery-screenshot-grid img { display: block; width: 100%; height: clamp(14rem,28vw,23rem); padding: .75rem; object-fit: contain; }
.nursery-screenshot-grid figcaption { flex: 1; padding: .85rem 1rem; border-top: 1px solid var(--pb-line); color: var(--pb-muted); background: var(--pb-paper); font-size: .8rem; line-height: 1.5; }
.nursery-role-pair { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.nursery-role-pair article { min-height: 20rem; padding: 1.7rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; }
.nursery-role-pair article > .icon { margin-bottom: 1.2rem; color: var(--pb-blue); font-size: 1.55rem; }
.nursery-role-pair h3 { font-size: 1.15rem; }
.nursery-role-pair ul { display: grid; gap: .6rem; margin: 1.25rem 0 0; padding-left: 1.2rem; }
.nursery-saas .case-study-prose a { color: #fff; text-decoration-color: rgba(255,255,255,.72); }
.nursery-saas .case-study-prose a:hover, .nursery-saas .case-study-prose a:focus-visible { color: #ffd09f; text-decoration-color: currentColor; }
.nursery-saas-stack { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; margin-top: 2.5rem; background: rgba(255,255,255,.17); }
.nursery-saas-stack > div { display: grid; min-height: 9rem; place-items: center; align-content: center; gap: .5rem; padding: 1.2rem; color: #fff; background: #26384f; text-align: center; }
.nursery-saas-stack .icon { color: #ffb66f; font-size: 1.4rem; }
.nursery-saas-stack span { color: #dfe7ef; font-size: .78rem; }
.nursery-result { background: #fff; }

/* Verx Networx Services job management system case study. */
.case-study-page[data-article-slug="verx-networx-job-management-system"] .case-study-results dt { font-size: clamp(1.05rem,1.8vw,1.5rem); }
.verx-system-map { display: grid; gap: .8rem; }
.verx-system-map > div:not(.verx-system-branches) { display: grid; min-height: 7.5rem; place-items: center; align-content: center; gap: .45rem; padding: 1.2rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-paper); text-align: center; }
.verx-system-map > div.is-centre { color: #fff; border-color: var(--pb-blue); background: var(--pb-blue); }
.verx-system-map .icon { color: var(--pb-orange); font-size: 1.4rem; }
.verx-system-map > .icon { margin: auto; }
.verx-system-map span { color: var(--pb-muted); font-size: .78rem; }
.verx-system-map .is-centre span { color: #dfe7ef; }
.verx-system-branches { display: grid; grid-template-columns: repeat(2,1fr); gap: .8rem; }
.verx-system-branches span { display: grid; min-height: 6.5rem; place-items: center; align-content: center; gap: .55rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; text-align: center; }
.verx-system-branches .icon { color: var(--pb-blue); }
.case-study-context-links { margin: 3rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--pb-line); }
.verx-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.17); }
.verx-steps li { min-height: 17rem; padding: 1.35rem; background: #26384f; }
.verx-steps li > span { display: block; margin-bottom: 1.45rem; color: #91a0b4; font-size: .7rem; font-weight: 800; letter-spacing: .12em; }
.verx-steps .icon { margin-bottom: 1rem; color: #ffb66f; font-size: 1.35rem; }
.verx-steps h3 { color: #fff; font-size: 1rem; }
.verx-steps p { margin: 0; color: #dfe7ef; font-size: .82rem; }
.verx-workflow-image { margin-top: clamp(3rem,6vw,5rem); }
.verx-workflow-image .case-study-project-placeholder-dark { margin-top: 0; }
.verx-role-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.verx-role-grid article { min-height: 19rem; padding: 1.7rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-paper); }
.verx-role-grid article > .icon { margin-bottom: 1.1rem; color: var(--pb-blue); font-size: 1.55rem; }
.verx-role-grid h3 { font-size: 1.15rem; }
.verx-role-grid ul { display: grid; gap: .55rem; margin: 1.2rem 0 0; padding-left: 1.2rem; }
.verx-admin-placeholder { min-height: 12rem; margin-top: 1rem; }
.verx-payment-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: .75rem; align-items: center; }
.verx-payment-flow > div { display: grid; min-height: 10rem; place-items: center; align-content: center; gap: .5rem; padding: 1rem; border: 1px solid rgba(255,255,255,.2); color: #fff; background: #26384f; text-align: center; }
.verx-payment-flow > div .icon { color: #ffb66f; font-size: 1.35rem; }
.verx-payment-flow > div span { color: #dfe7ef; font-size: .75rem; }
.verx-payment-flow > .icon { color: #ffb66f; }
.verx-payment-boundary { padding: 1rem 1.2rem; border-left: 4px solid #ffb66f; color: #fff; background: rgba(255,255,255,.08); }
.verx-result { background: #fff; }

/* Cooling Castle Barn website redesign case study. */
.case-study-page[data-article-slug="cooling-castle-barn-website-redesign"] .case-study-results dt { font-size: clamp(1.03rem,1.75vw,1.45rem); }
.case-study-page[data-article-slug="cooling-castle-barn-website-redesign"] .case-study-hero-media { position: relative; padding-top: 2.15rem; background: #eef0ec; }
.case-study-page[data-article-slug="cooling-castle-barn-website-redesign"] .case-study-hero-media::before { content: "coolingcastlebarn.com"; position: absolute; top: 0; left: 0; display: flex; width: 100%; height: 2.15rem; align-items: center; padding-left: 4.7rem; color: #627063; background: radial-gradient(circle at 1.2rem 50%,#d9897e 0 .27rem,transparent .29rem),radial-gradient(circle at 2.15rem 50%,#dfbd6e 0 .27rem,transparent .29rem),radial-gradient(circle at 3.1rem 50%,#84aa85 0 .27rem,transparent .29rem),#eef0ec; font-size: .68rem; font-weight: 700; letter-spacing: .04em; }
.case-study-page[data-article-slug="cooling-castle-barn-website-redesign"] .case-study-hero-screenshot { border-top-color: #d5dbd3; }
.cooling-content-map { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; overflow: hidden; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-line); }
.cooling-content-map span { display: grid; min-height: 6.5rem; place-items: center; align-content: center; gap: .55rem; padding: 1rem; color: var(--pb-ink); background: var(--pb-paper); font-size: .82rem; font-weight: 700; text-align: center; }
.cooling-content-map .icon { color: #788a75; font-size: 1.35rem; }
.cooling-service-links { margin: 3rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--pb-line); }
.cooling-platform a, .cooling-seo a { color: #fff; text-decoration-color: rgba(255,255,255,.72); }
.cooling-platform a:hover, .cooling-platform a:focus-visible, .cooling-seo a:hover, .cooling-seo a:focus-visible { color: #ffd09f; text-decoration-color: currentColor; }
.cooling-platform-flow { display: grid; grid-template-columns: 1fr auto 1fr; gap: .8rem; align-items: center; }
.cooling-platform-flow > div { display: grid; min-height: 9rem; place-items: center; align-content: center; gap: .5rem; padding: 1rem; border: 1px solid rgba(255,255,255,.22); color: #fff; background: #26384f; text-align: center; }
.cooling-platform-flow > div .icon { color: #ffb66f; font-size: 1.55rem; }
.cooling-platform-flow > div span { color: #dfe7ef; font-size: .76rem; }
.cooling-platform-flow > .icon { color: #ffb66f; }
.cooling-platform-flow .is-elementor { grid-column: 3; border-color: rgba(255,182,111,.55); }
.cooling-browser-frame { overflow: hidden; margin: 0; border: 1px solid #cdd5cb; border-radius: var(--pb-radius); background: #fff; box-shadow: 0 24px 55px -42px #101d30; }
.cooling-browser-bar { display: flex; height: 2.25rem; align-items: center; gap: .4rem; padding-inline: .8rem; color: #637063; background: #edf0eb; }
.cooling-browser-bar span { width: .52rem; height: .52rem; border-radius: 50%; background: #d9897e; }
.cooling-browser-bar span:nth-child(2) { background: #dfbd6e; }
.cooling-browser-bar span:nth-child(3) { background: #84aa85; }
.cooling-browser-bar small { margin-left: .45rem; font-size: .66rem; font-weight: 700; }
.cooling-browser-frame img { display: block; width: 100%; height: auto; }
.cooling-browser-frame figcaption { padding: .85rem 1rem; color: var(--pb-muted); border-top: 1px solid var(--pb-line); font-size: .78rem; }
.cooling-template-pair { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; margin: 2rem 0; }
.cooling-template-pair article { padding: 1.4rem; border: 1px solid #d9d2c7; border-radius: var(--pb-radius); background: #fff; }
.cooling-template-pair .icon { margin-bottom: 1rem; color: #788a75; font-size: 1.4rem; }
.cooling-template-pair h3 { font-size: 1.08rem; }
.cooling-template-pair p { margin: 0; color: var(--pb-muted); font-size: .84rem; }
.cooling-function-note { display: flex; gap: .9rem; align-items: flex-start; padding: 1.15rem 1.25rem; border-left: 4px solid #788a75; background: var(--pb-paper); font-size: .88rem; }
.cooling-function-note .icon { margin-top: .2rem; color: #788a75; }
.cooling-supplier-frame img { height: auto; object-fit: contain; }
.cooling-seo-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; background: rgba(255,255,255,.17); }
.cooling-seo-grid span { display: grid; min-height: 7.5rem; place-items: center; align-content: center; gap: .65rem; padding: 1rem; color: #fff; background: #26384f; font-size: .8rem; font-weight: 700; text-align: center; }
.cooling-seo-grid .icon { color: #ffb66f; font-size: 1.3rem; }
.cooling-redirect-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: .7rem; align-items: center; margin-top: 2rem; }
.cooling-redirect-flow span, .cooling-redirect-flow strong { display: grid; min-height: 6.5rem; place-items: center; padding: 1rem; border: 1px solid rgba(255,255,255,.2); color: #fff; background: #26384f; text-align: center; }
.cooling-redirect-flow strong { border-color: rgba(255,182,111,.55); }
.cooling-redirect-flow > .icon { color: #ffb66f; }
.cooling-video-schema { display: flex; gap: .9rem; align-items: flex-start; margin-top: 2rem; padding: 1rem 1.2rem; border-left: 4px solid #ffb66f; color: #fff; background: rgba(255,255,255,.08); }
.cooling-video-schema .icon { margin-top: .2rem; color: #ffb66f; }
.cooling-visitor-journey { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: .8rem; align-items: center; }
.cooling-visitor-journey > div { display: grid; min-height: 10rem; place-items: center; align-content: center; gap: .5rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; text-align: center; }
.cooling-visitor-journey > div .icon { color: #788a75; font-size: 1.45rem; }
.cooling-visitor-journey > div span { color: var(--pb-muted); font-size: .76rem; }
.cooling-visitor-journey > .icon { color: var(--pb-orange); }
.cooling-result { background: #fff; }

/* The Hospital Day Nursery bespoke website case study. */
.case-study-page[data-article-slug="hospital-day-nursery-website-development"] .case-study-results dt { font-size: clamp(1.05rem,1.8vw,1.48rem); }
.case-study-page[data-article-slug="hospital-day-nursery-website-development"] .case-study-hero-media { position: relative; padding-top: 2.15rem; background: #fffaf0; }
.case-study-page[data-article-slug="hospital-day-nursery-website-development"] .case-study-hero-media::before { content: "thehospitaldaynursery.co.uk"; position: absolute; top: 0; left: 0; display: flex; width: 100%; height: 2.15rem; align-items: center; padding-left: 4.7rem; color: #7044bd; background: radial-gradient(circle at 1.2rem 50%,#e84735 0 .27rem,transparent .29rem),radial-gradient(circle at 2.15rem 50%,#efb914 0 .27rem,transparent .29rem),radial-gradient(circle at 3.1rem 50%,#379c34 0 .27rem,transparent .29rem),#fffaf0; font-size: .66rem; font-weight: 750; letter-spacing: .03em; }
.nursery-site-palette { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.nursery-site-palette span { display: grid; min-height: 9rem; place-items: center; padding: 1rem; border: .65rem solid #fff; border-radius: 48% 52% 44% 56% / 55% 42% 58% 45%; color: #fff; background: var(--nursery-colour); box-shadow: 0 16px 35px -28px #101d30; font-weight: 800; text-align: center; transform: rotate(-2deg); }
.nursery-site-palette span:nth-child(even) { transform: rotate(2deg); }
.nursery-site-phone { position: relative; width: min(100%,22rem); margin: auto; padding: 2.7rem .65rem 3.3rem; border: .55rem solid #17263a; border-radius: 2.5rem; background: #17263a; box-shadow: 0 30px 55px -38px #101d30; }
.nursery-site-phone::after { content: ""; position: absolute; bottom: 1rem; left: 50%; width: 3.4rem; height: .3rem; border-radius: 2rem; background: #6f7b8a; transform: translateX(-50%); }
.nursery-site-phone-bar { position: absolute; top: .85rem; left: 50%; width: 4.5rem; height: .35rem; border-radius: 2rem; background: #6f7b8a; transform: translateX(-50%); }
.nursery-site-phone img { display: block; width: 100%; height: auto; border-radius: 1.15rem; }
.nursery-site-links { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; margin: 2rem 0 0; font-weight: 700; }
.nursery-site-feedback a { color: #fff; text-decoration-color: rgba(255,255,255,.72); }
.nursery-site-feedback a:hover, .nursery-site-feedback a:focus-visible { color: #ffd09f; text-decoration-color: currentColor; }
.nursery-site-browser { overflow: hidden; margin: 0; border: 1px solid rgba(255,255,255,.25); border-radius: var(--pb-radius); background: #fff; box-shadow: 0 25px 55px -40px #000; }
.nursery-site-browser-bar { display: flex; height: 2.25rem; align-items: center; gap: .4rem; padding-inline: .8rem; color: #7044bd; background: #fff8e9; }
.nursery-site-browser-bar span { width: .52rem; height: .52rem; border-radius: 50%; background: #e84735; }
.nursery-site-browser-bar span:nth-child(2) { background: #efb914; }
.nursery-site-browser-bar span:nth-child(3) { background: #379c34; }
.nursery-site-browser-bar small { margin-left: .45rem; font-size: .68rem; font-weight: 750; }
.nursery-site-browser img { display: block; width: 100%; height: auto; }
.nursery-site-browser figcaption { padding: .85rem 1rem; color: #dfe7ef; background: #26384f; font-size: .78rem; }
.nursery-site-build-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.nursery-site-build-grid article { min-height: 13rem; padding: 1.5rem; border: 1px solid #ddd4c6; border-radius: 1.5rem .7rem 1.5rem .7rem; background: #fff; }
.nursery-site-build-grid article:nth-child(2), .nursery-site-build-grid article:nth-child(3) { border-radius: .7rem 1.5rem .7rem 1.5rem; }
.nursery-site-build-grid .icon { margin-bottom: 1.1rem; color: #7044bd; font-size: 1.45rem; }
.nursery-site-build-grid article:nth-child(2) .icon { color: #e7a900; }
.nursery-site-build-grid article:nth-child(3) .icon { color: #379c34; }
.nursery-site-build-grid article:nth-child(4) .icon { color: #e84735; }
.nursery-site-build-grid h3 { font-size: 1.08rem; }
.nursery-site-build-grid p { margin: 0; color: var(--pb-muted); font-size: .84rem; }
.nursery-site-result { background: #fff; }

/* Emerald Sky pricing calculator case study. */
.case-study-page[data-article-slug="emerald-sky-pricing-calculator"] .case-study-results dt { font-size: clamp(1.08rem,1.9vw,1.55rem); }
.case-study-page[data-article-slug="emerald-sky-pricing-calculator"] .case-study-hero-media { background: #fff; }
.emerald-solution a, .emerald-business-tool a, .emerald-business-tool .mt-4 a { font-weight: 700; }
.emerald-service-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; overflow: hidden; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-line); }
.emerald-service-grid article { min-height: 10rem; padding: 1.4rem; background: var(--pb-paper); }
.emerald-service-grid article:last-child { grid-column: 1 / -1; }
.emerald-service-grid .icon { margin-bottom: 1rem; color: var(--pb-blue); font-size: 1.35rem; }
.emerald-service-grid h3 { font-size: 1.05rem; }
.emerald-service-grid p { margin: 0; color: var(--pb-muted); font-size: .84rem; }
.emerald-pricing .case-study-project-placeholder { min-height: 26rem; }
.emerald-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.17); }
.emerald-steps li { min-height: 16rem; padding: 1.35rem; background: #26384f; }
.emerald-steps li > span { display: block; margin-bottom: 1.45rem; color: #91a0b4; font-size: .7rem; font-weight: 800; letter-spacing: .12em; }
.emerald-steps .icon { margin-bottom: 1rem; color: #ffb66f; font-size: 1.35rem; }
.emerald-steps h3 { color: #fff; font-size: 1rem; }
.emerald-steps p { margin: 0; color: #dfe7ef; font-size: .82rem; }
.emerald-indicative-note { padding: 1rem 1.2rem; border-left: 4px solid #ffb66f; color: #fff; background: rgba(255,255,255,.08); }
.emerald-two-routes { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: .85rem; align-items: center; margin-top: 3rem; }
.emerald-two-routes > div { display: grid; min-height: 9rem; place-items: center; align-content: center; gap: .5rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-paper); text-align: center; }
.emerald-two-routes > div.is-core { color: #fff; background: var(--pb-blue); }
.emerald-two-routes > div .icon { color: var(--pb-orange); font-size: 1.35rem; }
.emerald-two-routes > div span { color: var(--pb-muted); font-size: .78rem; }
.emerald-two-routes > div.is-core span { color: #dfe7ef; }
.emerald-two-routes > .icon { color: var(--pb-orange); }
.emerald-benefits { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.emerald-benefits article { min-height: 11rem; padding: 1.5rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; }
.emerald-benefits .icon { margin-bottom: 1.15rem; color: var(--pb-blue); font-size: 1.4rem; }
.emerald-benefits h3 { font-size: 1.05rem; }
.emerald-benefits p { margin: 0; color: var(--pb-muted); font-size: .86rem; }
.emerald-result { background: #fff; }

/* Mal De Mer Club mobile app case study. */
.case-study-page[data-article-slug="mal-de-mer-club-mobile-app"] .case-study-results dt { font-size: clamp(1.1rem,1.9vw,1.55rem); }
.case-study-page[data-article-slug="mal-de-mer-club-mobile-app"] .case-study-hero-media { position: relative; width: min(100%,18rem); overflow: visible; margin-inline: auto; padding: 1.6rem .45rem 1.7rem; border: .55rem solid #101d30; border-radius: 2.4rem; background: #101d30; }
.case-study-page[data-article-slug="mal-de-mer-club-mobile-app"] .case-study-hero-media::before { content: ""; position: absolute; top: .65rem; left: 50%; width: 4.5rem; height: .35rem; border-radius: 2rem; background: #6f7b8a; transform: translateX(-50%); }
.case-study-page[data-article-slug="mal-de-mer-club-mobile-app"] .case-study-hero-media::after { content: ""; position: absolute; bottom: .65rem; left: 50%; width: 3.4rem; height: .3rem; border-radius: 2rem; background: #6f7b8a; transform: translateX(-50%); }
.case-study-page[data-article-slug="mal-de-mer-club-mobile-app"] .case-study-hero-screenshot { border: 0; border-radius: 1.25rem; }
.mal-de-mer-hub { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; overflow: hidden; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-line); box-shadow: 0 24px 55px -42px #0b1728; }
.mal-de-mer-hub > * { display: grid; min-height: 7rem; place-items: center; align-content: center; gap: .55rem; padding: 1rem; color: var(--pb-ink); background: var(--pb-paper); font-size: .82rem; font-weight: 700; text-align: center; }
.mal-de-mer-hub .is-centre { grid-column: 1 / -1; min-height: 12rem; color: #fff; background: var(--pb-blue); }
.mal-de-mer-hub .is-centre strong { font-size: 1.35rem; }
.mal-de-mer-hub .is-centre span { color: #dfe7ef; font-size: .8rem; font-weight: 500; }
.mal-de-mer-hub .icon { color: var(--pb-orange); font-size: 1.45rem; }
.mal-de-mer-feature-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.17); }
.mal-de-mer-feature-list article { display: grid; grid-template-columns: auto auto 1fr; gap: 1rem; min-height: 11rem; padding: 1.4rem; background: #26384f; }
.mal-de-mer-feature-list article:last-child { grid-column: 1 / -1; }
.mal-de-mer-feature-list article > span { color: #91a0b4; font-size: .7rem; font-weight: 800; letter-spacing: .1em; }
.mal-de-mer-feature-list .icon { color: #ffb66f; font-size: 1.35rem; }
.mal-de-mer-feature-list h3 { color: #fff; font-size: 1.05rem; }
.mal-de-mer-feature-list p { margin: 0; color: #dfe7ef; font-size: .86rem; }
.mal-de-mer-store-links { display: flex; gap: 1.5rem; justify-content: space-between; align-items: center; padding: 1.25rem; border-left: 4px solid var(--pb-orange); background: #fff; }
.mal-de-mer-store-links p { max-width: 38rem; margin: 0; }
.mal-de-mer-store-links > div { display: flex; flex: 0 0 auto; gap: .75rem; align-items: center; }
.mal-de-mer-store-links a { display: inline-flex; min-height: 44px; align-items: center; }
.mal-de-mer-store-links img { display: block; width: auto; height: 44px; }
.mal-de-mer-screenshot-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(1.25rem,3vw,2.5rem); margin-top: clamp(3rem,6vw,5rem); }
.mal-de-mer-screenshot-row figure { display: flex; min-width: 0; margin: 0; flex-direction: column; align-items: center; }
.mal-de-mer-phone { position: relative; width: min(100%,16rem); padding: 1.45rem .4rem 1.55rem; border: .5rem solid #101d30; border-radius: 2.2rem; background: #101d30; box-shadow: 0 26px 50px -36px #101d30; }
.mal-de-mer-phone::before { content: ""; position: absolute; top: .55rem; left: 50%; width: 4rem; height: .3rem; border-radius: 2rem; background: #6f7b8a; transform: translateX(-50%); }
.mal-de-mer-phone::after { content: ""; position: absolute; bottom: .55rem; left: 50%; width: 3rem; height: .25rem; border-radius: 2rem; background: #6f7b8a; transform: translateX(-50%); }
.mal-de-mer-phone img { display: block; width: 100%; height: auto; border-radius: 1.1rem; }
.mal-de-mer-screenshot-row figcaption { width: 100%; max-width: 20rem; padding-top: 1rem; color: var(--pb-muted); font-size: .8rem; line-height: 1.5; text-align: center; }
.mal-de-mer-refresh-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: .8rem; align-items: center; }
.mal-de-mer-refresh-flow > div { display: grid; min-height: 10rem; place-items: center; align-content: center; gap: .55rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-paper); text-align: center; }
.mal-de-mer-refresh-flow > div.is-app { color: #fff; background: var(--pb-blue); }
.mal-de-mer-refresh-flow > div .icon { color: var(--pb-orange); font-size: 1.4rem; }
.mal-de-mer-refresh-flow > div span { color: var(--pb-muted); font-size: .78rem; }
.mal-de-mer-refresh-flow > div.is-app span { color: #dfe7ef; }
.mal-de-mer-refresh-flow > .icon { color: var(--pb-orange); }
.mal-de-mer-development a { font-weight: 700; }
.mal-de-mer-principles { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.mal-de-mer-principles article { min-height: 12rem; padding: 1.5rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; }
.mal-de-mer-principles .icon { margin-bottom: 1.2rem; color: var(--pb-blue); font-size: 1.45rem; }
.mal-de-mer-principles h3 { font-size: 1.05rem; }
.mal-de-mer-principles p { margin: 0; color: var(--pb-muted); font-size: .86rem; }
.mal-de-mer-result { background: #fff; }

/* Score My Golf mobile app case study. */
.case-study-page[data-article-slug="score-my-golf-mobile-app"] .case-study-results dt { font-size: clamp(1.15rem,2vw,1.65rem); }
.score-golf-focus { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; overflow: hidden; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-line); }
.score-golf-focus > div { display: grid; min-height: 12rem; place-items: center; align-content: center; gap: .6rem; padding: 1.25rem; background: var(--pb-paper); text-align: center; }
.score-golf-focus > div.is-platform { color: #fff; background: var(--pb-blue); }
.score-golf-focus .icon { color: var(--pb-orange); font-size: 1.55rem; }
.score-golf-focus span { color: var(--pb-muted); font-size: .82rem; }
.score-golf-focus .is-platform span { color: #dfe7ef; }
.score-golf-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.17); }
.score-golf-steps li { position: relative; min-height: 15rem; padding: 1.5rem; background: #26384f; }
.score-golf-steps li > span { display: block; margin-bottom: 1.5rem; color: #91a0b4; font-size: .75rem; font-weight: 800; letter-spacing: .12em; }
.score-golf-steps .icon { margin-bottom: 1rem; color: #ffb66f; font-size: 1.45rem; }
.score-golf-steps h3 { color: #fff; font-size: 1.05rem; }
.score-golf-steps p { margin: 0; color: #dfe7ef; font-size: .86rem; }
.score-golf-image-row { margin-top: clamp(3rem,6vw,5rem); }
.score-golf-image-row .case-study-project-placeholder-dark { margin-top: 0; }
.score-golf-leaderboard { background: radial-gradient(circle at 85% 20%,rgba(46,76,153,.09),transparent 28%),#fff; }
.score-golf-leaderboard-frame { position: relative; padding: 1rem; border: 1px solid var(--pb-line); border-radius: calc(var(--pb-radius) + .25rem); background: var(--pb-ink); box-shadow: 0 24px 55px -35px #0b1728; }
.score-golf-leaderboard-frame .case-study-project-placeholder { min-height: 25rem; }
.score-golf-live-label { position: absolute; top: 1.8rem; right: 1.8rem; padding: .45rem .7rem; border-radius: 2rem; color: #fff; background: rgba(11,23,40,.88); font-size: .75rem; font-weight: 700; }
.score-golf-live-label .icon { margin-right: .35rem; color: #58c48d; font-size: .55rem; }
.score-golf-audiences { display: grid; grid-template-columns: repeat(5,1fr); gap: 1rem; margin-top: 3rem; }
.score-golf-audiences span { display: grid; min-height: 7rem; place-items: center; align-content: center; gap: .7rem; padding: 1rem; border-radius: var(--pb-radius); color: #fff; background: #26384f; box-shadow: 0 18px 38px -32px #0b1728; font-size: .82rem; font-weight: 700; text-align: center; }
.score-golf-audiences .icon { color: #fff; font-size: 1.3rem; }
.score-golf-store-links { display: flex; gap: 1.5rem; justify-content: space-between; align-items: center; margin-top: 3rem; padding: 1.25rem; border-left: 4px solid var(--pb-orange); background: var(--pb-mist); }
.score-golf-store-links p { max-width: 38rem; margin: 0; }
.score-golf-store-links > div { display: flex; flex: 0 0 auto; gap: .75rem; align-items: center; }
.score-golf-store-links a { display: inline-flex; min-height: 44px; align-items: center; }
.score-golf-store-links img { display: block; width: auto; height: 44px; }
.score-golf-photo { margin: 0; overflow: hidden; border-radius: var(--pb-radius); background: #fff; box-shadow: 0 22px 50px -36px #0b1728; }
.score-golf-photo img { display: block; width: 100%; height: auto; }
.score-golf-photo figcaption { padding: .85rem 1rem; color: var(--pb-muted); font-size: .78rem; }
.score-golf-scorecard { margin-top: 2rem; }
.score-golf-calculation-flow { display: grid; grid-template-columns: 1fr auto 1.25fr auto 1fr; gap: .8rem; align-items: center; }
.score-golf-calculation-flow > div { display: grid; min-height: 9rem; place-items: center; align-content: center; gap: .55rem; padding: 1rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; text-align: center; }
.score-golf-calculation-flow > div .icon { color: var(--pb-blue); font-size: 1.4rem; }
.score-golf-calculation-flow > div span { color: var(--pb-muted); font-size: .78rem; }
.score-golf-calculation-flow > .icon { color: var(--pb-orange); }
.score-golf-backend .case-study-prose a { color: #fff; text-decoration-color: rgba(255,255,255,.72); }
.score-golf-backend .case-study-prose a:hover, .score-golf-backend .case-study-prose a:focus-visible { color: #ffd09f; text-decoration-color: currentColor; }
.score-golf-backend-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 2.5rem; background: rgba(255,255,255,.17); }
.score-golf-backend-grid span { min-height: 5rem; padding: 1.1rem; color: #fff; background: #26384f; font-size: .82rem; font-weight: 700; }
.score-golf-result { background: #fff; }

/* MyNetworx mobile app case study. */
.case-study-page[data-article-slug="mynetworx-mobile-app-development"] .case-study-results dt { font-size: clamp(1.15rem,2vw,1.65rem); }
.mynetworx-platform .case-study-emphasis { color: var(--pb-ink); }
.mynetworx-connection { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 1rem; align-items: center; margin-top: 3rem; }
.mynetworx-connection > div { display: grid; min-height: 10rem; place-items: center; align-content: center; gap: .55rem; padding: 1.3rem; border: 1px solid rgba(255,255,255,.22); border-radius: var(--pb-radius); color: #fff; background: #26384f; text-align: center; }
.mynetworx-connection > div.is-core { border-color: rgba(255,182,111,.55); background: var(--pb-blue); }
.mynetworx-connection > div .icon { color: #ffb66f; font-size: 1.5rem; }
.mynetworx-connection > div span { color: #dfe7ef; font-size: .82rem; }
.mynetworx-connection > .connector { color: #ffb66f; }
.mynetworx-feature-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: 3rem; }
.mynetworx-feature-grid article { padding: 1.5rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; }
.mynetworx-feature-grid .icon { margin-bottom: 1.15rem; color: var(--pb-blue); font-size: 1.45rem; }
.mynetworx-feature-grid h3 { font-size: 1.05rem; }
.mynetworx-feature-grid p { margin: 0; color: var(--pb-muted); font-size: .9rem; }
.mynetworx-download { display: flex; gap: 1.25rem; justify-content: space-between; align-items: center; margin-top: 2rem; padding: 1.25rem; border-left: 4px solid var(--pb-orange); background: var(--pb-paper); }
.mynetworx-download p { max-width: 46rem; margin: 0; }
.mynetworx-download .btn { flex: 0 0 auto; }
.mynetworx-screenshot-row { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; margin-top: clamp(3rem,6vw,5rem); }
.mynetworx-screenshot-row figure { display: flex; overflow: hidden; margin: 0; flex-direction: column; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #f3f0f7; box-shadow: 0 20px 45px -38px #101d30; }
.mynetworx-screenshot-row img { display: block; width: 100%; height: clamp(16rem,25vw,22rem); padding: .5rem; object-fit: contain; }
.mynetworx-screenshot-row figcaption { flex: 1; padding: .85rem 1rem; border-top: 1px solid var(--pb-line); color: var(--pb-muted); background: #fff; font-size: .78rem; line-height: 1.45; }
.mynetworx-system-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; background: #d6deea; }
.mynetworx-system-list span { position: relative; min-height: 4.25rem; padding: 1.2rem 1.2rem 1.2rem 2.7rem; background: #fff; font-weight: 650; }
.mynetworx-system-list span::before { content: ""; position: absolute; top: 1.55rem; left: 1.2rem; width: .65rem; height: .65rem; border-radius: 50%; background: var(--pb-orange); }
.mynetworx-user-comparison { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.mynetworx-user-comparison article { padding: 1.7rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-paper); }
.mynetworx-user-comparison .icon { margin-bottom: 1.2rem; color: var(--pb-blue); font-size: 1.55rem; }
.mynetworx-user-comparison h3 { font-size: 1.15rem; }
.mynetworx-user-comparison ul { display: grid; gap: .55rem; margin: 0; padding-left: 1.2rem; }
.mynetworx-technology .case-study-prose a { color: #fff; }
.mynetworx-tech-list { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 2rem; }
.mynetworx-tech-list span { padding: .6rem .9rem; border: 1px solid rgba(255,255,255,.25); border-radius: 2rem; color: #fff; background: #26384f; font-size: .8rem; font-weight: 700; }
/* Career Corner WordPress website case study. */
.case-study-page[data-article-slug="career-corner-wordpress-website"] .case-study-results dt { font-size: clamp(1.05rem,1.75vw,1.45rem); }
.career-vision-path { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 1rem; align-items: center; }
.career-vision-path > div { display: grid; min-height: 11rem; place-items: center; align-content: center; gap: .65rem; padding: 1.35rem; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: #fff; box-shadow: 0 18px 40px -34px #101d30; text-align: center; }
.career-vision-path > div:last-child { color: #fff; border-color: var(--pb-blue); background: var(--pb-blue); }
.career-vision-path > div > .icon { color: var(--pb-orange); font-size: 1.55rem; }
.career-vision-path > div:last-child > .icon { color: #fff; }
.career-vision-path strong { font-size: 1rem; }
.career-vision-path span { color: var(--pb-muted); font-size: .82rem; line-height: 1.5; }
.career-vision-path > div:last-child span { color: #e4f2f8; }
.career-path-arrow { color: var(--pb-blue); }
.career-content { background: radial-gradient(circle at 90% 20%,rgba(35,142,183,.28),transparent 30%),var(--pb-ink); }
.career-publishing-flow { position: relative; display: grid; gap: .9rem; }
.career-publishing-flow::before { content: ""; position: absolute; top: 2.2rem; bottom: 2.2rem; left: 1.45rem; width: 2px; background: rgba(255,255,255,.23); }
.career-publishing-flow li { position: relative; display: grid; grid-template-columns: 2.9rem 2.6rem 1fr; gap: 1rem; align-items: center; min-height: 6.2rem; padding: 1rem 1.2rem 1rem 0; border: 1px solid rgba(255,255,255,.18); border-radius: var(--pb-radius); background: rgba(255,255,255,.08); }
.career-publishing-flow li > span { z-index: 1; display: grid; width: 2.9rem; height: 2.9rem; place-items: center; border-radius: 50%; color: var(--pb-ink); background: var(--pb-orange); font-size: .78rem; font-weight: 850; }
.career-publishing-flow li > .icon { color: #8dd9f3; font-size: 1.3rem; text-align: center; }
.career-publishing-flow strong, .career-publishing-flow small { display: block; }
.career-publishing-flow strong { color: #fff; }
.career-publishing-flow small { margin-top: .25rem; color: #dfe7ef; line-height: 1.45; }
.career-commerce-flow { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; overflow: hidden; border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-line); box-shadow: 0 24px 55px -44px #101d30; }
.career-commerce-flow article { min-height: 14rem; padding: 1.6rem; background: #fff; }
.career-commerce-flow article:nth-child(2) { background: #edf7fa; }
.career-commerce-flow article:nth-child(3) { color: #fff; background: var(--pb-blue); }
.career-commerce-flow .icon { margin-bottom: 1.2rem; color: var(--pb-orange); font-size: 1.75rem; }
.career-commerce-flow h3 { font-size: 1.05rem; }
.career-commerce-flow p { margin: 0; color: var(--pb-muted); font-size: .86rem; }
.career-commerce-flow article:nth-child(3) h3, .career-commerce-flow article:nth-child(3) p { color: #fff; }
@media (max-width: 991.98px) {
    .case-study-results, .case-study-feature-grid { grid-template-columns: repeat(2,1fr); }
    .case-study-results > div:nth-child(3) { border-left: 0; }
    .case-study-results > div:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.18); }
    .arthurs-collection-flow { grid-template-columns: 1fr; }
    .arthurs-collection-flow > .icon { transform: rotate(90deg); }
    .arthurs-collection-flow > strong { width: 100%; }
    .primcura-publish-flow, .primcura-admin-features { grid-template-columns: repeat(2,1fr); }
    .primcura-impact-line { grid-template-columns: 1fr; }
    .primcura-impact-line .icon { margin: auto; transform: rotate(90deg); }
    .nursery-task-cycle { grid-template-columns: 1fr; }
    .nursery-task-cycle > .icon { margin: auto; transform: rotate(90deg); }
    .nursery-steps { grid-template-columns: repeat(2,1fr); }
    .nursery-steps li:last-child { grid-column: 1 / -1; min-height: 11rem; }
    .verx-steps { grid-template-columns: repeat(2,1fr); }
    .verx-steps li:last-child { grid-column: 1 / -1; min-height: 11rem; }
    .verx-payment-flow { grid-template-columns: 1fr; }
    .verx-payment-flow > .icon { margin: auto; transform: rotate(90deg); }
    .cooling-platform-flow, .cooling-redirect-flow, .cooling-visitor-journey { grid-template-columns: 1fr; }
    .cooling-platform-flow > .icon, .cooling-redirect-flow > .icon, .cooling-visitor-journey > .icon { margin: auto; transform: rotate(90deg); }
    .cooling-platform-flow .is-elementor { grid-column: 1; }
    .nursery-site-palette { max-width: 32rem; margin: auto; }
    .emerald-steps { grid-template-columns: repeat(2,1fr); }
    .emerald-steps li:last-child { grid-column: 1 / -1; min-height: 11rem; }
    .emerald-two-routes { grid-template-columns: 1fr; }
    .emerald-two-routes > .icon { margin: auto; transform: rotate(90deg); }
    .mal-de-mer-refresh-flow { grid-template-columns: 1fr; }
    .mal-de-mer-refresh-flow > .icon { margin: auto; transform: rotate(90deg); }
    .score-golf-steps { grid-template-columns: repeat(2,1fr); }
    .score-golf-audiences { grid-template-columns: repeat(3,1fr); }
    .score-golf-calculation-flow { grid-template-columns: 1fr; }
    .score-golf-calculation-flow > .icon { margin: auto; transform: rotate(90deg); }
    .mynetworx-connection { grid-template-columns: 1fr; }
    .mynetworx-connection > .connector { margin: auto; transform: rotate(90deg); }
    .mynetworx-feature-grid { grid-template-columns: repeat(2,1fr); }
    .mynetworx-screenshot-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mal-de-mer-screenshot-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .career-vision-path { grid-template-columns: 1fr; }
    .career-path-arrow { margin: auto; transform: rotate(90deg); }
}
@media (max-width: 575.98px) {
    .case-study-results { grid-template-columns: 1fr; }
    .case-study-results > div { min-height: 0; border-top: 1px solid rgba(255,255,255,.18); border-left: 0; }
    .case-study-results > div:first-child { border-top: 0; }
    .case-study-feature-grid { grid-template-columns: 1fr; }
    .case-study-feature-grid > div { min-height: 6rem; }
    .primcura-decision-grid, .primcura-publish-flow, .primcura-admin-features { grid-template-columns: 1fr; }
    .arthurs-product-routes, .arthurs-payment-options, .arthurs-channel-flow, .arthurs-stock-grid, .arthurs-screenshot-grid { grid-template-columns: 1fr; }
    .arthurs-channel-flow > .icon, .arthurs-channel-flow > b { grid-column: 1; }
    .nursery-steps, .nursery-role-pair, .nursery-saas-stack, .nursery-screenshot-grid { grid-template-columns: 1fr; }
    .nursery-steps li, .nursery-steps li:last-child { grid-column: 1; min-height: 0; }
    .verx-system-branches, .verx-steps, .verx-role-grid { grid-template-columns: 1fr; }
    .verx-steps li, .verx-steps li:last-child { grid-column: 1; min-height: 0; }
    .cooling-content-map, .cooling-template-pair, .cooling-seo-grid { grid-template-columns: 1fr; }
    .nursery-site-palette, .nursery-site-build-grid { grid-template-columns: 1fr; }
    .nursery-site-palette span { min-height: 7rem; }
    .nursery-site-build-grid article { min-height: 0; }
    .emerald-service-grid, .emerald-steps, .emerald-benefits { grid-template-columns: 1fr; }
    .emerald-service-grid article:last-child, .emerald-steps li:last-child { grid-column: 1; }
    .emerald-steps li, .emerald-steps li:last-child { min-height: 0; }
    .mal-de-mer-hub, .mal-de-mer-feature-list, .mal-de-mer-principles, .mal-de-mer-screenshot-row { grid-template-columns: 1fr; }
    .mal-de-mer-hub .is-centre, .mal-de-mer-feature-list article:last-child { grid-column: 1; }
    .mal-de-mer-feature-list article { grid-template-columns: auto 1fr; min-height: 0; }
    .mal-de-mer-feature-list article > div { grid-column: 1 / -1; }
    .mal-de-mer-store-links, .score-golf-store-links { align-items: flex-start; flex-direction: column; }
    .mal-de-mer-store-links > div, .score-golf-store-links > div { flex-wrap: wrap; }
    .score-golf-focus, .score-golf-steps, .score-golf-audiences, .score-golf-backend-grid { grid-template-columns: 1fr; }
    .score-golf-steps li { min-height: 0; }
    .score-golf-audiences span { min-height: 5.5rem; }
    .score-golf-live-label { position: static; margin-top: .75rem; text-align: center; }
    .mynetworx-feature-grid, .mynetworx-system-list, .mynetworx-user-comparison { grid-template-columns: 1fr; }
    .mynetworx-download { align-items: stretch; flex-direction: column; }
    .mynetworx-download .btn { width: 100%; }
    .career-commerce-flow { grid-template-columns: 1fr; }
    .career-commerce-flow article { min-height: 0; }
    .career-publishing-flow li { grid-template-columns: 2.9rem 2.4rem 1fr; gap: .7rem; }
}