

@import '/estilo/tokens.css';

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;background:var(--papel);color:var(--tinta);
font-family:var(--sans);-webkit-font-smoothing:antialiased}


h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.035em;line-height:1.05}
h1{font-size:clamp(30px,4.6vw,46px)}
h2{font-size:clamp(22px,3vw,30px)}
h3{font-size:19px;letter-spacing:-.025em}
h4{font-size:15.5px;font-weight:600;letter-spacing:-.02em}
p{margin:0 0 var(--e3);font-size:15px;line-height:1.65;color:var(--sub)}
p b,strong{color:var(--tinta);font-weight:600}
a{color:var(--sordo)}


.ojo{margin:0 0 var(--e3);font-family:var(--mono);font-size:11px;
letter-spacing:.16em;text-transform:uppercase;color:var(--sordo);font-weight:500}
.ojo.tenue{color:var(--note)}

.nota{margin:var(--e2) 0 0;font-family:var(--mono);font-size:11px;
letter-spacing:.1em;text-transform:uppercase;color:var(--soft);line-height:1.5}
.sub{font-size:15.5px;line-height:1.65;color:var(--sub)}


.hoja{max-width:940px;margin:0 auto;padding:var(--e7) var(--e5) var(--e8)}
.hoja.ancha{max-width:1180px}
.cabeza{display:flex;justify-content:space-between;align-items:center;gap:var(--e4);
font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
color:var(--note);margin-bottom:var(--e7)}
.cabeza a,.cabeza button{color:var(--note);text-decoration:none;background:none;
border:0;font:inherit;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;padding:0}
.cabeza a:hover,.cabeza button:hover{color:var(--sordo)}

.cabeza > span:first-child{display:inline-block;width:109px;height:20px;
background:url('/marca/archivos/voluma-firma-bicolor.svg') left center/contain no-repeat;
font-size:0;color:transparent;line-height:0}
.cabeza > span:first-child .iso{display:none}
.cabeza .iso{width:16px;height:16px;color:var(--brasa);vertical-align:-3px;margin-right:8px}



.tarjeta{background:var(--papel);border-radius:var(--r3);padding:var(--e5);
box-shadow:var(--relieve);
transition:box-shadow var(--paso),transform var(--paso)}
.tarjeta.piel{background:var(--brasa-piel)}

a.tarjeta:hover,.tarjeta.viva:hover{box-shadow:var(--relieve-alto);
transform:translateY(-2px)}
a.tarjeta:active,.tarjeta.viva:active{transform:translateY(0);
box-shadow:var(--relieve)}

.lecho{background:var(--sup);border-radius:var(--r3);padding:var(--e5)}

.vidrio{background:rgba(255,255,255,.94);border-radius:var(--r4);
box-shadow:var(--vidrio-aro)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .vidrio{background:var(--vidrio);
  -webkit-backdrop-filter:var(--vidrio-borroso);
          backdrop-filter:var(--vidrio-borroso)}
}


.hundido{background:#EFEEEB;border-radius:var(--r4);box-shadow:var(--relieve-hondo);
border:0;color:var(--sub)}
.hundido:hover{background:#E9E8E4;color:var(--tinta)}
.rejilla{display:grid;gap:var(--e2)}
.rejilla.dos{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.rejilla.tres{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.rejilla.cifras{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}


.cifra{background:var(--papel);border-radius:var(--r3);padding:var(--e4) var(--e5);
box-shadow:var(--relieve)}
.cifra b{display:block;font-size:30px;font-weight:650;letter-spacing:-.035em;
line-height:1;margin-bottom:var(--e2);white-space:nowrap}
.cifra span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
text-transform:uppercase;color:var(--soft);line-height:1.4}
.cifra .ap{font-size:.72em;color:var(--sordo);vertical-align:.06em;margin-right:.04em}


.chip{display:inline-block;font-family:var(--mono);font-size:10.5px;
letter-spacing:.14em;text-transform:uppercase;color:var(--soft);
padding:.55em 1.1em;border:0;border-radius:var(--r4);background:var(--papel);
box-shadow:var(--relieve);text-decoration:none;white-space:nowrap;
transition:box-shadow var(--paso),transform var(--paso),color var(--paso)}
.chip:not(.solida):hover{color:var(--tinta);box-shadow:var(--relieve-alto);
transform:translateY(-1px)}
.chip.solida{background:var(--brasa);color:var(--franja-tinta);
box-shadow:0 0 0 1px rgba(20,20,22,.06),0 1px 2px rgba(176,61,12,.28),
0 8px 18px -6px rgba(255,90,31,.45),inset 0 1px 0 rgba(255,255,255,.28)}
.chip.solida:hover{transform:translateY(-1px);background:var(--brasa-alta);
box-shadow:0 0 0 1px rgba(20,20,22,.08),0 2px 4px rgba(176,61,12,.3),
0 16px 30px -8px rgba(255,90,31,.55),inset 0 1px 0 rgba(255,255,255,.34)}
.chips{display:flex;flex-wrap:wrap;gap:var(--e2)}


.btn{display:inline-block;font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;
text-transform:uppercase;font-weight:500;text-align:center;text-decoration:none;
padding:var(--e4) var(--e6);border-radius:var(--r4);cursor:pointer;
border:0;background:var(--brasa);color:var(--franja-tinta);
box-shadow:0 0 0 1px rgba(20,20,22,.06),0 1px 2px rgba(176,61,12,.28),
0 8px 18px -6px rgba(255,90,31,.45),inset 0 1px 0 rgba(255,255,255,.28);
transition:box-shadow var(--paso),transform var(--paso),background var(--paso)}

.btn:hover{background:var(--brasa-alta);transform:translateY(-1px);
box-shadow:0 0 0 1px rgba(20,20,22,.07),0 2px 4px rgba(176,61,12,.26),
0 16px 32px -8px rgba(255,90,31,.62),inset 0 1px 0 rgba(255,255,255,.38)}
.btn:active{transform:translateY(0);background:var(--brasa);
box-shadow:0 0 0 1px rgba(20,20,22,.09),0 1px 2px rgba(176,61,12,.2),
inset 0 2px 5px rgba(120,40,8,.26)}
.btn:disabled{opacity:.35;cursor:not-allowed}
.btn.fantasma{background:transparent;color:var(--sordo)}
.btn.fantasma:hover{background:var(--brasa-piel);color:var(--sordo)}
.btn.ancho{display:block;width:100%}


label{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
text-transform:uppercase;color:var(--soft);margin-bottom:var(--e2)}
input,textarea,select{display:block;width:100%;font-family:var(--mono);font-size:15px;
padding:var(--e3) var(--e4);background:var(--papel);border:1px solid var(--linea-fuerte);
border-radius:var(--r1);color:var(--tinta);margin-bottom:var(--e4)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--brasa)}
input::placeholder,textarea::placeholder{color:var(--apagado)}
textarea{min-height:190px;resize:vertical;line-height:1.55;font-size:13.5px}
.err{margin:var(--e2) 0 0;font-family:var(--mono);font-size:12px;color:var(--alerta);min-height:16px}


table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
text-transform:uppercase;color:var(--note);font-weight:500;
padding:0 var(--e3) var(--e2) 0;border-bottom:1px solid var(--linea)}
td{padding:10px var(--e3) 10px 0;border-bottom:1px solid var(--linea);vertical-align:top}
td b{font-weight:600}
td.m,.m{font-family:var(--mono);font-size:12.5px;color:var(--soft)}
td:last-child.der,th:last-child.der{text-align:right;padding-right:0;white-space:nowrap}


a.liga{display:flex;align-items:baseline;gap:var(--e3);text-decoration:none;
color:var(--tinta);padding:var(--e3) var(--e4);border-radius:var(--r2);
background:var(--papel);margin-bottom:6px;box-shadow:var(--relieve);
transition:box-shadow var(--paso),transform var(--paso);
transition:background .15s,color .15s}
a.liga:hover{background:var(--papel);box-shadow:var(--relieve-alto);
transform:translateY(-1px)}
a.liga:active{transform:translateY(0);box-shadow:var(--relieve)}
a.liga b{font-weight:600;font-size:14.5px}
a.liga i{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--soft);
margin-left:auto;text-align:right;letter-spacing:.04em}



.franja{background:var(--brasa);color:var(--franja-tinta);border-radius:var(--r3);
padding:var(--e6);
box-shadow:0 0 0 1px rgba(20,20,22,.05),0 2px 5px rgba(176,61,12,.20),
0 20px 44px -14px rgba(255,90,31,.42),inset 0 1px 0 rgba(255,255,255,.24)}
.franja .ojo,.franja a{color:var(--franja-tinta)}
.franja p{color:rgba(20,10,6,.78)}
.franja .chip{background:rgba(255,255,255,.22);color:rgba(20,10,6,.82);
box-shadow:inset 0 0 0 1px rgba(20,10,6,.16)}
.franja .chip:not(.solida):hover{background:rgba(255,255,255,.34);
color:var(--franja-tinta);transform:none}


.duros{background:var(--papel);border-radius:var(--r3);padding:var(--e2) var(--e5);
box-shadow:var(--relieve)}
.duros div{display:flex;gap:var(--e5);padding:var(--e3) 0;border-top:1px solid var(--linea)}
.duros div:first-child{border-top:0}
.duros span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
text-transform:uppercase;color:var(--soft);flex:0 0 118px;padding-top:3px}
.duros p{margin:0;font-size:14.5px;line-height:1.5;color:var(--tinta)}


.seccion{margin-top:var(--e8)}
.seccion > .ojo{border-top:1px solid var(--linea);padding-top:var(--e4)}

@media (max-width:560px){
  .hoja{padding:var(--e5) var(--e4) var(--e8)}
  a.liga{flex-wrap:wrap;gap:var(--e1)}
  a.liga i{margin-left:0;width:100%;text-align:left}
  .duros div{flex-direction:column;gap:var(--e1)}
  .duros span{flex:none}
  .franja{padding:var(--e5)}
}
