:root {
    color-scheme: light dark;
    --tw-navy: #051c35;
    --tw-gray: #999999;
    --tw-emerald: #50c878;
    --tw-coral: #ec6564;
    --tw-paper: #ffffff;
    --tw-smoke: #f5f6f4;
    --tw-ink: #051c35;
    --tw-muted: #56616b;
    --tw-line: #dce1e3;
    --tw-focus: #5164c8;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; background: var(--tw-paper); color: var(--tw-ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.6; letter-spacing: 0; }
img { max-width: 100%; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--tw-focus); outline-offset: 5px; }
[hidden] { display: none !important; }
.tw-container { width: min(1120px, calc(100% - 96px)); margin-inline: auto; }
.tw-header { position: sticky; top: 0; z-index: 20; background: var(--tw-paper); border-bottom: 1px solid var(--tw-line); }
.tw-header-inner { min-height: 80px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.tw-brand { display: inline-flex; align-items: center; color: var(--tw-ink); text-decoration: none; flex-shrink: 0; }
.tw-brand picture { display: block; width: 292px; }
.tw-brand img { display: block; width: 100%; height: auto; }
.tw-nav { display: flex; align-items: center; gap: 36px; font-size: 14px; }
.tw-nav a { text-decoration: none; padding-block: 12px; }
.tw-nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.tw-icon { display: inline-block; flex: 0 0 20px; width: 20px; height: 20px; background: currentColor; mask: var(--tw-icon) center / contain no-repeat; -webkit-mask: var(--tw-icon) center / contain no-repeat; }
[data-icon="arrow-up-right"] { --tw-icon: url('/assets/icons/arrow-up-right.svg'); }
[data-icon="arrow-right"] { --tw-icon: url('/assets/icons/arrow-right.svg'); }
[data-icon="arrow-down"] { --tw-icon: url('/assets/icons/arrow-down.svg'); }
[data-icon="menu"] { --tw-icon: url('/assets/icons/menu.svg'); }
[data-icon="linkedin"] { --tw-icon: url('/assets/images/linkedin.webp'); }
[data-icon="instagram"] { --tw-icon: url('/assets/icons/instagram.svg'); }
[data-icon="x"] { --tw-icon: url('/assets/icons/x.svg'); }
[data-icon="youtube"] { --tw-icon: url('/assets/icons/youtube.svg'); }
.tw-menu { display: none; }
.tw-skip { position: fixed; top: 10px; left: 16px; z-index: 50; background: var(--tw-paper); padding: 12px 20px; transform: translateY(-160%); }
.tw-skip:focus { transform: translateY(0); }
.tw-intro { padding-block: 112px 104px; }
.tw-intro h1 { max-width: 690px; margin: 0 0 28px; font-size: 64px; line-height: 1.1; font-weight: 500; }
.tw-intro p { max-width: 480px; margin: 0; font-size: 20px; line-height: 1.65; color: var(--tw-muted); }
.tw-section-title { margin: 0; font-size: 18px; font-weight: 500; line-height: 1.4; color: var(--tw-muted); }
.tw-products { padding-block: 24px 104px; }
.tw-products .tw-section-title { margin-bottom: 52px; }
.tw-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 120px; }
.tw-product-card { display: flex; flex-direction: column; min-width: 0; max-width: 370px; color: var(--tw-ink); text-decoration: none; }
.tw-product-card:hover { color: var(--tw-ink); }
.tw-product-card:hover h3 { text-decoration: underline; text-underline-offset: 6px; }
.tw-product-mark { height: 84px; flex-shrink: 0; display: flex; align-items: center; justify-content: flex-start; margin-bottom: 28px; }
.tw-product-peiz .tw-product-mark img { width: 96px; height: 96px; margin-left: -12px; }
.tw-product-makini .tw-product-mark img { width: 116px; height: auto; }
.tw-product-info { flex: 1; display: flex; flex-direction: column; align-items: flex-start; }
.tw-product-info h3 { display: flex; align-items: center; gap: 16px; font-size: 26px; font-weight: 500; margin: 0 0 16px; line-height: 1.2; }
.tw-product-info h3 .tw-icon { width: 16px; height: 16px; flex-basis: 16px; }
.tw-product-info p { font-size: 17px; line-height: 1.7; color: var(--tw-muted); margin: 0; }
.tw-research { padding-block: 32px 104px; }
.tw-research .tw-section-title { margin-bottom: 24px; }
.tw-research p { margin: 0; max-width: 620px; font-size: 22px; font-weight: 400; line-height: 1.6; }
.tw-contact, .tw-footer { background: var(--tw-navy); color: #ffffff; }
.tw-contact { padding-block: 54px; }
.tw-contact-layout { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.tw-contact h2 { color: #b5bec8; font-size: 15px; font-weight: 500; margin: 0 0 16px; }
.tw-contact-email { display: inline-flex; align-items: center; gap: 20px; color: #ffffff; text-decoration: none; font-size: 28px; font-weight: 500; line-height: 1.5; }
.tw-contact-email:hover { color: #ffffff; text-decoration: underline; text-underline-offset: 6px; }
.tw-contact-location { margin: 12px 0 0; font-size: 16px; line-height: 1.6; font-style: normal; color: #b5bec8; }
.tw-social { display: flex; flex-wrap: wrap; gap: 12px; }
.tw-social a { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; color: #ffffff; border-radius: 4px; }
.tw-social a:hover { color: var(--tw-emerald); }
.tw-social a:focus-visible { outline-color: var(--tw-emerald); }
.tw-footer { padding-bottom: 24px; }
.tw-footer-bottom { border-top: 1px solid #34475b; padding-top: 22px; display: flex; justify-content: space-between; gap: 24px; font-size: 12px; color: #b5bec8; }
.tw-footer-bottom p { margin: 0; }
.tw-footer-bottom a { text-decoration: none; }
.tw-footer-bottom a:hover { text-decoration: underline; text-underline-offset: 4px; }
.tw-legal main { max-width: 850px; padding: 56px 24px 72px; margin: 0 auto; }
.tw-legal main > .container-fluid, .tw-legal main .container { margin: 0 !important; padding: 0; }
.tw-legal main h1 { font-size: 38px; line-height: 1.2; margin-bottom: 18px !important; font-weight: 500; }
.tw-legal main h2 { font-size: 22px; font-weight: 600; margin: 36px 0 14px; }
.tw-legal-updated { font-size: 14px; color: var(--tw-muted); margin-bottom: 36px; }
.tw-legal main p, .tw-legal main li { line-height: 1.75; }
.tw-product-nav { background: var(--tw-coral); color: var(--tw-navy); }
.tw-product-nav .tw-container { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-block: 20px; }
.tw-product-nav nav { display: flex; flex-wrap: wrap; gap: 24px; font-size: 14px; }
.tw-product-nav nav a { padding-block: 10px; text-decoration: none; }
.tw-product-nav nav a:hover { text-decoration: underline; text-underline-offset: 4px; }
.tw-makini-brand img { display: block; width: 184px; height: auto; }

@media (prefers-color-scheme: dark) {
    :root { --tw-paper: #071727; --tw-smoke: #102539; --tw-ink: #f5f6f4; --tw-muted: #b5bec8; --tw-line: #314452; }
    .tw-product-page #main { background: #ffffff; color: #051c35; }
}

/* The homepage is a light-only design study; product and policy themes stay intact. */
:root:has(.tw-home) { color-scheme: light; }
.tw-home { color-scheme: light; --tw-paper: #ffffff; --tw-smoke: #f5f6f4; --tw-ink: #051c35; --tw-muted: #56616b; --tw-line: #e8ebed; }
.tw-home .tw-container { max-width: 1040px; }
.tw-home .tw-header { border-bottom: 0; }
.tw-home .tw-header-inner { min-height: 96px; }
.tw-home .tw-contact, .tw-home .tw-footer { background: var(--tw-paper); color: var(--tw-ink); }
.tw-home .tw-contact { padding-block: 0 56px; }
.tw-home .tw-contact-layout { border-top: 1px solid var(--tw-line); padding-top: 44px; }
.tw-home .tw-contact h2 { color: var(--tw-muted); font-size: 16px; margin-bottom: 12px; }
.tw-home .tw-contact-email { color: var(--tw-ink); font-size: 24px; }
.tw-home .tw-contact-location { color: var(--tw-muted); }
.tw-home .tw-social a { color: var(--tw-ink); }
.tw-home .tw-social a:hover { background: var(--tw-smoke); }
.tw-home .tw-social a:focus-visible { outline-color: var(--tw-focus); }
.tw-home .tw-footer { padding-bottom: 32px; }
.tw-home .tw-footer-bottom { border-top: 0; padding-top: 0; color: var(--tw-muted); }

@media (max-width: 900px) {
    .tw-container { width: calc(100% - 56px); }
    .tw-product-grid { gap: 72px; }
}

@media (max-width: 620px) {
    html { scroll-padding-top: 88px; }
    .tw-container { width: calc(100% - 40px); }
    .tw-header-inner { min-height: 72px; gap: 12px; flex-wrap: wrap; padding-block: 12px; }
    .tw-brand picture { width: 220px; }
    .tw-menu { display: flex; width: 44px; height: 44px; align-items: center; justify-content: center; background: transparent; color: var(--tw-ink); border: 1px solid var(--tw-line); border-radius: 8px; }
    .tw-nav { width: 100%; justify-content: space-between; gap: 16px; padding-block: 12px; border-top: 1px solid var(--tw-line); }
    .js .tw-nav:not([data-open]) { display: none; }
    .tw-home .tw-header-inner { min-height: 72px; }
    .tw-intro { padding-block: 64px 68px; }
    .tw-intro h1 { font-size: 38px; margin-bottom: 24px; max-width: 350px; }
    .tw-intro p { font-size: 18px; }
    .tw-section-title { font-size: 17px; }
    .tw-products { padding-block: 12px 68px; }
    .tw-products .tw-section-title { margin-bottom: 40px; }
    .tw-product-grid { grid-template-columns: minmax(0, 1fr); gap: 64px; }
    .tw-product-mark { margin-bottom: 24px; }
    .tw-product-info h3 { font-size: 24px; }
    .tw-product-info p { font-size: 16px; }
    .tw-research { padding-block: 16px 64px; }
    .tw-research .tw-section-title { margin-bottom: 20px; }
    .tw-research p { font-size: 20px; }
    .tw-contact { padding-block: 36px 28px; }
    .tw-contact-layout { flex-direction: column; align-items: flex-start; gap: 20px; }
    .tw-contact-email { font-size: 24px; gap: 14px; }
    .tw-social { margin-left: -12px; }
    .tw-footer-bottom { flex-direction: column; gap: 14px; }
    .tw-home .tw-contact { padding-bottom: 40px; }
    .tw-home .tw-contact-layout { padding-top: 32px; }
    .tw-legal main { padding: 40px 20px 56px; }
    .tw-legal main h1 { font-size: 30px; }
    .tw-product-nav .tw-container { gap: 8px; padding-block: 16px 8px; }
    .tw-product-nav nav { width: 100%; justify-content: space-between; gap: 16px; }
    .tw-makini-brand img { width: 160px; }
}

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