@tailwind base;
@tailwind components;
@tailwind utilities;

[x-cloak] {
    display: none;
}

body {
    min-height: 100vh;
    overflow-x: hidden;
}

::selection {
    background: rgba(249, 115, 22, 0.45);
    color: #fff7ed;
}

.industrial-grid {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 36px 36px;
}

.section-glow {
    position: relative;
}

.section-glow::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, rgba(249, 115, 22, 0.45), rgba(56, 189, 248, 0.2), rgba(255, 255, 255, 0.06));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.hero-panel {
    box-shadow: 0 24px 80px rgba(15, 23, 42, 0.45);
}