/* Pennexx beta_new — palette and type carried over from the 2021 site:
   black/white, grey #b3adad, blues #3399ff / #003366, Helvetica Neue LT Pro. */
@font-face { font-family: "HelveticaNeueLTPro-Md"; src: url('../fonts/HelveticaNeueLTProMd/font.woff2') format('woff2'), url('../fonts/HelveticaNeueLTProMd/font.woff') format('woff'); font-display: swap; }
@font-face { font-family: "HelveticaNeueLTPro-Lt"; src: url('../fonts/HelveticaNeueLTProLt/font.woff2') format('woff2'), url('../fonts/HelveticaNeueLTProLt/font.woff') format('woff'); font-display: swap; }
@font-face { font-family: "HelveticaNeueLTPro-Bd"; src: url('../fonts/HelveticaNeueLTProBd/font.woff2') format('woff2'), url('../fonts/HelveticaNeueLTProBd/font.woff') format('woff'); font-display: swap; }
@font-face { font-family: "HelveticaNeueLTPro-Hv"; src: url('../fonts/HelveticaNeueLTProHv/font.woff2') format('woff2'), url('../fonts/HelveticaNeueLTProHv/font.woff') format('woff'); font-display: swap; }
@import url("//hello.myfonts.net/count/3e9429");

:root {
	--black: #000; --ink: #222; --grey: #b3adad; --grey-dark: #6b6b6b; --line: #d0d0d0;
	--blue: #3399ff; --navy: #003366; --white: #fff; --paper: #f5f6f8;
	--md: "HelveticaNeueLTPro-Md", Helvetica, Arial, sans-serif;
	--lt: "HelveticaNeueLTPro-Lt", Helvetica, Arial, sans-serif;
	--bd: "HelveticaNeueLTPro-Bd", Helvetica, Arial, sans-serif;
	--hv: "HelveticaNeueLTPro-Hv", "Arial Black", Helvetica, sans-serif;
	--wrap: 1200px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font: 17px/1.6 var(--lt); color: var(--ink); background: var(--white); overflow-x: hidden; }
h1, h2, h3, h4 { margin: 0 0 .5em; line-height: 1.1; font-family: var(--bd); text-transform: uppercase; letter-spacing: .01em; }
h1 { font-size: clamp(2.4rem, 6vw, 4.5rem); }
h2 { font-size: clamp(1.8rem, 3.6vw, 2.6rem); }
h3 { font-size: 1.25rem; }
p { margin: 0 0 1em; }
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; display: block; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.section { padding: 80px 0; }
.section--paper { background: var(--paper); }
.section--navy { background: var(--navy); color: var(--white); }
.section--black { background: var(--black); color: var(--white); }
.kicker { font-family: var(--md); color: var(--blue); text-transform: uppercase; letter-spacing: .12em; font-size: .85rem; margin-bottom: .6em; }
.lead { font-size: 1.25rem; color: var(--grey-dark); max-width: 46rem; }
.section--navy .lead, .section--black .lead { color: var(--grey); }
.btn { display: inline-block; font-family: var(--md); font-size: 16px; padding: 14px 28px; border-radius: 4px; border: 2px solid transparent; text-transform: uppercase; letter-spacing: .04em; }
.btn:hover { text-decoration: none; }
.btn-blue { background: var(--blue); color: var(--white); }
.btn-blue:hover { background: var(--navy); }
.btn-ghost { border-color: var(--white); color: var(--white); }
.btn-ghost:hover { background: var(--white); color: var(--black); }
.btn--small { padding: 10px 18px; font-size: 14px; }

/* header */
.header { position: sticky; top: 0; z-index: 50; background: var(--black); border-bottom: 1px solid #222; }
.nav { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; height: 64px; display: flex; align-items: center; justify-content: space-between; }
.logo { font-family: var(--hv); font-size: 1.5rem; color: var(--white); letter-spacing: .04em; }
.logo:hover { text-decoration: none; color: var(--blue); }
.nav__list { list-style: none; margin: 0; padding: 0; display: flex; gap: 28px; align-items: center; }
.nav__link { font-family: var(--md); color: var(--grey); font-size: .95rem; }
.nav__link:hover, .nav__link.is-active { color: var(--white); text-decoration: none; }
.nav__phone { border-left: 1px solid #444; padding-left: 24px; }
.nav__phone a { color: var(--white); font-family: var(--md); font-size: .95rem; }
.nav__toggle { display: none; background: none; border: 0; width: 40px; height: 40px; cursor: pointer; }
.nav__toggle span { display: block; height: 2px; background: var(--white); margin: 7px 8px; }

/* dropdown menus (Products, Services) */
.nav__item--menu { position: relative; }
.nav__caret { display: inline-block; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin-left: 6px; vertical-align: 2px; }
.nav__menu { list-style: none; margin: 0; padding: 10px 0; position: absolute; top: 100%; left: -16px; min-width: 260px; background: var(--black); border: 1px solid #333; border-radius: 8px; display: none; z-index: 60; }
.nav__menu li a { display: block; padding: 9px 18px; color: var(--grey); font-family: var(--md); font-size: .92rem; white-space: nowrap; }
.nav__menu li a:hover { color: var(--white); background: #161616; text-decoration: none; }
.nav__menu-sep { border-top: 1px solid #333; margin-top: 6px; padding-top: 6px; }
.nav__item--menu:hover > .nav__menu, .nav__item--menu:focus-within > .nav__menu, .nav__item--menu.is-open > .nav__menu { display: block; }

/* FileMaster wordmark — text logo as on filemaster.io (FileMaster + periwinkle .io) */
.fm-logo { font-family: var(--bd); font-size: 1.4rem; display: flex; align-items: center; height: 64px; color: #2d3748; }
.fm-logo span { color: #9bb5ff; }

/* LeadEngine wordmark — text logo as on leadengine.guru (Lead / indigo Engine / .guru) */
.le-logo { font-family: var(--bd); font-size: 1.4rem; letter-spacing: -.01em; display: flex; align-items: center; height: 64px; color: var(--ink); }
.le-logo span { color: #4f46e5; }
.le-logo--large { font-size: 2.6rem; height: auto; }

/* hero — the 2021 site's black, oversized two-line heading */
.hero { position: relative; background: var(--black) url('../images/hero-outer-bg.jpg') center/cover no-repeat; color: var(--white); min-height: min(72vh, 760px); display: flex; align-items: center; }
.hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.7) 55%, rgba(0,0,0,.35) 100%); }
.hero .wrap { position: relative; width: 100%; }
.hero__sub { font-family: var(--md); font-size: clamp(1.3rem, 2.6vw, 2rem); color: var(--grey); margin: 0; }
.hero__title { margin-top: 0; text-transform: uppercase; overflow-wrap: anywhere; font-family: var(--hv); font-size: clamp(3.2rem, 9vw, 7.5rem); line-height: .95; color: var(--grey); margin: 0 0 .25em; }
.hero__title em { font-style: normal; color: var(--white); display: block; }
.hero__rule { width: 60%; height: 1px; background: var(--grey); margin: 20px 0 28px; opacity: .6; }
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* hero slider: slides translate horizontally, autoplay, dots */
.hero--slider { display: block; overflow: hidden; touch-action: pan-y; cursor: grab; }
.hero--slider:active { cursor: grabbing; }
.hero--slider img, .hero--slider .hero__title { user-select: none; -webkit-user-drag: none; }
.hero__track { display: flex; width: 100%; transition: transform .8s cubic-bezier(.65,0,.35,1); will-change: transform; }
.hero__slide { flex: 0 0 100%; min-height: min(72vh, 760px); display: flex; align-items: center; position: relative; }
.hero__slide .wrap { position: relative; width: 100%; }
.hero__slide--tenx::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,30,70,.92) 0%, rgba(0,30,70,.72) 55%, rgba(0,0,0,.35) 100%); }
.hero__slide--tenx .hero__title { color: var(--blue); }
.hero__slide--tenx .hero__title em { color: var(--white); }
.hero__dots { position: absolute; left: 0; right: 0; bottom: 22px; display: flex; justify-content: center; gap: 10px; z-index: 2; }
.hero__dot { width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--white); background: transparent; padding: 0; cursor: pointer; opacity: .7; }
.hero__dot.is-active { background: var(--white); opacity: 1; }
@media (prefers-reduced-motion: reduce) { .hero__track { transition: none; } }

/* product cards */
.grid { display: grid; gap: 28px; }
.grid--3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }
.card { background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 28px; display: flex; flex-direction: column; gap: 12px; }
.card__logo { height: 64px; width: 64px; object-fit: contain; }
.card__badge { height: 64px; width: 64px; border-radius: 14px; display: grid; place-items: center; font-family: var(--hv); color: var(--white); background: var(--navy); font-size: 1.4rem; }
.card h3 { margin: 6px 0 0; text-transform: none; }
.card p { color: var(--grey-dark); flex: 1; }
.card a.more { font-family: var(--md); }
.card--more { background: var(--navy); border-color: var(--navy); color: var(--white); grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 28px; }
.card--more h3 { margin: 0; }
.card--more p { flex: 1; margin: 0; }
.card--more p { color: var(--grey); }
.card--more a.more { color: var(--white); }
.card__badge--more { background: var(--blue); font-size: 2rem; }

/* CodeQunity wordmark — reproduced from codequnity.com (text logo: Code / blue Q / purple-gradient unity) */
.cq-logo { font-family: var(--bd); font-size: 1.5rem; letter-spacing: -.01em; display: flex; align-items: center; height: 64px; width: auto; }
.cq-code { color: var(--ink); }
.cq-q { color: #2563eb; }
.cq-unity { background: linear-gradient(135deg, #c084fc 0%, #a855f7 35%, #7c3aed 70%, #6d28d9 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cq-logo--large { font-size: 3rem; height: auto; }
.card__logo--word { width: auto; }

/* feature rows (products / services pages) */
.feature { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; padding: 56px 0; border-top: 1px solid var(--line); }
.feature:first-of-type { border-top: 0; }
.feature--flip .feature__media { order: -1; }
.feature__media { background: var(--paper); border-radius: 12px; min-height: 240px; display: grid; place-items: center; padding: 32px; }
.feature__media img { max-height: 180px; width: auto; }
.feature__media .card__badge { width: 120px; height: 120px; font-size: 2.4rem; border-radius: 24px; }
.feature__media--photo { padding: 0; overflow: hidden; min-height: 300px; }
.feature__media--photo img { width: 100%; height: 100%; max-height: none; object-fit: cover; }
.feature__media--shot { padding: 0; overflow: hidden; min-height: 300px; background: #0b1220; }
.feature__media--shot img { width: 100%; height: 100%; max-height: none; object-fit: cover; object-position: top left; }
.feature ul { padding-left: 20px; color: var(--grey-dark); }
.feature ul strong, .lead strong, p strong { font-family: var(--md); font-weight: normal; color: var(--ink); }
.section--navy strong, .section--black strong { color: var(--white); }

/* vision (lightbulb motif from the 2021 About page) */
.vision { text-align: center; }
.vision img { margin: 24px auto; max-width: 220px; }
.vision__steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 28px; margin-top: 40px; text-align: left; }
.vision__steps div { border-top: 3px solid var(--blue); padding-top: 14px; }
.vision__steps strong { font-family: var(--md); color: var(--white); }

/* three questions */
.questions { list-style: none; padding: 0; margin: 0 0 32px; display: grid; gap: 16px; }
.questions li { background: var(--white); border-left: 4px solid var(--blue); padding: 18px 22px; font-family: var(--md); font-size: 1.15rem; }
.questions li span { color: var(--blue); margin-right: 10px; }

/* 10x moment */
.tenx-nav { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 28px; }
.tenx-nav a { font-family: var(--md); font-size: .9rem; color: var(--grey); text-transform: uppercase; letter-spacing: .08em; border-bottom: 1px solid transparent; }
.tenx-nav a:hover { color: var(--white); border-color: var(--blue); text-decoration: none; }
.tenx-stats { display: grid; grid-template-columns: 1fr auto 1fr 1.2fr; gap: 24px; align-items: stretch; }
.tenx-stats > div { padding: 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.tenx-stats strong { display: block; font-family: var(--hv); font-size: clamp(2rem, 4vw, 3.2rem); color: var(--navy); line-height: 1; margin-bottom: 8px; }
.tenx-stats span { color: var(--grey-dark); }
.tenx-stats .tenx-arrow { border: 0; background: none; padding: 0; font-family: var(--hv); font-size: 3rem; color: var(--blue); text-align: center; align-self: center; }
.tenx-stats--dark > div { background: #111; border-color: #333; }
.tenx-stats--dark strong { color: var(--white); }
.tenx-stats--dark span { color: var(--grey); }
.tenx .hero__actions { margin-top: 32px; }
.tenx-timeline { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 36px; }
.tenx-timeline div { border-top: 3px solid var(--blue); padding-top: 14px; }
.tenx-timeline span { display: block; color: var(--grey); font-family: var(--md); text-transform: uppercase; letter-spacing: .08em; font-size: .85rem; }
.tenx-timeline strong { font-family: var(--bd); font-size: 1.3rem; color: var(--white); }
.btn--dark { border-color: var(--ink); color: var(--ink); }
.btn--dark:hover { background: var(--ink); color: var(--white); }

/* contact form (classes mirror the live site's handler expectations) */
.form { display: grid; gap: 14px; max-width: 560px; }
.form-label { font-family: var(--md); font-size: .9rem; text-transform: uppercase; letter-spacing: .08em; color: var(--grey-dark); }
.form-input { width: 100%; padding: 14px; border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.form-input:focus { outline: 2px solid var(--blue); border-color: var(--blue); }
textarea.form-input { min-height: 160px; resize: vertical; }

/* legal pages */
.legal { max-width: 46rem; }
.legal h2 { font-size: 1.15rem; margin-top: 2em; }
.legal p { color: var(--grey-dark); }

/* cookie consent modal */
body.consent-open { overflow: hidden; }
.consent { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.72); display: flex; align-items: center; justify-content: center; padding: 20px; }
.consent__box { background: var(--white); color: var(--ink); max-width: 560px; width: 100%; max-height: 90vh; overflow: auto; border-radius: 12px; padding: 28px 32px; box-shadow: 0 20px 60px rgba(0,0,0,.4); font-size: .95rem; }
.consent__box h2 { font-size: 1.3rem; margin-bottom: .6em; }
.consent__box p { margin-bottom: .7em; color: var(--grey-dark); }
.consent__label { font-family: var(--md); color: var(--ink) !important; margin-bottom: .3em !important; }
.consent__box ul { margin: 0 0 .9em; padding-left: 20px; color: var(--grey-dark); }
.consent__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
.consent__actions .btn { font-size: 14px; padding: 11px 20px; }

/* footer */
.footer { background: var(--black); color: var(--grey); padding: 64px 0 24px; }
.footer__grid { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 36px; }
.footer h4 { color: var(--white); font-size: .95rem; letter-spacing: .1em; }
.footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: .95rem; }
.footer a { color: var(--grey); }
.footer a:hover { color: var(--white); }
.footer__tag { max-width: 24rem; }
.logo--footer { display: inline-block; margin-bottom: 10px; }
.footer__legal { max-width: var(--wrap); margin: 22px auto 0; padding: 0 24px; font-size: .78rem; line-height: 1.55; color: #8a8a8a; }
.footer__legal p { margin: 0 0 .7em; }
.footer__legal strong { color: var(--grey); font-family: var(--md); font-weight: normal; }
.footer__legal a { color: var(--grey); text-decoration: underline; }
.footer__bar { max-width: var(--wrap); margin: 48px auto 0; padding: 20px 24px 0; border-top: 1px solid #333; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: .85rem; }

@media (max-width: 860px) {
	.nav__toggle { display: block; }
	.nav__list { display: none; position: absolute; top: 64px; left: 0; right: 0; background: var(--black); flex-direction: column; align-items: flex-start; padding: 16px 24px 24px; gap: 16px; border-bottom: 1px solid #333; }
	.nav__list.is-open { display: flex; }
	.nav__phone { border: 0; padding: 0; }
	.nav__menu { position: static; display: none; border: 0; background: transparent; padding: 4px 0 4px 14px; min-width: 0; }
	.nav__item--menu:hover > .nav__menu { display: none; }
	.nav__item--menu.is-open > .nav__menu { display: block; }
	.card--more { flex-direction: column; align-items: flex-start; }
	.feature { grid-template-columns: 1fr; gap: 24px; }
	.feature--flip .feature__media { order: 0; }
	.footer__grid { grid-template-columns: 1fr 1fr; }
	.tenx-stats { grid-template-columns: 1fr 1fr; }
	.tenx-stats .tenx-arrow { display: none; }
	.tenx-timeline { grid-template-columns: 1fr; }
	.grid--4 { grid-template-columns: 1fr 1fr; }
	.section { padding: 56px 0; }
}
