* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 0; background: var(--color-page); color: var(--color-text); font-family: "Segoe UI", Arial, sans-serif; font-size: 16px; line-height: 1.5; text-rendering: optimizeLegibility; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible { outline: none; box-shadow: var(--focus-ring); }
button { color: inherit; font: inherit; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.15; letter-spacing: -.025em; }
.site-shell { --site-bar-height: 68px; --idcad-footer-height: 96px; display: flex; min-height: 100vh; padding-bottom: calc(var(--idcad-footer-height) + 1px); flex-direction: column; }
.site-shell > main { flex: 1 0 auto; }
.container { width: min(calc(50vw + 740px), calc(100% - 32px)); margin-inline: auto; }

.topbar { position: sticky; z-index: 50; top: 0; border-bottom: 1px solid var(--color-border); background: var(--color-footer); }
.topbar-inner { display: grid; grid-template-columns: auto 1fr auto; gap: 28px; align-items: center; min-height: var(--site-bar-height); }
.brand { display: inline-flex; gap: 12px; align-items: center; color: var(--color-text); font-weight: 700; text-decoration: none; }
.brand-logo { display: block; width: 66px; height: 44px; object-fit: contain; }
.brand-text { display: block; font-size: 1.35rem; line-height: 1.05; white-space: nowrap; }
.main-nav { display: flex; gap: 26px; justify-content: center; }
.main-nav a { position: relative; color: var(--color-text-secondary); font-size: .9rem; font-weight: 600; text-decoration: none; }
.main-nav a::after { position: absolute; right: 0; bottom: -9px; left: 0; height: 2px; background: var(--color-icon); content: ""; opacity: 0; transform: scaleX(.4); transition: 160ms ease; }
.main-nav a:hover, .main-nav a[aria-current] { color: var(--color-text); }
.main-nav a:hover::after, .main-nav a[aria-current]::after { opacity: 1; transform: scaleX(1); }
.topbar-actions { display: flex; gap: 8px; align-items: center; }
.icon-button, .menu-button { display: inline-grid; width: 38px; height: 38px; padding: 0; border: 1px solid var(--color-border-soft); border-radius: 3px; background: var(--color-window); cursor: pointer; place-items: center; transition: background 140ms ease, border-color 140ms ease, color 140ms ease; }
.icon-button:hover, .menu-button:hover { border-color: var(--color-icon); }
.menu-button { display: none; }
.theme-glyph { width: 17px; height: 17px; border: 2px solid var(--color-icon); border-radius: 50%; }

.services-hero { padding: 42px 0 34px; background: var(--color-page); }
.services-hero-heading { text-align: center; }
.services-hero-heading h1 { max-width: none; margin: 0; color: var(--color-text-primary); font-size: clamp(2.15rem, 3.4vw, 3.55rem); font-weight: 650; line-height: 1.15; }
.services-hero-heading p { max-width: none; margin: 14px auto 0; color: var(--color-text-secondary); font-size: .96rem; line-height: 1.6; }
.services-section { padding: 48px 0 64px; }
.feature-section-heading { margin-bottom: 20px; }
.section-accent-title { display: inline-flex; gap: 9px; align-items: center; margin: 0 0 10px; color: var(--color-text-primary); font-size: clamp(1.25rem, 2vw, 1.55rem); font-weight: 700; letter-spacing: .04em; line-height: 1.25; text-transform: uppercase; }
.section-accent-title::before { width: 26px; height: 2px; background: var(--color-accent); content: ""; }
.feature-section-heading p { max-width: none; margin: 0; color: var(--color-text-secondary); font-size: .94rem; line-height: 1.6; }
.services-grid { display: grid; overflow: hidden; border: 1px solid var(--color-border-soft); border-radius: 12px; background: var(--color-window); }
.service-card { display: grid; min-height: 108px; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; padding: 18px 22px; border-bottom: 1px solid var(--color-border-soft); background: var(--color-window); color: var(--color-text); }
.service-card:last-child { border-bottom: 0; }
.service-copy { min-width: 0; }
.service-card h3 { margin: 0 0 9px; font-size: 1.18rem; font-weight: 620; }
.service-card p { margin: 0; color: var(--color-text-secondary); font-size: .84rem; line-height: 1.55; }
.service-action { min-height: 50px; padding-inline: 22px; font-size: 1rem; font-weight: 750; line-height: 1.15; white-space: nowrap; }

.site-footer { position: fixed; z-index: 49; right: 0; bottom: 0; left: 0; height: var(--idcad-footer-height); border-top: 1px solid var(--color-border); background: var(--color-footer); }
.footer-inner { display: grid; min-height: 100%; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; gap: 4px 28px; align-items: center; padding-block: 8px; }
.footer-copy { grid-column: 1; grid-row: 1; margin: 0; color: var(--color-text-muted); font-size: .72rem; white-space: nowrap; }
.footer-legal-links { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-wrap: wrap; gap: 8px; align-self: center; justify-content: flex-end; }
.footer-legal-links a { padding: 7px 10px; border: 1px solid var(--color-border); border-radius: 5px; color: var(--color-text-secondary); font-size: .7rem; text-decoration: none; transition: border-color 140ms ease, color 140ms ease, background 140ms ease; }
.footer-legal-links a:hover { border-color: var(--color-icon); color: var(--color-text); }
.footer-materials-notice { grid-column: 1; grid-row: 2; max-width: 980px; margin: 0; color: var(--color-text-muted); font-size: .66rem; line-height: 1.35; }
.footer-materials-notice a { color: var(--color-text-secondary); }
.footer-materials-notice a:hover { color: var(--color-icon); }

@media (min-width: 981px) {
  .site-shell { --site-bar-height: 60px; }
  body { font-size: 15px; line-height: 1.42; }
  .container { width: min(1380px, calc(100% - 40px)); }
  .topbar-inner { gap: 20px; min-height: var(--site-bar-height); }
  .brand { gap: 10px; font-size: .94rem; }
  .main-nav { gap: 20px; }
  .main-nav a { font-size: .82rem; }
  .icon-button, .menu-button { width: 34px; height: 34px; }
  .theme-glyph { width: 15px; height: 15px; }
}

@media (max-width: 1320px) and (min-width: 981px) {
  .main-nav { position: fixed; z-index: 60; top: 61px; right: 0; left: 0; display: none; flex-direction: column; gap: 0; padding: 12px 15px; border-bottom: 1px solid var(--color-border); background: var(--color-footer); }
  .main-nav.is-open { display: flex; }
  .main-nav a { padding: 13px 10px; border-bottom: 1px solid var(--color-border); }
  .main-nav a:last-child { border-bottom: 0; }
  .main-nav a::after { display: none; }
  .menu-button { display: inline-grid; }
}

@media (max-width: 980px) {
  .container { width: min(100% - 30px, 1480px); }
  .main-nav { position: fixed; z-index: 60; top: 69px; right: 0; left: 0; display: none; flex-direction: column; gap: 0; padding: 12px 15px; border-bottom: 1px solid var(--color-border); background: var(--color-footer); }
  .main-nav.is-open { display: flex; }
  .main-nav a { padding: 13px 10px; border-bottom: 1px solid var(--color-border); }
  .main-nav a:last-child { border-bottom: 0; }
  .main-nav a::after { display: none; }
  .menu-button { display: inline-grid; }
  .services-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .site-shell { --idcad-footer-height: 156px; }
  .topbar-inner { grid-template-columns: 1fr auto; }
  .brand-text { font-size: 1.1rem; }
  .services-hero { padding: 32px 0 28px; }
  .services-hero-heading h1 { font-size: clamp(2rem, 10vw, 2.65rem); }
  .services-section { padding: 38px 0 48px; }
  .service-card { min-height: 0; grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 20px; }
  .service-action { width: 100%; }
  .footer-inner { grid-template-columns: 1fr; grid-template-rows: auto auto auto; gap: 5px; padding-block: 8px; }
  .footer-copy { grid-column: 1; grid-row: 1; max-width: none; white-space: normal; }
  .footer-legal-links { grid-column: 1; grid-row: 2; justify-content: flex-start; }
  .footer-legal-links a { padding: 3px 5px; font-size: .56rem; }
  .footer-materials-notice { grid-column: 1; grid-row: 3; font-size: .58rem; line-height: 1.25; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
