:root {
  --bg: #ffffff;
  --panel: #ffffff;
  --panel-soft: #edf4fc;
  --card: #ffffff;
  --text: #152440;
  --text-muted: #62728a;
  --line: #dce6f0;
  --blue: #1675ed;
  --blue-2: #3aa1ff;
  --blue-3: #075cc8;
  --navy: #0a1d38;
  --navy-2: #102b50;
  --shadow: 0 24px 55px rgba(15, 44, 82, .12);
  --shadow-soft: 0 14px 36px rgba(15, 44, 82, .08);
}

html { scroll-padding-top: 100px; }
body { overflow-x: clip; background: #fff; }
.page-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  backdrop-filter: none;
  overflow: visible;
}
.container { width: min(1200px, calc(100% - 88px)); }

/* Full-width surfaces with aligned inner content */
.hero, .stats, .testimonials, .site-footer, .copyright, .subpage-hero {
  position: relative;
  isolation: isolate;
}
.hero::before, .stats::before, .testimonials::before,
.site-footer::before, .copyright::before, .subpage-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset-block: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
}
.hero::before { background: radial-gradient(circle at 78% 35%, #dcecff 0%, transparent 33%), linear-gradient(112deg, #f8fbff 0%, #ecf5ff 63%, #eaf3fd 100%); }
.stats::before { background: #0b2342; }
.testimonials::before { background: #f3f7fb; }
.site-footer::before, .copyright::before { background: #091b34; }
.subpage-hero::before { background: linear-gradient(120deg, #f8fbff 0%, #eef5fd 72%, #e9f2fc 100%); }

/* Header */
.topbar { min-height: 86px; padding: 0; gap: 28px; }
.brand-name { font-size: 1.25rem; letter-spacing: -.055em; }
.brand-mark { width: 29px; height: 28px; }
.main-nav { gap: clamp(16px, 2vw, 30px); }
.main-nav a { color: #42536c; font-size: .87rem; font-weight: 600; }
.main-nav a:hover, .main-nav a[aria-current="page"] { color: var(--blue-3); }
.cta-button {
  min-width: 138px;
  height: 44px;
  border-radius: 9px;
  background: #126de0;
  box-shadow: none;
  font-size: .9rem;
  transition: background .2s ease, transform .2s ease;
}
.cta-button:hover, .primary-btn:hover { background: #0759bd; }

/* Hero */
.hero { min-height: 570px; padding: 70px 0 66px; gap: 44px; grid-template-columns: 1.15fr .85fr; }
.hero-copy { padding: 0; }
.kicker, .eyebrow { color: #2868ae; font-size: .74rem; font-weight: 800; letter-spacing: .16em; }
.hero-copy h1 { max-width: 750px; margin: 20px 0 22px; font-size: clamp(3.5rem, 5.2vw, 5.3rem); line-height: 1.03; letter-spacing: -.075em; }
.hero-copy > p:not(.hero-note) { max-width: 610px; font-size: 1.09rem; line-height: 1.75; }
.hero-actions { margin-top: 32px; }
.primary-btn, .secondary-btn { min-width: 172px; height: 50px; border-radius: 9px; box-shadow: none; font-size: .91rem; }
.primary-btn { background: #126de0; }
.secondary-btn { background: rgba(255,255,255,.6); border: 1px solid #cbdced; }
.hero-note { max-width: 540px; margin-top: 30px !important; color: #607088; }
.hero-visual { min-height: 440px; }
.display-panel { height: 420px; }
.platform-ring { border-color: rgba(23, 126, 247, .54); }
.mini-badge, .floating-card { border-radius: 12px; box-shadow: 0 12px 28px rgba(17, 63, 117, .12); }

/* Capabilities strip */
.stats { padding: 0; gap: 0; }
.stat-item { min-height: 146px; padding: 30px 20px; text-align: left; border: 0; border-right: 1px solid rgba(255,255,255,.15); border-radius: 0; background: transparent; }
.stat-item:first-child { border-left: 1px solid rgba(255,255,255,.15); }
.stat-icon { width: auto; height: auto; background: transparent; color: #61adff; font-size: 1.1rem; }
.stat-value { margin-top: 12px; color: #fff; font-size: 1.25rem; letter-spacing: -.04em; }
.stat-label { margin-top: 6px; color: #b8cce5; font-size: .86rem; }

/* Editorial sections */
.services, .why-us, .projects, .process { padding: 100px 0 0; }
.testimonials { margin-top: 104px; padding: 90px 0 92px; }
.section-head, .section-header-row { align-items: end; margin-bottom: 38px; gap: 32px; }
.section-head h2, .section-header-row h2 { margin-top: 14px; font-size: clamp(2.2rem, 3.25vw, 3.35rem); line-height: 1.12; letter-spacing: -.065em; }
.section-head p, .section-header-row p { line-height: 1.75; }
.inline-link { color: var(--blue-3); font-size: .91rem; font-weight: 700; }

.service-grid, .feature-list, .project-grid, .testimonial-grid { gap: 28px; }
.service-card, .feature-item, .quote-card {
  min-height: 0;
  padding: 28px 8px 35px 0;
  background: transparent;
  border: 0;
  border-top: 1px solid #bed0e2;
  border-radius: 0;
  box-shadow: none;
}
.service-card { padding-bottom: 75px; }
.service-card__icon, .feature-badge { width: 44px; height: 44px; margin-bottom: 28px; border-radius: 10px; background: #edf5ff; font-size: 1rem; }
.service-card h3, .feature-item h3 { font-size: 1.38rem; letter-spacing: -.045em; }
.service-card p, .feature-item p { line-height: 1.75; }
.card-arrow { left: 0; right: auto; bottom: 21px; width: 36px; height: 36px; border: 1px solid #d2e1f0; border-radius: 50%; background: transparent; font-size: 1.1rem; }
.card-arrow:hover { background: #e8f2ff; }
.feature-item { padding-bottom: 24px; }
.feature-badge { display: grid; }
.feature-item h3 { margin-top: 0; }

/* Project previews remain the visual feature */
.project-card { border: 0; border-radius: 12px; box-shadow: none; }
.project-preview { height: 245px; }
.project-info { padding: 24px; }
.project-info h3 { font-size: 1.38rem; }
.project-detail { text-decoration: none; font-size: .85rem; border-bottom: 1px solid currentColor; padding-bottom: 3px; }
.project-detail:hover { opacity: .7; }

.process-grid { gap: 26px; }
.step-card { min-height: 0; padding: 22px 4px 12px 0; border: 0; border-top: 1px solid #bed0e2; border-radius: 0; background: transparent; }
.step-number { padding: 0; min-width: 0; height: auto; background: none; color: var(--blue-3); font-size: .9rem; }
.step-card h3 { font-size: 1.5rem; }
.quote-card { border-color: #b9ccdf; }
.quote-card h3 { font-size: 1.28rem; }
.quote-card p { line-height: 1.75; }

/* Full-width dark invitation */
.cta-banner { margin-top: 0; margin-bottom: 0; padding: 68px 0; border-radius: 0; background: none; box-shadow: none; isolation: isolate; position: relative; }
.cta-banner::before { content: ""; position: absolute; z-index: -1; inset-block: 0; left: 50%; width: 100vw; transform: translateX(-50%); background: linear-gradient(110deg, #0b2343 0%, #0a3e79 100%); }
.cta-banner__text p { font-size: clamp(2.1rem, 3.2vw, 3.2rem); }
.cta-banner__text span { color: #c7d8eb; }
.cta-button.alt { border: 1px solid rgba(255,255,255,.65); border-radius: 9px; background: transparent; }
.cta-button.alt:hover { background: rgba(255,255,255,.12); }

/* Footer */
.site-footer { padding: 72px 0 55px; gap: 80px; }
.footer-brand-block p, .footer-links a { color: #b8c8dc; }
.footer-brand .brand-name, .footer-links h4 { color: #fff; }
.footer-links h4 { font-size: 1rem; }
.footer-links a:hover, .copyright a:hover { color: #fff; }
.copyright { padding: 23px 0 28px; border-top: 1px solid rgba(255,255,255,.16); color: #9eb2cd; }

/* Inner pages */
.subpage-hero { padding: 88px 0 82px; }
.subpage-hero h1 { max-width: 920px; font-size: clamp(3rem, 5vw, 5rem); }
.subpage-hero p { max-width: 740px; }
.content-section { padding: 90px 0 0; }
.content-section + .content-section { padding-top: 74px; }
.content-section:last-of-type { padding-bottom: 95px; }
.detail-grid { gap: 28px 40px; }
.detail-card { padding: 32px 15px 36px 0; border: 0; border-top: 1px solid #bfcede; border-radius: 0; background: transparent; box-shadow: none; }
.detail-icon { width: 46px; height: 46px; border-radius: 10px; }
.detail-card h2 { font-size: clamp(1.6rem, 2.4vw, 2.15rem); }
.detail-card h3 { color: #1e3859; }
.detail-card a { display: inline-block; padding-bottom: 3px; border-bottom: 1px solid currentColor; }
.split-content { padding: 12px 0; }
.notice-panel { padding: 44px 48px; border: 0; border-radius: 12px; background: #edf5fd; box-shadow: none; }
.contact-primary, .contact-aside { padding: 42px; border: 0; border-radius: 12px; box-shadow: none; }
.contact-primary { background: #edf5fd; }
.contact-aside { background: #f7f9fc; }
.policy-content { max-width: 840px; padding: 0 0 30px; border: 0; border-radius: 0; background: none; box-shadow: none; }
.policy-content h2:not(:first-child) { margin-top: 38px; }

@media (max-width: 1100px) {
  .container { width: min(1200px, calc(100% - 64px)); }
  .hero { grid-template-columns: 1fr; padding-top: 70px; gap: 8px; }
  .hero-visual { min-height: 400px; }
  .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .site-footer { gap: 42px; }
}

@media (max-width: 900px) {
  .topbar { min-height: 76px; }
  .mobile-menu nav { top: calc(100% - 2px); border: 1px solid #d7e4f0; border-radius: 10px; }
  .services, .why-us, .projects, .process { padding-top: 76px; }
  .testimonials { margin-top: 80px; padding: 74px 0; }
  .section-head, .section-header-row { flex-wrap: wrap; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-item:nth-child(odd) { border-left: 1px solid rgba(255,255,255,.15); }
  .stat-item { border-bottom: 1px solid rgba(255,255,255,.15); }
}

@media (max-width: 760px) {
  .container { width: min(1200px, calc(100% - 40px)); }
  .page-shell { margin: 0; border-radius: 0; }
  .topbar { min-height: 72px; }
  .hero { min-height: 0; padding: 56px 0 34px; }
  .hero-copy h1 { font-size: clamp(2.75rem, 10vw, 4rem); }
  .hero-copy > p:not(.hero-note) { font-size: 1rem; }
  .hero-actions { display: flex; flex-direction: row; align-items: stretch; }
  .hero-actions a { flex: 1 1 0; height: 50px; }
  .hero-visual { min-height: 290px; }
  .section-head, .section-header-row { margin-bottom: 28px; }
  .section-head h2, .section-header-row h2 { font-size: clamp(2rem, 8vw, 2.6rem); }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-item { min-height: 130px; padding: 24px 16px; }
  .services, .why-us, .projects, .process { padding-top: 66px; }
  .service-grid, .feature-list, .project-grid, .process-grid, .testimonial-grid { gap: 14px; }
  .service-card, .feature-item, .step-card, .quote-card { padding-top: 25px; }
  .project-card { margin-bottom: 8px; }
  .testimonials { margin-top: 68px; padding: 64px 0; }
  .cta-banner { padding: 56px 0; }
  .site-footer { padding: 56px 0 40px; }
  .subpage-hero { padding: 64px 0 58px; }
  .subpage-hero h1 { font-size: clamp(2.7rem, 10vw, 4rem); }
  .content-section, .content-section + .content-section { padding-top: 58px; }
  .content-section:last-of-type { padding-bottom: 68px; }
  .detail-grid { gap: 4px; }
  .detail-card { padding: 28px 4px 36px 0; }
  .contact-primary, .contact-aside, .notice-panel { padding: 28px; }
}

@media (max-width: 520px) {
  .container { width: calc(100% - 36px); }
  .hero-copy h1 { font-size: clamp(2.55rem, 9vw, 2.8rem); }
  .hero-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .hero-actions a { width: 100%; height: 50px; flex: none; }
  .stat-item { padding-inline: 12px; }
  .stat-value { font-size: 1.1rem; }
  .footer-links { gap: 30px; }
}
