/* Shared malaika theme tokens. Pages inherit this system; no page-specific color patches. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Serif:wght@400;500;600&display=swap');
:root {
  --m-font: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  color-scheme: dark;
  --m-bg: #332b27;
  --m-surface: #332b27;
  --m-ink: #f5efe7;
  --m-muted: #e2d8cc;
  --m-line: rgba(245,239,231,.18);
  --m-accent: #9a7d69;
  --m-accent-ink: #332b27;
}
body { font-family: var(--m-font) !important; }

body { background: var(--m-bg) !important; color: var(--m-ink) !important; text-transform: lowercase; }
body :where(*) { color: var(--m-ink); text-transform: lowercase; }
a { color: inherit; }
body :is(.nav, .p-nav) { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; position: relative; }
body :is(.navlinks, .p-links) { display: flex; align-items: center; gap: 18px; color: var(--m-muted); font-size: 10px; }
body :is(.navlinks, .p-links) { flex-wrap: nowrap; white-space: nowrap; }
body :is(.navlinks, .p-links) a { color: var(--m-muted); text-decoration: none; }
body :is(.navlinks, .p-links) a:hover, body :is(.navlinks, .p-links) a:focus-visible { color: var(--m-ink); }
.mobile-menu { display:none; }
body :is(.brand, .p-brand) { font-family: "IBM Plex Serif", Georgia, "Times New Roman", serif; }
body :is(.brand, .p-brand) { display:inline-block; white-space:nowrap; text-decoration:none; font-size: 21px; font-weight: 500; letter-spacing: -.02em; }
body :is(.nav, .p-nav) > :is(.brand, .p-brand) { position:absolute; left:50%; transform:translateX(-50%); }
body :is(.brand, .p-brand) small { display: block; color: var(--m-muted); font-size: 9px; letter-spacing: .08em; }
body :is(.brand, .p-brand) small { display: none; }
body :is(.eyebrow, .p-eyebrow) { text-transform: uppercase; }
body :is(.navlinks, .p-links) { text-transform: lowercase !important; }
.brand, .p-brand { text-transform: none; }
.brand small { text-transform: none; }
.brand-ai { color: var(--m-accent); animation: malaika-ai-cycle 8s linear infinite; }
.brand-ai { text-transform: uppercase; }
@keyframes malaika-ai-cycle {
  0%, 16.66% { color: var(--m-accent); }
  33.33% { color: #c85c55; }
  50% { color: #6fa878; }
  66.66% { color: #d0aa4d; }
  83.33% { color: #668fbc; }
  100% { color: var(--m-accent); }
}
@media (prefers-reduced-motion: reduce) { .brand-ai { animation: none; color: var(--m-accent); } }
body :is(input, select, textarea) { background: var(--m-surface) !important; color: var(--m-ink) !important; border-color: var(--m-line) !important; }
body :is(input, select, textarea)::placeholder { color: var(--m-muted) !important; opacity: 1; }
body :is(.action, .button) { color: var(--m-ink); border-color: var(--m-line); }
body :is(.action, .p-action) { background: var(--m-surface) !important; color: var(--m-ink) !important; border-color: var(--m-line) !important; border-top-color: var(--m-line) !important; }
body :is(.action, .p-action):is(:hover, :focus-visible, .active, [aria-selected="true"]) { background: var(--m-surface) !important; color: var(--m-ink) !important; border-color: var(--m-line) !important; }
body :is(.action, .p-action):is(:hover, :focus-visible, .active, [aria-selected="true"]) :is(b, i, p, span, small) { color: inherit !important; }
body :is(.button:not(.alt)) { background: var(--m-accent) !important; color: var(--m-accent-ink) !important; border-color: var(--m-accent) !important; }
body :is(.cell, .p-cell, .serving-row, .country, .box, .pill) { transition: background-color .18s ease, border-color .18s ease, color .18s ease; }
body :is(.cell, .p-cell, .serving-row, .country, .box, .pill):is(:hover, :focus-visible, .active, [aria-selected="true"]) { background: var(--m-accent) !important; border-color: var(--m-accent) !important; color: var(--m-accent-ink) !important; }
body :is(.cell, .p-cell, .serving-row, .country, .box, .pill):is(:hover, :focus-visible, .active, [aria-selected="true"]) :is(small, p, span, strong) { color: inherit !important; }
.country-list .country { color: var(--m-muted); opacity: .58; }
.action.dark { background: transparent !important; border-color: var(--m-line) !important; color: var(--m-ink) !important; }
button { accent-color: var(--m-accent); }
.rubik-feature { margin-top: 56px; }
.rubik-shell { width: min(520px, calc(100% - 42px)); height: clamp(210px, 32vw, 340px); margin: 0 auto; overflow: hidden; position: relative; pointer-events: none; }
.rubik-shell canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.inside-list { display: grid; gap: 132px; padding-top: 36px; }
.donor-section { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 56px 96px; align-items: start; }
.donor-intro h2 { max-width: 16ch; margin: 16px 0 18px; font-size: clamp(1.7rem, 3vw, 2.7rem); line-height: 1; font-weight: 400; }
.donor-intro p { max-width: 48ch; margin: 0 0 24px; color: var(--m-muted); font-size: 12px; }
.donor-link { display: inline-flex; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--m-line); font-size: 12px; }
.donor-link i { color: var(--m-accent); font-size: 16px; font-style: normal; }
.donor-proof { display: grid; gap: 0; border-top: 1px solid var(--m-line); }
.donor-proof div { display: grid; grid-template-columns: minmax(150px, max-content) minmax(0, 1fr); gap: 28px; padding: 16px 0; border-bottom: 1px solid var(--m-line); align-items: baseline; }
.donor-proof strong { font-size: 18px; font-weight: 500; }
.donor-proof span { color: var(--m-muted); font-size: 11px; line-height: 1.5; }
.donor-example { grid-column: 1 / -1; border-top: 1px solid var(--m-line); padding-top: 14px; }
.donor-example span, .donor-note { color: var(--m-muted); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.donor-example p { max-width: 70ch; margin: 9px 0 0; color: var(--m-ink); font-size: 12px; line-height: 1.6; }
.donor-note { grid-column: 1 / -1; border-top: 1px solid var(--m-line); padding-top: 14px; letter-spacing: 0; text-transform: none; }
.donor-use { grid-column: 1 / -1; border-top: 1px solid var(--m-line); padding-top: 14px; color: var(--m-muted); font-size: 10px; }
.donor-use span { text-transform: uppercase; letter-spacing: .14em; }
.donor-use p { margin: 8px 0 0; color: var(--m-ink); font-size: 12px; }
.inside-category { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 88px; align-items: center; }
.inside-category:nth-child(even) { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.inside-category:nth-child(even) .inside-copy { order: 2; }
.inside-category:nth-child(even) .inside-visuals { order: 1; }
.inside-copy h2 { max-width: 18ch; margin: 0 0 16px; font-size: clamp(1.7rem, 3vw, 2.7rem); line-height: 1; font-weight: 400; }
.inside-copy > p { max-width: 42ch; color: var(--m-muted); font-size: 12px; }
.inside-copy ul { margin: 22px 0; padding-left: 18px; color: var(--m-muted); font-size: 11px; line-height: 1.8; }
.inside-use { border-top: 1px solid var(--m-line); padding-top: 14px; }
.inside-use b { color: var(--m-ink); font-weight: 500; }
.inside-visuals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-items: center; }
.inside-visuals img { display: block; width: 100%; height: auto; border: 1px solid var(--m-line); border-radius: 16px; box-shadow: 0 22px 42px rgba(0,0,0,.28); animation: inside-float 7s ease-in-out infinite; will-change: transform; }
.inside-visuals img:nth-child(2) { margin-top: 42px; animation-delay: -2.5s; }
@keyframes inside-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) { .inside-visuals img { animation: none; } }
@media (max-width: 800px) { .inside-list { gap: 88px; } .inside-category, .inside-category:nth-child(even) { grid-template-columns: 1fr; gap: 32px; } .inside-category:nth-child(even) .inside-copy, .inside-category:nth-child(even) .inside-visuals { order: initial; } .inside-visuals { grid-template-columns: 1fr 1fr; } }
@media (max-width: 800px) { .donor-section { grid-template-columns: 1fr; gap: 36px; } .donor-proof div { grid-template-columns: minmax(120px, max-content) minmax(0, 1fr); gap: 18px; } .donor-use { grid-column: auto; } }
.feature-list { display: grid; gap: 0; border-top: 1px solid var(--m-line); }
.feature-row { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(220px, 1fr) minmax(260px, 1.4fr); gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--m-line); align-items: start; }
.feature-row h3 { margin: 0; font-size: 17px; font-weight: 500; }
.feature-row p { margin: 0; color: var(--m-muted); font-size: 11px; line-height: 1.55; }
.feature-images { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.feature-images img { display: block; width: 100%; height: auto; border-radius: 8px; box-shadow: 0 10px 24px rgba(0,0,0,.18); }
@media (max-width: 800px) { .feature-row { grid-template-columns: 1fr; gap: 10px; } .feature-images { max-width: 520px; } }

/* shared page rhythm: the homepage system applies everywhere */
body :is(.nav, .p-nav, .hero, .p-hero, .section, .p-section, .foot, .p-foot) { border-top: 0 !important; border-bottom: 0 !important; }
body :is(.section, .p-section) { padding-top: 360px !important; padding-bottom: 360px !important; }
body :is(.hero, .p-hero) { padding-top: 120px !important; padding-bottom: 120px !important; }
body :is(.hero h1, .p-hero h1) { max-width: none; font-size: clamp(1.5rem, 2.2vw, 2.2rem) !important; line-height: 1; letter-spacing: -.06em; }
body :is(.section h2, .p-section h2) { font-size: clamp(1.6rem, 3vw, 2.8rem) !important; line-height: .95; letter-spacing: -.08em; }
body :is(.lede, .p-lede, .copy, .p-cell span, .cell span) { font-size: 11px; }
body :is(.nav, .p-nav) { min-height: 76px; border-bottom: 0 !important; }
body :is(.foot, .p-foot) { padding-top: 80px; }
@media (max-width: 800px) { body :is(.section, .p-section) { padding-top: 140px !important; padding-bottom: 140px !important; } body :is(.hero, .p-hero) { padding-top: 80px !important; padding-bottom: 80px !important; } }

/* Shared homepage interaction and tool marquee */
body :is(.cell, .p-cell, .serving-row, .country, .action, .p-action, .tool-logo) { transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease; }
body :is(.cell, .p-cell, .serving-row, .country, .action, .p-action):is(:hover, :focus-visible, .active, [aria-selected="true"]) { background: var(--m-accent) !important; border-color: var(--m-accent) !important; color: var(--m-accent-ink) !important; }
body :is(.cell, .p-cell, .serving-row, .country, .action, .p-action):is(:hover, :focus-visible, .active, [aria-selected="true"]) :is(h3, p, b, small, span, i) { color: inherit !important; }
.tool-marquee-section { width: min(calc(100% - 48px), 1180px); margin: 0 auto; padding: 34px 0 40px; overflow: hidden; }
.tool-marquee-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:18px; }
.tool-marquee-note { color:var(--m-muted); font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.tool-marquee { overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.tool-marquee-track { display:flex; align-items:center; gap:32px; width:max-content; animation:malaika-tool-scroll 70s linear infinite; }
.tool-marquee:hover .tool-marquee-track { animation-play-state:paused; }
.tool-logo { width:54px; height:54px; flex:0 0 54px; display:grid; place-items:center; padding:10px; border:0; border-radius:12px; }
.tool-logo img { display:block; width:100%; height:100%; object-fit:contain; opacity:.86; filter:brightness(0) invert(1); }
.tool-logo:hover, .tool-logo:focus-visible { background:var(--m-accent); border-color:var(--m-accent); transform:translateY(-3px); }
@keyframes malaika-tool-scroll { to { transform:translateX(-50%); } }
.serving { grid-template-columns: 1fr; }
.serving > .serving-panel:first-child { display: none; }
#start .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#start .grid > .cell:last-child { display: none; }
@media (max-width: 800px) { #start .grid { grid-template-columns: 1fr 1fr; } }
.inside-list { gap:264px; }
.inside-visuals img:nth-child(2) { margin-top:84px; }
@media (max-width:800px) { body :is(.section, .p-section) { padding-top:280px !important; padding-bottom:280px !important; } .tool-marquee-section { width:calc(100% - 32px); padding:28px 0 32px; } .inside-list { gap:176px; } .inside-visuals img:nth-child(2) { margin-top:42px; } }

/* shared mobile layout for every Malaika page */
@media (max-width:700px) {
  body :is(.nav, .p-nav) { min-height:0; flex-wrap:wrap; align-items:center; padding:14px 0 10px; gap:10px; }
  body :is(.navlinks, .p-links) { display:none; }
  body .mobile-menu { display:block; margin-left:auto; position:relative; color:var(--m-ink); font-size:10px; }
  body .mobile-menu summary { cursor:pointer; list-style:none; border:1px solid var(--m-line); border-radius:999px; padding:8px 12px; }
  body .mobile-menu summary::-webkit-details-marker { display:none; }
  body .mobile-menu-links { position:absolute; right:0; top:calc(100% + 8px); z-index:20; min-width:190px; padding:10px; border:1px solid var(--m-line); background:var(--m-bg); box-shadow:0 14px 30px rgba(0,0,0,.24); }
  body .mobile-menu-links a { display:block; padding:9px 8px; color:var(--m-ink); text-decoration:none; white-space:nowrap; }
  body :is(.hero, .p-hero) { padding-top:64px; padding-bottom:64px; }
  body :is(.grid, .p-grid) { grid-template-columns:1fr; }
  body :is(.row, .p-row) { grid-template-columns:1fr; }
  body :is(.actions, .p-actions) { display:flex; flex-wrap:wrap; }
  body :is(.foot, .p-foot) { display:block; }
  body :is(.foot, .p-foot) > span { display:block; margin-bottom:10px; }
}

/* CTA cards stay equal and compact at every viewport size. */
body .actions { width:min(100%,680px); grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
body .actions .action { min-height:150px; background:var(--m-surface) !important; color:var(--m-ink) !important; border-color:var(--m-line) !important; border-top-color:var(--m-line) !important; }
body .actions .action:is(:hover,:focus-visible,.active,[aria-selected="true"]) { background:var(--m-surface) !important; color:var(--m-ink) !important; border-color:var(--m-line) !important; }
body .actions .action:is(:hover,:focus-visible,.active,[aria-selected="true"]) :is(b,i,p,span,small) { color:inherit !important; }
@media (max-width:800px) { body .actions { width:min(100%,680px); grid-template-columns:repeat(2,minmax(0,1fr)) !important; } body .actions .action { min-height:150px; padding:16px; } }

/* directory layout belongs to the shared theme; pages only provide semantic markup */
body.tools-page { --tools-muted: var(--m-muted); --tools-line: var(--m-line); --tools-accent: var(--m-accent); }
body.tools-page .tools-shell { width:min(calc(100% - 96px),1180px); margin:auto; }
body.tools-page .tools-nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
body.tools-page .tools-brand { color:var(--m-ink); font-size:18px; letter-spacing:-.08em; text-decoration:none; }
body.tools-page .tools-brand span { color:var(--m-accent); }
body.tools-page .tools-navlinks { display:flex; align-items:center; gap:18px; }
body.tools-page .tools-navlinks a { color:var(--m-muted); text-decoration:none; font-size:10px; }
body.tools-page .tools-main { padding:120px 0 240px; }
body.tools-page .tools-heading { display:flex; justify-content:space-between; align-items:end; gap:32px; margin-bottom:42px; }
body.tools-page .tools-kicker, body.tools-page .tool-category { color:var(--m-muted); font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
body.tools-page .tools-heading h1 { margin:10px 0 8px; font-size:clamp(2rem,3.8vw,3.8rem); line-height:.95; letter-spacing:-.07em; font-weight:400; }
body.tools-page .tools-subtitle { margin:0; color:var(--m-muted); font-size:12px; }
body.tools-page .tools-search { width:min(100%,310px); border:1px solid var(--m-line); border-radius:8px; background:var(--m-surface); padding:14px 16px; color:var(--m-ink); font:12px var(--m-font); }
body.tools-page .tools-filters { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:64px; }
body.tools-page .tools-filter { border:1px solid var(--m-line); border-radius:999px; background:transparent; color:var(--m-ink); padding:10px 17px; font:12px var(--m-font); cursor:pointer; }
body.tools-page .tools-filter:is(.is-active,:hover,:focus-visible) { background:var(--m-accent); border-color:var(--m-accent); color:var(--m-accent-ink); }
body.tools-page .tools-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px 18px; }
body.tools-page .tool-directory-card { min-height:238px; border:1px solid var(--m-line); border-radius:8px; padding:24px; display:flex; flex-direction:column; background:var(--m-surface); }
body.tools-page .tool-directory-card h2 { margin:15px 0 4px; font-size:21px; line-height:1.05; font-weight:500; letter-spacing:-.04em; }
body.tools-page .tool-provider, body.tools-page .tool-description { color:var(--m-muted); font-size:12px; }
body.tools-page .tool-description { margin:24px 0 20px; line-height:1.55; }
body.tools-page .tool-open { margin-top:auto; width:max-content; border-bottom:1px solid var(--m-ink); font-size:12px; }
@media (max-width:900px) { body.tools-page .tools-shell { width:min(calc(100% - 48px),720px); } body.tools-page .tools-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } body.tools-page .tools-heading { align-items:start; flex-direction:column; } body.tools-page .tools-search { width:100%; } }
@media (max-width:600px) { body.tools-page .tools-shell { width:min(calc(100% - 32px),480px); } body.tools-page .tools-navlinks { gap:14px; } body.tools-page .tools-navlinks a:not(:last-child) { display:none; } body.tools-page .tools-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 10px; } body.tools-page .tool-directory-card { min-height:210px; padding:16px; } }

/* registry uses the same Malaika surface, type scale, and responsive rhythm */
body #mmaadd-registry { background: var(--m-bg); color: var(--m-ink); }
body #mmaadd-registry .rg-wrap { width: min(calc(100% - 48px), 1080px); }
body #mmaadd-registry .rg-hero { max-width: 52ch; }
body #mmaadd-registry h1 { font-size: clamp(1.8rem, 3.2vw, 3rem); font-weight: 400; }
body #mmaadd-registry .rg-lede { color: var(--m-muted); font-size: 11px; }
body #mmaadd-registry .rg-grid { gap: 16px; }
body #mmaadd-registry .rg-item { border: 1px solid var(--m-line); border-radius: 0; background: var(--m-surface); }
body #mmaadd-registry .rg-item:hover, body #mmaadd-registry .rg-item:focus-visible, body #mmaadd-registry .rg-item.is-added { background: var(--m-accent); color: var(--m-accent-ink); outline: 0; }
body #mmaadd-registry .rg-item:hover span, body #mmaadd-registry .rg-item:focus-visible span, body #mmaadd-registry .rg-item.is-added span,
body #mmaadd-registry .rg-item:hover strong, body #mmaadd-registry .rg-item:focus-visible strong, body #mmaadd-registry .rg-item.is-added strong { color: inherit; }
body #mmaadd-registry .rg-cart { background: var(--m-surface); border-color: var(--m-line); box-shadow: 0 18px 40px rgba(0,0,0,.22); }
body #mmaadd-registry .rg-checkout { background: var(--m-accent); color: var(--m-accent-ink); }
@media (max-width: 700px) {
  body #mmaadd-registry { padding-top: 72px; }
  body #mmaadd-registry .rg-wrap { width: calc(100% - 32px); }
  body #mmaadd-registry .rg-hero { margin-bottom: 44px; }
  body #mmaadd-registry .rg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body #mmaadd-registry .rg-item { min-height: 112px; padding: 14px; }
  body #mmaadd-registry .rg-cart { right: 16px; bottom: 16px; width: calc(100% - 32px); }
}
