@import url('https://fonts.cdnfonts.com/css/lufga');

:root {
    --solar-flame: #ff7f00;
    --spark-stone: #f94200;
    --black-onyx: #070707;
    --white-quartz: #ffffff;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
}

body {
    font-family: 'Lufga', sans-serif;
    background-color: var(--white-quartz);
    color: var(--black-onyx);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

/* Identidade Visual: Zero Curvas (Bordas Retas) */
* {
    border-radius: 0 !important;
}

/* PATTERN LARANJA (Mask Technique) */
.bg-pattern-orange {
    position: absolute;
    inset: 0;
    background-color: var(--solar-flame);
    -webkit-mask-image: url('pattern.jpg');
    mask-image: url('pattern.jpg');
    -webkit-mask-size: 500px;
    mask-size: 500px;
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat;
    opacity: 0.08;
    pointer-events: none;
    z-index: 0;
}

@supports not (mask-image: url('')) {
    .bg-pattern-orange {
        background-image: url('pattern.jpg');
        opacity: 0.1;
    }
}

/* Header Gradient Global */
.header-gradient {
    background: linear-gradient(to right, var(--solar-flame), var(--spark-stone));
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

/* Botões Sharp (COM CORTE DIAGONAL) - Único elemento com corte */
.btn-sharp {
    clip-path: polygon(0 0, 92% 0%, 100% 30%, 100% 100%, 0 100%);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Cards Sharp (SEM CORTE DIAGONAL, APENAS RETANGULAR) */
.card-sharp {
    /* clip-path removido conforme solicitado */
    transition: transform 0.3s ease;
    border-left: 4px solid var(--solar-flame);
    background-color: white;
}
.card-sharp:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Divisores de Seção */
.section-divider {
    height: 3px;
    background: linear-gradient(to right, var(--solar-flame), var(--spark-stone));
}

/* Animações */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease-out;
    will-change: opacity, transform;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Textos e Gradientes */
.text-gradient {
    background: linear-gradient(to right, var(--solar-flame), var(--spark-stone));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block;
}

.bg-gradient-brand {
    background: linear-gradient(135deg, var(--solar-flame) 0%, var(--spark-stone) 100%);
}

/* Scroll Indicator */
.scroll-indicator {
    animation: bounce 2s infinite;
}
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-10px);}
    60% {transform: translateY(-5px);}
}