/* site palette */
html:root {
    --bg: #F7F4EE;
    --surface: #FFFFFF;
    --surface-alt: #EDF6F0;
    --text: #1C1812;
    --text-muted: #72695A;
    --border: #E4DFD8;
    --primary: #1F5934;
    --primary-hover: #163F25;
    --on-primary: #FFFFFF;
    --primary-text: #1F5934;
    --accent: #D18DB7;
    --on-accent: #111111;
    --accent-text: #B14788;
    --dark-band: #143921;
    --on-dark: #FFFFFF;
    --on-dark-muted: #C3BEB6;
    --brand-btn-bg: #FFFFFF;
    --brand-btn-text: #143921;
    --section-alt-bg: #EDF6F0;
    --dark-band-bg: #143921;
    --brand-band-bg: #1F5934;
    --hero-bg: #143921;
}

/* /site palette */

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

body {
    margin: 0;
    padding: 0;
    font-family: 'Cardo', serif;
    font-weight: 400;
    font-style: normal;
    background-color: var(--bg);
    color: var(--text);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

.text-muted {
    color: var(--text-muted) !important;
}

.mse-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 9999px;
    padding: 12px 28px;
    font-family: 'Cardo', serif;
    font-weight: 700;
    font-size: 0.9375rem;
    letter-spacing: 0.02em;
    background-color: var(--primary);
    color: var(--on-primary);
    border: 1px solid transparent;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}

.mse-btn:hover {
    background-color: var(--primary-hover);
    color: var(--on-primary);
}

.mse-btn-alt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 9999px;
    padding: 12px 28px;
    font-family: 'Cardo', serif;
    font-weight: 700;
    font-size: 0.9375rem;
    letter-spacing: 0.02em;
    background-color: transparent;
    color: var(--primary-text);
    border: 1px solid var(--border);
    text-decoration: none;
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}

.mse-btn-alt:hover {
    background-color: var(--surface-alt);
    color: var(--primary-hover);
    border-color: var(--border);
}

.mse-card {
    background-color: var(--surface);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    position: relative;
}

@media (min-width: 768px) {
    .mse-card {
        padding: 2rem;
    }
}

.mse-card-accent {
    border: 1px solid var(--primary);
}

.mse-media {
    width: 100%;
    aspect-ratio: 16 / 10;
    flex-shrink: 0;
    border-radius: 0.75rem;
    border: 1px solid var(--border);
    overflow: hidden;
    position: relative;
    background-color: var(--surface-alt);
}

.mse-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mse-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-family: 'Cardo', serif;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    background-color: var(--surface-alt);
    border: 1px solid var(--border);
    border-radius: 9999px;
    padding: 0.25rem 0.75rem;
    margin-bottom: 0.75rem;
}

.mse-title {
    font-family: 'Cardo', serif;
    font-weight: 700;
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    line-height: 1.25;
    color: var(--text);
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.mse-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
    font-family: 'Cardo', serif;
    font-size: 0.75rem;
    font-weight: 700;
    background-color: var(--surface-alt);
    color: var(--primary-text);
    border: 1px solid var(--border);
}

.mse-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    background-color: var(--surface-alt);
    color: var(--primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.mse-section {
    background-color: var(--bg);
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.mse-section-alt {
    background-color: var(--section-alt-bg, var(--surface-alt));
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.mse-section-dark {
    background-color: var(--dark-band-bg, var(--dark-band));
    color: var(--on-dark);
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.mse-section-brand {
    background-color: var(--brand-band-bg, var(--primary));
    color: var(--on-primary);
    padding-top: 4rem;
    padding-bottom: 4rem;
}

@media (min-width: 768px) {

    .mse-section,
    .mse-section-alt,
    .mse-section-dark,
    .mse-section-brand {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

.mse-section-brand .mse-btn {
    background-color: var(--brand-btn-bg);
    color: var(--brand-btn-text);
    border: none;
}

.mse-section-brand .mse-btn:hover {
    background-color: var(--surface-alt);
    color: var(--brand-btn-text);
}

.mse-section-brand .mse-btn-alt {
    border-color: var(--on-primary);
    color: var(--on-primary);
}

.mse-section-brand .mse-btn-alt:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--on-primary);
}

.mse-section-dark .mse-title,
.mse-on-dark .mse-title {
    color: var(--on-dark);
}

.mse-section-dark .mse-eyebrow,
.mse-on-dark .mse-eyebrow {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--on-dark-muted);
    border-color: rgba(255, 255, 255, 0.15);
}

.mse-section-dark .text-muted,
.mse-on-dark .text-muted {
    color: var(--on-dark-muted) !important;
}

.mse-section-dark .mse-btn-alt,
.mse-on-dark .mse-btn-alt {
    color: var(--on-dark);
    border-color: rgba(255, 255, 255, 0.25);
}

.mse-section-dark .mse-btn-alt:hover,
.mse-on-dark .mse-btn-alt:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--on-dark);
}

.mse-section-dark .mse-card,
.mse-on-dark .mse-card {
    background-color: var(--surface);
    color: var(--text);
    border-color: var(--border);
}

.mse-section-dark .mse-card .mse-title,
.mse-on-dark .mse-card .mse-title {
    color: var(--text);
}

.mse-section-dark .mse-card .text-muted,
.mse-on-dark .mse-card .text-muted {
    color: var(--text-muted) !important;
}

.mse-shadow-soft {
    box-shadow: 0 20px 25px -5px rgba(20, 57, 33, 0.08), 0 8px 10px -6px rgba(20, 57, 33, 0.04);
}

/* ===== header ===== */
.rr-header {
    font-family: 'Cardo', serif;
}

.rr-header > .max-w-\[1200px\] {
    max-width: 1400px;
}

.rr-header .rr-nav-link {
    position: relative;
    white-space: nowrap;
    flex-shrink: 0;
}

.rr-header .h-20 {
    gap: 20px;
}

.rr-header .h-20 > div {
    flex-shrink: 0;
}

.rr-header .h-20 nav,
.rr-header .h-20 > div.hidden {
    flex-shrink: 1;
    min-width: 0;
}

.rr-header .mse-btn {
    white-space: nowrap;
    flex-shrink: 0;
}

@media (min-width: 1280px) {
    .rr-header .h-20 {
        gap: 28px;
    }
}

.rr-header .rr-nav-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--primary);
    transition: width 0.15s ease-in-out;
}

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

/* ===== hero_section ===== */
#hero-fieldbook {
    background-color: var(--dark-band, #143921);
    font-family: 'Cardo', serif;
}

#hero-fieldbook .hero-diagram-grid {
    background-image: radial-gradient(circle at 1px 1px, rgba(228, 223, 216, 0.25) 1px, transparent 0);
    background-size: 24px 24px;
}

#hero-fieldbook .hero-visual-container {
    transform: perspective(1000px) rotateY(-2deg);
    transition: transform 150ms ease;
}

#hero-fieldbook .mse-btn {
    background-color: var(--primary, #1F5934);
    color: var(--on-primary, #FFFFFF);
    border-radius: 9999px;
    padding: 12px 28px;
    font-size: 0.9375rem;
    letter-spacing: 0.02em;
    border: 1px solid transparent;
}

#hero-fieldbook .mse-btn:hover {
    background-color: var(--primary-hover, #163F25);
    color: #FFFFFF;
}

#hero-fieldbook .mse-btn-alt {
    background-color: transparent;
    color: #FFFFFF;
    border: 1px solid rgba(228, 223, 216, 0.4);
    border-radius: 9999px;
    padding: 12px 28px;
    font-size: 0.9375rem;
}

#hero-fieldbook .mse-btn-alt:hover {
    background-color: rgba(237, 246, 240, 0.15);
    color: #FFFFFF;
    border-color: rgba(228, 223, 216, 0.7);
}

@media (max-width: 767px) {
    #hero-fieldbook .hero-visual-container {
        transform: none;
    }
}

/* ===== relation_maps ===== */
.relation-maps-tab-active {
    background-color: var(--primary) !important;
    color: var(--on-primary) !important;
    border-color: var(--primary) !important;
}

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

    .relation-maps-table thead {
        display: none;
    }

    .relation-maps-table,
    .relation-maps-table tbody,
    .relation-maps-table tr,
    .relation-maps-table td {
        display: block;
        width: 100%;
    }
}

/* ===== planning_principles_articles ===== */
.planning-articles-section {
    font-family: 'Cardo', serif;
}

.planning-articles-section .mse-card {
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.planning-articles-section .mse-card:hover {
    border-color: var(--primary);
}

.planning-articles-section .mse-media {
    transition: transform 0.2s ease;
}

.planning-articles-section .mse-card:hover .mse-media {
    transform: scale(1.02);
}

.planning-articles-section .js-filter-btn.active {
    background-color: var(--primary);
    color: var(--on-primary);
    border-color: var(--primary);
}

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

    .planning-articles-section h2 {
        font-size: 16px;
    }

    .planning-articles-section h3 {
        font-size: 14px;
    }
}

/* ===== featured_case ===== */
.mse-section-brand .js-order-switchers .js-tab-btn {
    outline: none;
    background-color: rgba(255, 255, 255, 0.15);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.mse-section-brand .js-order-switchers .js-tab-btn:hover {
    background-color: rgba(255, 255, 255, 0.28);
    color: #FFFFFF;
}

.mse-section-brand .js-order-switchers .js-tab-btn:active {
    background-color: rgba(255, 255, 255, 0.35);
    color: #FFFFFF;
}

.mse-section-brand .js-order-switchers .js-tab-btn[aria-selected="true"] {
    background-color: #FFFFFF;
    color: var(--dark-band);
    border-color: transparent;
}

.mse-section-brand .js-order-switchers .js-tab-btn[aria-selected="true"]:hover,
.mse-section-brand .js-order-switchers .js-tab-btn[aria-selected="true"]:active {
    background-color: var(--surface-alt);
    color: var(--dark-band);
}

.mse-section-brand .js-order-switchers .js-tab-btn:focus-visible {
    box-shadow: 0 0 0 2px var(--on-primary);
}

@media (max-width: 767px) {
    .mse-section-brand .js-order-switchers {
        flex-direction: column;
        width: 100%;
    }

    .mse-section-brand .js-order-switchers .js-tab-btn {
        width: 100%;
        text-align: left;
    }
}

/* ===== interactive_product_tour ===== */
#interactive-tour-block .js-zone-btn.active {
    border-color: var(--primary);
    background-color: var(--surface-alt);
}

#interactive-tour-block .js-zone-btn.active div:first-child {
    color: var(--primary);
}

@media (max-width: 767px) {
    #interactive-tour-block table thead {
        display: none;
    }

    #interactive-tour-block table,
    #interactive-tour-block table tbody,
    #interactive-tour-block table tr,
    #interactive-tour-block table td {
        display: block;
        width: 100%;
    }

    #interactive-tour-block table tr {
        padding: 8px 0;
        border-bottom: 1px solid var(--border);
    }

    #interactive-tour-block table td {
        padding: 4px 0;
        text-align: left !important;
    }
}

/* ===== what_we_need_from_you ===== */
.requirements-section {
    position: relative;
    overflow: hidden;
}

.requirements-section .mse-card {
    transition: border-color 0.15s ease;
}

.requirements-section input[type='checkbox'] {
    accent-color: var(--accent);
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* ===== how_it_looks_inside ===== */
.bts-section {
    font-family: 'Cardo', serif;
    background-color: var(--bg);
}

.bts-section h2,
.bts-section h3 {
    font-family: 'Cardo', serif;
    hyphens: auto;
    word-break: break-word;
}

.bts-section p {
    hyphens: auto;
}

.bts-section .mse-card {
    transition: border-color 0.15s ease;
}

.bts-section .mse-card:hover {
    border-color: var(--primary);
}

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

/* ===== what_happens_after_launch ===== */
#collaboration-timeline .mse-card {
    min-height: 100%;
}

#collaboration-timeline .mse-card:hover {
    border-color: var(--primary);
}

@media (max-width: 767px) {
    #collaboration-timeline .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== our_services ===== */
.services-grid-block {
    font-family: 'Cardo', serif;
}

.services-grid-block .services-card {
    border-radius: 20px;
}

.services-grid-block .services-modal {
    transition: opacity 0.2s ease;
}

.services-grid-block .services-modal.hidden {
    display: none;
}

.services-grid-block input::placeholder {
    color: #72695A;
    opacity: 0.7;
}

.services-grid-block h2,
.services-grid-block h3 {
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    .services-grid-block .services-card {
        width: 100%;
    }
}

/* ===== project_portfolio ===== */
.portfolio-grid-block .portfolio-filter-btn {
    font-family: 'Cardo', serif;
    font-weight: 700;
    font-size: 0.8125rem;
    padding: 6px 16px;
    min-width: 160px;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 9999px;
    border: 1px solid var(--border);
    background-color: var(--surface);
    color: var(--text);
    transition: all 150ms ease-in-out;
    cursor: pointer;
    white-space: nowrap;
}

.portfolio-grid-block .portfolio-filter-btn:hover {
    background-color: var(--surface-alt);
    color: var(--primary);
    border-color: var(--primary);
}

.portfolio-grid-block .portfolio-filter-btn.active {
    background-color: var(--primary);
    color: var(--on-primary);
    border-color: var(--primary);
}

.portfolio-grid-block .portfolio-card {
    min-height: 100%;
    transition: border-color 150ms ease-in-out;
}

.portfolio-grid-block .portfolio-card:hover {
    border-color: var(--primary);
}

.portfolio-grid-block .portfolio-case-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 180px;
    min-height: 42px;
    padding: 10px 20px;
    border-radius: 9999px;
    border: 1px solid var(--primary);
    background-color: var(--primary);
    color: var(--on-primary);
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 150ms ease, color 150ms ease;
}

.portfolio-grid-block .portfolio-case-btn:hover,
.portfolio-grid-block .portfolio-case-btn:active {
    background-color: var(--primary-hover);
    color: #FFFFFF;
}

@media (max-width: 767px) {
    .portfolio-grid-block .js-portfolio-filters {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .portfolio-grid-block .portfolio-filter-btn {
        width: 100%;
        min-width: 0;
        white-space: normal;
    }

    .portfolio-grid-block .portfolio-card > div:last-child {
        flex-direction: column;
        align-items: stretch;
    }

    .portfolio-grid-block .portfolio-case-btn {
        width: 100%;
        min-width: 0;
    }
}

/* ===== footer ===== */
.mse-section-dark a {
    transition: color 150ms ease;
}

.mse-section-dark a:hover {
    color: #FFFFFF;
}

.rr-header {
    font-family: 'Cardo', serif;
}

.rr-header .rr-nav-link {
    position: relative;
}

.rr-header .rr-nav-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--primary);
    transition: width 0.15s ease-in-out;
}

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

.services-catalog-block input::placeholder,
.services-catalog-block textarea::placeholder,
.js-service-modal input::placeholder,
.js-service-modal textarea::placeholder {
    color: var(--text-muted);
    opacity: 0.8;
}

@media (max-width: 767px) {
    .services-catalog-block .big-first-grid {
        grid-template-columns: 1fr;
    }

    .services-catalog-block .big-first-grid-item {
        grid-column: span 1 / span 1;
    }
}


/* ===== PAGE: chief-architect ===== */
.product-boundary-block{position:relative;width:100%;font-family:'Cardo',serif;}.product-boundary-block h2,.product-boundary-block h3{font-family:'Cardo',serif;word-break:break-word;overflow-wrap:anywhere;}.product-boundary-block p{font-family:'Cardo',serif;line-height:1.6;}@media(max-width:767px){.product-boundary-block .grid{grid-template-columns:1fr;}}

/* ===== PAGE: about ===== */
.mse-section, .mse-section-alt, .mse-section-dark {
  font-family: 'Cardo', serif;
}
.js-tab-btn {
  cursor: pointer;
  transition: all 0.15s ease;
}
.js-matrix-tabs .js-tab-btn {
  background-color: var(--surface);
  color: var(--text);
  border-color: var(--border);
}
.js-matrix-tabs .js-tab-btn:hover {
  background-color: var(--surface-alt);
  color: var(--text);
  border-color: var(--primary);
}
.js-matrix-tabs .js-tab-btn.active {
  background-color: var(--primary);
  color: var(--on-primary);
  border-color: var(--primary);
}
.js-zone-card.hidden {
  display: none;
}
a.rr-cta-btn-light,
a.rr-cta-btn-light:visited {
  background-color: var(--surface);
  color: var(--dark-band);
}
.mse-section-dark a.rr-cta-btn-light:hover,
.mse-section-dark a.rr-cta-btn-light:active,
a.rr-cta-btn-light:hover,
a.rr-cta-btn-light:active {
  background-color: var(--surface-alt);
  color: var(--primary-hover);
}

/* ===== PAGE: contacts ===== */
.contact-page-block .contact-input::placeholder {
  color: var(--text-muted);
  opacity: 0.8;
}

.contact-page-block select.contact-input option {
  background-color: var(--surface);
  color: var(--text);
}

@media (max-width: 767px) {
  .contact-page-block .mse-card {
    padding: 1.25rem;
  }
}

/* ===== PAGE: privacy ===== */
.privacy-content-section {
  background-color: var(--bg);
  color: var(--text);
  font-family: 'Cardo', serif;
}

.privacy-content-section .mse-card {
  transition: border-color 0.15s ease;
}

.privacy-content-section .js-toc-btn.active {
  background-color: var(--surface-alt);
  color: var(--primary);
  font-weight: 700;
}

.privacy-content-section article {
  scroll-margin-top: 2rem;
}

@media (max-width: 767px) {
  .privacy-content-section article {
    scroll-margin-top: 1rem;
  }
}

/* ===== PAGE: terms ===== */
.terms-content-block nav a {
  transition: all 150ms ease;
}

.terms-content-block a {
  overflow-wrap: anywhere;
}

.terms-content-block h2,
.terms-content-block h3 {
  overflow-wrap: anywhere;
  hyphens: auto;
}

@media (max-width: 767px) {
  .terms-content-block .sticky {
    position: static;
  }
}

.comment-item {
    font-family: 'Cardo', serif;
}

.comment-avatar {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    object-fit: cover;
}

.comment-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 9999px;
}

.comment-body p {
    margin-bottom: 0.5rem;
}

.comment-body p:last-child {
    margin-bottom: 0;
}

.comment-action-btn {
    font-family: 'Cardo', serif;
}

.comment-item {
    font-family: 'Cardo', serif;
}

.reply-avatar {
    width: 38px;
    height: 38px;
    min-width: 38px;
    min-height: 38px;
    object-fit: cover;
}

.reply-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 9999px;
}

.reply-comment .comment-body p {
    margin-bottom: 0.35rem;
}

.reply-comment .comment-body p:last-child {
    margin-bottom: 0;
}

.comment-action-btn {
    font-family: 'Cardo', serif;
}


/* ===== PAGE TEMPLATE: planning-principles ===== */
.rr-header {
    font-family: 'Cardo', serif;
}

.rr-header .rr-nav-link {
    position: relative;
}

.rr-header .rr-nav-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--primary);
    transition: width 0.15s ease-in-out;
}

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

#hero-article {
    background-color: var(--dark-band, #143921);
    font-family: 'Cardo', serif;
}

#hero-article .hero-diagram-grid {
    background-image: radial-gradient(circle at 1px 1px, rgba(228, 223, 216, 0.25) 1px, transparent 0);
    background-size: 24px 24px;
}

.article-template-layout {
    font-family: 'Cardo', serif;
}

.article-template-layout .overflow-wrap-anywhere {
    overflow-wrap: anywhere;
}

.article-template-layout .key-facts-table th,
.article-template-layout .key-facts-table td {
    text-align: left;
}

.article-template-layout .comment-avatar {
    width: 44px;
    height: 44px;
}

.article-template-layout .reply-avatar {
    width: 36px;
    height: 36px;
}

.article-template-layout .comment-action-btn[data-liked="true"] {
    color: var(--primary);
    background-color: var(--surface-alt);
    border-color: var(--border);
}

.mse-section-dark a {
    transition: color 150ms ease;
}

.mse-section-dark a:hover {
    color: #FFFFFF;
}

@media (max-width: 767px) {
    .article-template-layout .key-facts-table thead {
        display: none;
    }

    .article-template-layout .key-facts-table,
    .article-template-layout .key-facts-table tbody,
    .article-template-layout .key-facts-table tr,
    .article-template-layout .key-facts-table td {
        display: block;
        width: 100%;
    }

    .article-template-layout .key-facts-table td {
        padding: 8px 12px;
    }
}

/* ===== PAGE TEMPLATE: portfolio ===== */
.rr-header {
    font-family: 'Cardo', serif;
}

.rr-header .rr-nav-link {
    position: relative;
}

.rr-header .rr-nav-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--primary, #1F5934);
    transition: width 0.15s ease-in-out;
}

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

.portfolio-detail-content {
    font-family: 'Cardo', serif;
}

.portfolio-detail-content h1,
.portfolio-detail-content h2,
.portfolio-detail-content h3,
.portfolio-detail-content h4,
.portfolio-detail-content h5 {
    overflow-wrap: anywhere;
    hyphens: auto;
}

.portfolio-detail-content .project-rich-text p {
    overflow-wrap: anywhere;
}

.comment-item.active-like [data-comment-like] {
    color: #1F5934;
    background-color: #EDF6F0;
    border-color: #E4DFD8;
}

.comment-item.active-like [data-comment-like] i {
    font-weight: bold;
}

@media (max-width: 767px) {
    .project-facts-list {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
    }
}

/* ===== PAGE TEMPLATE: services ===== */
.rr-header {
    font-family: 'Cardo', serif;
}

.rr-header .rr-nav-link {
    position: relative;
}

.rr-header .rr-nav-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--primary);
    transition: width 0.15s ease-in-out;
}

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

#hero-fieldbook {
    background-color: var(--dark-band, #143921);
    font-family: 'Cardo', serif;
}

#hero-fieldbook .hero-diagram-grid {
    background-image: radial-gradient(circle at 1px 1px, rgba(228, 223, 216, 0.25) 1px, transparent 0);
    background-size: 24px 24px;
}

.service-detail-container {
    font-family: 'Cardo', serif;
}

.service-detail-container .service-input::placeholder {
    color: var(--text-muted, #72695A);
    opacity: 0.75;
}

.comment-avatar {
    width: 42px;
    height: 42px;
    flex-shrink: 0;
}

.comment-avatar.reply-avatar {
    width: 36px;
    height: 36px;
}

.comment-action-btn.active {
    color: var(--primary, #1F5934);
    background-color: var(--surface-alt, #EDF6F0);
    border-color: var(--border, #E4DFD8);
}

.mse-section-dark a {
    transition: color 150ms ease;
}

.mse-section-dark a:hover {
    color: #FFFFFF;
}

@media (max-width: 767px) {
    .service-detail-container .service-compact-cta {
        flex-direction: column;
        text-align: center;
    }
}

/* 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%;
  }
}