/* Nokumi: one connector-bot, a calm blue platform, and a little mint mischief. */
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:400 900;font-display:swap;src:url('fonts/nunito-sans-latin.woff2') format('woff2')}
:root{--paper:#f8fbff;--ink:#17284a;--red:#2857d9;--muted:#52647c;--line:#d6e1f2;--soft:#edf4ff;--radius:12px;--mint:#6cdec4;--mint-soft:#e2f7ef;--blue-soft:#eaf2ff;--magic-night:#0d2b52;--magic-peach:#f59994;--magic-ecru:#c0b490}
body{font-family:'Nunito Sans',system-ui,sans-serif}
button,input,select,textarea{font-family:inherit}
h1,h2,h3,h4{font-weight:900;text-wrap:balance}
.hero-integration h1{font-size:clamp(52px,5.1vw,74px);line-height:1.06;letter-spacing:-.035em}
.hero-integration .hero-intro{font-size:16px;line-height:1.85}
.hero-integration .microcopy{font-size:12px}
.section-heading p,.marketplace-heading p{line-height:1.85}
.concept-bar{background:var(--ink);color:#e6efff;letter-spacing:.8px;font:700 10px/1.6 'Nunito Sans',sans-serif}
.header nav{font-weight:700}
.button{border-radius:12px;font-weight:800;transition:background .2s,transform .2s,border-color .2s}
.button:hover{background:#1e43ae;border-color:#1e43ae;transform:translateY(-2px)}
.button:active{transform:translateY(0) scale(.98)}
.button-light{background:var(--mint-soft);border-color:var(--mint-soft);color:var(--ink)}
.button-light:hover{background:#c4f0e2;border-color:#c4f0e2;color:var(--ink)}
.text-link{font-weight:800}
.eyebrow,.service-tag,.provider-logo small,.snapshot-label,.map-caption,.map-provider-row>small{font-family:'Nunito Sans',sans-serif;font-weight:800;letter-spacing:.07em}
.eyebrow,.service-tag{text-transform:uppercase}
.wordmark{gap:9px;letter-spacing:0;min-width:0;flex-shrink:0}
.wordmark .brand-type{position:relative;display:block;width:166px;height:65px;flex-shrink:0}
.wordmark .brand-wordmark{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;height:auto;max-width:none;pointer-events:none}
.wordmark .jp{position:absolute;left:6px;bottom:-2px;margin:0;font-size:8px;letter-spacing:2px;font-weight:600;color:var(--muted)}
.mascot-mark,.header .mascot-mark,footer .mascot-mark{position:relative;display:inline-block;width:55px;height:62px;overflow:visible;flex-shrink:0}
.mascot-mark img,.header .mascot-mark img,footer .mascot-mark img{position:static;display:block;left:auto;top:auto;width:100%;height:100%;max-width:100%;object-fit:contain;transform-origin:50% 85%;transition:transform .25s}
.wordmark:hover .mascot-mark img{transform:rotate(-7deg) translateY(-2px)}
.map-hub{background:transparent;gap:8px}
.map-hub>.mascot-mark{width:88px;height:100px}
.map-hub>.mascot-mark img{position:static;left:auto;top:auto;width:100%;height:100%;max-width:100%;object-fit:contain}
.map-hub strong{font-weight:900;letter-spacing:-.025em;color:#f8fbff}
.map-hub small{font-family:'Nunito Sans',sans-serif;font-weight:800;color:var(--magic-ecru)}
.integration-map{background:var(--magic-night);border-color:var(--magic-night);border-radius:22px;padding-top:24px}
.map-caption{color:var(--magic-ecru)}
.integration-map .map-source{color:#f8fbff}
.integration-map .map-source small{color:#c6d9ef}
.integration-map .map-source svg{stroke:var(--magic-ecru)}
.map-provider-row{border-radius:12px;background:#fff;border-color:#c5d6ef}
.map-provider-row>small{color:#4e6787}
.map-vendor{font-weight:800}
.map-note{border-color:#506581;font-size:11px;line-height:1.8;color:#d2e3f5}
.motion-controls{padding:10px 3px 0;color:var(--muted)}
.motion-controls button{border-radius:10px;font-weight:800}
.integration-map .map-energy .energy-wire{stroke:var(--magic-ecru);stroke-width:1.5;opacity:.72}
.integration-map .map-energy .energy-trace{stroke:var(--magic-peach);stroke-width:3.2;stroke-linecap:round}
.integration-map .map-energy .energy-trace.signal-mint{stroke:var(--mint)}
.integration-map .map-packet,.map-packet-tail{position:absolute;left:0;top:0;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border:2px solid var(--magic-night);background:var(--magic-peach);border-radius:50%;pointer-events:none;opacity:0;visibility:hidden;z-index:3}
.integration-map .map-packet{box-shadow:0 0 0 1px var(--magic-ecru)}
.map-packet-tail{width:6px;height:6px;margin:-3px 0 0 -3px;border:0;background:var(--magic-ecru);z-index:1}
.integration-map .map-packet.signal-mint,.map-packet-tail.signal-mint{background:var(--mint)}
.integration-map .map-spark{width:18px;height:18px;margin:-9px 0 0 -9px;fill:var(--magic-peach)}
.integration-map .map-spark.signal-mint{fill:var(--mint)}
.map-portal{position:absolute;width:150px;height:150px;margin:-75px 0 0 -75px;fill:none;pointer-events:none;opacity:0;visibility:hidden;z-index:1}
.portal-outer{stroke:var(--magic-ecru);stroke-width:2.2;stroke-dasharray:24 16 4 16;stroke-linecap:round}
.portal-inner{stroke:var(--mint);stroke-width:1.3;stroke-dasharray:46 12 4 12;stroke-linecap:round}
.integration-map .map-node-light{border:2px solid var(--magic-night);border-radius:12px;background:transparent;box-shadow:inset 0 0 0 3px var(--magic-peach);z-index:1}
.integration-map .map-lines{stroke:var(--magic-ecru);stroke-width:1.5}
.integration-map .map-lines circle{fill:var(--magic-peach)}
.integration-map .map-lines .map-input-line{stroke:var(--magic-peach);stroke-width:2.5}
.integration-map .map-source:after,.integration-map .map-hub:after,.integration-map .map-providers:before{background:var(--magic-ecru)}
.integration-map .map-provider-row:before{border-color:var(--magic-ecru)}
.how-step.active .how-number{background:var(--magic-peach);color:var(--magic-night);border-color:var(--magic-peach)}
.manifesto-strip{border-color:var(--line);background:var(--mint-soft)}
.strip-content>span{font-weight:900;letter-spacing:.02em}
.strip-content>b{color:#236754}
.service-list{border-color:var(--line)}
.service h3{font-weight:900}
.service p{font-size:14px;line-height:1.85}
.service-tag{border-radius:8px;background:var(--blue-soft);border-color:var(--line);color:var(--ink)}
.service-whatsapp .service-tag{background:var(--mint-soft);border-color:#b9e6d7;color:#236754}
.stack-band{background:#fff;border-color:var(--line);border-radius:18px}
.stack-disclosure small{border-radius:5px;background:var(--mint-soft);color:#236754;border-color:#b9e6d7}
.marketplace-section{background:#f0f5ff;border-color:var(--line)}
.integration-filters button,.ownership-tabs button,.scenario{font-family:inherit;font-weight:800;border-radius:10px}
.integration-filters button.active,.ownership-tabs button.active{background:var(--ink);border-color:var(--ink);color:#fff}
.integration-options .vendor-option{border-radius:10px;background:#fff;border-color:#c7d7ef;transition:transform .2s,border-color .2s}
.integration-options .vendor-option:hover{border-color:var(--red);transform:translateY(-2px)}
.integration-more{font-weight:800}
.how-panel{background:var(--blue-soft);border-color:var(--line);border-radius:20px}
.how-window{background:#fff;border-color:var(--line)}
.how-route>span:not(.mascot-mark){border-radius:9px;background:#fff;border-color:#c5d6ef}
.how-route>.mascot-mark{background:transparent;border:0;width:58px;height:65px;padding:0}
.how-route>.mascot-mark img{position:static;left:auto;top:auto;width:100%;height:100%;max-width:100%;object-fit:contain}
.how-agent-note{background:var(--mint-soft);color:#236754}
.how-agent-note small{color:#236754}
.how-number{border-color:#a7bddb;font-family:inherit;font-weight:900}
.flow-section{background:#edf4ff;color:var(--ink)}
.flow-section h2 span,.flow-section .scenario,.flow-section .journey p,.flow-section .demo-status{color:#52647c}
.flow-section .scenario.active{color:#fff}
.flow-section .journey li{opacity:1}
.flow-section .journey li>span{background:#fff;color:var(--ink);border-color:#8ca6c7}
.flow-section .journey li>b{color:#52647c}
.flow-section .journey li.running{background:#e2f7ef}
.flow-section .journey li.running>span{background:var(--red);color:#fff}
.flow-section .journey li.done>span{background:#236754;color:#fff}
.flow-section .journey li.done>b{color:#236754}
.flow-section .effort-cta p{color:#52647c}
.flow-section .effort-cta{margin-top:48px;border-color:var(--line)}
.integration-options .vendor-option{position:relative;padding-right:26px}
.external-icon{position:absolute;right:8px;top:8px;width:12px;height:12px;stroke:currentColor;stroke-width:1.5;flex-shrink:0;opacity:.7}
.setup-details,.name-details{border-block:1px solid var(--line)}
.setup-details>summary,.name-details>summary{cursor:pointer;min-height:56px;padding:18px 4px;font-size:17px;font-weight:800}
.setup-details-body{padding-bottom:24px}
.name-details{margin-top:48px}
.name-details .name-section{padding:24px 0;display:grid;grid-template-columns:1fr 1fr;gap:64px}
.integration-filters button{min-height:44px}
.text-link,.integration-more,.footer-philosophy{min-height:44px;display:inline-flex;align-items:center}
.how-section .stack-band{margin-top:48px}
@media(max-width:760px){.name-details .name-section{grid-template-columns:1fr;gap:24px}.flow-section .effort-cta{align-items:stretch}}
.scenario.active{background:var(--ink);border-color:var(--ink);color:#fff}
.demo-product{border-radius:18px;background:#fff;border-color:var(--line)}
.window-top{background:#f3f7ff;border-color:var(--line)}
.demo-avatar{background:var(--mint);color:var(--ink)}
.journey li{border-color:var(--line)}
.journey li.done b{color:#226d57}
.ownership-art{border-radius:20px;background:var(--blue-soft);background-image:none}
.org-box{border-color:#b8cce8;border-radius:12px;background:#fff}
.project-chip{border-radius:6px;background:#edf4ff;border-color:#c5d6ef;font-family:inherit;font-weight:800}
.org-box.customer{border-color:#72bfa8}
.customer b{color:#236754}
.customer .project-chip{background:var(--mint-soft);color:#236754;border-color:#a5dcc9}
.launch-band{background:var(--ink);color:#fff}
.launch-band .eyebrow{color:#bcd2f4}
.launch-band h2 span{color:var(--mint)}
.builder-types{color:#c9dcf8}
.effort-table-wrap{border-radius:16px;overflow:hidden}
.effort-table{background:#fff}
.effort-table thead{background:var(--blue-soft)}
.effort-table th,.effort-table td{border-color:var(--line)}
.effort-table tr>:last-child{background:#eef9f4}
.effort-owner-note{border-radius:14px;background:var(--blue-soft)}
.token-example{border-radius:18px;background:var(--blue-soft);border-color:var(--line)}
.custom-section{background:var(--ink);color:#fff}
.custom-layout h2 span{color:var(--magic-peach)}
.custom-services article{border-color:#385475}
.custom-layout>div>p,.custom-services p{color:#cfdef5}
.team-illustration{border-radius:22px;background:var(--mint-soft);min-height:360px;overflow:visible}
.team-illustration img{width:285px;max-width:80%;height:auto;object-fit:contain;transform:rotate(-4deg)}
.team-illustration>span{color:#236754;right:20px}
.name-principles dl>div{border-color:var(--line)}
.name-pronunciation{color:var(--red)}
.meeting-section{background:#edf4ff;border-color:var(--line)}
.meeting-panel{border-radius:20px;background:#fff;border-color:#c7d7ef}
.meeting-preview-note{border-color:#b9cde9}
.meeting-form-heading>span{border-radius:6px;background:var(--blue-soft);color:var(--ink);border-color:#c7d7ef;font-family:inherit;font-weight:800}
input:not([type=radio]):not([type=checkbox]),select,textarea{border-radius:9px;border-color:#aebfda;background:#fbfdff;color:var(--ink)}
.faq details{border-color:var(--line)}
.final-cta{background:var(--ink);color:#fff}
.final-cta h2 em{color:var(--mint)}
.final-cta .eyebrow{color:#bdd3f4}
footer{border-color:var(--line)}
.brand-attribution{font-size:10px;line-height:1.8}
dialog{border:1px solid #b8cce8;border-radius:20px;background:var(--paper);box-shadow:0 20px 80px #17284a26}
dialog::backdrop{background:#17284ab8;backdrop-filter:blur(5px)}
pre{background:var(--blue-soft);border-left:1px solid #a3bddf;border-radius:10px}
@media(min-width:1500px){.hero-integration h1{font-size:74px}}
@media(max-width:1100px){.header nav{gap:16px}.wordmark .brand-type{width:145px}.map-hub>.mascot-mark{width:72px;height:86px}.hero-integration h1{font-size:54px}}
@media(min-width:761px) and (max-width:1000px){.header .mascot-mark{width:43px;height:50px}.header .brand-type{width:124px}.header nav{font-size:12px;gap:13px}}
@media(max-width:760px){
  .hero-integration h1{font-size:clamp(36px,10.6vw,52px);line-height:1.07;letter-spacing:-.03em}
  .hero-integration .hero-intro{font-size:15px;line-height:1.85}
  .hero-integration .microcopy{font-size:11px}
  .header .wordmark{gap:7px}
  .header .mascot-mark{width:43px;height:52px}
  .header .brand-type{width:132px;height:56px}
  .wordmark .jp{display:none}
  .menu-toggle{font-family:inherit;font-weight:900;font-size:11px}
  .header nav.open{border-radius:16px;background:#fff;border-color:var(--line);box-shadow:0 12px 30px #17284a14}
  .integration-map{border-radius:18px;padding-inline:18px}
  .map-hub>.mascot-mark{width:76px;height:88px}
  .map-portal{width:128px;height:128px;margin:-64px 0 0 -64px}
  .map-vendor{font-size:12px}
  .map-note{font-size:11px}
  .motion-controls{flex-wrap:wrap}
  .motion-controls>span{font-size:10px;max-width:190px}
  .service p{font-size:13px}
  .service-tag{font-size:9px}
  .how-screen h3{font-size:26px}
  .how-screen>p{font-size:13px}
  .how-route>.mascot-mark{width:51px;height:58px}
  .team-illustration{min-height:310px}
  .team-illustration img{width:250px}
  .meeting-panel .button,dialog .button{font-size:13px}
  .brand-attribution{font-size:9px}
  footer .mascot-mark{width:43px;height:50px}
  footer .brand-type{width:130px;height:52px}
}
@media(max-width:370px){.header .brand-type{width:119px}.header .mascot-mark{width:39px;height:48px}.map-vendor,.map-provider-row:last-child .map-vendor{font-size:11px}}
@media(prefers-reduced-motion:reduce){.wordmark:hover .mascot-mark img{transform:none}.integration-options .vendor-option:hover{transform:none}}