@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root { color-scheme: light; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #f7f7f9; }
a { text-underline-offset: 4px; }

.site-shell { min-height: 100vh; background: #f7f7f9; color: #252629; }
.site-container { max-width: 1440px !important; padding: 0 6vw !important; }
.site-header { min-height: 110px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #cfd3d6; font-size: .82rem; font-weight: 700; }
.wordmark { display: block; flex: 0 0 auto; }
.brand-logo-frame { display: block; position: relative; width: 100px; height: 72px; overflow: hidden; }
.brand-logo { position: absolute; width: 148px; max-width: none; height: auto; left: -23px; top: -30px; }
.site-header nav a { transition: opacity .2s ease; }
.site-header nav a:hover { opacity: .55; }
.nav-contact { border-bottom: 2px solid #252629; padding-bottom: 3px; }

.hero { min-height: calc(100vh - 96px); display: flex; flex-direction: column; justify-content: center; padding: 9vw 0 6vw; }
.eyebrow, .case-kicker { color: #405463; font-size: .8rem !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase; }
.hero h1 { max-width: 1150px; margin-top: 32px; font-size: clamp(3.5rem, 7.4vw, 7.4rem); line-height: .94; }
.hero h1 span { color: #405463; }
.hero-bottom { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; margin-top: 64px; }
.hero-intro { max-width: 430px; font-size: clamp(1.25rem, 2vw, 1.7rem) !important; font-weight: 600 !important; line-height: 1.3 !important; }
.MuiButton-root { min-height: 48px; padding: 11px 19px !important; box-shadow: none !important; }
.MuiButton-contained { background: #252629 !important; }
.MuiButton-outlined { border-color: #252629 !important; color: #252629 !important; }

.rule-top { border-top: 1px solid #aeb5ba; }
.split-section { display: grid; grid-template-columns: minmax(240px, .8fr) 2fr; gap: 8vw; padding: 96px 0; }
.section-heading h2 { margin-top: 22px; font-size: clamp(2rem, 3vw, 3.3rem); }
.section-number { display: inline-grid; place-items: center; min-width: 30px; height: 24px; padding: 0 4px; background: #405463; color: white; font-size: .77rem; font-weight: 800; letter-spacing: .03em; }
.capability-list { border-top: 1px solid #252629; }
.capability-row { display: grid; grid-template-columns: 64px 1fr; align-items: center; gap: 20px; padding: 22px 0; border-bottom: 1px solid #cfd3d6; }
.capability-row p { font-size: clamp(1.3rem, 2.1vw, 2.15rem); font-weight: 600; letter-spacing: -.025em; }
.capability-index { color: #6c7981; font-size: .74rem !important; font-weight: 700 !important; }
.engagement-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.engagement-grid h3 { margin-bottom: 18px; font-weight: 750; }
.engagement-grid p { max-width: 440px; color: #405463; font-size: 1.05rem; line-height: 1.7; }

.statement { padding: 120px 0; }
.statement h2 { max-width: 970px; margin: 32px 0; font-size: clamp(3rem, 6vw, 6.2rem); line-height: .98; }
.statement-copy { max-width: 720px; margin-left: auto !important; color: #405463; font-size: clamp(1.15rem, 1.8vw, 1.55rem) !important; line-height: 1.5 !important; }

.case-study { display: grid; grid-template-columns: .9fr 1.4fr; gap: 9vw; padding: 112px 0; }
.case-title .case-kicker { margin: 28px 0 14px; }
.case-title h2 { font-size: clamp(3rem, 5vw, 5rem); line-height: .95; }
.case-title h3 { margin-top: 32px; color: #405463; font-weight: 700; line-height: 1.35; }
.case-body > p { margin: 0 0 26px; font-size: 1.08rem; line-height: 1.7; }
.impact-block { margin: 48px 0 34px; }
.impact-label { margin-bottom: 18px !important; color: #405463; font-size: .78rem !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase; }
.impact-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #252629; }
.impact-grid > div { display: flex; flex-direction: column; min-height: 150px; padding: 24px 24px 24px 0; border-bottom: 1px solid #cfd3d6; }
.impact-grid > div:nth-child(odd) { border-right: 1px solid #cfd3d6; }
.impact-grid > div:nth-child(even) { padding-left: 24px; }
.impact-grid strong { font-size: clamp(1.5rem, 2.5vw, 2.5rem); letter-spacing: -.04em; }
.impact-grid span { margin-top: auto; color: #405463; }
.text-link { display: inline-flex; align-items: center; gap: 7px; color: #252629 !important; font-weight: 700 !important; }

.secondary-case { display: grid; grid-template-columns: .9fr 1.4fr; gap: 9vw; padding: 88px 0; }
.secondary-case .case-kicker { margin-top: 28px; }
.secondary-case h2 { margin-bottom: 24px; font-size: clamp(2.2rem, 4vw, 4.2rem); }
.secondary-case p { max-width: 740px; color: #405463; font-size: 1.08rem; line-height: 1.7; }
.secondary-case-link { margin-top: 28px !important; }
.contact { display: grid; grid-template-columns: .9fr 1fr; gap: 9vw; padding: 128px 0; }
.contact h2 { margin: 30px 0; font-size: clamp(3rem, 5.5vw, 5.8rem); line-height: .96; }
.contact-intro > p:last-child { max-width: 550px; color: #405463; font-size: 1.08rem; line-height: 1.7; }
.contact-form { position: relative; display: grid; gap: 18px; align-content: start; padding-top: 4px; }
.contact-fields-two { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.contact-form .MuiOutlinedInput-root { background: #fff; border-radius: 0; }
.contact-form .MuiOutlinedInput-notchedOutline { border-color: #aeb5ba; }
.contact-form .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline { border-color: #405463; }
.contact-form .Mui-focused .MuiOutlinedInput-notchedOutline { border-color: #252629 !important; border-width: 1px !important; }
.contact-form .MuiInputLabel-root.Mui-focused { color: #252629; }
.contact-form .MuiButton-root { justify-self: start; min-width: 170px; }
.contact-note { color: #6c7981; font-size: .76rem !important; }
.contact-honeypot { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.site-footer { display: grid; grid-template-columns: 1.3fr 1fr auto; gap: 30px; align-items: end; padding: 44px 0; border-top: 1px solid #252629; color: #405463; font-size: .8rem; }
.site-footer > div:first-child { display: flex; flex-direction: column; gap: 4px; }
.site-footer a { color: inherit; }
.site-footer button { padding: 0; border: 0; background: none; font: inherit; cursor: pointer; text-align: left; }
.consent-banner { position: fixed; z-index: 20; right: 22px; bottom: 22px; display: flex; align-items: center; gap: 28px; max-width: 620px; padding: 18px 20px; background: #fff; border: 1px solid #cfd3d6; box-shadow: 0 16px 45px rgba(20, 29, 34, .14); }

@media (max-width: 800px) {
  .site-container { padding: 0 24px !important; }
  .site-header { min-height: 94px; }
  .site-header nav a:not(.nav-contact) { display: none; }
  .hero { min-height: auto; padding: 110px 0 80px; }
  .hero-bottom, .split-section, .case-study, .secondary-case, .contact { grid-template-columns: 1fr; }
  .hero-bottom { align-items: flex-start; flex-direction: column; margin-top: 48px; }
  .split-section, .case-study, .secondary-case { display: grid; gap: 50px; padding: 72px 0; }
  .statement, .contact { padding: 80px 0; }
  .statement-copy { margin-left: 0 !important; }
  .engagement-grid { gap: 30px; }
  .site-footer { grid-template-columns: 1fr; align-items: start; }
}

@media (max-width: 520px) {
  .brand-logo-frame { width: 84px; height: 60px; }
  .brand-logo { width: 124px; left: -19px; top: -25px; }
  .nav-contact { font-size: .72rem; }
  .hero h1 { font-size: clamp(3rem, 14vw, 4.4rem); }
  .hero-bottom .MuiStack-root { width: 100%; }
  .hero-bottom .MuiButton-root { width: 100%; }
  .engagement-grid, .impact-grid { grid-template-columns: 1fr; }
  .contact-fields-two { grid-template-columns: 1fr; }
  .impact-grid > div:nth-child(odd) { border-right: 0; }
  .impact-grid > div:nth-child(even) { padding-left: 0; }
  .consent-banner { left: 12px; right: 12px; bottom: 12px; flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* AI implementation positioning */
.hero { min-height: auto; padding: 90px 0 64px; }
.hero h1 { font-size: clamp(3.4rem, 7.6vw, 7rem); }
.hero-description { max-width: 760px; margin-top: 32px !important; font-size: clamp(1.1rem, 1.8vw, 1.45rem) !important; color: #405463; line-height: 1.6 !important; }
.hero-bottom { flex-wrap: wrap; margin-top: 40px; align-items: center; }
.hero-intro { font-size: 1.15rem !important; }
.audience-line { border-top: 1px solid #cfd3d6; margin-top: 48px !important; padding-top: 24px; font-size: .9rem !important; color: #405463; }
.section-description { margin-top: 24px !important; color: #405463; line-height: 1.7 !important; max-width: 650px; }
.capability-row h3 { font-size: 1.45rem; font-weight: 700; letter-spacing: -.025em; }
.capability-row .workflow-description { margin-top: 10px; font-size: 1rem; font-weight: 400; letter-spacing: normal; line-height: 1.7; color: #405463; }
.services { padding: 90px 0; }
.services > .section-heading { max-width: 760px; }
.offer-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); margin-top: 44px; border: 1px solid #aeb5ba; }
.offer-card { display: flex; flex-direction: column; padding: 30px; background: #fff; }
.offer-card + .offer-card { border-left: 1px solid #aeb5ba; }
.offer-card:nth-child(2) { background: #edf0f2; }
.offer-card h3 { margin: 22px 0; min-height: 64px; font-weight: 750; }
.offer-price { font-size: 2.5rem !important; font-weight: 750 !important; letter-spacing: -.045em !important; }
.offer-unit { color: #405463; font-size: .85rem !important; margin-bottom: 24px !important; }
.offer-card ul { padding-left: 20px; margin-bottom: 30px; line-height: 1.7; color: #405463; }
.offer-card li { margin-bottom: 10px; }
.offer-card .MuiButton-root { margin-top: auto; justify-content: space-between; gap: 8px; }
.pricing-note { margin-top: 22px !important; color: #405463; font-size: .85rem !important; }
.statement .case-kicker { margin-top: 24px; }
.founder-details { margin: 28px 0 0 auto; max-width: 720px; color: #405463; }
.founder-details a { margin-top: 24px; }
.faq { display: grid; grid-template-columns: .8fr 2fr; gap: 8vw; padding: 80px 0; }
.faq details { border-bottom: 1px solid #cfd3d6; padding: 24px 0; }
.faq summary { cursor: pointer; font-size: 1.1rem; font-weight: 700; }
.faq details p { color: #405463; line-height: 1.7; }
.inquiry-choice { display: flex; gap: 10px; flex-wrap: wrap; }
.skip-link { position: absolute; left: 24px; top: -100px; background: #fff; padding: 12px; z-index: 50; }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 3px solid #405463; outline-offset: 5px; }
section[id] { scroll-margin-top: 24px; }
@media(max-width: 1000px) { .offer-grid { grid-template-columns: 1fr; } .offer-card + .offer-card { border-left: 0; border-top: 1px solid #aeb5ba; } .offer-card h3 { min-height: 0; } }
@media(max-width: 800px) { .faq { grid-template-columns: 1fr; gap: 30px; } .hero { padding-top: 72px; } .engagement-grid { grid-template-columns: 1fr; } }
@media(max-width: 520px) { .hero h1 { font-size: clamp(2.8rem, 12vw, 4rem); } .offer-card { padding: 24px; } }
