/* =========================================================
   DETALLE DE DIVISIONES
   ========================================================= */

.division-page{
    position:relative;
    color:var(--cream);
    max-width:1180px;
    margin:0 auto;
    padding:0 40px 120px 40px;
    overflow-x:hidden;
}

.division-page::before{
    content:"";
    position:absolute;
    top:-180px;
    right:-160px;
    width:520px;
    height:520px;
    background:radial-gradient(circle, var(--orange) 0%, var(--maroon) 55%, transparent 75%);
    opacity:.1;
    filter:blur(42px);
    border-radius:50%;
    pointer-events:none;
    z-index:0;
}

.division-page > *{ position:relative; z-index:1; }

.division-page__intro{
    padding:64px 0 20px;
    max-width:860px;
}

.division-page__intro h1{
    font-family:var(--display);
    font-size:clamp(2.2rem, 4.7vw, 3.4rem);
    line-height:1.12;
    margin:18px 0 18px;
    text-transform:uppercase;
}

.division-page__intro h1 .grad{
    background:linear-gradient(100deg, var(--orange-light), var(--orange) 45%, var(--red) 90%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.division-page__intro p{
    font-family:var(--body);
    font-size:1.02rem;
    line-height:1.75;
    color:var(--muted);
    max-width:760px;
}

.division-hero{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:28px;
    align-items:stretch;
    margin:18px 0 40px;
}

.division-hero__media{
    position:relative;
    min-height:320px;
    border-radius:16px;
    overflow:hidden;
    border:1px solid var(--panel-border);
    background:var(--panel);
}

.division-hero__img{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    filter:grayscale(35%) contrast(1.05) brightness(.88);
}

.division-hero__tint{
    position:absolute;
    inset:0;
    background:linear-gradient(160deg, rgba(124,34,56,.78), rgba(209,75,44,.45));
}

.division-hero__shade{
    position:absolute;
    inset:0;
    background:linear-gradient(to top, rgba(8,6,7,.74) 10%, rgba(8,6,7,.08) 60%, transparent);
}

.division-hero__badge{
    position:absolute;
    left:22px;
    bottom:20px;
    z-index:1;
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-family:var(--mono);
    font-size:.76rem;
    letter-spacing:2px;
    text-transform:uppercase;
    color:var(--cream);
    background:rgba(8,6,7,.48);
    border:1px solid rgba(246,241,234,.2);
    border-radius:999px;
    padding:10px 14px;
}

.division-summary{
    background:var(--panel);
    border:1px solid var(--panel-border);
    border-radius:16px;
    padding:28px;
    display:grid;
    gap:18px;
}

.division-summary__block h2,
.division-section h2{
    font-family:var(--display);
    font-size:1.2rem;
    line-height:1.25;
    margin:0 0 12px;
    text-transform:uppercase;
}

.division-summary__block p,
.division-section p,
.division-section li{
    font-family:var(--body);
    line-height:1.7;
    color:var(--muted);
}

.division-chip-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.division-chip{
    display:inline-flex;
    align-items:center;
    padding:9px 14px;
    border-radius:999px;
    border:1px solid var(--panel-border);
    background:rgba(255,255,255,.03);
    font-family:var(--mono);
    font-size:.72rem;
    letter-spacing:1px;
    text-transform:uppercase;
    color:var(--cream);
}

.division-layout{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:28px;
}

.division-column{
    display:grid;
    gap:24px;
}

.division-section{
    background:var(--panel);
    border:1px solid var(--panel-border);
    border-radius:16px;
    padding:28px;
}

.division-section ul{
    margin:0;
    padding-left:18px;
    display:grid;
    gap:10px;
}

.division-placeholder{
    margin-top:14px;
    padding:18px 18px 16px;
    border:1px dashed rgba(224,134,92,.35);
    border-radius:12px;
    background:rgba(255,255,255,.02);
}

.division-placeholder strong{
    display:block;
    margin-bottom:8px;
    font-family:var(--mono);
    font-size:.76rem;
    letter-spacing:1.5px;
    text-transform:uppercase;
    color:var(--orange-light);
}

.division-cta{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:8px;
}

.division-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:13px 22px;
    border-radius:8px;
    text-decoration:none;
    font-family:var(--body);
    font-weight:700;
    transition:transform .3s ease, gap .3s ease;
}

.division-btn--primary{
    color:var(--maroon);
    background:var(--cream);
}

.division-btn--secondary{
    color:var(--cream);
    border:1px solid rgba(246,241,234,.35);
    background:transparent;
}

.division-btn:hover{
    transform:translateY(-2px);
    gap:14px;
}

@media (max-width: 980px){
    .division-hero,
    .division-layout{
        grid-template-columns:1fr;
    }
}

@media (max-width: 760px){
    .division-page{
        padding:0 20px 80px 20px;
    }

    .division-page__intro{
        padding-top:44px;
    }

    .division-hero__media{
        min-height:240px;
    }

    .division-summary,
    .division-section{
        padding:22px;
    }
}
