:root {
    --bg-primary: #FAF8F5;
    --bg-secondary: #F3EFEA;
    --bg-tertiary: #EDE7DF;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F8F5FF;
    --text-primary: #1E1B24;
    --text-secondary: #5A5463;
    --text-muted: #8A8394;
    --primary: #5B21B6;
    --primary-hover: #4C1D95;
    --primary-light: #EDE9FE;
    --secondary: #7C3AED;
    --accent: #FF5D38;
    --accent-hover: #E04824;
    --border-subtle: #E6DFD5;
    --border-card: #EBE5DC;
}

html {
    scroll-behavior: smooth;
    box-sizing: border-box;
}

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

.text-muted {
    color: #8A8394 !important;
}

.transition-standard {
    transition: all 0.3s ease-out;
}

/* ===== header ===== */
.c-site-header {
    font-family: 'DM Sans', sans-serif;
    background-color: #FAF8F5;
}

.c-site-header .c-nav-link {
    position: relative;
}

.c-site-header .c-nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #7C3AED;
    transition: width 0.25s ease-out;
}

.c-site-header .c-nav-link:hover::after {
    width: 100%;
}

.c-site-header .c-header-cta {
    box-shadow: 0 2px 8px -1px rgba(91, 33, 182, 0.25);
}

/* ===== tracethethinkingbehindarchitecturaldecisions ===== */
.concept-hero-section {
    position: relative;
    background-color: #1E1B24;
}

.concept-hero-section .concept-hero-section__pattern {
    background-image: linear-gradient(#5B21B6 1px, transparent 1px), linear-gradient(to right, #5B21B6 1px, transparent 1px);
    background-size: 40px 40px;
}

.concept-hero-section .concept-hero-section__video {
    object-fit: cover;
    object-position: center;
}

.concept-hero-section .concept-hero-section__title,
.concept-hero-section .concept-hero-section__lead {
    overflow-wrap: anywhere;
    hyphens: auto;
}

@media (max-width: 767px) {
    .concept-hero-section .concept-hero-section__grid {
        grid-template-columns: 1fr;
    }

    .concept-hero-section .concept-hero-section__actions {
        flex-direction: column;
    }
}

/* ===== theentrancemovedbuttheoriginaldesignidearemained ===== */
.featured-case-section {
    font-family: 'DM Sans', sans-serif;
}

.featured-case-section h2,
.featured-case-section h3 {
    hyphens: auto;
}

/* ===== transformationcases ===== */
.transformation-cases-block .case-card {
    min-width: 0;
    overflow-wrap: anywhere;
}

.transformation-cases-block .case-card h3 {
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    .transformation-cases-block .js-cases-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== stagesandmethodology ===== */
.stages-methodology-section .stages-card:hover .stages-card-img {
    transform: scale(1.04);
}

@media (max-width: 767px) {
    .stages-methodology-section .stages-card {
        flex-direction: column;
    }

    .stages-methodology-section h2 {
        font-size: 16px !important;
    }

    .stages-methodology-section h3 {
        font-size: 14px !important;
    }
}

/* ===== articlesandcritique ===== */
.articles-critique-section {
    font-family: 'DM Sans', sans-serif;
}

.articles-critique-section .critique-card {
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    .articles-critique-section .critique-card {
        width: 100%;
    }
}

/* ===== bookaconsultation ===== */
.consultation-booking-section input::placeholder {
    color: #8A8394;
    opacity: 1;
}

.consultation-booking-section .active-slot {
    background-color: #5B21B6 !important;
    color: #FFFFFF !important;
    border-color: #5B21B6 !important;
}

.consultation-booking-section .inactive-slot {
    background-color: #FAF8F5 !important;
    color: #1E1B24 !important;
    border-color: #E6DFD5 !important;
}

/* ===== whathappensafterstart ===== */
.trace-timeline-block .js-timeline-btn {
    background-color: #F3EFEA;
    color: #5A5463;
    border: 1px solid #E6DFD5
}

.trace-timeline-block .js-timeline-btn:hover {
    background-color: #EDE9FE;
    color: #5B21B6;
    border-color: #DDD6FE
}

.trace-timeline-block .js-timeline-btn.active-tab {
    background-color: #5B21B6;
    color: #FFFFFF;
    border-color: #5B21B6
}

.trace-timeline-block .trace-card:hover {
    border-color: #DDD6FE;
    background-color: #F8F5FF
}

.trace-timeline-block .trace-card:hover .trace-node {
    border-color: #7C3AED;
    transform: scale(1.1)
}

.trace-timeline-block .trace-node {
    transition: transform 0.2s ease, border-color 0.2s ease
}

/* ===== whatweworkwith ===== */
.cta-tools-section .js-tool-card {
    min-height: 100%;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.cta-tools-section .js-tool-card.hidden {
    display: none !important;
}

.cta-tools-section .js-tool-filter {
    cursor: pointer;
    user-select: none;
}

@media (max-width: 767px) {
    .cta-tools-section .js-tools-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== keybenefits ===== */
.atelier-benefits-section {
    font-family: 'DM Sans', sans-serif;
    overflow-wrap: anywhere;
}

.atelier-benefits-section .atelier-benefit-card {
    min-width: 0;
}

@media (max-width: 767px) {
    .atelier-benefits-section .atelier-benefit-card {
        width: 100%;
    }
}

/* ===== howwework ===== */
.trace-process-journey .js-process-tab:focus-visible {
    outline: 2px solid #5B21B6;
    outline-offset: 2px;
}

.trace-process-journey .js-process-tab.is-active {
    background-color: #FFFFFF;
    border-color: #5B21B6;
    box-shadow: 0 4px 12px -2px rgba(91, 33, 182, 0.08);
}

.trace-process-journey .js-process-tab.is-active span:first-child {
    background-color: #5B21B6;
    color: #FFFFFF;
}

.trace-process-journey .js-process-tab.is-active span:nth-child(2) {
    color: #7C3AED;
}

@media (max-width: 767px) {
    .trace-process-journey .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== footer ===== */
.concept-footer {
    font-family: 'DM Sans', sans-serif;
    overflow-wrap: anywhere;
}

.concept-footer a {
    text-decoration: none;
}

.concept-footer a:focus-visible {
    outline: 2px solid #7C3AED;
    outline-offset: 2px;
}

@media (max-width: 767px) {
    .concept-footer .grid {
        grid-template-columns: 1fr;
    }
}

.c-site-header {
    font-family: 'DM Sans', sans-serif;
    background-color: #FAF8F5;
}

.c-site-header .c-nav-link {
    position: relative;
}

.c-site-header .c-nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #7C3AED;
    transition: width 0.25s ease-out;
}

.c-site-header .c-nav-link:hover::after {
    width: 100%;
}

.c-site-header .c-header-cta {
    box-shadow: 0 2px 8px -1px rgba(91, 33, 182, 0.25);
}

.cat-header-block {
    font-family: 'DM Sans', sans-serif;
}

.cat-header-block .cat-header-block__title {
    font-weight: 700;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.cat-header-block .cat-header-block__subtitle {
    font-weight: 400;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.cat-header-block .cat-header-block__chip.active-chip {
    background-color: #5B21B6;
    color: #FFFFFF;
    border-color: #5B21B6;
}

.cat-grid-block {
    font-family: 'DM Sans', sans-serif;
}

.cat-grid-block .cat-grid-block__heading {
    font-weight: 600;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.cat-grid-block .cat-grid-block__card {
    overflow-wrap: anywhere;
    hyphens: auto;
}

.cat-grid-block .cat-grid-block__card-title {
    font-weight: 600;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.cat-grid-block .cat-grid-block__card-excerpt {
    font-weight: 400;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.cat-curation-block {
    font-family: 'DM Sans', sans-serif;
}

.cat-curation-block .cat-curation-block__title {
    font-weight: 600;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.cat-curation-block .cat-curation-block__desc {
    font-weight: 400;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.concept-footer {
    font-family: 'DM Sans', sans-serif;
    overflow-wrap: anywhere;
}

.concept-footer a {
    text-decoration: none;
}

.concept-footer a:focus-visible {
    outline: 2px solid #7C3AED;
    outline-offset: 2px;
}

@media (max-width: 767px) {
    .cat-grid-block #js-catalog-grid {
        grid-template-columns: 1fr;
    }

    .cat-curation-block .max-w-7xl>div {
        flex-direction: column;
        align-items: flex-start;
    }

    .concept-footer .grid {
        grid-template-columns: 1fr;
    }
}


/* ===== PAGE: about ===== */
.concept-about-editorial { word-break: break-word; overflow-wrap: anywhere; }
.concept-about-editorial .js-stage-tab.active { background-color: #5B21B6; color: #FFFFFF; border-color: #5B21B6; }
.concept-about-editorial .js-stage-tab:not(.active) { background-color: #FFFFFF; color: #1E1B24; }
.concept-about-editorial .js-stage-tab:not(.active):hover { background-color: #EDE9FE; color: #5B21B6; }
@media (max-width: 767px) {
  .concept-about-editorial .js-stage-content { grid-template-columns: 1fr; }
}

/* ===== PAGE: vectorworks ===== */
.vw-dossier-wrapper { font-family: 'DM Sans', sans-serif; }
.vw-dossier-wrapper .js-tab-btn:focus-visible { outline: 2px solid #5B21B6; outline-offset: 2px; }

/* ===== PAGE: contact ===== */
.contact-atelier-section .contact-input::placeholder {
  color: #8A8394;
  opacity: 1;
}
.contact-atelier-section .contact-input:focus::placeholder {
  color: #B0A9B9;
}
.contact-atelier-section .overflow-wrap-anywhere {
  overflow-wrap: anywhere;
  hyphens: auto;
}
@media (max-width: 767px) {
  .contact-atelier-section {
    padding-top: 2rem;
    padding-bottom: 2.5rem;
  }
}

/* ===== PAGE: privacy ===== */
.cta-privacy-block a { text-decoration-skip-ink: auto; }
.cta-privacy-block aside nav a.active { color: #5B21B6; font-weight: 600; }
@media (max-width: 767px) {
  .cta-privacy-block aside { position: static; }
}

/* ===== PAGE: terms ===== */
.terms-content-section h2, .terms-content-section h3 { overflow-wrap: anywhere; }
.terms-content-section .js-toc-link.active-link { background-color: #EDE9FE; color: #5B21B6; font-weight: 600; }
@media (max-width: 767px) {
  .terms-content-section .js-toc-link { padding-top: 0.5rem; padding-bottom: 0.5rem; }
}

/* ===== PAGE: disclaimer ===== */
.atelier-disclaimer { word-break: break-word; overflow-wrap: anywhere; }
.atelier-disclaimer h2, .atelier-disclaimer h3 { overflow-wrap: anywhere; hyphens: auto; }
.atelier-disclaimer p { line-height: 1.65; }

.comment-item {
    border-color: #EBE5DC;
    background-color: #FFFFFF;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.comment-item:hover {
    border-color: #DDD6FE;
    background-color: #F8F5FF;
}

.comment-avatar {
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    object-fit: cover;
}

.comment-action-btn {
    transition: all 0.2s ease-out;
}

.comment-action-btn:hover {
    color: #5B21B6;
    background-color: #EDE9FE;
}

[data-comment-author] {
    color: #1E1B24;
}

[data-comment-like-count] {
    color: #1E1B24;
}

.reply-item {
    position: relative;
}

.reply-item::before {
    content: '';
    position: absolute;
    top: 1.5rem;
    left: 0;
    width: 0.75rem;
    height: 1px;
    background-color: #DDD6FE;
}

.reply-item .comment-avatar {
    width: 2.25rem;
    height: 2.25rem;
    min-width: 2.25rem;
    object-fit: cover;
}

.reply-item .comment-action-btn {
    transition: all 0.2s ease-out;
}

.reply-item .comment-action-btn:hover {
    color: #5B21B6;
    background-color: #EDE9FE;
}

[data-comment-author] {
    color: #1E1B24;
}

[data-comment-like-count] {
    color: #1E1B24;
}


/* ===== PAGE TEMPLATE: transformation-cases ===== */
.c-site-header {
    font-family: 'DM Sans', sans-serif;
    background-color: #FAF8F5;
}

.c-site-header .c-nav-link {
    position: relative;
}

.c-site-header .c-nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #7C3AED;
    transition: width 0.25s ease-out;
}

.c-site-header .c-nav-link:hover::after {
    width: 100%;
}

.c-site-header .c-header-cta {
    box-shadow: 0 2px 8px -1px rgba(91, 33, 182, 0.25);
}

.c-detail-hero .c-detail-hero__pattern {
    background-image: linear-gradient(#5B21B6 1px, transparent 1px), linear-gradient(to right, #5B21B6 1px, transparent 1px);
    background-size: 32px 32px;
}

.c-article-body h2,
.c-article-body h3 {
    overflow-wrap: anywhere;
    hyphens: auto;
}

.c-article-body p {
    overflow-wrap: anywhere;
}

.concept-footer {
    font-family: 'DM Sans', sans-serif;
    overflow-wrap: anywhere;
}

.concept-footer a {
    text-decoration: none;
}

.concept-footer a:focus-visible {
    outline: 2px solid #7C3AED;
    outline-offset: 2px;
}

@media (max-width: 767px) {
    .concept-footer .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== PAGE TEMPLATE: stages-methodology ===== */
.c-site-header {
    font-family: 'DM Sans', sans-serif;
    background-color: #FAF8F5;
}

.c-site-header .c-nav-link {
    position: relative;
}

.c-site-header .c-nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #7C3AED;
    transition: width 0.25s ease-out;
}

.c-site-header .c-nav-link:hover::after {
    width: 100%;
}

.c-site-header .c-header-cta {
    box-shadow: 0 2px 8px -1px rgba(91, 33, 182, 0.25);
}

.c-detail-hero .c-detail-hero__pattern {
    background-image: linear-gradient(#5B21B6 1px, transparent 1px), linear-gradient(to right, #5B21B6 1px, transparent 1px);
    background-size: 32px 32px;
}

.c-article-body h2,
.c-article-body h3 {
    overflow-wrap: anywhere;
    hyphens: auto;
}

.c-article-body p {
    overflow-wrap: anywhere;
}

.concept-footer {
    font-family: 'DM Sans', sans-serif;
    overflow-wrap: anywhere;
}

.concept-footer a {
    text-decoration: none;
}

.concept-footer a:focus-visible {
    outline: 2px solid #7C3AED;
    outline-offset: 2px;
}

@media (max-width: 767px) {
    .concept-footer .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== PAGE TEMPLATE: articles-critique ===== */
.c-site-header {
    font-family: 'DM Sans', sans-serif;
    background-color: #FAF8F5;
}

.c-site-header .c-nav-link {
    position: relative;
}

.c-site-header .c-nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #7C3AED;
    transition: width 0.25s ease-out;
}

.c-site-header .c-nav-link:hover::after {
    width: 100%;
}

.c-site-header .c-header-cta {
    box-shadow: 0 2px 8px -1px rgba(91, 33, 182, 0.25);
}

.c-detail-hero .c-detail-hero__pattern {
    background-image: linear-gradient(#5B21B6 1px, transparent 1px), linear-gradient(to right, #5B21B6 1px, transparent 1px);
    background-size: 32px 32px;
}

.c-article-body h2,
.c-article-body h3 {
    overflow-wrap: anywhere;
    hyphens: auto;
}

.c-article-body p {
    overflow-wrap: anywhere;
}

.concept-footer {
    font-family: 'DM Sans', sans-serif;
    overflow-wrap: anywhere;
}

.concept-footer a {
    text-decoration: none;
}

.concept-footer a:focus-visible {
    outline: 2px solid #7C3AED;
    outline-offset: 2px;
}

@media (max-width: 767px) {
    .concept-footer .grid {
        grid-template-columns: 1fr;
    }
}

/* mobile-text-guard */
@media (max-width: 767px) {
  h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, figcaption, td, th, label {
    overflow-wrap: anywhere;
  }
  a, button, .btn {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  img, video, iframe {
    max-width: 100%;
  }
}
