/* Copyright © 2026 Knockmap LTD. All Rights Reserved. */
/* Shared marketing chrome: neutral foundations, controlled signal-colour accents. */
:root{--km-ink:#191b1a;--km-focus:#267d79;--km-surface:#f6f6f3}
.nav-inner{gap:24px}.desktop-nav{gap:24px}.nav-actions{display:flex;align-items:center;gap:21px;margin-left:auto;flex-shrink:0}
.nav-login{font-size:14px;font-weight:650;padding:12px 2px;white-space:nowrap}.nav-login:hover{color:var(--km-focus)}
.button-dark{background:linear-gradient(115deg,#181b1a 35%,#234a44);border:1px solid #36594b;box-shadow:0 3px 14px -9px #27796a99}
.button-dark:hover{background:linear-gradient(115deg,#222725,#285d50);box-shadow:0 6px 20px -10px #27796a99}
.button:active,.round-control:active,.menu-toggle:active{transform:translateY(1px);box-shadow:none}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--km-focus);outline-offset:5px}
.hero{background:#fff}.hero-copy .hero-line:last-child,.hero-copy .hero-line:last-child>span{color:#353f3b}
.hero-description{max-width:700px;margin-inline:auto;color:#626965}.hero-copy .eyebrow{color:#4e6760}
.hero-stage-backdrop{background:linear-gradient(130deg,#f1f3ef,#e9f0eb 65%,#ddeee6);border-color:#dce5de;box-shadow:0 20px 60px -42px #3c62543b}
.hero-stage-backdrop::after{background:radial-gradient(ellipse at 70% 15%,#e2f4cd66,transparent 58%)}
.workflow-section{background:linear-gradient(180deg,#fff,#f8f8f5 64%,#fff)}
.workflow-card,.workflow-card-discovery,.workflow-card-team{background:#f5f5f2;border-color:#e3e5de}
.workflow-card:hover{box-shadow:0 15px 36px -23px #2f665c50}
.workflow-label{color:#73796d}.workflow-card::after{opacity:.25}
.field-section{background:#191d1b}.field-tile:not(.field-photo){background:linear-gradient(135deg,#252b27,#202421);border-color:#465149}
.field-tile:not(.field-photo):hover{background:#29332c;border-color:#8baa96}
.site-footer{background:#191d1b}.site-footer .footer-top,.footer-bottom{border-color:#3b453e}
.footer-links{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}.footer-links>div{min-width:0}
.footer-bottom>p{font-size:12px;max-width:480px}.footer-bottom>p a{text-decoration:underline;text-underline-offset:3px;font-size:inherit}
.day-flow{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);padding:0;margin:32px 0 0;gap:20px;border-top:1px solid #dce2dc}
.day-flow li{padding-top:18px;font-size:13px;line-height:1.9;color:#3e4b43}.day-flow span{display:block;font-size:10px;font-weight:750;letter-spacing:.1em;color:#49725f;margin-bottom:6px}
.platform-availability{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0}
.platform-availability span{font-size:12px;color:#68756a;border-top:1px solid #b9cfc2;padding-top:12px}.platform-availability strong{display:block;font-size:16px;color:#233b2c;margin-bottom:4px}
.conversion-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-block:24px}.conversion-actions .text-link{font-size:13px}
.resource-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding-bottom:64px}
.resource-grid article{padding:34px;border:1px solid #e0e5de;border-radius:24px;background:var(--km-surface);display:flex;flex-direction:column;align-items:flex-start;transition:border-color .3s,transform .3s}
.resource-grid article:hover{border-color:#9fc6b0;transform:translateY(-2px)}
.resource-grid .eyebrow{font-size:11px;color:#5e7568;margin-bottom:20px}.resource-grid h2{font-size:30px;max-width:390px;line-height:1.2;letter-spacing:-.045em}
.resource-grid p{font-size:15px;color:#626d65;line-height:1.8;margin:18px 0 24px;max-width:480px}.resource-grid .text-link{margin-top:auto;color:#285b47}
.resource-support{display:flex;align-items:center;justify-content:space-between;gap:40px;border-top:1px solid #dce5dd;padding-block:42px 72px}.resource-support h2{font-size:42px;margin-top:12px}.resource-support p:not(.eyebrow){margin-top:18px;max-width:460px;color:#677268}
.policy-status{border-left:3px solid #79a78c;background:#f2f6f0;padding:22px 24px;margin-bottom:34px;border-radius:0 12px 12px 0;font-size:15px}.policy-status p{margin-top:8px}.legal-content a{text-decoration:underline;text-underline-offset:3px}.legal-content li{margin:10px 0}
@media(min-width:981px){.desktop-nav{margin-left:auto}.hero-copy h1{font-size:clamp(64px,6.1vw,92px)}.hero-stage{margin-top:28px}}
@media(max-width:1100px) and (min-width:981px){.nav-inner{gap:16px}.desktop-nav{gap:16px}.nav-actions{gap:15px}.nav-inner .brand{font-size:24px}.nav-inner .brand img{width:24px;height:36px}}
@media(max-width:980px){.nav-actions{margin-left:auto;gap:14px}.nav-cta{display:inline-flex;min-height:44px}.nav-login{display:none}.nav-inner{gap:14px}.menu-toggle{flex:0 0 44px;border-radius:12px}.mobile-nav{padding:12px 32px 24px}.mobile-nav .mobile-signup{display:flex;align-items:center;justify-content:space-between;color:#275f49;font-weight:700}.footer-links{grid-template-columns:repeat(2,minmax(0,1fr))}.resource-support{display:block}.resource-support .conversion-actions{margin-bottom:0}}
@media(max-width:760px){.nav-inner .brand{font-size:23px;gap:8px}.nav-inner .brand img{width:22px;height:33px}.nav-inner .nav-cta{font-size:12px;padding:10px 13px;gap:6px}.nav-cta .icon{display:none}.hero-stage-backdrop{background:linear-gradient(130deg,#f0f3ee,#e2eee5)}.day-flow{grid-template-columns:repeat(2,1fr);gap:10px 18px}.day-flow li{font-size:13px}.footer-links{gap:26px 20px}.footer-links a{font-size:13px;padding-block:6px}.resource-grid{grid-template-columns:1fr;gap:16px;padding-bottom:42px}.resource-grid article{padding:26px}.resource-grid h2{font-size:28px}.resource-support h2{font-size:34px}.platform-availability{gap:10px}.platform-availability span{font-size:11px}.conversion-actions{gap:16px}.footer-bottom{display:block}.footer-bottom>p{margin-top:14px}}
@media(max-width:360px){.nav-inner{gap:9px}.nav-inner .brand{font-size:20px;gap:5px}.nav-inner .brand img{width:18px;height:28px}.nav-inner .nav-cta{padding-inline:10px;font-size:11px}.menu-toggle{width:40px;height:40px;flex-basis:40px}.platform-availability{grid-template-columns:1fr}.platform-availability span{display:flex;align-items:center;gap:12px}.platform-availability strong{margin:0;min-width:70px}}
@media(prefers-reduced-motion:reduce){.resource-grid article,.button{transition:none}.resource-grid article:hover{transform:none}}
@media(max-width:760px){.footer-links>div:last-child{grid-column:auto}}
.workflow-grid>.workflow-card{cursor:pointer}.workflow-guide-control{margin-top:20px}.workflow-guide-control .button{min-height:46px}.workflow-explanation{padding:26px;background:#fff;border:1px solid #dce4dc;border-radius:18px;margin-top:20px}.workflow-explanation h3{font-size:25px;line-height:1.2;letter-spacing:-.035em}.workflow-explanation p,.workflow-explanation li{font-size:16px;line-height:1.7;color:#536056}.workflow-explanation p{margin-top:14px}.workflow-explanation ol{padding-left:23px;margin:20px 0}.workflow-explanation li{padding-left:7px;margin-top:12px}.workflow-explanation .workflow-guide-note{font-size:14px;border-top:1px solid #e2e7df;padding-top:16px}.workflow-dialog-heading{position:sticky;top:-28px;z-index:5;background:#f5faf6;padding-block:10px}.workflow-dialog-close{min-width:44px}.actual-app-capture{object-fit:contain;background:#f8f7f3}.contact-email-list{list-style:none;padding:0;margin:22px 0}.contact-email-list li{margin:10px 0;font-size:14px}.contact-email-list strong{display:block;font-size:12px;color:#758277}.contact-email-list a{text-decoration:underline;text-underline-offset:3px}.form-feedback a{text-decoration:underline;font-weight:650}
@media(max-width:760px){.workflow-explanation{padding:22px 18px}.workflow-explanation h3{font-size:23px}.workflow-dialog-heading{top:-20px}.workflow-guide-control .button{width:100%}}

/* Product presentation: properly occupied screens and captions in document flow. */
.brand>span{font-weight:550;letter-spacing:-.065em;white-space:nowrap}
.brand sup{font-size:clamp(10px,.43em,12px);font-weight:550;line-height:0;vertical-align:baseline;letter-spacing:0;top:-1em;margin-left:3px}
.actual-app-capture{display:block;width:100%;height:100%;object-fit:fill;background:#fdfcf9}
.hero-stage{height:620px;isolation:isolate}
.hero-stage .device-tablet{width:77%;left:-2%;top:102px}
.hero-phone{width:43%;height:610px;right:0;top:-5px}
.hero-stage-backdrop{inset:84px 0 25px;border-radius:32px}
.hero-stage .detail-visit{left:1%;top:65px;width:255px;padding:17px;z-index:6}
.hero-stage .detail-route{left:34%;bottom:42px;width:220px;z-index:6}
.hero-stage-footer{display:flex;flex-direction:column;align-items:center;gap:20px;padding:12px 24px 26px;text-align:center}
.hero-stage-footer .preview-disclosure,.hero-stage-footer .scroll-cue{position:static;inset:auto;transform:none;max-width:100%;margin:0}
.hero-stage-footer .preview-disclosure{font-size:11px;line-height:1.65;color:#758078}
.hero-stage-footer .scroll-cue{font-size:10px;line-height:1.5;letter-spacing:.1em}
.focus-art{height:660px;isolation:isolate}
.focus-device{width:410px;max-width:84%;top:14px;left:-5%;height:auto;aspect-ratio:2/3;z-index:4}
.focus-board{top:42px;right:0;width:72%;height:500px;opacity:.72}
.focus-brand-tile{top:25px;left:1%;width:64px;height:66px;border-radius:14px;z-index:3;box-shadow:4px 4px 0 #566e65,8px 16px 30px #0003}
.focus-brand-tile img{width:28px;height:38px;mix-blend-mode:normal}
.focus-symbol-tile{display:none}
.focus-result-card{right:0;bottom:0;width:230px;z-index:5;border-color:#bddacd;box-shadow:0 16px 32px #0002}
.focus-example{margin-top:26px;position:relative}
.focus-disclosure{max-width:450px;color:#a3b9ae}
.showcase-disclosure{line-height:1.65}
.showcase-tabs{justify-content:center}
.showcase-slide:not([data-state=active]){opacity:0;visibility:hidden}
.showcase-slide[data-state=active]{transform:translate(-50%,-50%)}
.story-device-caption small{max-width:280px;line-height:1.5;text-align:center}

/* One restrained signal wave, shared across panels. No click-catching overlays. */
.signal-panel{position:relative;isolation:isolate}
.signal-panel.signal-panel::after{content:'';position:absolute;inset:0;padding:1.5px;border-radius:inherit;pointer-events:none;z-index:8;background:conic-gradient(from var(--km-border-turn),transparent 0deg,transparent 200deg,#69b5a31c 240deg,#4baf9677 280deg,#74d5b9 312deg,#c9edc9 328deg,transparent 349deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:.78;animation:km-border-orbit 14s linear infinite;animation-delay:var(--signal-delay,0s);animation-play-state:paused;transition:opacity .5s}
.signal-panel.is-signal-active::after{animation-play-state:running}
.signal-panel:hover::after,.signal-panel:focus-within::after{opacity:1}
.workflow-card.signal-panel:hover{transform:translateY(-4px);border-color:#b2d5c6;box-shadow:0 18px 42px -27px #245b4c66}
.launch-form.signal-panel::before{display:none}
.page-hidden .signal-panel::after,.workflow-section.is-paused .signal-panel::after{animation-play-state:paused}
@media(min-width:1500px){.hero-stage{height:660px}.hero-phone{height:650px}}
@media(max-width:1200px){.hero-stage{height:570px}.hero-phone{height:560px;width:46%;right:-1%}.hero-stage .device-tablet{top:110px}.hero-stage .detail-route{left:31%;bottom:35px}.focus-art{height:610px}.focus-device{max-width:none;width:94%;left:-11%;top:10px}.focus-board{width:77%;height:475px}.focus-result-card{width:216px}}
@media(max-width:980px){.hero-stage{height:490px}.hero-phone{height:485px;width:49%;right:-2%}.hero-stage .device-tablet{top:120px;width:80%;left:-4%}.hero-stage .detail-visit{width:207px;top:90px}.hero-stage .detail-route{width:185px;left:21%;bottom:22px}.focus-art{height:550px}.focus-device{width:110%;left:-15%;top:10px}.focus-board{height:430px}.focus-result-card{width:210px}}
@media(max-width:760px){
  .hero-stage{height:475px;margin-top:18px}
  .hero-phone{width:290px;height:455px;top:0;right:calc(50% - 155px)}
  .hero-stage .device-tablet{width:75%;left:-6%;top:145px;opacity:.6}
  .hero-stage-backdrop{inset:55px 0 15px;border-radius:24px}
  .hero-stage .floating-detail{display:none}
  .hero-stage-footer{gap:17px;padding-top:0;padding-bottom:24px}
  .hero-stage-footer .preview-disclosure{font-size:11px;max-width:310px}
  .hero-stage-footer .scroll-cue{font-size:9px;letter-spacing:.07em}
  .focus-art{height:auto;display:grid;grid-template-columns:1fr;justify-items:center;padding-bottom:0;gap:10px}
  .focus-device{position:relative;width:min(100%,340px);max-width:none;left:auto;top:auto;grid-row:1;height:auto;aspect-ratio:2/3;margin:0}
  .focus-board{width:72%;top:45px;right:0;height:340px;opacity:.35;z-index:-1}
  .focus-brand-tile{display:none}
  .focus-result-card{position:relative;inset:auto;width:100%;max-width:340px;padding:18px 20px;transform:none!important;box-shadow:0 10px 30px #0002}
  .focus-result-card>span{font-size:10px}.focus-result-card>strong{font-size:22px}.focus-result-card>small{font-size:12px}
  .focus-example{margin-top:24px}.focus-example>p{min-height:0}.focus-disclosure{font-size:11px}
  .workflow-card.signal-panel:hover{transform:none}
}
@media(max-width:420px){.hero-stage{height:445px}.hero-phone{height:433px;width:277px;right:calc(50% - 148px)}.hero-stage .device-tablet{display:none}.hero-stage-backdrop{inset:55px 0 26px}.hero-stage-footer .preview-disclosure{max-width:280px}.focus-device{width:min(100%,310px)}}
@media(prefers-reduced-motion:reduce){.signal-panel.signal-panel::after{animation:none;--km-border-turn:35deg;opacity:.6;transition:none}.workflow-card.signal-panel:hover{transform:none}}
/* Lock the hardware to its native proportions at every breakpoint. */
.hero-stage{height:630px}
.hero-phone{width:410px;height:auto;aspect-ratio:2/3;right:1%;top:0}
.focus-choice[aria-pressed=true]{color:#f2f8f3}
.focus-choice[aria-pressed=true] .focus-choice-heading .icon{color:#c8ead9}
@media(min-width:1500px){.hero-stage{height:660px}.hero-phone{width:434px}}
@media(max-width:980px){.hero-stage{height:550px}.hero-phone{width:360px;right:-3%}.hero-stage .detail-route{bottom:40px}}
@media(max-width:760px){.hero-stage{height:545px}.hero-phone{width:min(360px,100vw);height:auto;left:50%;right:auto;translate:-50% 0;top:0}.hero-stage .device-tablet{top:190px;width:70%}.focus-device{width:min(380px,110%);transform:rotate(-2deg)}.hero-stage-footer{padding-top:5px}}
@media(max-width:420px){.hero-stage{height:calc(min(350px,100vw) * 1.5)}.hero-phone{width:min(350px,100vw)}.hero-stage-backdrop{inset:45px 0 25px}}
.hero-stage .device-tablet{width:68%;left:0;top:88px}
.focus-art{height:auto;display:grid;justify-items:center;gap:16px}
.focus-device{position:relative;inset:auto;width:min(100%,410px);max-width:none;grid-row:1;height:auto;aspect-ratio:2/3;margin:0}
.focus-result-card{position:relative;inset:auto;width:100%;max-width:410px;transform:none!important}
.focus-brand-tile{display:none}
.focus-board{opacity:.35;width:75%;height:440px;top:40px;right:0}
@media(max-width:980px){.hero-stage .device-tablet{width:66%;top:140px;left:-1%}}
@media(max-width:760px){.hero-stage .device-tablet{width:70%;top:190px;left:-6%}.focus-device{width:min(380px,110%)}.focus-result-card{max-width:340px}.focus-board{height:340px}}
