:root {
    --ar-graphite: #171a1d;
    --ar-graphite-soft: #252a2e;
    --ar-red: #d32f2f;
    --ar-red-dark: #a92222;
    --ar-steel: #73787d;
    --ar-steel-strong: #4f575e;
    --ar-off-white: #f4f1ea;
    --ar-surface: #ffffff;
    --ar-line: #dfe1e2;
}

body {
    background: #f3f3f1;
    color: var(--ar-graphite);
    font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}

h1, h2, h3, h4, h5, h6, .navbar-brand {
    font-family: "Barlow Condensed", Inter, sans-serif;
}

.site-navbar {
    background: var(--ar-graphite);
    border-bottom: .25rem solid var(--ar-red);
}

.site-logo { width: min(18rem, 62vw); height: auto; display: block; }
.site-navbar .btn { border-color: #777e83; color: #fff; }
.site-navbar .btn:hover { background: #fff; border-color: #fff; color: var(--ar-graphite); }

.btn-marca {
    --bs-btn-bg: var(--ar-red);
    --bs-btn-border-color: var(--ar-red);
    --bs-btn-hover-bg: var(--ar-red-dark);
    --bs-btn-hover-border-color: var(--ar-red-dark);
    --bs-btn-active-bg: var(--ar-red-dark);
    --bs-btn-active-border-color: var(--ar-red-dark);
    color: #fff;
    font-weight: 700;
}

.btn-outline-marca {
    --bs-btn-color: var(--ar-graphite);
    --bs-btn-border-color: var(--ar-steel);
    --bs-btn-hover-bg: var(--ar-graphite);
    --bs-btn-hover-border-color: var(--ar-graphite);
    --bs-btn-hover-color: #fff;
    font-weight: 700;
}

.texto-marca { color: var(--ar-red) !important; }
.fundo-marca-clara { background: #f5e9e7 !important; }
.card { border-radius: .55rem; }
.form-control, .form-select { min-height: 3rem; border-radius: .35rem; }
textarea.form-control { min-height: auto; }
.form-control:focus, .form-select:focus { border-color: var(--ar-red); box-shadow: 0 0 0 .2rem rgb(211 47 47 / 14%); }
.form-check-input:checked { background-color: var(--ar-red); border-color: var(--ar-red); }

.brand-eyebrow {
    color: var(--ar-red);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.hero-auto-risco { position: relative; isolation: isolate; background: var(--ar-off-white); overflow: hidden; }
.hero-auto-risco > .container { position: relative; z-index: 1; }
.hero-auto-risco::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0 0 0 auto;
    width: 46%;
    background: var(--ar-steel-strong);
    clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%);
}
.hero-title { font-size: clamp(3.5rem, 8vw, 7.2rem); font-weight: 800; letter-spacing: -.035em; line-height: .88; text-transform: uppercase; }
.hero-title span { color: var(--ar-red); }
.hero-showcase {
    position: relative;
    min-height: 27rem;
    margin-right: -2.5rem;
    animation: hero-showcase-enter .8s cubic-bezier(.2, .8, .2, 1) both;
}
.hero-frame {
    position: absolute;
    inset: 9% -12% 9% -3%;
    overflow: hidden;
    background: var(--ar-graphite);
    clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
}
.hero-slide {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity .8s ease, visibility .8s ease;
}
.hero-slide.is-active { opacity: 1; visibility: visible; }
.hero-slide-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgb(23 26 29 / 14%), transparent 48%, rgb(23 26 29 / 8%));
}
.hero-slide-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1.015);
    transition: transform 7s ease;
}
.hero-slide-photo.is-active img { transform: scale(1.035); }
.hero-slide-photo figcaption {
    position: absolute;
    z-index: 2;
    left: 12%;
    bottom: 1.5rem;
    padding: .45rem .7rem;
    border-left: .2rem solid var(--ar-red);
    background: rgb(23 26 29 / 78%);
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.hero-slide-brand {
    display: grid;
    place-items: center;
    background: radial-gradient(circle at 55% 45%, #252a2e 0, var(--ar-graphite) 58%);
}
.hero-slide-brand::after {
    content: "";
    position: absolute;
    inset: auto 12% 18% 20%;
    height: .2rem;
    background: var(--ar-red);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .8s .25s ease;
}
.hero-slide-brand.is-active::after { transform: scaleX(1); }
.hero-symbol {
    position: relative;
    width: min(20rem, 68vw);
    opacity: 0;
    transform: translateX(1.5rem) scale(.96);
    filter: drop-shadow(0 1.5rem 1.5rem rgb(0 0 0 / 20%));
    transition: opacity .7s ease, transform .8s cubic-bezier(.2, .8, .2, 1);
}
.hero-slide-brand.is-active .hero-symbol { opacity: 1; transform: none; }
.hero-slide-brand span {
    position: absolute;
    left: 20%;
    bottom: 10%;
    color: #c6c9ca;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
}
.hero-showcase-controls {
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: 11%;
    display: flex;
    align-items: center;
    gap: .45rem;
}
.hero-dot {
    width: .65rem;
    height: .65rem;
    padding: 0;
    border: 1px solid #fff;
    border-radius: 50%;
    background: transparent;
}
.hero-dot.is-active { background: var(--ar-red); border-color: var(--ar-red); }
.hero-dot:focus-visible, .hero-pause:focus-visible { outline: .15rem solid #fff; outline-offset: .2rem; }
.hero-pause {
    margin-left: .25rem;
    padding: .25rem .55rem;
    border: 1px solid rgb(255 255 255 / 55%);
    border-radius: .2rem;
    background: rgb(23 26 29 / 68%);
    color: #fff;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}
@keyframes hero-showcase-enter {
    from { opacity: 0; transform: translateX(2.5rem); }
    to { opacity: 1; transform: none; }
}
.service-number { color: var(--ar-red); font: 800 1rem "Barlow Condensed", sans-serif; letter-spacing: .12em; }
.service-card { border-top: .2rem solid var(--ar-graphite) !important; transition: transform .2s ease, border-color .2s ease; }
.service-card:hover { border-color: var(--ar-red) !important; transform: translateY(-3px); }
.process-section { background: var(--ar-graphite); color: #fff; }
.process-step { border-left: .15rem solid var(--ar-red); padding-left: 1rem; }
.site-footer { background: #111315; color: #bfc2c3; }
.site-footer a { color: #d9dbdc; }

@media (max-width: 991.98px) {
    .hero-auto-risco::before { display: none; }
    .hero-showcase { min-height: 15rem; margin: 1rem -1.5rem -1rem; }
    .hero-frame { inset: 0; clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%); }
    .hero-showcase-controls { right: 4%; bottom: 4%; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-showcase { animation: none; }
    .hero-slide, .hero-slide-photo img, .hero-symbol, .hero-slide-brand::after { transition: none; }
    .hero-slide-photo.is-active img { transform: scale(1.015); }
}

@media print {
    body { background: #fff; }
}
