/* ==========================================================================
   UnoLock: existing page content in the design package's language.
   Everything here uses the design tokens, so both themes work.
   ========================================================================== */
[hidden]{display:none!important}
html.nav-locked{overflow:hidden}
body.mk-root{background:var(--c-paper);color:var(--c-text);font-family:var(--f-sans);font-size:var(--fs-body);line-height:1.6}
.wrap-narrow{max-width:900px}
.ico-sun,.ico-moon{display:none}
:root[data-theme="dark"] .ico-sun,:root[data-theme="light"] .ico-moon{display:block}
.fpay{letter-spacing:.12em;font-size:11px}
.social a,.social button{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer}
.social a:hover,.social button:hover{color:var(--c-ink)}
.site-footer address a:hover,.fbottom a:hover{color:var(--c-ink)}
.cyb-dialog{background:var(--c-paper);color:var(--c-text);border:1px solid var(--c-rule);padding:32px;max-width:480px;margin:auto}
.cyb-dialog::backdrop{background:var(--c-veil)}
.cyb-dialog p{margin:12px 0 24px}
.final-team{margin-top:24px;color:var(--c-dim);font-size:14px}
.fmodal-title{margin-bottom:12px}
.fmodal-body p{margin-bottom:12px}
.fmodal-body ul{list-style:disc;padding-left:20px;margin-bottom:12px}
.fmodal-body h6{font-weight:700;color:var(--c-ink);margin:16px 0 8px}
.fmodal-body .alert{border:1px solid var(--c-danger-fill);border-left-width:3px;background:var(--c-tint-pink);color:var(--c-ink);padding:12px 16px}
.sh-note{border:1px solid var(--c-rule);border-left:3px solid var(--c-violet);background:var(--c-tint);padding:12px 16px;margin-bottom:16px;text-align:left}
.sh-note-tag{display:block;font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-violet);margin-bottom:6px}
.sh-note b{color:var(--c-ink)}
/* self-hosted page */
.sh-cmd{margin-top:16px}
.sh-cmd .install{white-space:pre;overflow-x:auto;margin:0 0 12px}
.sh-cmd code{font:inherit;color:inherit}
.sh-spec{margin:0;border-top:1px solid var(--c-rule)}
.sh-spec>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;padding:16px 0;border-bottom:1px solid var(--c-rule)}
.sh-spec dt{font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-dim);padding-top:3px}
.sh-spec dd{margin:0;color:var(--c-text)}
.sh-steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--c-rule)}
.sh-steps>li{counter-increment:s;display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:16px;padding:32px 0;border-bottom:1px solid var(--c-rule)}
.sh-steps>li::before{content:counter(s,decimal-leading-zero) "/06";grid-row:span 3;font-family:var(--f-mono);font-size:12px;color:var(--c-violet);padding-top:5px}
.sh-steps h3{margin-bottom:8px}
.sh-steps p{max-width:68ch;margin:0}
.sh-steps a,.fmodal-body a{color:var(--c-violet);text-decoration:underline;text-underline-offset:3px}
.sh-steps code{font-family:var(--f-mono);font-size:.9em;color:var(--c-ink)}
.sh-note-box{margin-top:24px;max-width:760px}
.sh-more{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:24px}
.sh-gap{margin-top:24px}
.sh-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sh-compare>div{border:1px solid var(--c-rule);background:var(--c-raise);box-shadow:inset 0 1px 0 var(--c-hi);padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.sh-compare p{flex:1;margin:0}
@media(max-width:700px){.sh-compare{grid-template-columns:minmax(0,1fr)}.sh-spec>div{grid-template-columns:minmax(0,1fr);gap:4px}.sh-steps>li{grid-template-columns:minmax(0,1fr)}.sh-steps>li::before{grid-row:auto;margin-bottom:8px}}

/* section menu on legal and security pages */
.sec-strip{border-bottom:1px solid var(--c-rule);background:var(--c-soft)}
.sec-strip .wrap{display:flex;flex-wrap:wrap;gap:4px 20px;padding-top:10px;padding-bottom:10px}
@media(max-width:768px){.sec-strip .wrap{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}}
.sec-strip a{white-space:nowrap;font-size:13.5px;font-weight:500;color:var(--c-dim);padding:4px 0;border-bottom:2px solid transparent}
.sec-strip a:hover,.sec-strip a.on{color:var(--c-ink)}
.sec-strip a.on{border-bottom-color:var(--c-violet)}

/* ---------- existing pages ---------- */
.legacy{color:var(--c-text);overflow-wrap:anywhere}
.legacy :is(.container,.container-fluid){max-width:var(--max);padding-left:var(--gutter);padding-right:var(--gutter);margin-left:auto;margin-right:auto}
.legacy img{max-width:100%;height:auto}
.legacy p{margin:0 0 16px}
.legacy strong,.legacy b{color:var(--c-ink);font-weight:700}
.legacy a:not(.btn){color:var(--c-violet);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.legacy a:not(.btn):hover{text-decoration-thickness:2px}
.legacy ul,.legacy ol{padding-left:22px;margin:0 0 16px}
.legacy li{margin-bottom:8px}
.legacy ul{list-style:square}
.legacy ul li::marker{color:var(--c-violet)}
.legacy ol{list-style:decimal}
.legacy hr{border:0;border-top:1px solid var(--c-rule);margin:32px 0;opacity:1}
.legacy h1,.legacy h2,.legacy h3,.legacy h4,.legacy h5,.legacy h6{color:var(--c-ink);text-transform:none;overflow-wrap:break-word;word-break:normal}
.legacy h1,.legacy h2{font-family:var(--f-disp);font-stretch:87.5%;font-weight:500;font-size:var(--fs-h2);line-height:1.06;letter-spacing:-.035em;margin:0 0 24px}
.legacy h3{font-family:var(--f-sans);font-weight:700;font-size:var(--fs-h3);line-height:1.25;letter-spacing:-.01em;margin:32px 0 12px}
.legacy h4,.legacy h5,.legacy h6{font-family:var(--f-sans);font-weight:700;font-size:18px;line-height:1.3;margin:24px 0 8px}
.legacy code{font-family:var(--f-mono);font-size:.9em;color:var(--c-ink);word-break:break-word}

/* spacing helpers the old theme provided */
.sec-ptb-100{padding-top:96px;padding-bottom:96px}
.mb-100{margin-bottom:96px}.mb-60{margin-bottom:48px}.mb-50{margin-bottom:48px}.mb-40{margin-bottom:32px}.mb-30{margin-bottom:24px}.mb-20{margin-bottom:16px}.mb-15{margin-bottom:12px}.mb-10{margin-bottom:8px}
.mt-40{margin-top:32px}.mt--60,.mt--30{margin-top:0}.mr-30{margin-right:24px}
.plr-70,.plr-30{padding-left:0;padding-right:0}
.pl-0{padding-left:0}
.header-offset{margin-top:0}
.legacy .pb-0{padding-bottom:0}.legacy .pb-5{padding-bottom:48px}
.ul-li ul,.ul-li-block ul{list-style:none;padding:0;margin:0}
.text-left{text-align:left}.text-right{text-align:right}
@media(max-width:768px){.sec-ptb-100{padding-top:64px;padding-bottom:64px}.mb-100{margin-bottom:64px}}

/* page openers: same treatment as the design's inner page hero */
.legacy .breadcrumb-section{padding-top:clamp(56px,8vw,112px);padding-bottom:0}
.legacy :is(.page-title,.details-content>.item-title){font-family:var(--f-disp);font-stretch:112.5%;font-weight:500;font-size:var(--fs-h1);line-height:1;letter-spacing:-.045em;color:var(--c-ink);margin:0 0 24px}
.legacy .breadcrumb-section .row{display:block}
.legacy .breadcrumb-section .row>*{width:100%;max-width:none}
.legacy .details-section{padding-top:clamp(56px,8vw,112px)}
.legacy .post-meta ul{display:flex;flex-direction:column;gap:6px}
.legacy .post-meta li{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;color:var(--c-dim);margin:0}

/* section headings */
.legacy .section-title{margin-bottom:48px}
.legacy .title-text{font-family:var(--f-disp);font-stretch:87.5%;font-weight:500;font-size:var(--fs-h2);line-height:1.06;letter-spacing:-.035em;color:var(--c-ink)}
.legacy .item-text,.legacy .sub-title{color:var(--c-text)}
.legacy .serial-number{font-family:var(--f-mono);font-size:12px;color:var(--c-violet);display:block;margin-bottom:8px}

/* legal documents */
.legacy .content-block{max-width:78ch}
.legacy .details-content{max-width:none}
.legacy .content-block>h1,.legacy .c6{font-size:clamp(28px,3vw,40px);margin:64px 0 20px;padding-top:32px;border-top:1px solid var(--c-rule)}
.legacy .content-block>h1:first-child{margin-top:0;padding-top:0;border-top:0}
.legacy .content-block>h2,.legacy .c7,.legacy .content-block-heading{font-family:var(--f-sans);font-stretch:100%;font-weight:700;font-size:var(--fs-h3);line-height:1.25;letter-spacing:-.01em;margin:32px 0 12px}
.legacy .c4{margin-bottom:16px}
.legacy .content-block br{display:none}
.legacy .content-block p br,.legacy .content-block li br{display:inline}
.legacy table,.legacy .il-inline-2{width:100%;border-collapse:collapse;margin:24px 0;font-size:15px}
.legacy .table{--bs-table-bg:transparent;--bs-table-color:var(--c-text);--bs-table-border-color:var(--c-rule);color:var(--c-text);border-color:var(--c-rule)}
.legacy th,.legacy .il-inline-4{background:var(--c-soft);color:var(--c-ink);font-weight:700;padding:12px;text-align:left;border-bottom:1px solid var(--c-rule)}
.legacy td,.legacy .il-inline-6{padding:12px;color:var(--c-text);border-bottom:1px solid var(--c-rule);vertical-align:top}
.legacy .il-inline-3{background:var(--c-soft)}
.legacy .il-inline-5{border-bottom:1px solid var(--c-rule)}
.legacy .il-inline-7{background:var(--c-tint-gold);border:1px solid var(--c-gold);border-left-width:3px;color:var(--c-text);padding:12px 16px;margin-top:20px}
.legacy .il-inline-8{background:var(--c-soft);border:1px solid var(--c-rule);color:var(--c-text);padding:20px;margin-top:32px}
.legacy .table-responsive{overflow-x:auto}

/* cards */
.legacy :is(.service-default,.testimonial-boxed,.about-service,.trust-card,.pricing-table){background:var(--c-raise);border:1px solid var(--c-rule);box-shadow:inset 0 1px 0 var(--c-hi);padding:24px;height:calc(100% - 24px);margin-bottom:24px;text-align:left;color:var(--c-text)}
.legacy .service-default .item-title,.legacy .testimonial-boxed .person-name,.legacy .trust-card h3{font-family:var(--f-sans);font-stretch:100%;font-weight:700;font-size:var(--fs-h3);line-height:1.25;letter-spacing:-.01em;color:var(--c-ink);margin:0 0 12px}
.legacy .item-icon{display:block;margin-bottom:16px}
.legacy .item-icon img{height:48px;width:auto}
.legacy .person-title{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;color:var(--c-dim);margin-bottom:12px}
.legacy .person-comment{color:var(--c-text)}
.legacy .info-icon{color:var(--c-dim)}
.legacy .item-title-link{color:var(--c-violet)}
.legacy .service-section .row>[class*=col-]{margin-bottom:0}
.legacy .bg-default-black{background:var(--c-soft)!important;color:var(--c-text)!important}
.legacy .text-white{color:var(--c-ink)!important}
.legacy .text-muted{color:var(--c-dim)!important}
.legacy .testimonial-section,.legacy .service-section{background:var(--c-soft)}
.legacy .about-section,.legacy .security-section,.legacy .howtouse-section,.legacy .feedback-section{background:transparent}
.legacy .about-section+.about-section,.legacy .security-section:nth-of-type(even){background:var(--c-soft)}
.legacy :is(.about-image,.security-image,.feedback-image){max-width:420px;margin:0 auto 24px}
.legacy :is(.about-image,.security-image,.feedback-image) img{width:100%;display:block}
.legacy .about-content,.legacy .security-content,.legacy .feedback-content{max-width:68ch}
.legacy .hub-list>ul>li{margin-bottom:8px}

/* notices */
.legacy .alert{border:1px solid var(--c-rule);border-left-width:3px;border-radius:0;background:var(--c-soft);color:var(--c-text);padding:12px 16px;margin-bottom:20px}
.legacy .alert-info{border-color:var(--c-violet);background:var(--c-tint)}
.legacy .alert-warning{border-color:var(--c-gold);background:var(--c-tint-gold)}
.legacy .alert-success{border-color:var(--c-green);background:var(--c-tint-green)}
.legacy .alert-secondary{border-color:var(--c-rule)}
.legacy .alert-link{color:inherit}

/* buttons */
.legacy .btn{border-radius:0}
.legacy .btn-primary,.legacy .btn-open-vault{background:var(--c-fill);border-color:var(--c-fill);color:var(--c-on-fill);text-decoration:none}
.legacy .btn-primary:hover,.legacy .btn-open-vault:hover{background:var(--c-fill-hover);border-color:var(--c-fill-hover);color:var(--c-on-fill)}
.legacy .ai-cta-group{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

/* trust centre */
.trust-callout{border:1px solid var(--c-gold);border-left-width:3px;background:var(--c-tint-gold);padding:24px;margin-bottom:32px}
.trust-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.legacy .trust-card{height:100%;margin:0}
.trust-card ul{margin:0;padding-left:20px}
.trust-table{border:1px solid var(--c-rule)}
.trust-row{display:grid;grid-template-columns:220px 1fr;border-bottom:1px solid var(--c-rule)}
.trust-row:last-child{border-bottom:0}
.trust-row strong,.trust-row span{padding:16px 20px}
.trust-row strong{background:var(--c-soft);color:var(--c-ink)}
@media(max-width:991px){.trust-grid{grid-template-columns:1fr}}
@media(max-width:767px){.trust-row{grid-template-columns:1fr}}

/* carousel */
.owl-carousel{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;padding-bottom:12px}
.owl-carousel>.item{flex:0 0 100%;min-width:0;scroll-snap-align:start}
.legacy .owl-carousel .testimonial-boxed{height:100%;margin:0}

/* feature modals */
#modal-container .modal{position:fixed;inset:0;z-index:var(--z-modal);display:none;overflow-y:auto;opacity:1;max-width:none;background:transparent;border:0}
#modal-container .modal.show{display:block}
.modal-dialog{transform:none!important}
.modal-backdrop{position:fixed;inset:0;z-index:calc(var(--z-modal) - 1);background:var(--c-veil);opacity:1}
.modal-content,.modal-content.bg-default-black{background:var(--c-paper)!important;color:var(--c-text)!important;border:1px solid var(--c-rule)!important;border-radius:0}
.modal-content .modal-title{font-family:var(--f-sans);font-weight:700;font-size:var(--fs-h3);color:var(--c-ink)!important;letter-spacing:-.01em}
.modal-content .text-white{color:var(--c-ink)!important}
.modal-content .close{background:none;border:0;font-size:24px;color:var(--c-ink)!important;cursor:pointer;line-height:1}
.modal-content .modal-body{text-align:left!important}
.modal-content .modal-body p{margin-bottom:12px}
.modal-content .modal-body>img{height:48px;width:auto;display:block}
.modal-content a:not(.btn){color:var(--c-violet);text-decoration:underline;text-underline-offset:3px}
.modal-content .alert{border-radius:0}
.modal-footer .btn{border-radius:0}
.modal-footer .btn-secondary,.modal-footer .btn-primary{background:var(--c-fill);border-color:var(--c-fill);color:var(--c-on-fill)}

/* plain buttons and boxes the old theme coloured */
.legacy a.btn:not(.btn-primary):not(.btn-prompt),.legacy button.btn:not(.btn-primary):not(.btn-prompt){background:transparent;border:1px solid var(--c-ink);color:var(--c-ink);text-decoration:none;box-shadow:none}
.legacy a.btn:not(.btn-primary):not(.btn-prompt):hover{background:var(--c-ink);color:var(--c-paper)}
.legacy .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-sans);font-weight:500;font-size:15.5px;padding:14px 22px;min-height:48px}
.sh-cmd .install{background:var(--c-sunk);border:1px solid var(--c-rule);color:var(--c-ink)}
.legacy .il-inline-3,.legacy .il-inline-43{background:var(--c-soft)}
.legacy .il-inline-29,.legacy .il-inline-37,.legacy .il-inline-42{margin-left:0;background:var(--c-soft);color:var(--c-text);border-left:3px solid var(--c-violet)}
.legacy .il-inline-37{border-left-color:var(--c-green)}
.legacy .il-inline-38{background:var(--c-soft);color:var(--c-text);border-radius:0}
.legacy .il-inline-39{color:var(--c-violet)}
.legacy .il-inline-40{color:var(--c-dim)}
.legacy .il-inline-26,.legacy .text-highlight,.legacy .fw-light-italic-xs{color:var(--c-blue)}
.legacy .il-inline-27,.legacy .text-note{color:var(--c-text)}
.legacy .highlight-check-icon{color:var(--c-pink)}
.legacy .il-inline-30,.legacy .il-inline-31{background:transparent;min-height:0}
.legacy .il-inline-9{position:static;width:auto;height:auto;background:transparent;z-index:auto;overflow:visible}
.legacy .il-inline-10{min-height:60vh;padding:64px var(--gutter)}
.legacy .il-inline-11{color:var(--c-text);font-family:var(--f-sans)}
.legacy .il-inline-14{color:var(--c-violet)}
.legacy .il-inline-15,.legacy .il-inline-17,.legacy .il-inline-18{color:var(--c-text)}
.legacy .il-inline-19{background:var(--c-raise);border-radius:0}
.legacy .il-inline-21{background:var(--c-input);color:var(--c-ink);border:1px solid var(--c-rule);border-radius:0}
.legacy .il-inline-22{background:var(--c-fill);color:var(--c-on-fill);border-radius:0}
.legacy .il-inline-23{color:var(--c-pink)}

/* page opener spacing, section materials, readable comparison marks */
.legacy .breadcrumb-section{padding-bottom:clamp(32px,4vw,56px)!important}
.legacy section.mat-alt{background:var(--c-paper);color:var(--c-text)}
.legacy .testimonial-section,.legacy .service-section,.legacy .about-section+.about-section,.legacy .security-section:nth-of-type(even){background:var(--c-paper)}
.legacy section.bg-default-black{background:var(--c-paper)!important}
.cmp .n,.cmp .n .cmp-v,.cmp-legend .n{color:var(--c-dim)}

/* the full lockup: padlock, unolock(R), CYBVAULT */
.mk-brand .brand-logo,.mnav-top .brand-logo,.fbrand .brand-logo{display:block;max-width:100%}
.nav{min-height:72px}
@media(max-width:560px){.nav{height:68px;min-height:68px}.mk-brand .brand-logo,.mnav-top .brand-logo{height:46px;width:auto}}

/* Blended images. Each material gets the treatment that melts the artwork into it:
   pitch sections and paper sections can occur in either theme, so these key on the section, not only the theme.
   .blend-white  white-background artwork
   .blend-photo  pale photographs, faded harder at the edges
   .blend-black  black-background artwork */
.legacy section:has(img.blend){overflow-x:clip}
.legacy :has(>img.blend){position:relative;max-width:480px;margin:0 auto;isolation:auto}
.legacy .il-inline-35:has(>img.blend){max-width:none}
.legacy :has(>img.blend)::before{content:"";position:absolute;inset:-4%;background:radial-gradient(ellipse 58% 52% at 50% 58%,var(--c-tint),transparent 72%);pointer-events:none}
.legacy img.blend{position:relative;display:block;width:112%;max-width:none;height:auto;max-height:640px;margin-left:-6%;object-fit:contain}
.legacy img.blend-white{-webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 76%,transparent 100%);mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 76%,transparent 100%)}
.legacy img.blend-photo{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 52%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 52%,transparent 100%)}
.legacy img.blend-black{width:100%;max-width:760px;margin:0 auto;max-height:60vh}
/* on pitch */
:root[data-theme="dark"] .legacy section:not(.mat-alt) img.blend-white,:root[data-theme="light"] .legacy section.mat-alt img.blend-white{filter:invert(1) hue-rotate(180deg) saturate(1.25) contrast(1.08);mix-blend-mode:screen}
:root[data-theme="dark"] .legacy section:not(.mat-alt) img.blend-photo,:root[data-theme="light"] .legacy section.mat-alt img.blend-photo{filter:invert(1) hue-rotate(180deg) saturate(1.3) contrast(1.3) brightness(.85);mix-blend-mode:screen}
:root[data-theme="dark"] .legacy section:not(.mat-alt) img.blend-black,:root[data-theme="light"] .legacy section.mat-alt img.blend-black{mix-blend-mode:screen}
/* on paper */
:root[data-theme="light"] .legacy section:not(.mat-alt) img.blend-white,:root[data-theme="dark"] .legacy section.mat-alt img.blend-white{filter:brightness(1.04) contrast(1.06);mix-blend-mode:multiply}
:root[data-theme="light"] .legacy section:not(.mat-alt) img.blend-photo,:root[data-theme="dark"] .legacy section.mat-alt img.blend-photo{filter:brightness(1.12) contrast(1.12);mix-blend-mode:multiply}
:root[data-theme="light"] .legacy section:not(.mat-alt) img.blend-black,:root[data-theme="dark"] .legacy section.mat-alt img.blend-black{filter:invert(1) hue-rotate(180deg);mix-blend-mode:multiply}
/* pop-up icons are dark tiles: on the light theme they flip so the tile disappears */
:root[data-theme="light"] .modal-content .modal-body img{filter:invert(1) hue-rotate(180deg) brightness(1.2);mix-blend-mode:multiply}
@media(max-width:767px){
  .legacy :has(>img.blend){max-width:360px}
  .legacy img.blend{width:100%;margin-left:0;max-height:440px}
  .legacy section:has(img.blend-white){padding-top:0}
  .legacy :has(>img.blend-white){margin-top:-40px;margin-bottom:0}
}
/* .blend-glow: the shield photo, pushed harder so it stays vivid on pitch. */
.legacy img.blend-glow{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 52%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 52%,transparent 100%)}
:root[data-theme="dark"] .legacy section:not(.mat-alt) img.blend-glow,:root[data-theme="light"] .legacy section.mat-alt img.blend-glow{filter:invert(1) hue-rotate(180deg) saturate(1.6) contrast(1.9) brightness(.7);mix-blend-mode:screen}
:root[data-theme="light"] .legacy section:not(.mat-alt) img.blend-glow,:root[data-theme="dark"] .legacy section.mat-alt img.blend-glow{filter:brightness(1.12) contrast(1.12);mix-blend-mode:multiply}
/* black line icons on the About cards: white on pitch sections */
.legacy .item-icon{overflow:hidden;height:88px;display:flex;align-items:center;justify-content:flex-start}
.legacy .item-icon img[src$=".svg"]{height:240px;width:auto;max-width:none;margin:0 0 0 -60px}
:root[data-theme="dark"] .legacy section:not(.mat-alt) .item-icon img[src$=".svg"],:root[data-theme="light"] .legacy section.mat-alt .item-icon img[src$=".svg"]{filter:invert(1)}

/* "get safe." reveal. If the script never runs, the hold ends by itself and the heading shows. */
@keyframes cyb-hold{0%{opacity:0}100%{opacity:1}}
.cyb-motion .hero-title:not(.scr-on) .ch>span{animation:cyb-hold 1.8s steps(1) both}
.hero-title .ch>span.scr,.hero-title .dot>span.scr{color:var(--c-faint)}
/* .blend-keep: the Feedback bubble. It is not flipped on pitch, so the padlock stays light. */
.legacy img.blend-keep{-webkit-mask-image:radial-gradient(ellipse 48% 48% at 50% 50%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 48% 48% at 50% 50%,#000 58%,transparent 100%)}
:root[data-theme="dark"] .legacy section:not(.mat-alt) img.blend-keep,:root[data-theme="light"] .legacy section.mat-alt img.blend-keep{filter:brightness(.42) contrast(1.9) saturate(1.6);mix-blend-mode:screen}
:root[data-theme="light"] .legacy section:not(.mat-alt) img.blend-keep,:root[data-theme="dark"] .legacy section.mat-alt img.blend-keep{filter:brightness(.96) contrast(1.35);mix-blend-mode:multiply}
.modal-foot .btn{text-decoration:none}

/* links from marketing sections to their documentation */
.docs-links{display:flex;flex-wrap:wrap;gap:10px 28px;margin:28px 0 0}
.docs-links-tight{margin-top:0}
.two>.sh-span{grid-column:2}
@media(max-width:960px){.two>.sh-span{grid-column:auto}}

/* anonymous feedback pop-up (UnoLock Drop) */
.fb-dialog{max-width:520px;width:calc(100% - 32px)}
.fb-kicker{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-violet);margin:0 0 8px}
.fb-dialog .t-h3{margin:0 0 12px}
.fb-dialog p{margin:0 0 14px}
.fb-points{list-style:none;margin:0 0 14px;padding:0}
.fb-points li{position:relative;padding:6px 0 6px 26px;border-bottom:1px solid var(--c-rule);color:var(--c-text)}
.fb-points li::before{content:"";position:absolute;left:2px;top:12px;width:12px;height:7px;border-left:2px solid var(--c-green);border-bottom:2px solid var(--c-green);transform:rotate(-45deg)}
.fb-note{font-size:14px;color:var(--c-dim)}
.fb-actions{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 14px}
.fb-actions form{margin:0}
.fb-alt{font-size:14px;color:var(--c-dim);margin:0}
.fb-alt a,.fb-link{color:var(--c-violet);text-decoration:underline;text-underline-offset:3px}

/* social media pop-up */
.soc-open{background:none;border:0;padding:0;margin:14px 0 0;font:inherit;font-size:14px;color:var(--c-violet);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.soc-open:hover{color:var(--c-ink)}
.soc-dialog{max-width:560px;width:calc(100% - 32px)}
.soc-dialog .fb-points a{color:var(--c-violet);text-decoration:underline;text-underline-offset:3px}
.soc-grid{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.soc-grid a,.soc-off{display:grid;grid-template-columns:36px 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--c-rule);color:var(--c-ink);text-decoration:none;min-height:58px}
.soc-grid a:hover,.soc-grid a:focus-visible{border-color:var(--c-violet)}
.soc-off{opacity:.55}
.soc-ic{grid-row:1/3;width:36px;height:36px;background:center/contain no-repeat}
.soc-name{font-weight:600;font-size:15px;line-height:1.2}
.soc-handle{font-size:12.5px;color:var(--c-dim);line-height:1.3;overflow-wrap:anywhere}
[data-theme="light"] .soc-ic{filter:invert(1)}
@media (max-width:420px){.soc-grid{grid-template-columns:1fr}}
.soc-youtube{background-image:url(social/youtube.png)}
.soc-instagram{background-image:url(social/instagram.png)}
.soc-tiktok{background-image:url(social/tiktok.png)}
.soc-facebook{background-image:url(social/facebook.png)}
.soc-threads{background-image:url(social/threads.png)}
.soc-x{background-image:url(social/x.png)}
.soc-reddit{background-image:url(social/reddit.png)}
.soc-bluesky{background-image:url(social/bluesky.png)}

/* footer contact rows: one link per row, same rhythm */
.fcontact{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.fcontact li{margin:0;padding:0;line-height:1.5}
.fcontact a,.fcontact .soc-open{font-size:13.5px;margin:0;padding:0;line-height:1.5;text-align:left}
.fbrand address{margin-bottom:12px}
.fcontact{margin:0 0 26px}
.fcontact a,.fcontact .soc-open{display:block;height:20px;line-height:20px;font-family:inherit;font-weight:inherit;letter-spacing:inherit}
.fcontact-mail{font-size:13.5px;height:20px;line-height:20px;color:var(--c-dim)}
.fcontact .fcontact-mail a{display:inline}

/* hero mission statement pop-up */
.mission-dialog{max-width:600px;width:calc(100% - 32px)}
.mission-dialog p{margin:0 0 14px;line-height:1.65}
.mission-dialog .fb-actions{margin-top:22px}
.mission-dialog .t-h3{margin:0 0 14px}

/* federation diagram story (driven by cyb-site.js) */
.fed-packet{transition:opacity .25s}
.fed-packet.on{opacity:1}
.fed-packet rect{fill:var(--c-raise);stroke:var(--c-violet-deep);stroke-width:1.75}
.fed-packet .fed-flap{fill:none;stroke:var(--c-violet-deep);stroke-width:1.75}
.fed-node rect{transition:stroke .35s,fill .35s}
.fed-node.fed-send rect{stroke:var(--c-violet-deep);stroke-width:2.5}
.fed-node.fed-hit rect{stroke:var(--c-green);stroke-width:2.5;fill:var(--c-tint-green)}
.fed-led{transition:r .3s}
.fed-node.fed-hit .fed-led{r:6}
.fed-live .tor span{color:var(--c-faint);transition:color .35s}
.fed-live .tor span.on{color:var(--c-ink)}
.fed-live .tor span[data-fed-step="2"].on{color:var(--c-green)}
/* the landing page line-draw effect sets dash values while it runs; the Tor route must stay dashed */
.fed-art .fed-wire-dash{stroke-dasharray:4 6 !important;stroke-dashoffset:0 !important}
.plate-cap .text-link{display:inline-block;margin-top:4px}

/* the film: produced video in a pop-up */
.vfilm-back{position:fixed;inset:0;z-index:200;background:rgba(10,10,14,.86);display:flex;align-items:center;justify-content:center;padding:16px}
.vfilm{width:min(1120px,100%,calc((100vh - 170px) * 1.7778));background:#1E1E28;border:1px solid #34343F;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.vfilm-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 18px;border-bottom:1px solid #34343F;color:#F2F2F5}
.vfilm-title{font-weight:700;font-size:16px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.vfilm-title .mono{font-weight:400;font-size:12px;color:#9A9AA5}
.vfilm-video{display:block;width:100%;aspect-ratio:16/9;background:#141419}
.vfilm-video:focus{outline:none}
body.vfilm-open{overflow:hidden}
.poster-video{overflow:hidden;background:#1E1E28}
.poster-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.poster-video:hover .poster-img{transform:scale(1.03)}
.chapter-btn{display:flex;gap:inherit;align-items:baseline;width:100%;padding:0;margin:0;background:none;border:0;font:inherit;color:inherit;text-align:left;cursor:pointer}
.chapter-btn:hover,.chapter-btn:focus-visible{color:var(--c-violet)}
.chapters li .chapter-btn .mono{min-width:3.2em}

/* film player: fixed dark colours in both themes; controls below the picture so the captions are never covered */
.vfilm .vfilm-close{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;flex:none;padding:0;background:transparent;color:#F2F2F5;border:1px solid #41414C;border-radius:0;cursor:pointer;box-shadow:none}
.vfilm .vfilm-close:hover{border-color:#F2F2F5;background:rgba(242,242,245,.06)}
.vfilm .vfilm-close:focus-visible,.vfilm-btn:focus-visible,.vfilm-seek:focus-visible{outline:2px solid #988DF7;outline-offset:2px}
.vfilm-stage{background:#141419}
.vfilm-stage:fullscreen{display:flex;align-items:center;justify-content:center}
.vfilm-stage:fullscreen .vfilm-video{max-height:100vh}
.vfilm-video{cursor:pointer}
.vfilm-bar{display:flex;align-items:center;gap:12px;padding:10px 12px;border-top:1px solid #34343F;background:#1E1E28;color:#F2F2F5}
.vfilm-btn{width:38px;height:38px;flex:none;display:inline-flex;align-items:center;justify-content:center;padding:0;background:transparent;color:#F2F2F5;border:1px solid #41414C;cursor:pointer}
.vfilm-btn:hover{border-color:#F2F2F5}
.vfilm-play{background:#F2F2F5;color:#1E1E28;border-color:#F2F2F5}
.vfilm-play:hover{background:#FFFFFF}
.vfilm-time{font-size:12px;color:#ADADB8;white-space:nowrap;min-width:84px}
.vfilm-seek{flex:1;min-width:60px;accent-color:#988DF7;height:4px;cursor:pointer}
@media (max-width:480px){.vfilm-time{min-width:0;font-size:11px}.vfilm-bar{gap:8px;padding:8px}.vfilm-btn{width:34px;height:34px}}