/**
 * Capnis homepage — best-of-breed section redesign (light + dark tokens).
 * Scoped via body.capnis-home-page
 */

body.capnis-home-page #smooth-wrapper,
body.capnis-home-page #smooth-content {
    background-color: var(--capnis-surface-2);
}

body.capnis-home-page .capnis-home-page__deck {
    position: relative;
    overflow: hidden;
    color: var(--capnis-ink);
}

body:has(#capnis-home-thumb-hero) #header-sticky {
    z-index: 100;
}

body:has(#capnis-home-thumb-hero) #capnis-home-thumb-hero .slider-nav {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 80 !important;
}

html.capnis-dark body.capnis-home-page:has(#capnis-home-thumb-hero) #header-sticky.header-sticky {
    background-color: color-mix(in srgb, var(--capnis-surface-2) 92%, transparent) !important;
    border-color: var(--capnis-border) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* ------------------------------------------------------------------ */
/* Section surfaces — alternating bands via tokens only               */
/* ------------------------------------------------------------------ */

html.capnis-light body.capnis-home-page .crp-success-area.capnis-home-why-capnis,
html.capnis-light body.capnis-home-page .tp-work-area,
html.capnis-light body.capnis-home-page .creative-project-area,
html.capnis-light body.capnis-home-page .tp-testimonial-area {
    background-color: var(--capnis-surface);
}

html.capnis-light body.capnis-home-page .tp-service-area.capnis-home-services,
html.capnis-light body.capnis-home-page .creative-service-area,
html.capnis-light body.capnis-home-page .crp-project-area,
html.capnis-light body.capnis-home-page .app-stack-area,
html.capnis-light body.capnis-home-page .des-brand-area {
    background-color: var(--capnis-surface-2);
}

html.capnis-dark body.capnis-home-page #smooth-wrapper,
html.capnis-dark body.capnis-home-page #smooth-content {
    background-color: var(--capnis-surface);
}

html.capnis-dark body.capnis-home-page .crp-success-area.capnis-home-why-capnis,
html.capnis-dark body.capnis-home-page .tp-work-area,
html.capnis-dark body.capnis-home-page .creative-project-area,
html.capnis-dark body.capnis-home-page .tp-testimonial-area {
    background-color: var(--capnis-surface);
}

html.capnis-dark body.capnis-home-page .tp-service-area.capnis-home-services,
html.capnis-dark body.capnis-home-page .creative-service-area,
html.capnis-dark body.capnis-home-page .crp-project-area,
html.capnis-dark body.capnis-home-page .app-stack-area,
html.capnis-dark body.capnis-home-page .des-brand-area {
    background-color: var(--capnis-surface-2);
}

/* ------------------------------------------------------------------ */
/* Shared typography                                                  */
/* ------------------------------------------------------------------ */

body.capnis-home-page .tp-section-title,
body.capnis-home-page .tp-section-title-phudu,
body.capnis-home-page .tp-section-title-grotesk,
body.capnis-home-page .tp-section-title-platform,
body.capnis-home-page .tp-section-title-dirtyline,
body.capnis-home-page .tp-section-title-teko,
body.capnis-home-page .tp-section-title-mango,
body.capnis-home-page .tp-work-title,
body.capnis-home-page .crp-project-title-sm,
body.capnis-home-page .crp-project-title-sm a,
body.capnis-home-page .creative-service-title,
body.capnis-home-page .creative-service-title a,
body.capnis-home-page .creative-project-title-sm,
body.capnis-home-page .creative-project-title-sm a,
body.capnis-home-page .app-stack-title,
body.capnis-home-page .capnis-home-tile-title {
    color: var(--capnis-ink);
}

body.capnis-home-page .tp-section-subtitle,
body.capnis-home-page .tp-section-subtitle.pre,
body.capnis-home-page .tp-section-subtitle.subtitle-grey,
body.capnis-home-page .tp-section-subtitle.pre-circle,
body.capnis-home-page .tp-work-content p,
body.capnis-home-page .creative-service-excerpt,
body.capnis-home-page .crp-project-category span,
body.capnis-home-page .creative-project-meta span,
body.capnis-home-page .app-stack-content p {
    color: var(--capnis-slate);
}

body.capnis-home-page .tp-line-black,
body.capnis-home-page .tp-service-content .tp-section-title a.tp_text_invert,
body.capnis-home-page .tp_text_invert_2,
body.capnis-home-page .tp_text_invert_2 > div {
    color: var(--capnis-ink) !important;
    -webkit-text-fill-color: var(--capnis-ink);
}

/* ------------------------------------------------------------------ */
/* Why Capnis — crp-success masonry                                   */
/* ------------------------------------------------------------------ */

body.capnis-home-page .crp-success-area .capnis-home-tile-a {
    background-color: color-mix(in srgb, var(--capnis-surface-3) 88%, var(--capnis-ink) 12%);
}

body.capnis-home-page .crp-success-area .capnis-home-tile-b {
    background-color: color-mix(in srgb, var(--capnis-surface) 78%, var(--capnis-primary) 22%);
}

body.capnis-home-page .crp-success-area .crp-success-content p,
body.capnis-home-page .crp-success-area .crp-success-content > span,
body.capnis-home-page .crp-success-area .capnis-home-tile-title {
    color: var(--capnis-ink);
}

body.capnis-home-page .crp-success-area .crp-success-yellow-box .crp-success-content p {
    color: var(--capnis-ink);
}

body.capnis-home-page .crp-success-area .crp-success-item {
    border-radius: 12px;
    overflow: hidden;
}

/* ------------------------------------------------------------------ */
/* Services — tp-service-pin                                          */
/* ------------------------------------------------------------------ */

body.capnis-home-page .tp-service-area.capnis-home-services .tp-service-item {
    border-top: 1px solid var(--capnis-border);
}

body.capnis-home-page .tp-service-area.capnis-home-services .tp-service-content p,
body.capnis-home-page .tp-service-area.capnis-home-services .tp-service-category span {
    color: var(--capnis-slate);
}

body.capnis-home-page .tp-service-area.capnis-home-services .tp-service-number span {
    color: var(--capnis-ink);
}

/* ------------------------------------------------------------------ */
/* Automation — creative-service rows                                 */
/* ------------------------------------------------------------------ */

body.capnis-home-page .creative-service-area .creative-service-item {
    border-top: 1px solid var(--capnis-border);
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}

body.capnis-home-page .creative-service-area .creative-service-content > span {
    color: var(--capnis-slate);
}

body.capnis-home-page .creative-service-area .creative-service-category span {
    color: var(--capnis-ink);
    border: 1px solid var(--capnis-border);
    background: var(--capnis-surface);
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    margin-right: 0.35rem;
}

body.capnis-home-page .creative-service-area .creative-service-link a {
    color: var(--capnis-ink);
    border: 1px solid var(--capnis-border);
}

/* ------------------------------------------------------------------ */
/* Projects — crp-project pin cards                                   */
/* ------------------------------------------------------------------ */

body.capnis-home-page .crp-project-area .crp-project-item {
    background: var(--capnis-surface);
    border: 1px solid var(--capnis-border);
    border-radius: 16px;
    padding: 1.25rem;
}

body.capnis-home-page .crp-project-area .crp-project-meta span {
    color: var(--capnis-slate);
}

body.capnis-home-page .crp-project-area .crp-project-thumb img {
    max-height: 320px;
    width: auto;
    object-fit: contain;
}

/* ------------------------------------------------------------------ */
/* Products — creative-project grid                                   */
/* ------------------------------------------------------------------ */

body.capnis-home-page .creative-project-area .creative-project-category span {
    color: var(--capnis-ink);
    background: color-mix(in srgb, var(--capnis-surface) 90%, transparent);
    border: 1px solid var(--capnis-border);
}

body.capnis-home-page .creative-project-area .creative-project-thumb img {
    border-radius: 12px;
}

/* ------------------------------------------------------------------ */
/* Clients — des-brand dual marquee                                   */
/* ------------------------------------------------------------------ */

body.capnis-home-page .des-brand-area .des-brand-item-inner {
    padding: 0 2rem;
    flex: 0 0 auto;
}

body.capnis-home-page .des-brand-area .des-brand-item-inner img {
    max-height: 52px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
    opacity: 0.82;
    filter: grayscale(1);
    transition: opacity 0.2s ease, filter 0.2s ease;
}

html.capnis-dark body.capnis-home-page .des-brand-area .des-brand-item-inner img {
    filter: grayscale(1) brightness(1.15);
    opacity: 0.9;
}

body.capnis-home-page .des-brand-area .des-brand-item-inner a:hover img,
body.capnis-home-page .des-brand-area .des-brand-item-inner img:hover {
    opacity: 1;
    filter: none;
}

/* ------------------------------------------------------------------ */
/* Testimonials — tp-testimonial global map                           */
/* ------------------------------------------------------------------ */

body.capnis-home-page .tp-testimonial-area {
    background-color: var(--capnis-surface-3) !important;
}

body.capnis-home-page .tp-testimonial-area .tp-testimonial-global {
    opacity: 0.35;
}

html.capnis-dark body.capnis-home-page .tp-testimonial-area .tp-testimonial-global {
    opacity: 0.22;
}

body.capnis-home-page .tp-testimonial-area .tp-testimonial-ratting-icon span,
body.capnis-home-page .tp-testimonial-area .tp-testimonial-ratting-info p {
    color: var(--capnis-slate);
}

body.capnis-home-page .tp-testimonial-area .tp-testimonial-item.white-style,
body.capnis-home-page .tp-testimonial-area .tp-testimonial-item.green-style {
    background: var(--capnis-surface);
    border: 1px solid var(--capnis-border);
    border-radius: 16px;
}

body.capnis-home-page .tp-testimonial-area .tp-testimonial-item .tp-testimonial-text p,
body.capnis-home-page .tp-testimonial-area .tp-testimonial-author-info span {
    color: var(--capnis-ink);
}

body.capnis-home-page .tp-testimonial-area .tp-testimonial-author-info p {
    color: var(--capnis-slate);
}

/* ------------------------------------------------------------------ */
/* AI solutions stack (unchanged pattern)                             */
/* ------------------------------------------------------------------ */

body.capnis-home-page .app-stack-area .app-stack-subtitle,
body.capnis-home-page .app-stack-area .app-stack-number,
body.capnis-home-page .app-stack-area .app-stack-title,
body.capnis-home-page .app-stack-area .app-stack-content p {
    color: var(--capnis-ink);
}

body.capnis-home-page .app-stack-area .app-stack-btn a {
    color: var(--capnis-ink);
    border: 1px solid var(--capnis-border);
    background: transparent;
}

body.capnis-home-page .app-stack-area .app-stack-btn a:hover {
    background: var(--capnis-surface-3);
}

html.capnis-light body.capnis-home-page .app-stack-area .app-stack-item--tint {
    background-color: var(--capnis-surface-3);
}

html.capnis-dark body.capnis-home-page .app-stack-area .app-stack-item--tint {
    background-color: var(--capnis-surface);
}

/* ------------------------------------------------------------------ */
/* Shared CTAs                                                        */
/* ------------------------------------------------------------------ */

body.capnis-home-page .tp-btn-sky-border {
    color: var(--capnis-ink);
    border-color: var(--capnis-border);
}

body.capnis-home-page .tp-btn-sky-border:hover {
    color: var(--capnis-ink);
    border-color: var(--capnis-ink);
    background: var(--capnis-surface-3);
}
