/* Purple Frog Signs — restrained shared gradient system and scoped application. */
:root {
    --gradient-deep-aubergine-solid: #271330;
    --gradient-deep-aubergine: linear-gradient(135deg, #16091F 0%, #271330 52%, #4A123A 100%);
    --gradient-aubergine-magenta-glow-solid: #271330;
    --gradient-aubergine-magenta-glow: radial-gradient(circle at 82% 18%, rgba(163, 22, 94, .30) 0%, rgba(163, 22, 94, .12) 28%, transparent 52%), #271330;
    --gradient-dark-magenta-cta-solid: #A3165E;
    --gradient-dark-magenta-cta: linear-gradient(135deg, #A3165E 0%, #921550 48%, #7D1448 100%);
    --gradient-dark-footer-solid: #271330;
    --gradient-dark-footer: linear-gradient(180deg, #271330 0%, #1B0C22 100%);
    --gradient-surface-accent: #F08ABB;
}

/* Homepage: four deliberately chosen depth changes. The approved hero is not
   part of this layer. */
.page--home .home-capabilities {
    background: var(--gradient-aubergine-magenta-glow-solid);
    background: var(--gradient-aubergine-magenta-glow);
}

.page--home .home-capability > a:hover,
.page--home .home-capability > a:focus-visible {
    background: rgba(255, 255, 255, .10);
    color: var(--color-white);
}

.page--home .home-coverage {
    border-top-color: rgba(255, 255, 255, .16);
    background: var(--gradient-deep-aubergine-solid);
    background: var(--gradient-deep-aubergine);
    color: var(--color-white);
}

.page--home .home-coverage h2,
.page--home .home-coverage__copy p:first-child {
    color: var(--color-white);
}

.page--home .home-coverage__copy p {
    color: rgba(255, 255, 255, .82);
}

.page--home .home-coverage .eyebrow {
    color: var(--gradient-surface-accent);
}

.page--home .home-coverage .eyebrow::before {
    background: var(--gradient-surface-accent);
}

.page--home .home-coverage .text-link--light {
    color: var(--color-white);
}

.page--home .home-coverage .text-link--light:hover,
.page--home .home-coverage .text-link--light:focus-visible {
    color: var(--color-white);
    text-decoration: underline;
}

.page--home .home-coverage :focus-visible {
    outline-color: var(--color-white);
    box-shadow: 0 0 0 2px var(--color-aubergine);
}

/* The closing CTA is shared by public pages, including the section headed
   "Let us make the next step clear". Its existing clean edges stay intact. */
.final-cta {
    background: var(--gradient-dark-magenta-cta-solid);
    background: var(--gradient-dark-magenta-cta);
}

/* The premium mega-footer keeps its approved structure and logo treatment. */
.site-footer {
    background: var(--gradient-dark-footer-solid);
    background: var(--gradient-dark-footer);
}

/* Products: the live finder is the approved nine-family, four-card catalogue.
   Only each image-led grid is dark; family explanations and 130 taxonomy terms
   remain on their clear light reading surfaces. */
.page--products-overview .product-family__product-grid {
    padding: clamp(1rem, 2vw, 1.5rem);
    border-radius: var(--radius-sm);
    background: var(--gradient-deep-aubergine-solid);
    background: var(--gradient-deep-aubergine);
}

.page--products-overview .product-tile {
    border-color: rgba(255, 255, 255, .22);
    background: rgba(22, 9, 31, .34);
}

.page--products-overview .product-tile__media {
    border-bottom-color: rgba(255, 255, 255, .22);
    background: var(--color-stone);
}

.page--products-overview .product-tile__link {
    color: var(--color-white);
}

.page--products-overview .product-tile__description {
    color: rgba(255, 255, 255, .82);
}

.page--products-overview .product-tile__link:not(.product-tile__link--static):hover,
.page--products-overview .product-tile__link:not(.product-tile__link--static):focus-visible {
    background: rgba(255, 255, 255, .10);
    color: var(--color-white);
}

.page--products-overview .product-tile__link:focus-visible {
    outline-color: var(--color-white);
    box-shadow: inset 0 0 0 1px var(--color-accent);
}

.page--products-overview .product-family__arrow {
    border-color: rgba(255, 255, 255, .28);
    background: var(--color-white);
}

/* Services: upgrade the one existing dark pathway and retain the other four
   light/stone treatments. The product image itself remains unfiltered. */
.page--services-overview .services-pathway--tone-dark {
    background-color: var(--gradient-deep-aubergine-solid);
    background-image: var(--gradient-deep-aubergine);
}

.page--services-overview .services-pathway--tone-dark::before {
    background-image: none;
}

/* Shared structured-list family: one controlled dark panel, normal DOM/grid
   order and a light editorial heading surface. This late layer deliberately
   overrides the older light-table and alternate-sector rules without changing
   their server-rendered wording or destinations. */
.inner-section--gradient-list,
.inner-flow--sector .inner-section--gradient-list,
.inner-flow--sector .inner-section--gradient-list.inner-section--alternate {
    background: var(--color-white);
    color: var(--color-charcoal);
}

.inner-section--gradient-list .inner-section__heading h2,
.inner-flow--sector .inner-section--gradient-list .inner-section__heading h2,
.inner-section--gradient-list .inner-section__content > p,
.inner-flow--sector .inner-section--gradient-list .inner-section__content > p {
    color: var(--color-charcoal);
}

.inner-section--gradient-list .inner-section__number,
.inner-section--gradient-list .inner-section__icon {
    color: var(--color-accent);
}

.inner-items--gradient-panel,
.inner-items--navigation-index.inner-items--gradient-panel {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    padding: clamp(.45rem, 1vw, .75rem);
    border: 1px solid rgba(255, 255, 255, .20);
    border-radius: clamp(.85rem, 1.6vw, 1.25rem);
    background: var(--gradient-deep-aubergine-solid);
    background: var(--gradient-deep-aubergine);
    list-style: none;
}

.inner-items--gradient-panel > .inner-item,
.inner-items--editorial-list.inner-items--gradient-panel > .inner-item,
.inner-flow--sector .inner-section--gradient-list .inner-items--gradient-panel > .inner-item {
    min-width: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .17);
    background: transparent;
    color: var(--color-white);
}

.inner-items--gradient-panel > .inner-item:nth-child(odd) {
    border-right: 1px solid rgba(255, 255, 255, .17);
}

.inner-items--gradient-panel > .inner-item:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.inner-items--navigation-index.inner-items--gradient-panel > .inner-item:last-child:nth-child(odd) {
    grid-column: auto;
    border-right: 0;
}

.inner-items--gradient-panel .inner-item__link,
.inner-items--editorial-list.inner-items--gradient-panel .inner-item__link,
.inner-items--editorial-list.inner-items--gradient-panel .inner-item--link:hover .inner-item__link {
    min-height: 6.9rem;
    padding: clamp(1.15rem, 2vw, 1.55rem) clamp(3rem, 4vw, 4rem) clamp(1.15rem, 2vw, 1.55rem) clamp(1rem, 2vw, 1.45rem);
    color: var(--color-white);
}

.inner-items--gradient-panel .inner-item__title,
.inner-items--gradient-panel .inner-item__icon,
.inner-flow--sector .inner-section--gradient-list .inner-item__title {
    color: var(--color-white);
}

.inner-items--gradient-panel .inner-item__description,
.inner-flow--sector .inner-section--gradient-list .inner-item__description {
    color: rgba(255, 255, 255, .83);
}

.inner-items--gradient-panel .inner-item__index,
.inner-items--gradient-panel .inner-item__arrow {
    color: var(--gradient-surface-accent);
}

.inner-items--gradient-panel > .inner-item:hover,
.inner-items--gradient-panel > .inner-item:focus-within,
.inner-flow--sector .inner-section--gradient-list .inner-items--gradient-panel > .inner-item:hover,
.inner-flow--sector .inner-section--gradient-list .inner-items--gradient-panel > .inner-item:focus-within {
    background: rgba(255, 255, 255, .10);
    color: var(--color-white);
}

.inner-items--gradient-panel > .inner-item:hover .inner-item__title,
.inner-items--gradient-panel > .inner-item:focus-within .inner-item__title,
.inner-items--gradient-panel > .inner-item:hover .inner-item__description,
.inner-items--gradient-panel > .inner-item:focus-within .inner-item__description,
.inner-flow--sector .inner-section--gradient-list .inner-items--gradient-panel > .inner-item:hover .inner-item__title,
.inner-flow--sector .inner-section--gradient-list .inner-items--gradient-panel > .inner-item:focus-within .inner-item__title,
.inner-flow--sector .inner-section--gradient-list .inner-items--gradient-panel > .inner-item:hover .inner-item__description,
.inner-flow--sector .inner-section--gradient-list .inner-items--gradient-panel > .inner-item:focus-within .inner-item__description {
    color: var(--color-white);
}

.inner-items--gradient-panel .inner-item__link:focus-visible {
    z-index: 2;
    outline: 3px solid var(--color-white);
    outline-offset: -4px;
    box-shadow: inset 0 0 0 6px rgba(240, 138, 187, .58);
}

/* Homepage selected sectors: preserve its approved contained panel while
   restoring sequential left-to-right, top-to-bottom reading order. */
.page--home .home-sectors__list {
    grid-auto-flow: row;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
}

.page--home .home-sectors__list > li > span {
    color: var(--gradient-surface-accent);
}

/* Services pathway navigation uses the same family but retains its own icon-
   led five/three/two/one-column responsive progression. */
.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    padding: clamp(.45rem, 1vw, .75rem);
    border: 1px solid rgba(255, 255, 255, .20);
    border-radius: clamp(.85rem, 1.6vw, 1.25rem);
    background: var(--gradient-aubergine-magenta-glow-solid);
    background: var(--gradient-aubergine-magenta-glow);
}

.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways > li,
.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways > li:first-child {
    min-width: 0;
    border: 0;
    background: rgba(255, 255, 255, .045);
}

.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways a {
    color: var(--color-white);
}

.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways a > span {
    color: var(--gradient-surface-accent);
}

.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways .services-pathway-index__icon {
    color: var(--color-white);
}

.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways a:hover,
.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways a:focus-visible {
    background: rgba(255, 255, 255, .12);
    color: var(--color-white);
}

.page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways a:focus-visible {
    z-index: 1;
    outline: 3px solid var(--color-white);
    outline-offset: -4px;
    box-shadow: inset 0 0 0 6px rgba(240, 138, 187, .58);
}

.page--services-overview .services-coordination li > span {
    color: var(--gradient-surface-accent);
}

@media (max-width: 64rem) {
    .page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 50rem) {
    .inner-items--gradient-panel,
    .inner-items--navigation-index.inner-items--gradient-panel {
        grid-template-columns: minmax(0, 1fr);
    }

    .inner-items--gradient-panel > .inner-item,
    .inner-items--gradient-panel > .inner-item:nth-child(odd),
    .inner-items--gradient-panel > .inner-item:nth-last-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, .17);
    }

    .inner-items--gradient-panel > .inner-item:last-child {
        border-bottom: 0;
    }

    .page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 36rem) {
    .page--home .home-sectors__list,
    .page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways {
        grid-template-columns: minmax(0, 1fr);
    }

    .inner-items--gradient-panel .inner-item__link,
    .inner-items--editorial-list.inner-items--gradient-panel .inner-item__link,
    .inner-items--editorial-list.inner-items--gradient-panel .inner-item--link:hover .inner-item__link {
        min-height: 0;
        padding: 1.1rem 2.8rem 1.1rem .95rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .inner-items--gradient-panel > .inner-item,
    .page--services-overview .services-pathway-index > .structured-gradient-list--service-pathways a {
        transition: none;
    }
}

/* Detail templates: one concise, item-free final section becomes a controlled
   visual break. Dense lists, imagery, FAQs, forms, legal and article content
   are excluded by the shared template condition. */
.page--service-detail .inner-section--colour-break,
.page--product-detail .inner-section--colour-break,
.page--sector-detail .inner-section--colour-break {
    overflow: visible;
    border-color: rgba(255, 255, 255, .18);
    background: var(--gradient-deep-aubergine-solid);
    background: var(--gradient-deep-aubergine);
    color: var(--color-white);
}

.inner-section--colour-break h2,
.inner-section--colour-break .inner-section__content > p,
.inner-section--colour-break .inner-section__icon,
.inner-section--colour-break .text-link {
    color: var(--color-white);
}

.inner-section--colour-break .inner-section__content > p {
    color: rgba(255, 255, 255, .82);
}

.inner-section--colour-break .inner-section__number,
.inner-section--colour-break .eyebrow {
    color: var(--gradient-surface-accent);
}

.inner-section--colour-break .eyebrow::before {
    background: var(--gradient-surface-accent);
}

.inner-section--colour-break .text-link:hover,
.inner-section--colour-break .text-link:focus-visible {
    color: var(--color-white);
    text-decoration: underline;
}

.inner-section--colour-break :focus-visible {
    outline-color: var(--color-white);
    box-shadow: 0 0 0 2px var(--color-aubergine);
}

@media (forced-colors: active) {
    .page--products-overview .product-family__product-grid,
    .page--services-overview .services-pathway--tone-dark,
    .structured-gradient-list,
    .inner-items--gradient-panel,
    .inner-section--colour-break,
    .page--home .home-capabilities,
    .page--home .home-coverage,
    .final-cta,
    .site-footer {
        border-color: CanvasText;
        background: Canvas;
        color: CanvasText;
        forced-color-adjust: auto;
    }

    .structured-gradient-list *,
    .inner-items--gradient-panel * {
        color: CanvasText;
        forced-color-adjust: auto;
    }
}