/* Un archivo de identidades; cada proyecto mantiene sus colores originales. */
.br-archive { min-width:0; }
.br-archive-topline { display:flex; justify-content:space-between; align-items:baseline; gap:25px; margin-bottom:31px; padding:0 0 19px; border-bottom:1px solid rgba(255,246,224,.18); }
.br-archive-topline p { margin:0; color:rgba(255,246,224,.62); font:500 10px/1.6 var(--font-body); letter-spacing:.1em; text-transform:uppercase; }
.br-archive-topline p>span { margin-right:18px; color:var(--amber); font-size:17px; font-weight:400; letter-spacing:-.03em; }
.br-archive-topline>span { color:#aaa4b3; font:400 11px/1.6 var(--font-body); }
.br-archive-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:46px 29px; align-items:start; }
.br-archive-card { min-width:0; }
.br-archive-card:first-child { grid-column:span 2; }
.br-archive-link { display:block; min-width:0; color:var(--cream); text-decoration:none; }
.br-archive-media { position:relative; display:block; height:clamp(260px,24vw,350px); min-width:0; overflow:hidden; border:1px solid rgba(255,246,224,.14); background:#111015; }
.br-archive-card:nth-child(-n+2) .br-archive-media { height:clamp(330px,29vw,430px); }
.br-archive-media[data-surface="light"],.br-archive-image[data-surface="light"] { background:#f5f3ee; }
.br-archive-image { display:block; width:100%; height:100%; object-fit:contain; }
.br-archive-image--cover { transition:opacity .5s; }
.br-archive-image--preview { position:absolute; inset:0; opacity:0; background:#111015; transition:opacity .5s; }
.br-archive-media::after { content:""; position:absolute; z-index:3; inset:auto 0 0; height:2px; background:linear-gradient(100deg,var(--blue),var(--violet),var(--pink),var(--orange),var(--amber)); transform:scaleX(0); transform-origin:left; transition:transform .4s; pointer-events:none; }
.br-archive-index { position:absolute; z-index:2; left:15px; top:15px; padding:5px 7px; color:rgba(255,246,224,.65); background:#100d17; font:500 8px/1.5 var(--font-body); letter-spacing:.1em; }
.br-archive-open { position:absolute; z-index:2; right:16px; bottom:16px; display:grid; place-items:center; width:39px; height:39px; border:1px solid rgba(255,246,224,.36); border-radius:50%; color:var(--cream); background:#100d17; font:400 23px/1 var(--font-body); transition:color .25s,border-color .25s,transform .25s; }
.br-archive-caption { padding-top:21px; }
.br-archive-category { margin:0 0 10px; color:#aaa4b3; font:500 8px/1.6 var(--font-body); letter-spacing:.14em; text-transform:uppercase; }
.branding-page .br-archive-caption h3 { margin:0 0 12px; color:var(--cream); font-family:var(--font-title); font-size:clamp(18px,1.45vw,26px); font-weight:900; line-height:1.25; letter-spacing:-.015em; text-transform:uppercase; overflow-wrap:anywhere; transition:color .25s; }
.br-archive-summary { max-width:570px; margin:0 0 20px; color:rgba(255,246,224,.6); font:400 12px/1.8 var(--font-body); }
.br-archive-meta { display:flex; justify-content:space-between; align-items:center; gap:18px; min-height:38px; padding-top:14px; border-top:1px solid rgba(255,246,224,.13); color:#aaa4b3; font:500 9px/1.6 var(--font-body); }
.br-archive-meta>span:last-child { display:inline-flex; align-items:center; gap:18px; color:var(--cream); }
.br-archive-meta b { color:var(--amber); font-size:16px; line-height:1; font-weight:400; }
.br-archive-link:focus-visible { outline:3px solid var(--amber); outline-offset:7px; }
.br-archive-link:focus-visible .br-archive-image--preview { opacity:1; }
.br-archive-link:focus-visible .br-archive-media::after { transform:scaleX(1); }
.br-archive-link:focus-visible .br-archive-open { color:var(--amber); border-color:var(--amber); transform:translate(2px,-2px); }
@media (hover:hover) and (pointer:fine) {
 .br-archive-link:hover .br-archive-image--preview { opacity:1; }
 .br-archive-link:hover .br-archive-media::after { transform:scaleX(1); }
 .br-archive-link:hover .br-archive-open { color:var(--amber); border-color:var(--amber); transform:translate(2px,-2px); }
 .br-archive-link:hover h3 { color:var(--amber); }
}
@media (max-width:1050px) {
 .br-archive-grid { gap:39px 23px; }
 .br-archive-media { height:270px; }
 .br-archive-card:nth-child(-n+2) .br-archive-media { height:345px; }
 .br-archive-caption { padding-top:19px; }.br-archive-summary { font-size:11px; }
 .br-archive-meta { font-size:8px; gap:11px; }.br-archive-meta>span:last-child { gap:11px; }
}
@media (max-width:820px) {
 .br-archive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px 22px; }
 .br-archive-card:first-child { grid-column:1/-1; }
 .br-archive-media { height:315px; }
 .br-archive-card:nth-child(-n+2) .br-archive-media { height:315px; }
 .br-archive-card:first-child .br-archive-media { height:390px; }
 .br-archive-topline { margin-bottom:25px; gap:20px; }.br-archive-topline>span { font-size:10px; }
 .branding-page .br-archive-caption h3 { font-size:clamp(18px,2.6vw,24px); }.br-archive-summary { font-size:12px; }
}
@media (max-width:520px) {
 .br-archive-grid { grid-template-columns:1fr; gap:36px; }
 .br-archive-card:first-child { grid-column:auto; }
 .br-archive-media,.br-archive-card:nth-child(-n+2) .br-archive-media,.br-archive-card:first-child .br-archive-media { height:auto; aspect-ratio:1.12; }
 .br-archive-topline { align-items:baseline; gap:15px; padding-bottom:16px; }
 .br-archive-topline p { font-size:8px; letter-spacing:.06em; }.br-archive-topline p>span { margin-right:10px; font-size:17px; }.br-archive-topline>span { max-width:100px; font-size:9px; text-align:right; }
 .br-archive-index { left:13px; top:13px; }.br-archive-open { right:13px; bottom:13px; width:38px; height:38px; }
 .br-archive-caption { padding-top:20px; }.branding-page .br-archive-caption h3 { font-size:clamp(17px,4.4vw,22px); }.br-archive-category { font-size:8px; }
 .br-archive-summary { font-size:12px; line-height:1.8; margin-bottom:17px; }.br-archive-meta { font-size:9px; min-height:42px; }
}
@media (prefers-reduced-motion:reduce) {
 .br-archive-image--cover,.br-archive-image--preview,.br-archive-media::after,.br-archive-open,.branding-page .br-archive-caption h3 { transition:none; }
 .br-archive-link:hover .br-archive-open,.br-archive-link:focus-visible .br-archive-open { transform:none; }
}

/* Tableros de marca: varias piezas y todos los colores visibles, también sin hover. */
.br-archive-media--system { display:flex; flex-direction:column; background:#17151b; }
.br-archive-board { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(0,1fr); grid-template-rows:repeat(2,minmax(0,1fr)); flex:1; min-height:0; min-width:0; gap:3px; background:#24212a; }
.br-archive-board__piece { min-width:0; min-height:0; overflow:hidden; background:#15131b; }
.br-archive-board__piece[data-surface="light"] { background:#f6f4ee; }
.br-archive-board__piece--1 { grid-row:1 / 3; }
.br-archive-board__piece img { display:block; width:100%; height:100%; object-fit:contain; transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.br-archive-board[data-pieces="2"] .br-archive-board__piece--2 { grid-row:1 / 3; }
.br-archive-board[data-pieces="1"] { grid-template-columns:1fr; }
.br-archive-colors { display:flex; flex:none; height:20px; border-top:3px solid #17151b; }
.br-archive-colors>span { flex:1; min-width:0; background:var(--swatch); }
.br-archive-media--system::after { display:none; }
.br-archive-media--system .br-archive-open { bottom:31px; width:34px; height:34px; }
.br-archive-card:first-child .br-archive-board { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); }
.br-archive-link:focus-visible .br-archive-board__piece img { transform:none; }
@media (hover:hover) and (pointer:fine) { .br-archive-link:hover .br-archive-board__piece img { transform:none; } }
@media (max-width:520px) {
 .br-archive-media--system,.br-archive-card:nth-child(-n+2) .br-archive-media--system,.br-archive-card:first-child .br-archive-media--system { height:320px; aspect-ratio:auto; }
 .br-archive-card:first-child .br-archive-board { grid-template-columns:minmax(0,1.18fr) minmax(0,1fr); }
 .br-archive-colors { height:19px; }
}
@media (prefers-reduced-motion:reduce) { .br-archive-board__piece img { transition:none; }.br-archive-link:hover .br-archive-board__piece img,.br-archive-link:focus-visible .br-archive-board__piece img { transform:none; } }
/* Las dos primeras marcas reciben el mismo espacio para leer el sistema completo. */
.br-archive-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
.br-archive-card { grid-column:span 2; }
.br-archive-card:nth-child(-n+2) { grid-column:span 3; }
@media (max-width:820px) {
 .br-archive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .br-archive-card { grid-column:span 1; }
 .br-archive-card:nth-child(-n+2) { grid-column:1 / -1; }
}
@media (max-width:520px) {
 .br-archive-grid { grid-template-columns:1fr; }
 .br-archive-card,.br-archive-card:nth-child(-n+2) { grid-column:auto; }
}

.br-archive-gradient { display:block; flex:none; height:12px; }

.br-archive-board__piece:not(.br-archive-board__piece--1)>img { padding:8px; box-sizing:border-box; }
