:root {
  --ink: #17052d;
  --cream: #f1eafd;
  --paper: #fcfaff;
  --copper: #9745ff;
  --line: #d9c9ee;
  --muted: #655d70;
}
.menu-toggle { min-height: 44px; border-color: #c9acee; color: #17052d; }
.site-header { min-height: 96px; height: auto; background: #130528; max-width: none; padding-left: max(20px, calc((100vw - 1180px)/2)); padding-right: max(20px, calc((100vw - 1180px)/2)); }
.site-header #nav a { color: #fff; }
.site-header .button-small { background: #9745ff; border-color: #9745ff; }
.site-header .button-small { min-height: 44px; }
.language-control select { min-height: 44px; padding: 0 32px 0 11px; border: 1px solid #b981ff; border-radius: 7px; background: #2a0b49; color: #fff; font-weight: 750; cursor: pointer; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.brand-logo { display: block; width: 250px; height: 96px; flex: 0 0 auto; background-color: #130528; background-position: center 50%; background-size: 165% auto; background-repeat: no-repeat; border-radius: 8px; text-indent: -9999px; overflow: hidden; }
.footer-logo { width: 250px; height: 96px; }
.hero { position: relative; }
.hero::before { content: ''; position: absolute; width: 250px; height: 250px; right: 28%; top: 4%; border-radius: 50%; background: #9745ff18; filter: blur(2px); z-index: -1; }
.button { background: #17052d; border-color: #17052d; }
.button:hover { background: #9745ff; border-color: #9745ff; }
.button-outline { background: transparent; color: #17052d; }
.button.light { background: #fff; border-color: #fff; color: #3b1268; }
.button.light:hover { background: #f1eafd; border-color: #f1eafd; color: #17052d; }
.button.ghost { background: transparent; border-color: #fff; color: #fff; }
.button.ghost:hover { background: #fff; border-color: #fff; color: #3b1268; }
.designer { background: linear-gradient(135deg, #130528, #29104a); }
.designer-demo { background: #dccbed; }
.designer-examples { display: grid; grid-template-columns: 1.25fr .75fr; gap: 10px; width: 100%; max-width: 680px; margin: auto; }
.designer-examples a { position: relative; min-height: 410px; overflow: hidden; background: #2b1247; color: #fff; text-decoration: none; border: 1px solid #6f3c9d; }
.designer-examples img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.designer-examples a:last-child img { object-position: center center; }
.designer-examples span { position: absolute; left: 12px; right: 12px; bottom: 12px; padding: 13px 14px; background: #130528e8; border: 1px solid #ffffff2e; }
.designer-examples strong, .designer-examples small { display: block; }
.designer-examples small { margin-top: 3px; color: #dfcdf3; }
.final-cta { background: linear-gradient(120deg, #7023c9, #9745ff); }
.service-area { background: #f1eafd; }
.hero-visual { background: #eadffc; }
.category { background: #f2ebfc; }
.category > div { background: #f2ebfc; }
.category.feature { background: #eadffc; }
.category.feature > div { background: #eadffc; }
.category.text-card { background: #dfcff4; }
.category.text-card > div { background: transparent; }
.category h3, .category a { color: #27103f; }
.category p { color: #665473; }
.split img { background: #eee5fa; }
.map-card { background-color: #eee5fa; }
.mobile-bar a { color: #3b1268; }
.ideas-section { display: grid; gap: 36px; align-items: center; }
.ideas-images { display: grid; grid-template-columns: 1.25fr .75fr; gap: 10px; min-height: 360px; }
.ideas-images img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 800px) { .ideas-section { grid-template-columns: 1fr 1fr; } }
@media (max-width: 959px) {
  .site-header { min-height: 72px; }
  .brand-logo { width: 145px; height: 62px; background-size: 170% auto; }
  .menu-toggle { background: #9745ff; border-color: #a95fff; color: #fff; }
  #nav.open { background: #17052d; border: 1px solid #4c2372; }
  .language-control select { width: 100%; }
  .designer-examples { grid-template-columns: 1fr 1fr; }
  .designer-examples a { min-height: 280px; }
}
@media (max-width: 560px) {
  .designer-examples { grid-template-columns: 1fr; }
  .designer-examples a { min-height: 260px; }
}
