:root {
    --ccs-navy: #0A1D44;
    --ccs-navy-mid: #122a5c;
    --ccs-navy-soft: #1b3a78;
    --ccs-orange: #F15A24;
    --ccs-orange-dark: #d14a1a;
    --ccs-orange-soft: #fff1ea;
    --ccs-teal: #00ACC1;
    --ccs-cream: #F6F4F0;
    --ccs-text: #1c2434;
    --ccs-muted: #5c6578;
    --ccs-white: #ffffff;
    --ccs-bg: #ffffff;
    --ccs-surface: #ffffff;
    --ccs-heading: #0A1D44;
    --ccs-border: rgba(10, 29, 68, .1);
    --ccs-input-bg: #fbfaf8;
    --ccs-input-border: #e4e0d8;
    --ccs-shadow: 0 18px 50px rgba(10, 29, 68, 0.12);
    --ccs-radius: 18px;
    --ccs-font: "Montserrat", system-ui, sans-serif;
    --ccs-font-display: "Playfair Display", Georgia, serif;
}

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

html { scroll-behavior: smooth; }

body {
    font-family: var(--ccs-font);
    color: var(--ccs-text);
    background: var(--ccs-bg);
    line-height: 1.65;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--ccs-font-display);
    font-weight: 700;
}

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

a { color: var(--ccs-orange); text-decoration: none; }
a:hover { color: var(--ccs-orange-dark); }

.topbar {
    background: var(--ccs-navy);
    color: rgba(255,255,255,.82);
    font-size: .85rem;
    padding: .45rem 0;
}
.topbar a { color: inherit; }
.topbar a:hover { color: var(--ccs-orange); }
.topbar .sep { opacity: .4; margin: 0 .6rem; }

.ccs-fx {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    padding: 2px;
    vertical-align: middle;
}
.ccs-fx-opt {
    color: inherit !important;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .04em;
    padding: .15rem .55rem;
    border-radius: 999px;
    line-height: 1.3;
}
.ccs-fx-opt:hover { color: #fff !important; }
.ccs-fx-opt.is-active {
    background: var(--ccs-orange);
    color: #fff !important;
}
.ccs-fx-nav {
    border-color: rgba(10, 29, 68, .16);
    background: var(--ccs-surface);
}
.ccs-fx-nav .ccs-fx-opt { color: var(--ccs-navy) !important; }
.ccs-fx-nav .ccs-fx-opt.is-active { color: #fff !important; }
@media (min-width: 768px) {
    .ccs-fx-nav { display: none; }
}

.ccs-theme-toggle {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid rgba(10, 29, 68, .14);
    background: transparent;
    color: var(--ccs-heading);
    display: inline-grid;
    place-items: center;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.ccs-theme-toggle i { font-size: 1rem; }
.ccs-theme-toggle:hover {
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    border-color: rgba(241, 90, 36, .35);
}
.ccs-theme-toggle--on-dark,
.topbar .ccs-theme-toggle {
    width: 30px;
    height: 30px;
    border-color: rgba(255,255,255,.22);
    color: #fff;
    vertical-align: middle;
}
.ccs-theme-toggle--on-dark:hover,
.topbar .ccs-theme-toggle:hover {
    background: rgba(255,255,255,.1);
    color: #fff;
    border-color: rgba(255,255,255,.4);
}
.ccs-theme-toggle--nav {
    width: 34px;
    height: 34px;
}
@media (min-width: 768px) {
    .ccs-theme-toggle--nav { display: none; }
}

.navbar-ccs {
    background: var(--ccs-surface);
    box-shadow: 0 8px 24px rgba(10, 29, 68, .06);
    padding: .4rem 0;
    position: sticky;
}
.ccs-scroll-line {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
    background: rgba(10, 29, 68, .08);
}
.ccs-scroll-line-bar {
    display: block;
    height: 100%;
    width: 100%;
    background: var(--ccs-orange);
    transform: scaleX(0);
    transform-origin: left center;
    will-change: transform;
}
@media print {
    .ccs-scroll-line { display: none !important; }
}
.ccs-nav-tools {
    display: flex;
    align-items: center;
    gap: .4rem;
}
.ccs-search-toggle {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid rgba(10, 29, 68, .14);
    background: transparent;
    color: var(--ccs-heading);
    display: inline-grid;
    place-items: center;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.ccs-search-toggle i { font-size: 1rem; }
.ccs-search-toggle:hover,
.ccs-search-toggle:focus-visible,
.ccs-search-toggle[aria-expanded="true"] {
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    border-color: rgba(241, 90, 36, .35);
    outline: 0;
}
@media (max-width: 991.98px) {
    .ccs-search-toggle--nav { display: none; }
}
.navbar-ccs .navbar-brand img {
    height: auto;
    width: auto;
    max-height: 84px;
    max-width: 148px;
    object-fit: contain;
    display: block;
}
.navbar-ccs .nav-link {
    color: var(--ccs-navy) !important;
    font-weight: 500;
    padding: .55rem .85rem .7rem !important;
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    border-radius: 999px;
    transition: color .2s ease, background .2s ease;
}
.navbar-ccs .nav-link > i:first-child {
    font-size: .98rem;
    line-height: 1;
    transition: transform .28s cubic-bezier(.34, 1.4, .64, 1), color .2s ease;
}
.navbar-ccs .nav-link span {
    position: relative;
    z-index: 1;
}
.navbar-ccs .nav-caret {
    font-size: .68rem;
    margin-left: -.1rem;
    transition: transform .28s ease;
}
.navbar-ccs .dropdown-toggle::after { display: none; }
.navbar-ccs .nav-link::before {
    content: "";
    position: absolute;
    left: .85rem;
    right: .85rem;
    bottom: .18rem;
    height: 2px;
    background: var(--ccs-orange);
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .28s cubic-bezier(.4, 0, .2, 1);
}
.navbar-ccs .nav-link:hover,
.navbar-ccs .nav-link.active {
    color: var(--ccs-orange) !important;
    background: var(--ccs-orange-soft);
}
.navbar-ccs .nav-link:hover::before,
.navbar-ccs .nav-link.active::before {
    transform: scaleX(1);
}
.navbar-ccs .nav-link:hover > i:first-child,
.navbar-ccs .nav-link.active > i:first-child {
    transform: translateY(-2px) scale(1.12);
    color: var(--ccs-orange);
}
.navbar-ccs .dropdown.show > .nav-link .nav-caret,
.navbar-ccs .nav-link:hover .nav-caret {
    transform: rotate(180deg);
}
.navbar-ccs .navbar-nav .nav-item {
    animation: navTabIn .45s ease both;
}
.navbar-ccs .navbar-nav .nav-item:nth-child(1) { animation-delay: .04s; }
.navbar-ccs .navbar-nav .nav-item:nth-child(2) { animation-delay: .08s; }
.navbar-ccs .navbar-nav .nav-item:nth-child(3) { animation-delay: .12s; }
.navbar-ccs .navbar-nav .nav-item:nth-child(4) { animation-delay: .16s; }
.navbar-ccs .navbar-nav .nav-item:nth-child(5) { animation-delay: .2s; }
.navbar-ccs .navbar-nav .nav-item:nth-child(6) { animation-delay: .24s; }
.navbar-ccs .navbar-nav .nav-item:nth-child(7) { animation-delay: .28s; }
.navbar-ccs .navbar-nav .nav-item:nth-child(8) { animation-delay: .32s; }
@keyframes navTabIn {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: none; }
}
.navbar-ccs .btn-quote-nav {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    transition: transform .22s ease, background .2s ease, box-shadow .22s ease;
}
.navbar-ccs .btn-quote-nav i {
    font-size: 1.05rem;
    line-height: 1;
    animation: quoteIconIdle 2.4s ease-in-out infinite;
}
.navbar-ccs .btn-quote-nav::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.35) 50%, transparent 65%);
    transform: translateX(-130%);
    pointer-events: none;
}
.navbar-ccs .btn-quote-nav:hover,
.navbar-ccs .btn-quote-nav:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 14px 26px rgba(241, 90, 36, .38);
    outline: 0;
}
.navbar-ccs .btn-quote-nav:hover i,
.navbar-ccs .btn-quote-nav:focus-visible i {
    animation: quoteIconNudge .55s cubic-bezier(.34, 1.4, .64, 1);
}
.navbar-ccs .btn-quote-nav:hover::after,
.navbar-ccs .btn-quote-nav:focus-visible::after {
    animation: quoteShine .7s ease;
}
@keyframes quoteIconIdle {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-2px); }
}
@keyframes quoteIconNudge {
    0% { transform: rotate(0) scale(1); }
    40% { transform: rotate(-12deg) scale(1.18) translateY(-1px); }
    100% { transform: rotate(0) scale(1); }
}
@keyframes quoteShine {
    from { transform: translateX(-130%); }
    to { transform: translateX(130%); }
}
.navbar-ccs .navbar-collapse {
    position: relative;
    z-index: 3;
}
.navbar-ccs .nav-item.dropdown {
    position: relative;
    z-index: 4;
}
.dropdown-menu {
    border: 0;
    border-radius: 14px;
    box-shadow: var(--ccs-shadow);
    padding: .5rem;
    z-index: 5;
}
.dropdown-item {
    border-radius: 10px;
    padding: .55rem .8rem;
    color: var(--ccs-navy);
    display: flex;
    align-items: center;
    gap: .55rem;
    transition: background .18s ease, color .18s ease, transform .18s ease;
}
.dropdown-item i {
    width: 1.1rem;
    color: var(--ccs-navy);
    text-align: center;
    transition: transform .22s ease;
}
.dropdown-item:hover {
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    transform: translateX(4px);
}
.dropdown-item:hover i { transform: scale(1.12); }
.nav-ico-all { color: var(--ccs-navy); }
.nav-ico-web { color: #00ACC1; }
.nav-ico-software { color: #5B5FCF; }
.nav-ico-graphic { color: #F15A24; }
.nav-ico-photography { color: #C43B6E; }
.nav-ico-marketing { color: #2E9B6A; }
.nav-ico-ecitizen { color: #C9A227; }
.nav-ico-branding { color: #E07A2F; }
.nav-ico-studio { color: #5c6578; }

.svc-icon {
    --svc-icon-fg: var(--ccs-orange);
    --svc-icon-bg: var(--ccs-orange-soft);
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    color: var(--svc-icon-fg);
    background:
        linear-gradient(165deg, rgba(255,255,255,.72), transparent 58%),
        var(--svc-icon-bg);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.7),
        0 10px 22px rgba(10, 29, 68, .08);
    transition: transform .22s ease, box-shadow .22s ease;
}
.svc-icon svg {
    width: 24px;
    height: 24px;
    display: block;
}
.home-offer:hover .svc-icon,
.offer-card:hover .svc-icon {
    transform: translateY(-3px) scale(1.06);
}
.svc-icon--web { --svc-icon-fg: #0e8fa3; --svc-icon-bg: #e5f7fa; }
.svc-icon--software { --svc-icon-fg: #4a4eb8; --svc-icon-bg: #eceefc; }
.svc-icon--graphic { --svc-icon-fg: #d14a1a; --svc-icon-bg: #fff1ea; }
.svc-icon--photography { --svc-icon-fg: #b33262; --svc-icon-bg: #fbeaf1; }
.svc-icon--marketing { --svc-icon-fg: #1f8a5a; --svc-icon-bg: #e7f6ee; }
.svc-icon--ecitizen { --svc-icon-fg: #a4841c; --svc-icon-bg: #f8f1d8; }
.svc-icon--branding { --svc-icon-fg: #c65f1c; --svc-icon-bg: #fdeee3; }
.svc-icon--studio { --svc-icon-fg: #3d4a63; --svc-icon-bg: #eef1f6; }

.btn-orange {
    background: var(--ccs-orange);
    color: #fff !important;
    border: 0;
    border-radius: 999px;
    padding: .7rem 1.4rem;
    font-weight: 600;
    box-shadow: 0 10px 20px rgba(241, 90, 36, .28);
}
.btn-orange:hover { background: var(--ccs-orange-dark); color: #fff !important; }
.btn-navy {
    background: var(--ccs-navy);
    color: #fff !important;
    border: 0;
    border-radius: 999px;
    padding: .7rem 1.4rem;
    font-weight: 600;
}
.btn-navy:hover { background: var(--ccs-navy-mid); color: #fff !important; }
.btn-ghost {
    border: 1.5px solid rgba(255,255,255,.5);
    color: #fff !important;
    border-radius: 999px;
    padding: .7rem 1.4rem;
    font-weight: 600;
}
.btn-ghost:hover { background: #fff; color: var(--ccs-navy) !important; }

.hero {
    position: relative;
    background:
        radial-gradient(circle at 85% 15%, rgba(241, 90, 36, .28), transparent 32%),
        radial-gradient(circle at 10% 80%, rgba(0, 172, 193, .18), transparent 28%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 48%, #16356f 100%);
    color: #fff;
    min-height: 88vh;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.hero::after {
    content: "";
    position: absolute;
    right: -80px;
    top: -80px;
    width: 420px;
    height: 420px;
    border: 40px solid rgba(241, 90, 36, .12);
    border-radius: 40% 60% 55% 45%;
    transform: rotate(18deg);
}
.hero-kicker {
    letter-spacing: .22em;
    text-transform: uppercase;
    font-size: .78rem;
    color: var(--ccs-orange);
    font-weight: 600;
}
.hero h1 {
    font-weight: 800;
    font-size: clamp(2.2rem, 5vw, 4.1rem);
    line-height: 1.12;
    max-width: 14ch;
}
.hero p.lead {
    max-width: 38rem;
    color: rgba(255,255,255,.82);
}
.hero-panel {
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 24px;
    padding: 1.5rem;
}
.hero-stat { text-align: center; }
.hero-stat strong {
    display: block;
    font-size: 1.7rem;
    color: var(--ccs-orange);
}
.hero-stat span { font-size: .8rem; color: rgba(255,255,255,.75); }

.section { padding: 5rem 0; }
.section-cream { background: var(--ccs-cream); }
.section-navy { background: var(--ccs-navy); color: #fff; }

.section-kicker,
.hero-kicker,
.quote-kicker,
.footer-nav h2,
.footer-studio h2,
.sd-aside-card h2,
.ecitizen-disclaimer-head h2,
.about-dock-label,
.sd-dock-label {
    font-family: var(--ccs-font);
}

.section-kicker {
    color: var(--ccs-orange);
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: .78rem;
}
.section h2 {
    font-weight: 750;
    color: var(--ccs-heading);
    letter-spacing: -.02em;
}
.section-navy h2 { color: #fff; }

.service-card {
    background: #fff;
    border: 0;
    border-radius: var(--ccs-radius);
    padding: 1.6rem;
    height: 100%;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .06);
    transition: transform .2s ease, box-shadow .2s ease;
    position: relative;
    overflow: hidden;
}
.service-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--ccs-shadow);
}
.service-card .icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    font-size: 1.4rem;
    margin-bottom: 1rem;
}
.service-card h3 {
    font-size: 1.15rem;
    color: var(--ccs-navy);
    font-weight: 650;
}
.service-card p { color: var(--ccs-muted); margin-bottom: 1rem; }
.service-card .stretched-link { color: var(--ccs-navy); font-weight: 600; }
.service-card .stretched-link:hover { color: var(--ccs-orange); }

.about-band {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 3rem;
    align-items: center;
}
.about-visual {
    background: var(--ccs-navy);
    border-radius: 28px;
    min-height: 360px;
    position: relative;
    overflow: hidden;
    padding: 2rem;
    color: #fff;
}
.about-visual::before {
    content: "";
    position: absolute;
    inset: auto -40px -40px auto;
    width: 220px;
    height: 220px;
    background: var(--ccs-orange);
    border-radius: 40% 60%;
    opacity: .85;
}
.quote-chip {
    background: rgba(255,255,255,.08);
    border-radius: 16px;
    padding: 1rem 1.2rem;
    position: relative;
    z-index: 1;
}

.testimonial {
    background: #fff;
    border-radius: var(--ccs-radius);
    padding: 1.8rem;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .06);
    height: 100%;
}
.testimonial .stars { color: var(--ccs-orange); letter-spacing: .15em; }
.testimonial p { color: var(--ccs-muted); }
.testimonial .who { font-weight: 600; color: var(--ccs-navy); }

.page-hero {
    background:
        linear-gradient(135deg, rgba(10,29,68,.92), rgba(18,42,92,.78)),
        url("../images/placeholder.svg") center/cover;
    color: #fff;
    padding: 7.5rem 0 4rem;
}
.page-hero h1 { font-weight: 800; }

.crumbs {
    display: inline-flex;
    max-width: 100%;
    margin: 0 0 1.35rem;
}
.crumbs ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: .22rem .28rem;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    backdrop-filter: blur(12px);
    gap: 0;
}
.crumbs li {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    color: rgba(255,255,255,.72);
    font-size: .8rem;
    font-weight: 500;
    font-family: var(--ccs-font);
}
.crumbs li:not(:last-child)::after {
    content: "";
    width: .38rem;
    height: .38rem;
    margin: 0 .18rem 0 .08rem;
    border-right: 1.5px solid rgba(255,255,255,.42);
    border-top: 1.5px solid rgba(255,255,255,.42);
    transform: rotate(45deg);
    flex-shrink: 0;
    opacity: .7;
}
.crumbs a {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: rgba(255,255,255,.78) !important;
    padding: .32rem .72rem;
    border-radius: 999px;
    line-height: 1.2;
    transition: background .2s ease, color .2s ease, transform .2s ease;
}
.crumbs a i {
    font-size: .92rem;
    color: var(--ccs-orange);
}
.crumbs a:hover,
.crumbs a:focus-visible {
    background: rgba(255,255,255,.12);
    color: #fff !important;
    outline: 0;
}
.crumbs [aria-current="page"] > span {
    display: block;
    max-width: min(28ch, 52vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #fff;
    font-weight: 600;
    padding: .32rem .8rem .32rem .55rem;
}

.content-card {
    background: #fff;
    border-radius: var(--ccs-radius);
    box-shadow: var(--ccs-shadow);
    padding: 2rem;
}

.blog-card, .work-card {
    background: #fff;
    border-radius: var(--ccs-radius);
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .06);
    height: 100%;
    transition: transform .2s ease, box-shadow .2s ease;
}
.blog-card:hover, .work-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--ccs-shadow);
}
.blog-card img, .work-card > img {
    width: 100%;
    height: 210px;
    object-fit: cover;
}
.work-card {
    display: flex;
    flex-direction: column;
}
.work-card-media {
    display: block;
    overflow: hidden;
    background: var(--ccs-navy);
}
.work-card-media img {
    width: 100%;
    height: 230px;
    object-fit: cover;
    display: block;
    transition: transform .45s ease;
}
.work-card:hover .work-card-media img { transform: scale(1.06); }
.blog-card .body, .work-card .body { padding: 1.2rem 1.3rem 1.5rem; }
.work-card .body {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.work-card .body h2 a,
.work-card .body h3 a { color: var(--ccs-navy); }
.work-card .body h2 a:hover,
.work-card .body h3 a:hover { color: var(--ccs-orange); }
.work-card .body > p:not(.meta) {
    color: var(--ccs-muted);
    font-size: .92rem;
    flex: 1;
}
.work-more {
    font-weight: 650;
    color: var(--ccs-navy);
    margin-top: .4rem;
}
.work-more:hover { color: var(--ccs-orange); }
.meta { color: var(--ccs-muted); font-size: .85rem; }
.chip {
    display: inline-block;
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    border-radius: 999px;
    padding: .15rem .7rem;
    font-size: .78rem;
    font-weight: 600;
}

.filter-bar {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: .4rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.filter-bar::-webkit-scrollbar { display: none; }
.filter-bar button {
    border: 1px solid #e4e0d8;
    background: #fff;
    border-radius: 999px;
    padding: .4rem .7rem .4rem .85rem;
    font-weight: 500;
    font-size: .82rem;
    color: var(--ccs-navy);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    flex: 1 1 0;
    min-width: 0;
    white-space: nowrap;
    line-height: 1.2;
}
.filter-bar .filter-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
.filter-bar .filter-count {
    flex-shrink: 0;
    min-width: 1.45rem;
    height: 1.45rem;
    padding: 0 .35rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: var(--ccs-cream);
    color: var(--ccs-navy);
    font-size: .7rem;
    font-weight: 700;
    font-family: var(--ccs-font);
}
.filter-bar button.active,
.filter-bar button:hover {
    background: var(--ccs-navy);
    color: #fff;
    border-color: var(--ccs-navy);
}
.filter-bar button.active .filter-count,
.filter-bar button:hover .filter-count {
    background: var(--ccs-orange);
    color: #fff;
}

.work-stage {
    position: relative;
    background:
        radial-gradient(circle at 90% 18%, rgba(241, 90, 36, .3), transparent 34%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 52%, #16356f 100%);
    color: #fff;
    padding: 6.8rem 0 5.2rem;
    overflow: hidden;
}
.work-stage::after {
    content: "";
    position: absolute;
    left: -80px;
    bottom: -100px;
    width: 280px;
    height: 280px;
    border: 32px solid rgba(0, 172, 193, .14);
    border-radius: 46% 54%;
}
.work-stage h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 4.6vw, 3.5rem);
    line-height: 1.12;
    max-width: 14ch;
}
.work-stage .lead {
    color: rgba(255,255,255,.8);
    max-width: 36rem;
    margin: .85rem 0 0;
}
.work-stat {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 18px;
    padding: 1.1rem 1.2rem;
    backdrop-filter: blur(10px);
    text-align: left;
}
.work-stat strong {
    display: block;
    font-size: 2.1rem;
    color: var(--ccs-orange);
    line-height: 1;
}
.work-stat span { font-size: .85rem; color: rgba(255,255,255,.72); }

.work-feed {
    background: var(--ccs-cream);
    padding: 0 0 4.5rem;
}
.work-toolbar {
    position: relative;
    z-index: 2;
    margin-top: -1.6rem;
    margin-bottom: 2rem;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(10, 29, 68, .1);
    padding: .85rem 1rem;
}
.work-empty {
    background: #fff;
    border-radius: 18px;
    padding: 2.2rem;
    text-align: center;
    color: var(--ccs-muted);
}
.page-portfolio .post-close { background: var(--ccs-cream); padding-top: 0; }
.page-portfolio .site-footer { padding-top: 3rem; }

.svc-stage,
.sd-cover {
    --svc-hero-h: max(32.5rem, 58vh);
    position: relative;
    color: #fff;
    padding: 6.8rem 0 5.2rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: var(--svc-hero-h);
    height: var(--svc-hero-h);
}
.svc-stage {
    background:
        radial-gradient(circle at 12% 80%, rgba(0, 172, 193, .16), transparent 28%),
        radial-gradient(circle at 88% 12%, rgba(241, 90, 36, .3), transparent 34%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 52%, #16356f 100%);
}
.svc-stage::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -70px;
    width: 300px;
    height: 300px;
    border: 34px solid rgba(241, 90, 36, .12);
    border-radius: 40% 60%;
}
.svc-stage.has-image,
.sd-cover.has-image {
    background-color: #111114;
    background-image: none;
}
.svc-stage.has-image::before,
.sd-cover.has-image::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(18, 18, 20, .84), rgba(18, 18, 20, .84)),
        var(--cover);
    background-size: cover, cover;
    background-position: center, center;
    z-index: 0;
}
.svc-stage.has-image::after,
.sd-cover.has-image::after {
    display: none;
}
.svc-stage h1,
.sd-cover h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 4.6vw, 3.5rem);
    line-height: 1.12;
    max-width: 16ch;
}
.svc-stage .lead,
.sd-cover .lead {
    color: rgba(255,255,255,.8);
    max-width: 38rem;
    margin: .85rem 0 0;
}

.svc-feed {
    background: var(--ccs-cream);
    padding: 3.5rem 0 2rem;
}
.offer-card {
    background: #fff;
    border-radius: 22px;
    padding: 1.7rem 1.7rem 1.6rem;
    height: 100%;
    box-shadow: 0 14px 36px rgba(10, 29, 68, .07);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}
.offer-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--ccs-shadow);
}
.offer-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.1rem;
}
.offer-num {
    font-size: 1.7rem;
    font-weight: 800;
    color: var(--ccs-navy);
    letter-spacing: -.04em;
    opacity: .18;
    line-height: 1;
}
.offer-card .svc-icon {
    width: 56px;
    height: 56px;
}
.offer-card h2 {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--ccs-navy);
    margin-bottom: .55rem;
}
.offer-card > p { color: var(--ccs-muted); flex: 1; }
.offer-from {
    font-size: .92rem;
    color: var(--ccs-navy);
    margin: .2rem 0 1rem;
}
.offer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: auto;
}
.offer-actions .btn { padding: .55rem 1.15rem; font-size: .92rem; }

.svc-method {
    background: #fff;
    padding: 4.2rem 0 3.5rem;
}
.svc-step {
    padding: .2rem .2rem 0;
}
.svc-step span {
    display: block;
    font-size: .78rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ccs-orange);
    font-weight: 700;
    margin-bottom: .5rem;
}
.svc-step h3 {
    font-size: 1.15rem;
    color: var(--ccs-navy);
    font-weight: 700;
    margin-bottom: .4rem;
}
.svc-step p { color: var(--ccs-muted); margin: 0; }

.page-services .post-close { padding-top: 0; }
.page-services .site-footer { padding-top: 3rem; }

.sd-cover {
    background:
        radial-gradient(circle at 88% 18%, rgba(241, 90, 36, .32), transparent 36%),
        linear-gradient(145deg, #071428 0%, var(--ccs-navy) 50%, #16356f 100%);
}
.sd-cover::after {
    content: "";
    position: absolute;
    right: -100px;
    bottom: -120px;
    width: 340px;
    height: 340px;
    border: 36px solid rgba(255,255,255,.06);
    border-radius: 42% 58%;
}
.sd-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: var(--ccs-orange);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.4rem;
    margin-bottom: 1rem;
}
.sd-cover-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    margin-top: 1.35rem;
}

.sd-dock {
    position: relative;
    z-index: 2;
    margin-top: -2rem;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 22px 50px rgba(10, 29, 68, .12);
    padding: 1.15rem 1.4rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.sd-dock-label {
    display: block;
    font-size: .75rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ccs-muted);
    font-weight: 650;
    margin-bottom: .2rem;
}
.sd-dock strong { color: var(--ccs-navy); font-size: 1.05rem; }

.sd-body { padding: 3rem 0 3.2rem; }
.sd-prose {
    background: #fff;
    border-radius: 22px;
    padding: 2rem 2.1rem;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .05);
    font-size: 1.06rem;
    line-height: 1.8;
    color: #2c3342;
}
.sd-prose p { margin-bottom: 1.1rem; }
.sd-prose h4,
.sd-prose h3 {
    color: var(--ccs-navy);
    font-weight: 700;
    margin: 1.6rem 0 .8rem;
}
.sd-prose ul {
    list-style: none;
    padding: 0;
    margin: 0 0 1.2rem;
}
.sd-prose li {
    position: relative;
    padding: .4rem 0 .4rem 1.8rem;
    border-bottom: 1px solid #f0ebe3;
}
.sd-prose li:last-child { border-bottom: 0; }
.sd-prose li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .85rem;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--ccs-orange);
}

.sd-aside { position: sticky; top: 96px; display: grid; gap: 1rem; }
.sd-aside-card {
    background: var(--ccs-cream);
    border-radius: 20px;
    padding: 1.35rem 1.3rem;
}
.sd-aside-card h2 {
    font-size: .78rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ccs-muted);
    margin-bottom: .7rem;
}
.sd-aside-card p { color: var(--ccs-muted); }

.ecitizen-disclaimer,
.ecitizen-note {
    border-radius: 16px;
    background: #fff8f0;
    border: 1px solid rgba(241, 90, 36, .28);
    color: #3a2a22;
}
.ecitizen-disclaimer {
    padding: 1.25rem 1.3rem 1.15rem;
    margin-bottom: 1.25rem;
}
.ecitizen-disclaimer-head {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-bottom: .65rem;
}
.ecitizen-disclaimer-head i {
    color: var(--ccs-orange);
    font-size: 1.25rem;
}
.ecitizen-disclaimer-head h2 {
    margin: 0;
    font-size: .78rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--ccs-navy);
}
.ecitizen-disclaimer p {
    margin: 0 0 .75rem;
    font-size: .95rem;
    line-height: 1.65;
}
.ecitizen-disclaimer ul {
    margin: 0;
    padding-left: 1.15rem;
    display: grid;
    gap: .45rem;
    font-size: .92rem;
    line-height: 1.55;
    color: #4a3d36;
}
.ecitizen-disclaimer a {
    color: var(--ccs-navy);
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.ecitizen-disclaimer a:hover { color: var(--ccs-orange); }
.ecitizen-note {
    display: flex;
    gap: .55rem;
    align-items: flex-start;
    padding: .75rem .85rem;
    margin: 0 0 1rem;
    position: relative;
    z-index: 1;
}
.ecitizen-note i {
    color: var(--ccs-orange);
    margin-top: .12rem;
    flex-shrink: 0;
}
.ecitizen-note p {
    margin: 0;
    font-size: .82rem;
    line-height: 1.5;
    color: #4a3d36;
}
.ecitizen-note a,
.ecitizen-disclaimer-more a {
    color: var(--ccs-navy);
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.ecitizen-note a:hover,
.ecitizen-disclaimer-more a:hover { color: var(--ccs-orange); }
.ecitizen-disclaimer-more {
    margin: .85rem 0 0;
    font-size: .92rem;
}
.service-card .ecitizen-note,
.offer-card .ecitizen-note {
    margin-top: auto;
    margin-bottom: .9rem;
}
.service-card .ecitizen-note p { margin: 0; color: #4a3d36; }
.sd-aside .ecitizen-note { margin-bottom: 0; }
.quote-modal .ecitizen-note { margin-bottom: 0; }

.sd-others { list-style: none; margin: 0; padding: 0; }
.sd-others a {
    display: flex;
    align-items: center;
    gap: .65rem;
    color: var(--ccs-navy);
    font-weight: 600;
    padding: .55rem 0;
    border-top: 1px solid #e8e2d8;
}
.sd-others li:first-child a { border-top: 0; padding-top: 0; }
.sd-others a:hover { color: var(--ccs-orange); }
.sd-others i {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: #fff;
    color: var(--ccs-orange);
    display: grid;
    place-items: center;
}

.sd-work {
    background: var(--ccs-cream);
    padding: 3.5rem 0 2.5rem;
}
.sd-work .work-card h3 a { color: var(--ccs-navy); }
.sd-work .work-card h3 a:hover { color: var(--ccs-orange); }
.sd-pager { padding: 1.5rem 0 0; }
.sd-work + .sd-pager { background: var(--ccs-cream); }
.page-service-detail .post-close { background: var(--ccs-cream); padding-top: 1.5rem; }
.page-service-detail .site-footer { padding-top: 3rem; }

.contact-info-card {
    background: var(--ccs-navy);
    color: #fff;
    border-radius: var(--ccs-radius);
    padding: 2rem;
    height: 100%;
}
.contact-info-card a { color: #fff; }
.map-wrap {
    border-radius: var(--ccs-radius);
    overflow: hidden;
    min-height: 320px;
}
.map-wrap iframe { width: 100%; height: 360px; border: 0; }

.cta-strip {
    background: linear-gradient(90deg, var(--ccs-orange), #ff7a3d);
    color: #fff;
    border-radius: 24px;
    padding: 2.2rem;
}

.footer-cta-wrap {
    background: #071326;
    padding: 2.2rem 0 0;
}
.footer-cta {
    position: relative;
    z-index: 1;
    background:
        radial-gradient(circle at 92% 12%, rgba(241, 90, 36, .28), transparent 38%),
        linear-gradient(135deg, #0c1f48, var(--ccs-navy));
    color: #fff;
    border-radius: 24px;
    padding: 2rem 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1.4rem;
    margin: 0 0 -2.2rem;
    box-shadow: 0 22px 50px rgba(7, 19, 38, .28);
}
.footer-cta h2 {
    font-size: clamp(1.4rem, 2.4vw, 1.9rem);
    font-weight: 750;
    max-width: 16ch;
    margin-bottom: .4rem;
    color: #fff;
}
.footer-cta p {
    margin: 0;
    color: rgba(255,255,255,.78);
    max-width: 32rem;
}
.footer-cta-actions { display: flex; flex-wrap: wrap; gap: .6rem; }

.site-footer {
    position: relative;
    background:
        radial-gradient(circle at 90% 0%, rgba(241, 90, 36, .16), transparent 30%),
        radial-gradient(circle at 6% 100%, rgba(0, 172, 193, .1), transparent 26%),
        #071326;
    color: rgba(255,255,255,.78);
    padding: 4.6rem 0 0;
    overflow: hidden;
}
.site-footer::after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -110px;
    width: 280px;
    height: 280px;
    border: 32px solid rgba(241, 90, 36, .1);
    border-radius: 42% 58%;
    pointer-events: none;
}
.site-footer h5 { color: #fff; font-weight: 650; }
.site-footer a { color: rgba(255,255,255,.78); }
.site-footer a:hover { color: var(--ccs-orange); }
.site-footer .logo-foot {
    height: auto;
    width: auto;
    max-height: 118px;
    max-width: 188px;
    object-fit: contain;
    display: block;
    background: #fff;
    border-radius: 14px;
    padding: .4rem .5rem;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.35fr .8fr 1.05fr 1.2fr;
    gap: 2.4rem 2rem;
    position: relative;
    z-index: 1;
    padding-bottom: 3rem;
}
.footer-logo { display: inline-block; margin-bottom: 1.1rem; }
.footer-brand p {
    max-width: 38ch;
    font-size: .95rem;
    line-height: 1.7;
    color: rgba(255,255,255,.72);
    margin-bottom: .85rem;
}
.footer-story {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-weight: 650;
    color: #fff !important;
    transition: color .2s ease, gap .2s ease;
}
.footer-story:hover {
    color: var(--ccs-orange) !important;
    gap: .65rem;
}
.footer-nav h2,
.footer-studio h2 {
    font-size: .75rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ccs-orange);
    font-weight: 700;
    margin-bottom: 1.05rem;
}
.footer-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer-nav a {
    display: inline-flex;
    padding: .32rem 0;
    color: rgba(255,255,255,.78);
    font-weight: 500;
    transition: color .2s ease, transform .2s ease;
}
.footer-nav a:hover {
    color: var(--ccs-orange);
    transform: translateX(5px);
}
.footer-contact {
    display: flex;
    gap: .85rem;
    align-items: flex-start;
    padding: .7rem 0;
    border-top: 1px solid rgba(255,255,255,.08);
    color: inherit !important;
    transition: transform .2s ease;
}
.footer-studio .footer-contact:first-of-type {
    border-top: 0;
    padding-top: 0;
}
.footer-contact .qi {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: rgba(241, 90, 36, .14);
    color: var(--ccs-orange);
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-size: 1.05rem;
    transition: background .2s ease, color .2s ease;
}
.footer-contact strong {
    display: block;
    color: rgba(255,255,255,.55);
    font-size: .72rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-weight: 650;
    margin-bottom: .12rem;
}
.footer-contact em {
    display: block;
    font-style: normal;
    font-weight: 600;
    color: rgba(255,255,255,.88);
    line-height: 1.45;
}
.footer-contact:hover {
    transform: translateX(4px);
    color: inherit !important;
}
.footer-contact:hover .qi {
    background: var(--ccs-orange);
    color: #fff;
}
.footer-contact:hover em { color: #fff; }
.footer-hours {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: .9rem 0 0;
    font-size: .85rem;
    color: rgba(255,255,255,.6);
}
.footer-hours span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #3dd68c;
    box-shadow: 0 0 0 4px rgba(61, 214, 140, .16);
}

.site-footer .social a {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    margin-right: .35rem;
    color: #fff;
    transition: background .2s ease, border-color .2s ease, transform .2s ease, color .2s ease;
}
.site-footer .social a:hover {
    background: var(--ccs-orange);
    border-color: var(--ccs-orange);
    color: #fff;
    transform: translateY(-3px);
}

.footer-bottom {
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(255,255,255,.08);
    margin-top: 0;
    padding: 1.15rem 0 1.35rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .7rem 1.2rem;
    font-size: .85rem;
    color: rgba(255,255,255,.55);
}
.footer-bottom-quote {
    background: transparent;
    border: 0;
    padding: 0;
    color: #fff;
    font: inherit;
    font-weight: 650;
    cursor: pointer;
}
.footer-bottom-quote:hover { color: var(--ccs-orange); }
.footer-copy {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
}
.footer-admin {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.16);
    display: inline-grid;
    place-items: center;
    color: rgba(255,255,255,.55) !important;
    font-size: .92rem;
    flex-shrink: 0;
    transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.footer-admin:hover,
.footer-admin:focus-visible {
    background: var(--ccs-orange);
    border-color: var(--ccs-orange);
    color: #fff !important;
    outline: 0;
}
.footer-legal {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem 1.15rem;
}
.footer-legal a {
    color: rgba(255,255,255,.7);
    font-weight: 600;
}
.footer-legal a:hover { color: var(--ccs-orange); }
.footer-cookies {
    background: none;
    border: 0;
    padding: 0;
    color: rgba(255,255,255,.7);
    font-weight: 600;
    font-size: inherit;
    font-family: inherit;
    cursor: pointer;
}
.footer-cookies:hover { color: var(--ccs-orange); }

.social a {
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    margin-right: .4rem;
}

.team-card {
    text-align: center;
    background: #fff;
    border-radius: var(--ccs-radius);
    padding: 1.6rem;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .06);
}
.avatar-circle {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    margin: 0 auto 1rem;
    display: grid;
    place-items: center;
    background: var(--ccs-navy);
    color: #fff;
    font-weight: 700;
    font-size: 1.4rem;
}

.prose h4 { color: var(--ccs-navy); margin-top: 1.5rem; }
.prose img { border-radius: 16px; }

.quote-inline {
    color: var(--ccs-orange);
    font-weight: 600;
    text-decoration: none;
    vertical-align: baseline;
}
.quote-inline:hover { color: var(--ccs-orange-dark); }

.quote-modal {
    border: 0;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(7, 19, 40, .35);
}
.quote-modal-head {
    background:
        radial-gradient(circle at 90% 10%, rgba(241, 90, 36, .35), transparent 36%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 60%, #16356f 100%);
    color: #fff;
    padding: 1.6rem 1.7rem 1.3rem;
    position: relative;
}
.quote-modal-head .btn-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 2;
}
.quote-modal-head .quote-modal-logo {
    display: block;
    height: auto;
    width: auto;
    max-height: 86px;
    max-width: 140px;
    object-fit: contain;
    background: #fff;
    border-radius: 12px;
    padding: .35rem .45rem;
    margin-bottom: .85rem;
}
.quote-modal-head .quote-kicker {
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: .72rem;
    color: var(--ccs-orange);
    font-weight: 600;
    margin-bottom: .35rem;
}
.quote-modal-head h2 {
    font-weight: 750;
    font-size: 1.7rem;
    margin-bottom: .35rem;
}
.quote-modal-head p {
    margin: 0;
    color: rgba(255,255,255,.78);
    max-width: 36rem;
}
.quote-modal-body { padding: 1.5rem 1.7rem 1.7rem; }
.quote-modal .form-control,
.quote-modal .form-select {
    border-radius: 12px;
    border-color: #e4e0d8;
    padding: .7rem .9rem;
}
.quote-modal .form-control:focus,
.quote-modal .form-select:focus {
    border-color: var(--ccs-orange);
    box-shadow: 0 0 0 .2rem rgba(241, 90, 36, .18);
}
.quote-call {
    color: var(--ccs-navy);
    font-weight: 600;
    font-size: .92rem;
}
.quote-call:hover { color: var(--ccs-orange); }
.quote-legal {
    font-size: .8rem;
    color: var(--ccs-muted);
    line-height: 1.5;
}
.quote-legal a { font-weight: 650; }
.quote-success {
    text-align: center;
    padding: 1.5rem .5rem 1rem;
}
.quote-success-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    display: grid;
    place-items: center;
    font-size: 1.8rem;
    margin: 0 auto 1rem;
}
.quote-success h3 { color: var(--ccs-navy); font-weight: 700; }

.project-modal {
    position: relative;
    border: 0;
    border-radius: 22px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 30px 80px rgba(7, 19, 40, .35);
}
.project-modal-close {
    position: absolute;
    top: .85rem;
    right: .85rem;
    z-index: 20;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #fff;
    color: var(--ccs-navy);
    font-size: 1.05rem;
    line-height: 1;
    box-shadow: 0 8px 22px rgba(7, 19, 40, .28);
    cursor: pointer;
}
.project-modal-close:hover,
.project-modal-close:focus-visible {
    background: var(--ccs-orange);
    color: #fff;
    outline: 0;
}
.project-modal-loading,
.project-modal-error {
    min-height: 280px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .8rem;
    background: var(--ccs-navy);
    color: #fff;
    padding: 2rem;
    text-align: center;
}
#projectModalBody:not(.d-none) {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
}
.project-modal-media {
    background: #071326;
    min-height: 420px;
}
.project-modal-slide {
    min-height: 420px;
    background: #071326;
}
.project-modal-media .carousel,
.project-modal-media .carousel-inner,
.project-modal-media .carousel-item {
    height: 100%;
}
.project-modal-media img {
    width: 100%;
    height: 100%;
    min-height: 420px;
    object-fit: cover;
    display: block;
}
.project-modal-copy {
    padding: 2rem 1.7rem 1.7rem;
    display: flex;
    flex-direction: column;
}
.project-modal-copy h2 {
    color: var(--ccs-navy);
    font-weight: 750;
    font-size: 1.55rem;
    line-height: 1.25;
    margin: .7rem 0 1rem;
}
.project-modal-meta {
    list-style: none;
    margin: 0 0 1.1rem;
    padding: 0;
    display: grid;
    gap: .45rem;
}
.project-modal-meta span {
    display: block;
    font-size: .72rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ccs-muted);
    font-weight: 650;
}
.project-modal-meta strong { color: var(--ccs-navy); }
.project-modal-desc {
    color: var(--ccs-muted);
    white-space: pre-wrap;
    flex: 1;
    margin-bottom: 1.2rem;
}
.project-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}

@media (max-width: 991px) {
    #projectModalBody:not(.d-none) { grid-template-columns: 1fr; }
    .project-modal-media img,
    .project-modal-slide { min-height: 240px; }
}

@media (max-width: 575px) {
    .quote-modal-head,
    .quote-modal-body { padding-left: 1.15rem; padding-right: 1.15rem; }
    .about-steps { grid-template-columns: 1fr; }
    .about-belief { padding: 1.6rem 1.35rem; }
    .about-plate-top,
    .about-plate-list { padding-left: 1.3rem; padding-right: 1.3rem; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-brand { grid-column: auto; }
    .footer-cta { padding: 1.5rem 1.25rem; }
    .crumbs ol { border-radius: 16px; }
    .crumbs [aria-current="page"] > span { max-width: 18ch; }
}

.contact-stage {
    position: relative;
    background:
        radial-gradient(circle at 88% 12%, rgba(241, 90, 36, .3), transparent 34%),
        radial-gradient(circle at 8% 90%, rgba(0, 172, 193, .16), transparent 30%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 52%, #16356f 100%);
    color: #fff;
    padding: 6.8rem 0 7.5rem;
    overflow: hidden;
}
.contact-stage::after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -120px;
    width: 340px;
    height: 340px;
    border: 36px solid rgba(241, 90, 36, .12);
    border-radius: 42% 58% 50% 50%;
}
.contact-stage h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 4.6vw, 3.6rem);
    line-height: 1.12;
    max-width: 14ch;
}
.contact-stage .lead {
    color: rgba(255,255,255,.8);
    max-width: 36rem;
    margin: 1rem 0 0;
}
.contact-hours {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .55rem;
    margin-top: 1.4rem;
    font-size: .9rem;
    color: rgba(255,255,255,.72);
}
.contact-hours .dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--ccs-orange);
}
.contact-quick {
    display: grid;
    gap: .75rem;
}
.contact-quick-item {
    display: flex;
    align-items: center;
    gap: .9rem;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    padding: .9rem 1rem;
    color: #fff !important;
    backdrop-filter: blur(10px);
    transition: background .2s ease, transform .2s ease;
}
.contact-quick-item:hover {
    background: rgba(255,255,255,.14);
    transform: translateX(4px);
    color: #fff !important;
}
.contact-quick-item .qi {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--ccs-orange);
    display: grid;
    place-items: center;
    font-size: 1.15rem;
    flex-shrink: 0;
}
.contact-quick-item strong {
    display: block;
    font-size: .82rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    opacity: .72;
    font-weight: 600;
}
.contact-quick-item em {
    display: block;
    font-style: normal;
    font-weight: 600;
}

.contact-panel-wrap {
    position: relative;
    z-index: 2;
    margin-top: -4.5rem;
    padding-bottom: 4.5rem;
}
.contact-form-card {
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(10, 29, 68, .14);
    padding: 2rem 2rem 2.1rem;
}
.contact-success {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: #f3fbf6;
    border: 1px solid #ccebd6;
    border-radius: 16px;
    padding: 1rem 1.1rem;
    color: var(--ccs-navy);
}
.contact-success .quote-success-icon {
    width: 44px;
    height: 44px;
    font-size: 1.3rem;
    flex-shrink: 0;
    background: #e5f6eb;
    color: #1b7a45;
    margin: 0;
}
.ccs-input {
    position: relative;
}
.ccs-input i {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ccs-muted);
    pointer-events: none;
}
.ccs-input input,
.ccs-input select,
.ccs-input textarea {
    width: 100%;
    border: 1px solid #e4e0d8;
    border-radius: 12px;
    background-color: #fbfaf8;
    padding: .78rem .95rem .78rem 2.5rem;
    color: var(--ccs-text);
    font: inherit;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.ccs-input textarea { min-height: 150px; resize: vertical; }
.ccs-input select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%235c6578' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 2.4rem;
}
.ccs-input-area i { top: 18px; transform: none; }
.ccs-input input:focus,
.ccs-input select:focus,
.ccs-input textarea:focus {
    outline: 0;
    background-color: #fff;
    border-color: var(--ccs-orange);
    box-shadow: 0 0 0 .2rem rgba(241, 90, 36, .16);
}

.contact-aside {
    background: var(--ccs-cream);
    border-radius: 24px;
    padding: 1.8rem 1.7rem;
    height: 100%;
}
.contact-aside h2 { color: var(--ccs-navy); }
.contact-steps {
    list-style: none;
    margin: 1.2rem 0 1.6rem;
    padding: 0;
    counter-reset: step;
}
.contact-steps li {
    position: relative;
    padding: 0 0 1.3rem 3rem;
    counter-increment: step;
}
.contact-steps li:last-child { padding-bottom: 0; }
.contact-steps li::before {
    content: counter(step);
    position: absolute;
    left: 0;
    top: 0;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--ccs-navy);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: .85rem;
    font-weight: 700;
}
.contact-steps strong {
    display: block;
    color: var(--ccs-navy);
}
.contact-steps span {
    color: var(--ccs-muted);
    font-size: .92rem;
}
.contact-visit {
    display: flex;
    gap: .9rem;
    background: #fff;
    border-radius: 16px;
    padding: 1rem 1.1rem;
    margin-bottom: 1.2rem;
}
.contact-visit .qi {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.contact-visit p { color: var(--ccs-muted); font-size: .92rem; }
.contact-social span {
    font-size: .78rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ccs-muted);
    font-weight: 600;
}
.contact-social .social a {
    color: var(--ccs-navy);
    border-color: #ddd7cc;
}
.contact-social .social a:hover {
    color: var(--ccs-orange);
    border-color: var(--ccs-orange);
}

.contact-map { background: #071326; }
.map-bleed {
    position: relative;
    min-height: 460px;
}
.map-bleed iframe {
    width: 100%;
    height: 460px;
    border: 0;
    display: block;
    filter: grayscale(.15) contrast(1.05);
}
.map-card {
    position: absolute;
    left: max(1.25rem, calc((100% - 1140px) / 2));
    bottom: 1.6rem;
    width: min(360px, calc(100% - 2.5rem));
    background: #fff;
    border-radius: 20px;
    padding: 1.4rem 1.5rem;
    box-shadow: var(--ccs-shadow);
    color: var(--ccs-text);
}
.map-card p { color: var(--ccs-muted); margin-bottom: .4rem; }

.page-contact .site-footer { padding-top: 3rem; }

.blog-stage {
    position: relative;
    background:
        radial-gradient(circle at 12% 20%, rgba(241, 90, 36, .28), transparent 32%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 55%, #16356f 100%);
    color: #fff;
    padding: 6.8rem 0 5.5rem;
    overflow: hidden;
}
.blog-stage::after {
    content: "";
    position: absolute;
    right: -70px;
    top: -80px;
    width: 280px;
    height: 280px;
    border: 32px solid rgba(0, 172, 193, .14);
    border-radius: 40% 60%;
}
.blog-stage h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 4.6vw, 3.5rem);
    line-height: 1.12;
}
.blog-stage .lead {
    color: rgba(255,255,255,.8);
    max-width: 34rem;
    margin: .85rem 0 0;
}
.blog-search {
    display: flex;
    align-items: center;
    gap: .5rem;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    padding: .35rem .35rem .35rem 1rem;
    backdrop-filter: blur(10px);
}
.blog-search i { color: rgba(255,255,255,.7); }
.blog-search input {
    flex: 1;
    background: transparent;
    border: 0;
    color: #fff;
    min-width: 0;
    padding: .45rem .3rem;
}
.blog-search input:focus { outline: 0; }
.blog-search input::placeholder { color: rgba(255,255,255,.55); }
.blog-search .btn { padding: .5rem 1.1rem; box-shadow: none; }
.blog-cats {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.blog-cats a {
    color: #fff;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    padding: .32rem .9rem;
    font-size: .85rem;
    font-weight: 500;
}
.blog-cats a:hover,
.blog-cats a.active {
    background: var(--ccs-orange);
    border-color: var(--ccs-orange);
    color: #fff;
}

.blog-feed {
    padding: 3.5rem 0 4.5rem;
    background: var(--ccs-cream);
}
.blog-result-meta {
    color: var(--ccs-muted);
    margin-bottom: 1.4rem;
}
.story-feature {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 0;
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(10, 29, 68, .08);
    margin-bottom: 2rem;
    min-height: 380px;
}
.story-feature-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 380px;
    display: block;
}
.story-feature-body {
    padding: 2.2rem 2rem;
    display: flex;
    flex-direction: column;
}
.story-feature-body h2 {
    font-size: clamp(1.45rem, 2.4vw, 2rem);
    line-height: 1.25;
    margin-bottom: .8rem;
}
.story-feature-body h2 a { color: var(--ccs-navy); }
.story-feature-body h2 a:hover { color: var(--ccs-orange); }
.story-feature-body p { color: var(--ccs-muted); flex: 1; }
.story-more {
    margin-top: 1.1rem;
    font-weight: 650;
    color: var(--ccs-navy);
}
.story-more:hover { color: var(--ccs-orange); }

.story-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    height: 100%;
    box-shadow: 0 12px 32px rgba(10, 29, 68, .06);
    display: flex;
    flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease;
}
.story-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--ccs-shadow);
}
.story-card-media {
    position: relative;
    display: block;
}
.story-card-media img {
    width: 100%;
    height: 210px;
    object-fit: cover;
}
.story-card-media .chip {
    position: absolute;
    left: 12px;
    top: 12px;
    background: #fff;
}
.story-card .body { padding: 1.2rem 1.25rem 1.4rem; flex: 1; display: flex; flex-direction: column; }
.story-card h2 {
    font-size: 1.12rem;
    line-height: 1.35;
    margin-bottom: .5rem;
}
.story-card h2 a { color: var(--ccs-navy); }
.story-card h2 a:hover { color: var(--ccs-orange); }
.story-card p { color: var(--ccs-muted); font-size: .92rem; flex: 1; }

.story-byline {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin-top: .4rem;
}
.story-byline em {
    display: block;
    font-style: normal;
    color: var(--ccs-muted);
    font-size: .8rem;
}
.by-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--ccs-navy);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: .78rem;
    font-weight: 700;
    flex-shrink: 0;
}
.by-avatar.sm { width: 32px; height: 32px; font-size: .7rem; }

.blog-empty {
    background: #fff;
    border-radius: 20px;
    padding: 2.5rem;
    text-align: center;
}

.search-stage {
    position: relative;
    background:
        radial-gradient(circle at 12% 20%, rgba(241, 90, 36, .28), transparent 32%),
        radial-gradient(circle at 88% 80%, rgba(0, 172, 193, .14), transparent 28%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 55%, #16356f 100%);
    color: #fff;
    padding: 6.8rem 0 5.5rem;
    overflow: hidden;
}
.search-stage::after {
    content: "";
    position: absolute;
    right: -70px;
    top: -80px;
    width: 280px;
    height: 280px;
    border: 32px solid rgba(0, 172, 193, .14);
    border-radius: 40% 60%;
}
.search-stage h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 4.6vw, 3.5rem);
    line-height: 1.12;
}
.search-stage .lead {
    color: rgba(255,255,255,.8);
    max-width: 34rem;
    margin: .85rem 0 0;
}
.search-feed {
    padding: 3.5rem 0 4.5rem;
    background: var(--ccs-cream);
}
.ccs-hit-group { margin-bottom: 2.4rem; }
.ccs-hit-head {
    display: flex;
    align-items: baseline;
    gap: .7rem;
    margin-bottom: 1rem;
}
.ccs-hit-head h2 {
    margin: 0;
    color: var(--ccs-heading);
    font-size: 1.35rem;
}
.ccs-hit-head span {
    color: var(--ccs-muted);
    font-size: .85rem;
    font-weight: 650;
}
.ccs-hit {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: var(--ccs-surface);
    border-radius: 18px;
    padding: 1.15rem 1.2rem 1.2rem;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .05);
    color: inherit;
    height: 100%;
    transition: transform .2s ease, box-shadow .2s ease;
}
.ccs-hit:hover {
    color: inherit;
    transform: translateY(-3px);
    box-shadow: 0 16px 36px rgba(10, 29, 68, .1);
}
.ccs-hit-media {
    flex: 0 0 88px;
    width: 88px;
    height: 72px;
    border-radius: 12px;
    overflow: hidden;
    background: #eef1f6;
}
.ccs-hit-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ccs-hit-body { min-width: 0; flex: 1; }
.ccs-hit h2,
.ccs-hit h3 {
    color: var(--ccs-heading);
    font-size: 1.15rem;
    margin: .45rem 0 .35rem;
    line-height: 1.3;
}
.ccs-hit p {
    margin: 0;
    color: var(--ccs-muted);
    font-size: .94rem;
}
.ccs-hit mark,
.ccs-search-live mark {
    background: rgba(241, 90, 36, .22);
    color: inherit;
    padding: 0 .12em;
    border-radius: 3px;
}

.ccs-search {
    position: fixed;
    inset: 0;
    z-index: 3500;
    display: grid;
    align-items: start;
    justify-items: center;
    padding: 12vh 1rem 2rem;
}
.ccs-search[hidden] { display: none !important; }
.ccs-search-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(7, 20, 40, .62);
    backdrop-filter: blur(8px);
}
.ccs-search-panel {
    position: relative;
    width: min(720px, 100%);
    background: var(--ccs-surface);
    border-radius: 22px;
    box-shadow: 0 28px 70px rgba(7, 20, 40, .35);
    overflow: hidden;
    animation: ccsSearchIn .28s ease;
}
@keyframes ccsSearchIn {
    from { opacity: 0; transform: translateY(-12px) scale(.98); }
    to { opacity: 1; transform: none; }
}
.ccs-search-form {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .85rem 1rem .85rem 1.15rem;
    border-bottom: 1px solid var(--ccs-border);
}
.ccs-search-form > i {
    color: var(--ccs-muted);
    font-size: 1.15rem;
}
.ccs-search-form input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    color: var(--ccs-heading);
    font: inherit;
    font-size: 1.05rem;
    padding: .35rem 0;
}
.ccs-search-form input:focus { outline: 0; }
.ccs-search-form input::placeholder { color: var(--ccs-muted); }
.ccs-search-kbd {
    font-family: var(--ccs-font);
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .04em;
    color: var(--ccs-muted);
    background: var(--ccs-cream);
    border: 1px solid var(--ccs-border);
    border-radius: 8px;
    padding: .2rem .45rem;
}
.ccs-search-close {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--ccs-heading);
    display: grid;
    place-items: center;
    cursor: pointer;
}
.ccs-search-close:hover,
.ccs-search-close:focus-visible {
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    outline: 0;
}
.ccs-search-body { padding: .85rem 1.15rem 1.15rem; max-height: min(52vh, 420px); overflow: auto; }
.ccs-search-hint {
    margin: 0;
    color: var(--ccs-muted);
    font-size: .92rem;
}
.ccs-search-live-group { margin-bottom: .85rem; }
.ccs-search-live-group:last-child { margin-bottom: 0; }
.ccs-search-live-label {
    display: block;
    font-size: .72rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-weight: 650;
    color: var(--ccs-muted);
    margin-bottom: .35rem;
}
.ccs-search-live a {
    display: block;
    padding: .5rem .6rem;
    border-radius: 12px;
    color: var(--ccs-heading);
}
.ccs-search-live a:hover,
.ccs-search-live a:focus-visible {
    background: var(--ccs-orange-soft);
    color: var(--ccs-heading);
    outline: 0;
}
.ccs-search-live strong { display: block; font-weight: 650; }
.ccs-search-live em {
    display: block;
    font-style: normal;
    color: var(--ccs-muted);
    font-size: .86rem;
}
.ccs-search-more {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-top: .55rem;
    font-weight: 650;
}
body.ccs-search-open { overflow: hidden; }
.blog-pager .pagination { margin-top: 2rem; }
.blog-pager .page-link {
    color: var(--ccs-navy);
    border: 0;
    border-radius: 10px;
    margin: 0 .15rem;
    font-weight: 600;
}
.blog-pager .page-item.active .page-link {
    background: var(--ccs-navy);
    color: #fff;
}

.page-article { background: #fff; }

.post-cover {
    position: relative;
    min-height: 78vh;
    display: flex;
    align-items: flex-end;
    color: #fff;
    padding: 8rem 0 5.5rem;
    background:
        radial-gradient(circle at 85% 15%, rgba(241, 90, 36, .28), transparent 34%),
        linear-gradient(160deg, #071428 0%, var(--ccs-navy) 55%, #122a5c 100%);
    overflow: hidden;
}
.post-cover.has-image {
    background-image:
        linear-gradient(180deg, rgba(7, 20, 40, .25) 0%, rgba(7, 20, 40, .55) 42%, rgba(7, 20, 40, .92) 100%),
        var(--cover);
    background-size: cover;
    background-position: center;
}
.post-cover-inner { position: relative; z-index: 1; max-width: 820px; }
.post-back {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: rgba(255,255,255,.78);
    font-weight: 500;
    font-size: .92rem;
    margin-bottom: 1.4rem;
}
.post-back:hover { color: #fff; }
.chip-on-dark {
    background: var(--ccs-orange);
    color: #fff;
}
.post-cover h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 5vw, 4rem);
    line-height: 1.12;
    letter-spacing: -.03em;
    max-width: 16ch;
    margin: .9rem 0 1rem;
}
.post-dek {
    font-size: 1.12rem;
    line-height: 1.65;
    color: rgba(255,255,255,.82);
    max-width: 38rem;
    margin: 0;
}

.post-dock {
    position: relative;
    z-index: 2;
    margin-top: -2.4rem;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 22px 50px rgba(10, 29, 68, .14);
    padding: 1.1rem 1.4rem;
    display: grid;
    grid-template-columns: 1.2fr 1fr auto;
    gap: 1rem;
    align-items: center;
}
.post-dock-author {
    display: flex;
    align-items: center;
    gap: .8rem;
}
.post-dock-author div span {
    display: block;
    color: var(--ccs-muted);
    font-size: .82rem;
}
.post-dock-facts {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.2rem;
    color: var(--ccs-muted);
    font-size: .9rem;
}
.post-dock-facts i { color: var(--ccs-orange); margin-right: .25rem; }

.post-reading {
    padding: 3.2rem 1.25rem 3.5rem;
}
.post-prose {
    max-width: 700px;
    margin: 0 auto;
    font-size: 1.14rem;
    line-height: 1.9;
    color: #2a3140;
}
.post-prose > p:first-of-type {
    font-size: 1.28rem;
    line-height: 1.75;
    color: var(--ccs-navy);
    font-weight: 500;
}
.post-prose > p:first-of-type::first-letter {
    float: left;
    font-size: 3.6rem;
    line-height: .8;
    font-weight: 800;
    color: var(--ccs-orange);
    padding-right: .45rem;
    padding-top: .28rem;
}
.post-prose p { margin-bottom: 1.25rem; }
.post-prose h4,
.post-prose h3,
.post-prose h2 {
    color: var(--ccs-navy);
    font-weight: 700;
    margin: 2rem 0 .7rem;
    letter-spacing: -.02em;
}
.post-prose ul, .post-prose ol { margin-bottom: 1.3rem; padding-left: 1.2rem; }
.post-prose li { margin-bottom: .35rem; }
.post-prose a { font-weight: 600; }

.post-pager { padding: 0 0 1rem; }
.post-pager-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    border-top: 1px solid #eee8df;
    padding-top: 1.5rem;
}
.post-pager-link {
    display: block;
    color: inherit;
    padding: .6rem .2rem;
    max-width: 34rem;
}
.post-pager-link.next { margin-left: auto; text-align: right; }
.post-pager-link span {
    display: block;
    font-size: .75rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ccs-orange);
    font-weight: 650;
    margin-bottom: .25rem;
}
.post-pager-link strong {
    color: var(--ccs-navy);
    font-size: 1.05rem;
    line-height: 1.35;
}
.post-pager-link:hover strong { color: var(--ccs-orange); }

.post-close { padding: 1rem 0 4rem; }
.post-close-card {
    background:
        radial-gradient(circle at 90% 10%, rgba(241, 90, 36, .28), transparent 36%),
        linear-gradient(135deg, #071428, var(--ccs-navy));
    color: #fff;
    border-radius: 24px;
    padding: 2.2rem 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
}
.post-close-card h2 {
    font-size: clamp(1.4rem, 2.4vw, 1.9rem);
    font-weight: 750;
    max-width: 16ch;
    margin-bottom: .5rem;
}
.post-close-card p {
    margin: 0;
    color: rgba(255,255,255,.78);
    max-width: 32rem;
}
.post-close-actions { display: flex; flex-wrap: wrap; gap: .6rem; }

.post-related {
    background: var(--ccs-cream);
    padding: 4rem 0 4.5rem;
}
.post-related .story-card h3 a { color: var(--ccs-navy); }
.post-related .story-card h3 a:hover { color: var(--ccs-orange); }

.share-row { display: flex; gap: .45rem; }
.share-row a,
.share-copy {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #ddd7cc;
    background: #fff;
    color: var(--ccs-navy);
    display: grid;
    place-items: center;
}
.share-row a:hover,
.share-copy:hover,
.share-copy.copied { border-color: var(--ccs-orange); color: var(--ccs-orange); }

.page-article .site-footer { padding-top: 3rem; }

.about-stage {
    position: relative;
    background:
        radial-gradient(circle at 88% 14%, rgba(241, 90, 36, .3), transparent 34%),
        radial-gradient(circle at 10% 88%, rgba(0, 172, 193, .16), transparent 28%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 52%, #16356f 100%);
    color: #fff;
    padding: 6.8rem 0 5.8rem;
    overflow: hidden;
}
.about-stage::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -80px;
    width: 320px;
    height: 320px;
    border: 34px solid rgba(241, 90, 36, .12);
    border-radius: 42% 58%;
}
.about-stage::before {
    content: "";
    position: absolute;
    left: -70px;
    bottom: -90px;
    width: 240px;
    height: 240px;
    border: 28px solid rgba(0, 172, 193, .12);
    border-radius: 48% 52%;
}
.about-stage h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 4.6vw, 3.6rem);
    line-height: 1.12;
    max-width: 16ch;
}
.about-stage .lead {
    color: rgba(255,255,255,.8);
    max-width: 38rem;
    margin: .9rem 0 0;
}
.about-stage-note {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 20px;
    padding: 1.25rem 1.35rem;
    backdrop-filter: blur(10px);
    color: rgba(255,255,255,.86);
}

.about-dock-wrap {
    position: relative;
    z-index: 2;
    margin-top: -2.2rem;
    margin-bottom: 0;
}
.about-dock {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 22px 50px rgba(10, 29, 68, .12);
    padding: 1.2rem 1.5rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.about-dock-label {
    display: block;
    font-size: .75rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ccs-muted);
    font-weight: 650;
    margin-bottom: .2rem;
}
.about-dock strong {
    color: var(--ccs-navy);
    font-size: 1.08rem;
}

.about-story { padding: 4.5rem 0 4.2rem; }
.about-story h2 {
    font-weight: 750;
    color: var(--ccs-navy);
    letter-spacing: -.02em;
    max-width: 18ch;
}
.about-story p { color: #2c3342; font-size: 1.05rem; }
.about-story-lead {
    font-size: 1.12rem !important;
    color: var(--ccs-muted) !important;
    margin-top: 1.1rem;
}

.about-plate {
    background: var(--ccs-navy);
    color: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: var(--ccs-shadow);
    position: relative;
}
.about-plate::after {
    content: "";
    position: absolute;
    right: -40px;
    bottom: -50px;
    width: 180px;
    height: 180px;
    background: var(--ccs-orange);
    border-radius: 40% 60%;
    opacity: .85;
    pointer-events: none;
}
.about-plate-top { padding: 1.7rem 1.6rem 1.1rem; position: relative; z-index: 1; }
.about-plate-logo {
    display: block;
    height: auto;
    width: auto;
    max-height: 110px;
    max-width: 168px;
    object-fit: contain;
    background: #fff;
    border-radius: 14px;
    padding: .4rem .5rem;
    margin-bottom: 1rem;
}
.about-plate-top h3 {
    font-size: 1.35rem;
    font-weight: 700;
    margin: .85rem 0 .45rem;
}
.about-plate-top p { color: rgba(255,255,255,.78); margin: 0; }
.about-plate-list {
    list-style: none;
    margin: 0;
    padding: 0 1.6rem 1.2rem;
    position: relative;
    z-index: 1;
}
.about-plate-list li {
    display: flex;
    gap: .65rem;
    align-items: flex-start;
    padding: .45rem 0;
    color: rgba(255,255,255,.88);
    font-size: .95rem;
    border-top: 1px solid rgba(255,255,255,.1);
}
.about-plate-list i { color: var(--ccs-orange); margin-top: .15rem; flex-shrink: 0; }
.about-plate-foot {
    display: flex;
    gap: .65rem;
    align-items: flex-start;
    padding: 1rem 1.6rem 1.35rem;
    background: rgba(0,0,0,.18);
    position: relative;
    z-index: 1;
    font-size: .88rem;
    color: rgba(255,255,255,.78);
}
.about-plate-foot i { color: var(--ccs-orange); }

.about-beliefs {
    background: var(--ccs-cream);
    padding: 4.2rem 0;
}
.about-beliefs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}
.about-belief {
    border-radius: 24px;
    padding: 2.1rem 2rem;
    min-height: 100%;
}
.about-belief span {
    display: block;
    font-size: .78rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: .9rem;
}
.about-belief h2 {
    font-size: clamp(1.45rem, 2.4vw, 1.85rem);
    font-weight: 750;
    letter-spacing: -.02em;
    max-width: 16ch;
    margin-bottom: .85rem;
}
.about-belief p { margin: 0; font-size: 1.02rem; line-height: 1.7; }
.about-belief--navy {
    background:
        radial-gradient(circle at 90% 12%, rgba(241, 90, 36, .28), transparent 40%),
        var(--ccs-navy);
    color: #fff;
}
.about-belief--navy span { color: var(--ccs-orange); }
.about-belief--navy h2 { color: #fff; }
.about-belief--navy p { color: rgba(255,255,255,.78); }
.about-belief--light {
    background: #fff;
    box-shadow: 0 14px 36px rgba(10, 29, 68, .07);
}
.about-belief--light span { color: var(--ccs-orange); }
.about-belief--light h2 { color: var(--ccs-navy); }
.about-belief--light p { color: var(--ccs-muted); }

.about-values { padding: 4.5rem 0 4rem; }
.about-value {
    height: 100%;
    padding: .2rem .15rem 0;
}
.about-value span {
    display: block;
    font-size: .78rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ccs-orange);
    font-weight: 700;
    margin-bottom: .7rem;
}
.about-value h3 {
    font-size: 1.2rem;
    color: var(--ccs-navy);
    font-weight: 700;
    margin-bottom: .45rem;
}
.about-value p { color: var(--ccs-muted); margin: 0; }

.about-method {
    background: var(--ccs-cream);
    padding: 4.2rem 0 4.4rem;
}
.about-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.4rem;
    position: relative;
}
.about-steps::before {
    content: "";
    position: absolute;
    top: 22px;
    left: 6%;
    right: 6%;
    height: 2px;
    background: linear-gradient(90deg, var(--ccs-orange), rgba(241, 90, 36, .18));
}
.about-step {
    position: relative;
    z-index: 1;
}
.about-step-num {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--ccs-navy);
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: .82rem;
    letter-spacing: .04em;
    margin-bottom: 1rem;
    box-shadow: 0 0 0 6px var(--ccs-cream);
}
.about-step h3 {
    font-size: 1.15rem;
    color: var(--ccs-navy);
    font-weight: 700;
    margin-bottom: .4rem;
}
.about-step p { color: var(--ccs-muted); margin: 0; }

.about-people { padding: 4.5rem 0 4.2rem; }
.about-people-aside {
    max-width: 28rem;
    color: var(--ccs-muted);
    font-size: .95rem;
}
.about-person {
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    height: 100%;
    box-shadow: 0 14px 36px rgba(10, 29, 68, .07);
    display: flex;
    flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease;
}
.about-person:hover {
    transform: translateY(-6px);
    box-shadow: var(--ccs-shadow);
}
.about-person-media {
    height: 168px;
    display: grid;
    place-items: center;
    font-size: 2.4rem;
    font-weight: 800;
    letter-spacing: .06em;
    color: #fff;
    background:
        radial-gradient(circle at 82% 18%, rgba(241, 90, 36, .55), transparent 42%),
        linear-gradient(160deg, #122a5c, var(--ccs-navy));
}
.about-person-photo {
    height: 168px;
    width: 100%;
    object-fit: cover;
    display: block;
}
.about-person-body { padding: 1.25rem 1.3rem 1.45rem; }
.about-person h3 {
    font-size: 1.15rem;
    color: var(--ccs-navy);
    font-weight: 700;
    margin-bottom: .4rem;
}
.about-person .chip { margin-bottom: .7rem; }
.about-person p:last-child {
    color: var(--ccs-muted);
    margin: 0;
    font-size: .95rem;
}

.about-practices {
    background: var(--ccs-cream);
    padding: 4.2rem 0 3.5rem;
}
.about-practice {
    display: flex;
    align-items: center;
    gap: .9rem;
    background: #fff;
    border-radius: 16px;
    padding: 1rem 1.1rem;
    height: 100%;
    color: var(--ccs-navy) !important;
    box-shadow: 0 10px 28px rgba(10, 29, 68, .05);
    transition: transform .2s ease, box-shadow .2s ease;
}
.about-practice:hover {
    transform: translateY(-3px);
    box-shadow: var(--ccs-shadow);
    color: var(--ccs-navy) !important;
}
.about-practice .icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}
.about-practice strong {
    display: block;
    font-size: .98rem;
    font-weight: 650;
}
.about-practice em {
    display: block;
    font-style: normal;
    font-size: .8rem;
    color: var(--ccs-muted);
    font-weight: 500;
}
.about-practice:hover em { color: var(--ccs-orange); }

.page-about .post-close {
    background: var(--ccs-cream);
    padding-top: 0;
}
.page-about .site-footer { padding-top: 3rem; }

.home-stage {
    position: relative;
    background:
        radial-gradient(circle at 88% 12%, rgba(241, 90, 36, .32), transparent 34%),
        radial-gradient(circle at 8% 88%, rgba(0, 172, 193, .16), transparent 28%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 48%, #16356f 100%);
    color: #fff;
    padding: 7.84rem 0 6.46rem;
    min-height: 80.67vh;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.home-stage > .container { width: 100%; }
.home-stage::after {
    content: "";
    position: absolute;
    right: -104px;
    top: -104px;
    width: 438px;
    height: 438px;
    border: 44px solid rgba(241, 90, 36, .12);
    border-radius: 40% 60% 55% 45%;
    transform: rotate(18deg);
}
.home-stage::before {
    content: "";
    position: absolute;
    left: -92px;
    bottom: -116px;
    width: 300px;
    height: 300px;
    border: 34px solid rgba(0, 172, 193, .12);
    border-radius: 48% 52%;
}
.home-stage h1 {
    font-weight: 800;
    font-size: clamp(2.54rem, 5.76vw, 4.61rem);
    line-height: 1.12;
    max-width: 14ch;
}
.home-stage .lead {
    max-width: 41.49rem;
    font-size: 1.44rem;
    color: rgba(255,255,255,.82);
    margin: 1.16rem 0 0;
}
.hero-rise {
    opacity: 0;
    animation: heroRise .75s cubic-bezier(.22, 1, .36, 1) forwards;
    animation-delay: var(--d, 0s);
}
.hero-title .hero-word {
    display: inline-block;
    opacity: 0;
    transform: translateY(.55em);
    animation: heroWord .7s cubic-bezier(.22, 1, .36, 1) forwards;
    animation-delay: calc(.1s + (var(--i, 0) * .08s));
    margin-right: .28em;
}
.hero-title .hero-word:last-child { margin-right: 0; }
.hero-swap-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .45rem .65rem;
    margin: 1.05rem 0 0;
    min-height: 2.1em;
}
.hero-swap-prefix {
    font-size: 1.05rem;
    font-weight: 500;
    color: rgba(255,255,255,.62);
    letter-spacing: .04em;
}
.hero-swap-frame {
    display: grid;
    align-items: center;
    min-height: 1.35em;
}
.hero-swap-item {
    grid-area: 1 / 1;
    font-family: var(--ccs-font-display);
    font-weight: 700;
    font-size: clamp(1.35rem, 2.8vw, 2.05rem);
    line-height: 1.2;
    color: var(--ccs-orange);
    opacity: 0;
    transform: translateY(55%);
    transition: opacity .45s ease, transform .45s cubic-bezier(.22, 1, .36, 1);
    pointer-events: none;
}
.hero-swap-item.is-active {
    opacity: 1;
    transform: none;
    pointer-events: auto;
}
@keyframes heroRise {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: none; }
}
@keyframes heroWord {
    from { opacity: 0; transform: translateY(.55em); }
    to { opacity: 1; transform: none; }
}
@keyframes heroCardIn {
    from { opacity: 0; transform: translateX(28px); }
    to { opacity: 1; transform: none; }
}
.home-hours {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .55rem;
    margin-top: 1.5rem;
    font-size: .9rem;
    color: rgba(255,255,255,.7);
}
.home-hours .dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--ccs-orange);
}
.home-hero-card {
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 24px;
    padding: 1.25rem 1.3rem 1.1rem;
    position: relative;
    z-index: 1;
    animation: heroCardIn .85s cubic-bezier(.22, 1, .36, 1) .15s both;
}
.home-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .6rem;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255,255,255,.12);
}
.home-hero-stats strong {
    display: block;
    font-size: 1.45rem;
    color: var(--ccs-orange);
    line-height: 1.1;
}
.home-hero-stats span {
    font-size: .75rem;
    color: rgba(255,255,255,.7);
}
.home-stage-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    position: relative;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.home-stage-actions .btn i {
    font-size: .95rem;
    position: relative;
    z-index: 1;
    transition: transform .25s ease;
}
.home-stage-actions .btn:hover {
    transform: translateY(-3px);
}
.home-stage-actions .btn:active {
    transform: translateY(-1px);
}
.home-stage-actions .btn-orange:hover {
    box-shadow: 0 16px 30px rgba(241, 90, 36, .42);
}
.home-stage-actions .btn-orange:hover i {
    transform: translateX(5px);
}
.home-stage-actions .btn-orange::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 25%, rgba(255,255,255,.3) 50%, transparent 75%);
    transform: translateX(-130%);
    pointer-events: none;
}
.home-stage-actions .btn-orange:hover::after {
    animation: homeCtaShine .65s ease;
}
.home-stage-actions .btn-ghost:hover {
    box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
}

.home-lanes {
    list-style: none;
    margin: 0;
    padding: 0;
}
.home-lanes li + li {
    border-top: 1px solid rgba(255,255,255,.08);
}
.home-lanes li {
    opacity: 0;
    animation: homeLaneIn .55s cubic-bezier(.22, 1, .36, 1) forwards;
}
.home-lanes li:nth-child(1) { animation-delay: .08s; }
.home-lanes li:nth-child(2) { animation-delay: .14s; }
.home-lanes li:nth-child(3) { animation-delay: .2s; }
.home-lanes li:nth-child(4) { animation-delay: .26s; }
.home-lanes li:nth-child(5) { animation-delay: .32s; }
.home-lanes li:nth-child(6) { animation-delay: .38s; }
.home-lanes li:nth-child(7) { animation-delay: .44s; }
.home-lanes li:nth-child(n+8) { animation-delay: .5s; }
.home-lanes a {
    display: grid;
    grid-template-columns: 2.1rem 1fr auto;
    align-items: center;
    gap: .55rem;
    color: #fff !important;
    padding: .5rem .6rem;
    margin: .12rem -.35rem;
    border-radius: 12px;
    font-size: .95rem;
    position: relative;
    overflow: hidden;
    transition: background .25s ease, transform .25s ease, box-shadow .25s ease;
}
.home-lanes a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;
    width: 3px;
    border-radius: 99px;
    background: var(--ccs-orange);
    transform: scaleY(0);
    transform-origin: center;
    transition: transform .28s ease;
}
.home-lanes a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(241, 90, 36, .16), transparent 55%);
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
}
.home-lanes a:hover,
.home-lanes a:focus-visible {
    background: rgba(255,255,255,.08);
    transform: translateX(6px);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
    outline: 0;
}
.home-lanes a:hover::before,
.home-lanes a:focus-visible::before {
    transform: scaleY(1);
}
.home-lanes a:hover::after,
.home-lanes a:focus-visible::after {
    opacity: 1;
}
.home-lanes .n {
    font-size: .72rem;
    letter-spacing: .08em;
    font-weight: 700;
    color: var(--ccs-orange);
    position: relative;
    z-index: 1;
    transition: transform .25s ease;
}
.home-lanes strong {
    font-weight: 600;
    font-size: .92rem;
    position: relative;
    z-index: 1;
    transition: color .25s ease;
}
.home-lanes i {
    opacity: .45;
    font-size: .85rem;
    position: relative;
    z-index: 1;
    transition: transform .25s ease, opacity .25s ease, color .25s ease;
}
.home-lanes a:hover .n,
.home-lanes a:focus-visible .n {
    transform: translateX(2px);
}
.home-lanes a:hover strong,
.home-lanes a:focus-visible strong {
    color: #fff;
}
.home-lanes a:hover i,
.home-lanes a:focus-visible i {
    opacity: 1;
    transform: translateX(6px);
    color: var(--ccs-orange);
}

@keyframes homeLaneIn {
    from { opacity: 0; transform: translateX(-14px); }
    to { opacity: 1; transform: none; }
}
@keyframes homeCtaShine {
    from { transform: translateX(-130%); }
    to { transform: translateX(130%); }
}

html[data-theme="dark"] .ccs-search-kbd {
    background: var(--ccs-input-bg);
    border-color: var(--ccs-border);
    color: var(--ccs-muted);
}
html[data-theme="dark"] .ccs-search-form {
    border-bottom-color: var(--ccs-border);
}
html[data-theme="dark"] .ccs-hit-media { background: #10192c; }

@media (prefers-reduced-motion: reduce) {
    .ccs-search-panel { animation: none; }
    .ccs-hit { transition: none; }
}

@media (prefers-reduced-motion: reduce) {
    .home-lanes li {
        animation: none;
        opacity: 1;
    }
    .hero-rise,
    .hero-title .hero-word,
    .home-hero-card {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
    .hero-swap-item {
        transition: none;
    }
    .hero-swap-item:not(.is-active) { display: none; }
    .hero-swap-item.is-active {
        opacity: 1;
        transform: none;
    }
    .navbar-ccs .navbar-nav .nav-item {
        animation: none;
        opacity: 1;
        transform: none;
    }
    .navbar-ccs .nav-link > i:first-child,
    .navbar-ccs .nav-caret,
    .navbar-ccs .nav-link::before,
    .dropdown-item,
    .dropdown-item i,
    .navbar-ccs .btn-quote-nav,
    .navbar-ccs .btn-quote-nav i,
    .navbar-ccs .btn-quote-nav::after {
        animation: none !important;
        transition: none;
        transform: none !important;
    }
    .home-lanes a,
    .home-lanes a::before,
    .home-lanes a::after,
    .home-lanes i,
    .home-lanes .n,
    .home-stage-actions .btn,
    .home-stage-actions .btn i,
    .home-stage-actions .btn-orange::after {
        animation: none !important;
        transition: none !important;
    }
    .home-lanes a:hover,
    .home-lanes a:focus-visible,
    .home-stage-actions .btn:hover,
    .home-stage-actions .btn:active {
        transform: none;
    }
}

.home-dock { margin-bottom: 0; }

.home-practices h2,
.home-method h2,
.home-work h2,
.home-journal h2 {
    font-weight: 750;
    letter-spacing: -.02em;
    color: var(--ccs-navy);
}

.home-intro { padding: 4.6rem 0 4.4rem; }
.home-intro h2 {
    font-weight: 750;
    color: var(--ccs-navy);
    letter-spacing: -.02em;
    max-width: 18ch;
}
.home-intro p { color: #2c3342; font-size: 1.05rem; }
.home-intro-lead {
    color: var(--ccs-muted) !important;
    font-size: 1.1rem !important;
    margin-top: 1.1rem;
}
.home-intro-panel {
    background: var(--ccs-navy);
    color: #fff;
    border-radius: 24px;
    padding: 1.8rem 1.7rem;
    position: relative;
    overflow: hidden;
    box-shadow: var(--ccs-shadow);
}
.home-intro-panel::after {
    content: "";
    position: absolute;
    right: -36px;
    bottom: -46px;
    width: 170px;
    height: 170px;
    background: var(--ccs-orange);
    border-radius: 42% 58%;
    opacity: .88;
    pointer-events: none;
}
.home-intro-quote {
    font-size: 1.12rem !important;
    line-height: 1.55;
    color: #fff !important;
    position: relative;
    z-index: 1;
    margin-bottom: 1.1rem !important;
}
.home-intro-panel ul {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1;
}
.home-intro-panel li {
    padding: .45rem 0 .45rem 1.35rem;
    position: relative;
    color: rgba(255,255,255,.82);
    font-size: .95rem;
    border-top: 1px solid rgba(255,255,255,.1);
}
.home-intro-panel li:first-child { border-top: 0; }
.home-intro-panel li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .95rem;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ccs-orange);
}

.home-practices {
    background: var(--ccs-cream);
    padding: 4.2rem 0 4.4rem;
}
.home-offer {
    background: #fff;
    border-radius: 22px;
    padding: 1.55rem 1.5rem 1.45rem;
    height: 100%;
    box-shadow: 0 12px 32px rgba(10, 29, 68, .06);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}
.home-offer:hover {
    transform: translateY(-6px);
    box-shadow: var(--ccs-shadow);
}
.home-offer-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}
.home-offer-num {
    font-size: 1.55rem;
    font-weight: 800;
    color: var(--ccs-navy);
    letter-spacing: -.04em;
    opacity: .16;
    line-height: 1;
}
.home-offer .svc-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
}
.home-offer .svc-icon svg {
    width: 22px;
    height: 22px;
}
.home-offer h3 {
    font-size: 1.18rem;
    color: var(--ccs-navy);
    font-weight: 700;
    margin-bottom: .45rem;
}
.home-offer > p {
    color: var(--ccs-muted);
    flex: 1;
    margin-bottom: 1rem;
}
.home-offer .stretched-link {
    color: var(--ccs-navy);
    font-weight: 650;
}
.home-offer .stretched-link:hover { color: var(--ccs-orange); }
.home-offer .ecitizen-note {
    margin-top: auto;
    margin-bottom: .9rem;
}
.home-offer .ecitizen-note p { margin: 0; color: #4a3d36; }

.home-method { padding: 4.4rem 0 4.2rem; }
.home-method .about-step-num { box-shadow: 0 0 0 6px #fff; }

.home-work {
    background: var(--ccs-cream);
    padding: 4.2rem 0 4.4rem;
}
.home-feature {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 0;
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(10, 29, 68, .08);
    margin-bottom: 1.5rem;
    min-height: 340px;
}
.home-feature-media {
    display: block;
    background: var(--ccs-navy);
    overflow: hidden;
}
.home-feature-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 340px;
    display: block;
    transition: transform .45s ease;
}
.home-feature:hover .home-feature-media img { transform: scale(1.04); }
.home-feature-body {
    padding: 2rem 1.8rem;
    display: flex;
    flex-direction: column;
}
.home-feature-body h3 {
    font-size: clamp(1.35rem, 2.2vw, 1.85rem);
    font-weight: 750;
    line-height: 1.25;
    margin: .75rem 0 .4rem;
}
.home-feature-body h3 a { color: var(--ccs-navy); }
.home-feature-body h3 a:hover { color: var(--ccs-orange); }
.home-feature-body > p:not(.meta) {
    color: var(--ccs-muted);
    flex: 1;
}

.home-quotes {
    background:
        radial-gradient(circle at 90% 10%, rgba(241, 90, 36, .22), transparent 36%),
        var(--ccs-navy);
    color: #fff;
    padding: 4.4rem 0 4.5rem;
}
.home-quotes h2 { color: #fff; }
.home-quote {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 22px;
    padding: 1.6rem 1.5rem 1.45rem;
    height: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    backdrop-filter: blur(8px);
}
.home-quote-mark {
    font-size: 3.2rem;
    line-height: .7;
    color: var(--ccs-orange);
    font-weight: 700;
    margin-bottom: .7rem;
}
.home-quote p {
    color: rgba(255,255,255,.86);
    flex: 1;
    margin-bottom: 1.2rem;
}
.home-quote footer {
    display: flex;
    align-items: center;
    gap: .75rem;
}
.home-quote-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--ccs-orange);
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: .85rem;
    flex-shrink: 0;
    object-fit: cover;
}
img.home-quote-avatar {
    background: transparent;
    padding: 0;
}
.home-quote strong {
    display: block;
    color: #fff;
    font-size: .95rem;
}
.home-quote em {
    display: block;
    font-style: normal;
    font-size: .8rem;
    color: rgba(255,255,255,.62);
}

.home-journal { padding: 4.4rem 0 4.2rem; }

.page-home .post-close { padding-top: 2.2rem; }
.page-home .home-journal + .post-close { padding-top: 0; }
.page-home .site-footer { padding-top: 3rem; }

@media (max-width: 991px) {
    .story-feature { grid-template-columns: 1fr; }
    .story-feature-media img { min-height: 220px; height: 240px; }
    .blog-stage { padding: 5.8rem 0 4.2rem; }
    .post-cover { min-height: auto; padding: 6.5rem 0 4.5rem; }
    .post-dock { grid-template-columns: 1fr; margin-top: -1.6rem; }
    .post-pager-grid { grid-template-columns: 1fr; }
    .post-pager-link.next { margin-left: 0; text-align: left; }
}

@media (max-width: 991px) {
    .about-band { grid-template-columns: 1fr; }
    .navbar-ccs .navbar-brand img {
        max-height: 64px;
        max-width: 118px;
    }
    .hero { min-height: auto; padding: 6.5rem 0 4rem; }
    .contact-stage { padding: 5.8rem 0 5.5rem; }
    .contact-panel-wrap { margin-top: -2.5rem; }
    .contact-form-card { padding: 1.4rem 1.2rem 1.5rem; }
    .map-card { position: relative; left: auto; bottom: auto; width: auto; margin: 1rem; }
    .map-bleed { min-height: 0; }
    .work-stage { padding: 5.8rem 0 4.2rem; }
    .work-toolbar { margin-top: -1.1rem; }
    .filter-bar button { flex: 0 0 auto; }
    .svc-stage,
    .sd-cover {
        --svc-hero-h: 34rem;
        padding: 5.8rem 0 4.2rem;
    }
    .sd-dock { grid-template-columns: 1fr; margin-top: -1.4rem; }
    .sd-aside { position: static; }
    .sd-prose { padding: 1.4rem 1.2rem; }
    .about-stage { padding: 5.8rem 0 4.8rem; }
    .legal-stage,
    .search-stage { padding: 5.8rem 0 4.8rem; }
    .legal-dock { grid-template-columns: 1fr; }
    .legal-dock-wrap { margin-top: -1.6rem; }
    .about-dock { grid-template-columns: 1fr; }
    .about-dock-wrap { margin-top: -1.6rem; }
    .about-beliefs-grid { grid-template-columns: 1fr; }
    .about-steps { grid-template-columns: 1fr 1fr; }
    .about-steps::before { display: none; }
    .about-step-num { box-shadow: none; }
    .home-stage { padding: 6.68rem 0 5.53rem; min-height: auto; }
    .home-feature { grid-template-columns: 1fr; }
    .home-feature-media img { min-height: 220px; height: 240px; }
    .home-feature-body { padding: 1.4rem 1.25rem 1.5rem; }
    .home-method .about-step-num { box-shadow: none; }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 2rem 1.5rem;
    }
    .footer-brand { grid-column: 1 / -1; }
    .footer-cta { margin-bottom: 0; }
    .footer-cta-wrap + .site-footer { padding-top: 3rem; }
}

.legal-stage {
    position: relative;
    background:
        radial-gradient(circle at 12% 20%, rgba(241, 90, 36, .28), transparent 32%),
        radial-gradient(circle at 88% 80%, rgba(0, 172, 193, .14), transparent 28%),
        linear-gradient(135deg, #071428 0%, var(--ccs-navy) 55%, #16356f 100%);
    color: #fff;
    padding: 6.8rem 0 5.8rem;
    overflow: hidden;
}
.legal-stage::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -80px;
    width: 320px;
    height: 320px;
    border: 34px solid rgba(241, 90, 36, .12);
    border-radius: 42% 58%;
}
.legal-stage h1 {
    font-weight: 800;
    font-size: clamp(2.1rem, 4.6vw, 3.6rem);
    line-height: 1.12;
    max-width: 16ch;
}
.legal-stage .lead {
    color: rgba(255,255,255,.8);
    max-width: 38rem;
    margin: .9rem 0 0;
}
.legal-stage-note {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 20px;
    padding: 1.25rem 1.35rem;
    backdrop-filter: blur(10px);
    color: rgba(255,255,255,.86);
}
.legal-stage-note a { color: #fff; font-weight: 650; }
.legal-stage-note a:hover { color: var(--ccs-orange); }

.legal-jump {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}
.legal-jump a {
    display: inline-flex;
    align-items: center;
    padding: .45rem .95rem;
    border-radius: 999px;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.16);
    color: #fff;
    font-weight: 600;
    font-size: .9rem;
}
.legal-jump a:hover {
    background: var(--ccs-orange);
    border-color: var(--ccs-orange);
    color: #fff;
}

.legal-dock-wrap {
    position: relative;
    z-index: 2;
    margin-top: -2.2rem;
}
.legal-dock {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 22px 50px rgba(10, 29, 68, .12);
    padding: 1.15rem 1.4rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.legal-dock-label {
    display: block;
    font-size: .75rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ccs-muted);
    font-weight: 650;
    margin-bottom: .2rem;
}
.legal-dock strong { color: var(--ccs-navy); font-size: 1.05rem; }

.legal-body { padding: 3.4rem 0 1.5rem; }
.legal-body--alt {
    background: var(--ccs-cream);
    padding: 3.6rem 0 3.2rem;
}
.legal-section-title {
    color: var(--ccs-navy);
    font-size: clamp(1.6rem, 2.6vw, 2.15rem);
    line-height: 1.25;
    max-width: 22ch;
}
.legal-lede {
    color: var(--ccs-muted);
    font-size: 1.05rem;
    max-width: 52ch;
    margin-bottom: 1.5rem;
}

.legal-prose {
    background: #fff;
    border-radius: 22px;
    padding: 2rem 2.1rem 2.2rem;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .05);
    font-size: 1.04rem;
    line-height: 1.8;
    color: #2c3342;
}
.legal-prose h2 {
    color: var(--ccs-navy);
    font-size: 1.35rem;
    margin: 1.7rem 0 .7rem;
    scroll-margin-top: 6.5rem;
}
.legal-prose h2:first-child { margin-top: 0; }
.legal-prose p { margin-bottom: 1rem; }
.legal-prose ul {
    margin: 0 0 1.1rem;
    padding-left: 1.15rem;
}
.legal-prose li { margin-bottom: .35rem; }
.legal-prose a { font-weight: 650; }

.faq-list { margin-top: .4rem; }
.faq-item {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(10, 29, 68, .05);
    margin-bottom: .75rem;
    overflow: hidden;
    scroll-margin-top: 6.5rem;
}
.legal-body--alt .faq-item {
    box-shadow: 0 10px 28px rgba(10, 29, 68, .07);
}
.faq-item summary {
    cursor: pointer;
    list-style: none;
    padding: 1.15rem 1.3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: var(--ccs-navy);
    font-family: var(--ccs-font-display);
    font-weight: 700;
    font-size: 1.12rem;
    line-height: 1.35;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
    content: "+";
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--ccs-orange-soft);
    color: var(--ccs-orange);
    display: grid;
    place-items: center;
    font-family: var(--ccs-font);
    font-weight: 700;
    font-size: 1.15rem;
    line-height: 1;
}
.faq-item[open] summary::after {
    content: "–";
    background: var(--ccs-navy);
    color: #fff;
}
.faq-item summary:hover { color: var(--ccs-orange); }
.faq-answer {
    padding: 0 1.3rem 1.2rem;
    color: var(--ccs-muted);
    border-top: 1px solid #efeae3;
}
.faq-answer p:last-child,
.faq-answer ul:last-child { margin-bottom: 0; }
.faq-answer ul { margin: .4rem 0 .85rem; padding-left: 1.15rem; }
.faq-answer a { font-weight: 650; }

.legal-aside { display: grid; gap: 1rem; }
.legal-aside-card {
    background: var(--ccs-cream);
    border-radius: 20px;
    padding: 1.35rem 1.3rem;
}
.legal-body--alt .legal-aside-card { background: #fff; }
.legal-aside-card h2 {
    font-size: .78rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ccs-muted);
    font-family: var(--ccs-font);
    font-weight: 700;
    margin-bottom: .7rem;
}
.legal-aside-card p { color: var(--ccs-muted); }
.legal-aside-links {
    list-style: none;
    margin: 0;
    padding: 0;
}
.legal-aside-links a {
    display: block;
    padding: .38rem 0;
    color: var(--ccs-navy);
    font-weight: 600;
    border-bottom: 1px solid #eee8df;
}
.legal-aside-links li:last-child a { border-bottom: 0; }
.legal-aside-links a:hover { color: var(--ccs-orange); }

.page-legal .post-close { padding-top: 1.5rem; }
.page-faq .legal-body--alt + .post-close {
    background: var(--ccs-cream);
    padding-top: 0;
}
.page-legal .site-footer { padding-top: 3rem; }

#studio,
#ecitizen,
#studio-terms,
#ecitizen-terms {
    scroll-margin-top: 5.5rem;
}

@media (max-width: 575px) {
    .legal-prose { padding: 1.4rem 1.2rem 1.5rem; }
    .faq-item summary { font-size: 1.02rem; padding: 1rem 1.05rem; }
    .faq-answer { padding: 0 1.05rem 1.05rem; }
    .footer-legal { width: 100%; }
    .svc-stage,
    .sd-cover {
        height: auto;
        min-height: 34rem;
    }
}

/* Studio loader */
.ccs-loader {
    --p: 0;
    position: fixed;
    inset: 0;
    z-index: 4000;
    display: grid;
    place-items: center;
    color: #fff;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 50% 42%, rgba(241, 90, 36, .16), transparent 28%),
        radial-gradient(circle at 78% 18%, rgba(0, 172, 193, .14), transparent 24%),
        #071428;
    -webkit-clip-path: circle(150vmax at 50% 50%);
    clip-path: circle(150vmax at 50% 50%);
    transition:
        clip-path .95s cubic-bezier(.76, 0, .24, 1),
        -webkit-clip-path .95s cubic-bezier(.76, 0, .24, 1);
}
.ccs-loader-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(50px);
    pointer-events: none;
    opacity: .55;
}
.ccs-loader-glow--orange {
    width: 280px;
    height: 280px;
    background: #F15A24;
    top: 18%;
    left: 12%;
    animation: ccsLoaderFloat 6s ease-in-out infinite;
}
.ccs-loader-glow--teal {
    width: 240px;
    height: 240px;
    background: #00ACC1;
    right: 10%;
    bottom: 16%;
    animation: ccsLoaderFloat 7.5s ease-in-out infinite reverse;
}
.ccs-loader-skip {
    position: absolute;
    top: 1.2rem;
    right: 1.4rem;
    z-index: 4;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,.55);
    font: inherit;
    font-size: .78rem;
    font-weight: 650;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: .4rem .2rem;
    cursor: pointer;
}
.ccs-loader-skip:hover,
.ccs-loader-skip:focus-visible {
    color: #fff;
    outline: 0;
}

.ccs-loader-core {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 1.2rem;
}
.ccs-loader-orbit {
    position: relative;
    width: 220px;
    height: 220px;
    display: grid;
    place-items: center;
    margin-bottom: 1.5rem;
    animation: ccsLoaderIn .4s cubic-bezier(.22, 1, .36, 1) both;
}
.ccs-loader-orbit-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    animation: ccsLoaderSpin 18s linear infinite;
}
.ccs-loader-orbit-copy {
    fill: rgba(255,255,255,.55);
    font-family: var(--ccs-font);
    font-size: 9.2px;
    font-weight: 700;
    letter-spacing: 2.4px;
}
.ccs-loader-ring {
    position: absolute;
    inset: 28px;
    width: calc(100% - 56px);
    height: calc(100% - 56px);
}
.ccs-loader-ring-track,
.ccs-loader-ring-value {
    fill: none;
    stroke-width: 2.6;
}
.ccs-loader-ring-track { stroke: rgba(255,255,255,.12); }
.ccs-loader-ring-value {
    stroke: var(--ccs-orange);
    stroke-linecap: round;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
    transition: stroke-dashoffset .12s linear;
}
.ccs-loader-dots {
    position: absolute;
    inset: 18px;
    animation: ccsLoaderSpin 5.5s linear infinite;
}
.ccs-loader-dots span {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    box-shadow: 0 0 10px currentColor;
}
.ccs-loader-dots span:nth-child(1) {
    top: 0;
    left: 50%;
    background: var(--ccs-orange);
    color: var(--ccs-orange);
    transform: translateX(-50%);
}
.ccs-loader-dots span:nth-child(2) {
    right: 6%;
    bottom: 18%;
    background: #00ACC1;
    color: #00ACC1;
}
.ccs-loader-dots span:nth-child(3) {
    left: 6%;
    bottom: 18%;
    background: #fff;
    color: #fff;
    width: 6px;
    height: 6px;
}
.ccs-loader-logo {
    width: 108px;
    height: 108px;
    border-radius: 50%;
    background: #fff;
    display: grid;
    place-items: center;
    padding: .8rem;
    overflow: hidden;
    z-index: 1;
    box-shadow:
        0 0 0 10px rgba(255,255,255,.04),
        0 18px 40px rgba(0, 0, 0, .35);
}
.ccs-loader-logo img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 66px;
    object-fit: contain;
    display: block;
}
.ccs-loader-tag {
    margin: 0;
    max-width: 16ch;
    font-family: var(--ccs-font-display);
    font-size: clamp(1.45rem, 3.4vw, 2rem);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.03em;
}
.ccs-loader-status {
    margin: .55rem 0 0;
    font-size: .78rem;
    font-weight: 650;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(255,255,255,.5);
}

.ccs-loader-foot {
    position: absolute;
    left: 1.5rem;
    right: 1.5rem;
    bottom: 1.35rem;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.ccs-loader-count {
    font-family: var(--ccs-font-display);
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.04em;
    font-variant-numeric: tabular-nums;
    min-width: 2.2ch;
}
.ccs-loader-progress {
    flex: 1;
    height: 2px;
    border-radius: 99px;
    background: rgba(255,255,255,.12);
    overflow: hidden;
}
.ccs-loader-progress span {
    display: block;
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--ccs-orange), #00ACC1);
}

.ccs-loader.is-leaving {
    pointer-events: none;
    -webkit-clip-path: circle(0vmax at 50% 50%);
    clip-path: circle(0vmax at 50% 50%);
}
.ccs-loader.is-leaving .ccs-loader-core,
.ccs-loader.is-leaving .ccs-loader-foot,
.ccs-loader.is-leaving .ccs-loader-skip {
    opacity: 0;
    transform: scale(.82);
    transition: opacity .28s ease, transform .45s cubic-bezier(.76, 0, .24, 1);
}
.ccs-loader.is-leaving .ccs-loader-glow {
    opacity: 0;
    transition: opacity .3s ease;
}

html.ccs-booting:not(.ccs-ready) body > *:not(.ccs-loader) {
    opacity: 0;
}
html.ccs-ready body > *:not(.ccs-loader) {
    opacity: 1;
}
html.ccs-booting:not(.ccs-ready) .hero-rise,
html.ccs-booting:not(.ccs-ready) .hero-title .hero-word,
html.ccs-booting:not(.ccs-ready) .home-hero-card,
html.ccs-booting:not(.ccs-ready) .home-lanes li,
html.ccs-booting:not(.ccs-ready) .navbar-ccs .navbar-nav .nav-item {
    animation: none !important;
    opacity: 0 !important;
}

@keyframes ccsLoaderIn {
    from { opacity: 0; transform: scale(.86); }
    to { opacity: 1; transform: none; }
}
@keyframes ccsLoaderSpin {
    to { transform: rotate(360deg); }
}
@keyframes ccsLoaderFloat {
    0%, 100% { transform: translate(0, 0); }
    50% { transform: translate(18px, -22px); }
}

@media (max-width: 767px) {
    .ccs-loader-orbit { width: 188px; height: 188px; }
    .ccs-loader-logo { width: 96px; height: 96px; }
    .ccs-loader-foot { left: 1.1rem; right: 1.1rem; }
    .ccs-loader-glow--orange { width: 180px; height: 180px; }
    .ccs-loader-glow--teal { width: 160px; height: 160px; }
}
@media (prefers-reduced-motion: reduce) {
    .ccs-loader,
    .ccs-loader-orbit,
    .ccs-loader-orbit-svg,
    .ccs-loader-dots,
    .ccs-loader-glow { animation: none !important; transition: none !important; }
    html.ccs-booting:not(.ccs-ready) body > *:not(.ccs-loader),
    html.ccs-ready body > *:not(.ccs-loader) {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* Floating dock */
html.ccs-booting:not(.ccs-ready) .site-dock {
    visibility: hidden;
    pointer-events: none;
}
.site-dock {
    position: fixed;
    right: max(1.15rem, env(safe-area-inset-right));
    bottom: max(1.15rem, env(safe-area-inset-bottom));
    z-index: 1030;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .7rem;
    pointer-events: none;
}
.site-dock > * { pointer-events: auto; }
.site-dock-btns {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.site-dock-btn {
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    cursor: pointer;
    box-shadow: 0 12px 28px rgba(10, 29, 68, .22);
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.site-dock-btn i { font-size: 1.35rem; line-height: 1; }
.site-dock-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px rgba(10, 29, 68, .28);
}
.site-dock-btn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}
.site-dock-top {
    position: absolute;
    right: 0;
    bottom: calc(100% + .55rem);
    background: var(--ccs-orange);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    pointer-events: none;
}
.site-dock-top:hover {
    background: var(--ccs-orange-dark);
}
.site-dock-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
}
.site-dock-chat {
    position: relative;
    width: auto;
    min-width: 56px;
    padding: 0 .95rem 0 .2rem;
    border-radius: 999px;
    grid-template-columns: 52px auto;
    background: #1fad5a;
    box-shadow: 0 12px 28px rgba(18, 140, 64, .32);
}
.site-dock-chat i {
    width: 52px;
    display: grid;
    place-items: center;
}
.site-dock-label {
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .04em;
    padding-right: .35rem;
}
.site-dock-chat::after {
    content: "";
    position: absolute;
    inset: -5px;
    border-radius: inherit;
    border: 2px solid rgba(31, 173, 90, .55);
    animation: siteDockPulse 2.4s ease-out infinite;
    pointer-events: none;
}
.site-dock-chat.is-open {
    width: 56px;
    padding: 0;
    grid-template-columns: 1fr;
    background: var(--ccs-navy);
    box-shadow: 0 12px 28px rgba(10, 29, 68, .22);
}
.site-dock-chat.is-open .site-dock-label,
.site-dock-chat.is-open::after { display: none; }

.site-chat[hidden] { display: none !important; }
.site-chat {
    width: min(22.5rem, calc(100vw - 2.3rem));
    background: #fff;
    color: var(--ccs-text);
    border-radius: 22px;
    box-shadow: 0 22px 50px rgba(10, 29, 68, .18);
    overflow: hidden;
    transform-origin: 100% 100%;
    animation: siteChatIn .28s cubic-bezier(.22, 1, .36, 1);
}
.site-chat-head {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .95rem 1rem .9rem 1.05rem;
    background: var(--ccs-navy);
    color: #fff;
}
.site-chat-head img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: contain;
    background: #fff;
    padding: .25rem;
    flex-shrink: 0;
}
.site-chat-head strong {
    display: block;
    font-size: .92rem;
    line-height: 1.25;
}
.site-chat-head span {
    display: block;
    font-size: .72rem;
    color: rgba(255,255,255,.65);
}
.site-chat-close {
    margin-left: auto;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.1);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
}
.site-chat-close:hover { background: rgba(255,255,255,.18); }
.site-chat-body {
    padding: 1rem 1.05rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}
.site-chat-body > p {
    margin: 0 0 .35rem;
    color: var(--ccs-muted);
    font-size: .92rem;
    line-height: 1.5;
}
.site-chat-action {
    display: flex;
    align-items: center;
    gap: .7rem;
    width: 100%;
    border: 1px solid rgba(10, 29, 68, .08);
    background: #f7f6f2;
    color: var(--ccs-navy);
    border-radius: 14px;
    padding: .72rem .85rem;
    font: inherit;
    font-weight: 650;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background .18s ease, transform .18s ease, color .18s ease;
}
.site-chat-action i {
    width: 1.2rem;
    text-align: center;
    color: var(--ccs-orange);
}
.site-chat-action:hover {
    background: var(--ccs-orange-soft);
    color: var(--ccs-navy);
    transform: translateY(-1px);
}
.site-chat-action--wa {
    background: #1fad5a;
    border-color: transparent;
    color: #fff;
}
.site-chat-action--wa i { color: #fff; }
.site-chat-action--wa:hover {
    background: #18964c;
    color: #fff;
}

@keyframes siteChatIn {
    from { opacity: 0; transform: translateY(12px) scale(.96); }
    to { opacity: 1; transform: none; }
}
@keyframes siteDockPulse {
    0% { transform: scale(1); opacity: .7; }
    100% { transform: scale(1.18); opacity: 0; }
}

@media (max-width: 575px) {
    .site-dock { right: .85rem; bottom: .85rem; }
    .site-dock-label { display: none; }
    .site-dock-chat {
        width: 56px;
        padding: 0;
        grid-template-columns: 1fr;
    }
}
@media (prefers-reduced-motion: reduce) {
    .site-chat,
    .site-dock-btn,
    .site-dock-top,
    .site-dock-chat::after { animation: none !important; transition: none !important; }
}

.skip-link {
    position: absolute;
    left: .85rem;
    top: -4rem;
    z-index: 5000;
    background: var(--ccs-orange);
    color: #fff;
    padding: .55rem 1rem;
    border-radius: 999px;
    font-weight: 600;
    font-size: .9rem;
}
.skip-link:focus,
.skip-link:focus-visible {
    top: .85rem;
    color: #fff;
    outline: 2px solid #fff;
    outline-offset: 2px;
}
.ccs-hp {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.ccs-consent {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3600;
    background: var(--ccs-navy);
    color: #fff;
    border-top: 3px solid var(--ccs-orange);
    padding: 1rem 0 calc(1rem + env(safe-area-inset-bottom));
    transform: translateY(110%);
    visibility: hidden;
    pointer-events: none;
    transition: transform .35s ease, visibility .35s;
}
.ccs-consent.is-open {
    transform: none;
    visibility: visible;
    pointer-events: auto;
}
.ccs-consent a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.ccs-consent-inner {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    display: flex;
    gap: 1.25rem 1.75rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.ccs-consent-kicker {
    font-size: .72rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ccs-orange);
    font-weight: 700;
    margin: 0 0 .25rem;
    font-family: var(--ccs-font);
}
.ccs-consent-copy p:last-child {
    margin: 0;
    font-size: .92rem;
    line-height: 1.5;
    max-width: 46rem;
    color: rgba(255,255,255,.88);
}
.ccs-consent-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.ccs-consent .btn { white-space: nowrap; }
body.ccs-consent-open .site-dock {
    bottom: calc(var(--ccs-consent-h, 7.5rem) + 1rem);
}
@media print {
    .ccs-consent { display: none !important; }
}
@media (max-width: 767px) {
    .ccs-consent-inner { align-items: stretch; }
    .ccs-consent-actions { width: 100%; }
    .ccs-consent-actions .btn { flex: 1; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
    .ccs-consent { transition: none; }
}

html[data-theme="dark"] {
    color-scheme: dark;
    --ccs-cream: #10192c;
    --ccs-text: #e7eef8;
    --ccs-muted: #9aa8bf;
    --ccs-bg: #0a1220;
    --ccs-surface: #152238;
    --ccs-heading: #eef3fb;
    --ccs-border: rgba(232, 237, 247, .12);
    --ccs-input-bg: #10192c;
    --ccs-input-border: rgba(232, 237, 247, .16);
    --ccs-orange-soft: rgba(241, 90, 36, .18);
    --ccs-shadow: 0 18px 50px rgba(0, 0, 0, .45);
}
html[data-theme="dark"] body {
    background: var(--ccs-bg);
    color: var(--ccs-text);
}
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .h1,
html[data-theme="dark"] .h2,
html[data-theme="dark"] .h3,
html[data-theme="dark"] .h4,
html[data-theme="dark"] .h5,
html[data-theme="dark"] .h6 {
    color: var(--ccs-heading);
}
html[data-theme="dark"] .navbar-ccs {
    background: var(--ccs-surface);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .28);
    border-bottom: 1px solid var(--ccs-border);
}
html[data-theme="dark"] .navbar-ccs .nav-link {
    color: var(--ccs-heading) !important;
}
html[data-theme="dark"] .navbar-ccs .navbar-brand img,
html[data-theme="dark"] .navbar-ccs .navbar-toggler {
    background: #fff;
    border-radius: 10px;
}
html[data-theme="dark"] .navbar-ccs .navbar-brand img {
    padding: .2rem .35rem;
}
html[data-theme="dark"] .navbar-ccs .navbar-toggler {
    border-color: rgba(255,255,255,.2);
    padding: .35rem .5rem;
}
html[data-theme="dark"] .ccs-scroll-line {
    background: rgba(255, 255, 255, .1);
}
html[data-theme="dark"] .ccs-fx-nav {
    border-color: rgba(255, 255, 255, .16);
    background: transparent;
}
html[data-theme="dark"] .ccs-fx-nav .ccs-fx-opt {
    color: var(--ccs-heading) !important;
}
html[data-theme="dark"] .ccs-theme-toggle,
html[data-theme="dark"] .ccs-search-toggle {
    border-color: rgba(255, 255, 255, .16);
    color: var(--ccs-heading);
}
html[data-theme="dark"] .ccs-theme-toggle:hover,
html[data-theme="dark"] .ccs-search-toggle:hover,
html[data-theme="dark"] .ccs-search-toggle:focus-visible,
html[data-theme="dark"] .ccs-search-toggle[aria-expanded="true"] {
    background: rgba(241, 90, 36, .16);
    color: #fff;
}
html[data-theme="dark"] .dropdown-menu {
    background: var(--ccs-surface);
    border: 1px solid var(--ccs-border);
    box-shadow: var(--ccs-shadow);
}
html[data-theme="dark"] .dropdown-item,
html[data-theme="dark"] .dropdown-item i {
    color: var(--ccs-heading);
}
html[data-theme="dark"] .dropdown-item:hover {
    background: var(--ccs-orange-soft);
}
html[data-theme="dark"] .section-cream,
html[data-theme="dark"] .legal-dock-wrap {
    background: transparent;
}
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .offer-card,
html[data-theme="dark"] .blog-card,
html[data-theme="dark"] .work-card,
html[data-theme="dark"] .team-card,
html[data-theme="dark"] .contact-form-card,
html[data-theme="dark"] .legal-dock,
html[data-theme="dark"] .sd-aside-card,
html[data-theme="dark"] .sd-dock,
html[data-theme="dark"] .about-dock,
html[data-theme="dark"] .quote-modal,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .faq-item,
html[data-theme="dark"] details.faq-item,
html[data-theme="dark"] .legal-card,
html[data-theme="dark"] .legal-prose,
html[data-theme="dark"] .legal-aside-card,
html[data-theme="dark"] .prose,
html[data-theme="dark"] .sd-prose,
html[data-theme="dark"] .testimonial,
html[data-theme="dark"] .content-card,
html[data-theme="dark"] .work-toolbar,
html[data-theme="dark"] .work-empty,
html[data-theme="dark"] .project-modal,
html[data-theme="dark"] .contact-visit,
html[data-theme="dark"] .map-card,
html[data-theme="dark"] .story-feature,
html[data-theme="dark"] .story-card,
html[data-theme="dark"] .ccs-hit,
html[data-theme="dark"] .ccs-search-panel,
html[data-theme="dark"] .blog-empty,
html[data-theme="dark"] .about-belief--light,
html[data-theme="dark"] .about-person,
html[data-theme="dark"] .home-offer,
html[data-theme="dark"] .home-feature,
html[data-theme="dark"] .home-intro,
html[data-theme="dark"] .quote-success,
html[data-theme="dark"] .filter-bar button,
html[data-theme="dark"] .svc-method,
html[data-theme="dark"] .work-step,
html[data-theme="dark"] .sd-cover-card {
    background: var(--ccs-surface);
    color: var(--ccs-text);
    border-color: var(--ccs-border);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
}
html[data-theme="dark"] .home-hero-card {
    background: rgba(255,255,255,.08);
    color: #fff;
    border-color: rgba(255,255,255,.12);
    box-shadow: none;
}
html[data-theme="dark"] .hero h1,
html[data-theme="dark"] .search-stage h1,
html[data-theme="dark"] .legal-stage h1,
html[data-theme="dark"] .quote-modal-head h2,
html[data-theme="dark"] .site-footer h5,
html[data-theme="dark"] .section-navy h2 {
    color: #fff;
}
html[data-theme="dark"] .service-card .stretched-link,
html[data-theme="dark"] .offer-card h2,
html[data-theme="dark"] .blog-card h3,
html[data-theme="dark"] .work-card h3,
html[data-theme="dark"] .work-card .body h3 a,
html[data-theme="dark"] .sd-work .work-card h3 a,
html[data-theme="dark"] .sd-aside-card h2,
html[data-theme="dark"] .sd-dock strong,
html[data-theme="dark"] .prose h4,
html[data-theme="dark"] .legal-prose,
html[data-theme="dark"] .legal-prose h2,
html[data-theme="dark"] .sd-prose,
html[data-theme="dark"] .sd-prose h3,
html[data-theme="dark"] .testimonial .who,
html[data-theme="dark"] .contact-aside h2,
html[data-theme="dark"] .contact-steps strong,
html[data-theme="dark"] .quote-success h3,
html[data-theme="dark"] .story-feature-body h2 a,
html[data-theme="dark"] .story-more,
html[data-theme="dark"] .about-belief--light h2,
html[data-theme="dark"] .svc-step h3,
html[data-theme="dark"] .filter-bar button,
html[data-theme="dark"] .project-modal-copy h2,
html[data-theme="dark"] .ccs-hit h2,
html[data-theme="dark"] .ccs-hit h3,
html[data-theme="dark"] .ccs-hit-head h2,
html[data-theme="dark"] .project-modal-meta strong {
    color: var(--ccs-heading);
}
html[data-theme="dark"] .page-article { background: var(--ccs-bg); }
html[data-theme="dark"] .faq-answer { border-top-color: var(--ccs-border); }
html[data-theme="dark"] .svc-method {
    box-shadow: none;
    border-radius: 0;
}
html[data-theme="dark"] .about-belief--navy h2 { color: #fff; }
html[data-theme="dark"] .btn-ghost {
    color: #fff !important;
    border-color: rgba(255, 255, 255, .28);
}
html[data-theme="dark"] .btn-ghost:hover {
    background: rgba(255, 255, 255, .1);
    color: #fff !important;
}
html[data-theme="dark"] .ccs-input input,
html[data-theme="dark"] .ccs-input select,
html[data-theme="dark"] .ccs-input textarea,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .quote-modal-body input,
html[data-theme="dark"] .quote-modal-body select,
html[data-theme="dark"] .quote-modal-body textarea {
    background-color: var(--ccs-input-bg);
    border-color: var(--ccs-input-border);
    color: var(--ccs-text);
}
html[data-theme="dark"] .ccs-input input:focus,
html[data-theme="dark"] .ccs-input select:focus,
html[data-theme="dark"] .ccs-input textarea:focus,
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    background-color: var(--ccs-input-bg);
    border-color: var(--ccs-orange);
    color: var(--ccs-text);
    box-shadow: 0 0 0 .2rem rgba(241, 90, 36, .2);
}
html[data-theme="dark"] .table {
    color: var(--ccs-text);
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(255, 255, 255, .04);
    --bs-table-hover-bg: rgba(255, 255, 255, .06);
    --bs-table-border-color: var(--ccs-border);
}
html[data-theme="dark"] .breadcrumb {
    --bs-breadcrumb-divider-color: var(--ccs-muted);
}
html[data-theme="dark"] .breadcrumb-item a { color: var(--ccs-muted); }
html[data-theme="dark"] .breadcrumb-item.active { color: var(--ccs-heading); }
html[data-theme="dark"] .contact-success {
    background: rgba(27, 122, 69, .16);
    border-color: rgba(27, 122, 69, .35);
    color: #d4f0e0;
}
html[data-theme="dark"] .service-card .ecitizen-note,
html[data-theme="dark"] .offer-card .ecitizen-note,
html[data-theme="dark"] .ecitizen-disclaimer {
    background: rgba(241, 90, 36, .12);
    color: #f3d9cf;
}
html[data-theme="dark"] .service-card .ecitizen-note p,
html[data-theme="dark"] .ecitizen-disclaimer p {
    color: #f3d9cf;
}
html[data-theme="dark"] .legal-dock strong,
html[data-theme="dark"] .sd-dock strong,
html[data-theme="dark"] .about-dock strong {
    color: var(--ccs-heading);
}
html[data-theme="dark"] .faq-item summary,
html[data-theme="dark"] details summary {
    color: var(--ccs-heading);
}
html[data-theme="dark"] .faq-answer,
html[data-theme="dark"] .legal-copy,
html[data-theme="dark"] .legal-copy p,
html[data-theme="dark"] .sd-prose,
html[data-theme="dark"] .sd-prose p {
    color: var(--ccs-muted);
}
html[data-theme="dark"] hr,
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] .border-bottom {
    border-color: var(--ccs-border) !important;
}
html[data-theme="dark"] .text-muted { color: var(--ccs-muted) !important; }
html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .bg-white {
    background-color: var(--ccs-surface) !important;
    color: var(--ccs-text);
}
html[data-theme="dark"] .page-link {
    background-color: var(--ccs-surface);
    border-color: var(--ccs-border);
    color: var(--ccs-heading);
}
html[data-theme="dark"] .page-item.active .page-link {
    background-color: var(--ccs-navy);
    border-color: var(--ccs-navy);
}
html[data-theme="dark"] .alert-success {
    background: rgba(27, 122, 69, .18);
    border-color: rgba(27, 122, 69, .35);
    color: #d4f0e0;
}
html[data-theme="dark"] .alert-danger {
    background: rgba(192, 57, 43, .18);
    border-color: rgba(192, 57, 43, .35);
    color: #f8d0cc;
}
html[data-theme="dark"] .chip {
    background: var(--ccs-surface);
    color: var(--ccs-heading);
    border-color: var(--ccs-border);
}
@media print {
    html[data-theme="dark"] {
        color-scheme: light;
        --ccs-bg: #fff;
        --ccs-surface: #fff;
        --ccs-text: #1c2434;
        --ccs-heading: #0A1D44;
    }
}