/* kdmackey.com site additions (matches Nanospace theme: Fira Sans) */

/* Site purple: one place. Overrides the theme accent (was #3a0047) used for links, buttons and highlights.
   #7b5cd6: white text on it 4.83:1, it on the page background 4.72:1 (WCAG AA). */
:root { --color_accent: #7b5cd6; --kd-purple: #7b5cd6; }
.sbt-eyebrow { margin: 0 0 .75em; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; opacity: .8; }
.sbt-founder { font-size: .9em; }
.kd-sbt-line { margin-top: 1.5em; }
.kd-sbt-hosting { font-style: italic; }

/* footer */
.nanospace-footer-sbt { margin-top: .5em; font-size: .9em; }

/* mobile menu (replaces former search box) */
.nanospace-header-mobile-vertical-bar .nanospace-header-section-vertical-row > nav.nanospace-header-menu { width: 100%; margin-top: 4.5em !important; }
.nanospace-header-mobile-vertical-bar .nanospace-header-menu .menu { list-style: none; margin: 0; padding: 0; }
.nanospace-header-mobile-vertical-bar .nanospace-header-menu a { text-decoration: none; }

/* hosting pop-up */
.sbt-modal[hidden] { display: none; }
.sbt-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 1.25rem; }
.sbt-modal-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .6); }
.sbt-modal-dialog { position: relative; width: 100%; max-width: 30rem; max-height: calc(100vh - 2.5rem); overflow: auto; padding: 2.5em 2em 2em; text-align: center; background-color: #7b5cd6; background-color: var(--kd-purple, #7b5cd6); color: #fff; box-shadow: 0 1.5em 4em rgba(0, 0, 0, .45); font-size: 1rem; }
.sbt-modal-dialog:focus { outline: none; }
.sbt-modal-dialog h2 { margin: 0 0 .6em; color: #fff; font-weight: 700; line-height: 1.25; }
.sbt-modal-dialog .sbt-lead { font-size: 1.05em; }
.sbt-modal-dialog .sbt-founder { margin-bottom: 0; opacity: .9; }
.sbt-modal-dialog .sbt-founder a { color: #fff; text-decoration: underline; }
.sbt-modal-dialog .button.sbt-cta { margin: .5em 0 1.25em; padding: .9em 2.6em; font-size: 1rem; font-weight: 700; letter-spacing: .12em; background-color: #fff; color: #7b5cd6; color: var(--kd-purple, #7b5cd6); border-color: #fff; }
.sbt-modal-dialog .button.sbt-cta:hover, .sbt-modal-dialog .button.sbt-cta:focus { background-color: transparent; color: #fff; border-color: #fff; }
.sbt-modal .sbt-modal-close { position: absolute; top: .3rem; right: .3rem; width: 2.75rem; height: 2.75rem; margin: 0; padding: 0; line-height: 1; font-size: 1.75rem !important; text-transform: none; letter-spacing: 0; background: transparent; color: #fff; border: 0; box-shadow: none; }
.sbt-modal .sbt-modal-close::after { display: none; }
.sbt-modal .sbt-modal-close:focus-visible { outline: 2px solid #fff; }
html.sbt-modal-active { overflow: hidden; }

/* cookie notice */
.kd-cookie-note[hidden] { display: none; }
.kd-cookie-note { position: fixed; left: 1rem; bottom: 1rem; z-index: 99999; display: flex; align-items: center; gap: .9em; max-width: 24rem; padding: .8em 1em; font-size: .85rem; line-height: 1.45; background: #fff; color: #222; border-left: 4px solid #7b5cd6; border-left-color: var(--kd-purple, #7b5cd6); box-shadow: 0 .5em 2em rgba(0, 0, 0, .2); }
.kd-cookie-note p { margin: 0; }
.kd-cookie-note .kd-cookie-ok { flex: none; margin: 0; padding: .45em 1.2em; font-size: .75rem; font-weight: 700; background-color: #7b5cd6; background-color: var(--kd-purple, #7b5cd6); color: #fff; border-color: #7b5cd6; border-color: var(--kd-purple, #7b5cd6); }
@media (max-width: 30em) { .kd-cookie-note { left: .5rem; right: .5rem; bottom: .5rem; max-width: none; } }
html.sbt-modal-active .kd-cookie-note { display: none; }

/* rounded pop-up, buttons and cookie toast */
.sbt-modal-dialog { border-radius: 18px; box-shadow: 0 1.25em 3.5em rgba(43, 20, 92, .35), 0 .25em .75em rgba(0, 0, 0, .15); }
.sbt-modal-dialog .button.sbt-cta { border-radius: 999px; }
.sbt-modal .sbt-modal-close { border-radius: 50%; }
.sbt-modal .sbt-modal-close:hover { background: rgba(255, 255, 255, .15); }
.kd-cookie-note { border-radius: 14px; border-left: 0; box-shadow: 0 .75em 2.25em rgba(43, 20, 92, .18), 0 .1em .4em rgba(0, 0, 0, .08); }
.kd-cookie-note .kd-cookie-ok { border-radius: 999px; }
.sbt-modal-dialog .sbt-eyebrow, .sbt-modal-dialog .sbt-founder { opacity: 1; }

/* home page teaser box */
.sbt-teaser { margin: 3em auto 1em; max-width: 56rem; padding: 3em 2em; text-align: center; background-color: #7b5cd6; background-color: var(--kd-purple, #7b5cd6); color: #fff; border-radius: 18px; box-shadow: 0 1em 3em rgba(43, 20, 92, .25), 0 .2em .6em rgba(0, 0, 0, .08); }
.sbt-teaser h2 { margin: 0 0 .6em; color: #fff; font-weight: 700; line-height: 1.25; }
.sbt-teaser p { max-width: 40em; margin-left: auto; margin-right: auto; }
.sbt-teaser .sbt-eyebrow { opacity: 1; }
.sbt-teaser .sbt-lead { font-size: 1.15em; }
.sbt-teaser .button.sbt-cta { margin: 1em 0 1.5em; padding: .9em 2.6em; font-size: 1rem; font-weight: 700; letter-spacing: .12em; background-color: #fff; color: #7b5cd6; color: var(--kd-purple, #7b5cd6); border-color: #fff; border-radius: 999px; }
.sbt-teaser .button.sbt-cta:hover, .sbt-teaser .button.sbt-cta:focus { background-color: transparent; color: #fff; border-color: #fff; }
.sbt-teaser .sbt-founder { margin-bottom: 0; }
.sbt-teaser .sbt-founder a { color: #fff; text-decoration: underline; }
@media (max-width: 41.9375em) { .sbt-teaser { margin-left: .25rem; margin-right: .25rem; padding: 2.25em 1.25em; border-radius: 16px; } }

/* Brand gradient: deep royal blue (#1446c4, a deeper shade of SmartBizTech blue #1e6bff) to deep purple (#5e36bc), 135deg.
   White text: 7.77:1 at the blue end, 7.69:1 at the purple end, never below 7.69:1 between (WCAG AAA). */
:root { --kd-blue: #1446c4; --kd-purple-deep: #5e36bc; --kd-gradient: linear-gradient(135deg, #1446c4 0%, #5e36bc 100%); }
.sbt-teaser, .sbt-modal-dialog { background-color: #393ec0; background-image: var(--kd-gradient); }
.sbt-teaser { box-shadow: 0 1em 3em rgba(30, 107, 255, .22), 0 .4em 1.2em rgba(123, 92, 214, .2); }
.sbt-modal-dialog { box-shadow: 0 1.25em 3.5em rgba(30, 60, 160, .35), 0 .25em .75em rgba(0, 0, 0, .15); }
.kd-cookie-note .kd-cookie-ok { background-image: var(--kd-gradient); border-color: transparent; }
.kd-cookie-note { border-top: 3px solid transparent; background: linear-gradient(#fff, #fff) padding-box, var(--kd-gradient) border-box; }
/* logo beside the SmartBizTech label */
.sbt-brand { display: flex; align-items: center; justify-content: center; gap: .6em; }
.sbt-brand .sbt-logo { width: 48px; height: 48px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(255, 255, 255, .85); flex: none; }
.sbt-modal-dialog .sbt-brand .sbt-logo { width: 44px; height: 44px; }

/* deeper gradient tweaks, rounder corners, pop-up animation */
.sbt-teaser { border-radius: 30px; box-shadow: 0 1em 3em rgba(20, 70, 196, .25), 0 .4em 1.2em rgba(94, 54, 188, .2); }
.sbt-modal-dialog { border-radius: 30px; box-shadow: 0 1.25em 3.5em rgba(15, 30, 110, .4), 0 .25em .75em rgba(0, 0, 0, .15); }
.kd-cookie-note { border-radius: 20px; }
.sbt-teaser .button.sbt-cta, .sbt-modal-dialog .button.sbt-cta { color: #5e36bc; color: var(--kd-purple-deep, #5e36bc); }
.sbt-teaser .button.sbt-cta:hover, .sbt-teaser .button.sbt-cta:focus, .sbt-modal-dialog .button.sbt-cta:hover, .sbt-modal-dialog .button.sbt-cta:focus { color: #fff; }
@media (max-width: 41.9375em) { .sbt-teaser { border-radius: 24px; } .sbt-modal-dialog { border-radius: 24px; } }
.sbt-modal:not([hidden]) .sbt-modal-backdrop { animation: kd-fade .25s ease-out; }
.sbt-modal:not([hidden]) .sbt-modal-dialog { animation: kd-pop .3s ease-out; }
@keyframes kd-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes kd-pop { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .sbt-modal:not([hidden]) .sbt-modal-backdrop, .sbt-modal:not([hidden]) .sbt-modal-dialog { animation: none; } }
/* logo centred above the SmartBizTech label */
.sbt-brand { flex-direction: column; gap: 10px; }
/* three-line hosting headline */
.sbt-headline { font-size: clamp(1.3rem, 1.05rem + 1.6vw, 2rem); line-height: 1.2; overflow-wrap: normal; }
.sbt-modal-dialog .sbt-headline { font-size: clamp(1.25rem, 1.05rem + 1.1vw, 1.6rem); }
.sbt-headline .sbt-l1, .sbt-headline .sbt-l2, .sbt-headline .sbt-l3 { display: block; }
.sbt-headline .sbt-l1 { text-wrap: balance; }
.sbt-headline .sbt-l2, .sbt-headline .sbt-l3 { white-space: nowrap; }

/* Home: less space between the hero and the first paragraph, so the text below peeks above the fold. */
.home .site-content-inner { padding-top: 1.75rem; }
@media only screen and (min-width: 55em) { .home .site-content-inner { padding-top: 2.5rem; } }

/* Hero video: the poster stays visible; a video fades in over it only once it is really playing
   (see wp-includes/js/wp-custom-header.min.js), so a blocked or bot-checked embed is never seen. */
.wp-custom-header .hero-video-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .8s ease; pointer-events: none; }
.wp-custom-header video.hero-video-layer { object-fit: cover; }
.wp-custom-header.hero-video-playing .hero-video-layer { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .wp-custom-header .hero-video-layer { transition: none; } }
