/* Agency polish layer: calmer hierarchy, better contrast, cleaner mobile rhythm. */
:root {
  --agency-ink: #090d12;
  --agency-surface: #f6f3ec;
  --agency-paper: #fffdf8;
  --agency-line: rgba(9, 13, 18, .12);
  --agency-gold: #c7a66a;
  --agency-blue: #245f8f;
  --agency-shadow: 0 18px 54px rgba(7, 12, 18, .16);
}

body {
  background: var(--agency-surface) !important;
}

.site-header {
  padding-top: 14px !important;
}

.nav-shell,
.site-header.is-scrolled .nav-shell {
  min-height: 70px !important;
  border-radius: 10px !important;
  border-color: rgba(255, 255, 255, .12) !important;
  background: rgba(8, 12, 17, .9) !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, .24) !important;
}

.brand,
.site-header.is-scrolled .brand {
  flex-basis: 250px !important;
  margin-left: 12px !important;
  max-width: 250px !important;
}

.brand img,
.site-header.is-scrolled .brand img {
  width: 218px !important;
  height: 54px !important;
  max-height: 54px !important;
}

.nav a {
  min-height: 38px !important;
  border-radius: 8px !important;
  font-weight: 760 !important;
}

.nav-phone {
  min-height: 44px !important;
  border: 1px solid rgba(199, 166, 106, .34) !important;
  background: linear-gradient(135deg, #fff9ea, #e9c77a) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18) !important;
}

.btn {
  min-height: 54px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

.btn-primary {
  background: linear-gradient(135deg, #164e7a, #287caf) !important;
  color: #fff !important;
}

.btn-secondary {
  background: rgba(255, 253, 248, .72) !important;
  border-color: rgba(9, 13, 18, .18) !important;
  color: var(--agency-ink) !important;
}

.hero {
  min-height: 760px !important;
  padding: 132px 0 86px !important;
  color: var(--agency-ink) !important;
}

.hero-bg img {
  filter: saturate(1.02) contrast(1.03) brightness(1.03) !important;
  object-position: center 46% !important;
}

.hero-overlay {
  display: block !important;
  opacity: 1 !important;
  background:
    linear-gradient(90deg, rgba(246, 243, 236, .88) 0%, rgba(246, 243, 236, .66) 42%, rgba(246, 243, 236, .18) 100%),
    linear-gradient(180deg, rgba(246, 243, 236, .26) 0%, rgba(246, 243, 236, .08) 48%, rgba(246, 243, 236, .34) 100%) !important;
}

.hero-copy,
.subhero-copy {
  filter: none;
}

.hero-grid {
  grid-template-columns: minmax(0, 1fr) 340px !important;
  gap: 46px !important;
}

.kicker,
.eyebrow,
.card-label {
  color: var(--agency-gold) !important;
  text-shadow: none !important;
}

.hero h1,
.subhero h1 {
  max-width: 720px !important;
  font-size: clamp(46px, 5.2vw, 66px) !important;
  line-height: 1.01 !important;
  color: var(--agency-ink) !important;
  text-shadow: none !important;
}

.lead,
.lead-sub {
  max-width: 650px !important;
  color: #263241 !important;
  font-weight: 720 !important;
  text-shadow: none !important;
}

.hero-proof article,
.mini-steps article {
  min-height: 104px !important;
  border-color: rgba(9, 13, 18, .13) !important;
  background: rgba(255, 253, 248, .74) !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px) !important;
}

.hero-proof b,
.mini-steps b {
  color: var(--agency-ink) !important;
}

.hero-proof span,
.mini-steps span {
  color: #354253 !important;
}

.hero-proof article::before {
  background: var(--agency-gold) !important;
}

.hero-card,
.software-hero-card {
  border-color: rgba(9, 13, 18, .13) !important;
  background: rgba(255, 253, 248, .78) !important;
  box-shadow: var(--agency-shadow) !important;
}

.hero-card h2,
.software-hero-card h2,
.hero-card p,
.software-hero-card p:not(.card-label) {
  color: var(--agency-ink) !important;
}

.hero-card h2,
.software-hero-card h2 {
  font-size: clamp(25px, 2.4vw, 32px) !important;
}

.trust-panel {
  margin-top: -28px !important;
  padding-bottom: 74px !important;
  background: linear-gradient(180deg, rgba(246, 243, 236, 0) 0, var(--agency-surface) 34px, #ffffff 100%) !important;
}

.trust-grid {
  gap: 14px !important;
}

.trust-grid article,
.trust-grid article:nth-child(n) {
  min-height: 172px !important;
  border-color: rgba(255, 255, 255, .1) !important;
  background: linear-gradient(180deg, #fffdf8 0%, #eef2f5 100%) !important;
  color: var(--agency-ink) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .16) !important;
}

.trust-grid span,
.trust-grid h3,
.trust-grid p {
  color: var(--agency-ink) !important;
}

.trust-grid span {
  color: #9b7a3b !important;
}

.section {
  padding: 92px 0 !important;
}

.section.services,
.software-services {
  color: var(--agency-ink) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f2f5f7 100%) !important;
}

.services .section-head h2,
.services .section-head p:not(.eyebrow),
.software-services .section-head h2,
.software-services .section-head p:not(.eyebrow) {
  color: var(--agency-ink) !important;
}

.services .eyebrow,
.software-services .eyebrow {
  color: #9b7a3b !important;
}

.method,
.workshop,
.light-principle,
.subhero + .light-principle {
  background: linear-gradient(180deg, var(--agency-surface) 0%, #ffffff 100%) !important;
}

.principle {
  color: var(--agency-ink) !important;
  background: linear-gradient(180deg, #f6f3ec 0%, #ffffff 100%) !important;
}

.principle .eyebrow {
  color: #9b7a3b !important;
}

.principle-copy p,
.principle .value-list h3,
.principle .value-list p {
  color: #485363 !important;
}

.principle .value-list article {
  background: #fffdf8 !important;
  border-color: var(--agency-line) !important;
  box-shadow: 0 14px 38px rgba(9, 13, 18, .1) !important;
}

.principle blockquote {
  color: var(--agency-ink) !important;
  background: #fffdf8 !important;
  border-left-color: var(--agency-gold) !important;
}

.section-head h2,
.section h2,
.section-intro h2,
.principle-copy h2,
.workshop-copy h2,
.contact-copy h2 {
  font-size: clamp(36px, 4.2vw, 54px) !important;
  line-height: 1.04 !important;
}

.diagnostic-feature,
.service-card,
.timeline article,
.value-list article,
.contact-facts div,
.contact-cards a,
.action-card,
.form-card {
  border-color: var(--agency-line) !important;
  box-shadow: 0 14px 38px rgba(9, 13, 18, .1) !important;
}

.diagnostic-feature {
  background: var(--agency-paper) !important;
}

.feature-text {
  background: linear-gradient(180deg, #fffdf8, #f1f4f6) !important;
}

.service-card,
.service-card:nth-child(n) {
  min-height: 342px !important;
  background: linear-gradient(180deg, #fffdf8 0%, #eef2f5 100%) !important;
}

.service-card::before {
  width: 4px !important;
  background: var(--agency-gold) !important;
}

.service-card h3,
.timeline h3,
.value-list h3 {
  color: var(--agency-ink) !important;
}

.service-card a,
.service-card-action a {
  color: #164e7a !important;
}

.service-card.service-card-dark {
  background: linear-gradient(180deg, #f9f7f0 0%, #e8edf1 100%) !important;
  border-color: rgba(199, 166, 106, .34) !important;
}

.service-card.service-card-dark h3,
.service-card.service-card-dark p,
.service-card.service-card-dark a {
  color: var(--agency-ink) !important;
}

.photo-main,
.photo-small {
  border-width: 6px !important;
  box-shadow: var(--agency-shadow) !important;
}

.contact-section {
  color: var(--agency-ink) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f6f3ec 100%) !important;
}

.contact-section .eyebrow {
  color: #9b7a3b !important;
}

.contact-copy p {
  color: #485363 !important;
}

.contact-section .contact-cards a {
  background: #fffdf8 !important;
  border-color: var(--agency-line) !important;
}

.contact-section .contact-cards span,
.contact-section .contact-cards b {
  color: var(--agency-ink) !important;
}

.form-card {
  background: #fffdf8 !important;
}

.to-top {
  border-radius: 8px !important;
  background: rgba(9, 13, 18, .82) !important;
}

.subhero {
  min-height: 790px !important;
  padding: 132px 0 96px !important;
  background: var(--agency-surface) !important;
  color: var(--agency-ink) !important;
}

.subhero::before {
  filter: saturate(1.02) contrast(1.03) brightness(1.04) !important;
  background:
    linear-gradient(90deg, rgba(246, 243, 236, .90) 0%, rgba(246, 243, 236, .62) 48%, rgba(246, 243, 236, .12) 100%),
    url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
}

.subhero::after {
  height: 190px !important;
  background: linear-gradient(180deg, rgba(246, 243, 236, 0) 0%, rgba(246, 243, 236, .22) 50%, var(--agency-surface) 100%) !important;
}

.software-hero-card img {
  height: 250px !important;
}

@media (max-width: 1120px) {
  .hero-grid,
  .subhero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .hero-card,
  .software-hero-card {
    max-width: 680px !important;
  }
}

@media (max-width: 980px) {
  .site-header {
    padding-top: 10px !important;
  }

  .nav-shell,
  .site-header.is-scrolled .nav-shell {
    min-height: 66px !important;
  }

  .brand,
  .site-header.is-scrolled .brand {
    flex-basis: auto !important;
    margin-left: 0 !important;
  }

  .brand img,
  .site-header.is-scrolled .brand img {
    width: 186px !important;
    height: 48px !important;
    max-height: 48px !important;
  }

  .menu-toggle {
    width: 46px !important;
    height: 46px !important;
  }

  .nav {
    background: rgba(8, 12, 17, .96) !important;
  }

  .hero,
  .subhero {
    min-height: auto !important;
    padding: 112px 0 58px !important;
  }

  .hero-overlay {
    background:
      linear-gradient(90deg, rgba(246, 243, 236, .84) 0%, rgba(246, 243, 236, .56) 58%, rgba(246, 243, 236, .12) 100%),
      linear-gradient(180deg, rgba(246, 243, 236, .22) 0%, rgba(246, 243, 236, .08) 54%, rgba(246, 243, 236, .30) 100%) !important;
  }

  .subhero::before {
    filter: saturate(1.04) contrast(1.02) brightness(1.08) !important;
    background:
      linear-gradient(90deg, rgba(246, 243, 236, .84) 0%, rgba(246, 243, 236, .52) 58%, rgba(246, 243, 236, .10) 100%),
      url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
  }

  .hero h1,
  .subhero h1 {
    font-size: clamp(36px, 10vw, 52px) !important;
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .hero-proof,
  .mini-steps {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .trust-panel {
    margin-top: 0 !important;
    padding: 22px 0 56px !important;
  }

  .trust-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .container {
    width: min(calc(100% - 28px), var(--max)) !important;
  }

  .site-header {
    padding-top: 8px !important;
  }

  .nav-shell,
  .site-header.is-scrolled .nav-shell {
    min-height: 62px !important;
    padding: 8px 10px 8px 12px !important;
  }

  .brand img,
  .site-header.is-scrolled .brand img {
    width: 156px !important;
    height: 42px !important;
    max-height: 42px !important;
  }

  .hero,
  .subhero {
    padding: 96px 0 46px !important;
  }

  .hero h1,
  .subhero h1 {
    font-size: clamp(33px, 10vw, 42px) !important;
    line-height: 1.05 !important;
  }

  .lead,
  .lead-sub {
    margin-top: 16px !important;
    font-size: 17.25px !important;
    line-height: 1.52 !important;
  }

  .hero-actions {
    grid-template-columns: minmax(0, 1fr) !important;
    margin-top: 24px !important;
  }

  .hero-proof article,
  .mini-steps article {
    min-height: auto !important;
    padding: 17px 18px !important;
  }

  .hero-card,
  .software-hero-card {
    display: none !important;
  }

  .trust-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .trust-grid article {
    min-height: auto !important;
    padding: 22px !important;
  }

  .section {
    padding: 66px 0 !important;
  }

  .section-head {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .diagnostic-feature {
    border-radius: 8px !important;
  }

  .feature-text {
    padding: 28px !important;
  }

  .feature-text h3 {
    font-size: 32px !important;
  }

  .service-card {
    min-height: auto !important;
    padding: 24px !important;
  }

  .method-grid,
  .principle-grid,
  .workshop-grid,
  .contact-grid {
    gap: 34px !important;
  }

  .workshop-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Center-page blue accents: enough brand energy, no visual noise. */
.section-head > div,
.section-intro,
.principle-copy,
.workshop-copy,
.contact-copy {
  position: relative !important;
}

.section-head > div::after,
.section-intro::after,
.principle-copy::after,
.workshop-copy::after,
.contact-copy::after {
  content: "" !important;
  display: block !important;
  width: 72px !important;
  height: 3px !important;
  margin-top: 22px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, var(--strict-blue), rgba(23, 108, 164, .18)) !important;
}

.service-card,
.timeline article,
.value-list article,
.trust-grid article,
.contact-facts div,
.contact-cards a,
.action-card {
  transition: border-color .18s var(--ease), box-shadow .18s var(--ease), transform .18s var(--ease) !important;
}

.service-card:hover,
.timeline article:hover,
.value-list article:hover,
.trust-grid article:hover,
.contact-cards a:hover,
.action-card:hover {
  border-color: rgba(23, 108, 164, .28) !important;
  box-shadow: 0 16px 40px rgba(23, 108, 164, .10) !important;
  transform: translateY(-2px) !important;
}

.diagnostic-feature {
  border-top: 3px solid rgba(23, 108, 164, .72) !important;
}

.feature-text .btn-dark {
  background: var(--strict-blue) !important;
  border-color: var(--strict-blue) !important;
}

.timeline article {
  border-left: 4px solid rgba(23, 108, 164, .72) !important;
}

.value-list article {
  border-top: 3px solid rgba(23, 108, 164, .18) !important;
}

.contact-facts div,
.contact-cards a {
  border-left: 4px solid rgba(23, 108, 164, .62) !important;
}

.form-card {
  border-top: 3px solid rgba(23, 108, 164, .72) !important;
}

@media (max-width: 760px) {
  .section-head > div::after,
  .section-intro::after,
  .principle-copy::after,
  .workshop-copy::after,
  .contact-copy::after {
    width: 58px !important;
    margin-top: 18px !important;
  }
}

/* Readability pass: larger type without breaking the strict visual system. */
html {
  font-size: 19px !important;
}

body {
  font-size: 19px !important;
}

p,
li,
label,
input,
select,
textarea,
.section-head p:not(.eyebrow),
.section-intro p,
.principle-copy p,
.workshop-copy p,
.contact-copy p,
.feature-text p,
.service-card p,
.timeline p,
.value-list p,
.trust-grid p,
.hero-card p:not(.card-label),
.software-hero-card p:not(.card-label),
.form-card p,
.form-note {
  font-size: clamp(18.5px, .22vw + 17.8px, 20px) !important;
  line-height: 1.62 !important;
}

.lead,
.lead-sub {
  font-size: clamp(20px, .35vw + 18.8px, 22px) !important;
  line-height: 1.55 !important;
}

.nav a,
.nav-phone {
  font-size: 16.5px !important;
}

.btn,
button,
input,
select,
textarea {
  font-size: 18px !important;
}

.kicker,
.eyebrow,
.card-label,
.pill,
.service-card>span,
.trust-grid>article>span,
.form-card label {
  font-size: clamp(15.75px, .14vw + 15.2px, 16.75px) !important;
  line-height: 1.42 !important;
}

.hero-proof b,
.mini-steps b,
.contact-facts b,
.contact-cards b,
.action-card b {
  font-size: clamp(19px, .22vw + 18.2px, 20.25px) !important;
}

.hero-proof span,
.mini-steps span,
.image-caption,
.action-card small,
.contact-facts span,
.contact-cards span,
.service-card a,
.footer p,
.to-top {
  font-size: clamp(17px, .18vw + 16.4px, 18.25px) !important;
  line-height: 1.55 !important;
}

.service-card h3,
.timeline h3,
.value-list h3,
.trust-grid h3 {
  font-size: clamp(27px, .8vw + 23px, 31px) !important;
  line-height: 1.12 !important;
}

.section-head h2,
.section h2,
.section-intro h2,
.principle-copy h2,
.workshop-copy h2,
.contact-copy h2,
.feature-text h3 {
  font-size: clamp(39px, 3.9vw, 56px) !important;
}

@media (max-width: 980px) {
  html,
  body {
    font-size: 18.5px !important;
  }

  p,
  li,
  label,
  input,
  select,
  textarea,
  .section-head p:not(.eyebrow),
  .section-intro p,
  .principle-copy p,
  .workshop-copy p,
  .contact-copy p,
  .feature-text p,
  .service-card p,
  .timeline p,
  .value-list p,
  .trust-grid p,
  .form-card p,
  .form-note {
    font-size: 18px !important;
    line-height: 1.6 !important;
  }

  .lead,
  .lead-sub {
    font-size: 18.75px !important;
  }
}

@media (max-width: 760px) {
  html,
  body {
    font-size: 18px !important;
  }

  .hero h1,
  .subhero h1 {
    font-size: clamp(36px, 10vw, 48px) !important;
  }

  .section-head h2,
  .section h2,
  .section-intro h2,
  .principle-copy h2,
  .workshop-copy h2,
  .contact-copy h2,
  .feature-text h3 {
    font-size: clamp(34px, 8vw, 42px) !important;
  }

  .service-card h3,
  .timeline h3,
  .value-list h3,
  .trust-grid h3 {
    font-size: 27px !important;
  }
}

@media (max-width: 420px) {
  .nav-phone {
    display: none !important;
  }

  .hero h1,
  .subhero h1 {
    font-size: 32px !important;
  }
}

/* Balanced agency direction: professional, lighter than the original, not luxury-bright. */
:root {
  --agency-surface: #f5f7fa;
  --agency-paper: #ffffff;
  --agency-gold: #b99657;
  --agency-blue: #176ca4;
}

.hero,
.subhero {
  color: #ffffff !important;
}

.hero-bg img {
  filter: saturate(1.02) contrast(1.03) brightness(1.02) !important;
}

.hero-overlay {
  display: block !important;
  opacity: 1 !important;
  background:
    linear-gradient(90deg, rgba(9, 13, 18, .58) 0%, rgba(9, 13, 18, .34) 46%, rgba(9, 13, 18, .08) 100%),
    linear-gradient(180deg, rgba(9, 13, 18, .10) 0%, rgba(9, 13, 18, .02) 48%, rgba(9, 13, 18, .22) 100%) !important;
}

.subhero::before {
  filter: saturate(1.02) contrast(1.03) brightness(1.02) !important;
  background:
    linear-gradient(90deg, rgba(9, 13, 18, .58) 0%, rgba(9, 13, 18, .34) 48%, rgba(9, 13, 18, .08) 100%),
    url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
}

.hero h1,
.subhero h1 {
  color: #ffffff !important;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .34) !important;
}

.lead,
.lead-sub {
  color: rgba(255, 255, 255, .92) !important;
  text-shadow: 0 8px 22px rgba(0, 0, 0, .30) !important;
}

.kicker,
.subhero-copy .kicker {
  color: #e5c784 !important;
}

.hero-proof article,
.mini-steps article {
  border-color: rgba(255, 255, 255, .48) !important;
  background: rgba(255, 255, 255, .76) !important;
  box-shadow: 0 12px 30px rgba(9, 13, 18, .12) !important;
  backdrop-filter: blur(14px) !important;
}

.mini-steps article {
  min-height: 82px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 18px !important;
}

.mini-steps b {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 8px !important;
  background: rgba(23, 108, 164, .10) !important;
  color: #176ca4 !important;
}

.mini-steps span {
  line-height: 1.35 !important;
}

.hero-proof b,
.mini-steps b {
  color: #0b1118 !important;
}

.hero-proof span,
.mini-steps span {
  color: #344255 !important;
}

.hero-card,
.software-hero-card {
  border-color: rgba(255, 255, 255, .16) !important;
  background: rgba(17, 27, 39, .46) !important;
  box-shadow: 0 18px 54px rgba(7, 12, 18, .22) !important;
}

.hero-card h2,
.software-hero-card h2,
.hero-card p,
.software-hero-card p:not(.card-label) {
  color: #ffffff !important;
}

.trust-panel {
  background: linear-gradient(180deg, rgba(245, 247, 250, 0) 0, #f5f7fa 34px, #ffffff 100%) !important;
}

.section.services,
.software-services,
.method,
.workshop,
.principle,
.light-principle,
.subhero + .light-principle,
.contact-section {
  color: var(--agency-ink) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f5f7fa 100%) !important;
}

.service-card,
.service-card:nth-child(n),
.service-card.service-card-dark,
.timeline article,
.value-list article,
.principle .value-list article,
.contact-facts div,
.contact-cards a,
.contact-section .contact-cards a,
.action-card,
.form-card {
  background: #ffffff !important;
  border-color: rgba(9, 13, 18, .12) !important;
  box-shadow: 0 12px 30px rgba(9, 13, 18, .09) !important;
}

.service-card::before {
  background: #176ca4 !important;
}

.service-card h3,
.service-card.service-card-dark h3,
.service-card.service-card-dark p,
.service-card.service-card-dark a,
.principle .value-list h3,
.principle .value-list p,
.contact-section .contact-cards span,
.contact-section .contact-cards b {
  color: var(--agency-ink) !important;
}

.services .eyebrow,
.software-services .eyebrow,
.principle .eyebrow,
.contact-section .eyebrow {
  color: #176ca4 !important;
}

.btn-secondary {
  background: rgba(255, 255, 255, .78) !important;
  border-color: rgba(255, 255, 255, .62) !important;
  color: #101820 !important;
}

@media (max-width: 980px) {
  .hero-overlay {
    background:
      linear-gradient(90deg, rgba(9, 13, 18, .50) 0%, rgba(9, 13, 18, .24) 62%, rgba(9, 13, 18, .06) 100%),
      linear-gradient(180deg, rgba(9, 13, 18, .08) 0%, rgba(9, 13, 18, .02) 54%, rgba(9, 13, 18, .18) 100%) !important;
  }

  .subhero::before {
    background:
      linear-gradient(90deg, rgba(9, 13, 18, .50) 0%, rgba(9, 13, 18, .24) 62%, rgba(9, 13, 18, .06) 100%),
      url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
  }
}

/* Final 10/10 pass: cohesive agency-grade workshop design. */
:root {
  --final-ink: #0b1118;
  --final-text: #263241;
  --final-muted: #657285;
  --final-blue: #176ca4;
  --final-blue-dark: #172434;
  --final-gold: #c29a4b;
  --final-bg: #f4f7fa;
  --final-card: #ffffff;
  --final-line: rgba(11, 17, 24, .12);
  --final-shadow: 0 18px 48px rgba(11, 17, 24, .10);
}

body {
  background: var(--final-bg) !important;
  color: var(--final-text) !important;
}

.container {
  width: min(calc(100% - 44px), var(--max)) !important;
}

.site-header {
  padding-top: 12px !important;
}

.nav-shell,
.site-header.is-scrolled .nav-shell {
  min-height: 70px !important;
  border-radius: 12px !important;
  background: rgba(23, 36, 52, .91) !important;
  border-color: rgba(255, 255, 255, .16) !important;
  box-shadow: 0 16px 42px rgba(10, 20, 32, .23) !important;
}

.brand,
.site-header.is-scrolled .brand {
  margin-left: 8px !important;
  max-width: 250px !important;
}

.brand img,
.site-header.is-scrolled .brand img {
  width: 214px !important;
  height: 52px !important;
  max-height: 52px !important;
}

.nav a {
  min-height: 38px !important;
  padding: 0 13px !important;
  border-radius: 9px !important;
  color: rgba(255, 255, 255, .86) !important;
  font-size: 15.5px !important;
  font-weight: 780 !important;
}

.nav a:hover,
.nav a:focus-visible,
.nav a[aria-current="page"] {
  background: rgba(255, 255, 255, .14) !important;
  color: #ffffff !important;
}

.nav-phone {
  min-height: 44px !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  color: var(--final-blue-dark) !important;
  box-shadow: 0 10px 24px rgba(10, 20, 32, .16) !important;
}

.hero,
.subhero {
  min-height: 790px !important;
  padding: 128px 0 84px !important;
  color: #ffffff !important;
  background: var(--final-bg) !important;
}

.hero-bg img,
.subhero::before {
  filter: saturate(1.03) contrast(1.04) brightness(1.03) !important;
}

.hero-bg img {
  object-position: center 46% !important;
}

.hero-overlay,
.subhero::before {
  background:
    linear-gradient(90deg, rgba(10, 17, 25, .58) 0%, rgba(10, 17, 25, .36) 42%, rgba(10, 17, 25, .08) 100%),
    linear-gradient(180deg, rgba(10, 17, 25, .05) 0%, rgba(10, 17, 25, .02) 46%, rgba(10, 17, 25, .20) 100%) !important;
}

.subhero::before {
  background:
    linear-gradient(90deg, rgba(10, 17, 25, .58) 0%, rgba(10, 17, 25, .36) 42%, rgba(10, 17, 25, .08) 100%),
    linear-gradient(180deg, rgba(10, 17, 25, .05) 0%, rgba(10, 17, 25, .02) 46%, rgba(10, 17, 25, .20) 100%),
    url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
}

.hero-overlay {
  display: block !important;
  opacity: 1 !important;
}

.hero-grid,
.subhero-grid {
  grid-template-columns: minmax(0, 1fr) 360px !important;
  gap: 58px !important;
  align-items: end !important;
}

.kicker,
.subhero-copy .kicker,
.eyebrow,
.card-label {
  color: #e2bd70 !important;
  letter-spacing: .055em !important;
}

.hero h1,
.subhero h1 {
  max-width: 760px !important;
  color: #ffffff !important;
  font-size: clamp(48px, 5.2vw, 68px) !important;
  line-height: 1.01 !important;
  text-shadow: 0 16px 38px rgba(0, 0, 0, .34) !important;
}

.lead,
.lead-sub {
  max-width: 690px !important;
  color: rgba(255, 255, 255, .92) !important;
  font-weight: 720 !important;
  text-shadow: 0 10px 26px rgba(0, 0, 0, .28) !important;
}

.btn {
  min-height: 54px !important;
  border-radius: 9px !important;
  font-weight: 880 !important;
}

.btn-primary {
  background: linear-gradient(135deg, #176ca4, #2d90c5) !important;
  box-shadow: 0 16px 34px rgba(23, 108, 164, .26) !important;
}

.btn-secondary {
  background: rgba(255, 255, 255, .82) !important;
  border-color: rgba(255, 255, 255, .78) !important;
  color: var(--final-blue-dark) !important;
  box-shadow: none !important;
}

.hero-proof,
.mini-steps {
  gap: 10px !important;
}

.hero-proof article,
.mini-steps article {
  min-height: 96px !important;
  border: 1px solid rgba(255, 255, 255, .34) !important;
  border-top: 3px solid rgba(226, 189, 112, .92) !important;
  background: rgba(255, 255, 255, .76) !important;
  box-shadow: 0 16px 34px rgba(10, 17, 25, .12) !important;
  backdrop-filter: blur(14px) !important;
}

.hero-proof b,
.mini-steps b {
  color: var(--final-ink) !important;
}

.hero-proof span,
.mini-steps span {
  color: #354255 !important;
}

.mini-steps article {
  min-height: 78px !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  padding: 15px 18px !important;
}

.mini-steps b {
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  background: rgba(23, 108, 164, .10) !important;
  color: var(--final-blue) !important;
}

.hero-card,
.software-hero-card {
  border-color: rgba(255, 255, 255, .20) !important;
  background: rgba(23, 36, 52, .62) !important;
  box-shadow: 0 22px 56px rgba(7, 12, 18, .22) !important;
  backdrop-filter: blur(16px) !important;
}

.hero-card h2,
.software-hero-card h2,
.hero-card p,
.software-hero-card p:not(.card-label) {
  color: #ffffff !important;
}

.trust-panel {
  margin-top: -1px !important;
  padding: 46px 0 74px !important;
  background: linear-gradient(180deg, #f4f7fa 0%, #ffffff 100%) !important;
}

.trust-grid {
  gap: 16px !important;
}

.trust-grid article,
.trust-grid article:nth-child(n),
.service-card,
.service-card:nth-child(n),
.service-card.service-card-dark,
.timeline article,
.value-list article,
.principle .value-list article,
.contact-facts div,
.contact-cards a,
.contact-section .contact-cards a,
.action-card,
.form-card {
  background: var(--final-card) !important;
  border: 1px solid var(--final-line) !important;
  border-radius: 8px !important;
  box-shadow: var(--final-shadow) !important;
}

.trust-grid article {
  min-height: 162px !important;
  padding: 26px !important;
}

.trust-grid span {
  color: var(--final-blue) !important;
}

.trust-grid h3,
.trust-grid p,
.service-card h3,
.service-card.service-card-dark h3,
.service-card.service-card-dark p,
.timeline h3,
.value-list h3,
.principle .value-list h3,
.contact-section .contact-cards b {
  color: var(--final-ink) !important;
}

.trust-grid p,
.service-card p,
.timeline p,
.value-list p,
.principle .value-list p,
.contact-copy p,
.workshop-copy p,
.section-head p:not(.eyebrow) {
  color: var(--final-muted) !important;
}

.section,
.section.services,
.software-services,
.method,
.workshop,
.principle,
.light-principle,
.subhero + .light-principle,
.contact-section {
  padding: 88px 0 !important;
  color: var(--final-ink) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f4f7fa 100%) !important;
}

.section:nth-of-type(even),
.method,
.workshop {
  background: linear-gradient(180deg, #f4f7fa 0%, #ffffff 100%) !important;
}

.section-head {
  margin-bottom: 36px !important;
}

.section-head h2,
.section h2,
.section-intro h2,
.principle-copy h2,
.workshop-copy h2,
.contact-copy h2 {
  color: var(--final-ink) !important;
  font-size: clamp(34px, 4vw, 52px) !important;
  line-height: 1.05 !important;
}

.services .section-head h2,
.services .section-head p:not(.eyebrow),
.software-services .section-head h2,
.software-services .section-head p:not(.eyebrow) {
  color: var(--final-ink) !important;
}

.services .eyebrow,
.software-services .eyebrow,
.principle .eyebrow,
.contact-section .eyebrow,
.light-principle .eyebrow {
  color: var(--final-blue) !important;
}

.diagnostic-feature {
  border-color: var(--final-line) !important;
  background: #ffffff !important;
  box-shadow: 0 22px 58px rgba(10, 17, 25, .12) !important;
}

.feature-text {
  background: #ffffff !important;
}

.feature-text h3 {
  color: var(--final-ink) !important;
}

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

.service-card {
  min-height: 330px !important;
  padding: 28px !important;
}

.service-card::before {
  width: 4px !important;
  background: var(--final-blue) !important;
}

.service-card a,
.service-card.service-card-dark a,
.service-card-action a {
  color: var(--final-blue) !important;
}

.principle blockquote {
  color: var(--final-ink) !important;
  background: #ffffff !important;
  border-left-color: var(--final-blue) !important;
}

.contact-section .contact-cards span,
.contact-section .contact-cards b {
  color: var(--final-ink) !important;
}

.form-card input,
.form-card select,
.form-card textarea {
  background: #ffffff !important;
}

.to-top {
  background: rgba(23, 36, 52, .88) !important;
}

@media (max-width: 1120px) {
  .hero-grid,
  .subhero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 34px !important;
  }

  .hero-card,
  .software-hero-card {
    max-width: 620px !important;
  }
}

@media (max-width: 980px) {
  .container {
    width: min(calc(100% - 32px), var(--max)) !important;
  }

  .hero,
  .subhero {
    padding: 104px 0 50px !important;
  }

  .hero-overlay {
    background:
      linear-gradient(90deg, rgba(10, 17, 25, .46) 0%, rgba(10, 17, 25, .22) 62%, rgba(10, 17, 25, .04) 100%),
      linear-gradient(180deg, rgba(10, 17, 25, .04) 0%, rgba(10, 17, 25, .02) 52%, rgba(10, 17, 25, .14) 100%) !important;
  }

  .subhero::before {
    background:
      linear-gradient(90deg, rgba(10, 17, 25, .46) 0%, rgba(10, 17, 25, .22) 62%, rgba(10, 17, 25, .04) 100%),
      linear-gradient(180deg, rgba(10, 17, 25, .04) 0%, rgba(10, 17, 25, .02) 52%, rgba(10, 17, 25, .14) 100%),
      url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
  }

  .hero h1,
  .subhero h1 {
    font-size: clamp(35px, 10vw, 50px) !important;
  }

  .lead,
  .lead-sub {
    font-size: 17.5px !important;
    line-height: 1.55 !important;
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .section,
  .section.services,
  .software-services,
  .method,
  .workshop,
  .principle,
  .light-principle,
  .contact-section {
    padding: 68px 0 !important;
  }
}

@media (max-width: 760px) {
  .nav-shell,
  .site-header.is-scrolled .nav-shell {
    min-height: 62px !important;
    border-radius: 9px !important;
  }

  .brand img,
  .site-header.is-scrolled .brand img {
    width: 156px !important;
    height: 42px !important;
    max-height: 42px !important;
  }

  .hero-card,
  .software-hero-card {
    display: none !important;
  }

  .hero-proof article,
  .mini-steps article {
    min-height: auto !important;
  }

  .mini-steps article {
    grid-template-columns: 42px minmax(0, 1fr) !important;
  }

  .trust-panel {
    padding: 30px 0 62px !important;
  }

  .trust-grid,
  .service-grid,
  .service-grid.six {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .service-card {
    min-height: auto !important;
  }
}

/* Strict cohesion pass: one palette, one card language, one rhythm. */
:root {
  --strict-ink: #101820;
  --strict-text: #344253;
  --strict-muted: #6b7686;
  --strict-blue: #176ca4;
  --strict-blue-2: #235f88;
  --strict-header: #172434;
  --strict-bg: #f5f7fa;
  --strict-panel: #ffffff;
  --strict-soft: #eef2f5;
  --strict-line: rgba(16, 24, 32, .12);
  --strict-line-strong: rgba(16, 24, 32, .18);
  --strict-gold: #c09a4b;
  --strict-shadow: 0 12px 32px rgba(16, 24, 32, .08);
  --strict-shadow-hero: 0 18px 46px rgba(16, 24, 32, .18);
}

html {
  background: var(--strict-bg) !important;
}

body {
  background: var(--strict-bg) !important;
  color: var(--strict-text) !important;
}

.container {
  width: min(calc(100% - 48px), 1160px) !important;
}

.site-header {
  padding-top: 14px !important;
}

.nav-shell,
.site-header.is-scrolled .nav-shell {
  min-height: 68px !important;
  padding: 8px 14px 8px 18px !important;
  border-radius: 10px !important;
  background: rgba(23, 36, 52, .94) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  box-shadow: 0 14px 36px rgba(16, 24, 32, .22) !important;
}

.brand,
.site-header.is-scrolled .brand {
  flex: 0 0 245px !important;
  margin-left: 0 !important;
  max-width: 245px !important;
}

.brand img,
.site-header.is-scrolled .brand img {
  width: 210px !important;
  height: 50px !important;
  max-height: 50px !important;
}

.nav {
  gap: 6px !important;
}

.nav a {
  min-height: 38px !important;
  padding: 0 13px !important;
  border-radius: 7px !important;
  color: rgba(255, 255, 255, .82) !important;
  font-size: 15px !important;
  font-weight: 760 !important;
}

.nav a:hover,
.nav a:focus-visible,
.nav a[aria-current="page"] {
  background: rgba(255, 255, 255, .13) !important;
  color: #ffffff !important;
  transform: none !important;
}

.nav-phone {
  min-height: 42px !important;
  padding: 0 17px !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: var(--strict-header) !important;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  box-shadow: none !important;
}

.hero,
.subhero {
  min-height: 780px !important;
  padding: 126px 0 76px !important;
  color: #ffffff !important;
  background: var(--strict-bg) !important;
}

.hero-bg img,
.subhero::before {
  filter: saturate(1.01) contrast(1.02) brightness(1.02) !important;
}

.hero-overlay {
  display: block !important;
  opacity: 1 !important;
}

.hero-overlay,
.subhero::before {
  background:
    linear-gradient(90deg, rgba(16, 24, 32, .58) 0%, rgba(16, 24, 32, .34) 42%, rgba(16, 24, 32, .08) 100%),
    linear-gradient(180deg, rgba(16, 24, 32, .04) 0%, rgba(16, 24, 32, .00) 48%, rgba(16, 24, 32, .16) 100%) !important;
}

.subhero::before {
  background:
    linear-gradient(90deg, rgba(16, 24, 32, .58) 0%, rgba(16, 24, 32, .34) 42%, rgba(16, 24, 32, .08) 100%),
    linear-gradient(180deg, rgba(16, 24, 32, .04) 0%, rgba(16, 24, 32, .00) 48%, rgba(16, 24, 32, .16) 100%),
    url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
}

.hero-grid,
.subhero-grid {
  grid-template-columns: minmax(0, 1fr) 350px !important;
  gap: 48px !important;
  align-items: end !important;
}

.kicker,
.subhero-copy .kicker {
  color: #f0d48e !important;
  letter-spacing: .05em !important;
  text-shadow: 0 8px 22px rgba(0, 0, 0, .22) !important;
}

.kicker span {
  background: #f0d48e !important;
}

.hero h1,
.subhero h1 {
  max-width: 760px !important;
  color: #ffffff !important;
  font-size: clamp(46px, 5vw, 66px) !important;
  line-height: 1.02 !important;
  text-shadow: 0 14px 34px rgba(0, 0, 0, .30) !important;
}

.lead,
.lead-sub {
  max-width: 680px !important;
  color: rgba(255, 255, 255, .92) !important;
  font-weight: 700 !important;
  text-shadow: 0 8px 22px rgba(0, 0, 0, .25) !important;
}

.btn {
  min-height: 52px !important;
  border-radius: 7px !important;
  font-weight: 840 !important;
  transform: none !important;
}

.btn:hover,
.btn:focus-visible {
  transform: none !important;
}

.btn-primary {
  background: var(--strict-blue) !important;
  border-color: var(--strict-blue) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 28px rgba(23, 108, 164, .24) !important;
}

.btn-dark {
  background: var(--strict-header) !important;
  border-color: var(--strict-header) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.btn-secondary {
  background: rgba(255, 255, 255, .88) !important;
  border-color: rgba(255, 255, 255, .82) !important;
  color: var(--strict-header) !important;
  box-shadow: none !important;
}

.hero-proof,
.mini-steps {
  gap: 12px !important;
}

.hero-proof article,
.mini-steps article {
  min-height: 94px !important;
  border: 1px solid rgba(255, 255, 255, .42) !important;
  border-top: 3px solid var(--strict-gold) !important;
  border-radius: 7px !important;
  background: rgba(255, 255, 255, .82) !important;
  box-shadow: var(--strict-shadow-hero) !important;
  backdrop-filter: blur(12px) !important;
}

.hero-proof b,
.mini-steps b {
  color: var(--strict-ink) !important;
}

.hero-proof span,
.mini-steps span {
  color: var(--strict-text) !important;
}

.mini-steps article {
  min-height: 76px !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  padding: 15px 18px !important;
}

.mini-steps b {
  width: 34px !important;
  height: 34px !important;
  border-radius: 7px !important;
  background: rgba(23, 108, 164, .10) !important;
  color: var(--strict-blue) !important;
}

.hero-card,
.software-hero-card {
  border: 1px solid rgba(255, 255, 255, .20) !important;
  border-radius: 7px !important;
  background: rgba(23, 36, 52, .66) !important;
  box-shadow: 0 18px 46px rgba(16, 24, 32, .18) !important;
  backdrop-filter: blur(14px) !important;
}

.hero-card h2,
.software-hero-card h2,
.hero-card p,
.software-hero-card p:not(.card-label) {
  color: #ffffff !important;
}

.section,
.trust-panel,
.section.services,
.software-services,
.method,
.workshop,
.principle,
.light-principle,
.subhero + .light-principle,
.contact-section {
  color: var(--strict-ink) !important;
  background: var(--strict-bg) !important;
}

.section,
.section.services,
.software-services,
.method,
.workshop,
.principle,
.light-principle,
.contact-section {
  padding: 82px 0 !important;
}

.trust-panel {
  margin-top: 0 !important;
  padding: 48px 0 70px !important;
}

.section::before {
  background: rgba(16, 24, 32, .08) !important;
}

.section-head {
  grid-template-columns: 170px minmax(0, 1fr) !important;
  gap: 32px !important;
  margin-bottom: 34px !important;
}

.eyebrow,
.card-label,
.services .eyebrow,
.software-services .eyebrow,
.principle .eyebrow,
.contact-section .eyebrow,
.light-principle .eyebrow {
  color: var(--strict-blue) !important;
  letter-spacing: .05em !important;
  text-shadow: none !important;
}

.section-head h2,
.section h2,
.section-intro h2,
.principle-copy h2,
.workshop-copy h2,
.contact-copy h2,
.feature-text h3 {
  color: var(--strict-ink) !important;
  font-size: clamp(34px, 3.8vw, 50px) !important;
  line-height: 1.06 !important;
}

.section-head p:not(.eyebrow),
.section-intro p,
.principle-copy p,
.workshop-copy p,
.contact-copy p,
.feature-text p,
.service-card p,
.timeline p,
.value-list p,
.trust-grid p {
  color: var(--strict-muted) !important;
}

.trust-grid {
  gap: 14px !important;
}

.trust-grid article,
.trust-grid article:nth-child(n),
.service-card,
.service-card:nth-child(n),
.service-card.service-card-dark,
.diagnostic-feature,
.timeline article,
.value-list article,
.principle .value-list article,
.contact-facts div,
.contact-cards a,
.contact-section .contact-cards a,
.action-card,
.form-card {
  background: var(--strict-panel) !important;
  border: 1px solid var(--strict-line) !important;
  border-radius: 7px !important;
  box-shadow: var(--strict-shadow) !important;
}

.trust-grid article {
  min-height: 156px !important;
  padding: 24px !important;
}

.trust-grid span,
.service-card a,
.service-card.service-card-dark a,
.service-card.service-card-dark .service-card-action a,
.service-card-action a {
  color: var(--strict-blue) !important;
}

.trust-grid h3,
.service-card h3,
.service-card.service-card-dark h3,
.service-card.service-card-dark p,
.timeline h3,
.value-list h3,
.principle .value-list h3,
.contact-facts b,
.contact-cards b,
.contact-section .contact-cards b {
  color: var(--strict-ink) !important;
}

.diagnostic-feature {
  overflow: hidden !important;
}

.feature-text {
  background: var(--strict-panel) !important;
}

.service-grid {
  gap: 16px !important;
}

.service-card {
  min-height: 320px !important;
  padding: 26px !important;
}

.service-card::before {
  width: 4px !important;
  background: var(--strict-blue) !important;
}

.service-card>span {
  color: var(--strict-blue) !important;
  border-color: rgba(23, 108, 164, .16) !important;
  background: rgba(23, 108, 164, .08) !important;
}

.timeline b,
.contact-facts i {
  background: var(--strict-blue) !important;
  box-shadow: none !important;
}

.value-list span {
  background: var(--strict-blue) !important;
}

.principle blockquote {
  color: var(--strict-ink) !important;
  background: var(--strict-panel) !important;
  border-left-color: var(--strict-blue) !important;
}

.photo-main,
.photo-small {
  border-color: #ffffff !important;
  border-width: 6px !important;
  box-shadow: var(--strict-shadow) !important;
}

.contact-section .contact-cards span,
.contact-section .contact-cards b {
  color: var(--strict-ink) !important;
}

.form-card input,
.form-card select,
.form-card textarea {
  background: #ffffff !important;
  border-color: var(--strict-line-strong) !important;
}

.footer {
  background: var(--strict-header) !important;
}

.to-top {
  background: rgba(23, 36, 52, .90) !important;
}

@media (max-width: 1120px) {
  .hero-grid,
  .subhero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 32px !important;
  }
}

@media (max-width: 980px) {
  .container {
    width: min(calc(100% - 32px), 1160px) !important;
  }

  .site-header {
    padding-top: 8px !important;
  }

  .nav-shell,
  .site-header.is-scrolled .nav-shell {
    min-height: 64px !important;
  }

  .nav {
    background: rgba(23, 36, 52, .98) !important;
  }

  .hero,
  .subhero {
    min-height: auto !important;
    padding: 100px 0 48px !important;
  }

  .hero-overlay {
    background:
      linear-gradient(90deg, rgba(16, 24, 32, .48) 0%, rgba(16, 24, 32, .24) 62%, rgba(16, 24, 32, .05) 100%),
      linear-gradient(180deg, rgba(16, 24, 32, .02) 0%, rgba(16, 24, 32, .00) 50%, rgba(16, 24, 32, .12) 100%) !important;
  }

  .subhero::before {
    background:
      linear-gradient(90deg, rgba(16, 24, 32, .48) 0%, rgba(16, 24, 32, .24) 62%, rgba(16, 24, 32, .05) 100%),
      linear-gradient(180deg, rgba(16, 24, 32, .02) 0%, rgba(16, 24, 32, .00) 50%, rgba(16, 24, 32, .12) 100%),
      url("../img/og-autoremosa-premium-1200.webp") center / cover no-repeat !important;
  }

  .hero h1,
  .subhero h1 {
    font-size: clamp(34px, 9.5vw, 50px) !important;
  }

  .lead,
  .lead-sub {
    font-size: 17px !important;
    line-height: 1.55 !important;
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .section-head {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  .section,
  .section.services,
  .software-services,
  .method,
  .workshop,
  .principle,
  .light-principle,
  .contact-section {
    padding: 64px 0 !important;
  }
}

@media (max-width: 760px) {
  .container {
    width: min(calc(100% - 28px), 1160px) !important;
  }

  .brand img,
  .site-header.is-scrolled .brand img {
    width: 154px !important;
    height: 42px !important;
    max-height: 42px !important;
  }

  .hero-card,
  .software-hero-card {
    display: none !important;
  }

  .hero-proof,
  .mini-steps,
  .trust-grid,
  .service-grid,
  .service-grid.six {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .hero-proof article,
  .mini-steps article,
  .service-card,
  .trust-grid article {
    min-height: auto !important;
  }

  .service-card {
    padding: 24px !important;
  }
}

/* Final readability lock. */
body,
p,
li,
label,
input,
select,
textarea,
.section-head p:not(.eyebrow),
.section-intro p,
.principle-copy p,
.workshop-copy p,
.contact-copy p,
.feature-text p,
.service-card p,
.timeline p,
.value-list p,
.trust-grid p,
.form-card p,
.form-note {
  font-size: 19px !important;
  line-height: 1.62 !important;
}

.lead,
.lead-sub {
  font-size: 21px !important;
  line-height: 1.55 !important;
}

.service-card a,
.service-card-action a,
.hero-proof span,
.mini-steps span,
.contact-facts span,
.contact-cards span,
.image-caption,
.footer p {
  font-size: 18px !important;
  line-height: 1.55 !important;
}

@media (max-width: 760px) {
  body,
  p,
  li,
  label,
  input,
  select,
  textarea,
  .section-head p:not(.eyebrow),
  .section-intro p,
  .principle-copy p,
  .workshop-copy p,
  .contact-copy p,
  .feature-text p,
  .service-card p,
  .timeline p,
  .value-list p,
  .trust-grid p,
  .form-card p,
  .form-note {
    font-size: 18.5px !important;
    line-height: 1.58 !important;
  }

  .lead,
  .lead-sub {
    font-size: 19px !important;
  }
}

/* Final composition lock: controlled line lengths and stronger rhythm. */
.hero-copy,
.subhero-copy {
  max-width: 760px !important;
}

.lead,
.lead-sub {
  max-width: 620px !important;
}

.section-head > div,
.section-intro,
.principle-copy,
.workshop-copy,
.contact-copy {
  max-width: 820px !important;
}

.section-head p:not(.eyebrow),
.section-intro p,
.principle-copy p,
.workshop-copy p,
.contact-copy p {
  max-width: 680px !important;
}

.trust-grid article,
.service-card,
.timeline article,
.value-list article {
  border-top: 3px solid rgba(23, 108, 164, .20) !important;
}

.service-card {
  min-height: 350px !important;
}

.service-grid.six .service-card {
  min-height: 330px !important;
}

.diagnostic-feature {
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr) !important;
}

.feature-text {
  padding: clamp(38px, 4vw, 58px) !important;
}

.feature-text .btn {
  width: min(100%, 440px) !important;
}

.contact-grid,
.method-grid,
.principle-grid,
.workshop-grid {
  gap: clamp(42px, 5vw, 68px) !important;
}

@media (max-width: 980px) {
  .hero-copy,
  .subhero-copy,
  .lead,
  .lead-sub,
  .section-head > div,
  .section-intro,
  .principle-copy,
  .workshop-copy,
  .contact-copy,
  .section-head p:not(.eyebrow),
  .section-intro p,
  .principle-copy p,
  .workshop-copy p,
  .contact-copy p {
    max-width: none !important;
  }

  .diagnostic-feature {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 760px) {
  .service-card,
  .service-grid.six .service-card {
    min-height: auto !important;
  }

  .feature-text {
    padding: 28px !important;
  }
}

/* True final hero focus: the background photo carries the page; side panels stay quiet. */
@media (min-width: 981px) {
  .hero-card img,
  .software-hero-card img {
    display: none !important;
  }

  .hero-card,
  .software-hero-card {
    align-self: end !important;
    max-width: 350px !important;
  }

  .hero-card-content,
  .software-hero-card div {
    padding: 30px !important;
  }

  .hero-card h2,
  .software-hero-card h2 {
    font-size: clamp(28px, 2.2vw, 34px) !important;
    line-height: 1.08 !important;
  }
}

/* Header color trial: graphite-blue instead of black. */
.nav-shell,
.site-header.is-scrolled .nav-shell {
  background: rgba(23, 36, 52, .92) !important;
  border-color: rgba(255, 255, 255, .16) !important;
  box-shadow: 0 14px 34px rgba(14, 25, 38, .24) !important;
}

.nav a:hover,
.nav a:focus-visible,
.nav a[aria-current="page"] {
  background: rgba(255, 255, 255, .13) !important;
}

.menu-toggle {
  background: rgba(255, 255, 255, .10) !important;
  border-color: rgba(255, 255, 255, .20) !important;
}

@media (max-width: 980px) {
  .nav {
    background: rgba(23, 36, 52, .96) !important;
  }
}

/* Final navigation polish: clearer active state and more agency-grade spacing. */
.nav-shell,
.site-header.is-scrolled .nav-shell {
  background:
    linear-gradient(135deg, rgba(31, 48, 68, .96), rgba(18, 30, 44, .94)) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  box-shadow:
    0 18px 46px rgba(9, 20, 33, .28),
    inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}

.nav {
  gap: 4px !important;
  padding: 4px !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 9px !important;
  background: rgba(255, 255, 255, .07) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.nav a {
  position: relative !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  border-radius: 7px !important;
  color: rgba(255, 255, 255, .84) !important;
  font-size: 15.5px !important;
  font-weight: 780 !important;
  letter-spacing: 0 !important;
  transition: background-color .18s ease, color .18s ease, box-shadow .18s ease !important;
}

.nav a:hover,
.nav a:focus-visible {
  background: rgba(255, 255, 255, .11) !important;
  color: #ffffff !important;
}

.nav a[aria-current="page"] {
  background: #ffffff !important;
  color: #142337 !important;
  box-shadow:
    0 10px 24px rgba(7, 17, 29, .18),
    inset 0 -3px 0 #2f7fe4 !important;
}

.nav-phone {
  min-height: 44px !important;
  padding: 0 18px !important;
  border-radius: 8px !important;
  border-color: rgba(255, 255, 255, .82) !important;
  background: linear-gradient(135deg, #ffffff, #edf5ff) !important;
  color: #132235 !important;
  font-size: 15.5px !important;
  font-weight: 830 !important;
  box-shadow:
    0 12px 28px rgba(7, 17, 29, .22),
    inset 0 -2px 0 rgba(47, 127, 228, .28) !important;
}

.nav-phone:hover,
.nav-phone:focus-visible {
  background: #ffffff !important;
  color: #0d1c2d !important;
  transform: translateY(-1px) !important;
}

@media (max-width: 980px) {
  .nav {
    gap: 6px !important;
    padding: 10px !important;
    border-color: rgba(255, 255, 255, .13) !important;
    background: rgba(22, 36, 53, .98) !important;
  }

  .nav a {
    min-height: 46px !important;
    justify-content: center !important;
    font-size: 16px !important;
  }
}

@media (max-width: 760px) {
  .nav-shell,
  .site-header.is-scrolled .nav-shell {
    padding-right: 10px !important;
  }

  .menu-toggle {
    border-radius: 8px !important;
    background: rgba(255, 255, 255, .12) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10) !important;
  }
}

/* Final correction: cleaner header and lighter software hero to match the homepage. */
.nav-shell,
.site-header.is-scrolled .nav-shell {
  background: rgba(23, 36, 52, .93) !important;
  border-color: rgba(255, 255, 255, .16) !important;
  box-shadow: 0 14px 34px rgba(14, 25, 38, .24) !important;
}

.nav {
  gap: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.nav a {
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 7px !important;
  color: rgba(255, 255, 255, .84) !important;
  font-size: 15.8px !important;
  font-weight: 780 !important;
  box-shadow: none !important;
}

.nav a:hover,
.nav a:focus-visible {
  background: rgba(255, 255, 255, .11) !important;
  color: #ffffff !important;
}

.nav a[aria-current="page"] {
  background: rgba(255, 255, 255, .14) !important;
  color: #ffffff !important;
  box-shadow: inset 0 -2px 0 #66a7ff !important;
}

.nav-phone {
  min-height: 42px !important;
  padding: 0 17px !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  border-color: rgba(255, 255, 255, .76) !important;
  color: #152438 !important;
  font-size: 15.8px !important;
  box-shadow: 0 10px 24px rgba(7, 17, 29, .18) !important;
  transform: none !important;
}

.subhero {
  color: var(--strict-ink) !important;
  background: #f6f8fb !important;
}

.subhero::before {
  filter: saturate(1.02) contrast(1.02) brightness(1) !important;
  background:
    linear-gradient(90deg, rgba(16, 24, 32, .10) 0%, rgba(16, 24, 32, .08) 52%, rgba(16, 24, 32, .04) 100%),
    linear-gradient(180deg, rgba(16, 24, 32, .04) 0%, rgba(16, 24, 32, .02) 54%, rgba(16, 24, 32, .10) 100%),
    url("../img/og-1.webp") center/cover no-repeat !important;
}

.subhero::after {
  background: linear-gradient(180deg, rgba(246, 248, 251, 0) 0%, rgba(246, 248, 251, .46) 62%, #f6f8fb 100%) !important;
}

.subhero h1 {
  color: #ffffff !important;
  text-shadow: 0 14px 34px rgba(0, 0, 0, .36) !important;
}

.subhero .lead {
  color: rgba(255, 255, 255, .92) !important;
  text-shadow: 0 10px 26px rgba(0, 0, 0, .34) !important;
}

.subhero-copy .kicker {
  color: #f0d48e !important;
  text-shadow: 0 8px 22px rgba(0, 0, 0, .24) !important;
}

.subhero-copy .kicker span {
  background: #f0d48e !important;
}

.subhero .mini-steps article {
  border-color: rgba(21, 36, 56, .12) !important;
  background: rgba(255, 255, 255, .86) !important;
  box-shadow: 0 16px 36px rgba(19, 35, 54, .12) !important;
}

.software-hero-card {
  border-color: rgba(21, 36, 56, .13) !important;
  background: rgba(255, 255, 255, .84) !important;
  box-shadow: 0 18px 42px rgba(19, 35, 54, .14) !important;
}

.software-hero-card h2,
.software-hero-card p:not(.card-label) {
  color: var(--strict-ink) !important;
}

.software-hero-card .card-label {
  color: #2f6fb8 !important;
  text-shadow: none !important;
}

@media (max-width: 980px) {
  .nav {
    padding: 10px !important;
    border: 1px solid rgba(255, 255, 255, .13) !important;
    background: rgba(23, 36, 52, .98) !important;
  }

  .nav a[aria-current="page"] {
    background: rgba(255, 255, 255, .15) !important;
  }
}

/* Hero text readability: soft tinted plate behind the main copy only. */
.hero-copy,
.subhero-copy {
  position: relative !important;
  max-width: 790px !important;
  padding: 30px 32px 32px !important;
  border: 1px solid rgba(255, 255, 255, .20) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(11, 18, 28, .54), rgba(16, 28, 43, .38)) !important;
  box-shadow:
    0 24px 60px rgba(4, 12, 22, .24),
    inset 0 1px 0 rgba(255, 255, 255, .12) !important;
  backdrop-filter: blur(8px) saturate(1.04) !important;
}

.hero-copy .kicker,
.subhero-copy .kicker {
  margin-top: 0 !important;
}

.hero-copy .lead-sub,
.subhero-copy .lead-sub,
.hero-copy .lead + .lead,
.subhero-copy .lead + .lead {
  margin-top: 12px !important;
}

@media (max-width: 980px) {
  .hero-copy,
  .subhero-copy {
    padding: 24px 22px 26px !important;
    border-radius: 8px !important;
    background:
      linear-gradient(135deg, rgba(11, 18, 28, .58), rgba(16, 28, 43, .44)) !important;
  }
}

@media (max-width: 420px) {
  .hero-copy,
  .subhero-copy {
    padding: 21px 18px 23px !important;
  }
}

/* Keep the tinted area around the headline text only, not the action controls. */
.hero-copy,
.subhero-copy {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.hero-text-plate {
  max-width: 790px !important;
  padding: 30px 32px 32px !important;
  border: 1px solid rgba(255, 255, 255, .20) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(11, 18, 28, .54), rgba(16, 28, 43, .38)) !important;
  box-shadow:
    0 24px 60px rgba(4, 12, 22, .24),
    inset 0 1px 0 rgba(255, 255, 255, .12) !important;
  backdrop-filter: blur(8px) saturate(1.04) !important;
}

.hero-text-plate .kicker {
  margin-top: 0 !important;
}

.hero-text-plate .lead:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 980px) {
  .hero-text-plate {
    padding: 24px 22px 26px !important;
    background:
      linear-gradient(135deg, rgba(11, 18, 28, .58), rgba(16, 28, 43, .44)) !important;
  }
}

@media (max-width: 420px) {
  .hero-text-plate {
    padding: 21px 18px 23px !important;
  }
}

/* Final agency QA: refined depth, anchor behavior, and consistent premium surfaces. */
html {
  scroll-padding-top: 104px !important;
}

#teenused,
#tooviis,
#tookoda,
#kkk,
#kontakt,
#tarkvara-kkk {
  scroll-margin-top: 104px !important;
}

.hero-text-plate {
  position: relative !important;
  overflow: hidden !important;
  background:
    linear-gradient(135deg, rgba(8, 14, 22, .50), rgba(16, 28, 43, .34)) !important;
  box-shadow:
    0 22px 54px rgba(4, 12, 22, .22),
    inset 0 1px 0 rgba(255, 255, 255, .13) !important;
  backdrop-filter: blur(7px) saturate(1.04) !important;
}

.hero-text-plate::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 32px !important;
  width: 118px !important;
  height: 2px !important;
  background: linear-gradient(90deg, #e8c978, rgba(232, 201, 120, 0)) !important;
}

.hero-proof article,
.mini-steps article,
.service-card,
.value-list article,
.timeline article,
.contact-cards a,
.action-card,
.form-card {
  border-radius: 7px !important;
}

.hero-proof article,
.mini-steps article {
  box-shadow:
    0 18px 36px rgba(8, 18, 32, .13),
    inset 0 1px 0 rgba(255, 255, 255, .70) !important;
}

.service-card,
.value-list article,
.timeline article,
.contact-cards a,
.form-card {
  box-shadow:
    0 18px 42px rgba(18, 31, 48, .08),
    inset 0 1px 0 rgba(255, 255, 255, .78) !important;
}

.service-card:hover,
.contact-cards a:hover,
.action-card:hover {
  border-color: rgba(47, 127, 228, .28) !important;
  box-shadow:
    0 22px 48px rgba(18, 31, 48, .12),
    inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}

.form-card input,
.form-card select,
.form-card textarea {
  border-color: rgba(20, 35, 55, .14) !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(20, 35, 55, .04) !important;
}

.form-card input:focus,
.form-card select:focus,
.form-card textarea:focus {
  border-color: rgba(47, 127, 228, .48) !important;
  box-shadow:
    0 0 0 4px rgba(47, 127, 228, .12),
    inset 0 1px 0 rgba(20, 35, 55, .04) !important;
}

@media (max-width: 980px) {
  html {
    scroll-padding-top: 86px !important;
  }

  #teenused,
  #tooviis,
  #tookoda,
  #kkk,
  #kontakt,
  #tarkvara-kkk {
    scroll-margin-top: 86px !important;
  }

  .hero-text-plate::before {
    left: 22px !important;
    width: 92px !important;
  }
}
