/* ==========================================================================
   AxisOne — main stylesheet
   ========================================================================== */

:root {
	--axis-green: #5C9B1E;
	--axis-green-light: #7EC62E;
	--axis-green-dark: #3E6B12;
	--axis-green-50: #EEF7E4;
	--axis-ink: #13211A;
	--axis-slate: #4B5A52;
	--axis-slate-light: #76867C;
	--axis-steel: #1C3F5E;
	--axis-steel-light: #2D5F7C;
	--axis-amber: #F2A93B;
	--axis-bg: #F7FAF5;
	--axis-surface: #FFFFFF;
	--axis-border: #E3E9E0;

	--font-head: 'Sora', Arial, sans-serif;
	--font-body: 'Inter', Arial, sans-serif;

	--container: 1240px;
	--radius-sm: 8px;
	--radius-md: 14px;
	--radius-lg: 22px;
	--shadow-sm: 0 1px 2px rgba(19,33,26,.06), 0 1px 1px rgba(19,33,26,.04);
	--shadow-md: 0 8px 24px rgba(19,33,26,.08);
	--shadow-lg: 0 24px 60px rgba(19,33,26,.14);
	--admin-bar-height: 0px;
}

/* -- Reset / base -------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 140px; }
body {
	margin: 0;
	font-family: var(--font-body);
	color: var(--axis-ink);
	background: var(--axis-bg);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, h4, h5 { font-family: var(--font-head); font-weight: 700; line-height: 1.15; margin: 0 0 .5em; color: var(--axis-ink); }
p { margin: 0 0 1em; }
button { font-family: inherit; cursor: pointer; }
.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }

.axisone-icon { width: 1em; height: 1em; display: inline-block; vertical-align: -0.125em; }
.icon-sm { width: 18px; height: 18px; }
.icon-xs { width: 14px; height: 14px; }

h1 { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.4rem); }
h2 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.5rem); }
h3 { font-size: clamp(1.2rem, 1rem + .7vw, 1.5rem); }
.eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	font-family: var(--font-head); font-size: .8rem; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; color: var(--axis-green-dark);
	background: var(--axis-green-50); padding: 6px 14px; border-radius: 999px;
	margin-bottom: 18px;
}
.lede { font-size: 1.15rem; color: var(--axis-slate); max-width: 640px; }
.text-center { text-align: center; }
.mx-auto { margin-left: auto; margin-right: auto; }

/* -- Buttons -------------------------------------------------------------*/
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	font-family: var(--font-head); font-weight: 600; font-size: .95rem;
	padding: 14px 26px; border-radius: 999px; border: 2px solid transparent;
	transition: all .18s ease; white-space: nowrap;
}
.btn--primary { background: var(--axis-green); color: #fff; box-shadow: var(--shadow-sm); }
.btn--primary:hover { background: var(--axis-green-dark); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.btn--secondary { background: var(--axis-surface); color: var(--axis-ink); border-color: var(--axis-border); }
.btn--secondary:hover { border-color: var(--axis-green); color: var(--axis-green-dark); }
.btn--ghost-light { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.35); }
.btn--ghost-light:hover { background: rgba(255,255,255,.18); }
.btn--sm { padding: 10px 18px; font-size: .85rem; }
.btn--lg { padding: 17px 34px; font-size: 1.02rem; }
.btn--block { width: 100%; }

/* -- Announcement bar ------------------------------------------------------*/
.announcement-bar { background: var(--axis-ink); color: #fff; font-size: .82rem; }
.announcement-bar__inner { display: flex; align-items: center; justify-content: center; gap: 24px; padding: 8px 24px; flex-wrap: wrap; }
.announcement-bar__inner span { display: inline-flex; align-items: center; gap: 6px; color: #C9D6CC; }
.announcement-bar__inner a { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--axis-green-light); }

/* -- Header ----------------------------------------------------------------*/
.site-header {
	position: sticky; top: 0; z-index: 200;
	/* Solid (not blurred) background: a transform/filter/backdrop-filter on this
	   element would make it the CSS containing block for its position:fixed
	   mobile-nav descendant, breaking that panel's full-viewport overlay. */
	background: #F8FBF6;
	border-bottom: 1px solid var(--axis-border);
}
.site-header__inner { display: flex; align-items: center; gap: 28px; padding: 14px 24px; }
.site-logo { flex-shrink: 0; display: flex; }
.site-logo__svg { width: 168px; height: auto; }
.main-nav { flex: 1; }
.main-nav__list { display: flex; align-items: center; gap: 6px; }
.main-nav__list > li { position: relative; }
.main-nav__list > li > a,
.main-nav__toggle {
	display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-radius: 999px;
	font-weight: 600; font-size: .95rem; color: var(--axis-ink); background: transparent; border: none;
}
.main-nav__list > li > a:hover, .main-nav__toggle:hover { background: var(--axis-green-50); color: var(--axis-green-dark); }

.mega-dropdown {
	position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%);
	width: 620px; background: #fff; border-radius: var(--radius-md); box-shadow: var(--shadow-lg);
	border: 1px solid var(--axis-border); padding: 16px; opacity: 0; visibility: hidden;
	transform: translateX(-50%) translateY(8px); transition: all .18s ease;
}
.has-dropdown:hover .mega-dropdown,
.has-dropdown.is-open .mega-dropdown { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.mega-dropdown__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.mega-dropdown__item { display: flex; align-items: flex-start; gap: 12px; padding: 12px; border-radius: var(--radius-sm); }
.mega-dropdown__item:hover { background: var(--axis-bg); }
.mega-dropdown__item strong { display: block; font-family: var(--font-head); font-size: .92rem; }
.mega-dropdown__item small { display: block; color: var(--axis-slate-light); font-size: .78rem; margin-top: 2px; }
.mega-dropdown__icon { flex-shrink: 0; width: 38px; height: 38px; border-radius: 10px; background: var(--axis-green-50); color: var(--axis-green-dark); display: flex; align-items: center; justify-content: center; }
.mega-dropdown__icon .axisone-icon { width: 20px; height: 20px; }
.mega-dropdown__item--all { grid-column: 1 / -1; border-top: 1px solid var(--axis-border); margin-top: 6px; padding-top: 14px; }
.mega-dropdown__item--all .mega-dropdown__icon { background: var(--axis-ink); color: #fff; }

.site-header__actions { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.site-header__phone { display: none; align-items: center; gap: 6px; font-weight: 600; font-size: .9rem; color: var(--axis-slate); }
.nav-toggle { display: none; background: none; border: none; padding: 6px; color: var(--axis-ink); }
.icon-close { display: none; }
.nav-toggle[aria-expanded="true"] .icon-menu { display: none; }
.nav-toggle[aria-expanded="true"] .icon-close { display: block; }
.nav-toggle .axisone-icon { width: 26px; height: 26px; }

@media (min-width: 900px) { .site-header__phone { display: inline-flex; } }

/* -- Mobile nav ------------------------------------------------------------*/
@media (max-width: 960px) {
	.main-nav {
		position: fixed; inset: 0; top: var(--header-h, 0); background: #fff; z-index: 150;
		transform: translateX(100%); transition: transform .25s ease; overflow-y: auto;
		padding: 20px; display: block;
	}
	body.nav-open .main-nav { transform: translateX(0); }
	.main-nav__list { flex-direction: column; align-items: stretch; gap: 2px; }
	.main-nav__list > li > a, .main-nav__toggle { width: 100%; justify-content: space-between; padding: 16px; font-size: 1.05rem; }
	.mega-dropdown { position: static; width: auto; transform: none; opacity: 1; visibility: visible; box-shadow: none; border: none; display: none; padding: 4px 4px 4px 12px; }
	.has-dropdown.is-open .mega-dropdown { display: block; transform: none; }
	.mega-dropdown__grid { grid-template-columns: 1fr; }
	.nav-toggle { display: block; }
	.site-header__phone { display: none !important; }
}

/* -- Hero --------------------------------------------------------------- */
.hero {
	position: relative; overflow: hidden;
	background: radial-gradient(1200px 500px at 85% -10%, #E9F5DC 0%, transparent 60%), var(--axis-bg);
	padding: 72px 0 60px;
}
.hero__grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; }
.hero h1 { margin-bottom: 20px; }
.hero__actions { display: flex; gap: 14px; margin-top: 30px; flex-wrap: wrap; }
.hero__proof { display: flex; align-items: center; gap: 18px; margin-top: 34px; color: var(--axis-slate); font-size: .88rem; }
.hero__proof strong { color: var(--axis-ink); }

.hero__panel {
	background: var(--axis-ink); border-radius: var(--radius-lg); padding: 10px;
	box-shadow: var(--shadow-lg); position: relative;
}
.hero__panel-screen { background: #0E1A13; border-radius: calc(var(--radius-lg) - 8px); padding: 20px; color: #fff; }
.hero__panel-topbar { display: flex; gap: 6px; margin-bottom: 16px; }
.hero__panel-topbar span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.2); }
.hero__panel-kpis { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-bottom: 14px; }
.hero__panel-kpi { background: rgba(255,255,255,.06); border-radius: 10px; padding: 12px; }
.hero__panel-kpi b { display: block; font-family: var(--font-head); font-size: 1.3rem; color: var(--axis-green-light); }
.hero__panel-kpi span { font-size: .72rem; color: #A7B6AC; }
.hero__panel-bars { display: flex; align-items: flex-end; gap: 6px; height: 90px; background: rgba(255,255,255,.04); border-radius: 10px; padding: 12px; }
.hero__panel-bars i { flex: 1; background: linear-gradient(180deg,var(--axis-green-light),var(--axis-green)); border-radius: 4px 4px 0 0; display: block; }
.hero__float {
	position: absolute; background: #fff; border-radius: var(--radius-sm); box-shadow: var(--shadow-md);
	padding: 10px 14px; display: flex; align-items: center; gap: 10px; font-size: .82rem; font-weight: 600;
}
.hero__float--1 { top: -18px; right: 20px; }
.hero__float--2 { bottom: -16px; left: -24px; }
.hero__float .axisone-icon { color: var(--axis-green); width:20px;height:20px; }

@media (max-width: 960px) {
	.hero__grid { grid-template-columns: 1fr; }
	.hero__float { display: none; }
}

/* -- Section scaffolding -------------------------------------------------*/
.section { padding: 88px 0; }
.section--tight { padding: 56px 0; }
.section--dark { background: var(--axis-ink); color: #fff; }
.section--dark h2, .section--dark h3 { color: #fff; }
.section--dark .lede { color: #AEBDB2; }
.section--surface { background: var(--axis-surface); }
.section-head { max-width: 720px; margin: 0 auto 52px; text-align: center; }
.section-head.is-left { margin: 0 0 48px; text-align: left; }

/* -- Logos strip ---------------------------------------------------------*/
.logos-strip { padding: 36px 0; border-top: 1px solid var(--axis-border); border-bottom: 1px solid var(--axis-border); }
.logos-strip p { text-align:center; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color: var(--axis-slate-light); margin-bottom: 22px; }
.logos-strip__row { display: flex; justify-content: space-between; align-items: center; gap: 28px; flex-wrap: wrap; opacity: .7; }
.logos-strip__row span { font-family: var(--font-head); font-weight: 700; font-size: 1.1rem; color: var(--axis-slate); }

/* -- Module cards grid -----------------------------------------------------*/
.module-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.module-card {
	background: var(--axis-surface); border: 1px solid var(--axis-border); border-radius: var(--radius-lg);
	padding: 30px; display: flex; flex-direction: column; gap: 14px; transition: all .2s ease; position: relative; overflow: hidden;
}
.module-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: transparent; }
.module-card__icon { width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #fff; }
.module-card__icon .axisone-icon { width: 26px; height: 26px; }
.module-card h3 { margin-bottom: 2px; }
.module-card__tag { font-size: .85rem; color: var(--axis-slate); min-height: 44px; }
.module-card__link { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: .88rem; color: var(--axis-green-dark); }
.module-card--financial .module-card__icon { background: #5C9B1E; }
.module-card--flow .module-card__icon { background: #1C3F5E; }
.module-card--view .module-card__icon { background: #2D5F7C; }
.module-card--estimate .module-card__icon { background: #B8791E; }
.module-card--field .module-card__icon { background: #6B4E9B; }
.module-card--ai .module-card__icon { background: linear-gradient(135deg,#5C9B1E,#2D5F7C); }

@media (max-width: 960px) { .module-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .module-grid { grid-template-columns: 1fr; } }

/* -- Tabs (interactive module walkthrough) --------------------------------*/
.module-tabs__nav { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-bottom: 44px; }
.module-tabs__btn {
	display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; border-radius: 999px;
	border: 1px solid var(--axis-border); background: #fff; font-weight: 600; font-size: .9rem; color: var(--axis-slate);
}
.module-tabs__btn .axisone-icon { width: 18px; height: 18px; }
.module-tabs__btn.is-active { background: var(--axis-ink); color: #fff; border-color: var(--axis-ink); }
.module-tabs__panel { display: none; }
.module-tabs__panel.is-active { display: block; animation: fadeUp .35s ease; }
@keyframes fadeUp { from { opacity:0; transform: translateY(10px); } to { opacity:1; transform:none; } }

.tab-panel { display: grid; grid-template-columns: .95fr 1.05fr; gap: 50px; align-items: center; }
.tab-panel__features { display: grid; gap: 16px; margin: 28px 0; }
.tab-panel__feature { display: flex; gap: 14px; }
.tab-panel__feature-icon { flex-shrink:0; width: 36px; height: 36px; border-radius: 10px; background: var(--axis-green-50); color: var(--axis-green-dark); display:flex; align-items:center; justify-content:center; }
.tab-panel__feature-icon .axisone-icon { width:18px;height:18px; }
.tab-panel__feature h4 { margin: 0 0 4px; font-size: 1rem; }
.tab-panel__feature p { margin: 0; font-size: .9rem; color: var(--axis-slate); }
.tab-panel__visual { background: var(--axis-ink); border-radius: var(--radius-lg); padding: 28px; color: #fff; box-shadow: var(--shadow-lg); }
.tab-panel__visual-stats { display:grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin-bottom:16px; }
.tab-panel__visual-stats div { background: rgba(255,255,255,.07); border-radius:10px; padding:14px; }
.tab-panel__visual-stats b { display:block; font-family: var(--font-head); font-size:1.5rem; color: var(--axis-green-light); }
.tab-panel__visual-stats span { font-size:.72rem; color:#A7B6AC; }

@media (max-width: 900px) { .tab-panel { grid-template-columns: 1fr; } }

/* -- Flow / workflow steps --------------------------------------------------*/
.flow-steps { position: relative; display: grid; grid-template-columns: repeat(var(--steps,5), 1fr); gap: 18px; counter-reset: flow; }
.flow-steps::before { content:""; position:absolute; top: 24px; left: 6%; right: 6%; height: 2px; background: repeating-linear-gradient(90deg, var(--axis-border) 0 8px, transparent 8px 14px); z-index:0; }
.flow-step { position: relative; z-index: 1; text-align: center; }
.flow-step__num {
	counter-increment: flow; width: 48px; height: 48px; border-radius: 50%; background: var(--axis-ink); color:#fff;
	display:flex; align-items:center; justify-content:center; margin: 0 auto 16px; font-family: var(--font-head); font-weight:700;
	box-shadow: var(--shadow-sm);
}
.flow-step__num::before { content: counter(flow); }
.flow-step h4 { font-size: .98rem; margin-bottom: 6px; }
.flow-step p { font-size: .84rem; color: var(--axis-slate); margin:0; }

@media (max-width: 900px) {
	.flow-steps { grid-template-columns: 1fr; gap: 28px; }
	.flow-steps::before { display: none; }
}

/* -- Stats band --------------------------------------------------------- */
.stats-band { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; text-align: center; }
.stat b { display:block; font-family: var(--font-head); font-size: clamp(2rem,1.6rem+1.2vw,2.8rem); color: var(--axis-green-light); }
.stat span { color: #A7B6AC; font-size: .88rem; }
@media (max-width: 760px) { .stats-band { grid-template-columns: repeat(2,1fr); row-gap: 36px; } }

/* -- Feature grid --------------------------------------------------------*/
.feature-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 26px; }
.feature-card { background: #fff; border: 1px solid var(--axis-border); border-radius: var(--radius-md); padding: 26px; }
.feature-card__icon { width: 44px; height:44px; border-radius: 12px; background: var(--axis-green-50); color: var(--axis-green-dark); display:flex; align-items:center; justify-content:center; margin-bottom: 16px; }
.feature-card h4 { font-size: 1.02rem; }
.feature-card p { font-size: .9rem; color: var(--axis-slate); margin:0; }
@media (max-width: 900px) { .feature-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px) { .feature-grid { grid-template-columns: 1fr; } }

/* -- Audience / industries cards ------------------------------------------*/
.audience-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.audience-card { background:#fff; border:1px solid var(--axis-border); border-radius: var(--radius-md); padding: 24px; text-align:center; }
.audience-card__icon { width:50px;height:50px;border-radius:50%;background:var(--axis-ink);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 14px; }
.audience-card h4 { font-size: .98rem; margin-bottom:6px; }
.audience-card p { font-size: .84rem; color: var(--axis-slate); margin:0; }
@media (max-width: 900px) { .audience-grid { grid-template-columns: repeat(2,1fr); } }

.region-strip { display:flex; justify-content:center; gap: 14px; flex-wrap: wrap; margin-top: 36px; }
.region-pill { padding: 9px 18px; border-radius: 999px; background: #fff; border: 1px solid var(--axis-border); font-size: .85rem; font-weight: 600; display:inline-flex; align-items:center; gap:8px; }
.region-pill--us { border-color: var(--axis-green); color: var(--axis-green-dark); background: var(--axis-green-50); }
.region-pill--us::before { content:"★"; color: var(--axis-green); }

/* -- Testimonials ---------------------------------------------------------*/
.testimonial-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.testimonial-card { background:#fff; border:1px solid var(--axis-border); border-radius: var(--radius-md); padding: 28px; display:flex; flex-direction:column; gap: 16px; }
.testimonial-card__stars { display:flex; gap:3px; color: var(--axis-amber); }
.testimonial-card__stars .axisone-icon { width:16px;height:16px; }
.testimonial-card p { font-size: .95rem; color: var(--axis-ink); margin:0; }
.testimonial-card__who { display:flex; align-items:center; gap:12px; margin-top:auto; }
.testimonial-card__avatar { width:40px;height:40px;border-radius:50%; background: var(--axis-green-50); color: var(--axis-green-dark); display:flex;align-items:center;justify-content:center; font-family: var(--font-head); font-weight:700; }
.testimonial-card__who small { color: var(--axis-slate-light); display:block; }
@media (max-width: 900px) { .testimonial-grid { grid-template-columns: 1fr; } }

/* -- CTA bands ------------------------------------------------------------*/
.cta-band { background: linear-gradient(120deg, var(--axis-ink), #0E2A1E); border-radius: var(--radius-lg); padding: 56px; display:flex; align-items:center; justify-content:space-between; gap: 40px; color:#fff; }
.cta-band h2 { color:#fff; margin-bottom:10px; }
.cta-band p { color:#AEBDB2; margin:0; }
@media (max-width: 760px) { .cta-band { flex-direction:column; text-align:center; padding: 36px 24px; } }

.footer-cta { display:flex; align-items:center; justify-content:space-between; gap: 30px; padding: 56px 24px; border-bottom:1px solid rgba(255,255,255,.08); }
.footer-cta h2 { color:#fff; }
.footer-cta p { color:#AEBDB2; margin:0; }
@media (max-width:760px){ .footer-cta{ flex-direction:column; text-align:center; } }

/* -- Footer ----------------------------------------------------------------*/
.site-footer { background: var(--axis-ink); color: #D8E2DA; margin-top: 60px; }
.footer-grid { display:grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 40px; padding: 56px 24px; }
.footer-col__title { color:#fff; font-size:.92rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom: 18px; }
.footer-col ul { display:grid; gap: 12px; }
.footer-col a:hover { color: var(--axis-green-light); }
.footer-col__desc { font-size:.9rem; color:#9FB0A5; margin: 18px 0; }
.footer-regions { display:flex; flex-wrap:wrap; gap:8px; }
.footer-regions .region-pill { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color:#D8E2DA; font-size:.76rem; padding:6px 12px; }
.footer-contact li { display:flex; align-items:center; gap:10px; font-size:.9rem; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding: 22px 24px; border-top:1px solid rgba(255,255,255,.08); font-size:.82rem; color:#8398883; flex-wrap:wrap; gap:12px; }
.footer-legal { display:flex; gap:20px; }
@media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .footer-grid { grid-template-columns: 1fr; } }

/* -- Forms ------------------------------------------------------------- */
.form-grid { display:grid; grid-template-columns: repeat(2,1fr); gap:18px; }
.form-field { display:flex; flex-direction:column; gap:7px; }
.form-field.full { grid-column: 1 / -1; }
.form-field label { font-size:.85rem; font-weight:600; color: var(--axis-slate); }
.form-field input, .form-field select, .form-field textarea {
	padding: 13px 15px; border-radius: var(--radius-sm); border: 1px solid var(--axis-border);
	font-family: inherit; font-size: .95rem; background:#fff; color: var(--axis-ink);
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { outline: 2px solid var(--axis-green-light); outline-offset: 1px; }
.form-honeypot { position:absolute; left:-9999px; opacity:0; height:0; }
.form-status { margin-top: 14px; font-size:.9rem; padding: 12px 16px; border-radius: var(--radius-sm); display:none; }
.form-status.is-success { display:block; background: var(--axis-green-50); color: var(--axis-green-dark); }
.form-status.is-error { display:block; background:#FDEDEA; color:#B3301D; }
@media (max-width:700px){ .form-grid { grid-template-columns: 1fr; } }

/* -- Screenshot gallery -----------------------------------------------------*/
.screenshot-gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.screenshot-gallery__item {
	margin: 0; border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--axis-border);
	background: var(--axis-ink); box-shadow: var(--shadow-sm); transition: box-shadow .2s ease, transform .2s ease;
}
.screenshot-gallery__item:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); }
.screenshot-gallery__item a { display: block; line-height: 0; }
.screenshot-gallery__item img { width: 100%; height: auto; display: block; }
.screenshot-gallery__item figcaption { padding: 14px 16px; font-size: .88rem; color: var(--axis-slate); background: var(--axis-surface); }
@media (max-width: 760px) { .screenshot-gallery { grid-template-columns: 1fr; } }

/* -- Module single page ----------------------------------------------------*/
.module-hero { padding: 64px 0 56px; position: relative; overflow: hidden; }
.module-hero__eyebrow-row { display:flex; align-items:center; gap: 14px; margin-bottom: 18px; }
.module-hero__icon { width: 56px; height:56px; border-radius: 16px; display:flex; align-items:center; justify-content:center; color:#fff; }
.module-hero__icon .axisone-icon { width:28px;height:28px; }
.module-hero__grid { display:grid; grid-template-columns: 1.1fr .9fr; gap: 50px; align-items: center; }
.module-hero__screens { background: var(--axis-ink); border-radius: var(--radius-lg); padding: 10px; box-shadow: var(--shadow-lg); }
@media (max-width: 900px) { .module-hero__grid { grid-template-columns: 1fr; } }

.related-modules { display:grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
@media (max-width: 900px) { .related-modules { grid-template-columns: repeat(2,1fr); } }

/* -- Breadcrumb / misc ------------------------------------------------------*/
.page-hero { padding: 70px 0 20px; }
.prose { max-width: 760px; margin: 0 auto; padding: 20px 0 80px; }
.prose h2 { margin-top: 1.4em; }

/* -- Utilities ---------------------------------------------------------- */
.pill { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:999px; font-size:.75rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; }
.pill--green { background: var(--axis-green-50); color: var(--axis-green-dark); }
/* Content is visible by default (no-JS / JS-failure safe). Only hidden-then-revealed
   once the 'js-anim' class is added by an early inline script, so progressive
   enhancement never leaves a section permanently invisible. */
.js-anim [data-animate] { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.js-anim [data-animate].in-view { opacity: 1; transform: none; }