/* 9.10.0: preserve light typography in the dark footer and emphasize borderless cards with surfaces. */
:root {
  --rop-card-on-white: #f1f4f8;
  --rop-card-on-muted: #ffffff;
  --rop-section-muted: #eef2f7;
}

/* Footer uses its own dark theme. Override v9.6 body-wide color rules only here. */
.footer {
  background: #091930;
  color: #f5f8ff;
}
.footer .footer-logo,
.footer .footer-logo:visited,
.footer .footer-main h3,
.footer .footer-main .footer-tel,
.footer .footer-main .footer-tel:visited {
  color: #ffffff !important;
}
.footer .footer-logo span { color: #85bfff !important; }
.footer .footer-main p,
.footer .footer-main small,
.footer .footer-main p a,
.footer .footer-main > div > a:not(.footer-logo):not(.footer-tel),
.footer .footer-main .footer-mini,
.footer .footer-main .footer-link-cta,
.footer .footer-bottom,
.footer .footer-bottom small,
.footer .footer-bottom a,
.footer .footer-bottom a:visited {
  color: #d9e4f2 !important;
}
.footer .footer-main .footer-link-cta { color: #a9d2ff !important; }
.footer .footer-main a:hover,
.footer .footer-bottom a:hover { color: #ffffff !important; }
.footer .footer-bottom { border-top-color: rgba(255,255,255,.15); }

/* A card should be distinguished by fill, not by its border or shadow. */
.services-grid .service-card,
.projects-grid .project-card,
.reviews-section .review-card,
.price-grid .price-card,
.contact-info-grid .contact-detail-card,
.service-info-card,
.sales-note-grid article,
.sales-note-photo-grid .sales-note-card,
.service-aside,
.subservice,
.benefit-grid > div,
.hero-info,
.editorial-panel,
.about-direction,
.about-extra-info,
.about-stage-card,
.reason,
.steps-grid > div,
.process-photo-grid > .process-step,
.calc-setup,
.calc-result-panel,
.contact-map-copy,
.lead-card,
.rop-palette-demo,
.rop-quiz,
.quiz-composer .rop-quiz,
.quiz-intro-aside,
.quiz-aside,
.contact-map-card {
  background-color: var(--rop-card-on-white);
  border: none !important;
  box-shadow: none !important;
  border-radius: 10px;
}
/* Uniform lighter swatches for controls; selected states retain their blue fill. */
.quiz-option-inner,
.rop-palette-tab,
.rop-color-option,
.calc-type,
.calc-extras label { background-color: #f1f4f8; }
.quiz-option input:checked + .quiz-option-inner,
.quiz-option--photo input:checked + .quiz-option-inner,
.rop-palette-tab.is-active,
.rop-color-option.is-active,
.calc-type.is-selected { background-color: #deecff !important; }

/* Stronger white cards in areas with an already tinted canvas. */
.section-soft,
.rehau-section,
.service-work-steps,
.about-steps-section,
.sales-note-section,
.rop-palette-section { background-color: var(--rop-section-muted); }
.section-soft .service-card,
.section-soft .project-card,
.section-soft .review-card,
.rehau-section .rehau-card,
.service-work-steps .service-work-step,
.about-steps-section .about-stage-card,
.sales-note-section .sales-note-card,
.rop-palette-section .rop-palette-demo,
.rop-palette-section .rop-palette-tab,
.rop-palette-section .rop-color-option {
  background-color: var(--rop-card-on-muted);
  border: none !important;
  box-shadow: none !important;
}
/* Quiz section deliberately keeps its pale canvas and clear white form card. */
.quiz-section { background-color: var(--rop-section-muted); }
.quiz-section .rop-quiz,
.quiz-section .quiz-composer .rop-quiz { background-color: #ffffff; }

/* Content over a dark photographic background must remain legible. */
.why-section .reason {
  background-color: rgba(255,255,255,.1);
  border: none !important;
  box-shadow: none !important;
}
.why-section .reason h3,
.why-section .reason p { color: #fff !important; }

/* Non-decorative focus outlines on real controls are kept for keyboard access. */
@media (max-width:620px) {
  .services-grid .service-card,
  .projects-grid .project-card,
  .reviews-section .review-card,
  .rehau-section .rehau-card { border-radius: 10px; }
}