@import 'tailwindcss';

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';

@theme {
    --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
        'Segoe UI Symbol', 'Noto Color Emoji';
}

@layer base {
    html {
        color-scheme: light;
    }

    body {
        overflow-x: clip;
    }

    button {
        cursor: pointer;
    }

    dialog[data-quote-dialog]::backdrop {
        background: rgb(7 27 73 / 0.58);
        backdrop-filter: blur(3px);
    }
}

@keyframes about-blueprint-draw {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes about-photo-reveal {
    from {
        clip-path: inset(0 100% 0 0);
        opacity: 0;
    }

    to {
        clip-path: inset(0 0 0 0);
        opacity: 1;
    }
}

@keyframes about-photo-settle {
    from {
        transform: scale(1.025);
    }

    to {
        transform: scale(1);
    }
}

@keyframes about-text-reveal {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes category-reveal {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes services-reveal {
    from {
        opacity: 0;
        transform: translateY(var(--services-reveal-distance, 10px));
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes services-curve-draw {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes partners-reveal {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes contact-reveal {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes about-page-reveal {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes about-hero-image-drift {
    0%,
    100% {
        scale: 1.02;
        translate: 0 0;
    }

    50% {
        scale: 1.06;
        translate: -0.75% -0.5%;
    }
}

@keyframes about-hero-pulse {
    0%,
    100% {
        box-shadow: 0 0 0 0 rgb(90 142 255 / 0.2);
    }

    50% {
        box-shadow: 0 0 0 8px rgb(90 142 255 / 0);
    }
}

@keyframes about-hero-scroll {
    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(4px);
    }
}

@keyframes about-banner-pattern-drift {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 52px 52px;
    }
}

@keyframes about-intro-pattern-rotate {
    to {
        transform: rotate(360deg);
    }
}

.about-hero-image {
    animation: about-hero-image-drift 18s ease-in-out infinite;
    will-change: scale, translate;
}

.page-banner-pattern {
    background-image:
        linear-gradient(135deg, rgb(155 185 243 / 0.15) 1px, transparent 1px),
        linear-gradient(45deg, rgb(155 185 243 / 0.1) 1px, transparent 1px);
    background-position: 0 0, 26px 26px;
    background-size: 52px 52px;
    animation: about-banner-pattern-drift 18s linear infinite;
}

.about-intro-pattern {
    animation: about-intro-pattern-rotate 70s linear infinite;
}

.about-hero-scroll-arrow {
    animation: about-hero-scroll 2s ease-in-out infinite;
}

.about-hero-pulse {
    animation: about-hero-pulse 3.5s ease-in-out infinite;
}

@keyframes about-approach-image-drift {
    0%,
    100% {
        translate: 0 0;
    }

    50% {
        translate: 0 -8px;
    }
}

@keyframes about-approach-line-travel {
    from {
        left: -22%;
    }

    to {
        left: 100%;
    }
}

.about-approach-image {
    animation: about-approach-image-drift 7s ease-in-out infinite;
    will-change: translate;
}

.about-approach-line {
    animation: about-approach-line-travel 7s ease-in-out infinite;
}

[data-about-page-section][data-about-page-animation='ready'] [data-about-page-reveal] {
    opacity: 0;
    transform: translateY(18px);
}

[data-about-page-section][data-about-page-animation='visible'] [data-about-page-reveal] {
    animation: about-page-reveal 650ms cubic-bezier(0.22, 1, 0.36, 1) var(--about-page-delay, 0ms) both;
}

[data-product-categories][data-category-animation='ready'] [data-category-intro],
[data-product-categories][data-category-animation='ready'] [data-category-card] {
    opacity: 0;
    transform: translateY(10px);
}

[data-product-categories][data-category-animation='visible'] [data-category-intro] {
    animation: category-reveal 520ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

[data-product-categories][data-category-animation='visible'] [data-category-card] {
    animation: category-reveal 520ms cubic-bezier(0.22, 1, 0.36, 1) var(--category-delay) both;
}

.about-blueprint__group path {
    fill: none;
    stroke: currentColor;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

[data-about-star][data-about-animation='ready'] .about-blueprint__group path {
    opacity: 0.6;
}

[data-about-star][data-about-animation='visible'] .about-blueprint__group path {
    animation: about-blueprint-draw 850ms ease-out var(--blueprint-delay) both;
}

[data-about-star][data-about-animation='ready'] [data-about-photo-reveal] {
    clip-path: inset(0 100% 0 0);
    opacity: 0;
}

[data-about-star][data-about-animation='visible'] [data-about-photo-reveal] {
    animation: about-photo-reveal 900ms cubic-bezier(0.22, 1, 0.36, 1) 250ms both;
}

[data-about-star][data-about-animation='ready'] [data-about-photo] {
    transform: scale(1.025);
}

[data-about-star][data-about-animation='visible'] [data-about-photo] {
    animation: about-photo-settle 900ms cubic-bezier(0.22, 1, 0.36, 1) 250ms both;
}

[data-about-star][data-about-animation='ready'] [data-about-text] {
    opacity: 0;
    transform: translateY(12px);
}

[data-about-star][data-about-animation='visible'] [data-about-text] {
    animation: about-text-reveal 550ms cubic-bezier(0.22, 1, 0.36, 1) var(--about-text-delay) both;
}

[data-about-text='eyebrow'] {
    --about-text-delay: 400ms;
}

[data-about-text='heading'] {
    --about-text-delay: 470ms;
}

[data-about-text='description'] {
    --about-text-delay: 540ms;
}

[data-about-text='link'] {
    --about-text-delay: 610ms;
}

.services-connection-curve {
    stroke-dasharray: 1;
    stroke-dashoffset: 0;
}

[data-our-services][data-services-animation='ready'] [data-services-heading],
[data-our-services][data-services-animation='ready'] [data-service-visual],
[data-our-services][data-services-animation='ready'] [data-service-copy],
[data-our-services][data-services-animation='ready'] [data-services-cta] {
    opacity: 0;
}

[data-our-services][data-services-animation='ready'] [data-services-heading],
[data-our-services][data-services-animation='ready'] [data-service-visual],
[data-our-services][data-services-animation='ready'] [data-service-copy] {
    transform: translateY(10px);
}

[data-our-services][data-services-animation='ready'] [data-service-visual] {
    transform: translateY(16px);
}

[data-our-services][data-services-animation='ready'] [data-services-cta] {
    transform: translateY(8px);
}

[data-our-services][data-services-animation='ready'] [data-services-curve] {
    stroke-dashoffset: 1;
}

[data-our-services][data-services-animation='visible'] [data-services-heading] {
    animation: services-reveal 500ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

[data-our-services][data-services-animation='visible'] [data-services-curve] {
    animation: services-curve-draw 900ms ease-out 140ms both;
}

[data-our-services][data-services-animation='visible'] [data-service-visual] {
    --services-reveal-distance: 16px;
    animation: services-reveal 650ms cubic-bezier(0.22, 1, 0.36, 1) var(--service-delay) both;
}

[data-our-services][data-services-animation='visible'] [data-service-copy] {
    animation: services-reveal 450ms cubic-bezier(0.22, 1, 0.36, 1) var(--service-copy-delay) both;
}

[data-our-services][data-services-animation='visible'] [data-services-cta] {
    animation: services-reveal 400ms cubic-bezier(0.22, 1, 0.36, 1) 980ms both;
}

.partners-logo-grid > [data-partner-item]:nth-child(even) {
    border-inline-start: 1px solid #d5deea;
}

@media (min-width: 768px) {
    .partners-logo-grid > [data-partner-item]:nth-child(even) {
        border-inline-start: 0;
    }

    .partners-logo-grid > [data-partner-item]:not(:nth-child(3n + 1)) {
        border-inline-start: 1px solid #d5deea;
    }
}

[data-our-partners][data-partners-initialized='true'] [data-partners-grid] {
    min-height: 14rem;
    transition: opacity 250ms ease;
}

[data-our-partners][data-partners-initialized='true'] [data-partner-item] {
    border-inline-start: 0;
    border-block-start: 0;
}

[data-our-partners][data-partners-initialized='true'] [data-partner-column]:not([data-partner-column='0']) {
    border-inline-start: 1px solid #d5deea;
}

[data-our-partners][data-partners-initialized='true'] [data-partner-row]:not([data-partner-row='0']) {
    border-block-start: 1px solid #d5deea;
}

[data-our-partners][data-partners-animation='ready'] [data-partners-photo],
[data-our-partners][data-partners-animation='ready'] [data-partner-item] {
    opacity: 0;
    transform: translateY(12px);
}

[data-our-partners][data-partners-animation='visible'] [data-partners-photo] {
    animation: partners-reveal 650ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

[data-our-partners][data-partners-animation='visible'] [data-partner-item] {
    animation: partners-reveal 520ms cubic-bezier(0.22, 1, 0.36, 1) var(--partner-delay) both;
}

[data-contact-section][data-contact-animation='ready'] [data-contact-intro],
[data-contact-section][data-contact-animation='ready'] [data-contact-form-group] {
    opacity: 0;
    transform: translateY(12px);
}

[data-contact-section][data-contact-animation='visible'] [data-contact-intro] {
    animation: contact-reveal 600ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

[data-contact-section][data-contact-animation='visible'] [data-contact-form-group] {
    animation: contact-reveal 600ms cubic-bezier(0.22, 1, 0.36, 1) 80ms both;
}

@media (min-width: 768px) {
    [data-our-partners][data-partners-initialized='true'] [data-partners-grid] {
        min-height: 16rem;
    }
}

[data-our-projects] [data-projects-stage] {
    padding-block: 5rem;
}

.projects-rail-viewport {
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.projects-rail-viewport::-webkit-scrollbar {
    display: none;
}

[data-project-detail][data-active='false'] {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

[data-project-detail][data-active='true'] {
    visibility: visible;
    opacity: 1;
}

[data-our-projects][data-projects-mode='pinned'] [data-projects-stage] {
    position: sticky;
    top: var(--projects-header-offset, 0px);
    height: var(--projects-stage-height, 100svh);
    padding-block: clamp(1.5rem, 3svh, 2.5rem);
}

[data-our-projects][data-projects-mode='pinned'] [data-projects-rail-viewport] {
    overflow: hidden;
    padding-inline: 0;
    scroll-snap-type: none;
}

[data-our-projects][data-projects-mode='pinned'] [data-projects-rail] {
    will-change: transform;
}

[data-our-projects][data-projects-mode='pinned'] [data-project-slide-caption] {
    display: none;
}

[data-our-projects][data-projects-mode='pinned'] [data-projects-shared-details] {
    display: block;
}

[data-our-projects][data-projects-mode='pinned'] [data-projects-controls] {
    display: none;
}

[data-our-projects][data-projects-mode='gallery'][data-projects-initialized='true'] [data-projects-controls] {
    display: flex;
}

@media (min-width: 1024px) and (min-height: 800px) {
    [data-our-projects][data-projects-mode='pinned'] [data-project-image] {
        height: clamp(21rem, 46svh, 34rem);
    }
}

[data-our-projects][data-projects-mode='stacked'] [data-projects-stage] {
    position: static;
    height: auto;
}

[data-our-projects][data-projects-mode='stacked'] [data-projects-scroll-hint],
[data-our-projects][data-projects-mode='stacked'] [data-projects-progress],
[data-our-projects][data-projects-mode='stacked'] [data-projects-controls] {
    display: none;
}

[data-our-projects][data-projects-mode='stacked'] [data-projects-rail-viewport] {
    overflow: visible;
}

[data-our-projects][data-projects-mode='stacked'] [data-projects-rail] {
    width: auto;
    flex-direction: column;
    transform: none !important;
}

[data-our-projects][data-projects-mode='stacked'] [data-project-slide] {
    width: 100%;
}

@media (min-width: 1024px) and (max-height: 799px) {
    [data-our-projects][data-projects-mode='pinned'] [data-projects-stage] {
        padding-block: 1rem;
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-header] h2 {
        margin-top: 0.75rem;
        font-size: clamp(2.25rem, 4vw, 3.25rem);
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-rail-viewport] {
        margin-top: 1.25rem;
    }

    [data-our-projects][data-projects-mode='pinned'] [data-project-image] {
        height: min(36svh, 18rem);
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-shared-details] {
        padding-top: 1rem;
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-shared-details] > div {
        min-height: 5rem;
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-shared-details] h3 {
        margin-top: 0.25rem;
        font-size: 1.75rem;
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-shared-details] p:last-child {
        margin-top: 0.125rem;
        font-size: 1rem;
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-progress] {
        padding-top: 0.75rem;
    }

    [data-our-projects][data-projects-mode='pinned'] [data-projects-progress] + p {
        padding-top: 0.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .about-hero-image,
    .page-banner-pattern,
    .about-intro-pattern,
    .about-hero-scroll-arrow,
    .about-hero-pulse,
    .about-approach-image,
    .about-approach-line {
        animation: none !important;
    }

    .about-hero-image,
    .about-approach-image {
        scale: none !important;
        translate: none !important;
    }

    [data-about-page-section][data-about-page-animation] [data-about-page-reveal] {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    [data-product-categories][data-category-animation] [data-category-intro],
    [data-product-categories][data-category-animation] [data-category-card] {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    [data-about-star][data-about-animation] .about-blueprint__group path,
    [data-about-star][data-about-animation] [data-about-photo-reveal],
    [data-about-star][data-about-animation] [data-about-photo],
    [data-about-star][data-about-animation] [data-about-text] {
        animation: none !important;
        clip-path: none !important;
        opacity: 1 !important;
        stroke-dashoffset: 0 !important;
        transform: none !important;
    }

    [data-our-services][data-services-animation] [data-services-heading],
    [data-our-services][data-services-animation] [data-services-curve],
    [data-our-services][data-services-animation] [data-service-visual],
    [data-our-services][data-services-animation] [data-service-copy],
    [data-our-services][data-services-animation] [data-services-cta] {
        animation: none !important;
        opacity: 1 !important;
        stroke-dashoffset: 0 !important;
        transform: none !important;
    }

    [data-our-partners][data-partners-animation] [data-partners-photo],
    [data-our-partners][data-partners-animation] [data-partner-item] {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    [data-our-partners][data-partners-initialized='true'] [data-partners-grid] {
        transition: none !important;
    }

    [data-contact-section][data-contact-animation] [data-contact-intro],
    [data-contact-section][data-contact-animation] [data-contact-form-group] {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    [data-our-projects] {
        height: auto !important;
    }

    [data-our-projects] [data-projects-stage] {
        position: static !important;
        height: auto !important;
        padding-block: 5rem;
    }

    [data-our-projects] [data-projects-scroll-hint],
    [data-our-projects] [data-projects-progress],
    [data-our-projects] [data-projects-controls],
    [data-our-projects] [data-projects-shared-details] {
        display: none !important;
    }

    [data-our-projects] [data-projects-rail-viewport] {
        overflow: visible !important;
    }

    [data-our-projects] [data-projects-rail] {
        width: auto !important;
        flex-direction: column;
        transform: none !important;
    }

    [data-our-projects] [data-project-slide] {
        width: 100% !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    [data-site-header],
    [data-menu-backdrop],
    [data-menu-drawer] {
        transition-duration: 0.01ms !important;
    }
}
