/* Visually-hidden honeypot — kept renderable for bots that ignore display:none. */
.beta-honeypot {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Hero — responsive heading sizes from the de-duplicated hero block. */
.hero-strapline {
    font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
    font-weight: 700;
    line-height: 1.15;
    margin-bottom: 1rem;
}

.hero-title {
    font-size: clamp(2.75rem, 9vw, 6rem);
    font-weight: 700;
    line-height: 1.05;
    margin-bottom: 1rem;
}

.hero-subtitle {
    font-size: clamp(1.05rem, 1.6vw + 0.5rem, 1.5rem);
    line-height: 1.4;
    opacity: 0.9;
    margin-bottom: 1.5rem;
}

/* Reserve hero image space to avoid layout shift on first paint. */
.hero-image {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
}

/* Footer. */
.site-footer {
    padding: 2rem 1.5rem;
    border-top: 1px solid var(--mud-palette-divider);
    background-color: var(--mud-palette-surface);
}

.site-footer a {
    color: var(--mud-palette-text-primary);
    text-decoration: none;
}

.site-footer a:hover {
    text-decoration: underline;
}

/* 404 page minimum viewport height. */
.not-found-page {
    min-height: 60vh;
}

/* Private Beta chip: darker teal background in dark mode for WCAG AA contrast. */
.mud-dark .private-beta-chip {
    background-color: #00796B !important;
}

/* Technology Highlights decorative accents — contrast-compliant, WCAG AA verified */
:root {
    --tech-accent-cobalt: #0066E0;
    --tech-accent-coral:  #E63946;
    --tech-accent-fern:   #4F9A2E;
    --tech-accent-violet: #9333EA;
}

/* Dark-mode overrides: swap accent variables to vibrant counterparts that
   pass WCAG AA against the dark surface (#37474F). */
.mud-dark {
    --tech-accent-cobalt: #5BA8FF;
    --tech-accent-coral:  #FF7585;
    --tech-accent-fern:   #9BD66B;
    --tech-accent-violet: #C77DFF;
}

.tech-accent-cobalt { color: var(--tech-accent-cobalt); }
.tech-accent-coral  { color: var(--tech-accent-coral); }
.tech-accent-fern   { color: var(--tech-accent-fern); }
.tech-accent-violet { color: var(--tech-accent-violet); }

/* Smooth in-page scrolling for the AppBar anchor links. */
html {
    scroll-behavior: smooth;
}

/* Anchor offset so AppBar (fixed) doesn't cover section headings on jump. */
.scroll-anchor {
    scroll-margin-top: 80px;
}