/*
Theme Name: ARB Marketing and IT Services
Theme URI: https://arbitservices.co.uk/
Author: ARB Marketing and IT Services
Author URI: https://arbitservices.co.uk/
Description: Custom WordPress theme for ARB Marketing and IT Services, Norwich.
Version: 2.5.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: arb-services
*/

/* =========================================================
   1. VARIABLES
   ========================================================= */

:root {
    --arb-navy: #071a33;
    --arb-navy-light: #102b4f;
    --arb-navy-soft: #1d3553;
    --arb-gold: #d9a62e;
    --arb-gold-dark: #b98516;
    --arb-gold-light: #f0c75e;
    --arb-white: #ffffff;
    --arb-background: #f5f7fa;
    --arb-background-dark: #e9eef4;
    --arb-text: #26364a;
    --arb-muted: #627083;
    --arb-border: #dfe5ec;
    --arb-success: #1d8a58;
    --arb-error: #c83d3d;
    --arb-container: 1200px;
    --arb-radius: 14px;
    --arb-radius-small: 8px;
    --arb-shadow: 0 16px 45px rgba(7, 26, 51, 0.12);
    --arb-shadow-small: 0 8px 24px rgba(7, 26, 51, 0.08);
    --arb-transition: 0.25s ease;
}

/* =========================================================
   2. RESET AND BASE
   ========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 110px;
}

body {
    margin: 0;
    overflow-x: hidden;
    background: var(--arb-white);
    color: var(--arb-text);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.admin-bar .site-header {
    top: 32px;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
    text-decoration: none;
    transition: color var(--arb-transition);
}

button,
input,
textarea,
select {
    font: inherit;
}

button,
[type="button"],
[type="submit"] {
    cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 18px;
    color: var(--arb-navy);
    font-weight: 800;
    line-height: 1.2;
}

h1 { font-size: clamp(2.4rem, 5vw, 4.4rem); }
h2 { font-size: clamp(2rem, 4vw, 3.2rem); }
h3 { font-size: clamp(1.35rem, 2.4vw, 1.8rem); }

p {
    margin-top: 0;
    margin-bottom: 20px;
}

ul,
ol {
    margin-top: 0;
    margin-bottom: 22px;
}

::selection {
    background: var(--arb-gold);
    color: var(--arb-navy);
}

:focus-visible {
    outline: 3px solid var(--arb-gold);
    outline-offset: 3px;
}

.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.screen-reader-text:focus {
    top: 8px;
    left: 8px;
    z-index: 100000;
    width: auto;
    height: auto;
    padding: 14px 18px;
    clip: auto;
    background: var(--arb-white);
    color: var(--arb-navy);
    font-weight: 700;
    white-space: normal;
}

/* =========================================================
   3. LAYOUT UTILITIES
   ========================================================= */

.arb-container {
    width: min(calc(100% - 40px), var(--arb-container));
    margin-right: auto;
    margin-left: auto;
}

.arb-section {
    padding: 90px 0;
}

.arb-section-alt {
    background: var(--arb-background);
}

.arb-section-heading {
    max-width: 760px;
    margin: 0 auto 50px;
    text-align: center;
}

.arb-section-heading p {
    color: var(--arb-muted);
    font-size: 1.08rem;
}

/* =========================================================
   4. BUTTONS
   ========================================================= */

.arb-button,
button,
input[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 22px;
    border: 2px solid transparent;
    border-radius: var(--arb-radius-small);
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    transition: background var(--arb-transition), color var(--arb-transition), border-color var(--arb-transition), transform var(--arb-transition), box-shadow var(--arb-transition);
}

.arb-button:hover,
button:hover,
input[type="submit"]:hover {
    transform: translateY(-2px);
}

.arb-button-primary,
button,
input[type="submit"] {
    background: var(--arb-gold);
    color: var(--arb-navy);
    box-shadow: 0 8px 22px rgba(217, 166, 46, 0.24);
}

.arb-button-primary:hover,
button:hover,
input[type="submit"]:hover {
    background: var(--arb-gold-light);
    color: var(--arb-navy);
}

.arb-button-secondary {
    background: var(--arb-navy);
    color: var(--arb-white);
}

.arb-button-secondary:hover {
    background: var(--arb-navy-light);
    color: var(--arb-white);
}

.arb-button-outline {
    border-color: var(--arb-navy);
    background: transparent;
    color: var(--arb-navy);
}

.arb-button-outline:hover {
    background: var(--arb-navy);
    color: var(--arb-white);
}

/* =========================================================
   5. HEADER AND BRANDING
   ========================================================= */

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    background: rgba(255, 255, 255, 0.97);
    border-bottom: 1px solid rgba(7, 26, 51, 0.08);
    box-shadow: 0 4px 18px rgba(7, 26, 51, 0.06);
    backdrop-filter: blur(12px);
}

.header-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    min-height: 96px;
}

.site-branding {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.site-logo {
    display: inline-flex;
    align-items: center;
    max-width: 235px;
}

.site-logo img {
    display: block;
    width: auto;
    max-width: 100%;
    height: 62px;
    object-fit: contain;
    transition: transform var(--arb-transition), opacity var(--arb-transition);
}

.site-logo:hover img {
    opacity: 0.92;
    transform: scale(1.02);
}

.site-name {
    color: var(--arb-navy);
    font-size: 1.35rem;
    font-weight: 800;
}

.custom-logo-link {
    display: inline-flex;
    align-items: center;
}

.custom-logo {
    width: auto;
    max-width: 235px;
    max-height: 62px;
    object-fit: contain;
}

/* =========================================================
   6. NAVIGATION
   ========================================================= */

.primary-navigation {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    margin-left: auto;
}

.primary-navigation .menu,
.primary-navigation > ul {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.primary-navigation li {
    position: relative;
    margin: 0;
}

.primary-navigation li a {
    position: relative;
    display: block;
    padding: 12px 9px;
    color: var(--arb-navy);
    font-size: 0.95rem;
    font-weight: 700;
}

.primary-navigation li a::after {
    position: absolute;
    right: 11px;
    bottom: 7px;
    left: 11px;
    height: 2px;
    background: var(--arb-gold);
    content: "";
    transform: scaleX(0);
    transform-origin: right;
    transition: transform var(--arb-transition);
}

.primary-navigation li a:hover,
.primary-navigation .current-menu-item > a,
.primary-navigation .current_page_item > a {
    color: var(--arb-gold-dark);
}

.primary-navigation li a:hover::after,
.primary-navigation .current-menu-item > a::after,
.primary-navigation .current_page_item > a::after {
    transform: scaleX(1);
    transform-origin: left;
}

.header-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-height: 46px;
    padding: 11px 17px;
    margin-left: 0;
    background: var(--arb-gold);
    border: 2px solid var(--arb-gold);
    border-radius: var(--arb-radius-small);
    color: var(--arb-navy);
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    box-shadow: 0 8px 22px rgba(217, 166, 46, 0.22);
    transition: background var(--arb-transition), border-color var(--arb-transition), color var(--arb-transition), transform var(--arb-transition), box-shadow var(--arb-transition);
}

.header-cta:hover,
.header-cta:focus-visible {
    background: var(--arb-gold-light);
    border-color: var(--arb-gold-light);
    color: var(--arb-navy);
    box-shadow: 0 10px 26px rgba(217, 166, 46, 0.3);
    transform: translateY(-2px);
}

.primary-navigation .sub-menu {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    z-index: 20;
    width: 230px;
    padding: 10px;
    margin: 0;
    visibility: hidden;
    opacity: 0;
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius);
    box-shadow: var(--arb-shadow);
    list-style: none;
    transform: translateY(10px);
    transition: opacity var(--arb-transition), visibility var(--arb-transition), transform var(--arb-transition);
}

.primary-navigation li:hover > .sub-menu,
.primary-navigation li:focus-within > .sub-menu {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

.primary-navigation .sub-menu li,
.primary-navigation .sub-menu a {
    width: 100%;
}

.primary-navigation .sub-menu a {
    padding: 11px 13px;
    border-radius: 7px;
    font-size: 0.95rem;
}

.primary-navigation .sub-menu a::after { display: none; }
.primary-navigation .sub-menu a:hover { background: var(--arb-background); }

/* =========================================================
   7. MOBILE MENU BUTTON
   ========================================================= */

.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 46px;
    height: 46px;
    padding: 10px;
    margin-left: auto;
    border: 0;
    border-radius: 7px;
    background: transparent;
    box-shadow: none;
}

.mobile-menu-toggle:hover {
    background: var(--arb-background);
    transform: none;
}

.mobile-menu-toggle span:not(.screen-reader-text) {
    display: block;
    width: 24px;
    height: 3px;
    background: var(--arb-navy);
    border-radius: 20px;
    transition: transform var(--arb-transition), opacity var(--arb-transition);
}

.mobile-menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.mobile-menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.mobile-menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* =========================================================
   8. HERO SECTION
   ========================================================= */

.arb-hero {
    position: relative;
    min-height: 700px;
    overflow: hidden;
    background: #061a38;
}

.arb-hero-background {
    position: absolute;
    inset: 0;
    z-index: 1;
    background-image: url("assets/images/arb-hero.webp");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.arb-hero-background::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(270deg, rgba(4, 20, 44, 0.14) 0%, rgba(4, 20, 44, 0.02) 55%, rgba(4, 20, 44, 0) 100%);
    content: "";
}

.arb-hero-content {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 700px;
    padding-top: 70px;
    padding-bottom: 70px;
}

.arb-hero-panel {
    width: min(100%, 445px);
    margin-right: 4%;
    padding: 24px 25px;
    background: rgba(5, 23, 50, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.32);
    backdrop-filter: blur(9px);
}

.arb-hero .hero-label {
    margin: 0 0 9px;
    color: var(--arb-gold);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    line-height: 1.5;
    text-transform: uppercase;
}

.arb-hero h1 {
    max-width: 410px;
    margin: 0 0 13px;
    color: var(--arb-white);
    font-size: clamp(1.85rem, 2.8vw, 2.7rem);
    line-height: 1.08;
    letter-spacing: -0.035em;
}

.arb-hero .hero-description {
    max-width: 400px;
    margin: 0;
    color: rgba(255, 255, 255, 0.87);
    font-size: 0.94rem;
    line-height: 1.55;
}

.arb-hero .hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}

.arb-hero .arb-button {
    min-height: 44px;
    padding: 10px 16px;
    font-size: 0.86rem;
}

.arb-hero .arb-button-outline {
    border-color: rgba(255, 255, 255, 0.72);
    color: var(--arb-white);
}

.arb-hero .arb-button-outline:hover {
    border-color: var(--arb-white);
    background: var(--arb-white);
    color: var(--arb-navy);
}

.arb-visual-hero,
.arb-visual-hero picture,
.arb-visual-hero img {
    display: block;
    width: 100%;
}

.arb-visual-hero {
    overflow: hidden;
    background: #061a38;
}

.arb-visual-hero img {
    height: auto;
    object-fit: contain;
}

/* =========================================================
   9. CONTENT, GRIDS AND CARDS
   ========================================================= */

.homepage-placeholder {
    padding: 95px 0;
    background: var(--arb-white);
    text-align: center;
}

.homepage-placeholder h2 {
    max-width: 820px;
    margin-right: auto;
    margin-bottom: 20px;
    margin-left: auto;
}

.homepage-placeholder p {
    max-width: 720px;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    color: var(--arb-muted);
    font-size: 1.08rem;
}

.arb-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.arb-card {
    padding: 32px;
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius);
    box-shadow: var(--arb-shadow-small);
    transition: transform var(--arb-transition), box-shadow var(--arb-transition), border-color var(--arb-transition);
}

.arb-card:hover {
    border-color: rgba(217, 166, 46, 0.55);
    box-shadow: var(--arb-shadow);
    transform: translateY(-6px);
}

.arb-card h3 { margin-bottom: 12px; }
.arb-card p:last-child { margin-bottom: 0; }

.entry-content,
.page-content {
    padding: 70px 0;
}

.entry-content > *,
.page-content > * {
    max-width: 850px;
    margin-right: auto;
    margin-left: auto;
}

.entry-content img { border-radius: var(--arb-radius); }

.entry-content a:not(.arb-button) {
    color: var(--arb-gold-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.entry-content a:not(.arb-button):hover { color: var(--arb-navy); }

/* =========================================================
   10. FORMS
   ========================================================= */

input,
textarea,
select {
    width: 100%;
    padding: 13px 15px;
    color: var(--arb-text);
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius-small);
    transition: border-color var(--arb-transition), box-shadow var(--arb-transition);
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--arb-gold);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(217, 166, 46, 0.14);
}

textarea {
    min-height: 150px;
    resize: vertical;
}

label {
    display: block;
    margin-bottom: 7px;
    color: var(--arb-navy);
    font-weight: 700;
}

.wpcf7-form p { margin-bottom: 18px; }
.wpcf7-not-valid-tip { color: var(--arb-error); font-size: 0.9rem; }
.wpcf7 form .wpcf7-response-output { margin: 20px 0 0; padding: 12px 15px; border-radius: var(--arb-radius-small); }

/* =========================================================
   11. FOOTER
   ========================================================= */

.site-footer {
    padding: 40px 0;
    background: var(--arb-navy);
    color: rgba(255, 255, 255, 0.82);
}

.site-footer a { color: rgba(255, 255, 255, 0.82); }
.site-footer a:hover { color: var(--arb-gold); }

.footer-bottom,
.site-footer > .arb-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.site-footer p { margin-bottom: 0; }

/* =========================================================
   12. HOMEPAGE CONTENT (MOBILE FIRST)
   ========================================================= */

.arb-eyebrow {
    margin: 0 0 10px;
    color: var(--arb-gold-dark);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    line-height: 1.4;
    text-transform: uppercase;
}

.arb-lead {
    color: var(--arb-navy-soft);
    font-size: 1.08rem;
    line-height: 1.7;
}

.arb-home-services {
    background: var(--arb-background);
}

.arb-service-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.arb-service-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 26px 22px;
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius);
    box-shadow: var(--arb-shadow-small);
    transition: border-color var(--arb-transition), box-shadow var(--arb-transition), transform var(--arb-transition);
}

.arb-service-card:hover {
    border-color: rgba(217, 166, 46, 0.65);
    box-shadow: var(--arb-shadow);
    transform: translateY(-5px);
}

.arb-service-icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    margin-bottom: 20px;
    background: rgba(217, 166, 46, 0.14);
    border-radius: 12px;
    color: var(--arb-gold-dark);
}

.arb-service-icon svg {
    width: 28px;
    height: 28px;
    fill: currentColor;
}

.arb-service-card h3 {
    margin-bottom: 10px;
    font-size: 1.35rem;
}

.arb-service-card p {
    margin-bottom: 22px;
    color: var(--arb-muted);
}

.arb-text-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: auto;
    color: var(--arb-navy);
    font-weight: 800;
}

.arb-text-link span {
    color: var(--arb-gold-dark);
    font-size: 1.2rem;
    transition: transform var(--arb-transition);
}

.arb-text-link:hover {
    color: var(--arb-gold-dark);
}

.arb-text-link:hover span {
    transform: translateX(4px);
}

.arb-home-intro {
    background: var(--arb-white);
}

.arb-split-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 34px;
    align-items: center;
}

.arb-split-copy .arb-button {
    margin-top: 8px;
}

.arb-benefit-panel {
    padding: 26px 22px;
    background: var(--arb-navy);
    border-radius: var(--arb-radius);
    box-shadow: var(--arb-shadow);
}

.arb-benefit-panel h3 {
    color: var(--arb-white);
}

.arb-check-list {
    display: grid;
    gap: 16px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.arb-check-list li {
    position: relative;
    padding-left: 32px;
    color: rgba(255, 255, 255, 0.82);
}

.arb-check-list li::before {
    position: absolute;
    top: 2px;
    left: 0;
    display: grid;
    place-items: center;
    width: 21px;
    height: 21px;
    background: var(--arb-gold);
    border-radius: 50%;
    color: var(--arb-navy);
    content: "✓";
    font-size: 0.8rem;
    font-weight: 900;
}

.arb-check-list strong {
    color: var(--arb-white);
}

.arb-process-section {
    background: var(--arb-navy);
}

.arb-process-section .arb-section-heading h2 {
    color: var(--arb-white);
}

.arb-process-section .arb-section-heading > p:last-child {
    color: rgba(255, 255, 255, 0.72);
}

.arb-process-section .arb-eyebrow {
    color: var(--arb-gold);
}

.arb-process-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.arb-process-grid li {
    padding: 24px 21px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--arb-radius);
}

.arb-step-number {
    display: block;
    margin-bottom: 16px;
    color: var(--arb-gold);
    font-size: 0.85rem;
    font-weight: 900;
    letter-spacing: 0.1em;
}

.arb-process-grid h3 {
    margin-bottom: 9px;
    color: var(--arb-white);
    font-size: 1.25rem;
}

.arb-process-grid p {
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
}

.arb-audience-section {
    background: var(--arb-background);
}

.arb-audience-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.arb-audience-grid > div {
    padding: 20px;
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-left: 4px solid var(--arb-gold);
    border-radius: var(--arb-radius-small);
    box-shadow: var(--arb-shadow-small);
}

.arb-audience-grid strong,
.arb-audience-grid span {
    display: block;
}

.arb-audience-grid strong {
    margin-bottom: 4px;
    color: var(--arb-navy);
    font-size: 1.05rem;
}

.arb-audience-grid span {
    color: var(--arb-muted);
    font-size: 0.94rem;
}

.arb-home-cta {
    padding: 56px 0;
    background: var(--arb-navy-light);
    color: rgba(255, 255, 255, 0.82);
}

.arb-cta-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}

.arb-home-cta h2 {
    margin-bottom: 12px;
    color: var(--arb-white);
    font-size: clamp(1.8rem, 8vw, 2.8rem);
}

.arb-home-cta p:last-child {
    max-width: 720px;
    margin-bottom: 0;
}

.arb-home-cta .arb-eyebrow {
    color: var(--arb-gold);
}

@media (min-width: 540px) {
    .arb-service-grid,
    .arb-audience-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 760px) {
    .arb-service-card {
        padding: 30px 26px;
    }

    .arb-process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }

    .arb-benefit-panel {
        padding: 34px;
    }

    .arb-home-cta {
        padding: 70px 0;
    }
}

@media (min-width: 980px) {
    .arb-service-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 22px;
    }

    .arb-split-layout {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
        gap: 70px;
    }

    .arb-process-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .arb-cta-inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 50px;
    }

    .arb-cta-inner .arb-button {
        flex-shrink: 0;
    }
}

/* =========================================================
   13. SERVICES OVERVIEW PAGE (MOBILE FIRST)
   ========================================================= */

.arb-page-hero {
    position: relative;
    overflow: hidden;
    padding: 64px 0;
    background:
        radial-gradient(circle at 90% 10%, rgba(217, 166, 46, 0.16), transparent 32%),
        linear-gradient(135deg, var(--arb-navy) 0%, #0a2446 100%);
}

.arb-page-hero::after {
    position: absolute;
    right: -120px;
    bottom: -180px;
    width: 360px;
    height: 360px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    content: "";
}

.arb-page-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 34px;
    align-items: center;
}

.arb-page-hero-copy h1 {
    max-width: 820px;
    margin-bottom: 20px;
    color: var(--arb-white);
    font-size: clamp(2.2rem, 10vw, 4.2rem);
    line-height: 1.06;
    letter-spacing: -0.04em;
}

.arb-page-hero-copy > p:not(.arb-eyebrow) {
    max-width: 700px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.06rem;
}

.arb-page-hero .arb-eyebrow {
    color: var(--arb-gold);
}

.arb-page-hero-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 28px;
}

.arb-page-hero .arb-button-outline {
    border-color: rgba(255, 255, 255, 0.65);
    color: var(--arb-white);
}

.arb-page-hero .arb-button-outline:hover {
    border-color: var(--arb-white);
    background: var(--arb-white);
    color: var(--arb-navy);
}

.arb-page-hero-summary {
    padding: 25px 22px;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--arb-radius);
    backdrop-filter: blur(8px);
}

.arb-page-hero-summary > p {
    margin-bottom: 14px;
    color: var(--arb-white);
    font-weight: 800;
}

.arb-mini-check-list {
    display: grid;
    gap: 12px;
    padding: 0;
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    list-style: none;
}

.arb-mini-check-list li {
    position: relative;
    padding-left: 27px;
}

.arb-mini-check-list li::before {
    position: absolute;
    left: 0;
    color: var(--arb-gold);
    content: "✓";
    font-weight: 900;
}

.arb-services-directory {
    background: var(--arb-background);
}

.arb-directory-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.arb-directory-card {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 25px 22px;
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius);
    box-shadow: var(--arb-shadow-small);
    transition: border-color var(--arb-transition), box-shadow var(--arb-transition), transform var(--arb-transition);
}

.arb-directory-card:hover {
    border-color: rgba(217, 166, 46, 0.6);
    box-shadow: var(--arb-shadow);
    transform: translateY(-4px);
}

.arb-directory-card .arb-service-icon {
    margin-bottom: 0;
}

.arb-directory-card h2 {
    margin-bottom: 11px;
    font-size: 1.55rem;
}

.arb-directory-card p {
    color: var(--arb-muted);
}

.arb-directory-card ul {
    display: grid;
    gap: 7px;
    padding-left: 20px;
    color: var(--arb-text);
}

.arb-directory-card li::marker {
    color: var(--arb-gold-dark);
}

.arb-connected-services {
    background: var(--arb-white);
}

.arb-combination-list {
    display: grid;
    gap: 14px;
}

.arb-combination-list > div {
    padding: 20px;
    background: var(--arb-background);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius-small);
}

.arb-combination-list strong,
.arb-combination-list span {
    display: block;
}

.arb-combination-list strong {
    margin-bottom: 5px;
    color: var(--arb-navy);
}

.arb-combination-list span {
    color: var(--arb-muted);
}

.arb-service-process {
    background: var(--arb-navy);
}

.arb-service-process .arb-section-heading h2 {
    color: var(--arb-white);
}

.arb-service-process .arb-eyebrow {
    color: var(--arb-gold);
}

.arb-faq-section {
    background: var(--arb-background);
}

.arb-faq-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}

.arb-faq-intro p:last-child {
    color: var(--arb-muted);
}

.arb-faq-list {
    display: grid;
    gap: 12px;
}

.arb-faq-list details {
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius-small);
    box-shadow: var(--arb-shadow-small);
}

.arb-faq-list details[open] {
    border-color: rgba(217, 166, 46, 0.55);
}

.arb-faq-list summary {
    position: relative;
    padding: 18px 52px 18px 18px;
    color: var(--arb-navy);
    cursor: pointer;
    font-weight: 800;
    list-style: none;
}

.arb-faq-list summary::-webkit-details-marker {
    display: none;
}

.arb-faq-list summary::after {
    position: absolute;
    top: 50%;
    right: 18px;
    color: var(--arb-gold-dark);
    content: "+";
    font-size: 1.5rem;
    line-height: 1;
    transform: translateY(-50%);
}

.arb-faq-list details[open] summary::after {
    content: "−";
}

.arb-faq-list details p {
    padding: 0 18px 19px;
    margin: 0;
    color: var(--arb-muted);
}

@media (min-width: 600px) {
    .arb-page-hero-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .arb-directory-card {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 22px;
        padding: 30px 28px;
    }
}

@media (min-width: 820px) {
    .arb-page-hero {
        padding: 86px 0;
    }

    .arb-page-hero-inner {
        grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.65fr);
        gap: 55px;
    }

    .arb-directory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }

    .arb-faq-layout {
        grid-template-columns: minmax(240px, 0.65fr) minmax(0, 1.35fr);
        gap: 60px;
        align-items: start;
    }

    .arb-faq-intro {
        position: sticky;
        top: 130px;
    }
}

@media (min-width: 1100px) {
    .arb-page-hero {
        padding: 105px 0;
    }

    .arb-page-hero-summary {
        padding: 30px;
    }
}

/* =========================================================
   14. SERVICES PAGE MOTION AND VISUAL ENHANCEMENTS
   ========================================================= */

.arb-page-hero::before {
    position: absolute;
    top: 50%;
    right: 7%;
    width: min(42vw, 560px);
    aspect-ratio: 1;
    border: 1px solid rgba(217, 166, 46, 0.18);
    border-radius: 50%;
    box-shadow:
        0 0 0 55px rgba(217, 166, 46, 0.035),
        0 0 0 115px rgba(255, 255, 255, 0.018);
    content: "";
    transform: translate(35%, -50%);
    animation: arb-orbit-pulse 7s ease-in-out infinite;
}

.arb-page-hero-copy h1 {
    text-wrap: balance;
}

.arb-page-hero-copy h1::after {
    display: block;
    width: 86px;
    height: 4px;
    margin-top: 22px;
    background: linear-gradient(90deg, var(--arb-gold), transparent);
    border-radius: 20px;
    content: "";
    transform-origin: left;
    animation: arb-line-grow 1s 0.35s both ease-out;
}

.arb-page-hero-summary {
    position: relative;
    overflow: hidden;
    box-shadow: 0 24px 65px rgba(0, 0, 0, 0.2);
    transition: border-color var(--arb-transition), box-shadow var(--arb-transition), transform var(--arb-transition);
}

.arb-page-hero-summary::before {
    position: absolute;
    top: 0;
    left: -70%;
    width: 45%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    content: "";
    transform: skewX(-18deg);
    animation: arb-panel-shine 6s 1.2s infinite;
}

.arb-page-hero-summary:hover {
    border-color: rgba(217, 166, 46, 0.45);
    box-shadow: 0 28px 75px rgba(0, 0, 0, 0.28);
    transform: translateY(-5px);
}

.arb-directory-card {
    position: relative;
    overflow: hidden;
}

.arb-directory-card::after {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--arb-gold-dark), var(--arb-gold-light));
    content: "";
    transition: width 0.45s ease;
}

.arb-directory-card:hover::after {
    right: auto;
    left: 0;
    width: 100%;
}

.arb-directory-card .arb-service-icon {
    transition: background var(--arb-transition), color var(--arb-transition), transform 0.4s ease;
}

.arb-directory-card:hover .arb-service-icon {
    background: var(--arb-gold);
    color: var(--arb-navy);
    transform: rotate(-5deg) scale(1.08);
}

.arb-combination-list > div {
    position: relative;
    overflow: hidden;
    transition: border-color var(--arb-transition), box-shadow var(--arb-transition), transform var(--arb-transition);
}

.arb-combination-list > div::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    background: var(--arb-gold);
    content: "";
    transform: scaleY(0.35);
    transition: transform 0.35s ease;
}

.arb-combination-list > div:hover {
    border-color: rgba(217, 166, 46, 0.5);
    box-shadow: var(--arb-shadow-small);
    transform: translateX(7px);
}

.arb-combination-list > div:hover::before {
    transform: scaleY(1);
}

.arb-service-process .arb-process-grid li {
    position: relative;
    overflow: hidden;
    transition: background var(--arb-transition), border-color var(--arb-transition), transform var(--arb-transition);
}

.arb-service-process .arb-process-grid li::after {
    position: absolute;
    right: -35px;
    bottom: -35px;
    width: 90px;
    height: 90px;
    background: rgba(217, 166, 46, 0.08);
    border-radius: 50%;
    content: "";
    transition: transform 0.45s ease;
}

.arb-service-process .arb-process-grid li:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(217, 166, 46, 0.45);
    transform: translateY(-6px);
}

.arb-service-process .arb-process-grid li:hover::after {
    transform: scale(1.8);
}

.arb-faq-list details {
    overflow: hidden;
    transition: border-color var(--arb-transition), box-shadow var(--arb-transition), transform var(--arb-transition);
}

.arb-faq-list details:hover {
    box-shadow: var(--arb-shadow);
    transform: translateY(-2px);
}

.arb-faq-list details[open] p {
    animation: arb-faq-open 0.3s ease both;
}

.arb-motion-ready .arb-reveal-target {
    opacity: 0;
    translate: 0 30px;
    transition:
        opacity 0.7s var(--arb-reveal-delay, 0ms) ease,
        translate 0.7s var(--arb-reveal-delay, 0ms) cubic-bezier(0.2, 0.75, 0.25, 1);
}

.arb-motion-ready .arb-reveal-target.is-revealed {
    opacity: 1;
    translate: 0 0;
}

.arb-motion-ready .arb-page-hero-summary.arb-reveal-target {
    translate: 35px 0;
}

.arb-motion-ready .arb-page-hero-summary.arb-reveal-target.is-revealed {
    translate: 0 0;
}

@keyframes arb-orbit-pulse {
    0%, 100% {
        opacity: 0.55;
        transform: translate(35%, -50%) scale(0.96);
    }
    50% {
        opacity: 1;
        transform: translate(35%, -50%) scale(1.04);
    }
}

@keyframes arb-line-grow {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes arb-panel-shine {
    0%, 58% { left: -70%; }
    78%, 100% { left: 135%; }
}

@keyframes arb-faq-open {
    from {
        opacity: 0;
        transform: translateY(-7px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =========================================================
   15. WEBSITE DEVELOPMENT PAGE (MOBILE FIRST)
   ========================================================= */

.arb-service-hero {
    position: relative;
    overflow: hidden;
    padding: 54px 0 70px;
    background:
        radial-gradient(circle at 85% 20%, rgba(36, 139, 255, 0.16), transparent 30%),
        radial-gradient(circle at 72% 80%, rgba(217, 166, 46, 0.12), transparent 28%),
        linear-gradient(135deg, #06172e 0%, var(--arb-navy-light) 100%);
}

.arb-service-hero::before {
    position: absolute;
    inset: 0;
    opacity: 0.16;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 42px 42px;
    content: "";
    mask-image: linear-gradient(to bottom, transparent, #000 25%, #000 75%, transparent);
}

.arb-service-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: center;
}

.arb-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 30px;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.83rem;
}

.arb-breadcrumbs a:hover {
    color: var(--arb-gold);
}

.arb-service-hero .arb-eyebrow {
    color: var(--arb-gold);
}

.arb-service-hero h1 {
    max-width: 850px;
    margin-bottom: 20px;
    color: var(--arb-white);
    font-size: clamp(2.25rem, 10vw, 4.4rem);
    line-height: 1.04;
    letter-spacing: -0.045em;
    text-wrap: balance;
}

.arb-heading-accent {
    display: block;
    color: var(--arb-gold-light);
    background: linear-gradient(90deg, var(--arb-gold-light), var(--arb-gold), #fff0b8);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.arb-service-hero-lead {
    max-width: 720px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.08rem;
    line-height: 1.7;
}

.arb-service-hero .arb-button-outline {
    border-color: rgba(255, 255, 255, 0.62);
    color: var(--arb-white);
}

.arb-service-hero .arb-button-outline:hover {
    border-color: var(--arb-white);
    background: var(--arb-white);
    color: var(--arb-navy);
}

.arb-browser-visual {
    position: relative;
    width: min(100%, 540px);
    margin: 0 auto;
    background: #e9eef4;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 15px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.42);
    transform: perspective(900px) rotateY(-2deg) rotateX(1deg);
    animation: arb-browser-float 5s ease-in-out infinite;
}

.arb-browser-bar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px;
    background: #dce3eb;
    border-radius: 15px 15px 0 0;
}

.arb-browser-bar > span {
    width: 8px;
    height: 8px;
    background: #9ba8b8;
    border-radius: 50%;
}

.arb-browser-bar > span:first-child { background: #d96d61; }
.arb-browser-bar > span:nth-child(2) { background: var(--arb-gold); }
.arb-browser-bar > span:nth-child(3) { background: #5aad78; }

.arb-browser-bar > div {
    flex: 1;
    padding: 5px 10px;
    margin-left: 7px;
    overflow: hidden;
    background: var(--arb-white);
    border-radius: 5px;
    color: #78869a;
    font-size: 0.58rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.arb-browser-screen {
    position: relative;
    min-height: 245px;
    padding: 22px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--arb-white) 0 64%, #edf3f8 64%);
    border-radius: 0 0 15px 15px;
}

.arb-browser-screen::after {
    position: absolute;
    top: 62px;
    right: -25px;
    width: 145px;
    height: 145px;
    background: linear-gradient(135deg, var(--arb-gold), var(--arb-gold-light));
    border-radius: 26px;
    content: "";
    opacity: 0.82;
    transform: rotate(13deg);
}

.arb-browser-nav {
    width: 72%;
    height: 8px;
    margin-bottom: 39px;
    background: linear-gradient(90deg, var(--arb-navy) 0 24%, #cbd5df 24% 31%, transparent 31% 35%, #cbd5df 35% 43%, transparent 43% 47%, #cbd5df 47% 56%, transparent 56%);
    border-radius: 10px;
}

.arb-browser-heading {
    width: 56%;
    height: 15px;
    margin-bottom: 12px;
    background: var(--arb-navy);
    border-radius: 10px;
}

.arb-browser-copy {
    width: 52%;
    height: 6px;
    margin-bottom: 7px;
    background: #b6c1ce;
    border-radius: 10px;
}

.arb-browser-copy-short { width: 38%; }

.arb-browser-button {
    width: 74px;
    height: 23px;
    margin-top: 18px;
    background: var(--arb-gold);
    border-radius: 5px;
}

.arb-browser-cards {
    display: flex;
    gap: 8px;
    margin-top: 35px;
}

.arb-browser-cards i {
    width: 24%;
    height: 35px;
    background: var(--arb-white);
    border: 1px solid #d6dee7;
    border-radius: 5px;
    box-shadow: 0 5px 14px rgba(7, 26, 51, 0.08);
}

.arb-web-score {
    position: absolute;
    right: -8px;
    bottom: -25px;
    padding: 12px 16px;
    background: var(--arb-navy);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 9px;
    box-shadow: var(--arb-shadow);
}

.arb-web-score strong,
.arb-web-score span {
    display: block;
}

.arb-web-score strong { color: var(--arb-gold); font-size: 0.76rem; }
.arb-web-score span { color: rgba(255, 255, 255, 0.72); font-size: 0.65rem; }

.arb-service-proof-strip {
    background: var(--arb-gold);
}

.arb-service-proof-strip .arb-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
}

.arb-service-proof-strip span {
    position: relative;
    padding: 15px 8px;
    color: var(--arb-navy);
    font-size: 0.73rem;
    font-weight: 800;
    text-align: center;
}

.arb-web-options { background: var(--arb-background); }

.arb-options-heading {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    margin-bottom: 38px;
    padding: 30px 24px;
    overflow: hidden;
    background:
        radial-gradient(circle at 90% 10%, rgba(217, 166, 46, 0.22), transparent 34%),
        linear-gradient(135deg, var(--arb-navy) 0%, var(--arb-navy-light) 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    box-shadow: 0 24px 65px rgba(7, 26, 51, 0.2);
}

.arb-options-heading::before {
    position: absolute;
    right: -90px;
    bottom: -125px;
    width: 280px;
    height: 280px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0.02);
    content: "";
    animation: arb-options-orbit 7s ease-in-out infinite;
}

.arb-options-heading-copy {
    position: relative;
    z-index: 1;
}

.arb-options-heading .arb-eyebrow {
    color: var(--arb-gold);
}

.arb-options-heading h2 {
    max-width: 720px;
    margin-bottom: 17px;
    color: var(--arb-white);
    font-size: clamp(2rem, 8vw, 3.7rem);
    line-height: 1.08;
    letter-spacing: -0.035em;
    text-wrap: balance;
}

.arb-options-heading-copy > p:last-child {
    max-width: 690px;
    margin-bottom: 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 1rem;
}

.arb-options-heading-visual {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-content: center;
}

.arb-options-heading-visual span {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 9px 13px;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.82rem;
    font-weight: 700;
    box-shadow: 0 9px 24px rgba(0, 0, 0, 0.12);
    backdrop-filter: blur(7px);
    transition: background var(--arb-transition), border-color var(--arb-transition), color var(--arb-transition), transform var(--arb-transition);
}

.arb-options-heading-visual span:nth-child(2),
.arb-options-heading-visual span:nth-child(5) {
    border-color: rgba(217, 166, 46, 0.48);
    color: var(--arb-gold-light);
}

.arb-options-heading-visual span:hover {
    background: var(--arb-gold);
    border-color: var(--arb-gold);
    color: var(--arb-navy);
    transform: translateY(-4px);
}

@keyframes arb-options-orbit {
    0%, 100% { opacity: 0.55; transform: scale(0.96); }
    50% { opacity: 1; transform: scale(1.04); }
}

.arb-feature-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.arb-feature-card {
    position: relative;
    min-height: 100%;
    padding: 25px 22px;
    overflow: hidden;
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius);
    box-shadow: var(--arb-shadow-small);
    transition: border-color var(--arb-transition), box-shadow var(--arb-transition), transform var(--arb-transition);
}

.arb-feature-card::after {
    position: absolute;
    right: -35px;
    bottom: -35px;
    width: 95px;
    height: 95px;
    background: rgba(217, 166, 46, 0.08);
    border-radius: 50%;
    content: "";
    transition: transform 0.45s ease;
}

.arb-feature-card:hover {
    border-color: rgba(217, 166, 46, 0.62);
    box-shadow: var(--arb-shadow);
    transform: translateY(-6px);
}

.arb-feature-card:hover::after { transform: scale(1.8); }

.arb-feature-number {
    display: inline-block;
    margin-bottom: 24px;
    color: var(--arb-gold-dark);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.1em;
}

.arb-feature-card h3 { margin-bottom: 10px; font-size: 1.3rem; }
.arb-feature-card p { position: relative; z-index: 1; margin: 0; color: var(--arb-muted); }

.arb-web-value { background: var(--arb-white); }

.arb-value-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.arb-value-grid > div {
    padding: 19px;
    background: var(--arb-background);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius-small);
    transition: background var(--arb-transition), border-color var(--arb-transition), transform var(--arb-transition);
}

.arb-value-grid > div:hover {
    background: var(--arb-white);
    border-color: rgba(217, 166, 46, 0.55);
    transform: translateX(6px);
}

.arb-value-grid strong,
.arb-value-grid span { display: block; }
.arb-value-grid strong { margin-bottom: 4px; color: var(--arb-navy); }
.arb-value-grid span { color: var(--arb-muted); font-size: 0.92rem; }

.arb-web-process { background: var(--arb-navy); }
.arb-web-process .arb-section-heading h2 { color: var(--arb-white); }
.arb-web-process .arb-section-heading > p:last-child { color: rgba(255, 255, 255, 0.7); }
.arb-web-process .arb-eyebrow { color: var(--arb-gold); }

.arb-timeline {
    position: relative;
    display: grid;
    gap: 16px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.arb-timeline li {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 16px;
    padding: 22px 18px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: var(--arb-radius);
    transition: background var(--arb-transition), border-color var(--arb-transition), transform var(--arb-transition);
}

.arb-timeline li:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(217, 166, 46, 0.42);
    transform: translateX(5px);
}

.arb-timeline li > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    background: var(--arb-gold);
    border-radius: 50%;
    color: var(--arb-navy);
    font-size: 0.72rem;
    font-weight: 900;
}

.arb-timeline h3 { margin-bottom: 7px; color: var(--arb-white); font-size: 1.15rem; }
.arb-timeline p { margin: 0; color: rgba(255, 255, 255, 0.68); }

.arb-web-included { background: var(--arb-background); }

.arb-included-panel {
    padding: 25px 22px;
    background: var(--arb-white);
    border: 1px solid var(--arb-border);
    border-radius: var(--arb-radius);
    box-shadow: var(--arb-shadow-small);
}

.arb-included-panel p:last-child { margin-bottom: 0; color: var(--arb-muted); }

.arb-light-check-list li { color: var(--arb-text); }
.arb-light-check-list strong { color: var(--arb-navy); }

@media (min-width: 560px) {
    .arb-feature-grid,
    .arb-value-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .arb-service-proof-strip .arb-container {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 780px) {
    .arb-service-hero { padding: 76px 0 92px; }
    .arb-feature-grid { gap: 22px; }
    .arb-feature-card { padding: 30px 27px; }
    .arb-timeline li { grid-template-columns: 54px minmax(0, 1fr); padding: 25px; }
    .arb-options-heading { padding: 42px 38px; margin-bottom: 48px; }
}

@media (min-width: 980px) {
    .arb-service-hero { padding: 88px 0 108px; }

    .arb-service-hero-inner {
        grid-template-columns: minmax(0, 1.12fr) minmax(380px, 0.88fr);
        gap: 70px;
    }

    .arb-feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .arb-options-heading {
        grid-template-columns: minmax(0, 1.25fr) minmax(310px, 0.75fr);
        gap: 60px;
        align-items: center;
        padding: 52px 48px;
    }

    .arb-options-heading-visual {
        justify-content: flex-end;
    }

    .arb-options-heading-visual span:nth-child(even) {
        transform: translateX(-12px);
    }

    .arb-options-heading-visual span:nth-child(even):hover {
        transform: translateX(-12px) translateY(-4px);
    }

    .arb-timeline {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 14px;
    }

    .arb-timeline::before {
        position: absolute;
        top: 46px;
        right: 5%;
        left: 5%;
        height: 1px;
        background: linear-gradient(90deg, transparent, rgba(217, 166, 46, 0.5), transparent);
        content: "";
    }

    .arb-timeline li {
        grid-template-columns: 1fr;
        align-content: start;
        min-height: 260px;
    }

    .arb-timeline li:hover { transform: translateY(-6px); }
    .arb-included-panel { padding: 36px; }
}

@keyframes arb-browser-float {
    0%, 100% { transform: perspective(900px) rotateY(-2deg) rotateX(1deg) translateY(0); }
    50% { transform: perspective(900px) rotateY(-2deg) rotateX(1deg) translateY(-9px); }
}

/* =========================================================
   16. MOBILE APP DEVELOPMENT PAGE
   ========================================================= */

.arb-app-hero {
    background:
        radial-gradient(circle at 82% 22%, rgba(98, 86, 255, 0.2), transparent 31%),
        radial-gradient(circle at 70% 82%, rgba(217, 166, 46, 0.14), transparent 27%),
        linear-gradient(135deg, #06172e 0%, #10264d 100%);
}

.arb-phone-stage {
    position: relative;
    width: min(100%, 440px);
    min-height: 430px;
    margin: 0 auto;
}

.arb-phone {
    position: absolute;
    width: 205px;
    height: 405px;
    padding: 9px;
    background: #091426;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 32px;
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.42);
}

.arb-phone-front {
    right: 12%;
    bottom: 0;
    z-index: 2;
    animation: arb-phone-float 5s ease-in-out infinite;
}

.arb-phone-back {
    bottom: 14px;
    left: 7%;
    opacity: 0.72;
    transform: rotate(-8deg) scale(0.88);
}

.arb-phone-notch {
    position: absolute;
    top: 15px;
    left: 50%;
    z-index: 3;
    width: 72px;
    height: 17px;
    background: #091426;
    border-radius: 12px;
    transform: translateX(-50%);
}

.arb-phone-screen {
    height: 100%;
    padding: 47px 17px 20px;
    overflow: hidden;
    background: linear-gradient(160deg, #f9fbff, #e9eff8);
    border-radius: 25px;
}

.arb-app-top {
    display: flex;
    justify-content: space-between;
    margin-bottom: 35px;
}

.arb-app-top span,
.arb-app-top i {
    display: block;
    width: 31px;
    height: 31px;
    background: var(--arb-gold);
    border-radius: 9px;
}

.arb-app-top i { width: 20px; height: 7px; margin-top: 11px; background: #b7c1d0; }
.arb-app-welcome { width: 80%; height: 13px; margin-bottom: 10px; background: var(--arb-navy); border-radius: 8px; }
.arb-app-subtitle { width: 58%; height: 6px; margin-bottom: 32px; background: #b4bfce; border-radius: 8px; }

.arb-app-chart {
    display: flex;
    align-items: flex-end;
    justify-content: space-around;
    height: 105px;
    padding: 14px;
    background: var(--arb-white);
    border-radius: 14px;
    box-shadow: var(--arb-shadow-small);
}

.arb-app-chart i { width: 13px; height: 35%; background: #b8c6d9; border-radius: 5px 5px 2px 2px; }
.arb-app-chart i:nth-child(2) { height: 58%; }
.arb-app-chart i:nth-child(3) { height: 78%; background: var(--arb-gold); }
.arb-app-chart i:nth-child(4) { height: 52%; }
.arb-app-chart i:nth-child(5) { height: 88%; background: var(--arb-navy-light); }

.arb-app-actions { display: flex; gap: 9px; margin-top: 24px; }
.arb-app-actions span { flex: 1; height: 48px; background: var(--arb-white); border: 1px solid #dce3ec; border-radius: 10px; }

.arb-phone-screen-alt { padding-top: 60px; background: linear-gradient(160deg, #142e5a, #091a35); }
.arb-app-avatar { display: block; width: 62px; height: 62px; margin: 0 auto 35px; background: var(--arb-gold); border-radius: 50%; }
.arb-phone-screen-alt i { display: block; width: 80%; height: 10px; margin: 0 auto 17px; background: rgba(255,255,255,.18); border-radius: 8px; }

.arb-app-badge {
    position: absolute;
    right: 0;
    bottom: 20px;
    z-index: 4;
    padding: 12px 15px;
    background: var(--arb-navy);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 9px;
    box-shadow: var(--arb-shadow);
}

.arb-app-badge strong,
.arb-app-badge span { display: block; }
.arb-app-badge strong { color: var(--arb-gold); font-size: .76rem; }
.arb-app-badge span { color: rgba(255,255,255,.7); font-size: .64rem; }

.arb-app-options { background: var(--arb-background); }
.arb-app-options-heading { background: radial-gradient(circle at 90% 10%, rgba(110, 91, 255, 0.25), transparent 34%), linear-gradient(135deg, var(--arb-navy), #182e60); }
.arb-app-value { background: var(--arb-white); }

@media (max-width: 430px) {
    .arb-phone-stage { min-height: 360px; transform: scale(.86); transform-origin: center top; margin-bottom: -45px; }
    .arb-phone { width: 185px; height: 365px; }
}

@keyframes arb-phone-float {
    0%, 100% { transform: translateY(0) rotate(2deg); }
    50% { transform: translateY(-10px) rotate(0deg); }
}

/* =========================================================
   17. DIGITAL MARKETING PAGE
   ========================================================= */

.arb-marketing-hero {
    background: radial-gradient(circle at 84% 18%, rgba(39, 174, 132, .19), transparent 30%), radial-gradient(circle at 68% 85%, rgba(217, 166, 46, .14), transparent 28%), linear-gradient(135deg, #06172e, #12304a);
}

.arb-marketing-dashboard {
    position: relative;
    width: min(100%, 520px);
    margin: 0 auto;
    padding: 18px;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(255,255,255,.4);
    border-radius: 18px;
    box-shadow: 0 30px 80px rgba(0,0,0,.4);
    animation: arb-dashboard-float 5.5s ease-in-out infinite;
}

.arb-dashboard-top { display:flex; align-items:center; gap:7px; padding-bottom:14px; border-bottom:1px solid var(--arb-border); }
.arb-dashboard-top span { width:72px; height:9px; margin-right:auto; background:var(--arb-navy); border-radius:10px; }
.arb-dashboard-top i { width:9px; height:9px; background:#cbd5df; border-radius:50%; }
.arb-dashboard-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:16px 0; }
.arb-dashboard-metrics div { padding:12px 9px; background:var(--arb-background); border-radius:9px; }
.arb-dashboard-metrics small,.arb-dashboard-metrics strong { display:block; }
.arb-dashboard-metrics small { color:var(--arb-muted); font-size:.58rem; }
.arb-dashboard-metrics strong { color:var(--arb-success); font-size:1rem; }
.arb-dashboard-chart { position:relative; height:175px; padding:12px; overflow:hidden; background:linear-gradient(180deg,#fbfcfe,#edf3f8); border:1px solid #e1e7ee; border-radius:11px; box-shadow:inset 0 1px 0 rgba(255,255,255,.9); }
.arb-chart-title { position:absolute; top:12px; left:14px; z-index:2; color:var(--arb-navy); font-size:.62rem; font-weight:800; }
.arb-dashboard-chart svg { position:absolute; inset:32px 12px 24px; width:calc(100% - 24px); height:calc(100% - 56px); overflow:visible; }
.arb-dashboard-chart .arb-chart-grid line { stroke:#dbe3eb; stroke-width:1; stroke-dasharray:3 4; }
.arb-dashboard-chart .arb-chart-line { fill:none; stroke:var(--arb-gold-dark); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:500; filter:drop-shadow(0 3px 3px rgba(185,133,22,.2)); animation:arb-chart-draw 2.2s .4s both ease-out; }
.arb-dashboard-chart .arb-chart-fill { fill:url(#arbMarketingFill); stroke:none; }
.arb-chart-points circle { fill:var(--arb-white); stroke:var(--arb-gold-dark); stroke-width:3; opacity:0; transform-box:fill-box; transform-origin:center; animation:arb-chart-point .45s 1.7s both ease-out; }
.arb-chart-points circle:nth-child(2){animation-delay:1.85s}.arb-chart-points circle:nth-child(3){animation-delay:2s}.arb-chart-points circle:nth-child(4){animation-delay:2.15s}
.arb-chart-periods { position:absolute; right:13px; bottom:6px; left:13px; display:flex; justify-content:space-between; color:#8996a7; }
.arb-chart-periods small { font-size:.5rem; }
.arb-dashboard-keywords { display:flex; gap:8px; margin-top:14px; }
.arb-dashboard-keywords i { display:block; width:31%; height:26px; background:#edf1f5; border-radius:6px; }
.arb-dashboard-keywords i:nth-child(2) { background:rgba(217,166,46,.2); }
.arb-growth-badge { position:absolute; right:-10px; bottom:-28px; padding:12px 16px; background:var(--arb-navy); border:1px solid rgba(255,255,255,.18); border-radius:9px; box-shadow:var(--arb-shadow); }
.arb-growth-badge strong,.arb-growth-badge span { display:block; }
.arb-growth-badge strong { color:var(--arb-gold); font-size:.76rem; }
.arb-growth-badge span { color:rgba(255,255,255,.7); font-size:.64rem; }

.arb-marketing-options { background:var(--arb-background); }
.arb-marketing-options-heading { background:radial-gradient(circle at 90% 10%,rgba(38,173,132,.25),transparent 34%),linear-gradient(135deg,var(--arb-navy),#143b46); }
.arb-marketing-options-heading .arb-options-heading-visual { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; gap:10px; }
.arb-marketing-options-heading .arb-options-heading-visual span { justify-content:center; width:100%; min-height:44px; text-align:center; }
.arb-marketing-options-heading .arb-options-heading-visual span:nth-child(even) { transform:none; }
.arb-marketing-options-heading .arb-options-heading-visual span:hover,
.arb-marketing-options-heading .arb-options-heading-visual span:nth-child(even):hover { transform:translateY(-4px); }
.arb-marketing-value { background:var(--arb-white); }

.arb-social-section { background:var(--arb-white); }
.arb-social-layout { display:grid; grid-template-columns:1fr; gap:38px; align-items:center; }
.arb-social-visual { position:relative; }
.arb-social-visual::before { position:absolute; inset:-14px 22px 18px -14px; z-index:0; background:linear-gradient(135deg,rgba(217,166,46,.18),rgba(23,145,137,.13)); border-radius:22px; content:""; transform:rotate(-2deg); }
.arb-social-visual img { position:relative; z-index:1; width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:18px; box-shadow:0 24px 65px rgba(7,26,51,.22); }
.arb-social-float-card { position:absolute; right:-7px; bottom:-18px; z-index:2; display:flex; gap:6px; padding:10px; background:rgba(7,26,51,.94); border:1px solid rgba(255,255,255,.13); border-radius:10px; box-shadow:var(--arb-shadow); }
.arb-social-float-card span { padding:5px 7px; color:var(--arb-gold-light); font-size:.56rem; font-weight:800; }
.arb-social-copy h2 { font-size:clamp(2rem,7vw,3.25rem); letter-spacing:-.03em; text-wrap:balance; }
.arb-social-grid { display:grid; grid-template-columns:1fr; gap:10px; margin-top:27px; }
.arb-social-card { display:flex; align-items:center; gap:13px; padding:14px; background:var(--arb-background); border:1px solid var(--arb-border); border-radius:11px; transition:transform var(--arb-transition),border-color var(--arb-transition),box-shadow var(--arb-transition); }
.arb-social-card:hover { border-color:rgba(217,166,46,.55); box-shadow:var(--arb-shadow-small); transform:translateY(-4px); }
.arb-social-card svg { flex:0 0 auto; width:34px; height:34px; padding:7px; border-radius:9px; fill:none; stroke:currentColor; stroke-width:1.8; }
.arb-social-card svg path { fill:currentColor; stroke:none; }
.arb-social-card span,.arb-social-card strong,.arb-social-card small { display:block; }
.arb-social-card strong { color:var(--arb-navy); font-size:.92rem; }
.arb-social-card small { color:var(--arb-muted); font-size:.72rem; }
.arb-instagram-card svg { color:#c13584; background:rgba(193,53,132,.1); }
.arb-facebook-card svg { color:#1877f2; background:rgba(24,119,242,.1); }
.arb-tiktok-card svg { color:#111827; background:rgba(17,24,39,.09); }
.arb-linkedin-card svg { color:#0a66c2; background:rgba(10,102,194,.1); }

.arb-marketing-funnel { display:grid; gap:10px; }
.arb-marketing-funnel>div { position:relative; padding:17px 18px 17px 58px; background:var(--arb-background); border:1px solid var(--arb-border); border-radius:var(--arb-radius-small); transition:transform var(--arb-transition),border-color var(--arb-transition),box-shadow var(--arb-transition); }
.arb-marketing-funnel>div:hover { border-color:rgba(217,166,46,.55); box-shadow:var(--arb-shadow-small); transform:translateX(7px); }
.arb-marketing-funnel>div>span { position:absolute; top:16px; left:16px; display:grid; place-items:center; width:29px; height:29px; background:var(--arb-navy); border-radius:50%; color:var(--arb-gold); font-size:.65rem; font-weight:900; }
.arb-marketing-funnel strong,.arb-marketing-funnel small { display:block; }
.arb-marketing-funnel strong { color:var(--arb-navy); }
.arb-marketing-funnel small { color:var(--arb-muted); }

@keyframes arb-dashboard-float { 0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-9px) rotate(1deg)} }
@keyframes arb-chart-draw { from{stroke-dashoffset:500}to{stroke-dashoffset:0} }
@keyframes arb-chart-point { from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)} }

@media (min-width:560px) {
    .arb-social-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (min-width:980px) {
    .arb-social-layout { grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr); gap:70px; }
    .arb-social-visual { order:1; }
    .arb-social-copy { order:2; }
}

/* =========================================================
   18. IT SUPPORT PAGE
   ========================================================= */

.arb-support-hero { background:radial-gradient(circle at 84% 18%,rgba(39,139,255,.18),transparent 30%),radial-gradient(circle at 68% 85%,rgba(217,166,46,.13),transparent 27%),linear-gradient(135deg,#06172e,#102b4f); }
.arb-support-console { position:relative; width:min(100%,500px); margin:0 auto; padding:18px; background:rgba(247,250,253,.98); border:1px solid rgba(255,255,255,.35); border-radius:18px; box-shadow:0 30px 80px rgba(0,0,0,.42); animation:arb-console-float 5s ease-in-out infinite; }
.arb-console-top { display:flex; align-items:center; gap:7px; padding-bottom:13px; border-bottom:1px solid var(--arb-border); }
.arb-console-top span { margin-right:auto; color:var(--arb-navy); font-size:.68rem; font-weight:800; }
.arb-console-top i { width:8px; height:8px; background:#c6d0dc; border-radius:50%; }
.arb-console-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; margin:17px 0; }
.arb-console-grid>div { padding:17px 14px; background:var(--arb-white); border:1px solid var(--arb-border); border-radius:11px; box-shadow:var(--arb-shadow-small); }
.arb-console-grid strong,.arb-console-grid small { display:block; }
.arb-console-grid strong { margin-top:12px; color:var(--arb-navy); font-size:.78rem; }
.arb-console-grid small { color:var(--arb-success); font-size:.6rem; }
.arb-device-screen { display:block; width:54px; height:38px; background:linear-gradient(135deg,var(--arb-navy-light),#2f7ac4); border:4px solid var(--arb-navy); border-radius:5px; box-shadow:0 7px 0 -5px var(--arb-navy); }
.arb-console-shield svg { width:43px; height:43px; fill:var(--arb-gold); }
.arb-console-status { display:flex; align-items:center; gap:12px; padding:14px; background:rgba(29,138,88,.08); border:1px solid rgba(29,138,88,.2); border-radius:10px; }
.arb-console-status>span { width:12px; height:12px; background:var(--arb-success); border-radius:50%; box-shadow:0 0 0 6px rgba(29,138,88,.12); animation:arb-status-pulse 2s infinite; }
.arb-console-status strong,.arb-console-status small { display:block; }
.arb-console-status strong { color:var(--arb-navy); font-size:.72rem; }
.arb-console-status small { color:var(--arb-muted); font-size:.58rem; }
.arb-support-badge { position:absolute; right:-8px; bottom:-28px; padding:12px 15px; background:var(--arb-navy); border:1px solid rgba(255,255,255,.16); border-radius:9px; box-shadow:var(--arb-shadow); }
.arb-support-badge strong,.arb-support-badge span { display:block; }
.arb-support-badge strong { color:var(--arb-gold); font-size:.75rem; }
.arb-support-badge span { color:rgba(255,255,255,.7); font-size:.62rem; }

.arb-support-slider { position:relative; width:min(100%,520px); margin:0 auto; padding:20px; overflow:hidden; background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(237,244,250,.97)); border:1px solid rgba(255,255,255,.4); border-radius:20px; box-shadow:0 32px 85px rgba(0,0,0,.4); }
.arb-support-slider::before { position:absolute; top:-80px; right:-65px; width:210px; height:210px; background:rgba(217,166,46,.13); border-radius:50%; content:""; }
.arb-support-slides { display:grid; min-height:410px; }
.arb-support-slide { grid-area:1/1; display:flex; flex-direction:column; padding:9px 5px 5px; visibility:hidden; opacity:0; transform:translateX(35px) scale(.98); transition:opacity .5s ease,transform .55s cubic-bezier(.2,.75,.25,1),visibility .5s; pointer-events:none; }
.arb-support-slide.is-active { visibility:visible; opacity:1; transform:translateX(0) scale(1); pointer-events:auto; }
.arb-slide-icon { position:relative; display:grid; place-items:center; width:70px; height:70px; margin-bottom:25px; background:linear-gradient(135deg,var(--arb-gold),var(--arb-gold-light)); border-radius:20px; color:var(--arb-navy); box-shadow:0 14px 30px rgba(217,166,46,.25); }
.arb-slide-icon::after { position:absolute; inset:-8px; border:1px solid rgba(217,166,46,.28); border-radius:25px; content:""; animation:arb-slide-icon-pulse 2.8s ease-in-out infinite; }
.arb-slide-icon svg { width:36px; height:36px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.arb-slide-label { margin:0 0 7px; color:var(--arb-gold-dark); font-size:.68rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.arb-support-slide h2 { margin-bottom:12px; color:var(--arb-navy); font-size:clamp(1.65rem,6vw,2.25rem); letter-spacing:-.025em; }
.arb-support-slide>p:not(.arb-slide-label) { margin-bottom:18px; color:var(--arb-muted); font-size:.94rem; }
.arb-support-slide ul { display:grid; gap:8px; padding:0; margin:auto 0 0; list-style:none; }
.arb-support-slide li { position:relative; padding-left:25px; color:var(--arb-text); font-size:.84rem; font-weight:700; }
.arb-support-slide li::before { position:absolute; left:0; color:var(--arb-success); content:"✓"; font-weight:900; }
.arb-slider-controls { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:16px; border-top:1px solid var(--arb-border); }
.arb-slider-arrow { display:grid; place-items:center; width:38px; min-width:38px; height:38px; min-height:38px; padding:0; margin:0; background:var(--arb-navy); border:0; border-radius:50%; color:var(--arb-white); box-shadow:none; font-size:1.05rem; line-height:1; }
.arb-slider-arrow:hover,.arb-slider-arrow:focus-visible { background:var(--arb-gold); color:var(--arb-navy); box-shadow:none; transform:none; }
.arb-slider-dots { display:flex; align-items:center; justify-content:center; gap:8px; }
.arb-slider-dots button { display:block; width:9px; min-width:9px; height:9px; min-height:9px; padding:0; margin:0; background:#bbc6d2; border:0; border-radius:99px; box-shadow:none; transition:width var(--arb-transition),background var(--arb-transition); }
.arb-slider-dots button:hover,.arb-slider-dots button:focus-visible { background:var(--arb-gold-dark); box-shadow:none; transform:none; }
.arb-slider-dots button.is-active { width:28px; background:var(--arb-gold); }

@keyframes arb-slide-icon-pulse { 0%,100%{opacity:.45;transform:scale(.94)}50%{opacity:1;transform:scale(1.08)} }

.arb-support-options { background:var(--arb-background); }
.arb-support-options-heading { background:radial-gradient(circle at 90% 10%,rgba(48,126,205,.27),transparent 34%),linear-gradient(135deg,var(--arb-navy),#143c67); }
.arb-support-options-heading .arb-options-heading-visual { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; gap:10px; }
.arb-support-options-heading .arb-options-heading-visual span { justify-content:center; width:100%; min-height:44px; text-align:center; }
.arb-support-options-heading .arb-options-heading-visual span:nth-child(even) { transform:none; }
.arb-support-options-heading .arb-options-heading-visual span:hover,.arb-support-options-heading .arb-options-heading-visual span:nth-child(even):hover { transform:translateY(-4px); }

.arb-support-pathways { background:var(--arb-white); }
.arb-pathway-grid { display:grid; grid-template-columns:1fr; gap:20px; }
.arb-pathway-grid article { position:relative; padding:28px 24px; overflow:hidden; background:var(--arb-background); border:1px solid var(--arb-border); border-radius:var(--arb-radius); box-shadow:var(--arb-shadow-small); transition:transform var(--arb-transition),border-color var(--arb-transition),box-shadow var(--arb-transition); }
.arb-pathway-grid article:hover { border-color:rgba(217,166,46,.58); box-shadow:var(--arb-shadow); transform:translateY(-6px); }
.arb-pathway-grid article::after { position:absolute; right:-45px; bottom:-45px; width:130px; height:130px; background:rgba(217,166,46,.08); border-radius:50%; content:""; }
.arb-pathway-icon { display:grid; place-items:center; width:48px; height:48px; margin-bottom:21px; background:var(--arb-navy); border-radius:12px; color:var(--arb-gold); font-weight:900; }
.arb-pathway-grid h3 { font-size:1.45rem; }
.arb-pathway-grid p { color:var(--arb-muted); }
.arb-pathway-grid ul { padding-left:20px; }
.arb-pathway-grid li::marker { color:var(--arb-gold-dark); }
.arb-support-security { background:var(--arb-background); }

.arb-feature-symbol { display:grid; place-items:center; width:52px; height:52px; margin-bottom:22px; background:linear-gradient(135deg,rgba(217,166,46,.2),rgba(47,122,196,.12)); border:1px solid rgba(217,166,46,.28); border-radius:14px; color:var(--arb-navy); transition:transform .4s ease,background var(--arb-transition),color var(--arb-transition); }
.arb-feature-symbol svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.arb-feature-symbol svg path:first-child:not(:only-child) { fill:none; }
.arb-feature-card:hover .arb-feature-symbol { background:var(--arb-gold); color:var(--arb-navy); transform:rotate(-6deg) scale(1.08); }

.arb-support-ecosystem { overflow:hidden; background:var(--arb-white); }
.arb-support-ecosystem-layout { display:grid; grid-template-columns:1fr; gap:45px; align-items:center; }
.arb-support-ecosystem-copy h2 { font-size:clamp(2rem,7vw,3.25rem); letter-spacing:-.03em; text-wrap:balance; }
.arb-tech-orbit { position:relative; width:min(100%,440px); aspect-ratio:1; margin:0 auto; }
.arb-orbit-ring { position:absolute; inset:12%; border:1px dashed rgba(47,122,196,.3); border-radius:50%; animation:arb-orbit-spin 20s linear infinite; }
.arb-orbit-ring-two { inset:27%; border-style:solid; border-color:rgba(217,166,46,.3); animation-direction:reverse; animation-duration:14s; }
.arb-tech-core,.arb-tech-node { position:absolute; display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--arb-white); border:1px solid var(--arb-border); box-shadow:var(--arb-shadow); }
.arb-tech-core { top:50%; left:50%; z-index:2; width:128px; height:128px; background:linear-gradient(135deg,var(--arb-navy),var(--arb-navy-light)); border-color:rgba(255,255,255,.12); border-radius:50%; transform:translate(-50%,-50%); }
.arb-tech-core svg { width:42px; height:42px; margin-bottom:8px; fill:none; stroke:var(--arb-gold); stroke-width:1.8; }
.arb-tech-core strong { color:var(--arb-white); font-size:.78rem; }
.arb-tech-node { width:86px; height:86px; border-radius:18px; animation:arb-node-float 4s ease-in-out infinite; }
.arb-tech-node svg { width:30px; height:30px; margin-bottom:5px; fill:none; stroke:var(--arb-navy-light); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.arb-tech-node span { color:var(--arb-navy); font-size:.67rem; font-weight:800; }
.arb-tech-device { top:3%; left:50%; transform:translateX(-50%); }
.arb-tech-cloud { top:50%; right:1%; transform:translateY(-50%); animation-delay:-1s; }
.arb-tech-email { bottom:3%; left:50%; transform:translateX(-50%); animation-delay:-2s; }
.arb-tech-security { top:50%; left:1%; transform:translateY(-50%); animation-delay:-3s; }
.arb-support-timeline li>span svg { width:22px; height:22px; fill:none; stroke:var(--arb-navy); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }

@media (min-width:900px) { .arb-support-ecosystem-layout { grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr); gap:70px; } }

@media (min-width:760px) { .arb-pathway-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; } .arb-pathway-grid article { padding:34px 30px; } }
@keyframes arb-console-float { 0%,100%{transform:translateY(0) rotate(1deg)}50%{transform:translateY(-9px) rotate(-1deg)} }
@keyframes arb-status-pulse { 0%,100%{box-shadow:0 0 0 5px rgba(29,138,88,.12)}50%{box-shadow:0 0 0 10px rgba(29,138,88,0)} }
@keyframes arb-orbit-spin { to{transform:rotate(360deg)} }
@keyframes arb-node-float { 0%,100%{margin-top:0}50%{margin-top:-8px} }

/* =========================================================
   19. ABOUT PAGE
   ========================================================= */

.arb-about-hero { background:radial-gradient(circle at 82% 18%,rgba(217,166,46,.18),transparent 31%),radial-gradient(circle at 68% 82%,rgba(44,135,198,.16),transparent 27%),linear-gradient(135deg,#06172e,#123152); }
.arb-about-visual { position:relative; width:min(100%,440px); aspect-ratio:1; margin:0 auto; }
.arb-about-core { position:absolute; top:50%; left:50%; z-index:3; display:grid; place-items:center; align-content:center; width:145px; height:145px; background:linear-gradient(135deg,var(--arb-gold),var(--arb-gold-light)); border-radius:50%; box-shadow:0 25px 65px rgba(0,0,0,.32); transform:translate(-50%,-50%); }
.arb-about-core span { color:var(--arb-navy); font-size:2rem; font-weight:900; line-height:1; }.arb-about-core small { margin-top:5px; color:var(--arb-navy-soft); font-size:.62rem; font-weight:800; }
.arb-about-ring { position:absolute; inset:12%; border:1px dashed rgba(255,255,255,.24); border-radius:50%; animation:arb-orbit-spin 22s linear infinite; }.arb-about-ring-two { inset:27%; border-style:solid; border-color:rgba(217,166,46,.3); animation-direction:reverse; animation-duration:14s; }
.arb-about-discipline { position:absolute; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; width:108px; height:92px; background:rgba(255,255,255,.96); border:1px solid rgba(255,255,255,.3); border-radius:17px; box-shadow:0 20px 45px rgba(0,0,0,.25); animation:arb-node-float 4s ease-in-out infinite; }
.arb-about-discipline svg { width:32px; height:32px; margin-bottom:7px; fill:none; stroke:var(--arb-navy-light); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.arb-about-discipline span { color:var(--arb-navy); font-size:.7rem; font-weight:900; }
.arb-about-marketing { top:2%; left:50%; transform:translateX(-50%); }.arb-about-development { right:1%; bottom:11%; animation-delay:-1.4s; }.arb-about-support { bottom:11%; left:1%; animation-delay:-2.8s; }
.arb-about-intro { background:var(--arb-white); }.arb-about-statement { position:relative; padding:32px 26px; overflow:hidden; background:var(--arb-navy); border-radius:var(--arb-radius); box-shadow:var(--arb-shadow); }.arb-about-statement::after { position:absolute; right:-35px; bottom:-55px; color:rgba(217,166,46,.12); content:"“"; font-family:Georgia,serif; font-size:13rem; line-height:1; }.arb-about-statement>span { display:block; margin-bottom:14px; color:var(--arb-gold); font-size:.72rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }.arb-about-statement blockquote { position:relative; z-index:1; margin:0; color:var(--arb-white); font-size:clamp(1.35rem,5vw,2rem); font-weight:800; line-height:1.4; }
.arb-about-values { background:var(--arb-background); }.arb-values-grid { display:grid; grid-template-columns:1fr; gap:16px; }.arb-values-grid article { padding:26px 22px; background:var(--arb-white); border:1px solid var(--arb-border); border-radius:var(--arb-radius); box-shadow:var(--arb-shadow-small); transition:transform var(--arb-transition),border-color var(--arb-transition),box-shadow var(--arb-transition); }.arb-values-grid article:hover { border-color:rgba(217,166,46,.58); box-shadow:var(--arb-shadow); transform:translateY(-6px); }.arb-values-grid article>span { display:grid; place-items:center; width:50px; height:50px; margin-bottom:20px; background:rgba(217,166,46,.14); border-radius:13px; color:var(--arb-gold-dark); }.arb-values-grid svg { width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.arb-values-grid h3 { margin-bottom:9px; }.arb-values-grid p { margin:0; color:var(--arb-muted); }
.arb-about-approach { background:var(--arb-white); }.arb-about-approach-heading { background:radial-gradient(circle at 90% 10%,rgba(217,166,46,.22),transparent 34%),linear-gradient(135deg,var(--arb-navy),#173854); }.arb-approach-flow { display:grid; grid-template-columns:1fr; gap:15px; }.arb-approach-flow article { position:relative; padding:25px 22px; background:var(--arb-background); border:1px solid var(--arb-border); border-radius:var(--arb-radius); }.arb-approach-flow article>span { display:inline-flex; padding:5px 9px; margin-bottom:17px; background:var(--arb-gold); border-radius:99px; color:var(--arb-navy); font-size:.66rem; font-weight:900; text-transform:uppercase; }.arb-approach-flow h3 { font-size:1.25rem; }.arb-approach-flow p { margin:0; color:var(--arb-muted); }
.arb-about-expertise { background:var(--arb-background); }.arb-expertise-list { display:grid; gap:10px; }.arb-expertise-list a { position:relative; display:grid; grid-template-columns:1fr auto; gap:3px 15px; padding:18px 52px 18px 18px; background:var(--arb-white); border:1px solid var(--arb-border); border-radius:10px; transition:transform var(--arb-transition),border-color var(--arb-transition),box-shadow var(--arb-transition); }.arb-expertise-list a:hover { border-color:rgba(217,166,46,.55); box-shadow:var(--arb-shadow-small); transform:translateX(7px); }.arb-expertise-list strong,.arb-expertise-list span { display:block; }.arb-expertise-list strong { color:var(--arb-navy); }.arb-expertise-list span { grid-column:1; color:var(--arb-muted); font-size:.82rem; }.arb-expertise-list i { position:absolute; top:50%; right:19px; color:var(--arb-gold-dark); font-style:normal; transform:translateY(-50%); }
.arb-about-location { background:var(--arb-white); }.arb-location-inner { display:grid; grid-template-columns:1fr; gap:35px; align-items:center; }.arb-location-inner>div:first-child { max-width:760px; }.arb-location-pulse { position:relative; display:grid; place-items:center; align-content:center; width:210px; height:210px; margin:0 auto; background:var(--arb-navy); border-radius:50%; box-shadow:0 0 0 25px rgba(217,166,46,.08),0 0 0 50px rgba(7,26,51,.04); }.arb-location-pulse>span { position:absolute; top:35px; width:14px; height:14px; background:var(--arb-gold); border-radius:50%; animation:arb-status-pulse 2s infinite; }.arb-location-pulse strong,.arb-location-pulse small { display:block; }.arb-location-pulse strong { color:var(--arb-white); font-size:1.3rem; }.arb-location-pulse small { color:var(--arb-gold); font-size:.72rem; }

@media(min-width:600px){.arb-values-grid,.arb-approach-flow{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(min-width:900px){.arb-values-grid{grid-template-columns:repeat(4,minmax(0,1fr));}.arb-approach-flow{grid-template-columns:repeat(4,minmax(0,1fr));}.arb-location-inner{grid-template-columns:minmax(0,1fr) 280px;gap:70px;}}

/* =========================================================
   20. OUR WORK PAGE
   ========================================================= */

.arb-work-hero{background:radial-gradient(circle at 82% 18%,rgba(217,166,46,.2),transparent 30%),radial-gradient(circle at 68% 82%,rgba(73,139,205,.17),transparent 27%),linear-gradient(135deg,#06172e,#163453)}
.arb-work-collage{position:relative;width:min(100%,500px);min-height:410px;margin:0 auto;animation:arb-collage-float 6s ease-in-out infinite}.arb-collage-window{position:absolute;padding:12px;background:rgba(255,255,255,.97);border-radius:14px;box-shadow:0 25px 65px rgba(0,0,0,.35)}.arb-collage-window span{display:block;width:54%;height:10px;margin-bottom:24px;background:var(--arb-navy);border-radius:8px}.arb-collage-window i{display:block;width:72%;height:7px;margin:8px 0;background:#c8d1dc;border-radius:8px}.arb-collage-window b{display:block;width:38%;height:28px;margin-top:20px;background:var(--arb-gold);border-radius:6px}.arb-collage-main{top:18px;right:2%;width:78%;height:260px;transform:rotate(2deg)}.arb-collage-side{bottom:28px;left:1%;width:58%;height:210px;transform:rotate(-5deg)}.arb-collage-phone{position:absolute;right:5%;bottom:4px;width:120px;height:230px;padding:30px 12px 15px;background:#091426;border:5px solid #091426;border-radius:25px;box-shadow:0 25px 55px rgba(0,0,0,.4)}.arb-collage-phone span,.arb-collage-phone i{display:block;background:#eaf0f5;border-radius:7px}.arb-collage-phone span{height:76px;background:linear-gradient(135deg,var(--arb-gold),#4b89c8)}.arb-collage-phone i{height:9px;margin-top:14px}.arb-collage-label{position:absolute;right:16%;bottom:-12px;padding:10px 14px;background:var(--arb-navy);border:1px solid rgba(255,255,255,.16);border-radius:9px;color:var(--arb-gold);font-size:.68rem;font-weight:900;box-shadow:var(--arb-shadow)}
.arb-portfolio-section{background:var(--arb-background)}.arb-project-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:-18px 0 38px}.arb-project-filters button{width:auto;min-height:40px;padding:8px 15px;background:var(--arb-white);border:1px solid var(--arb-border);border-radius:99px;color:var(--arb-navy);box-shadow:none;font-size:.78rem}.arb-project-filters button:hover,.arb-project-filters button.is-active{background:var(--arb-navy);border-color:var(--arb-navy);color:var(--arb-white);box-shadow:none;transform:none}.arb-project-grid{display:grid;grid-template-columns:1fr;gap:22px}.arb-project-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;background:var(--arb-white);border:1px solid var(--arb-border);border-radius:var(--arb-radius);box-shadow:var(--arb-shadow-small);transition:transform var(--arb-transition),border-color var(--arb-transition),box-shadow var(--arb-transition)}.arb-project-card:hover{border-color:rgba(217,166,46,.55);box-shadow:var(--arb-shadow);transform:translateY(-7px)}.arb-project-card[hidden]{display:none}.arb-filter-enter{animation:arb-project-enter .45s ease both}
.arb-project-browser{margin:16px 16px 0;background:#e9eef4;border-radius:11px;box-shadow:0 12px 25px rgba(7,26,51,.13)}.arb-project-bar{display:flex;align-items:center;gap:5px;padding:8px;background:#dce4ec;border-radius:11px 11px 0 0}.arb-project-bar i{width:7px;height:7px;background:#aab6c4;border-radius:50%}.arb-project-bar span{flex:1;margin-left:6px;padding:3px 7px;overflow:hidden;background:var(--arb-white);border-radius:4px;color:#7a8796;font-size:.5rem;text-overflow:ellipsis;white-space:nowrap}.arb-project-screen{position:relative;min-height:205px;padding:25px;overflow:hidden;background:linear-gradient(135deg,#fff,#edf3f8);border-radius:0 0 11px 11px}.arb-project-screen>b{display:block;margin-bottom:22px;color:var(--arb-navy);font-size:1.45rem}.arb-project-screen>span{display:block;width:60%;height:8px;margin:8px 0;background:#bac5d1;border-radius:8px}.arb-project-screen>button{width:auto;min-height:30px;padding:6px 11px;margin-top:20px;background:var(--arb-gold);border:0;border-radius:5px;color:var(--arb-navy);box-shadow:none;font-size:.58rem}.arb-project-itech .arb-project-screen{background:linear-gradient(135deg,#f7fbff 58%,#d9eafe 58%)}.arb-project-grocery .arb-project-screen{background:linear-gradient(145deg,#f7fff6,#e2f2d8)}.arb-product-shapes{display:flex;gap:9px}.arb-product-shapes i{width:54px;height:62px;background:#75a84d;border-radius:25px 25px 10px 10px}.arb-product-shapes i:nth-child(2){background:#d85a38}.arb-product-shapes i:nth-child(3){background:#e6b83b}.arb-project-cleaning .arb-project-screen{background:linear-gradient(145deg,#fff,#dff4f1)}.arb-clean-shield{position:absolute;right:25px;bottom:25px;display:grid;place-items:center;width:72px;height:82px;background:#36a994;clip-path:polygon(50% 0,100% 18%,90% 75%,50% 100%,10% 75%,0 18%);color:#fff;font-size:1.5rem}.arb-project-mosque .arb-project-screen{background:linear-gradient(145deg,#fffdf5,#f4ead1)}.arb-mosque-arch{position:absolute;right:25px;bottom:0;width:105px;height:150px;background:#c8a45d;border-radius:60px 60px 0 0}.arb-project-ride .arb-project-screen{background:linear-gradient(160deg,#0d2540,#1e4f72);color:#fff}.arb-project-ride .arb-project-screen>b{color:#fff}.arb-road{position:absolute;right:25px;bottom:-10px;width:95px;height:180px;background:#2b3440;transform:rotate(25deg)}.arb-road i{display:block;width:4px;height:100%;margin:auto;background:repeating-linear-gradient(#fff 0 14px,transparent 14px 27px)}
.arb-project-body{display:flex;flex:1;flex-direction:column;padding:25px 22px}.arb-project-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.arb-project-tags span{padding:4px 8px;background:rgba(217,166,46,.13);border-radius:99px;color:var(--arb-gold-dark);font-size:.61rem;font-weight:800}.arb-project-body h3{margin-bottom:10px;font-size:1.45rem}.arb-project-body p{color:var(--arb-muted)}.arb-project-body .arb-text-link{margin-top:auto}.arb-social-project-visual{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;min-height:237px;padding:26px;margin:16px 16px 0;background:linear-gradient(135deg,#0b203c,#173f58);border-radius:11px}.arb-social-project-visual>div{padding:15px 10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:12px;transform:translateY(12px)}.arb-social-project-visual>div:nth-child(2){transform:translateY(-4px)}.arb-social-project-visual span{display:grid;place-items:center;width:38px;height:38px;margin-bottom:23px;background:var(--arb-gold);border-radius:50%;color:var(--arb-navy)}.arb-social-project-visual i{display:block;height:7px;margin:8px 0;background:rgba(255,255,255,.3);border-radius:8px}
.arb-menu-showcase{background:var(--arb-white)}.arb-menu-layout{display:grid;grid-template-columns:1fr;gap:48px;align-items:center}.arb-menu-copy h2{font-size:clamp(2rem,7vw,3.4rem);letter-spacing:-.035em;text-wrap:balance}.arb-digital-menu{position:relative;width:min(100%,560px);margin:0 auto}.arb-menu-screen{position:relative;min-height:330px;padding:28px;background:linear-gradient(135deg,#111d2c,#263b4d);border:8px solid #151b22;border-radius:12px;box-shadow:0 30px 70px rgba(7,26,51,.3)}.arb-menu-head strong,.arb-menu-head span{display:block}.arb-menu-head strong{color:var(--arb-gold);font-size:1.5rem}.arb-menu-head span{color:rgba(255,255,255,.6);font-size:.68rem}.arb-menu-columns{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:35px}.arb-menu-columns b{display:block;margin-bottom:15px;color:#fff;font-size:.75rem}.arb-menu-columns i{display:block;height:7px;margin:10px 0;background:linear-gradient(90deg,rgba(255,255,255,.65) 0 70%,var(--arb-gold) 70% 100%);border-radius:5px}.arb-menu-offer{position:absolute;right:20px;bottom:18px;padding:8px 11px;background:var(--arb-gold);border-radius:6px;color:var(--arb-navy);font-size:.65rem;font-weight:900}.arb-menu-stand{width:85px;height:35px;margin:0 auto;background:linear-gradient(90deg,#222,#555,#222);clip-path:polygon(38% 0,62% 0,70% 75%,100% 75%,100% 100%,0 100%,0 75%,30% 75%)}.arb-work-principles{background:var(--arb-background)}.arb-work-principles .arb-values-grid article>span{font-size:1.25rem;font-weight:900}
@media(min-width:700px){.arb-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:980px){.arb-project-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.arb-menu-layout{grid-template-columns:minmax(0,.9fr) minmax(480px,1.1fr);gap:75px}}
@keyframes arb-collage-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}@keyframes arb-project-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* =========================================================
   21. CONTACT PAGE
   ========================================================= */

.arb-contact-hero{background:radial-gradient(circle at 82% 18%,rgba(217,166,46,.2),transparent 30%),radial-gradient(circle at 68% 82%,rgba(54,169,148,.15),transparent 28%),linear-gradient(135deg,#06172e,#173751)}.arb-contact-visual{position:relative;width:min(100%,470px);min-height:420px;margin:0 auto}.arb-message-card{position:absolute;padding:28px;background:rgba(255,255,255,.98);border-radius:18px;box-shadow:0 28px 70px rgba(0,0,0,.35)}.arb-message-card-back{top:25px;right:5%;width:72%;height:280px;opacity:.38;transform:rotate(7deg)}.arb-message-card-front{bottom:25px;left:3%;z-index:2;width:82%;min-height:330px;animation:arb-message-float 5s ease-in-out infinite}.arb-message-card span,.arb-message-card i{display:block;height:8px;margin:11px 0;background:#c4cfda;border-radius:8px}.arb-message-card span{width:75%}.arb-message-card i{width:58%}.arb-message-card strong{display:block;margin-bottom:25px;color:var(--arb-navy);font-size:1.25rem}.arb-message-icon{display:grid;place-items:center;width:62px;height:62px;margin-bottom:22px;background:linear-gradient(135deg,var(--arb-gold),var(--arb-gold-light));border-radius:17px}.arb-message-icon svg{width:32px;height:32px;fill:none;stroke:var(--arb-navy);stroke-width:1.8}.arb-message-card button{width:auto;min-height:36px;padding:8px 13px;margin-top:23px;background:var(--arb-navy);border:0;border-radius:6px;color:#fff;box-shadow:none;font-size:.68rem}.arb-contact-status{position:absolute;right:0;bottom:0;z-index:3;display:flex;align-items:center;gap:11px;padding:12px 15px;background:var(--arb-navy);border:1px solid rgba(255,255,255,.15);border-radius:10px;box-shadow:var(--arb-shadow)}.arb-contact-status>i{width:11px;height:11px;background:var(--arb-success);border-radius:50%;animation:arb-status-pulse 2s infinite}.arb-contact-status strong,.arb-contact-status small{display:block}.arb-contact-status strong{color:var(--arb-gold);font-size:.72rem}.arb-contact-status small{color:rgba(255,255,255,.7);font-size:.6rem}
.arb-contact-path-strip{background:var(--arb-gold)}.arb-contact-path-strip .arb-container{display:grid;grid-template-columns:1fr}.arb-contact-path-strip a{display:flex;align-items:center;gap:13px;padding:17px 12px;border-bottom:1px solid rgba(7,26,51,.15)}.arb-contact-path-strip a:last-child{border-bottom:0}.arb-contact-path-strip svg{flex:0 0 auto;width:30px;height:30px;fill:none;stroke:var(--arb-navy);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.arb-contact-path-strip strong,.arb-contact-path-strip small{display:block}.arb-contact-path-strip strong{color:var(--arb-navy);font-size:.82rem}.arb-contact-path-strip small{color:var(--arb-navy-soft);font-size:.65rem}
.arb-contact-main{background:var(--arb-background)}.arb-contact-layout{display:grid;grid-template-columns:1fr;gap:25px;align-items:start}.arb-contact-form-panel,.arb-contact-info-card,.arb-coverage-card{background:var(--arb-white);border:1px solid var(--arb-border);border-radius:var(--arb-radius);box-shadow:var(--arb-shadow-small)}.arb-contact-form-panel{padding:28px 22px}.arb-contact-form-panel h2{font-size:clamp(2rem,7vw,3.25rem);letter-spacing:-.03em}.arb-contact-form-intro{color:var(--arb-muted)}.arb-contact-form-content{margin-top:28px}.arb-contact-form-content .wp-block-shortcode{margin:0}.arb-contact-form-content p{max-width:none}.arb-contact-form-content input:not([type=submit]),.arb-contact-form-content textarea,.arb-contact-form-content select{background:#fbfcfd}.arb-contact-form-content input[type=submit],.arb-contact-form-content button[type=submit]{width:100%;margin-top:5px}.arb-form-setup-note{padding:18px;background:#fff8e5;border:1px solid rgba(217,166,46,.45);border-radius:9px}.arb-form-setup-note strong{color:var(--arb-navy)}.arb-form-setup-note p{margin:5px 0 0;color:var(--arb-muted);font-size:.88rem}.arb-form-privacy{display:flex;align-items:flex-start;gap:10px;margin-top:22px;padding-top:18px;border-top:1px solid var(--arb-border)}.arb-form-privacy svg{flex:0 0 auto;width:21px;height:21px;fill:none;stroke:var(--arb-success);stroke-width:1.8}.arb-form-privacy p{margin:0;color:var(--arb-muted);font-size:.76rem}.arb-contact-sidebar{display:grid;gap:20px}.arb-contact-info-card,.arb-coverage-card{padding:25px 22px}.arb-contact-info-card ol{display:grid;gap:20px;padding:0;margin:22px 0 0;list-style:none}.arb-contact-info-card li{display:grid;grid-template-columns:42px 1fr;gap:13px}.arb-contact-info-card li>span{display:grid;place-items:center;width:42px;height:42px;background:rgba(217,166,46,.15);border-radius:11px}.arb-contact-info-card svg{width:23px;height:23px;fill:none;stroke:var(--arb-gold-dark);stroke-width:1.8}.arb-contact-info-card strong,.arb-contact-info-card small{display:block}.arb-contact-info-card strong{color:var(--arb-navy);font-size:.88rem}.arb-contact-info-card small{margin-top:3px;color:var(--arb-muted);font-size:.74rem}.arb-coverage-card{overflow:hidden;background:var(--arb-navy);color:rgba(255,255,255,.75)}.arb-coverage-card h3{color:#fff}.arb-coverage-card .arb-eyebrow{color:var(--arb-gold)}.arb-coverage-map{position:relative;height:150px;margin:-25px -22px 24px;background:radial-gradient(circle at 65% 55%,rgba(217,166,46,.25),transparent 9%),linear-gradient(135deg,#143558,#0a203d)}.arb-coverage-map::before,.arb-coverage-map::after{position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%;content:""}.arb-coverage-map::before{inset:25px 80px}.arb-coverage-map::after{inset:45px 105px}.arb-coverage-map span{position:absolute;top:52%;left:64%;width:12px;height:12px;background:var(--arb-gold);border-radius:50%;box-shadow:0 0 0 8px rgba(217,166,46,.14);animation:arb-status-pulse 2s infinite}
.arb-contact-preparation{background:var(--arb-white)}.arb-contact-preparation .arb-values-grid article>span svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.arb-contact-faq{background:var(--arb-background)}
.arb-native-contact-form{display:grid;gap:17px}.arb-native-contact-form p{margin:0}.arb-form-grid{display:grid;grid-template-columns:1fr;gap:17px}.arb-native-contact-form label small{color:var(--arb-muted);font-size:.7rem;font-weight:400}.arb-native-contact-form label>span[aria-hidden=true]{color:var(--arb-error)}.arb-native-contact-form select{appearance:auto}.arb-consent-field label{display:flex;align-items:flex-start;gap:10px;margin:0;color:var(--arb-muted);font-size:.78rem;font-weight:400}.arb-consent-field input{flex:0 0 auto;width:17px;height:17px;margin-top:3px;accent-color:var(--arb-gold-dark)}.arb-native-contact-form button[type=submit]{display:inline-flex;gap:9px;width:100%;margin-top:2px}.arb-form-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.arb-form-notice{padding:16px;margin-bottom:20px;border-radius:9px}.arb-form-notice strong,.arb-form-notice p{display:block}.arb-form-notice p{margin:4px 0 0;font-size:.84rem}.arb-form-success{background:rgba(29,138,88,.1);border:1px solid rgba(29,138,88,.3);color:#11643e}.arb-form-error{background:rgba(200,61,61,.08);border:1px solid rgba(200,61,61,.28);color:#9e2828}
.arb-coverage-map{display:grid;place-items:center;height:210px;margin:-25px -22px 24px;background:radial-gradient(circle at 55% 45%,rgba(217,166,46,.11),transparent 34%),linear-gradient(135deg,#143558,#0a203d)}.arb-coverage-map::before,.arb-coverage-map::after{display:none}.arb-coverage-map svg{width:100%;height:100%;overflow:visible}.arb-uk-map{fill:rgba(255,255,255,.13);stroke:rgba(255,255,255,.55);stroke-width:1.5;stroke-linejoin:round}.arb-norwich-halo{fill:rgba(217,166,46,.14);stroke:rgba(217,166,46,.45);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:arb-map-pulse 2.2s ease-out infinite}.arb-norwich-marker{fill:var(--arb-gold);filter:drop-shadow(0 0 6px rgba(217,166,46,.9))}.arb-norwich-line{fill:none;stroke:var(--arb-gold);stroke-width:1}.arb-coverage-map text{fill:var(--arb-gold-light);font-size:9px;font-weight:800}.arb-coverage-map>span{display:none}
.arb-coverage-network{position:relative;height:235px;margin:-25px -22px 24px;overflow:hidden;background:radial-gradient(circle at 50% 50%,rgba(217,166,46,.14),transparent 29%),linear-gradient(135deg,#163b62,#0a203d)}.arb-coverage-network::before{position:absolute;inset:20px;border:1px solid rgba(255,255,255,.06);border-radius:50%;content:"";transform:scaleX(1.65)}.arb-network-core,.arb-network-node{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center}.arb-network-core{top:50%;left:50%;width:92px;height:92px;background:linear-gradient(135deg,var(--arb-gold),var(--arb-gold-light));border-radius:50%;box-shadow:0 0 0 12px rgba(217,166,46,.1),0 15px 35px rgba(0,0,0,.25);transform:translate(-50%,-50%)}.arb-network-core i{width:9px;height:9px;margin-bottom:4px;background:var(--arb-navy);border-radius:50%;animation:arb-status-pulse 2s infinite}.arb-network-core strong{color:var(--arb-navy);font-size:.78rem}.arb-network-core small{color:var(--arb-navy-soft);font-size:.54rem}.arb-network-node{width:88px;min-height:60px;padding:8px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.17);border-radius:11px;box-shadow:0 10px 25px rgba(0,0,0,.16);backdrop-filter:blur(7px);animation:arb-network-float 4s ease-in-out infinite}.arb-network-node svg{width:22px;height:22px;margin-bottom:4px;fill:none;stroke:var(--arb-gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.arb-network-node span{color:rgba(255,255,255,.86);font-size:.55rem;font-weight:800;text-align:center}.arb-network-projects{top:17px;left:18px}.arb-network-support{top:20px;right:16px;animation-delay:-1.3s}.arb-network-consult{right:18px;bottom:15px;animation-delay:-2.6s}.arb-network-line{position:absolute;z-index:1;height:1px;background:linear-gradient(90deg,transparent,rgba(217,166,46,.65),transparent);transform-origin:left}.arb-network-line-a{top:69px;left:79px;width:115px;transform:rotate(27deg)}.arb-network-line-b{top:72px;right:75px;width:100px;transform:rotate(150deg)}.arb-network-line-c{right:65px;bottom:61px;width:115px;transform:rotate(205deg)}
@media(min-width:700px){.arb-contact-path-strip .arb-container{grid-template-columns:repeat(3,minmax(0,1fr))}.arb-contact-path-strip a{border-right:1px solid rgba(7,26,51,.15);border-bottom:0}.arb-contact-path-strip a:last-child{border-right:0}}
@media(min-width:620px){.arb-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:920px){.arb-contact-layout{grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:28px}.arb-contact-form-panel{padding:38px}.arb-contact-info-card,.arb-coverage-card{padding:30px}.arb-coverage-map,.arb-coverage-network{margin:-30px -30px 24px}}
@keyframes arb-message-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-9px) rotate(0)}}
@keyframes arb-map-pulse{0%{opacity:1;transform:scale(.55)}100%{opacity:0;transform:scale(2.2)}}
@keyframes arb-network-float{0%,100%{translate:0 0}50%{translate:0 -6px}}

/* =========================================================
   22. BLOG INDEX
   ========================================================= */

.arb-blog-hero{position:relative;overflow:hidden;padding:70px 0;background:radial-gradient(circle at 85% 15%,rgba(217,166,46,.2),transparent 28%),linear-gradient(135deg,#06172e,#173d59)}.arb-blog-hero::before{position:absolute;right:-100px;bottom:-150px;width:390px;height:390px;border:1px solid rgba(255,255,255,.07);border-radius:50%;box-shadow:0 0 0 60px rgba(255,255,255,.018);content:"";animation:arb-options-orbit 7s ease-in-out infinite}.arb-blog-hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr;gap:38px;align-items:center}.arb-blog-hero h1{max-width:790px;color:#fff;font-size:clamp(2.35rem,9vw,4.35rem);line-height:1.05;letter-spacing:-.045em;text-wrap:balance}.arb-blog-hero .arb-eyebrow{color:var(--arb-gold)}.arb-blog-hero-inner>div:first-child>p:last-child{max-width:720px;color:rgba(255,255,255,.72);font-size:1.05rem}.arb-blog-search{padding:24px 20px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:var(--arb-radius);box-shadow:0 24px 60px rgba(0,0,0,.2);backdrop-filter:blur(8px)}.arb-blog-search>p{margin-bottom:12px;color:#fff;font-weight:800}.arb-blog-search .search-form{display:flex;gap:8px}.arb-blog-search .search-field{min-width:0;background:#fff}.arb-blog-search .search-submit{flex:0 0 auto;width:auto;min-height:48px;padding:10px 15px}.arb-blog-topics{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.arb-blog-topics span{padding:4px 8px;background:rgba(255,255,255,.08);border-radius:99px;color:rgba(255,255,255,.65);font-size:.62rem}
.arb-featured-post-section{background:var(--arb-white)}.arb-featured-post{display:grid;grid-template-columns:1fr;overflow:hidden;background:var(--arb-background);border:1px solid var(--arb-border);border-radius:20px;box-shadow:var(--arb-shadow)}.arb-featured-media{display:block;min-height:300px;overflow:hidden}.arb-featured-media img{width:100%;height:100%;min-height:300px;object-fit:cover;transition:transform .6s ease}.arb-featured-post:hover .arb-featured-media img{transform:scale(1.035)}.arb-featured-copy{padding:30px 24px}.arb-featured-copy h2{font-size:clamp(1.8rem,6vw,3rem);letter-spacing:-.035em}.arb-featured-copy h2 a:hover{color:var(--arb-gold-dark)}.arb-featured-copy>p{color:var(--arb-muted)}.arb-post-meta{display:flex;flex-wrap:wrap;gap:8px 16px;margin-bottom:13px;color:var(--arb-gold-dark);font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.arb-post-meta span+span{position:relative}.arb-post-meta span+span::before{position:absolute;left:-9px;color:var(--arb-border);content:"•"}
.arb-post-placeholder{position:relative;display:flex;flex-direction:column;justify-content:flex-end;width:100%;height:100%;min-height:300px;padding:28px;overflow:hidden;background:radial-gradient(circle at 75% 25%,rgba(217,166,46,.3),transparent 25%),linear-gradient(135deg,var(--arb-navy),var(--arb-navy-light))}.arb-post-placeholder::before{position:absolute;top:18%;right:12%;width:150px;height:150px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 35px rgba(255,255,255,.025);content:""}.arb-post-placeholder span,.arb-post-placeholder i{display:block;height:9px;margin:7px 0;background:rgba(255,255,255,.22);border-radius:8px}.arb-post-placeholder span{width:58%}.arb-post-placeholder i{width:40%}.arb-post-placeholder strong{margin-top:22px;color:var(--arb-gold);font-size:1.15rem}.arb-post-placeholder-small{min-height:210px;padding:22px}.arb-post-placeholder-small strong{font-size:.9rem}
.arb-blog-library{background:var(--arb-background)}.arb-blog-toolbar{display:flex;flex-direction:column;gap:20px;margin-bottom:38px}.arb-blog-toolbar h2{margin:0}.arb-category-links{display:flex;flex-wrap:wrap;gap:7px}.arb-category-links a{padding:7px 11px;background:#fff;border:1px solid var(--arb-border);border-radius:99px;color:var(--arb-navy);font-size:.7rem;font-weight:800}.arb-category-links a:hover,.arb-category-links a.is-active{background:var(--arb-navy);border-color:var(--arb-navy);color:#fff}.arb-blog-grid{display:grid;grid-template-columns:1fr;gap:20px}.arb-blog-card{display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--arb-border);border-radius:var(--arb-radius);box-shadow:var(--arb-shadow-small);transition:transform var(--arb-transition),border-color var(--arb-transition),box-shadow var(--arb-transition)}.arb-blog-card:hover{border-color:rgba(217,166,46,.58);box-shadow:var(--arb-shadow);transform:translateY(-7px)}.arb-blog-card-media{display:block;overflow:hidden}.arb-blog-card-media img{width:100%;height:220px;object-fit:cover;transition:transform .55s ease}.arb-blog-card:hover .arb-blog-card-media img{transform:scale(1.04)}.arb-blog-card-body{display:flex;flex:1;flex-direction:column;padding:23px 21px}.arb-blog-card h3{font-size:1.35rem}.arb-blog-card h3 a:hover{color:var(--arb-gold-dark)}.arb-blog-card-body>p{color:var(--arb-muted)}.arb-blog-card-body .arb-text-link{margin-top:auto}.arb-blog-empty,.arb-blog-coming-next{max-width:780px;padding:48px 28px;margin:0 auto;background:#fff;border:1px solid var(--arb-border);border-radius:var(--arb-radius);box-shadow:var(--arb-shadow-small);text-align:center}.arb-blog-empty-icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 22px;background:rgba(217,166,46,.14);border-radius:16px}.arb-blog-empty-icon svg{width:32px;height:32px;fill:none;stroke:var(--arb-gold-dark);stroke-width:1.8}.arb-blog-coming-next>span{display:block;color:var(--arb-navy);font-size:1.4rem;font-weight:800}.navigation.pagination{margin-top:40px}.nav-links{display:flex;flex-wrap:wrap;justify-content:center;gap:7px}.page-numbers{display:grid;place-items:center;min-width:40px;height:40px;padding:0 10px;background:#fff;border:1px solid var(--arb-border);border-radius:7px;color:var(--arb-navy);font-size:.78rem;font-weight:800}.page-numbers.current,.page-numbers:hover{background:var(--arb-navy);border-color:var(--arb-navy);color:#fff}.arb-blog-cta{padding:65px 0;background:var(--arb-navy-light);color:rgba(255,255,255,.78)}.arb-blog-cta h2{color:#fff}.arb-blog-cta .arb-eyebrow{color:var(--arb-gold)}.arb-blog-cta p:last-child{margin:0}
@media(min-width:700px){.arb-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.arb-blog-toolbar{flex-direction:row;align-items:end;justify-content:space-between}.arb-featured-copy{padding:40px}}
@media(min-width:960px){.arb-blog-hero{padding:95px 0}.arb-blog-hero-inner{grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:65px}.arb-featured-post{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:stretch}.arb-blog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* =========================================================
   23. SINGLE ARTICLE
   ========================================================= */
.arb-article-hero{padding:70px 0;background:linear-gradient(135deg,#06172e,#173d59)}.arb-article-heading{max-width:920px;margin:0 auto;text-align:center}.arb-article-heading .arb-post-meta{justify-content:center;color:var(--arb-gold)}.arb-article-heading h1{color:#fff;font-size:clamp(2.3rem,8vw,4.6rem);line-height:1.06;letter-spacing:-.045em;text-wrap:balance}.arb-article-heading>p{max-width:760px;margin:20px auto 0;color:rgba(255,255,255,.72);font-size:1.08rem}.arb-article-featured-image{max-width:1050px;margin:45px auto -145px}.arb-article-featured-image img{width:100%;max-height:570px;object-fit:cover;border:6px solid rgba(255,255,255,.12);border-radius:18px;box-shadow:0 28px 75px rgba(0,0,0,.35)}.arb-article-featured-image+.x{display:none}.arb-article-layout{display:grid;grid-template-columns:1fr;gap:35px;padding-top:80px;padding-bottom:70px}.arb-article-hero:has(.arb-article-featured-image)+.arb-article-layout{padding-top:190px}.arb-article-content.entry-content{padding:0}.arb-article-content.entry-content>*{max-width:780px}.arb-article-content h2{margin-top:50px}.arb-article-content h3{margin-top:34px}.arb-article-content blockquote{padding:22px 25px;margin:35px auto;border-left:4px solid var(--arb-gold);background:var(--arb-background);color:var(--arb-navy);font-size:1.12rem}.arb-article-content pre{padding:20px;overflow:auto;background:var(--arb-navy);border-radius:9px;color:#fff}.arb-article-sidebar{display:grid;gap:16px;align-content:start}.arb-article-share,.arb-article-help{padding:20px;background:var(--arb-background);border:1px solid var(--arb-border);border-radius:10px}.arb-article-share strong{display:block;margin-bottom:11px;color:var(--arb-navy)}.arb-article-share a{display:inline-flex;padding:5px 8px;margin:3px;background:#fff;border:1px solid var(--arb-border);border-radius:5px;font-size:.7rem}.arb-article-help{display:block;background:var(--arb-navy);color:#fff}.arb-article-help span,.arb-article-help strong{display:block}.arb-article-help span{color:var(--arb-gold);font-size:.68rem;font-weight:900;text-transform:uppercase}.arb-article-help strong{margin:8px 0}.arb-article-help i{color:var(--arb-gold);font-style:normal}.arb-article-tags{display:flex;flex-wrap:wrap;gap:7px;padding-top:25px;margin-top:45px;border-top:1px solid var(--arb-border)}.arb-article-tags a{padding:5px 8px;background:var(--arb-background);border-radius:5px;font-size:.72rem}.arb-post-navigation{display:grid;grid-template-columns:1fr;gap:12px;padding-bottom:70px}.arb-post-navigation>div{padding:18px;background:var(--arb-background);border:1px solid var(--arb-border);border-radius:9px}.arb-post-navigation small{display:block;color:var(--arb-gold-dark);font-size:.65rem;font-weight:900;text-transform:uppercase}.arb-post-navigation a{color:var(--arb-navy);font-weight:800}.arb-related-posts{background:var(--arb-background)}
@media(min-width:850px){.arb-article-layout{grid-template-columns:210px minmax(0,1fr);gap:55px}.arb-article-sidebar{position:sticky;top:130px}.arb-post-navigation{grid-template-columns:repeat(2,minmax(0,1fr))}.arb-post-navigation>div:last-child{text-align:right}}

/* =========================================================
   24. LEGAL PAGES
   ========================================================= */
.arb-legal-hero{padding:70px 0;background:linear-gradient(135deg,var(--arb-navy),var(--arb-navy-light))}.arb-legal-hero .arb-eyebrow{color:var(--arb-gold)}.arb-legal-hero h1{margin-bottom:14px;color:#fff;font-size:clamp(2.5rem,8vw,4.5rem)}.arb-legal-hero p{max-width:720px;color:rgba(255,255,255,.72)}.arb-legal-hero span{color:var(--arb-gold-light);font-size:.72rem;font-weight:800}.arb-legal-layout{display:grid;grid-template-columns:1fr;gap:35px;padding-top:65px;padding-bottom:80px}.arb-legal-nav{display:none}.arb-legal-content{max-width:850px}.arb-legal-content section{padding:0 0 32px;margin-bottom:32px;border-bottom:1px solid var(--arb-border);scroll-margin-top:130px}.arb-legal-content section:last-child{border:0}.arb-legal-content h2{font-size:1.65rem}.arb-legal-content h3{font-size:1.15rem}.arb-legal-content p,.arb-legal-content li{color:var(--arb-muted)}.arb-legal-content a{color:var(--arb-gold-dark);text-decoration:underline;text-underline-offset:3px}.arb-legal-review{padding:20px;margin-bottom:38px;background:#fff8e5;border:1px solid rgba(217,166,46,.45);border-radius:9px}.arb-legal-review strong{color:var(--arb-navy)}.arb-legal-review p{margin:5px 0 0;font-size:.86rem}.arb-cookie-types{display:grid;grid-template-columns:1fr;gap:12px}.arb-cookie-types article{padding:18px;background:var(--arb-background);border:1px solid var(--arb-border);border-radius:8px}.arb-cookie-types strong{color:var(--arb-navy)}.arb-cookie-types p{margin:5px 0 0;font-size:.86rem}.arb-policy-table{overflow-x:auto;border:1px solid var(--arb-border);border-radius:9px}.arb-policy-table table{width:100%;min-width:680px;border-collapse:collapse}.arb-policy-table th,.arb-policy-table td{padding:12px;border-bottom:1px solid var(--arb-border);text-align:left;vertical-align:top}.arb-policy-table th{background:var(--arb-navy);color:#fff;font-size:.75rem}.arb-policy-table td{font-size:.78rem;color:var(--arb-muted)}
@media(min-width:850px){.arb-legal-layout{grid-template-columns:220px minmax(0,1fr);gap:60px}.arb-legal-nav{position:sticky;top:125px;display:grid;align-self:start;padding:20px;background:var(--arb-background);border:1px solid var(--arb-border);border-radius:10px}.arb-legal-nav strong{margin-bottom:10px;color:var(--arb-navy)}.arb-legal-nav a{padding:6px 0;color:var(--arb-muted);font-size:.78rem}.arb-legal-nav a:hover{color:var(--arb-gold-dark)}.arb-cookie-types{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* =========================================================
   25. REDESIGNED FOOTER
   ========================================================= */
.site-footer{padding:0;background:var(--arb-navy);color:rgba(255,255,255,.75)}.site-footer>.arb-footer-main{display:grid!important;grid-template-columns:1fr;gap:38px;padding-top:65px;padding-bottom:55px}.arb-footer-brand{max-width:360px}.arb-footer-logo{display:inline-flex;margin-bottom:20px;padding:9px;background:#fff;border-radius:9px}.arb-footer-logo img{width:auto;height:52px}.arb-footer-brand>p{font-size:.9rem}.arb-footer-location{position:relative;padding-left:24px}.arb-footer-location>span{position:absolute;top:5px;left:2px;width:10px;height:10px;background:var(--arb-gold);border-radius:50%;box-shadow:0 0 0 6px rgba(217,166,46,.1)}.arb-footer-location strong,.arb-footer-location small{display:block}.arb-footer-location strong{color:#fff;font-size:.82rem}.arb-footer-location small{color:rgba(255,255,255,.58);font-size:.68rem}.arb-footer-column h2,.arb-footer-contact h2{margin-bottom:16px;color:#fff;font-size:1rem}.arb-footer-column ul{display:grid;gap:8px;padding:0;margin:0;list-style:none}.arb-footer-column a{color:rgba(255,255,255,.7);font-size:.82rem}.arb-footer-column a:hover{color:var(--arb-gold);padding-left:4px}.arb-footer-contact p{font-size:.84rem}.arb-footer-contact .arb-button{width:100%;margin:4px 0 15px}.arb-footer-email{display:block;overflow-wrap:anywhere;color:var(--arb-gold)!important;font-size:.76rem}.arb-footer-bottom{padding:18px 0;background:#041226;border-top:1px solid rgba(255,255,255,.08)}.arb-footer-bottom>.arb-container{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.arb-footer-bottom p{margin:0;font-size:.68rem}.arb-footer-bottom nav{display:flex;flex-wrap:wrap;gap:12px}.arb-footer-bottom nav a{font-size:.68rem}.arb-back-to-top{display:grid;place-items:center;width:34px;height:34px;background:rgba(255,255,255,.08);border-radius:50%;color:var(--arb-gold)!important}
@media(min-width:650px){.site-footer>.arb-footer-main{grid-template-columns:repeat(2,minmax(0,1fr))}.arb-footer-bottom>.arb-container{flex-direction:row;align-items:center;justify-content:space-between}}
@media(min-width:1000px){.site-footer>.arb-footer-main{grid-template-columns:minmax(280px,1.35fr) repeat(2,minmax(145px,.65fr)) minmax(230px,1fr);gap:45px}}

/* =========================================================
   26. HOMEPAGE SHORTCUTS AND SELECTED WORK
   ========================================================= */
.arb-home-shortcuts{background:var(--arb-white);border-bottom:1px solid var(--arb-border)}.arb-home-shortcuts>.arb-container{display:grid;grid-template-columns:1fr}.arb-home-shortcuts a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;padding:15px 5px;border-bottom:1px solid var(--arb-border)}.arb-home-shortcuts a:last-child{border:0}.arb-home-shortcuts a>span{color:var(--arb-gold-dark);font-size:.62rem;font-weight:900}.arb-home-shortcuts strong{color:var(--arb-navy);font-size:.8rem}.arb-home-shortcuts i{color:var(--arb-gold-dark);font-style:normal;transition:transform var(--arb-transition)}.arb-home-shortcuts a:hover i{transform:translateX(4px)}.arb-home-work{background:var(--arb-navy)}.arb-home-work-heading{display:flex;flex-direction:column;align-items:flex-start;gap:22px;margin-bottom:38px}.arb-home-work-heading h2{color:#fff}.arb-home-work-heading p:not(.arb-eyebrow){max-width:720px;color:rgba(255,255,255,.68)}.arb-home-work-heading .arb-eyebrow{color:var(--arb-gold)}.arb-home-work-heading .arb-button-outline{border-color:rgba(255,255,255,.6);color:#fff}.arb-home-projects{display:grid;grid-template-columns:1fr;gap:18px}.arb-home-projects>a{padding:14px 14px 22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--arb-radius);transition:transform var(--arb-transition),background var(--arb-transition),border-color var(--arb-transition)}.arb-home-projects>a:hover{background:rgba(255,255,255,.1);border-color:rgba(217,166,46,.45);transform:translateY(-6px)}.arb-home-project-visual{position:relative;height:190px;padding:22px;overflow:hidden;background:#f4f7fa;border-radius:9px}.arb-home-project-visual strong{display:block;color:var(--arb-navy);font-size:1.5rem}.arb-home-project-visual span{display:block;width:54%;height:8px;margin:12px 0;background:#bec9d4;border-radius:8px}.arb-home-project-visual::after{position:absolute;right:-30px;bottom:-35px;width:140px;height:140px;background:var(--arb-gold);border-radius:35px;content:"";transform:rotate(18deg)}.arb-home-project-food{background:#eff9e9}.arb-home-project-food::after{background:#75a84d;border-radius:50%}.arb-home-project-community{background:#fff8e6}.arb-home-project-community::after{background:#c8a45d;border-radius:70px 70px 0 0}.arb-home-projects p{margin:17px 0 4px;color:var(--arb-gold);font-size:.64rem;font-weight:900;text-transform:uppercase}.arb-home-projects h3{margin-bottom:13px;color:#fff;font-size:1.3rem}.arb-home-projects i{color:rgba(255,255,255,.65);font-size:.72rem;font-style:normal}
@media(min-width:650px){.arb-home-shortcuts>.arb-container{grid-template-columns:repeat(5,minmax(0,1fr))}.arb-home-shortcuts a{border-right:1px solid var(--arb-border);border-bottom:0}.arb-home-shortcuts a:last-child{border-right:0}.arb-home-projects{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:900px){.arb-home-work-heading{flex-direction:row;align-items:end;justify-content:space-between}.arb-home-work-heading .arb-button{width:auto;flex:0 0 auto}}

/* =========================================================
   27. HOMEPAGE HIGH-TECH JOURNEY AND SERVICE REDESIGN
   ========================================================= */
.arb-button-teal{background:#29b6a8;border-color:#29b6a8;color:var(--arb-navy);box-shadow:0 10px 25px rgba(41,182,168,.25)}.arb-button-teal:hover{background:#55d2c5;border-color:#55d2c5;color:var(--arb-navy)}
.arb-home-shortcuts{position:relative;overflow:hidden;background:linear-gradient(90deg,#06172e,#102e50,#06172e);border:0}.arb-home-shortcuts::before{position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:32px 32px;content:""}.arb-home-shortcuts>.arb-container{position:relative;z-index:1}.arb-home-shortcuts a{position:relative;grid-template-columns:auto 1fr auto;min-height:78px;padding:13px 10px;border-color:rgba(255,255,255,.1)}.arb-home-shortcuts a::after{position:absolute;right:-7px;z-index:3;color:var(--arb-gold);content:"›";font-size:1.4rem}.arb-home-shortcuts a:last-child::after{display:none}.arb-home-shortcuts strong{color:#fff;font-size:.78rem}.arb-home-shortcuts a>i{color:rgba(255,255,255,.45)}.arb-journey-icon{position:relative;display:grid;place-items:center;width:43px;height:43px;background:rgba(255,255,255,.07);border:1px solid rgba(217,166,46,.35);border-radius:13px;color:var(--arb-gold);box-shadow:0 9px 20px rgba(0,0,0,.17);transition:background var(--arb-transition),color var(--arb-transition),transform var(--arb-transition)}.arb-journey-icon::after{position:absolute;inset:-5px;border:1px solid rgba(217,166,46,.13);border-radius:17px;content:"";transition:transform var(--arb-transition)}.arb-journey-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.arb-home-shortcuts a:hover .arb-journey-icon{background:var(--arb-gold);color:var(--arb-navy);transform:translateY(-4px)}.arb-home-shortcuts a:hover .arb-journey-icon::after{transform:scale(1.08)}
.arb-home-services{position:relative;overflow:hidden;padding-top:75px;background:linear-gradient(180deg,#edf3f8 0%,#f8fafc 100%)}.arb-home-services::before{position:absolute;top:13%;right:-130px;width:380px;height:380px;border:1px solid rgba(7,26,51,.06);border-radius:50%;box-shadow:0 0 0 55px rgba(7,26,51,.018);content:""}.arb-home-services .arb-section-heading{position:relative;max-width:none;padding:34px 26px 62px;margin:0 0 -32px;overflow:hidden;background:radial-gradient(circle at 88% 20%,rgba(217,166,46,.22),transparent 28%),linear-gradient(135deg,var(--arb-navy),#153d60);border-radius:22px;text-align:left;box-shadow:0 25px 65px rgba(7,26,51,.2)}.arb-home-services .arb-section-heading::after{position:absolute;right:-65px;bottom:-100px;width:250px;height:250px;border:1px solid rgba(255,255,255,.08);border-radius:50%;content:""}.arb-home-services .arb-section-heading .arb-eyebrow{color:var(--arb-gold)}.arb-home-services .arb-section-heading h2{max-width:780px;color:#fff;text-wrap:balance}.arb-home-services .arb-section-heading>p:last-child{max-width:760px;margin:0;color:rgba(255,255,255,.7)}.arb-home-services .arb-service-grid{position:relative;z-index:2;padding:0 12px}.arb-home-services .arb-service-card{position:relative;padding:29px 24px;overflow:hidden;border:0;box-shadow:0 18px 42px rgba(7,26,51,.13)}.arb-home-services .arb-service-card::before{position:absolute;top:0;right:0;left:0;height:4px;background:linear-gradient(90deg,var(--arb-gold-dark),var(--arb-gold-light));content:""}.arb-home-services .arb-service-card::after{position:absolute;right:-45px;bottom:-55px;width:130px;height:130px;background:rgba(217,166,46,.06);border-radius:50%;content:"";transition:transform .45s ease}.arb-home-services .arb-service-card:nth-child(2)::before{background:linear-gradient(90deg,#5b62d8,#8d92ff)}.arb-home-services .arb-service-card:nth-child(2)::after{background:rgba(91,98,216,.07)}.arb-home-services .arb-service-card:nth-child(3)::before{background:linear-gradient(90deg,#159b8c,#52d0c0)}.arb-home-services .arb-service-card:nth-child(3)::after{background:rgba(21,155,140,.07)}.arb-home-services .arb-service-card:nth-child(4)::before{background:linear-gradient(90deg,#2877bd,#62a8e2)}.arb-home-services .arb-service-card:nth-child(4)::after{background:rgba(40,119,189,.07)}.arb-home-services .arb-service-card:hover::after{transform:scale(1.7)}.arb-home-services .arb-service-icon{position:relative;z-index:1;width:58px;height:58px;background:linear-gradient(135deg,rgba(217,166,46,.2),rgba(217,166,46,.08));border:1px solid rgba(217,166,46,.2);border-radius:16px}.arb-home-services .arb-service-card:nth-child(2) .arb-service-icon{background:rgba(91,98,216,.1);color:#5159c7;border-color:rgba(91,98,216,.18)}.arb-home-services .arb-service-card:nth-child(3) .arb-service-icon{background:rgba(21,155,140,.1);color:#118477;border-color:rgba(21,155,140,.18)}.arb-home-services .arb-service-card:nth-child(4) .arb-service-icon{background:rgba(40,119,189,.1);color:#2169aa;border-color:rgba(40,119,189,.18)}.arb-home-services .arb-service-card:hover .arb-service-icon{transform:rotate(-5deg) scale(1.08)}.arb-home-services .arb-service-card h3,.arb-home-services .arb-service-card p,.arb-home-services .arb-service-card .arb-text-link{position:relative;z-index:1}
@media(min-width:650px){.arb-home-shortcuts a{min-height:92px;grid-template-columns:1fr;justify-items:center;gap:7px;text-align:center}.arb-home-shortcuts a::after{top:36px}.arb-home-shortcuts a>i{display:none}.arb-home-services .arb-section-heading{padding:45px 42px 76px}.arb-home-services .arb-service-grid{padding:0 24px}}
@media(min-width:1000px){.arb-home-shortcuts strong{font-size:.82rem}.arb-journey-icon{width:49px;height:49px}.arb-home-services .arb-section-heading{padding:55px 52px 82px}.arb-home-services .arb-service-grid{gap:20px}.arb-home-services .arb-service-card{padding:32px 25px}}

/* =========================================================
   28. TABLETS AND SMALL LAPTOPS
   ========================================================= */

@media (max-width: 1150px) {
    .header-inner { min-height: 88px; }
    .mobile-menu-toggle { display: flex; }

    .primary-navigation {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        display: none;
        max-height: calc(100vh - 88px);
        padding: 20px;
        overflow-y: auto;
        background: var(--arb-white);
        border-top: 1px solid var(--arb-border);
        border-bottom: 1px solid var(--arb-border);
        box-shadow: var(--arb-shadow);
    }

    .primary-navigation.is-open { display: block; }

    .primary-navigation .menu,
    .primary-navigation > ul { display: block; }

    .primary-navigation li {
        width: 100%;
        border-bottom: 1px solid var(--arb-border);
    }

    .primary-navigation li:last-child { border-bottom: 0; }
    .primary-navigation li a { padding: 15px 4px; }
    .primary-navigation li a::after { display: none; }

    .primary-navigation .sub-menu {
        position: static;
        display: none;
        width: 100%;
        padding: 0 0 10px 15px;
        visibility: visible;
        opacity: 1;
        background: transparent;
        border: 0;
        box-shadow: none;
        transform: none;
    }

    .primary-navigation li:hover > .sub-menu,
    .primary-navigation li:focus-within > .sub-menu { display: block; }
    .primary-navigation .sub-menu li { border-bottom: 0; }
    .header-cta {
        width: 100%;
        margin: 20px 0 0;
    }
    .arb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .arb-hero,
    .arb-hero-content { min-height: 610px; }

    .arb-hero-background { background-position: 58% center; }

    .arb-hero-content {
        justify-content: flex-end;
        padding-top: 55px;
        padding-bottom: 55px;
    }

    .arb-hero-panel {
        width: min(100%, 410px);
        margin-right: 0;
    }
}

@media screen and (max-width: 782px) {
    body.admin-bar .site-header { top: 46px; }
}

/* =========================================================
   29. MOBILE
   ========================================================= */

@media (max-width: 700px) {
    html { scroll-padding-top: 90px; }

    .arb-container {
        width: min(calc(100% - 28px), var(--arb-container));
    }

    .arb-section { padding: 65px 0; }
    .header-inner { min-height: 78px; gap: 15px; }

    .site-logo { max-width: 185px; }
    .site-logo img { height: 48px; }
    .custom-logo { max-width: 185px; max-height: 48px; }
    .site-name { max-width: 210px; font-size: 1.08rem; line-height: 1.2; white-space: normal; }
    .primary-navigation { max-height: calc(100vh - 78px); }

    .arb-hero {
        min-height: auto;
        background: #061a38;
    }

    .arb-hero-background {
        position: relative;
        width: 100%;
        min-height: 0;
        aspect-ratio: 16 / 9;
        background-color: #061a38;
        background-position: center center;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .arb-hero-content {
        display: block;
        width: 100%;
        min-height: auto;
        padding: 0;
    }

    .arb-hero-content.arb-container {
        width: 100%;
        max-width: none;
    }

    .arb-hero-panel {
        width: 100%;
        margin: 0;
        padding: 34px 20px 42px;
        background: var(--arb-navy);
        border: 0;
        border-radius: 0;
        box-shadow: none;
        backdrop-filter: none;
    }

    .arb-hero h1 {
        max-width: 560px;
        font-size: clamp(2rem, 9vw, 2.75rem);
    }

    .arb-hero .hero-description {
        max-width: 560px;
        font-size: 1rem;
    }

    .arb-hero .hero-buttons { flex-direction: column; }
    .arb-hero .hero-buttons .arb-button { width: 100%; }
    .arb-grid { grid-template-columns: 1fr; gap: 20px; }
    .arb-card { padding: 25px; }
    .entry-content, .page-content { padding: 50px 0; }

    .footer-bottom,
    .site-footer > .arb-container {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
}

@media (max-width: 420px) {
    .arb-container { width: min(calc(100% - 24px), var(--arb-container)); }
    .site-logo { max-width: 155px; }
    .site-logo img { height: 42px; }
    .custom-logo { max-width: 155px; max-height: 42px; }
    .arb-hero-background {
        min-height: 0;
        aspect-ratio: 16 / 9;
    }
    .arb-hero-panel { padding: 30px 16px 36px; }
    .arb-button { width: 100%; }
}

/* =========================================================
   30. REDUCED MOTION AND PRINT
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

@media print {
    .site-header,
    .site-footer,
    .mobile-menu-toggle,
    .hero-buttons { display: none !important; }

    body { color: #000; background: #fff; }
    a { color: #000; text-decoration: underline; }
}