:root,
[data-theme="feagro"] {
    color-scheme: dark;
    --p: 38 62% 58%;
    --pf: 38 62% 50%;
    --pc: 24 28% 10%;
    --s: 22 57% 41%;
    --sc: 34 53% 92%;
    --a: 40 75% 72%;
    --ac: 24 28% 10%;
    --n: 24 28% 8%;
    --nc: 34 53% 92%;
    --b1: 24 28% 10%;
    --b2: 25 25% 8%;
    --b3: 25 22% 6%;
    --bc: 34 53% 92%;
    --in: 38 62% 58%;
    --su: 142 45% 45%;
    --wa: 38 80% 55%;
    --er: 4 70% 55%;
    --rounded-box: 1rem;
    --rounded-btn: .7rem;
    --rounded-badge: 1.9rem;
}

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }

::selection {
    background: rgba(220, 165, 74, .35);
    color: #fff8eb;
}

.site-shell {
    background:
        radial-gradient(circle at 8% 20%, rgba(166, 95, 45, .14), transparent 28rem),
        radial-gradient(circle at 90% 55%, rgba(220, 165, 74, .08), transparent 30rem),
        #17110d;
}

.font-display { letter-spacing: .025em; }

.nav-link {
    position: relative;
    border-radius: .6rem;
    padding: .7rem .85rem;
    color: rgba(255, 255, 255, .7);
    font-size: .9rem;
    font-weight: 600;
    transition: color .2s, background .2s;
}

.nav-link:hover,
.nav-link.active {
    background: rgba(255, 255, 255, .06);
    color: #f5ead8;
}

.nav-link.active::after {
    position: absolute;
    right: .85rem;
    bottom: .35rem;
    left: .85rem;
    height: 1px;
    content: "";
    background: #dca54a;
}

.mobile-link {
    display: block;
    border-radius: .65rem;
    padding: .8rem 1rem;
    color: rgba(255, 255, 255, .75);
    font-weight: 600;
}

.btn-country {
    display: inline-flex;
    min-height: 2.9rem;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    border: 1px solid rgba(255, 222, 164, .25);
    border-radius: .7rem;
    padding: .72rem 1.2rem;
    background: linear-gradient(135deg, #e4b45c, #b76b32);
    color: #1b1009;
    font-weight: 800;
    box-shadow: 0 9px 30px rgba(166, 95, 45, .22), inset 0 1px rgba(255, 255, 255, .25);
    transition: transform .2s, filter .2s, box-shadow .2s;
}

.btn-country:hover {
    filter: brightness(1.08);
    transform: translateY(-2px);
    box-shadow: 0 12px 35px rgba(166, 95, 45, .34), inset 0 1px rgba(255, 255, 255, .25);
}

.btn-country:active { transform: translateY(0); }
.btn-country:disabled { cursor: not-allowed; filter: grayscale(.65); opacity: .55; transform: none; }

.hero-bg {
    background-image:
        linear-gradient(90deg, rgba(18, 13, 9, .96) 0%, rgba(18, 13, 9, .78) 47%, rgba(18, 13, 9, .42) 100%),
        linear-gradient(0deg, #17110d 0%, transparent 25%),
        url("../../img/fundo.png");
    background-position: center;
    background-size: cover;
}

.hero-grain,
.page-grain {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .17;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E");
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    color: #dca54a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .22em;
    text-transform: uppercase;
}

.eyebrow::before {
    width: 2rem;
    height: 1px;
    content: "";
    background: currentColor;
}

.western-card {
    border: 1px solid rgba(220, 165, 74, .16);
    background: linear-gradient(145deg, rgba(46, 33, 24, .78), rgba(25, 18, 13, .88));
    box-shadow: 0 24px 60px rgba(0, 0, 0, .22);
    backdrop-filter: blur(12px);
}

.western-card::before {
    position: absolute;
    inset: .45rem;
    border: 1px solid rgba(220, 165, 74, .08);
    border-radius: .8rem;
    content: "";
    pointer-events: none;
}

.icon-box {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    border: 1px solid rgba(220, 165, 74, .2);
    border-radius: .8rem;
    background: rgba(220, 165, 74, .09);
    color: #e3b25a;
}

.progress-step {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
}

.progress-step:not(:last-child)::after {
    position: absolute;
    top: 1.5rem;
    left: calc(50% + 2.25rem);
    width: calc(100% - 4.5rem);
    height: 1px;
    content: "";
    background: linear-gradient(90deg, rgba(220, 165, 74, .45), rgba(220, 165, 74, .08));
}

.field-label {
    display: block;
    margin-bottom: .45rem;
    color: rgba(245, 234, 216, .86);
    font-size: .86rem;
    font-weight: 700;
}

.field-help {
    margin-top: .4rem;
    color: rgba(245, 234, 216, .45);
    font-size: .75rem;
}

.form-input,
.form-file {
    width: 100%;
    min-height: 3.25rem;
    border: 1px solid rgba(245, 234, 216, .13);
    border-radius: .7rem;
    outline: none;
    background: rgba(9, 7, 5, .48);
    color: #f5ead8;
    transition: border-color .2s, box-shadow .2s, background .2s;
}

.form-input { padding: .75rem 1rem; }
.form-input::placeholder { color: rgba(245, 234, 216, .28); }
.form-input:focus,
.form-file:focus {
    border-color: rgba(220, 165, 74, .7);
    background: rgba(9, 7, 5, .66);
    box-shadow: 0 0 0 3px rgba(220, 165, 74, .11);
}

.form-file {
    padding: .45rem;
    font-size: .82rem;
    color: rgba(245, 234, 216, .6);
}

.form-file::file-selector-button {
    margin-right: .75rem;
    border: 0;
    border-radius: .5rem;
    padding: .62rem .85rem;
    background: rgba(220, 165, 74, .14);
    color: #eac57f;
    font-weight: 700;
    cursor: pointer;
}

.section-number {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(220, 165, 74, .3);
    border-radius: 999px;
    background: rgba(220, 165, 74, .1);
    color: #e4b45c;
    font-size: .75rem;
    font-weight: 800;
}

.reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .65s ease, transform .65s ease;
}
.reveal.is-visible { opacity: 1; transform: none; }

@keyframes float {
    0%, 100% { transform: translateY(0) rotate(-1deg); }
    50% { transform: translateY(-10px) rotate(1deg); }
}
.logo-float { animation: float 6s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    .reveal { opacity: 1; transform: none; }
}

@media (max-width: 767px) {
    .hero-bg {
        background-image:
            linear-gradient(0deg, #17110d 0%, rgba(18, 13, 9, .86) 46%, rgba(18, 13, 9, .62) 100%),
            url("../../img/fundo.png");
        background-position: 58% center;
    }
    .progress-step:not(:last-child)::after {
        left: calc(50% + 1.8rem);
        width: calc(100% - 3.6rem);
    }
}
