/* Aspect colour edition: charcoal identity with warm, accessible colour accents.
   Keep text/control colours dark; lighter tones belong to surfaces and artwork. */
:root {
  --ink: #262626;
  --muted: #606060;
  --paper: #ffffff;
  --surface: #f0f7f3;
  --soft: #e2efe9;
  --line: #d3dfd9;
  --charcoal: #292929;
  --button: #292929;
  --control-border: #767676;
  --teal: #17675c;
  --teal-dark: #154f48;
  --teal-pale: #e0f1e9;
  --blue: #285f80;
  --blue-pale: #e9f3fa;
  --terracotta: #99442b;
  --peach: #fff0e8;
  --gold: #efbd55;
  --gold-pale: #fff4d9;
}

::selection {
  background: var(--teal);
  color: #ffffff;
}

:focus-visible {
  outline-color: var(--teal);
}

.button {
  background: var(--button);
  border-color: var(--button);
}

.button:hover {
  background: var(--teal-dark);
  border-color: var(--teal-dark);
}

.button-outline {
  background: transparent;
  color: var(--teal-dark);
  border-color: #767676;
}

.button-outline:hover {
  background: var(--teal-pale);
  color: var(--teal-dark);
  border-color: var(--teal);
}

.button-light {
  background: #ffffff;
  border-color: #ffffff;
  color: var(--teal-dark);
}

.button-light:hover {
  background: var(--gold-pale);
  border-color: var(--gold-pale);
  color: var(--teal-dark);
}

.text-link {
  color: var(--teal);
}

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

.eyebrow {
  color: var(--teal);
}

.utility-bar {
  background: #292929;
}

.skip-link {
  background: var(--teal-dark);
}

/* Charcoal typography anchors the more colourful editorial sections. */
.home-welcome {
  background: #f5f5f5;
}

.welcome-copy h1 span {
  color: var(--teal);
}

.welcome-proof {
  color: #5d5d5d;
}

.proof-mark {
  color: var(--teal);
  border-color: #a6a6a6;
  background: #ececec;
}

.art-label {
  border-color: #d7d7d7;
  background: #fdfdfd;
  box-shadow: 0 8px 30px #41414112;
}

.art-label > .icon {
  color: var(--teal);
}

.quick-routes {
  border-color: #dbdbdb;
}

.quick-route {
  border-color: #e1e1e1;
}

.quick-route:nth-child(1) > .icon:first-child {
  color: var(--teal);
}

.quick-route:nth-child(2) > .icon:first-child {
  color: var(--terracotta);
}

.quick-route:nth-child(3) > .icon:first-child {
  color: var(--blue);
}

.quick-route:hover strong {
  color: var(--teal);
}

.page-intro {
  background: #f5f5f5;
  border-bottom-color: #dddddd;
}

.page-landlords .page-intro, .page-what-we-do .page-intro,
.page-services-expanded .page-intro {
  background: #f4f4f4;
}

.page-activities .page-intro, .page-community-support .page-intro,
.page-company-values .page-intro {
  background: #f5f5f5;
}

.page-success-stories .page-intro, .page-careers .page-intro {
  background: #f3f3f3;
}

.intro-art img {
  mix-blend-mode: normal;
}

.breadcrumbs {
  color: #606060;
}

.breadcrumbs a:hover {
  color: var(--teal-dark);
}

.section-soft {
  background: #f5f5f5;
}

.page-home .section-soft:nth-of-type(odd) {
  background: #f4f4f4;
}

.service-card {
  border-color: #dddddd;
  box-shadow: 0 5px 20px #49494906;
}

.service-card:nth-child(3n+1) {
  border-top-color: #909090;
}

.service-card:nth-child(3n+2) {
  border-top-color: #acacac;
}

.service-card:nth-child(3n+3) {
  border-top-color: #929292;
}

.service-card:nth-child(3n+1) .service-card-art {
  background: #f2f2f2;
}

.service-card:nth-child(3n+2) .service-card-art {
  background: #f6f6f6;
}

.service-card:nth-child(3n+3) .service-card-art {
  background: #f4f4f4;
}

.service-card-art img {
  mix-blend-mode: normal;
}

.card-index {
  color: #636363;
}

.split-media {
  background: #f2f2f2;
}

.plain-list .icon {
  color: var(--teal);
}

.stat-row strong {
  color: var(--teal);
}

.stat-row > :nth-child(2) strong {
  color: var(--terracotta);
}

.stat-row > :nth-child(3) strong {
  color: var(--blue);
}

.step-list li {
  border-left-color: #d0d0d0;
}

.step-list li:last-child {
  border-left-color: transparent;
}

.step-list li::before {
  background: var(--teal-pale);
  border-color: #c4c4c4;
  color: var(--teal-dark);
}

.step-list li:nth-child(2)::before {
  background: var(--gold-pale);
  border-color: #c7c7c7;
  color: #575757;
}

.step-list li:nth-child(3)::before {
  background: var(--blue-pale);
  border-color: #c6c6c6;
  color: var(--blue);
}

.resource-link:hover {
  background: #f9f9f9;
  border-color: #919191;
}

.resource-icon {
  background: var(--teal-pale);
  color: var(--teal);
}

.resource-link:nth-child(4n+2) .resource-icon {
  background: var(--peach);
  color: var(--terracotta);
}

.resource-link:nth-child(4n+3) .resource-icon {
  background: var(--blue-pale);
  color: var(--blue);
}

.resource-link:nth-child(4n+4) .resource-icon {
  background: var(--gold-pale);
  color: #646464;
}

.resource-link > .icon {
  color: var(--teal);
}

.feature-band {
  background: #f7f7f7;
  border-color: #d7d7d7;
}

.feature-band > .icon {
  color: #686868;
}

.next-step {
  background: #292929;
}

.next-step .eyebrow {
  color: #d1d1d1;
}

.next-step p:not(.eyebrow) {
  color: #ebebeb;
}

.next-step .text-link {
  color: #ffffff;
}

.next-step .text-link:hover {
  color: #d8d8d8;
}

.next-step :focus-visible, .utility-bar :focus-visible {
  outline-color: #ffffff;
}

.site-footer {
  background: #f5f5f5;
}

.footer-column > p {
  color: #454545;
}

.footer-column a:hover {
  color: var(--teal-dark);
}

.footer-social a {
  border-color: #c1c1c1;
  color: var(--teal);
  background: #ffffff;
}

.footer-social a:hover {
  background: var(--teal);
  color: #ffffff;
  border-color: var(--teal);
}

.footer-partner-grid img {
  filter: none;
}

.footer-bottom {
  border-color: #d9d9d9;
}

/* Reading, documents and forms keep a restrained palette for clarity. */
.page-index a:hover, .page-index a[aria-current] {
  color: var(--teal-dark);
  border-left-color: var(--teal);
  background: var(--teal-pale);
}

.note-panel {
  background: #f4f4f4;
  border-left-color: var(--teal);
}

.form-card {
  border-color: #dadada;
  box-shadow: 0 8px 32px #50505008;
}

.form-notice {
  background: #f4f4f4;
  color: #555555;
  border-color: #d0d0d0;
}

.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 2px #29292918;
}

.form-field input:focus-visible, .form-field select:focus-visible, .form-field textarea:focus-visible {
  outline-color: var(--teal);
  box-shadow: none;
}

.checkbox-label input {
  accent-color: var(--teal);
}

.form-section > legend {
  color: var(--teal-dark);
}

.form-section-nav a {
  color: var(--teal);
}

.form-section-nav a:hover {
  background: var(--teal-pale);
  color: var(--teal-dark);
}

.form-progress progress {
  color: var(--teal);
}

.form-progress progress::-webkit-progress-value {
  background: var(--teal);
}

.form-progress progress::-moz-progress-bar {
  background: var(--teal);
}

.contact-detail > .icon {
  color: var(--teal);
}

.contact-detail:nth-of-type(2) > .icon {
  color: var(--terracotta);
}

.contact-detail:nth-of-type(3) > .icon {
  color: var(--blue);
}

.accordion summary::after {
  color: var(--teal);
}

.accordion details[open] summary {
  color: var(--teal-dark);
}

.document-viewer {
  border-color: #d4d4d4;
  background: #efefef;
}

.document-toolbar {
  background: #f6f6f6;
  border-bottom-color: #d4d4d4;
}

.document-pages button {
  color: var(--teal-dark);
  background: #ffffff;
  border-color: #b6b6b6;
}

.document-pages button:not(:disabled):hover {
  background: var(--teal-pale);
}

.document-actions .button {
  background: var(--teal);
}

.document-actions .button:hover {
  background: var(--teal-dark);
}

.video-play {
  background: var(--teal);
}

.video-launch:focus-visible {
  outline-color: var(--teal);
}

.value-card {
  background: var(--teal-pale);
  border-top-color: var(--teal);
}

.value-card:nth-child(3n+2) {
  background: var(--gold-pale);
  border-top-color: #868686;
}

.value-card:nth-child(3n+3) {
  background: var(--blue-pale);
  border-top-color: var(--blue);
}

.value-icon {
  color: var(--teal);
}

.value-card:nth-child(3n+2) .value-icon {
  color: #686868;
}

.value-card:nth-child(3n+3) .value-icon {
  color: var(--blue);
}

.publication-cover {
  background: #f0f0f0;
}

.publication-card:nth-child(3n+2) .publication-cover {
  background: #f3f3f3;
}

.publication-card:nth-child(3n+3) .publication-cover {
  background: #f4f4f4;
}

.publication-type {
  color: #5e5e5e;
}

.download-link {
  color: var(--teal);
  border-color: #c7c7c7;
}

.download-link:hover {
  border-color: var(--teal);
  background: var(--teal-pale);
}

.policy-card {
  border-top-color: #9a9a9a;
}

.library-search .icon {
  color: var(--teal);
}

.library-search button {
  color: var(--teal-dark);
}

.job-tags span {
  color: #555555;
  background: #f1f1f1;
  border-color: #cecece;
}

.partner-card:hover {
  border-color: #878787;
}

.partner-name {
  background: #f4f4f4;
}

.partner-card:nth-child(3n+2) .partner-name {
  background: #f3f3f3;
}

.partner-card:nth-child(3n+3) .partner-name {
  background: #f4f4f4;
}

.social-wordmark {
  color: var(--teal);
}

.social-cards .value-card:nth-child(1) {
  background: var(--peach);
  border-top-color: var(--terracotta);
}

.social-cards .value-card:nth-child(1) .social-wordmark {
  color: var(--terracotta);
}

.social-cards .value-card:nth-child(2) {
  background: var(--blue-pale);
  border-top-color: var(--blue);
}

.social-cards .value-card:nth-child(2) .social-wordmark {
  color: var(--blue);
}

.social-cards .value-card:nth-child(3) {
  background: var(--teal-pale);
  border-top-color: var(--teal);
}

.search-result h3 a {
  color: var(--teal-dark);
}

.search-result .eyebrow {
  color: var(--terracotta);
}

mark {
  background: #e0e0e0;
  color: var(--ink);
}

/* Resident welcome and support guide illustrations. */
.guide-picture-step:nth-child(2) .guide-step-art {
  background: var(--gold-pale);
}

.guide-picture-step:nth-child(3) .guide-step-art {
  background: var(--blue-pale);
}

.guide-topic-icon, .journey-icon {
  background: var(--teal-pale);
  color: var(--teal-dark);
}

.guide-topic-grid article:nth-child(2n) .guide-topic-icon,
.support-journey li:nth-child(2) .journey-icon {
  background: var(--blue-pale);
  color: var(--blue);
}

.support-journey li:nth-child(3) .journey-icon {
  background: var(--gold-pale);
  color: #575757;
}

.support-journey li:nth-child(4) .journey-icon {
  background: var(--peach);
  color: var(--terracotta);
}

/* Neutral error states retain explicit messages and borders, not colour alone. */
.form-errors {
  background: #f5f5f5;
  border-color: #606060;
  color: #292929;
}

.field-error {
  color: #292929;
}

.form-field.has-error input:not([type=checkbox]),
.form-field.has-error textarea, .form-field.has-error select {
  border-color: #292929;
}

.button-outline {
  border-color: #767676;
}

@media (forced-colors: active) {
  :focus-visible, .next-step :focus-visible, .utility-bar :focus-visible,
  .form-field input:focus-visible, .form-field select:focus-visible,
  .form-field textarea:focus-visible, .video-launch:focus-visible {
    outline-color: Highlight;
  }

  .button, .button-outline, .button-light {
    border-color: ButtonText;
  }

  .intro-art img, .service-card-art img {
    mix-blend-mode: normal;
    background: #ffffff;
  }

  .footer-partner-grid img {
    mix-blend-mode: normal;
    background: #ffffff;
  }


}

@media print {
  .home-welcome, .page-intro, .section-soft, .feature-band, .value-card,
  .note-panel, .form-card, .document-toolbar, .document-viewer {
    background: #ffffff;
    box-shadow: none;
  }

  .welcome-copy h1 span, .eyebrow, .text-link, .stat-row strong,
  .publication-type, .search-result h3 a, .form-section > legend {
    color: #000000;
  }

  /* Match screen selectors so page-specific surfaces do not override print. */
  .page-landlords .page-intro, .page-what-we-do .page-intro,
  .page-services-expanded .page-intro, .page-activities .page-intro,
  .page-community-support .page-intro, .page-company-values .page-intro,
  .page-success-stories .page-intro, .page-careers .page-intro,
  .page-home .section-soft:nth-of-type(odd),
  .value-card:nth-child(3n+2), .value-card:nth-child(3n+3),
  .social-cards .value-card:nth-child(1), .social-cards .value-card:nth-child(2),
  .social-cards .value-card:nth-child(3) {
    background: #ffffff;
  }

  .stat-row > :nth-child(2) strong, .stat-row > :nth-child(3) strong {
    color: #000000;
  }

  .document-actions .button {
    background: none;
    color: #000000;
  }


}