/* Small, native interactions; first-screen content never waits for JavaScript. */
:root { --section-space: clamp(48px, 6vw, 88px); }
html { scroll-padding-top: calc(var(--site-header-height, 80px) + 20px); }
body { cursor: auto; }
@media (hover: hover) and (pointer: fine) and (min-width: 992px) and (prefers-reduced-motion: no-preference) {
    html.custom-cursor-ready, html.custom-cursor-ready * { cursor: none !important; }
}
#cursor.has-label { opacity: 1; }
#cursor.hidden, #aura.hidden { opacity: 0 !important; }
a, button { touch-action: manipulation; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
    outline: 3px solid #009b3f;
    outline-offset: 5px;
}
.skip-link { position: fixed; top: 12px; left: 16px; z-index: 100000; padding: 12px 20px; background: #14213d; color: #fff; border-radius: 10px; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); color: #fff; }
#main-content:focus { outline: none; }
.home-hero .main-item h1 { font-size: clamp(34px, 4.4vw, 64px); line-height: 1.06; letter-spacing: -.045em; text-wrap: balance; }
.home-hero__copy > p:not(.home-hero__rotator) { max-width: 560px; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.65; }
.home-hero__actions { gap: 16px 24px; align-items: center; flex-wrap: wrap; }
.home-hero__secondary { padding: 12px 0; }
.service-card { border-radius: 20px; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.service-card:focus-visible { transform: translateY(-4px); }
.service-card__more { display: inline-block; transition: transform .25s ease; }
.service-card:hover .service-card__more { transform: translateX(5px); }
.tech-item, .portfolio-card, .blog-item { will-change: auto; }
.about-item, .section-intro, .service-card, .blog-item { transition: opacity .5s ease var(--reveal-delay, 0ms), transform .5s ease var(--reveal-delay, 0ms), box-shadow .25s ease; }
.reveal-pending:not(:focus-within) { opacity: 0; transform: translateY(20px); }
.form-call input { min-height: 48px; }
.home-portfolio__dots button { min-width: 32px; min-height: 44px; }
@media (max-width: 767px) {
    .home-hero { padding-top: calc(var(--site-header-height, 72px) + 32px); }
    .home-hero .main-item h1 { font-size: clamp(32px, 8.8vw, 48px); }
    .home-hero__rotator { font-size: 19px; gap: 6px; }
    .block.about .container { padding: 24px 16px; }
    .block.about .about-item { padding: 20px 12px; }
    .service-card { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after { animation: none !important; transition: none !important; }
    .reveal-pending { opacity: 1; transform: none; }
}

.selected-work { padding: var(--section-space) 0; }
.selected-work__heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 28px; }
.selected-work__heading .section-intro { max-width: 660px; }
.selected-work__heading h2 { margin: 0 0 12px; }
.selected-work__heading p { margin: 0; font-size: 18px; line-height: 1.6; }
.selected-work__heading > a { flex-shrink: 0; }
.selected-work__track { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 24px) / 2); gap: 24px; overflow-x: auto; padding: 8px 4px 24px; scroll-snap-type: x mandatory; scroll-padding-inline: 4px; scrollbar-width: thin; scrollbar-color: #009b3f transparent; }
.selected-work__track .portfolio-card { min-width: 0; scroll-snap-align: start; }
.selected-work__track .portfolio-card__media { aspect-ratio: 16 / 10; min-height: 0; }
.selected-work__track .portfolio-card__body { flex: 1; }
.selected-work__controls { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 16px; }
.selected-work__controls[hidden] { display: none; }
.selected-work__hint { flex: 1; margin: 0; opacity: .75; }
.selected-work__controls button { width: 48px; height: 48px; border: 1px solid #009b3f; border-radius: 50%; background: transparent; color: inherit; font-size: 24px; cursor: pointer; }
.selected-work__controls button:disabled { opacity: .3; cursor: default; }
.form-call .form-group > label { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 600; text-align: left; }
.form-call__intro { font-size: 15px; line-height: 1.6; margin: 0 0 24px; }
.phone-output[hidden] { display: none; }
.page-portfolio .filter_div button.filter { border: 1px solid transparent; background: transparent; color: inherit; padding: 10px 16px; border-radius: 8px; font: inherit; cursor: pointer; }
.page-portfolio .filter_div button.filter.active { border-color: #009b3f; color: #009b3f; background: rgba(11,224,98,.08); }
.portfolio-card:focus-within .portfolio-card__overlay { opacity: 1; }
.portfolio-card:focus-within .portfolio-card__view { transform: translateY(0); }
@media (max-width: 767px) {
    .home-hero { min-height: 0; padding-bottom: 24px; }
    .home-hero-orb { width: 190px; margin: 0 auto; }
    .home-hero__actions { margin-bottom: 12px !important; }
    .selected-work__heading { display: block; }
    .selected-work__heading > a { display: inline-block; margin-top: 12px; }
    .selected-work__track { grid-auto-columns: 88%; }
    .selected-work__hint { font-size: 12px; }
    .selected-work__controls { gap: 8px; }
}

/* An empty required field is not an error until the visitor interacts with it. */
form.form-call input:not(.is-invalid):focus:required:invalid { border-color: #8b959f; }
form.form-call input[name="name"]:user-invalid { border-color: #d33; }
@media (max-width: 767px) {
    .selected-work__controls { justify-content: flex-start; flex-wrap: wrap; padding-right: 72px; }
    .selected-work__hint { flex-basis: 100%; }
}

/* QA: keep intrinsic image widths from widening cards on small screens. */
.portfolio-card, .portfolio-card__link, .portfolio-card__media { min-width: 0; }
.main.page-title { overflow: clip; }
.about .about-stat { color: #ae5700; text-align: center; font-size: 40px; font-weight: 700; line-height: 1.2; margin: 0 0 12px; }
.about .about-stat .num { display: inline-block; font-size: 50px; }
.tech .tech-name { text-align: center; font-size: 18px; font-weight: 700; margin: 0 0 12px; }
.blog .text-wrap h3 { font-weight: 700; text-align: center; font-size: 20px; line-height: 1.3; }
.block.process .process-item__title { margin: 0; }
html:not([data-theme="dark"]) .home-hero__secondary { color: #006d2c !important; }
html:not([data-theme="dark"]) .block.process .process-item.is-active .process-item__title { color: #006d2c; }
[data-theme="dark"] .about .about-stat { color: #ffb15e; }
@media (max-width: 767px) {
    .portfolio-grid { grid-template-columns: minmax(0, 1fr); }
}
/* Keep the service offer visible immediately; illustrations still animate. */
.service-spotlight__copy > * { animation: none !important; }
